@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-normal-latin.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4-normal-latin-ext.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0100-024F,U+0218-021B,U+1E00-1EFF}
@font-face{font-family:"Source Serif 4";font-style:italic;src:url(fonts/source-serif-4-italic-latin.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Source Serif 4";font-style:italic;src:url(fonts/source-serif-4-italic-latin-ext.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0100-024F,U+0218-021B,U+1E00-1EFF}
:root{--bg:#0b0b10;--ink:#ece6da;--mute:#b3ab9d;--line:#2a2833;--acc:#f0b27a;color-scheme:dark}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:19px/1.62 "Source Serif 4",Georgia,serif;-webkit-text-size-adjust:100%}
a{color:var(--acc)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:9;background:#000;padding:8px}
.stage{position:relative;height:100svh;min-height:480px;overflow:hidden;background:#07070b}
#sky{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:crosshair;touch-action:pan-y}
#sky:focus-visible{outline:2px solid var(--acc);outline-offset:-4px}
.corner{position:absolute;top:14px;right:16px;display:flex;gap:16px;font-size:14px;z-index:2}
.corner a{color:rgba(236,230,218,.72);text-decoration:none}
.plate{position:absolute;left:0;right:0;bottom:0;padding:0 16px calc(18px + env(safe-area-inset-bottom));pointer-events:none;background:linear-gradient(transparent,rgba(5,5,8,.72) 45%)}
.plate>div{max-width:760px;margin:0 auto}
h1{font-weight:500;font-size:clamp(28px,5.2vw,52px);line-height:1.08;margin:0 0 10px;letter-spacing:-.01em}
.dek{margin:0 0 12px;color:#ddd5c7;font-size:clamp(16px,2.2vw,19px);max-width:620px}
#label{min-height:3.2em;margin:0;font-size:15px;color:#cfc7b8;line-height:1.45}
#label span{display:block;color:#9d9587;font-size:13.5px}
main{max-width:720px;margin:0 auto;padding:40px 16px 20px}
h2{font-weight:500;font-size:28px;line-height:1.2;margin:56px 0 14px}
h2 .anchor{color:inherit;text-decoration:none}
p{margin:0 0 18px}
.lede{font-size:21px}
.pair{margin:30px -16px;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 16px}
@media(min-width:900px){.pair{margin:34px -120px}}
.pair figure{margin:0}
.pair img{width:100%;height:auto;display:block;background:#15141a}
.pair figcaption{font-size:14.5px;line-height:1.4;color:var(--mute);margin-top:8px}
.pair figcaption b{color:var(--ink);font-weight:600}
.sw{display:flex;align-items:center;gap:8px;margin-top:6px;color:var(--ink);font-size:15px}
.sw i{width:44px;height:14px;display:inline-block;border-radius:2px}
.solo{margin:30px auto;max-width:520px}.solo img{width:100%;height:auto;display:block}
.solo figcaption{font-size:14.5px;color:var(--mute);margin-top:8px}
.fig{margin:26px -16px 30px;position:relative}
@media(min-width:900px){.fig{margin:30px -110px}}
#chart svg{width:100%;height:auto;display:block}
#chart circle{stroke:#0b0b10;stroke-width:.8;cursor:pointer}
#chart .grid{stroke:#24222b;stroke-width:1}
#chart .ax{fill:#8f887c;font:12px "Source Serif 4",Georgia,serif}
#chart .dvi{fill:#3a3645}
#chart .erl{stroke:#5a4a3d;stroke-dasharray:2 4}
#chart .er{fill:#c9b8a2;font:italic 12.5px "Source Serif 4",Georgia,serif}
.fig figcaption{font-size:14.5px;color:var(--mute);padding:0 16px;margin-top:8px}
#tip{position:absolute;z-index:3;background:#16151c;border:1px solid #3a3645;padding:8px 10px;font-size:14px;line-height:1.35;max-width:280px;pointer-events:none}
blockquote{margin:22px 0;padding-left:18px;border-left:2px solid var(--acc);font-style:italic;color:#ddd5c7}
blockquote cite{display:block;font-style:normal;font-size:14.5px;color:var(--mute);margin-top:6px}
.src{font-size:15px;color:var(--mute);padding-left:20px}.src li{margin-bottom:8px}
.share{display:flex;gap:10px;margin:40px 0 10px}
.share a,.share button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;background:none;color:var(--ink);cursor:pointer;padding:0}
.share svg{width:18px;height:18px;fill:currentColor}
footer{max-width:720px;margin:0 auto;padding:20px 16px 50px;font-size:15px;color:var(--mute)}
@media(max-width:600px){body{font-size:18px}.pair{grid-template-columns:1fr 1fr;gap:6px}}
