*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--neon-green:#39ff14;--neon-red:#ff073a;--neon-orange:#ff6f00;--neon-yellow:#fff200;--bg-dark:#0a0a0a;--bg-overlay:#00000080;--text-primary:#fff;--text-secondary:#aaa;--hud-bg:#0009;--font-pixel:"Courier New", "Courier", monospace}html,body{background:var(--bg-dark);width:100%;height:100%;color:var(--text-primary);font-family:var(--font-pixel);-webkit-user-select:none;user-select:none;overflow:hidden}.screen{z-index:10;flex-direction:column;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.screen.active{display:flex}.splash-bg-layer{z-index:0;background:url(/assets/splash-bg-0RslFOn1.png) 50%/cover no-repeat;position:absolute;inset:0}.splash-bg-layer:after{content:"";z-index:1;background:linear-gradient(#0000001a 0%,#0000004d 100%);position:absolute;inset:0}#start-screen{background:var(--bg-dark)}.splash-content{z-index:2;flex-direction:column;justify-content:center;align-items:center;gap:32px;width:100%;height:100%;padding:32px 24px;display:flex;position:relative}.title-logo{filter:drop-shadow(0 4px 16px #0006);width:85vw;max-width:600px;height:auto;animation:3s ease-in-out infinite logoPulse;display:block}@keyframes logoPulse{0%,to{filter:drop-shadow(0 4px 12px #0000004d);transform:scale(1)}50%{filter:drop-shadow(0 6px 16px #0006);transform:scale(1.02)}}.instructions{justify-content:center;align-items:center;gap:12px;display:flex}.hand-instruction{filter:drop-shadow(0 2px 6px #0000004d);width:64px;height:auto;animation:3s ease-in-out infinite handBob;display:block}@keyframes handBob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.instruction-text{letter-spacing:2px;color:#fffffff2;text-transform:uppercase;text-shadow:0 2px 6px #0009;font-size:18px;font-weight:700}.start-buttons{flex-direction:column;align-items:center;gap:14px;width:100%;max-width:400px;display:flex}.btn-primary{width:100%;font-size:15px;font-family:var(--font-pixel);letter-spacing:2.5px;color:#fff;cursor:pointer;text-transform:uppercase;background:linear-gradient(135deg,#ff8c00,#f60);border:2px solid #fa3;border-radius:12px;padding:14px 24px;font-weight:700;transition:all .2s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 16px #ff640066,inset 0 1px #ffffff4d}.btn-primary:hover{background:linear-gradient(135deg,#ffa033,#f70);transform:scale(1.05)translateY(-2px);box-shadow:0 6px 24px #ff640080,inset 0 1px #fff6}.btn-primary:active{transform:scale(.97);box-shadow:0 2px 8px #ff64004d}.btn-secondary{width:100%;font-size:15px;font-family:var(--font-pixel);letter-spacing:2.5px;text-transform:uppercase;color:#fff;cursor:pointer;background:linear-gradient(135deg,#4caf50,#2e7d32);border:2px solid #66bb6a;border-radius:12px;padding:14px 24px;font-weight:700;transition:all .2s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 16px #4caf5066,inset 0 1px #ffffff4d}.btn-secondary:hover{color:#fff;background:linear-gradient(135deg,#66bb6a,#43a047);border-color:#81c784;transform:scale(1.05)translateY(-2px);box-shadow:0 6px 24px #4caf5066}.btn-secondary:active{transform:scale(.98)}#tutorial-overlay{-webkit-backdrop-filter:blur(12px);z-index:50;background:#000000eb}.tutorial-content{flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;max-width:600px;height:100%;padding:24px;display:flex}#tutorial-canvas{background:#ffffff08;border:1px solid #ffffff0f;border-radius:16px;width:100%;max-width:500px;height:60vh;max-height:400px}.tutorial-text{letter-spacing:3px;text-transform:uppercase;color:#fff;text-align:center;text-shadow:0 0 10px #39ff1466,0 2px 8px #000c;min-height:36px;font-size:22px;font-weight:700;transition:opacity .3s,transform .3s}.tutorial-text.fade-out{opacity:0;transform:translateY(-6px)}.tutorial-text.fade-in{opacity:1;transform:translateY(0)}.tutorial-btn{opacity:1;pointer-events:all;max-width:340px;transition:background .2s,box-shadow .2s,transform .2s;transform:translateY(0)}.tutorial-nav{flex-direction:row;justify-content:center;align-items:center;gap:16px;display:flex}.tutorial-nav-btn{color:#fff;cursor:pointer;background:#ffffff1f;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;font-weight:700;transition:background .2s,transform .15s;display:flex}.tutorial-nav-btn:hover{background:#ffffff40;transform:scale(1.1)}.tutorial-nav-btn:active{transform:scale(.95)}.tutorial-dots{justify-content:center;gap:10px;margin-top:4px;display:flex}.tutorial-dot{background:#fff3;border-radius:50%;width:8px;height:8px;transition:all .4s}.tutorial-dot.active{background:var(--neon-green);transform:scale(1.3);box-shadow:0 0 8px #39ff1499}#game-screen{z-index:1;background:var(--bg-dark)}#game-canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#hud{z-index:20;pointer-events:none;background:linear-gradient(#000000b3,#0000);justify-content:space-between;align-items:flex-start;padding:16px 24px;display:flex;position:fixed;top:0;left:0;right:0}.hud-left,.hud-right{gap:24px;display:flex}.hud-center{text-align:center}.hud-item{flex-direction:column;align-items:center;display:flex}.hud-label{letter-spacing:3px;color:var(--text-secondary);font-size:10px}.hud-value{color:var(--neon-green);text-shadow:0 0 10px #39ff1480;font-size:28px;font-weight:900}.lives-container{gap:8px;display:flex}.life-heart{width:24px;height:24px;font-size:20px;transition:all .3s}.life-heart.lost{opacity:.2;transform:scale(.8)}.pip{display:none!important}.pip video,.pip canvas{object-fit:cover;width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}.pip canvas{pointer-events:none}.pip-btn{color:#fff;cursor:pointer;z-index:31;pointer-events:all;background:#0009;border:none;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;display:flex;position:absolute;top:4px;right:4px}.pip.hidden{border-radius:50%;width:40px;height:40px}.pip.hidden video,.pip.hidden canvas{display:none}#gameover-screen{background:var(--bg-dark)}.gameover-content{z-index:2;flex-direction:column;justify-content:center;align-items:center;gap:24px;width:100%;max-width:340px;padding:24px;display:flex;position:relative}.gameover-title{color:var(--neon-red);text-shadow:0 0 10px var(--neon-red), 0 0 30px var(--neon-red), 0 0 60px #ff073a4d;letter-spacing:4px;text-align:center;font-size:48px;font-weight:900}.final-stats{flex-direction:column;gap:6px;width:100%;display:flex}.stat-row{letter-spacing:1px;background:#ffffff0a;border-radius:4px;justify-content:space-between;padding:8px 16px;font-size:14px;display:flex}.stat-row span:first-child{color:#ffffff80}.stat-row span:last-child{color:var(--neon-green);text-shadow:0 0 6px #39ff144d;font-weight:700}.gameover-buttons{flex-direction:column;align-items:center;gap:10px;width:100%;display:flex}.screen-flash{z-index:15;pointer-events:none;background:#ffffff26;animation:.15s ease-out forwards flashFade;position:fixed;inset:0}@keyframes flashFade{to{opacity:0}}@media (width<=600px){.title-logo{max-width:280px}.hand-instruction{width:36px}.instruction-text{letter-spacing:1.5px;font-size:11px}.btn-primary{letter-spacing:2px;padding:12px 20px;font-size:13px}.btn-secondary{padding:8px 20px;font-size:11px}.start-buttons{max-width:280px}.splash-content{gap:24px;padding:24px 16px}.pip{width:140px;height:105px}.hud-value{font-size:22px}.gameover-title{letter-spacing:3px;font-size:36px}.gameover-content{max-width:300px}#tutorial-canvas{height:50vh;max-height:300px}.tutorial-text{letter-spacing:2px;font-size:16px}.tutorial-btn{max-width:260px}.tutorial-content{gap:16px;padding:16px}.tutorial-nav-btn{width:34px;height:34px;font-size:17px}.tutorial-nav{gap:12px}}