/* CodeNSM — Virtual Office (canvas edition). Loads AFTER codensm.css and
   reuses its custom props (--mint --sky --peach --lav --rose --amber, dark
   bg, mono/sans stacks). All floor drawing happens in ONE <canvas>
   (office.js); this file styles only the HTML chrome around it: tabs, HUD,
   legend, tooltip, unit card, empty state. */

/* ── project section tabs ─────────────────────────────────────────────── */
.cn-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 26px;font-family:var(--mono);font-size:.78rem}
.cn-tabs a{padding:8px 15px;border-radius:10px;border:1px solid transparent;color:var(--dim);
  transition:color .2s,border-color .2s,background .2s}
.cn-tabs a:hover{color:var(--ink);border-color:var(--line)}
.cn-tabs a.on{color:var(--mint);border-color:rgba(126,240,201,.35);background:rgba(126,240,201,.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}

/* ── page chrome ──────────────────────────────────────────────────────── */
.office-sub{color:var(--soft);max-width:64ch;margin:14px 0 6px}
.office-icp{font-family:var(--mono);font-size:.72rem;color:var(--dim);letter-spacing:.08em;margin-bottom:6px}
.office-icp b{color:var(--soft);font-weight:600}
.office-top{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;
  flex-wrap:wrap;margin-top:26px}

/* legend */
.office-legend{display:flex;gap:13px;flex-wrap:wrap;align-items:center;
  font-family:var(--mono);font-size:.68rem;color:var(--soft);padding-bottom:4px}
.lg-chip{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.lg-chip i{width:9px;height:9px;border-radius:3px;display:block}
.lg-chip.s-fit i{background:var(--mint)}
.lg-chip.s-keystone i{background:var(--sky)}
.lg-chip.s-vital_rare i{background:var(--lav)}
.lg-chip.s-overloaded i{background:var(--peach)}
.lg-chip.s-fragile i{background:var(--rose)}
.lg-chip.s-drowsy i{background:#b7a97e}
.lg-chip.s-sleeping i{background:#6d6885}

/* ── stage: one canvas, whole floor always in view ────────────────────── */
.office-stage{position:relative;margin-top:14px;border:1px solid var(--line);border-radius:18px;
  background:radial-gradient(120% 100% at 50% 0%,#0e1119 0%,#0a0d12 70%);
  box-shadow:var(--press);padding:12px;overflow:hidden;
  display:flex;align-items:center;justify-content:center}
#officeCanvas{display:block}
.office-empty{position:absolute;inset:0;display:flex;flex-direction:column;gap:8px;
  align-items:center;justify-content:center;text-align:center;pointer-events:none;
  font-family:var(--mono);font-size:.82rem;color:var(--dim);letter-spacing:.06em;
  background:rgba(10,12,17,.35)}
.office-empty b{color:var(--soft);font-weight:600}
.office-empty[hidden]{display:none}
.office-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  font-family:var(--mono);font-size:.68rem;color:var(--dim);margin-top:10px;letter-spacing:.05em}
.office-foot .live{color:var(--mint)}
.office-foot .live::before{content:"● ";animation:pulse 2.4s infinite}

/* ── top HUD strip — one slim resource bar ────────────────────────────── */
.office-hud{display:flex;flex-wrap:wrap;align-items:stretch;font-family:var(--mono);
  border:1px solid var(--line);border-radius:11px;overflow:hidden;
  background:linear-gradient(180deg,#151a28,#0c0f17);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),inset 0 -1px 0 rgba(0,0,0,.5),
    0 10px 24px -18px #000}
.hud-cell{display:flex;align-items:baseline;gap:7px;padding:9px 16px;white-space:nowrap;
  border-right:1px solid var(--line-2)}
.hud-cell:last-child{border-right:0}
.hud-cell i{font-style:normal;font-size:.78rem;line-height:1;opacity:.9}
.hud-cell b{font-size:.98rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.hud-cell small{font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim)}
.hud-active b{color:var(--mint)}
.hud-calls b{color:var(--sky)}
.hud-snooze b{color:#a49ec4}
.hud-stress b{color:var(--peach)}
.hud-err b{color:var(--rose)}

/* ── tooltip ──────────────────────────────────────────────────────────── */
.office-tip{position:absolute;z-index:6;pointer-events:none;min-width:196px;max-width:256px;
  background:rgba(13,16,23,.97);border:1px solid var(--line);border-radius:13px;
  padding:13px 15px;box-shadow:0 20px 44px -18px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.05);
  font-size:.76rem;line-height:1.5;backdrop-filter:blur(8px);
  opacity:0;transform:translateY(4px);transition:opacity .12s ease,transform .12s ease}
.office-tip.show{opacity:1;transform:translateY(0)}
.tip-fn{font-family:var(--mono);font-size:.78rem;font-weight:600;color:var(--ink);
  word-break:break-all;margin-bottom:2px}
.tip-desc{font-style:italic;font-size:.66rem;color:var(--dim);line-height:1.45;margin-bottom:3px}
.tip-role{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);margin-bottom:8px}
.tip-state{display:inline-block;font-family:var(--mono);font-size:.68rem;padding:2px 9px;
  border-radius:12px;border:1px solid currentColor;margin-bottom:9px}
.tip-state.s-fit{color:var(--mint)}.tip-state.s-keystone{color:var(--sky)}
.tip-state.s-vital_rare{color:var(--lav)}.tip-state.s-overloaded{color:var(--peach)}
.tip-state.s-fragile{color:var(--rose)}.tip-state.s-freeloader{color:var(--amber)}
.tip-state.s-dormant{color:#a49ec4}
.tip-row{display:flex;justify-content:space-between;gap:14px;padding:2.5px 0;
  border-top:1px solid var(--line-2);color:var(--soft)}
.tip-row b{font-family:var(--mono);font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums}
.tip-debt{display:inline-block;font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;
  padding:1.5px 8px;border-radius:10px;border:1px solid}
.tip-debt.d-none{color:var(--dim);border-color:var(--line)}
.tip-debt.d-emerging{color:var(--amber);border-color:rgba(239,217,163,.5)}
.tip-debt.d-accruing{color:var(--peach);border-color:rgba(244,203,168,.55)}
.tip-debt.d-critical{color:#f1857f;border-color:rgba(241,133,127,.6)}
.tip-cta{font-family:var(--mono);font-size:.64rem;color:var(--dim);margin-top:8px}
/* sim-state colours for the hover chip (fit/stressed/strained/idle/external) */
.tip-state.s-stressed{color:#f1857f}.tip-state.s-strained{color:var(--amber)}
.tip-state.s-idle{color:var(--dim)}.tip-state.s-external{color:var(--sky)}
/* restored rich hover: the reason line + the metrics grid */
.tip-why{font-size:.68rem;color:var(--soft);line-height:1.42;margin:7px 0 2px}
.tip-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:3px 12px;margin-top:8px;
  border-top:1px solid var(--line-2);padding-top:7px}
.tip-m{display:flex;flex-direction:column;gap:1px}
.tip-m span{font-family:var(--mono);font-size:.55rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.tip-m b{font-family:var(--mono);font-weight:600;color:var(--ink);font-size:.7rem;font-variant-numeric:tabular-nums}

/* ── unit card — fixed bottom-left of the VIEWPORT ────────────────────── */
.office-unit{display:flex;gap:13px;padding:12px 34px 12px 13px;border-radius:12px;
  border:1px solid rgba(255,255,255,.15);
  background:linear-gradient(180deg,rgba(21,26,40,.97),rgba(11,14,21,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 26px 52px -22px #000;
  font-family:var(--mono)}
.office-unit--fixed{position:fixed;left:14px;bottom:14px;width:auto;max-width:360px;
  z-index:2147483647;pointer-events:auto}
.uc-portbox{flex:0 0 auto;width:68px;height:82px;display:flex;align-items:center;
  justify-content:center;border-radius:9px;border:1px solid var(--line);
  background:radial-gradient(90% 80% at 50% 20%,#131726,#0a0d13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.uc-port{display:block}
.uc-main{flex:1;min-width:0}
.uc-name{font-size:.8rem;font-weight:700;color:var(--ink);word-break:break-all;line-height:1.3}
.uc-desc{font-style:italic;font-size:.68rem;color:var(--soft);line-height:1.45;margin-top:2px}
.uc-sub{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:3px 0 7px}
.uc-role{font-size:.6rem;letter-spacing:.11em;text-transform:uppercase;color:var(--dim)}
.uc-state{font-size:.6rem;padding:1px 8px;border-radius:10px;border:1px solid currentColor}
.uc-state.s-fit{color:var(--mint)}.uc-state.s-keystone{color:var(--sky)}
.uc-state.s-vital_rare{color:var(--lav)}.uc-state.s-overloaded{color:var(--peach)}
.uc-state.s-fragile{color:var(--rose)}.uc-state.s-freeloader{color:var(--amber)}
.uc-state.s-dormant{color:#a49ec4}
.uc-hp{height:6px;border-radius:3px;overflow:hidden;background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.12);margin-bottom:8px}
.uc-hp i{display:block;height:100%;border-radius:2px}
.uc-hp i.hp-g{background:var(--mint)}
.uc-hp i.hp-a{background:var(--amber)}
.uc-hp i.hp-r{background:#f1857f}
.uc-grid{display:flex;gap:5px 15px;flex-wrap:wrap}
.uc-cell{display:flex;align-items:baseline;gap:5px;white-space:nowrap}
.uc-cell i{font-style:normal;font-size:.68rem;opacity:.85}
.uc-cell b{font-size:.74rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.uc-cell small{font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.uc-cell b.uc-debt.d-none{color:var(--dim)}
.uc-cell b.uc-debt.d-emerging{color:var(--amber)}
.uc-cell b.uc-debt.d-accruing{color:var(--peach)}
.uc-cell b.uc-debt.d-critical{color:#f1857f}
.uc-dossier{display:inline-block;margin-top:9px;font-size:.66rem;letter-spacing:.05em;
  padding:5px 12px;border-radius:9px;border:1px solid rgba(126,240,201,.4);
  color:var(--mint);background:rgba(126,240,201,.06)}
.uc-dossier:hover{background:rgba(126,240,201,.12)}
.uc-close{position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:6px;
  border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--dim);
  font-size:.62rem;line-height:1;cursor:pointer;font-family:var(--mono)}
.uc-close:hover{color:var(--ink);border-color:rgba(255,255,255,.3)}
/* cluster member list inside the card */
.uc-list{margin-top:8px;max-height:220px;overflow:auto;border-top:1px solid var(--line-2)}
.uc-list-row{display:flex;justify-content:space-between;gap:14px;padding:4px 2px;
  font-size:.68rem;color:var(--soft);border-bottom:1px solid var(--line-2)}
.uc-list-row b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.uc-list-row.lnk{cursor:pointer}
.uc-list-row.lnk:hover{color:var(--mint)}
.uc-list-row.lnk:hover b{color:var(--mint)}
.uc-list-more{padding:6px 2px;font-size:.62rem;color:var(--dim)}

/* ── demo page (public marketing surface) ─────────────────────────────── */
.demo-hero{padding:136px 0 8px;text-align:left}
.demo-hero h1{margin:6px 0 16px}
.demo-hero .lead{margin-bottom:26px}
.demo-hero .cta-row{margin-bottom:8px}
.okr-strip{margin-top:30px;border:1px solid var(--line);border-radius:16px;padding:18px 22px;
  background:linear-gradient(180deg,var(--panel),var(--bg-2));box-shadow:var(--raise)}
.okr-kpis{display:flex;gap:34px;flex-wrap:wrap;margin-bottom:14px}
.okpi .v{display:block;font-family:var(--mono);font-size:1.45rem;font-weight:700;
  color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.15}
.okpi .l{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim);margin-top:2px}
.okr-krs{display:flex;gap:9px;flex-wrap:wrap;border-top:1px solid var(--line-2);padding-top:14px}
.kr-chip{font-family:var(--mono);font-size:.7rem;padding:5px 12px;border-radius:16px;
  border:1px solid;white-space:nowrap}
.kr-chip i{font-style:normal;opacity:.55;margin-left:4px}
.kr-chip.ok{color:var(--mint);border-color:rgba(126,240,201,.4);background:rgba(126,240,201,.06)}
.kr-chip.miss{color:var(--peach);border-color:rgba(244,203,168,.5);background:rgba(244,203,168,.07)}
.demo-note{font-family:var(--mono);font-size:.7rem;color:var(--dim);margin-top:12px;letter-spacing:.05em}

@media(max-width:720px){
  .office-top{flex-direction:column;align-items:flex-start}
  .hud-cell{padding:7px 11px;gap:5px}
  .hud-cell b{font-size:.85rem}
  .okr-kpis{gap:22px}
  .office-unit--fixed{left:0;right:0;bottom:0;width:100%;max-width:none;
    border-radius:14px 14px 0 0;border-left:0;border-right:0;border-bottom:0;
    padding:10px 30px 10px 12px;gap:10px}
  .office-unit--fixed .uc-portbox{width:48px;height:60px}
}

/* reduced motion: static chrome, no pulsing dot */
@media(prefers-reduced-motion:reduce){
  .office-tip{transition:none}
  .office-foot .live::before{animation:none}
}

/* ══════════════════════════════════════════════════════════════════════════
   LIVING TRIAGE FLOOR — obsidian + emerald command-center chrome (2026 rebuild)
   Self-contained tokens so the sim reads as the same OS as the landing, even
   though this page also loads codensm.css. New classes only — nothing above is
   touched, so the shared demo surface keeps working.
   ══════════════════════════════════════════════════════════════════════════ */
:root{
  /* THE FLOOR palette (founder spec): deep charcoal/slate ground, five health
     accents — emerald Active&Fit · amber At Risk · crimson On Fire · cool-grey
     Deadweight/Idle · electric-indigo External/core-tech bridges. */
  --of-bg:#0b0f19; --of-surface:#0f1420; --of-bd:#1f2937; --of-bd2:#334155;
  --of-em:#10b981; --of-amber:#f59e0b; --of-idle:#6b7280; --of-blue:#6366f1;
  --of-indigo:#6366f1;
  --of-red:#ef4444; --of-t0:#f9fafb; --of-t1:#d1d5db; --of-t2:#9ca3af; --of-t3:#6b7280;
  --of-mono:"JetBrains Mono",ui-monospace,monospace;
  --of-ui:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* FILL colour, one per condition (apps/codensm/archetypes.py STATES) --
     reuses the same 7-colour palette already defined for the condition
     legend below (--mint/--sky/--lav/--peach/--rose/--amber, codensm.css),
     so the canvas floor and the department-card legend always agree.
     `--of-red` (above) is used ONLY for the understanding ring -- no
     condition is ever assigned it, so a red ring is the only red on the
     floor. */
  --of-c-fit:var(--mint,#7ef0c9); --of-c-keystone:var(--sky,#7dd7ff);
  --of-c-vital_rare:var(--lav,#c6b8f2); --of-c-overloaded:var(--peach,#f4cba8);
  --of-c-fragile:var(--rose,#f1b6cb); --of-c-freeloader:var(--amber,#efd9a3);
  --of-c-dormant:var(--of-idle);
}
.s-fit{color:var(--of-em)} .s-stressed{color:var(--of-red)} .s-strained{color:var(--of-amber)}
.s-idle{color:var(--of-idle)} .s-external{color:var(--of-blue)}

/* ── top HUD: the <2s floor headline ─────────────────────────────────────── */
.of-hud{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:24px 0 12px;
  font-family:var(--of-mono);border:1px solid var(--of-bd);border-radius:13px;
  padding:12px 18px;background:linear-gradient(180deg,#0b1220,#070b14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 12px 30px -22px #000}
.of-head{display:flex;align-items:baseline;gap:6px}
.of-head b{font-size:1.5rem;font-weight:700;color:var(--of-em);font-variant-numeric:tabular-nums;line-height:1}
.of-head b.s-stressed{color:var(--of-red)} .of-head b.s-strained{color:var(--of-amber)} .of-head b.s-idle{color:var(--of-idle)}
.of-head small{font-size:.56rem;letter-spacing:.13em;text-transform:uppercase;color:var(--of-t3);margin-right:8px}
.of-flags{display:flex;gap:8px;flex-wrap:wrap}
.of-flag{font-size:.66rem;letter-spacing:.04em;padding:5px 11px;border-radius:9px;
  border:1px solid var(--of-bd2);color:var(--of-t2);white-space:nowrap}
.of-flag.ping.live{color:var(--of-amber);border-color:rgba(245,158,11,.5);background:rgba(245,158,11,.08)}
.of-legend{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-left:auto;font-size:.64rem;color:var(--of-t2)}
.of-legend .lg{display:inline-flex;align-items:center;gap:5px}
.of-legend .lg i{width:8px;height:8px;border-radius:50%;display:block}
.of-legend .lg.s-fit i{background:var(--of-em)} .of-legend .lg.s-stressed i{background:var(--of-red)}
.of-legend .lg.s-strained i{background:var(--of-amber)}
.of-legend .lg.s-idle i{background:var(--of-idle)} .of-legend .lg.s-external i{background:var(--of-blue)}
/* understanding-ring legend chips -- the ring, not the fill, is the ONLY
   thing on the floor that is ever drawn red */
.of-lg-ring{width:9px;height:9px;border-radius:50%;display:inline-block;box-sizing:border-box}
.of-lg-ring-em{border:2px solid var(--of-em)}
.of-lg-ring-red{border:2px solid var(--of-red)}
.of-lg-t{margin-right:2px}
/* language → shape legend: the node silhouette a founder reads without a manual */
.of-legend .lg-shape{display:inline-flex;align-items:center;gap:5px}
.of-legend .lg-shape i{width:9px;height:9px;display:block;background:var(--of-t2)}
.of-legend .lg-shape-round i{border-radius:3px}
.of-legend .lg-shape-square i{border-radius:0}
.of-legend .lg-shape-circle i{border-radius:50%}
.of-legend .lg-shape-hex i{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.of-lg-sep{width:1px;height:12px;background:var(--of-bd2);display:inline-block}
/* size = reach: three dots of growing size */
.of-legend .of-lg-size{display:inline-flex;align-items:center;gap:3px}
.of-legend .of-lg-size i{background:var(--of-t2);border-radius:50%;display:block}
.of-legend .of-lg-size i:nth-child(1){width:5px;height:5px}
.of-legend .of-lg-size i:nth-child(2){width:8px;height:8px}
.of-legend .of-lg-size i:nth-child(3){width:11px;height:11px}
/* core-tech block swatch: a small dashed rounded-rect, mirrors the canvas block */
.of-lg-block{width:20px;height:12px;border-radius:4px;border:1.2px dashed var(--of-t2);
  display:inline-block;box-sizing:border-box;background:rgba(148,163,184,.06)}
/* paper-plane glyph: a real production call in flight along a call edge.
   MVP, per founder law — the floor's living motion. Faint twin = "replay". */
.of-legend .lg-plane i{width:12px;height:9px;background:#e2e8f0;border-radius:0;
  clip-path:polygon(100% 50%,0 100%,30% 50%,0 0)}
.of-legend .lg-plane em{color:var(--of-t3);font-style:italic;margin-left:3px}
.of-flag#ofCap{color:var(--of-t3);border-style:dashed}
.of-wallbtn{font-family:var(--of-mono);font-size:.68rem;padding:7px 13px;border-radius:9px;cursor:pointer;
  border:1px solid var(--of-bd2);background:rgba(16,185,129,.06);color:var(--of-em)}
.of-wallbtn:hover{border-color:var(--of-em);background:rgba(16,185,129,.12)}

/* ── stage: canvas replaces the static grid once JS boots ────────────────── */
.office-stage:not(.office-live) #officeCanvas{display:none}
/* The static department grid is the no-JS floor AND the screen-reader
   floor. Once the canvas boots it must stop taking visual space -- but
   `display:none` would ALSO delete it from the accessibility tree, while
   the canvas (role=img) promises its aria-label's data "follows as
   department cards" below it. That promise would be made to the one user
   who cannot see the canvas, and broken by this very rule. So: visually
   gone (clipped to 1px, off the layout flow), still announced. Ported from
   the same fix in the sibling renderer that forked
   this exact bug out of an earlier version of this file. */
.office-stage.office-live .of-static{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip-path:inset(50%); white-space:nowrap; margin:-1px; padding:0; border:0;
}
.office-stage{align-items:stretch;justify-content:flex-start}
.office-stage.office-live{background:radial-gradient(120% 100% at 50% -10%,#0b1220 0%,#04070f 72%)}

/* ── owner roster: floating command panel over the floor ─────────────────── */
/* owner roster — a slim horizontal strip BELOW the floor, never over the canvas */
.of-roster{position:static;width:100%;margin-top:12px;display:flex;flex-wrap:wrap;
  align-items:center;gap:8px;overflow:visible;
  font-family:var(--of-mono);border:1px solid var(--of-bd);border-radius:12px;padding:10px 14px;
  background:rgba(9,13,22,.6)}
.of-rt{font-size:.56rem;letter-spacing:.13em;text-transform:uppercase;color:var(--of-t3);
  margin:0 6px 0 0;flex:none}
.of-dev{display:inline-flex;align-items:center;gap:7px;text-align:left;padding:5px 10px;border-radius:999px;
  border:1px solid var(--of-bd2);background:none;cursor:pointer;color:var(--of-t1);font-family:inherit}
.of-dev:hover{border-color:var(--of-bd2);background:rgba(255,255,255,.02)}
.of-dev.on{border-color:var(--of-em);background:rgba(16,185,129,.08)}
.of-dev-dot{width:8px;height:8px;border-radius:50%;background:var(--of-em);flex:none}
.of-dev.hot .of-dev-dot{background:var(--of-red);box-shadow:0 0 0 3px rgba(239,68,68,.16)}
.of-dev.warm .of-dev-dot{background:var(--of-amber);box-shadow:0 0 0 3px rgba(245,158,11,.16)}
.of-dev.green .of-dev-dot{box-shadow:0 0 0 3px rgba(16,185,129,.16)}
.of-dev-n{flex:1;font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.of-dev-b{font-size:.58rem;padding:2px 7px;border-radius:8px;border:1px solid var(--of-bd2);color:var(--of-t3)}
.of-dev-go{font-family:var(--of-mono);font-size:.72rem;color:var(--of-t3);text-decoration:none;
  padding:3px 6px;border-radius:7px;margin-left:-4px;line-height:1}
.of-dev-go:hover{color:var(--of-em);background:rgba(16,185,129,.08)}
.of-dev-b.hot{color:var(--of-red);border-color:rgba(239,68,68,.5)}
.of-dev-b.warm{color:var(--of-amber);border-color:rgba(245,158,11,.5)}
.of-dev-b.green{color:var(--of-em);border-color:rgba(16,185,129,.4)}

/* ── briefing ticker ─────────────────────────────────────────────────────── */
.of-ticker{display:flex;align-items:center;gap:12px;margin-top:12px;overflow:hidden;
  font-family:var(--of-mono);border:1px solid var(--of-bd);border-radius:11px;padding:10px 16px;
  background:linear-gradient(180deg,#0b1220,#070b14)}
.of-tk-tag{font-size:.56rem;letter-spacing:.16em;color:var(--of-em);border:1px solid rgba(16,185,129,.4);
  border-radius:6px;padding:3px 8px;flex:none}
.of-tk-tag::before{content:"● ";animation:pulse 2.4s infinite}
.of-tk-line{font-size:.78rem;color:var(--of-t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:opacity .3s}

/* ── ping drawer: worker resume, right slide-in ──────────────────────────── */
.of-drawer{position:fixed;top:0;right:0;bottom:0;width:min(380px,92vw);z-index:2147483646;
  font-family:var(--of-mono);padding:22px 22px 30px;overflow:auto;
  border-left:1px solid var(--of-bd);background:linear-gradient(180deg,#0b1220,#05080f);
  box-shadow:-30px 0 70px -30px #000;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1)}
.of-drawer.open{transform:translateX(0)}
.of-dr-x{position:absolute;top:14px;right:14px;width:26px;height:26px;border-radius:8px;cursor:pointer;
  border:1px solid var(--of-bd2);background:rgba(255,255,255,.03);color:var(--of-t2);font-family:inherit}
.of-dr-x:hover{color:var(--of-t0);border-color:var(--of-t3)}
.of-dr-tag{display:inline-block;font-size:.6rem;letter-spacing:.1em;padding:3px 10px;border-radius:11px;
  border:1px solid currentColor;margin-bottom:12px}
.of-dr-tag.s-fit{color:var(--of-em)}.of-dr-tag.s-stressed{color:var(--of-red)}
.of-dr-tag.s-strained{color:var(--of-amber)}
.of-dr-tag.s-idle{color:var(--of-idle)}.of-dr-tag.s-external{color:var(--of-blue)}
/* core-tech inspector: module chips + the folded-function list */
.of-dr-mods{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.of-dr-mod{font-size:.66rem;color:var(--of-t1);border:1px solid var(--of-bd2);
  border-radius:8px;padding:3px 9px;background:rgba(255,255,255,.02)}
.of-dr-mod b{color:var(--of-t0);font-weight:700;margin-left:2px}
.of-dr-list{margin-top:10px;display:flex;flex-direction:column;gap:2px;
  max-height:46vh;overflow:auto}
.of-dr-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  padding:7px 8px;border-radius:8px;border:1px solid transparent;background:none;
  cursor:pointer;font-family:inherit;color:var(--of-t1)}
.of-dr-row:hover{border-color:var(--of-bd2);background:rgba(255,255,255,.03)}
.of-dr-row-dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--of-idle)}
.of-dr-row-dot.s-fit{background:var(--of-em)}.of-dr-row-dot.s-stressed{background:var(--of-red)}
.of-dr-row-dot.s-strained{background:var(--of-amber)}
.of-dr-row-dot.s-idle{background:var(--of-idle)}.of-dr-row-dot.s-external{background:var(--of-blue)}
.of-dr-row-n{flex:1;font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.of-dr-row-m{font-size:.58rem;color:var(--of-t3);flex:none}
.of-dr-row b{font-size:.66rem;color:var(--of-t0);font-variant-numeric:tabular-nums;flex:none}
.of-dr-name{font-size:1.02rem;font-weight:700;color:var(--of-t0);word-break:break-all;line-height:1.25}
.of-dr-desc{font-style:italic;font-size:.74rem;color:var(--of-t2);margin-top:5px;line-height:1.5}
.of-dr-role{font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--of-t3);margin-top:8px}
.of-dr-lane{font-size:.66rem;letter-spacing:.03em;color:var(--of-em);margin-top:5px}
.of-dr-why{font-size:.76rem;color:var(--of-t1);margin-top:12px;padding-left:11px;border-left:2px solid var(--of-bd2)}
.of-dr-tenure{font-size:.72rem;color:var(--of-t2);margin-top:12px}
.of-dr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:16px}
.of-dr-cell{display:flex;flex-direction:column;gap:3px;padding:9px;border-radius:9px;
  border:1px solid var(--of-bd);background:rgba(255,255,255,.015)}
.of-dr-cell b{font-size:.82rem;color:var(--of-t0);font-variant-numeric:tabular-nums}
.of-dr-cell small{font-size:.52rem;letter-spacing:.09em;text-transform:uppercase;color:var(--of-t3)}
.of-dr-eff{font-size:.68rem;color:var(--of-t2);margin-top:10px}
/* protocol-v2 section: p95 / charged rate / faults / absorption, plus the
   plain-English read of the understanding ring -- LAW 1: `null` always
   renders as "not measured", never as a flattering zero */
.of-dr-section{margin-top:18px;padding-bottom:5px;font-size:.58rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--of-t3);border-bottom:1px solid var(--of-bd)}
.of-dr-note{margin-top:9px;font-size:.68rem;line-height:1.5;color:var(--of-t2)}
.of-dr-badge{display:inline-block;margin-top:9px;font-size:.66rem;padding:3px 9px;border-radius:10px;
  border:1px solid var(--of-bd2);color:var(--of-t2)}
.of-dr-own{font-size:.74rem;color:var(--of-t1);margin-top:14px;padding-top:12px;border-top:1px solid var(--of-bd)}
.of-dr-own b{color:var(--of-t0)} .of-dr-noown{color:var(--of-t3);font-style:italic}
.of-dr-ask{display:block;width:100%;margin-top:14px;padding:11px;border-radius:10px;cursor:pointer;
  font-family:inherit;font-size:.8rem;font-weight:600;color:#04140d;border:0;
  background:linear-gradient(180deg,#12c98d,var(--of-em));box-shadow:0 10px 26px -14px rgba(16,185,129,.7)}
.of-dr-ask:hover{filter:brightness(1.05)}
.of-dr-dossier{display:block;margin-top:10px;text-align:center;font-size:.72rem;padding:9px;border-radius:10px;
  border:1px solid var(--of-bd2);color:var(--of-t1)}
.of-dr-dossier:hover{border-color:var(--of-em);color:var(--of-em)}

/* ── tooltip additions ───────────────────────────────────────────────────── */
.tip-own{font-family:var(--of-mono);font-size:.66rem;color:var(--of-em);margin-top:6px}
.tip-jrny{font-family:var(--of-mono);font-size:.6rem;letter-spacing:.05em;color:var(--of-em);margin:-4px 0 8px}
.office-tip .tip-state.s-fit{color:var(--of-em)}.office-tip .tip-state.s-stressed{color:var(--of-amber)}
.office-tip .tip-state.s-idle{color:var(--of-idle)}.office-tip .tip-state.s-external{color:var(--of-blue)}

/* ── JS-off / no-worker static department floor ──────────────────────────── */
.of-static{width:100%;font-family:var(--of-mono);padding:4px}
.ofs-floor{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ofs-chip{font-size:.72rem;color:var(--of-t2);border:1px solid var(--of-bd);border-radius:9px;padding:6px 11px}
.ofs-chip b{font-variant-numeric:tabular-nums}
.ofs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.ofs-room{border:1px solid var(--of-bd);border-radius:12px;padding:11px;background:rgba(9,13,22,.5)}
.ofs-room.hot{border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.04)}
.ofs-rh{display:flex;justify-content:space-between;gap:8px;align-items:baseline;margin-bottom:5px}
.ofs-rh b{font-size:.76rem;color:var(--of-t0)} .ofs-rh span{font-size:.6rem;color:var(--of-t3)}
.ofs-rb{font-size:.6rem;color:var(--of-t3);line-height:1.4;margin:0 0 9px}
.ofs-core{font-size:.62rem;color:var(--of-t2);border:1px dashed var(--of-bd2);border-radius:8px;
  padding:4px 8px;margin:0 0 9px;background:rgba(148,163,184,.04)}
.ofs-cells{display:flex;flex-direction:column;gap:3px}
.ofs-cell{display:flex;align-items:center;gap:7px;font-size:.68rem;color:var(--of-t1);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ofs-cell i{width:8px;height:8px;border-radius:50%;flex:none}
/* language shape marker inside a static cell (shape = SDK language) */
.ofs-cell .lang{width:8px;height:8px;flex:none;background:var(--of-t3);display:block}
.ofs-cell .lang-round{border-radius:2px}
.ofs-cell .lang-square{border-radius:0}
.ofs-cell .lang-circle{border-radius:50%}
.ofs-cell .lang-hex{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
/* language → shape legend on the static/no-JS floor */
.ofs-legend{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:2px 0 14px;
  font-size:.64rem;color:var(--of-t2)}
.ofs-legend .ls{display:inline-flex;align-items:center;gap:5px}
.ofs-legend .ls i{width:9px;height:9px;display:block;background:var(--of-t2)}
.ofs-legend .ls-round i{border-radius:3px}.ofs-legend .ls-square i{border-radius:0}
.ofs-legend .ls-circle i{border-radius:50%}
.ofs-legend .ls-hex i{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.ofs-cell.s-fit i{background:var(--of-em)} .ofs-cell.s-stressed i{background:var(--of-red)}
.ofs-cell.s-strained i{background:var(--of-amber)}
.ofs-cell.s-idle i{background:var(--of-idle)} .ofs-cell.s-external i{background:var(--of-blue)}
.ofs-more{font-size:.6rem;color:var(--of-t3);margin-top:3px}
.ofs-ticker{margin-top:14px;display:flex;flex-direction:column;gap:5px;
  border-top:1px solid var(--of-bd);padding-top:12px}
.ofs-ticker span{font-size:.72rem;color:var(--of-t2)}

/* ── wall-screen mode: hide chrome, maximize the floor ───────────────────── */
body.office-wall{overflow:hidden}
body.office-wall .cx-nav,body.office-wall .cn-nav,body.office-wall .cn-rail,
body.office-wall .cn-subbar,body.office-wall .idx,body.office-wall .h-lg,
body.office-wall .office-sub,body.office-wall .office-icp,body.office-wall footer,
body.office-wall .cn-foot{display:none!important}
body.office-wall main.wrap.dash{max-width:100%;padding:8px 14px}
body.office-wall .of-hud{margin-top:6px}
body.office-wall .office-stage{border-radius:14px}

@media(max-width:720px){
  .of-hud{gap:12px;padding:10px 12px}
  .of-head b{font-size:1.2rem}
  .of-legend{margin-left:0;width:100%}
  .of-roster{position:static;width:100%;max-height:none;margin-bottom:10px}
  .of-drawer{width:100vw}
}
@media(prefers-reduced-motion:reduce){
  .of-drawer{transition:none}
  .of-tk-line{transition:none}
  .of-tk-tag::before{animation:none}
}

/* ── lane provenance note + owner "Edit lanes" panel ───────────────────── */
.lane-source-note{font-family:var(--mono);font-size:.72rem;color:var(--dim);
  letter-spacing:.06em;margin:6px 0 2px}
.lane-source-note b{color:var(--soft);font-weight:600}
.lane-source-note a{color:var(--accent,#7ef0c9);text-decoration:none;border-bottom:1px dotted}
.ls-src{font-style:italic;color:var(--dim);border-left:1px solid var(--line);padding-left:12px}
.le-save,.le-reset{padding:9px 17px;border-radius:9px;font-size:.82rem;font-weight:600;
  cursor:pointer;font-family:var(--of-ui);border:1px solid var(--of-bd);transition:.16s}
.le-save{background:var(--of-em);color:#04140d;border-color:transparent}
.le-save:hover{background:#34d399}
.le-reset{background:transparent;color:var(--of-t2)}
.le-reset:hover{color:var(--of-t0);border-color:var(--of-bd2)}

/* ══════════════════════════════════════════════════════════════════════════
   THE FLOOR — executive control center (Zone A pulse · Zone C register+remodel)
   Zone B (the floor itself) is painted on the canvas by office.js; everything
   here is the server-rendered chrome around it. Inter for UI + numbers,
   JetBrains Mono strictly for function names / code paths.
   ══════════════════════════════════════════════════════════════════════════ */
/* Title row: hero + the shared settings gear (codensm/_gear.html, styled in
   product.css) — the office's gear leads with Zone C's Office Remodel. */
.floor-titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.floor-titlebar .cn-gear{flex:none;margin-top:6px}

/* ── ZONE A — Executive Pulse ─────────────────────────────────────────────── */
.pulse{font-family:var(--of-ui);margin:18px 0 6px}
.pulse-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pcard{position:relative;display:flex;align-items:center;gap:16px;padding:18px 20px;
  border:1px solid var(--of-bd);border-radius:16px;overflow:hidden;
  background:linear-gradient(180deg,#131a29,#0c1120);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 18px 40px -28px #000}
.pcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}
.pcard-align::before{background:var(--of-em)}
.pcard-dead::before{background:var(--of-idle)}
.pcard-frag::before{background:var(--of-amber)}
.pcard-frag.on-fire::before{background:var(--of-red)}
.pcard-body{min-width:0;flex:1}
.pcard-k{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--of-t3);
  font-weight:600;margin-bottom:5px}
.pcard-v{font-size:2.1rem;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;
  letter-spacing:-.02em}
.pcard-frag.on-fire .pcard-v{color:var(--of-red)}
.pcard-sub{font-size:.74rem;color:var(--of-t2);margin-top:6px;line-height:1.4}
.pcard-cta{display:inline-block;margin-top:9px;font-size:.72rem;font-weight:600;
  color:var(--of-em);text-decoration:none;border-bottom:1px solid rgba(16,185,129,.35)}
.pcard-cta:hover{color:#6ee7b7;border-bottom-color:#6ee7b7}
.pcard-info{display:inline-block;margin-top:8px;font-size:.66rem;color:var(--of-t3);cursor:help;
  border-bottom:1px dotted var(--of-bd2)}
.pcard-info:hover,.pcard-info:focus{color:var(--of-t1)}
/* deadweight progress ring */
.pcard-ring{position:relative;flex:none;width:74px;height:74px;display:grid;place-items:center}
.pcard-ring svg{width:74px;height:74px;transform:rotate(-90deg)}
.ring-track{fill:none;stroke:rgba(148,163,184,.16);stroke-width:7}
.ring-fill{fill:none;stroke:var(--of-idle);stroke-width:7;stroke-linecap:round;
  transition:stroke-dashoffset .7s cubic-bezier(.4,0,.2,1)}
.pcard-ringv{position:absolute;font-size:.86rem;font-weight:700;font-variant-numeric:tabular-nums}
/* friendly desk bots — clean CSS/SVG characters, never clipart */
.pcard-bot{flex:none;width:56px;height:56px;opacity:.95}
.bot{width:56px;height:56px;overflow:visible}
.bot-head{fill:rgba(148,163,184,.13);stroke:currentColor;stroke-width:1.6}
.bot-eye{fill:currentColor}
.bot-smile,.bot-wavy,.bot-flat{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.bot-eyeshut{stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.bot-ant{stroke:currentColor;stroke-width:1.6}
.bot-antdot{fill:currentColor}
.bot-fit{color:var(--of-em)}
.bot-fit .bot-type circle{fill:var(--of-em);opacity:.35;animation:botType 1.4s infinite}
.bot-fit .bot-type circle:nth-child(2){animation-delay:.2s}
.bot-fit .bot-type circle:nth-child(3){animation-delay:.4s}
@keyframes botType{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
.bot-risk{color:var(--of-amber);animation:botWobble 2.6s ease-in-out infinite;transform-origin:50% 70%}
.pcard-frag.on-fire .bot-risk{color:var(--of-red)}
@keyframes botWobble{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
.bot-sweat{fill:#7dd3fc;stroke:none;animation:botSweat 2.6s ease-in-out infinite}
@keyframes botSweat{0%,60%{opacity:0;transform:translateY(-3px)}75%{opacity:1}100%{opacity:0;transform:translateY(5px)}}
.bot-idle{color:var(--of-idle)}
.bot-zzz{fill:var(--of-idle);font-family:var(--of-ui);font-size:9px;font-weight:700;
  animation:botZzz 3s ease-in-out infinite}
.bot-zzz.sm{font-size:7px;animation-delay:.5s}
@keyframes botZzz{0%,100%{opacity:.2}50%{opacity:.95}}
.bot-web{stroke:rgba(148,163,184,.45);stroke-width:1;fill:none}
/* the one plain-English line, generated from the same real stats */
.pulse-brief{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px 16px;
  border:1px solid var(--of-bd);border-radius:12px;background:rgba(99,102,241,.05)}
.pb-tag{flex:none;font-family:var(--of-mono);font-size:.55rem;letter-spacing:.16em;
  color:var(--of-indigo);border:1px solid rgba(99,102,241,.45);border-radius:6px;padding:3px 8px}
.pb-line{font-size:.86rem;color:var(--of-t1);line-height:1.5}

/* ── ZONE C — action register (60) + office remodel (40) ──────────────────── */
.remodel-zone{font-family:var(--of-ui);margin:22px 0 10px}
.rz-grid{display:grid;grid-template-columns:60fr 40fr;gap:16px;align-items:start}
.rz-left,.rz-right{border:1px solid var(--of-bd);border-radius:16px;padding:18px;
  background:linear-gradient(180deg,#101623,#0b1019);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.rz-h{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--of-t2);
  font-weight:700;margin-bottom:14px}
.rz-h span{color:var(--of-t3);font-weight:500;letter-spacing:.06em;text-transform:none}
.rz-actions{display:flex;flex-direction:column;gap:10px}
.action-card{border:1px solid var(--of-bd);border-left:3px solid var(--of-bd2);border-radius:11px;
  padding:13px 15px;background:rgba(255,255,255,.02);transition:.16s}
.action-card:hover{border-color:var(--of-bd2);background:rgba(255,255,255,.035)}
.action-card.ac-fire{border-left-color:var(--of-red)}
.action-card.ac-fragile{border-left-color:var(--of-amber)}
.action-card.ac-prune{border-left-color:var(--of-idle)}
.action-card.ac-map{border-left-color:var(--of-indigo)}
.action-card.ac-calm{border-left-color:var(--of-em)}
.ac-tag{display:inline-block;font-family:var(--of-mono);font-size:.55rem;letter-spacing:.12em;
  text-transform:uppercase;padding:3px 8px;border-radius:6px;margin-bottom:8px;
  border:1px solid var(--of-bd2);color:var(--of-t2)}
.ac-tag.ac-action-required{color:var(--of-amber);border-color:rgba(245,158,11,.45);
  background:rgba(245,158,11,.08)}
.ac-tag.ac-pruning-candidate{color:var(--of-idle);border-color:rgba(107,114,128,.5);
  background:rgba(107,114,128,.1)}
.ac-tag.ac-all-clear{color:var(--of-em);border-color:rgba(16,185,129,.45);
  background:rgba(16,185,129,.08)}
.ac-text{font-size:.84rem;color:var(--of-t1);line-height:1.55;margin:0 0 9px}
.ac-cta{font-size:.73rem;font-weight:600;color:var(--of-em);text-decoration:none}
.ac-cta:hover{color:#6ee7b7;text-decoration:underline}

/* visual tag manager */
.tm-help{font-size:.76rem;color:var(--of-t2);line-height:1.55;margin:0 0 14px}
.tm-help b{color:var(--of-t1)}
.tm-lanes{display:flex;flex-direction:column;gap:10px}
.tm-lane{border:1px solid var(--of-bd);border-radius:11px;padding:10px 11px;
  background:rgba(0,0,0,.24)}
.tm-lane-top{display:flex;align-items:center;gap:8px}
.tm-grip{color:var(--of-t3);font-size:.7rem;flex:none}
.tm-label{flex:1;min-width:0;padding:6px 9px;border:1px solid var(--of-bd);border-radius:7px;
  background:rgba(255,255,255,.03);color:var(--of-t0);font-size:.82rem;font-weight:600;
  font-family:var(--of-ui)}
.tm-label:focus{outline:none;border-color:var(--of-em)}
.tm-count{flex:none;font-family:var(--of-mono);font-size:.6rem;color:var(--of-t3);white-space:nowrap}
.tm-count.hit{color:var(--of-em)}
.tm-count.empty{color:var(--of-t3);font-style:italic}
.tm-del{flex:none;width:24px;height:24px;border-radius:7px;cursor:pointer;line-height:1;
  border:1px solid var(--of-bd);background:transparent;color:var(--of-t3);font-size:.9rem}
.tm-del:hover{color:var(--of-red);border-color:rgba(239,68,68,.5)}
.tm-pills{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 0}
.tm-pills:empty{margin:0}
.tm-pill{display:inline-flex;align-items:center;gap:5px;font-family:var(--of-mono);font-size:.66rem;
  padding:3px 5px 3px 9px;border-radius:999px;color:#a5b4fc;
  border:1px solid rgba(99,102,241,.45);background:rgba(99,102,241,.12)}
.tm-pill button{width:14px;height:14px;border-radius:50%;border:0;cursor:pointer;line-height:1;
  background:rgba(99,102,241,.25);color:#c7d2fe;font-size:.62rem;padding:0}
.tm-pill button:hover{background:var(--of-red);color:#fff}
.tm-add{width:100%;margin-top:7px;padding:6px 9px;border:1px dashed var(--of-bd2);border-radius:7px;
  background:transparent;color:var(--of-t1);font-size:.74rem;font-family:var(--of-mono)}
.tm-add:focus{outline:none;border-color:var(--of-indigo);border-style:solid}
.tm-add::placeholder{color:var(--of-t3)}
.tm-addlane{margin-top:11px;padding:7px 13px;border-radius:8px;cursor:pointer;width:100%;
  border:1px dashed var(--of-bd2);background:transparent;color:var(--of-t2);
  font-size:.74rem;font-family:var(--of-ui);font-weight:600}
.tm-addlane:hover{color:var(--of-em);border-color:var(--of-em)}
.tm-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}

@media(max-width:980px){
  .pulse-cards{grid-template-columns:1fr}
  .rz-grid{grid-template-columns:1fr}
  .pcard-v{font-size:1.8rem}
}
@media(max-width:560px){
  .pcard{gap:12px;padding:15px}
  .pcard-bot,.bot{width:44px;height:44px}
  .pulse-brief{flex-direction:column;align-items:flex-start;gap:7px}
}
@media(prefers-reduced-motion:reduce){
  .bot-fit .bot-type circle,.bot-risk,.bot-sweat,.bot-zzz{animation:none}
  .bot-sweat{opacity:.7}
  .ring-fill{transition:none}
  .floor-gear:hover{transform:none}
}