@layer components{.record-button{--record-button-ui-scale:2;--record-button-trans-dur:.3s;--record-button-trans-timing:cubic-bezier(.65,0,.35,1);--record-button-track:var(--card);--record-button-handle:#a4a4a4;--record-button-focus-ring:color-mix(in oklch,var(--primary)40%,transparent);--record-button-focus-ring-strong:var(--primary);--record-button-recording:#fb001c;--record-button-shadow:#0000001a;--record-button-timer-track:#ffffff4d;--record-button-timer-progress:#ffffff80;font-size:calc(1rem*var(--record-button-ui-scale));color:var(--muted-foreground);cursor:pointer;appearance:none;-webkit-tap-highlight-color:transparent;transition:background-color var(--record-button-trans-dur),color var(--record-button-trans-dur);background-color:#0000;border:0;outline:#0000;align-items:center;padding:0;line-height:1.5;display:inline-flex}@supports (color:lab(0% 0 0)){.record-button{--record-button-handle:lab(67.52% -.0000298023 0);--record-button-recording:lab(52.9346% 92.0451 83.1732)}}.record-button__label-end{text-align:start;min-width:3.25em;margin-inline:.5em 0;display:block;position:relative}.record-button__label-end-text{transition:opacity var(--record-button-trans-dur);opacity:.4}.record-button__label-end-action{align-items:center;gap:.35em;display:inline-flex}.record-button__label-icon{flex-shrink:0;width:.9em;height:.9em}.record-button__label-end-text+.record-button__label-end-text{opacity:0;position:absolute;top:0;left:0}[dir=rtl] .record-button__label-end-text+.record-button__label-end-text{left:auto;right:0}.record-button__switch{background-color:var(--record-button-track);box-shadow:0 0 0 .125em var(--record-button-focus-ring),0 .25em .25em var(--record-button-shadow);box-sizing:border-box;width:2.5em;height:1.5em;transition:background-color var(--record-button-trans-dur),box-shadow var(--record-button-trans-dur);border-radius:.75em;flex-shrink:0;align-items:center;padding:.25em;display:flex}.record-button__switch,.record-button__switch-handle{transition:background-color var(--record-button-trans-dur),box-shadow var(--record-button-trans-dur),transform var(--record-button-trans-dur)var(--record-button-trans-timing),transform-origin var(--record-button-trans-dur)var(--record-button-trans-timing)}.record-button__switch-handle{background-color:var(--record-button-handle);transform-origin:0 .5em;border-radius:50%;flex-shrink:0;width:1em;min-width:1em;height:1em;min-height:1em;display:block;overflow:visible;transform:translate(0)}[dir=rtl] .record-button__switch-handle{transform-origin:100% .5em}.record-button__timer{width:100%;height:auto;display:block;overflow:visible}.record-button__timer-ring{fill:none;stroke-width:2px;transition:r var(--record-button-trans-dur)var(--record-button-trans-timing),stroke var(--record-button-trans-dur)var(--record-button-trans-timing),stroke-dasharray var(--record-button-trans-dur)var(--record-button-trans-timing),stroke-dashoffset var(--record-button-trans-dur)var(--record-button-trans-timing),stroke-width var(--record-button-trans-dur)var(--record-button-trans-timing)}.record-button__timer-ring--track{stroke:var(--record-button-timer-track)}.record-button__timer-ring--progress{stroke:var(--record-button-timer-progress);transition:none}.record-button[aria-pressed=true] .record-button__timer-ring--progress{transition:r var(--record-button-trans-dur)var(--record-button-trans-timing),stroke var(--record-button-trans-dur)var(--record-button-trans-timing),stroke-width var(--record-button-trans-dur)var(--record-button-trans-timing)}.record-button:focus-visible .record-button__switch{box-shadow:0 0 0 .125em var(--record-button-focus-ring-strong),0 .25em .25em var(--record-button-shadow)}.record-button:active:not([aria-pressed=true]) .record-button__switch-handle{transform:scaleX(1.5)}.record-button[aria-pressed=true] .record-button__label-end-text{opacity:0}.record-button[aria-pressed=true] .record-button__label-end-text+.record-button__label-end-text{opacity:1}.record-button[aria-pressed=true]{--record-button-recording:#fb001c;--record-button-timer-track:#ffffff4d;--record-button-timer-progress:#ffffff80}@supports (color:lab(0% 0 0)){.record-button[aria-pressed=true]{--record-button-recording:lab(52.9346% 92.0451 83.1732)}}.dark .record-button[aria-pressed=true]{--record-button-recording:#ff3c43}@supports (color:lab(0% 0 0)){.dark .record-button[aria-pressed=true]{--record-button-recording:lab(58.942% 85.7881 57.0715)}}.record-button[aria-pressed=true] .record-button__switch-handle{background-color:var(--record-button-recording);transform-origin:100% .5em;transform:translate(100%)}[dir=rtl] .record-button[aria-pressed=true] .record-button__switch-handle{transform-origin:0 .5em;transform:translate(-100%)}.record-button[aria-pressed=true] .record-button__timer-ring--progress{stroke-width:4.5px}.record-button[aria-pressed=true]:active .record-button__switch-handle{transform:translate(100%)scaleX(1.5)}[dir=rtl] .record-button[aria-pressed=true]:active .record-button__switch-handle{transform:translate(-100%)scaleX(1.5)}.dark .record-button{color:var(--foreground);--record-button-track:var(--secondary);--record-button-handle:#717171;--record-button-shadow:#0003;--record-button-timer-track:var(--record-button-handle);--record-button-timer-progress:color-mix(in oklch,var(--record-button-handle)88%,white)}@supports (color:lab(0% 0 0)){.dark .record-button{--record-button-handle:lab(47.8% 0 .0000119209)}}.dark .record-button__switch{box-shadow:0 0 0 .125em var(--record-button-focus-ring),0 .25em .25em var(--record-button-shadow)}.dark .record-button:focus-visible .record-button__switch{box-shadow:0 0 0 .125em var(--record-button-focus-ring-strong),0 .25em .25em var(--record-button-shadow)}}