:root{--bg-app:#0d1117;--bg-sidebar:#0d1117;--bg-topbar:#161b22;--bg-card:#161b22;--bg-card-hover:#1c2333;--bg-input:#0d1117;--border:#30363d;--border-muted:#21262d;--text-primary:#e6edf3;--text-secondary:#8b949e;--text-muted:#6e7681;--text-link:#58a6ff;--accent:#1f6feb;--accent-hover:#388bfd;--accent-dim:rgba(31,111,235,.15);--s-healthy-bg:rgba(63,185,80,.12);--s-healthy-fg:#3fb950;--s-healthy-bd:#238636;--s-alert-bg:rgba(210,153,34,.12);--s-alert-fg:#d29922;--s-alert-bd:#9e6a03;--s-offline-bg:rgba(248,81,73,.12);--s-offline-fg:#f85149;--s-offline-bd:#da3633;--s-dormant-bg:rgba(139,148,158,.12);--s-dormant-fg:#8b949e;--s-dormant-bd:#6e7681;--s-unknown-bg:rgba(110,118,129,.08);--s-unknown-fg:#6e7681;--s-unknown-bd:#30363d;--s-blue-bg:rgba(31,111,235,.12);--s-blue-fg:#58a6ff;--s-blue-bd:#1f6feb;--sidebar-w:220px;--topbar-h:58px;--pad:24px;--radius:6px;--card-radius:8px;--shadow:0 4px 16px rgba(0,0,0,.5)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;scroll-behavior:smooth}
body{background:var(--bg-app);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;line-height:1.5;display:flex;min-height:100vh;overflow-x:hidden}
body.light-mode{--bg-app:#f6f8fa;--bg-sidebar:#ffffff;--bg-topbar:#ffffff;--bg-card:#ffffff;--bg-card-hover:#f0f3f6;--bg-input:#ffffff;--border:#d0d7de;--border-muted:#d8dee4;--text-primary:#24292f;--text-secondary:#57606a;--text-muted:#6e7781;--shadow:0 4px 16px rgba(31,35,40,.12)}
a{color:var(--text-link);text-decoration:none}
a:hover{text-decoration:underline}
ul,ol{list-style:none}
img{max-width:100%}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:var(--bg-app)}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}
.sidebar{width:var(--sidebar-w);min-height:100vh;background:var(--bg-sidebar);border-right:1px solid var(--border);position:fixed;top:0;left:0;bottom:0;display:flex;flex-direction:column;z-index:100;transition:transform .25s ease;overflow-y:auto;overflow-x:hidden}
.main-wrapper{margin-left:var(--sidebar-w);flex:1;display:flex;flex-direction:column;min-height:100vh;min-width:0}
.topbar{height:var(--topbar-h);background:var(--bg-topbar);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:90;display:flex;align-items:center;padding:0 var(--pad);gap:12px}
.main-content{flex:1;padding:var(--pad);max-width:1400px;width:100%}
.auth-body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg-app)}
.sidebar-brand{padding:16px;border-bottom:1px solid var(--border-muted);display:flex;align-items:center;gap:10px;flex-shrink:0}
.sidebar-brand-icon{width:34px;height:34px;background:var(--accent);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.sidebar-brand-text{font-size:13px;font-weight:700;line-height:1.3}
.sidebar-brand-sub{font-size:10px;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase}
.sidebar-nav{flex:1;padding:10px 0}
.sidebar-section{margin-bottom:2px}
.sidebar-section-label{padding:10px 16px 3px;font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px}
.sidebar-link{display:flex;align-items:center;gap:9px;padding:8px 16px;color:var(--text-secondary);font-size:13.5px;border-left:2px solid transparent;transition:all .13s ease;text-decoration:none}
.sidebar-link:hover{color:var(--text-primary);background:rgba(88,166,255,.06);text-decoration:none}
.sidebar-link.active{color:var(--text-link);background:rgba(88,166,255,.09);border-left-color:var(--accent-hover)}
.link-icon{font-size:14px;width:18px;text-align:center;flex-shrink:0}
.sidebar-footer{padding:12px 16px;border-top:1px solid var(--border-muted);flex-shrink:0}
.sidebar-footer-user{font-size:12px;color:var(--text-secondary);margin-bottom:6px}
.sidebar-footer-link{font-size:12px;color:var(--text-muted)}
.sidebar-footer-link:hover{color:var(--text-secondary)}
.topbar-hamburger{display:none;background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:20px;padding:6px;border-radius:var(--radius)}
.topbar-hamburger:hover{color:var(--text-primary);background:var(--bg-card-hover)}
.topbar-title{font-size:15px;font-weight:600;color:var(--text-primary)}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.topbar-date{font-size:12px;color:var(--text-muted)}
.topbar-btn{background:none;border:1px solid var(--border);color:var(--text-secondary);padding:5px 12px;border-radius:var(--radius);cursor:pointer;font-size:12.5px;transition:all .13s;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.topbar-btn:hover{color:var(--text-primary);border-color:var(--text-secondary);text-decoration:none}
.flash-container{padding:0 var(--pad);padding-top:12px}
.flash{padding:10px 16px;border-radius:var(--radius);font-size:13.5px;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.flash-success{background:var(--s-healthy-bg);border:1px solid var(--s-healthy-bd);color:var(--s-healthy-fg)}
.flash-error{background:var(--s-offline-bg);border:1px solid var(--s-offline-bd);color:var(--s-offline-fg)}
.page-header{margin-bottom:24px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.page-header-left h1{font-size:22px;font-weight:700;letter-spacing:-.3px}
.page-header-left p{color:var(--text-muted);font-size:13px;margin-top:3px}
.page-header-actions{display:flex;gap:8px;flex-wrap:wrap}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}
.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.quick-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:99}
.sidebar-overlay.active{display:block}
.copy-feedback{position:fixed;bottom:78px;right:20px;background:var(--s-healthy-bg);border:1px solid var(--s-healthy-bd);color:var(--s-healthy-fg);padding:8px 16px;border-radius:var(--radius);font-size:13px;font-weight:500;z-index:9999;pointer-events:none;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}
.copy-feedback.show{opacity:1;transform:translateY(0)}
.scratch-pad-toggle{position:fixed;bottom:20px;right:20px;width:44px;height:44px;border-radius:50%;background:var(--accent);color:#fff;border:none;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:200;box-shadow:var(--shadow);transition:background .15s,transform .15s}
.scratch-pad-toggle:hover{background:var(--accent-hover);transform:scale(1.05)}
.scratch-pad-panel{position:fixed;bottom:74px;right:20px;width:320px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--card-radius);z-index:200;box-shadow:var(--shadow);display:none;flex-direction:column}
.scratch-pad-panel.open{display:flex}
.scratch-pad-header{padding:10px 14px;border-bottom:1px solid var(--border-muted);display:flex;align-items:center;justify-content:space-between}
.scratch-pad-header span:first-child{font-size:13px;font-weight:600}
.scratch-save-status{font-size:11px;color:var(--text-muted)}
.scratch-pad-panel textarea{border:none;border-radius:0 0 var(--card-radius) var(--card-radius);background:var(--bg-card);height:200px;resize:none;font-size:13px;color:var(--text-primary);padding:12px 14px;font-family:inherit}
.scratch-pad-panel textarea:focus{outline:none;box-shadow:none}
.error-page{text-align:center;padding:60px 20px}
.error-code{font-size:72px;font-weight:800;color:var(--text-muted);opacity:.4;line-height:1;margin-bottom:12px}
.error-title{font-size:22px;color:var(--text-secondary);margin-bottom:10px}
.error-msg{color:var(--text-muted);font-size:14px;margin-bottom:24px;line-height:1.7}
.error-detail{font-family:monospace;font-size:12.5px;background:var(--bg-card);border:1px solid var(--border);color:var(--s-offline-fg);padding:12px 16px;border-radius:var(--radius);max-width:640px;margin:0 auto 24px;text-align:left;overflow-x:auto}