@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg:#f5f5f5;--bg-panel:#fff;--bg-inset:#f0f0f0;--bg-topbar:#1a1a1a;--border:#e0e0e0;--border-dim:#eee;--border-dark:#ccc;--text:#333;--text-dim:#888;--text-bright:#111;--mono:"JetBrains Mono", "Menlo", monospace;--sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--black:#111;--red:#b91c1c;--red-bg:#fee2e2;--red-bdr:#fca5a5;--radius:4px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-size:13px;line-height:1.45}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}.label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);font-size:10px;font-weight:600}.mono{font-family:var(--mono)}.panel-title{letter-spacing:.08em;text-transform:uppercase;color:var(--text-bright);font-size:11px;font-weight:700}.app-shell{flex-direction:column;height:100vh;display:flex;overflow:hidden}.app-body{flex:1;display:flex;overflow:hidden}.main-content{flex-direction:column;flex:1;display:flex;overflow:hidden}.main-scrollable{flex-direction:column;flex:1;gap:12px;padding:16px;display:flex;overflow-y:auto}.topbar{background:var(--bg-topbar);z-index:100;flex-shrink:0;align-items:center;height:44px;padding:0 16px;display:flex}.topbar-brand{border-right:1px solid #333;align-items:center;gap:10px;margin-right:4px;padding-right:20px;display:flex}.topbar-logo{letter-spacing:.18em;text-transform:uppercase;color:#fff;font-size:12px;font-weight:700}.topbar-logo span{color:#999;font-weight:400}.topbar-right{align-items:center;gap:14px;margin-left:auto;display:flex}.live-indicator{letter-spacing:.1em;color:#4ade80;font-size:10px;font-weight:700;font-family:var(--mono);align-items:center;gap:6px;display:flex}.live-dot{background:#4ade80;border-radius:50%;width:6px;height:6px;animation:2s infinite pulse;box-shadow:0 0 8px #4ade8099}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.topbar-logout{color:#999;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;font-size:10px;font-family:var(--mono);background:0 0;border:1px solid #444;border-radius:2px;align-items:center;gap:4px;padding:4px 10px;transition:all .15s;display:flex}.topbar-logout:hover{color:#fff;border-color:#888}.sidebar{border-right:1px solid var(--border);background:var(--bg-panel);flex-direction:column;width:240px;min-width:240px;display:flex;overflow:hidden}.sidebar-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.sidebar-body{flex:1;overflow-y:auto}.sidebar-empty{color:var(--text-dim);padding:24px 14px;font-size:12px;line-height:1.7}.sidebar-item{border-bottom:1px solid var(--border-dim);cursor:pointer;padding:10px 14px;transition:background .1s;display:block}.sidebar-item:hover{background:var(--bg-inset)}.sidebar-item.active{background:var(--bg-inset);border-left:3px solid var(--black)}.sidebar-item-top{align-items:center;gap:6px;margin-bottom:4px;display:flex}.sidebar-item-name{color:var(--text-bright);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:12px;font-weight:500;overflow:hidden}.sidebar-del{color:var(--text-dim);cursor:pointer;opacity:0;background:0 0;border:none;align-items:center;padding:1px;transition:opacity .15s;display:flex}.sidebar-item:hover .sidebar-del{opacity:1}.sidebar-del:hover{color:var(--red)}.sidebar-item-meta{justify-content:space-between;align-items:center;display:flex}.sidebar-score{font-family:var(--mono);font-size:12px;font-weight:600}.sidebar-date{color:var(--text-dim);font-size:10px;font-family:var(--mono)}.upload-panel{background:var(--bg-panel);border:2px dashed var(--border-dark);border-radius:var(--radius);text-align:center;cursor:pointer;padding:40px 24px;transition:all .2s}.upload-panel:hover,.upload-panel.drag-active{border-color:var(--black);background:var(--bg-inset)}.upload-panel.uploading{cursor:default;border-style:solid;border-color:#999}.upload-icon{color:#999;margin-bottom:8px;font-size:1.6rem}.upload-title{color:var(--text-bright);margin-bottom:4px;font-size:13px;font-weight:600}.upload-hint{color:var(--text-dim);font-size:11px;font-family:var(--mono)}.upload-loading{flex-direction:column;align-items:center;gap:8px;display:flex}.spinner{border:2px solid var(--border-dark);border-top-color:var(--black);border-radius:50%;width:20px;height:20px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.progress-bar-track{background:var(--border);border-radius:2px;width:200px;height:3px}.progress-bar-fill{background:var(--black);border-radius:2px;height:100%;transition:width .3s}.error-banner{background:var(--red-bg);border:1px solid var(--red-bdr);color:var(--red);font-size:12px;font-family:var(--mono);border-radius:var(--radius);align-items:center;gap:8px;padding:10px 14px;display:flex}.upload-compact{background:var(--bg-panel);border-bottom:1px solid var(--border);cursor:pointer;flex-shrink:0;align-items:center;gap:8px;padding:8px 14px;transition:background .1s;display:flex}.upload-compact:hover{background:var(--bg-inset)}.upload-compact.uploading{cursor:default}.upload-compact-text{color:var(--text-dim);font-size:11px;font-weight:500}.explorer-full{flex-direction:column;flex:1;display:flex;overflow:hidden}.explorer-upload-bar{flex-shrink:0}.explorer-no-data{text-align:center;color:var(--text-dim);padding:20px;font-size:12px;line-height:1.8}.explorer-main{flex:1;display:flex;overflow:hidden}.explorer-video-col{border-right:1px solid var(--border);background:var(--bg-panel);flex-direction:column;flex-shrink:0;width:360px;min-width:300px;display:flex}.explorer-video-wrap{background:#000;justify-content:center;align-items:center;min-height:220px;display:flex}.explorer-video-el{object-fit:contain;width:100%;max-height:300px;display:block}.explorer-video-placeholder{text-align:center;color:var(--text-dim);background:var(--bg-inset);flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:200px;padding:40px 20px;font-size:12px;display:flex}.snapshot-panel{border-top:1px solid var(--border);flex:1;overflow-y:auto}.snapshot-header{border-bottom:1px solid var(--border-dim);background:var(--bg-inset);padding:8px 12px}.snapshot-list{padding:4px 8px}.snapshot-row{align-items:center;gap:6px;padding:3px 4px;display:flex;position:relative}.snapshot-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;z-index:1;flex:1;font-size:10px;overflow:hidden}.snapshot-bar-track{width:100%;position:absolute;top:0;bottom:0;left:0}.snapshot-bar-fill{background:#0000000a;border-radius:2px;height:100%}.snapshot-pct{color:var(--text-bright);z-index:1;text-align:right;min-width:22px;font-size:10px;font-weight:600}.explorer-graph-col{background:var(--bg-panel);flex-direction:column;flex:1;display:flex;overflow:hidden}.explorer-graph-header{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:10px;padding:8px 14px;display:flex}.region-toggles{border-bottom:1px solid var(--border-dim);flex-wrap:wrap;flex-shrink:0;gap:3px;max-height:64px;padding:6px 10px;display:flex;overflow-y:auto}.region-toggle{font-size:9px;font-family:var(--mono);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;white-space:nowrap;background:0 0;border-radius:2px;align-items:center;gap:4px;padding:2px 7px;font-weight:500;transition:all .1s;display:flex}.region-toggle.active{color:var(--text-bright);border-color:var(--border-dark)}.region-toggle-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.tl-pill{letter-spacing:.04em;text-transform:uppercase;font-size:10px;font-weight:600;font-family:var(--mono);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:0 0;border-radius:2px;padding:3px 10px;transition:all .15s}.tl-pill:hover{color:var(--text);border-color:#999}.explorer-chart{flex:1;min-height:0;padding:4px 4px 0}.graph-tooltip{border:1px solid var(--border);border-radius:var(--radius);background:#fff;max-width:200px;padding:8px 12px;box-shadow:0 2px 8px #00000014}.graph-tooltip-time{color:var(--text-dim);font-size:10px;font-family:var(--mono);margin-bottom:4px}.graph-tooltip-row{color:var(--text);align-items:center;gap:4px;padding:1px 0;font-size:10px;display:flex}.graph-tooltip-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.graph-tooltip-more{color:var(--text-dim);margin-top:2px;font-size:9px}.explorer-scrubber{border-top:1px solid var(--border);background:var(--bg-panel);flex-shrink:0;align-items:center;gap:10px;padding:10px 14px;display:flex}.explorer-play-btn-bar{background:var(--black);color:#fff;cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:10px;transition:background .15s;display:flex}.explorer-play-btn-bar:hover{background:#333}.explorer-time{color:var(--text-dim);min-width:36px;font-size:11px}.scrubber-track{background:var(--border);cursor:pointer;border-radius:2px;flex:1;height:4px;position:relative}.scrubber-fill{background:var(--black);border-radius:2px;position:absolute;top:0;bottom:0;left:0}.scrubber-thumb{background:var(--black);z-index:2;border:2px solid #fff;border-radius:50%;width:14px;height:14px;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 1px 3px #0000004d}.login-page{background-color:#f5f5f5;background-image:linear-gradient(#00000005 1px,#0000 1px),linear-gradient(90deg,#00000005 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:48px 48px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{border:1px solid var(--border);border-radius:var(--radius);background:#fff;width:380px;padding:48px 40px;box-shadow:0 1px 3px #0000000f,0 20px 60px #0000000f}.login-eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);font-size:10px;font-weight:700;font-family:var(--mono);margin-bottom:8px}.login-title{color:var(--black);letter-spacing:-.02em;margin-bottom:6px;font-size:24px;font-weight:700}.login-subtitle{color:var(--text-dim);margin-bottom:32px;font-size:12px;line-height:1.7}.login-field-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);font-size:10px;font-weight:700;font-family:var(--mono);margin-bottom:6px;display:block}.login-input{background:var(--bg-inset);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text-bright);font-size:14px;font-family:var(--mono);outline:none;margin-bottom:18px;padding:10px 14px;transition:border-color .2s,box-shadow .2s}.login-input:focus{border-color:#999;box-shadow:0 0 0 3px #0000000d}.login-input::placeholder{color:#bbb}.login-button{background:var(--black);color:#fff;border-radius:var(--radius);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;width:100%;font-size:11px;font-weight:700;font-family:var(--mono);border:none;padding:11px;transition:background .2s}.login-button:hover:not(:disabled){background:#333}.login-button:disabled{opacity:.3;cursor:default}.login-error{background:var(--red-bg);border:1px solid var(--red-bdr);border-radius:var(--radius);color:var(--red);font-size:11px;font-family:var(--mono);margin-top:12px;padding:10px 12px}.toast-container{z-index:9999;flex-direction:column;gap:6px;max-width:340px;display:flex;position:fixed;top:52px;right:16px}.toast-item{border:1px solid var(--border);border-radius:var(--radius);font-size:12px;font-family:var(--mono);background:#fff;border-left:3px solid #999;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;animation:.2s toast-in;display:flex;box-shadow:0 4px 12px #00000014}.toast-close{color:#bbb;cursor:pointer;background:0 0;border:none;padding:0;font-size:16px;line-height:1}.toast-close:hover{color:#555}@keyframes toast-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media (width<=900px){.sidebar{display:none}}@media (width<=700px){.explorer-video-col{width:100%;min-width:100%}.explorer-main{flex-direction:column}}