.tone-0{--tone-bg: #262c3a;--tone-fg: #a3b5e6}.tone-1{--tone-bg: #33262f;--tone-fg: #e3b2cb}.tone-2{--tone-bg: #21322c;--tone-fg: #98d4b8}.tone-3{--tone-bg: #352e22;--tone-fg: #e8c890}.tone-4{--tone-bg: #232f3b;--tone-fg: #92c8ef}.tone-5{--tone-bg: #2e2839;--tone-fg: #c9b1f1}.voice-wave{position:relative;display:block;height:42px;min-width:0}.voice-wave-row{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;gap:3px}.voice-wave-row i{flex:1 1 0;min-width:2px;height:calc(var(--h) * 100%);min-height:4px;background:currentColor;border-radius:var(--radius-pill);opacity:.55;transform-origin:center;transition:opacity .24s var(--motion-ease-out)}.voice-wave-row.is-played{clip-path:inset(0 calc((1 - var(--voice-progress, 0)) * 100%) 0 0)}.voice-wave-row.is-played i{opacity:1}.voice-wave.is-live i{animation:voice-wave-live .76s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -97ms)}.voice-glyph{display:grid;flex:0 0 auto;place-items:center;width:40px;height:40px;color:var(--tone-fg);background:var(--tone-bg);border-radius:12px}.voice-glyph-small{width:32px;height:32px;border-radius:10px}.voice-glyph-large{width:64px;height:64px;border-radius:18px}.voice-glyph svg{width:100%;height:100%}.voice-glyph rect{fill:currentColor;transform-box:fill-box;transform-origin:center}.voice-glyph.is-live rect{animation:voice-wave-live .64s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.14s)}.voice-yours-tag{display:inline-flex;flex:0 0 auto;justify-self:start;align-items:center;gap:4px;max-width:100%;height:20px;box-sizing:border-box;padding:0 7px 0 6px;color:var(--ink);background:color-mix(in srgb,var(--ink) 9%,transparent);border-radius:var(--radius-pill);font-size:11px;font-weight:600;line-height:1;white-space:nowrap}.voice-yours-tag svg{flex:0 0 auto;width:11px;height:11px;color:var(--accent-dark)}.voice-bars{display:inline-flex;flex:0 0 auto;align-items:center;gap:2px;height:14px}.voice-bars i{display:block;width:2.5px;height:100%;background:currentColor;border-radius:2px;transform-origin:center;animation:voice-bar .9s ease-in-out infinite}.voice-bars i:nth-child(2){animation-delay:-.3s}.voice-bars i:nth-child(3){animation-delay:-.6s}.voice-bars i:nth-child(4){animation-delay:-.15s}.voice-check{flex:0 0 auto;width:20px;height:20px;overflow:visible}.voice-check circle{fill:var(--accent-solid);transform-box:fill-box;transform-origin:center;animation:voice-check-pop .42s var(--motion-pop) both}.voice-check path{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:14;stroke-dashoffset:0;animation:voice-check-draw .32s var(--motion-ease-out) .14s both}.voice-current:not(.is-new) .voice-check circle,.voice-current:not(.is-new) .voice-check path{animation:none}@keyframes voice-wave-live{0%{transform:scaleY(.5)}to{transform:scaleY(1.08)}}@keyframes voice-bar{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes voice-check-pop{0%{transform:scale(.3);opacity:0}}@keyframes voice-check-draw{0%{stroke-dashoffset:14}}@media(prefers-reduced-motion:reduce){.voice-wave.is-live i,.voice-glyph.is-live rect,.voice-bars i{animation:none}.voice-bars i:nth-child(odd){transform:scaleY(.6)}.voice-check circle,.voice-check path{animation:none}}
