:root{--bg: #04040a;--panel: #11131f;--ink: #e9eefb;--muted: #8b93ad;--accent: #2b6bff;--accent2: #5ad6ff;--danger: #ff5277}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(120% 120% at 50% 0%,#0a0e22,#04040a 70%);color:var(--ink);font-family:ui-monospace,SF Mono,Cascadia Mono,Menlo,Consolas,monospace;-webkit-font-smoothing:antialiased}#app{display:flex;justify-content:center;padding:14px 12px 28px}.wrap{width:min(100%,520px)}header h1{margin:0 0 4px;font-size:1.5rem;letter-spacing:.22em;color:var(--accent2);text-shadow:0 0 14px rgba(90,214,255,.4)}.tag{margin:0 0 12px;font-size:.72rem;line-height:1.45;color:var(--muted)}.tag b{color:var(--ink)}.bar{display:flex;align-items:center;gap:8px;margin-bottom:10px}.spacer{flex:1}.seg{display:inline-flex;border:1px solid #2a2f45;border-radius:8px;overflow:hidden}.seg button{background:transparent;color:var(--muted);border:0;padding:6px 10px;font:inherit;font-size:.74rem;cursor:pointer}.seg button.active{background:var(--accent);color:#fff}.bar>button{background:#1a1f33;color:var(--ink);border:1px solid #2a2f45;padding:6px 12px;border-radius:8px;font:inherit;font-size:.78rem;cursor:pointer}.bar>button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.bar>button:hover{filter:brightness(1.15)}.hud{display:flex;gap:8px;margin-bottom:10px}.box{flex:1;background:var(--panel);border:1px solid #1d2235;border-radius:8px;padding:6px 8px;text-align:center}.box .k{font-size:.6rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.box b{font-size:1rem;color:var(--ink)}.alarm{display:flex;align-items:center;gap:8px;margin:-2px 0 10px}.alarmk{font-size:.6rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;flex:0 0 auto}.alarmtrack{flex:1;height:9px;background:#11131f;border:1px solid #1d2235;border-radius:999px;overflow:hidden}.alarmfill{height:100%;width:0%;border-radius:999px;background:var(--accent2);transition:width .12s linear,background .2s linear}.alarmtag{flex:0 0 auto;min-width:64px;text-align:right;font-size:.62rem;font-weight:700;letter-spacing:.12em;color:var(--muted)}.alarm[data-level="1"] .alarmfill{background:#ffd83d}.alarm[data-level="1"] .alarmtag{color:#ffd83d}.alarm[data-level="2"] .alarmfill{background:#ff9d3d}.alarm[data-level="2"] .alarmtag{color:#ff9d3d}.alarm[data-level="3"] .alarmfill{background:var(--danger);box-shadow:0 0 10px #ff5277b3}.alarm[data-level="3"] .alarmtag{color:var(--danger);animation:blink .5s steps(2) infinite}.stage{position:relative;display:flex;justify-content:center}canvas{width:100%;max-width:520px;image-rendering:pixelated;background:#04040a;border:1px solid #1d2235;border-radius:8px;touch-action:none}.sentinelwarn{position:absolute;top:8px;left:50%;transform:translate(-50%);color:#ffd83d;font-weight:700;letter-spacing:.2em;font-size:.9rem;text-shadow:0 0 10px rgba(255,216,61,.7);pointer-events:none;animation:blink .5s steps(2) infinite}@keyframes blink{50%{opacity:.2}}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#04040ac7;border-radius:8px}.overlay .card{text-align:center;padding:18px}.overlay h2{margin:0 0 8px;color:var(--accent2);letter-spacing:.1em}.overlay p{margin:0 0 14px;font-size:.82rem;color:var(--ink);line-height:1.5}.overlay .primary{background:var(--accent);border:0;color:#fff;padding:8px 18px;border-radius:8px;font:inherit;cursor:pointer}.hidden{display:none!important}.pads{display:flex;justify-content:space-between;gap:12px;margin-top:12px}.pad{position:relative;display:grid;gap:4px;flex:1;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);max-width:160px}.padlabel{position:absolute;top:-14px;left:0;font-size:.58rem;color:var(--muted);letter-spacing:.12em}.pad button{background:#161b2c;color:var(--ink);border:1px solid #2a2f45;border-radius:6px;font-size:.9rem;padding:8px 0;cursor:pointer;user-select:none;touch-action:none}.pad button:active{background:var(--accent)}.pad button[data-mv=up],.pad button[data-fire=up]{grid-area:1 / 2}.pad button[data-mv=left],.pad button[data-fire=left]{grid-area:2 / 1}.pad button[data-mv=right],.pad button[data-fire=right]{grid-area:2 / 3}.pad button[data-mv=down],.pad button[data-fire=down]{grid-area:3 / 2}.pad.firebtn-pad{display:flex;align-items:stretch}.firebtn{flex:1;background:var(--danger);color:#fff;border:0;border-radius:10px;font:inherit;font-weight:700;letter-spacing:.14em;font-size:.95rem;cursor:pointer;user-select:none;touch-action:none}.firebtn:active{filter:brightness(1.22)}.hint{margin:12px 0 0;font-size:.66rem;color:var(--muted);line-height:1.5}.hint b{color:var(--ink)}
