:root{
  color-scheme:dark;
  --bg:#15171b; --box:#1d2025; --text:#e8e6e1; --grey:#a0a6b0; --border:#2e3239; --orange:#fb923c;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.6 Palatino,"Palatino Linotype",Georgia,serif}
.layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:40px;max-width:1440px;margin:0 auto;padding:36px 20px 48px}
.side{position:sticky;top:36px;align-self:start;display:flex;flex-direction:column;min-height:calc(100vh - 84px);font-family:Bahnschrift,'Avenir Next Condensed','Roboto Condensed','DejaVu Sans Condensed','Liberation Sans Narrow','Arial Narrow',system-ui,sans-serif}
.brand{display:block;font:700 1.9rem/1.2 Bahnschrift,'Avenir Next Condensed','Roboto Condensed','DejaVu Sans Condensed','Liberation Sans Narrow','Arial Narrow',system-ui,sans-serif;letter-spacing:.01em;color:var(--text);text-decoration:none;margin:0 0 26px}
.side ul{list-style:none;margin:0;padding:0}
.side li{margin:0}
.side ul a,.side .soon{display:block;padding:7px 12px;border-left:2px solid var(--border);color:var(--text);text-decoration:none;font-size:1.05rem}
.side ul a:hover,.side ul a.here{border-left-color:var(--orange);color:var(--orange)}
.side ul ul a,.side ul ul .soon{padding-left:26px;font-size:.92rem;color:var(--grey)}
.side ul ul a:hover{color:var(--orange)}
.side .soon{color:var(--grey)}
.side .soon small{display:block;font-size:.78rem}
.li-btn{display:block;margin:18px 0 0;padding:7px 12px;border-left:2px solid var(--border);color:var(--grey);text-decoration:none;font-size:.95rem}
.li-btn:hover{border-left-color:var(--orange);color:var(--orange)}
.sig{margin:auto 0 0;padding:24px 0 0 14px;color:var(--grey);font:.9rem Bahnschrift,'Avenir Next Condensed','Roboto Condensed','DejaVu Sans Condensed','Liberation Sans Narrow','Arial Narrow',system-ui,sans-serif}
main{min-width:0}
h1{font:700 2rem/1.15 Bahnschrift,'Avenir Next Condensed','Roboto Condensed','DejaVu Sans Condensed','Liberation Sans Narrow','Arial Narrow',system-ui,sans-serif;letter-spacing:.01em;margin:0 0 14px}
h2{font:700 1.4rem/1.25 Bahnschrift,'Avenir Next Condensed','Roboto Condensed','DejaVu Sans Condensed','Liberation Sans Narrow','Arial Narrow',system-ui,sans-serif;letter-spacing:.01em;margin:0 0 .8rem}
p{margin:0 0 1.1rem}
figure{margin:0;border:1px solid var(--border)}
figure svg{display:block;width:100%;height:auto}
.list{margin:0;padding:0;list-style:none}
.list li{padding:10px 0;border-top:1px solid var(--border)}
.list li:last-child{border-bottom:1px solid var(--border)}
.list a{color:var(--orange);text-decoration:none}
.list a:hover{text-decoration:underline}
.list small{display:block;color:var(--grey);font:.95rem/1.5 Bahnschrift,'Avenir Next Condensed','Roboto Condensed','DejaVu Sans Condensed','Liberation Sans Narrow','Arial Narrow',system-ui,sans-serif}
.list .soon{color:var(--grey)}
a:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.nfo{margin:0 0 1rem;padding:18px 20px;background:#000;border:1px solid var(--border)}
.nfo-svg{display:block;width:100%;height:auto;max-width:660px;fill:#b4b4b4;font:14px Menlo,Consolas,'DejaVu Sans Mono',monospace}
#si-cur{animation:blink 1s steps(1) infinite}
#scene{cursor:text} #scene svg{transition:opacity .15s} #scene.off svg{opacity:0}
@keyframes blink{50%{opacity:0}}
.si-in{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
#start p a,#nfo p a{color:var(--orange)}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} #si-cur{animation:none} }
@media (max-width:860px){
  .layout{display:flex;flex-direction:column;gap:20px;padding:20px 16px 40px}
  .side{position:static;min-height:0;flex-direction:row;flex-wrap:wrap;gap:6px;align-items:center}
  .brand{width:100%;font-size:1.6rem;margin:0 0 4px}
  .side ul{display:contents}
  .side ul ul{display:none}
  .side ul a,.li-btn{display:inline-block;margin:0;border:1px solid var(--border);border-radius:8px;padding:6px 11px;font-size:.95rem;color:var(--text)}
  .li-btn{color:var(--grey)}
  .side ul a:hover,.side ul a.here,.li-btn:hover{border-color:var(--orange)}
  .sig{width:100%;margin:6px 0 0;padding:0}
  body{font-size:16px}
}
svg text{white-space:pre}
.ice{fill:#000} .ice-t{fill:#d4d4d4;font:14px Menlo,Consolas,'DejaVu Sans Mono',monospace} .ice-r{fill:#fff;font:14px Menlo,Consolas,'DejaVu Sans Mono',monospace}
.ice-sep{stroke:#20b020;stroke-width:1} .ice-g{fill:#20c020;font:14px Menlo,Consolas,'DejaVu Sans Mono',monospace}
.ice-cur{fill:#d4d4d4} .ice-c{fill:#000;font:14px Menlo,Consolas,'DejaVu Sans Mono',monospace} .ice-cursor{fill:#d4d4d4}
.ice-help{fill:#00a0a0} .ice-s{fill:#000;font:14px Menlo,Consolas,'DejaVu Sans Mono',monospace} .ice-frame{fill:none;stroke:#00a0a0;stroke-width:2}
.px0{fill:#0e3d0e} .px1{fill:#1d7a1d} .px2{fill:#2fa32f} .px3{fill:#176417}
