.sb{gap:20px;display:grid}.sb-display{background:radial-gradient(120% 140% at 50% 0%, #fff 0%, var(--tile) 72%);min-height:clamp(210px,22vw,260px);box-shadow:inset 0 0 0 1px var(--line);text-align:center;touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:26px;align-content:center;justify-items:center;gap:10px;padding:32px 20px 44px;display:grid;position:relative;overflow:hidden}.sb-display:before{content:"";background:radial-gradient(90% 120% at 50% 100%, var(--accent-soft) 0%, #f6e7dd00 70%);opacity:0;transition:opacity .4s var(--ease-out);position:absolute;inset:0}.sb-display[data-phase=running]:before{opacity:1}.sb-display>*{position:relative}.sb-cta{font-family:var(--font-serif);letter-spacing:-.015em;color:var(--ink);font-size:clamp(32px,4.4vw,48px);line-height:1.05}.sb-sub{color:var(--muted);font-variant-numeric:tabular-nums;font-size:14.5px}.sb-big{font-family:var(--font-mono);letter-spacing:-.05em;font-variant-numeric:tabular-nums;color:var(--ink);font-size:clamp(76px,11vw,132px);font-weight:500;line-height:.95}.sb-display[data-phase=done]>:not(.sb-progress){animation:rise .6s var(--ease-out) both}.sb-display[data-phase=done]>:nth-child(2){animation-delay:50ms}.sb-best{background:var(--accent);color:#fff;border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:600}.sb-display[data-phase=done]>.sb-best{animation:pop .5s var(--ease-pop) .15s both}.sb-progress{background:#1916130f;border-radius:2px;height:3px;position:absolute;bottom:16px;left:20px;right:20px;overflow:hidden}.sb-progress span{background:var(--accent);transform-origin:0;height:100%;display:block}.sb-display[data-phase=idle] .sb-progress{opacity:0}.sb-key{touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border:0;border-radius:20px;justify-self:center;width:min(100%,720px);height:96px;padding:0}.sb-key:focus-visible{outline:2px solid var(--accent);outline-offset:5px;border-radius:22px}.sb-cap{height:100%;transition:transform 80ms var(--ease-out);background:#d6cec2;border-radius:20px;padding:4px 9px 12px;display:block;box-shadow:0 12px 26px -16px #3c281480}.sb-legend{letter-spacing:.04em;height:100%;color:var(--muted);background:linear-gradient(#fff,#f7f4ef);border-radius:14px;place-items:end center;padding-bottom:12px;font-size:13px;font-weight:500;display:grid;box-shadow:inset 0 1px #fff}.sb-key[data-down] .sb-cap{background:#74300f;transform:translateY(3px)}.sb-key[data-down] .sb-legend{background:var(--accent);color:#fff;box-shadow:none}.sb-after{gap:18px;padding-top:4px;display:grid}@media (max-width:679px){.sb-display{border-radius:20px}.sb-key{height:84px}}