:root{color:#fff;font-synthesis:none;--navy:#11193e;--navy-2:#20285d;--cyan:#13d9ff;--blue:#1478ff;--yellow:#ffd32a;--orange:#ff8a16;--purple:#8737e8;--lime:#83e90f;--outline:3px solid #060f35f2;background:#080c28;font-family:Arial Rounded MT Bold,Trebuchet MS,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{background:radial-gradient(circle at 18% 22%,#1f50ff59,#0000 28%),radial-gradient(circle at 78% 70%,#9122da52,#0000 34%),#070b25;min-height:100dvh;overflow:hidden}button{font:inherit}.app-shell{place-items:center;width:100vw;height:100dvh;display:grid;position:relative}.game-frame{aspect-ratio:941/1672;isolation:isolate;-webkit-user-select:none;user-select:none;touch-action:none;background:#2ea49c;max-width:100vw;height:100dvh;position:relative;overflow:hidden;box-shadow:0 0 0 1px #5ab4ff2e,0 30px 100px #000000a6}.game-canvas{width:100%;height:100%;display:block}.hud{pointer-events:none;z-index:5;position:absolute;inset:0}.hud button{pointer-events:auto}.hud__topline{top:max(2.1%, env(safe-area-inset-top));filter:drop-shadow(0 4px #050a23b8);grid-template-columns:12% 22% 1fr 25% 20%;align-items:center;gap:1.5%;height:5.2%;display:grid;position:absolute;left:3%;right:3%}.hud__pause{aspect-ratio:1;border:var(--outline);color:#fff;background:linear-gradient(#1d9eff,#1260d9);border-radius:24%;width:100%;font-size:clamp(20px,5vmin,36px);font-weight:900;box-shadow:inset 0 3px #fff6,0 0 0 2px #4db9ff}.hud__pill,.hud__timer{border:var(--outline);white-space:nowrap;text-shadow:0 2px #080d2a;background:linear-gradient(#27366f,#111a43);border-radius:16px;justify-content:center;align-items:center;min-height:62%;font-size:clamp(12px,3vmin,24px);font-weight:1000;display:flex;box-shadow:inset 0 2px #ffffff29,0 0 0 2px #3e86d4}.hud__timer{grid-column:4}.hud__scraps{grid-column:5;gap:.3em}.hud__scraps span{color:#45ffd0;text-shadow:0 0 10px #21ffd0}.hud__level{z-index:2;letter-spacing:.04em;text-shadow:0 3px #1a1955,0 0 8px #1d7aff;background:#171c58;border-radius:999px;padding:0 3%;font-size:clamp(14px,3.4vmin,27px);font-weight:1000;position:absolute;top:6.55%;left:50%;transform:translate(-50%)}.hud__xp{border:var(--outline);background:#0b1335;border-radius:999px;height:2.4%;position:absolute;top:8.75%;left:16%;right:16%;overflow:hidden;box-shadow:0 0 0 3px #2f87e9,inset 0 3px 6px #000000a6}.hud__xp span{border-radius:inherit;background:linear-gradient(#54efff 0 45%,#10c8f4 46% 100%);height:100%;transition:width .22s;display:block;box-shadow:inset 0 2px #ffffff94,0 0 18px #1bdfff}.hero-health{text-align:center;text-shadow:0 2px #080f2d;width:21%;font-size:clamp(10px,2.5vmin,19px);font-weight:1000;position:absolute;top:62.3%;left:50%;transform:translate(-50%)}.hero-health>span{background:#101735;border:2px solid #07102d;border-radius:4px;height:11px;display:block;overflow:hidden}.hero-health i{background:linear-gradient(90deg,#62f02d,#d5ff39);height:100%;display:block}.ultimate{aspect-ratio:1;background:linear-gradient(160deg,#49e9ff,#0989f6);border:5px solid #fff;border-radius:50%;width:23%;padding:4%;position:absolute;bottom:6.5%;right:5.2%;box-shadow:0 0 0 5px #15275e,inset 0 5px #ffffff7a,0 8px #08143eb3,0 0 25px #15dcff8c}.ultimate img{object-fit:cover;mix-blend-mode:screen;border-radius:42%;width:100%;height:100%}.ultimate b{aspect-ratio:1;color:#fff;background:#24217a;border:4px solid #fff;border-radius:35%;place-items:center;min-width:34%;font-size:clamp(15px,4vmin,30px);display:grid;position:absolute;bottom:-6%;right:-5%;box-shadow:0 0 0 3px #1663d5}.ultimate:active{transform:translateY(4px);box-shadow:0 0 0 5px #15275e,inset 0 4px #fff6,0 3px #08143e}.ultimate:disabled{filter:grayscale(.7)brightness(.62)}.touch-layer{z-index:3;touch-action:none;position:absolute;inset:0}.touch-indicator__base,.touch-indicator__knob{pointer-events:none;border-radius:50%;position:fixed;transform:translate(-50%,-50%)}.touch-indicator__base{background:#89daeb14;border:2px solid #ffffff59;width:120px;height:120px}.touch-indicator__knob{background:linear-gradient(160deg,#45e7ff80,#1386ed80);border:3px solid #ffffff8c;width:44px;height:44px}.screen-overlay{z-index:10;text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.start-overlay{background:linear-gradient(#070a2714 8% 38%,#080a27c7 73%,#0d123c 100%);justify-content:flex-end;padding:0 8% 9%}.brand-mark{aspect-ratio:1;color:#fff;text-shadow:0 5px #19356e;background:linear-gradient(145deg,#23ddf5,#7040e8);border:8px solid #ffd62b;border-radius:32% 45%;place-items:center;width:24%;font-size:clamp(45px,14vmin,95px);font-weight:1000;display:grid;position:absolute;top:18%;transform:rotate(-6deg);box-shadow:0 0 0 8px #172354,0 16px 30px #00000061}.start-overlay .eyebrow{color:#57eaff;letter-spacing:.18em;margin:0 0 .4rem;font-size:clamp(11px,2.4vmin,18px);font-weight:1000}.start-overlay h1{text-transform:uppercase;text-shadow:0 5px #17225a,0 0 18px #30a6ffb3;max-width:90%;margin:0;font-size:clamp(36px,9.2vmin,68px);line-height:.92}.start-overlay__copy{color:#d5e6ff;max-width:82%;margin:1rem 0;font-family:system-ui,sans-serif;font-size:clamp(13px,3vmin,21px);font-weight:700}.mission-card{border:var(--outline);background:linear-gradient(135deg,#162862f5,#1e1955f5);border-radius:20px;gap:.15rem;width:78%;margin:.4rem 0 1.2rem;padding:3.4% 6%;display:grid;box-shadow:inset 0 3px #ffffff29,0 7px #050a26b3,0 0 0 3px #3d5ead}.mission-card span{color:#79efff;letter-spacing:.14em;font-size:clamp(10px,2.4vmin,16px)}.mission-card strong{font-size:clamp(20px,5vmin,34px)}.mission-card small{color:#ff9dbd;font-size:clamp(10px,2.4vmin,16px)}.primary-button{color:#111735;text-transform:uppercase;background:linear-gradient(#fff055 0 30%,#ffc928 31% 75%,#ff9d0a 76%);border:4px solid #fff0a8;border-radius:18px;min-width:57%;padding:3.6% 8%;font-size:clamp(19px,5vmin,34px);font-weight:1000;box-shadow:0 0 0 4px #5d3600,inset 0 3px #ffffffb8,0 8px #ad5700,0 14px 26px #0000006b}.primary-button:active{transform:translateY(5px);box-shadow:0 0 0 4px #5d3600,inset 0 3px #fff9,0 3px #ad5700}.control-hint{color:#8ba1d9;letter-spacing:.08em;margin:1.2rem 0 0;font-size:clamp(9px,2vmin,14px)}.perk-overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#040920d1;justify-content:center;padding:8% 5%}.perk-heading{color:#fff;text-shadow:0 3px #15245d;background:linear-gradient(120deg,#125edb,#126eea 40%,#6c36d8);border:4px solid #54dcff;border-radius:18px;width:75%;padding:2.8% 4%;font-size:clamp(25px,7vmin,50px);font-weight:1000;box-shadow:0 0 0 4px #17245a,inset 0 4px #ffffff3d,0 8px #4b228e,0 0 24px #27caff94}.perk-overlay h2{color:#d7faff;text-shadow:0 3px #0b173d;margin:5% 0 6%;font-size:clamp(16px,3.8vmin,28px)}.perk-list{grid-template-columns:repeat(3,1fr);align-items:stretch;gap:2%;width:100%;display:grid}.perk-card{border:4px solid var(--perk);color:#fff;background:#202a57;border-radius:18px;min-width:0;padding:0 4% 8%;overflow:hidden;box-shadow:0 0 0 3px #0b1234,inset 0 3px #ffffff26,0 8px #0a1132}.perk-card strong{background:var(--perk);color:#fff;text-transform:uppercase;text-shadow:0 2px #111a3d;place-items:center;min-height:16%;margin:0 -6% 8%;padding:10% 3%;font-size:clamp(11px,2.9vmin,21px);display:grid}.perk-card img{aspect-ratio:1;object-fit:cover;border:3px solid var(--perk);border-radius:12px;width:100%;box-shadow:0 0 0 3px #0d1435}.perk-card span{place-items:center;min-height:18%;padding-top:12%;font-size:clamp(10px,2.5vmin,18px);line-height:1.05;display:grid}.perk-card:active{transform:translateY(5px);box-shadow:0 0 0 3px #0b1234,inset 0 3px #ffffff26,0 3px #0a1132}.perk-card--orange{--perk:#ff8518}.perk-card--cyan{--perk:#12cbea}.perk-card--lime{--perk:#78d912}.perk-overlay>p{color:#c9eaff;text-shadow:0 2px #071130;margin-top:7%;font-size:clamp(12px,3vmin,22px)}.pause-label{z-index:9;text-align:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;background:#060a228f;place-content:center;gap:.4rem;display:grid;position:absolute;inset:0}.pause-label b{text-shadow:0 5px #182660;font-size:clamp(32px,9vmin,70px)}.pause-label span{color:#bcecff}.result-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#05091fd6;padding:10%}.result-emblem{aspect-ratio:1;color:#ffdc37;text-shadow:0 4px #9e5900;background:linear-gradient(145deg,#4beaff,#176fec);border:7px solid #fff;border-radius:50%;place-items:center;width:31%;font-size:clamp(50px,15vmin,110px);display:grid;box-shadow:0 0 0 7px #14245f,0 0 35px #21cfff}.is-defeat .result-emblem{color:#fff;background:linear-gradient(145deg,#ff5c82,#8c2bc9)}.result-overlay>p{color:#67e7ff;letter-spacing:.15em;margin:8% 0 1%}.result-overlay h2{text-shadow:0 5px #19275f;margin:0;font-size:clamp(30px,8vmin,58px)}.result-stats{border:var(--outline);background:#1c2858;border-radius:18px;grid-template-columns:1fr 1fr;width:72%;margin:8% 0;display:grid;box-shadow:0 0 0 3px #4163af,inset 0 3px #ffffff1f}.result-stats span{color:#a9bce8;padding:9%}.result-stats span+span{border-left:3px solid #0d153d}.result-stats b{color:#fff;font-size:clamp(22px,6vmin,42px);display:block}.desktop-note{display:none}@media (width>=900px){.app-shell{grid-template-columns:auto 320px;gap:56px;padding:28px}.game-frame{border:8px solid #151b4d;border-radius:28px;height:min(94dvh,900px)}.start-overlay h1{font-size:46px}.start-overlay__copy{font-size:16px}.desktop-note{width:280px;display:block}.desktop-note span{color:#58eaff;letter-spacing:.17em;font-size:12px}.desktop-note strong{margin:.5rem 0;font-size:36px;line-height:1;display:block}.desktop-note p{color:#9baed6;font-family:system-ui,sans-serif;line-height:1.55}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.stage-host{position:absolute;inset:0}.stage-host .game-canvas{width:100%;height:100%;display:block}.stage-error{color:#fff;text-align:center;z-index:20;background:#10203d;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:absolute;inset:0}.stage-error button{color:#06231f;cursor:pointer;background:#39a9a0;border:0;border-radius:999px;padding:10px 28px;font-weight:700}
