.voice-pill{--vp-accent:#f5f5f5;--vp-icon:#a1a1aa;--vp-bg:#27272a;--vp-size:28px;--vp-radius:14px;--vp-reach:8px;--vp-extra:0px;--vp-clock-w:0px;--vp-wave-w:0px;--vp-slide:0px;--vp-cancel:0;--vp-stop:9px;--vp-icon-size:15px;--vp-time-size:10px;--vp-open:200ms;--vp-press:0.95;--vp-hit:8px;--vp-ease-out:cubic-bezier(0.23,1,0.32,1);position:relative;display:inline-grid;place-items:center;isolation:isolate;width:var(--vp-size);height:var(--vp-size);margin:0;padding:0;border:0;border-radius:var(--vp-radius);background:transparent;color:var(--vp-icon);font-family:inherit;cursor:pointer;outline:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:none;transition:transform .16s var(--vp-ease-out),color .15s ease}.voice-pill:before{content:"";position:absolute;inset:calc(-1 * var(--vp-hit))}.voice-pill[data-state=listening]{z-index:1;color:var(--vp-accent)}.voice-pill[data-pressed]{transform:scale(var(--vp-press))}.voice-pill:disabled{opacity:.55;cursor:default;pointer-events:none}.voice-pill__capsule{position:absolute;inset:0 0 0 calc(-1 * (var(--vp-reach) + var(--vp-extra)));border-radius:var(--vp-radius);background:var(--vp-bg);clip-path:inset(0 0 0 calc(var(--vp-reach) + var(--vp-extra)) round var(--vp-radius));pointer-events:none;transition:clip-path var(--vp-open) var(--vp-ease-out),background-color .15s ease}@media (hover:hover) and (pointer:fine){.voice-pill[data-state=idle]:not(:disabled):hover .voice-pill__capsule{background:color-mix(in srgb,var(--vp-icon) 10%,var(--vp-bg))}}.voice-pill[data-state=listening] .voice-pill__capsule{clip-path:inset(0 0 round var(--vp-radius))}.voice-pill__time{position:absolute;top:0;bottom:0;right:100%;display:grid;place-items:center;width:var(--vp-clock-w);box-sizing:border-box;color:var(--vp-accent);font-size:var(--vp-time-size);font-weight:500;font-variant-numeric:tabular-nums;line-height:1;opacity:0;filter:blur(2px);transform:translateX(var(--vp-slide));pointer-events:none;transition:opacity .2s ease,filter .2s ease,transform .24s var(--vp-ease-out)}.voice-pill[data-state=listening] .voice-pill__time{opacity:calc(1 - var(--vp-cancel));filter:blur(0)}.voice-pill__wave{position:absolute;top:18%;right:calc(100% + var(--vp-clock-w));width:var(--vp-wave-w);height:64%;opacity:0;filter:blur(2px);transform:translateX(var(--vp-slide));pointer-events:none;transition:opacity .2s ease,filter .2s ease,transform .24s var(--vp-ease-out)}.voice-pill[data-state=listening] .voice-pill__wave{opacity:calc(1 - var(--vp-cancel));filter:blur(0)}.voice-pill__cancel{position:absolute;top:0;bottom:0;right:100%;display:inline-flex;align-items:center;justify-content:center;gap:3px;width:var(--vp-extra);color:var(--vp-accent);font-size:var(--vp-time-size);font-weight:500;line-height:1;opacity:var(--vp-cancel);pointer-events:none}.voice-pill[data-sliding] .voice-pill__glyph,.voice-pill[data-sliding] .voice-pill__time,.voice-pill[data-sliding] .voice-pill__wave{transition-property:opacity,filter}.voice-pill__glyph{position:relative;display:grid;place-items:center;width:var(--vp-size);height:var(--vp-size);transform:translateX(var(--vp-slide));transition:transform .24s var(--vp-ease-out)}.voice-pill__glyph>*{grid-area:1/1;transition:opacity .2s ease,filter .2s ease,transform .2s var(--vp-ease-out)}.voice-pill__mic{display:inline-flex}.voice-pill__stop{width:var(--vp-stop);height:var(--vp-stop);border-radius:22%;background:currentColor;opacity:0;filter:blur(2px);transform:scale(.6)}.voice-pill[data-state=listening] .voice-pill__mic{opacity:0;filter:blur(2px);transform:scale(.7)}.voice-pill[data-state=listening] .voice-pill__stop{opacity:1;filter:blur(0);transform:scale(1)}.voice-pill[data-input=key] .voice-pill__capsule,.voice-pill[data-input=key] .voice-pill__glyph>*,.voice-pill[data-input=key] .voice-pill__time{transition-duration:0s}@media (prefers-reduced-motion:reduce){.voice-pill{transform:none!important;transition:color .15s ease}.voice-pill__capsule{transition:background-color .15s ease}.voice-pill__glyph>*{filter:none!important;transform:none!important;transition:opacity .2s ease}.voice-pill__glyph,.voice-pill__time,.voice-pill__wave{filter:none!important;transition-property:opacity}}