/* The Book — RexUnda dashboard face.
   Instrument-lab system: one copper accent, equal-weight HIT/MISS, interval
   as hero. Tokens are bk-scoped so they can't collide with theme.css.
   Light mode keys off the same [data-theme] attribute theme-init manages. */
:root{
  --bk-bg:#070C0B; --bk-surface:#0D1513; --bk-sunk:#0A100F;
  --bk-line:#1B2723; --bk-line2:#131D1A; --bk-firm:#2A3B35;
  --bk-ink:#E9EEEC; --bk-ink2:#9CACA6; --bk-ink3:#657671; --bk-ink4:#47554F;
  --bk-hit:#53B896; --bk-miss:#D97D71; --bk-copper:#D98A5F; --bk-copper-dim:#8F5636;
  --bk-slate:#87968F; --bk-wash:rgba(217,138,95,.08); --bk-band:rgba(135,150,143,.13);
  --bk-mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --bk-serif:ui-serif,Georgia,"Iowan Old Style",serif;
  --bk-sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
:root[data-theme="light"]{
  --bk-bg:#F2F1ED; --bk-surface:#FBFAF7; --bk-sunk:#EAE8E2;
  --bk-line:#DDDAD2; --bk-line2:#E7E4DD; --bk-firm:#B7B3A8;
  --bk-ink:#191D1B; --bk-ink2:#4B5551; --bk-ink3:#6E7873; --bk-ink4:#8A928D;
  --bk-hit:#1E7A5C; --bk-miss:#A3423A; --bk-copper:#AE592E; --bk-copper-dim:#C99C80;
  --bk-slate:#75807A; --bk-wash:rgba(174,89,46,.07); --bk-band:rgba(117,128,122,.12);
}
body.bk{background:var(--bk-bg);color:var(--bk-ink);font-family:var(--bk-sans);font-size:14px;line-height:1.55}
.bk ::selection{background:var(--bk-copper);color:var(--bk-bg)}
.bk :focus-visible{outline:2px solid var(--bk-copper);outline-offset:2px}
.bk-page{max-width:1280px;margin:0 auto;padding:0 24px 80px}
.bk-flag{margin:0 -24px;border-bottom:1px solid var(--bk-line);background:var(--bk-sunk);padding:8px 24px;text-align:center;font-family:var(--bk-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--bk-ink3)}
.bk-flag b{color:var(--bk-copper);font-weight:600}

.bk-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;padding:36px 0 24px;border-bottom:1px solid var(--bk-line)}
.bk-wordmark{font-family:var(--bk-mono);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--bk-ink2)}
.bk-wordmark b{color:var(--bk-ink);font-weight:600}
.bk-h1{font-family:var(--bk-serif);font-weight:400;font-size:clamp(26px,3.8vw,38px);letter-spacing:-.02em;margin:12px 0 0;line-height:1.1}
.bk-h1 i{font-style:italic;color:var(--bk-copper)}
.bk-clockset{display:flex;gap:36px;font-family:var(--bk-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--bk-ink3);text-align:right}
.bk-clockset b{display:block;font-size:13px;letter-spacing:.02em;color:var(--bk-ink);margin-top:4px;text-transform:none;font-variant-numeric:tabular-nums}
.bk-clockset .seal b{color:var(--bk-copper)}

/* standing number */
.bk-standing{display:flex;gap:40px;flex-wrap:wrap;padding:28px 0;border-bottom:1px solid var(--bk-line)}
.bk-standing-main{flex:1 1 560px;min-width:0}
.bk-standing-head{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:baseline;margin-bottom:20px}
.bk-standing-head h2{margin:0;font-family:var(--bk-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--bk-ink2)}
.bk-standing-head span{font-family:var(--bk-mono);font-size:11px;color:var(--bk-ink3);letter-spacing:.04em}
#bk-lanes{padding-top:34px}
.bk-lane-row{position:relative;display:grid;grid-template-columns:minmax(150px,220px) 1fr 150px;gap:0 20px;align-items:center;padding:14px 0}
.bk-lane-row + .bk-lane-row{border-top:1px solid var(--bk-line2)}
.bk-lane-name{font-size:13.5px;line-height:1.4}
.bk-lane-name b{font-weight:600}
.bk-lane-name span{display:block;font-family:var(--bk-mono);font-size:11px;color:var(--bk-ink3);margin-top:3px}
.bk-lane{position:relative;height:34px}
.bk-null{position:absolute;top:-15px;bottom:-15px;width:1px;background:var(--bk-copper);z-index:3}
.bk-null.first{top:-32px}
.bk-null-tag{position:absolute;top:-48px;transform:translateX(-50%);font-family:var(--bk-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bk-copper);white-space:nowrap;z-index:4}
.bk-ci{position:absolute;top:11px;height:12px;background:var(--bk-band);border:1px solid var(--bk-slate);transform-origin:left 50%;animation:bk-settle .8s cubic-bezier(.2,.85,.25,1) both}
.bk-tick{position:absolute;top:7px;height:20px;width:2px;background:var(--bk-ink);z-index:2;animation:bk-appear .5s ease-out .5s both}
.bk-lane-val{font-family:var(--bk-mono);font-variant-numeric:tabular-nums;font-size:13px;color:var(--bk-ink);text-align:right;line-height:1.7}
.bk-lane-val b{font-size:20px;font-weight:500;letter-spacing:-.01em}
.bk-lane-val small{color:var(--bk-ink3);font-size:11px;display:block}
.bk-lane-row.dim .bk-lane-val, .bk-lane-row.dim .bk-lane-val b{color:var(--bk-ink2)}
.bk-lane-row.thin{opacity:.75}
.bk-lane-row.thin .bk-lane-val b{font-size:14px;color:var(--bk-slate)}
.bk-axis{display:grid;grid-template-columns:minmax(150px,220px) 1fr 150px;gap:0 20px;border-top:1px solid var(--bk-line)}
.bk-axis-lane{position:relative;height:18px;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-axis-lane span{position:absolute;top:4px;transform:translateX(-50%)}
.bk-axis-lane .null{color:var(--bk-copper)}
.bk-axis-spacer{visibility:hidden;height:0;overflow:hidden;font-family:var(--bk-mono);font-size:13px;line-height:1.7}
.bk-axis-spacer b{font-size:20px;font-weight:500}
.bk-standing-caption{margin:16px 0 0;font-size:13px;color:var(--bk-ink2);max-width:70ch;line-height:1.6}
.bk-standing-caption b{color:var(--bk-ink);font-weight:600}
.bk-tonight{flex:1 1 300px;max-width:640px;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--bk-line);border:1px solid var(--bk-line);align-self:start}
.bk-tonight>div{background:var(--bk-surface);padding:14px 16px}
.bk-tonight .k{font-family:var(--bk-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--bk-ink3)}
.bk-tonight .v{font-family:var(--bk-mono);font-variant-numeric:tabular-nums;font-size:20px;margin:6px 0 4px}
.bk-tonight .v.copper{color:var(--bk-copper)}
.bk-tonight .s{font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4);line-height:1.6}

/* tally / controls */
.bk-tally{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid var(--bk-line)}
.bk-scope{display:flex;border:1px solid var(--bk-line);border-radius:1px}
.bk-scope button{appearance:none;cursor:pointer;border:0;background:var(--bk-surface);color:var(--bk-ink3);font-family:var(--bk-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:8px 14px;transition:color .15s,background .15s}
.bk-scope button + button{border-left:1px solid var(--bk-line)}
.bk-scope button[aria-pressed="true"]{background:var(--bk-wash);color:var(--bk-copper)}
.bk-scope-note,.bk-tally-hint{font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-tally-sum{font-family:var(--bk-mono);font-size:12px;color:var(--bk-ink2);font-variant-numeric:tabular-nums;margin-left:auto}
.bk-tally-sum .h{color:var(--bk-hit);font-weight:600}.bk-tally-sum .m{color:var(--bk-miss);font-weight:600}
.bk-tally-sum .r{color:var(--bk-slate);font-weight:600}.bk-tally-sum .w{color:var(--bk-copper);font-weight:600}
.bk-toggle{appearance:none;cursor:pointer;background:var(--bk-surface);border:1px solid var(--bk-line);color:var(--bk-ink2);font-family:var(--bk-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:8px 14px;border-radius:1px;transition:color .15s,border-color .15s,background .15s}
.bk-toggle[aria-pressed="true"]{background:var(--bk-wash);border-color:var(--bk-copper-dim);color:var(--bk-copper)}

/* feed */
.bk-cols{display:flex;gap:32px;flex-wrap:wrap;align-items:flex-start;padding-top:24px}
.bk-feed{flex:1 1 620px;min-width:0}
.bk-band-head{display:flex;align-items:center;gap:12px;padding:12px 0 10px}
.bk-band-head h2{margin:0;font-family:var(--bk-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--bk-ink3);font-weight:500;white-space:nowrap}
.bk-band-head.hold h2{color:var(--bk-copper)}
.bk-band-head hr{flex:1;border:0;border-top:1px dashed var(--bk-line);margin:0}
.bk-band-head span{font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-row{background:var(--bk-surface);border:1px solid var(--bk-line);border-radius:1px;padding:12px 16px;margin-bottom:6px;cursor:pointer;transition:border-color .15s}
.bk-row:hover,.bk-row.open{border-color:var(--bk-firm)}
.bk-row-grid{display:grid;grid-template-columns:48px 56px 1fr auto;gap:4px 16px;align-items:baseline}
.bk-row .t{font-family:var(--bk-mono);font-size:11px;color:var(--bk-ink4);font-variant-numeric:tabular-nums}
.bk-row .k{font-family:var(--bk-mono);font-size:13px;font-weight:600}
.bk-row .w{font-size:13px;color:var(--bk-ink2)}
.bk-row .w i{font-style:normal;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-row .g{justify-self:end;font-family:var(--bk-mono);font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}
.g.hit{color:var(--bk-hit)}.g.miss{color:var(--bk-miss)}.g.wait{color:var(--bk-copper)}.g.grey{color:var(--bk-slate)}
.bk-meta{grid-column:2/-1;display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:2px}
.bk-chip{display:inline-flex;border-radius:1px;font-family:var(--bk-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:2px 7px;border:1px solid currentColor}
.bk-chip.hit{color:var(--bk-hit)}.bk-chip.wait{color:var(--bk-copper)}.bk-chip.grey{color:var(--bk-slate)}
.bk-lag{font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-sliver{border:1px dashed var(--bk-line);border-radius:1px;padding:6px 16px;margin-bottom:6px;font-family:var(--bk-mono);font-size:11px;color:var(--bk-ink3);letter-spacing:.04em}

/* receipt drawer */
.bk-drawer{display:grid;animation:bk-unfold .18s ease-out both}
.bk-drawer-inner{overflow:hidden;min-height:0}
.bk-chainwrap{margin-top:14px;border-top:1px solid var(--bk-line);padding-top:4px;position:relative}
.bk-chainrail{position:absolute;left:6px;top:20px;bottom:44px;width:1px;background:var(--bk-line)}
.bk-step{position:relative;padding:12px 0 12px 26px;border-bottom:1px solid var(--bk-line2);animation:bk-appear .3s ease-out both}
.bk-step-dot{position:absolute;left:2px;top:17px;width:8px;height:8px;border-radius:50%;background:var(--bk-bg);border:2px solid var(--bk-slate)}
.bk-step-dot.hit{border-color:var(--bk-hit)}.bk-step-dot.miss{border-color:var(--bk-miss)}.bk-step-dot.wait{border-color:var(--bk-copper)}
.bk-step-head{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:baseline}
.bk-step-head h3{margin:0;font-family:var(--bk-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bk-ink3);font-weight:500}
.bk-step-head time{font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4);font-variant-numeric:tabular-nums}
.bk-step-d{font-family:var(--bk-mono);font-variant-numeric:tabular-nums;font-size:13px;line-height:1.7;margin-top:4px}
.bk-step-d.hit{color:var(--bk-hit)}.bk-step-d.miss{color:var(--bk-miss)}.bk-step-d.wait{color:var(--bk-copper)}.bk-step-d.grey{color:var(--bk-slate)}
.bk-step-d .strike{position:relative;color:var(--bk-ink3)}
.bk-step-d .strike::after{content:"";position:absolute;left:0;top:50%;height:1px;background:var(--bk-slate);animation:bk-strike .5s ease-out .45s both}
.bk-step p{margin:5px 0 0;font-size:13px;color:var(--bk-ink2);line-height:1.6;max-width:66ch}
.bk-vchip{display:inline-block;margin-top:8px;font-family:var(--bk-mono);font-size:10px;letter-spacing:.08em;color:var(--bk-ink3);border:1px solid var(--bk-line);border-left:2px solid var(--bk-copper-dim);border-radius:1px;padding:2px 7px}
.bk-counts{padding:14px 0 4px}
.bk-counts-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;margin-bottom:8px}
.bk-counts-head h3{margin:0;font-family:var(--bk-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bk-ink2);font-weight:500}
.bk-counts-head span{font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-agg{display:grid;grid-template-columns:minmax(120px,190px) 1fr auto;gap:14px;align-items:center;padding:9px 0;border-bottom:1px solid var(--bk-line2)}
.bk-agg-name{font-size:12.5px;line-height:1.35}
.bk-agg-name span{display:block;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink3);margin-top:2px}
.bk-mini{position:relative;height:22px}
.bk-mini .null{position:absolute;left:50%;top:-2px;bottom:-2px;width:1px;background:var(--bk-copper);opacity:.8}
.bk-mini .ci{position:absolute;top:7px;height:8px;border-radius:1px;background:var(--bk-band);border:1px solid var(--bk-slate);transform-origin:left 50%;animation:bk-settle .6s cubic-bezier(.2,.85,.25,1) .35s both}
.bk-mini .tick{position:absolute;top:3px;height:16px;width:3px;border-radius:1px;background:var(--bk-copper);animation:bk-appear .4s ease-out .8s both}
.bk-agg-val{font-family:var(--bk-mono);font-variant-numeric:tabular-nums;font-size:11px;color:var(--bk-ink2);text-align:right;white-space:nowrap}
.bk-nocount{margin:14px 0 4px;font-size:13px;color:var(--bk-ink2);line-height:1.6;max-width:70ch;border-left:2px solid var(--bk-copper);padding-left:14px}
.bk-nocount b{color:var(--bk-ink);font-weight:600}
.bk-drawer-foot{margin-top:8px;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4)}
.bk-drawer-foot a{color:var(--bk-ink3);border-bottom:1px solid var(--bk-line);text-decoration:none}
.bk-drawer-foot a:hover{color:var(--bk-ink)}

/* rail */
.bk-rail{flex:1 1 280px;max-width:360px;display:grid;gap:14px;align-content:start}
.bk-mod{background:var(--bk-surface);border:1px solid var(--bk-line);border-radius:1px;padding:16px 18px}
.bk-mod h3{margin:0 0 12px;font-family:var(--bk-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--bk-ink2);font-weight:500}
.bk-mod h3.serif{font-family:var(--bk-serif);font-size:16px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--bk-ink);margin-bottom:8px}
.bk-mod p{margin:12px 0 0;font-size:12.5px;color:var(--bk-ink3);line-height:1.55}
.bk-mod.cannot{background:var(--bk-sunk);border-left:2px solid var(--bk-copper)}
.bk-mod.cannot p{margin:0;color:var(--bk-ink2);line-height:1.6}
.bk-jq{display:grid;gap:8px;font-family:var(--bk-mono);font-size:12px;font-variant-numeric:tabular-nums}
.bk-jq>div{display:flex;justify-content:space-between;gap:10px}
.bk-jq .who{color:var(--bk-ink2)}.bk-jq .when{color:var(--bk-copper)}
.bk-big{font-family:var(--bk-mono);font-variant-numeric:tabular-nums;font-size:26px}
.bk-big.copper{color:var(--bk-copper)}
.bk-mod small{display:block;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4);line-height:1.7;margin-top:4px}
.bk-refused{font-size:13px;color:var(--bk-ink2)}
.bk-refused b{font-family:var(--bk-mono);font-weight:600;color:var(--bk-ink)}
.bk-refused span{display:block;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4);margin-top:4px}
.bk-foot{margin-top:40px;font-family:var(--bk-mono);font-size:10px;color:var(--bk-ink4);line-height:1.9;max-width:84ch}

@keyframes bk-settle{from{transform:scaleX(.03);opacity:0}to{transform:scaleX(1);opacity:1}}
@keyframes bk-appear{from{opacity:0}to{opacity:1}}
@keyframes bk-unfold{from{grid-template-rows:0fr;opacity:0}to{grid-template-rows:1fr;opacity:1}}
@keyframes bk-strike{from{width:0}to{width:100%}}
@media (prefers-reduced-motion:reduce){.bk *{animation:none !important}}

/* Demo-payload banner. book.js swaps the flag to this when #book-data is null
   or unparseable, so the July-31 illustrative payload can never be mistaken
   for a live reading. Deliberately the loudest element on the page. */
.bk-flag-demo{background:var(--bk-copper);color:#0d0f12;font-weight:700;letter-spacing:.08em}
.bk-flag-demo b{color:#0d0f12;font-weight:800}

/* Page-level nav. Replaces the dash-shell sidebar removed 2026-08-01 when the
   Book became the standalone surface rather than a panel inside the dashboard.
   Deliberately quiet: the page's subject is the scoreboard, not the chrome. */
.bk-nav{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;margin-top:28px;padding-top:20px;border-top:1px solid var(--bk-line);font-family:var(--bk-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.bk-nav a{color:var(--bk-ink3);text-decoration:none}
.bk-nav a:hover,.bk-nav a:focus-visible{color:var(--bk-copper)}

/* Theme pill — the design canvas's "DARK ·" control, kept quiet like the nav.
   Same interaction grammar as the tally toggles; never louder than the data. */
.bk-theme{margin-top:10px;font-family:var(--bk-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--bk-ink3);background:var(--bk-surface);border:1px solid var(--bk-line);border-radius:6px;padding:4px 10px;cursor:pointer}
.bk-theme:hover,.bk-theme:focus-visible{color:var(--bk-copper);border-color:var(--bk-firm)}

/* Gated control + its reason. A disabled-looking control with no explanation
   reads as a bug; hiding it entirely hides the product. So the gate states
   why it is closed and what is still open. */
.bk-scope button.bk-gated{opacity:.72;border-style:dashed}
.bk-scope button.bk-gated::after{content:" · locked";font-size:9px;letter-spacing:.1em;color:var(--bk-copper)}
.bk-gate-why{font-size:12px;color:var(--bk-ink3);line-height:1.5;max-width:52ch}
