@font-face{font-family:GameHeading;src:url(../assets/fonts/heading_luckiest_guy.ttf) format("truetype");font-display:swap}@font-face{font-family:GameBody;src:url(../assets/fonts/body_baloo_2.ttf) format("truetype");font-display:swap}:root{--font-heading: "GameHeading", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-body: "GameBody", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}:root{--accent: #ffcc33;--accent-2: #ff4d6d;--panel-bg: rgba(30, 22, 48, .92);--panel-solid: #241634;--panel-border: rgba(255, 204, 51, .55);--panel-radius: 18px;--panel-shadow: 0 18px 48px rgba(10, 6, 24, .6), inset 0 1px 0 rgba(255, 255, 255, .12);--text: #fff6e6;--text-muted: rgba(255, 246, 230, .72);--btn-bg: #ffcc33;--btn-bg-hover: #ffdb6b;--btn-text: #3a1d10;--btn-2-bg: rgba(255, 255, 255, .14);--btn-2-text: #fff6e6;--overlay-scrim: rgba(20, 10, 40, .6);--teal: #56c5d8;--red: #e8455f}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#000;color:var(--text);font-family:var(--font-body),system-ui,sans-serif}#game-root{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(100vw,calc(100vh * 16 / 9));height:min(100vh,56.25vw);aspect-ratio:16 / 9;overflow:hidden;background:#11131a}#game-canvas{width:100%;height:100%;display:block;touch-action:none}#ui-root{position:absolute;inset:0;pointer-events:none;font-size:clamp(11px,1.7vw,18px)}#hud{position:absolute;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;padding:clamp(8px,1.6vw,18px);gap:10px}.hud-box{display:flex;align-items:center;gap:8px;background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:999px;padding:8px 18px;min-height:clamp(34px,4.2vw,52px);box-sizing:border-box;line-height:1;box-shadow:var(--panel-shadow);backdrop-filter:blur(3px)}.hud-icon{width:clamp(24px,3vw,38px);height:clamp(24px,3vw,38px);object-fit:contain;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}.hud-shots #hud-shots-num,.hud-score #hud-score-num{font-family:var(--font-heading),sans-serif;font-size:clamp(18px,2.6vw,30px);color:var(--accent);letter-spacing:1px;line-height:1;display:inline-flex;align-items:center}.hud-label{font-family:var(--font-heading),sans-serif;color:var(--text-muted);font-size:clamp(10px,1.2vw,14px);letter-spacing:1.5px}.hud-stage{flex-direction:column;align-items:stretch;border-radius:14px;min-width:clamp(110px,15vw,190px)}#hud-stage-name{font-family:var(--font-heading),sans-serif;font-size:clamp(13px,1.7vw,20px);color:var(--text);text-align:center;letter-spacing:1px}.power-track{height:8px;border-radius:999px;background:#0006;overflow:hidden;margin-top:5px}#hud-power-fill{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--teal),var(--accent),var(--red));transition:width 60ms linear}.hud-pop{transform-origin:center center;animation:hudPop .28s ease}@keyframes hudPop{0%{transform:scale(1)}40%{transform:scale(1.18)}to{transform:scale(1)}}#hint{position:absolute;bottom:clamp(8px,2vw,20px);left:50%;transform:translate(-50%);background:var(--panel-bg);border:2px solid var(--panel-border);border-radius:999px;padding:6px 18px;font-family:var(--font-body),sans-serif;font-weight:700;color:var(--text);font-size:clamp(11px,1.5vw,16px);box-shadow:var(--panel-shadow);transition:opacity .4s ease}#hint.hidden{opacity:0}#menu-layer{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:var(--overlay-scrim);backdrop-filter:blur(2px);pointer-events:auto;opacity:0;transition:opacity .3s ease}.overlay.hidden{display:none}.overlay.show{opacity:1}.card{width:min(88%,460px);background:var(--panel-bg);border:3px solid var(--panel-border);border-radius:var(--panel-radius);box-shadow:var(--panel-shadow);padding:clamp(18px,3vw,32px);text-align:center;transform:scale(.9);transition:transform .3s cubic-bezier(.2,1.3,.4,1)}.overlay.show .card{transform:scale(1)}.card h1{font-family:var(--font-heading),sans-serif;margin:0 0 6px;font-size:clamp(26px,4.5vw,46px);color:var(--accent);text-shadow:0 3px 0 rgba(0,0,0,.35);letter-spacing:1px}.card h1.fail{color:var(--red)}.card .sub{font-family:var(--font-body),sans-serif;color:var(--text-muted);margin:0 0 14px;font-size:clamp(13px,1.8vw,18px)}.stars{display:flex;justify-content:center;gap:10px;margin:10px 0 16px}.stars .star{width:clamp(38px,6vw,60px);height:clamp(38px,6vw,60px);object-fit:contain;opacity:.22;filter:grayscale(.7);transform:scale(.6);transition:transform .35s cubic-bezier(.2,1.5,.4,1),opacity .35s ease,filter .35s ease}.stars .star.on{opacity:1;filter:none;transform:scale(1)}.stat-row{display:flex;justify-content:space-between;align-items:center;background:#00000047;border-radius:10px;padding:8px 14px;margin:6px 0;font-family:var(--font-body),sans-serif}.stat-row .k{color:var(--text-muted);font-size:clamp(12px,1.6vw,16px)}.stat-row .v{color:var(--accent);font-family:var(--font-heading),sans-serif;font-size:clamp(15px,2vw,22px)}.btn-row{display:flex;gap:12px;justify-content:center;margin-top:16px;flex-wrap:wrap}.btn{pointer-events:auto;cursor:pointer;border:none;border-radius:999px;padding:12px 26px;min-height:46px;font-family:var(--font-heading),sans-serif;font-size:clamp(14px,1.9vw,20px);letter-spacing:1px;background:var(--btn-bg);color:var(--btn-text);box-shadow:0 6px #00000047,inset 0 1px #fff6;transition:transform .1s ease,background .15s ease,box-shadow .1s ease}.btn:hover{background:var(--btn-bg-hover);transform:translateY(-2px)}.btn:active{transform:translateY(2px);box-shadow:0 2px #00000047}.btn.secondary{background:var(--btn-2-bg);color:var(--btn-2-text);box-shadow:0 6px #00000047}.btn.secondary:hover{background:#ffffff3d}.board{margin:12px 0 4px;max-height:34vh;overflow-y:auto}.board-title{font-family:var(--font-heading),sans-serif;color:var(--text);font-size:clamp(14px,1.9vw,20px);margin-bottom:6px;letter-spacing:1px}.board-row{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:6px 12px;border-radius:8px;font-family:var(--font-body),sans-serif;font-size:clamp(12px,1.6vw,16px);background:#00000038;margin:4px 0}.board-row .rk{color:var(--text-muted);font-weight:700;text-align:center}.board-row .nm{text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-row .sc{color:var(--accent);font-weight:700}.board-row.you{background:#ffcc3338;border:1px solid var(--panel-border)}.board-empty{color:var(--text-muted);font-size:clamp(12px,1.6vw,16px);padding:8px}@media (prefers-reduced-motion: reduce){.overlay,.card,.stars .star,#hud-power-fill,.hud-pop,.btn{transition:none;animation:none}}button,[role=button]{pointer-events:auto}