.rec-meter{background:var(--sheet-rule);border-radius:3px;block-size:6px;inline-size:100%;position:relative;overflow:hidden}.rec-meter:after{content:"";background:repeating-linear-gradient(90deg, transparent 0 calc(4.16667% - 2px), var(--sheet) calc(4.16667% - 2px) 4.16667%);position:absolute;inset:0}.rec-meter__fill{background:var(--accent);transform-origin:0;position:absolute;inset:0;transform:scaleX(0)}.rec-meter__peak{background:var(--ink);inline-size:2px;margin-inline-start:-2px;position:absolute;inset-block:0}[dir=rtl] .rec-meter__fill{transform-origin:100%}.rec-primary{min-inline-size:8.5rem}.rec-primary__glyph{block-size:.75rem;inline-size:.75rem;transition:border-radius var(--duration) var(--ease-out), transform var(--duration) var(--ease-out);background:currentColor;border-radius:50%;flex:none}:is([data-state=recording],[data-state=paused],[data-state=saving]) .rec-primary__glyph{border-radius:2px;transform:scale(.92)}.rec-group{gap:var(--space-2);border:0;min-inline-size:0;margin:0;padding:0;display:grid}.rec-group .check{min-block-size:1.75rem}.rec-keys{justify-content:center;gap:var(--space-2) var(--space-5);color:var(--ink-3);font-size:var(--text-sm);flex-wrap:wrap;display:flex}@media (hover:none) and (pointer:coarse){.rec-keys{display:none}}.rec-keys__key{min-inline-size:1.5rem;padding:0 var(--space-2);border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--paper);box-shadow:inset 0 -1px 0 var(--line-strong);color:var(--ink-2);font-family:inherit;font-size:var(--text-xs);text-align:center;margin-inline-end:var(--space-1);font-weight:600;line-height:1.6;display:inline-block}.rec-dot{background:var(--line-strong);block-size:.5rem;inline-size:.5rem;transition:background-color var(--duration) var(--ease-out);border-radius:50%;flex:none}[data-state=recording] .rec-dot{background:var(--accent);animation:rec-beat 1.6s var(--ease-in-out) infinite}[data-state=paused] .rec-dot{background:var(--ink-3)}@keyframes rec-beat{50%{opacity:.3}}.screen{gap:var(--space-3);display:grid}@media (min-width:64rem){.screen{gap:var(--space-4)}.screen__workspace{align-items:start}}.screen__body{flex:1;align-content:start}.screen__unsupported p{margin:0}.screen__sub{gap:var(--space-2);padding-inline-start:1.625rem;display:grid}.screen__formats{gap:var(--space-2);display:grid}.screen__options .sheet__body{align-content:start;gap:var(--space-5);flex:1}.screen-stage{--stage-ground:#15141f;aspect-ratio:16/9;border:1px solid var(--sheet-rule);border-radius:var(--radius);background:var(--paper);place-items:center;min-block-size:13rem;inline-size:100%;display:grid;position:relative;overflow:hidden}.screen:is([data-state=countdown],[data-state=recording],[data-state=paused],[data-state=saving],[data-state=done]) .screen-stage{background:var(--stage-ground);border-color:#0000}.screen-stage__idle{justify-items:center;gap:var(--space-2);max-inline-size:26rem;padding:var(--space-6);text-align:center;display:grid}.screen-stage__icon{block-size:2rem;inline-size:2rem;color:var(--accent);margin-block-end:var(--space-1)}.screen-stage__title{font-family:var(--font-display);font-size:var(--text-lg);margin:0;font-weight:500}.screen-stage__text{color:var(--ink-2);font-size:var(--text-sm);margin:0}.screen-stage__video{object-fit:contain;background:var(--stage-ground);block-size:100%;inline-size:100%;position:absolute;inset:0}.screen-stage__badge{align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);background:var(--sheet);box-shadow:var(--shadow-sheet);color:var(--ink);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;margin:0;font-weight:650;display:inline-flex;position:absolute;inset-block-start:var(--space-3);inset-inline-start:var(--space-3)}.screen-stage__countdown{background:#15141f8c;place-items:center;display:grid;position:absolute;inset:0}.screen-stage__count{aspect-ratio:1;background:var(--sheet);inline-size:clamp(5rem,22%,8rem);box-shadow:var(--shadow-pop);color:var(--accent);font-family:"Literata Variable", var(--font-display);border-radius:50%;place-items:center;font-size:clamp(2.5rem,1.6rem + 3.6vw,4rem);font-weight:500;line-height:1;display:grid}.screen-stage__count.is-pressed{animation:count-press var(--duration-slow) var(--ease-out)}.screen-stage__cam{aspect-ratio:1;background:var(--stage-ground);inline-size:clamp(4.5rem,20%,8rem);box-shadow:0 0 0 3px var(--sheet), var(--shadow-pop);border-radius:50%;position:absolute;inset-block-end:var(--space-3);inset-inline-end:var(--space-3);overflow:hidden}.screen-stage__cam-video{object-fit:cover;block-size:100%;inline-size:100%;transform:scaleX(-1)}@keyframes count-press{0%{opacity:.2;transform:scale(1.35)rotate(-6deg)}60%{opacity:1;transform:scale(.96)rotate(-1deg)}to{transform:scale(1)}}.screen-stats{grid-template-columns:repeat(3,minmax(0,1fr));margin:0;display:grid}.screen-stats__item{min-inline-size:0;padding-inline:var(--space-4);border-inline-start:1px solid var(--sheet-rule);gap:2px;display:grid}.screen-stats__item:first-child{border-inline-start:0;padding-inline-start:0}.screen-stats dt{color:var(--ink-2);font-size:var(--text-sm)}.screen-stats dd{color:var(--ink);font-family:"Literata Variable", var(--font-display);font-size:var(--text-md);overflow-wrap:anywhere;margin:0;font-weight:600}@media (min-width:40rem){.screen-stats dd{font-size:var(--text-lg)}}.screen[data-state=recording] .screen-stats__item:first-child dd{color:var(--accent)}.screen-next{gap:var(--space-2) var(--space-6);flex-wrap:wrap;display:flex}.screen-next__link{align-items:center;gap:var(--space-2);min-block-size:2rem;color:var(--accent);font-weight:600;text-decoration:none;display:inline-flex}.screen-next__link .icon--directional{transition:transform var(--duration-fast) var(--ease-out)}@media (hover:hover){.screen-next__link:hover .icon--directional{transform:translate(3px)}}[dir=rtl] .screen-next__link:hover .icon--directional{transform:scaleX(-1)translate(3px)}.screen-phone__intro{color:var(--ink-2);margin:0}.screen-phone__list{gap:var(--space-4);margin:0;padding:0;list-style:none;display:grid}.screen-phone__item{gap:var(--space-3);grid-template-columns:auto minmax(0,1fr);align-items:start;display:grid}.screen-phone__item p{margin:var(--space-1) 0 0;color:var(--ink-2)}.screen-phone__icon{block-size:1.5rem;inline-size:1.5rem;color:var(--accent)}.screen-phone__name{font-family:var(--font-display);font-size:var(--text-md);margin:0;font-weight:500}