:root{color-scheme:dark;--bg: #07070c;--text: rgba(255, 255, 255, .92);--muted: rgba(255, 255, 255, .6)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";background:radial-gradient(1200px 700px at 50% -120px,rgba(0,245,255,.16),transparent 60%),radial-gradient(900px 500px at 15% 30%,rgba(255,23,68,.12),transparent 60%),radial-gradient(900px 500px at 85% 40%,rgba(213,0,249,.1),transparent 60%),var(--bg);color:var(--text);-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}.retro{min-height:100%;display:grid;place-items:center;padding:0}.retro-device{width:min(420px,96vw);max-height:920px;height:min(920px,96dvh);border-radius:22px;padding:14px 18px 34px;background:linear-gradient(180deg,#2fa9ff,#1b86e6 40%,#0f6fcc);box-shadow:0 26px 80px #0000008c,0 0 0 1px #ffffff2e inset,0 -10px 30px #00000040 inset;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:12px}@media (max-width: 520px){.retro-device{width:100vw;height:100dvh;max-height:none;border-radius:0}}.retro-holes{position:absolute;top:18px;width:26px;height:110px;border-radius:18px;background:radial-gradient(circle,rgba(0,0,0,.45) 2px,transparent 3px) 0 0 / 10px 10px;opacity:.55;filter:blur(.2px)}.retro-holes-left{left:10px}.retro-holes-right{right:10px}.retro-screen-frame{border-radius:18px;padding:10px 10px 12px;background:linear-gradient(180deg,#0a121cd9,#0a121c99);box-shadow:0 10px 35px #00000080,0 0 0 1px #ffffff1f inset;flex:0 1 auto;min-height:0;height:clamp(520px,62dvh,640px)}.retro-screen-top{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:2px 4px 8px;color:#fffc;font-size:10px;letter-spacing:.9px;text-transform:uppercase}.retro-scoreline{display:grid;grid-auto-flow:column;gap:10px;font-variant-numeric:tabular-nums}.retro-score{display:inline-block;min-width:54px;text-align:right}.retro-screen{border-radius:14px;padding:10px;background:linear-gradient(180deg,#8f9a7f,#7f8a70);box-shadow:0 0 0 2px #00000059 inset,0 10px 26px #00000059;height:100%;min-height:0;display:flex;flex-direction:column}.retro-lcd{border-radius:10px;padding:10px;background:linear-gradient(180deg,#e6ebdfb3,#d7e0cda6);box-shadow:0 0 0 1px #00000040 inset,0 14px 40px #0000002e inset;display:grid;grid-template-columns:1fr 92px;gap:10px;position:relative;overflow:hidden;flex:1 1 auto;min-height:0}.retro-power-off{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:10px;background:radial-gradient(900px 420px at 50% 40%,#00000059,#0000009e 55%,#000c),linear-gradient(180deg,#191e1699,#0a0c0abf);pointer-events:none}.retro-device[data-power=off] .retro-screen-top{opacity:.35}.retro-game{display:grid;place-items:center;border-radius:8px;background:#5a685640;box-shadow:0 0 0 1px #00000026 inset;padding:6px;height:100%;min-height:0;width:100%;overflow:hidden;box-sizing:border-box}.retro-playfield{width:100%;height:100%;border-radius:10px;background:transparent;box-shadow:0 0 0 2px #00000059 inset,0 10px 24px #00000047;display:grid;place-items:center;overflow:hidden;padding:8px;box-sizing:border-box}@media (max-width: 520px){.retro-game{height:100%}}.retro-side{border-left:1px solid rgba(0,0,0,.25);padding-left:10px;display:grid;align-content:start;gap:10px;color:#000000bf;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:10px}.retro-side-row{display:grid;gap:2px}.retro-side-row .k{opacity:.8}.retro-side-row .v{font-variant-numeric:tabular-nums;font-weight:700}.retro-lives{letter-spacing:1px;white-space:nowrap}.retro-game-tabs{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;flex:0 0 auto}.retro-tab{padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.28);background:#0000001f;cursor:pointer;font-size:12px;letter-spacing:.2px}.retro-tab:hover{border-color:#ffffff73}.retro-tab-active{background:#ffffff29;box-shadow:0 0 0 1px #0003 inset}.retro-bottom{margin-top:0;padding:44px 0 22px;flex:0 0 auto}.retro-controls{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:flex-start;gap:14px;padding:0;justify-items:center;touch-action:none}.retro-dpad{--dpad: clamp(40px, 12vw, 46px);display:grid;grid-template-columns:var(--dpad) var(--dpad) var(--dpad);grid-template-rows:var(--dpad) var(--dpad) var(--dpad);gap:clamp(8px,2.6vw,10px);justify-content:start;align-items:center;pointer-events:auto}.dpad{width:var(--dpad);height:var(--dpad);border:none;border-radius:999px;background:radial-gradient(circle at 30% 25%,#fff59d,#ffeb3b 55%,#d1b800);color:#000000b8;box-shadow:0 12px #7c6100eb,0 22px 22px #0000004d,0 -10px 18px #ffffff2e inset,0 0 0 2px #0000002e inset;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;font-weight:900;position:relative;transform:translateY(-2px);transition:transform 90ms ease,box-shadow 90ms ease,filter 90ms ease}.dpad[data-label]:after{content:attr(data-label);position:absolute;left:50%;top:calc(100% + 6px);transform:translate(-50%);font-size:10px;letter-spacing:.5px;color:#ffffffd1;text-shadow:0 1px 0 rgba(0,0,0,.35);white-space:nowrap;pointer-events:none}.dpad:active,.dpad[aria-pressed=true]{transform:translateY(3px);filter:brightness(.97);box-shadow:0 6px #7c6100eb,0 14px 16px #00000052,0 -8px 14px #ffffff29 inset,0 0 0 2px #0000002e inset}.dpad:focus-visible{outline:2px solid rgba(0,245,255,.45);outline-offset:6px}.dpad.up{grid-column:2;grid-row:1}.dpad.left{grid-column:1;grid-row:2}.dpad.center{grid-column:2;grid-row:2;background:#0000002e;box-shadow:0 0 0 2px #0003 inset;color:#00000080;cursor:default;transform:none}.dpad.right{grid-column:3;grid-row:2}.dpad.down{grid-column:2;grid-row:3}.retro-mid{display:grid;justify-items:center;gap:10px;transform:translateY(28px);margin-top:80px}.retro-toggles{display:flex;gap:10px;align-items:center;justify-content:center}.retro-toggle{display:grid;justify-items:center;gap:4px}.retro-toggle-btn{border:0;background:transparent;padding:0;cursor:pointer}.retro-toggle-btn:focus-visible{outline:2px solid rgba(0,245,255,.4);outline-offset:6px;border-radius:10px}.retro-dot{width:18px;height:18px;border-radius:999px;background:radial-gradient(circle at 30% 25%,#d9ffb3,#00e676 70%,#008f43);box-shadow:0 10px 18px #00000040,0 0 0 2px #0003 inset}.retro-dot-off{background:radial-gradient(circle at 30% 25%,#f3f6f0,#b9c0b2 65%,#6f786b);opacity:.7}.retro-toggle-label{font-size:9px;letter-spacing:.4px;opacity:.85}.retro-small-btn{padding:10px 14px;border-radius:999px;border:none;background:radial-gradient(circle at 30% 25%,#fff59d,#ffeb3b 55%,#d1b800);color:#000000b8;box-shadow:0 10px #7c6100eb,0 18px 22px #0000004d,0 -10px 18px #ffffff2e inset,0 0 0 2px #0000002e inset;cursor:pointer;font-size:11px;letter-spacing:.6px;touch-action:none;transform:translateY(-2px);transition:transform 90ms ease,box-shadow 90ms ease,filter 90ms ease}.retro-small-btn:active{transform:translateY(2px);filter:brightness(.97);box-shadow:0 5px #7c6100eb,0 10px 16px #00000052,0 -8px 14px #ffffff29 inset,0 0 0 2px #0000002e inset}.retro-small-btn:focus-visible{outline:2px solid rgba(0,245,255,.45);outline-offset:6px}.retro-leds{display:flex;gap:8px;align-items:center}.led{width:10px;height:10px;border-radius:999px;background:radial-gradient(circle at 30% 25%,#d9ffb3,#00e676 70%,#008f43);box-shadow:0 0 0 2px #0000002e inset;opacity:.9}.retro-action{--action: clamp(64px, 16vw, 80px);display:grid;justify-items:center;gap:8px;justify-self:center;margin-right:0;align-self:flex-start}.action-btn{width:var(--action);height:var(--action);border-radius:999px;border:none;background:radial-gradient(circle at 30% 25%,#fff59d,#ffeb3b 55%,#d1b800);color:#0000008c;box-shadow:0 14px #7c6100eb,0 26px 26px #00000059,0 -12px 20px #fff3 inset,0 0 0 2px #0000002e inset;cursor:pointer;font-weight:900;touch-action:none;-webkit-user-select:none;user-select:none;transform:translateY(-3px);transition:transform 90ms ease,box-shadow 90ms ease,filter 90ms ease}.action-btn:active,.action-btn[aria-pressed=true]{transform:translateY(3px);filter:brightness(.97);box-shadow:0 7px #7c6100eb,0 14px 18px #00000059,0 -10px 18px #ffffff2e inset,0 0 0 2px #0000002e inset}.action-btn:focus-visible{outline:2px solid rgba(0,245,255,.45);outline-offset:8px}.action-label{font-size:11px;letter-spacing:.7px;opacity:.9;color:#ffffffe0;text-shadow:0 1px 0 rgba(0,0,0,.35)}.game-container{width:100%;max-width:420px;display:grid;gap:12px;justify-items:center}.game-stats{width:100%;display:flex;justify-content:space-between;gap:10px}.stat{flex:1;border:1px solid var(--border);border-radius:12px;background:#ffffff0f;padding:10px 12px}.stat span{display:block;font-size:11px;color:var(--muted)}.stat strong{display:block;margin-top:2px;font-size:18px}.game-canvas{width:100%;height:auto;border-radius:14px;border:1px solid rgba(0,0,0,.25);box-shadow:0 0 0 1px #0000002e inset;background:transparent}.game-controls{display:flex;justify-content:center;gap:10px}.btn-start,.btn-pause{padding:10px 14px;border-radius:12px;border:1px solid var(--border);background:#00000038;cursor:pointer;transform:translateY(-1px);box-shadow:0 6px #00000059,0 12px 18px #00000040;transition:transform 90ms ease,box-shadow 90ms ease,border-color .12s ease}.btn-start:active,.btn-pause:active{transform:translateY(2px);box-shadow:0 3px #00000059,0 7px 12px #00000047}.btn-start:focus-visible,.btn-pause:focus-visible{outline:2px solid rgba(0,245,255,.45);outline-offset:4px}.btn-start:hover,.btn-pause:hover{border-color:#00f5ff59}.key-hints{display:flex;justify-content:space-between;width:100%;gap:12px;color:var(--muted);font-size:12px}@media (max-width: 768px){.retro-mid{transform:none;margin-top:500px}}@media (max-width: 520px){.retro-screen-frame{height:clamp(440px,56dvh,560px)}.retro-bottom{padding:18px 0 14px}.retro-controls{grid-template-columns:1fr 1fr 1fr;gap:6px}.retro-mid{transform:none;margin-top:155px;gap:8px}.retro-dpad{--dpad: clamp(42px, 12vw, 50px);gap:clamp(4px,1.5vw,6px);margin-top:45px}.retro-ab{justify-content:center}}@media (max-width: 380px){.retro-action{--action: 72px}.retro-bottom{padding:14px 0 12px}}.retro .game-stats,.retro .game-controls,.retro .key-hints{display:none!important}.retro .game-container{max-width:none;width:100%;gap:0;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0}.retro .game-canvas{display:block;border-radius:8px;image-rendering:pixelated;filter:none;border:0;box-shadow:none;background:transparent;flex:0 1 auto;min-width:0;min-height:0;align-self:center;width:100%;height:100%;object-fit:contain;max-width:100%;max-height:100%}.retro-playfield .game-container{height:100%}.retro-playfield .game-canvas{border-radius:0}.retro-game-wrap{width:100%;height:100%;display:grid;place-items:center;padding:0;box-sizing:border-box;position:relative}.retro-game-wrap[data-status=idle] .game-container{visibility:hidden}.retro-picker{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;align-content:center;justify-items:center;gap:10px;padding:clamp(8px,3vw,12px);color:#000000bf;text-align:center;pointer-events:none}.retro-picker-title{font-size:12px;letter-spacing:1.2px;font-weight:800;opacity:.85}.retro-picker-row{display:grid;grid-template-columns:repeat(3,52px);gap:8px;justify-content:center;align-content:center;pointer-events:auto;max-width:100%}.retro-picker-brick{width:52px;height:34px;border-radius:6px;border:2px solid rgba(0,0,0,.45);background:linear-gradient(180deg,#00000012,#00000005),#0000000f;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:10px;letter-spacing:.6px;color:#000000bf;cursor:pointer;box-shadow:0 1px #ffffff40 inset,0 0 0 1px #00000040 inset}@media (max-width: 520px){.retro-picker-row{width:min(100%,180px);grid-template-columns:minmax(0,1fr);gap:10px}.retro-picker-brick{width:100%;height:38px;font-size:12px;letter-spacing:.8px}}.retro-picker-brick-active{background:linear-gradient(180deg,#00000024,#0000000d),#0000001f;box-shadow:0 0 0 2px #00000080 inset,0 10px 18px #0000002e}.retro-picker-hint{font-size:10px;opacity:.8}.retro-gameover{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;align-content:center;justify-items:center;gap:8px;text-align:center;pointer-events:none;color:#000000bf;padding:12px}.retro-gameover-title{font-size:16px;letter-spacing:2px;font-weight:900;text-shadow:0 1px 0 rgba(255,255,255,.2)}.retro-gameover-hint{font-size:11px;letter-spacing:.6px;opacity:.85}.retro-lcd:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(180deg,#0000000b,#0000000b,#ffffff05 2px,#ffffff05 4px),radial-gradient(700px 420px at 30% 10%,rgba(255,255,255,.14),transparent 55%),radial-gradient(700px 420px at 70% 60%,rgba(0,0,0,.08),transparent 60%);mix-blend-mode:multiply;opacity:.85}