@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url("fonts/JetBrainsMono-Regular.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url("fonts/JetBrainsMono-Medium.woff2") format("woff2")}
@font-face{font-family:"Fixel Text";font-weight:400;font-display:swap;src:url("fonts/FixelText-Regular.woff2") format("woff2")}
@font-face{font-family:"Fixel Text";font-weight:500;font-display:swap;src:url("fonts/FixelText-Medium.woff2") format("woff2")}
:root{--paper:#f3f3f2;--ink:#141518;--muted:#3c3e43;--faint:#4f5158;--rule:rgba(20,22,26,.26);--coral:#c04f31;--blue:#3a6cbf;
--mono:"JetBrains Mono",ui-monospace,Menlo,monospace;--sans:"Fixel Text",-apple-system,"Segoe UI",system-ui,sans-serif}
@media (prefers-color-scheme:dark){:root{--paper:#151517;--ink:#ebebe7;--muted:#b9bab5;--faint:#a1a29d;--rule:rgba(255,255,255,.26);--coral:#d0603f;--blue:#4a7dd6}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.5 var(--sans)}
.top{display:flex;gap:24px;align-items:baseline;padding:28px 24px 0;max-width:1260px;margin:0 auto;font:500 16px/1.4 var(--mono)}
.top .count{margin-left:auto;font-weight:400;font-size:13px;color:var(--muted)}
.top .tag{font-weight:400;font-size:13px;color:var(--faint)}
.grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,8fr);gap:24px 56px;max-width:1260px;margin:0 auto;padding:28px 24px 72px;align-items:start}
@media (max-width:900px){.grid{grid-template-columns:minmax(0,1fr)}}
h1{font:500 30px/1.25 var(--mono);margin:0 0 6px}
.hint{margin:0 0 14px;color:var(--muted);font-size:15px}
.pb{display:flex;gap:12px;align-items:baseline;width:100%;text-align:left;background:none;border:0;padding:9px 0;font:17px/1.45 var(--sans);color:var(--muted);cursor:pointer}
.pb:hover{color:var(--ink)}
.pb i{flex:none;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--rule);transform:translateY(-1px)}
.pb.seen i{background:var(--ink);border-color:var(--ink)}
.pb.sel{color:var(--ink)}
.pb.sel i{background:var(--coral);border-color:var(--coral)}
.own{display:inline-flex;align-items:center;min-height:44px;margin-top:12px;font:15px/1.5 var(--mono);color:var(--ink);text-underline-offset:5px}
.pb:focus-visible,.own:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
@media (min-width:901px){.draw{position:sticky;top:12px}}
#map{display:block;width:100%;height:auto;overflow:visible}
.cur{fill:none;stroke:var(--coral);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.old{fill:none;stroke:var(--ink);stroke-width:1.1;stroke-linecap:round;opacity:.4}
.you{fill:var(--coral);stroke:var(--paper);stroke-width:3;opacity:0;transition:opacity .4s}
.you.on{opacity:1}
.b{cursor:pointer;outline:none;opacity:.26;transition:opacity .9s ease}
.b.lit,.b.hot{opacity:1}
.b .g{fill:var(--paper);stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:stroke .5s,stroke-width .5s}
.b .gn{fill:none}
.b .gd{fill:var(--ink)}
.b .halo{fill:var(--paper)}
.b.hot .g{stroke:var(--coral);stroke-width:2.6}
.b.pick .g{stroke-width:3.2}
.b:focus-visible .g{stroke:var(--blue)}
.b text{font:500 13px var(--mono);fill:var(--ink);text-anchor:middle}
.b .in{animation:float 8s ease-in-out infinite}
.b:nth-child(4n+1) .in{animation-delay:-2s}.b:nth-child(4n+2) .in{animation-delay:-4s}.b:nth-child(4n+3) .in{animation-delay:-6s}
.hit{fill:transparent}
.legend{display:flex;gap:6px 20px;flex-wrap:wrap;margin:8px 0 0;font:13px/1.5 var(--mono);color:var(--muted)}
.panel{margin-top:24px;min-height:320px;max-width:760px}
.kind{font:13px/1.5 var(--mono);color:var(--muted)}
h2{font:500 22px/1.35 var(--mono);margin:4px 0 12px}
.steps{margin:0;padding:0;list-style:none;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:24px minmax(120px,200px) minmax(0,1fr);gap:8px;padding:7px 0;font-size:16px;line-height:1.45;opacity:0;transform:translateY(6px);transition:opacity .6s ease,transform .6s ease}
.steps li.in{opacity:1;transform:none}
.steps li::before{content:counter(s);font:13px/1.9 var(--mono);color:var(--muted)}
.steps b{font:500 14px/1.6 var(--mono)}
.end{margin:12px 0 0;font-size:18px;line-height:1.55;opacity:0;transition:opacity .8s ease}
.end.in{opacity:1}
.ours{margin:8px 0 0;font-size:15px;color:var(--muted);opacity:0;transition:opacity .8s ease}
.ours.in{opacity:1}
@keyframes float{50%{transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.b .in{animation:none}.b,.steps li,.end,.ours{transition:none}}
.top .tag a{color:var(--faint);text-underline-offset:4px;margin-left:12px}.top .tag a[aria-current]{color:var(--ink)}