/* Stable 302 × 51 reference geometry; the initial bubble grows only to the right. */
.voice-pill{width:51px;isolation:isolate;transition:opacity .22s ease,visibility .22s,width .42s cubic-bezier(.22,.8,.25,1) .12s;overflow:visible}
.voice-pill.revealed{width:302px}
.voice-pill::before{content:"";position:absolute;inset:-3px;border-radius:inherit;z-index:-1;pointer-events:none;box-shadow:0 0 11px 3px #ded0ff66;opacity:.32;animation:voiceBreath 3s ease-in-out infinite}
.voice-pill::after{content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;opacity:0;background:linear-gradient(100deg,transparent 20%,#ffffff19 46%,#d9c6ff24 52%,transparent 76%);background-size:250% 100%;transition:opacity .35s;z-index:-1}
.voice-pill .orb{animation:orbBreath 3s ease-in-out -.7s infinite}
#voiceJourney{position:absolute;inset:0 52px 0 0;border:0;background:transparent;border-radius:inherit;cursor:pointer;padding:0}
#voiceMic{position:absolute;right:8px;top:3px;width:38px;height:43px;border:0;border-radius:50%;background:transparent;padding:0;cursor:pointer;opacity:0;transition:opacity .3s .35s,box-shadow .3s}
.voice-pill.revealed #voiceMic{opacity:1}
#voiceMic i{position:absolute;left:9px;right:auto;top:50%;width:20px;height:21px;transform:translateY(-50%)}
#voiceMic:focus-visible,#voiceJourney:focus-visible{outline:2px solid #fff9;outline-offset:2px}
.voice-pill #welcomeGreeting,.voice-pill #voiceThinking,.voice-pill #voiceWaves{position:absolute;left:60px;top:50%;transform:translateY(-50%);line-height:18px;pointer-events:none;transition:opacity .3s ease;white-space:nowrap}
#voiceThinking{font:500 13px Inter,Arial,sans-serif;letter-spacing:.2px;opacity:0}
.voice-pill #voiceWaves{width:137px;height:28px;display:flex;align-items:center;justify-content:center;gap:5px;opacity:0}
#voiceWaves b{display:block;width:3px;height:5px;border-radius:3px;background:#ffffffe0;box-shadow:0 0 3px #ffffff22}
.voice-pill[data-voice="listening"] #welcomeGreeting,.voice-pill[data-voice="processing"] #welcomeGreeting{opacity:0}
.voice-pill[data-voice="listening"] #voiceWaves{opacity:1;transition-delay:.2s}
.voice-pill[data-voice="processing"] #voiceThinking{opacity:1;transition-delay:.2s}
.voice-pill[data-voice="listening"] #voiceMic{box-shadow:0 0 12px 2px #ece0ff69;background:#ffffff0a}
.voice-pill[data-voice="listening"]::before{box-shadow:0 0 14px 4px #e8dfff80}
.voice-track{position:absolute;inset:0;width:302px;height:51px;pointer-events:none;opacity:0;overflow:visible;transition:opacity .4s}
.voice-track rect{fill:none;stroke:#fff;stroke-linecap:round;stroke-dasharray:9 91;animation:voiceOrbit 2s linear infinite}
.voice-track .trail{stroke:#d8c7ff;stroke-width:3;filter:blur(2px);stroke-dasharray:15 85;opacity:.65}
.voice-track .spark{stroke-width:1.3;stroke-dasharray:4 96}
.voice-pill[data-voice="processing"] .voice-track{opacity:.8}
.voice-pill[data-voice="processing"]::after{opacity:1;animation:voiceSheen 3s linear infinite}
.voice-pill[data-voice="complete"] .voice-track rect{animation-duration:3s}
.voice-pill[data-voice="complete"]::before{animation:voiceComplete .45s ease-out}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes voiceBreath{0%,100%{opacity:.26;filter:blur(1px);transform:scale(1)}50%{opacity:.52;filter:blur(3px);transform:scale(1.015,1.055)}}
@keyframes orbBreath{0%,100%{filter:brightness(.98)}50%{filter:brightness(1.13)}}
@keyframes voiceOrbit{to{stroke-dashoffset:-100}}
@keyframes voiceSheen{from{background-position:100% 0}to{background-position:-100% 0}}
@keyframes voiceComplete{0%{opacity:.35}40%{opacity:.75}100%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.voice-pill{transition:opacity .2s;width:302px}.voice-pill::before,.voice-pill .orb,.voice-track rect{animation:none}.voice-pill::after{animation:none!important}}

.voice-track rect{animation:none}
.voice-pill #voiceWaves{transition:opacity .3s ease,transform .3s ease}
.voice-pill[data-voice="processing"] #voiceWaves{transform:translateY(-50%) scaleY(.12)}

/* Listening light is shaped around the icon, never the hit target. */
#voiceMic,#voiceMic:hover,#voiceMic:focus,#voiceMic:focus-visible,.voice-pill[data-voice="listening"] #voiceMic{box-shadow:none;outline:none;background:transparent;border:0}
#voiceMic i img{transition:filter .35s ease}
.voice-pill[data-voice="listening"] #voiceMic i img{filter:drop-shadow(0 0 1px #fff) drop-shadow(0 0 2.5px #b9e8ffb3)}
#voiceMic:focus-visible i img{filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 3px #a1dfff)}
.voice-pill{border-color:#ffffffa6;box-shadow:inset 0 0 3px #ffffff70,0 0 1px .3px #ffffff70,0 0 5px 1px #e8dbff5c}
.voice-fog{position:absolute!important;inset:1px!important;width:auto!important;height:auto!important;transform:none!important;border-radius:inherit;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .4s ease;z-index:-1}
.voice-fog::before,.voice-fog::after{content:"";position:absolute;inset:-10px;filter:blur(5px);background:radial-gradient(ellipse 21px 12px at 86% 48%,#084bffeb 0%,#2765ffc7 28%,#537bff70 60%,transparent 100%),radial-gradient(ellipse 70px 13px at 76% 66%,#335bff99 0%,#6d89ff66 35%,#b0a1ec22 72%,transparent 100%);transform-origin:85% 55%;animation:voiceFog 3.4s ease-in-out infinite;animation-play-state:paused}
.voice-fog::after{background:radial-gradient(ellipse 64px 12px at 72% 74%,#2864ff70, #9fa5ff30 55%,transparent 100%);filter:blur(7px);animation-delay:-1.1s}
.voice-pill[data-voice="listening"] .voice-fog{opacity:1}
.voice-pill[data-voice="listening"] .voice-fog::before,.voice-pill[data-voice="listening"] .voice-fog::after{animation-play-state:running}
.voice-pill #voiceWaves{left:50%;transform:translate(-50%,-50%);gap:4px}
.voice-pill[data-voice="processing"] #voiceWaves{transform:translate(-50%,-50%) scaleY(.12)}
#voiceWaves b{box-shadow:none}
#voiceWaves b:nth-child(1),#voiceWaves b:nth-child(11){filter:blur(.65px);opacity:.65}
#voiceWaves b:nth-child(2),#voiceWaves b:nth-child(10){filter:blur(.4px);opacity:.8}
#voiceWaves b:nth-child(3),#voiceWaves b:nth-child(9){filter:blur(.18px);opacity:.92}
.voice-track .flow-segment{stroke:#f6eeff;stroke-width:1.3;stroke-dasharray:.85 99.15;stroke-linecap:round;filter:drop-shadow(0 0 1px #e4d1ffb3);animation:none}
.voice-track .flow-segment:first-child{stroke:#fff;stroke-width:1.5}
.voice-pill[data-voice="processing"] .voice-track{opacity:.75}
@keyframes voiceFog{0%,100%{transform:translate(3px,-2px) scale(.9,1.12) rotate(-8deg);opacity:.7}50%{transform:translate(-5px,3px) scale(1.12,.8) rotate(-13deg);opacity:1}}
@media(prefers-reduced-motion:reduce){.voice-fog::before,.voice-fog::after{animation:none}}