*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%}body{color:#e2e8f0;background:#0b1120}:root{--font-sans:"Segoe UI", system-ui, sans-serif;--surface-0:#0b1120;--surface-1:#0f172a;--surface-2:#1e293b;--border:#1e293b;--border-strong:#334155;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--text-success:#10b981;--text-warning:#f59e0b;--text-danger:#ef4444;--fill-success:#10b981;--fill-warning:#f59e0b;--fill-danger:#ef4444;--accent:#3b82f6;--bg-success:#10b98122;--bg-warning:#f59e0b22;--bg-danger:#ef444422;--bg-accent:#1e293b}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--surface-0)}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px}.app{background:var(--surface-0);width:100vw;height:100vh;color:var(--text-primary);font-family:var(--font-sans);display:flex;overflow:hidden}.sidebar{background:var(--surface-1);border-right:1px solid var(--border);flex-direction:column;width:260px;min-width:220px;height:100vh;display:flex;overflow:hidden}.sidebar-head{border-bottom:1px solid var(--border);color:var(--text-primary);padding:16px 12px 12px;font-size:15px;font-weight:700}.sidebar-section{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px 4px;font-size:11px}.video-item{cursor:pointer;border-left:3px solid #0000;border-radius:6px;align-items:center;gap:8px;margin:1px 6px;padding:10px 12px;transition:background .15s;display:flex}.video-item:hover{background:var(--surface-2)}.video-item.active{background:var(--surface-2);border-left-color:var(--accent)}.video-item .vname{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;max-width:160px;font-size:12px;font-weight:500;overflow:hidden}.video-item .vstatus{margin-top:4px;font-size:11px}.video-delete-btn{width:20px;height:20px;color:var(--text-muted);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;line-height:1;transition:opacity .15s,background .15s,color .15s;display:flex}.video-item:hover .video-delete-btn,.video-item.active .video-delete-btn{opacity:1}.video-delete-btn:hover{background:var(--bg-danger);color:var(--text-danger)}.status-done{color:var(--text-success)}.status-proc{color:var(--text-warning)}.status-fail{color:var(--text-danger);word-break:break-word}.dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.dot-done{background:var(--fill-success)}.dot-proc{background:var(--fill-warning)}.dot-fail{background:var(--fill-danger)}.add-btn{border:1px dashed var(--border-strong);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:6px;justify-content:center;align-items:center;gap:6px;margin:10px 10px 0;padding:8px;font-size:13px;font-weight:600;display:flex}.add-btn:hover:not(:disabled){background:var(--surface-2);color:var(--text-secondary)}.add-btn:disabled{cursor:not-allowed;opacity:.6}.empty-state{height:60vh;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.empty-state-icon{font-size:48px}.empty-state p{text-align:center;font-size:15px}.skeleton{background:linear-gradient(90deg, var(--surface-1) 25%, var(--surface-2) 50%, var(--surface-1) 75%);background-size:200% 100%;animation:1.5s infinite shimmer}.error-block{background:var(--surface-2);border:1px solid var(--fill-danger);border-radius:12px;padding:24px}.error-block-title{color:var(--text-danger);margin:0 0 8px;font-weight:600}.error-block-text{color:var(--text-secondary);margin:0;font-size:13px}.main-panel{flex:1;padding:24px 32px;overflow-y:auto}.main-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:24px;display:flex}.video-title{color:var(--text-primary);margin:0 0 4px;font-size:20px;font-weight:700}.video-meta{color:var(--text-muted);font-size:13px}.badge{white-space:nowrap;border-radius:20px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:500;display:inline-flex}.badge-done{background:var(--bg-success);color:var(--text-success)}.badge-partial{color:#c4b5fd;background:#4c1d95}.badge-proc{background:var(--bg-warning);color:var(--text-warning)}.badge-fail{background:var(--bg-danger);color:var(--text-danger)}.spinner{border:2px solid;border-top-color:#0000;border-radius:50%;width:10px;height:10px;animation:.8s linear infinite spin;display:inline-block}.chart-area{flex-direction:column;gap:10px;display:flex}.stage-text{color:var(--text-muted);text-align:center;font-size:12px}.transcript-panel{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;overflow:hidden}.transcript-head{color:var(--text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.transcript-head:hover{background:var(--surface-2)}.transcript-body{border-top:1px solid var(--border);max-height:320px;padding:4px 16px 12px;overflow-y:auto}.transcript-line{border-bottom:1px solid var(--border);border-left:3px solid #0000;align-items:baseline;gap:12px;padding:6px 0;font-size:12px;line-height:1.5;display:flex}.transcript-line:last-child{border-bottom:none}.transcript-time{width:42px;color:var(--text-muted);font-variant-numeric:tabular-nums;flex-shrink:0}.transcript-tag{white-space:nowrap;border-radius:4px;flex-shrink:0;padding:1px 7px;font-size:10px;font-weight:600}.transcript-tag-empty{flex-shrink:0;width:0}.transcript-text{color:var(--text-secondary)}.login-screen{background:var(--surface-0);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}.login-card{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:14px;width:320px;padding:28px 24px;display:flex}.login-title{color:var(--text-primary);margin-bottom:4px;font-size:17px;font-weight:700}.login-input{background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text-primary);font-size:13px;font-family:var(--font-sans);border-radius:6px;padding:9px 10px}.login-input:focus{border-color:var(--accent);outline:none}.login-error{color:var(--text-danger);background:var(--bg-danger);border:1px solid var(--fill-danger);border-radius:6px;padding:8px 10px;font-size:12px}.login-submit{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:9px;font-size:13px;font-weight:600}.login-submit:disabled{opacity:.6;cursor:not-allowed}.insights-panel{background:var(--surface-1);border-left:1px solid var(--border);flex-direction:column;width:240px;display:flex;overflow:hidden}.panel-head{border-bottom:1px solid var(--border);color:var(--text-primary);flex-shrink:0;padding:12px 14px;font-size:13px;font-weight:500}.panel-scroll{flex:1;padding:10px;overflow-y:auto}.flag-card{border:1px solid var(--border);cursor:pointer;background:var(--surface-2);border-radius:8px;margin-bottom:8px;padding:9px 10px}.flag-card:hover{border-color:var(--border-strong)}.flag-card.danger{border-left:2px solid var(--fill-danger);border-radius:0 8px 8px 0}.flag-card.warning{border-left:2px solid var(--fill-warning);border-radius:0 8px 8px 0}.flag-time{color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:11px;font-weight:500}.flag-text{color:var(--text-secondary);margin-top:2px;font-size:11px;line-height:1.4}.flag-drop{color:var(--text-danger);margin-top:4px;font-size:10px;font-weight:500}.flag-drop-warn{color:var(--text-warning)}.flags-empty{background:var(--bg-success);border:1px solid var(--fill-success);color:var(--text-success);text-align:center;border-radius:8px;padding:12px;font-size:12px}.panel-section{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;border-top:1px solid var(--border);flex-shrink:0;margin-top:4px;padding:10px 10px 6px;font-size:11px;font-weight:500}.stat-row{justify-content:space-between;align-items:center;padding:5px 10px;display:flex}.stat-label{color:var(--text-secondary);font-size:11px}.stat-val{color:var(--text-primary);font-size:12px;font-weight:500}.progress-bar{background:var(--surface-0);border-radius:2px;height:4px;margin:0 10px 10px;overflow:hidden}.progress-fill{border-radius:2px;height:100%}