:root{
  --paper:#f2f4f6; --ink:#141c24; --ink-2:#4b5866; --rule:#d5dbe2; --panel:#ffffff;
  --hot:#d4460f; --hot-soft:#fbe6dc; --tint:#e9edf1;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --cond:"IBM Plex Sans Condensed","IBM Plex Sans",system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --paper:#0f151b; --ink:#e3e8ee; --ink-2:#98a4b1; --rule:#26303a; --panel:#141c24;
  --hot:#ff7a3d; --hot-soft:#3a2418; --tint:#182129;
}}
*{box-sizing:border-box}
html{font-size:17px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.62;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:32px 32px;background-position:-1px -1px}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 0%,transparent 40%,var(--paper) 100%);z-index:-1}
.wrap{max-width:46rem;margin:0 auto;padding:2rem 1.25rem 5rem}
header.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem;font-family:var(--mono);font-size:.82rem;letter-spacing:.02em}
header.top a{color:var(--ink);text-decoration:none}
header.top .brand{display:inline-flex;align-items:center;gap:.55rem;font-weight:500}
header.top .brand i{display:inline-block;width:10px;height:10px;background:var(--hot);border-radius:2px}
header.top nav a{margin-left:1.4rem;color:var(--ink-2)}
header.top nav a[aria-current]{color:var(--ink);border-bottom:2px solid var(--hot);padding-bottom:2px}
header.top nav a:hover{color:var(--hot)}
main{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:2.6rem 2.4rem}
@media (max-width:600px){main{padding:1.6rem 1.2rem}html{font-size:16px}}
h1{font-family:var(--cond);font-weight:600;font-size:2.6rem;line-height:1.05;letter-spacing:-.01em;margin:0 0 1rem}
h2{font-family:var(--cond);font-weight:600;font-size:1.45rem;line-height:1.2;margin:2.4rem 0 .7rem}
h3{font-size:1.05rem;font-weight:600;margin:1.6rem 0 .4rem}
p{margin:0 0 1.15rem}
a{color:var(--hot);text-decoration-thickness:1px;text-underline-offset:3px}
ul,ol{padding-left:1.3rem;margin:0 0 1.15rem}li{margin:.35rem 0}
strong{font-weight:600}
code{font-family:var(--mono);font-size:.86em;background:var(--tint);padding:.08em .35em;border-radius:3px}
blockquote{margin:0 0 1.15rem;padding:.2rem 0 .2rem 1rem;border-left:3px solid var(--hot);color:var(--ink-2)}
.eyebrow{font-family:var(--mono);font-size:.78rem;color:var(--ink-2);letter-spacing:.04em;text-transform:uppercase;margin-bottom:.9rem;display:flex;gap:1rem;flex-wrap:wrap}
.eyebrow .tag{color:var(--hot)}
.lede{font-size:1.15rem;color:var(--ink-2);margin:0 0 2rem;line-height:1.5}
.fig{margin:2rem -0.6rem;padding:1rem .6rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.fig figcaption{font-family:var(--mono);font-size:.76rem;color:var(--ink-2);padding:.6rem .2rem .9rem;letter-spacing:.01em}
.dia{width:100%;height:auto;display:block;font-family:var(--mono)}
.dia .n{fill:var(--panel);stroke:var(--ink);stroke-width:1.2}
.dia .n.hot{stroke:var(--hot);fill:var(--hot-soft);stroke-width:1.6}
.dia .n.ghost{stroke:var(--ink-2);stroke-dasharray:3 3;fill:transparent}
.dia .n.ext{fill:var(--tint)}
.dia .n.s{fill:var(--tint)}
.dia .lid{fill:none}
.dia .t{font-size:12.5px;fill:var(--ink)}
.dia .n.ghost + .t{fill:var(--ink-2)}
.dia .e{stroke:var(--ink);stroke-width:1.2;fill:none}
.dia .e.hot{stroke:var(--hot);stroke-width:1.8}
.dia .e.dash{stroke:var(--ink-2);stroke-dasharray:4 3}
.dia .e.dead{stroke:var(--hot);stroke-dasharray:2 3}
.dia .mk{fill:var(--ink)}.dia .mk.hot{fill:var(--hot)}.dia .mk.dead{fill:var(--hot)}
.dia .l{font-size:11.5px;fill:var(--ink-2)}
.dia .l.hotl{fill:var(--hot)}
.dia .gl{font-size:10.5px;fill:var(--ink-2);letter-spacing:.06em}
.dia .grp{fill:transparent;stroke:var(--rule);stroke-dasharray:5 4}
.dia.s-sketch{filter:url(#rough);font-family:"Caveat",cursive}
.dia.s-sketch .n{stroke-width:1.6;rx:8}
.dia.s-sketch .t{font-size:19px}
.dia.s-sketch .l{font-size:17px}
.dia.s-sketch .gl{font-size:16px;letter-spacing:0}
.dia.s-sketch .n.hot{fill:transparent;stroke:var(--hot)}
.dia.s-plain{font-family:"Courier New",Courier,monospace}
.dia.s-plain .t{font-size:13.5px}
.dia.s-plain .l{font-size:12.5px}
.dia.s-plain .gl{font-size:12px}
.dia.s-plain .n{stroke-width:1;rx:0}
.dia.s-plain .n.hot{fill:transparent;stroke:var(--ink);stroke-width:2.2}
.dia.s-plain .n.s{fill:transparent}
.dia.s-plain .e.hot{stroke:var(--ink);stroke-width:2.2}
.dia.s-plain .mk.hot{fill:var(--ink)}
.dia.s-plain .l.hotl{fill:var(--ink);font-weight:700}
.dia.s-plain .grp{stroke:var(--ink-2);stroke-dasharray:2 2}
.fig img{max-width:100%;height:auto;display:block;margin:0 auto;border-radius:4px}
.fig .credit{font-size:.72rem}
.fig .credit a{color:var(--ink-2)}
table{border-collapse:collapse;width:100%;margin:0 0 1.15rem;font-size:.92rem}
th,td{text-align:left;padding:.45rem .6rem;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.dia .pin circle{fill:var(--hot);stroke:var(--panel);stroke-width:2}
.dia .pin text{fill:#fff;font-size:11px;font-weight:500}
.dia .pin:hover circle{fill:var(--ink)}
.dia .pin{cursor:pointer}
pre{background:var(--tint);border:1px solid var(--rule);border-radius:6px;padding:.9rem 1rem;overflow-x:auto;margin:0 0 1.15rem;font-size:.84rem;line-height:1.5}
pre code{background:none;padding:0;font-size:inherit}
.origin{font-family:var(--mono);font-size:.78rem;color:var(--ink-2);border:1px dashed var(--rule);border-radius:6px;padding:.6rem .8rem;margin:-.8rem 0 2rem}
h1.tagline{font-size:2.2rem;max-width:32ch}
.topics{font-family:var(--mono);font-size:.9rem;line-height:2}
.topics a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.topics a:hover{color:var(--hot);border-color:var(--hot)}
h2.year{font-family:var(--mono);font-weight:500;font-size:.85rem;letter-spacing:.08em;color:var(--hot);margin:2.4rem 0 .2rem}
.notes{list-style:none;padding:0;margin:0}
.notes li{display:grid;grid-template-columns:5.2rem 1fr;gap:1rem;padding:1.1rem 0;border-top:1px solid var(--rule)}
.notes li:last-child{border-bottom:1px solid var(--rule)}
.notes .when{font-family:var(--mono);font-size:.76rem;color:var(--ink-2);padding-top:.35rem;line-height:1.5}
.notes .when b{display:block;color:var(--hot);font-weight:500}
.notes a.ttl{font-family:var(--cond);font-weight:600;font-size:1.3rem;color:var(--ink);text-decoration:none;line-height:1.2}
.notes a.ttl:hover{color:var(--hot)}
.notes .sum{margin:.3rem 0 0;color:var(--ink-2);font-size:.95rem}
@media (max-width:600px){.notes li{grid-template-columns:1fr;gap:.2rem}}
.hero .fig{margin-top:1.4rem}
.story p{font-size:1.06rem}
.story p:first-child{font-size:1.32rem;line-height:1.4;font-family:var(--cond);font-weight:600}
.next{margin-top:3rem;padding-top:1.2rem;border-top:1px solid var(--rule);font-family:var(--mono);font-size:.82rem;color:var(--ink-2)}
.next a{color:var(--ink)}
footer{margin-top:2rem;font-family:var(--mono);font-size:.76rem;color:var(--ink-2)}
:focus-visible{outline:2px solid var(--hot);outline-offset:3px}
}
