:root{--bg: #070811;--panel: #10122b;--panel-edge: #262a5e;--cell-bg: #12152e;--cell-line: #1e2247;--region-line: #3a3f7d;--text: #e8ecff;--muted: #7c84b8;--neon-cyan: #00e0e8;--neon-yellow: #ffd23d;--neon-green: #4ade80;--neon-red: #ff5a5a;--crt-green: #aaff66;--gap: 2px;--cell: min(46px, calc((100vw - 58px) / 9));--bev: max(3px, calc(var(--cell) * .11));--pcell: clamp(15px, calc((100vw - 102px)/8) , 27px);--pbev: max(2px, calc(var(--pcell) * .12));--font-pixel: "Press Start 2P", "Courier New", monospace;--font-crt: "VT323", "Courier New", monospace}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font-pixel);color:var(--text);background-color:var(--bg);background-image:radial-gradient(ellipse 120% 60% at 50% -10%,rgba(64,75,255,.16),transparent 60%),linear-gradient(rgba(86,100,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(86,100,255,.05) 1px,transparent 1px);background-size:100% 100%,28px 28px,28px 28px;min-height:100vh;min-height:100dvh;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9000;background:repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0px,rgba(0,0,0,.16) 1px,transparent 1px,transparent 3px);opacity:.55}.game-shell{max-width:1020px;margin:0 auto;padding:14px 12px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:12px}.logo-row{text-align:center;margin-top:4px}.logo{margin:0;font-size:clamp(18px,5.2vw,36px);letter-spacing:.08em;line-height:1}.logo span{text-shadow:0 0 14px currentColor,2px 2px 0 #000;animation:logoFlicker 4s infinite}.logo span:nth-child(3n){animation-delay:1.3s}.logo span:nth-child(3n+1){animation-delay:2.6s}@keyframes logoFlicker{0%,96%,to{opacity:1}97%{opacity:.6}98%{opacity:1}99%{opacity:.75}}.tagline{font-family:var(--font-crt);font-size:clamp(15px,3.6vw,20px);color:var(--muted);letter-spacing:.5em;margin-top:8px;text-indent:.5em}.hud{display:flex;gap:8px;width:100%;max-width:calc(9 * var(--cell) + 8 * var(--gap) + 18px)}.readout{flex:1;background:#04050d;border:2px solid var(--panel-edge);border-radius:6px;padding:7px 6px 5px;text-align:center;box-shadow:inset 0 0 14px #000000e6}.ro-label{display:block;font-size:7px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}.ro-value{font-family:var(--font-crt);font-size:clamp(24px,6.5vw,32px);line-height:.85;color:var(--crt-green);text-shadow:0 0 10px rgba(170,255,102,.75)}.game-container{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}@media(min-width:880px){.game-container{flex-direction:row;align-items:flex-start;justify-content:center;gap:24px}}.board-wrap{position:relative}.board-banner{position:absolute;top:-26px;left:0;right:0;text-align:center;font-size:clamp(8px,2.4vw,11px);color:var(--neon-red);text-shadow:0 0 10px rgba(255,90,90,.8),1px 1px 0 #000;animation:bannerBlink 1s steps(2) infinite}@keyframes bannerBlink{50%{opacity:.35}}.board{display:grid;grid-template-columns:repeat(9,var(--cell));grid-template-rows:repeat(9,var(--cell));gap:var(--gap);padding:6px;background:#0a0c20;border:3px solid var(--neon-cyan);border-radius:8px;box-shadow:0 0 24px #00e0e859,0 0 3px var(--neon-cyan),inset 0 0 28px #000000bf;position:relative}.cell{width:var(--cell);height:var(--cell);background-color:var(--cell-bg);border:1px solid var(--cell-line);display:flex;justify-content:center;align-items:center;font-size:clamp(10px,calc(var(--cell) * .34),16px);color:var(--text);touch-action:manipulation}.cell.region-l{border-left:2px solid var(--region-line)}.cell.region-t{border-top:2px solid var(--region-line)}.cell.block,.ghost-cell,.piece-cell.filled{border:1px solid rgba(0,0,0,.6);color:#fff;text-shadow:1px 1px 0 rgba(0,0,0,.7);box-shadow:inset 0 var(--bev) 0 #ffffff61,inset var(--bev) 0 0 #ffffff2e,inset 0 calc(-1 * var(--bev)) 0 #0006,inset calc(-1 * var(--bev)) 0 0 #00000040}.cell.fixed-block{color:#c8cede;filter:saturate(.5)}.cell.removable{cursor:grab;touch-action:none}.cell.removable:active{cursor:grabbing}@media(hover:hover){.cell.removable:hover{filter:brightness(1.25)}}.cell.drag-src{opacity:.35}.cell.filled-hole{background-color:#04050d;color:var(--muted);border-color:#181b38;box-shadow:inset 0 0 10px #000000f2}.cell.highlight-valid{background-color:#4ade8059!important;box-shadow:inset 0 0 0 2px var(--neon-green),inset 0 0 14px #4ade8080!important}.cell.highlight-invalid{background-color:#ff5a5a59!important;box-shadow:inset 0 0 0 2px var(--neon-red),inset 0 0 14px #ff5a5a80!important}.cell.highlight-hint{background-color:#ffd23d66!important;box-shadow:inset 0 0 0 2px var(--neon-yellow),inset 0 0 14px #ffd23d99!important;animation:bannerBlink .8s steps(2) infinite}@keyframes errorShake{0%,to{transform:translate(0)}20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.board-error{animation:errorShake .4s ease-in-out;border-color:var(--neon-red);box-shadow:0 0 24px #ff5a5a80,inset 0 0 28px #000000bf}@keyframes popIn{0%{transform:scale(.7)}55%{transform:scale(1.12)}to{transform:scale(1)}}.piece-pop{animation:popIn .25s cubic-bezier(.175,.885,.32,1.275)}@keyframes winWave{0%,to{transform:translateY(0) scale(1);filter:brightness(1)}50%{transform:translateY(-8px) scale(1.08);filter:brightness(1.6)}}.win-cell{animation:winWave 1.5s ease-in-out infinite}.side-panel{width:100%;max-width:calc(9 * var(--cell) + 8 * var(--gap) + 18px);display:flex;flex-direction:column;gap:10px}@media(min-width:880px){.side-panel{width:300px}:root{--pcell: 27px}}.controls{display:flex;gap:8px}.difficulty{flex:1.2;display:flex;align-items:center;gap:6px;background:var(--panel);border:2px solid var(--panel-edge);border-radius:6px;padding:0 8px}.diff-label{font-size:8px;color:var(--muted);letter-spacing:.1em}.difficulty select{flex:1;min-width:0;background:transparent;color:var(--text);border:none;outline:none;font-family:var(--font-crt);font-size:20px;cursor:pointer}.difficulty select option{background:var(--panel);font-family:var(--font-crt)}.btn{font-family:var(--font-pixel);font-size:clamp(9px,2.4vw,11px);text-transform:uppercase;letter-spacing:.05em;border:none;border-radius:6px;padding:12px 10px;cursor:pointer;color:#081018;background:var(--neon-cyan);box-shadow:0 4px #00787e,0 6px 12px #00000080;transition:transform .06s,box-shadow .06s;touch-action:manipulation}.btn:active{transform:translateY(4px);box-shadow:0 0 #00787e}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--neon-yellow);color:#1a1402;box-shadow:0 4px #9c7a08,0 6px 12px #00000080;padding:14px 22px}.btn-primary:active{box-shadow:0 0 #9c7a08}.btn-hint{flex:1;background:var(--neon-yellow);color:#1a1402;box-shadow:0 4px #9c7a08,0 6px 12px #00000080}.btn-hint:active{box-shadow:0 0 #9c7a08}.btn-secondary{flex:1;background:#353a78;color:var(--text);box-shadow:0 4px #181b42,0 6px 12px #00000080}.btn-secondary:active{box-shadow:0 0 #181b42}@media(max-width:420px){.btn{font-size:8px;padding:12px 6px}}.slots{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(min-width:880px){.slots{grid-template-columns:1fr}}.slot{position:relative;background:var(--panel);border:2px solid var(--panel-edge);border-radius:8px;min-height:104px;display:flex;justify-content:center;align-items:center;padding:20px 10px 12px}.slot.current{border-color:var(--neon-yellow);box-shadow:0 0 14px #ffd23d40,inset 0 0 18px #0006}.slot.empty{border-style:dashed}.slot.dimmed .piece-grid{opacity:.3}.slot-label{position:absolute;top:6px;left:8px;font-size:7px;letter-spacing:.15em;color:var(--muted)}.slot.current .slot-label{color:var(--neon-yellow);text-shadow:0 0 8px rgba(255,210,61,.6)}.slot-empty-text{font-family:var(--font-crt);font-size:18px;color:#3a4070;letter-spacing:.3em}.return-btn{position:absolute;top:4px;right:4px;border:none;border-radius:4px;background:#6e1d2c;color:#ffb3b3;font-family:var(--font-pixel);font-size:7px;text-transform:uppercase;letter-spacing:.08em;padding:7px 8px;line-height:1;cursor:pointer;box-shadow:0 2px #3d0f18;z-index:5;touch-action:manipulation}.return-btn:active{transform:translateY(2px);box-shadow:none}.piece-grid{display:grid;gap:2px}.piece-cell{width:var(--pcell);height:var(--pcell);display:flex;justify-content:center;align-items:center;font-size:max(7px,calc(var(--pcell) * .4));border-radius:2px}.piece-cell.filled{cursor:grab;touch-action:none;box-shadow:inset 0 var(--pbev) 0 #ffffff61,inset var(--pbev) 0 0 #ffffff2e,inset 0 calc(-1 * var(--pbev)) 0 #0006,inset calc(-1 * var(--pbev)) 0 0 #00000040}.piece-cell.filled:active{cursor:grabbing}.queue-count{text-align:center;font-size:8px;letter-spacing:.2em;color:var(--muted)}.queue-count span{font-family:var(--font-crt);font-size:18px;color:var(--crt-green);text-shadow:0 0 8px rgba(170,255,102,.6);vertical-align:-2px}.drag-ghost{position:fixed;z-index:1000;pointer-events:none;display:grid;gap:2px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.65))}.ghost-cell{display:flex;justify-content:center;align-items:center;opacity:.95}.win-screen{position:absolute;inset:0;background:#05060feb;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;border-radius:5px;z-index:20;padding:16px}.win-screen h2{margin:0;font-size:clamp(20px,6vw,32px);color:var(--neon-green);text-shadow:0 0 18px rgba(74,222,128,.8),2px 2px 0 #000;animation:bannerBlink 1.2s steps(2) infinite}.win-stats{display:flex;gap:16px;font-family:var(--font-crt);font-size:clamp(16px,4vw,22px);color:var(--crt-green);text-shadow:0 0 8px rgba(170,255,102,.6);flex-wrap:wrap;justify-content:center}.win-stars{display:flex;gap:10px}.star{display:inline-block;font-size:clamp(36px,10vw,56px);opacity:0;transform:scale(0);animation:starPop .6s cubic-bezier(.175,.885,.32,1.275) forwards}.star.earned{color:var(--neon-yellow);text-shadow:0 0 18px rgba(255,210,61,.9)}.star.unearned{color:#2c315e}@keyframes starPop{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.modal-overlay{position:fixed;inset:0;background:#04050de0;display:flex;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:16px}.modal-content{background:var(--panel);border:3px solid var(--neon-cyan);border-radius:10px;box-shadow:0 0 30px #00e0e859,inset 0 0 30px #00000080;max-width:480px;width:100%;max-height:calc(100dvh - 32px);overflow-y:auto;padding:clamp(18px,5vw,32px);text-align:center}.modal-title{font-size:clamp(16px,5vw,26px);letter-spacing:.08em;margin-bottom:10px}.modal-title span{text-shadow:0 0 12px currentColor,2px 2px 0 #000}.modal-subtitle{font-family:var(--font-crt);font-size:22px;font-weight:400;color:var(--muted);letter-spacing:.35em;text-transform:uppercase;margin:0 0 18px}.modal-list{list-style:none;margin:0 0 22px;padding:0;text-align:left;font-family:var(--font-crt);font-size:clamp(17px,4.4vw,20px);line-height:1.45;color:var(--text)}.modal-list li{margin-bottom:10px}.li-key{font-family:var(--font-pixel);font-size:8px;color:var(--neon-cyan);letter-spacing:.1em;margin-right:8px;vertical-align:2px}.modal-btn{width:100%;animation:bannerBlink 1.6s steps(2) infinite}