*{box-sizing:border-box}
:root{--bg:#0a0a0b;--panel:#121214;--sunk:#08080a;--ink:#f4f5f5;--dim:#8f9496;
 --line:#232327;--red:#e2231a;--good:#3fb950;--bad:#f0616d;--warn:#d29922;--amber:#c99a2e;
 --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace}
html,body{margin:0;background:var(--bg);color:var(--ink);
 font:15px/1.6 Archivo,system-ui,-apple-system,sans-serif;-webkit-text-size-adjust:100%}
a{color:inherit}
button,input,select{font:inherit}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}
header.top{position:sticky;top:env(safe-area-inset-top,0);z-index:20;background:var(--sunk);
 border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px 20px;
 align-items:center;padding:11px 18px}
.wordmark{font-weight:800;letter-spacing:-.03em;font-size:17px;text-decoration:none;white-space:nowrap}
.wordmark .ai{color:var(--red)}
.tagline{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.spacer{flex:1}
.who{font-family:var(--mono);font-size:11px;color:var(--dim)}
nav.decks{display:flex;gap:4px;flex-wrap:wrap;padding:9px 14px;background:var(--sunk);
 border-bottom:1px solid var(--line);position:sticky;top:46px;z-index:19}
nav.decks button{background:none;border:1px solid transparent;color:var(--dim);
 font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;
 padding:5px 10px;border-radius:3px;cursor:pointer}
nav.decks button[aria-current=true]{color:var(--ink);border-color:var(--line);background:var(--panel)}
nav.decks button:hover{color:var(--ink)}
main{padding:18px;max-width:1280px;margin:0 auto}
h1{font-size:clamp(21px,3vw,28px);letter-spacing:-.025em;margin:8px 0 2px;font-weight:700}
.sub{color:var(--dim);font-size:13.5px;margin:0 0 4px}
.bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:12px 0 4px}
.bar input,.bar select{background:var(--panel);border:1px solid var(--line);color:var(--ink);
 border-radius:3px;padding:6px 9px;font-size:13.5px}
.bar .cnt{font-family:var(--mono);font-size:11.5px;color:var(--dim)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;margin-top:14px}
.slide{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:5px;
 padding:14px 15px 10px}
.slide.s-scaffold{border-style:dashed;border-color:#3a3a42}
.slide.s-unavailable{border-color:#5a2222;background:#170f10}
.slide.s-partial{border-left:3px solid var(--amber)}
.slide[data-kind=table],.slide[data-kind=flow],.slide[data-kind=note]{grid-column:1/-1}
.slide h3{margin:0 0 2px;font-size:16px;font-weight:700;letter-spacing:-.01em}
.slide h3.bad{color:var(--bad)}
.badge{position:absolute;top:10px;right:11px;font-family:var(--mono);font-size:9.5px;
 letter-spacing:.11em;padding:2px 6px;border-radius:3px;border:1px solid}
.b-partial{color:var(--amber);border-color:#4a3a14}
.b-scaffold{color:var(--dim);border-color:#3a3a42}
.b-unavailable{color:var(--bad);border-color:#5a2222}
.ph{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.pv{text-align:right;white-space:nowrap}
.big{font-family:var(--mono);font-size:24px;font-weight:600;letter-spacing:-.02em;display:block;line-height:1.1}
.big.good{color:var(--good)}.big.bad{color:var(--bad)}
.cap{font-family:var(--mono);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim)}
.meta{margin:8px 0 4px;display:flex;gap:5px;flex-wrap:wrap}
.pill{font-family:var(--mono);font-size:10px;letter-spacing:.05em;padding:2px 7px;
 border:1px solid var(--line);border-radius:3px;color:var(--dim)}
.pill.dim{opacity:.6}
.ladder{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.lt{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
 color:var(--dim);margin:0 0 6px}
.rung{display:grid;grid-template-columns:96px 1fr 46px 34px 36px;gap:7px;align-items:center;
 font-family:var(--mono);font-size:10.5px;margin-bottom:3px}
.rt{color:var(--dim)}
.rb{background:var(--sunk);height:7px;border-radius:2px;overflow:hidden}
.rb i{display:block;height:100%;background:var(--good)}
.rp{text-align:right}.rh{text-align:right;color:var(--dim)}
.rc.good{color:var(--good)}.rc.bad{color:var(--bad)}
.kpi{text-align:left}
/* THE CAP AND SUB ARE BLOCKS INSIDE A KPI. As inline spans they ran together --
   "PLAYERS CALLEDweek 3" -- which is the kind of defect every server-side assertion
   passes straight through. */
.kpi .cap,.kpi .sub{display:block}
.kpi .sub{margin-top:3px;font-size:12.5px;line-height:1.4}
.note{margin:8px 0 0;font-size:13.5px;color:var(--dim)}
.needs{font-size:13.5px}
.mdl{font-size:11px;opacity:.7;margin:6px 0 0}
.kv{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;margin:8px 0 0;font-size:13px}
.kv dt{color:var(--dim)}.kv dd{margin:0;font-family:var(--mono)}
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:4px;margin-top:8px}
table{border-collapse:collapse;width:100%;font-size:13px;font-variant-numeric:tabular-nums}
th,td{padding:6px 10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
 color:var(--dim);background:var(--sunk)}
td.r,th.r{text-align:right;font-family:var(--mono)}
tbody tr:last-child td{border-bottom:0}
ol.flow{list-style:none;padding:0;margin:10px 0 0;display:grid;
 grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}
ol.flow li{background:var(--sunk);border:1px solid var(--line);border-radius:4px;padding:10px 12px;
 position:relative}
ol.flow li b{display:block;font-size:13px;margin-bottom:3px}
ol.flow li span{display:block;font-size:12px;color:var(--dim);line-height:1.45}
ol.flow li em{font-family:var(--mono);font-size:11px;color:var(--ink);font-style:normal;
 display:block;margin-top:5px}
ol.flow li.f-scaffold{border-style:dashed}
ol.flow li.f-partial{border-left:3px solid var(--amber)}
.lin{margin:10px -15px -10px;padding:6px 15px;border-top:1px solid var(--line);
 font-family:var(--mono);font-size:9.5px;color:#5c6163;background:var(--sunk);
 border-radius:0 0 4px 4px}
.gate{max-width:440px;margin:60px auto;background:var(--panel);border:1px solid var(--line);
 border-radius:5px;padding:22px}
.gate h2{margin:0 0 6px;font-size:18px}
.gate p{color:var(--dim);font-size:13.5px}
.gate input{width:100%;margin:10px 0 8px}
.gate button{background:var(--red);border:0;color:#fff;padding:8px 16px;border-radius:3px;
 cursor:pointer;font-weight:600}
.err{color:var(--bad);font-size:13px;min-height:18px}
@media(max-width:640px){nav.decks{top:auto;position:static}.grid{grid-template-columns:1fr}
 .rung{grid-template-columns:78px 1fr 44px 30px 32px}}

/* ---- cross-tab. The heat is a SECOND encoding of the same number, never the only
   one: colour alone is not an encoding a colour-blind reader can use, and the digit
   is always present. */
table.mx td.heat{position:relative}
table.mx td.heat::before{content:"";position:absolute;inset:2px;border-radius:2px;
 background:var(--red);opacity:calc(var(--h)/260);z-index:0}
table.mx td.heat{z-index:1}
table.mx td.dim{color:#4a4f52}
/* ---- designation funnel */
.fun{margin-top:10px;display:grid;gap:6px}
.fs{display:grid;grid-template-columns:190px 1fr 74px;gap:10px;align-items:center}
.fl b{display:block;font-size:13.5px}
.fl span{display:block;font-size:11.5px;color:var(--dim);line-height:1.35}
.fbar{background:var(--sunk);height:18px;border-radius:3px;overflow:hidden}
.fbar i{display:block;height:100%;background:#3a3a42}
.fs.f-bad .fbar i{background:var(--red)}
.fs.f-warn .fbar i{background:var(--amber)}
.fs.f-good .fbar i{background:var(--good)}
.fn{font-family:var(--mono);font-size:15px;text-align:right}
.fn em{display:block;font-style:normal;font-size:10px;color:var(--dim)}
@media(max-width:640px){.fs{grid-template-columns:120px 1fr 56px}}
.mxc{font-size:11px;margin:6px 0 0;color:var(--dim)}
.slide.clickable{cursor:pointer}
.slide.clickable:hover{border-color:#3a3a42;background:#17171a}
