@font-face{font-family:Nunito;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/nunito-latin-var.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Young Serif';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/young-serif-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{--bg:#1B1714;--grid:#2A241F;--ink:#F3EADB;--muted:#C9B9A3;--link:#8A7A68;--accent:#F2C46B;--card:#2A231E;--card-b:#4A3F35;--btn:#F2C46B;--btn-t:#1B1714;--sans:Nunito,"Trebuchet MS",sans-serif;--serif:"Young Serif",Georgia,serif}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;color:var(--ink);font:16px/1.5 var(--sans);background:var(--bg) radial-gradient(var(--grid) 1.5px,transparent 1.5px) 0 0/24px 24px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;z-index:9;background:var(--card);color:var(--ink);padding:10px}
header{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;z-index:2;pointer-events:none}
h1{font:400 1.375rem var(--serif);margin:0}header *{pointer-events:auto}
button{font:inherit;min-height:44px;min-width:44px;padding:0 14px;border:1px solid var(--card-b);background:var(--card);color:var(--ink);border-radius:22px;cursor:pointer}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
#graph{display:block;width:100vw;height:100vh;touch-action:none;cursor:grab}
.n{cursor:pointer;transition:opacity .2s}.n:focus{outline:none}.n image{transition:transform .2s ease-out}
.ring{fill:transparent;stroke:transparent;stroke-width:3}.hit{fill:transparent}
.n.hl .ring,.n:focus-visible .ring{stroke:var(--accent)}.n.hl image{transform:scale(1.08)}
.lbl{font:700 var(--ls,16px) var(--sans);fill:var(--ink);paint-order:stroke;stroke:var(--bg);stroke-width:4px;stroke-linejoin:round;text-anchor:middle;pointer-events:none}
.n.c .lbl{font:400 var(--lc,20px) var(--serif)}
.l{stroke:var(--link);stroke-width:1.2;opacity:.45;fill:none;transition:opacity .2s}.l.dim{opacity:.08}.n.dim{opacity:.22}.l.hl{stroke:var(--accent);stroke-width:1.8;opacity:.95}
#list{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:0;padding:0}
dialog{border:1px solid var(--card-b);border-radius:16px;padding:20px;background:var(--card);color:var(--ink);margin:0;position:fixed;inset:auto 0 0 0;width:100%;max-width:100%;border-radius:16px 16px 0 0}
dialog h2{font:400 1.5rem var(--serif);margin:0 0 6px;padding-right:48px}dialog p{margin:0 0 16px;color:var(--muted);font-size:16px;line-height:1.45}
.cl{position:absolute;top:12px;right:12px;padding:0}

@media(min-width:768px){dialog{inset:72px 16px auto auto;width:340px;border-radius:16px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
