.reel button:hover img{transform:scale(1.04)}
.reel .lab{position:absolute;left:0;right:0;bottom:0;padding:22px 10px 8px;background:linear-gradient(0deg,rgba(9,14,28,.85),transparent);color:#fff;font-weight:700;font-size:14px;text-align:left;line-height:1.2}
.reel .lab small{display:block;font-weight:500;opacity:.85}

/* lightbox: the pop-up figure viewer */
.lb{position:fixed;inset:0;z-index:40;background:rgba(5,8,16,.94);display:grid;grid-template-rows:auto minmax(0,1fr) auto;color:#fff}
.lb .top{display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px}
.lb .top .n{font-weight:600;color:#c9d2e3}
.lb .top .sp{flex:1}
.lb button.lbb{min-height:48px;min-width:48px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.lb button.lbb:hover{background:rgba(255,255,255,.16)}
.lb .stage{display:grid;place-items:center;padding:0 12px;min-height:0;touch-action:pan-y}
.lb .stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lb .stage .svgw{background:#fff;color:#111827;border-radius:12px;padding:16px;max-width:min(920px,100%);max-height:100%;overflow:auto}
.lb .stage .svgw svg{width:100%;height:auto;min-width:min(640px,80vw)}
.lb .foot{display:flex;gap:10px;align-items:center;padding:10px 14px calc(env(safe-area-inset-bottom,0px) + 14px)}
.lb .foot .c{flex:1;font-size:16px;line-height:1.35}
.lb .foot .c small{display:block;color:#aab4c6;font-size:13px;margin-top:2px}
@media (prefers-reduced-motion:no-preference){ .lb{animation:fade .18s var(--ease)} .lb .stage>*{animation:zoomin .24s var(--ease)} }
@keyframes fade{from{opacity:0}to{opacity:1}} @keyframes zoomin{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
[data-lb]{cursor:zoom-in}

/* tools: bigger, visual, colour-coded, with words (never colour alone) */
.tool{min-height:112px;padding:14px 16px;gap:6px;align-content:start;box-shadow:var(--e1);border-radius:16px;transition:box-shadow .15s var(--ease),transform .15s var(--ease),border-color .15s;overflow:hidden}
.tool:hover{box-shadow:var(--e2);transform:translateY(-1px)}
.tool b{font-family:var(--font-head);font-size:21px;font-weight:700;line-height:1.1}
.tool .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--tint,var(--soft));color:var(--tc,var(--brand));margin-bottom:4px}
.tool .ic svg{width:26px;height:26px}
.tool::after{content:"";position:absolute;right:-22px;bottom:-22px;width:64px;height:64px;border-radius:50%;background:var(--tint,var(--soft));opacity:.5;z-index:0}
.tool>*{position:relative;z-index:1}
.c-navy{--tint:#e3e8f7;--tc:#263a8b} .c-red{--tint:#fde6e1;--tc:#c2301a} .c-green{--tint:#e2f3e8;--tc:#1f7a45}
.c-amber{--tint:#fff1cf;--tc:#8a5a00} .c-steel{--tint:#e6eaef;--tc:#2c3643}

/* KPI tiles: status edge + status word; the pop-up gets a gauge */
.tile{position:relative;box-shadow:var(--e1);border-left-width:6px;transition:box-shadow .15s var(--ease),transform .15s var(--ease)}
.tile:hover{box-shadow:var(--e2);transform:translateY(-1px)}
.tile.ok{border-left-color:var(--ok)} .tile.watch{border-left-color:var(--warn)} .tile.attention{border-left-color:var(--bad)}
.tile .v{font-size:34px;font-weight:800;line-height:1.05;letter-spacing:.005em}
.gauge{margin:10px 0 2px;display:grid;gap:6px}
.gauge svg{width:100%;height:auto;display:block}
.gauge .lg{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.gauge .lg i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-1px}

/* Good work: where the job is, like a delivery tracker */
.track{display:grid;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:var(--e1)}
.track .hd{display:flex;gap:12px;align-items:center}
.track .ph{width:64px;height:64px;border-radius:12px;object-fit:cover;flex:none;background:var(--soft)}
.track .t{font-weight:700;font-size:17px;line-height:1.25}
.track .steps{display:grid;grid-template-columns:repeat(3,1fr);position:relative;margin-top:2px}
.track .steps::before{content:"";position:absolute;left:16%;right:16%;top:15px;height:4px;background:var(--line);border-radius:2px}
.track .steps .fill{position:absolute;left:16%;top:15px;height:4px;background:var(--ok);border-radius:2px;width:var(--w,0%)}
.track .s{display:grid;justify-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--muted);position:relative;text-align:center}
.track .s .d{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:3px solid var(--line);color:transparent}
.track .s.on{color:var(--ink)} .track .s.on .d{background:var(--ok);border-color:var(--ok);color:#fff}
.track .s .d svg{width:18px;height:18px}
.track .s small{font-weight:500;color:var(--muted)}

/* Good work pop-up out of the bubble */
.bubble .pop{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;background:var(--card);color:var(--ink);border:1px solid var(--line);border-left:6px solid var(--ok);padding:10px 14px 10px 10px;box-shadow:var(--e3)}
.bubble .pop img,.bubble .pop .noimg{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--ok-bg);display:grid;place-items:center;color:var(--ok)}
.bubble .pop b{color:var(--ok)}
@media (prefers-reduced-motion:no-preference){ .bubble .pop{animation:slidein .35s var(--ease)} }
@keyframes slidein{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.stamp{display:inline-block;font-family:var(--font-head);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:12px;padding:2px 8px;border-radius:6px;border:2px solid currentColor}
.stamp.paid{color:var(--ok)} .stamp.invoiced{color:var(--brand)} .stamp.done{color:var(--steel)} .stamp.ar{color:var(--ok)}

/* Handbook: groups with an icon, cards with a figure preview */
.hbg{display:flex;align-items:center;gap:10px}
.hbg .gi{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--tint,var(--soft));color:var(--tc,var(--brand));flex:none}
.hbg .gi svg{width:22px;height:22px}
.hbg h2{margin:0}.hbg h2::before{display:none}
.hbcard{box-shadow:var(--e1);border-radius:14px;transition:box-shadow .15s var(--ease),transform .15s var(--ease);padding:0;overflow:hidden;grid-template-rows:auto 1fr}
.hbcard:hover{box-shadow:var(--e2);transform:translateY(-1px)}
.hbcard .pv{background:#fff;height:112px;display:grid;place-items:center;overflow:hidden;border-bottom:1px solid var(--line);padding:6px}
.hbcard .pv svg{max-height:100px;width:auto;max-width:100%}
.hbcard .pv.noart{background:linear-gradient(135deg,var(--tint,var(--soft)),transparent);color:var(--tc,var(--brand))}
.hbcard .pv.noart svg{width:40px;height:40px}
.hbcard .tx{display:grid;gap:4px;padding:12px 14px}
.hbfig{cursor:zoom-in;box-shadow:var(--e1);transition:box-shadow .15s}
.hbfig:hover{box-shadow:var(--e2)}
.hbfig .zoom{justify-self:end;font-size:13px;font-weight:700;color:var(--brand)}

/* case studies: photo up top */
.story{padding:0;overflow:hidden}
.story .ph{width:100%;aspect-ratio:16/7;object-fit:cover;display:block;background:var(--soft)}
.story .bd{display:grid;gap:8px;padding:14px 16px 16px}
.story h3{font-family:var(--font-head);font-size:24px;margin:0;line-height:1.15}
.story ul{margin:0;padding-left:0;list-style:none;display:grid;gap:6px}
.story ul li{display:flex;gap:8px;align-items:flex-start}
.story ul li::before{content:"✓";color:var(--ok);font-weight:800;flex:none}
.story .who{font-family:var(--font-head);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-size:13px}
@media (min-width:900px){ #stl .list{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))} }

/* empty states with a small drawing, not a blank box */
.empty.art{display:flex;gap:14px;align-items:center;border-style:solid;background:var(--card)}
.empty.art svg{width:64px;height:auto;flex:none;color:var(--muted)}

/* rail + header polish */
header{box-shadow:var(--e1)}
.rail .rb{font-family:var(--font-head);font-size:18px;letter-spacing:.01em;line-height:1.1}
.rail .rb[aria-selected=true]{box-shadow:inset 4px 0 0 var(--accent)}
.bubble .fab{box-shadow:var(--e3)}
@media (prefers-reduced-motion:no-preference){ .bubble .fab{transition:transform .15s var(--ease)} .bubble .fab:hover{transform:scale(1.06)} }

/* splash: blueprint grid behind the logo */
.splash{background:
  radial-gradient(ellipse at 50% 35%,rgba(255,255,255,.0),rgba(0,0,0,.0)),
  linear-gradient(0deg,rgba(38,58,139,.07) 1px,transparent 1px) 0 0/28px 28px,
  linear-gradient(90deg,rgba(38,58,139,.07) 1px,transparent 1px) 0 0/28px 28px, var(--card)}
.splash .hi{font-family:var(--font-head);font-size:26px;font-weight:700}
.enter{font-size:22px}

/* ---- v2: questions, next steps, site photos, toolkit, calculators ---- */
.qsecs{display:grid;gap:22px}
.qsec{display:grid;gap:12px;padding:16px;border:1px solid var(--line);border-radius:18px;background:color-mix(in srgb,var(--card) 70%,var(--bg));box-shadow:var(--e1)}
.qhd{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.qhd h3{font-family:var(--font-head);font-size:26px;font-weight:800;margin:0;line-height:1.1}
.verdict{font-weight:700;font-size:14px;padding:6px 12px;border-radius:99px;border:1.5px solid currentColor;max-width:100%}
.verdict.ok{color:var(--ok);background:var(--ok-bg)} .verdict.warn{color:var(--warn);background:var(--warn-bg)} .verdict.bad{color:var(--bad);background:var(--bad-bg)}
.tiles.q4{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
@media (max-width:520px){ .tiles.q4{grid-template-columns:1fr 1fr} .qhd h3{font-size:22px} .qsec{padding:12px} }
.tile.t2{padding:0;display:grid;grid-template-rows:1fr auto;cursor:default;min-height:150px}
.tile.t2 .tmain{display:grid;gap:6px;align-content:start;text-align:left;background:transparent;border:0;font:inherit;color:inherit;cursor:pointer;padding:14px 14px 10px;min-width:0}
.tile.t2 .l{font-weight:700;color:var(--muted);font-size:15px}
.tile.t2 .st{font-weight:800;font-size:14px}
.tile.ok .st{color:var(--ok)} .tile.watch .st{color:var(--warn)} .tile.attention .st{color:var(--bad)}
.tile.t2 .c{font-size:13px;color:var(--muted);line-height:1.35}
.tfoot{display:flex;gap:6px;border-top:1px solid var(--line);padding:6px}
.tfoot .why{flex:0 0 auto}
.tfoot button{flex:1;white-space:nowrap;min-height:44px;border:0;border-radius:10px;background:transparent;color:var(--brand);font:inherit;font-weight:700;font-size:14px;cursor:pointer;padding:0 8px}
.tfoot button:hover{background:var(--soft)} .tfoot .nx{background:var(--soft)}
.minibar{position:relative;height:8px;border-radius:99px;background:var(--line);overflow:visible;margin:2px 0}
.minibar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--muted)}
.tile.ok .minibar i{background:var(--ok)} .tile.watch .minibar i{background:var(--warn)} .tile.attention .minibar i{background:var(--bad)}
.minibar b{position:absolute;top:-4px;width:3px;height:16px;border-radius:2px;background:var(--ink);transform:translateX(-1px)}
.qmore summary{cursor:pointer;font-weight:700;color:var(--brand);min-height:44px;display:flex;align-items:center}
.qmore .tiles{margin-top:8px}
.rcsum{display:grid;gap:8px}.rcsum .verdict{border-radius:12px}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.tscroll table{min-width:720px}
.unit{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card)}.unit .nm{font-weight:700}details.unit>summary{list-style:none;cursor:pointer}details.unit>summary::-webkit-details-marker{display:none}details.unit[open]>summary{margin-bottom:8px}.pos .tl .w{min-width:3.5em}.porow{display:grid;grid-template-columns:minmax(0,1fr) 64px 110px 140px;gap:6px;margin:8px 0}.porow .pskr{grid-column:1/-1}@media(max-width:560px){.porow{grid-template-columns:1fr 64px}.porow .pc,.porow .ps{max-width:none!important}}
.sitechip{display:flex;align-items:center;gap:8px;margin:-4px 0 4px 12px;min-height:40px;padding:0 14px;border-radius:0 0 12px 12px;border:1px solid var(--line);border-top:0;background:var(--soft);color:var(--brand);font:inherit;font-weight:700;font-size:14px;cursor:pointer;justify-self:start;width:max-content;max-width:calc(100% - 12px)}
.sitepics .reel{grid-auto-columns:minmax(160px,1fr)}
.tk .tool{text-decoration:none}
.tk .ext{font-size:12px;color:var(--muted);font-weight:600;margin-top:2px}
.calc-tabs{flex-wrap:wrap}
.calc{gap:14px}
.calc .ans{display:grid;gap:4px;padding:14px 16px;border-radius:14px;border:1.5px solid var(--line);background:var(--soft)}
.calc .ans .big{font-size:44px;line-height:1}
.calc .ans.ok{border-color:var(--ok);background:var(--ok-bg)} .calc .ans.warn{border-color:var(--warn);background:var(--warn-bg)} .calc .ans.bad{border-color:var(--bad);background:var(--bad-bg)}
.calc input,.calc select{font-size:22px;min-height:60px}


/* Today by site + crew board (design pass 3) */
.tview{margin-bottom:6px}
.stack{display:flex;height:14px;border-radius:7px;overflow:hidden;background:var(--soft);gap:2px;margin:8px 0 6px}
.stack i{display:block;min-width:6px}
.stack i.ok,.stackkey i.ok{background:var(--ok)} .stack i.bad,.stackkey i.bad{background:var(--bad)} .stack i.warn,.stackkey i.warn{background:var(--warn)}
.stack i.info,.stackkey i.info{background:var(--brand)} .stack i.muted,.stackkey i.muted{background:var(--muted)} .stack i.done,.stackkey i.done{background:#6b7c93}
.stackkey{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--muted);margin-bottom:4px}
.stackkey span{display:inline-flex;align-items:center;gap:6px} .stackkey i{width:10px;height:10px;border-radius:3px;display:inline-block}
.sites{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));margin:10px 0 14px}
.sitecard{border:1px solid var(--line);border-left:5px solid var(--ok);border-radius:14px;background:var(--card);padding:14px;display:grid;gap:9px;align-content:start;box-shadow:var(--e1,none);animation:rise .25s var(--ease,ease) both}
.sitecard.bad{border-left-color:var(--bad)} .sitecard.warn{border-left-color:var(--warn)} .sitecard.info{border-left-color:var(--brand)} .sitecard.done{border-left-color:#6b7c93;opacity:.85}
.sitecard .sh{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.sitecard h3{margin:2px 0 2px;font-family:var(--font-head,inherit);font-size:19px;line-height:1.2;overflow-wrap:anywhere}
.sitecard .dept{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.crew{display:flex;flex-wrap:wrap;gap:6px}
.cchip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--soft);border-radius:99px;padding:4px 12px 4px 4px;font:inherit;color:inherit;cursor:pointer;min-height:44px;text-align:left}
.cchip .av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800;background:var(--card);border:2px solid var(--ok)}
.cchip.bad .av{border-color:var(--bad)} .cchip.warn .av{border-color:var(--warn)} .cchip.info .av{border-color:var(--brand)} .cchip.done .av{border-color:#6b7c93}
.cchip b{display:block;font-size:14px;line-height:1.1} .cchip small{display:block;font-size:12px;color:var(--muted)}
.sacts{display:flex;flex-wrap:wrap;gap:8px}
.btn.sm{min-height:44px;padding:0 14px;font-size:15px;width:auto;display:inline-flex;align-items:center;text-decoration:none}
.crewrow{display:grid;grid-template-columns:44px minmax(0,1fr) 92px;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-left:5px solid var(--line);border-radius:12px;background:var(--card);width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;min-height:72px}
.crewrow.ok{border-left-color:var(--ok)} .crewrow.warn{border-left-color:var(--warn)} .crewrow.bad{border-left-color:var(--bad)}
.crewrow .av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--soft)}
.crewrow .nm{font-weight:800;font-size:17px} .crewrow .sub{color:var(--muted);font-size:14px;overflow-wrap:anywhere}
.ubar{position:relative;height:8px;border-radius:4px;background:var(--soft);margin-top:7px}
.ubar i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--ok)}
.crewrow.warn .ubar i{background:var(--warn)} .crewrow.bad .ubar i{background:var(--bad)}
.ubar b{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink,currentColor);opacity:.55}
.crewrow .uv{text-align:right} .crewrow .uv b{display:block;font-size:20px;font-family:var(--font-head,inherit)} .crewrow .uv small{color:var(--muted);font-size:12px}
@media (max-width:560px){ .sites{grid-template-columns:1fr} .crewrow{grid-template-columns:40px minmax(0,1fr) 74px} }

.bidlist{display:grid;gap:8px}
.bidrow .ba{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.bidrow{display:grid;grid-template-columns:132px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-left:5px solid var(--line);border-radius:12px;background:var(--card)}
.bidrow.ok{border-left-color:var(--ok)} .bidrow.warn{border-left-color:var(--warn)} .bidrow.bad{border-left-color:var(--bad)}
.bidrow .bd b{font-family:var(--font-head,inherit);font-size:16px} .bidrow.bad .bd b{color:var(--bad)} .bidrow.warn .bd b{color:var(--warn)}
.bidrow .nm{font-weight:800;font-size:16px;overflow-wrap:anywhere}
@media (max-width:560px){ .bidrow{grid-template-columns:1fr} .bidrow .ba .btn{width:100%;justify-content:center} }

.hbcard .pv.photo{display:block;padding:0;height:140px;background:var(--soft)} .hbcard .pv.photo img{width:100%;height:140px;object-fit:cover;display:block;transition:transform .3s var(--ease,ease)} .hbcard:hover .pv.photo img{transform:scale(1.04)}
.hb{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))} .hbcard .pv{height:140px}
.hbphoto{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--card);cursor:zoom-in}
.hbphoto img{width:100%;max-height:340px;object-fit:cover;display:block}
.hbphoto figcaption{padding:6px 10px;font-size:12px} .hbphoto figcaption a{color:var(--muted);text-decoration:none}

.qstages{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;margin:4px 0 10px}
.qst{display:grid;gap:2px;justify-items:start;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);font:inherit;color:inherit;cursor:pointer;text-align:left;min-height:64px;border-top:4px solid var(--line)}
.qst b{font-family:var(--font-head,inherit);font-size:24px;line-height:1} .qst span{font-size:13px;color:var(--muted);font-weight:700}
.qst.you{border-top-color:var(--accent)} .qst.office{border-top-color:var(--warn)} .qst.approval{border-top-color:var(--brand)} .qst.done{border-top-color:var(--ok)}
.qst[aria-selected="true"]{background:var(--soft);box-shadow:inset 0 0 0 2px currentColor}
.bidq{border:1px solid var(--line);border-left:5px solid var(--line);border-radius:12px;background:var(--card);padding:12px;display:grid;gap:6px}
.bidq.ok{border-left-color:var(--ok)} .bidq.warn{border-left-color:var(--warn)} .bidq.bad{border-left-color:var(--bad)}
.bidq .bh{display:flex;gap:8px;align-items:center} .bidq .nm{font-weight:800;font-size:16px;overflow-wrap:anywhere}
@media (max-width:560px){ .qstages{grid-template-columns:repeat(2,minmax(0,1fr))} }

.typer .tsteps{margin:0;padding-left:0;list-style:none;display:grid;gap:6px;font-size:15px}
.typer .tsteps li{display:grid;grid-template-columns:22px 1fr;gap:8px;align-items:start}
.typer .tsteps li::before{content:"";width:16px;height:16px;border-radius:50%;margin-top:3px;border:2px solid var(--line)}
.typer .tsteps li.done::before{background:var(--ok);border-color:var(--ok);box-shadow:inset 0 0 0 3px var(--card)}
.typer .tsteps li.now::before{border-color:var(--accent);border-top-color:transparent;animation:spin 0.9s linear infinite}
.typer .tthumbs{grid-column:2;display:flex;gap:6px;margin-top:6px;flex-wrap:wrap} .typer .tthumbs img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.typer .lines .tl{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--line)}
.typer .lines .sum{font-weight:700}
.typer .ttag{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:99px;background:var(--soft)}
.typer .ttag.eq{background:var(--brand);color:#fff} .typer .ttag.lab{background:var(--ok-bg);color:var(--ok)} .typer .ttag.ref{background:var(--warn-bg);color:var(--warn)}
.typer .tx{font-family:var(--font-head,inherit);font-weight:800;color:var(--muted)}
.typer .tsum{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:15px} .typer .tsum b{font-family:var(--font-head,inherit);font-size:20px}
@keyframes spin{to{transform:rotate(360deg)}}

.msgs2{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:16px;align-items:start}
.msgs2 .ml{display:grid;gap:8px;position:sticky;top:12px;max-height:calc(100dvh - 140px);overflow:auto}
.msgs2 .mt{display:grid;gap:10px;border:1px solid var(--line);border-radius:16px;background:var(--card);padding:14px;min-height:420px}
.msgs2 .mt .bubbles{max-height:52dvh;overflow:auto;padding-right:4px}
.thread.on{border-color:var(--brand);box-shadow:inset 3px 0 0 var(--brand)}
.mhd{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding-bottom:8px;border-bottom:1px solid var(--line)}
.mhd .av,.thread .av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--soft)}
.mhd .whoname{font-family:var(--font-head,inherit);font-weight:800;font-size:20px;line-height:1.1}
.daysep{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:6px 0}
.daysep::before,.daysep::after{content:"";flex:1;border-top:1px solid var(--line)}
.qreplies{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.qr{flex:none;border:1px solid var(--line);background:var(--soft);color:inherit;font:inherit;font-size:14px;font-weight:700;border-radius:99px;padding:8px 14px;min-height:40px;cursor:pointer}
.qr:hover{border-color:var(--brand)}
@media (max-width:860px){ .msgs2{grid-template-columns:1fr} }

.atabs{margin:6px 0 12px}
.ahead{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;margin-bottom:6px} .ahead .search{margin:0}
.ptiles{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.ptile{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--card);font:inherit;color:inherit;text-align:left;cursor:pointer;min-height:72px;box-shadow:var(--e1,none)}
.ptile:hover{border-color:var(--brand)} .ptile .av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--soft)}
.ptile .pm{display:grid;gap:2px;min-width:0} .ptile .pm b{font-size:16px} .ptile .pm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.ptile .pm .ptag{justify-self:start;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--brand);background:var(--soft);border-radius:99px;padding:2px 8px;margin-top:3px}
.atabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none} .atabs button{flex:none} .seg2 [aria-selected="true"] .muted{color:inherit;opacity:.8}

/* empty states: one calm, consistent look (an inbox tray, plain words, room to breathe) */
.empty:not(.art){display:flex;gap:12px;align-items:center;padding:16px 18px;border:1.5px dashed var(--line);border-radius:14px;background:color-mix(in srgb,var(--card) 60%,transparent);color:var(--muted);font-size:15px;line-height:1.4}
.empty:not(.art)::before{content:"";width:30px;height:30px;flex:none;background:var(--muted);opacity:.55;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13h5l1.5 3h5L16 13h5'/%3E%3Cpath d='M5.5 5h13L21 13v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5z'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13h5l1.5 3h5L16 13h5'/%3E%3Cpath d='M5.5 5h13L21 13v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5z'/%3E%3C/svg%3E") no-repeat center/contain}

.scorecard{display:grid;gap:4px}
.sc{display:grid;grid-template-columns:minmax(140px,1.2fr) minmax(120px,2fr) minmax(80px,auto) 138px;gap:14px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-left:5px solid var(--line);border-radius:12px;background:var(--card);font:inherit;color:inherit;text-align:left;cursor:pointer}
.sc:hover{border-color:var(--brand)} .sc.attention{border-left-color:var(--bad)} .sc.watch{border-left-color:var(--warn)} .sc.ok{border-left-color:var(--ok)} .sc .n{font-weight:800} .sc .val{font-family:var(--font-head,inherit);font-weight:800;font-size:18px;text-align:right;white-space:nowrap}
.sc .st{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;text-align:right} .sc .st.attention{color:var(--bad)} .sc .st.watch{color:var(--warn)} .sc .st.ok{color:var(--ok)}
.bg{position:relative;height:14px;border-radius:3px;overflow:hidden;background:var(--soft)} .bg.none{background:transparent;height:auto;overflow:visible} .bg.none span{font-size:12px;color:var(--muted);font-style:italic}
.bg .z,.sckey .z{position:absolute;top:0;bottom:0} .z.bad{background:color-mix(in srgb,var(--bad) 22%,transparent)} .z.warn{background:color-mix(in srgb,var(--warn) 22%,transparent)} .z.ok{background:color-mix(in srgb,var(--ok) 22%,transparent)}
.bg .v{position:absolute;left:0;top:4px;bottom:4px;background:var(--ink,currentColor);border-radius:2px;opacity:.85}
.bg .tgt{position:absolute;top:1px;bottom:1px;width:3px;margin-left:-1px;background:var(--ink,currentColor)}
.sckey{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:4px} .sckey span{display:inline-flex;align-items:center;gap:6px}
.sckey .z{position:static;display:inline-block;width:14px;height:10px;border-radius:2px} .sckey .tk{display:inline-block;width:3px;height:12px;background:currentColor}
.rcdet{font-family:var(--font-head,inherit);font-size:18px;margin:10px 0 0}
@media (max-width:640px){ .sc{grid-template-columns:1fr auto;gap:6px 10px} .sc .bg{grid-column:1/-1;grid-row:2} .sc .st{grid-column:2;grid-row:1;display:none} }

/* ================= Shell v3 (Sep 30, evening): one app, three devices.
   Phone (<760): bottom tab bar for the main places, the way iOS and Android apps do it (thumb reach; Apple HIG tab bars,
   Material 3 navigation bar); sub-screens keep the big Back button at the bottom and hide the tab bar.
   Tablet (760-1099): a navigation rail, icons over labels (Material 3 navigation rail), so the work area gets the width.
   Desktop (1100+): the full sidebar. Back and Done move up to the header on tablet and desktop.
   Status is a slim bar on the card's left edge, not a thick rounded border. Bids get a calendar page for the due date. */
:root{--railw:88px;--hdrh:61px}
@media (min-width:1100px){ :root{--railw:248px} }
.tabbar{display:none}
.hback{display:none;align-items:center;gap:4px;padding:8px 14px 8px 8px;font-family:var(--font-head);font-size:17px;font-weight:700;letter-spacing:.01em}
.hback svg{flex:none}
#who{display:inline-flex;align-items:center;gap:8px;padding:4px 14px 4px 4px}
#who .wav{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff;font-family:var(--font-head);font-size:14px;font-weight:800;letter-spacing:.02em}

/* phone */
@media (max-width:759px){
  header{padding:calc(env(safe-area-inset-top,0px) + 8px) 12px 8px}
  header .logo{height:26px}
  body.in .htabs{display:none}
  #who{padding:4px}
  #who .wn{display:none}
  .hback{display:none!important}
  .bubble .fab{width:56px;height:56px}
  main{padding:14px 14px}
  h1{font-size:30px}
  .hero{min-height:112px} .hero h1{font-size:26px} .hero .hin{padding:14px 16px 18px} .hero p{font-size:14.5px;line-height:1.4} .hero .kick{font-size:12px}
  .atabs button{padding:0 12px;font-size:14px;min-height:40px}
  .mhead{align-items:center;gap:6px 10px} .mhead h1{font-size:30px}
  .asof{font-size:13px;gap:6px 10px} .asof button{min-height:36px;padding:0 10px}
  /* manager tabs: icon over a short label, never wrapping */
  .panes{gap:2px;padding:3px}
  .panes button{min-height:56px;font-size:12px;gap:3px;white-space:nowrap;position:relative}
  .panes button .ic{display:grid!important;width:22px;height:22px}
  .panes .b:not(:empty){position:absolute;top:6px;left:calc(50% + 8px);width:9px;height:9px;padding:0;border-radius:50%;background:var(--accent);font-size:0;overflow:hidden}
  /* number tiles: two across, figures sized to fit, the explain button shrinks to a "?" */
  .tile .v,.tile.t2 .v{font-size:26px}
  .tile.t2 .tmain{padding:12px 12px 8px}
  .tile.t2 .l{font-size:14px}
  .tfoot{padding:4px;gap:4px}
  .tfoot button{font-size:13px;padding:0 6px}
  .tfoot .why{flex:0 0 40px;font-size:0;border:1.5px solid var(--line);border-radius:50%;min-height:40px;height:40px}
  .tfoot .why::before{content:"?";font-size:16px;font-weight:800}
  .qsec{padding:14px 12px;border-radius:16px}
}

/* phone and tablet (up to 1024px): the bottom tab bar. Tablet has no rail; the rail is for 1025px and up. */
@media (max-width:1024px){
  body.in:not(.docked) .tabbar{display:grid}
  .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:7;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;
    background:color-mix(in srgb,var(--card) 94%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);
    border-top:1px solid var(--line);padding:6px 6px calc(env(safe-area-inset-bottom,0px) + 6px);box-shadow:0 -4px 16px -8px rgba(16,24,40,.18)}
  .tabbar button{display:grid;justify-items:center;align-content:center;gap:3px;min-height:56px;border:0;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:700;letter-spacing:.01em;cursor:pointer;padding:2px 0;-webkit-tap-highlight-color:transparent}
  .tabbar .ti{position:relative;display:grid;place-items:center;width:60px;height:32px;border-radius:99px;transition:background .18s var(--ease)}
  .tabbar .ti svg{width:24px;height:24px}
  .tabbar button[aria-selected=true]{color:var(--brand)}
  .tabbar button[aria-selected=true] .ti{background:color-mix(in srgb,var(--brand) 14%,transparent)}
  .tabbar .n{position:absolute;top:-2px;right:6px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--accent);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;border:2px solid var(--card)}
  body.in:not(.docked) main{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 156px)}
  body.in:not(.docked) .bubble{bottom:calc(env(safe-area-inset-bottom,0px) + 82px)}
  body.in:not(.docked) .toast{bottom:calc(env(safe-area-inset-bottom,0px) + 86px)}
}
/* tablet and up: the rail */
@media (min-width:760px){
  body.in{display:grid;grid-template-columns:var(--railw) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  body.in header{grid-column:1/-1}
  body.in .htabs{display:none}
  body.in .rail{display:flex;flex-direction:column;gap:4px;background:var(--card);border-right:1px solid var(--line);position:sticky;top:var(--hdrh);height:calc(100dvh - var(--hdrh));overflow:auto;padding:16px 12px}
  body.in main{grid-column:2;width:100%;max-width:1320px;padding:24px 28px calc(env(safe-area-inset-bottom,0px) + 110px);align-content:start}
  body.in .dock{left:var(--railw)}
  body.backonly .dock{display:none!important}
  body.backonly .hback:not([hidden]){display:inline-flex}
  body.backonly .bubble{bottom:calc(env(safe-area-inset-bottom,0px) + 22px)}
  body.backonly main{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 96px)}
  .bubble{right:22px;bottom:calc(env(safe-area-inset-bottom,0px) + 22px)}
}
@media (min-width:760px) and (max-width:1099px){
  body.in .rail{padding:12px 8px;gap:6px;align-items:stretch}
  .rail h6{display:block;height:1px;margin:8px 10px;background:var(--line);font-size:0;overflow:hidden}
  .rail .rb{position:relative;flex-direction:column;justify-content:center;gap:4px;min-height:66px;padding:6px 2px;font-family:var(--font-body);font-size:12.5px;font-weight:700;line-height:1.15;text-align:center;border-radius:14px}
  .rail .rb svg{box-sizing:content-box;width:24px;height:24px;padding:4px 18px;border-radius:99px;transition:background .18s var(--ease)}
  .rail .rb:hover{background:transparent} .rail .rb:hover svg{background:var(--soft)}
  .rail .rb[aria-selected=true]{background:transparent;color:var(--brand);box-shadow:none}
  .rail .rb[aria-selected=true] svg{background:color-mix(in srgb,var(--brand) 14%,transparent)}
  .rail .rb .n{position:absolute;top:2px;right:10px;margin:0}
  .rail .rme{display:none}
}
@media (min-width:1100px){
  header{padding-left:20px;padding-right:20px}
  body.in main{padding:28px 36px calc(env(safe-area-inset-bottom,0px) + 110px)}
  .rail .rb{min-height:48px}
}

/* manager tabs stay in reach while the page scrolls */
.panes{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hdrh));z-index:4;box-shadow:0 6px 12px -10px rgba(16,24,40,.35)}
@media (max-width:759px){ .panes{top:calc(env(safe-area-inset-top,0px) + 53px)} }

/* one status language: a slim bar on the left edge (never colour alone: every card also says its status in words) */
.tile,.sc,.crewrow,.sitecard{--edge:transparent;position:relative;border-left:1px solid var(--line)}
.tile::before,.sc::before,.crewrow::before,.sitecard::before{content:"";position:absolute;left:-1px;top:12px;bottom:12px;width:4px;border-radius:0 4px 4px 0;background:var(--edge);pointer-events:none}
.tile.ok,.sc.ok,.crewrow.ok,.sitecard.ok{--edge:var(--ok)}
.tile.watch,.sc.watch,.crewrow.warn,.sitecard.warn{--edge:var(--warn)}
.tile.attention,.sc.attention,.crewrow.bad,.sitecard.bad{--edge:var(--bad)}
.sitecard.info{--edge:var(--brand)} .sitecard.done{--edge:#6b7c93}
.tile.attention{border-color:color-mix(in srgb,var(--bad) 55%,var(--line))}
.tile.attention::before{width:5px}
body.nofab .bubble{display:none}

/* Today: one toolbar */
.tbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.segc{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;background:var(--soft);padding:3px;border-radius:12px}
.segc button{min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--ink);font:inherit;font-size:14px;font-weight:700;padding:0 14px;cursor:pointer;white-space:nowrap}
.segc button[aria-checked=true]{background:var(--card);color:var(--brand);box-shadow:var(--e1)}
.tbar .seg2{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.tbar .seg2 button{min-height:40px;padding:0 14px;font-size:14px;flex:none}
.tbar .daynav{margin-left:auto}
.tbar .daynav button{min-height:40px;min-width:40px;border-radius:10px;font-size:14px}
@media (max-width:759px){ .tbar .segc{flex:1 1 100%} .tbar .seg2{flex:1 1 0;min-width:0;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent);padding-right:18px}
  .tbar .daynav{gap:4px} .tbar .daynav button{min-width:38px;padding:0 10px} }
@media (max-width:560px){ .atabs{-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent);padding-right:22px} }

/* bids: a calendar page for the due date, the job, the GC, then the actions */
.bidlist,#bidsq,.hub3 .col,.hubgrid .col{container-type:inline-size}
.bidlist{display:grid;gap:10px}
.bid{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:var(--e1)}
.bid .cal{display:grid;justify-items:center;align-self:start;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card);text-align:center;line-height:1;box-shadow:var(--e1)}
.bid .cal .cw{display:block;width:100%;padding:4px 0;background:var(--steel);color:#fff;font-family:var(--font-head);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.bid.ok .cal .cw{background:var(--ok)} .bid.warn .cal .cw{background:var(--amber);color:#1b1300} .bid.bad .cal .cw{background:var(--bad)}
.bid .cal .cd{font-family:var(--font-head);font-weight:800;font-size:28px;padding:5px 0 1px;font-variant-numeric:tabular-nums}
.bid .cal .cm{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-bottom:6px}
.bid .bm{display:grid;gap:4px;min-width:0}
/* ================= Shell v4 (Oct 1): Today hub, Quotes = quoting only, Dashboard, foldable sections.
   Every section with a heading is a disclosure (NN/g accordions: long mobile pages, clear headings, a count).
   The open/closed choice is remembered per section on this device (foldMemory). */
section.sec{gap:0}
/* J12: every section is a <details class="fold" id>; foldMemory remembers it per device. One summary row, one tap, 44px min. */
details.fold{display:block;min-width:0}
details.fold>summary{list-style:none;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:48px;padding:6px 2px;cursor:pointer;border-radius:10px;color:var(--ink);-webkit-tap-highlight-color:transparent}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
details.fold>summary .chev{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--soft);color:var(--ink);transition:transform .18s var(--ease)}
details.fold>summary .chev svg{width:20px;height:20px}
details.fold[open]>summary .chev{transform:rotate(90deg)}
details.fold>summary .ft{min-width:0}
details.fold>summary h2,details.fold>summary .fh{margin:0;color:var(--ink);font-family:var(--font-head);font-weight:800;font-size:19px;line-height:1.2}
details.fold>summary .fsub{display:block;color:var(--muted);font-size:14px;font-weight:400}
details.fold>summary .cnt{min-width:28px;height:28px;padding:0 9px;border-radius:99px;display:grid;place-items:center;background:var(--soft);color:var(--ink);font-family:var(--font-head);font-weight:800;font-size:14px}
details.fold>summary .cnt.hot{background:var(--accent);color:#fff}
details.fold>summary .cnt:empty{display:none}
details.fold>.secb{display:grid;gap:10px;padding-top:6px}
.shh{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center}
.shh .shv{width:84px;height:84px;border-radius:14px;overflow:hidden;background:var(--soft);display:grid;place-items:center;color:var(--brand)}
.shh .shv img,.shh .shv svg{width:100%;height:100%;object-fit:cover;display:block}
.shh .shn{font-family:var(--font-head);font-weight:800;font-size:34px;line-height:1.05;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.shh .shl{color:var(--muted);font-size:15px}
@media (max-width:480px){.shh{grid-template-columns:1fr}.shh .shv{width:100%;height:96px}}
.svsec{border:1px solid var(--line);border-radius:10px;background:var(--card)} .svsec>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;cursor:pointer;min-height:52px} .svsec>summary::-webkit-details-marker{display:none} .svsec>summary .cnt{min-width:44px;text-align:center;padding:2px 10px;border-radius:99px;background:var(--soft);color:var(--muted);font-family:var(--font-head);font-weight:800;font-size:14px} .svsec[open]>summary{border-bottom:1px solid var(--line)}
.svgrid{display:grid;gap:12px;padding:12px 14px} @media (min-width:760px){ .svgrid{grid-template-columns:1fr 1fr} .svgrid .svf:has(textarea){grid-column:1/-1} }
.svf{display:grid;gap:6px} .svf .svl{font-weight:700} .svf input,.svf textarea{min-height:52px;font-size:18px} .svf .chip{min-height:44px;padding:0 16px;font-size:16px;font-weight:700;border-radius:10px;border:1.5px solid var(--line);background:var(--card);color:var(--ink)} .svf .chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.daybar{margin:8px 2px 0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
.daybar .dbh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:15px;margin-bottom:6px}
.daybar .dbt{position:relative;height:18px;border-radius:6px;background:var(--soft);overflow:hidden}
.daybar .dbt i{position:absolute;top:0;bottom:0;background:var(--brass);border-radius:3px}
.daybar .dbt i.job{background:var(--brand)}
.daybar .dbt i.live{background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.25) 0 6px,transparent 6px 12px)}
.daybar .dbt s{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--accent);text-decoration:none}
.daybar .dbx{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-top:4px}
.clockbig{display:flex;align-items:center;gap:14px;width:100%;min-height:72px;padding:12px 16px;border-radius:16px;border:0;background:var(--ok,#2a7a3b);color:#fff;font:inherit;text-align:left;cursor:pointer;box-shadow:0 8px 20px -12px rgba(16,24,40,.5)}
.clockbig.on{background:var(--navy,#1c2a66)}
.clockbig .ci{flex:none;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center}
.clockbig .ci svg{width:26px;height:26px}
.clockbig b{display:block;font-family:var(--font-head);font-size:22px;font-weight:800;line-height:1.1}
.clockbig span.s{display:block;font-size:14px;opacity:.9;margin-top:2px}
.clockbig:disabled{opacity:.6;cursor:default}
.hubgrid{display:grid;gap:14px}
@media (min-width:1100px){ .hubgrid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start} .hubgrid .col{display:grid;gap:14px} }
.needrow{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer;border-left:5px solid var(--warn,#f2a900)}
.needrow.bad{border-left-color:var(--bad,#c62828)}.needrow.info{border-left-color:var(--brand)}
.needrow .t{font-weight:800}.needrow .s{color:var(--muted);font-size:14px}
.needrow .go{margin-left:auto;color:var(--muted)}
.tile .v.nv,.tile2 .v.nv,.v.nv{font-size:17px!important;font-weight:700;color:var(--muted);line-height:1.3}
.decs{display:grid;gap:14px}
@media (min-width:1100px){ .decs{grid-template-columns:1fr 1fr} .decs .dec:first-child{grid-column:1/-1} }
.dec{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;gap:10px;border-left:6px solid var(--line)}
.dec.ok{border-left-color:var(--ok)}.dec.watch{border-left-color:var(--warn)}.dec.attention{border-left-color:var(--bad)}
.dec .qhd{display:flex;align-items:center;justify-content:space-between;gap:10px}.dec h3{margin:0;font-family:var(--font-head);font-size:22px;font-weight:800}
.dec .dbig .n{font-family:var(--font-head);font-size:44px;font-weight:800;line-height:1;letter-spacing:-.01em}
.dec .dbig .n.ok{color:var(--ok)}.dec .dbig .n.watch{color:var(--warn)}.dec .dbig .n.attention{color:var(--bad)}
.dec .dline{margin:0;font-size:17px;line-height:1.4}
.dec .dfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.dec .dfacts div{display:grid;gap:2px;padding:8px 10px;background:var(--soft);border-radius:10px}.dec .dfacts b{font-size:18px}