:root{--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--vs-bg);color:var(--vs-text);font-family:var(--font-sans);font-feature-settings:"cv01","ss03";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.5}a{color:var(--vs-accent);text-decoration:none}a:hover{color:var(--vs-accent-hover)}*{scrollbar-width:thin;scrollbar-color:var(--vs-scrollbar) var(--vs-transparent)}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--vs-scrollbar);border-radius:9999px;border:2px solid var(--vs-transparent);background-clip:content-box}*::-webkit-scrollbar-thumb:hover{background:var(--vs-scrollbar-hover);background-clip:content-box}.shell{display:flex;min-height:100vh}.sidebar{width:220px;min-width:220px;background:var(--vs-panel);color:var(--vs-text-tertiary);padding:18px 0 28px;position:sticky;top:0;height:100vh;overflow:auto;border-right:1px solid var(--vs-border-subtle)}.logo{display:flex;align-items:center;gap:10px;padding:4px 20px 22px;color:var(--vs-text);font-size:18px;font-weight:600;letter-spacing:.5px}.logo-mark{width:26px;height:26px;flex-shrink:0;border-radius:7px;background:conic-gradient(from 40deg,var(--vs-accent),var(--vs-success),var(--vs-accent))}.nav a{display:flex;align-items:center;gap:12px;padding:9px 20px;color:var(--vs-text-tertiary);text-decoration:none;font-size:13.5px;font-weight:500;border-left:3px solid var(--vs-transparent);transition:background .12s ease,color .12s ease}.nav a:hover{background:var(--vs-wash-hover);color:var(--vs-text)}.nav a.active{background:var(--vs-accent-soft);color:var(--vs-text);border-left-color:var(--vs-accent);font-weight:600}.nav .icon{display:inline-flex;width:18px;justify-content:center;opacity:.9}.mobile-menu,.mobile-status{display:none!important}.mobile-drawer{width:min(320px,88vw);display:flex;flex-direction:column;overflow:hidden}.configuration-rail{margin-top:auto;flex-shrink:0}.mobile-drawer .configuration-rail{max-height:38vh;overflow-y:auto;border-top:1px solid var(--vs-border-subtle)}.main{flex:1;padding:20px 28px 48px;min-width:0;background:var(--vs-bg)}.topbar{display:flex;align-items:center;gap:16px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--vs-border-subtle);font-size:13px}.page-actions{position:sticky;top:0;z-index:10;display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;padding:10px 0;margin-bottom:16px;background:var(--vs-bg);border-bottom:1px solid var(--vs-border-subtle)}.breadcrumbs{color:var(--vs-text-tertiary);font-weight:500}.breadcrumbs b{color:var(--vs-text);font-weight:600}.topbar .search{margin-left:auto;width:320px}.page-title{margin:0 0 16px!important;font-weight:600;letter-spacing:-.01em;color:var(--vs-text)}.status-strip{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:12px;margin-bottom:20px}.status-pill{background:var(--vs-surface);border:1px solid var(--vs-border);border-radius:10px;padding:12px 16px;font-size:13px;display:flex;align-items:center;gap:12px}.status-pill b{color:var(--vs-text);font-weight:600}.sub{color:var(--vs-text-tertiary);font-size:12px;line-height:1.5}.grid-2,.dash-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}.card{background:var(--vs-surface);border:1px solid var(--vs-border);border-radius:12px;padding:18px;margin-bottom:18px;min-width:0}.card-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}.card-head h2,.card-head .MuiTypography-h2{font-size:15px;font-weight:600;color:var(--vs-text);margin:0}.card-head .MuiButton-root{margin-left:auto}.kv{display:grid;grid-template-columns:max-content 1fr;gap:8px 20px;font-size:13px;margin:0}.kv dt{color:var(--vs-text-tertiary)}.kv dd{margin:0;color:var(--vs-text-secondary);overflow-wrap:anywhere}.footer-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px}.footer-actions .spacer{flex:1}.apply-wrap{max-width:880px}.countdown{display:flex;gap:14px;align-items:center;margin:6px 0 18px;flex-wrap:wrap}.timer{font-size:32px;font-weight:600;color:var(--vs-warning);background:var(--vs-warning-soft);border:1px solid var(--vs-warning-border);padding:6px 18px;border-radius:10px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.onb{max-width:640px;margin:6vh auto;background:var(--vs-surface);border:1px solid var(--vs-border);border-radius:14px;padding:32px 36px;box-shadow:var(--vs-shadow)}.onb .logo{color:var(--vs-text);padding:0 0 8px}.onb h1{font-size:22px;font-weight:600;letter-spacing:-.01em}.steps{display:flex;gap:8px;margin:18px 0 24px}.steps span{height:5px;flex:1;border-radius:3px;background:var(--vs-track)}.steps .done{background:var(--vs-success)}.steps .now{background:var(--vs-accent)}.fields{display:grid;gap:16px;margin:20px 0}.fields>.MuiFormControl-root{width:100%}.safecard{background:var(--vs-warning-soft);border:1px solid var(--vs-warning-border);border-radius:10px;padding:16px 18px}.diff{overflow:auto;padding:14px 16px;background:var(--vs-wash);border:1px solid var(--vs-border);border-radius:8px;font-size:12.5px;font-family:var(--font-mono);color:var(--vs-text-secondary)}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--font-mono)}.stats{display:flex;gap:28px;margin-bottom:16px}.stats strong{font-size:22px;display:block;color:var(--vs-text);font-weight:600;letter-spacing:-.01em}.stats>div{color:var(--vs-text-tertiary);font-size:13px}.members-edit{display:flex;flex-direction:column;gap:4px}.members-row{display:flex;gap:4px;align-items:center}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px 20px;align-items:start}.form-grid>*{width:100%;min-width:0}.form-wide{grid-column:1 / -1}.form-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.rule-row{border-top:1px solid var(--vs-border-subtle);padding-top:16px}.toolbar-actions{display:flex;justify-content:flex-end;gap:8px;margin-bottom:12px}.card-head .toolbar-actions{margin-left:auto;margin-bottom:0}.card-head .toolbar-actions .MuiButton-root{margin-left:0}.table-wide table{min-width:1040px}.table-wide.tunnel-peers-table table{min-width:760px}.MuiTableCell-root .MuiFormControl-root{width:100%;min-width:100px}.MuiTableCell-root .MuiFormControl-root:has(input[type=number]){min-width:76px}.MuiFormHelperText-root{min-height:1.15em}.diag-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}.diag-controls>.MuiTextField-root,.diag-controls>.MuiFormControl-root{flex:0 1 auto}.diag-controls .grow{flex:1 1 240px;min-width:200px}@media(max-width:1320px){.dash-grid{grid-template-columns:1fr}}@media(max-width:1100px){.status-strip{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.topbar .search{width:220px}}@media(max-width:650px){.shell{display:block}.sidebar{display:none!important}.mobile-menu,.mobile-status{display:inline-flex!important}.main{padding:12px}.topbar{flex-wrap:wrap;gap:8px;margin-bottom:16px}.topbar .breadcrumbs{flex:1 1 100%;order:-1}.topbar .search,.topbar .user-name{display:none}.topbar .mobile-status{margin-right:auto}.topbar .MuiButton-root{max-width:100%}.status-strip{grid-template-columns:1fr}.onb{margin:16px;padding:22px}.kv{grid-template-columns:1fr}.card-head{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){.nav a,.MuiDrawer-paper,.MuiBackdrop-root{transition-duration:0ms!important;animation:none!important}}
