:root{--background:#04021c;--foreground:#fbf9ed;--primary:#00e4cc;--primary-foreground:#05041b;--secondary:#2b1a4d;--secondary-foreground:#fbf9ed;--muted:#14152f;--muted-foreground:#a7acc8;--border:#ffffff24;--ring:#00e4cc;--radius:1rem;--font-geist-sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-geist-mono:"SFMono-Regular", Consolas, "Liberation Mono", monospace;--font-display:"Arial Rounded MT Bold", "Trebuchet MS", sans-serif}@supports (color:lab(0% 0 0)){:root{--background:lab(1.21346% 4.3807 -13.3755);--foreground:lab(97.7717% -.437319 5.72498);--primary:lab(81.343% -63.5086 -2.78239);--primary-foreground:lab(1.70131% 3.31861 -11.7385);--secondary:lab(13.8959% 18.9625 -29.0497);--secondary-foreground:lab(97.7717% -.437319 5.72498);--muted:lab(7.76572% 6.39837 -17.6244);--muted-foreground:lab(70.6833% 2.61399 -14.7416);--border:lab(100% 0 0/.14);--ring:lab(81.343% -63.5086 -2.78239)}}*{box-sizing:border-box}html{background:#08061b}body{background:var(--background);color:var(--foreground);font-family:var(--font-geist-sans), Arial, sans-serif;margin:0}button{font:inherit}.runner-shell{color:#fff;background:radial-gradient(circle at 15% 4%,#3ee7e02e,#0000 30%),radial-gradient(circle at 90% 12%,#d64fff2e,#0000 34%),#08061b;min-height:100vh;position:relative;overflow:hidden}.runner-container{z-index:1;flex-direction:column;width:100%;max-width:1500px;min-height:100vh;margin:0 auto;padding:20px 24px;display:flex;position:relative}.runner-backdrop{pointer-events:none;opacity:.11;filter:saturate(1.18);background:linear-gradient(#08061b73,#08061beb),url(/dark-banner.png) top/cover no-repeat;position:fixed;inset:0}.runner-header,.runner-help,.game-card,.runner-footer{z-index:1;position:relative}.runner-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:12px;display:flex}.runner-brand{align-items:center;gap:12px;display:flex}.brand-orbit{color:#0b1730;background:linear-gradient(145deg,#7dffe8,#62bbff);border:2px solid #ffffffbf;border-radius:17px;place-items:center;width:48px;height:48px;display:grid;transform:rotate(-7deg);box-shadow:0 0 30px #53e6e147}.brand-orbit svg{width:24px}.runner-brand>div{flex-direction:column;display:flex}.runner-brand small{color:#7effe8;letter-spacing:.25em;font-size:9px;font-weight:1000}.runner-brand strong{font-family:var(--font-display), sans-serif;letter-spacing:.02em;text-transform:uppercase;font-size:clamp(20px,2.5vw,32px);line-height:1}.header-actions{gap:7px;display:flex}.header-button{color:#ffffffd6;cursor:pointer;letter-spacing:.07em;text-transform:uppercase;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff0f;border:1px solid #ffffff21;border-radius:12px;align-items:center;gap:8px;min-height:40px;padding:8px 12px;font-size:10px;font-weight:900;display:flex;box-shadow:0 8px 25px #00000026}.header-button:hover{background:#78ffe81a;border-color:#78ffe88c}.header-button svg{width:17px;height:17px}.runner-help{color:#ffffffad;background:#0b0822bd;border:1px solid #ffffff17;border-radius:13px;justify-content:center;gap:clamp(12px,3vw,34px);margin:-3px 0 10px;padding:8px 12px;font-size:9px;font-weight:800;display:flex}.runner-help span{align-items:center;gap:5px;display:flex}.runner-help kbd{color:#0b0923;background:#dffffa;border:1px solid #ffffff40;border-bottom-width:3px;border-radius:5px;padding:2px 5px;font-size:7px;font-weight:1000}.game-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(155deg,#ffffff1d,#ffffff09);border:1px solid #ffffff2b;border-radius:25px;padding:10px;overflow:hidden;box-shadow:0 30px 90px #0000005e,inset 0 1px #ffffff1f}.game-hud{justify-content:space-between;align-items:center;gap:15px;min-height:52px;padding:1px 4px 8px;display:flex}.hero-chip{--runner:#fff;align-items:center;gap:9px;min-width:142px;display:flex}.hero-chip img{border:3px solid var(--runner);object-fit:cover;object-position:center 42%;width:43px;height:43px;box-shadow:0 0 17px color-mix(in srgb, var(--runner), transparent 52%);border-radius:14px}.hero-chip span{flex-direction:column;display:flex}.hero-chip small{color:#ffffff6e;letter-spacing:.14em;font-size:7px;font-weight:1000}.hero-chip b{font-family:var(--font-display), sans-serif;text-transform:uppercase;font-size:20px;line-height:1.1}.hud-stats{align-items:center;gap:8px;display:flex}.hud-stats>span{background:#06051854;border:1px solid #ffffff17;border-radius:10px;align-items:center;gap:5px;min-height:37px;padding:6px 9px;display:flex}.hud-stats svg{color:#ffe46d;width:14px;height:14px}.hud-stats b{font-size:13px}.hud-stats small{color:#ffffff73;letter-spacing:.06em;font-size:7px;font-weight:900}.hud-stats .hearts{gap:2px}.hud-stats .hearts svg{fill:#0000;color:#ffffff38;width:16px}.hud-stats .hearts svg.full{fill:#ff5d78;color:#ff5d78;filter:drop-shadow(0 0 5px #ff4b6f80)}.hud-stats .score{flex-direction:column;align-items:flex-end;gap:0;min-width:71px}.hud-stats .score b{font-family:var(--font-geist-mono), monospace;font-size:12px}.progress-track{background:#ffffff13;border-radius:999px;height:8px;margin:0 3px 9px;position:relative}.progress-track>div{border-radius:inherit;height:100%;transition:width .14s linear;box-shadow:0 0 12px #66f7de47}.progress-track>span{color:#fff;text-shadow:0 0 9px #7ffff0;font-size:17px;line-height:1;transition:left .14s linear;position:absolute;top:-7px}.canvas-wrap{isolation:isolate;background:#111034;border:1px solid #ffffff2e;border-radius:18px;position:relative;overflow:hidden}.canvas-wrap canvas{aspect-ratio:16/9;touch-action:none;outline:none;width:100%;height:auto;display:block}.canvas-wrap canvas:focus-visible{box-shadow:inset 0 0 0 3px #7ffff0}.game-callout{z-index:10;color:#09101f;text-align:center;background:#e0fff9eb;border:1px solid #ffffff47;border-radius:999px;max-width:80%;padding:8px 15px;font-size:10px;font-weight:1000;animation:.25s both calloutIn;position:absolute;top:15px;left:50%;transform:translate(-50%);box-shadow:0 8px 26px #0000003b}.game-overlay{z-index:20;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#06041875;place-items:center;padding:18px;display:grid;position:absolute;inset:0}.ready-overlay{align-items:center}.ready-card{text-align:center;background:linear-gradient(150deg,#140f3ceb,#09081fe0);border:1px solid #ffffff2e;border-radius:25px;width:min(94%,940px);padding:clamp(14px,2.2vw,26px);box-shadow:0 28px 80px #00000073}.ready-card>p,.result-card>p{color:#82ffe9;letter-spacing:.22em;margin:0 0 2px;font-size:9px;font-weight:1000}.ready-card h1{font-family:var(--font-display), sans-serif;text-shadow:0 5px #00000057;text-transform:uppercase;margin:0 0 14px;font-size:clamp(34px,5vw,62px);line-height:.95}.runner-picker{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}.runner-picker button{--runner:#fff;color:#fff;cursor:pointer;text-align:left;background:#ffffff0b;border:1px solid #ffffff1f;border-radius:15px;min-width:0;padding:5px;transition:all .18s;overflow:hidden}.runner-picker button:hover{border-color:var(--runner);transform:translateY(-3px)}.runner-picker button.active{border:2px solid var(--runner);background:color-mix(in srgb, var(--runner), transparent 80%);box-shadow:0 0 24px color-mix(in srgb, var(--runner), transparent 60%);padding:4px;transform:translateY(-4px)}.runner-picker img{object-fit:cover;object-position:center 42%;border-radius:10px;width:100%;height:clamp(70px,9vw,118px)}.runner-picker span{flex-direction:column;padding:6px 5px 4px;display:flex}.runner-picker b{font-family:var(--font-display),sans-serif;text-overflow:ellipsis;text-transform:uppercase;font-size:clamp(12px,1.6vw,19px);line-height:1.1;overflow:hidden}.runner-picker small{color:#ffffff78;text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:7px;font-weight:800;overflow:hidden}.selected-ability{color:#ffffffbf;justify-content:center;align-items:center;gap:9px;margin:13px auto 10px;display:flex}.selected-ability svg{color:#ffe66d;width:19px}.selected-ability span{text-align:left;flex-direction:column;align-items:flex-start;display:flex}.selected-ability b{color:#fff;text-transform:uppercase;font-size:10px}.selected-ability small{font-size:8px}.start-button{color:#0a1126;cursor:pointer;text-transform:uppercase;background:linear-gradient(135deg,#78ffe7,#58bdff);border:0;border-radius:13px;justify-content:center;align-items:center;gap:8px;min-width:190px;height:43px;padding:0 18px;font-weight:1000;display:inline-flex;box-shadow:0 12px 30px #54dce538}.start-button svg,.change-button svg{width:17px;height:17px}.start-button:hover{filter:brightness(1.1);transform:translateY(-1px)}.compact-overlay{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#050414b0}.result-card{text-align:center;background:linear-gradient(145deg,#20184d,#0e0b29);border:1px solid #ffffff2e;border-radius:26px;width:min(92%,520px);padding:25px;animation:.35s cubic-bezier(.2,.85,.25,1.2) both resultIn;box-shadow:0 28px 80px #00000080}.result-card>svg{color:#ffe66d;width:43px;height:43px;margin:0 auto 7px}.result-card.lost>svg{color:#ff6480;fill:#ff6480}.result-card h2{font-family:var(--font-display),sans-serif;text-transform:uppercase;margin:5px 0 16px;font-size:clamp(26px,4vw,44px);line-height:1}.result-stats{grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:15px;display:grid}.result-stats span{color:#ffffff73;text-transform:uppercase;border:1px solid #ffffff17;border-radius:11px;flex-direction:column;padding:9px 5px;font-size:7px;font-weight:900;display:flex}.result-stats b{color:#fff;font-size:14px}.result-actions{justify-content:center;gap:8px;display:flex}.change-button{color:#fff;cursor:pointer;text-transform:uppercase;background:#ffffff0f;border:1px solid #ffffff3b;border-radius:13px;justify-content:center;align-items:center;gap:8px;min-width:150px;height:43px;padding:0 18px;font-weight:900;display:inline-flex}.touch-controls{z-index:12;pointer-events:none;justify-content:space-between;align-items:flex-end;display:flex;position:absolute;bottom:14px;left:14px;right:14px}.touch-group{pointer-events:auto;gap:8px;display:flex}.touch-group button{color:#fff;cursor:pointer;touch-action:none;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:#09071fab;border:2px solid #ffffff73;border-radius:18px;place-items:center;width:clamp(48px,6vw,64px);height:clamp(48px,6vw,64px);display:grid;box-shadow:0 8px 25px #00000047}.touch-group button:active{background:#66eedb61;transform:translateY(2px)scale(.96)}.touch-group svg{width:22px}.action-touch button{flex-direction:column;gap:0;display:flex}.action-touch small{font-size:6px;font-weight:1000}.action-touch button.ready:last-child{border-color:#ffe66d;animation:.7s infinite alternate dashReady;box-shadow:0 0 22px #ffe66d57}.runner-footer{color:#ffffff70;justify-content:space-between;align-items:center;gap:15px;min-height:38px;padding:8px 3px 0;font-size:8px;font-weight:800;display:flex}.runner-footer span{color:#7effe8;letter-spacing:.18em;font-weight:1000}.runner-footer p{margin:0}@keyframes calloutIn{0%{opacity:0;transform:translate(-50%,-10px)scale(.88)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes resultIn{0%{opacity:0;transform:translateY(22px)scale(.88)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes dashReady{0%{filter:brightness(.95)}to{filter:brightness(1.35)}}@media (hover:hover) and (pointer:fine) and (min-width:900px){.touch-controls{opacity:.28;transition:opacity .2s}.canvas-wrap:hover .touch-controls{opacity:.85}}@media (max-width:760px){.runner-container{padding:12px 10px}.runner-header{margin-bottom:8px}.brand-orbit{border-radius:14px;width:41px;height:41px}.runner-brand small{font-size:7px}.runner-brand strong{font-size:18px}.header-button{min-height:37px;padding:7px 9px}.header-button span{display:none}.runner-help{flex-wrap:wrap;gap:6px 12px}.game-card{border-radius:18px;padding:7px}.game-hud{gap:6px;min-height:47px;padding-bottom:6px}.hero-chip{min-width:82px}.hero-chip img{border-radius:11px;width:36px;height:36px}.hero-chip small{display:none}.hero-chip b{font-size:14px}.hud-stats{gap:3px}.hud-stats>span{min-height:33px;padding:5px}.hud-stats small,.hud-stats .score{display:none}.hud-stats .hearts svg{width:13px}.canvas-wrap{border-radius:13px}.canvas-wrap canvas{object-fit:cover;object-position:left center;min-height:420px}.ready-overlay{align-items:stretch;padding:9px;overflow-y:auto}.ready-card{border-radius:18px;width:100%;margin:auto;padding:12px}.ready-card h1{margin-bottom:10px;font-size:31px}.runner-picker{grid-template-columns:repeat(3,1fr);gap:6px}.runner-picker img{height:72px}.runner-picker b{font-size:12px}.runner-picker small{display:none}.selected-ability{margin:9px auto 7px}.selected-ability small{max-width:230px}.start-button{min-width:160px;height:40px}.touch-controls{bottom:8px;left:8px;right:8px}.touch-group button{border-radius:15px;width:50px;height:50px}.runner-footer{justify-content:center}.runner-footer p{display:none}}@media (max-width:390px){.canvas-wrap canvas{min-height:392px}.runner-picker img{height:60px}.selected-ability small{display:none}.result-stats{grid-template-columns:repeat(2,1fr)}.result-actions{flex-direction:column}.result-actions button{width:100%}}