.modes{display:grid;gap:8px}.mode{display:grid;gap:1px;padding:10px 14px 12px;border:3px solid transparent;border-radius:var(--radius-s);background:var(--cream);text-align:left;cursor:pointer;touch-action:manipulation}.mode strong{font-size:1.1rem}.mode span{color:var(--ink-soft);font-size:.92rem}.mode.is-selected{border-color:var(--mint-deep);background:#f0fbf0}.mode:disabled{color:var(--ink);cursor:default}.mode:disabled:not(.is-selected){opacity:.5}.rush{--tile: min( calc((100vw - 56px)/5) , calc((100dvh - 418px) / 6), 62px);display:flex;flex-direction:column;gap:8px;width:100%;min-height:100dvh;padding:6px 12px calc(8px + env(safe-area-inset-bottom))}.rush-hud{display:flex;align-items:center;gap:8px}.rush-hud__buddy{flex:none;width:92px;margin:-14px -8px -14px -14px}.rush-hud__middle{flex:1;min-width:0;text-align:center}.rush-hud__info{overflow:hidden;color:#fff;font-size:clamp(.72rem,3.3vw,.85rem);font-weight:600;text-overflow:ellipsis;text-shadow:0 2px 0 var(--sky-deep);white-space:nowrap}.clock{display:inline-block;min-width:96px;padding:0 14px 2px;border-radius:999px;background:var(--ink);color:var(--sun);font-size:1.55rem;font-weight:700;font-variant-numeric:tabular-nums;text-align:center}.clock.is-urgent{background:var(--coral);color:#fff;animation:urgent 1s ease-in-out infinite}@keyframes urgent{50%{transform:scale(1.07)}}.race{display:flex;flex:none;gap:6px;margin:0 -12px;padding:2px 12px 4px;overflow-x:auto;list-style:none;scrollbar-width:none}.race::-webkit-scrollbar{display:none}.racer{position:relative;display:grid;flex:none;grid-template-columns:30px auto;gap:0 5px;align-items:center;min-width:92px;padding:3px 7px 3px 3px;border:3px solid transparent;border-radius:var(--radius-s);background:#ffffffeb}.racer .avatar{grid-column:1;grid-row:1 / span 2;width:30px;height:38px}.racer .mini{grid-column:2;grid-row:1 / span 2;justify-self:end}.racer__name{grid-column:1 / -1;grid-row:3;overflow:hidden;font-size:.75rem;font-weight:600;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.racer__status{grid-column:1 / -1;grid-row:4;color:var(--ink-soft);font-size:.7rem;font-weight:600;line-height:1.2;white-space:nowrap}.racer__place{position:absolute;top:-3px;left:-3px;z-index:1;border-radius:999px;background:var(--ink);color:#fff;font-size:.68rem;font-weight:700;line-height:1.5}.racer__place:not(:empty){padding:0 6px}.racer__place.is-first,.result__place.is-first{background:var(--sun);color:var(--ink)}.racer.is-you{border-color:var(--buddy)}.racer.is-solved{background:#effbef}.racer.is-solved .racer__status{color:#23702e}.racer.is-out{filter:grayscale(.6);opacity:.75}.racer.is-away .avatar{opacity:.4}.racer.is-hop .avatar{animation:racer-hop .38s cubic-bezier(.3,1.5,.5,1)}@keyframes racer-hop{40%{transform:translateY(-9px) scale(1.08,.94)}}.mini{--cell: 7px;display:grid;gap:1px}.mini__row{display:flex;gap:1px}.cell{width:var(--cell);height:var(--cell);border-radius:2px;background:#e9e6f3}.cell--hit{background:var(--mint-deep)}.cell--near{border-radius:50%;background:var(--sun)}.cell--miss{background:#a29db9}.play{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:space-between;gap:8px}.play__board{position:relative}.board{display:grid;gap:5px}.board.is-off{opacity:.6}.board__row{display:flex;gap:5px}.tile{display:grid;width:var(--tile, 52px);height:var(--tile, 52px);place-items:center;border-radius:13px;background:#ffffff9e;box-shadow:inset 0 3px #2b23500f;font-size:calc(var(--tile, 52px) * .56);font-weight:700;line-height:1;user-select:none}.tile--typed{background:#fff;box-shadow:0 3px #cfcbe2;animation:tile-in .11s ease-out}@keyframes tile-in{0%{transform:scale(.82)}}.tile--hit,.tile--near,.tile--miss{transition:background-color 1ms linear,border-radius 1ms linear}.tile--hit{background:var(--mint);box-shadow:0 4px 0 var(--mint-deep)}.tile--near{border-radius:50%;background:var(--sun);box-shadow:0 4px 0 var(--sun-deep)}.tile--miss{background:#a29db9;box-shadow:0 4px #827d9c;color:#fff}.tile.is-new{animation:tile-jump .34s cubic-bezier(.3,1.3,.5,1) both;animation-delay:calc(var(--i) * .13s)}@keyframes tile-jump{0%{background:#fff;box-shadow:0 3px #cfcbe2;border-radius:13px;color:var(--ink);transform:none}45%{background:#fff;box-shadow:0 3px #cfcbe2;border-radius:13px;color:var(--ink);transform:translateY(-14px) scale(1.06)}46%{transform:translateY(-14px) scale(1.06)}to{transform:none}}.toast{position:absolute;top:10px;left:50%;z-index:3;width:max-content;max-width:100%;padding:5px 16px 7px;border-radius:999px;background:var(--ink);box-shadow:0 5px #2b235033;color:#fff;font-weight:600;text-align:center;transform:translate(-50%);animation:toast-in .17s cubic-bezier(.2,1.5,.4,1)}.toast[hidden]{display:none}@keyframes toast-in{0%{transform:translate(-50%) scale(.7)}}.toast--low{top:auto;bottom:10px}.toast--bad{background:#ffe1e1;color:#a8232b}.toast--good{background:var(--mint);color:var(--ink)}.count{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;text-align:center}.count[hidden]{display:none}.count__number{color:#fff;font-size:clamp(4.5rem,20vw,7.5rem);font-weight:700;line-height:1;text-shadow:0 6px 0 var(--ink)}.count__label{padding:2px 14px 4px;border-radius:999px;background:var(--ink);color:#fff;font-size:1.1rem;font-weight:600}.dock-area{width:min(100%,520px)}.keys{display:grid;gap:6px;touch-action:manipulation}.keys.is-off{opacity:.5;pointer-events:none}.keys[hidden]{display:none}.keys__row{display:flex;justify-content:center;gap:4px}.key{flex:1 1 0;min-width:0;max-width:48px;height:46px;padding:0 0 2px;border:0;border-radius:10px;background:#fff;box-shadow:0 3px #cfcbe2;font-size:1.05rem;font-weight:700;cursor:pointer;touch-action:manipulation;user-select:none}.key:active{box-shadow:0 1px #cfcbe2;transform:translateY(2px)}.key--wide{flex-grow:1.6;max-width:76px}.key--go{background:var(--coral);box-shadow:0 3px 0 var(--coral-deep);color:#fff}.key--hit{background:var(--mint);box-shadow:0 3px 0 var(--mint-deep)}.key--near{background:var(--sun);box-shadow:0 3px 0 var(--sun-deep)}.key--miss{background:#a29db9;box-shadow:0 3px #827d9c;color:#fff}.finished{display:grid;gap:4px;justify-items:center;padding:12px 16px 14px;border-radius:var(--radius-m);background:#fff;box-shadow:0 6px #2b23501f;text-align:center}.finished[hidden]{display:none}.finished__title{font-size:1.4rem;font-weight:700}.finished__wait{color:var(--ink-soft);font-weight:500}.finished__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;margin-top:6px}.title--small{font-size:clamp(2.1rem,8vw,3.2rem)}.over__hero--rush{width:min(52vw,30dvh,240px);margin:-18px 0 -42px}.reveal{--tile: 50px;position:relative;z-index:1;display:flex;gap:5px}.results{position:relative;z-index:1;display:grid;gap:6px;width:100%;margin:0;padding:12px;list-style:none}.result{display:grid;grid-template-columns:38px 44px minmax(0,1fr) auto;gap:6px;align-items:center;padding:4px 10px 4px 6px;border-radius:var(--radius-s);background:var(--cream)}.result.is-you{outline:3px solid var(--sky);outline-offset:-3px}.result.is-out .avatar{filter:grayscale(.6)}.result .avatar{width:44px;height:44px}.result .mini{--cell: 8px}.result__place{border-radius:999px;background:#eee9f7;font-size:.85rem;font-weight:700;line-height:1.8;text-align:center}.result__who{display:grid;min-width:0;font-size:.92rem}.result__who strong{overflow:hidden;font-size:1.05rem;text-overflow:ellipsis;white-space:nowrap}@media(min-width:860px){.rush{--tile: min(66px, calc((100dvh - 340px) / 6));display:grid;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) 320px;gap:10px 22px;max-width:1020px;margin:0 auto;padding-inline:20px}.rush-hud{grid-column:1 / -1}.rush-hud__buddy{width:120px;margin:-14px -8px -20px -10px}.clock{font-size:1.9rem}.rush-hud__info{font-size:1rem}.play{grid-column:1;grid-row:2}.race{flex-direction:column;grid-column:2;grid-row:2;margin:0;padding:2px 2px 12px;overflow:visible auto}.racer{grid-template-columns:44px minmax(0,1fr) auto;gap:0 8px;padding:6px 10px 6px 6px}.racer .avatar{width:44px;height:44px}.racer__name{grid-column:2;grid-row:1;align-self:end;font-size:1.02rem}.racer__status{grid-column:2;grid-row:2;align-self:start;font-size:.85rem}.racer .mini{--cell: 9px;grid-column:3}.racer__place{font-size:.78rem}.key{height:52px}}@media(max-height:640px)and (max-width:859px){.rush{--tile: min( calc((100vw - 56px)/5) , calc((100dvh - 372px) / 6))}.key{height:40px}}
