.t48{position:absolute;inset:0;display:flex;flex-direction:column;gap:3%;padding:4%;user-select:none;-webkit-user-select:none}.t48-hud{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:space-between}.t48-stats{display:flex;gap:6px}.t48-stat{min-width:60px;padding:4px 10px;border-radius:var(--rounded-sm);background:var(--color-canvas-soft-2);text-align:center;line-height:1.2}.t48-stat span{display:block;font-size:10px;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--color-mute)}.t48-stat b{font-size:16px;font-variant-numeric:tabular-nums;color:var(--color-ink)}.t48-actions{display:flex;gap:6px;align-items:center}.t48-stat.is-hot{position:relative;overflow:hidden;min-width:72px;background:color-mix(in srgb,var(--color-cat) 22%,var(--color-canvas-soft-2));box-shadow:inset 0 0 0 var(--border-w) color-mix(in srgb,var(--color-cat) 50%,transparent)}.t48-stat.is-hot span{color:var(--color-body)}.t48-stat.is-hot b{display:inline-block;font-family:var(--font-display);font-weight:var(--display-weight);font-size:calc(20px * var(--display-scale));line-height:1.25}.t48-stat.is-hot:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%);transform:translate(-130%);pointer-events:none}.t48-stat.is-shine:after{animation:t48-shine .9s ease-out}.t48-stat.is-bump b{animation:t48-bump .32s ease-out}.t48-stat.is-record{animation:t48-record 1.4s ease-out}.t48-gain{position:absolute;right:6px;top:2px;font-family:var(--font-display);font-weight:var(--display-weight);font-size:calc(13px * var(--display-scale));color:var(--color-cat);pointer-events:none;animation:t48-gain .7s ease-out forwards}@keyframes t48-shine{to{transform:translate(130%)}}@keyframes t48-bump{0%{transform:scale(1)}40%{transform:scale(1.25);color:var(--color-cat)}to{transform:scale(1)}}@keyframes t48-record{0%,to{box-shadow:inset 0 0 0 var(--border-w) color-mix(in srgb,var(--color-cat) 50%,transparent)}30%{box-shadow:inset 0 0 0 2px var(--color-cat),0 0 18px color-mix(in srgb,var(--color-cat) 70%,transparent)}}@keyframes t48-gain{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-14px)}}@media(prefers-reduced-motion:reduce){.t48-stat.is-shine:after,.t48-stat.is-bump b,.t48-stat.is-record,.t48-gain{animation:none}.t48-gain{display:none}}.t48-btn{height:32px;min-width:32px;padding:0 10px;border:1px solid var(--color-hairline);border-radius:var(--rounded-sm);background:var(--color-canvas);color:var(--color-ink);font:inherit;font-size:13px;font-weight:500;cursor:pointer}.t48-btn:hover{background:var(--color-canvas-soft-2)}.t48-btn:disabled{opacity:.45;cursor:default}.t48-btn:focus-visible,.t48-size:focus-visible{outline:2px solid var(--color-cat);outline-offset:2px}.t48-size{height:32px;padding:0 6px;border:1px solid var(--color-hairline);border-radius:var(--rounded-sm);background:var(--color-canvas);color:var(--color-ink);font:inherit;font-size:13px}.t48-board-wrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center}.t48-board{position:relative;aspect-ratio:1;height:100%;max-width:100%;border-radius:var(--rounded-lg);background:color-mix(in srgb,var(--color-cat) 14%,var(--color-canvas-soft-2));touch-action:none}.t48-cell{position:absolute;border-radius:10%;background:color-mix(in srgb,var(--color-canvas) 70%,transparent)}.t48-tile{position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;border-radius:10%;font-family:var(--font-display);font-weight:var(--display-weight);font-size:calc(var(--t48-fs) * var(--display-scale));font-variant-numeric:tabular-nums;letter-spacing:-.02em;transition:transform .1s ease-out;will-change:transform}.t48-tile>span{display:block}.t48-tile.is-new>span{animation:t48-appear .14s ease-out 90ms both}.t48-tile.is-merged>span{animation:t48-pop .16s ease-out 90ms}.t48-tile.is-hint{outline:3px solid var(--color-cat);outline-offset:2px}.t48-arrow{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:22%;color:var(--color-cat);pointer-events:none;opacity:.9}@keyframes t48-appear{0%{transform:scale(.2);opacity:0}to{transform:scale(1);opacity:1}}@keyframes t48-pop{0%{transform:scale(1)}50%{transform:scale(1.12)}to{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.t48-tile{transition:none}.t48-tile.is-new>span,.t48-tile.is-merged>span{animation:none}}.t48-v2{background:#dbeafe;color:#1e3a8a}.t48-v4{background:#bfdbfe;color:#1e3a8a}.t48-v8{background:#93c5fd;color:#172554}.t48-v16{background:#60a5fa;color:#0b1736}.t48-v32{background:#3b82f6;color:#fff}.t48-v64{background:#1d4ed8;color:#fff}.t48-v128{background:#5eead4;color:#042f2e}.t48-v256{background:#14b8a6;color:#042f2e}.t48-v512{background:#0f766e;color:#fff}.t48-v1024{background:#7c3aed;color:#fff}.t48-v2048{background:#f59e0b;color:#1c1917;box-shadow:0 0 0 2px #fde68a inset}.t48-vbig{background:#111827;color:#fbbf24}.t48-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
