/* Knock⌃On Ripple Map v6. Split-Flap Riso (art/ART_DIRECTION.md) extended per EXPERIENCE §8: tiles are stops, petrol draws
   every track, marigold marks the shock, the stop in focus and the one primary action. Green is retired from /ripples/. */
@font-face{font-family:"Anybody";src:url(/ripples/fonts/anybody-latin-var.woff2) format("woff2");font-weight:100 900;font-stretch:50% 150%;font-display:swap}
/* Plex sets every sentence: "optional" keeps a slow first load on the system sans instead of re-flowing (LCP/CLS); cached after. No italic file: the few italic captions use the synthesized slant. */
@font-face{font-family:"IBM Plex Sans";src:url(/ripples/fonts/plex-sans-latin-var.woff2) format("woff2");font-weight:100 700;font-display:optional}
/* metric-matched local fallbacks (computed with fontTools against Arial / Arimo / Liberation Sans) so the swap to the web fonts barely moves text */
@font-face{font-family:"Plex fb";src:local("Arial"),local("ArialMT"),local("Arimo"),local("Liberation Sans"),local("Helvetica");size-adjust:102.8%;ascent-override:99.7%;descent-override:26.7%;line-gap-override:0%}
@font-face{font-family:"Anybody fb";src:local("Arial Bold"),local("Arial-BoldMT"),local("Arimo Bold"),local("Liberation Sans Bold"),local("Helvetica Bold");font-weight:700 900;size-adjust:128.9%;ascent-override:61.7%;descent-override:18.6%;line-gap-override:0%}
:root{
  color-scheme:light;
  --petrol:#0B3A40;--marigold:#F2AE2E;--marigold-ink:#9A5E00;
  --stage:#EDF1EE;--card:#FFFFFF;--sunk:#F4F7F5;
  --panel:#0B3A40;--panel-2:#114850;--panel-ring:transparent;--panel-line:rgba(234,243,240,.13);
  --on-panel:#EAF3F0;--on-panel-2:#A9C4C1;--on-panel-3:#8FB0B2;--on-marigold:#0B3A40;
  --ink:#0B3A40;--ink-2:#3C5E62;--ink-3:#557275;--rule:#557275;--hair:#D3DDDA;
  --near:#FDD835;--on-near:#0B3A40;--miss:#CF3A2D;
  --tile-lip:rgba(11,58,64,.18);
  --spike:#F2AE2E;--spike-wash:rgba(242,174,46,.14);--flat:#7C9C9E;
  --grid-panel:rgba(234,243,240,.14);--event:rgba(234,243,240,.42);
  --seed-line:#0B3A40;--seed-band:rgba(11,58,64,.20);--band:rgba(11,58,64,.07);--grid-card:#E3E9E7;
  --focus:#0B3A40;--focus-on-dark:#F2AE2E;
  /* extension: riso dot screen, 6 px period, ~55% coverage (Likely tiles, uncertainty bands); never under text */
  --ht:#0B3A40;--ht-panel:#EAF3F0;
  --halftone:radial-gradient(circle at 3px 3px,var(--ht) 2.5px,transparent 2.7px) 0 0/6px 6px;
  --halftone-panel:radial-gradient(circle at 3px 3px,var(--ht-panel) 2.5px,transparent 2.7px) 0 0/6px 6px;
  --display:"Anybody","Anybody fb","Arial Black",system-ui,sans-serif;
  --sans:"IBM Plex Sans","Plex fb",-apple-system,"Segoe UI",system-ui,sans-serif;
  --emoji:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
  --r-tile:6px;--r-buzz:12px;--r-ticket:18px;--r-pill:999px;
  --lip:0 4px 0 var(--petrol);--lift:0 1px 0 rgba(11,58,64,.10),0 12px 28px -16px rgba(11,58,64,.38);
  --t-tap:90ms;--t-quick:160ms;--t-draw:400ms;--t-open:320ms;
  --e-out:cubic-bezier(.2,.8,.2,1);--e-overshoot:cubic-bezier(.34,1.56,.64,1);--e-snap:cubic-bezier(.5,0,.1,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark;--marigold:#E0A33C;--marigold-ink:#F2B23A;
  --stage:#062429;--card:#0D353B;--sunk:#0A2D32;--panel:#0B3A40;--panel-2:#12474F;--panel-ring:#1D5960;--on-marigold:#062429;
  --ink:#EAF3F0;--ink-2:#B7CDCA;--ink-3:#8AA9A6;--rule:#6F9396;--hair:#1C4A51;--on-near:#062429;--miss:#FF6F5B;--tile-lip:rgba(0,0,0,.22);
  --spike:#F2B23A;--spike-wash:rgba(242,178,58,.14);--flat:#7FA0A2;--seed-line:#062429;--seed-band:rgba(6,36,41,.22);--band:rgba(234,243,240,.10);--grid-card:#16434A;
  --focus:#F2B23A;--ht:#B7CDCA;--petrol:#0B3A40;--lip:0 4px 0 #03181B;--lift:0 1px 0 rgba(0,0,0,.25),0 14px 30px -16px rgba(0,0,0,.6)}}
:root[data-theme="dark"]{
  color-scheme:dark;--marigold:#E0A33C;--marigold-ink:#F2B23A;
  --stage:#062429;--card:#0D353B;--sunk:#0A2D32;--panel:#0B3A40;--panel-2:#12474F;--panel-ring:#1D5960;--on-marigold:#062429;
  --ink:#EAF3F0;--ink-2:#B7CDCA;--ink-3:#8AA9A6;--rule:#6F9396;--hair:#1C4A51;--on-near:#062429;--miss:#FF6F5B;--tile-lip:rgba(0,0,0,.22);
  --spike:#F2B23A;--spike-wash:rgba(242,178,58,.14);--flat:#7FA0A2;--seed-line:#062429;--seed-band:rgba(6,36,41,.22);--band:rgba(234,243,240,.10);--grid-card:#16434A;
  --focus:#F2B23A;--ht:#B7CDCA;--lip:0 4px 0 #03181B;--lift:0 1px 0 rgba(0,0,0,.25),0 14px 30px -16px rgba(0,0,0,.6)}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--stage)}
body{margin:0;background:var(--stage);color:var(--ink);font:400 16px/1.5 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-wrap:break-word}
h1,h2,h3,h4,p,ol,ul,figure{margin:0;padding:0}
ol,ul{list-style:none}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1.5px}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
input,select{font:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:60;background:var(--card);padding:10px 14px;border-radius:8px}.skip:focus{left:16px}
.emo{font-family:var(--emoji);font-weight:400;font-style:normal;line-height:1}
.num{font-family:var(--display);font-weight:850;font-variation-settings:"wdth" 100}
.mx{font-family:var(--sans);font-weight:700;font-size:.9em;margin-left:.04em}
.sepq{display:inline-block;width:5px;height:5px;border-radius:1px;background:var(--marigold);margin:0 7px;vertical-align:2px;flex:none}
.grain{position:relative;isolation:isolate}
.grain::before{content:"";position:absolute;inset:0;background:var(--grain);opacity:.15;mix-blend-mode:multiply;pointer-events:none;border-radius:inherit;z-index:-1}
.panel.grain::before{opacity:.10;mix-blend-mode:screen}
.app{max-width:640px;margin:0 auto;padding:0 16px 24px;container-type:inline-size}
.muted{color:var(--ink-3)}.sm{font-size:13.5px;line-height:1.4}.xs{font-size:12.5px;line-height:1.4}
.sec{margin-top:28px}
.h2{font:850 22px/1.1 var(--display);font-variation-settings:"wdth" 106;letter-spacing:-.015em;margin-bottom:10px}
.h1{font:850 28px/1.05 var(--display);font-variation-settings:"wdth" 106;letter-spacing:-.015em}
.lede{font-size:15.5px;color:var(--ink-2);margin-top:6px}

/* ---------- top bar ---------- */
.bar{display:flex;align-items:center;gap:4px;height:56px}
.wm{display:inline-flex;align-items:center;font:900 21px/1 var(--display);font-variation-settings:"wdth" 106;letter-spacing:-.012em;color:var(--ink);text-decoration:none;white-space:nowrap;min-height:44px}
.wm svg{width:.7em;height:.56em;margin:0 .04em;overflow:visible;transform:translateY(.06em)}
.wm svg path{fill:none;stroke:var(--marigold);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pz{display:flex;flex-direction:column;gap:3px;margin-left:8px;white-space:nowrap;min-width:0;overflow:hidden;flex:0 1 auto}
.pz b{font:850 13px/1 var(--display);font-variation-settings:"wdth" 100}
/* narrow phones keep the product's name and drop the date (the board carries it) */
@media (max-width:419px){.pz span{display:none}}
.pz span{font:500 11.5px/1 var(--sans);color:var(--ink-3)}
.bar .sp{flex:1}
.ib{width:44px;height:44px;display:grid;place-items:center;flex:none;text-decoration:none}
.ib i{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;box-shadow:inset 0 0 0 2px var(--rule);font:700 15px/1 var(--sans);font-style:normal;color:var(--ink)}
.ib svg{width:16px;height:16px}
.ib .emo{font-size:15px}
.bar .ib:last-child{margin-right:-6px}
@media (max-width:379px){.wm{font-size:19px}.bar{gap:0}}
.house{font:400 12.5px/1.3 var(--sans);color:var(--ink-3);margin:-6px 0 14px}
.back{display:inline-flex;align-items:center;gap:2px;height:44px;margin-left:-8px;padding-right:6px;font:600 14px/1 var(--sans);text-decoration:none;color:var(--ink)}
.back svg{width:22px;height:22px}

/* ---------- buttons, chips ---------- */
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;padding:0 18px;border-radius:var(--r-buzz);background:var(--marigold);color:var(--on-marigold);box-shadow:inset 0 0 0 2px var(--petrol),var(--lip);font:700 17px/1 var(--sans);text-decoration:none;margin-bottom:4px;transition:transform var(--t-tap) var(--e-snap),box-shadow var(--t-tap) var(--e-snap)}
.btn:active{transform:translateY(3px);box-shadow:inset 0 0 0 2px var(--petrol),0 1px 0 var(--petrol)}
.btn.ink{background:var(--petrol);color:#EAF3F0;box-shadow:0 4px 0 rgba(11,58,64,.45)}
.btn.ink:active{box-shadow:0 1px 0 rgba(11,58,64,.45)}
.btn.sec{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink),0 3px 0 var(--ink);min-height:48px;font-size:15px;font-weight:600}
.btn.sm{width:auto;min-height:44px;font-size:14.5px;padding:0 14px}
.btn svg{width:18px;height:18px;flex:none}
.btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:flex-start}.btns .btn{flex:1 1 140px;min-height:50px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 13px 0 10px;border-radius:var(--r-pill);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair);font:600 14px/1 var(--sans);color:var(--ink);text-decoration:none;white-space:nowrap}
.chip .emo{font-size:15px}
.chip.on,.chip[aria-pressed="true"],.chip[aria-current="page"]{background:var(--ink);color:var(--stage);box-shadow:none}
.chip.dim{color:var(--ink-3);background:transparent}
.lnk{font-weight:600;text-decoration:underline;text-decoration-color:var(--rule);min-height:44px;display:inline-flex;align-items:center}

/* ---------- tier tiles, pips, stamps, domain tiles ---------- */
.tt{display:inline-block;width:14px;height:14px;border-radius:3.5px;flex:none;vertical-align:-2px}
.tt.measured{background:var(--ink)}
/* Likely is the riso halftone at 55%, the same screen as the .dt.likely tiles and the OG cards (ART halftone rule) */
.tt.likely{background:radial-gradient(circle at 2px 2px,var(--ht) 1.35px,transparent 1.55px) 0 0/4px 4px;box-shadow:inset 0 0 0 1.5px var(--ink)}
.tt.watching{box-shadow:inset 0 0 0 1.5px var(--ink);border-radius:50%}
.tt.retracted{box-shadow:inset 0 0 0 1.5px var(--flat);background:linear-gradient(135deg,transparent 45%,var(--flat) 45%,var(--flat) 55%,transparent 55%)}
.panel .tt.measured{background:var(--on-panel)}
.panel .tt.likely{background:radial-gradient(circle at 2px 2px,var(--ht-panel) 1.35px,transparent 1.55px) 0 0/4px 4px;box-shadow:inset 0 0 0 1.5px var(--on-panel)}
.panel .tt.watching{box-shadow:inset 0 0 0 1.5px var(--on-panel-2)}
.panel :focus-visible,.btn.ink:focus-visible{outline-color:var(--focus-on-dark)}
.pips{display:inline-flex;gap:2px;vertical-align:0}
.pips i{width:4px;height:11px;border-radius:1px;box-shadow:inset 0 0 0 1.25px currentColor}
.pips i.on{background:currentColor}.pips i:not(.on){opacity:.4}
.stamp{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px 0 8px;border-radius:var(--r-tile);box-shadow:inset 0 0 0 2px currentColor;font:700 13.5px/1 var(--sans);white-space:nowrap}
.stamp.measured{background:var(--ink);color:var(--stage);box-shadow:none}
.stamp.likely{color:var(--ink)}
.stamp.watching{color:var(--ink);box-shadow:none;border:2px dashed currentColor}
.stamp.retracted{color:var(--ink-3)}
.prov{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:5px;background:var(--sunk);box-shadow:inset 0 0 0 1.5px var(--hair);font:600 12px/1 var(--sans);color:var(--ink-2)}
.dt{width:34px;height:34px;border-radius:var(--r-tile);display:grid;place-items:center;flex:none;font-size:17px;background:var(--card);box-shadow:inset 0 0 0 2px var(--ink)}
.dt.measured{background:var(--ink);box-shadow:none}
.dt.likely{background:var(--card);box-shadow:inset 0 0 0 2px var(--ink);position:relative;overflow:hidden}
.dt.likely::before{content:"";position:absolute;inset:0;background:var(--halftone);opacity:.55}
.dt.likely .emo{position:relative;background:var(--card);border-radius:4px;padding:2px}
.dt.watching{background:transparent;box-shadow:none;border:2px dashed var(--ink)}
.dt.retracted{opacity:.6;box-shadow:inset 0 0 0 2px var(--flat)}
.dt.shock{background:var(--marigold);box-shadow:inset 0 0 0 2px var(--petrol)}
.dt.q{background:transparent;box-shadow:inset 0 0 0 2px currentColor;font:900 17px/1 var(--display)}
.dt .ar{position:absolute;right:-4px;top:-4px;font-size:10px;background:var(--card);border-radius:3px;padding:1px}
.dt{position:relative}

/* ---------- flaps (hinge behind the glyph) ---------- */
.flaps{display:inline-flex;gap:2px;--fs:28px;vertical-align:middle}
.flap{position:relative;display:grid;place-items:center;width:calc(var(--fs)*.66);height:calc(var(--fs)*1.08);border-radius:calc(var(--fs)*.12);background:var(--marigold);color:var(--petrol);overflow:hidden;box-shadow:inset 0 calc(var(--fs)*-.05) 0 rgba(11,58,64,.16)}
:root[data-theme="dark"] .flap{color:#062429}
.flap::before{content:"";position:absolute;inset:50% 0 0;background:rgba(11,58,64,.06)}
.flap::after{content:"";position:absolute;left:0;right:0;top:calc(50% - .5px);height:1px;background:rgba(11,58,64,.22)}
.flap>span{position:relative;z-index:1;font:900 calc(var(--fs)*.78)/1 var(--display);font-variation-settings:"wdth" 100;transform:translateY(.02em)}
.flap.nr{width:calc(var(--fs)*.34)}
.flap.x{width:calc(var(--fs)*.5)}.flap.x>span{font-family:var(--sans);font-weight:700;font-size:calc(var(--fs)*.62)}
.flap.u{width:calc(var(--fs)*.52)}.flap.u>span{font-family:var(--sans);font-weight:700;font-size:calc(var(--fs)*.58);text-transform:none}
.flaps.mute .flap{background:var(--sunk);color:var(--ink-2);box-shadow:inset 0 0 0 1.5px var(--hair)}
/* the board's countdown: panel-2 flaps on petrol, marigold once the look is today; ink flaps on the marigold ticket */
.panel .flaps.mute .flap{background:var(--panel-2);color:var(--on-panel);box-shadow:inset 0 0 0 1px rgba(234,243,240,.22)}
.panel .flaps.mute.hot .flap{background:var(--marigold);color:var(--petrol);box-shadow:none}
.flaps.ink .flap{background:var(--petrol);color:#FFF7E6}:root[data-theme="dark"] .flaps.ink .flap{background:#062429}
.flaps.ink .flap::after{background:rgba(255,255,255,.22)}

/* ---------- the ticket (Ripple of the week) ---------- */
.ticket{position:relative;border-radius:var(--r-ticket)}
.notch{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--stage);transform:translateY(-50%)}
.notch.l{left:-9px}.notch.r{right:-9px}
.hero{background:var(--marigold);color:var(--on-marigold)}
.tk-top{display:flex;align-items:center;gap:8px;padding:12px 16px 0;font:600 13px/1 var(--sans)}
.tk-top .tag{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:5px;box-shadow:inset 0 0 0 1.5px currentColor}
.tk-top .ver{margin-left:auto;font:850 13px/1 var(--display);font-variation-settings:"wdth" 100}
.tk-top .tag{white-space:nowrap;flex:none}
.tk-top .tag2{font:600 12px/1.2 var(--sans);letter-spacing:-.01em;opacity:.85;min-width:0;flex:0 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-body{padding:10px 16px 12px}
.tk-row{display:flex;align-items:center;gap:10px}
.tk-emo{width:36px;height:36px;border-radius:var(--r-tile);background:rgba(255,255,255,.5);display:grid;place-items:center;font-size:20px;flex:none}
.tk-title{font:850 clamp(25px,8.4cqi,34px)/1.02 var(--display);font-variation-settings:"wdth" 108;letter-spacing:-.015em;text-wrap:balance}
.tk-hook{font:700 19px/1.22 var(--sans);letter-spacing:-.01em;margin-top:10px;text-wrap:balance}
.tk-sub{font:500 14px/1.35 var(--sans);margin-top:3px}
.tk-chart{display:block;width:100%;height:84px;margin-top:8px;overflow:visible}
.tk-path{display:flex;align-items:center;margin:14px 0 4px}
.tk-path .dt{width:44px;height:44px;font-size:22px}
.tk-path .dt.shock{background:var(--petrol);box-shadow:none}
.tk-path .dt.measured{background:var(--petrol)}
.tk-path .dt.q{color:var(--petrol);font-size:22px}
.tk-path .trk{flex:1;height:4px;background:var(--petrol);border-radius:2px;min-width:14px;max-width:70px}
.tk-path .lbl{margin-left:10px;font:600 13.5px/1.25 var(--sans)}
.tk-perf{position:relative;border-top:2px dotted rgba(11,58,64,.4);margin:0}
.tk-perf .notch{top:-1px}
.tk-foot{padding:12px 16px 16px}
.tk-meta{display:flex;flex-wrap:wrap;align-items:center;font:600 13.5px/1.2 var(--sans);margin-bottom:12px}
.hero .sepq{background:var(--petrol)}
.hero .btn{background:var(--petrol);color:#FFF7E6;box-shadow:0 4px 0 rgba(11,58,64,.5)}
.hero .btn:active{box-shadow:0 1px 0 rgba(11,58,64,.5)}
:root[data-theme="dark"] .hero .btn{background:#062429}
.hero.quiet .tk-hook{font-weight:600}
.hero.cold .tk-hook{font-size:18px}
.hero.arch{margin-top:14px}
.tk-sub.gloss{font-weight:600;margin-top:6px}
.tk-path .lbl .tier{display:inline-flex;align-items:center;gap:5px;font-weight:500}
.tk-path .lbl .flaps{--fs:22px}
.hero.cold .tk-path .lbl{line-height:1.5}
/* the ticket's stage: the seed sparkline, or (signature B) the line's staircase; the height is reserved so nothing shifts */
.tk-stage{margin-top:8px}.tk-stage.tall{min-height:150px;display:flex;align-items:center}
.tk-stage .tk-chart{margin-top:0}
.hero .stair{--card:#FFF7E6;--ink:var(--petrol);--spike:var(--petrol);--marigold:#FFF7E6;--marigold-ink:var(--petrol);--grid-card:rgba(11,58,64,.16);--band:rgba(11,58,64,.10);--ink-3:#5A4A1E;--flat:#8C7A4E;background:rgba(255,255,255,.28);box-shadow:none;width:100%;cursor:pointer}
:root[data-theme="dark"] .hero .stair{--ink-3:#3F3312}
.hero .stair svg{height:150px}
.hero .stair figcaption{color:var(--on-marigold);opacity:.8}

/* ---------- departures board ---------- */
.panel{background:var(--panel);color:var(--on-panel);border-radius:var(--r-ticket);box-shadow:inset 0 0 0 1px var(--panel-ring)}
.board{margin-top:18px;padding:14px 0 6px;contain:paint}
.bd-head{display:flex;align-items:center;gap:10px;padding:0 14px 10px;border-bottom:1px solid var(--panel-line)}
.fw{display:inline-flex;gap:2px}
.fw b{display:grid;place-items:center;width:18px;height:26px;border-radius:3px;background:var(--panel-2);font:850 15px/1 var(--display);font-variation-settings:"wdth" 100;color:var(--on-panel);position:relative;overflow:hidden}
.fw b::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(0,0,0,.28)}
.bd-time{margin-left:auto;font:500 12.5px/1 var(--sans);color:var(--on-panel-2);text-align:right}
.bd-time b{display:block;font:850 15px/1 var(--display);font-variation-settings:"wdth" 100;color:var(--on-panel);margin-bottom:3px}
.dep{display:grid;grid-template-columns:34px minmax(0,1fr) auto 16px;align-items:center;gap:10px;min-height:60px;padding:8px 14px;text-decoration:none;color:var(--on-panel);border-bottom:1px solid var(--panel-line)}
.dep:last-child{border-bottom:0}
.dep .ic{width:34px;height:34px;border-radius:var(--r-tile);background:var(--panel-2);display:grid;place-items:center;font-size:18px}
.dep .nm{display:block;font:700 15.5px/1.2 var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dep .sub{font:500 12.5px/1.25 var(--sans);color:var(--on-panel-2);display:flex;align-items:center;gap:4px;margin-top:3px;white-space:nowrap;overflow:hidden}
.dep .sub .emo{font-size:12px}
.tstrip{display:inline-flex;align-items:center;gap:3px;flex:none}.tstrip small{font:600 11.5px/1 var(--sans);color:var(--ink-3);margin-left:3px}.panel .tstrip small{color:var(--on-panel-2)}
.tstrip .emo{font-size:12px;margin:0 2px 0 -1px}
.dep .dest{display:flex;flex-direction:column;align-items:flex-end;gap:3px;font:600 12.5px/1.15 var(--sans);text-align:right;max-width:96px;color:var(--on-panel)}
.dep .dest .emo{font-size:17px}
.dep .dest .tt{margin-right:2px}
.dep .dest small{font:500 11.5px/1.2 var(--sans);color:var(--on-panel-2);font-style:normal;white-space:nowrap}
.dep .dest.wat{color:var(--on-panel-2);font-weight:500}
.dep .dest.clock .flaps{--fs:18px;gap:1.5px}
.dep .dest.clock .flap{box-shadow:inset 0 0 0 1px rgba(234,243,240,.22)}
.dep svg.chev{width:16px;height:16px;color:var(--on-panel-2)}
.bd-foot .wait{display:block;color:var(--on-panel);font-weight:700;margin-bottom:4px}
.dep.ctl{color:var(--on-panel-2)}.dep.ctl .nm{font-weight:500;font-style:italic;white-space:normal;padding-right:2px}
.dep.ctl .sub{flex-wrap:wrap;white-space:normal;row-gap:2px}
.dep.ctl .ic{background:transparent;box-shadow:inset 0 0 0 1.5px var(--panel-line)}
.dep:hover .nm{text-decoration:underline;text-underline-offset:3px}
.dep.new .ic{box-shadow:0 0 0 2px var(--near)}
.bd-foot{padding:10px 14px 6px;font:500 12.5px/1.45 var(--sans);color:var(--on-panel-2);border-top:1px solid var(--panel-line)}
.bd-foot b{color:var(--on-panel);font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;padding:10px 14px 4px;font:500 12px/1 var(--sans);color:var(--on-panel-2)}
.legend span{display:inline-flex;align-items:center;gap:5px}
.legend.onstage{color:var(--ink-2);padding:0}
.q{font-style:italic}

/* ---------- since you were here ---------- */
.since{margin-top:18px;padding:12px 14px;border-radius:var(--r-buzz);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair)}
.since h2{font:700 15px/1.2 var(--sans)}
.since li{display:flex;align-items:center;gap:8px;min-height:44px;border-top:1px solid var(--hair);font-size:14.5px}
.since li:first-of-type{border-top:0}
.since a{text-decoration:none;display:flex;align-items:center;gap:8px;flex:1;min-height:44px}
.hl{background:var(--near);color:var(--on-near);font:700 12px/1 var(--sans);padding:4px 6px;border-radius:4px}

/* ---------- line page ---------- */
.lh{display:flex;align-items:flex-start;gap:10px;margin:2px 0 10px}
.lh .tk-emo{background:var(--marigold);width:40px;height:40px;font-size:21px;box-shadow:inset 0 0 0 2px var(--petrol)}
.lh h1{font:850 clamp(24px,7.6cqi,32px)/1.04 var(--display);font-variation-settings:"wdth" 106;letter-spacing:-.015em;text-wrap:balance}
.lh .meta{display:block;font:500 13px/1.45 var(--sans);color:var(--ink-2);margin-top:4px;text-wrap:balance}
.note{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--near);color:var(--on-near);font:500 14px/1.4 var(--sans)}
.note a{font-weight:700}
.note.soft{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 2px var(--hair)}
.stick{position:sticky;top:0;z-index:12;background:var(--stage);margin:0 -16px;padding:0 16px 6px;contain:layout paint}
.strip{display:flex;align-items:center;height:44px;overflow-x:auto;scrollbar-width:none;gap:0;padding:0 2px;scroll-snap-type:x proximity}
@media (max-width:959px){.strip{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}}
.strip::-webkit-scrollbar{display:none}
.strip .dt{width:30px;height:30px;font-size:15px;cursor:pointer;transition:transform var(--t-quick) var(--e-out);scroll-snap-align:center}
.strip .dt::after{content:"";position:absolute;inset:-7px}
.strip .dt[aria-current="true"]{outline:3px solid var(--marigold);outline-offset:1px}
.strip .trk{width:16px;height:3px;background:var(--ink);flex:none}
@media (max-width:599px){.strip .day{display:none}}
.strip .trk.dash{height:0;background:none;border-top:2px dashed var(--ink)}
.strip .trk.l{height:2px}
.strip .trk.att{opacity:.5}
.strip .day{margin-left:auto;padding-left:10px;font:600 12.5px/1.2 var(--sans);color:var(--ink-3);white-space:nowrap}
.stair{position:relative;background:var(--card);border-radius:var(--r-buzz);box-shadow:inset 0 0 0 2px var(--hair);padding:6px 6px 2px}
.stair svg{display:block;width:100%;height:200px;overflow:visible}
.stair.min svg{height:118px}
.stair figcaption{font:500 12px/1.35 var(--sans);color:var(--ink-3);padding:2px 6px 4px;display:flex;align-items:center;gap:8px}
.stair figcaption .sp{flex:1}
.stair.min figcaption{display:none}
.seg{display:inline-flex;border-radius:8px;box-shadow:inset 0 0 0 1.5px var(--hair);padding:2px}
.seg button{height:44px;padding:0 14px;border-radius:6px;font:600 12.5px/1 var(--sans);color:var(--ink-2)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--stage)}
.lane-lbl{font:500 10.5px/1 var(--sans);fill:var(--ink-3)}
.ax{font:800 10px/1 var(--display);font-variation-settings:"wdth" 100;fill:var(--ink-3);font-variant-numeric:tabular-nums}
.ax-g{font-family:var(--sans);font-weight:700;font-variation-settings:normal}
.stops{margin-top:14px;position:relative}
.stop{position:relative;padding:14px 14px 12px 16px;margin-bottom:12px;border-radius:var(--r-buzz);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair);scroll-margin-top:240px}
.stop::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:0 3px 3px 0;background:var(--ink)}
.stop.likely::before{width:2px}
.stop.watching::before{background:none;border-left:3px dashed var(--ink);width:0}
.stop.retracted::before{background:var(--flat)}
.stop.att::before{opacity:.5}
.stop.focus{box-shadow:inset 0 0 0 2px var(--ink)}
.stop.d2{margin-left:18px}.stop.d3{margin-left:30px}
.stop .kick{display:flex;align-items:center;gap:8px;font:600 13px/1.2 var(--sans);color:var(--ink-2);flex-wrap:wrap}
.stop .kick .emo{font-size:14px}
.stop .from{font:500 12.5px/1.3 var(--sans);color:var(--ink-3);margin-top:6px}
.stop .say{font:700 18.5px/1.42 var(--sans);letter-spacing:-.01em;margin-top:8px;text-wrap:pretty}
.stop .say .flaps{--fs:25px;margin:0 1px;vertical-align:-5px}
.stop .say .dir{font:700 15px/1 var(--sans);color:var(--marigold-ink);margin-right:2px;vertical-align:1px}
.stop .say .gloss,.ev-fig .gloss{font:500 .8em/1 var(--sans);color:var(--ink-2);letter-spacing:0;white-space:nowrap}
.ev-fig .gloss{color:var(--on-panel-2)}
.ev-fig .dir{font:700 22px/1 var(--sans);color:var(--spike);margin-right:-4px}
.stop .say.wait .flaps{--fs:25px}
.stop.retracted .say{font-weight:600;color:var(--ink-2)}
.stop .nm{font:850 19px/1.15 var(--display);font-variation-settings:"wdth" 104;letter-spacing:-.01em;margin-top:8px}
.stop.retracted .nm{text-decoration:line-through;text-decoration-thickness:2px;color:var(--ink-3)}
.stop .flag{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--rule);font:600 12px/1 var(--sans);color:var(--ink-2)}
.stop .facts{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;margin-top:10px;font:500 13.5px/1.35 var(--sans);color:var(--ink-2)}
.stop .odds{font:500 14px/1.45 var(--sans);color:var(--ink-2);margin-top:6px}
.stop .eng{font:400 13px/1.45 var(--sans);color:var(--ink-3);margin-top:8px}
.stop .open{margin-top:12px}
.stop .open .btn{min-height:46px;font-size:15px}
.stop.hid .say,.stop.hid .facts,.stop.hid .odds,.stop.hid .eng{filter:blur(7px);user-select:none}
.stop .rev{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:auto}
.fork{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.sw{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border-radius:10px;background:var(--sunk);box-shadow:inset 0 0 0 1.5px var(--hair);font:600 13.5px/1.2 var(--sans);text-align:left}
.stub{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:0 12px;border-radius:10px;color:var(--ink-2);font:600 13.5px/1.2 var(--sans);box-shadow:inset 0 0 0 1.5px var(--hair);background:var(--sunk)}
.stub svg{width:16px;height:16px;margin-left:auto;flex:none;transition:transform var(--t-quick)}.stub[aria-expanded="true"] svg{transform:rotate(90deg)}
.stub .bot{font:700 16px/1 var(--sans);color:var(--flat)}
.flatbox{margin:8px 0 4px}
.flatsum{font:500 13.5px/1.4 var(--sans);color:var(--ink-2);margin-bottom:8px}.flatsum b{color:var(--ink)}
.flatbox .btn{margin-top:10px}
/* the flat grid: one 84 px grey tile per path (icon, its flat sparkline, its multiple, its name), flipped face-up on open */
.flatlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:6px;perspective:600px}
.flatlist .ft{display:grid;grid-template-rows:auto 22px auto auto;justify-items:center;gap:3px;padding:8px 4px 6px;border-radius:8px;background:var(--sunk);box-shadow:inset 0 0 0 1.5px var(--hair);font:500 11px/1.2 var(--sans);color:var(--ink-3);text-align:center;transform-origin:50% 50%}
.flatlist .ft .fi{font-size:15px;opacity:.75}
.flatlist .ft b{font:850 13px/1 var(--display);font-variation-settings:"wdth" 100;color:var(--ink-2)}
.flatlist .ft .fl{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flatlist svg{width:64px;height:22px;display:block}
.wt{margin-top:22px}
.wt .track{position:relative;height:14px;border-radius:7px;box-shadow:inset 0 0 0 1.5px var(--hair);background:var(--sunk)}
.wt .track i{position:absolute;left:0;top:0;bottom:0;border-radius:7px 0 0 7px;border-right:2px solid var(--ink);background:repeating-linear-gradient(90deg,var(--hair) 0 6px,transparent 6px 10px)}
/* the look: a marigold marker with a triangle cap above the track and its date under it */
.wt .track b{position:absolute;top:-2px;bottom:-2px;width:4px;margin-left:-2px;border-radius:1px;background:var(--marigold);box-shadow:0 0 0 1.5px var(--petrol)}
.wt .track b .cap{position:absolute;left:50%;top:-11px;width:0;height:0;margin-left:-7px;border:7px solid transparent;border-top:8px solid var(--petrol);border-bottom:0}
.wt .track b .cap::after{content:"";position:absolute;left:-5px;top:-8px;border:5px solid transparent;border-top:6px solid var(--marigold);border-bottom:0}
.wt .track b .dl{position:absolute;top:18px;left:50%;transform:translateX(-50%);font:700 12px/1.2 var(--sans);color:var(--ink);white-space:nowrap}
.wt .track b[style*="left:9"] .dl,.wt .track b[style*="left:8"] .dl{left:auto;right:-4px;transform:none}
.wt .track b[style*="left:3%"] .dl,.wt .track b[style*="left:1"] .dl{left:-4px;transform:none}
.wt .lbls{display:flex;justify-content:space-between;font:500 12px/1.3 var(--sans);color:var(--ink-3);margin-top:24px}
.stop .eng.base{color:var(--ink-2);font-weight:500}
.wt .due{font:700 14px/1.3 var(--sans);color:var(--ink)}
.idea{font:italic 400 14px/1.45 var(--sans);color:var(--ink-3);padding:6px 0 6px 14px;border-left:2px dotted var(--flat);margin:10px 0}
.lend{display:flex;align-items:center;gap:10px;margin:18px 0 6px;font:700 15px/1.3 var(--sans)}
.lend::before{content:"";width:28px;height:4px;border-radius:2px;background:var(--ink);flex:none}
.lend.nowhere::before{background:var(--flat)}
.held{font:500 13.5px/1.4 var(--sans);color:var(--ink-3);margin:6px 0}
.depth3{margin:0 0 12px 30px}
.den{margin-top:18px;padding:12px 14px;border-radius:var(--r-buzz);background:var(--sunk);font:500 14px/1.5 var(--sans);color:var(--ink-2)}
.den b{color:var(--ink)}
/* the replay scrubber sits under the chart it drives (inside .stair); the play button is 44 px, the range is a 44 px-high hit */
.replay{display:flex;align-items:center;gap:10px;margin:0;padding:2px 6px 4px}
.replay button{width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--stage);display:grid;place-items:center;flex:none}
.replay button svg{width:16px;height:16px}
.replay label{flex:1;display:flex;flex-direction:column;gap:0;font:600 12.5px/1.2 var(--sans);color:var(--ink-3)}
.replay input{width:100%;accent-color:var(--ink);height:44px;margin:0;-webkit-appearance:none;appearance:none;background:transparent}
.replay input::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--rule) 0 2px,transparent 2px 12px)}
.replay input::-moz-range-track{height:4px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--rule) 0 2px,transparent 2px 12px)}
.replay input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin-top:-9px;border-radius:50%;background:var(--marigold);border:2px solid var(--petrol);box-shadow:0 2px 0 var(--petrol)}
.replay input::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--marigold);border:2px solid var(--petrol);box-shadow:0 2px 0 var(--petrol)}
.stair.min .replay{display:none}
.slip{margin-top:12px;padding:14px 14px 12px;border-radius:0 0 10px 10px;background:var(--sunk);box-shadow:inset 0 0 0 2px var(--hair);position:relative;font:500 14.5px/1.45 var(--sans);white-space:pre-wrap;word-break:break-word}
.slip::before{content:"";position:absolute;left:0;right:0;top:-6px;height:6px;background:radial-gradient(circle at 5px 6px,var(--sunk) 4px,transparent 4.5px) 0 0/10px 6px}
.slip small{display:block;font:600 12px/1 var(--sans);color:var(--ink-3);margin-bottom:6px;white-space:normal}
.follow{display:grid;gap:8px;margin-top:10px}
.row{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 12px;border-radius:var(--r-buzz);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair);text-decoration:none;font:600 15px/1.25 var(--sans)}
.row small{display:block;font:400 12.5px/1.3 var(--sans);color:var(--ink-3)}
.row .ic{width:32px;height:32px;border-radius:var(--r-tile);background:var(--sunk);display:grid;place-items:center;font-size:16px;flex:none}
.row svg.chev{margin-left:auto;width:16px;height:16px;color:var(--ink-3);flex:none}
.wl{margin-top:18px;padding:14px;border-radius:var(--r-buzz);background:var(--sunk)}
.wl form{display:flex;gap:8px;margin-top:10px;align-items:flex-start}
.wl .btn{width:auto;flex:none;min-height:44px}
.wl input{flex:1 1 auto;min-width:0;min-height:44px;border-radius:10px;border:2px solid var(--hair);background:var(--card);color:var(--ink);padding:0 12px}

/* ---------- evidence sheet ---------- */
.scrim{position:fixed;inset:0;z-index:40;background:rgba(3,24,27,.5);opacity:0;transition:opacity var(--t-open) var(--e-out)}
.scrim.on{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-height:92vh;overflow-y:auto;overscroll-behavior:contain;border-radius:18px 18px 0 0;background:var(--panel);color:var(--on-panel);box-shadow:inset 0 0 0 1px var(--panel-ring),0 -20px 40px -20px rgba(0,0,0,.5);transform:translateY(100%);transition:transform var(--t-open) var(--e-out);padding:0 16px 28px}
.sheet.on{transform:none}
.sheet:focus{outline:none}
.sheet .grab{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:8px;height:52px;background:var(--panel);margin:0 -16px;padding:0 8px 0 16px;border-bottom:1px solid var(--panel-line)}
.sheet .grab b{font:600 13px/1.2 var(--sans);color:var(--on-panel-2);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet .xb{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:var(--on-panel)}
.sheet .xb svg{width:18px;height:18px}
.sheet :focus-visible{outline-color:var(--focus-on-dark)}
.sheet a{color:var(--on-panel)}
.ev-h{padding-top:14px}
.ev-stamp{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ev-stamp .stamp{color:var(--on-panel)}
.ev-stamp .stamp.measured{background:var(--on-panel);color:var(--panel)}
.ev-def{font:500 13px/1.4 var(--sans);color:var(--on-panel-2);margin-top:8px}
.ev-name{font:850 24px/1.08 var(--display);font-variation-settings:"wdth" 104;letter-spacing:-.015em;margin-top:12px}
.ev-fig{display:flex;align-items:center;gap:12px;margin-top:10px}
.ev-fig .flaps{--fs:46px}
.ev-fig p{font:500 14px/1.35 var(--sans);color:var(--on-panel-2)}
.ev-fig p b{color:var(--on-panel)}
.ev-say{font:700 17px/1.4 var(--sans);margin-top:12px}
.ev-say b{color:var(--spike)}
.retban{margin-top:14px;padding:10px 12px;border-radius:10px;box-shadow:inset 0 0 0 2px var(--miss);border-left:6px solid var(--miss);font:600 14.5px/1.4 var(--sans);background:rgba(207,58,45,.12)}
.qs{margin-top:18px;padding-top:14px;border-top:1px solid var(--panel-line)}
.qs h3{font:700 16px/1.25 var(--sans);display:flex;gap:8px;align-items:baseline}
.qs h3 i{font:850 13px/1 var(--display);font-style:normal;color:var(--spike);font-variation-settings:"wdth" 100}
.qs p{font:400 14px/1.5 var(--sans);color:var(--on-panel-2);margin-top:6px}
.qs p b{color:var(--on-panel);font-weight:700}
.qs svg.q1{display:block;width:100%;height:150px;margin-top:10px;overflow:visible}
.q1k{display:flex;flex-wrap:wrap;gap:4px 14px;font:500 12px/1.2 var(--sans);color:var(--on-panel-2);margin-top:6px}
.q1k span{display:inline-flex;align-items:center;gap:6px}
.q1k i{display:inline-block;width:14px;height:3px;border-radius:2px}
.ruler{display:flex;align-items:center;gap:8px;margin-top:10px;font:600 14px/1.2 var(--sans)}
.ruler .d{padding:6px 9px;border-radius:6px;background:var(--panel-2)}
.ruler .ln{flex:1;height:2px;background:var(--on-panel-3);position:relative;max-width:120px}
.ruler .ok{color:var(--spike)}
.chs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ch{width:92px;padding:8px;border-radius:8px;box-shadow:inset 0 0 0 1.5px var(--on-panel-3);font:600 12.5px/1.25 var(--sans)}
.ch.agree{background:var(--on-panel);color:var(--panel);box-shadow:none}
.ch.nodata{background:repeating-linear-gradient(45deg,transparent 0 5px,rgba(234,243,240,.16) 5px 7px)}
.ch small{display:block;font:500 11.5px/1.3 var(--sans);opacity:.85;margin-top:3px}
.path{margin-top:10px;display:grid;gap:6px}
.path li{padding:9px 11px;border-radius:8px;background:var(--panel-2);font:500 14px/1.4 var(--sans)}
.path li small{display:block;font:500 12px/1.3 var(--sans);color:var(--on-panel-2);margin-top:2px}
.qs .idea{color:var(--on-panel-3);border-left-color:var(--on-panel-3)}
.pstrip{display:grid;grid-template-columns:repeat(25,1fr);gap:2px;margin-top:10px;max-width:330px}
.pstrip i{aspect-ratio:1;border-radius:1.5px;background:rgba(234,243,240,.2)}
.pstrip i.lit{background:var(--spike)}
.meter{display:flex;flex-wrap:wrap;gap:3px;margin-top:10px;max-width:330px}
.meter i{width:12px;height:12px;border-radius:2px;box-shadow:inset 0 0 0 1.5px var(--on-panel-3)}
.meter i.lit{background:var(--spike);box-shadow:none}
.luck{margin-top:12px;padding:12px;border-radius:10px;background:var(--panel-2)}
.luck p{margin-top:4px}
.sibs{display:grid;gap:6px;margin-top:8px}
.sibs li{display:grid;grid-template-columns:minmax(0,1fr) 64px 46px;gap:10px;align-items:center;font:500 13.5px/1.2 var(--sans);color:var(--on-panel-2)}
.sibs b{font:850 14px/1 var(--display);font-variation-settings:"wdth" 100;text-align:right;color:var(--on-panel)}
.sibs svg{width:64px;height:20px}
.math{margin-top:18px;border-top:1px solid var(--panel-line)}
.math summary{min-height:52px;display:flex;align-items:center;gap:8px;font:700 15px/1 var(--sans);cursor:pointer;list-style:none}
.math summary::-webkit-details-marker{display:none}
.math summary::before{content:"";width:8px;height:8px;border-right:2px solid;border-bottom:2px solid;transform:rotate(-45deg);transition:transform var(--t-quick)}
.math[open] summary::before{transform:rotate(45deg)}
.tw{overflow-x:auto;max-width:100%}
table.t{width:100%;border-collapse:collapse;font:500 13px/1.35 var(--sans);margin:8px 0 12px}
table.t th,table.t td{text-align:left;padding:7px 6px;border-top:1px solid var(--panel-line);vertical-align:top}
table.t th{font-weight:700;color:var(--on-panel-2)}
table.t td.n{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.hash{font-size:12px;word-break:break-all;color:var(--on-panel-2)}
.ctx{margin-top:18px;padding-top:10px;border-top:1px solid var(--panel-line);font:500 11.5px/1.5 var(--sans);color:var(--on-panel-3)}
.ctx b{font:900 12px/1 var(--display);color:var(--on-panel)}
.wm2{display:inline-flex;align-items:center;font-variation-settings:"wdth" 106;letter-spacing:-.012em;white-space:nowrap}
.wm2 svg{width:.7em;height:.56em;margin:0 .04em;overflow:visible;transform:translateY(.06em)}.wm2 svg path{fill:none;stroke:var(--spike);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ctx .sepq{width:4px;height:4px;margin:0 6px;vertical-align:1px}
.sheet .btn.sec{background:transparent;color:var(--on-panel);box-shadow:inset 0 0 0 2px var(--on-panel-3)}

/* ---------- lists: map, archive, lands, week ---------- */
.list{display:grid;gap:10px;margin-top:12px}
.li{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border-radius:var(--r-buzz);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair);text-decoration:none;min-height:64px}
.li .ic{width:40px;height:40px;border-radius:var(--r-tile);background:var(--sunk);display:grid;place-items:center;font-size:20px}
.li .ic.m{background:var(--marigold)}
.li .nm{font:700 15.5px/1.25 var(--sans)}
.li .sub{font:500 12.5px/1.35 var(--sans);color:var(--ink-3);margin-top:3px;display:flex;flex-wrap:wrap;align-items:center}
.li .rt{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.li .rt .flaps{--fs:22px}
.li.recon .ic{box-shadow:inset 0 0 0 2px var(--rule);background:transparent}
.tagr{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--rule);font:600 11.5px/1 var(--sans);color:var(--ink-2);margin-right:6px}
.mini{position:relative;display:block;height:12px;margin:10px 6px 2px;border-top:2px solid var(--hair)}
.mini i{position:absolute;top:-7px;width:12px;height:12px;margin-left:-6px;border-radius:3px;background:var(--card);box-shadow:inset 0 0 0 2px var(--ink);transition:opacity var(--t-quick)}
.mini i.sh{background:var(--marigold);box-shadow:inset 0 0 0 2px var(--petrol)}.mini i.measured{background:var(--ink)}.mini i.likely{background:linear-gradient(90deg,var(--ink) 50%,var(--card) 50%)}.mini i.retracted{box-shadow:inset 0 0 0 2px var(--flat)}
@media (min-width:960px){body:not([data-route=home]):not([data-route=line]):not([data-route=lines]):not([data-route=stop]) #main{max-width:820px}}
.scrub{margin-top:14px;padding:12px;border-radius:var(--r-buzz);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair)}
.scrub input{width:100%;accent-color:var(--ink);height:44px}
.scrub p{font:600 13px/1.3 var(--sans);color:var(--ink-2);display:flex;justify-content:space-between}
.empty{padding:18px 14px;border-radius:var(--r-buzz);box-shadow:inset 0 0 0 2px dashed var(--hair);background:var(--sunk);font:500 14.5px/1.45 var(--sans);color:var(--ink-2)}
.wk{margin-top:14px}

/* ---------- methods / receipts ---------- */
.doc h2{font:850 22px/1.1 var(--display);font-variation-settings:"wdth" 106;letter-spacing:-.015em;margin:34px 0 10px}
.doc h3{font:700 16px/1.3 var(--sans);margin:18px 0 6px}
.doc p,.doc li{font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.doc p+p{margin-top:10px}
.doc ul.b{list-style:none;display:grid;gap:6px;margin-top:8px}
.doc ul.b li{padding-left:16px;position:relative}
.doc ul.b li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:1px;background:var(--marigold)}
.doc table.t{color:var(--ink-2)}
.doc table.t th,.doc table.t td{border-top-color:var(--hair)}
.doc table.t th{color:var(--ink-3)}
.rc{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-top:12px}
.rc div{padding:12px;border-radius:var(--r-buzz);background:var(--card);box-shadow:inset 0 0 0 2px var(--hair)}
.rc b{display:block;font:850 26px/1 var(--display);font-variation-settings:"wdth" 100;margin-bottom:6px}
.rc span{font:500 12.5px/1.35 var(--sans);color:var(--ink-3)}
.brk{margin-top:12px;padding:12px 14px;border-radius:10px;background:var(--near);color:var(--on-near);font:600 14.5px/1.45 var(--sans)}
.ks{margin-top:12px;max-width:420px}.ks svg{display:block;width:100%;height:64px}.ks figcaption{margin-top:4px}
.doc{max-width:780px}
table.t th.n{text-align:right}
.pm{margin-top:12px;padding:14px 16px;border-radius:var(--r-buzz);background:var(--panel);color:var(--on-panel)}
.pm p{color:var(--on-panel-2)}.pm b{color:var(--on-panel)}

/* ---------- footer, toast, dialog ---------- */
.foot{margin-top:36px;padding:18px 0 28px;border-top:2px solid var(--hair);font:400 13px/1.55 var(--sans);color:var(--ink-3)}
.foot nav{display:flex;flex-wrap:wrap;gap:0 16px;margin-bottom:8px}
.foot nav a{font:600 14px/1 var(--sans);color:var(--ink);min-height:44px;display:inline-flex;align-items:center}
.foot p{margin-top:8px}
.foot b{color:var(--ink-2)}
#toast{position:fixed;left:50%;bottom:22px;z-index:70;transform:translate(-50%,20px);opacity:0;pointer-events:none;display:flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:var(--r-pill);background:var(--ink);color:var(--stage);font:600 14px/1 var(--sans);transition:transform var(--t-quick) var(--e-out),opacity var(--t-quick);white-space:nowrap}
#toast.on{opacity:1;transform:translate(-50%,0)}
dialog{border:0;border-radius:var(--r-ticket);padding:18px 18px 16px;max-width:min(520px,calc(100vw - 24px));max-height:88vh;background:var(--card);color:var(--ink);box-shadow:var(--lift)}
dialog::backdrop{background:rgba(3,24,27,.5)}
dialog h2{font:850 22px/1.1 var(--display);font-variation-settings:"wdth" 106;margin-bottom:10px}
dialog .dh{display:flex;align-items:flex-start;gap:8px}dialog .dh h2{flex:1}
dialog .xb{width:44px;height:44px;margin:-8px -10px 0 0;display:grid;place-items:center;border-radius:50%;color:var(--ink);flex:none}dialog .xb svg{width:18px;height:18px}
dialog h3{font:700 15px/1.3 var(--sans);margin:14px 0 6px}
dialog p,dialog li{font-size:14.5px;line-height:1.5;color:var(--ink-2)}
dialog li{display:flex;gap:10px;align-items:flex-start;margin:7px 0}
dialog li b{color:var(--ink)}
.tog{display:flex;align-items:center;gap:10px;min-height:44px;font:600 14.5px/1.3 var(--sans)}
.tog input{width:22px;height:22px;accent-color:var(--ink)}

/* ---------- desktop ---------- */
@media (min-width:960px){
  .app{max-width:1200px;padding:0 48px 32px}
  .bar{height:72px}.wm{font-size:26px}
  .home{display:grid;grid-template-columns:376px minmax(0,1fr);gap:48px;align-items:start}
  .home .board{margin-top:0}
  .home .chips{min-height:96px}
  .line{display:grid;grid-template-columns:376px minmax(0,1fr);gap:48px;align-items:start}
  .line aside{position:sticky;top:16px}
  .stick{margin:0;padding:0 0 8px;top:0}
  .stair svg{height:320px}.stair.min svg{height:320px}
  .strip.v{flex-direction:column;align-items:flex-start;height:auto;overflow:visible}
  .stop.d2,.stop.d3{margin-left:36px}
  .kids{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin-left:36px}
  .kids .stop{margin-left:0}
  .kidrow{list-style:none;margin-bottom:12px}.kidrow .kids{margin-bottom:0}
  .sheet{left:auto;top:0;width:480px;max-height:none;border-radius:18px 0 0 18px;transform:translateX(100%)}
  .li{grid-template-columns:44px minmax(0,1fr) auto}
  .cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
}
@media (max-width:959px){.line aside .dsk{display:none}}
.side .tk-title{font-size:30px}.side .tk-sub{margin-top:8px}.side .btn svg{width:18px}
.line aside .den{margin-top:14px}
@media (min-width:960px){.mob{display:none!important}}

/* ---------- motion and colour fallbacks ---------- */
@keyframes march{to{stroke-dashoffset:-16}}
.marching{animation:march 1.6s linear infinite}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:150ms!important;scroll-behavior:auto!important}
  .marching{animation:none}
}
@media (forced-colors:active){
  .tt,.dt,.pips i,.flap,.stamp,.ch,.meter i,.pstrip i{forced-color-adjust:none}
  .tt.measured,.panel .tt.measured,.dt.measured,.pips i.on,.ch.agree,.stamp.measured,.ev-stamp .stamp.measured{background:CanvasText;color:Canvas}
  .panel .tt.likely{background:linear-gradient(90deg,CanvasText 50%,Canvas 50%);box-shadow:inset 0 0 0 1.5px CanvasText}
  .panel .tt.watching{background:Canvas;box-shadow:inset 0 0 0 1.5px CanvasText}
  .btn{border:2px solid ButtonText}
  .tt.likely{background:linear-gradient(90deg,CanvasText 50%,Canvas 50%);box-shadow:inset 0 0 0 1.5px CanvasText}
  .dt.likely::before{background:repeating-linear-gradient(45deg,CanvasText 0 2px,Canvas 2px 5px)}
  .tt.watching,.dt.watching{background:Canvas;box-shadow:inset 0 0 0 1.5px CanvasText;border-color:CanvasText}
  .tt.retracted,.flat-mark{color:GrayText;box-shadow:inset 0 0 0 1.5px GrayText}
  .meter i.lit,.pstrip i.lit,.flap{background:Highlight;color:HighlightText}
  .spk,.lane-hot{stroke:Highlight!important}
  .lane-flat{stroke:GrayText!important}
  :focus-visible{outline-color:CanvasText}
  .stop::before{background:CanvasText!important}
}

/* ---------- /ripples/pro/ (kept as D-1 left it): aliases for its v5 class names and tokens ---------- */
body:not([data-route]) .w{max-width:640px;margin:0 auto;padding-inline:16px}
body:not([data-route]) .bar>.w{display:flex;align-items:center;gap:6px;height:56px;width:100%}
body:not([data-route]) .brand{font:900 21px/1 var(--display);font-variation-settings:"wdth" 106}body:not([data-route]) .brand a{text-decoration:none}
body:not([data-route]) .micro{font-size:12.5px;color:var(--ink-3);margin-top:6px}
body:not([data-route]) .card{background:var(--card);border-radius:var(--r-buzz);box-shadow:inset 0 0 0 2px var(--hair);padding:16px}
body:not([data-route]) .eb{font:600 13px/1.2 var(--sans);color:var(--ink-3);margin-bottom:8px}
body:not([data-route]) .btn.wide{width:100%}body:not([data-route]) .btn.ghost{background:var(--card);color:var(--ink)}
body:not([data-route]) .jf{display:grid;gap:8px}body:not([data-route]) .jf input,body:not([data-route]) .jf select{min-height:44px;border-radius:10px;border:2px solid var(--hair);background:var(--card);color:var(--ink);padding:0 10px}
body:not([data-route]) .wrapchips{flex-wrap:wrap}
body:not([data-route]) .tag{display:inline-flex;height:20px;padding:0 6px;border-radius:4px;box-shadow:inset 0 0 0 1.5px var(--rule);font:600 11.5px/20px var(--sans)}
:root{--line:var(--hair);--muted:var(--ink-3);--mono:var(--sans);--tint:var(--sunk);--warm:var(--marigold-ink);--surface:var(--card);--body:var(--ink-2)}
.js .rm-nojs{display:none}.js #main{min-height:100vh}