@font-face{font-family:Fredoka;src:url(../fonts/fredoka-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Nunito;src:url(../fonts/nunito-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Nunito;src:url(../fonts/nunito-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Nunito;src:url(../fonts/nunito-800.woff2) format("woff2");font-weight:800;font-style:normal;font-display:swap}:root{--bg: #121021;--surface: #1b1836;--surface-2: #221e45;--surface-3: #343163;--accent: #ff8c42;--accent-hi: #ffa75e;--accent-edge: #b85c1e;--violet: #6f4bd8;--violet-hi: #8362f2;--violet-edge: #4c2fa3;--green: #2cb67d;--gold: #ffd803;--text: #fffffe;--text-dim: #94a1b2;--text-dimmer: #8f95b3;--danger: #ff5d5d;--font-display: "Fredoka", "Nunito", system-ui, sans-serif;--font-body: "Nunito", system-ui, -apple-system, sans-serif;--r-sm: 10px;--r-md: 14px;--r-lg: 22px;--shadow-btn: 0 3px 0 var(--accent-edge), 0 8px 16px rgba(0, 0, 0, .35);--shadow-btn-press: 0 1px 0 var(--accent-edge), 0 3px 8px rgba(0, 0, 0, .3);--shadow-tile: 0 2px 0 rgba(8, 6, 18, .55), 0 4px 10px rgba(0, 0, 0, .25);--shadow-tile-press: 0 1px 0 rgba(8, 6, 18, .55), 0 2px 6px rgba(0, 0, 0, .2);--shadow-card: 0 24px 48px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .07);--ease-press: cubic-bezier(.25, .46, .45, .94);--ease-pop: cubic-bezier(.2, 1.4, .4, 1)}#app{font-family:var(--font-body);color:var(--text);user-select:none;-webkit-user-select:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#app svg{display:block}#app .ui{position:absolute;inset:0;pointer-events:none}#app .ui>*{pointer-events:none}#app button,#app .clickable{pointer-events:auto}.btn{appearance:none;border:none;border-radius:var(--r-md);background:linear-gradient(180deg,var(--accent-hi),var(--accent));color:#26130a;font-family:var(--font-body);font-weight:800;font-size:1em;letter-spacing:1.5px;padding:14px 36px;min-height:48px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:var(--shadow-btn);transition:transform .12s var(--ease-press),box-shadow .12s var(--ease-press),filter .12s var(--ease-press)}.btn svg{width:1.05em;height:1.05em}.btn:active{transform:translateY(2px) scale(.98);box-shadow:var(--shadow-btn-press)}.btn-secondary{background:linear-gradient(180deg,var(--violet-hi),var(--violet));color:var(--text);box-shadow:0 3px 0 var(--violet-edge),0 8px 16px #00000059}.btn-secondary:active{box-shadow:0 1px 0 var(--violet-edge),0 3px 8px #0000004d}.btn-outline{background:#ff8c4212;color:var(--accent-hi);border:2px solid var(--accent);box-shadow:0 2px 8px #00000040}.btn-outline:active{transform:translateY(1px) scale(.98);box-shadow:0 1px 4px #0003}.btn-sm{padding:10px 20px;min-height:44px;font-size:.88em;letter-spacing:1.2px}.icon-btn{appearance:none;border:1px solid var(--surface-3);background:linear-gradient(180deg,var(--surface-2),var(--surface));box-shadow:inset 0 1px #ffffff12,var(--shadow-tile);color:#cdd3e0;width:44px;height:44px;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .1s var(--ease-press),box-shadow .1s var(--ease-press),border-color .15s,color .15s;font-family:inherit;line-height:1;padding:0}.icon-btn svg{width:20px;height:20px}.icon-btn:active{transform:translateY(1px) scale(.94);box-shadow:inset 0 1px #ffffff0d,var(--shadow-tile-press)}.icon-btn:disabled{opacity:.35}.screen{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;pointer-events:none}.screen.active{display:flex;animation:screenIn .24s ease-out}#screen-menu{justify-content:center;gap:16px;text-align:center;background:radial-gradient(ellipse at 50% 28%,rgba(127,90,240,.3),transparent 70%)}#screen-menu h1{font-family:var(--font-display);font-weight:600;font-size:2.75em;letter-spacing:3px;line-height:1.05;margin:0;background:linear-gradient(180deg,#ffc46b,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 14px rgba(255,140,66,.35))}#screen-menu .tagline{color:var(--text-dim);margin:0 24px 8px;max-width:30ch;font-size:.97em;line-height:1.5}.menu-arrows{display:flex;gap:12px;margin-bottom:8px}.menu-arrows span{display:inline-flex;animation:float 2.4s ease-in-out infinite}.menu-arrows svg{width:30px;height:30px;stroke-width:2.6}.menu-arrows .dir-up svg{transform:rotate(-90deg)}.menu-arrows .dir-left svg{transform:rotate(180deg)}.menu-arrows .dir-down svg{transform:rotate(90deg)}.menu-arrows .dir-up{color:var(--accent)}.menu-arrows .dir-left{animation-delay:.3s;color:var(--violet-hi)}.menu-arrows .dir-right{animation-delay:.6s;color:var(--green)}.menu-arrows .dir-down{animation-delay:.9s;color:var(--gold)}#btn-play{min-width:216px;padding:16px 40px;font-size:1.06em;position:relative;overflow:hidden}#btn-play:after{content:"";position:absolute;top:-20%;bottom:-20%;width:42%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.34),transparent);transform:skew(-18deg);animation:sheen 3.4s var(--ease-press) infinite;pointer-events:none}#screen-menu .menu-sound{margin-top:4px}.brand{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom));color:var(--text-dimmer);font-size:.75em;font-weight:700;letter-spacing:2px}#hud{position:absolute;top:0;left:50%;right:auto;width:min(100vw,56.25vh);transform:translate(-50%);box-sizing:border-box;padding:calc(8px + env(safe-area-inset-top)) 10px 8px;display:none;align-items:center;justify-content:space-between;pointer-events:none}#hud.active{display:flex;animation:screenIn .2s ease-out}#hud .hud-left,#hud .hud-right{display:flex;gap:8px;align-items:center}#hud .hud-mid{text-align:center;line-height:1.15;pointer-events:none}#hud .level-name{font-family:var(--font-display);font-weight:600;font-size:1em;letter-spacing:1px;color:var(--text);white-space:nowrap}#hud .moves{font-weight:700;font-size:.8em;color:var(--text-dim);white-space:nowrap}#hud .moves.over-par{color:var(--gold)}@media(max-width:340px){#hud{padding-inline:8px}#hud .hud-left,#hud .hud-right{gap:6px}#hud .level-name{font-size:.9em}#hud .moves{font-size:.75em}#hud .hud-mid .lbl{display:none}}#screen-levels{justify-content:flex-start;padding:calc(12px + env(safe-area-inset-top)) 16px calc(12px + env(safe-area-inset-bottom));gap:12px;background:#121021d1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.levels-head{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:420px}.levels-head h2{margin:0;font-family:var(--font-display);font-weight:600;letter-spacing:3px;color:var(--accent);font-size:1.3em}.levels-grid-wrap{overflow-y:auto;width:100%;max-width:420px;flex:1;pointer-events:auto;padding-top:4px;scrollbar-width:thin;scrollbar-color:var(--surface-3) transparent}.levels-grid-wrap::-webkit-scrollbar{width:6px}.levels-grid-wrap::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:3px}.levels-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;animation:screenIn .26s ease-out}.level-btn{aspect-ratio:1;border-radius:12px;border:1px solid var(--surface-3);background:linear-gradient(180deg,var(--surface-2),var(--surface));box-shadow:inset 0 1px #ffffff0f,var(--shadow-tile);color:var(--text);font-family:var(--font-display);font-weight:600;font-size:1.05em;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:transform .1s var(--ease-press),box-shadow .1s var(--ease-press),border-color .2s}.level-btn:active{transform:translateY(1px) scale(.94);box-shadow:inset 0 1px #ffffff0d,var(--shadow-tile-press)}.level-btn.unlocked{border-color:var(--violet-hi)}#app .level-btn.locked{opacity:.5;pointer-events:none;cursor:default}.level-btn .stars{display:flex;gap:2px;color:var(--gold);filter:drop-shadow(0 1px 2px rgba(255,216,3,.35));height:12px;align-items:center}.level-btn .stars svg{width:11px;height:11px}.level-btn .stars .empty{color:#454a68;filter:none}.level-btn .stars .lock{display:flex;color:var(--text-dimmer);height:auto}.level-btn .stars .lock svg{width:18px;height:18px;filter:none}#screen-complete{justify-content:center;gap:12px;background:#0a08148c;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.complete-card{background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--surface-3);border-radius:var(--r-lg);padding:24px 20px 20px;box-sizing:border-box;max-width:min(360px,92vw);width:min(360px,92vw);display:flex;flex-direction:column;align-items:center;gap:12px;box-shadow:var(--shadow-card);animation:cardIn .38s var(--ease-pop);pointer-events:auto}.complete-card h2{margin:0;font-family:var(--font-display);font-weight:600;font-size:1.4em;letter-spacing:3px;color:var(--green);text-align:center;filter:drop-shadow(0 0 10px rgba(44,182,125,.35))}.complete-card{position:relative}.complete-card:before{content:"";position:absolute;inset:-1px;border-radius:calc(var(--r-lg) + 1px);background:conic-gradient(from 0deg,transparent 0deg,rgba(255,216,3,.4) 60deg,transparent 140deg,transparent 200deg,rgba(255,140,66,.3) 280deg,transparent 340deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1.5px;animation:rimSpin 5s linear infinite;pointer-events:none}.complete-card .big-stars{display:flex;gap:8px;color:var(--gold);filter:drop-shadow(0 2px 6px rgba(255,216,3,.4))}.complete-card .big-stars span{display:inline-flex;animation:starPop .45s var(--ease-pop) both}.complete-card .big-stars span:nth-child(2){animation-delay:.14s}.complete-card .big-stars span:nth-child(3){animation-delay:.28s}.complete-card .big-stars svg{width:40px;height:40px}.complete-card .big-stars span.empty{color:#454a68;filter:none}.complete-card .score-line{color:var(--text-dim);font-size:.95em}.complete-card .score-line b{color:var(--text)}.complete-card .row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:4px;width:100%}.complete-card .row .btn-outline{flex:1 1 40%;padding-inline:12px}.complete-card .row #btn-next{flex:1 1 100%;order:3;min-height:48px;font-size:1em}@media(max-width:340px){.complete-card{padding:20px 16px 16px}.complete-card .big-stars svg{width:36px;height:36px}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes screenIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cardIn{0%{transform:translateY(28px) scale(.94);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes slideUp{0%{transform:translateY(34px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes starPop{0%{transform:scale(0) rotate(-30deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}@keyframes sheen{0%,55%{left:-60%}to{left:130%}}@keyframes rimSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(hover:hover){.btn:hover{transform:translateY(-1px);filter:brightness(1.07)}.icon-btn:not(:disabled):hover{border-color:var(--violet-hi);color:var(--text)}.level-btn.unlocked:hover{border-color:var(--accent);transform:translateY(-1px)}}.btn:focus-visible,.icon-btn:focus-visible,.level-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}@media(prefers-reduced-motion:reduce){.menu-arrows span,.screen.active,#hud.active,.levels-grid,.complete-card,.complete-card:before,.complete-card .big-stars span,#btn-play:after{animation:none}.btn,.icon-btn,.level-btn{transition:none}}