/* Nihongo/Hanguk Race: netral, ringkas, dan fokus pada soal. */
.race-logo{font-size:clamp(3rem,8vw,5rem);filter:drop-shadow(0 8px 16px rgba(0,0,0,.12))}
.race-callout{display:flex;align-items:center;gap:16px;margin:0 0 20px;padding:17px 20px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(110deg,var(--surface),var(--primary-soft));box-shadow:var(--shadow);text-decoration:none}
.race-callout-icon{font-size:2.2rem}.race-callout span:nth-child(2){display:grid;flex:1}.race-callout small,.race-callout em{color:var(--muted);font-style:normal}.race-callout b{font-size:1.2rem}.race-callout strong{color:var(--primary)}
.race-entry,.race-lobby{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:20px}.race-entry .panel,.race-lobby .panel{padding:22px}.race-entry h2{margin-bottom:18px}.race-entry .btn{width:100%;margin-top:18px}
.avatar-pick{display:flex;gap:8px;flex-wrap:wrap}.avatar-pick input{position:absolute;opacity:0}.avatar-pick span{display:grid;place-items:center;width:48px;height:48px;border:2px solid var(--line);border-radius:50%;background:var(--surface-2);font-size:1.6rem;cursor:pointer}.avatar-pick input:checked+span{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.race-code-input{text-transform:uppercase;letter-spacing:.25em;font-size:1.3rem;font-weight:800}.race-room-head{align-items:center}.race-room-code{display:grid;text-align:center;padding:12px 22px;border:1px dashed var(--primary);border-radius:14px;background:var(--primary-soft)}.race-room-code small{color:var(--muted)}.race-room-code b{font-size:1.7rem;letter-spacing:.16em}
.lobby-list{display:grid;gap:8px}.lobby-list>div{display:flex;align-items:center;gap:10px;padding:11px;border-bottom:1px solid var(--line)}.lobby-list b{flex:1}.lobby-list em{font-style:normal;color:var(--muted)}.lobby-list em.ready{color:var(--ok);font-weight:800}.race-avatar{font-size:1.7rem}.race-invite code{display:block;overflow-wrap:anywhere;padding:10px;margin:10px 0;background:var(--surface-2);border-radius:10px}.race-invite dl>div{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:8px 0}.race-invite dt{color:var(--muted)}.race-invite dd{margin:0;font-weight:700}.race-actions{display:flex;justify-content:space-between;gap:12px}
.race-countdown{min-height:60vh;display:grid;place-content:center;text-align:center}.race-countdown small{font-size:1.4rem;color:var(--muted)}.race-countdown b{font-size:clamp(7rem,28vw,14rem);line-height:1;color:var(--primary)}
.race-winner-live{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:var(--gold-soft);color:var(--gold);font-weight:800;text-align:center}
.race-play-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding:10px 14px;border-radius:12px;background:var(--nav);color:#fff}.race-play-head span{font-size:1.15rem;font-weight:800}.race-play{display:grid;grid-template-columns:minmax(0,3fr) minmax(270px,1fr);grid-template-areas:'question progress';gap:16px;align-items:start}.race-progress{grid-area:progress;padding:16px}.race-question{grid-area:question;padding:clamp(18px,4vw,34px);text-align:center}.race-progress .panel-head{margin-bottom:8px}.race-progress .panel-head h2{font-size:1.05rem}.race-progress .panel-head>b{font-size:.8rem;color:var(--muted)}
.race-list{display:grid;gap:8px}.race-runner{display:grid;grid-template-columns:34px 38px minmax(70px,1fr) auto;grid-template-areas:'rank avatar name score' '. track track track';align-items:center;gap:3px 7px;padding:8px;border-radius:12px}.race-runner.you{background:var(--primary-soft)}.race-rank{grid-area:rank}.race-avatar{grid-area:avatar}.race-name{grid-area:name;display:grid;min-width:0}.race-name>b{overflow:hidden;text-overflow:ellipsis}.race-name small{color:var(--primary)}.race-score{grid-area:score}.race-track{grid-area:track;position:relative;height:8px;margin:8px 25px 4px 0;border-radius:10px;background:var(--line)}.race-track>i{display:block;height:100%;border-radius:inherit;background:var(--primary);transition:width .3s ease}.race-track>em{position:absolute;top:50%;transform:translate(-50%,-50%);font-style:normal;font-size:1.25rem;transition:left .3s ease}.race-track>strong{position:absolute;right:-28px;top:50%;transform:translateY(-50%)}.race-you{display:none;text-align:center;color:var(--muted)}.race-you b{color:var(--primary)}.race-expand{display:none;width:100%;margin-top:8px;padding:8px;border:0;background:transparent;color:var(--primary);font-weight:800;cursor:pointer}
.race-question h2{margin:8px 0}.race-prompt{display:grid;place-items:center;min-height:190px;font-size:clamp(5rem,17vw,10rem);font-weight:700;line-height:1}.race-prompt.latin{font-size:clamp(3rem,10vw,6rem)}.race-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}.race-choices button{display:flex;align-items:center;gap:16px;min-height:76px;padding:12px 18px;border:2px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer;text-align:left}.race-choices button:hover{border-color:var(--primary);background:var(--primary-soft)}.race-choices button>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--primary-soft);color:var(--primary);font-weight:800}.race-choices button>b{font-size:1.35rem}.race-remain{margin:18px 0 0;color:var(--muted)}.race-remain b{color:var(--primary)}.race-feedback{margin-bottom:12px;padding:10px;border-radius:10px;font-weight:700}.race-feedback.ok{background:var(--ok-soft);color:var(--ok)}.race-feedback.bad{background:var(--no-soft);color:var(--no)}.race-finished-you{padding:80px 10px;font-size:3rem}.race-finished-you h2{font-size:1.6rem}.race-finished-you p{font-size:1rem;color:var(--muted)}
.race-podium{display:flex;align-items:end;justify-content:center;gap:12px;margin:28px 0}.race-podium>div{display:grid;place-items:center;min-width:150px;padding:20px 12px;border:1px solid var(--line);border-radius:16px 16px 6px 6px;background:var(--surface);box-shadow:var(--shadow)}.race-podium .p1{order:2;padding-top:34px}.race-podium .p2{order:1}.race-podium .p3{order:3}.race-podium span{font-size:2.4rem}.race-podium em{font-size:1.4rem;color:var(--primary);font-weight:900}.race-podium small{color:var(--muted)}.race-results{padding:20px}.race-results>div{display:grid;grid-template-columns:45px 1fr auto;gap:8px;padding:12px;border-top:1px solid var(--line)}.race-results em{font-style:normal;color:var(--muted)}.race-result-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:16px}
@media(max-width:760px){.race-entry,.race-lobby{grid-template-columns:1fr}.race-play{display:flex;flex-direction:column}.race-progress,.race-question{width:100%}.race-progress{order:1}.race-question{order:2}.race-progress:not(.expanded) .race-list .race-runner:nth-child(n+3){display:none}.race-you,.race-expand{display:block}.race-prompt{min-height:145px}.race-choices button{min-height:68px;padding:10px}.race-podium>div{min-width:0;flex:1;padding:14px 6px}.race-podium small{font-size:.7rem}.race-results>div{grid-template-columns:36px 1fr}.race-results em{grid-column:2}.race-callout{align-items:flex-start}.race-callout strong{display:none}}
@media(max-width:420px){.race-choices{gap:8px}.race-choices button{gap:9px}.race-choices button>span{width:32px;height:32px}.race-choices button>b{font-size:1.1rem}.race-room-head{display:grid}.race-actions{position:static}.race-podium{gap:5px}}
@media(prefers-reduced-motion:reduce){.race-track>i,.race-track>em{transition:none}}