:root{
  --bg:#020202; --fg:#e8e8e6; --mid:#a2a2a0; --dim:#737371;
  --faint:#343434; --line:#171717; --red:#ff4a2f; --amber:#ffb861;
  --mono:"Datatype", ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
}
@font-face{
  font-family:"Datatype";
  src:url("Datatype-VariableFont_wdth,wght.ttf") format("truetype");
  font-weight:100 900;
  font-stretch:75% 125%;
  font-display:swap;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg)}
body{font-family:var(--mono);color:var(--fg);font-size:11px;
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
body.idle{cursor:none}
#gl{position:fixed;inset:0;width:100vw;height:100vh;display:block;cursor:grab}
#gl.drag{cursor:grabbing}
#hud{position:fixed;inset:0;pointer-events:none;z-index:4}
.lbl{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
#brand{position:absolute;top:22px;left:24px}
#brand b{font-size:11px;letter-spacing:.34em;font-weight:500}
#brand .s{font-size:8px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase;margin-top:5px}
#lastev{position:absolute;top:64px;left:24px;font-size:9px;letter-spacing:.1em;color:var(--dim);transition:color 1.2s}
#lastev.fresh{color:var(--fg)}
#lastev.big{color:var(--red)}
#utc{position:absolute;top:22px;right:24px;text-align:right}
#utc .t{font-size:11px;letter-spacing:.08em}
#utc .s{font-size:8px;letter-spacing:.2em;color:var(--faint);margin-top:5px}
#rotline{font-size:8px;letter-spacing:.18em;color:var(--dim);margin-top:8px;text-transform:uppercase}
#reads{position:absolute;left:24px;bottom:22px;display:flex;flex-direction:column;gap:9px}
.rd{display:flex;align-items:baseline;gap:10px;font-size:10px;letter-spacing:.06em;transition:opacity .4s}
.rd .g{width:8px;color:var(--faint);font-size:9px}
.rd .g.live{color:var(--fg)}
.rd .k{width:96px;font-size:8px;letter-spacing:.18em;color:var(--dim);text-transform:uppercase}
.rd .v{color:var(--fg)}
.rd .x{color:var(--dim)}
.rd.off{opacity:.06}
.rd .v.alert{color:var(--red)}
#hint{position:absolute;right:24px;bottom:58px;font-size:8px;letter-spacing:.18em;color:var(--faint);text-transform:uppercase;text-align:right}
#legalnav{position:absolute;right:24px;bottom:22px;display:flex;gap:14px;pointer-events:auto}
#legalnav a{font-size:7px;letter-spacing:.2em;color:var(--faint);text-transform:uppercase;text-decoration:none}
#legalnav a:hover{color:var(--fg)}
#mapframe{position:absolute;border:1px solid var(--line);display:none}
#medcap{position:fixed;left:50%;bottom:84px;z-index:5;transform:translateX(-50%);
  max-width:min(620px,calc(100vw - 48px));text-align:center;pointer-events:none;opacity:0;
  transition:opacity 1.2s ease;text-transform:uppercase}
#medcap.on{opacity:1}
body.med-m05 #medcap{bottom:106px}
#medcap .a{font-size:10px;letter-spacing:.28em;color:var(--fg);line-height:1.7}
#medcap .b{font-size:8px;letter-spacing:.2em;color:var(--dim);line-height:1.8;margin-top:2px}
.medlbl{position:fixed;z-index:5;pointer-events:none;opacity:0;transition:opacity .8s ease}
.medlbl.on{opacity:1}
#medyear{position:fixed;z-index:5;left:50%;top:22px;transform:translateX(-50%);pointer-events:none;opacity:0;transition:opacity .8s ease}
#medyear.on{opacity:1}
#medtimeline{position:fixed;z-index:5;left:50%;bottom:58px;width:min(560px,calc(100vw - 48px));
  transform:translateX(-50%);pointer-events:none;opacity:0;transition:opacity .8s ease;text-transform:uppercase;
  --m05-progress:0%}
#medtimeline.on{opacity:.82}
#medtimeline .bar{height:1px;background:rgba(115,115,113,.34);overflow:hidden}
#medtimeline .bar span{display:block;width:var(--m05-progress);height:1px;background:var(--fg);
  box-shadow:0 0 10px rgba(222,230,224,.35)}
#medtimeline .ticks{display:flex;justify-content:space-between;margin-top:7px}
#medtimeline b{font-size:7px;letter-spacing:.14em;font-weight:500;color:var(--dim)}
#ledger{position:fixed;z-index:5;left:24px;top:92px;width:min(560px,calc(100vw - 48px));
  pointer-events:none;opacity:0;transition:opacity 1.2s ease;text-transform:uppercase}
#ledger.on{opacity:1}
#ledger .head{font-size:10px;letter-spacing:.22em;color:var(--fg);margin-bottom:18px}
#ledger .row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;
  font-size:9px;letter-spacing:.13em;color:var(--dim);line-height:2;opacity:.35;transition:opacity .8s ease}
#ledger .row.on{opacity:1}
#ledger .dots{border-bottom:1px dotted rgba(115,115,113,.42);transform:translateY(-4px)}
#ledger .val{color:var(--fg);text-align:right;white-space:nowrap}
#settingsToggle{position:fixed;right:24px;top:92px;z-index:6;pointer-events:auto;
  font-family:var(--mono);font-size:8px;letter-spacing:.22em;color:var(--fg);
  border:1px solid var(--faint);background:rgba(2,2,2,.54);padding:8px 10px;
  text-transform:uppercase;cursor:pointer}
#settingsToggle[aria-expanded="true"]{border-color:var(--fg)}
#northBtn{position:fixed;right:24px;top:132px;z-index:5;pointer-events:auto;
  width:34px;height:34px;border:1px solid var(--faint);border-radius:50%;
  background:rgba(2,2,2,.54);color:var(--dim);cursor:pointer;
  display:grid;place-items:center;font-family:var(--mono);transition:border-color .3s,color .3s,opacity .3s}
#northBtn span{position:absolute;left:50%;top:6px;width:0;height:0;transform:translateX(-50%) rotate(var(--north-rot,0rad));
  transform-origin:50% 11px;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:10px solid currentColor}
#northBtn.dirty{border-color:var(--fg);color:var(--fg)}
#northBtn:hover{border-color:var(--fg);color:var(--fg)}
#settings{position:fixed;top:92px;right:24px;bottom:74px;z-index:6;width:min(420px,calc(100vw - 48px));
  pointer-events:auto;background:rgba(4,4,4,.88);border:1px solid var(--line);
  opacity:0;transform:translateX(14px);transition:opacity .28s ease,transform .28s ease;
  display:flex;flex-direction:column;visibility:hidden;backdrop-filter:blur(10px);
  border-radius:8px;overflow:hidden}
#settings.open{opacity:1;transform:translateX(0);visibility:visible}
.reg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
  padding:15px 16px 13px;border-bottom:1px solid var(--line)}
.reg-title{font-size:10px;letter-spacing:.28em;color:var(--fg);text-transform:uppercase}
.reg-sub{font-size:7px;letter-spacing:.18em;color:var(--dim);text-transform:uppercase;margin-top:5px}
#settingsClose{font-family:var(--mono);font-size:16px;line-height:1;color:var(--dim);
  background:transparent;border:0;cursor:pointer;padding:0 0 8px 8px}
#settingsClose:hover{color:var(--fg)}
.reg-scroll{overflow:auto;padding:13px 14px 16px;scrollbar-width:thin;scrollbar-color:var(--faint) transparent}
.reg-section{padding:0 0 14px;margin:0 0 14px;border-bottom:1px solid rgba(23,23,23,.92)}
.reg-section:last-child{border-bottom:0;margin-bottom:0}
.reg-label{font-size:7px;letter-spacing:.24em;color:var(--faint);text-transform:uppercase;margin:0 0 9px}
.reg-action,.reg-toggle{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) minmax(84px,.75fr);
  gap:9px;align-items:baseline;font-family:var(--mono);text-align:left;background:transparent;
  border:0;border-top:1px solid rgba(23,23,23,.78);padding:8px 0;color:var(--dim);
  cursor:pointer;text-transform:uppercase}
.reg-toggle{grid-template-columns:28px minmax(0,1fr)}
.reg-action span,.reg-toggle span{font-size:8px;letter-spacing:.16em;color:var(--faint)}
.reg-action b,.reg-toggle b{font-size:9px;letter-spacing:.16em;font-weight:500;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reg-action em{font-style:normal;font-size:7px;letter-spacing:.13em;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reg-action:hover b,.reg-toggle:hover b{color:var(--fg)}
.reg-toggle:not(.on) b,.reg-toggle:not(.on) span{color:var(--faint)}
.reg-toggle.on{color:var(--fg)}
.reg-row{display:grid;grid-template-columns:minmax(92px,.8fr) minmax(100px,1fr) auto;gap:10px;
  align-items:baseline;padding:7px 0;border-top:1px solid rgba(23,23,23,.78);text-transform:uppercase}
.reg-row b{font-size:8px;letter-spacing:.16em;font-weight:500;color:var(--fg);white-space:nowrap}
.reg-row span{font-size:7px;letter-spacing:.13em;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reg-row em{font-style:normal;font-size:7px;letter-spacing:.13em;color:var(--dim);white-space:nowrap;text-align:right}
.reg-row.live em{color:var(--fg)}
body.med #lastev{opacity:0}
body.med #reads .rd{opacity:.22}
body.med-m04 #brand,
body.med-m04 #utc,
body.med-m04 #hint{opacity:0;transition:opacity 1.2s ease}
body.med-m04 #reads .rd{opacity:0}
body.med-m04 #reads .read-co2{opacity:.62}
#boot{position:fixed;inset:0;z-index:6;background:var(--bg);display:flex;
  flex-direction:column;justify-content:center;padding:0 10vw}
#boot .t{font-size:13px;letter-spacing:.4em;margin-bottom:6px}
#boot .s{font-size:9px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase;margin-bottom:34px}
.bline{font-size:10px;letter-spacing:.12em;color:var(--dim);line-height:2.2;white-space:pre}
.bline .st{color:var(--fg)} .bline .stsim{color:var(--faint)}
#bootnote{font-size:8px;letter-spacing:.16em;color:var(--faint);margin-top:30px;max-width:520px;line-height:2;text-transform:uppercase}
#help{position:fixed;inset:0;z-index:7;background:rgba(4,5,5,.94);display:none;
  flex-direction:column;justify-content:center;align-items:center;gap:11px}
#help div{font-size:10px;letter-spacing:.18em;color:var(--mid);text-transform:uppercase}
#help .k{color:var(--fg);display:inline-block;width:88px}
#help .colophon{font-size:7px;letter-spacing:.16em;color:var(--faint);max-width:min(780px,calc(100vw - 48px));
  text-align:center;line-height:1.8}
html.doc-root,html:has(.doc-page),body.doc-page{height:auto;min-height:100%;overflow:auto}
body.doc-page{background:radial-gradient(circle at 50% 18%,rgba(52,52,52,.24),transparent 36%),var(--bg);
  font-size:12px;line-height:1.8}
.doc-shell{width:min(860px,calc(100vw - 40px));margin:0 auto;padding:34px 0 64px}
.doc-nav{display:flex;justify-content:space-between;gap:18px;margin-bottom:34px;text-transform:uppercase}
.doc-nav a,.doc-card a{color:var(--fg);text-decoration:none;border-bottom:1px solid var(--faint)}
.doc-nav a{font-size:8px;letter-spacing:.24em;color:var(--dim)}
.doc-nav a:hover,.doc-card a:hover{border-color:var(--fg)}
.doc-card{border:1px solid var(--line);background:rgba(4,4,4,.72);padding:32px 34px;color:var(--dim)}
.doc-label{font-size:8px;letter-spacing:.28em;color:var(--faint);text-transform:uppercase;margin-bottom:10px}
.doc-card h1{font-size:18px;letter-spacing:.24em;color:var(--fg);font-weight:500;text-transform:uppercase;margin-bottom:24px;line-height:1.5}
.doc-card h2{font-size:10px;letter-spacing:.22em;color:var(--fg);font-weight:500;text-transform:uppercase;margin:30px 0 8px}
.doc-card p{margin:0 0 14px}
.doc-card ul{margin:0 0 18px 18px}
.doc-card li{margin:0 0 8px}
.doc-card code{color:var(--fg)}
@media (max-width:640px){
  #brand{top:22px;left:22px}
  #utc{top:22px;right:22px}
  #lastev{top:68px;left:22px;right:22px;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #reads{left:22px;right:22px;bottom:118px;gap:7px}
  .rd{display:grid;grid-template-columns:8px 82px 1fr;gap:8px;font-size:9px;align-items:baseline}
  .rd .k{width:auto}
  .rd .x{display:none}
  #hint{display:none}
  #legalnav{right:22px;bottom:22px;gap:12px}
  body.med-m05 #medcap{bottom:92px}
  #ledger{top:92px;left:22px;right:22px;width:auto}
  #ledger .row{grid-template-columns:auto 1fr;gap:8px}
  #ledger .dots{display:none}
  #medtimeline{bottom:56px;width:calc(100vw - 44px)}
  #medtimeline b{font-size:6px;letter-spacing:.1em}
  #settingsToggle{right:22px;top:88px;font-size:7px;padding:7px 8px}
  #northBtn{right:22px;top:124px;width:32px;height:32px}
  #settings{top:122px;right:14px;left:14px;bottom:82px;width:auto}
  .reg-action{grid-template-columns:24px minmax(0,1fr)}
  .reg-action em{display:none}
  .reg-row{grid-template-columns:minmax(86px,.8fr) minmax(0,1fr);gap:8px}
  .reg-row em{grid-column:1 / -1;text-align:left}
  .doc-shell{width:min(100vw - 28px,860px);padding:22px 0 48px}
  .doc-card{padding:24px 20px}
  .doc-card h1{font-size:14px;letter-spacing:.18em}
  .doc-nav{margin-bottom:22px}
}