:root{--bg: #05070c;--panel: rgba(10, 14, 24, .88);--panel-border: rgba(255, 255, 255, .08);--text: #eaf7ff;--muted: #92a4c0;--danger: #ff3b5b;--success: #35e98a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden;background:radial-gradient(circle at top,#0d1120 0%,var(--bg) 45%,#020307 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;touch-action:none;-webkit-user-select:none;user-select:none}body{min-height:100%}#app{position:relative;width:100%;height:100%;overflow:hidden}#app:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;opacity:0;background:radial-gradient(circle at top,#7ddcff29,#5ab4ff14 28%,#08122205 62%,#060a1200),linear-gradient(180deg,#7ed4ff14,#3770ad0f 38%,#060c1405);transition:opacity .22s ease}#app:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;opacity:0;background:radial-gradient(circle at bottom,#ff782e33,#ff9b3e1f 22%,#2212080a 54%,#060a1200),linear-gradient(180deg,#18120c00,#ff77200d 70%,#ff5c1a14);transition:opacity .18s ease}#app.freeze-active:before{opacity:1}#game-root{position:absolute;top:0;right:0;bottom:0;left:0}#spectrum-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(circle at 18% 28%,#ff606038,#ff606000 26%),radial-gradient(circle at 78% 24%,#ffc04738,#ffc04700 24%),radial-gradient(circle at 30% 78%,#53f49733,#53f49700 26%),radial-gradient(circle at 72% 72%,#46d6ff38,#46d6ff00 26%),conic-gradient(from 90deg at 50% 50%,#ff5b5b1f,#ffb3471f,#fff06a1f,#55f38f1f,#47d6ff1f,#ca73ff1f,#ff5b5b1f);mix-blend-mode:screen;filter:blur(12px) saturate(1.15);transform:scale(1.02)}#spectrum-overlay.show{animation:spectrum-burst .85s ease-out forwards}canvas{display:block}.ui-hidden{opacity:0;visibility:hidden;pointer-events:none}#top-status{position:absolute;top:max(10px,env(safe-area-inset-top));left:50%;z-index:5;display:flex;align-items:center;gap:8px;transform:translate(-50%)}.top-chip{min-width:86px;padding:8px 10px;border-radius:16px;text-align:center;background:#080d17b3;border:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 22px #00000047;transition:background .22s ease,border-color .22s ease,box-shadow .22s ease,color .22s ease}.top-chip-progress{min-width:118px}.top-chip-label{font-size:9px;font-weight:800;letter-spacing:.16em;color:var(--muted);text-transform:uppercase}.top-chip-value{margin-top:4px;font-size:18px;line-height:1;font-weight:800;text-shadow:0 0 16px rgba(255,255,255,.12);transition:text-shadow .22s ease,color .22s ease}.top-pause-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#080d17c2;color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 10px 22px #00000047;transition:transform .12s ease,opacity .2s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease}.top-pause-btn:hover:not(:disabled){box-shadow:0 14px 28px #00000052,0 0 18px #00f0ff1f}.top-pause-btn:active:not(:disabled){transform:scale(.96)}.top-pause-btn:disabled{cursor:default;opacity:.5;transform:none}.pause-icon{display:inline-flex;gap:4px;align-items:center;justify-content:center}.pause-icon span{width:4px;height:16px;border-radius:999px;background:currentColor;box-shadow:0 0 10px #ffffff2e}#bottom-bar{position:absolute;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:24px;background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 36px #00000059;transition:background .22s ease,border-color .22s ease,box-shadow .22s ease}#coin-panel{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:88px;padding:8px 10px;border-radius:18px;background:#ffc40012;border:1px solid rgba(255,196,0,.12);transition:background .22s ease,border-color .22s ease,box-shadow .22s ease}.coin-label{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#f5d27d}.coin-value{margin-top:4px;font-size:24px;line-height:1;font-weight:800;color:#fff2c4;text-shadow:0 0 18px rgba(255,196,0,.18)}#power-buttons{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:1}.power-slot{display:flex;flex-direction:column;align-items:center;gap:5px}.power-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:56px;height:56px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:linear-gradient(180deg,#101a2cf0,#0a101df0);color:var(--text);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 14px 30px #00000047,inset 0 0 18px #ffffff0a;transition:transform .12s ease,box-shadow .2s ease}.power-btn:disabled{cursor:default;opacity:.42;transform:none;box-shadow:0 10px 22px #00000038}.power-btn:active{transform:scale(.96)}.power-btn:hover:not(:disabled){box-shadow:0 18px 34px #00000052,inset 0 0 18px #ffffff0d}.power-btn-active{box-shadow:0 18px 34px #00000052,0 0 24px #00f0ff38,inset 0 0 18px #ffffff0f}.power-btn-fire-active{box-shadow:0 18px 34px #00000052,0 0 24px #ff7d3047,inset 0 0 18px #ffffff0f}.power-btn-spectrum-active{box-shadow:0 18px 34px #00000052,0 0 28px #b484ff38,inset 0 0 18px #ffffff0f}.power-cost{font-size:10px;line-height:1;font-weight:800;color:var(--muted);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}#app.freeze-active .top-chip{background:#102234cc;border-color:#a8ebff3d;box-shadow:0 12px 26px #0000004d,0 0 22px #7edcff24}#app.freeze-active .top-chip-value{color:#e9fbff;text-shadow:0 0 18px rgba(168,235,255,.24)}#app.freeze-active .top-pause-btn{background:#102234d1;border-color:#a8ebff3d;box-shadow:0 12px 26px #0000004d,0 0 22px #7edcff24}#app.freeze-active #bottom-bar{background:#0c1828e6;border-color:#a4e8ff2e;box-shadow:0 18px 38px #0000005c,0 0 28px #76d6ff14}#app.freeze-active #coin-panel{background:#6ebeeb1a;border-color:#a4e8ff2e;box-shadow:0 0 18px #76d6ff14}#app.freeze-active .coin-label{color:#aeeeff}#app.freeze-active .coin-value{color:#effcff;text-shadow:0 0 18px rgba(168,235,255,.24)}#app.freeze-active .power-cost{color:#bfefff}#app.fire-active:after{opacity:1}#app.fire-active #bottom-bar{background:#161210e6;border-color:#ff9b5c29;box-shadow:0 18px 38px #0000005c,0 0 24px #ff7f2414}#app.fire-active #coin-panel{background:#ff7e221a;border-color:#ffa8602e;box-shadow:0 0 18px #ff7e2214}#app.fire-active .coin-label{color:#ffcf99}#app.fire-active .coin-value{color:#fff0d7;text-shadow:0 0 18px rgba(255,154,76,.22)}#app.fire-active .power-cost{color:#ffd1a8}#app.spectrum-active #bottom-bar{box-shadow:0 18px 38px #0000005c,0 0 24px #a488ff1a}#app.spectrum-active #coin-panel{background:#a488ff14;border-color:#c1adff29}#app.spectrum-active .coin-label{color:#e2d8ff}#app.spectrum-active .coin-value{color:#faf5ff;text-shadow:0 0 18px rgba(193,173,255,.24)}#app.spectrum-active .power-cost{color:#e8dcff}.power-icon{position:relative;display:inline-flex;align-items:center;justify-content:center}.power-icon-snow{font-size:24px;color:#8feaff;text-shadow:0 0 16px rgba(0,240,255,.38)}.power-icon-fire{width:22px;height:28px}.power-icon-fire:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:60% 60% 70% 70%/72% 72% 42% 42%;background:linear-gradient(180deg,#ffd36f,#ff8a1d 58%,#ff4b2b);clip-path:polygon(50% 0%,72% 18%,86% 44%,78% 78%,50% 100%,20% 78%,12% 46%,28% 18%);filter:drop-shadow(0 0 10px rgba(255,138,29,.36))}.fire-core{position:absolute;width:10px;height:14px;border-radius:60% 60% 68% 68%/70% 70% 40% 40%;background:linear-gradient(180deg,#fff7b3,#ffd86b);clip-path:polygon(50% 0%,72% 26%,68% 74%,50% 100%,30% 74%,28% 28%)}.power-btn-spectrum{box-shadow:0 14px 30px #00000047,0 0 20px #ffffff14,inset 0 0 18px #ffffff0a}.power-icon-spectrum{width:24px;height:24px;background:conic-gradient(#ff5b5b,#ff5b5b 60deg,#ffb347 60deg,#ffb347 120deg,#fff06a 120deg,#fff06a 180deg,#55f38f 180deg,#55f38f 240deg,#47d6ff 240deg,#47d6ff 300deg,#ca73ff 300deg,#ca73ff 360deg);clip-path:polygon(25% 6%,75% 6%,96% 50%,75% 94%,25% 94%,4% 50%);filter:drop-shadow(0 0 10px rgba(255,255,255,.18))}.action-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:16px;padding:14px 18px;font-size:15px;font-weight:800;color:#fff;cursor:pointer;transition:transform .12s ease,opacity .2s ease,box-shadow .2s ease;white-space:nowrap}.action-btn:disabled{cursor:default;opacity:.55;transform:none}.action-btn:active{transform:scale(.98)}.secondary-btn,#overlay-secondary-btn{background:linear-gradient(180deg,#16233d,#0f1729);border:1px solid rgba(0,240,255,.25);box-shadow:0 0 28px #00f0ff1f,inset 0 0 18px #ffffff0d}#overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#030408bd;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility 0s linear .28s,backdrop-filter .28s ease}#overlay.show{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .28s ease,visibility 0s linear 0s,backdrop-filter .28s ease}.overlay-card{width:min(92vw,390px);padding:24px;border-radius:24px;text-align:center;background:#0a0c14eb;border:1px solid rgba(255,255,255,.08);box-shadow:0 0 40px #ff3b5b24;opacity:0;transform:translateY(20px) scale(.96);transition:opacity .28s ease,transform .32s cubic-bezier(.22,1,.36,1),box-shadow .28s ease;will-change:opacity,transform;max-height:min(88vh,760px);overflow-y:auto}#overlay.show .overlay-card{opacity:1;transform:translateY(0) scale(1)}.overlay-card.win{width:min(92vw,460px);box-shadow:0 0 40px #35e98a2e}.overlay-card h1{margin:0 0 10px;font-size:32px;line-height:1.05;text-shadow:0 0 20px rgba(255,255,255,.16)}.overlay-card h1.lose{color:#ff6b7e;text-shadow:0 0 20px rgba(255,59,91,.35)}.overlay-card h1.win{color:#6fffb0;text-shadow:0 0 20px rgba(53,233,138,.35)}.overlay-card h1.pause{color:#8feaff;text-shadow:0 0 20px rgba(0,240,255,.3)}.overlay-card p{margin:0 0 18px;color:var(--muted);line-height:1.5;font-size:14px}.upgrade-shop{margin:0 0 18px;text-align:left}.upgrade-shop-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.upgrade-shop-title{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#8feaff}.upgrade-shop-balance{font-size:13px;font-weight:800;color:#ffe182}.upgrade-shop-list{display:grid;gap:10px}.upgrade-shop-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;padding:14px 14px 13px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#0f1522eb,#090d18f0);color:var(--text);text-align:left;cursor:pointer;transition:transform .12s ease,opacity .2s ease,border-color .2s ease,box-shadow .2s ease}.upgrade-shop-card:hover:not(:disabled){border-color:#6fffb057;box-shadow:0 16px 28px #00000047,0 0 22px #35e98a1f}.upgrade-shop-card:active:not(:disabled){transform:scale(.985)}.upgrade-shop-card:disabled{cursor:default;opacity:.55}.upgrade-shop-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.upgrade-shop-card-title{font-size:15px;font-weight:800}.upgrade-shop-card-level{font-size:12px;font-weight:800;color:#8feaff}.upgrade-shop-card-description{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.4}.upgrade-shop-card-bonus{margin-top:8px;color:#d9f8ff;font-size:12px;font-weight:700}.upgrade-shop-card-cost{margin-top:10px;color:#ffe182;font-size:12px;font-weight:800}.overlay-actions{display:flex;flex-direction:column;gap:10px}#overlay-primary-btn{background:linear-gradient(180deg,#37ef8d,#1fb76b);box-shadow:0 0 28px #37ef8d38}#tutorial-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:24;display:flex;align-items:center;justify-content:center;padding:24px;background:#03050ac2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.tutorial-card{width:min(92vw,410px);padding:24px;border-radius:24px;text-align:center;background:linear-gradient(180deg,#0a0e18fa,#070a12f5);border:1px solid rgba(255,255,255,.09);box-shadow:0 24px 60px #0000006b,0 0 36px #00f0ff1a,inset 0 0 24px #ffffff08;animation:tutorial-card-in .28s cubic-bezier(.22,1,.36,1) both}.tutorial-eyebrow{margin-bottom:10px;color:#8feaff;font-size:11px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.tutorial-card h2{margin:0 0 10px;font-size:30px;line-height:1.05;text-shadow:0 0 20px rgba(255,255,255,.14)}.tutorial-card p{margin:0 0 18px;color:var(--muted);font-size:15px;line-height:1.55}.tutorial-card .action-btn{min-width:150px;justify-content:center;background:linear-gradient(180deg,#37ef8d,#1fb76b);box-shadow:0 0 28px #37ef8d38}#main-menu{position:absolute;top:0;right:0;bottom:0;left:0;z-index:12;display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .32s ease,visibility 0s linear .32s}#main-menu.show{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .32s ease,visibility 0s linear 0s}.menu-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at top,#11213dc7,#05070cf0 56%,#020307fa);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.menu-card{position:relative;z-index:1;width:min(92vw,460px);padding:30px 28px;border-radius:28px;text-align:center;background:linear-gradient(180deg,#0a0e18f5,#070a12f0);border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 60px #0000006b,0 0 40px #00f0ff14,inset 0 0 24px #ffffff08;opacity:0;transform:translateY(24px) scale(.96);transition:opacity .32s ease,transform .36s cubic-bezier(.22,1,.36,1),box-shadow .32s ease}#main-menu.show .menu-card{opacity:1;transform:translateY(0) scale(1)}.menu-eyebrow{margin-bottom:10px;color:#8feaff;font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.menu-card h1{margin:0 0 12px;font-size:clamp(40px,8vw,58px);line-height:.95;text-transform:uppercase;text-shadow:0 0 24px rgba(255,255,255,.14)}.menu-copy{margin:0 auto 24px;max-width:340px}.menu-mode-grid{display:grid;gap:10px;margin:0 auto 20px}.menu-mode-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;padding:14px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#0f1522e6,#090d18eb);color:var(--text);text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:6px;box-shadow:0 14px 28px #0000003d,inset 0 0 18px #ffffff08;transition:transform .12s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease}.menu-mode-card:hover{box-shadow:0 18px 34px #0000004d,0 0 20px #00f0ff14,inset 0 0 18px #ffffff0a}.menu-mode-card:active{transform:scale(.985)}.menu-mode-card.active{border-color:#50ed9b5c;background:linear-gradient(180deg,#12221ceb,#0a1814f0);box-shadow:0 18px 34px #0000004d,0 0 24px #37ef8d1f,inset 0 0 18px #ffffff0a}.menu-mode-title{font-size:15px;font-weight:800;color:#f4fbff}.menu-mode-text{font-size:13px;line-height:1.45;color:var(--muted)}.menu-actions{display:flex;flex-direction:column;gap:10px;align-items:center}.menu-shop-modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:20px}.menu-shop-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#04060cc2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.menu-shop-panel{position:relative;z-index:1;width:min(100%,460px);max-height:min(84vh,760px);overflow-y:auto;padding:22px 20px 20px;border-radius:24px;background:linear-gradient(180deg,#0a0e18fa,#070a12f5);border:1px solid rgba(255,255,255,.08);box-shadow:0 26px 60px #0000006b,0 0 34px #00f0ff14,inset 0 0 24px #ffffff08}.menu-shop-actions{display:flex;justify-content:center;margin-top:14px}.menu-card p{margin:0 0 12px;color:var(--muted);font-size:15px;line-height:1.6}.menu-card p:last-child{margin-bottom:0}.menu-note{color:#cfe8ff;font-size:14px}#menu-start-btn{min-width:190px;justify-content:center;background:linear-gradient(180deg,#37ef8d,#1fb76b);box-shadow:0 0 28px #37ef8d38}#menu-sound-btn,#menu-shop-btn{min-width:190px;justify-content:center}@keyframes spectrum-burst{0%{opacity:0;transform:scale(1.06);filter:blur(18px) saturate(1.28)}20%{opacity:1;transform:scale(1);filter:blur(12px) saturate(1.22)}to{opacity:0;transform:scale(1.02);filter:blur(14px) saturate(1.08)}}@keyframes tutorial-card-in{0%{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 720px){#top-status{top:max(8px,env(safe-area-inset-top));gap:6px}.top-chip{min-width:78px;padding:7px 9px;border-radius:14px}.top-chip-progress{min-width:106px}.top-chip-label{font-size:8px}.top-chip-value{font-size:16px}.top-pause-btn{width:38px;height:38px;border-radius:12px}.pause-icon span{width:3px;height:14px}#bottom-bar{padding:10px;gap:10px}#coin-panel{min-width:72px;padding:8px 9px}.coin-value{font-size:20px}#power-buttons{gap:8px}.power-slot{gap:4px}.power-btn{width:48px;height:48px;border-radius:16px}.power-cost{font-size:9px}.power-icon-snow{font-size:21px}.power-icon-fire{transform:scale(.88)}.power-icon-spectrum{width:20px;height:20px}.menu-card{padding:26px 20px}.menu-shop-modal{padding:14px}.menu-shop-panel{padding:18px 14px 16px;border-radius:20px}.tutorial-card{padding:22px 18px}.tutorial-card h2{font-size:26px}}