html{height:100%;overflow:hidden}:root{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:#111;background-color:#f5f5f5;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--color-gray-50: #f9fafb;--color-gray-100: #f3f4f6;--color-gray-200: #e5e7eb;--color-gray-300: #d1d5db;--color-gray-400: #9ca3af;--color-gray-500: #6b7280;--color-gray-600: #4b5563;--color-gray-700: #374151;--color-gray-800: #1f2937;--color-gray-900: #111827}*{box-sizing:border-box}button,select,input,a,[role=button],label{touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.05)}body{margin:0;height:100vh;height:100dvh;overflow:hidden;background:#f5f5f5}.page{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}.compact-header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#fff;border-bottom:1px solid var(--color-gray-200);gap:12px;flex-shrink:0}.header-left{display:flex;align-items:center;gap:8px;position:relative}.header-center{display:flex;align-items:center;gap:6px;font-size:14px}.room-label{color:var(--color-gray-500);display:none}@media(min-width:480px){.room-label{display:inline}}.room-link{color:var(--color-primary);text-decoration:none;font-weight:600;font-family:SF Mono,Monaco,Inconsolata,monospace}.room-link:hover{text-decoration:underline}.room-id{font-weight:600;font-family:SF Mono,Monaco,Inconsolata,monospace;color:var(--color-gray-700)}.copy-link-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;border-radius:6px;background:var(--color-gray-100);color:var(--color-gray-500);cursor:pointer;transition:all .15s;margin-left:4px}.copy-link-btn:hover{background:var(--color-gray-200);color:var(--color-gray-700)}.copy-link-btn svg{flex-shrink:0}.header-right{display:flex;align-items:center;gap:8px}.header-output-anchor{position:relative}.header-output-dropdown{left:auto;right:0}.output-combined-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:6px;font-size:12px;font-weight:500;border:none;cursor:pointer;background:var(--color-gray-100);color:var(--color-gray-700);font-family:inherit;max-width:min(260px,44vw)}.output-combined-badge:hover{background:var(--color-gray-200)}.output-combined-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.output-tts-icon{flex-shrink:0;opacity:.85}.icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;border-radius:8px;background:transparent;color:var(--color-gray-600);cursor:pointer;transition:background-color .15s,color .15s}.icon-btn:hover{background:var(--color-gray-100);color:var(--color-gray-900)}.status-badges{display:flex;align-items:center;gap:6px}.status-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;font-size:12px;font-weight:500;border:none;cursor:pointer;transition:all .15s}.language-badge{background:var(--color-gray-100);color:var(--color-gray-700)}.language-badge:hover{background:var(--color-gray-200)}.tts-badge{background:var(--color-primary);color:#fff;padding:4px 6px}.tts-badge:hover{background:var(--color-primary-hover)}.tts-lag-badge{background:var(--color-gray-100);color:var(--color-gray-800);padding:4px 8px;cursor:help;font-size:11px;font-weight:500;max-width:min(420px,70vw);white-space:normal;text-align:left}.tts-lag-badge strong{font-weight:700}.cost-badge{background:#10b9811a;color:#059669;padding:4px 8px;cursor:help;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Monaco,Consolas,monospace;font-size:11px}.cost-badge:hover{background:#10b98133}.cost-badge.active{background:#10b98126;color:#059669}.auto-badge{background:#8b5cf6;color:#fff;padding:4px 8px}.auto-badge:hover{background:#7c3aed}.auto-badge.speaking{animation:pulse-badge 1s ease-in-out infinite}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.7}}.connection-badge{background:var(--color-gray-100);color:var(--color-gray-600);cursor:default}.connection-badge.connected{background:#10b9811a;color:var(--color-success)}.connection-badge.recording{background:#ef44441a;color:var(--color-danger)}.connection-badge.reconnecting{background:#f59e0b1a;color:var(--color-warning)}.connection-badge.auto-translate{background:#8b5cf61a;color:#8b5cf6}.connection-badge.clickable{cursor:pointer;border:none;font-family:inherit;font-size:inherit;transition:all .15s ease}.connection-badge.clickable:hover{background:#ef444433;transform:scale(1.02)}.recorder-badge{background:#8b5cf61a;color:#8b5cf6;cursor:default}.recorder-badge.recording{background:#ef444426;color:#ef4444;animation:pulse-badge 1.5s ease-in-out infinite}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.recording .status-dot{animation:pulse 1s ease-in-out infinite}.status-text{display:none}@media(min-width:640px){.status-text{display:inline}}.audio-meter-small{width:40px;height:6px;background:var(--color-gray-200);border-radius:3px;overflow:hidden}.audio-meter-fill{height:100%;background:linear-gradient(to right,var(--color-success),var(--color-warning),var(--color-danger));transition:width .05s linear}.dropdown-menu{position:absolute;top:100%;left:0;margin-top:4px;background:#fff;border:1px solid var(--color-gray-200);border-radius:10px;box-shadow:0 10px 40px #00000026;min-width:200px;z-index:100;padding:6px}.dropdown-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;background:transparent;border:none;border-radius:6px;color:var(--color-gray-700);font-size:14px;font-weight:500;cursor:pointer;text-align:left}.dropdown-menu button:hover{background:var(--color-gray-100)}.dropdown-menu button:disabled{opacity:.5;cursor:not-allowed}.dropdown-menu button svg{flex-shrink:0;color:var(--color-gray-500)}.active-languages-bar{padding:6px 16px;background:#10b9810d;border-bottom:1px solid rgba(16,185,129,.1);font-size:12px;color:var(--color-gray-600)}.active-languages-bar-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px}.readers-bar-left{flex:1;min-width:0}.readers-bar-placeholder{padding:6px 4px;color:var(--color-gray-400);font-style:italic}.readers-bar-tts{display:flex;align-items:center;gap:6px;flex-shrink:0;position:relative;max-width:min(340px,46vw)}.readers-bar-tts-metrics{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;min-height:28px;font-variant-numeric:tabular-nums}.readers-bar-tts-live{display:inline-flex;align-items:center;flex-wrap:wrap;min-width:0;min-height:1.25em}.readers-bar-tts-label{font-weight:600;color:var(--color-gray-500);font-size:11px;text-transform:uppercase;letter-spacing:.04em}.readers-bar-tts-numbers{color:var(--color-gray-700);font-size:12px}.readers-bar-tts-numbers strong{font-weight:700;color:var(--color-gray-900)}.readers-bar-tts-idle{color:var(--color-gray-400);font-size:12px}.readers-bar-tts-syncing{color:var(--color-primary);font-size:12px;font-weight:500}.touch-help-btn{flex-shrink:0;width:22px;height:22px;padding:0;border-radius:999px;border:1px solid var(--color-gray-300);background:#fff;color:var(--color-gray-500);font-size:12px;font-weight:700;line-height:1;cursor:pointer}.touch-help-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.touch-help-popover{position:absolute;top:calc(100% + 6px);right:0;z-index:105;max-width:min(280px,85vw);padding:10px 12px;font-size:12px;line-height:1.45;color:var(--color-gray-700);background:#fff;border:1px solid var(--color-gray-200);border-radius:10px;box-shadow:0 10px 30px #0000001f;outline:none}.touch-help-popover-title{margin:0 0 8px;font-size:13px;font-weight:600;color:var(--color-gray-900)}.touch-help-popover:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.active-languages-bar--collapsed{padding-top:4px;padding-bottom:4px}.readers-bar-toggle{display:flex;align-items:center;gap:8px;width:100%;padding:6px 4px;margin:0;border:none;background:transparent;font:inherit;color:inherit;cursor:pointer;text-align:left;border-radius:8px}.readers-bar-toggle:hover{background:#10b98114}.readers-bar-summary{flex:1;min-width:0}.readers-bar-preview{color:var(--color-gray-500);font-weight:400}.readers-bar-chevron{flex-shrink:0;color:var(--color-gray-400);transition:transform .15s ease}.readers-bar-chevron.expanded{transform:rotate(180deg)}.readers-bar-detail{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 4px 8px 28px;border-top:1px solid rgba(16,185,129,.12);margin-top:2px}.active-dot{width:6px;height:6px;border-radius:50%;background:var(--color-success);flex-shrink:0}.reader-count{color:var(--color-gray-400)}.main-content{display:grid;gap:12px;flex:1;min-height:0;overflow:hidden;padding:12px 16px}.main-content.with-metrics{grid-template-columns:1fr}@media(min-width:1024px){.main-content.with-metrics{grid-template-columns:2fr 1fr}}.main-content.no-metrics{grid-template-columns:1fr}.column{background:#fff;padding:12px;border-radius:12px;box-shadow:0 1px 4px #00000014;display:flex;flex-direction:column;min-height:0;overflow:hidden}.narrow{min-width:280px}.column-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex-shrink:0}.column-header h3{margin:0;font-size:16px;font-weight:600;color:var(--color-gray-900)}.column-header-split{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.column-header-split h3{display:flex;align-items:center;gap:6px}.pair-column-header{flex-direction:column;align-items:stretch;gap:6px}.pair-column-header-top{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.col-source-picker{flex-shrink:0;width:min(200px,52vw);min-width:min(200px,52vw);max-width:min(200px,52vw)}.col-source-picker .lai-lang-select__value-container{width:100%}.column-header-split h3>.col-source-picker{flex-shrink:0}.settings-lang-combobox{width:100%}.col-label-source{color:var(--color-gray-700)}.col-label-sep{color:var(--color-gray-400);font-weight:400}.col-lang-picker{padding:2px 8px;border-radius:6px;border:1px solid var(--color-gray-300);background:var(--color-gray-50);color:var(--color-gray-700);font-size:13px;font-weight:500;cursor:pointer}.col-lang-picker:hover{border-color:var(--color-primary)}.status{font-size:12px;color:var(--color-gray-500)}.scroll{flex:1;overflow:auto;border:1px solid var(--color-gray-200);border-radius:10px;padding:8px;background:var(--color-gray-50)}.pair-row{display:flex;flex-direction:column;gap:0;margin-bottom:12px;background:#fff;border-radius:10px;border:1px solid var(--color-gray-200);overflow:hidden}@media(min-width:768px){.pair-row{display:grid;grid-template-columns:1fr 1fr;gap:0}}.pair-row .block{margin-bottom:0;border-radius:0;border:none;border-bottom:1px solid var(--color-gray-100)}@media(min-width:768px){.pair-row .block{border-bottom:none}.pair-row .block:first-child{border-right:1px solid var(--color-gray-100)}}.pair-row .block:last-child{border-bottom:none;background:var(--color-gray-50)}@media(min-width:768px){.pair-row .block:last-child{background:#fff}}.pair-column .block{min-height:64px}.buffer-text{font-size:1rem;color:var(--color-warning);line-height:1.5;margin-top:4px}.pair-row.in-progress{border-color:var(--color-warning);border-style:dashed}.pair-row.tts-speaking{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb33;background:#eff6ffb3}.pair-row.pending-approval{border-left:3px solid #f59e0b;background:#fffbeb99}.pending-approval-bar{display:flex;align-items:center;gap:10px;padding:6px 12px;font-size:13px;color:#92400e;background:#fef3c7;border-bottom:1px solid #fde68a;flex-shrink:0}.pending-approval-bar span{flex:1;font-weight:500}.approve-btn,.reject-btn{padding:2px 8px;font-size:11px;border:none;border-radius:4px;cursor:pointer;font-weight:500}.approve-btn{background:#16a34a;color:#fff}.approve-btn:hover:not(:disabled){background:#15803d}.reject-btn{background:#dc2626;color:#fff}.reject-btn:hover:not(:disabled){background:#b91c1c}.approve-btn:disabled,.reject-btn:disabled{opacity:.4;cursor:not-allowed}.action-btn.mode-btn.approval{background:#f59e0b;color:#fff;border-color:#d97706}.action-btn.mode-btn.approval:hover{background:#d97706}@keyframes approval-pulse{0%,to{box-shadow:0 0 #f59e0b66}50%{box-shadow:0 0 0 4px #f59e0b00}}.action-btn.mode-btn.approval.has-pending{animation:approval-pulse 2s ease-in-out infinite}.action-btn.mode-btn.auto-match{border-color:#38bdf873;background:#38bdf81a;color:#7dd3fc}.action-btn.mode-btn.auto-match:hover:not(:disabled){background:#38bdf82e}.canned-auto-match-admin-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.85rem;color:#64748b;padding:0 4px 8px}.canned-text-auto-match{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:.85rem;color:#475569;cursor:pointer}.reviewing-indicator{font-size:11px;font-weight:600;color:#f59e0b;text-transform:uppercase;letter-spacing:.05em;margin-left:8px}.in-progress-gathering-meta{flex-wrap:wrap;justify-content:space-between;gap:8px}.in-progress-gathering-clear{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;font-size:11px;color:var(--color-gray-700);background:var(--color-gray-100);border:1px solid var(--color-gray-300);border-radius:6px;cursor:pointer}.in-progress-gathering-clear:hover:not(:disabled){background:var(--color-gray-200)}.in-progress-gathering-clear:disabled{opacity:.45;cursor:not-allowed}.in-progress-gathering-clear-label{font-weight:500}.translation-pending-hint{color:var(--color-gray-600);line-height:1.45}.block{padding:12px;font-size:1rem;line-height:1.5}.block .meta{font-size:11px;color:var(--color-gray-500);margin-bottom:6px;display:flex;align-items:center;gap:8px}.pipeline-timing-help-wrap{position:relative;margin-left:4px;flex-shrink:0}.pipeline-timing-meta-row{align-items:flex-start!important;flex-wrap:wrap}.pipeline-timing-panel{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1 1 220px}.pipeline-timing-header{display:flex;align-items:baseline;gap:8px}.pipeline-timing-number{font-weight:600;color:var(--color-gray-700)}.pipeline-timing-committed{color:var(--color-gray-600)}.pipeline-timing-metrics{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}.pipeline-timing-metrics-line{color:var(--color-gray-700)}.pipeline-timing-anchor-note{font-style:italic;color:var(--color-gray-400)}.pipeline-timing-bar{display:flex;width:100%;max-width:420px;height:6px;border-radius:999px;overflow:hidden;background:var(--color-gray-200)}.pipeline-timing-segment{min-width:2px;height:100%}.pipeline-timing-segment--speaking{background:#6366f1}.pipeline-timing-segment--block_cut{background:#f59e0b}.pipeline-timing-segment--translate{background:#22c55e}.pipeline-timing-segment--tts{background:#94a3b8;opacity:.85}.pipeline-timing-bar-legend{display:flex;flex-wrap:wrap;gap:8px;max-width:420px}.pipeline-timing-legend-item{font-size:10px;line-height:1.3}.pipeline-timing-legend-item--speaking{color:#6366f1}.pipeline-timing-legend-item--block_cut{color:#d97706}.pipeline-timing-legend-item--translate{color:#16a34a}.pipeline-timing-legend-item--tts{color:#64748b}.pipeline-timing-milestones{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;max-width:420px;font-size:10px;line-height:1.35;color:var(--color-gray-500)}.pipeline-timing-milestone{white-space:nowrap}.pipeline-timing-overlap{font-size:10px;line-height:1.35;font-style:italic;color:var(--color-gray-500);max-width:420px}.speak-btn{padding:2px 6px;font-size:11px;background:var(--color-primary);color:#fff;border:none;border-radius:4px;cursor:pointer}.speak-btn:hover{background:var(--color-primary-hover)}.bottom-action-bar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;flex-shrink:0;gap:8px;padding:12px 16px;padding-bottom:max(12px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--color-gray-200);box-shadow:0 -4px 20px #00000014;z-index:50}.action-divider{width:1px;height:32px;background:var(--color-gray-200);margin:0 4px}@media(max-width:500px){.action-divider{display:none}.bottom-action-bar{gap:6px}.action-btn span{display:none}.action-btn{padding:10px 12px}}@media(max-width:900px)and (orientation:portrait){.bottom-action-bar .action-btn span{display:none}.bottom-action-bar{gap:6px}.compact-header .output-combined-badge{max-width:min(200px,40vw)}.compact-header .header-center{font-size:13px}}@media(max-height:520px){.compact-header{padding:6px 12px}.active-languages-bar{padding-top:2px;padding-bottom:2px}}.action-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 16px;min-height:44px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s;background:var(--color-gray-100);color:var(--color-gray-700)}.action-btn:hover:not(:disabled){background:var(--color-gray-200)}.action-btn:disabled{opacity:.5;cursor:not-allowed}.action-btn.primary{background:var(--color-primary);color:#fff}.action-btn.primary:hover:not(:disabled){background:var(--color-primary-hover)}.action-btn.mode-btn{background:var(--color-gray-100);color:var(--color-gray-700);border:2px solid var(--color-gray-300)}.action-btn.mode-btn:hover:not(:disabled){background:var(--color-gray-200);border-color:var(--color-gray-400)}.action-btn.mode-btn.auto{background:#8b5cf61a;color:#7c3aed;border-color:#8b5cf666}.action-btn.mode-btn.auto:hover:not(:disabled){background:#8b5cf633}.action-btn.mode-btn.manual{background:#10b9811a;color:#059669;border-color:#10b98166}.action-btn.mode-btn.manual:hover:not(:disabled){background:#10b98133}.action-btn.start-btn:not(:disabled){background:var(--color-success);color:#fff}.action-btn.start-btn:hover:not(:disabled){background:#059669}.action-btn.start-btn.active{background:var(--color-gray-300);color:var(--color-gray-500)}.action-btn.stop-btn:not(:disabled){background:var(--color-danger);color:#fff}.action-btn.stop-btn:hover:not(:disabled){background:#dc2626}.action-btn.stop-btn.speaking{animation:pulse-stop 1.5s ease-in-out infinite}@keyframes pulse-stop{0%,to{box-shadow:0 0 #ef444466}50%{box-shadow:0 0 0 8px #ef444400}}.source-lang-select{padding:6px 10px;border-radius:8px;border:1px solid var(--color-gray-300);background:var(--color-gray-100);color:var(--color-gray-700);font-size:13px;font-weight:500;cursor:pointer;max-width:140px}.source-lang-select:hover{border-color:var(--color-primary);background:var(--color-gray-200)}@media(max-width:500px){.source-lang-select{max-width:80px;padding:6px 4px;font-size:12px}}.action-btn.auto-btn{background:var(--color-gray-100);color:var(--color-gray-600)}.action-btn.auto-btn:hover:not(:disabled){background:var(--color-gray-200)}.action-btn.auto-btn.active{background:#8b5cf6;color:#fff}.action-btn.auto-btn.active:hover:not(:disabled){background:#7c3aed}.action-btn.auto-btn.active.speaking{background:#8b5cf6;animation:pulse-speaking 1s ease-in-out infinite}@keyframes pulse-speaking{0%,to{box-shadow:0 0 #8b5cf666}50%{box-shadow:0 0 0 8px #8b5cf600}}.action-btn svg{flex-shrink:0}.btn-label-desktop{display:none}@media(min-width:480px){.btn-label-desktop{display:inline}}.spinner{animation:spin 1s linear infinite}.remote-label{font-size:11px;color:var(--color-gray-500);text-transform:uppercase;letter-spacing:.5px;margin-right:-4px}.recorder-not-connected{font-size:12px;color:var(--color-gray-400);font-style:italic;padding:4px 8px}.open-recorder-btn{background:#4a90d9!important;color:#fff!important;text-decoration:none}.open-recorder-btn:hover{background:#3a7bc8!important}.action-btn.remote-start-btn{background:#8b5cf61a;color:#8b5cf6;border:1px solid rgba(139,92,246,.3)}.action-btn.remote-start-btn:hover:not(:disabled){background:#8b5cf633;border-color:#8b5cf6}.action-btn.remote-stop-btn{background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.action-btn.remote-stop-btn:hover:not(:disabled){background:#ef444433;border-color:#ef4444}.action-btn.remote-flush-btn{background:#3b82f61a;color:#3b82f6;border:1px solid rgba(59,130,246,.3)}.action-btn.remote-flush-btn:hover:not(:disabled){background:#3b82f633;border-color:#3b82f6}.inline-recorder-status{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--color-gray-500);padding:0 8px}.inline-recorder-status .spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.action-btn.enable-mic-btn{background:#3b82f61a;color:#3b82f6;border:1px solid rgba(59,130,246,.3)}.action-btn.enable-mic-btn:hover:not(:disabled){background:#3b82f633;border-color:#3b82f6}.inline-audio-level{width:48px;height:8px;background:var(--color-gray-200);border-radius:4px;overflow:hidden;margin-left:4px}.inline-audio-level-fill{height:100%;background:linear-gradient(90deg,#22c55e,#84cc16);transition:width .1s ease-out}.inline-audio-level.input-hot .inline-audio-level-fill{background:linear-gradient(90deg,#f59e0b,#ef4444)}.inline-monitor-btn{font-size:11px;padding:2px 8px;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:#ffffff0d;color:#94a3b8;cursor:pointer;font-weight:500;white-space:nowrap}.inline-monitor-btn:hover:not(:disabled){background:#ffffff1a;color:#e2e8f0}.inline-monitor-btn.active{border-color:#3b82f673;color:#3b82f6;background:#3b82f61a}.inline-monitor-btn:disabled{opacity:.45;cursor:not-allowed}.inline-monitor-status{font-size:11px;color:#94a3b8;padding:2px 6px;border-radius:4px;background:#94a3b81f;white-space:nowrap;cursor:help}.inline-monitor-status.active{color:#3b82f6;background:#3b82f61f}.inline-monitor-status.unavailable{color:#64748b}.inline-monitor-status--compact{max-width:3.25rem;font-size:11px;text-align:center}.level-test-modal-overlay{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:#0f172a59}.level-test-modal{width:min(480px,100%);max-height:min(90vh,100%);overflow:auto;background:#fff;border-radius:14px;padding:20px 20px 16px;box-shadow:0 20px 60px #0000002e}.level-test-modal-title{margin:0 0 12px;font-size:15px;font-weight:600;color:var(--color-gray-900)}.level-test-modal .inline-level-test-phrase{margin-bottom:8px}.level-test-modal-actions{margin-left:0!important;margin-top:12px;justify-content:flex-end}.inline-recorder-warning{font-size:11px;color:#f59e0b;padding:2px 6px;background:#f59e0b1a;border-radius:4px;cursor:help;font-weight:500}.inline-recorder-info{font-size:11px;color:#8b5cf6;padding:2px 6px;background:#8b5cf61a;border-radius:4px;cursor:help;font-weight:500;white-space:nowrap}.inline-level-test-btn{font-size:11px;padding:2px 8px;border:1px solid rgba(255,255,255,.2);border-radius:4px;background:#ffffff0d;color:#94a3b8;cursor:pointer;font-weight:500;white-space:nowrap}.inline-level-test-btn:hover:not(:disabled){background:#ffffff1a;color:#e2e8f0}.inline-level-test-btn:disabled{opacity:.4;cursor:not-allowed}.inline-level-test-btn.start{border-color:#22c55e80;color:#22c55e}.inline-level-test-btn.start:hover{background:#22c55e1a}.inline-level-test-panel{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;background:var(--color-gray-100);border:1px solid var(--color-gray-200);border-radius:8px;margin-top:6px;width:100%}.inline-level-test-phrase{font-size:12px;font-style:italic;color:#64748b;line-height:1.4;width:100%}.inline-level-test-status{font-size:11px;color:#60a5fa;font-weight:500}.inline-level-test-hint{font-size:11px;color:#94a3b8}.inline-level-test-result{font-size:11px;font-weight:500;padding:2px 6px;border-radius:4px}.inline-level-test-ok{background:#22c55e1a;color:#22c55e}.inline-level-test-too_hot{background:#ef44441a;color:#ef4444}.inline-level-test-too_quiet{background:#fbbf241a;color:#f59e0b}.inline-level-test-actions{display:flex;gap:4px;margin-left:auto}.inline-recorder-error{font-size:11px;color:#ef4444;padding:2px 6px;background:#ef44441a;border-radius:4px;cursor:help}.inline-remote-badge{display:flex;align-items:center;gap:4px;font-size:10px;text-transform:uppercase;color:var(--color-gray-500);background:var(--color-gray-100);padding:2px 6px;border-radius:4px;margin-left:4px}.inline-remote-badge.recording{color:#ef4444;background:#ef44441a;animation:pulse-badge 1.5s ease-in-out infinite}@keyframes pulse-badge{0%,to{opacity:1}50%{opacity:.6}}.action-btn.translate-btn{background:var(--color-primary);color:#fff;margin-left:8px}.action-btn.translate-btn:hover{background:var(--color-primary-dark, #2563eb)}.action-btn.commit-audio-btn{background:var(--color-gray-200);color:var(--color-gray-800);margin-left:8px}.action-btn.commit-audio-btn:hover{background:var(--color-gray-300)}.inline-disconnect-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;margin-left:4px;border:none;border-radius:50%;background:var(--color-gray-200);color:var(--color-gray-500);font-size:16px;font-weight:700;cursor:pointer;transition:all .15s ease}.inline-disconnect-btn:hover{background:var(--color-gray-300);color:var(--color-gray-700)}.inline-mic-select{margin-left:8px;padding:4px 8px;font-size:12px;border:1px solid var(--color-gray-300);border-radius:4px;background:var(--color-white);color:var(--color-gray-700);max-width:150px;cursor:pointer}.inline-mic-select:focus{outline:none;border-color:var(--color-primary)}.inline-recorder-audio-input-select{margin-left:8px;padding:4px 8px;font-size:11px;line-height:1.3;border:1px solid var(--color-gray-300);border-radius:4px;background:var(--color-white);color:var(--color-gray-700);max-width:min(280px,45vw);cursor:pointer;vertical-align:middle}.inline-recorder-audio-input-select:focus{outline:none;border-color:var(--color-primary)}.inline-recorder-audio-input-select:disabled{cursor:not-allowed;opacity:.6}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.settings-modal{background:#fff;border-radius:16px;width:100%;max-width:500px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--color-gray-200)}.modal-header h2{margin:0;font-size:18px;font-weight:600}.modal-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:8px;background:transparent;color:var(--color-gray-500);cursor:pointer}.modal-close:hover{background:var(--color-gray-100);color:var(--color-gray-700)}.modal-tabs{display:flex;gap:0;border-bottom:1px solid var(--color-gray-200);padding:0 16px}.modal-tabs .tab{padding:12px 16px;border:none;background:transparent;color:var(--color-gray-500);font-size:14px;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s}.modal-tabs .tab:hover{color:var(--color-gray-700)}.modal-tabs .tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.modal-content{padding:20px;overflow-y:auto;flex:1}.settings-section{display:flex;flex-direction:column;gap:20px}.setting-group{display:flex;flex-direction:column;gap:6px}.setting-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.setting-label{font-size:14px;font-weight:600;color:var(--color-gray-900)}.setting-description{font-size:12px;color:var(--color-gray-500);margin:0}.setting-select,.setting-input{padding:10px 12px;border-radius:8px;border:1px solid var(--color-gray-300);background:#fff;font-size:14px;color:var(--color-gray-900)}.setting-select{cursor:pointer}.setting-select:disabled,.setting-input:disabled{opacity:.6;cursor:not-allowed}.setting-input::placeholder{color:var(--color-gray-400)}.setting-row{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--color-gray-700);cursor:pointer}.setting-row input[type=checkbox]{width:18px;height:18px;cursor:pointer}.setting-range{width:100%;accent-color:var(--color-primary)}.setting-textarea{padding:10px 12px;border-radius:8px;border:1px solid var(--color-gray-300);font-size:14px;font-family:inherit;min-height:100px;resize:vertical}.stop-speaking-btn{padding:10px 16px;background:var(--color-danger);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer}.stop-speaking-btn:hover{background:#dc2626}.metrics .metric{font-size:.85rem;padding:8px;border-radius:8px;border:1px solid var(--color-gray-200);margin-bottom:6px;background:#fff}.metric.error{border-color:var(--color-warning);background:#fff7ed}.metric .meta{font-size:11px;color:var(--color-gray-500);margin-bottom:4px}.metric pre{margin:4px 0 0;font-size:11px;overflow-x:auto;color:var(--color-gray-600)}.canned-text-modal{background:#fff;border-radius:16px;width:100%;max-width:min(680px,calc(100vw - 32px));max-height:min(88dvh,900px);display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d}.canned-text-modal-body{flex:1;min-height:0;overflow:auto;padding:16px 20px 20px;display:flex;flex-direction:column}.canned-text-modal-body--edit{gap:12px}.canned-text-modal-header--edit{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--color-gray-200)}.canned-text-modal-header--edit h2{margin:0;font-size:18px;font-weight:600;text-align:center}.canned-modal-back{white-space:nowrap}@media(max-width:560px){.canned-text-modal{max-height:min(88dvh,calc(100dvh - 32px))}.canned-text-modal .canned-text-content{flex-direction:column}.canned-text-modal .canned-text-col-saved{border-left:none;padding-left:0;margin-left:0;border-top:1px solid var(--color-gray-200);padding-top:10px;margin-top:2px;min-height:min(240px,35dvh)}}@media(max-width:480px){.canned-text-modal{max-height:min(90dvh,calc(100dvh - 24px))}}.canned-text-add-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:12px;margin-top:4px;border-top:1px solid var(--color-gray-200);flex-shrink:0}.canned-text-mode-fieldset{border:1px solid var(--color-gray-200);border-radius:10px;padding:10px 12px;margin:0}.canned-text-mode-fieldset legend{padding:0 6px}.canned-text-mode-option{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--color-gray-800);margin-top:6px}.canned-text-mode-option:first-of-type{margin-top:2px}.canned-text-pretranslated-block{display:flex;flex-direction:column;gap:8px}.canned-text-lang-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.canned-text-lang-chip{font-size:12px!important}.canned-text-translation-rows{display:flex;flex-direction:column;gap:12px}.canned-text-translation-row{display:grid;grid-template-columns:minmax(100px,140px) 1fr auto;gap:10px;align-items:start;padding:10px;border:1px solid var(--color-gray-200);border-radius:10px;background:var(--color-gray-50)}@media(max-width:520px){.canned-text-translation-row{grid-template-columns:1fr;align-items:stretch}.canned-text-translation-row .canned-text-remove{justify-self:start}}.canned-text-editor-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;padding-top:12px;margin-top:8px;border-top:1px solid var(--color-gray-200)}.canned-text-tts--edit{padding-top:4px}.canned-text-content{display:flex;flex-direction:row;align-items:stretch;gap:12px;flex:1;min-height:0;overflow:hidden}.canned-text-col-edit{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px;overflow-y:auto;min-height:0}.canned-text-col-saved{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;border-left:1px solid var(--color-gray-200);padding-left:12px;margin-left:2px}.canned-text-jit{display:flex;flex-direction:column;gap:6px;flex-shrink:0}.canned-text-section-label{font-size:12px;font-weight:600;color:var(--color-gray-700)}.canned-text-hint{margin:0;font-size:11px;line-height:1.35;color:var(--color-gray-500)}.canned-text-quick-textarea{width:100%;box-sizing:border-box;padding:8px 10px;border-radius:8px;border:1px solid var(--color-gray-300);font-size:13px;font-family:inherit;resize:vertical;min-height:4.5rem}.canned-text-quick-textarea:focus{outline:none;border-color:var(--color-gray-400);box-shadow:0 0 0 2px #0000000a}.canned-text-field-label{display:flex;flex-direction:column;gap:4px;font-size:11px;font-weight:600;color:var(--color-gray-600)}.canned-text-label-row{display:flex;flex-direction:row;align-items:baseline;justify-content:flex-start;gap:6px;flex-wrap:wrap}.canned-text-optional{font-weight:500;color:var(--color-gray-500)}.canned-text-input{width:100%;box-sizing:border-box;padding:8px 10px;border-radius:8px;border:1px solid var(--color-gray-300);font-size:13px;font-weight:400;font-family:inherit}.canned-text-input:focus{outline:none;border-color:var(--color-gray-400)}.canned-text-input-multiline{resize:vertical;min-height:3rem}.canned-text-tts{display:flex;flex-direction:column;gap:6px;padding:6px 0 2px}.canned-text-tts-toggle{display:flex;align-items:center;gap:8px;margin:0;font-size:11px;font-weight:500;color:var(--color-gray-600);cursor:pointer;-webkit-user-select:none;user-select:none}.canned-text-tts-toggle input{margin:0;flex-shrink:0}.canned-text-tts-slider-row{display:flex;align-items:center;gap:10px;padding-left:22px}.canned-text-tts-slider-row input[type=range]{flex:1;min-width:0;accent-color:var(--color-primary)}.canned-text-tts-value{font-size:11px;font-weight:600;color:var(--color-gray-700);min-width:2.75rem;text-align:right;font-variant-numeric:tabular-nums}.canned-text-list{display:flex;flex-direction:column;gap:8px;overflow:hidden;flex:1;min-height:0}.canned-text-list-header{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:12px;font-weight:600;color:var(--color-gray-700);flex-shrink:0}.canned-text-count{font-size:11px;font-weight:500;color:var(--color-gray-500)}.canned-text-empty{margin:0;font-size:12px;color:var(--color-gray-500);line-height:1.4;flex:1;min-height:0;overflow-y:auto}.canned-text-list-scroll{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.canned-text-item{position:relative;padding:8px;border:1px solid var(--color-gray-200);border-radius:8px;background:var(--color-gray-50)}.canned-text-item-body{display:flex;flex-direction:column;min-width:0}.canned-text-item-footer{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}.canned-text-reorder-icon{flex-shrink:0;width:28px;height:28px;min-width:28px;padding:0;display:inline-flex;align-items:center;justify-content:center}.canned-text-item-reorder{display:flex;flex-direction:row;align-items:center;gap:4px;flex-shrink:0}.canned-text-item-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:6px;margin-top:0}.canned-text-preview{margin-bottom:0}.canned-text-title{font-size:12px;color:#333;margin-bottom:4px}.canned-text-title.has-label{font-weight:600}.canned-text-meta{font-size:11px;color:#666;margin-bottom:2px}.canned-text-meta:last-child{margin-bottom:0}.canned-text-remove{color:var(--color-gray-800);background:#fff0f0}.canned-text-remove:hover:not(:disabled){background:#ffe0e0}button{font-family:inherit}.small{padding:6px 10px;font-size:12px;font-weight:500;background:var(--color-gray-100);color:var(--color-gray-700);border:none;border-radius:6px;cursor:pointer}.small:hover{background:var(--color-gray-200)}.small:disabled{opacity:.5;cursor:not-allowed}.small.canned-text-reorder-icon{padding:0;min-width:28px;width:28px;height:28px}.view-options{display:inline-flex;align-items:center;gap:12px;flex-shrink:0}.pin{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--color-gray-500);cursor:pointer}.pin input{cursor:pointer}.live{padding:12px;background:#e0f2fe;border-radius:10px;margin-bottom:0;font-weight:600;min-height:56px;font-size:1.2rem;line-height:1.35}.live-row{align-items:center;gap:8px;flex-wrap:wrap}.pending-tag{font-size:12px;color:var(--color-gray-500)}.live-block{width:100%}.placeholder{display:flex;align-items:center;justify-content:flex-start}.glossary-box{display:flex;flex-direction:column;gap:6px;flex:1}.glossary-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:32px}.expiration-badge{background:var(--color-gray-100);color:var(--color-gray-600);cursor:default;font-size:11px}.expiration-badge.warning{background:#f59e0b26;color:var(--color-warning);animation:pulse-warning 2s ease-in-out infinite}.expiration-badge.subtle{padding:4px 6px;opacity:.85;background:var(--color-gray-50);color:var(--color-gray-500)}@keyframes pulse-warning{0%,to{opacity:1}50%{opacity:.7}}.room-status-modal{background:#fff;border-radius:16px;padding:32px;max-width:400px;width:100%;text-align:center;box-shadow:0 20px 60px #0000004d}.room-status-modal .modal-icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:50%;margin:0 auto 20px}.room-status-modal .modal-icon.error{background:#ef44441a;color:var(--color-danger)}.room-status-modal .modal-icon.warning{background:#f59e0b1a;color:var(--color-warning)}.room-status-modal h2{margin:0 0 12px;font-size:22px;font-weight:600;color:var(--color-gray-900)}.room-status-modal p{margin:0 0 24px;font-size:14px;color:var(--color-gray-600);line-height:1.5}.room-status-modal .modal-actions{display:flex;gap:12px;justify-content:center}.room-status-modal .primary-btn{padding:12px 24px;background:var(--color-primary);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .15s}.room-status-modal .primary-btn:hover{background:var(--color-primary-hover)}.room-status-modal .secondary-btn{padding:12px 24px;background:var(--color-gray-100);color:var(--color-gray-700);border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .15s}.room-status-modal .secondary-btn:hover{background:var(--color-gray-200)}.cost-badge{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}.cost-panel-body{display:flex;flex-direction:column;gap:12px;font-size:13px}.cost-live-breakdown,.cost-breakdown-list,.cost-sessions-list ul{color:var(--color-gray-600);font-size:12px}.cost-report-form{display:flex;flex-direction:column;gap:8px}.cost-report-hint{margin:0;color:var(--color-gray-600);font-size:11px}.cost-report-actions{display:flex;flex-wrap:wrap;gap:8px}.cost-report-form label{display:flex;flex-direction:column;gap:4px;font-size:12px}.cost-report-form input[type=datetime-local]{font-size:12px;padding:4px 6px}.cost-error{color:#b91c1c;font-size:12px}.cost-breakdown-list,.cost-sessions-list ul{margin:6px 0 0;padding-left:18px}#root{max-width:1400px;margin:0 auto;width:100%;height:100%;overflow:hidden}.poster-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;padding:40px 20px;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.poster-content{max-width:600px;width:100%;text-align:center}.poster-title{font-size:42px;font-weight:700;color:#111827;margin:0 0 8px}.poster-subtitle{font-size:20px;color:#4b5563;margin:0 0 32px}.poster-qr{display:inline-flex;padding:24px;background:#fff;border:3px solid #111827;border-radius:16px;margin-bottom:32px}.poster-instructions{display:flex;flex-direction:column;gap:16px;margin-bottom:32px;text-align:left;max-width:440px;margin-left:auto;margin-right:auto}.instruction-step{display:flex;align-items:center;gap:16px}.step-number{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#2563eb;color:#fff;border-radius:50%;font-size:18px;font-weight:600;flex-shrink:0}.step-text{font-size:18px;color:#374151;line-height:1.4}.poster-fallback{margin-bottom:24px;padding:16px;background:#f3f4f6;border-radius:8px}.poster-fallback p{margin:0 0 8px;font-size:14px;color:#6b7280}.poster-url{display:block;font-size:14px;color:#111827;word-break:break-all;background:#e5e7eb;padding:8px 12px;border-radius:4px}.poster-room-id{font-size:14px;color:#9ca3af}.poster-room-id strong{color:#6b7280;font-family:monospace;font-size:16px}.poster-error{text-align:center;color:#ef4444}.poster-error h1{font-size:24px;margin-bottom:8px}.poster-error p{font-size:16px;color:#6b7280}.poster-actions{display:flex;gap:12px;margin-top:40px}.poster-btn{padding:12px 24px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;border:none;transition:background-color .15s,transform .1s}.poster-btn:hover{transform:translateY(-1px)}.poster-btn:active{transform:translateY(0)}.poster-btn.primary{background:#2563eb;color:#fff}.poster-btn.primary:hover{background:#1d4ed8}.poster-btn.secondary{background:#e5e7eb;color:#374151}.poster-btn.secondary:hover{background:#d1d5db}@media print{.no-print{display:none!important}.poster-page{min-height:auto;padding:0;background:#fff}.poster-content{max-width:none}.poster-title{font-size:36px}.poster-subtitle{font-size:18px;margin-bottom:24px}.poster-qr{padding:20px;margin-bottom:24px}.poster-instructions{margin-bottom:24px}.step-number{width:32px;height:32px;font-size:16px;-webkit-print-color-adjust:exact;print-color-adjust:exact}.step-text{font-size:16px}.poster-fallback{padding:12px;-webkit-print-color-adjust:exact;print-color-adjust:exact}.poster-url{font-size:12px;-webkit-print-color-adjust:exact;print-color-adjust:exact}@page{margin:.5in}}.recorder-view{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:#0b1727;color:#f8fafc;font-family:Inter,system-ui,-apple-system,sans-serif}.recorder-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#ffffff0d;border-bottom:1px solid rgba(255,255,255,.1)}.recorder-header h1{margin:0;font-size:20px;font-weight:600}.room-info{font-size:14px;color:#94a3b8}.room-info strong{color:#f8fafc}.room-id-inline{color:#64748b;font-family:SF Mono,Monaco,Inconsolata,monospace;font-size:12px}.recorder-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:safe center;padding:24px;gap:24px;overflow-y:auto}.source-language-selector{display:flex;align-items:center;gap:10px;padding:8px 16px;background:#3b82f61a;border:1px solid rgba(59,130,246,.3);border-radius:12px;font-size:14px}.source-language-selector label{color:#9ca3af;font-weight:500;white-space:nowrap}.source-language-selector select{background:#1e1e28cc;color:#e0e0e0;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:6px 12px;font-size:15px;font-weight:600;cursor:pointer;min-width:80px}.recorder-status{display:inline-flex;align-items:center;gap:12px;padding:12px 24px;border-radius:24px;font-size:18px;font-weight:500;white-space:nowrap;overflow:visible}.recorder-status .status-text{display:inline!important;overflow:visible}.recorder-status .status-dot{width:16px;height:16px;border-radius:50%;animation:pulse 2s infinite}.status-disconnected{background:#ef444426;color:#ef4444}.status-disconnected .status-dot{background:#ef4444;animation:none}.status-ready{background:#22c55e26;color:#22c55e}.status-ready .status-dot{background:#22c55e}.status-recording{background:#3b82f626;color:#3b82f6}.status-recording .status-dot{background:#3b82f6}.status-speaking{background:#8b5cf633;color:#a78bfa}.status-speaking .status-dot{background:#a78bfa;animation:pulse-fast .5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes pulse-fast{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.2)}}.audio-meter-container{width:100%;max-width:400px}.audio-meter{height:12px;background:#ffffff1a;border-radius:6px;overflow:hidden}.audio-meter-fill{height:100%;background:linear-gradient(90deg,#22c55e,#3b82f6,#a78bfa);border-radius:6px;transition:width .05s ease-out}.audio-meter-container.input-hot .audio-meter-fill{background:linear-gradient(90deg,#f59e0b,#ef4444)}.monitor-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}.monitor-btn.active{border-color:#3b82f680;color:#60a5fa;background:#3b82f61f}.monitor-status{font-size:13px;color:#94a3b8;padding:6px 10px;border-radius:8px;background:#94a3b81f}.monitor-status.active{color:#60a5fa;background:#3b82f626}.monitor-status.unavailable{color:#64748b}.recorder-error{padding:12px 24px;background:#ef444426;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#ef4444;font-size:14px;width:100%;max-width:320px;margin-inline:auto;text-align:center}.recorder-info{padding:12px 24px;background:#3b82f61f;border:1px solid rgba(59,130,246,.28);border-radius:8px;color:#93c5fd;font-size:14px;width:100%;max-width:320px;margin-inline:auto;text-align:center}.recorder-warning{padding:12px 24px;background:#fbbf2426;border:1px solid rgba(251,191,36,.3);border-radius:8px;color:#fbbf24;font-size:14px;width:100%;max-width:320px;margin-inline:auto;text-align:center}.recorder-tip{font-size:13px;color:#94a3b8;text-align:center}.recorder-controls{display:flex;justify-content:center;margin:16px 0}.recorder-btn{display:flex;flex-direction:column;align-items:center;gap:9px;padding:18px 27px;border:none;border-radius:24px;font-size:20px;font-weight:600;cursor:pointer;transition:all .2s}.recorder-btn:disabled{opacity:.5;cursor:not-allowed}.recorder-btn svg{width:80px;height:80px}.enable-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.enable-btn:hover:not(:disabled){background:linear-gradient(135deg,#2563eb,#1d4ed8);transform:scale(1.02)}.enable-btn:active:not(:disabled){transform:scale(.98)}.start-btn{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}.start-btn:hover:not(:disabled){background:linear-gradient(135deg,#16a34a,#15803d);transform:scale(1.02)}.start-btn:active:not(:disabled){transform:scale(.98)}.stop-btn{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.stop-btn:hover:not(:disabled){background:linear-gradient(135deg,#dc2626,#b91c1c);transform:scale(1.02)}.stop-btn:active:not(:disabled){transform:scale(.98)}.stop-btn.speaking{background:linear-gradient(135deg,#a78bfa,#8b5cf6);animation:speaking-glow 1s infinite}@keyframes speaking-glow{0%,to{box-shadow:0 0 20px #8b5cf64d}50%{box-shadow:0 0 40px #8b5cf699}}.recorder-btn-small{padding:12px 24px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff0d;color:#f8fafc;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.recorder-btn-small:hover:not(:disabled){background:#ffffff1a;border-color:#ffffff4d}.recorder-btn-small:disabled{opacity:.5;cursor:not-allowed}.flush-btn{border-color:#3b82f680;color:#3b82f6}.flush-btn:hover{background:#3b82f61a;border-color:#3b82f6}.mic-selector{display:flex;align-items:center;gap:12px;margin-top:24px}.mic-selector label{font-size:14px;color:#94a3b8}.mic-selector select{padding:10px 16px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff0d;color:#f8fafc;font-size:14px;min-width:200px;cursor:pointer}.mic-selector select:disabled{opacity:.5;cursor:not-allowed}.mic-selector select:focus{outline:none;border-color:#3b82f6}.jit-insert{display:flex;gap:8px;margin-top:24px;width:100%;max-width:400px}.jit-insert input{flex:1;padding:12px 16px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#ffffff0d;color:#f8fafc;font-size:14px}.jit-insert input:focus{outline:none;border-color:#3b82f6}.jit-insert input::placeholder{color:#64748b}.jit-insert button{padding:12px 20px;border:none;border-radius:8px;background:#3b82f6;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s}.jit-insert button:hover:not(:disabled){background:#2563eb}.jit-insert button:disabled{opacity:.5;cursor:not-allowed}.pin-entry{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:360px;text-align:center}.pin-icon{color:#60a5fa;margin-bottom:8px}.pin-entry h2{margin:0;font-size:24px;font-weight:600}.pin-entry p{margin:0;color:#94a3b8;font-size:14px}.pin-input{width:100%;padding:16px;font-size:32px;font-family:monospace;letter-spacing:.3em;text-align:center;background:#374151;border:2px solid #4b5563;border-radius:8px;color:#f8fafc;outline:none;box-sizing:border-box}.pin-input:focus{border-color:#3b82f6}.pin-error{color:#ef4444;font-size:14px}.level-test-panel{width:100%;max-width:420px;padding:20px 24px;background:#ffffff0d;border:1px solid rgba(255,255,255,.12);border-radius:12px;text-align:center}.level-test-panel h3{margin:0 0 12px;font-size:17px;font-weight:600}.level-test-instructions{margin:0 0 12px;font-size:14px;color:#94a3b8}.level-test-phrase{margin:0 0 16px;padding:12px 16px;background:#3b82f61a;border-left:3px solid #3b82f6;border-radius:0 8px 8px 0;font-size:15px;font-style:italic;color:#e2e8f0;text-align:left;line-height:1.5}.level-test-progress{font-size:15px;font-weight:500;color:#60a5fa;margin-bottom:16px;animation:pulse 1.5s infinite}.level-test-result{padding:10px 16px;border-radius:8px;font-size:14px;font-weight:500;margin-bottom:16px}.level-test-ok{background:#22c55e26;border:1px solid rgba(34,197,94,.3);color:#22c55e}.level-test-too_hot{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:#ef4444}.level-test-too_quiet{background:#fbbf2426;border:1px solid rgba(251,191,36,.3);color:#fbbf24}.level-test-actions{display:flex;gap:10px;justify-content:center}.level-test-actions .start-btn{border-color:#22c55e80;color:#22c55e}.level-test-actions .start-btn:hover{background:#22c55e1a;border-color:#22c55e}@media(max-width:600px){.recorder-header{flex-direction:column;gap:8px;text-align:center}.recorder-main{padding:16px;gap:20px}.recorder-btn{padding:14px 20px;font-size:18px}.recorder-btn svg{width:64px;height:64px}.mic-selector{flex-direction:column;align-items:stretch;width:100%}.mic-selector select{width:100%;min-width:auto}.jit-insert{flex-direction:column}.jit-insert button{width:100%}.pin-input{font-size:24px}}.recorder-view.operator-view{height:100%;max-height:100%;min-height:0;overflow:hidden;overflow-x:hidden}.recorder-view.operator-view .recorder-header{flex-shrink:0;flex-direction:row;align-items:center;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top));gap:8px}.recorder-header-main{display:flex;align-items:center;gap:8px;flex:1;min-width:0;flex-wrap:nowrap}.recorder-header-main h1{font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recorder-status.compact{padding:4px 10px;font-size:.75rem;border-radius:999px;gap:6px}.recorder-status.compact .status-dot{width:8px;height:8px}.interpreter-lang-badge{font-size:.75rem;font-weight:700;letter-spacing:.06em;padding:4px 8px;border-radius:8px;background:#3b82f626;border:1px solid rgba(59,130,246,.35);color:#93c5fd;flex-shrink:0}.recorder-feed-section{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:12px 16px;display:flex;flex-direction:column;gap:12px;overscroll-behavior:contain}.feed-empty{color:#64748b;text-align:center;margin:auto;font-size:.95rem}.feed-block{position:relative;flex-shrink:0;padding:14px 12px 12px 36px;border:1px solid rgba(148,163,184,.2);border-radius:12px;background:#ffffff05}.feed-block.tts-speaking{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb33;background:#2563eb1f}.feed-block-num{position:absolute;top:10px;left:10px;font-size:.85rem;color:#94a3b8}.feed-block-text{font-size:clamp(1rem,4vw,1.2rem);line-height:1.7;white-space:pre-wrap;word-wrap:break-word}.feed-block-pending{border-style:dashed;border-color:#f59e0b8c;background:#f59e0b14}.feed-block-pending-text{font-size:clamp(1rem,4vw,1.2rem);line-height:1.7;white-space:pre-wrap;word-wrap:break-word;color:#f59e0b}.feed-block-pending-meta{margin-top:8px;font-size:.85rem;line-height:1.4;color:#94a3b8}.feed-block-pending-meta-prominent{margin-top:0;font-size:clamp(.95rem,3.5vw,1.05rem)}.recorder-controls-panel{flex:0 0 auto;flex-shrink:0;display:flex;flex-direction:column;gap:12px;padding:12px 16px;padding-bottom:max(16px,env(safe-area-inset-bottom));background:#0f172af2;border-top:1px solid rgba(148,163,184,.15);max-height:min(52dvh,calc(100dvh - 8rem));overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;min-width:0}.operator-view.setup-open .recorder-feed-section{flex:0 1 auto;max-height:min(24dvh,200px)}.operator-view.setup-open .recorder-controls-panel{flex:1 1 auto;max-height:min(76dvh,calc(100dvh - 4.5rem));min-height:min(58dvh,calc(100dvh - 12rem))}.recorder-secondary-actions{display:flex;flex-direction:column;gap:8px;width:100%}.recorder-secondary-actions-primary{display:flex;flex-direction:row;align-items:stretch;gap:10px;width:100%}.recorder-secondary-actions-primary>.recorder-auto-match-toggle,.recorder-secondary-actions-primary>.listen-along-toggle,.recorder-secondary-actions-primary>.recorder-phrases-toggle{flex:1 1 0;min-width:0}.recorder-auto-match-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;width:100%}.recorder-auto-match-toggle,.recorder-auto-match-seq-btn{min-height:44px;padding:10px;border-radius:10px;border:1px solid rgba(148,163,184,.25);background:#ffffff0d;color:#e2e8f0;font-size:clamp(.78rem,3.2vw,.9rem);font-weight:500;cursor:pointer;white-space:nowrap}.recorder-auto-match-toggle.active{border-color:#38bdf880;background:#38bdf81f;color:#7dd3fc}.recorder-auto-match-status{flex:1 1 auto;min-width:0;font-size:.85rem;color:#94a3b8}.listen-along-toggle{min-height:44px;padding:10px;border-radius:10px;border:1px solid rgba(148,163,184,.25);background:#ffffff0d;color:#e2e8f0;font-size:clamp(.78rem,3.2vw,.95rem);font-weight:500;cursor:pointer;white-space:nowrap}.listen-along-toggle.active{border-color:#22c55e80;background:#22c55e1f;color:#4ade80}.listen-along-toggle:disabled{opacity:.45;cursor:not-allowed}.recorder-phrases-toggle{min-height:44px;padding:10px;border-radius:10px;border:1px solid rgba(148,163,184,.25);background:#ffffff0d;color:#e2e8f0;font-size:clamp(.78rem,3.2vw,.95rem);font-weight:500;cursor:pointer;white-space:nowrap}.recorder-phrases-modal{max-width:min(420px,100%);width:100%;max-height:min(70dvh,520px);display:flex;flex-direction:column;padding:16px;border-radius:12px;background:#0f172a;border:1px solid rgba(148,163,184,.2);box-shadow:0 16px 48px #00000073}.recorder-phrases-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.recorder-phrases-header h2{margin:0;font-size:1.15rem}.recorder-phrases-list{list-style:none;margin:0;padding:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.recorder-phrases-row{display:flex;align-items:center;gap:12px;padding:12px;border-radius:10px;background:#ffffff0a;border:1px solid rgba(148,163,184,.12)}.recorder-phrases-row-text{flex:1;min-width:0}.recorder-phrases-row-title{font-weight:500;color:#e2e8f0;line-height:1.35;word-break:break-word}.recorder-phrases-row-meta{margin-top:4px;font-size:.8rem;color:#94a3b8}.recorder-phrases-row .recorder-btn-small{flex-shrink:0}.setup-toggle{align-self:center;min-height:44px;padding:8px 16px;background:transparent;border:none;color:#94a3b8;font-size:.9rem;cursor:pointer;text-decoration:underline}.setup-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:12px;background:#ffffff0a;border:1px solid rgba(148,163,184,.15);min-width:0;width:100%;box-sizing:border-box;overflow-x:hidden}.setup-row{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:#94a3b8;min-width:0;width:100%}.setup-row select{width:100%;max-width:100%;box-sizing:border-box;min-height:44px;padding:10px 12px;border-radius:8px;border:1px solid rgba(148,163,184,.25);background:#1e1e28cc;color:#f8fafc;font-size:1rem}.setup-row select:disabled{opacity:.5;cursor:not-allowed}.setup-mic-hint{margin:0;text-align:left;padding:10px 12px;border-radius:8px;border:1px dashed rgba(148,163,184,.3);background:#1e1e2866;line-height:1.4;overflow-wrap:anywhere}.setup-ios-route-tip{margin:0;text-align:left;line-height:1.4}.audio-adjust-row select{width:100%}.recorder-banner{flex-shrink:0;padding:10px 16px;font-size:.85rem;display:flex;align-items:center;justify-content:space-between;gap:8px}.recorder-banner.error{background:#ef444426;color:#fca5a5}.recorder-banner.warn{background:#fbbf2426;color:#fcd34d}.recorder-banner.info{background:#3b82f626;color:#93c5fd}.banner-dismiss{background:transparent;border:1px solid currentColor;border-radius:6px;color:inherit;padding:4px 8px;font-size:.75rem;cursor:pointer}.recorder-modal-backdrop{position:fixed;inset:0;background:#000000a6;display:flex;align-items:center;justify-content:center;padding:24px;z-index:100}.recorder-modal{max-width:360px;width:100%;padding:24px;border-radius:16px;background:#1e293b;border:1px solid rgba(148,163,184,.2)}.recorder-modal h2{margin:0 0 12px;font-size:1.15rem}.recorder-modal p{margin:0 0 20px;color:#94a3b8;line-height:1.5}.recorder-modal-actions{display:flex;flex-direction:column;gap:10px}.operator-view .recorder-controls-panel .audio-meter-container{align-self:center;width:100%;max-width:320px}.operator-view .recorder-controls-panel .audio-meter{width:100%}.operator-view .recorder-controls .recorder-btn{min-height:36px;width:100%;max-width:320px;margin:0 auto}.operator-view .recorder-controls{flex-wrap:wrap;gap:10px;width:100%;max-width:320px;margin-inline:auto}.status-reconnecting{background:#fbbf2426;color:#fbbf24}.status-reconnecting .status-dot{background:#fbbf24}
