.voice-stage{perspective:1200px}
.voice-orb{--orb-size:min(42vw,430px);width:var(--orb-size);isolation:isolate;overflow:visible;background:radial-gradient(circle at 35% 28%,rgba(255,248,208,.9) 0 1%,rgba(255,211,97,.26) 4%,transparent 17%),radial-gradient(circle at 50% 48%,rgba(196,129,18,.15),rgba(5,6,7,.9) 66%);border:1px solid rgba(255,220,132,.48);box-shadow:inset -35px -38px 70px rgba(0,0,0,.88),inset 22px 20px 55px rgba(255,211,97,.18),0 0 35px rgba(255,204,76,.36),0 0 110px rgba(163,100,8,.24);transform-style:preserve-3d;animation:orbFloat 6s ease-in-out infinite,orbBreathe 4.2s ease-in-out infinite;will-change:transform,filter,box-shadow}
.voice-orb::before,.voice-orb::after,.voice-orb>span{content:'';position:absolute;border-radius:50%;pointer-events:none}
.voice-orb::before{inset:2%;z-index:-1;background:url('images/aitalk-listening-orb.png') 50% 50%/178% no-repeat;border:1px solid rgba(255,230,160,.42);filter:contrast(1.28) brightness(1.08) saturate(.88);box-shadow:inset 18px 12px 35px rgba(255,227,147,.2),inset -35px -25px 55px rgba(0,0,0,.72);animation:orbSurface 20s linear infinite;mask-image:radial-gradient(circle,#000 55%,rgba(0,0,0,.82) 70%,transparent 73%)}
.voice-orb::after{inset:-7%;z-index:-2;border:1px solid rgba(229,175,57,.28);background:repeating-radial-gradient(circle,transparent 0 31%,rgba(255,205,88,.14) 31.4% 31.8%,transparent 32.2% 39%);box-shadow:0 0 65px rgba(231,177,53,.16);animation:orbHalo 13s linear infinite reverse}
.voice-orb>span{inset:11%;z-index:3;border:1px solid rgba(255,239,194,.2);background:linear-gradient(112deg,transparent 28%,rgba(255,250,220,.32) 43%,transparent 54%);mix-blend-mode:screen;animation:orbGlint 5.5s ease-in-out infinite}
.voice-orb:hover{filter:brightness(1.18);animation-play-state:paused;transform:translate(-50%,-52%) scale(1.035) rotateX(-3deg) rotateY(5deg)}
.voice-orb.listening{animation:orbListen 1.15s ease-in-out infinite;filter:brightness(1.22) saturate(1.2)}
.voice-orb.listening::before{animation-duration:5s;filter:contrast(1.35) brightness(1.35) saturate(1.1)}
.voice-orb.listening::after{animation-duration:3.5s;border-color:rgba(255,218,115,.65)}
.voice-orb.listening>span{animation-duration:1.6s}
@keyframes orbFloat{0%,100%{translate:0 -3px;rotate:x 0deg y -2deg}50%{translate:0 8px;rotate:x 2deg y 3deg}}
@keyframes orbBreathe{0%,100%{filter:brightness(.94)}50%{filter:brightness(1.12)}}
@keyframes orbSurface{to{transform:rotate(360deg) scale(1.025)}}
@keyframes orbHalo{to{transform:rotate(360deg) scale(1.04)}}
@keyframes orbGlint{0%,100%{transform:rotate(-25deg);opacity:.25}50%{transform:rotate(18deg);opacity:.9}}
@keyframes orbListen{0%,100%{transform:translate(-50%,-50%) scale(1);box-shadow:inset -35px -38px 70px rgba(0,0,0,.82),0 0 40px rgba(255,202,73,.5),0 0 100px rgba(188,116,9,.28)}50%{transform:translate(-50%,-50%) scale(1.055);box-shadow:inset -25px -25px 55px rgba(0,0,0,.7),0 0 80px rgba(255,220,125,.9),0 0 185px rgba(208,136,15,.48)}}
@media(max-width:800px){.voice-orb{--orb-size:min(78vw,350px)}}
@media(prefers-reduced-motion:reduce){.voice-orb,.voice-orb::before,.voice-orb::after,.voice-orb>span{animation:none!important}}