*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}body{color:#e8ecf4;-webkit-user-select:none;user-select:none;background:#0a0e1a;font-family:Segoe UI,Malgun Gothic,system-ui,sans-serif}#game-container{display:none;position:fixed;inset:0}#game-container canvas{display:block}#hud-root{pointer-events:none;z-index:10;display:none;position:fixed;inset:0}.hud-stats{flex-direction:column;gap:8px;display:flex;position:absolute;top:20px;left:20px}.hud-stat{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#080c18a6;border:1px solid #78a0ff40;border-radius:8px;align-items:baseline;gap:10px;padding:6px 14px;display:flex}.hud-stat-label{color:#8fa3c8;letter-spacing:1px;font-size:12px}.hud-stat-value{color:#fff;font-variant-numeric:tabular-nums;font-size:20px;font-weight:700}.hud-crosshair{width:0;height:0;position:absolute;top:50%;left:50%}.ch-dot{background:#fff;border-radius:50%;width:4px;height:4px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 4px #000c}.ch-line{background:#fff;position:absolute;box-shadow:0 0 3px #000c}.ch-t{width:2px;height:10px;top:-18px;left:-1px}.ch-b{width:2px;height:10px;top:8px;left:-1px}.ch-l{width:10px;height:2px;top:-1px;left:-18px}.ch-r{width:10px;height:2px;top:-1px;left:8px}.hud-healthwrap{width:260px;position:absolute;bottom:26px;left:20px}.hud-healthlabel{color:#8fa3c8;letter-spacing:1px;margin-bottom:4px;font-size:12px}.hud-healthbar{background:#080c18b3;border:1px solid #78a0ff4d;border-radius:8px;height:16px;overflow:hidden}.hud-healthfill{background:#4ade80;width:100%;height:100%;transition:width .2s,background .3s}.hud-message{color:#ffd966;text-shadow:0 2px 8px #000000e6;opacity:0;white-space:nowrap;font-size:22px;font-weight:600;transition:opacity .3s;position:absolute;bottom:120px;left:50%;transform:translate(-50%)}.hud-message.visible{opacity:1}.hud-title{text-align:center;opacity:0;transition:opacity .35s,transform .35s;position:absolute;top:30%;left:50%;transform:translate(-50%,-50%)}.hud-title.visible{opacity:1;transform:translate(-50%,-50%)scale(1.05)}.hud-title-main{letter-spacing:4px;color:#fff;text-shadow:0 0 24px #64a0ffe6,0 4px 12px #000c;font-size:52px;font-weight:800}.hud-title-sub{color:#b9c8e8;text-shadow:0 2px 6px #000c;margin-top:8px;font-size:20px}.hud-hint{color:#c8d6f0bf;text-shadow:0 1px 4px #000000e6;white-space:nowrap;font-size:13px;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.hud-damage{opacity:0;background:radial-gradient(#0000 40%,#ff1e1e73 100%);position:absolute;inset:0}.hud-damage.flash{animation:.5s ease-out dmgflash}@keyframes dmgflash{0%{opacity:1}to{opacity:0}}#engine-overlay{z-index:20;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#050810d1;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.ov-panel{text-align:center;background:linear-gradient(160deg,#141c34f2,#0a0e1cf2);border:1px solid #78a0ff4d;border-radius:20px;max-width:560px;padding:44px 56px;animation:.3s ease-out panelin;box-shadow:0 20px 80px #0009,0 0 40px #5078ff1f}@keyframes panelin{0%{opacity:0;transform:translateY(16px)scale(.97)}to{opacity:1;transform:none}}.ov-emoji{margin-bottom:10px;font-size:56px}.ov-title{letter-spacing:1px;margin-bottom:8px;font-size:34px;font-weight:800}.ov-title.ov-win{color:#4ade80;text-shadow:0 0 20px #4ade8080}.ov-title.ov-lose{color:#f87171;text-shadow:0 0 20px #f8717180}.ov-sub{color:#a7b6d4;margin-bottom:18px;font-size:15px;line-height:1.6}.ov-loading{color:#7fd1ff;font-size:16px;animation:1.2s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.4}}.ov-controls{text-align:left;grid-template-columns:1fr 1fr;gap:8px 24px;margin:6px 0 20px;display:grid}.ov-ctrl{color:#c4d2ec;align-items:center;gap:10px;font-size:14px;display:flex}.ov-key{text-align:center;color:#9fc0ff;background:#78a0ff1f;border:1px solid #78a0ff59;border-radius:6px;min-width:52px;padding:3px 10px;font-family:Consolas,monospace;font-size:12px;font-weight:700;display:inline-block}.ov-score{color:#e8ecf4;margin-bottom:10px;font-size:22px}.ov-score b{color:#ffd966;font-size:28px}.ov-best{color:#ffd966;margin-bottom:16px;font-size:15px}.ov-record{color:#ffe14d;margin-bottom:16px;font-size:18px;font-weight:700;animation:.8s ease-in-out infinite pulse}.ov-btn{color:#c4d2ec;cursor:pointer;background:#78a0ff14;border:1px solid #78a0ff4d;border-radius:12px;width:100%;margin-top:10px;padding:13px 28px;font-family:inherit;font-size:16px;font-weight:700;transition:all .15s;display:block}.ov-btn:hover{background:#78a0ff33;transform:translateY(-1px)}.ov-btn-primary{color:#fff;background:linear-gradient(135deg,#3b82f6,#7c3aed);border:none;box-shadow:0 6px 24px #5064ff59}.ov-btn-primary:hover{filter:brightness(1.15)}#hub-root{z-index:5;background:radial-gradient(1200px 600px at 80% -10%,#503cdc40,#0000),radial-gradient(900px 500px at 10% 110%,#00a0ff2e,#0000),#0a0e1a;position:fixed;inset:0;overflow-y:auto}.hub-header{text-align:center;padding:56px 20px 30px}.hub-logo{letter-spacing:6px;background:linear-gradient(120deg,#60a5fa,#a78bfa,#f472b6);-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 24px #7878ff59);-webkit-background-clip:text;background-clip:text;font-size:46px;font-weight:900}.hub-tagline{color:#8fa3c8;letter-spacing:2px;margin-top:10px;font-size:16px}.hub-status{margin-top:12px}.hub-online{border-radius:999px;padding:5px 14px;font-size:12.5px;font-weight:600;display:inline-block}.hub-online.on{color:#4ade80;background:#4ade8014;border:1px solid #4ade8059}.hub-online.off{color:#8fa3c8;background:#8ca0c80f;border:1px solid #8ca0c840}.hub-controls{flex-wrap:wrap;justify-content:center;gap:10px;padding:0 20px 24px;display:flex}.hub-sort-btn{color:#8fa3c8;cursor:pointer;background:#78a0ff0f;border:1px solid #78a0ff40;border-radius:999px;padding:9px 20px;font-family:inherit;font-size:14px;font-weight:600;transition:all .15s}.hub-sort-btn:hover{color:#c4d2ec;background:#78a0ff26}.hub-sort-btn.active{color:#fff;background:linear-gradient(135deg,#3b82f6,#7c3aed);border-color:#0000;box-shadow:0 4px 16px #5064ff4d}.hub-card-rank{z-index:2;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:800;position:absolute;top:12px;right:12px}.hub-card-rank.rank-1{color:#1a1200;background:linear-gradient(135deg,#fbbf24,#d97706);box-shadow:0 0 16px #fbbf2480}.hub-card-rank.rank-2{color:#111;background:linear-gradient(135deg,#e5e7eb,#9ca3af)}.hub-card-rank.rank-3{color:#fff;background:linear-gradient(135deg,#d97706,#92400e)}.hub-card-plays{color:#7fd1ff;margin-top:10px;font-size:12.5px;position:relative}.hub-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px;max-width:1280px;margin:0 auto;padding:10px 32px 60px;display:grid}.hub-card{cursor:pointer;background:linear-gradient(165deg,#1a223ce6,#0d1222e6);border:1px solid #78a0ff2e;border-radius:18px;padding:26px 24px 22px;transition:transform .18s,box-shadow .18s,border-color .18s;position:relative;overflow:hidden}.hub-card:before{content:"";background:radial-gradient(400px 160px at 50% -20%, var(--accent-glow), transparent);opacity:.4;transition:opacity .2s;position:absolute;inset:0}.hub-card:hover{border-color:var(--accent);box-shadow:0 18px 50px #00000080, 0 0 30px var(--accent-glow);transform:translateY(-6px)scale(1.02)}.hub-card:hover:before{opacity:.9}.hub-card-emoji{margin-bottom:12px;font-size:44px;position:relative}.hub-card-tagline{letter-spacing:1.5px;color:var(--accent);border:1px solid var(--accent);border-radius:999px;margin-bottom:10px;padding:3px 10px;font-size:11px;font-weight:700;display:inline-block;position:relative}.hub-card-title{margin-bottom:8px;font-size:22px;font-weight:800;position:relative}.hub-card-desc{color:#9db0d4;min-height:63px;font-size:13.5px;line-height:1.55;position:relative}.hub-card-footer{justify-content:space-between;align-items:center;margin-top:14px;display:flex;position:relative}.hub-card-diff{color:#ffd966;letter-spacing:2px;font-size:13px}.hub-card-best{color:#8fa3c8;font-size:12.5px}.hub-card-play{color:var(--accent);opacity:0;font-size:13px;font-weight:700;transition:all .18s;transform:translate(-6px)}.hub-card:hover .hub-card-play{opacity:1;transform:none}.hub-footer{text-align:center;color:#5c6b8c;padding:0 20px 40px;font-size:13px}#touch-controls{z-index:15;pointer-events:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:fixed;inset:0}.tc-joy{pointer-events:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#78a0ff1a;border:2px solid #a0beff59;border-radius:50%;width:132px;height:132px;position:absolute;bottom:30px;left:26px}.tc-joy-knob{will-change:transform;background:#a0beff80;border:2px solid #dce6ffd9;border-radius:50%;width:58px;height:58px;margin:-29px 0 0 -29px;position:absolute;top:50%;left:50%;box-shadow:0 2px 10px #00000059}.tc-buttons{pointer-events:none;flex-direction:column-reverse;align-items:flex-end;gap:14px;display:flex;position:absolute;bottom:34px;right:24px}.tc-btn{pointer-events:auto;color:#eaf0ff;background:#4664b44d;border:2px solid #a0beff73;border-radius:50%;justify-content:center;align-items:center;width:76px;height:76px;font-family:inherit;font-size:15px;font-weight:700;transition:background 80ms,transform 80ms;display:flex;box-shadow:0 3px 12px #0000004d}.tc-btn.tc-btn-primary{background:#ff465a57;border-color:#ff829699;width:96px;height:96px;font-size:17px}.tc-btn:active{background:#a0beff99;transform:scale(.94)}.tc-btn.tc-btn-primary:active{background:#ff5a6eb3}.tc-pause{pointer-events:auto;letter-spacing:2px;color:#cdd8f0;background:#080c188c;border:1px solid #78a0ff59;border-radius:12px;width:46px;height:46px;font-family:inherit;font-size:16px;font-weight:800;position:absolute;top:16px;right:16px}.tc-pause:active{background:#78a0ff4d}.tc-hint{color:#c8d6f08c;pointer-events:none;white-space:nowrap;text-shadow:0 1px 3px #000c;font-size:11px;position:absolute;bottom:6px;left:50%;transform:translate(-50%)}#hub-root::-webkit-scrollbar{width:10px}#hub-root::-webkit-scrollbar-track{background:#0a0e1a}#hub-root::-webkit-scrollbar-thumb{background:#2a3654;border-radius:5px}