*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;overscroll-behavior:none;touch-action:none;background:radial-gradient(120% 100% at 50% 0%,#2b1a4d,#170b2b 55%,#0c0517);font-family:Avenir Next,Helvetica Neue,system-ui,sans-serif;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#root,.app{position:fixed;inset:0}.scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.hud{position:absolute;top:calc(10px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));right:calc(12px + env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}.hud__title{color:#ffe14d;font-weight:800;font-size:clamp(13px,2.6vw,20px);letter-spacing:.14em;text-shadow:0 0 14px rgba(255,225,77,.55),0 2px 0 rgba(0,0,0,.45);white-space:nowrap}.hud__right{display:flex;gap:8px}.hud__chip{background:#140a28b8;border:1px solid rgba(255,255,255,.16);color:#fff;font-weight:700;font-size:15px;padding:7px 12px;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.hud__mute{pointer-events:auto;cursor:pointer;font:inherit}.timer{position:absolute;top:calc(56px + env(safe-area-inset-top));left:50%;transform:translate(-50%);background:#140a28c7;border:1px solid rgba(124,231,255,.5);color:#7ce7ff;font-size:clamp(18px,4vw,24px);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em;padding:8px 20px;border-radius:999px;pointer-events:none}.timer--low{color:#ff5d73;border-color:#ff5d7399;animation:timer-pulse 1s ease-in-out infinite}@keyframes timer-pulse{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.08)}}@media(prefers-reduced-motion:reduce){.timer--low,.coin-btn{animation:none}}.players-chip{position:absolute;top:calc(56px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));background:#140a28b8;border:1px solid rgba(53,224,255,.4);color:#7ce7ff;font-size:12px;font-weight:700;padding:6px 12px;border-radius:999px;pointer-events:none;white-space:nowrap}.toast{position:absolute;top:22%;left:50%;transform:translate(-50%);background:#140a28d9;border:1px solid rgba(255,225,77,.5);color:#ffe14d;font-size:clamp(18px,4vw,26px);font-weight:800;padding:12px 26px;border-radius:16px;animation:toast-pop .25s ease-out;pointer-events:none;white-space:nowrap}@keyframes toast-pop{0%{transform:translate(-50%) scale(.7);opacity:0}to{transform:translate(-50%) scale(1);opacity:1}}.center-cta{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.center-cta .coin-btn{pointer-events:auto}.controls__spacer{width:108px}.coin-btn{pointer-events:auto;background:linear-gradient(180deg,#ffd94d,#f0a71c);border:none;border-radius:18px;color:#3d2400;font-size:19px;font-weight:800;letter-spacing:.06em;padding:22px 26px;cursor:pointer;box-shadow:0 9px #a86f00,0 15px 28px #00000080;animation:coin-pulse 1.2s ease-in-out infinite;touch-action:manipulation;transition:transform .08s ease,box-shadow .08s ease,filter .2s ease;white-space:nowrap}.coin-btn:active:not(:disabled){transform:translateY(6px);box-shadow:0 3px #a86f00,0 8px 16px #00000073;animation:none}.coin-btn:disabled{filter:grayscale(.7) brightness(.7);cursor:default;animation:none}@keyframes coin-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.controls{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:space-between;padding:0 calc(20px + env(safe-area-inset-left)) calc(22px + env(safe-area-inset-bottom)) calc(20px + env(safe-area-inset-right));pointer-events:none}.controls__hint{color:#ffffffa6;font-size:13px;font-weight:600;text-align:center;padding-bottom:8px;max-width:34vw}.joystick{position:relative;width:128px;height:128px;border-radius:50%;pointer-events:auto;touch-action:none;cursor:grab}.joystick--disabled{opacity:.45;pointer-events:none}.joystick__ring{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 40%,#3c286e8c,#120824bf);border:2px solid rgba(255,255,255,.22);box-shadow:inset 0 6px 18px #0000008c,0 4px 18px #0006}.joystick__arrows{position:absolute;inset:0;color:#ffffff59;font-size:12px;pointer-events:none}.joystick__arrows span{position:absolute;left:50%;top:50%}.joystick__arrows span:nth-child(1){transform:translate(-50%,-54px)}.joystick__arrows span:nth-child(2){transform:translate(-50%,42px)}.joystick__arrows span:nth-child(3){transform:translate(-56px,-50%)}.joystick__arrows span:nth-child(4){transform:translate(44px,-50%)}.joystick__knob{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#ff7d9c,#d82a4e 60%,#8f1330);border:2px solid rgba(255,255,255,.35);box-shadow:0 6px 14px #0000008c,inset 0 -4px 10px #00000059;transition:transform .06s linear;pointer-events:none}.grab-btn{pointer-events:auto;width:108px;height:108px;border-radius:50%;border:none;color:#fff;cursor:pointer;touch-action:manipulation;transition:transform .08s ease,box-shadow .08s ease,filter .2s ease}.grab-btn--red{background:radial-gradient(circle at 38% 28%,#ff8484,#e02121 55%,#8f0f0f);box-shadow:0 10px #6d0808,0 16px 26px #0000008c,inset 0 -6px 14px #00000059}.grab-btn--red:active:not(:disabled){transform:translateY(7px);box-shadow:0 3px #6d0808,0 8px 16px #00000080,inset 0 -4px 10px #00000059}.grab-btn:disabled{filter:grayscale(.7) brightness(.7);cursor:default}.grab-btn__face{font-size:22px;font-weight:900;letter-spacing:.05em;text-shadow:0 2px 3px rgba(0,0,0,.5)}.grab-btn__sub{color:#ffe14d}@media(max-width:480px){.joystick{width:112px;height:112px}.grab-btn{width:96px;height:96px}.controls__hint{display:none}}
