:root{--bg: #0f1219;--panel: #192031;--ink: #edf1f9;--muted: #8f9bb8;--clue: #aeb9d6;--line: #5eead4;--line-lo: #2dd4bf;--xmark: #556084;--dot: #3b465f;--hintc: #fbbf24;--good: #4ade80;--accent: #93c5fd}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(1100px 650px at 50% -8%,#1a2336 0%,var(--bg) 62%);color:var(--ink);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}main{max-width:640px;margin:0 auto;padding:32px 20px 48px;text-align:center}h1{margin:0;font-size:34px}h1 span{color:var(--line)}.sub{margin:6px auto 20px;max-width:440px;color:var(--muted)}#wrap{display:flex;justify-content:center}#board{padding:16px;background:var(--panel);border-radius:14px;border:1px solid rgba(120,140,200,.14);box-shadow:0 20px 60px #00000073;line-height:0}svg{display:block;transition:filter .3s ease}svg.won .edge.on{stroke:var(--good)}svg.won{filter:drop-shadow(0 0 6px rgba(74,222,128,.45))}.dot{fill:var(--dot)}.clue{fill:var(--clue);font:600 18px/1 ui-sans-serif,system-ui,sans-serif;font-variant-numeric:tabular-nums;transition:fill .12s ease}.clue.met{fill:#5a678a}.clue.over{fill:#f87171}.hit{stroke:transparent;stroke-width:16;stroke-linecap:round;cursor:pointer}.edge{stroke:transparent;stroke-width:4;stroke-linecap:round;pointer-events:none;transition:stroke .1s ease}.edge.on{stroke:var(--line)}.cross{stroke:var(--xmark);stroke-width:2;stroke-linecap:round;opacity:0;pointer-events:none;transition:opacity .1s ease}.cross.show{opacity:1}.edge.hint{stroke:var(--hintc)}.hud{margin:14px auto 4px;color:var(--muted);font-size:13px;min-height:20px}#status.win{color:var(--good);font-weight:700}#status.bad{color:#f87171}.controls{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:12px}select,button{font:inherit;border-radius:9px;border:1px solid rgba(120,140,200,.25);background:var(--panel);color:var(--ink);padding:7px 13px;cursor:pointer}button:hover{border-color:var(--accent)}#solve{border-color:var(--good);color:var(--good)}label{color:var(--muted);font-size:13px}label select{margin-left:6px}.note{margin:26px auto 0;max-width:520px;color:var(--muted);font-size:13px;text-align:left}.note strong,.note em{color:var(--ink)}
