/* 음성 대화 모드 — calm full screen, large targets, works at phone width. */
#voice-mode{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px 16px;background:radial-gradient(circle at 50% 38%,#2c5446,#15291f 70%);color:#f3f0e2;text-align:center;overflow-y:auto}
#voice-mode[hidden]{display:none}
.vm-top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:14px 16px;font-weight:700;color:#cfe0d4}
#vm-close{background:transparent;color:#f3f0e2;border:1px solid #7fa391;border-radius:12px;padding:10px 16px;font:inherit;min-height:44px;cursor:pointer}
.vm-orb{position:relative;width:min(46vw,190px);aspect-ratio:1;margin-top:24px}
.vm-orb i{position:absolute;inset:0;border-radius:50%;background:#8fc7ad;opacity:.25;transform:scale(.7);transition:transform .4s ease,opacity .4s ease,background .4s ease}
.vm-orb i:nth-child(2){inset:12%;opacity:.45}.vm-orb i:nth-child(3){inset:26%;opacity:.95;background:#d8efe1}
#voice-mode[data-state=listening] .vm-orb i{animation:vm-breathe 2.4s ease-in-out infinite;background:#9fd8bd}
#voice-mode[data-state=listening] .vm-orb i:nth-child(2){animation-delay:.3s}
#voice-mode[data-state=thinking] .vm-orb i{background:#e3c98b;animation:vm-spin 1.6s linear infinite;border-radius:42% 58% 50% 50%}
#voice-mode[data-state=speaking] .vm-orb i{background:#f0d9a8;animation:vm-talk .7s ease-in-out infinite alternate}
#voice-mode[data-state=speaking] .vm-orb i:nth-child(2){animation-delay:.2s}
#voice-mode[data-state=paused] .vm-orb i,#voice-mode[data-state=idle] .vm-orb i{background:#9aa9a1}
@keyframes vm-breathe{0%,100%{transform:scale(.72)}50%{transform:scale(1)}}
@keyframes vm-talk{from{transform:scale(.78)}to{transform:scale(.95)}}
@keyframes vm-spin{to{transform:rotate(360deg) scale(.85)}}
#voice-mode-state{font-size:clamp(24px,5vw,32px);margin:6px 0 0}
#vm-hint{margin:0;color:#cfe0d4;max-width:30em;line-height:1.6}
.vm-caption{width:min(640px,100%);min-height:110px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:14px 18px;text-align:left}
.vm-caption small{color:#b8d1c3;font-weight:700}
#vm-text{margin:6px 0 0;font-size:clamp(17px,2.6vw,20px);line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;max-height:30vh;overflow-y:auto}
.vm-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:min(640px,100%)}
.vm-actions .btn{flex:1 1 200px;width:auto;margin:0;min-height:56px;font-size:17px}
#vm-talk{background:#e8c879;color:#1f2f27;box-shadow:0 3px 0 #a88a45}
#vm-pause{background:transparent;color:#f3f0e2;border:1px solid #7fa391}
.vm-note{max-width:640px;color:#aac2b5;line-height:1.6;margin:0}
#voice-mode button:focus-visible{outline:3px solid #ffe39a;outline-offset:3px}
body.voice-mode-on{overflow:hidden}
#voice-mode-open{font-weight:700}
@media(prefers-reduced-motion:reduce){#voice-mode .vm-orb i{animation:none!important;transition:none}}