:root{--orange: #ff7a1a;--orange-2: #ffb347;--ink: #0b0f2b;--glass: rgba(255, 255, 255, .08);--glass-2: rgba(255, 255, 255, .16);--text: #f4f6ff;--dim: #aab3d9;--font-display: "Big Shoulders Display", Impact, "Arial Narrow", sans-serif;--font-body: "IBM Plex Sans", system-ui, sans-serif;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px)}html[dir=rtl]{--font-body: "Vazirmatn", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--ink);color:var(--text);font-family:var(--font-body);user-select:none;-webkit-user-select:none;touch-action:manipulation}#app{position:fixed;inset:0}#game-canvas{position:absolute;inset:0;display:block;touch-action:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;opacity:0;pointer-events:none;transform:translateY(18px) scale(.985);transition:opacity .38s cubic-bezier(.2,.8,.2,1),transform .46s cubic-bezier(.2,.8,.2,1)}.screen.active{opacity:1;pointer-events:auto;transform:none}.screen.hud{pointer-events:none;justify-content:space-between}.screen.hud.active>*{pointer-events:auto}.overlay{justify-content:center;background:radial-gradient(circle at 50% 40%,#141a4a8c,#050818d9);backdrop-filter:blur(6px)}#screen-home{justify-content:flex-end;padding-bottom:calc(60px + var(--safe-b))}.brand{position:absolute;top:calc(9% + var(--safe-t));display:flex;flex-direction:column;align-items:center;gap:4px;animation:floaty 5s ease-in-out infinite}.brand-pym{font-family:var(--font-display);font-weight:900;font-size:14px;letter-spacing:.55em;padding:6px 10px 6px 16px;border:2px solid var(--orange);border-radius:999px;color:var(--orange)}.brand-pym.small{font-size:11px;padding:3px 6px 3px 10px}.brand-lab{font-family:var(--font-display);font-weight:900;font-size:clamp(64px,19vw,118px);line-height:.9;letter-spacing:.02em;background:linear-gradient(180deg,#fff 20%,#cfd8ff 60%,#8ea0ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 8px 30px rgba(120,140,255,.35))}.brand-sub{font-family:var(--font-display);font-weight:700;font-size:clamp(18px,5vw,28px);letter-spacing:.42em;color:var(--orange-2)}.home-actions{display:flex;flex-direction:column;align-items:center;gap:18px;width:min(86vw,420px)}.home-status{margin:14px 0 0;font-size:13px;color:var(--dim);min-height:18px;text-align:center}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.btn-orange{position:relative;font-family:var(--font-display);font-weight:800;letter-spacing:.12em;text-transform:lowercase;color:#fff;background:linear-gradient(180deg,#ff9a3c,#ff6a00 60%,#f25a00);border-radius:999px;box-shadow:0 14px 40px #ff6e1473,inset 0 -4px #0000002e,inset 0 2px #ffffff59;transition:transform .14s ease,box-shadow .14s ease,filter .14s}.btn-orange:active{transform:translateY(3px) scale(.98);box-shadow:0 6px 18px #ff6e1459}.btn-big{width:100%;padding:20px 28px;font-size:36px;animation:pulse 2.4s ease-in-out infinite}html[dir=rtl] .btn-orange{font-family:var(--font-body);letter-spacing:0;font-weight:800}@keyframes pulse{0%,to{box-shadow:0 14px 40px #ff6e1473,inset 0 -4px #0000002e,inset 0 2px #ffffff59}50%{box-shadow:0 18px 60px #ff8c28b3,inset 0 -4px #0000002e,inset 0 2px #ffffff59}}.btn-ghost{padding:12px 22px;border-radius:999px;border:1.5px solid rgba(255,255,255,.35);background:var(--glass);backdrop-filter:blur(10px);font-weight:600;font-size:15px;transition:background .2s,transform .14s}.btn-ghost:active{transform:scale(.97);background:var(--glass-2)}.icon-btn{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:var(--glass);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);transition:transform .14s}.icon-btn:active{transform:scale(.92)}.icon-btn.flip svg{transform:scaleX(-1)}html[dir=rtl] .icon-btn svg{transform:scaleX(-1)}html[dir=rtl] .icon-btn.flip svg{transform:none}.topbar{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(14px + var(--safe-t)) 16px 0}.topbar h2{margin:0;font-family:var(--font-display);font-weight:800;font-size:30px;letter-spacing:.08em}.pill{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:999px;background:#0a0e32a6;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px);font-weight:700;font-variant-numeric:tabular-nums}.pill-coin svg{color:#ffd166;width:22px;height:22px}.pill-coin b.bump{animation:bump .4s ease}@keyframes bump{30%{transform:scale(1.35);color:#ffd166}}.hud-level{display:flex;flex-direction:column;align-items:center;line-height:1;font-family:var(--font-display)}.hud-level small{font-size:12px;letter-spacing:.4em;color:var(--dim);font-weight:700}.hud-level b{font-size:44px;font-weight:900;letter-spacing:.04em}html[dir=rtl] .hud-level{font-family:var(--font-body)}html[dir=rtl] .hud-level small{letter-spacing:0}.hud-moves{align-self:flex-start;margin:8px 18px 0;font-size:13px;color:var(--dim);pointer-events:none!important}html[dir=rtl] .hud-moves{align-self:flex-end}.actions{width:100%;display:flex;justify-content:center;gap:clamp(10px,3vw,22px);padding:0 12px calc(22px + var(--safe-b))}.action{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:56px}.action small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);font-weight:600}.action-ring{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#ff9a3c,#ff6a00 65%,#ef5600);box-shadow:0 10px 26px #ff6e1466,inset 0 -3px #0000002e,inset 0 2px #ffffff59;transition:transform .14s,filter .2s}.action-ring svg{width:28px;height:28px;stroke-width:2.2}.action:active .action-ring{transform:scale(.9)}.action[disabled] .action-ring{filter:grayscale(.7) brightness(.55);box-shadow:none}.action[disabled]{cursor:default}.action .badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#fff;color:#ff6a00;font-size:12px;font-weight:800;display:grid;place-items:center}.action-ring{position:relative}#screen-levels{background:linear-gradient(180deg,#080b2880,#080b28bf)}.levels-pager{display:flex;align-items:center;gap:16px;margin:12px 0 6px;font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:.08em;color:var(--dim)}.levels-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;width:min(92vw,460px);padding:10px 0 calc(30px + var(--safe-b));overflow-y:auto;max-height:calc(100% - 150px)}.lvl{aspect-ratio:1;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:var(--font-display);font-weight:800;font-size:34px;background:#ffffff12;border:1.5px solid rgba(255,255,255,.14);color:var(--text);transition:transform .18s cubic-bezier(.2,.8,.2,1),background .2s;animation:lvl-in .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 28ms)}@keyframes lvl-in{0%{opacity:0;transform:translateY(22px) scale(.85)}}.lvl:active{transform:scale(.92)}.lvl.done{background:linear-gradient(180deg,#ff9a3c59,#ff6a0040);border-color:#ffaa5a99}.lvl.current{background:linear-gradient(180deg,#ff9a3c,#ff6a00);border-color:#ffd7b0;color:#fff;box-shadow:0 12px 34px #ff6e148c;animation:lvl-in .5s cubic-bezier(.2,.8,.2,1) both,glow 1.6s ease-in-out infinite}@keyframes glow{50%{box-shadow:0 12px 50px #ff9628e6}}.lvl.locked{color:#ffffff47;background:#ffffff08}.lvl .lvl-stars{display:flex;gap:2px}.lvl .lvl-stars svg{width:12px;height:12px;fill:#ffd166;stroke:none}.lvl .lvl-stars svg.off{fill:#fff3}.veil{position:absolute;inset:0;background:#0305148c;opacity:0;pointer-events:none;transition:opacity .3s}.veil.open{opacity:1;pointer-events:auto}.drawer{position:absolute;top:0;bottom:0;left:0;width:min(78vw,340px);padding:calc(18px + var(--safe-t)) 18px calc(18px + var(--safe-b));background:linear-gradient(180deg,#141a4af5,#0c1030fa);border-right:1px solid rgba(255,255,255,.12);box-shadow:20px 0 60px #00000073;transform:translate(-105%);transition:transform .42s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;gap:16px;overflow-y:auto}html[dir=rtl] .drawer{left:auto;right:0;border-right:0;border-left:1px solid rgba(255,255,255,.12);transform:translate(105%)}.drawer.open{transform:none}.drawer-head{display:flex;align-items:center;gap:10px}.drawer-head b{flex:1;font-family:var(--font-display);font-size:24px;letter-spacing:.08em}.drawer-nav{display:flex;flex-direction:column;gap:8px}.drawer-item{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-radius:14px;background:var(--glass);border:1px solid rgba(255,255,255,.1);font-weight:600;text-align:start;transition:background .2s}.drawer-item:active{background:var(--glass-2)}.drawer-item i{font-style:normal;color:var(--orange-2);font-weight:800;letter-spacing:.1em}.drawer-board h3{margin:0 0 8px;font-family:var(--font-display);font-size:20px;letter-spacing:.1em;color:var(--dim)}.drawer-board ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.drawer-board li{display:flex;align-items:center;gap:10px;font-size:14px}.drawer-board li img,.drawer-board li .av{width:28px;height:28px;border-radius:50%;background:var(--glass-2);object-fit:cover}.drawer-board li span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drawer-board li b{color:var(--orange-2);font-variant-numeric:tabular-nums}.drawer-board .empty{color:var(--dim);font-size:13px}.card{width:min(86vw,400px);padding:46px 26px 30px;border-radius:34px;background:linear-gradient(180deg,#283482d9,#121846f2);border:1.5px solid rgba(255,255,255,.22);box-shadow:0 40px 100px #0000008c,inset 0 1px #ffffff4d;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;position:relative;transform:scale(.8) translateY(30px);opacity:0;transition:transform .55s cubic-bezier(.34,1.56,.64,1),opacity .3s}.screen.active .card{transform:none;opacity:1}.card h2{margin:0;font-family:var(--font-display);font-weight:900;font-size:40px;letter-spacing:.06em;background:linear-gradient(180deg,#fff,#cfd8ff);-webkit-background-clip:text;background-clip:text;color:transparent}html[dir=rtl] .card h2{font-family:var(--font-body);font-size:32px;letter-spacing:0}.stars{position:absolute;top:-44px;display:flex;align-items:flex-end;gap:6px}.stars .star{width:58px;height:58px;fill:#ffffff1f;stroke:#ffffff59;stroke-width:1.5;transform:scale(0);filter:drop-shadow(0 6px 14px rgba(0,0,0,.4))}.stars .star.big{width:78px;height:78px;margin-bottom:14px}.stars .star.on{fill:#ffd166;stroke:#ffb703;animation:star-pop .6s cubic-bezier(.34,1.56,.64,1) both}.stars .star.off{animation:star-pop .4s ease both}@keyframes star-pop{0%{transform:scale(0) rotate(-40deg)}to{transform:scale(1) rotate(0)}}.card-level{font-family:var(--font-display);font-size:22px;letter-spacing:.2em;color:var(--dim)}.card-level b{color:#fff;font-size:28px}.card-coins{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:900;font-size:44px;color:#ffd166}.card-coins svg{width:40px;height:40px;stroke-width:2.4}.card-note{font-size:13px;color:var(--dim);min-height:16px}.card .btn-big{margin-top:8px;font-size:30px;padding:16px}.toast{position:absolute;left:50%;top:calc(96px + var(--safe-t));transform:translate(-50%,-8px);max-width:86vw;padding:10px 18px;border-radius:999px;background:#080c2cd9;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);font-size:14px;font-weight:600;text-align:center;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;z-index:5}.toast.show{opacity:1;transform:translate(-50%)}.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#06091eb3;backdrop-filter:blur(4px);color:var(--dim);font-size:14px;opacity:0;pointer-events:none;transition:opacity .25s;z-index:6}.loading.show{opacity:1;pointer-events:auto}.spinner{width:40px;height:40px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--orange);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(min-aspect-ratio:9/16){:root{--stage: min(100vw, 56.25vh)}.screen,.toast,.drawer,.loading{max-width:var(--stage);left:50%;transform:translate(-50%)}.screen{right:auto;width:100%}.screen.active{transform:translate(-50%)}.drawer{width:min(78vw,340px,calc(var(--stage) * .8));left:calc(50% - var(--stage) / 2);transform:translate(-105%)}.drawer.open{transform:translate(0)}html[dir=rtl] .drawer{left:auto;right:calc(50% - var(--stage) / 2);transform:translate(105%)}html[dir=rtl] .drawer.open{transform:translate(0)}.toast.show{transform:translate(-50%)}.brand-lab{font-size:clamp(48px,calc(var(--stage) * .2),118px)}.btn-big{font-size:clamp(22px,calc(var(--stage) * .07),36px)}}