:root{
  --bg:#f4efeb; --card:#ffffff; --ink:#26201c; --muted:#6f6159; --line:#e0d6cd;
  --accent:#8a4030; --accent-bg:#f4e5df;     /* bees app = earthy red-brown */
  --lamb:#2f7d52; --lamb-bg:#e3f3ea;         /* tile accents */
  --weeg:#8a4030; --weeg-bg:#f4e5df;
  --akt:#9a6a14;  --akt-bg:#f6edda;
  --gesond:#a33232; --gesond-bg:#fbe9e9;
  --ok:#1aa64b; --warn:#9a6a14; --err:#a33232;
  /* litter-type palette (een/twee/+) — distinct from the live/dead green/red */
  --t1:#2563a8; --t2:#d98a17; --t3:#7a4fa3; --t4:#1f9e8a;
  /* season buckets: main calving season (accent family) + buite-seisoen amber */
  --g-seisoen:#8a4030; --g-buite:#b58a00;
}
.kleur-seisoen{--c:var(--g-seisoen);} .kleur-buite{--c:var(--g-buite);}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.tile:active,.tile-wide:active,.key:active,.btn-wide:active,.primary:active,.seg button:active,.qbtn:active{filter:brightness(.94);}
html,body{margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-size:16px;line-height:1.4;}
#bar{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;
  padding:12px 16px;background:var(--accent);color:#fff;}
#title{font-size:18px;font-weight:700;letter-spacing:.01em;}
#bar-right{display:flex;align-items:center;gap:10px;}
.who{font-size:12px;opacity:.9;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#net{font-size:12px;padding:3px 9px;border-radius:8px;background:rgba(255,255,255,.18);color:#fff;}
#net.off{background:rgba(0,0,0,.18);}
.light{display:inline-block;width:13px;height:13px;border-radius:50%;border:1px solid rgba(255,255,255,.5);}
.light.green{background:#7ee2a3;} .light.yellow{background:#ffd34d;} .light.red{background:#ff7a6b;}
#toast{position:fixed;left:50%;top:62px;transform:translateX(-50%);z-index:30;max-width:90%;
  padding:11px 16px;border-radius:12px;font-size:15px;font-weight:600;text-align:center;
  box-shadow:0 4px 16px rgba(0,0,0,.18);}
#toast.ok{background:var(--ok);color:#fff;} #toast.warn{background:var(--akt-bg);color:var(--akt);border:1px solid var(--akt);}
.screen{max-width:520px;margin:0 auto;padding:16px;}
.hidden{display:none;}
.muted{color:var(--muted);font-size:13px;}
.center{text-align:center;}
.err{color:var(--err);min-height:20px;}
h2{font-size:21px;font-weight:700;margin:6px 0 10px;}
.fld{display:block;margin:0 0 16px;}
.fld>span{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;}
input,select,textarea,.txt{width:100%;font-size:17px;padding:0 12px;
  border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font-family:inherit;}
input,select,.txt{height:48px;} textarea.txt{height:auto;padding:10px 12px;line-height:1.4;resize:vertical;}
button{font-family:inherit;cursor:pointer;}
.primary{width:100%;height:54px;font-size:17px;font-weight:700;border:none;border-radius:14px;
  background:var(--accent);color:#fff;margin-top:8px;}
.primary:disabled{opacity:.4;}
.link{background:none;border:none;color:var(--accent);font-size:15px;padding:6px 0;}
.btn-wide{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;
  font-size:16px;font-weight:600;border:1px dashed var(--accent);border-radius:14px;background:var(--accent-bg);
  color:var(--accent);margin-bottom:10px;}
/* home tiles */
#home-hi{font-size:15px;margin:2px 0 14px;}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  aspect-ratio:1/1;border:1px solid var(--line);border-radius:20px;background:var(--card);color:var(--ink);
  box-shadow:0 1px 3px rgba(0,0,0,.05);}
.tile-ico{font-size:46px;line-height:1;}
.tile-lbl{font-size:17px;font-weight:700;}
.tile.lamb{background:var(--lamb-bg);border-color:var(--lamb);} .tile.lamb .tile-lbl{color:var(--lamb);}
.tile.weeg{background:var(--weeg-bg);} .tile.akt{background:var(--akt-bg);} .tile.gesond{background:var(--gesond-bg);}
.tile:disabled{opacity:.55;}
.soon{position:absolute;top:8px;right:8px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  color:var(--muted);background:rgba(0,0,0,.05);padding:2px 7px;border-radius:8px;}
/* wide choice tiles (geboorte / vrek) */
.tile-wide{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:16px;margin-bottom:12px;
  border:1px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.05);}
.tile-wide.birth{background:var(--lamb-bg);border-color:var(--lamb);}
.tile-wide.death{background:var(--gesond-bg);border-color:var(--gesond);}
.tile-wide.dash{background:var(--weeg-bg);border-color:var(--weeg);}
.tile-wide.wean{background:var(--akt-bg);border-color:var(--akt);}
/* dashboard Lam/Speen view toggle */
.dtabs{display:inline-flex;gap:4px;background:var(--accent-bg);border-radius:12px;padding:4px;margin:2px 0 12px;}
.dtab{border:none;background:transparent;color:var(--accent);font-size:15px;font-weight:700;padding:7px 20px;border-radius:9px;}
.dtab.on{background:var(--accent);color:#fff;}
/* weaning lamb health toggle */
.seg.health button.on.gesond{background:var(--lamb-bg);color:var(--lamb);border-color:var(--lamb);}
.seg.health button.on.siek{background:var(--akt-bg);color:var(--akt);border-color:var(--akt);}
.tw-ico{font-size:38px;line-height:1;}
.tw-txt{display:flex;flex-direction:column;gap:2px;}
.tw-txt b{font-size:18px;} .tw-txt small{color:var(--muted);font-size:13px;}
.back-home,.back-lamb{display:inline-block;}
/* pin */
#pin-who{font-size:17px;font-weight:600;margin:18px 0 10px;}
#pin-dots{font-size:34px;letter-spacing:12px;height:42px;}
#keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:300px;margin:14px auto 0;}
.key{height:64px;font-size:26px;font-weight:500;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);}
/* birth — lamb cards */
.sub-h{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:4px 2px 10px;}
.lamb-card{border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:12px;background:var(--card);}
.lamb-card .lc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.lc-head b{font-size:15px;} .lc-rm{font-size:13px;color:var(--err);background:none;border:none;}
.seg{display:flex;gap:8px;margin-bottom:10px;}
.seg button{flex:1;height:46px;font-size:15px;font-weight:700;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--muted);}
.seg button.on{background:var(--accent-bg);color:var(--accent);border-color:var(--accent);}
.seg.alive button.on.yes{background:var(--lamb-bg);color:var(--lamb);border-color:var(--lamb);}
.seg.alive button.on.no{background:var(--gesond-bg);color:var(--gesond);border-color:var(--gesond);}
.lc-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;}
.lc-row label{font-size:12px;color:var(--muted);}
.lc-row input{height:46px;margin-top:4px;}
.lc-lbl{font-size:12px;color:var(--muted);margin-bottom:4px;}
/* quick cause chips */
.quick{display:flex;flex-wrap:wrap;gap:8px;margin:-8px 0 16px;}
.qbtn{height:38px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--card);
  font-size:14px;font-weight:600;color:var(--ink);}
.qbtn:active{background:var(--accent-bg);}
.qbtn.on{background:var(--accent);border-color:var(--accent);color:#fff;}
/* EID reader — bar chip + scan buttons */
.eid{border:none;background:rgba(255,255,255,.18);color:#fff;font-size:15px;line-height:1;
  width:30px;height:30px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;}
.eid.idle{opacity:.55;filter:grayscale(1);}
.eid.connecting,.eid.reconnecting{background:var(--akt);animation:eidpulse 1s infinite;}
.eid.connected{background:var(--ok);}
.scan-row{display:flex;gap:8px;align-items:stretch;}
.scan-row>input,.scan-row>.txt{flex:1;min-width:0;}
.scan-btn{flex:0 0 auto;width:48px;border:1px solid var(--accent);border-radius:12px;
  background:var(--accent-bg);color:var(--accent);font-size:20px;line-height:1;}
.lc-row .scan-btn{width:48px;height:46px;margin-top:4px;}
.scan-btn.armed{background:var(--accent);color:#fff;animation:eidpulse 1s infinite;}
input.scanned,.txt.scanned{border-color:var(--ok);background:var(--lamb-bg);
  transition:background .2s,border-color .2s;}
@keyframes eidpulse{0%,100%{opacity:1;}50%{opacity:.45;}}
.no-eid .eid,.no-eid .scan-btn{display:none;}
.no-eid .scan-row{display:block;}
/* create-ooi modal */
.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(16,28,38,.55);}
.modal.hidden{display:none;}
.modal-card{width:100%;max-width:420px;background:var(--card);border-radius:18px;padding:20px;
  box-shadow:0 12px 40px rgba(0,0,0,.25);}
.modal-card h3{margin:0 0 8px;color:var(--accent);}
/* lambing-group badge on the capture screens (date-driven; shows the group's own colour) */
.season-badge{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;
  padding:6px 11px;border-radius:10px;margin:-8px 0 16px;color:var(--c,var(--muted));
  border:1px solid var(--c,var(--line));background:var(--card);}
.season-badge::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--c,currentColor);}
.season-badge.hidden{display:none;}
/* dashboard — season chips + summary cards */
.seasons{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 10px;margin:6px 0 8px;-webkit-overflow-scrolling:touch;}
.season-chip{flex:0 0 auto;display:flex;align-items:center;gap:9px;min-width:96px;padding:9px 14px;
  border:1.5px solid var(--c,var(--line));border-radius:14px;background:var(--card);color:var(--c,var(--ink));
  font-size:15px;font-weight:700;line-height:1.2;text-align:left;white-space:nowrap;}
.season-chip::before{content:"";width:11px;height:11px;border-radius:50%;background:var(--c,var(--line));flex:0 0 auto;}
.season-chip .lbl{display:flex;flex-direction:column;}
.season-chip small{font-size:11px;font-weight:500;color:var(--muted);margin-top:2px;}
.season-chip .rng{font-size:10.5px;font-weight:600;color:var(--muted);margin-top:1px;}
.season-chip.sel .rng{color:rgba(255,255,255,.8);}
.season-chip.sel.kleur-buite .rng{color:rgba(0,0,0,.5);}
.season-chip.current{box-shadow:0 0 0 2px var(--card),0 0 0 3.5px var(--c,var(--accent));}
.season-chip.sel{background:var(--c,var(--accent));border-color:var(--c,var(--accent));color:#fff;}
.season-chip.sel::before{background:#fff;}
.season-chip.sel small{color:rgba(255,255,255,.85);}
.season-chip.sel.kleur-buite{color:#3a2e00;}                /* amber fill needs dark text */
.season-chip.sel.kleur-buite::before{background:#3a2e00;}
.season-chip.sel.kleur-buite small{color:rgba(0,0,0,.55);}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:2px 0 12px;}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:11px 12px;
  box-shadow:0 1px 3px rgba(0,0,0,.05);min-width:0;}
.kpi b{display:block;font-size:23px;font-weight:800;line-height:1.05;color:var(--accent);}
.kpi small{display:block;font-size:11.5px;font-weight:700;color:var(--ink);margin-top:4px;line-height:1.2;}
.kpi small .sub{display:block;font-weight:500;color:var(--muted);font-size:10.5px;margin-top:1px;}
.kpi.t2 b{color:var(--t2);} .kpi.t3 b{color:var(--t3);}
/* survival funnel card (trou tot speen) — the scoreboard */
.card.funnel{padding:6px 16px;}
.fn-row{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 0;border-top:1px solid var(--line);}
.fn-row:first-of-type{border-top:none;}
.fn-lbl{display:flex;flex-direction:column;font-size:15px;font-weight:600;color:var(--ink);}
.fn-lbl small{font-size:11px;font-weight:500;color:var(--muted);margin-top:1px;}
.fn-val{font-size:20px;font-weight:800;color:var(--ink);text-align:right;}
.fn-edit{width:88px;height:40px;padding:0 10px;text-align:right;font-size:20px;font-weight:800;
  color:var(--accent);background:var(--accent-bg);border:1.5px solid var(--accent);border-radius:10px;-moz-appearance:textfield;}
.fn-edit:focus{outline:none;box-shadow:0 0 0 3px rgba(138,64,48,.15);}
.fn-edit::-webkit-outer-spin-button,.fn-edit::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.fn-edit::placeholder{color:var(--accent);opacity:.4;}
.fn-row.edit .fn-lbl small{color:var(--accent);opacity:.8;}
.fn-row.head{border-top:2px solid var(--ink);margin-top:2px;}
.fn-row.head .fn-lbl{font-weight:800;}
.fn-row.head .fn-val b{font-size:27px;color:var(--lamb);}
/* cause-of-loss breakdown */
.cz-row{display:flex;align-items:center;gap:10px;padding:7px 0;}
.cz-lbl{flex:0 0 84px;font-size:14px;font-weight:600;}
.cz-bar{flex:1;height:12px;border-radius:6px;background:var(--gesond-bg);overflow:hidden;}
.cz-bar i{display:block;height:100%;background:var(--gesond);}
.cz-n{flex:0 0 auto;width:20px;text-align:right;font-size:15px;font-weight:800;}
.ld-card .ld{margin-top:2px;}
.dash-cards{display:flex;flex-direction:column;gap:12px;margin-top:4px;}
.card{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:14px 16px;box-shadow:0 1px 3px rgba(0,0,0,.05);}
.card h3{margin:0 0 8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);}
.stat-big{display:flex;align-items:baseline;gap:10px;}
.stat-big b{font-size:42px;font-weight:800;line-height:1;color:var(--accent);}
.stat-big span{font-size:14px;color:var(--muted);}
.ld{display:flex;gap:10px;}
.ld .pill{flex:1;border-radius:12px;padding:10px 12px;text-align:center;}
.ld .pill b{display:block;font-size:26px;font-weight:800;line-height:1.1;}
.ld .pill small{font-size:12px;font-weight:600;}
.ld .live{background:var(--lamb-bg);color:var(--lamb);}
.ld .dead{background:var(--gesond-bg);color:var(--gesond);}
.bar{height:12px;border-radius:6px;overflow:hidden;background:var(--gesond-bg);margin-top:12px;}
.bar i{display:block;height:100%;background:var(--lamb);}
.trow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 2px;border-top:1px solid var(--line);}
.trow:first-of-type{border-top:none;}
.tname{font-size:16px;font-weight:700;}
.tname small{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:1px;}
.tdot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle;}
.tdot.t1{background:var(--t1);} .tdot.t2{background:var(--t2);}
.tdot.t3{background:var(--t3);} .tdot.t4{background:var(--t4);}
.tw{text-align:right;}
.tw b{font-size:19px;font-weight:800;}
.tw small{display:block;font-size:11px;color:var(--muted);}
/* weight-distribution chart — stacked dots over a faint histogram */
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 2px 10px;}
.legend span{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);}
.legend i{width:11px;height:11px;border-radius:50%;}
.legend i.t1{background:var(--t1);} .legend i.t2{background:var(--t2);}
.legend i.t3{background:var(--t3);} .legend i.t4{background:var(--t4);}
.wchart{display:block;width:100%;height:auto;overflow:visible;}
.wchart .histbar{fill:var(--ink);opacity:.10;}
.wchart .axis,.wchart .tick{stroke:var(--line);stroke-width:1;}
.wchart .tlbl{fill:var(--muted);font-size:11px;font-family:inherit;}
.wchart .tlbl.unit{font-size:10px;font-weight:700;}
.wchart .dot{stroke:var(--card);stroke-width:1;}
.wchart .dot.t1{fill:var(--t1);} .wchart .dot.t2{fill:var(--t2);}
.wchart .dot.t3{fill:var(--t3);} .wchart .dot.t4{fill:var(--t4);}
/* ---------- Dier: soek ---------- */
.tile.dier{background:var(--accent-bg);border-color:var(--accent);} .tile.dier .tile-lbl{color:var(--accent);}
/* an odd number of tiles: the last one runs the full width instead of leaving a gap */
.tiles .tile:last-child:nth-child(odd){grid-column:span 2;aspect-ratio:auto;min-height:96px;flex-direction:row;gap:14px;}
.alist{display:flex;flex-direction:column;gap:8px;}
.arow{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:12px 14px;
  border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);}
.arow-tag{font-size:17px;font-weight:800;letter-spacing:.01em;}
.arow-meta{flex:1;min-width:0;font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.arow-st{flex:0 0 auto;font-size:11px;font-weight:700;color:var(--gesond);background:var(--gesond-bg);
  padding:3px 8px;border-radius:8px;}
/* ---------- Dier: bio ---------- */
.bio-head{padding:2px 2px 12px;}
.bio-tag{font-size:30px;font-weight:800;line-height:1.1;word-break:break-all;}
.bio-chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 6px;}
.chip{font-size:12px;font-weight:700;padding:4px 10px;border-radius:9px;
  background:var(--accent-bg);color:var(--accent);border:1px solid transparent;}
.chip.good{background:var(--lamb-bg);color:var(--lamb);}
.chip.bad{background:var(--gesond-bg);color:var(--gesond);}
.chip.groep{background:var(--card);color:var(--c,var(--muted));border-color:var(--c,var(--line));}
.bio-sub{font-size:13px;color:var(--muted);}
.sick-banner,.dead-banner,.warn-banner{display:flex;flex-direction:column;padding:11px 14px;
  border-radius:14px;font-size:15px;font-weight:600;margin-bottom:12px;}
.sick-banner{background:var(--akt-bg);color:var(--akt);border:1px solid var(--akt);}
.dead-banner{background:var(--gesond-bg);color:var(--gesond);border:1px solid var(--gesond);}
.warn-banner{background:var(--card);color:var(--muted);border:1px dashed var(--akt);}
.warn-banner b{color:var(--akt);}
.sick-banner small,.dead-banner small,.warn-banner small{font-size:12px;font-weight:500;opacity:.85;margin-top:2px;}
.bio-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;}
.bact{flex:1 1 auto;min-height:44px;padding:0 14px;font-size:14px;font-weight:700;
  border:1px solid var(--accent);border-radius:12px;background:var(--accent-bg);color:var(--accent);}
.bact.danger{border-color:var(--gesond);background:var(--gesond-bg);color:var(--gesond);}
#bio-body>.card,#bio-body>.kpis,#bio-body>.dash-cards{margin-bottom:12px;}
#bio-body .kpi b{font-size:19px;}      /* values here carry units ("28.4 kg") — keep them on one line */
.brow{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  padding:9px 0;border-top:1px solid var(--line);}
.brow:first-of-type{border-top:none;}
.blbl{flex:0 0 auto;font-size:13px;color:var(--muted);padding-top:2px;}
.bval{flex:1;text-align:right;font-size:15px;font-weight:600;min-width:0;overflow-wrap:anywhere;}
.bval small{display:block;font-size:11.5px;font-weight:500;color:var(--muted);margin-top:1px;}
.bval.note{font-weight:500;font-size:13.5px;text-align:right;}
.brow.stack{flex-direction:column;align-items:stretch;gap:2px;}
.brow.stack .bval{text-align:left;font-weight:500;font-size:14px;}
.taglink{font:inherit;font-weight:700;color:var(--accent);background:var(--accent-bg);
  border:1px solid var(--accent);border-radius:9px;padding:3px 10px;}
.pill-wrap{display:flex;flex-wrap:wrap;gap:8px;}
.lamb-pill{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 12px;
  border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);
  font-size:15px;font-weight:700;text-align:left;}
.lamb-pill small{font-size:11px;font-weight:500;color:var(--muted);}
.lamb-pill.flat{opacity:.7;}
.lit{border-top:1px solid var(--line);padding:11px 0;}
.lit:first-of-type{border-top:none;}
.lit-h{display:flex;align-items:baseline;gap:8px;margin-bottom:8px;}
.lit-h::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--c,var(--line));flex:0 0 auto;}
.lit-h b{font-size:15px;} .lit-h small{font-size:11.5px;color:var(--muted);}
/* gesondheid-tydlyn */
.tl-row{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--line);}
.tl-row:first-of-type{border-top:none;}
.tl-dot{flex:0 0 auto;width:10px;height:10px;border-radius:50%;margin-top:6px;background:var(--muted);}
.tl-row.siek .tl-dot{background:var(--akt);} .tl-row.behandel .tl-dot{background:var(--accent);}
.tl-row.herstel .tl-dot{background:var(--lamb);} .tl-row.status .tl-dot{background:var(--gesond);}
.tl-txt{min-width:0;} .tl-txt b{font-size:15px;}
.tl-txt small{display:block;font-size:12px;color:var(--muted);margin-top:1px;}
.tl-txt em{display:block;font-size:13px;font-style:normal;margin-top:3px;overflow-wrap:anywhere;}
/* ---------- Dier: gesondheid-vasleg ---------- */
.seg.wrap{flex-wrap:wrap;}
.seg.wrap button{flex:1 1 44%;}
#h-med-wrap .lc-row input[readonly]{background:var(--bg);color:var(--muted);}
#status-pick{margin:2px 0 14px;}
/* mobile-first single column; widen + grid on larger screens (web optimised) */
@media (min-width:720px){
  #screen-dash{max-width:960px;}
  #screen-dash .kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;}
  #screen-dash .dash-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start;}
  #screen-dash .dash-cards .span2{grid-column:1 / -1;}
  #screen-bio{max-width:760px;}
  #screen-bio .kpis{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));}
}