:root{--cream:#fbf5ea;--ink:#2b2140;--white:#fff;--coral:oklch(70% .17 35);--yellow:oklch(86% .14 90);--home:oklch(88% .13 92);--lilac:oklch(92% .045 295);--win:oklch(72% .16 35);--green:oklch(74% .15 150);--mute:#2b214014;--line:#2b214026;--serif:"Young Serif", Georgia, serif;--sans:"DM Sans", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;--press:.16s ease-out;--card-ratio:.653;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{font-family:var(--sans);color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}button{cursor:pointer}a{color:var(--ink)}:focus-visible{outline:3px solid var(--coral);outline-offset:2px}.page{background:var(--cream);justify-content:center;min-height:100dvh;display:flex}.page--home{background:var(--home)}.page--lilac{background:var(--lilac)}.page--win{background:var(--win);position:relative;overflow:hidden}.screen{width:100%;max-width:480px;min-height:100dvh;padding:max(20px, env(safe-area-inset-top)) 20px max(28px, env(safe-area-inset-bottom));flex-direction:column;gap:18px;display:flex;position:relative}.screen--wide{max-width:1180px}.spacer{flex:1}.row{align-items:center;gap:12px;display:flex}.row--between{justify-content:space-between}.row--baseline{align-items:baseline}.col{flex-direction:column;gap:8px;display:flex}.title-xl{font:400 60px/1 var(--serif);margin:0}.title-l{font:400 38px/1.05 var(--serif);margin:0}.title{font:400 28px/1.1 var(--serif);margin:0}.clue{font:400 29px/1.15 var(--serif);text-wrap:pretty;overflow-wrap:anywhere;margin:0}.label{letter-spacing:.06em;text-transform:uppercase;opacity:.6;font-size:14px;font-weight:600}.label--strong{letter-spacing:.08em;font-weight:700}.field-label{font-size:15px;font-weight:700}.hint{opacity:.65;font-size:15px}.small{opacity:.6;font-size:14px}.strong{font-size:17px;font-weight:700}.center{text-align:center}.link{text-underline-offset:3px;background:0 0;border:none;padding:0;font-size:15px;font-weight:600;text-decoration:underline}.link--big{text-underline-offset:4px;min-height:44px;font-size:16px}.error{color:oklch(50% .18 30);font-size:15px;font-weight:600}.btn{background:var(--ink);height:58px;color:var(--cream);box-shadow:0 5px 0 var(--coral);transition:transform var(--press), box-shadow var(--press), opacity var(--press);white-space:nowrap;border:none;border-radius:29px;justify-content:center;align-items:center;gap:8px;width:100%;padding:0 24px;font-size:18px;font-weight:600;text-decoration:none;display:flex}.btn:active:not(:disabled){box-shadow:0 2px 0 var(--coral);transform:translateY(3px)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--secondary{background:var(--cream);color:var(--ink);border:2.5px solid var(--ink);box-shadow:none}.btn--secondary:active:not(:disabled){box-shadow:none}.btn--plain{background:var(--cream);color:var(--ink);box-shadow:none}.btn--plain:active:not(:disabled){box-shadow:none}.btn--yellow-shadow{box-shadow:0 5px 0 var(--yellow)}.btn--yellow-shadow:active:not(:disabled){box-shadow:0 2px 0 var(--yellow)}.btn--sm{width:auto;height:52px;font-size:17px}.icon-btn{background:var(--white);width:44px;height:44px;box-shadow:0 2px 0 var(--line);border:none;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:22px;display:flex}.pill-btn{background:var(--cream);white-space:nowrap;border:none;border-radius:18px;flex:none;align-items:center;gap:6px;height:36px;padding:0 14px;font-size:15px;font-weight:600;display:inline-flex}.pill-btn--ink{background:var(--ink);color:var(--cream)}.panel{background:var(--white);border-radius:26px;padding:18px;box-shadow:0 3px #2b21401a}.chip{border:2px solid var(--line);border-radius:999px;padding:7px 12px;font-size:14.5px;font-weight:600}.avatar{width:34px;height:34px;color:var(--ink);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:inline-flex;position:relative}.avatar--offline:after{content:"";border:2px solid var(--white);background:#b9b2c2;border-radius:50%;width:11px;height:11px;position:absolute;bottom:-2px;right:-2px}.player-pill{background:var(--white);border-radius:999px;align-items:center;gap:10px;min-width:0;padding:8px 12px 8px 8px;display:flex;box-shadow:0 2px #2b21401a}.player-pill__name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:16px;font-weight:600;overflow:hidden}.player-pill__tag{opacity:.55;font-size:13px;font-weight:600}.grid-2{grid-template-columns:1fr 1fr;gap:10px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:12px;padding-top:4px;display:grid}.code-boxes{justify-content:center;gap:6px;display:flex}.code-box{background:var(--home);width:40px;height:50px;font:400 28px var(--serif);border-radius:12px;justify-content:center;align-items:center;display:flex}.code-boxes--cream .code-box{background:var(--cream)}.code-boxes--fill .code-box{flex:1;width:auto;height:52px}.role-pill{background:var(--yellow);box-shadow:0 3px 0 var(--ink);border-radius:999px;padding:7px 14px;font-size:15px;font-weight:700}.score-chip{background:var(--white);border-radius:999px;align-items:center;gap:8px;min-width:0;padding:4px 12px 4px 4px;font-size:15px;font-weight:700;display:flex;box-shadow:0 2px #2b21401f}.score-chip>*{flex:none}.score-chip>.score-chip__room{flex:0 auto;min-width:0}.score-chip__room{opacity:.7;text-overflow:ellipsis;white-space:nowrap;max-width:42vw;padding-left:8px;font-size:13px;font-weight:600;overflow:hidden}.delta{background:var(--mute);border-radius:999px;padding:3px 9px;font-size:14px;font-weight:700}.delta--pos{background:var(--coral)}.bar{background:var(--mute);border-radius:4px;height:8px;overflow:hidden}.bar>div{border-radius:4px;height:100%;transition:width .6s ease-out}.card{aspect-ratio:var(--card-ratio);border:2px solid var(--ink);background:var(--mute);transition:transform var(--press), box-shadow var(--press), opacity var(--press);border-radius:14px;padding:0;position:relative;overflow:hidden}.card img{object-fit:cover;width:100%;height:100%;display:block}.card--selectable{cursor:pointer}button.card{touch-action:manipulation;-webkit-user-select:none;user-select:none}.card--selected{box-shadow:0 0 0 3px var(--cream), 0 0 0 6px var(--ink);transform:translateY(-8px)}.card--dim{opacity:.4;cursor:not-allowed}.card-num{background:var(--cream);z-index:1;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;font-weight:700;display:flex;position:absolute;top:6px;left:6px}.card-tag{opacity:.6;text-align:center;min-height:15px;font-size:13.5px;font-weight:600}.card-empty{border:3px dashed var(--line);text-align:center;opacity:.8;background:0 0;justify-content:center;align-items:center;padding:16px;font-size:15px;font-weight:600;display:flex}.input{background:var(--white);border:2.5px solid var(--ink);height:56px;font:400 21px var(--serif);width:100%;caret-color:var(--coral);border-radius:18px;outline:none;padding:0 16px}.input:focus{box-shadow:0 0 0 4px #ef8a6a59}.input--code{font:400 26px var(--mono);letter-spacing:.3em;text-transform:uppercase;text-align:center}.stepper{align-items:center;gap:12px;font-weight:700;display:flex}.stepper button{background:var(--cream);border:none;border-radius:50%;width:34px;height:34px;font-size:18px;font-weight:700}.stepper button:disabled{opacity:.35}.presets{gap:6px;display:flex}.presets button{background:var(--cream);border:none;border-radius:17px;flex:1;height:34px;font-size:15px;font-weight:600}.presets button[aria-pressed=true]{background:var(--ink);color:var(--cream)}.settings{background:var(--white);border-radius:20px;flex-direction:column;display:flex}.settings>div{padding:13px 16px}.settings>div+div{border-top:1px solid var(--mute)}.overlay{z-index:50;background:#2b21408c;justify-content:center;align-items:center;padding:24px;animation:.16s ease-out fade;display:flex;position:fixed;inset:0}.dialog{background:var(--cream);width:100%;max-width:360px;box-shadow:0 6px 0 var(--ink);border-radius:28px;flex-direction:column;gap:16px;padding:22px;display:flex}.zoom{width:min(86vw,420px);box-shadow:0 6px 0 var(--ink);border-width:3px;border-radius:22px}.toast{left:50%;bottom:max(24px, env(safe-area-inset-bottom));background:var(--ink);color:var(--cream);z-index:60;text-align:center;border-radius:999px;max-width:calc(100vw - 32px);padding:12px 18px;font-size:16px;font-weight:600;animation:.16s ease-out fade;position:fixed;transform:translate(-50%)}.host-bar{z-index:30;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#2b214014;justify-content:space-between;align-items:center;gap:12px;height:32px;padding:6px 20px;font-size:14px;font-weight:600;display:flex;position:fixed;top:0;left:0;right:0}.with-host-bar .screen{padding-top:calc(max(20px, env(safe-area-inset-top)) + 32px)}.host-bar .link{min-height:32px;font-size:14px}.banner{z-index:40;background:var(--ink);color:var(--cream);text-align:center;padding:8px 12px;font-size:15px;font-weight:600;position:sticky;top:0}.race{align-items:flex-end;gap:10px;display:flex}.race__lane{flex:1;height:34px;position:relative}.race__lane:before{content:"";border-bottom:2px dashed var(--line);position:absolute;bottom:3px;left:0;right:0}.race__trail{opacity:.55;border-radius:4px;height:8px;position:absolute;bottom:0;left:0}.race__bunny{width:34px;position:absolute;bottom:2px}.race__hop{transform-origin:50% 100%;animation:.32s ease-in-out infinite hop}@keyframes hop{0%,to{transform:translateY(0)scaleY(1)}15%{transform:translateY(0)scaleY(.88)}50%{transform:translateY(-9px)scaleY(1.04)}}.race__score{text-align:right;width:40px;font:400 24px/1 var(--serif);opacity:0;flex:none;transition:opacity .22s ease-out,transform .26s cubic-bezier(.2,.9,.3,1.4);transform:scale(.6)}.race__score--podium{color:oklch(55% .17 35)}.race__score--first{font-size:28px;font-weight:700}.race__score--on{opacity:1;transform:scale(1)}.gallery{z-index:70;color:var(--cream);padding:max(12px, env(safe-area-inset-top)) 0 max(20px, env(safe-area-inset-bottom));background:#1e162ef0;flex-direction:column;animation:.16s ease-out fade;display:flex;position:fixed;inset:0}.gallery__top{justify-content:space-between;align-items:center;padding:0 16px;display:flex}.gallery__count{letter-spacing:.04em;font-size:16px;font-weight:700}.gallery__close{background:var(--cream);color:var(--ink);box-shadow:none}.gallery__stage{touch-action:pan-y;cursor:grab;flex:1;min-height:0;position:relative;overflow:hidden}.gallery__track{height:100%;display:flex}.gallery__slide{flex:0 0 100%;justify-content:center;align-items:center;padding:12px 24px;display:flex}.gallery__card{width:min(82vw, 420px, calc((100dvh - 230px) * var(--card-ratio)));pointer-events:none;border-width:3px;border-radius:22px;box-shadow:0 6px #00000059}.gallery__card--dim{filter:grayscale(.5)brightness(.65)}.gallery__arrow{color:var(--ink);box-shadow:none;background:#fbf5eae6;position:absolute;top:50%;transform:translateY(-50%)}.gallery__arrow--left{left:8px}.gallery__arrow--right{right:8px}.gallery__bottom{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:480px;margin:0 auto;padding:0 20px;display:flex}.gallery__label{text-align:center;font-size:16px;font-weight:600}.gallery .btn:disabled{opacity:.6}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:scale(.85)}}.pop{animation:.26s cubic-bezier(.2,.9,.3,1.3) pop}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.settings .row>span:first-child{white-space:nowrap}.table-page{background:var(--cream);min-height:100dvh;position:relative;overflow:hidden}.table-layout{min-height:100dvh;display:flex}.table-side{background:var(--lilac);flex-direction:column;flex:none;gap:22px;width:320px;padding:36px 32px;display:flex}.table-main{flex:1;justify-content:center;align-items:center;min-width:0;padding:36px;display:flex}.table-grid{grid-template-columns:repeat(3,minmax(0,150px));justify-content:center;gap:30px 36px;width:100%;display:grid}.table-grid--reveal{grid-template-columns:repeat(3,minmax(0,170px))}.table-board{flex-direction:column;gap:28px;width:100%;min-height:100dvh;padding:36px 40px;display:flex}.table-main .table-board{min-height:0;padding:0}.track{gap:8px;display:grid}.track-cell{aspect-ratio:1;background:var(--white);border-radius:16px;flex-direction:column;justify-content:space-between;min-width:0;padding:5px;display:flex}.track-cell--ten{background:var(--lilac)}.track-cell--goal{background:var(--yellow);border:2.5px solid var(--ink)}.track-dot{border:2px solid var(--ink);border-radius:50%;width:18px;height:18px}.board-scores{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;display:grid}@media (width<=820px){.table-layout{flex-direction:column}.table-side{width:100%;padding:24px 20px}.table-main{padding:24px 16px}.table-grid,.table-grid--reveal{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 12px}.table-board{padding:24px 16px}.track{grid-template-columns:repeat(7,1fr)!important}.track-dot{width:12px;height:12px}}.admin-page{background:var(--cream);min-height:100dvh;display:flex}.admin-list{min-width:0;padding:max(20px, env(safe-area-inset-top)) 20px 28px;flex-direction:column;flex:1;gap:22px;max-width:760px;margin:0 auto;display:flex}.admin-panel{background:var(--home);flex-direction:column;flex:none;gap:18px;width:340px;min-height:100dvh;padding:36px 30px;display:flex;position:sticky;top:0}@media (width>=900px){.admin-list{padding:36px}}.room-row{background:var(--white);box-shadow:0 3px 0 var(--mute);border-radius:22px;overflow:hidden}.room-row--selected{box-shadow:0 0 0 3px var(--ink)}.room-row__main{text-align:left;background:0 0;border:none;align-items:center;gap:16px;width:100%;padding:14px 18px;display:flex}.room-row__name{font:400 21px/1.2 var(--serif);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.room-row__actions{flex-wrap:wrap;gap:8px;padding:0 18px 14px;display:flex}.room-code{font:400 18px var(--mono);letter-spacing:.12em;background:var(--cream);border-radius:10px;padding:6px 10px}.status-pill{white-space:nowrap;border-radius:999px;padding:5px 12px;font-size:14px;font-weight:700}@media (width<=520px){.room-row__main{flex-wrap:wrap;gap:10px}.room-row__main>div:first-child{flex-basis:100%}}.code-card{background:var(--home);box-shadow:0 4px 0 var(--ink);border-radius:22px;padding:16px}.code-edit{width:100%;display:block;position:relative}.code-edit input{opacity:0;cursor:text;border:none;width:100%;font-size:18px;position:absolute;inset:0}.code-edit:focus-within .code-box{box-shadow:inset 0 0 0 2px var(--ink)}.presets--big button{border-radius:20px;height:40px;font-size:16px}.admin-panel .presets button:not([aria-pressed=true]){background:var(--cream)}
