:root,[data-theme=dark]{--bg-color:#1e1e2e;--surface-color:#181825;--border-color:#313244;--dot-color:#313244;--text-main:#cdd6f4;--text-muted:#a6adc8;--primary:#89b4fa;--accent-green:#a6e3a1;--accent-red:#f38ba8;--accent-mauve:#cba6f7;--hover-bg:#313244}[data-theme=light]{--bg-color:#f8f9fa;--surface-color:#fff;--border-color:#dee2e6;--dot-color:#ced4da;--text-main:#212529;--text-muted:#868e96;--primary:#339af0;--accent-green:#40c057;--accent-red:#fa5252;--accent-mauve:#845ef7;--hover-bg:#f1f3f5}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);background-image:radial-gradient(var(--dot-color) 1px, transparent 1px);background-size:24px 24px;font-family:Inter,-apple-system,sans-serif;line-height:1.5}.mono{font-family:JetBrains Mono,monospace}.text-muted{color:var(--text-muted)}.app-container{flex-wrap:wrap;min-height:100vh;display:flex}.topbar{z-index:200;background:var(--surface-color);border-bottom:1px solid var(--border-color);align-items:center;gap:24px;height:44px;padding:10px 24px;display:flex;position:fixed;top:0;left:0;right:0}.sidebar{background:var(--surface-color);border-right:1px solid var(--border-color);z-index:100;flex-direction:column;width:260px;min-width:260px;display:flex;position:fixed;top:44px;bottom:0;left:0}.sidebar-brand{border-bottom:1px solid var(--border-color);align-items:center;gap:10px;padding:20px 24px;display:flex}.brand-icon{background:var(--primary);width:32px;height:32px;color:var(--bg-color);justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex}.brand-text{color:var(--text-main);font-size:1.1rem;font-weight:700}.sidebar-nav{flex-direction:column;flex:1;padding:8px 0;display:flex}.nav-item{color:var(--text-muted);border-left:4px solid #0000;padding:12px 24px;font-size:.9rem;text-decoration:none;transition:all .15s;display:block}.nav-item:hover{background:var(--hover-bg);color:var(--text-main)}.nav-item-active{background:var(--hover-bg);border-left-color:var(--primary);color:var(--primary)!important}.sidebar-footer{border-top:1px solid var(--border-color);gap:8px;padding:16px;display:flex}.theme-toggle,.logout-btn{border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;background:0 0;flex:1;padding:8px;font-family:Inter,sans-serif;font-size:.8rem}.theme-toggle:hover,.logout-btn:hover{background:var(--hover-bg);color:var(--text-main)}.main-content{flex:1;min-height:calc(100vh - 44px);margin-top:44px;margin-left:260px;padding:24px}.page{max-width:1200px}.page-title{margin-bottom:20px;font-size:1.5rem;font-weight:700}.page-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.header-actions{align-items:center;gap:8px;display:flex}.topbar-item{align-items:center;gap:8px;font-size:.85rem;display:flex}.topbar-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.topbar-dot-green{background:var(--accent-green)}.topbar-dot-red{background:var(--accent-red)}.topbar-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);font-size:.7rem}.stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}.stat-card{background:var(--surface-color);border:1px solid var(--border-color);padding:24px}.stat-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:8px;font-size:.85rem}.stat-value{color:var(--text-main);font-family:JetBrains Mono,monospace;font-size:2rem;font-weight:700}.card{background:var(--surface-color);border:1px solid var(--border-color);margin-bottom:16px;padding:24px}.card-title{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:16px;font-size:.85rem}.account-strip{flex-direction:column;gap:12px;display:flex}.account-chip{background:var(--hover-bg);border:1px solid var(--border-color);flex-wrap:wrap;align-items:center;gap:12px;padding:10px 14px;display:flex}.account-name{font-weight:500}.account-model{color:var(--text-muted);font-family:JetBrains Mono,monospace;font-size:.8rem}.queue-detail{color:#f9e2af;font-family:JetBrains Mono,monospace;font-size:.75rem}.badge{background:var(--hover-bg);border:1px solid var(--border-color);color:var(--text-main);padding:2px 8px;font-size:.75rem;font-weight:500;display:inline-block}.badge-active{color:var(--accent-green);border-color:var(--accent-green)}.badge-queued{color:#f9e2af;border-color:#f9e2af}.badge-cooldown{color:var(--accent-red);border-color:var(--accent-red)}.badge-paused,.badge-none{color:var(--text-muted)}.badge-http{color:var(--primary);border-color:var(--primary)}.badge-socks5{color:var(--accent-mauve);border-color:var(--accent-mauve)}.badge-serve-active{color:var(--accent-green);border-color:var(--accent-green)}.badge-serve-inactive{color:var(--accent-red);border-color:var(--accent-red)}.table-wrapper{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:.85rem}.data-table th{text-align:left;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:1px solid var(--border-color);padding:8px 12px;font-family:Inter,sans-serif;font-size:.75rem}.data-table td{border-bottom:1px solid var(--border-color);padding:8px 12px;font-family:JetBrains Mono,monospace;font-size:.8rem}.data-table tr:hover{background:var(--hover-bg)}.error-cell{color:var(--accent-red);text-overflow:ellipsis;white-space:nowrap;max-width:320px;overflow:hidden}.error-toggle{color:var(--accent-red);cursor:pointer;text-align:left;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:none;max-width:320px;padding:0;font-family:JetBrains Mono,monospace;font-size:.8rem;overflow:hidden}.error-toggle:hover{text-decoration:underline}.error-detail-row td{background:var(--hover-bg);border-bottom:1px solid var(--border-color);padding:8px 16px}.error-detail-pre{white-space:pre-wrap;word-break:break-word;color:var(--accent-red);max-height:280px;margin:0;font-family:JetBrains Mono,monospace;font-size:.78rem;overflow-y:auto}.actions{white-space:nowrap}.actions .btn+.btn{margin-left:6px}.btn{border:1px solid var(--border-color);color:var(--text-main);cursor:pointer;background:0 0;padding:8px 16px;font-family:Inter,sans-serif;font-size:.85rem}.btn:hover{background:var(--hover-bg)}.btn-sm{padding:4px 10px;font-size:.75rem}.btn-primary{border-color:var(--primary);color:var(--primary)}.btn-primary:hover{background:var(--primary);color:var(--bg-color)}.btn-danger{border-color:var(--accent-red);color:var(--accent-red)}.btn-danger:hover{background:var(--accent-red);color:var(--bg-color)}.form-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));align-items:end;gap:12px;display:grid}.filter-row{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));align-items:end;gap:12px;display:grid}input,select{background:var(--bg-color);border:1px solid var(--border-color);color:var(--text-main);width:100%;padding:8px 12px;font-family:JetBrains Mono,monospace;font-size:.85rem}input:focus,select:focus{border-color:var(--primary);outline:none}.toggle-label{color:var(--text-muted);cursor:pointer;align-items:center;gap:6px;font-size:.8rem;display:flex}.toggle-label input{width:auto}.pagination{border-top:1px solid var(--border-color);align-items:center;gap:12px;margin-top:16px;padding-top:12px;display:flex}.editable-name{cursor:pointer;border-bottom:1px dashed var(--text-muted);padding:2px 4px}.editable-name:hover{color:var(--primary)}.rename-row{align-items:center;gap:6px;display:flex}.rename-row input{flex:1}.login-page{justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{background:var(--surface-color);border:1px solid var(--border-color);width:100%;max-width:400px;padding:48px}.login-card h1{text-align:center;margin-bottom:24px;font-size:1.2rem}.login-card form{flex-direction:column;gap:12px;display:flex}.login-card input{width:100%}.error-text{color:var(--accent-red);font-size:.85rem}@media (width<=768px){.app-container{flex-direction:column}.topbar{gap:12px;height:36px;padding:6px 12px;font-size:.75rem}.sidebar{width:100%;min-width:unset;border-right:none;border-top:1px solid var(--border-color);flex-direction:row;height:auto;position:fixed;inset:auto 0 0}.sidebar-brand{display:none}.sidebar-nav{flex-direction:row;padding:0;overflow-x:auto}.nav-item{white-space:nowrap;border-bottom:4px solid #0000;border-left:none;padding:12px 16px}.nav-item-active{border-left:none;border-bottom-color:var(--primary)}.sidebar-footer{display:none}.main-content{margin-top:36px;margin-left:0;padding:16px 16px 70px}.stats-grid{grid-template-columns:repeat(2,1fr)}.form-grid,.filter-row{grid-template-columns:1fr}.topbar{flex-wrap:wrap;gap:8px}}@media (width>=769px) and (width<=1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}}.charts-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-bottom:16px;display:grid}.chart-card{min-height:260px}.sparkline{width:100%;height:40px}.model-breakdown{flex-wrap:wrap;gap:8px;display:flex}.model-badge{background:var(--hover-bg);border:1px solid var(--border-color);align-items:center;gap:8px;padding:6px 12px;display:flex}.model-name{font-family:JetBrains Mono,monospace;font-size:.8rem}.model-count{color:var(--primary);font-size:.8rem}.auth-flow-status{padding:16px 0}.auth-flow-status p{margin-bottom:8px}.auth-flow-link{background:var(--primary);color:var(--bg-color);word-break:break-all;margin-bottom:12px;padding:8px 16px;text-decoration:none;display:inline-block}.auth-flow-link:hover{opacity:.9}.poll-indicator{background:var(--primary);vertical-align:middle;border-radius:50%;width:8px;height:8px;margin-right:6px;animation:1.5s ease-in-out infinite pulse;display:inline-block}@keyframes pulse{0%,to{opacity:.3}50%{opacity:1}}.model-binding-grid{flex-direction:column;gap:12px;display:flex}.model-binding-row{background:var(--hover-bg);border:1px solid var(--border-color);align-items:flex-start;gap:16px;padding:10px 14px;display:flex}.model-binding-model{min-width:180px;padding-top:2px;font-size:.85rem}.model-binding-accounts{flex-wrap:wrap;gap:8px;display:flex}.model-binding-acct{align-items:center;gap:8px;font-size:.85rem;display:flex}.error-banner{justify-content:space-between;align-items:center;gap:12px;display:flex;border-color:var(--accent-red)!important}.created-key-banner{flex-wrap:wrap;align-items:center;gap:8px;display:flex;border-color:var(--accent-green)!important}.created-key-banner .mono{word-break:break-all;-webkit-user-select:all;user-select:all}.confirm-dialog{border-color:var(--accent-mauve)!important}.confirm-dialog p{margin-bottom:12px}.confirm-actions{gap:8px;display:flex}.toast-container{z-index:1000;pointer-events:none;position:fixed;bottom:20px;left:20px}.toast{white-space:pre-wrap;overflow-wrap:anywhere;color:#cdd6f4;pointer-events:auto;background:#313244;border:1px solid #45475a;border-radius:8px;max-width:min(540px,100vw - 40px);padding:12px 40px 12px 16px;font:13px/1.45 JetBrains Mono,monospace;animation:.35s ease-out toast-in,.3s 3.7s forwards toast-out;position:relative}.toast-success{border-left:3px solid #a6e3a1}.toast-info{border-left:3px solid #89b4fa}.toast-warn{border-left:3px solid #f9e2af}.toast-error{border-left:3px solid #f38ba8}.toast-close{color:#6c7086;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:16px;line-height:1;position:absolute;top:8px;right:8px}.toast-close:hover{color:#cdd6f4;background:#45475a}@keyframes toast-in{0%{opacity:0;transform:translate(-120%)}to{opacity:1;transform:translate(0)}}@keyframes toast-out{0%{opacity:1}to{opacity:0}}.usage-page{animation:.35s ease-out usage-fade-in}@keyframes usage-fade-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.usage-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px;display:flex}.usage-filters{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.timeframe-pills{gap:4px;display:flex}.tf-pill{border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;background:0 0;padding:5px 12px;font-family:Inter,sans-serif;font-size:.78rem;transition:all .15s}.tf-pill:hover{background:var(--hover-bg);color:var(--text-main)}.tf-pill-active{background:var(--primary)!important;color:var(--bg-color)!important;border-color:var(--primary)!important}.usage-stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}.usage-stat-card{background:var(--surface-color);border:1px solid var(--border-color);align-items:flex-start;gap:14px;padding:20px;animation:.4s ease-out backwards usage-stat-pop;display:flex}.usage-stat-card:first-child{animation-delay:50ms}.usage-stat-card:nth-child(2){animation-delay:.1s}.usage-stat-card:nth-child(3){animation-delay:.15s}.usage-stat-card:nth-child(4){animation-delay:.2s}@keyframes usage-stat-pop{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.usage-stat-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;display:flex}.usage-stat-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:4px;font-size:.7rem}.usage-stat-value{color:var(--text-main);font-family:JetBrains Mono,monospace;font-size:1.6rem;font-weight:700;line-height:1.2}.usage-stat-hint{color:var(--text-muted);margin-top:2px;font-size:.7rem}.usage-chart-card{animation:.35s ease-out .25s backwards usage-fade-in}.usage-chart-header{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.usage-legend-strip{border-top:1px solid var(--border-color);flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;padding-top:10px;display:flex}.legend-hint{border:1px solid var(--border-color);color:var(--text-muted);padding:2px 8px;font-size:.7rem}.legend-model-pill{border:1px solid var(--border-color);color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:6px;max-width:14rem;padding:3px 10px;font-family:JetBrains Mono,monospace;font-size:.7rem;display:inline-flex;overflow:hidden}.legend-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.text-right{text-align:right}@media (width<=768px){.usage-stats-grid{grid-template-columns:repeat(2,1fr)}.usage-header{flex-direction:column;align-items:flex-start}}.home-stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}.home-stat-card{background:var(--surface-color);border:1px solid var(--border-color);align-items:flex-start;gap:14px;padding:20px;animation:.4s ease-out backwards usage-stat-pop;display:flex}.home-stat-card:first-child{animation-delay:50ms}.home-stat-card:nth-child(2){animation-delay:.1s}.home-stat-card:nth-child(3){animation-delay:.15s}.home-stat-card:nth-child(4){animation-delay:.2s}.home-stat-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;display:flex}.home-stat-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:4px;font-size:.7rem}.home-stat-value{color:var(--text-main);font-family:JetBrains Mono,monospace;font-size:1.6rem;font-weight:700;line-height:1.2}.home-hourly-card{cursor:default}.home-hourly-header{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.home-hourly-stats{gap:16px;display:flex}.home-hourly-stat{flex-direction:column;align-items:flex-end;display:flex}.home-hourly-stat-val{color:var(--primary);font-size:.85rem;font-weight:600}.home-hourly-stat-lbl{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.65rem}.home-hourly-bars{align-items:flex-end;gap:3px;height:80px;padding-top:4px;display:flex}.home-hourly-bar-wrap{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;height:100%;display:flex;position:relative}.home-hourly-bar{border-radius:2px 2px 0 0;width:100%;min-height:2px;transition:height .3s,background .3s}.home-hourly-bar-wrap:hover .home-hourly-bar{filter:brightness(1.3);box-shadow:0 0 8px #89b4fa4d}.chart-tooltip{pointer-events:none;opacity:0;white-space:nowrap;z-index:10;background:#1e1e2e;border:1px solid #45475a;border-radius:6px;flex-direction:column;align-items:center;gap:1px;padding:6px 10px;transition:opacity .15s,transform .15s;display:flex;position:absolute;bottom:100%;left:50%;transform:translate(-50%)translateY(-4px);box-shadow:0 4px 12px #0000004d}.chart-tooltip:after{content:"";border:5px solid #0000;border-top-color:#45475a;position:absolute;top:100%;left:50%;transform:translate(-50%)}.home-hourly-bar-wrap:hover .chart-tooltip{opacity:1;transform:translate(-50%)translateY(-8px)}.chart-tooltip-title{color:#cdd6f4;font-family:JetBrains Mono,monospace;font-size:.75rem;font-weight:700}.chart-tooltip-value{color:#89b4fa;font-family:JetBrains Mono,monospace;font-size:.65rem}.home-hourly-label{color:var(--text-muted);height:12px;margin-top:4px;font-family:JetBrains Mono,monospace;font-size:.55rem}.model-tokens{color:var(--accent-mauve);margin-left:4px;font-size:.7rem}@media (width<=768px){.home-stats-grid{grid-template-columns:repeat(2,1fr)}.home-hourly-header{flex-direction:column}}#chartjs-tooltip{pointer-events:none;opacity:0;z-index:9999;background:#1e1e2e;border:1px solid #45475a;border-radius:8px;min-width:140px;padding:10px 14px;font-family:JetBrains Mono,monospace;transition:opacity .12s;position:absolute;box-shadow:0 6px 20px #00000080}#chartjs-tooltip table{border-collapse:collapse}.cjs-tt-title{color:#cdd6f4;text-align:left;border-bottom:1px solid #45475a;margin-bottom:4px;padding-bottom:5px;font-size:.72rem;font-weight:700}.cjs-tt-row{color:#a6adc8;white-space:nowrap;align-items:center;gap:4px;padding:2px 0;font-size:.7rem;display:flex}.proxy-bound-acct{background:var(--hover-bg);border:1px solid var(--border-color);margin:1px 2px;padding:1px 6px;font-size:.75rem;display:inline-block}.test-result{margin-top:2px;font-size:.7rem}.test-ok{color:var(--accent-green)}.test-fail{color:var(--accent-red)}.modal-backdrop{z-index:1000;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--bg-color);border:1px solid var(--border-color);width:90%;min-width:420px;max-width:560px;padding:20px;box-shadow:0 8px 32px #0006}.modal-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;display:flex}.modal .form-grid{grid-template-columns:110px 1fr;align-items:center}.modal .form-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.75rem}.modal-actions{grid-column:1/-1;justify-content:flex-end;gap:8px;margin-top:8px;display:flex}