@import "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";:root{--primary:#0a9e8f;--primary-hover:#088a7d;--primary-light:#0a9e8f1f;--primary-glow:#0a9e8f73;--dark-bg:#1c1c1e;--dark-surface:#2a2a2d;--dark-surface-hover:#333336;--dark-border:#3a3a3d;--lobby-bg:#f1f3f4;--lobby-surface:#fff;--text-primary:#fff;--text-secondary:#a0a0a8;--text-dark:#1c1c1e;--text-dark-secondary:#5f6368;--danger:#ea4335;--danger-hover:#d33426;--warning:#fbbc04;--success:#34a853;--radius-card:12px;--radius-pill:999px;--transition:.2s ease;--font:"DM Sans", system-ui, -apple-system, BlinkMacSystemFont, sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--lobby-bg);overflow:hidden}#root{width:100%;height:100vh}button{font-family:var(--font);cursor:pointer;background:0 0;border:none;outline:none}input{font-family:var(--font);border:none;outline:none}.lobby{background:var(--lobby-bg);height:100vh;color:var(--text-dark);display:flex}.lobby-sidebar{background:var(--lobby-surface);border-right:1px solid #e0e0e0;flex-direction:column;width:240px;min-width:240px;padding:20px 16px;display:flex}.lobby-logo{letter-spacing:-.5px;color:var(--text-dark);margin-bottom:28px;padding-left:4px;font-size:20px;font-weight:700}.lobby-new-meeting-btn{background:var(--primary);color:var(--text-primary);border-radius:var(--radius-pill);transition:background var(--transition), box-shadow var(--transition);align-items:center;gap:10px;width:fit-content;margin-bottom:32px;padding:12px 24px;font-size:14px;font-weight:600;display:flex}.lobby-new-meeting-btn:hover{background:var(--primary-hover);box-shadow:0 4px 16px var(--primary-glow)}.lobby-new-meeting-btn svg{fill:currentColor;width:18px;height:18px}.lobby-nav{flex-direction:column;gap:2px;display:flex}.lobby-nav-item{color:var(--text-dark-secondary);transition:background var(--transition), color var(--transition);cursor:pointer;border-radius:8px;align-items:center;gap:12px;padding:10px 12px;font-size:14px;font-weight:500;display:flex}.lobby-nav-item:hover{background:#0000000a}.lobby-nav-item.active{color:var(--primary);background:var(--primary-light);font-weight:600}.lobby-nav-item svg{width:18px;height:18px}.lobby-sidebar-spacer{flex:1}.lobby-workspace{border-radius:var(--radius-card);border:1px solid #e0e0e0;align-items:center;gap:10px;padding:12px;display:flex}.lobby-workspace-icon{background:var(--primary);color:#fff;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:13px;font-weight:700;display:flex}.lobby-workspace-info{flex-direction:column;display:flex}.lobby-workspace-name{color:var(--text-dark);font-size:13px;font-weight:700}.lobby-workspace-plan{color:var(--text-dark-secondary);font-size:11px}.lobby-main{flex-direction:column;flex:1;display:flex;overflow-y:auto}.lobby-header{justify-content:flex-end;align-items:center;gap:16px;padding:16px 32px;display:flex}.lobby-time{color:var(--text-dark-secondary);font-size:14px;font-weight:500}.lobby-header-icons{align-items:center;gap:8px;display:flex}.lobby-header-icon{width:36px;height:36px;color:var(--text-dark-secondary);transition:background var(--transition);border-radius:50%;justify-content:center;align-items:center;display:flex}.lobby-header-icon:hover{background:#0000000f}.lobby-header-icon svg{width:20px;height:20px}.lobby-header-avatar{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:flex}.lobby-content{flex:1;justify-content:center;align-items:center;gap:48px;padding:0 48px 48px;display:flex}.lobby-hero{max-width:440px}.lobby-hero h1{letter-spacing:-1px;color:var(--text-dark);margin-bottom:16px;font-size:44px;font-weight:700;line-height:1.15}.lobby-hero h1 span{color:var(--primary)}.lobby-hero p{color:var(--text-dark-secondary);margin-bottom:32px;font-size:15px;line-height:1.65}.lobby-join-row{align-items:center;gap:12px;margin-bottom:16px;display:flex}.lobby-join-input-wrap{background:var(--lobby-surface);border-radius:var(--radius-pill);max-width:320px;transition:border-color var(--transition);border:1.5px solid #dadce0;flex:1;align-items:center;gap:10px;padding:10px 20px;display:flex}.lobby-join-input-wrap:focus-within{border-color:var(--primary)}.lobby-join-input-wrap svg{width:18px;height:18px;color:var(--text-dark-secondary);flex-shrink:0}.lobby-join-input{color:var(--text-dark);background:0 0;flex:1;font-size:14px}.lobby-join-input::placeholder{color:var(--text-dark-secondary)}.lobby-join-btn{color:var(--primary);border-radius:var(--radius-pill);transition:background var(--transition);padding:10px 20px;font-size:14px;font-weight:600}.lobby-join-btn:hover{background:var(--primary-light)}.lobby-join-btn:disabled{opacity:.4;cursor:default}.lobby-join-btn:disabled:hover{background:0 0}.lobby-learn-more{color:var(--primary);align-items:center;gap:4px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex}.lobby-learn-more:hover{text-decoration:underline}.lobby-learn-more svg{width:14px;height:14px}.lobby-decor{flex-direction:column;gap:12px;max-width:380px;display:flex}.lobby-decor-main{background:var(--lobby-surface);border-radius:var(--radius-card);padding:16px;position:relative;box-shadow:0 2px 12px #0000000f}.lobby-decor-badge{background:var(--lobby-surface);text-align:center;width:72px;height:72px;color:var(--text-dark-secondary);text-transform:uppercase;letter-spacing:.5px;z-index:2;border:1.5px dashed #dadce0;border-radius:50%;justify-content:center;align-items:center;font-size:9px;font-weight:700;line-height:1.2;display:flex;position:absolute;top:-8px;right:-8px;transform:rotate(12deg)}.lobby-mock-grid{border-radius:8px;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px;display:grid;overflow:hidden}.lobby-mock-tile{aspect-ratio:16/10;color:#ffffffd9;border-radius:6px;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex}.lobby-mock-tile:first-child{background:linear-gradient(135deg,#0a9e8f,#06d6a0)}.lobby-mock-tile:nth-child(2){background:linear-gradient(135deg,#3b82f6,#6366f1)}.lobby-mock-tile:nth-child(3){background:linear-gradient(135deg,#f59e0b,#ef4444)}.lobby-mock-tile:nth-child(4){background:linear-gradient(135deg,#8b5cf6,#ec4899)}.lobby-decor-live{align-items:center;gap:8px;padding:4px 0;display:flex}.lobby-decor-live-dot{background:var(--primary);border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite pulse}.lobby-decor-live span{color:var(--text-dark);font-size:12px;font-weight:600}.lobby-decor-avatars{margin-left:auto;display:flex}.lobby-decor-avatar{border:2px solid var(--lobby-surface);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;margin-left:-6px;font-size:9px;font-weight:700;display:flex}.lobby-decor-avatar:first-child{background:#0a9e8f}.lobby-decor-avatar:nth-child(2){background:#3b82f6}.lobby-decor-avatar:nth-child(3){background:#f59e0b}.lobby-decor-cards{grid-template-columns:1fr 1fr;gap:12px;display:grid}.lobby-stat-card{background:var(--lobby-surface);border-radius:var(--radius-card);text-align:center;padding:20px 16px;box-shadow:0 2px 12px #0000000f}.lobby-stat-card-value{color:var(--primary);margin-bottom:4px;font-size:32px;font-weight:700;line-height:1}.lobby-stat-card-label{letter-spacing:1.2px;text-transform:uppercase;color:var(--text-dark-secondary);font-size:10px;font-weight:700}.lobby-fsl-card{background:var(--primary);border-radius:var(--radius-card);box-shadow:0 2px 12px var(--primary-glow);color:#fff;flex-direction:column;justify-content:center;padding:20px 16px;display:flex}.lobby-fsl-card-icon{margin-bottom:6px;font-size:28px}.lobby-fsl-card-title{margin-bottom:2px;font-size:14px;font-weight:700;line-height:1.2}.lobby-fsl-card-sub{opacity:.85;font-size:11px;line-height:1.3}.call-screen{background:var(--dark-bg);height:100vh;color:var(--text-primary);display:flex}.call-sidebar{display:none}.call-main{flex-direction:column;flex:1;min-width:0;display:flex}.call-topbar,.call-topbar-back,.call-topbar-title,.call-topbar-add,.call-topbar-left{display:none}.call-video-area{flex-direction:column;flex:1;gap:10px;min-height:0;padding:16px 20px 12px;display:flex}.call-video-wrapper{border-radius:var(--radius-card);background:#000;flex:1;min-height:0;position:relative;overflow:hidden}.video-tile{background:var(--dark-surface);position:relative;overflow:hidden}.video-tile.main{border-radius:var(--radius-card);width:100%;height:100%}.video-tile.pip{z-index:5;border:2px solid #ffffff1a;border-radius:10px;width:160px;height:120px;position:absolute;top:16px;right:16px;box-shadow:0 4px 16px #0006}.video-tile video{object-fit:contain;background:#000;width:100%;height:100%;display:block}.video-tile video.video-local{transform:scaleX(-1)}.video-tile-label{border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(12px);color:var(--text-primary);z-index:3;pointer-events:none;background:#0006;padding:5px 12px;font-size:12px;font-weight:600;position:absolute}.video-tile.main .video-tile-label{bottom:16px;left:16px}.video-tile.pip .video-tile-label{padding:3px 8px;font-size:10px;top:6px;left:6px}.video-tile-avatar{background:var(--dark-bg);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.video-tile-avatar span{background:var(--dark-surface);width:72px;height:72px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;font-size:28px;font-weight:700;display:flex}.video-tile.pip .video-tile-avatar span{width:40px;height:40px;font-size:16px}.recording-dot{background:var(--danger);z-index:4;border-radius:50%;width:10px;height:10px;animation:2s ease-in-out infinite recordingPulse;position:absolute;top:16px;right:190px}.mic-volume-bar{z-index:4;background:#ffffff1f;border-radius:2px;width:4px;height:64px;position:absolute;bottom:60px;left:12px;overflow:hidden}.mic-volume-bar-fill{background:var(--primary);border-radius:2px;width:100%;animation:1.6s ease-in-out infinite micPulse;position:absolute;bottom:0;left:0}.connection-status{-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-pill);z-index:6;transition:opacity var(--transition);background:#00000080;align-items:center;gap:6px;padding:5px 14px;font-size:12px;font-weight:500;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%)}.connection-dot{border-radius:50%;flex-shrink:0;width:7px;height:7px}.connection-dot.waiting{background:var(--warning)}.connection-dot.connected{background:var(--success)}.connection-dot.disconnected{background:var(--danger)}.debug-perf-bar{color:#38bdf8;word-break:break-all;pointer-events:none;z-index:5;text-align:center;background:#000000bf;border-radius:4px;max-width:calc(100% - 16px);padding:2px 8px;font-family:monospace;font-size:11px;line-height:1.4;position:absolute;bottom:48px;left:50%;transform:translate(-50%)}.debug-stage-bar{color:#fbbf24;word-break:break-all;pointer-events:none;z-index:5;text-align:center;background:#000000bf;border-radius:4px;max-width:calc(100% - 16px);padding:2px 8px;font-family:monospace;font-size:11px;line-height:1.4;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.debug-stats-bar{color:#0a9e8f;word-break:break-all;pointer-events:none;z-index:5;text-align:center;background:#000000bf;border-radius:4px;max-width:calc(100% - 16px);padding:4px 8px;font-family:monospace;font-size:11px;line-height:1.4;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.video-tile:has(.debug-stats-bar) .translation-overlay{bottom:74px}.translation-overlay{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-pill);z-index:6;opacity:1;pointer-events:auto;background:#000000a6;align-items:center;gap:0;max-width:90%;padding:10px 24px;transition:opacity .4s,transform .4s;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)translateY(0)}.translation-overlay.hidden{opacity:0;pointer-events:none;transform:translate(-50%)translateY(6px)}.translation-overlay.tentative{opacity:.6}.translation-left{text-align:center;flex-direction:column;align-items:center;gap:1px;min-width:0;display:flex}.translation-label-tiny{text-transform:uppercase;letter-spacing:1.2px;color:var(--text-secondary);font-size:9px;font-weight:700}.translation-sign{color:var(--text-primary);text-transform:uppercase;white-space:nowrap;font-size:20px;font-weight:800}.translation-confidence{color:var(--primary);font-size:12px;font-weight:600}.now-translating{align-items:center;gap:10px;padding:6px 16px;font-size:12px;display:flex}.now-translating-label{text-transform:uppercase;letter-spacing:.8px;color:var(--primary);flex-shrink:0;font-size:10px;font-weight:700}.now-translating-text{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:12px;font-style:italic;overflow:hidden}.recognizer-status{white-space:nowrap;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:9999px;flex-shrink:0;align-items:center;gap:6px;margin-left:auto;padding:2px 8px;font-size:11px;line-height:1.4;display:inline-flex}.recognizer-status-dot{background:#64748b;border-radius:50%;flex-shrink:0;width:6px;height:6px}.recognizer-status-dot.status-ready{background:#10b981;box-shadow:0 0 6px #10b98199}.recognizer-status-dot.status-warming-up{background:#f59e0b;box-shadow:0 0 6px #f59e0b99}.recognizer-status-dot.status-weak-signal{background:#f97316;box-shadow:0 0 6px #f9731699}.recognizer-status-dot.status-offline{background:#ef4444;box-shadow:0 0 6px #ef444499}.recognizer-status-dot.status-camera-off,.recognizer-status-dot.status-off{background:#64748b}.recognizer-status-text{color:var(--text-primary);font-weight:600}.recognizer-status-hint{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;flex-shrink:1;max-width:240px;font-size:11px;font-style:italic;overflow:hidden}@media (width<=768px){.recognizer-status-hint{max-width:140px;font-size:10px}}@media (width<=480px){.now-translating{gap:6px;padding:4px 8px}.recognizer-status{padding:1px 6px;font-size:10px}.recognizer-status-hint{display:none}}.waveform{flex-shrink:0;align-items:center;gap:2px;height:16px;display:flex}.waveform span{background:var(--primary);border-radius:1.5px;width:3px;animation:1.2s ease-in-out infinite wave}.waveform span:first-child{height:6px;animation-delay:0s}.waveform span:nth-child(2){height:10px;animation-delay:.15s}.waveform span:nth-child(3){height:14px;animation-delay:.3s}.waveform span:nth-child(4){height:8px;animation-delay:.45s}.call-controls{justify-content:space-between;align-items:center;gap:12px;padding:10px 20px 16px;display:flex}.call-controls-left{align-items:center;gap:10px;min-width:0;display:flex}.call-controls-center{flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.call-controls-right{justify-content:flex-end;align-items:center;gap:10px;display:flex}.call-clock{color:var(--text-primary);white-space:nowrap;letter-spacing:.02em;font-size:14px;font-weight:600}.call-meeting-info-wrap{position:relative}.call-info-btn{border-color:#0000!important}.meeting-info-popup{background:var(--dark-surface);border:1px solid var(--dark-border);z-index:20;border-radius:12px;min-width:180px;padding:14px 18px;animation:.2s forwards fadeSlideUp;position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);box-shadow:0 8px 32px #00000080}.meeting-info-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);margin-bottom:6px;font-size:10px;font-weight:700}.meeting-info-code{color:var(--primary);letter-spacing:2px;margin-bottom:6px;font-size:18px;font-weight:800}.meeting-info-hint{color:var(--text-secondary);font-size:11px;line-height:1.4}.control-btn.active-panel{background:var(--primary-light);border-color:var(--primary);color:var(--primary)}.control-btn{background:var(--dark-surface);border:1px solid var(--dark-border);width:44px;height:44px;color:var(--text-primary);transition:background var(--transition), border-color var(--transition);border-radius:50%;justify-content:center;align-items:center;display:flex}.control-btn:hover{background:var(--dark-surface-hover);border-color:var(--text-secondary)}.control-btn svg{width:20px;height:20px}.control-btn.end-call{background:var(--danger);border-color:var(--danger);color:#fff;width:48px;height:48px}.control-btn.end-call:hover{background:var(--danger-hover)}.control-btn.muted{color:var(--danger);background:#ea433526;border-color:#ea433566}.fsl-toggle{border-radius:var(--radius-pill);border:1px solid var(--dark-border);background:var(--dark-surface);color:var(--text-secondary);transition:all var(--transition);align-items:center;gap:10px;margin-left:8px;padding:8px 18px;font-size:13px;font-weight:600;display:flex}.fsl-toggle.active{background:var(--primary-light);border-color:var(--primary);color:var(--primary);box-shadow:0 0 16px var(--primary-glow)}.fsl-toggle-switch{width:34px;height:18px;transition:background var(--transition);background:#555;border-radius:9px;position:relative}.fsl-toggle.active .fsl-toggle-switch{background:var(--primary)}.fsl-toggle-knob{width:14px;height:14px;transition:transform var(--transition);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}.fsl-toggle.active .fsl-toggle-knob{transform:translate(16px)}.call-chat-panel{background:var(--dark-surface);border-left:1px solid var(--dark-border);flex-direction:column;width:280px;min-width:280px;transition:width .28s cubic-bezier(.4,0,.2,1),min-width .28s cubic-bezier(.4,0,.2,1),opacity .28s;display:flex;overflow:hidden}.call-chat-panel.closed{opacity:0;pointer-events:none;width:0;min-width:0}.call-chat-panel.open{opacity:1}.chat-header{border-bottom:1px solid var(--dark-border);align-items:center;gap:12px;padding:14px 16px;display:flex}.chat-header-title{font-size:15px;font-weight:700}.chat-header-spacer{flex:1}.chat-tabs{background:var(--dark-bg);border-radius:8px;gap:2px;padding:2px;display:flex}.chat-tab{color:var(--text-secondary);transition:all var(--transition);border-radius:6px;padding:6px 14px;font-size:12px;font-weight:600}.chat-tab:hover{color:var(--text-primary)}.chat-tab.active{background:var(--dark-surface);color:var(--text-primary)}.chat-messages{flex-direction:column;flex:1;gap:12px;padding:16px;display:flex;overflow-y:auto}.chat-system-pill{background:var(--primary-light);border-radius:var(--radius-pill);text-transform:uppercase;letter-spacing:.5px;color:var(--primary);align-self:center;align-items:center;gap:6px;padding:6px 16px;font-size:11px;font-weight:700;display:flex}.chat-system-pill svg{width:14px;height:14px}.chat-bubble-wrap{flex-direction:column;gap:3px;display:flex}.chat-bubble-wrap.self{align-items:flex-end}.chat-bubble-name{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);padding:0 4px;font-size:10px;font-weight:700}.chat-bubble{background:var(--dark-bg);color:var(--text-primary);border-radius:12px 12px 12px 4px;max-width:85%;padding:8px 14px;font-size:13px;line-height:1.45}.chat-bubble-wrap.self .chat-bubble{background:var(--primary);border-radius:12px 12px 4px}.chat-bubble-time{color:var(--text-secondary);padding:0 4px;font-size:10px}.chat-typing{color:var(--text-secondary);align-items:center;gap:6px;padding:4px 0;font-size:12px;display:flex}.typing-dots{gap:3px;display:flex}.typing-dots span{background:var(--text-secondary);border-radius:50%;width:5px;height:5px;animation:1.4s infinite both typingBounce}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}.chat-input-area{border-top:1px solid var(--dark-border);padding:12px 16px}.chat-input-row{background:var(--dark-bg);border-radius:var(--radius-pill);align-items:center;gap:8px;padding:4px 4px 4px 16px;display:flex}.chat-input{color:var(--text-primary);background:0 0;flex:1;padding:8px 0;font-size:13px}.chat-input::placeholder{color:var(--text-secondary)}.chat-send-btn{background:var(--primary);color:#fff;width:34px;height:34px;transition:background var(--transition);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.chat-send-btn:hover{background:var(--primary-hover)}.chat-send-btn svg{width:16px;height:16px}.fsl-log{flex-direction:column;flex:1;gap:10px;padding:16px;display:flex;overflow-y:auto}.fsl-log-top{z-index:1;background:linear-gradient(#0f131efa,#0f131ed9);align-items:center;gap:10px;padding-bottom:6px;display:flex;position:sticky;top:0}.fsl-running-pill{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;background:#0a9e8f29;border:1px solid #0a9e8f59;border-radius:999px;flex:1;padding:7px 12px;font-size:12px;overflow:hidden}.fsl-clear-btn{color:var(--primary);white-space:nowrap;background:0 0;padding:4px 2px;font-size:12px}.fsl-clear-btn:hover:not(:disabled){text-decoration:underline}.fsl-clear-btn:disabled{opacity:.4;cursor:not-allowed}.fsl-log-item{background:var(--dark-bg);transition:background var(--transition);border-radius:10px;align-items:center;gap:10px;padding:10px 12px;display:flex}.fsl-log-item:hover{background:var(--dark-surface-hover)}.fsl-log-icon{width:30px;height:30px;color:var(--primary);background:#0a9e8f26;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.fsl-log-sign{letter-spacing:.01em;color:var(--text-primary);text-transform:capitalize;flex:1;font-size:15px;font-weight:800}.fsl-log-confidence{color:#7ef2e6;background:#0a9e8f3d;border:1px solid #0a9e8f73;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:700}.fsl-log-time{color:var(--text-secondary);white-space:nowrap;font-size:11px}.fsl-log-empty{text-align:center;color:var(--text-secondary);padding:40px 20px;font-size:13px;line-height:1.6}.hidden-video{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed;top:-9999px}.role-screen{flex-direction:column;flex:1;justify-content:center;align-items:center;padding:0 48px 48px;animation:.28s forwards roleFadeIn;display:flex}@keyframes roleFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.role-screen-header{text-align:center;margin-bottom:36px}.role-room-badge{background:var(--primary-light);color:var(--primary);border-radius:var(--radius-pill);letter-spacing:.4px;align-items:center;gap:7px;margin-bottom:20px;padding:6px 18px;font-size:13px;font-weight:700;display:inline-flex}.role-room-badge svg{width:14px;height:14px;fill:var(--primary)}.role-screen-title{letter-spacing:-.5px;color:var(--text-dark);margin-bottom:10px;font-size:30px;font-weight:700}.role-screen-sub{color:var(--text-dark-secondary);max-width:380px;margin:0 auto;font-size:14px;line-height:1.6}.role-cards{gap:20px;margin-bottom:32px;display:flex}.role-card{text-align:center;background:var(--lobby-surface);cursor:pointer;width:210px;transition:border-color var(--transition), box-shadow var(--transition), transform var(--transition);border:2px solid #e0e0e0;border-radius:16px;flex-direction:column;align-items:center;gap:12px;padding:28px 24px 22px;display:flex;position:relative}.role-card:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 4px 20px #0a9e8f1f}.role-card.selected{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light), 0 4px 20px #0a9e8f33}.role-card-icon{width:64px;height:64px;transition:transform var(--transition);border-radius:50%;justify-content:center;align-items:center;display:flex}.role-card:hover .role-card-icon{transform:scale(1.08)}.role-card-icon.deaf{color:var(--primary);background:linear-gradient(135deg,#0a9e8f26,#06d6a02e)}.role-card-icon.hearing{color:#3b82f6;background:linear-gradient(135deg,#3b82f621,#6366f12e)}.role-card-label{color:var(--text-dark);font-size:15px;font-weight:700}.role-card-desc{color:var(--text-dark-secondary);font-size:12px;line-height:1.55}.role-card-check{background:var(--primary);color:#fff;opacity:0;width:22px;height:22px;transition:opacity var(--transition), transform var(--transition);border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:12px;right:12px;transform:scale(.6)}.role-card.selected .role-card-check{opacity:1;transform:scale(1)}.role-actions{flex-direction:column;align-items:center;gap:12px;display:flex}.role-enter-btn{background:var(--primary);color:#fff;border-radius:var(--radius-pill);transition:background var(--transition), box-shadow var(--transition), opacity var(--transition);align-items:center;gap:10px;padding:13px 36px;font-size:15px;font-weight:700;display:flex}.role-enter-btn svg{fill:currentColor;width:18px;height:18px}.role-enter-btn:hover:not(:disabled){background:var(--primary-hover);box-shadow:0 6px 20px var(--primary-glow)}.role-enter-btn:disabled{opacity:.38;cursor:default}.role-back-btn{color:var(--text-dark-secondary);border-radius:var(--radius-pill);transition:color var(--transition), background var(--transition);padding:6px 12px;font-size:13px;font-weight:500}.role-back-btn:hover{color:var(--text-dark);background:#0000000d}@keyframes fadeSlideUp{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes recordingPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.85)}}@keyframes micPulse{0%{height:30%}15%{height:55%}30%{height:40%}50%{height:70%}70%{height:50%}85%{height:65%}to{height:30%}}@keyframes wave{0%,to{height:4px}50%{height:14px}}@keyframes typingBounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--dark-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.call-settings-wrap{position:relative}.settings-popup{z-index:200;background:#1a1d27;border:1px solid #ffffff1a;border-radius:12px;width:240px;padding:16px;animation:.15s fadeInUp;position:absolute;bottom:calc(100% + 12px);right:0;box-shadow:0 8px 32px #00000080}@keyframes fadeInUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.settings-popup-title{letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:14px;font-size:11px;font-weight:700}.settings-row{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.settings-row-label{color:var(--text-primary);font-size:13px;font-weight:500}.settings-lang-toggle{background:#ffffff0f;border-radius:8px;gap:2px;padding:2px;display:flex}.settings-lang-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:600;transition:background .2s,color .2s}.settings-lang-btn.active{background:var(--accent);color:#fff}.settings-lang-btn:hover:not(.active){color:var(--text-primary);background:#ffffff1a}.settings-tts-btn{letter-spacing:.06em;cursor:pointer;border:none;border-radius:6px;padding:4px 12px;font-size:11px;font-weight:700;transition:background .2s,color .2s}.settings-tts-btn.on{color:#0a9e8f;background:#0a9e8f33;border:1px solid #0a9e8f66}.settings-tts-btn.off{color:var(--text-secondary);background:#ffffff0f;border:1px solid #ffffff1a}.settings-popup-hint{color:var(--text-muted,var(--text-secondary));opacity:.7;border-top:1px solid #ffffff12;margin-top:4px;padding-top:10px;font-size:11px;line-height:1.5}.caption-bar{-webkit-backdrop-filter:blur(14px);border-radius:var(--radius-card);z-index:8;pointer-events:none;-webkit-user-select:none;user-select:none;background:#000000bf;border:1px solid #ffffff1f;width:auto;max-width:calc(100% - 40px);padding:12px 24px;transition:opacity .25s,transform .25s;position:absolute;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #00000073}.caption-chips-list{flex-wrap:wrap;justify-content:center;align-items:baseline;gap:12px;max-height:84px;display:flex;overflow:hidden}.caption-chip{white-space:nowrap;line-height:1.25;transition:all .2s}.caption-chip.newest{color:#fff;text-shadow:0 2px 8px #0009;opacity:1;font-size:26px;font-weight:800}.caption-chip.older{color:#ffffffb8;opacity:.8;font-size:19px;font-weight:600}.caption-chip[data-age="2"]{opacity:.65;font-size:17px}.caption-chip[data-age="3"]{opacity:.52;font-size:15px}.caption-chip[data-age="4"]{opacity:.4;font-size:14px}.caption-sentence-layout{text-align:center;flex-direction:column;align-items:center;gap:6px;display:flex}.caption-sentence-text{color:#fff;font-size:24px;font-weight:800;line-height:1.3}.caption-chips-sub{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.caption-chip-sub{color:#fff9;font-size:13px}.caption-chip-sub.newest{color:var(--primary);font-weight:700}@media (width<=960px){.caption-bar{max-width:calc(100% - 24px);padding:8px 16px;bottom:14px}.caption-chips-list{gap:8px;max-height:64px}.caption-chip.newest{font-size:19px}.caption-chip.older{font-size:14px}.caption-chip[data-age="2"],.caption-chip[data-age="3"],.caption-chip[data-age="4"]{font-size:13px}.caption-sentence-text{font-size:18px}}.hearing-transcript-panel{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.transcript-header-bar{border-bottom:1px solid var(--dark-border);color:var(--text-secondary);justify-content:space-between;align-items:center;padding:10px 16px;font-size:11px;display:flex}.transcript-header-count{text-transform:uppercase;letter-spacing:.5px;font-weight:600}.transcript-list{flex-direction:column;flex:1;gap:8px;padding:12px 16px;display:flex;overflow-y:auto}.transcript-line{border-left:2px solid var(--primary);background:#ffffff08;border-radius:6px;align-items:baseline;gap:12px;padding:6px 10px;font-size:13px;line-height:1.4;display:flex}.transcript-time{color:var(--text-secondary);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:11px}.transcript-sign-name{color:var(--text-primary);word-break:break-word;font-weight:700}.transcript-empty{text-align:center;color:var(--text-secondary);padding:32px 16px;font-size:12px;line-height:1.5}@media (width<=960px){.call-screen.role-hearing{flex-direction:column;height:100vh;overflow-y:auto}.call-screen.role-hearing .call-main{flex:1 0 auto;min-height:480px}.call-screen.role-hearing .call-chat-panel{border-left:none;border-top:1px solid var(--dark-border);width:100%;min-width:100%;transition:height .28s cubic-bezier(.4,0,.2,1),opacity .28s}.call-screen.role-hearing .call-chat-panel.closed{width:100%;min-width:100%;height:0;min-height:0}.call-screen.role-hearing .call-chat-panel.open{flex-shrink:0;height:320px;min-height:260px}.call-screen.role-hearing .call-controls-right{flex-shrink:0;gap:8px}.call-screen.role-hearing .transcript-toggle-btn{flex-shrink:0}}
