html{height:100%}body{color:#18305f;touch-action:none;background:#a9e7ff;width:100%;height:100%;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}#app{width:100%;height:100dvh;position:fixed;inset:0;overflow:hidden}#game-canvas{outline:none;width:100%;height:100%;display:block;position:absolute;inset:0}#hud,#overlay{pointer-events:none;position:fixed;inset:0}.hud-row{padding:max(14px, env(safe-area-inset-top)) 8px 0;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(6px,1.4vw,12px);display:flex}.hud-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;background:linear-gradient(#ffffffe6,#e8f9ffb8);border:2px solid #ffffffd1;border-radius:18px;min-width:58px;padding:8px 7px;transition:border-color .18s,box-shadow .18s,transform .18s;box-shadow:0 10px 24px #4878be3d,inset 0 -5px #3bb6ff1f}.hud-card-max{border-color:#ffd94a;box-shadow:0 0 0 2px #ffffffe0,0 0 18px #ffd94adb,0 12px 28px #d6971657,inset 0 -5px #ffbe2d33}.hud-card-max .hud-label,.hud-card-max strong{color:#9a5c00}.hud-card-max-pop{animation:.68s cubic-bezier(.2,1.5,.36,1) hud-max-pop}.hud-label{color:#3975c9;letter-spacing:.06em;text-transform:uppercase;margin-bottom:2px;font-size:.62rem;font-weight:900;display:block}.hud-card strong{color:#18305f;text-shadow:0 2px #ffffffd9;font-size:clamp(.95rem,2.6vw,1.25rem);line-height:1}@keyframes hud-max-pop{0%{transform:scale(1)}38%{transform:scale(1.16)}58%{transform:scale(.96)}to{transform:scale(1)}}#hud-message{left:50%;bottom:max(22px, env(safe-area-inset-bottom));color:#26366f;text-align:center;text-shadow:0 1px #fffffff2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(#ffffffe0,#fff2b2d1);border:2px solid #ffffffe6;border-radius:999px;min-width:min(420px,100vw - 32px);padding:11px 20px;font-weight:800;position:absolute;transform:translate(-50%);box-shadow:0 10px 26px #4878be40}#level-up{pointer-events:none;opacity:0;visibility:hidden;z-index:5;place-items:center;display:grid;position:fixed;inset:0}#level-up.is-active{visibility:visible;animation:1.7s ease-out forwards level-up-stage}.level-up-rays{opacity:0;will-change:transform, opacity;background:linear-gradient(90deg,#0000 47%,#fff278d1 50%,#0000 53%),linear-gradient(#0000 47%,#65e8ffb8 50%,#0000 53%),linear-gradient(45deg,#0000 47%,#ff69b29e 50%,#0000 53%),linear-gradient(-45deg,#0000 47%,#ffbe40b8 50%,#0000 53%);border-radius:50%;width:min(82vw,460px);height:min(82vw,460px);position:absolute}#level-up.is-active .level-up-rays{animation:1.7s ease-out forwards level-up-rays}.level-up-burst{opacity:0;will-change:transform, opacity;border:4px solid #fff096e6;border-radius:50%;width:26vmin;height:26vmin;position:absolute;box-shadow:0 0 28px 8px #ffd65c7a,inset 0 0 24px #fff0aa70}#level-up.is-active .level-up-burst{animation:.9s cubic-bezier(.18,.78,.32,1) forwards level-up-burst}.level-up-card{box-shadow:none;opacity:0;will-change:transform, opacity;background:0 0;border:none;border-radius:0;flex-direction:column;align-items:center;gap:6px;padding:clamp(16px,4vw,30px) clamp(28px,7vw,64px);display:flex;position:relative;transform:scale(.4)}#level-up.is-active .level-up-card{animation:1.7s cubic-bezier(.2,1.5,.4,1) forwards level-up-card}.level-up-eyebrow{color:#ff6fb1;letter-spacing:.22em;text-transform:uppercase;font-size:clamp(.72rem,2.4vw,.92rem);font-weight:900}.level-up-title{background:linear-gradient(135deg,#ffb02e,#ff5da2 55%,#8a5bff);-webkit-text-fill-color:transparent;color:#ff7a2e;letter-spacing:.02em;filter:drop-shadow(0 4px #ffffffe6);-webkit-background-clip:text;background-clip:text;font-size:clamp(2.2rem,9vw,4.6rem);font-weight:950;line-height:.92}.level-up-subtitle{color:#2456c8;text-shadow:0 2px #ffffffeb;font-size:clamp(1.1rem,4vw,1.7rem);font-weight:900}@keyframes level-up-stage{0%{opacity:1}78%{opacity:1}to{opacity:0;visibility:hidden}}@keyframes level-up-rays{0%{opacity:0;transform:rotate(0)scale(.6)}22%{opacity:.5}to{opacity:0;transform:rotate(95deg)scale(1.08)}}@keyframes level-up-burst{0%{opacity:.95;transform:scale(.2)}to{opacity:0;transform:scale(3.4)}}@keyframes level-up-card{0%{opacity:0;transform:scale(.4)translateY(18px)}16%{opacity:1;transform:scale(1.08)translateY(0)}26%{transform:scale(.98)}34%{transform:scale(1)}72%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.92)translateY(-10px)}}@media (prefers-reduced-motion:reduce){#level-up.is-active,#level-up.is-active .level-up-rays,#level-up.is-active .level-up-burst,#level-up.is-active .level-up-card{animation-duration:1.2s;animation-timing-function:ease}}#overlay{z-index:6;pointer-events:auto;background:radial-gradient(circle at 50% 35%,#fff2806b,#0000 30%),linear-gradient(#a4e7ff9e,#ffcce5b8);place-items:center;padding:20px;transition:opacity .18s,visibility .18s;display:grid}#overlay.hidden{visibility:hidden;opacity:0;pointer-events:none}.panel{text-align:center;background:linear-gradient(160deg,#fffffff0,#e5f7ffe0);border:3px solid #ffffffeb;border-radius:32px;width:min(520px,100vw - 32px);padding:clamp(24px,5vw,46px);box-shadow:0 24px 60px #4a78be47,inset 0 -8px #ff9ccd24}.eyebrow{color:#ff6fb1;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px;font-size:.78rem;font-weight:900}h1{color:#2456c8;text-shadow:0 4px #fffffff2;margin:0;font-size:clamp(2.4rem,9vw,5rem);line-height:.9}#overlay-copy{color:#4a5d8d;max-width:38ch;margin:18px auto 12px;font-size:clamp(1rem,2.4vw,1.15rem);font-weight:650;line-height:1.55}.career-stats{text-align:center;margin:8px 0 16px}.career-stats.hidden{display:none}.career-stats-heading{color:#2456c8;margin:0 0 8px;font-size:clamp(1.1rem,3.2vw,1.35rem);font-weight:900;line-height:1.2}.career-summary{color:#5f73a8;max-width:44ch;margin:0 auto 14px;font-size:.88rem;font-weight:700;line-height:1.4}.career-section-label{color:#ff6fb1;letter-spacing:.12em;text-transform:uppercase;margin:0 0 8px;font-size:.72rem;font-weight:900}.career-stats .run-stats-grid{margin-bottom:12px}.overlay-history{color:#5f73a8;max-width:42ch;margin:0 auto 24px;font-size:.82rem;font-weight:700;line-height:1.45}.overlay-history.hidden{display:none}.run-results{margin-bottom:24px}.run-results.hidden{display:none}.run-result-headline{color:#2456c8;margin:0 0 18px;font-size:clamp(1.35rem,4vw,1.85rem);font-weight:900;line-height:1.15}.run-stats-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,14px);margin-bottom:16px;display:grid}.run-stat-card{background:linear-gradient(#fffffff2,#e8f9ffc7);border:2px solid #ffffffe6;border-radius:20px;padding:14px 10px;box-shadow:0 10px 22px #4878be2e,inset 0 -4px #3bb6ff1a}.run-stat-card-exp{background:linear-gradient(#fffffff2,#e8fff0d1)}.run-stat-card-score{background:linear-gradient(#fffffff2,#fff6d6d1)}.run-stat-label{color:#3975c9;letter-spacing:.1em;text-transform:uppercase;margin-bottom:6px;font-size:.68rem;font-weight:900;display:block}.run-stat-card strong{color:#18305f;text-shadow:0 2px #ffffffe6;font-size:clamp(1.45rem,4.5vw,2rem);line-height:1;display:block}button{color:#26305f;cursor:pointer;letter-spacing:.03em;text-transform:uppercase;background:linear-gradient(135deg,#fff477,#ffba3d 42%,#ff65ad);border:0;border-radius:999px;min-width:172px;min-height:52px;font-weight:950;box-shadow:0 14px 28px #ff855657,inset 0 -5px #b0445e2e}button:focus-visible{outline-offset:4px;outline:3px solid #2456c8}@media (width<=620px){.hud-card{min-width:52px;padding:6px 5px}.run-stats-grid{grid-template-columns:1fr}.run-stat-card{text-align:left;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.run-stat-label{margin-bottom:0}}.screen-nav{pointer-events:auto;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px;display:flex}.screen-nav button{pointer-events:auto;color:#18305f;cursor:pointer;background:#ffffffd9;border:2px solid #ffffffb3;border-radius:14px;padding:8px 14px;font-size:.85rem;font-weight:700}.screen-nav button.active{background:linear-gradient(#6ee8ff,#3bb8ff);border-color:#fff}.hub-gold{color:#9a5c00;font-weight:700}.shop-grid,.level-grid{pointer-events:auto;gap:10px;margin-top:12px;display:grid}.shop-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.level-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.shop-item,.level-btn{pointer-events:auto;cursor:pointer;background:#ffffffe6;border:2px solid #ffffffb3;border-radius:14px;padding:12px;font-weight:600}.level-btn.locked{opacity:.5;cursor:not-allowed}@media (width<=420px){.screen-nav button{padding:6px 10px;font-size:.75rem}}
