:root{--tg-brand: #185FA5;--tg-brandHover: #134B85;--tg-bg: #F5F7FA;--tg-surface: #FFFFFF;--tg-border: rgba(0,0,0,.08);--tg-textPrimary: #1B2733;--tg-textSecondary: #5A6B7C;--tg-status-direct: #0F6E56;--tg-status-relay: #BA7517;--tg-status-offline: #888780;--tg-status-denied: #A32D2D;--tg-space-1: 8px;--tg-space-2: 16px;--tg-space-3: 24px;--tg-space-4: 32px;--tg-space-5: 48px;--tg-radius-card: 12px;--tg-radius-control: 8px;--tg-fs-pageTitle: 20px;--tg-fs-sectionTitle: 15px;--tg-fs-body: 14px;--tg-fs-table: 13px;--tg-fs-metric: 28px;--tg-fw-regular: 400;--tg-fw-medium: 500}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,PingFang SC,Microsoft YaHei,sans-serif;font-size:var(--tg-fs-body);color:var(--tg-textPrimary);background:var(--tg-bg)}a{color:var(--tg-brand);text-decoration:none}a:hover{color:var(--tg-brandHover)}.mono{font-family:ui-monospace,Menlo,Consolas,monospace}.layout{display:grid;grid-template-columns:220px 1fr;min-height:100vh}.desktop-hint{display:none}@media (max-width: 1023px){.layout{display:none}.desktop-hint{display:flex;align-items:center;justify-content:center;min-height:100vh;color:var(--tg-textSecondary);padding:24px;text-align:center}}.sidebar{background:var(--tg-surface);border-right:1px solid var(--tg-border);display:flex;flex-direction:column;padding:var(--tg-space-2)}.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:var(--tg-fw-medium);padding:var(--tg-space-2)}.brand img{display:block}.login-logo{display:block;margin:0 auto 12px}.nav{display:flex;flex-direction:column;gap:4px;flex:1}.nav a{padding:10px 12px;border-radius:var(--tg-radius-control);color:var(--tg-textPrimary)}.nav a:hover{background:var(--tg-bg)}.nav a.active{background:color-mix(in srgb,var(--tg-brand) 10%,white);color:var(--tg-brand);font-weight:var(--tg-fw-medium)}.status-card{border:1px solid var(--tg-border);border-radius:var(--tg-radius-card);padding:12px;font-size:var(--tg-fs-table);color:var(--tg-textSecondary)}.status-card .row{display:flex;justify-content:space-between;padding:2px 0}.main{padding:var(--tg-space-4) var(--tg-space-5);max-width:1280px;width:100%;margin:0 auto}.topbar{display:flex;align-items:center;gap:var(--tg-space-2);margin-bottom:var(--tg-space-3)}.topbar h1{font-size:var(--tg-fs-pageTitle);font-weight:var(--tg-fw-medium);margin:0;flex:1}.card{background:var(--tg-surface);border:1px solid var(--tg-border);border-radius:var(--tg-radius-card);padding:20px;margin-bottom:var(--tg-space-2)}.card h2{font-size:var(--tg-fs-sectionTitle);font-weight:var(--tg-fw-medium);margin:0 0 var(--tg-space-2)}.grid{display:grid;gap:var(--tg-space-2)}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}@media (max-width: 1024px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}.metric-label{color:var(--tg-textSecondary);font-size:var(--tg-fs-table)}.metric-value{font-size:var(--tg-fs-metric);font-weight:var(--tg-fw-medium)}.metric-delta{font-size:var(--tg-fs-table);color:var(--tg-textSecondary)}.metric-unavailable{color:var(--tg-status-relay);font-size:var(--tg-fs-table)}.status-dot{display:inline-flex;align-items:center;gap:6px;font-size:var(--tg-fs-table)}.status-dot .dot{width:8px;height:8px;border-radius:50%;display:inline-block}.status-dot--ok .dot{background:var(--tg-status-direct)}.status-dot--relay .dot{background:var(--tg-status-relay)}.status-dot--offline .dot{background:var(--tg-status-offline)}.status-dot--denied .dot{background:var(--tg-status-denied)}.status-dot--warning .dot{background:var(--tg-status-relay)}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--tg-border);font-size:var(--tg-fs-table)}th{color:var(--tg-textSecondary);font-weight:var(--tg-fw-medium)}tbody tr{height:44px}tr.clickable{cursor:pointer}tr.clickable:hover{background:var(--tg-bg)}.matrix-wrap{overflow:auto}.matrix th,.matrix td{text-align:center;min-width:110px}.matrix th:first-child,.matrix td:first-child{text-align:left;position:sticky;left:0;background:var(--tg-surface)}.matrix td.cell-granted{background:color-mix(in srgb,var(--tg-status-direct) 10%,white);color:var(--tg-status-direct);cursor:pointer}.matrix td.cell-denied{background:#fafafa;color:var(--tg-status-offline);cursor:pointer}.matrix td.cell-warning{outline:2px solid var(--tg-status-relay);outline-offset:-2px}.matrix td:focus-visible{outline:2px solid var(--tg-brand);outline-offset:-2px}.legend{display:flex;gap:var(--tg-space-2);color:var(--tg-textSecondary);font-size:var(--tg-fs-table);margin-top:var(--tg-space-1)}button,.btn{font:inherit;padding:8px 14px;border-radius:var(--tg-radius-control);border:1px solid var(--tg-border);background:var(--tg-surface);color:var(--tg-textPrimary);cursor:pointer}button.primary{background:var(--tg-brand);border-color:var(--tg-brand);color:#fff}button.primary:hover{background:var(--tg-brandHover)}button.danger{background:var(--tg-status-denied);border-color:var(--tg-status-denied);color:#fff}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--tg-brand);outline-offset:1px}input,select,textarea{font:inherit;padding:8px 10px;border:1px solid var(--tg-border);border-radius:var(--tg-radius-control);background:#fff;color:var(--tg-textPrimary)}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:var(--tg-space-1)}.field label{color:var(--tg-textSecondary);font-size:var(--tg-fs-table)}.row{display:flex;gap:var(--tg-space-1);align-items:center;flex-wrap:wrap}.spacer{flex:1}.alert{border-radius:var(--tg-radius-control);padding:10px 12px;margin-bottom:var(--tg-space-1);font-size:var(--tg-fs-table)}.alert-info{background:#eaf2fa;color:#185fa5}.alert-warn{background:#fbf3e5;color:#8a5a10}.alert-error{background:#f9e9e9;color:#8c2626}.alert-ok{background:#e8f4ef;color:#0f6e56}.tag{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--tg-bg);color:var(--tg-textSecondary);font-size:12px}.tag-readonly{background:#efefef;color:#666}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:center;justify-content:center;z-index:50}.modal{background:#fff;border-radius:var(--tg-radius-card);padding:20px;width:min(640px,92vw);max-height:86vh;overflow:auto}.drawer-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000040;z-index:40}.drawer{position:fixed;top:0;right:0;height:100%;width:min(520px,92vw);background:#fff;z-index:41;padding:20px;overflow:auto;box-shadow:-8px 0 24px #00000014}.timeline{border-left:2px solid var(--tg-border);margin-left:8px;padding-left:var(--tg-space-2)}.timeline-item{padding:8px 0;display:flex;gap:12px;align-items:baseline}.timeline-time{color:var(--tg-textSecondary);font-size:var(--tg-fs-table);min-width:48px}.timeline-deny{color:var(--tg-status-denied)}.timeline-day{font-weight:var(--tg-fw-medium);margin:var(--tg-space-1) 0}.empty{color:var(--tg-textSecondary);padding:var(--tg-space-3);text-align:center}.muted{color:var(--tg-textSecondary)}.critical{color:var(--tg-status-denied)}.warn-text{color:var(--tg-status-relay)}.ok-text{color:var(--tg-status-direct)}.bar{height:8px;background:var(--tg-bg);border-radius:4px;overflow:hidden}.bar>span{display:block;height:100%;background:var(--tg-brand)}.toast-stack{position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;gap:8px;z-index:1000;max-width:360px}.toast{padding:10px 14px;border-radius:6px;font-size:13px;box-shadow:0 6px 18px #0000002e;background:var(--tg-surface, #fff);border-left:3px solid var(--tg-brand, #185fa5);color:var(--tg-text, #1f2329)}.toast-ok{border-left-color:var(--tg-status-direct, #2ea44f)}.toast-error{border-left-color:var(--tg-status-offline, #d1242f)}[data-theme=dark]{--tg-brand: #4C9AEA;--tg-brandHover: #7CB6F2;--tg-bg: #10151B;--tg-surface: #171E26;--tg-border: rgba(255, 255, 255, .1);--tg-textPrimary: #E6EDF3;--tg-textSecondary: #9FB0C0;--tg-status-direct: #3FB950;--tg-status-relay: #D29922;--tg-status-offline: #8B949E;--tg-status-denied: #F85149}[data-theme=dark] body{background:var(--tg-bg);color:var(--tg-textPrimary)}[data-theme=dark] .nav a.active{background:color-mix(in srgb,var(--tg-brand) 22%,transparent)}[data-theme=dark] input,[data-theme=dark] select,[data-theme=dark] textarea,[data-theme=dark] .btn{background:#1f2937;color:var(--tg-textPrimary);border-color:var(--tg-border)}.bar-row{display:grid;grid-template-columns:140px 1fr 64px;align-items:center;gap:8px}.bar-track{background:var(--tg-border);height:10px;border-radius:5px;overflow:hidden}.bar-fill{background:var(--tg-brand);height:100%}.skip-link{position:absolute;left:-9999px;top:0;z-index:1000;padding:8px 12px;background:var(--tg-brand);color:#fff;border-radius:0 0 var(--tg-radius-control) 0}.skip-link:focus{left:0}