*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;overflow:hidden;background:#05060f;color:#e8f1ff;font-family:Rajdhani,system-ui,sans-serif;user-select:none;-webkit-user-select:none;touch-action:none}
canvas{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:crosshair}
.hidden{display:none!important}
.screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(ellipse at center,rgba(5,6,15,.35),rgba(5,6,15,.85));animation:fade .35s ease;padding:20px;text-align:center}
@keyframes fade{from{opacity:0}to{opacity:1}}
.logo{font-family:Orbitron,sans-serif;font-weight:900;font-size:clamp(48px,11vw,124px);letter-spacing:.06em;line-height:.9;color:#7ff6ff;text-shadow:0 0 18px #19e3ff,0 0 60px #0aa7ff;display:flex;flex-direction:column;animation:pulse 3s ease-in-out infinite}
.logo span{color:#ff4fd8;text-shadow:0 0 18px #ff2bd0,0 0 60px #b014ff}
@keyframes pulse{50%{filter:brightness(1.25)}}
h2{font-family:Orbitron,sans-serif;font-weight:900;font-size:clamp(34px,7vw,64px);letter-spacing:.12em;color:#b6ff4f;text-shadow:0 0 20px #7dff2b}
h2.red{color:#ff4f6d;text-shadow:0 0 24px #ff1f4b}
.tag{opacity:.7;letter-spacing:.3em;text-transform:uppercase;font-size:14px}
.btn{font-family:Orbitron,sans-serif;font-weight:900;font-size:22px;letter-spacing:.2em;padding:16px 54px;border:2px solid #7ff6ff;background:rgba(25,227,255,.08);color:#eaffff;border-radius:999px;cursor:pointer;box-shadow:0 0 24px rgba(25,227,255,.45),inset 0 0 16px rgba(25,227,255,.25);transition:transform .12s,box-shadow .12s;margin-top:8px}
.btn:hover{transform:scale(1.06);box-shadow:0 0 40px rgba(25,227,255,.8),inset 0 0 20px rgba(25,227,255,.4)}
.btn.ghost{border-color:#556;box-shadow:none;font-size:14px;padding:10px 30px;opacity:.8}
.lbl{font-family:Orbitron,sans-serif;font-size:11px;letter-spacing:.25em;opacity:.6}
.skinlbl{margin-top:10px}
.skins{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:520px}
.skin{width:46px;height:46px;border-radius:50%;cursor:pointer;border:2px solid transparent;position:relative;transition:transform .12s}
.skin:hover{transform:scale(1.12)}
.skin.sel{border-color:#fff;box-shadow:0 0 16px #fff}
.skin.lock{filter:grayscale(1) brightness(.35);cursor:default}
.skin.lock::after{content:attr(data-req);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff;filter:none}
.best{font-family:Orbitron;font-size:14px;letter-spacing:.2em;color:#ffd84f}
.help{opacity:.5;font-size:14px;letter-spacing:.05em}
#hud{position:fixed;inset:0 0 auto 0;display:flex;justify-content:space-between;align-items:flex-start;padding:14px 20px;pointer-events:none;padding-top:max(14px,env(safe-area-inset-top))}
.big{font-family:Orbitron;font-weight:900;font-size:28px;text-shadow:0 0 12px rgba(127,246,255,.7)}
.hud-right{text-align:right}.hud-center{text-align:center;display:flex;flex-direction:column;align-items:center;gap:5px}
#timer{font-family:Orbitron;font-size:18px;font-weight:600}
.evo{width:min(36vw,260px);height:6px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
#evobar{height:100%;width:0;background:linear-gradient(90deg,#b6ff4f,#19e3ff);box-shadow:0 0 10px #b6ff4f}
.combo{font-family:Orbitron;font-weight:900;color:#ffd84f;text-shadow:0 0 12px #ffae00;font-size:18px;height:24px;transition:transform .1s}
.perks{display:flex;gap:4px;justify-content:flex-end;flex-wrap:wrap;max-width:40vw;margin-top:6px;font-size:16px}
.perks span{background:rgba(255,255,255,.07);border-radius:6px;padding:1px 5px}
.mute{position:fixed;right:16px;bottom:16px;width:44px;height:44px;border-radius:50%;border:1px solid #445;background:rgba(10,12,30,.6);color:#7ff6ff;font-size:20px;cursor:pointer;z-index:10}
.mute.off{color:#556;text-decoration:line-through}
.dashbtn{position:fixed;right:24px;bottom:80px;width:84px;height:84px;border-radius:50%;border:2px solid #ff4fd8;background:rgba(255,79,216,.15);color:#fff;font-family:Orbitron;font-weight:900;font-size:13px;z-index:5}
.cards{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.card{width:210px;min-height:250px;padding:22px 16px;border-radius:18px;background:linear-gradient(160deg,rgba(30,36,80,.95),rgba(12,14,34,.95));border:2px solid var(--c);box-shadow:0 0 26px color-mix(in srgb,var(--c) 45%,transparent);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:10px;transition:transform .15s;animation:pop .35s cubic-bezier(.2,1.6,.4,1) backwards}
.card:nth-child(2){animation-delay:.07s}.card:nth-child(3){animation-delay:.14s}
@keyframes pop{from{transform:scale(.4) translateY(40px);opacity:0}}
.card:hover{transform:translateY(-8px) scale(1.04)}
.card .ic{font-size:46px;filter:drop-shadow(0 0 10px var(--c))}
.card .nm{font-family:Orbitron;font-weight:900;font-size:16px;letter-spacing:.08em;color:var(--c)}
.card .ds{font-size:16px;opacity:.85;line-height:1.25}
.card .lv{font-family:Orbitron;font-size:11px;opacity:.6;margin-top:auto}
.card .key{font-family:Orbitron;font-size:11px;opacity:.4}
.final .huge{font-family:Orbitron;font-weight:900;font-size:clamp(48px,10vw,84px);color:#fff;text-shadow:0 0 24px #19e3ff}
.newbest{font-family:Orbitron;font-weight:900;color:#ffd84f;letter-spacing:.3em;text-shadow:0 0 16px #ffae00;animation:pulse .6s infinite}
.stats{display:grid;grid-template-columns:repeat(3,minmax(90px,1fr));gap:10px 26px;font-size:15px}
.stats div b{display:block;font-family:Orbitron;font-size:20px;color:#7ff6ff}
.unlock{color:#ff4fd8;font-family:Orbitron;font-size:14px;letter-spacing:.15em;min-height:18px}
@media (max-width:600px){.card{width:100%;min-height:0;flex-direction:row;text-align:left;padding:14px}.card .ic{font-size:34px}.card .lv,.card .key{display:none}.cards{gap:10px;width:100%}.big{font-size:22px}}