.realtime-voice-chat{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;color:#fff;display:flex;flex-direction:column;gap:1.5rem;margin:0 auto;max-width:500px;padding:1.5rem}.realtime-voice-header{align-items:center;display:flex;justify-content:space-between}.realtime-voice-header h2{font-size:1.5rem;font-weight:600;margin:0}.close-btn{background:#fff3;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:1.5rem;height:36px;transition:background .2s;width:36px}.close-btn:hover{background:#ffffff4d}.realtime-voice-config{background:#ffffff1a;border-radius:12px;display:flex;flex-direction:column;gap:1rem;padding:1rem}.config-section{display:flex;flex-direction:column;gap:.5rem}.config-section label{font-size:.9rem;font-weight:500}.config-section select{background:#fff;border:none;border-radius:8px;color:#333;cursor:pointer;font-size:1rem;padding:.75rem}.realtime-voice-status{min-height:40px}.status-badges{display:flex;flex-wrap:wrap;gap:.5rem}.badge{align-items:center;border-radius:20px;display:inline-flex;font-size:.85rem;font-weight:500;gap:.5rem;padding:.5rem 1rem}.badge-connected{background:#48bb78cc}.badge-listening{animation:pulse 2s infinite;background:#4299e1cc}.badge-speaking{background:#ed8936cc}.pulse-dot{animation:pulse-dot 1s infinite;background:#fff;border-radius:50%;height:8px;width:8px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes pulse-dot{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}.realtime-voice-controls{display:flex;flex-direction:column;gap:1rem}.main-control-btn{align-items:center;background:#fff;border:none;border-radius:12px;color:#667eea;cursor:pointer;display:flex;font-size:1.1rem;font-weight:600;gap:.75rem;justify-content:center;padding:1rem 2rem;transition:all .3s}.main-control-btn:hover{box-shadow:0 8px 16px #0003;transform:translateY(-2px)}.main-control-btn.connected{background:#fff3;color:#fff}.main-control-btn .icon{font-size:1.5rem}.interrupt-btn{align-items:center;background:#ffffff1a;border:2px solid #fff;border-radius:10px;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:500;gap:.5rem;justify-content:center;padding:.75rem 1.5rem;transition:all .2s}.interrupt-btn:hover{background:#fff3}.realtime-voice-transcript{background:#0003;border-radius:12px;max-height:200px;overflow-y:auto;padding:1rem}.realtime-voice-transcript h3{font-size:1rem;font-weight:500;margin:0 0 .5rem}.realtime-voice-transcript pre{margin:0;white-space:pre-wrap;word-wrap:break-word;font-family:Courier New,monospace;font-size:.9rem;line-height:1.5}.realtime-voice-error{background:#f56666e6;border-radius:10px;font-size:.95rem;padding:1rem}.realtime-voice-tips{background:#ffffff1a;border-radius:10px;font-size:.9rem;line-height:1.6;padding:1rem}.realtime-voice-tips p{margin:.5rem 0}@media (max-width:600px){.realtime-voice-chat{max-width:100%;padding:1rem}.realtime-voice-header h2{font-size:1.25rem}.main-control-btn{font-size:1rem;padding:.875rem 1.5rem}}
