.rec-stage{position:relative;display:grid;aspect-ratio:16 / 9;min-width:0;border:1.5px dashed color-mix(in oklab,var(--ink) 22%,transparent);border-radius:var(--radius-lg);background:var(--paper);overflow:hidden;transition:border-color var(--dur-2) var(--ease-move),background-color var(--dur-2) var(--ease-move)}.rec-stage>*{grid-area:1 / 1}[data-state=countdown] .rec-stage,[data-state=recording] .rec-stage,[data-state=paused] .rec-stage,[data-state=recorded] .rec-stage,[data-state=saving] .rec-stage,[data-state=finishing] .rec-stage{border-style:solid;border-color:var(--line);background:#141311}.rec-idle,.rec-busy{display:grid;place-items:center;align-content:center;gap:var(--space-4);padding:var(--space-6);text-align:center}.rec-idle[hidden],.rec-problem[hidden],.rec-busy[hidden],.rec-count[hidden],.rec-badge[hidden],.rec-video[hidden]{display:none}.rec-idle h2{font-size:var(--text-2xl);font-weight:500}.rec-idle p{max-width:34rem;color:var(--ink-2);font-size:var(--text-sm)}.rec-btn:disabled{cursor:default;opacity:.55}.rec-btn:disabled:before{transform:none}[data-state=choosing] .rec-btn:before{transform:scale(.8)}.rec-video{width:100%;height:100%;object-fit:contain;background:#141311}#rec-live{animation:t-in var(--dur-3) var(--ease-out)}.rec-busy{color:#efece7;font-size:var(--text-sm)}.rec-spinner{width:var(--space-3);height:var(--space-3);border-radius:50%;background:var(--accent)}.rec-badge{align-self:start;justify-self:start;display:inline-flex;align-items:center;gap:var(--space-2);margin:var(--space-3);padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background:#0009;color:#fff;font-size:var(--text-xs);font-weight:600;letter-spacing:var(--tracking-wide);text-transform:uppercase}.rec-badge-time{font-family:var(--font-mono);letter-spacing:0}.rec-dot{width:.6rem;height:.6rem;border-radius:50%;background:var(--danger)}[data-state=recording] .rec-dot{animation:rec-pulse 1.2s var(--ease-in-out) infinite alternate}.is-paused .rec-dot{background:#d6cfc2}@keyframes rec-pulse{to{opacity:.35}}.rec-count{display:grid;place-items:center;background:#00000073}.rec-count span{font-family:var(--font-display);font-size:clamp(4rem,14vw,9rem);line-height:1;color:#fff}.rec-count span.is-tick{animation:rec-tick var(--dur-3) var(--ease-out)}@keyframes rec-tick{0%{opacity:0;transform:scale(1.35)}}.rec-clock{font-family:var(--font-mono);font-size:var(--text-4xl);font-weight:500;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.is-paused .rec-clock{color:var(--ink-3)}.rec-status{min-height:3lh;font-size:var(--text-sm);color:var(--ink-2)}#rec-done-status{min-height:2lh}.rec-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}.rec-actions .btn-lg{flex:1 1 8rem}.rec-actions .btn[hidden],.ws-side .btn[hidden]{display:none}.rec-stop-mark{width:.7em;height:.7em;border-radius:2px;background:var(--danger)}.rec-facts{min-height:1lh}.rec-hint{min-height:3lh;font-size:var(--text-xs);color:var(--ink-3)}.rec-progress[hidden]{display:none}.rec-progress-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:var(--text-sm);color:var(--ink-2)}.rec-note .btn,#rec-again,#rec-bubble-btn{justify-self:start}@media(prefers-reduced-motion:reduce){[data-state=recording] .rec-dot,.rec-count span.is-tick,#rec-live{animation:none}}