:root{--ink: #221C4A;--ink-soft: #55507A;--paper: #FFFFFF;--paper-2: #F6F4FF;--bg-1: #3B2E7E;--bg-2: #1E1748;--pink: #DB2777;--pink-lt: #EC4899;--violet: #7C3AED;--violet-lt: #8B5CF6;--gold: #F59E0B;--mint: #10B981;--sky: #0EA5E9;--danger: #DC2626;--edge: 3px;--r-lg: 22px;--r-md: 16px;--r-sm: 11px;--drop: 0 6px 0 var(--ink);--drop-sm: 0 4px 0 var(--ink);--space-1: 6px;--space-2: 12px;--space-3: 18px;--space-4: 28px;--space-5: 44px;--font-display: "Fredoka", "Trebuchet MS", system-ui, sans-serif;--font-body: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-body);font-size:16px;line-height:1.5;color:var(--ink);background-color:var(--bg-2);background-image:radial-gradient(circle at 18% 12%,rgba(139,92,246,.45),transparent 46%),radial-gradient(circle at 84% 78%,rgba(236,72,153,.32),transparent 48%),radial-gradient(rgba(255,255,255,.07) 1.5px,transparent 1.5px),linear-gradient(165deg,var(--bg-1),var(--bg-2));background-size:auto,auto,24px 24px,auto;-webkit-text-size-adjust:100%}h1,h2,h3,.display{font-family:var(--font-display);font-weight:700;margin:0;letter-spacing:-.01em}button,input,select{font:inherit}.panel{background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-4)}.btn{font-family:var(--font-display);font-weight:600;font-size:1.05rem;color:var(--paper);background:var(--violet);border:var(--edge) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--drop-sm);padding:14px 22px;min-height:52px;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--ink)}.btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:var(--drop-sm)}.btn--go{background:var(--mint)}.btn--pink{background:var(--pink)}.btn--ghost{background:var(--paper);color:var(--ink)}.btn--danger{background:var(--danger)}.btn--wide{width:100%}.field{width:100%;padding:14px 16px;min-height:52px;color:var(--ink);background:var(--paper-2);border:var(--edge) solid var(--ink);border-radius:var(--r-md)}.field:focus-visible{outline:3px solid var(--violet-lt);outline-offset:2px}.label{display:block;font-weight:800;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);margin-bottom:var(--space-1)}.alert{border:var(--edge) solid var(--ink);border-radius:var(--r-md);background:#ffe4e6;color:#7f1d1d;font-weight:700;padding:12px 16px;display:flex;align-items:center;gap:10px}.stack{display:grid;gap:var(--space-3)}.row{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items:center}.wrap{max-width:560px;margin:0 auto;padding:var(--space-4) var(--space-3);min-height:100%;display:flex;flex-direction:column;justify-content:center}.brand{text-align:center;margin-bottom:var(--space-4)}.brand__word{font-family:var(--font-display);font-size:clamp(2.6rem,11vw,4rem);color:var(--paper);text-shadow:0 4px 0 var(--ink),0 5px 14px rgba(0,0,0,.4);margin:0}.brand__word span{color:var(--gold)}.brand__sub{color:#e4ddff;font-weight:700;margin-top:6px}.modes{display:grid;gap:var(--space-2)}.mode{display:flex;gap:var(--space-2);align-items:center;text-align:left;width:100%;padding:14px 16px;background:var(--paper-2);border:var(--edge) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--drop-sm);cursor:pointer;transition:transform .14s ease,background .14s ease}.mode:hover{transform:translateY(-2px)}.mode:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.mode[aria-pressed=true]{background:#ede9fe}.mode__icon{flex:none;width:44px;height:44px;display:grid;place-items:center;border:var(--edge) solid var(--ink);border-radius:12px;background:var(--paper);color:var(--violet)}.mode__name{font-family:var(--font-display);font-weight:600;font-size:1.1rem}.mode__desc{font-size:.86rem;color:var(--ink-soft)}.mode__tick{margin-left:auto;color:var(--mint)}.host{height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr);gap:var(--space-3);padding:var(--space-3);overflow:hidden}.hostbar{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-2) var(--space-3)}.code{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.4rem);letter-spacing:.12em;line-height:1;color:var(--violet)}.code__label{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);font-weight:800}.pill{font-family:var(--font-display);font-size:1rem;padding:7px 15px;border:var(--edge) solid var(--ink);border-radius:999px;background:var(--gold);color:var(--ink);white-space:nowrap}.pill--mint{background:var(--mint);color:var(--paper)}.pill--sky{background:var(--sky);color:var(--paper)}.host__body{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--space-3);min-height:0;overflow:hidden}@media (max-width: 1000px){.host__body{grid-template-columns:1fr}}.track{background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-2);overflow-x:hidden;overflow-y:auto;min-height:0}.lane{position:relative;display:grid;grid-template-columns:2.4ch minmax(72px,12ch) 1fr;gap:8px;align-items:center;height:var(--lane-h, 34px);border-bottom:2px dashed #E2DDF5}.lane:last-child{border-bottom:0}.lane__rank{font-family:var(--font-display);color:var(--ink-soft);text-align:right;font-size:.9em}.lane__name{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.92em}.lane__name.is-off{color:var(--ink-soft);text-decoration:line-through}.lane__road{--tok: calc(var(--lane-h, 34px) * .7);position:relative;height:100%;border-radius:999px;background:repeating-linear-gradient(90deg,#f1eefc 0,#f1eefc 14px,#e7e2fa 14px,#e7e2fa 28px);border:2px solid #DBD4F3}.lane__runner{position:absolute;top:0;bottom:0;left:calc(var(--tok) / 2);width:calc(100% - var(--tok));transition:transform .42s cubic-bezier(.34,1.32,.64,1);will-change:transform}.token{position:absolute;top:50%;left:0;width:var(--tok);height:var(--tok);border-radius:50%;border:3px solid var(--ink);display:grid;place-items:center;font-family:var(--font-display);font-size:.72em;color:var(--paper);transform:translate(-50%,-50%)}.token.is-done{box-shadow:0 0 0 4px var(--gold)}.finishline{position:absolute;top:0;bottom:0;right:0;width:10px;border-radius:0 999px 999px 0;background:repeating-linear-gradient(45deg,var(--ink) 0 5px,var(--paper) 5px 10px)}.board{background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-3);overflow:auto;min-height:0}.board h2{font-size:1.3rem;margin-bottom:var(--space-2)}.board__row{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:9px 10px;border:2px solid var(--ink);border-radius:var(--r-sm);background:var(--paper-2);margin-bottom:8px}.board__row--1{background:#fef3c7}.board__row--2{background:#f1f5f9}.board__row--3{background:#ffedd5}.board__medal{width:30px;height:30px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:50%;font-family:var(--font-display);background:var(--paper)}.board__name{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board__meta{font-size:.78rem;color:var(--ink-soft);font-weight:700}.board__score{font-family:var(--font-display);font-size:1.05rem}.empty{text-align:center;color:var(--ink-soft);font-weight:700;padding:var(--space-4) var(--space-2)}.joinlist{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:var(--edge) solid var(--ink);border-radius:999px;background:var(--paper-2);font-weight:800;font-size:.95rem}.chip__dot{width:13px;height:13px;border-radius:50%;border:2px solid var(--ink)}.play{min-height:100%;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}.playbar{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);color:var(--paper);font-weight:800}.playbar__progress{flex:1;height:16px;border:var(--edge) solid var(--ink);border-radius:999px;background:#ffffffd9;overflow:hidden}.playbar__fill{height:100%;width:100%;transform-origin:left center;transition:transform .42s cubic-bezier(.34,1.32,.64,1);will-change:transform}.play__body{flex:1;display:flex;flex-direction:column;justify-content:center;gap:var(--space-3);padding:var(--space-3);max-width:560px;width:100%;margin:0 auto}.prompt{background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-4) var(--space-3);text-align:center}.prompt__kind{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}.prompt__text{font-family:var(--font-display);font-size:clamp(2rem,11vw,3.2rem);line-height:1.15;margin-top:var(--space-1);word-break:break-word}.prompt__text--word{letter-spacing:.04em}.options{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}@media (max-width: 380px){.options{grid-template-columns:1fr}}.opt{font-family:var(--font-display);font-size:clamp(1.3rem,6vw,1.9rem);min-height:78px;color:var(--ink);background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--drop-sm);cursor:pointer;transition:transform .14s ease,background .14s ease}.opt:nth-child(1){background:#fde68a}.opt:nth-child(2){background:#bfdbfe}.opt:nth-child(3){background:#bbf7d0}.opt:nth-child(4){background:#fbcfe8}.opt:active{transform:translateY(4px);box-shadow:0 0 0 var(--ink)}.opt:focus-visible{outline:3px solid var(--violet);outline-offset:3px}.opt[disabled]{opacity:.45;cursor:not-allowed}.verdict{border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-3);text-align:center;background:var(--paper)}.verdict--good{background:#d1fae5}.verdict--bad{background:#fee2e2}.verdict__head{font-family:var(--font-display);font-size:1.9rem;display:flex;align-items:center;justify-content:center;gap:10px}.verdict__note{font-weight:700;margin-top:4px}.statrow{display:flex;gap:var(--space-2);justify-content:center}.stat{flex:1;background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-md);padding:var(--space-2);text-align:center}.stat__num{font-family:var(--font-display);font-size:1.6rem}.stat__cap{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}.center-note{text-align:center;color:#e4ddff;font-weight:700}.link{background:none;border:0;color:#e4ddff;font-weight:800;text-decoration:underline;cursor:pointer;padding:8px}.link:focus-visible{outline:3px solid var(--gold);outline-offset:2px}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:18px;padding:0;background:var(--paper-2);border:var(--edge) solid var(--ink);border-radius:999px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:var(--violet);border:var(--edge) solid var(--ink);cursor:pointer}input[type=range]::-moz-range-thumb{width:30px;height:30px;border-radius:50%;background:var(--violet);border:var(--edge) solid var(--ink);cursor:pointer}input[type=range]:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.winner{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:1.25rem;padding:8px 18px;border:var(--edge) solid var(--ink);border-radius:999px;background:var(--gold);color:var(--ink);white-space:nowrap}.lobby{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:var(--space-3);min-height:0;overflow:auto}.modesel .code__label{display:block}.modesel select{font-family:var(--font-display);font-size:1rem;color:var(--paper);background-color:var(--sky);border:var(--edge) solid var(--ink);border-radius:999px;padding:7px 38px 7px 15px;min-height:44px;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5 7 7.5 13 1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}.modesel select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.modesel option{color:var(--ink);background:var(--paper)}.place{margin:16px 0 0;text-align:center}.place__num{display:block;font-family:var(--font-display);font-size:3rem;line-height:1}.place__cap{display:block;margin-top:2px;font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}.boost{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;padding:10px 14px;font-family:var(--font-display);font-size:1.05rem;color:var(--ink);background:#fde68a;border:var(--edge) solid var(--ink);border-radius:var(--r-md)}.picker{background:var(--paper);border:var(--edge) solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--drop);padding:var(--space-3)}.picker__kind{display:flex;align-items:center;gap:7px;margin:0;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}.picker__head{font-size:1.5rem;margin-top:4px}.picker__note{font-weight:700;color:var(--ink-soft);margin:4px 0 var(--space-2)}.picker__list{display:grid;gap:8px;margin-bottom:var(--space-2)}.target{display:grid;grid-template-columns:26px 16px 1fr auto;gap:10px;align-items:center;width:100%;min-height:56px;padding:10px 14px;text-align:left;background:var(--paper-2);border:var(--edge) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--drop-sm);cursor:pointer;transition:transform .14s ease,background .14s ease}.target:hover{background:#ffe4e6}.target:active{transform:translateY(4px);box-shadow:0 0 0 var(--ink)}.target:focus-visible{outline:3px solid var(--pink);outline-offset:3px}.target__rank{font-family:var(--font-display);color:var(--ink-soft)}.target__dot{width:15px;height:15px;border-radius:50%;border:2px solid var(--ink)}.target__name{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.target__pos{font-family:var(--font-display);font-size:1.05rem}.toast{display:flex;align-items:center;gap:12px;padding:14px 16px;font-weight:700;color:var(--ink);background:#fecaca;border:var(--edge) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--drop-sm)}.toast__icon{flex:none;display:grid;place-items:center;width:40px;height:40px;border:var(--edge) solid var(--ink);border-radius:50%;background:var(--paper);color:var(--danger)}.toast__who{font-family:var(--font-display);font-size:1.15rem}.toast__sub{display:block;font-weight:600;font-size:.86rem;color:#7f1d1d}@keyframes pop{0%{transform:scale(.82)}60%{transform:scale(1.06)}to{transform:scale(1)}}.pop{animation:pop .32s cubic-bezier(.34,1.32,.64,1)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}