:root{color-scheme:dark;--bg:#090d25;--panel:#171c3e;--muted:#b6beda;--blue:#6a94ff;--violet:#ad83ff;--green:#6ce1b5;--red:#ffad88}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f8f9ff;font:16px/1.5 system-ui,sans-serif;overflow-x:hidden}.aurora{position:fixed;inset:-20%;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 25% 30%,#284ba54d,transparent 45%),radial-gradient(ellipse at 80% 70%,#6e32a847,transparent 40%);animation:glow 14s ease-in-out infinite alternate}button,input,a{font:inherit}button,a.button{border:0;border-radius:14px;padding:13px 20px;color:#fff;background:linear-gradient(120deg,#4677ec,#8751dc);font-weight:750;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:hover,a.button:hover{filter:brightness(1.15)}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ade4ff;outline-offset:4px}.secondary{background:#293053!important}.danger{background:#5b3146!important;color:#ffd4d1}input{width:100%;background:#0c1230;border:1px solid #57618c;border-radius:12px;padding:14px;color:#fff;font-size:1.15rem;margin:7px 0 18px}input.code{text-transform:uppercase;letter-spacing:.2em;font-weight:800}label{font-weight:650}h1,h2,h3,p{margin:0 0 16px}h1{font-size:clamp(2.4rem,5vw,4.8rem);line-height:1.04;letter-spacing:-.045em}h2{font-size:clamp(1.55rem,3vw,2.6rem);line-height:1.15;letter-spacing:-.025em}.gradient{background:linear-gradient(100deg,#a6c6ff,#bd8fff);color:transparent;background-clip:text}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:#b8a8ff;font-weight:800;margin-bottom:14px}.muted{color:var(--muted)}.small{font-size:.85rem}.shell{max-width:1240px;margin:auto;padding:36px}.phone{max-width:520px;margin:auto;padding:28px 22px}.panel{background:linear-gradient(150deg,#20264be8,#141a39ee);border:1px solid #57659055;border-radius:24px;padding:28px;box-shadow:0 18px 65px #0003}.stack{display:grid;gap:18px}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.full{width:100%}.hero{display:flex;align-items:center;gap:24px;margin-bottom:30px}.hero>svg{width:120px;height:120px;flex-shrink:0;transform:rotate(7deg);animation:bob 3s ease-in-out infinite}.pill{display:inline-flex;background:#7892ff1f;border:1px solid #9baaf04d;border-radius:99px;padding:5px 12px;font-weight:700;font-size:.85rem}.avatars{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:10px 0 24px}.avatars button{padding:4px;background:#ffffff07;border:2px solid transparent}.avatars button.selected{border-color:#c0afff;background:#9482ff22}.avatar{width:65px;height:70px;overflow:visible}.avatar .leg1,.avatar .leg2{transform-origin:40px 62px}.running .leg1{animation:leg .3s infinite alternate}.running .leg2{animation:leg .3s infinite alternate-reverse}.running .torso{animation:hop .3s infinite alternate}.waiting-art{display:flex;justify-content:center;margin:24px}.waiting-art svg{width:130px;height:140px;animation:bob 2s infinite alternate}.question{margin-top:30px}.choices{display:grid;gap:12px;margin:28px 0}.choice{text-align:left;justify-content:flex-start;background:#242d54;border:2px solid #65729b55;min-height:70px;font-weight:650}.choice.good{border-color:var(--green);background:#23594d}.choice.bad{border-color:var(--red);background:#63413b}.progress{height:8px;border-radius:20px;background:#ffffff14;overflow:hidden;margin:18px 0}.progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--violet));transition:width .55s}.countdown{font-size:6rem;font-weight:900;line-height:1.2;color:#bcadff}.status{min-height:28px;color:var(--muted)}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);max-width:90%;background:#f2eaff;color:#231943;padding:12px 20px;border-radius:12px;box-shadow:0 5px 25px #0007;z-index:20;display:none}.admin-grid{display:grid;grid-template-columns:1.1fr 1.9fr;gap:22px}.big-code{font-size:clamp(2rem,4vw,3.5rem);letter-spacing:.13em;font-weight:900;font-variant-numeric:tabular-nums;margin-bottom:12px}.qr{background:#fff;border-radius:15px;padding:10px;width:150px;height:150px}.qr svg{display:block;width:100%;height:100%}.join-url{overflow-wrap:anywhere;color:#c9c5ff;font-size:.85rem}.player-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #ffffff15}.player-row svg{width:42px;height:44px}.player-row .name{flex:1;min-width:0;overflow-wrap:anywhere}.player-row button{font-size:.8rem;padding:8px 12px}.rank{font-size:1.2rem;font-weight:850;min-width:30px;color:#bda7ff}.pending{color:#ffc999}.race-shell{padding:24px 36px;max-width:1800px;margin:auto}.race-header{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:20px}.race-header h1{font-size:clamp(2rem,3.2vw,3.6rem)}.race-header .big-code{font-size:1.8rem;margin:0}.race-header .qr{width:102px;height:102px}.race-header .join-url{max-width:220px;font-size:.7rem}.board{display:grid;gap:10px 24px}.board.columns2{grid-template-columns:1fr 1fr}.board.columns3{grid-template-columns:repeat(3,1fr)}.lane{display:grid;grid-template-columns:100px 1fr 48px;align-items:center;gap:10px;min-height:55px}.lane-name{font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lane-name b{color:#c8b7ff;margin-right:7px}.track{height:48px;border-bottom:1px solid #a1b7ff22;position:relative;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(5% - 1px),#6f8dde16 calc(5% - 1px),#6f8dde16 5%)}.track:before,.track:after{content:'';position:absolute;top:0;height:100%;width:3px;background:#adc4ff66}.track:before{left:0}.track:after{right:0;background:repeating-linear-gradient(0deg,#fff 0 6px,#34365a 6px 12px)}.runner{position:absolute;bottom:0;left:0;transform:translateX(-50%);transition:left .9s cubic-bezier(.2,.65,.3,1);z-index:2}.runner svg{height:51px;width:49px}.lane-score{font-variant-numeric:tabular-nums;font-size:.85rem;text-align:right;color:#bfb8dd}.leader-strip{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:20px}.leader-strip>div{padding:9px 16px;border-radius:14px;background:#9983ff17;border:1px solid #b6a7ff33}.overlay{position:fixed;inset:0;background:#080c25c9;backdrop-filter:blur(8px);display:grid;place-content:center;text-align:center;z-index:10}.overlay h2{font-size:3rem}.empty{padding:45px 12px;text-align:center}.winner{border-color:#c6abff;box-shadow:0 0 40px #aa82ff25}dialog{background:#1b2142;color:white;border:1px solid #8276b3;border-radius:24px;max-width:460px;padding:28px}dialog::backdrop{background:#000a}a{color:#c9bcff}.intro-rule{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0 24px}.intro-rule>div{padding:12px;background:#ffffff06;border-radius:12px;font-size:.85rem}.intro-rule b{display:block;font-size:1.35rem;color:#c1b2ff}.room-link{display:block;padding:14px;border-radius:12px;background:#ffffff08;text-decoration:none}.badge{font-weight:800;color:#c4b6ff}.hidden{display:none!important}@keyframes glow{to{transform:translate(4%,-4%) rotate(9deg)}}@keyframes bob{50%{transform:translateY(-8px) rotate(-4deg)}}@keyframes leg{to{transform:rotate(24deg)}}@keyframes hop{to{transform:translateY(-2px)}}@media(max-width:760px){.shell{padding:22px 16px}.panel{padding:20px}.admin-grid{grid-template-columns:1fr}.hero>svg{width:78px}.race-shell{padding:20px}.race-header{align-items:flex-start;flex-wrap:wrap}.board.columns2,.board.columns3{grid-template-columns:1fr}.lane{grid-template-columns:80px 1fr 42px}.race-header h1{font-size:2rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(min-width:761px){.board{gap:4px 24px}.lane{height:clamp(20px,calc((100dvh - 240px)/var(--rows,10) - 4px),65px);min-height:0}.track{height:100%;margin-inline:22px}.runner svg{height:clamp(20px,calc((100dvh - 240px)/var(--rows,10) - 4px),60px);width:auto}.lane-score,.lane-name{line-height:1.1}}
:root{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{min-width:0}#app{min-width:0}.phone{width:min(100%,560px);max-width:560px;min-width:0;padding:clamp(16px,4vw,28px);padding-bottom:max(26px,env(safe-area-inset-bottom));margin-inline:auto}.phone>*{max-width:100%}.phone .hero{gap:10px}.phone .hero h1{font-size:clamp(2.35rem,9vw,4rem);overflow-wrap:anywhere}.phone .panel{min-width:0}.phone .avatars{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.phone .avatars button{width:100%;min-width:0;aspect-ratio:1;max-height:78px;padding:3px;border-radius:12px}.phone .avatars svg{display:block;width:100%;max-width:65px;height:100%;margin:auto}.phone .question h2{overflow-wrap:anywhere}.phone .choices{margin:22px 0 12px}.phone .choice{min-height:64px;height:auto;padding:14px 18px;line-height:1.35;overflow-wrap:anywhere}.phone .status{margin:12px 0 2px}.phone .player-row{min-width:0}.phone .name{overflow-wrap:anywhere}.phone .grade-label{font-size:clamp(1.25rem,6vw,1.8rem);color:#e6e8ff}.phone .grade-label strong{font-size:clamp(2.5rem,11vw,4rem);display:block;line-height:1.15;color:#c8b9ff;font-variant-numeric:tabular-nums}.intro-rule{grid-template-columns:repeat(2,minmax(0,1fr))}.intro-rule>div{min-width:0}.row>*{min-width:0}#toast{bottom:max(18px,env(safe-area-inset-bottom));overflow-wrap:anywhere}.admin-grid,.race-shell{min-width:0}.join-url{word-break:break-all}@media(max-width:420px){.phone .panel{padding:18px}.phone h1{line-height:1.05}.phone .hero{margin-bottom:18px}.phone .question{margin-top:20px}.phone h2{font-size:clamp(1.45rem,7vw,1.9rem)}.phone .waiting-art svg{width:100px;height:110px}.phone .choices{gap:10px}.phone .choice{min-height:58px}.intro-rule{gap:6px;margin:14px 0 18px}.intro-rule>div{padding:10px;font-size:.78rem}.intro-rule b{font-size:1.15rem}}@media(max-width:340px){.phone{padding-inline:13px}.phone .panel{padding:15px}.phone .avatars{gap:5px}.phone .hero h1{font-size:2.25rem}.big-code{letter-spacing:.08em}}@media(max-height:620px) and (orientation:landscape){.phone{padding-block:14px}.phone .hero{margin-bottom:12px}.phone .hero h1{font-size:2rem}.phone .choices{margin:14px 0}.phone .choice{min-height:50px}.phone .question{margin-top:16px}}@media(max-width:760px){.race-header .row{flex-wrap:wrap}.race-header .qr{width:82px;height:82px}.admin-grid .row button{flex:1}.admin-grid .player-row button{flex:0 0 auto}}
@media(max-height:650px) and (orientation:portrait){.phone{padding-block:10px 16px}.phone .hero{margin-bottom:10px}.phone .hero h1{font-size:clamp(1.9rem,9vw,2.4rem);margin-bottom:6px}.phone .eyebrow{margin-bottom:5px}.phone .intro-rule{margin:8px 0 10px}.phone .intro-rule>div{padding:7px 9px;line-height:1.25}.phone .panel{padding:13px}.phone input{padding:8px 10px;min-height:44px;margin:3px 0 9px}.phone .avatars{margin:5px 0 12px}.phone .avatars button{max-height:46px}.phone .panel label{font-size:.9rem}.phone .panel>p.small{margin-top:8px!important;font-size:.72rem}.phone .question{margin-top:13px}.phone .choices{margin:14px 0 8px}.phone .choice{min-height:50px;padding:10px 14px}}
.race-shell{height:100dvh;display:flex;flex-direction:column;overflow:hidden}.race-shell .race-header,.race-shell .leader-strip{flex-shrink:0}.race-shell .board{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;align-content:start;grid-auto-rows:56px;scrollbar-width:none}.race-shell .board::-webkit-scrollbar{display:none}.race-shell .lane{height:56px;min-height:56px}.race-shell .track{height:48px}.race-shell .runner svg{height:51px}.race-shell #empty:empty{display:none}