:root{--bg:#12141c;--ink:#e6e8ef;--ink-dim:#b6bccd;--accent:#8ee9ff;--primary:#ff9a3c;--danger:#ef4444;--panel:#1b1f2b;--line:#39405a}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#app{height:100%}.screen[hidden]{display:none}.gate{flex-direction:column;justify-content:center;align-items:center;gap:8px;height:100%;display:flex}.gate h1{letter-spacing:.5px;margin:0;font-size:40px}.tagline{color:var(--ink-dim);margin:0 0 28px}.options{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.option{text-align:left;background:var(--panel);width:260px;color:var(--ink);border:1px solid var(--line);cursor:pointer;font:inherit;border-radius:10px;flex-direction:column;gap:6px;padding:22px 20px;display:flex}.option-title{font-size:19px;font-weight:600}.option-note{color:var(--ink-dim);font-size:14px}.option:hover{border-color:var(--accent)}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.match{flex-direction:column;height:100%;display:flex;position:relative}.stage{flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.stage canvas{display:block}.hud-top{z-index:2;pointer-events:none;align-items:baseline;gap:18px;display:flex;position:absolute;top:10px;left:14px}.ore{color:#fbbf24;font-size:20px}.nodes{color:var(--ink-dim);font-size:13px}.edge-alert{z-index:3;pointer-events:none;border:6px solid var(--danger);color:var(--ink);text-shadow:0 1px 3px #000;justify-content:center;align-items:flex-start;padding-top:14px;font-weight:600;display:flex;position:absolute;inset:0}.edge-alert[hidden]{display:none}.edge-alert.sudden{border-color:#a855f7}.build-bar{z-index:4;background:#12141ceb;gap:6px;padding:10px 14px;display:flex;position:relative}.build-entry{text-align:left;background:var(--panel);min-width:108px;color:var(--ink);border:1px solid var(--accent);cursor:pointer;font:inherit;border-radius:6px;flex-direction:column;gap:2px;padding:8px 10px;display:flex}.build-entry.placed{margin-left:22px}.build-entry[aria-disabled=true]{border-color:var(--line);color:var(--ink-dim);cursor:default}.build-entry[aria-pressed=true]{border-color:var(--ink);border-width:2px}.build-cost{color:var(--ink-dim);font-size:12px}.result,.fallback{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;height:100%;padding:24px;display:flex}.result h1{margin:0;font-size:46px}.duration{color:var(--ink-dim);margin:0 0 22px}.result-actions{flex-direction:column;align-items:center;gap:14px;display:flex}.primary{background:var(--primary);color:#1e1e22;cursor:pointer;border:none;border-radius:8px;width:340px;height:84px;font-size:24px;font-weight:700}.secondary{width:200px;height:40px;color:var(--ink-dim);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:6px;font-size:15px}.fallback{max-width:640px;margin:0 auto}.fallback p{color:var(--ink-dim);line-height:1.55}.debug-overlay{z-index:5;border:1px solid var(--line);color:var(--accent);pointer-events:none;background:#0a0c12e0;border-radius:6px;margin:0;padding:10px 12px;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;position:absolute;top:44px;left:14px}.debug-overlay[hidden]{display:none}.build-note{color:#fbbf24;min-height:13px;font-size:11px}.production{z-index:5;border:1px solid var(--line);background:#0c0e14f0;border-radius:8px;align-items:center;gap:6px;padding:8px 12px;display:flex;position:absolute;bottom:84px;left:14px;box-shadow:0 6px 20px #00000073}.production[hidden]{display:none}.panel-title{min-width:84px;color:var(--accent);font-size:13px;font-weight:600}.panel-status{color:var(--ink-dim);font-size:12px}