:root{--glass-bg: rgba(255, 255, 255, .06);--glass-bg-hover: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .1);--glass-blur: 20px;--glass-shadow: 0 8px 32px rgba(0, 0, 0, .37);--accent-blue: #60a5fa;--accent-green: #34d399;--accent-orange: #fb923c;--accent-red: #f87171;--accent-purple: #a78bfa;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--bg-dark: #0f172a;--bg-darker: #020617;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow)}.glass-button{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:500}.glass-button:hover{background:var(--glass-bg-hover);border-color:#fff3;transform:translateY(-1px)}.glass-button:active{transform:translateY(0)}.glass-button.active{border-color:var(--accent-blue);box-shadow:0 0 20px #60a5fa33}.glass-button.danger{border-color:var(--accent-red)}.glass-button.danger:hover{box-shadow:0 0 20px #f8717133}@keyframes pulse-recording{0%,to{box-shadow:0 0 #f8717166}50%{box-shadow:0 0 0 8px #f8717100}}.recording-pulse{animation:pulse-recording 2s infinite}@keyframes fade-in-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fade-in-up .3s ease-out}@keyframes slide-in-right{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.slide-in-right{animation:slide-in-right .4s ease-out}@media(max-width:768px){.glass-button{min-height:44px;min-width:44px;padding:10px 16px;-webkit-tap-highlight-color:transparent}.glass-button:hover{transform:none}.glass-panel{--glass-blur: 12px}}@media(prefers-reduced-motion:reduce){.fade-in-up,.slide-in-right,.recording-pulse{animation:none}.glass-button{transition:none}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;overflow-x:hidden;-webkit-text-size-adjust:100%}@media(max-width:768px){body{overflow:auto;-webkit-overflow-scrolling:touch}}body:before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse at 20% 50%,rgba(96,165,250,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(167,139,250,.06) 0%,transparent 50%),radial-gradient(ellipse at 50% 80%,rgba(52,211,153,.05) 0%,transparent 50%);pointer-events:none;z-index:0}#root{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}@media(max-width:768px){#root{height:auto;min-height:100vh}}.dashboard{display:flex;flex-direction:column;min-height:100vh;padding:16px;gap:16px}.dashboard-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;flex-shrink:0}.dashboard-main{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr);gap:16px;flex:0 0 auto;height:calc(100vh - 120px);min-height:300px;max-height:calc(100vh - 120px)}@media(max-width:768px){.dashboard{height:auto;min-height:100vh;padding:8px;gap:8px}.dashboard-header{flex-wrap:wrap;gap:8px;padding:10px 12px}.app-title{flex-shrink:0}.app-title h1{font-size:15px}.header-right{flex-wrap:wrap;gap:8px;justify-content:flex-end;flex:1;min-width:0}.dashboard-main{grid-template-columns:1fr;grid-template-rows:auto auto;gap:8px;height:auto;max-height:none}.dashboard-main>:first-child{order:2}.dashboard-main>:last-child{order:1}}@media(max-width:480px){.dashboard{padding:4px;gap:6px}.dashboard-header{padding:8px 10px}.app-title h1{font-size:14px}}.panel{display:flex;flex-direction:column;padding:20px;overflow:hidden;min-height:0}.panel-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-shrink:0}.panel-header h2{font-size:16px;font-weight:600;color:var(--text-primary)}@media(max-width:768px){.panel{padding:14px}.panel.whisper-panel{min-height:60vh;max-height:70vh}.panel.transcript-panel{max-height:30vh}.panel-header{margin-bottom:10px;gap:8px}.panel-header h2{font-size:14px}}.panel-header .icon{width:20px;height:20px;opacity:.7}.panel-content{flex:1;overflow-y:auto;padding-right:4px}.panel-content::-webkit-scrollbar{width:4px}.panel-content::-webkit-scrollbar-track{background:transparent}.panel-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.status-dot.connected{background:var(--accent-green);box-shadow:0 0 8px #34d39980}.status-dot.disconnected{background:var(--accent-red);box-shadow:0 0 8px #f8717180}.transcript-item{padding:12px 16px;border-radius:var(--radius-md);background:#ffffff08;border:1px solid rgba(255,255,255,.05);margin-bottom:8px}.transcript-item .time{font-size:11px;color:var(--text-muted);margin-bottom:4px}.transcript-item .text{font-size:14px;line-height:1.6;color:var(--text-primary)}.advice-card{padding:14px 16px;border-radius:var(--radius-md);margin-bottom:10px;border:1px solid}.advice-card.questions{background:#60a5fa14;border-color:#60a5fa33}.advice-card.hints{background:#34d39914;border-color:#34d39933}.advice-card.shaking{background:#c084fc14;border-color:#c084fc33}.advice-card.reminders{background:#fb923c14;border-color:#fb923c33}.advice-card .card-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.advice-card.questions .card-label{color:var(--accent-blue)}.advice-card.hints .card-label{color:var(--accent-green)}.advice-card.shaking .card-label{color:#c084fc}.advice-card.reminders .card-label{color:var(--accent-orange)}.advice-card ul{list-style:none;padding:0}.advice-card li{font-size:13px;line-height:1.5;color:var(--text-primary);padding:4px 0 4px 16px;position:relative}.advice-card li:before{content:"›";position:absolute;left:0;opacity:.5}.advice-summary{padding:12px 16px;border-radius:var(--radius-md);background:#a78bfa14;border:1px solid rgba(167,139,250,.2);margin-bottom:10px;font-size:13px;line-height:1.5;color:var(--text-secondary)}.advice-summary .card-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;color:var(--accent-purple)}.recording-timer{display:flex;align-items:center;gap:5px;font-size:13px;font-variant-numeric:tabular-nums;color:var(--text-secondary);white-space:nowrap}.audio-controls{display:flex;align-items:center;gap:10px}@media(max-width:768px){.audio-controls{gap:6px}.audio-controls .glass-button{padding:8px 10px;font-size:12px}}@media(max-width:480px){.audio-controls .button-label{display:none}.audio-controls .glass-button{padding:10px;min-width:44px;min-height:44px}}.app-title{display:flex;align-items:center;gap:10px}.app-title h1{font-size:18px;font-weight:700;background:linear-gradient(135deg,var(--accent-blue),var(--accent-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-right{display:flex;align-items:center;gap:16px}.status-info{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-secondary)}@media(max-width:480px){.status-info .status-detail{display:none}.status-info{font-size:11px;gap:4px}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;opacity:.4;text-align:center;gap:12px}.empty-state .icon{width:48px;height:48px}.empty-state p{font-size:14px;color:var(--text-secondary)}.error-banner{padding:10px 16px;background:#f871711a;border:1px solid rgba(248,113,113,.2);border-radius:var(--radius-md);color:var(--accent-red);font-size:13px;margin-bottom:8px}.setup-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100}.setup-dialog{width:480px;max-width:90vw;max-height:90vh;overflow-y:auto;padding:32px}.setup-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.setup-header h2{font-size:20px;font-weight:700}@media(max-width:768px){.setup-overlay{align-items:flex-end;padding:0}.setup-dialog{width:100%;max-width:100%;max-height:95vh;border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:24px 16px;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}.setup-header{margin-bottom:16px}.setup-header h2{font-size:18px}.setup-form{gap:12px;margin-bottom:16px}.setup-select,.setup-textarea{font-size:16px;padding:12px}.setup-submit{padding:14px;font-size:16px;min-height:48px}}.setup-form{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.setup-label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--text-secondary);font-weight:500}.setup-select,.setup-textarea{background:#ffffff0d;border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--text-primary);padding:10px 12px;font-size:14px;font-family:inherit;resize:vertical}.setup-select option{background:var(--bg-dark);color:var(--text-primary)}.setup-textarea:focus,.setup-select:focus{outline:none;border-color:var(--accent-blue)}.setup-submit{width:100%;padding:12px;font-size:15px;font-weight:600;border-color:var(--accent-blue)}.setup-speaker-config{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:8px;background:#ffffff08;border:1px solid rgba(255,255,255,.06)}.setup-section-title{font-size:13px;font-weight:600;color:var(--text-secondary)}.setup-speaker-row{display:flex;gap:12px}.setup-label-inline{flex:1;display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--text-muted);align-items:flex-start}.setup-select-small{width:100%;padding:6px 8px;font-size:12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text-primary)}.speaker-badge{display:inline-block;font-size:10px;font-weight:600;padding:1px 6px;border-radius:4px;margin-left:8px}.speaker-badge.self{background:#60a5fa26;color:var(--accent-blue);border:1px solid rgba(96,165,250,.3)}.speaker-badge.other{background:#34d39926;color:var(--accent-green);border:1px solid rgba(52,211,153,.3)}.transcript-item.speaker-self{border-left:2px solid var(--accent-blue)}.transcript-item.speaker-other{border-left:2px solid var(--accent-green)}@media(max-width:768px){.transcript-item{padding:10px 12px;margin-bottom:6px}.transcript-item .text{font-size:13px;line-height:1.5}.advice-card{padding:12px 14px;margin-bottom:8px}.advice-card li{font-size:13px;line-height:1.5;padding:3px 0 3px 14px}.advice-summary{padding:10px 14px;font-size:13px}.error-banner{font-size:12px;padding:8px 12px}.empty-state .icon{width:36px;height:36px}.empty-state p{font-size:13px}}.report-panel{flex-shrink:0;padding:20px}.report-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-shrink:0}.report-header h2{font-size:16px;font-weight:600;color:var(--text-primary)}.report-header .icon{width:20px;height:20px;opacity:.7}.report-content{overflow-y:auto;max-height:60vh;padding-right:4px}.report-content::-webkit-scrollbar{width:4px}.report-content::-webkit-scrollbar-track{background:transparent}.report-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.report-markdown{font-size:14px;line-height:1.7;color:var(--text-primary)}.report-markdown h2{font-size:18px;font-weight:700;margin-top:24px;margin-bottom:12px;color:var(--text-primary)}.report-markdown h3{font-size:15px;font-weight:600;margin-top:18px;margin-bottom:8px;color:var(--text-primary)}.report-markdown h4{font-size:14px;font-weight:600;margin-top:14px;margin-bottom:6px;color:var(--text-secondary)}.report-markdown strong{color:var(--text-primary);font-weight:600}.report-markdown ul{padding-left:20px;margin:8px 0}.report-markdown li{margin:4px 0;color:var(--text-secondary)}.report-markdown pre{background:#0000004d;border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);padding:14px 16px;overflow-x:auto;margin:12px 0}.report-markdown code{font-family:JetBrains Mono,Fira Code,monospace;font-size:12px;line-height:1.5;color:var(--text-secondary)}.report-markdown p{margin:8px 0}.report-empty{padding:24px;text-align:center;color:var(--text-muted);font-size:13px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}@media(max-width:768px){.report-panel{padding:14px}.report-header{margin-bottom:10px}.report-header h2{font-size:14px}.report-content{max-height:50vh}.report-markdown{font-size:13px}.report-markdown h2{font-size:16px}.report-markdown h3{font-size:14px}.report-empty{padding:16px;font-size:12px}}