:root{--bg: #05060c;--panel: #11131f;--ink: #e9eefb;--muted: #8b93ad;--accent: #ff5da2;--accent2: #5ad6ff;--danger: #ff5277}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(120% 120% at 50% 0%,#0c1020,#05060c 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:.16em;color:var(--accent);text-shadow:0 0 14px rgba(255,93,162,.35)}.tag{margin:0 0 12px;font-size:.72rem;line-height:1.45;color:var(--muted)}.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:#2a0418;font-weight:700}button{background:var(--panel);color:var(--ink);border:1px solid #2a2f45;border-radius:8px;padding:6px 12px;font:inherit;font-size:.78rem;cursor:pointer}button:hover{border-color:#3a4163}button.primary{background:var(--accent2);color:#042330;border-color:transparent;font-weight:700}.hud{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:10px}.box{background:var(--panel);border:1px solid #1d2236;border-radius:10px;padding:6px 4px;text-align:center}.box .k{font-size:.56rem;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}.box b{font-size:.98rem}#lives{color:var(--accent2);letter-spacing:1px}#saved{color:#7cff7c}.stage{position:relative;border:1px solid #1d2236;border-radius:12px;background:#05060c;overflow:hidden;box-shadow:0 10px 40px #00000073}canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#05060cc7;backdrop-filter:blur(2px)}.overlay.hidden{display:none}.card{text-align:center;padding:20px 24px;background:var(--panel);border:1px solid #2a2f45;border-radius:14px;max-width:84%}.card h2{margin:0 0 8px;color:var(--accent);letter-spacing:.08em}.card p{margin:0 0 14px;font-size:.82rem;line-height:1.5;color:var(--ink)}.pads{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}.pad{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:6px;aspect-ratio:3 / 3}.padlabel{position:absolute;top:-16px;left:0;font-size:.56rem;letter-spacing:.14em;color:var(--muted)}.pad button{padding:12px 0;font-size:.95rem;touch-action:none;user-select:none}.pad button[data-mv=up],.pad button[data-aim=up]{grid-column:2;grid-row:1}.pad button[data-mv=left],.pad button[data-aim=left]{grid-column:1;grid-row:2}.pad button[data-mv=right],.pad button[data-aim=right]{grid-column:3;grid-row:2}.pad button[data-mv=down],.pad button[data-aim=down]{grid-column:2;grid-row:3}#firepad button{background:var(--danger);color:#2a0410;border-color:transparent;font-weight:700}.hint{margin:14px 2px 0;font-size:.68rem;color:var(--muted);line-height:1.5}@media(hover:hover)and (pointer:fine){.pads{display:none}}