
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin:0; padding:0; }
body { font-family:-apple-system,system-ui,Segoe UI,Roboto,sans-serif;
       background:var(--bg-1); color:var(--ink); padding:0 0 28px; min-height:100vh; }
header { position:sticky; top:0; z-index:10; background:#0e1116ee;
         backdrop-filter:blur(8px); border-bottom:1px solid var(--bg-3); }
.hrow1{display:flex;align-items:center;gap:10px;padding:9px 14px 6px;}
.hback{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:none;
border:1px solid var(--line-2);border-radius:8px;color:var(--ink);text-decoration:none;font-size:18px;line-height:1;}
.hback:hover{border-color:#484f58;background:var(--bg-2);}
.hrow2{padding:0 8px;}
header .logo { font-size:18px; font-weight:800; letter-spacing:.5px; }
header .dot { width:8px; height:8px; border-radius:50%; background:#2ea043; }
header .date { color:var(--ink-2); font-size:12px; }
header .brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:inherit;flex:none;}
.wsnav{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;}
.wsnav::-webkit-scrollbar{display:none;}
.wsnav a{padding:8px 13px;color:var(--ink-2);text-decoration:none;font-size:13px;font-weight:600;white-space:nowrap;border-bottom:2px solid transparent;}
.wsnav a.on{color:var(--ink);border-bottom-color:#3fb950;}
.wsnav a:hover{color:var(--ink);}
.hrow3{padding:0 8px;border-top:1px solid var(--bg-2);}
.subnav{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;}
.subnav::-webkit-scrollbar{display:none;}
.subnav a{padding:6px 11px;color:var(--ink-3);text-decoration:none;font-size:12px;font-weight:600;white-space:nowrap;border-bottom:2px solid transparent;}
.subnav a.on{color:var(--ink);border-bottom-color:#1f6feb;}
.subnav a:hover{color:var(--ink);}
.subnav .sgrp{padding:6px 3px 6px 8px;color:#484f58;font-size:11px;font-weight:700;white-space:nowrap;align-self:center;text-transform:uppercase;letter-spacing:.4px;}
.wrap { padding:16px; max-width:1500px; margin:0 auto; }
h2 { font-size:16px; margin:18px 0 10px; color:var(--ink); }
.sub { color:var(--ink-2); font-size:12px; margin:-6px 0 12px; }
.card { background:var(--bg-2); border:1px solid var(--line-2); border-radius:10px;
        padding:14px; margin-bottom:10px; }
.kpi { display:flex; gap:10px; flex-wrap:wrap; }
.kpi .box { flex:1; min-width:120px; background:var(--bg-2); border:1px solid var(--line-2);
            border-radius:10px; padding:14px; }
.kpi .num { font-size:24px; font-weight:800; }
.kpi .lbl { color:var(--ink-2); font-size:12px; margin-top:2px; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th { text-align:left; color:var(--ink-2); font-weight:600; padding:8px 6px;
     border-bottom:1px solid var(--line-2); font-size:11px; text-transform:uppercase;
     letter-spacing:.4px; }
td { padding:9px 6px; border-bottom:1px solid var(--bg-3); }
tr:last-child td { border-bottom:none; }
.sym { font-weight:700; }
/* positive / negative numeric text — the site's ONE value-green/red (was the legacy
   GitHub #3fb950 / #f85149, the most pervasive green on every board's % cells). */
.pos { color:var(--up); } .neg { color:var(--down); } .mut { color:var(--ink-2); }
.pill { display:inline-block; font-size:10px; font-weight:700; padding:2px 7px;
        border-radius:9px; letter-spacing:.4px; }
/* RS-state + DVPT-rank pills — unified to the institutional value palette: ONE green
   (var(--up) #3fd486) and ONE red (var(--down)), translucent-dim backgrounds to match
   the site's .uk-pill treatment. Replaces the legacy GitHub greens (#7ee787/#1f6f3a/
   #225c33) and reds so dashboard pills read the same green as the rest of the site. */
.p-SS{background:var(--up-dim);color:var(--up);} .p-S{background:var(--up-dim);color:var(--up);}
.p-A{background:#2b4f6f;color:#79c0ff;} .p-B{background:#3a3f4b;color:var(--ink);}
.p-C{background:var(--line-2);color:var(--ink-2);} .p-BREAKOUT{background:var(--up-dim);color:var(--up);}
.p-UPTREND{background:var(--up-dim);color:var(--up);} .p-CONSOLIDATING{background:rgba(246,183,60,.14);color:var(--warn);}
.p-DOWNTREND{background:var(--down-dim);color:var(--down);} .p-BREAKDOWN{background:var(--down-dim);color:var(--down);}
/* D43 accumulation/distribution character pills */
.ca-acc{background:var(--up-dim);color:var(--up);} .ca-dist{background:var(--down-dim);color:var(--down);}
.ca-cons{background:#3a3417;color:#ffd99a;} .ca-neu{background:var(--line-2);color:var(--ink-2);}
/* Session 33 — THEME tag chips + the themes browse + accumulating-only filter */
.tchip{display:inline-block;font-size:10px;font-weight:600;padding:2px 7px;border-radius:9px;
  background:#15324a;color:#9ecbff;border:1px solid #1f4d72;margin:1px 3px 1px 0;
  text-decoration:none;line-height:1.6;white-space:nowrap;}
.tchip:hover{background:#1f4d72;color:#cfe8ff;}
.tchip.prop{background:#2b2410;color:#ffd99a;border-color:#5a4a1f;}
.tchip.more{background:var(--bg-3);color:var(--ink-2);border-color:var(--line-2);}
.tchip .tq{opacity:.7;margin-left:1px;}
.theme-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:12px;}
.trow{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:6px;
  text-decoration:none;color:inherit;border-bottom:1px solid var(--bg-3);}
.trow:last-child{border-bottom:none;} .trow:hover{background:var(--bg-2);}
.trow .tn{font-weight:700;color:var(--ink);min-width:118px;}
.trow .tb{flex:1;font-size:11px;color:var(--ink-2);}
.trow .tc{font-weight:700;color:#58a6ff;min-width:54px;text-align:right;}
.accfilter{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink);
  margin:10px 0 6px;cursor:pointer;user-select:none;}
.ptbl.acc-only tbody tr:not(.is-acc){display:none;}
nav { position:fixed; bottom:0; left:0; right:0; background:var(--bg-1);
      border-top:1px solid var(--bg-3); display:flex; }
nav a { flex:1; text-align:center; padding:10px 4px; color:var(--ink-2);
        text-decoration:none; font-size:11px; }
nav a.active { color:#58a6ff; }
nav a .ic { font-size:20px; display:block; }
input,button { font-family:inherit; }
.search { display:flex; gap:8px; margin-bottom:14px; }
.search input { flex:1; background:var(--bg-1); border:1px solid var(--line-2); color:var(--ink);
                padding:11px 12px; border-radius:8px; font-size:15px; }
.search button { background:#1f6feb; border:none; color:#fff; padding:0 18px;
                 border-radius:8px; font-weight:700; font-size:14px; }
.zone { display:flex; justify-content:space-between; padding:7px 0;
        border-bottom:1px solid var(--bg-3); font-size:14px; }
.zone .lbl { color:var(--ink-2); width:54px; }
.zone .val { font-variant-numeric:tabular-nums; }
.empty { color:var(--ink-2); text-align:center; padding:48px 16px; }
a.row { color:inherit; text-decoration:none; display:block; }
.hsearch { margin-left:auto; flex:none; }
.hsearch input { background:var(--bg-1); border:1px solid var(--line-2); color:var(--ink);
                 padding:6px 10px; border-radius:7px; font-size:13px; width:110px; }
.banner { border-radius:10px; padding:12px 14px; margin-bottom:12px; font-weight:700;
          display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.banner small { font-weight:400; opacity:.9; }
.b-on{background:var(--up-dim);color:var(--ok);border:1px solid rgba(var(--up-rgb),.35);}
.b-off{background:var(--down-dim);color:var(--off);border:1px solid rgba(var(--down-rgb),.35);}
.b-neu{background:#3a3417;color:#ffd99a;border:1px solid #5a4a1f;}
.majgrid { display:grid; grid-template-columns:1fr; gap:8px; }
@media(min-width:560px){ .majgrid{ grid-template-columns:1fr 1fr; } }
.maj { background:var(--bg-2); border:1px solid var(--line-2); border-left:3px solid #1f6feb;
       border-radius:8px; padding:10px 12px; display:block; color:inherit; text-decoration:none; }
.maj .nm { font-weight:700; font-size:14px; }
.maj .rr { display:flex; gap:14px; margin-top:5px; font-size:12px; color:var(--ink-2);
           font-variant-numeric:tabular-nums; flex-wrap:wrap; }
.fbar { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.fbtn { background:var(--bg-2); border:1px solid var(--line-2); color:var(--ink-2); padding:5px 11px;
        border-radius:14px; font-size:12px; cursor:pointer; }
.fbtn.on { background:#1f6feb; border-color:#1f6feb; color:#fff; }
.chips { display:flex; gap:6px; flex-wrap:wrap; }
.chip { background:var(--bg-2); border:1px solid var(--line-2); border-radius:8px; padding:7px 10px;
        font-size:13px; color:inherit; text-decoration:none; }
.ghdr { font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--ink-2);
        margin:16px 0 8px; font-weight:700; }
.hstrip{display:inline-flex;gap:2px;vertical-align:middle;}
.hstrip .c{width:20px;height:24px;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;line-height:1;font-weight:700;}
.hstrip .c small{font-size:7px;opacity:.7;margin-top:1px;font-weight:600;}
/* RS-momentum heat strip — up greens / down reds unified to the value palette
   (was GitHub #7ee787 / #ffa198); the bg darkens by intensity (su brighter than mu). */
.hs-su{background:#1f6f3a;color:var(--up);} .hs-mu{background:#225c33;color:var(--up);}
.hs-fl{background:#5a4a1f;color:#ffd99a;} .hs-md{background:#6f2b2b;color:var(--down);}
.hs-sd{background:#8f1f1f;color:var(--down);} .hs-nd{background:var(--bg-3);color:#484f58;}
.bar{height:7px;background:var(--bg-3);border-radius:4px;overflow:hidden;} .bar>span{display:block;height:100%;background:#1f6feb;}
.grp{color:#58a6ff;} th.rsgrp{border-left:1px solid var(--line-2);} td.rsgrp{border-left:1px solid var(--line-2);}
.dttool{display:flex;gap:8px;align-items:center;margin:6px 0;flex-wrap:wrap}
.dtf{flex:1;min-width:120px;background:var(--bg-1);border:1px solid var(--line-2);color:var(--ink);padding:6px 10px;border-radius:7px;font-size:13px}
.dtx{background:#238636;border:none;color:#fff;padding:6px 12px;border-radius:7px;font-weight:700;font-size:12px;cursor:pointer}
.dtcount{color:var(--ink-2);font-size:12px}
table.dt thead th{cursor:pointer;user-select:none;position:sticky;top:0;background:var(--bg-1);z-index:1}
table.dt thead th.sorta::after{content:" ▲"} table.dt thead th.sortd::after{content:" ▼"}
tr.dt-hide{display:none!important}
/* D33d — strategy thesis badge (stamped on every board) + strategy hub cards */
.sbadge{display:flex;align-items:flex-start;gap:9px;border-radius:9px;padding:9px 12px;margin-bottom:12px;border:1px solid var(--line-2);font-size:12px;}
.sbadge .tag{font-size:10px;font-weight:800;letter-spacing:.5px;white-space:nowrap;padding:2px 8px;border-radius:8px;}
.sbadge .th{color:var(--ink);opacity:.92;line-height:1.35;}
.sb-POS{background:#0d1f33;border-color:#1f4d7a;} .sb-POS .tag{background:#1f6feb;color:#fff;}
.sb-RS{background:#0f2417;border-color:#1f6f3a;} .sb-RS .tag{background:#2ea043;color:#fff;}
.sb-QUAL{background:#241f0d;border-color:#5a4a1f;} .sb-QUAL .tag{background:#bb8009;color:#fff;}
.scards{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:6px;}
@media(min-width:560px){.scards{grid-template-columns:1fr 1fr 1fr;}}
.scard{display:block;background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;padding:12px;color:inherit;text-decoration:none;border-top:3px solid var(--line-2);}
.scard.sc-POS{border-top-color:#1f6feb;} .scard.sc-RS{border-top-color:var(--cat-rs);} .scard.sc-QUAL{border-top-color:#bb8009;}
.scard.sc-CPR{border-top-color:#8957e5;}
.scard .nm{font-weight:800;font-size:14px;} .scard .th{color:var(--ink-2);font-size:11px;margin:4px 0 8px;line-height:1.3;}
.scard .ct{font-size:13px;font-weight:700;color:var(--ink);} .scard .ct small{color:var(--ink-2);font-weight:400;}
/* CPR (Structure pillar, D53) — pattern glyphs, ★ conviction tier, D·W·M strip */
.cpg{font-weight:800;font-size:12px;} .cp-bull{color:var(--up);} .cp-bear{color:var(--down);} .cp-none{color:var(--ink-3);}
.cp-tier{color:#e3b341;font-weight:800;letter-spacing:1px;white-space:nowrap;}
.cprstrip{display:inline-flex;gap:3px;vertical-align:middle;}
.cprstrip .c{min-width:30px;padding:2px 4px;border-radius:4px;background:var(--bg-2);border:1px solid var(--bg-3);display:flex;flex-direction:column;align-items:center;line-height:1.15;}
.cprstrip .c .w{font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;}
.cprstrip .c small{font-size:7px;opacity:.6;font-weight:600;}
.cprstrip .c.nw{background:#10241a;border-color:#1f6f3a;} .cprstrip .c.nw .w{color:#7ee787;}
.cprstrip .c.up{box-shadow:inset 0 -2px 0 var(--up);} .cprstrip .c.dn{box-shadow:inset 0 -2px 0 var(--down);}
.cprpanel{background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;padding:12px;margin-bottom:6px;}
.cprpanel table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums;}
.cprpanel th,.cprpanel td{text-align:right;padding:5px 8px;border-bottom:1px solid var(--bg-3);white-space:nowrap;}
.cprpanel th:first-child,.cprpanel td:first-child{text-align:left;}
.cprverdict{margin-top:9px;font-size:13px;color:var(--ink);line-height:1.4;}
.tabbar{display:flex;gap:6px;margin:4px 0 12px;border-bottom:1px solid var(--line-2);}
.tabbar a{padding:7px 14px;font-size:13px;font-weight:700;color:var(--ink-2);text-decoration:none;border-bottom:2px solid transparent;}
.tabbar a.on{color:var(--ink);border-bottom-color:#8957e5;}
/* D54 — full-bleed data workspace with a COMFORTABLE gutter (D-UI-10) */
.wrap.wide{max-width:1500px;margin:0 auto;padding:14px clamp(12px,4vw,56px);}
/* D54 — frozen-pane data grid: ONE scroll viewport owns BOTH axes so the header
   band AND the Symbol column stay fixed while scrolling down AND across. */
.scrwrap{overflow:auto;max-height:calc(100vh - 230px);border:1px solid var(--line-2);border-radius:10px;background:var(--bg-1);-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
table.scr{width:100%;min-width:max-content;border-collapse:separate;border-spacing:0;font-size:12px;table-layout:fixed;}
table.scr th,table.scr td{white-space:nowrap;border-bottom:1px solid #1c2128;padding:6px 10px;text-align:right;}
table.scr th.l,table.scr td.l{text-align:left;}
table.scr td.num,table.scr th.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum";}
table.scr td.bold{font-weight:700;}
table.scr td.gsep,table.scr th.gsep{border-left:1px solid #262c36;}
table.scr thead tr.sgrp th{position:sticky;top:0;z-index:3;height:26px;background:var(--bg-1);color:var(--ink-3);font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;text-align:left;border-bottom:1px solid var(--line-2);border-left:1px solid #262c36;padding:0 10px;}
table.scr thead tr.scol th{position:sticky;top:26px;z-index:3;background:var(--bg-1);color:var(--ink-2);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--line-2);cursor:pointer;padding:6px 10px;}
table.scr .fz{position:sticky;left:0;z-index:2;background:var(--bg-1);border-right:1px solid var(--line-2);text-align:left;}
table.scr thead tr.sgrp th.fz,table.scr thead tr.scol th.fz{z-index:6;}
table.scr tbody .fz{font-weight:700;}
table.scr tbody tr:nth-child(even) td{background:rgba(255,255,255,.014);}
table.scr tbody tr:nth-child(even) td.fz{background:#0f151b;}
table.scr tbody tr:hover td{background:#1c2230!important;}
.scrwrap.scrolled table.scr .fz{box-shadow:8px 0 12px -6px rgba(0,0,0,.55);}
.h-pos3{background:rgba(var(--up-rgb),.22)!important;} .h-pos2{background:rgba(var(--up-rgb),.13)!important;} .h-pos1{background:rgba(var(--up-rgb),.06)!important;}
.h-neg1{background:rgba(var(--down-rgb),.07)!important;} .h-neg2{background:rgba(var(--down-rgb),.14)!important;} .h-neg3{background:rgba(var(--down-rgb),.22)!important;}
/* column-group hide = ONE class on the table (single reflow, no per-cell JS) */
table.scr.hide-conv .g-conv,table.scr.hide-pos .g-pos,table.scr.hide-mep .g-mep,table.scr.hide-key .g-key,table.scr.hide-char .g-char,table.scr.hide-rs .g-rs,table.scr.hide-cpr .g-cpr,table.scr.hide-cci .g-cci,table.scr.hide-themes .g-themes,table.scr.hide-qual .g-qual,table.scr.hide-ctx .g-ctx{display:none;}
/* LAG FIX (the Nifty-500 toggle hang): with table-layout:fixed the columns no longer
   re-solve their widths from 498 rows of content on every toggle. A JS-built <colgroup>
   gives each column an explicit width + tags it with its group; collapsing the col to 0
   here removes the gap a hidden group would otherwise leave under fixed layout. */
table.scr.hide-conv col.cg-conv,table.scr.hide-pos col.cg-pos,table.scr.hide-mep col.cg-mep,table.scr.hide-key col.cg-key,table.scr.hide-char col.cg-char,table.scr.hide-rs col.cg-rs,table.scr.hide-cpr col.cg-cpr,table.scr.hide-cci col.cg-cci,table.scr.hide-themes col.cg-themes,table.scr.hide-qual col.cg-qual,table.scr.hide-ctx col.cg-ctx{width:0!important;}
/* CPR-confirmed gate: show only rows carrying a CPR reversal tier (one class) */
table.scr.cpr-only tbody tr:not(.has-cpr){display:none;}
/* D54 Phase 2 — "the instrument": inline static micro-viz readouts (D-UI-16).
   The viz sits BESIDE the kept sortable numeric columns (D-UI-1). */
.mv{vertical-align:middle;display:inline-block;}
table.scr td.inst{padding:3px 8px 3px 10px;}
.kt-in{color:var(--series-4);} .kt-ext{color:#d29922;} .kt-disc{color:#58a6ff;}
/* Row windowing (perf hand-off Step 2) — the desk confirmed the 498-row × 4-SVG
   grid scrolls heavy, so the browser now skips layout+paint of OFF-SCREEN rows.
   `contain-intrinsic-size:auto` makes it REMEMBER each row's real size once seen,
   so the scrollbar stays stable. The column-width jitter that first made me defer
   this is killed by pinning the frozen Symbol column + flooring numeric cells, so
   widths can't shift as rows page in. All additive CSS, reversible. */
/* NB: exclude the virtualizer's .vspacer rows — content-visibility on a tall
   off-screen spacer can collapse its height and drift the scroll. Data rows keep
   it (harmless once virtualized; a cushion if the virtualizer ever safety-nets). */
table.scr tbody tr:not(.vspacer){content-visibility:auto;contain-intrinsic-size:auto 34px;}
table.scr .fz{width:116px;min-width:116px;max-width:116px;overflow:hidden;text-overflow:ellipsis;}
table.scr td.num,table.scr th.num{min-width:46px;}

/* uk-tokens v1 */
:root{
  /* ── surfaces ── */
  --bg-0:#070a10; --bg-1:#0b0f17; --bg-2:#111824; --bg-3:#18222f; --bg-4:#202d3d;
  /* ── hairlines ── */
  --line:#1c2937; --line-2:#27384a; --line-3:#33485f;
  /* ── ink ── */
  /* WCAG-AA (L2 W3 a11y): --ink-3 was #5c6f84 = 3.44:1 on the card bg → FAILS AA 4.5 for
     normal text, and it carries eyebrows / captions / table-th / .mut site-wide. Lifted to
     #7e90a8 = 5.5:1 on bg-2, 5.9:1 on bg-1, 4.9:1 on bg-3 → clears AA on every surface while
     staying a clearly-muted tertiary (ink-2 #9bb0c6 = 8.6:1 remains the distinct step above). */
  --ink:#eaf1f9; --ink-2:#9bb0c6; --ink-3:#7e90a8; --ink-4:#3c4a5c;
  /* ── accents + semantics ── */
  --accent:#4d9dff; --accent-2:#6db3ff; --accent-cy:#34e0d6; --accent-dim:rgba(77,157,255,.14);
  --up:#3fd486; --up-dim:rgba(63,212,134,.13);
  --down:#ff6a7a; --down-dim:rgba(255,106,122,.13);
  --warn:#f6b73c; --warn-dim:rgba(246,183,60,.14);
  --cred:#b18cff; --cred-dim:rgba(177,140,255,.15);
  /* ── value RGB triples (colour-alignment Phase 0) — build ANY-alpha tint from ONE source,
     e.g. rgba(var(--up-rgb),.08), so heat-cells / zone fills / chart tints stop re-hardcoding
     the legacy RGB (63,185,80 / 248,81,73 / 31,111,235). Values == --up/--down/--warn. ── */
  --up-rgb:63,212,134; --down-rgb:255,106,122; --warn-rgb:246,183,60;
  /* ── status / health — present/absent/enabled badges. A role SEPARATE from the value
     contract (a green "ON" is not a "+x%"); aliased to the value hues but NAMED distinctly so
     the colour gate + future audits never conflate a status pill with a directional verdict. ── */
  --ok:#3fd486; --off:#ff6a7a; --neu:#f6b73c;
  /* ── foreground ON an --accent fill (primary buttons, active pills) — was the orphan #06121f. ── */
  --on-accent:#06121f;
  /* ── categorical scorecard identity — a DISTINCT hue (cyan), NEVER a value green, so the RS
     scorecard border (.sc-RS) can't read as "bullish". Gives the 4 cards 4 distinct hues
     (POS=accent / RS=cat-rs / QUAL=warn / CPR=cred). Decouples category from the value contract. ── */
  --cat-rs:#34e0d6;
  /* ── categorical / chart-series identity (colour-alignment Phase 3). Role #2 (D-COL-1):
     multi-series + indicator-identity hues that must NEVER be --up/--down even when green/red.
     Values MATCH the shipped chart palettes (CMP_COLORS + the stock-chart `C` grammar), so
     seeding the canvas colour objects from getComputedStyle(:root) is colour-preserving. The
     `--series-*` ramp is the canonical categorical palette (compare overlays / rotation sectors);
     the `--chart-*` set names the indicator signatures the semantic tokens don't cover. ── */
  --accent-orange:#f0883e;                 /* VWAP / MACD-signal / DISTRIB / Launchpad — categorical orange */
  --series-1:#39c5cf; --series-2:#f0883e; --series-3:#a371f7; --series-4:#56d364;
  --series-5:#db61a2; --series-6:#4d9dff; --series-7:#d29922; --series-8:#f778ba;
  --chart-line:#1f6feb;                    /* price line / area primary */
  --chart-blue:#58a6ff;                    /* delivery / wolfe / macd */
  --chart-dvpt:#d29922;                    /* DVPT footprint amber */
  --chart-idle:#30506b;                    /* idle DVPT marker (muted) */
  --chart-vol:#3b5168;                     /* volume histogram (recessive grey-blue) */
  --chart-dval:#2ea043;                    /* delivered-value bar — categorical green, NOT --up */
  --chart-rsi:#d2a8ff;                     /* RSI line (lilac) */
  /* ── type scale (tabular instrument feel) ── */
  --fs-2xs:10.5px; --fs-xs:11.5px; --fs-sm:12.5px; --fs-md:14px; --fs-lg:16px;
  --fs-xl:19px; --fs-2xl:23px; --fs-3xl:30px;
  --lh:1.5; --lh-tight:1.25;
  --fw-med:500; --fw-semi:600; --fw-bold:700;
  /* ── spacing scale ── */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:22px; --sp-6:30px; --sp-7:44px; --sp-8:64px;
  --gutter:20px;            /* page side padding — shrinks on mobile (see base) */
  --row-pad:10px;          /* native table/card row padding — driven by density */
  --grid-pad:6px;          /* dense frozen-grid (table.scr / .uk-t) vertical padding — density */
  /* ── radius ── */
  --r-xs:5px; --r-sm:8px; --r:12px; --r-lg:18px; --r-round:999px;
  /* ── elevation ── */
  --e-1:0 1px 2px rgba(0,0,0,.30); --e-2:0 6px 18px rgba(0,0,0,.34); --e-3:0 14px 36px rgba(0,0,0,.46);
  --glass:inset 0 1px 0 rgba(255,255,255,.045); --shadow:var(--e-3);
  /* ── motion ── */
  --t:170ms cubic-bezier(.2,.7,.2,1); --t-fast:110ms cubic-bezier(.2,.7,.2,1);
  /* ── z-index scale ── */
  --z-sticky:20; --z-nav:30; --z-overlay:9998; --z-toast:10000;
  /* ── fonts ── */
  --font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Inter,'Helvetica Neue',Arial,sans-serif; --mono:'SF Mono',ui-monospace,'JetBrains Mono','Cascadia Code',Menlo,Consolas,monospace;
}

/* ── density: compact shrinks spacing + row padding + base size (comfortable = default) ── */
[data-density="compact"]{
  --sp-3:9px; --sp-4:12px; --sp-5:16px; --sp-6:22px;
  --row-pad:6px; --grid-pad:3px; --fs-md:13px; --fs-sm:12px; --gutter:14px;
}

/* ── base / reset (scoped so it never restyles a legacy page that isn't opted in) ── */
.uk,.uk *,body.uk-skin,body.uk-skin *{box-sizing:border-box}
.uk,body.uk-skin{
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  font-feature-settings:'tnum' 1,'cv01' 1; text-rendering:optimizeLegibility;
}
.uk .num,body.uk-skin .num,.uk-num{font-variant-numeric:tabular-nums;font-family:var(--mono)}

/* ── accessibility primitives ── */
.uk-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.uk-skip{position:fixed;left:-999px;top:0;z-index:var(--z-toast);background:var(--accent);
  color:#06121f;font:600 13px var(--font);padding:9px 16px;border-radius:0 0 10px 0;text-decoration:none}
.uk-skip:focus{left:0}
.uk :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible,
body.uk-skin :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
@media (prefers-reduced-motion:reduce){
  .uk *,.uk *::before,.uk *::after,body.uk-skin *,body.uk-skin *::before,body.uk-skin *::after{
    animation-duration:.001ms!important; animation-iteration-count:1!important;
    transition-duration:.001ms!important; scroll-behavior:auto!important}
}

/* evidence-chip colour per tag; rationale in ui_tokens.py beside _TOKENS_CSS */
:root .epi-observed{--epi-c:#3fb950}
:root .epi-derived{--epi-c:#58a6ff}
:root .epi-inferred{--epi-c:#d29922}
:root .epi-unknowable{--epi-c:#8b949e}

/* ── responsive gutter (mobile tightens the page edges) ── */
@media (max-width:640px){ :root{ --gutter:13px } }

/* ── density toggle (universal chrome — lives in the foundation so it styles on BOTH
   the native .uk-top and the legacy .v2util; the bars visually tighten when compact) ── */
.uk-denstoggle{display:inline-flex;flex-direction:column;justify-content:center;gap:3px;
  width:30px;height:30px;padding:0 7px;border:1px solid var(--line-2);background:var(--bg-1);
  border-radius:var(--r-sm);cursor:pointer;transition:var(--t);flex:none}
.uk-denstoggle:hover{border-color:var(--accent)}
.uk-denstoggle i{display:block;height:2px;background:var(--ink-3);border-radius:1px;transition:var(--t)}
.uk-denstoggle.on{gap:1.5px}
.uk-denstoggle.on i{background:var(--accent)}
.uk-top .uk-denstoggle{margin-left:2px}

/* ── print: any page prints as a clean light document — a leave-behind (D-PITCH-2).
   L2 W3: deepened — A4 page box with margins + a footer page counter, light-flip the whole
   palette, hide every interactive-only control, keep tables/cards intact across page breaks,
   and let value-colour (green/red) survive so a printed dossier still reads the contract. ── */
@page{margin:16mm 14mm 18mm}
@media print{
  :root{--bg-0:#fff;--bg-1:#fff;--bg-2:#fff;--bg-3:#f4f6f9;--bg-4:#eef1f5;
    --line:#c4ccd4;--line-2:#aab4be;--line-3:#9aa6b2;--ink:#0b0f17;--ink-2:#33414e;--ink-3:#5a6775;
    --shadow:none;--glass:none;--e-1:none;--e-2:none;--e-3:none}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .uk,body.uk-skin,body{background:#fff !important;color:#0b0f17}
  /* hide all chrome + interactive-only controls (toggles, filters, search, chart fullscreen) */
  .uk-top,.uk-sub,.v2bar,.v2subnav,.uk-cmdk,.uk-denstoggle,.uk-skip,.uk-seg,.uk-switch,
  .fbar,.fbtn,.search,.hsearch,.dtf,.tabbar,
  body.uk-skin header,#cmdk-ov,.uk-chart .exp{display:none !important}
  .uk-card,.uk-tw,.card,.scrwrap,.cprpanel,.maj,.kpi .box,.uk-stat,.cov-pane{box-shadow:none !important;
    border-color:#c4ccd4 !important;break-inside:avoid}
  h1,h2,.uk-h1,.uk-eyebrow{break-after:avoid}
  .uk-page,.wrap,.wrap.wide{max-width:none !important;padding:0 !important}
  a{color:#0b0f17 !important;text-decoration:none}
  /* tables: repeat the header on every printed page + visible hairlines + no clip */
  table{border-collapse:collapse}
  thead{display:table-header-group}
  tr,td,th{break-inside:avoid}
  th{border-bottom:1px solid #aab4be !important}
  /* value-colour contract survives print (a printed verdict must still read up/down) */
  .pos,.up,.uk-pill.up{color:#137a43 !important}
  .neg,.down,.uk-pill.down{color:#b22433 !important}
  /* a page-number footer so a multi-page leave-behind is paginated */
  body::after{content:"patearn — descriptive evidence, point-in-time; not investment advice";
    position:fixed;bottom:-13mm;left:0;right:0;text-align:center;font-size:8.5px;color:#5a6775}
}

/* uk-components v1 */
/* ── button ── */
.uk-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font:var(--fw-semi) var(--fs-sm)/1 var(--font);
  cursor:pointer;border:1px solid var(--line-2);background:var(--bg-2);color:var(--ink-2);
  border-radius:var(--r-sm);padding:9px 14px;transition:var(--t);white-space:nowrap;text-decoration:none}
.uk-btn:hover{border-color:var(--line-3);color:var(--ink);background:var(--bg-3)}
.uk-btn:active{transform:translateY(.5px)}
.uk-btn.primary{background:var(--accent);border-color:var(--accent);color:#06121f}
.uk-btn.primary:hover{background:var(--accent-2);border-color:var(--accent-2)}
.uk-btn.ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.uk-btn.ghost:hover{background:var(--bg-2);color:var(--ink)}
.uk-btn.danger{color:var(--down);border-color:rgba(255,106,122,.4)}
.uk-btn.danger:hover{background:var(--down-dim);color:var(--down)}
.uk-btn.sm{padding:6px 10px;font-size:var(--fs-xs)}
.uk-btn.lg{padding:11px 18px;font-size:var(--fs-md)}
.uk-btn[disabled],.uk-btn.disabled{opacity:.45;pointer-events:none}
.uk-btn .ic{font-size:1.1em;line-height:1}

/* ── form field ── */
.uk-field{display:flex;flex-direction:column;gap:6px}
.uk-field>label,.uk-label{font:var(--fw-med) var(--fs-xs)/1 var(--font);color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.5px}
.uk-input,.uk-select,.uk-textarea{font:var(--fs-md)/1.3 var(--font);color:var(--ink);background:var(--bg-1);
  border:1px solid var(--line-2);border-radius:var(--r-sm);padding:9px 11px;transition:var(--t);width:100%}
.uk-input:hover,.uk-select:hover,.uk-textarea:hover{border-color:var(--line-3)}
.uk-input:focus,.uk-select:focus,.uk-textarea:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-dim)}
.uk-input::placeholder,.uk-textarea::placeholder{color:var(--ink-4)}
.uk-select{appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);
  background-position:calc(100% - 16px) 17px,calc(100% - 11px) 17px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:30px}

/* ── tabs (canonical underline tabs) ── */
.uk-tabs{display:flex;gap:2px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.uk-tab{font:var(--fw-semi) var(--fs-sm)/1 var(--font);cursor:pointer;background:none;border:0;color:var(--ink-3);
  padding:10px 15px;border-bottom:2px solid transparent;margin-bottom:-1px;transition:var(--t)}
.uk-tab:hover{color:var(--ink-2)}
.uk-tab.on{color:var(--ink);border-bottom-color:var(--accent)}
.uk-pane{display:none}.uk-pane.on{display:block}

/* ── tooltip (CSS-only, [data-tip]) ── */
.uk-tip{position:relative}
.uk-tip::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 7px);transform:translateX(-50%) translateY(3px);
  background:var(--bg-4);color:var(--ink);font:var(--fw-med) var(--fs-xs)/1.35 var(--font);white-space:nowrap;
  padding:6px 9px;border-radius:var(--r-xs);border:1px solid var(--line-2);box-shadow:var(--e-2);
  opacity:0;pointer-events:none;transition:var(--t);z-index:var(--z-toast)}
.uk-tip:hover::after,.uk-tip:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── skeleton + spinner (loading) ── */
.uk-skel{background:linear-gradient(100deg,var(--bg-2) 30%,var(--bg-3) 50%,var(--bg-2) 70%);
  background-size:200% 100%;animation:uk-shim 1.3s linear infinite;border-radius:var(--r-sm);height:14px}
@keyframes uk-shim{to{background-position:-200% 0}}
.uk-spin{width:18px;height:18px;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--accent);
  display:inline-block;animation:uk-rot .7s linear infinite;vertical-align:middle}
@keyframes uk-rot{to{transform:rotate(360deg)}}

/* ── empty / error states ── */
.uk-empty,.uk-error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  text-align:center;padding:46px 20px;color:var(--ink-3)}
.uk-empty .ic,.uk-error .ic{font-size:30px;opacity:.7;line-height:1}
.uk-empty .ti,.uk-error .ti{font:var(--fw-semi) var(--fs-lg) var(--font);color:var(--ink-2)}
.uk-empty .hint,.uk-error .hint{font-size:var(--fs-sm);max-width:380px;line-height:1.5}
.uk-error .ti{color:var(--down)}

/* ── inline note / toast (info · warn · down · up) ── */
.uk-note{display:flex;gap:9px;align-items:flex-start;border:1px solid var(--line-2);background:var(--bg-2);
  border-radius:var(--r-sm);padding:11px 13px;font-size:var(--fs-sm);color:var(--ink-2);line-height:1.5}
.uk-note .d{width:7px;height:7px;border-radius:50%;background:var(--accent);margin-top:5px;flex:none;box-shadow:0 0 7px var(--accent)}
.uk-note.warn{border-color:rgba(246,183,60,.4)} .uk-note.warn .d{background:var(--warn);box-shadow:0 0 7px var(--warn)}
.uk-note.down{border-color:rgba(255,106,122,.4)} .uk-note.down .d{background:var(--down);box-shadow:0 0 7px var(--down)}
.uk-note.up{border-color:rgba(63,212,134,.4)} .uk-note.up .d{background:var(--up);box-shadow:0 0 7px var(--up)}

/* ── kbd · divider · progress · tag ── */
.uk-kbd{font:var(--fs-xs) var(--mono);background:var(--bg-3);border:1px solid var(--line-2);
  border-radius:var(--r-xs);padding:1px 6px;color:var(--ink-2)}
.uk-div{height:1px;background:var(--line);border:0;margin:var(--sp-4) 0}
.uk-div-v{width:1px;align-self:stretch;background:var(--line)}
.uk-prog{height:7px;background:var(--bg-1);border:1px solid var(--line);border-radius:var(--r-round);overflow:hidden}
.uk-prog>span{display:block;height:100%;background:var(--accent);border-radius:var(--r-round);transition:width var(--t)}
.uk-tag{display:inline-flex;align-items:center;gap:5px;font:var(--fw-med) var(--fs-xs) var(--font);
  background:var(--bg-3);color:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-xs);padding:2px 8px}

/* ── switch (the density toggle, and any boolean) ── */
.uk-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:var(--fs-sm);color:var(--ink-2);user-select:none}
.uk-switch .tk{width:34px;height:19px;border-radius:var(--r-round);background:var(--bg-3);border:1px solid var(--line-2);
  position:relative;transition:var(--t);flex:none}
.uk-switch .tk::after{content:"";position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;
  background:var(--ink-2);transition:var(--t)}
.uk-switch.on .tk{background:var(--accent-dim);border-color:var(--accent)}
.uk-switch.on .tk::after{transform:translateX(15px);background:var(--accent)}

/* ── responsive grid helpers ── */
.uk-cols{display:grid;gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.uk-cols-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}


/* R-4 · the archive's one door back to the current site. Muted by design: it must be
   findable without competing with the page, and it is the only modern link here. */
.uk-out{font-weight:700;color:var(--accent,#58a6ff)}
.uk-out:hover,.uk-out:focus-visible{text-decoration:underline}
/* uk-skin v1 */
/* ── palette anchor: the instrument background + ink ── */
body.uk-skin{
  background:
    radial-gradient(1100px 560px at 82% -12%, rgba(77,157,255,.07), transparent 60%),
    radial-gradient(860px 480px at -8% 8%, rgba(52,224,214,.05), transparent 55%),
    var(--bg-1) !important;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-feature-settings:'tnum' 1,'cv01' 1;
}
/* ── header / chrome ──
   Lane M1: the legacy two-row <header> (hrow1/hrow2/hrow3, the .v2bar nav, the brand
   logo, .hback, .uk-trustlink) is REPLACED at runtime by the native single-row ui_kit
   topbar (`.uk-top` + `.uk-sub`), which is styled by ui_kit.css() (injected after this
   block, so its top-level `.uk-*` rules win). No header rules are needed here anymore —
   the few defensive remnants below only matter if the header swap fell back to legacy
   (a <header> still present): keep the chrome dark + the back chip on-brand. */
body.uk-skin header{
  background:linear-gradient(180deg,rgba(17,24,36,.92),rgba(11,15,23,.66));
  border-bottom:1px solid var(--line);backdrop-filter:blur(12px);
}
body.uk-skin .hback{border:1px solid var(--line-2);color:var(--ink-2);border-radius:8px}
body.uk-skin .hback:hover{border-color:var(--accent);background:var(--bg-2)}
/* M1 FOLLOW-UP (caught in review): two legacy base rules leaked onto the new unified
   topbar's <nav class="uk-nav">, because they target the bare `nav`/`nav a` elements:
     nav   { position:fixed; bottom:0; left:0; right:0 }   (the old mobile bottom-bar)
     nav a { flex:1 1 0; text-align:center }                (the old justified tab row)
   → the fixed nav was lifted out of the header flex flow and overlaid the logo + search,
   and the tabs stretched edge-to-edge. Neutralise both for the topbar nav so the logo
   (left) + tabs (clustered) + search (right) lay out exactly like the native pages. */
body.uk-skin .uk-top .uk-nav{position:static;bottom:auto;left:auto;right:auto;background:none;border-top:0}
body.uk-skin .uk-top .uk-nav a{flex:0 0 auto;text-align:initial}
/* ── 2026-08-19 (D488): the SAME leak, six more navs, found by browser geometry not review.
   The fix above was scoped to one instance; the bare `nav{}` rule keeps hijacking every other
   semantic <nav> in the classic estate — `sr-rail`, `wsnav`, `pv3-navrail`, `pv3-dock-tabs`,
   `pv3-dests`, `pv3-crumbs`. Measured on /dash/strategy-ref: its tab nav was `position:fixed`
   at x=0 w=1280, so it ignored `#uk-main`'s 214px margin and sat UNDER the fixed left rail —
   three tabs (Overview, DVPT, MEP) unclickable. `nav a{flex:1}` had also forced them to an
   identical 69px.

   Scoped to `nav[class]` on purpose. The rule was written for a CLASSLESS mobile bottom-bar
   (`nav a .ic`) that is rendered nowhere in this repo — it has no owner left. Any nav that
   carries a class is a real component and must never be pinned to the viewport bottom. Only
   the POSITIONING leak is reset broadly; `display` is deliberately untouched, because
   `.uk-nav` legitimately wants the flex the bare rule happens to give it. */
body.uk-skin nav[class]{position:static;bottom:auto;left:auto;right:auto}
/* `.sr-rail` is a "·"-separated prose row, not a tab strip: it needs the flex leak undone too. */
body.uk-skin nav.sr-rail{display:block;background:none;border-top:0}
body.uk-skin nav.sr-rail a{flex:0 0 auto;text-align:initial}
/* ── cards & boxes ── */
body.uk-skin .card,
body.uk-skin .kpi .box,
body.uk-skin .cprpanel,
body.uk-skin .scard,
body.uk-skin .maj,
body.uk-skin .chip{
  background:var(--bg-2);border:1px solid var(--line);border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
body.uk-skin .maj{border-left:3px solid var(--accent)}
body.uk-skin .scard{border-top:3px solid var(--line)}
/* Scorecard category borders — CATEGORICAL identity, via tokens (not raw hex). sc-RS was
   #3fd486 (== the value --up), so a category read as "bullish" AND a P4 remap-retire would
   bake that miscolor in; re-pointed to --cat-rs (a distinct category-green ≠ --up). */
body.uk-skin .scard.sc-POS{border-top-color:var(--accent)} body.uk-skin .scard.sc-RS{border-top-color:var(--cat-rs)}
body.uk-skin .scard.sc-QUAL{border-top-color:var(--warn)} body.uk-skin .scard.sc-CPR{border-top-color:var(--cred)}
body.uk-skin .kpi .num,body.uk-skin .scard .ct,body.uk-skin .maj .nm{color:var(--ink)}
body.uk-skin .kpi .lbl,body.uk-skin .scard .th,body.uk-skin .maj .rr,body.uk-skin .sub,body.uk-skin .ghdr{color:var(--ink-2)}
body.uk-skin h2,body.uk-skin .scard .nm{color:var(--ink)}
/* ── tables (colour only; layout untouched) ── */
body.uk-skin th{color:var(--ink-3);border-bottom:1px solid var(--line-2)}/* AA: was #5c6f84 (3.4:1) */
body.uk-skin td{border-bottom:1px solid var(--line)}
body.uk-skin .sym{color:var(--ink)}
/* ── semantic ink ── */
body.uk-skin .pos{color:var(--up)} body.uk-skin .neg{color:var(--down)} body.uk-skin .mut{color:var(--ink-3)}/* AA */
body.uk-skin .grp{color:var(--accent)}
/* ── WCAG-AA (L2 W3): legacy classes hardcoding the too-dark greys #6e7681 (4.0:1) /
   #5f7488 (3.8:1) in the FROZEN bodies — caught here by class so they clear AA without
   editing dashboard.py/stock_chart.py. Mapped to the AA-safe --ink-3 (#7e90a8). Inline
   style="color:…" on a few chart-control labels (stock_chart.py) can't be reached by a
   class rule → flagged to L3. ── */
body.uk-skin .nglat .lbl,body.uk-skin .snap i,body.uk-skin .subnav a,body.uk-skin .add,
body.uk-skin .cp-none,body.uk-skin .trow .tb,body.uk-skin .tchip.more{color:var(--ink-3)}
/* ── empty / loading / error states → the polished native system look ──
   L2 Wave2 (state polish): legacy no-data blocks render a bare left-aligned
   `<div class="empty">No data…</div>` that reads like a broken fragment. Give the legacy
   `.empty` the native `uk-empty` treatment — centered column, a muted ○ glyph above the
   message, generous padding — so a no-data legacy page reads INTENTIONAL, matching the
   native ui_components.empty. (The full uk-empty/uk-error/uk-note/uk-skel/uk-spin system is
   now injected site-wide via skin_css(), so frozen bodies can also emit native states.) */
body.uk-skin .empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;text-align:center;color:var(--ink-3);padding:46px 20px;font-size:var(--fs-md);line-height:1.6}
body.uk-skin .empty::before{content:"\25CB";font-size:30px;opacity:.55;line-height:1;margin-bottom:2px}
body.uk-skin .empty b{color:var(--ink-2);font-weight:600}
/* legacy inline status/error helpers map to the native note look */
body.uk-skin .errbox,body.uk-skin .warnbox{display:flex;gap:9px;align-items:flex-start;
  border:1px solid var(--line-2);background:var(--bg-2);border-radius:var(--r-sm);padding:11px 13px;
  font-size:var(--fs-sm);color:var(--ink-2);line-height:1.5}
/* ── inputs / search / filter chips ── */
body.uk-skin .search input,body.uk-skin .hsearch input,body.uk-skin .dtf{
  background:var(--bg-1);border:1px solid var(--line-2);color:var(--ink);border-radius:8px}
body.uk-skin .search button{background:var(--accent);color:var(--on-accent)}
/* generic bare form controls (W4 sweep): _BASE_CSS gives bare input/select/button the OLD
   palette (#0d1117 bg, #30363d line, #21262d button, #e6edf3/#c9d1d9 ink). Retint to tokens
   so any legacy page's form controls (growth sort/filter, etc.) match. .fbtn / .search keep
   their own rules above (more specific). */
body.uk-skin input,body.uk-skin select,body.uk-skin textarea{
  background:var(--bg-1);border-color:var(--line-2);color:var(--ink)}
body.uk-skin button:not(.fbtn):not(.uk-cmdk):not([data-density-toggle]){
  background:var(--bg-2);border-color:var(--line-2);color:var(--ink-2)}
body.uk-skin .fbtn{background:var(--bg-2);border:1px solid var(--line);color:var(--ink-2);border-radius:14px}
body.uk-skin .fbtn.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
/* ── theme chips ── */
body.uk-skin .tchip{background:#102234;color:#7fc0ff;border:1px solid #1d3a55}
body.uk-skin .tchip:hover{background:#1d3a55;color:#cfe8ff}
/* ── banners (STATUS role, D-COL #5) — via tokens, matching dashboard._BASE_CSS's .b-on/.b-off
   token form (colour identical; the border literals #1f6f3a/#8f1f1f/#5a4a1f had no exact token
   → expressed as the value-RGB tint, same as the body). ── */
body.uk-skin .b-on{background:var(--up-dim);color:var(--ok);border:1px solid rgba(var(--up-rgb),.35)}
body.uk-skin .b-off{background:var(--down-dim);color:var(--off);border:1px solid rgba(var(--down-rgb),.35)}
body.uk-skin .b-neu{background:var(--warn-dim);color:var(--neu);border:1px solid rgba(var(--warn-rgb),.35)}
/* ── strategy thesis badge ── */
body.uk-skin .sbadge{border:1px solid var(--line)}
body.uk-skin .sbadge .th{color:var(--ink-2)}
/* ── tab bars ── */
body.uk-skin .tabbar{border-bottom:1px solid var(--line)}
body.uk-skin .tabbar a{color:var(--ink-2)}
body.uk-skin .tabbar a.on{color:var(--ink);border-bottom-color:var(--cred)}
/* ── the frozen-pane data grid — COLOUR ONLY (sticky/z-index left exactly as-is) ── */
body.uk-skin .scrwrap{background:var(--bg-1);border:1px solid var(--line);border-radius:12px}
body.uk-skin table.scr th,body.uk-skin table.scr td{border-bottom:1px solid #161f2b}
body.uk-skin table.scr thead tr.sgrp th{background:var(--bg-3);color:var(--ink-3);border-bottom:1px solid var(--line-2);border-left:1px solid var(--line)}/* AA */
body.uk-skin table.scr thead tr.scol th{background:var(--bg-2);color:var(--ink-2);border-bottom:1px solid var(--line-2)}
body.uk-skin table.scr .fz{background:var(--bg-1);border-right:1px solid var(--line)}
body.uk-skin table.scr thead tr.scol th.fz,body.uk-skin table.scr thead tr.sgrp th.fz{background:var(--bg-3)}
body.uk-skin table.scr tbody tr:nth-child(even) td.fz{background:#0e1620}
body.uk-skin table.scr tbody tr:hover td{background:var(--bg-3) !important}
/* density — the frozen data grid's vertical row padding follows --grid-pad (6px comfortable
   == current, 3px compact). Only the big data grid is density-driven; small tables stay put. */
body.uk-skin table.scr td,body.uk-skin table.scr th{padding-top:var(--grid-pad);padding-bottom:var(--grid-pad)}
/* ════════════════════════════════════════════════════════════════════════════
   Lane L2 — BLEED-THROUGH NEUTRALISATION (the `9def4ff` bug class, generalised).
   `dashboard._BASE_CSS` (on every legacy `_shell` page) carries bare-element rules
   (h2, table, th, td, …). A native ui_kit component (`.uk-card`/`.uk-t`/`.uk-h1`/…)
   dropped onto a reskinned page either loses properties the native rule doesn't
   self-assert (e.g. bare `h2{16px}` shrinks a native card heading) or inherits the
   legacy metric. Verified IN-BROWSER: on /dash/markets an injected uk-card <h2>
   computed 16px vs 21px on the native /dash/coverage reference.
   Fix: re-assert the native `.uk-*` geometry under `body.uk-skin .uk-*` so the
   specificity (0,2,x) outranks every bare element rule — ANY native component on
   ANY reskinned page now renders identically to the native reference, immune to
   present + future bare-element bleed-through. Tokens already inherit (ui_tokens
   is prepended site-wide), so values track the design system, not hardcodes. ──── */
body.uk-skin .uk-h1{font-size:22px;font-weight:600;margin:0 0 2px;letter-spacing:-.2px;color:var(--ink)}
body.uk-skin .uk-card>h2,body.uk-skin .uk-card h2.uk-h2{font-size:21px;margin:.83em 0;color:var(--ink);font-weight:600}
body.uk-skin .uk-card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--glass)}
body.uk-skin .uk-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--ink-3);margin:0 0 11px;display:flex;align-items:center;gap:8px}
body.uk-skin .uk-stat .lbl{font-size:11px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
body.uk-skin .uk-stat .val{font-size:26px;font-weight:600;font-variant-numeric:tabular-nums;font-family:var(--mono);line-height:1;color:var(--ink)}
/* native frozen table: re-assert metrics so bare `table/th/td` cannot fill in. */
body.uk-skin table.uk-t{width:100%;border-collapse:collapse;font-size:13px}
body.uk-skin .uk-t th{background:var(--bg-3);color:var(--ink-3);font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;font-weight:600;text-align:right;padding:var(--row-pad,10px) 13px;border-bottom:1px solid var(--line-2)}
body.uk-skin .uk-t th:first-child,body.uk-skin .uk-t td:first-child{text-align:left}
body.uk-skin .uk-t td{padding:var(--row-pad,10px) 13px;text-align:right;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;color:var(--ink-2)}
body.uk-skin .uk-t td.sym{color:var(--ink);font-weight:600}
body.uk-skin .uk-pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:20px;white-space:nowrap}
body.uk-skin .uk-badge{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;color:var(--ink-3);border:1px solid var(--line-2);border-radius:6px;padding:2px 8px}
body.uk-skin .uk-seg a{padding:6px 13px;font-size:12px}
/* ════════════════════════════════════════════════════════════════════════════
   Lane L2 — DEEPEN the legacy-primitive reskin from COLOUR-only → native GEOMETRY.
   Lane A retinted colour; the structural gap to the native reference (radius /
   spacing / elevation / type-scale) stayed. Re-state the geometry the native
   ui_kit cards/stats use, on the legacy primitives, so a reskinned BODY reads as
   native (not just dark-with-the-right-blue). No layout/sticky/z-index touched on
   the frozen-pane grid (that geometry is sacred); only surface + type. ──────────── */
/* radius + surface only on .card — padding is context-dependent (some .card are compact
   filter/control strips, not content cards) so DON'T force it; let each keep its own. */
body.uk-skin .card{border-radius:var(--r)}
body.uk-skin .maj{border-radius:var(--r);padding:15px 16px}
body.uk-skin .scard{border-radius:var(--r)}
body.uk-skin .kpi .box{border-radius:var(--r-sm);padding:13px 14px}
body.uk-skin .kpi .num{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:600}
body.uk-skin .kpi .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.5px}
body.uk-skin .chip{border-radius:var(--r-sm)}
body.uk-skin h2{font-size:16px;font-weight:600;letter-spacing:-.1px}
/* ── RS hub (rs_section.py `rsh-*`): a self-contained mini-design-system Lane A's skin
   never retinted — it still carries the OLD palette (#161b22 / #30363d / #1f6feb /
   radius 10px). Verified in-browser: rsh-card bg #161b22 vs native #111824. Map every
   rsh primitive to the ui_kit tokens so the RS hub matches the native reference. ──── */
body.uk-skin .rsh-card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);border-top:3px solid var(--accent)}
body.uk-skin .rsh-h,body.uk-skin .rsh-sym{color:var(--ink)}
body.uk-skin .rsh-go{color:var(--accent)}
body.uk-skin .rsh-q,body.uk-skin .rsh-mut,body.uk-skin .rsh-sub2{color:var(--ink-2)}
body.uk-skin .rsh-sec,body.uk-skin .rsh-sub,body.uk-skin .rsh-empty,body.uk-skin .rsh-foot{color:var(--ink-3)}
body.uk-skin .rsh-chip{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink-2)}
body.uk-skin .rsh-bench{border:1px solid var(--line-2);border-radius:var(--r-sm)}
/* ── Markets "Full index bundle" tiles (.ck-tile): another legacy mini-system carrying the
   OLD palette (bg #161b22, border #30363d). Map to ui_kit tokens to match the reference.
   (A few inline-styled tag chips in the same body still hold #21262d/#30363d — inline style,
   not class-reachable; a subtle shade nuance, left to the frozen body / flagged.) ── */
body.uk-skin .ck-tile{background:var(--bg-2);border-color:var(--line)}
body.uk-skin a.ck-tile:hover{border-color:var(--accent)}
/* ── CPR strip cells (.cprstrip .c — the pivot tiles on /dash/cpr + the CPR overlay on
   the dossier): a class-based old-palette holdout found in the W4 full-site sweep
   (bg #161b22). Map to --bg-2; the up/dn semantic ink on them is already retinted. ── */
body.uk-skin .cprstrip .c{background:var(--bg-2)}
/* ── Growth-intent (growth_view.py `gw-*`): another self-contained legacy mini-system
   (like rsh / ck-tile) carrying the OLD palette end-to-end — greys #8b949e/#6e7681,
   line #30363d, blue #1f6feb/#58a6ff, green/red #3fb950/#f85149, ink #c9d1d9. Map every
   gw primitive to the ui_kit tokens; gw-mut/gw-count #6e7681 (4.2:1) also clears WCAG-AA
   via --ink-3. ── */
body.uk-skin .gw-note,body.uk-skin .gw-claim{color:var(--ink-2)}
body.uk-skin .gw-mut,body.uk-skin .gw-count{color:var(--ink-3)}
body.uk-skin .gw-sym{color:var(--ink)}
body.uk-skin .gw-type{color:var(--accent)}
/* gw-cr is a CATEGORICAL money-accent (crores figure), NOT a gain/loss value — decoupled
   from the value contract to the categorical ramp (D-COL role #2); gw-pos/gw-neg stay directional. */
body.uk-skin .gw-cr{color:var(--series-4)}
body.uk-skin .gw-pos{color:var(--up)} body.uk-skin .gw-neg{color:var(--down)}
body.uk-skin .gw-tab{border:1px solid var(--line);color:var(--ink-2)}
body.uk-skin .gw-tab:hover{border-color:var(--accent)}
body.uk-skin .gw-tab.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
body.uk-skin .gw-sort:hover{color:var(--ink)}
/* News/Wire empty-state box (news_view.py .nv-empty): grey #6e7681 (AA 4.0) + dashed
   #30363d border → map to --ink-3 (AA) + --line; the last class-based holdout (on /dash/wire). */
body.uk-skin .nv-empty{color:var(--ink-3);border-color:var(--line);border-radius:var(--r)}
/* ── responsive: legacy page body on a phone ── */
@media (max-width:860px){
  body.uk-skin .mkt-grid>*,body.uk-skin .majgrid>*,body.uk-skin .theme-groups>*,
  body.uk-skin .scards>*,body.uk-skin .uk-cols>*{min-width:0}
  body.uk-skin .ck-board{overflow-x:auto;-webkit-overflow-scrolling:touch}
  body.uk-skin table:not(.scr):not(.uk-t){display:block;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
  body.uk-skin .tabbar{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  body.uk-skin .tabbar::-webkit-scrollbar{display:none}
  body.uk-skin .tabbar a{flex:0 0 auto;white-space:nowrap}
}
@media (max-width:640px){
  body.uk-skin .wrap{padding-left:var(--gutter);padding-right:var(--gutter)}
  body.uk-skin .fbtn,body.uk-skin .fbar a,body.uk-skin .chip{padding:8px 12px}
  body.uk-skin .scrwrap{max-height:calc(100vh - 196px)}
  body.uk-skin .kpi .box{min-width:calc(50% - 5px)}
  /* L2 Wave2 (mobile audit): the dossier tab nav (.tabbar — Price/Positioning/…/F&O) is a
     flex-wrap:nowrap row ~1351px wide with overflow-x:visible and NO mobile rule → at 380px
     it forced horizontal PAGE overflow (or clipped the right tabs). Make it scroll inside
     itself like the native .uk-nav/.uk-sub do — page stays at viewport width. (Verified
     viewport-independently from the CSS facts; CDP/real-viewport unavailable in-env.) */
}


.uk, .uk *{box-sizing:border-box}
.uk{
  /* Colour-alignment Phase 4 (de-triplication): the palette/scale tokens are NO LONGER
     re-hardcoded here — they are inherited from the single source of truth on `:root`
     (ui_tokens.tokens_css(), included on every native page via ui_kit.shell()'s _foundation()
     and on the standalone memo via coverage_view._memo_shell). The values were byte-identical
     to :root (an unguarded shadow copy); referencing :root removes the drift surface. The .uk
     rule keeps only its own real properties (font/colour/aurora background) below, which read
     the inherited tokens. */
  font-family:var(--font); color:var(--ink); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased; font-feature-settings:'tnum' 1, 'cv01' 1;
  background:
    radial-gradient(1100px 560px at 82% -12%, rgba(77,157,255,.07), transparent 60%),
    radial-gradient(860px 480px at -8% 8%, rgba(52,224,214,.05), transparent 55%),
    var(--bg-1);
  min-height:100%;
}
.uk .num{font-variant-numeric:tabular-nums; font-family:var(--mono)}
.uk a{color:var(--accent); text-decoration:none}
.uk .mut{color:var(--ink-3)} .uk .sec{color:var(--ink-2)}
.uk .up{color:var(--up)} .uk .down{color:var(--down)} .uk .cred{color:var(--cred)}

/* topbar */
.uk-top{display:flex;align-items:center;gap:18px;padding:11px 20px;position:sticky;top:0;z-index:30;
  background:linear-gradient(180deg, rgba(17,24,36,.92), rgba(11,15,23,.66));
  border-bottom:1px solid var(--line); backdrop-filter:blur(12px);}
.uk-logo{font-weight:600;letter-spacing:.4px;font-size:15px;display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;cursor:pointer}
.uk-logo:hover{color:var(--ink)}
.uk-logo .dot{width:9px;height:9px;border-radius:50%;background:var(--accent-cy);box-shadow:0 0 11px var(--accent-cy)}
.uk-nav{display:flex;gap:3px}
.uk-nav a{padding:7px 13px;border-radius:9px;color:var(--ink-2);font-size:13px;font-weight:500;transition:var(--t)}
.uk-nav a:hover{color:var(--ink);background:var(--bg-2)}
.uk-nav a.on{color:var(--ink);background:var(--accent-dim);box-shadow:var(--glass)}
.uk-cmdk{margin-left:auto;display:inline-flex;align-items:center;gap:9px;padding:6px 11px;border:1px solid var(--line-2);
  border-radius:9px;color:var(--ink-3);font:500 12px/1 var(--font);text-align:left;cursor:pointer;transition:var(--t);background:var(--bg-1)}
.uk-cmdk:hover{border-color:var(--accent);color:var(--ink-2)}
.uk-cmdk:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}
.uk-cmdk kbd{font-family:var(--mono);background:var(--bg-3);border:1px solid var(--line-2);border-radius:5px;padding:1px 6px;font-size:11px;color:var(--ink-2)}

/* sub-nav (one paradigm everywhere) */
.uk-sub{display:flex;gap:3px;padding:9px 20px;border-bottom:1px solid var(--line);background:rgba(11,15,23,.5);overflow-x:auto}
.uk-sub a{padding:5px 11px;border-radius:8px;font-size:12.5px;color:var(--ink-3);white-space:nowrap;transition:var(--t)}
.uk-sub a:hover{color:var(--ink-2);background:var(--bg-2)}
.uk-sub a.on{color:var(--ink);background:var(--bg-3);box-shadow:var(--glass)}
.uk-sub .grp{align-self:center;font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--ink-3);padding:0 4px 0 10px}

/* layout */
.uk-page{padding:22px 20px;max-width:1500px;margin:0 auto}
.uk-grid{display:grid;gap:14px}
.uk-row{display:flex;gap:14px;flex-wrap:wrap}
.uk-h1{font-size:22px;font-weight:600;margin:0 0 2px;letter-spacing:-.2px}

/* card */
.uk-card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--glass)}
.uk-card.lift{box-shadow:var(--glass),var(--shadow)}
.uk-card.accent{border-top:2px solid var(--accent)}
.uk-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--ink-3);margin:0 0 11px;display:flex;align-items:center;gap:8px}

/* stat */
.uk-stat .lbl{font-size:11px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
.uk-stat .val{font-size:26px;font-weight:600;font-variant-numeric:tabular-nums;font-family:var(--mono);line-height:1;color:var(--ink)}
.uk-stat .dl{font-size:12.5px;font-variant-numeric:tabular-nums;margin-top:5px}

/* pill / verdict */
.uk-pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:20px;letter-spacing:.2px;white-space:nowrap}
.uk-pill.up{background:var(--up-dim);color:var(--up)}
.uk-pill.down{background:var(--down-dim);color:var(--down)}
.uk-pill.acc{background:var(--accent-dim);color:var(--accent)}
.uk-pill.cred{background:var(--cred-dim);color:var(--cred)}
.uk-pill.warn{background:rgba(246,183,60,.14);color:var(--warn)}
.uk-pill.neutral{background:var(--bg-3);color:var(--ink-2)}

/* segmented toggle (the ONE toggle) */
.uk-seg{display:inline-flex;border:1px solid var(--line-2);border-radius:9px;overflow:hidden;background:var(--bg-1)}
.uk-seg a{padding:6px 13px;font-size:12px;color:var(--ink-2);transition:var(--t);border-right:1px solid var(--line)}
.uk-seg a:last-child{border-right:none}
.uk-seg a.on{background:var(--accent-dim);color:var(--accent)}
.uk-seg a:hover:not(.on){background:var(--bg-2);color:var(--ink)}

/* table (frozen header + frozen first col, tabular) */
.uk-tw{overflow:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);max-height:70vh}
table.uk-t{width:100%;border-collapse:collapse;font-size:13px}
.uk-t th{position:sticky;top:0;background:var(--bg-3);color:var(--ink-3);font-size:10.5px;text-transform:uppercase;
  letter-spacing:.5px;font-weight:600;text-align:right;padding:var(--row-pad) 13px;white-space:nowrap;border-bottom:1px solid var(--line-2);z-index:2}
.uk-t th:first-child,.uk-t td:first-child{text-align:left;position:sticky;left:0;background:var(--bg-2)}
.uk-t th:first-child{z-index:3;background:var(--bg-3)}
.uk-t td{padding:var(--row-pad) 13px;text-align:right;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;color:var(--ink-2);white-space:nowrap}
.uk-t td.sym{color:var(--ink);font-weight:600;font-family:var(--font)}
.uk-t tbody tr{transition:background var(--t)}
.uk-t tbody tr:hover td{background:var(--bg-3)}

/* bounded chart host (the geometry fix, as a token) */
.uk-chart{position:relative;width:100%;max-width:1200px;height:clamp(420px,62vh,760px);
  border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);overflow:hidden}
.uk-chart .exp{position:absolute;top:10px;right:10px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line-2);border-radius:7px;background:rgba(11,15,23,.7);color:var(--ink-2);cursor:pointer;font-size:13px;z-index:5;transition:var(--t)}
.uk-chart .exp:hover{border-color:var(--accent);color:var(--accent)}

/* provenance / PIT badge (trust signature) */
.uk-badge{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;color:var(--ink-3);border:1px solid var(--line-2);border-radius:6px;padding:2px 8px}
.uk-badge .d{width:5px;height:5px;border-radius:50%;background:var(--accent-cy);box-shadow:0 0 6px var(--accent-cy)}

/* divergence shade helper for signature glyphs */
.uk-spark{display:block}

/* the top bar's nav must be able to SHRINK AND SCROLL before the phone block — see the Python
   note above `_KIT_CSS` for why this sits at 860px and not 640px. */
@media (max-width:860px){
  .uk-nav{overflow-x:auto;flex:1 1 auto;scrollbar-width:none}
  .uk-nav::-webkit-scrollbar{display:none}
}
/* ── responsive: native chrome + layout on a phone ── */
@media (max-width:640px){
  .uk-top{gap:10px;padding:10px 13px}
  .uk-nav a{padding:9px 11px}
  .uk-cmdk{padding:9px 10px}
  .uk-cmdk kbd{display:none}
  .uk-sub{padding:8px 13px}
  .uk-page{padding:16px var(--gutter)}
  .uk-h1{font-size:var(--fs-2xl)}
  .uk-row{gap:10px}
  .uk-tw,.uk-chart{border-radius:var(--r-sm)}
}
