@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-normal-latin.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-normal-latin-ext.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-italic-latin.woff2) format("woff2");font-weight:200 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-italic-latin-ext.woff2) format("woff2");font-weight:200 900;font-style:italic;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/IBMPlexSans-latin.woff2) format("woff2");font-weight:100 700;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+2212}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/IBMPlexSans-latin-ext.woff2) format("woff2");font-weight:100 700;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}

:root{
  --bg:#f5f1e8;--surface:#fbf8f2;--card:#fffdf8;--text:#17161c;--muted:#4a4652;--rule:#ddd5c5;--accent:#a6560f;--accent-ink:#8c4508;--btn-ink:#fff;--focus:#0b57b0;
  --lamp:#f2b34c;--ember:#b5523b;--ash:#8d8899;--grey:#a7a2b0;
  --night:#080a14;--night2:#0e1222;--ntext:#efe9dc;--nmuted:#b9b3c4;--nrule:#2a2f45;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;--sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --top:48px;color-scheme:light;--line:var(--rule);--mut:var(--muted);--acc:var(--accent);--fg:var(--text)
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0d0f18;--surface:#151826;--card:#171a29;--text:#efe9dc;--muted:#b9b3c4;--rule:#2b2f44;--accent:#f2b34c;--accent-ink:#f5c26e;--btn-ink:#1a1204;--focus:#8ab8ff;--grey:#5f5b6c;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0d0f18;--surface:#151826;--card:#171a29;--text:#efe9dc;--muted:#b9b3c4;--rule:#2b2f44;--accent:#f2b34c;--accent-ink:#f5c26e;--btn-ink:#1a1204;--focus:#8ab8ff;--grey:#5f5b6c;color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--top) + 12px)}
body{margin:0;background:var(--bg);color:var(--text);font:400 18px/1.62 var(--serif);text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:var(--accent-ink);text-underline-offset:2px}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
strong{font-weight:650}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
table.vh{display:block;max-width:1px;max-height:1px;left:0;top:0}
.rgrid>div{position:relative}
.skip-link{position:absolute;left:-999px;top:8px;background:var(--surface);color:var(--text);padding:8px 12px;z-index:50}.skip-link:focus{left:8px}

/* top bar: takes the night colours, quiet */
.topbar{position:sticky;top:0;z-index:30;height:var(--top);display:flex;align-items:center;gap:10px;padding:0 14px;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right));background:var(--night);color:var(--ntext);border-bottom:1px solid var(--nrule);font:500 14px/1 var(--sans)}
.brand{display:flex;align-items:center;gap:8px;color:var(--ntext);text-decoration:none;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.brand-mark{flex:none;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle,#fff4d6 0 18%,#f2b34c 30%,rgba(242,179,76,0) 72%);box-shadow:0 0 10px 2px rgba(242,179,76,.45)}
.topnav{display:flex;gap:14px;margin-left:12px}.topnav a{color:var(--nmuted);text-decoration:none;white-space:nowrap}.topnav a[aria-current="true"]{color:var(--ntext)}
.spacer{flex:1}
.chip{color:var(--nmuted);text-decoration:none;padding:6px 7px;border-radius:6px}.chip[aria-current="page"]{color:var(--ntext);background:var(--night2)}
.icon-btn{flex:none;border:1px solid var(--nrule);background:transparent;color:var(--ntext);border-radius:8px;width:34px;height:34px;display:grid;place-items:center;cursor:pointer}
:root[data-theme="dark"] .i-moon,:root:not([data-theme]) .i-moon{display:none}
:root[data-theme="light"] .i-sun{display:none}
@media (prefers-color-scheme:light){:root:not([data-theme]) .i-moon{display:inline}:root:not([data-theme]) .i-sun{display:none}}
@media (max-width:980px){.topnav{display:none}}

/* night band: hero + stage */
.hero,.stage,.topbar{--focus:#9fd0ff}
.hero,.stage{background:var(--night);color:var(--ntext)}
.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:44px;align-items:end;padding:34px max(20px,calc((100vw - 1180px)/2)) 18px}
.kicker{font:600 13px/1.3 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--lamp);margin:0 0 12px}
h1{font:700 clamp(32px,4vw,52px)/1.06 var(--serif);letter-spacing:-.012em;margin:0 0 16px;text-wrap:balance}
.deck{font-size:18.5px;margin:0;color:#ddd6c8}
.deck strong{color:#ffd58a}
.shared-line{font:500 15.5px/1.45 var(--sans);background:var(--night2);border-left:3px solid var(--lamp);padding:10px 12px;margin:0 0 14px}
.finder{background:var(--night2);border:1px solid var(--nrule);border-radius:14px;padding:16px 16px 12px}
.finder label{display:block;font:600 15px var(--sans);margin:0 0 7px}
.qrow{display:flex;gap:8px}
.qrow input{flex:1;min-width:0;font:500 18px var(--sans);padding:11px 12px;border:1px solid #3a4060;border-radius:10px;background:#0a0d19;color:var(--ntext);min-height:48px}
.qrow input::placeholder{color:#8e889c}
.sugg{list-style:none;margin:6px 0 0;padding:0;border:1px solid var(--nrule);border-radius:10px;background:#0a0d19;font:500 15.5px/1.3 var(--sans);overflow:hidden}
.sugg:empty{display:none}
.sugg li{padding:10px 12px;cursor:pointer;border-bottom:1px solid var(--nrule)}.sugg li:last-child{border-bottom:0}
.sugg li[aria-selected="true"],.sugg li:hover{background:#1a1f35}
.sugg span{color:var(--nmuted);font-size:13.5px}
.examples{font:500 14px var(--sans);color:var(--nmuted);display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0 2px}
.examples button[data-example]{font:600 13.5px var(--sans);border:1px solid #3a4060;background:transparent;color:var(--ntext);border-radius:999px;padding:6px 11px;cursor:pointer;min-height:36px}
.hero .linkish{color:#ffd58a}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--rule);background:var(--surface);color:var(--text);font:600 15px/1 var(--sans);padding:11px 16px;border-radius:10px;cursor:pointer;text-decoration:none;min-height:44px}
.btn.primary{background:var(--lamp);border-color:var(--lamp);color:#1a1204}
.btn.small{font-size:14px;padding:8px 12px;min-height:38px}

.stage{padding:0 max(12px,calc((100vw - 1240px)/2)) 26px}
.stage-in{position:relative}
.mapwrap{position:relative;border-radius:16px;overflow:hidden;background:#070912;border:1px solid var(--nrule)}
.mapwrap canvas{display:block;width:100%;touch-action:pan-y}
.mapwrap.zoomed canvas{touch-action:none;cursor:grab}
.map-msg{position:absolute;inset:auto 0 45% 0;text-align:center;font:500 14px var(--sans);color:var(--nmuted);margin:0}
.yearbox{position:absolute;left:18px;top:14px;display:flex;flex-direction:column;pointer-events:none;text-shadow:0 1px 8px #000}
.yr{font:700 clamp(40px,6vw,76px)/1 var(--serif);color:#fff2d8;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.ycount{font:600 clamp(13px,1.5vw,16px)/1.35 var(--sans);color:#ffd58a;margin-top:6px}
.yfrozen{font:500 clamp(12.5px,1.4vw,15px)/1.35 var(--sans);color:#e59a74}
.map-ctl{position:absolute;right:10px;bottom:10px;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.map-ctl button{min-width:40px;height:40px;border-radius:9px;border:1px solid #3a4060;background:rgba(14,18,34,.88);color:var(--ntext);font:600 19px/1 var(--sans);cursor:pointer}
.map-ctl .whole{font:600 13.5px var(--sans);padding:0 10px}
.timebar{display:flex;align-items:center;gap:12px;margin:12px 4px 0}
.timebar input{flex:1;accent-color:var(--lamp);min-height:32px}
.tb-end{font:600 13px var(--sans);color:var(--nmuted)}
.btn.play{background:transparent;color:var(--ntext);border-color:#3a4060;min-width:136px}
.btn.play[data-on]{border-color:var(--lamp);color:#ffd58a}
.legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;margin:12px 4px 0;padding:0;font:500 13.5px/1.35 var(--sans);color:var(--nmuted)}
.legend li{display:flex;align-items:center;gap:7px}
.lg{display:inline-block;width:14px;height:14px;border-radius:50%}
.lg.lit{background:radial-gradient(circle,#fff4d6 0 16%,#ffd68c 26%,rgba(255,170,70,.45) 55%,rgba(255,140,40,0) 72%)}
.lg.frozen{width:9px;height:9px;margin:0 2.5px;background:#b5523b}
.lg.dark{width:9px;height:9px;margin:0 2.5px;border:1.5px solid rgba(128,140,172,.85);background:none}
.stage-note{font:500 13px/1.45 var(--sans);color:var(--nmuted);margin:8px 4px 0}
.pop{position:absolute;z-index:4;width:max-content;max-width:min(260px,72vw);background:#101425;color:var(--ntext);border:1px solid #3a4060;border-radius:10px;padding:9px 11px;font:500 13.5px/1.4 var(--sans);box-shadow:0 8px 24px rgba(0,0,0,.45)}
.pop p{margin:0 0 4px}.pop b{font-size:15px}
.pop .linkish{color:#ffd58a}
.linkish{background:none;border:0;padding:0;color:var(--accent-ink);font:600 13.5px var(--sans);cursor:pointer;text-decoration:underline;text-underline-offset:2px;min-height:28px}
.hint{position:absolute;pointer-events:none;z-index:3;background:#101425;color:var(--ntext);border:1px solid #3a4060;border-radius:7px;padding:4px 7px;font:500 12.5px var(--sans);white-space:nowrap}

/* result card */
.res{max-width:1180px;margin:30px auto 0;padding:0 20px}
.rcard{background:var(--card);border:1px solid var(--rule);border-radius:16px;padding:22px 22px 14px;box-shadow:0 12px 40px rgba(10,10,30,.08)}
.rgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px}
.rcard h2{font:700 32px/1.12 var(--serif);margin:0}
.rsub{font:500 14.5px var(--sans);color:var(--muted);margin:4px 0 14px}
.rbig{font:600 21px/1.35 var(--serif);margin:6px 0 8px;padding-left:12px;border-left:4px solid var(--lamp)}
.rbig.st-frozen{border-color:var(--ember)}.rbig.st-dark,.rbig.st-never{border-color:var(--ash)}
.rline{margin:0 0 10px}
.rnote{font:500 13.5px/1.45 var(--sans);color:var(--muted);margin:6px 0 10px}
.fig-h{font:600 14.5px/1.35 var(--sans);margin:14px 0 6px}
.strip{display:grid;grid-template-columns:repeat(31,minmax(0,1fr));gap:2px;background:#0a0d19;border-radius:8px;padding:8px 6px}
.lamp{display:inline-block;aspect-ratio:1;border-radius:50%}
.strip .lamp{width:100%}
.lamp.on{background:radial-gradient(circle,#fff4d6 0 20%,#ffcf7a 38%,rgba(255,170,70,.35) 62%,rgba(255,140,40,0) 76%)}
.lamp.fz{background:radial-gradient(circle,#d6785c 0 22%,#b5523b 34%,rgba(181,82,59,0) 38%)}
.lamp.off{background:radial-gradient(circle,transparent 0 17%,rgba(128,140,172,.8) 19% 24%,transparent 26%)}
.strip-ax{position:relative;display:flex;justify-content:space-between;font:500 12px var(--sans);color:var(--muted);margin:3px 2px 0}.strip-ax span[style]{position:absolute;transform:translateX(-50%)}
.strip-key{font:500 12.5px/1.6 var(--sans);color:var(--muted);margin:6px 0 0;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.strip-key .lamp{width:14px;height:14px;background-color:#0a0d19;margin-right:4px;vertical-align:-2px}
.stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px 16px;margin:6px 0 4px}
.stat div{border-top:2px solid var(--lamp);padding-top:4px;font:500 13.5px/1.35 var(--sans);color:var(--muted)}
.stat b{display:block;font:700 26px/1.1 var(--serif);color:var(--text);font-variant-numeric:tabular-nums}
.spark svg{display:block;width:100%;height:auto;max-width:420px}
.spark text{font-family:var(--sans);fill:var(--muted)}
.spark .seg{stroke:var(--lamp);stroke-width:2.6;stroke-linecap:round}
.spark .flat{stroke:var(--ember);stroke-width:4;stroke-linecap:round}
.spark .dot{fill:var(--accent)}
.flatkey{display:inline-block;width:20px;height:4px;border-radius:2px;background:var(--ember);margin-right:7px;vertical-align:3px}
.bud{list-style:none;padding:0;margin:0;font:500 15px/1.5 var(--sans);font-variant-numeric:tabular-nums}
.bud li{padding:5px 0;border-bottom:1px solid var(--rule)}.bud li.na{color:var(--muted);font-size:13.5px}
.res-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}

/* sections */
.sec{max-width:740px;margin:0 auto;padding:48px 20px 6px}
.sec h2{font:700 30px/1.16 var(--serif);margin:0 0 14px;text-wrap:balance}
.sec p{margin:0 0 15px}
.anchor{margin-left:8px;font:500 16px var(--sans);color:var(--muted);text-decoration:none;opacity:0}
h2:hover .anchor,.anchor:focus-visible{opacity:1}
.fig{margin:18px 0 20px}
.fig-note{font:500 13px/1.45 var(--sans);color:var(--muted);margin:8px 0 0}
.fig svg{display:block;width:100%;height:auto;overflow:visible}
.fig svg text{font-family:var(--sans);fill:var(--muted)}
.fig svg .t-strong{fill:var(--text);font-weight:600}
.fig svg .axis{stroke:var(--rule)}
.fig svg .zero{stroke:var(--muted)}
.fig svg .ref{stroke:var(--muted);stroke-dasharray:4 4}
.fig svg .area{fill:color-mix(in srgb,var(--lamp) 12%,transparent)}
.fig svg .band{fill:color-mix(in srgb,var(--ember) 12%,transparent)}
.fig svg .line{stroke:var(--accent);fill:none;stroke-width:2.6}
.fig svg .line2{stroke:var(--grey);fill:none;stroke-width:2.2}
.fig svg .dot{fill:var(--accent)}
.fig svg .dot2{fill:var(--grey)}
.coins{display:grid;grid-template-columns:repeat(auto-fill,minmax(14px,1fr));gap:3px;max-width:620px}
.coins i{aspect-ratio:1;border-radius:2px;background:var(--grey);opacity:.75}
.coins i.b{background:var(--lamp);opacity:1;box-shadow:0 0 8px 1px color-mix(in srgb,var(--lamp) 70%,transparent)}

/* rail */
.rail{display:none}
@media(min-width:1100px){
.rail{--col:740px;--gut:1.25rem;display:flex;flex-direction:column;position:fixed;top:50%;left:calc(50% + var(--col)/2 + var(--gut));transform:translateY(-50%);z-index:20;margin:0;padding:.4rem 0;max-height:calc(100vh - 7rem)}
.rail::before{content:"";position:absolute;left:calc(.875rem - .5px);top:1.1rem;bottom:1.1rem;width:1px;background:var(--line)}
.rail-dot{position:relative;display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;text-decoration:none;border-radius:50%}
.rail-dot .dot{width:7px;height:7px;border-radius:50%;background:var(--mut);box-shadow:0 0 0 3px var(--bg);transition:transform .2s,background .2s,box-shadow .2s;flex:none}
.rail-dot:hover .dot,.rail-dot:focus-visible .dot{background:var(--acc);transform:scale(1.25)}
.rail-dot[aria-current=true] .dot{background:var(--acc);transform:scale(1.45);box-shadow:0 0 0 3px var(--bg),0 0 0 4.5px color-mix(in srgb,var(--acc) 38%,transparent)}
.rail-dot:focus-visible{outline:2px solid var(--acc);outline-offset:-1px}
.rail-label{position:absolute;right:calc(100% + .3rem);top:50%;transform:translate(6px,-50%);padding:.22rem .65rem;border:1px solid var(--line);border-radius:.5rem;background:var(--bg);color:var(--fg);box-shadow:0 6px 20px rgba(0,0,0,.14);font:600 .82rem/1.3 var(--sans);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.rail-dot:hover .rail-label,.rail-dot:focus-visible .rail-label{opacity:1;transform:translate(0,-50%)}
}
@media(min-width:1400px){
.rail-label{right:auto;left:calc(100% + .15rem);max-width:calc(50vw - var(--col)/2 - var(--gut) - 3.25rem);overflow:hidden;text-overflow:ellipsis;padding:.1rem .2rem;border-color:transparent;background:transparent;box-shadow:none;color:var(--mut);transform:translate(-4px,-50%)}
.rail-dot:hover .rail-label,.rail-dot:focus-visible .rail-label{color:var(--acc)}
}

/* method, sources, share, footer */
.sources{font-size:15.5px;padding-left:20px}.sources li{margin:0 0 8px}
.share{margin:16px 0 8px}.share-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.share-label{font:600 14px var(--sans);margin-right:4px}
.ic{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--rule);background:transparent;color:var(--text);cursor:pointer}
.ic:hover,.ic:focus-visible{color:var(--accent-ink);border-color:var(--accent)}
@media (pointer:coarse){.ic{width:44px;height:44px}}
.share-msg{font:500 13px var(--sans);color:var(--muted);margin:6px 0 0;min-height:1em}
.site-footer{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;padding:26px 16px 40px;margin-top:40px;font:500 14px var(--sans);color:var(--muted);border-top:1px solid var(--rule)}
.site-footer a{color:var(--muted)}
.place-page main{max-width:640px;margin:10vh auto;padding:0 20px}
.place-page img{max-width:100%;height:auto;border-radius:10px;border:1px solid var(--rule)}
table.pub{border-collapse:collapse;width:100%;font:500 14px/1.35 var(--sans);font-variant-numeric:tabular-nums;margin:6px 0 10px}
table.pub th,table.pub td{padding:6px 8px;border-bottom:1px solid var(--rule);text-align:left}
table.pub td.n,table.pub th.n{text-align:right}
table.pub thead th{font-size:12.5px;color:var(--muted);vertical-align:bottom}
table.pub tbody th{white-space:nowrap}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;gap:18px;padding:26px 16px 14px}
  h1{font-size:30px}
  .deck{font-size:17.5px}
  .stage{padding:0 8px 20px}
  .res{padding-left:12px;padding-right:12px}
  .rgrid{grid-template-columns:1fr;gap:6px}
  .rcard{padding:18px 14px 10px}
  .rcard h2{font-size:27px}
  .sec{padding:38px 16px 4px}
  .sec h2{font-size:25px}
  body{font-size:17.5px}
  .yearbox{left:10px;top:8px;max-width:calc(100% - 70px)}
  .legend{gap:4px 12px;font-size:12.5px}
  table.pub{font-size:12.5px}table.pub th,table.pub td{padding:5px 4px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
