:root{--bg: #f6f7f9;--surface: #ffffff;--surface-2: #eef0f4;--border: #d8dce3;--text: #14181f;--muted: #616b7a;--accent: #1f6feb;--accent-soft: #e5efff;--free: #1a9e5c;--patched: #d9822b;--uplink: #2b6cb0;--unwired: #b6bcc7;--danger: #c33c3c;--radius: 10px;--shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 4px 12px rgba(15, 23, 42, .04);color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #14171c;--surface: #1b1f26;--surface-2: #232830;--border: #333a45;--text: #e8eaee;--muted: #98a1b0;--accent: #5b9bff;--accent-soft: #1d2a3f;--unwired: #4a515d;--shadow: none}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;background:var(--bg);color:var(--text);font-size:15px;line-height:1.5}h1{font-size:1.5rem;margin:0 0 .25rem}h2{font-size:1.1rem;margin:0 0 .75rem}h3{font-size:.95rem;margin:0 0 .5rem}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.shell{display:flex;min-height:100vh}.sidebar{width:220px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);padding:1rem .75rem;display:flex;flex-direction:column;gap:.25rem}.brand{font-weight:700;font-size:1.15rem;padding:.25rem .5rem 1rem}.brand small{display:block;font-weight:400;font-size:.7rem;color:var(--muted)}.navlink{display:block;padding:.5rem .65rem;border-radius:var(--radius);color:var(--text);font-size:.9rem}.navlink:hover{background:var(--surface-2);text-decoration:none}.navlink.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.main{flex:1;padding:1.5rem 2rem 4rem;max-width:1400px;min-width:0}.topbar{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem;flex-wrap:wrap}.topbar .spacer{flex:1}.subtitle{color:var(--muted);font-size:.85rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow)}.grid{display:grid;gap:.85rem}.grid.stats{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.grid.two{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.stat .label{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.03em}.stat .value{font-size:1.8rem;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.2}.stat .hint{color:var(--muted);font-size:.78rem}.bar{height:8px;border-radius:4px;background:var(--surface-2);overflow:hidden;display:flex}.bar span{display:block;height:100%}.bar .patched{background:var(--patched)}.bar .uplink{background:var(--uplink)}.bar .free{background:var(--free)}.bar .unwired{background:var(--unwired)}input,select,button,textarea{font:inherit;color:inherit;border-radius:8px;border:1px solid var(--border);background:var(--surface);padding:.4rem .6rem}input:focus,select:focus{outline:2px solid var(--accent);outline-offset:1px}button{cursor:pointer;background:var(--surface-2);border:1px solid var(--border)}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.danger{color:var(--danger);border-color:var(--danger);background:transparent}button.ghost{background:transparent;border-color:transparent}label.field{display:block;margin-bottom:.75rem}label.field span{display:block;font-size:.8rem;color:var(--muted);margin-bottom:.2rem}label.field input,label.field select{width:100%}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}table{border-collapse:collapse;width:100%;font-size:.85rem}th,td{text-align:left;padding:.45rem .7rem;border-bottom:1px solid var(--border);white-space:nowrap}th{position:sticky;top:0;background:var(--surface-2);font-weight:600;font-size:.78rem;z-index:1}tbody tr:hover{background:var(--surface-2)}tbody tr.clickable{cursor:pointer}td.num{text-align:right;font-variant-numeric:tabular-nums}.ports{display:flex;flex-wrap:wrap;gap:6px}.port{width:40px;height:36px;border-radius:7px;border:0;color:#fff;font-size:.78rem;font-weight:600;font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:center;cursor:pointer}.port.free{background:var(--free)}.port.patched{background:var(--patched)}.port.uplink{background:var(--uplink)}.port.unwired{background:var(--unwired);color:#33383f}.port.disabled{background:var(--muted);opacity:.6}.port.selected{outline:3px solid var(--text);outline-offset:1px}.legend{display:flex;gap:.9rem;flex-wrap:wrap;color:var(--muted);font-size:.78rem;align-items:center}.legend i{width:12px;height:12px;border-radius:3px;display:inline-block;margin-right:4px;vertical-align:-1px}.badge{display:inline-block;padding:.1rem .45rem;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:.75rem}.badge.accent{background:var(--accent-soft);color:var(--accent)}.notice{padding:.6rem .8rem;border-radius:var(--radius);font-size:.85rem}.notice.error{background:#fdecec;color:#8c2020;border:1px solid #f3c2c2}.notice.warn{background:#fff5e6;color:#8a5300;border:1px solid #f0d5a8}@media(prefers-color-scheme:dark){.notice.error{background:#3a1f1f;color:#ffb4b4;border-color:#5c2c2c}.notice.warn{background:#3a2f1c;color:#f0c98a;border-color:#5c4a2c}}.muted{color:var(--muted)}.row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}.stack{display:flex;flex-direction:column;gap:.85rem}.spinner{color:var(--muted);font-size:.85rem}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0d1273;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:50}.dialog{background:var(--surface);border-radius:14px;border:1px solid var(--border);width:min(560px,100%);max-height:85vh;overflow:auto;padding:1.25rem}.dialog header{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.75rem}.dialog header h2{margin:0;flex:1}.login{min-height:100vh;display:grid;place-items:center;padding:1rem}.login .card{width:min(380px,100%)}@media print{.sidebar,.topbar button,.no-print{display:none!important}.main{padding:0;max-width:none}.table-wrap{border:0;overflow:visible}th{position:static}table{font-size:10pt}th,td{white-space:normal;border-bottom:1px solid #ccc}body{background:#fff;color:#000}.card{border:0;box-shadow:none;padding:0}@page{size:A4 landscape;margin:12mm}}