:root {
  --bg:      #f0f4f8;
  --bg2:     #ffffff;
  --card:    #ffffff;
  --card2:   #e8eef4;
  --border:  rgba(0,40,85,.14);
  --border2: rgba(0,40,85,.07);
  --accent:  #004c97;
  --accent2: #003875;
  --green:   #1a8a3e;
  --red:     #d32f2f;
  --amber:   #d97706;
  --blue:    #004c97;
  --purple:  #004c97;
  --teal:    #0891b2;
  --pink:    #0891b2;
  --text:    #1a2b3c;
  --text2:   #4a6478;
  --text3:   #8aa0b8;
  --r:       4px;
  --shadow:  0 4px 24px rgba(0,0,0,.08);
  --font:    'DM Sans', sans-serif;
  --mono:    'JetBrains Mono', 'Courier New', monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);background-image:radial-gradient(ellipse 60% 40% at 20% 0%,rgba(0,76,151,.06) 0%,transparent 60%),radial-gradient(ellipse 40% 30% at 80% 100%,rgba(0,76,151,.03) 0%,transparent 50%);color:var(--text);font-family:var(--font);font-size:14px;min-height:100vh;}

/* ── LOGIN ─────────────────────────────────────────── */
#login-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px;}
.login-card{background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);padding:48px 40px;width:100%;max-width:420px;animation:fadeUp .4s ease;}
.login-logo{text-align:center;margin-bottom:32px;}
.login-logo .logo-icon{width:56px;height:56px;border-radius:var(--r);background:linear-gradient(180deg,#002855,#001f40);display:inline-flex;align-items:center;justify-content:center;font-size:24px;color:#fff;margin-bottom:16px;box-shadow:0 0 16px rgba(0,76,151,.2);}
.login-logo h1{font-size:20px;font-weight:700;font-family:var(--font);letter-spacing:.5px;text-transform:uppercase;}
.login-logo p{font-size:12px;color:var(--text2);margin-top:4px;font-family:var(--font);letter-spacing:.3px;}
.form-group{margin-bottom:20px;}
.form-group label{display:block;font-size:10px;font-weight:700;color:var(--text3);margin-bottom:8px;letter-spacing:.8px;text-transform:uppercase;font-family:var(--font);}
.form-group input{width:100%;padding:10px 14px;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);color:var(--text);font-size:13px;outline:none;transition:border-color .15s,box-shadow .15s;font-family:var(--mono);}
.form-group input:focus{border-color:rgba(0,76,151,.45);box-shadow:0 0 0 3px rgba(0,76,151,.08);}
.form-group input::placeholder{color:var(--text3);}
.save-token-row{display:flex;align-items:center;gap:10px;margin-bottom:20px;}
.toggle-switch{position:relative;width:36px;height:20px;flex-shrink:0;}
.toggle-switch input{opacity:0;width:0;height:0;position:absolute;}
.toggle-slider{position:absolute;inset:0;cursor:pointer;background:var(--card2);border:1px solid var(--border);border-radius:20px;transition:background .2s,border-color .2s;}
.toggle-slider:before{content:'';position:absolute;width:14px;height:14px;left:2px;top:2px;background:var(--text3);border-radius:50%;transition:transform .2s,background .2s;}
.toggle-switch input:checked+.toggle-slider{background:var(--accent);border-color:var(--accent);}
.toggle-switch input:checked+.toggle-slider:before{transform:translateX(16px);background:#fff;}
.save-token-label{font-size:12px;color:var(--text2);cursor:pointer;user-select:none;}
.btn-primary{width:100%;padding:12px;background:var(--accent);border:none;border-radius:var(--r);color:#fff;font-family:var(--font);font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;box-shadow:0 0 16px rgba(0,76,151,.2);letter-spacing:.4px;text-transform:uppercase;}
.btn-primary:hover{background:#1a6bc4;box-shadow:0 0 24px rgba(0,76,151,.35);transform:translateY(-1px);}
.btn-primary:active{transform:scale(.98);}
.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none;}
.login-error{background:rgba(240,85,104,.1);border:1px solid rgba(240,85,104,.25);border-radius:var(--r);padding:12px 14px;color:var(--red);font-size:13px;margin-bottom:20px;display:none;}

/* ── ACCOUNT PICKER ─────────────────────────────── */
#account-picker{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,20,50,.35);backdrop-filter:blur(3px);align-items:center;justify-content:center;}
.picker-card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:32px;width:420px;max-height:85vh;box-shadow:0 20px 60px rgba(0,20,60,.25);animation:fadeUp .18s ease;display:flex;flex-direction:column;}
.picker-card h2{font-size:18px;font-weight:700;margin-bottom:6px;flex-shrink:0;}
.picker-card p{color:var(--text2);font-size:13px;margin-bottom:24px;flex-shrink:0;}
.account-list{display:flex;flex-direction:column;gap:10px;overflow-y:auto;flex:1;min-height:0;padding-right:4px;}
.account-list::-webkit-scrollbar{width:5px;}
.account-list::-webkit-scrollbar-track{background:transparent;}
.account-list::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px;}
.account-item{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);cursor:pointer;transition:all .2s;}
.account-item:hover{border-color:var(--accent);background:rgba(0,76,151,.08);}
.account-item .acc-icon{width:36px;height:36px;border-radius:8px;background:rgba(0,76,151,.15);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:14px;}
.account-item .acc-name{font-size:14px;font-weight:600;}
.account-item .acc-id{font-size:11px;color:var(--text2);font-family:monospace;margin-top:2px;}

/* ── LOADING ─────────────────────────────────────── */
#loading-overlay{position:fixed;inset:0;z-index:999;background:rgba(240,244,248,.88);backdrop-filter:blur(3px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;}
.spinner{width:40px;height:40px;border-radius:50%;border:2px solid var(--border);border-top-color:var(--accent);animation:spin .7s linear infinite;}
.loading-text{color:var(--text2);font-size:13px;font-family:var(--font);letter-spacing:.3px;}

/* ── APP SHELL ───────────────────────────────────── */
#app{display:none;height:100vh;flex-direction:column;overflow:hidden;}

/* ── HEADER ─────────────────────────────────────── */
.header{position:sticky;top:0;z-index:100;background:linear-gradient(180deg,#002855 0%,#001f40 100%);border-bottom:1px solid rgba(0,96,192,.5);padding:0 24px;height:56px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 16px rgba(0,0,0,.12);position:relative;}
.header::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(0,96,192,.5) 30%,rgba(0,96,192,.5) 70%,transparent 100%);opacity:.5;}
.header-logo{display:flex;align-items:center;gap:10px;flex-shrink:0;margin-right:4px;}
.header-logo .logo-badge{width:34px;height:34px;border-radius:var(--r);background:linear-gradient(180deg,#002855,#001f40);display:flex;align-items:center;justify-content:center;font-size:15px;color:#fff;}
.header-logo .logo-text{font-family:var(--font);font-weight:700;font-size:14px;line-height:1.2;letter-spacing:.5px;text-transform:uppercase;color:#fff;}
.header-logo .logo-text span{display:block;font-size:11px;color:rgba(255,255,255,.5);font-weight:400;letter-spacing:2px;}
.header-account{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:var(--r);padding:4px 12px;}
.header-account .dot{width:7px;height:7px;border-radius:50%;background:var(--green);animation:pulse 2s infinite;}
.header-account .name{font-size:12px;font-weight:600;font-family:var(--mono);letter-spacing:.3px;color:#fff;}
.header-spacer{flex:1;}
.sync-info{font-size:11px;color:rgba(255,255,255,.45);white-space:nowrap;font-family:var(--mono);letter-spacing:.2px;}
#countdown{color:var(--accent);font-weight:600;}
#refresh-select{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:var(--r);color:#fff;font-size:12px;font-family:var(--font);padding:4px 8px;cursor:pointer;outline:none;height:30px;transition:background .15s;}
#refresh-select:hover{background:rgba(255,255,255,.14);}
#refresh-select option{background:var(--bg2);}
.icon-btn{width:34px;height:28px;border-radius:var(--r);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.icon-btn:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.38);}

/* ── TRAFFIC MONITOR ────────────────────────────── */
.traffic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px;padding:0 24px 24px;overflow-y:auto;}
.tc{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;transition:border-color .15s;}
.tc:hover{border-color:var(--border2);}
.tc-dev{font-size:12px;font-weight:700;font-family:var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tc-if{font-size:11px;color:var(--text2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tc-rates{display:flex;gap:18px;margin:10px 0 8px;}
.tc-rate{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.2;font-family:var(--mono);}
.tc-rate-lbl{font-size:10px;font-weight:400;color:var(--text3);letter-spacing:.04em;font-family:var(--font);text-transform:uppercase;}
.tc-spark{width:100%;height:54px;display:block;overflow:visible;}
.tc-scale{display:flex;justify-content:space-between;font-size:9px;color:var(--text3);margin-top:2px;opacity:.7;font-family:var(--mono);}
.tc-offline{opacity:.45;}

/* ── SETTINGS ───────────────────────────────────── */
.settings-wrap{padding:20px 24px;max-width:600px;}
.settings-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px;margin-bottom:16px;}
.settings-card-title{font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text2);margin-bottom:16px;display:flex;align-items:center;gap:8px;}
.settings-card-title i{color:var(--accent);}
.settings-row{display:grid;grid-template-columns:160px 1fr;align-items:start;gap:12px;margin-bottom:16px;}
.settings-row:last-child{margin-bottom:0;}
.settings-label{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.6px;padding-top:9px;font-family:var(--font);}
.settings-input{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);color:var(--text);font-size:12px;font-family:var(--mono);padding:7px 12px;outline:none;transition:border-color .15s;}
.settings-input:focus{border-color:rgba(0,76,151,.45);box-shadow:0 0 0 3px rgba(0,76,151,.08);}
.settings-hint{font-size:11px;color:var(--text3);margin-top:4px;line-height:1.4;font-family:var(--mono);}
.settings-save-btn{background:var(--accent);border:none;border-radius:var(--r);color:#fff;font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:7px 16px;cursor:pointer;transition:all .15s;box-shadow:0 0 16px rgba(0,76,151,.2);}
.settings-save-btn:hover{background:#1a6bc4;box-shadow:0 0 24px rgba(0,76,151,.45);transform:translateY(-1px);}

/* ── SIDEBAR LAYOUT ──────────────────────────────── */
.app-body{display:flex;flex:1;overflow:hidden;}
.sidebar{width:240px;flex-shrink:0;background:rgba(15,31,56,.98);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;transition:width .22s ease;}
.sidebar.collapsed{width:54px;}
.sidebar-header{display:flex;align-items:center;justify-content:flex-end;padding:10px 10px 6px;flex-shrink:0;}
.sidebar.collapsed .sidebar-header{justify-content:center;}
.sidebar-toggle-btn{width:28px;height:28px;border-radius:var(--r);border:1px solid var(--border);background:var(--card);color:var(--text3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;transition:all .15s;flex-shrink:0;}
.sidebar-toggle-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.08);}
.sidebar-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 8px 8px;}
.sidebar-nav::-webkit-scrollbar{width:0;}
.sidebar-group{margin-bottom:2px;}
.sidebar-group>summary{font-family:var(--mono);font-size:10.5px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.1em;padding:14px 10px 5px;white-space:nowrap;overflow:hidden;cursor:pointer;user-select:none;list-style:none;display:flex;align-items:center;gap:5px;opacity:.7;transition:opacity .15s;}
.sidebar-group>summary:hover{opacity:.85;}
.sidebar-group>summary::-webkit-details-marker{display:none;}
.sidebar-group>summary::before{content:'\f054';font-family:'Font Awesome 6 Free';font-weight:900;font-size:7px;transition:transform .2s;flex-shrink:0;}
.sidebar-group[open]>summary::before{transform:rotate(90deg);}
.sidebar.collapsed .sidebar-group>summary{opacity:0;padding:12px 0 4px;}
.tab-btn{display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:0 var(--r) var(--r) 0;border:none;border-left:3px solid transparent;background:none;color:var(--text3);font-family:var(--font);font-size:11.5px;font-weight:600;letter-spacing:.2px;text-transform:uppercase;cursor:pointer;width:100%;white-space:nowrap;overflow:visible;transition:color .2s,background .2s,border-color .2s;position:relative;margin-bottom:0;}
.tab-btn:hover{color:var(--text2);background:var(--card2);}
.tab-btn.active{color:var(--accent);border-left-color:var(--accent);background:rgba(0,76,151,.1);}
.tb-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.tab-btn .tb-label{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;transition:opacity .15s,width .15s;}
.sidebar.collapsed .tb-label{opacity:0;width:0;font-size:0;}
.tab-badge{background:rgba(0,76,151,.12);color:var(--accent);font-size:10px;font-family:var(--mono);font-weight:500;padding:1px 5px;border-radius:2px;border:1px solid rgba(0,76,151,.3);min-width:18px;text-align:center;flex-shrink:0;transition:opacity .15s;}
.sidebar.collapsed .tab-badge{opacity:0;width:0;padding:0;}
.tab-btn.active .tab-badge{background:rgba(0,76,151,.18);border-color:rgba(0,76,151,.4);}
.sidebar-sep{height:1px;background:var(--border);margin:6px 4px;}
.sidebar-bottom{padding:8px;flex-shrink:0;border-top:1px solid var(--border);}
/* Tooltip in collapsed mode */
.sidebar.collapsed .tab-btn{justify-content:center;}
.sidebar.collapsed .tab-btn::after{content:attr(data-tooltip);position:fixed;left:62px;background:var(--card2);border:1px solid var(--border);border-radius:var(--r);padding:5px 11px;font-size:12px;font-weight:500;color:var(--text);white-space:nowrap;opacity:0;pointer-events:none;z-index:2000;transform:translateY(-50%);box-shadow:0 4px 20px rgba(0,0,0,.3);}
.sidebar.collapsed .tab-btn:hover::after{opacity:1;}
.content-area{flex:1;overflow:hidden;display:flex;flex-direction:column;}
.tab-section{display:none;flex:1;overflow:auto;}
.tab-section.active{display:flex;flex-direction:column;}

/* ── STATS BAR ───────────────────────────────────── */
.stats-bar{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;padding:16px 24px 10px;}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;display:flex;align-items:center;gap:12px;transition:border-color .15s;position:relative;overflow:hidden;}
.stat-card::before{content:'';position:absolute;top:0;left:0;width:2px;height:100%;background:var(--accent);opacity:.3;}
.stat-card:hover{border-color:var(--border2);}
.stat-icon{width:36px;height:36px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.stat-val{font-size:22px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;font-family:var(--font);}
.stat-lbl{font-size:10px;color:var(--text3);margin-top:2px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;font-family:var(--font);}
.si-total  {background:rgba(0,76,151,.12);color:var(--accent);}
.si-online {background:rgba(52,217,123,.1); color:var(--green);}
.si-offline{background:rgba(240,85,104,.1); color:var(--red);}
.si-alert  {background:rgba(251,191,36,.1);color:var(--amber);}
.si-fw     {background:rgba(0,76,151,.1);color:var(--blue);}
.si-cfg    {background:rgba(0,76,151,.1);color:var(--accent);}
.si-wlan   {background:rgba(52,217,196,.1);color:var(--teal);}
.sv-total  {color:var(--text);}
.sv-online {color:var(--green);}
.sv-offline{color:var(--red);}
.sv-alert  {color:var(--amber);}
.sv-fw     {color:var(--blue);}
.sv-cfg    {color:var(--accent);}
.sv-wlan   {color:var(--teal);}

/* ── TOOLBAR ─────────────────────────────────────── */
.toolbar{display:flex;align-items:center;gap:8px;padding:6px 24px 14px;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.055);}
.toolbar-title{font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text2);}
.toolbar-count{background:rgba(0,76,151,.08);border:1px solid rgba(0,76,151,.2);border-radius:2px;padding:1px 7px;font-size:11px;font-family:var(--mono);font-weight:400;color:var(--accent);}
.toolbar-spacer{flex:1;}
.filter-group{display:flex;gap:4px;}
.filter-btn{padding:4px 12px;border-radius:2px;font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;border:1px solid rgba(255,255,255,.055);background:transparent;color:var(--text3);cursor:pointer;transition:all .15s;}
.filter-btn:hover{border-color:var(--text3);color:var(--text2);}
.filter-btn.active{border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.08);}
.search-box{display:flex;align-items:center;gap:7px;background:var(--card2);border:1px solid rgba(255,255,255,.055);border-radius:var(--r);padding:6px 12px;}
.search-box i{color:var(--text3);font-size:12px;}
.search-box input{background:none;border:none;outline:none;color:var(--text);font-family:var(--mono);font-size:12px;width:160px;transition:border-color .15s;}
.search-box input::placeholder{color:var(--text3);}

/* ── DEVICE GRID ─────────────────────────────────── */
.device-grid{display:grid;padding:0 24px 24px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:10px;}
.device-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:border-color .15s;animation:fadeUp .3s ease;}
.device-card:hover{border-color:var(--border2);}
.device-card.offline{border-color:rgba(240,85,104,.2);}
.device-card.alert{border-color:rgba(251,191,36,.25);}
.card-header{padding:12px 16px 10px;border-bottom:1px solid rgba(255,255,255,.055);display:flex;align-items:flex-start;gap:10px;}
.device-icon{width:36px;height:36px;border-radius:var(--r);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;}
.device-icon.online {background:rgba(52,217,123,.1);color:var(--green);}
.device-icon.offline{background:rgba(240,85,104,.1);color:var(--red);}
.card-header-info{flex:1;min-width:0;}
.device-name{font-family:var(--font);font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.device-site{font-size:11px;color:var(--text2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.card-badges{display:flex;gap:4px;align-items:flex-start;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end;}
.badge{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:2px;font-size:10px;font-family:var(--mono);font-weight:500;letter-spacing:.3px;white-space:nowrap;}
.badge-online {background:rgba(52,217,123,.1); color:var(--green); border:1px solid rgba(52,217,123,.25);}
.badge-offline{background:rgba(240,85,104,.1); color:var(--red);   border:1px solid rgba(240,85,104,.25);}
.badge-alert  {background:rgba(251,191,36,.1);color:var(--amber); border:1px solid rgba(251,191,36,.25);}
.badge-fw-old {background:rgba(0,76,151,.1);color:var(--blue);  border:1px solid rgba(0,76,151,.25);}
.badge-fw-ok  {background:rgba(52,217,123,.1); color:var(--green);      border:1px solid rgba(52,217,123,.2);}
.badge-cfg-old{background:rgba(0,76,151,.1);color:var(--accent);      border:1px solid rgba(0,76,151,.2);}
.badge-cfg-ok {background:rgba(52,217,123,.1); color:var(--green);      border:1px solid rgba(52,217,123,.2);}
.card-body{padding:12px 16px;}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;}
.info-row{display:flex;flex-direction:column;gap:1px;min-width:0;}
.info-row.full{grid-column:1/-1;}
.info-lbl{font-family:var(--font);font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;}
.info-val{font-size:12px;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.info-val.mono{font-family:var(--mono);font-size:11px;color:var(--accent);}
.card-footer{padding:10px 16px;border-top:1px solid rgba(255,255,255,.055);display:flex;flex-direction:column;gap:5px;}
.card-footer-primary{display:flex;gap:5px;}
.card-footer-secondary{display:flex;gap:5px;}
.action-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:var(--r);font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;border:1px solid;cursor:pointer;transition:all .15s;flex:1;min-width:0;justify-content:center;}
.action-btn.icon-only{flex:0 0 auto;padding:5px 11px;}
.action-btn:disabled{opacity:.35;cursor:not-allowed;}
.action-btn.btn-sm{padding:3px 7px;font-size:10px;flex:0 0 auto;min-width:0;}
.btn-reboot{background:transparent;border-color:rgba(240,85,104,.2);color:var(--text3);}
.btn-reboot:hover:not(:disabled){border-color:var(--red);color:var(--red);background:rgba(240,85,104,.07);}
.btn-fw{background:transparent;border-color:rgba(0,76,151,.2);color:var(--text3);}
.btn-fw:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.07);}
.btn-cfg{background:transparent;border-color:rgba(0,76,151,.2);color:var(--text3);}
.btn-cfg:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.07);}
.btn-snmp{background:transparent;border-color:rgba(52,217,196,.2);color:var(--text3);}
.btn-snmp:hover:not(:disabled){border-color:var(--teal);color:var(--teal);background:rgba(52,217,196,.07);}
.snmp-card-debug{padding:8px 14px 10px;border-top:1px solid rgba(255,255,255,.055);font-size:11px;line-height:1.6;word-break:break-word;color:var(--text2);display:none;}

/* ── DATA TABLES ─────────────────────────────────── */
.table-wrap{padding:0 24px 24px;overflow:auto;}
.data-table{width:100%;border-collapse:collapse;font-size:13px;}
.data-table th{padding:7px 14px;text-align:left;font-family:var(--font);font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;background:var(--card2);border-bottom:1px solid rgba(255,255,255,.055);white-space:nowrap;position:sticky;top:0;}
.data-table th:first-child{border-radius:var(--r) 0 0 0;}
.data-table th:last-child{border-radius:0 var(--r) 0 0;}
.data-table td{padding:7px 14px;border-bottom:1px solid rgba(255,255,255,.055);font-size:13px;vertical-align:middle;color:var(--text);}
.data-table tr:hover td{background:rgba(0,76,151,.04);}
.data-table tr:last-child td{border-bottom:none;}
.data-table .mono{font-family:var(--mono);font-size:11.5px;color:var(--text2);}
.data-table .muted{color:var(--text2);}
.data-table .device-ref{font-weight:600;font-size:12px;}
.table-section{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.table-header{padding:10px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.055);background:var(--card2);}
.table-header h3{font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text2);}
.table-header .count{font-size:11px;color:var(--accent);font-family:var(--mono);font-weight:400;}
.table-header-spacer{flex:1;}
.table-search{display:flex;align-items:center;gap:6px;background:var(--card2);border:1px solid rgba(255,255,255,.055);border-radius:var(--r);padding:6px 12px;}
.table-search i{color:var(--text3);font-size:11px;}
.table-search input{background:none;border:none;outline:none;color:var(--text);font-family:var(--mono);font-size:12px;width:140px;}
.table-search input::placeholder{color:var(--text3);}

/* ── MINI STAT CARDS (per tab) ───────────────────── */
.mini-stats{display:flex;gap:10px;padding:12px 24px 0;flex-wrap:wrap;}
.mini-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 16px;display:flex;align-items:center;gap:10px;position:relative;overflow:hidden;}
.mini-stat::before{content:'';position:absolute;top:0;left:0;width:2px;height:100%;background:var(--accent);opacity:.3;}
.mini-stat .ms-icon{width:28px;height:28px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:12px;}
.mini-stat .ms-val{font-size:18px;font-weight:700;line-height:1;font-family:var(--font);}
.mini-stat .ms-lbl{font-size:10px;color:var(--text3);font-weight:700;text-transform:uppercase;letter-spacing:.8px;font-family:var(--font);}

/* ── BAND BADGES ─────────────────────────────────── */
.band-24{background:rgba(0,76,151,.1);color:var(--blue);border:1px solid rgba(0,76,151,.25);padding:2px 7px;border-radius:2px;font-size:10px;font-family:var(--mono);font-weight:500;}
.band-5 {background:rgba(0,76,151,.1);color:var(--accent);border:1px solid rgba(0,76,151,.25);padding:2px 7px;border-radius:2px;font-size:10px;font-family:var(--mono);font-weight:500;}
.band-6 {background:rgba(52,217,196,.1);color:var(--teal);border:1px solid rgba(52,217,196,.25);padding:2px 7px;border-radius:2px;font-size:10px;font-family:var(--mono);font-weight:500;}

/* ── STATUS DOTS ─────────────────────────────────── */
.sdot{display:inline-flex;align-items:center;gap:5px;font-size:12px;}
.sdot:before{content:'';width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.sdot-green:before{background:var(--green);box-shadow:0 0 6px var(--green);animation:pulse-green 2s ease-in-out infinite;}
.sdot-red:before{background:var(--red);box-shadow:0 0 4px rgba(240,85,104,.5);}
.sdot-amber:before{background:var(--amber);}
.sdot-blue:before{background:var(--blue);}
@keyframes pulse-green{0%,100%{box-shadow:0 0 4px var(--green);opacity:1;}50%{box-shadow:0 0 10px var(--green),0 0 20px var(--green);opacity:.85;}}

/* ── SIGNAL BAR ─────────────────────────────────── */
.signal-bar{display:flex;align-items:flex-end;gap:2px;height:16px;}
.signal-bar span{display:block;width:4px;border-radius:1px;background:var(--border2);}
.signal-bar.s1 span:nth-child(1),.signal-bar.s2 span:nth-child(-n+2),.signal-bar.s3 span:nth-child(-n+3),.signal-bar.s4 span{background:var(--green);}
.signal-bar.s1 span:nth-child(1){background:var(--red);}
.signal-bar.s2 span:nth-child(-n+2){background:var(--amber);}
.signal-bar span:nth-child(1){height:4px;}
.signal-bar span:nth-child(2){height:7px;}
.signal-bar span:nth-child(3){height:11px;}
.signal-bar span:nth-child(4){height:16px;}

/* ── EMPTY STATE ─────────────────────────────────── */
.empty-state{text-align:center;padding:60px 40px;color:var(--text2);}
.empty-state i{font-size:40px;color:var(--text3);margin-bottom:12px;display:block;}
.empty-state h3{font-size:16px;font-weight:700;color:var(--text);margin-bottom:6px;}
.empty-state p{font-size:13px;}

/* ── TOAST ───────────────────────────────────────── */
#toast-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.toast{display:flex;align-items:center;gap:10px;background:var(--card2);border:1px solid var(--border2);border-radius:var(--r);padding:12px 16px;min-width:260px;max-width:360px;box-shadow:var(--shadow);pointer-events:all;animation:slideIn .3s ease;}
.toast.success{border-color:rgba(52,217,123,.4);}
.toast.error{border-color:rgba(240,85,104,.4);}
.toast.info{border-color:rgba(0,76,151,.4);}
.toast-icon{font-size:16px;}
.toast.success .toast-icon{color:var(--green);}
.toast.error .toast-icon{color:var(--red);}
.toast.info .toast-icon{color:var(--accent);}
.toast-msg{font-size:12px;flex:1;line-height:1.4;}
.toast-msg strong{display:block;margin-bottom:1px;}
.toast.fade-out{animation:fadeOut .3s ease forwards;}

/* ── SITE GROUP HEADER ───────────────────────────── */
.site-header{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:8px 0 4px;margin-top:6px;}
.site-header:first-child{margin-top:0;}
.site-header-name{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.08em;}
.site-header-line{flex:1;height:1px;background:var(--border);}
.site-header-count{font-size:11px;color:var(--text3);background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:1px 8px;}

/* ── SYNC BAR ────────────────────────────────────── */
.sync-bar{text-align:center;padding:6px;font-size:11px;color:var(--text3);border-top:1px solid rgba(255,255,255,.04);}

/* ── ANIMATIONS ──────────────────────────────────── */
@keyframes spin   {to{transform:rotate(360deg);}}
@keyframes pulse  {0%,100%{opacity:1;}50%{opacity:.4;}}
@keyframes fadeUp {from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@keyframes slideIn{from{opacity:0;transform:translateX(20px);}to{opacity:1;transform:none;}}
@keyframes fadeOut{to{opacity:0;transform:translateX(20px);}}

/* ── TOPOLOGY ────────────────────────────────────── */
#tab-topology{background:var(--bg);overflow:hidden;min-height:0;}
#tab-topology:fullscreen{display:flex;flex-direction:column;background:var(--bg);}
#topo-wrap{flex:1;position:relative;overflow:hidden;min-height:0;height:0;}
#topo-svg{width:100%;height:100%;cursor:grab;display:block;background:radial-gradient(ellipse 60% 50% at 50% 50%,rgba(0,76,151,.03) 0%,transparent 70%);}
.topo-select{background:var(--card2);border:1px solid var(--border);border-radius:var(--r);color:var(--text);padding:5px 10px;font-family:var(--font);font-size:12px;font-weight:600;letter-spacing:.3px;outline:none;cursor:pointer;min-width:220px;transition:border-color .15s;}
.topo-select:focus{border-color:rgba(0,76,151,.45);}
.topo-select option{background:var(--card2);}
.topo-node{cursor:pointer;}
.topo-node:hover .topo-node-rect{stroke-width:2px!important;filter:drop-shadow(0 0 8px rgba(0,76,151,.1));}
.detail-section-title{font-family:var(--font);font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;margin:14px 0 6px;padding-bottom:4px;border-bottom:1px solid var(--border);}
.detail-section-title:first-child{margin-top:0;}

/* ── SCROLLBAR ───────────────────────────────────── */
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(0,40,85,.14);border-radius:2px;}
::-webkit-scrollbar-thumb:hover{background:rgba(0,40,85,.22);}

/* ── RESPONSIVE ──────────────────────────────────── */
@media(max-width:900px){.stats-bar{grid-template-columns:repeat(3,1fr);} .device-grid{grid-template-columns:1fr;padding:0 12px 20px;}}
@media(max-width:600px){.stats-bar{grid-template-columns:repeat(2,1fr);padding:12px 12px 6px;} .toolbar{padding:6px 12px 10px;} .table-wrap{padding:0 12px 16px;} .mini-stats{padding:10px 12px 0;}}

.mesh-link-table th{background:rgba(0,76,151,.06);}
.mesh-link-table td{border-bottom:1px solid rgba(0,40,85,.07);}
.mesh-link-table tbody tr:hover td{background:rgba(0,76,151,.04);}
.mesh-ap-badge.wds-no{background:rgba(0,0,0,.04);color:var(--text2);border-color:var(--border);}
.badge-fw-ok,.badge-cfg-ok{color:#146b30;}
.badge-fw-old,.badge-cfg-old{color:#004c97;}
.sidebar{background:rgba(232,238,244,.98);}
.tab-btn{color:var(--text3);}
.tab-btn:hover{color:var(--text2);background:var(--card2);}
.tab-btn.active{color:var(--accent);border-left-color:var(--accent);background:rgba(0,76,151,.07);}
.sidebar-group>summary{color:var(--text);opacity:.75;}
.mesh-dot-on{background:var(--green);box-shadow:0 0 5px var(--green);}
.si-online{color:#1a8a3e;background:rgba(26,138,62,.1);}
.si-offline{color:#d32f2f;background:rgba(211,47,47,.1);}
.si-alert{color:#d97706;background:rgba(217,119,6,.1);}
.si-fw,.si-wlan{color:#004c97;background:rgba(0,76,151,.08);}
.si-cfg,.si-total{color:#004c97;background:rgba(0,76,151,.08);}
.data-table tr:hover td{background:rgba(0,76,151,.04);}
.filter-btn.active{border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.06);}
.tab-badge{background:rgba(0,76,151,.08);color:var(--accent);border-color:rgba(0,76,151,.25);}
.sdot-red:before{box-shadow:0 0 4px rgba(211,47,47,.5);}
.search-box{background:var(--card2);border-color:rgba(0,40,85,.14);}
.action-btn.btn-reboot{border-color:rgba(211,47,47,.25);color:var(--text3);}
.action-btn.btn-reboot:hover:not(:disabled){border-color:var(--red);color:var(--red);background:rgba(211,47,47,.06);}
.action-btn.btn-fw:hover:not(:disabled),.action-btn.btn-cfg:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.06);}

/* ── GLOBAL SEARCH ──────────────────────────────── */
#search-overlay{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,20,50,.35);backdrop-filter:blur(3px);align-items:flex-start;justify-content:center;padding-top:72px;}
.search-modal{background:var(--card);border:1px solid var(--border);border-radius:8px;width:calc(100% - 40px);max-width:580px;box-shadow:0 20px 60px rgba(0,20,60,.25);overflow:hidden;animation:fadeUp .18s ease;}
.search-modal-input-wrap{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border);}
.search-modal-input{background:none;border:none;outline:none;color:var(--text);font-size:16px;flex:1;font-family:inherit;}
.search-modal-input::placeholder{color:var(--text3);}
.search-results{max-height:380px;overflow-y:auto;}
.search-result-item{display:flex;align-items:center;gap:12px;padding:11px 20px;cursor:pointer;transition:background .15s;}
.search-result-item:hover,.search-result-item.focused{background:rgba(0,76,151,.06);}
.search-result-icon{width:32px;height:32px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.search-result-name{font-family:var(--font);font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.search-result-sub{font-size:11px;color:var(--text2);}
.search-result-badge{margin-left:auto;font-size:10px;font-family:var(--mono);font-weight:500;padding:2px 7px;border-radius:2px;background:var(--card2);border:1px solid var(--border);color:var(--text2);white-space:nowrap;flex-shrink:0;}
.search-hint{text-align:center;padding:32px;color:var(--text3);font-size:13px;font-family:var(--mono);letter-spacing:.2px;}
.search-section-header{font-family:var(--font);font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;padding:7px 20px 5px;background:var(--bg2);border-top:1px solid var(--border);}

/* ── ALERTS ─────────────────────────────────────── */
.alert-row-critical td{background:rgba(240,85,104,.04);}
.alert-row-warning td{background:rgba(251,191,36,.03);}
.alert-sev-critical{color:var(--red);font-weight:700;}
.alert-sev-warning{color:var(--amber);font-weight:700;}
.alert-sev-info{color:var(--blue);font-weight:700;}

/* ── SITE TILES ──────────────────────────────────── */
.site-tiles{display:flex;flex-wrap:wrap;gap:10px;padding:12px 24px 0;}
.site-tile{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 18px;cursor:pointer;transition:all .15s;min-width:130px;display:flex;flex-direction:column;gap:3px;animation:fadeUp .3s ease;position:relative;overflow:hidden;}
.site-tile::before{content:'';position:absolute;top:0;left:0;width:2px;height:100%;background:var(--accent);opacity:.3;}
.site-tile:hover{border-color:var(--accent);}
.site-tile.active{border-color:var(--accent);background:rgba(0,76,151,.08);}
.site-tile-name{font-family:var(--font);font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.site-tile-count{font-size:24px;font-weight:700;color:var(--text);line-height:1.1;font-family:var(--font);}
.site-tile-detail{font-size:10px;display:flex;gap:10px;margin-top:2px;}

/* ── MISC ────────────────────────────────────────── */
.offline-since{font-size:10px;color:var(--text3);margin-top:1px;}

/* ── CLIENT EXPLORER ────────────────────────────── */
.ce-search-card{margin:20px 24px 0;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px;}
.ce-mac-input{background:var(--bg);border:1px solid var(--border);border-radius:var(--r);color:var(--text);font-size:15px;font-family:var(--mono);padding:10px 14px;outline:none;transition:border-color .15s;letter-spacing:.04em;width:100%;max-width:460px;}
.ce-mac-input:focus{border-color:rgba(0,76,151,.45);box-shadow:0 0 0 3px rgba(0,76,151,.08);}
.ce-mac-input::placeholder{color:var(--text3);font-family:var(--font);font-size:13px;letter-spacing:normal;}
.ce-search-btn{background:var(--accent);border:none;border-radius:var(--r);color:#fff;font-family:var(--font);font-size:13px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:0 20px;height:44px;cursor:pointer;transition:all .15s;white-space:nowrap;box-shadow:0 0 16px rgba(0,76,151,.25);}
.ce-search-btn:hover{background:#1a6bc4;box-shadow:0 0 24px rgba(0,76,151,.45);transform:translateY(-1px);}
.ce-hit{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:16px 20px;margin-bottom:10px;transition:border-color .15s;}
.ce-hit.direct{border-color:rgba(52,217,123,.4);background:rgba(52,217,123,.04);}
.ce-hit.via{opacity:.65;}
.ce-hit-device{font-family:var(--font);font-size:14px;font-weight:700;}
.ce-hit-port{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--accent);}
.ce-field{display:flex;flex-direction:column;gap:2px;}
.ce-field-lbl{font-family:var(--font);font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;}
.ce-field-val{font-size:13px;font-weight:600;}
.ce-scan-btn{background:transparent;border:1px solid var(--border);border-radius:var(--r);color:var(--text2);font-family:var(--font);font-size:12px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;padding:7px 16px;cursor:pointer;transition:all .15s;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;}
.ce-scan-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.08);}
.ce-scan-btn:disabled{opacity:.4;cursor:not-allowed;}
.ce-prog-track{width:100px;height:4px;background:var(--border);border-radius:2px;overflow:hidden;}
.ce-prog-bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent));border-radius:2px;transition:width .4s;}
.ce-row-scanning td{background:rgba(0,76,151,.04)!important;}
#ce-mac-modal{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,20,50,.55);backdrop-filter:blur(3px);align-items:flex-start;justify-content:center;padding:24px 16px;}
.ce-mac-modal-box{background:var(--card2);border:1px solid var(--border);border-radius:8px;width:100%;max-width:1100px;max-height:calc(100vh - 48px);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,20,60,.25);animation:fadeUp .18s ease;overflow:hidden;}
.ce-mac-modal-head{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;flex-shrink:0;background:var(--card2);}
.ce-mac-modal-search{background:var(--bg);border:1px solid var(--border);border-radius:var(--r);color:var(--text);font-family:var(--mono);font-size:12px;padding:6px 12px;outline:none;flex:1;max-width:280px;transition:border-color .15s;}
.ce-mac-modal-search:focus{border-color:rgba(0,76,151,.45);}
.ce-mac-modal-body{overflow-y:auto;flex:1;}
.ce-row-done td{background:transparent;}
.ce-row-error td{background:rgba(240,85,104,.03)!important;}

/* ── BULK ACTION BAR ─────────────────────────────── */
#bulk-bar{position:fixed;bottom:0;left:0;right:0;z-index:200;background:rgba(240,244,248,.97);border-top:1px solid rgba(0,76,151,.25);backdrop-filter:blur(3px);padding:10px 24px;display:none;align-items:center;gap:10px;animation:slideUp .25s ease;}
@keyframes slideUp{from{transform:translateY(100%);}to{transform:none;}}
.bulk-sel-count{font-size:13px;font-family:var(--mono);font-weight:500;color:var(--accent);white-space:nowrap;}
.bulk-btn{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--r);font-family:var(--font);font-size:12px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;border:1px solid;cursor:pointer;transition:all .15s;white-space:nowrap;}
.bulk-btn-red{background:transparent;border-color:rgba(240,85,104,.2);color:var(--text3);}
.bulk-btn-red:hover{border-color:var(--red);color:var(--red);background:rgba(240,85,104,.07);}
.bulk-btn-blue{background:transparent;border-color:rgba(0,76,151,.2);color:var(--text3);}
.bulk-btn-blue:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.07);}
.bulk-btn-purple{background:transparent;border-color:rgba(0,76,151,.2);color:var(--text3);}
.bulk-btn-purple:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,76,151,.07);}
.bulk-btn-gray{background:transparent;border-color:var(--border);color:var(--text2);}
.bulk-btn-gray:hover{border-color:var(--text3);color:var(--text);}
.card-select{position:absolute;top:10px;right:10px;z-index:5;display:none;width:20px;height:20px;}
.bulk-mode .card-select{display:flex;align-items:center;justify-content:center;}
.bulk-mode .device-card{cursor:pointer;user-select:none;}
.device-card.bulk-selected{border-color:var(--accent)!important;box-shadow:0 0 0 2px rgba(0,76,151,.25);}
tr.bulk-selected td{background:rgba(0,76,151,.08)!important;}
.device-card .card-header{position:relative;}

/* ── ACTION STATUS MODAL ─────────────────────────── */
#action-modal{display:none;position:fixed;inset:0;z-index:3500;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center;}
.action-modal-box{background:var(--card);border:1px solid var(--border);border-radius:8px;width:min(560px,96vw);max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,20,60,.25);animation:fadeUp .18s ease;}
.action-device-row{display:flex;align-items:center;gap:10px;padding:8px 16px;border-bottom:1px solid rgba(255,255,255,.04);}
.action-device-status{width:22px;text-align:center;font-size:13px;flex-shrink:0;}

/* ── CONFIG PREVIEW MODAL ────────────────────────── */
#cfg-preview-modal{display:none;position:fixed;inset:0;z-index:3500;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center;}

/* ── VARIABLES MODAL ─────────────────────────────── */
#vars-modal{display:none;position:fixed;inset:0;z-index:3500;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center;}
.var-row{display:grid;grid-template-columns:180px 1fr 90px;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);align-items:center;}
.var-row:last-child{border-bottom:none;}
.var-val-input{background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:7px;color:var(--text);padding:6px 10px;font-size:12px;outline:none;width:100%;}
.var-val-input:focus{border-color:var(--accent);}

/* ── FIRMWARE TAB ─────────────────────────────────── */
.fw-group{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:14px;}
.fw-group-header{padding:12px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.fw-group-label{font-size:13px;font-weight:700;font-family:var(--mono);color:var(--text);}

/* ── SITES TAB ───────────────────────────────────── */
.sites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;padding:16px 24px 24px;}
.site-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:18px 20px;transition:all .2s;cursor:pointer;animation:fadeUp .3s ease;}
.site-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.3);}
.site-card-name{font-size:15px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.site-stat-row{display:flex;gap:20px;flex-wrap:wrap;}
.site-stat{display:flex;flex-direction:column;gap:2px;}
.site-stat-val{font-size:22px;font-weight:800;line-height:1;}
.site-stat-lbl{font-size:10px;color:var(--text2);text-transform:uppercase;letter-spacing:.04em;font-weight:600;}

/* ── BTN WEBCONFIG / PREVIEW ─────────────────────── */
.btn-web{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.25);color:var(--teal);}
.btn-web:hover:not(:disabled){background:rgba(251,191,36,.2);border-color:rgba(251,191,36,.5);}
.btn-preview{background:rgba(0,76,151,.08);border-color:rgba(0,76,151,.2);color:var(--accent2);}
.btn-preview:hover:not(:disabled){background:rgba(0,76,151,.15);border-color:rgba(0,76,151,.4);}

/* ── MAC BLACKLIST ───────────────────────────────── */
.btn-block{font-size:11px;padding:3px 8px;border-radius:6px;border:1px solid rgba(240,85,104,.3);background:rgba(240,85,104,.08);color:var(--red);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s;}
.btn-block:hover{background:rgba(240,85,104,.18);border-color:rgba(240,85,104,.6);}
.btn-block.blocked{border-color:rgba(52,217,123,.3);background:rgba(52,217,123,.08);color:var(--green);}
.btn-block.blocked:hover{background:rgba(52,217,123,.18);border-color:rgba(52,217,123,.6);}
.blacklist-panel{margin:16px 0 4px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.blacklist-header{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--border2);background:rgba(240,85,104,.04);}
.blacklist-header i{color:var(--red);}
.blacklist-title{font-weight:700;font-size:14px;color:var(--red);}
.blacklist-count{font-size:12px;color:var(--text3);background:rgba(240,85,104,.1);border:1px solid rgba(240,85,104,.2);border-radius:99px;padding:1px 8px;}
.blacklist-spacer{flex:1;}
.btn-gen-addin{font-size:12px;padding:5px 12px;border-radius:8px;border:1px solid rgba(0,76,151,.3);background:rgba(0,76,151,.1);color:var(--accent2);cursor:pointer;display:flex;align-items:center;gap:6px;font-weight:600;transition:background .15s,border-color .15s;}
.btn-gen-addin:hover{background:rgba(0,76,151,.2);border-color:rgba(0,76,151,.5);}
.btn-gen-addin:disabled{opacity:.5;cursor:not-allowed;}
#blacklist-empty{padding:20px;text-align:center;color:var(--text3);font-size:13px;}
.blacklist-table{width:100%;border-collapse:collapse;}
.blacklist-table th{padding:8px 14px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text3);border-bottom:1px solid var(--border2);text-align:left;}
.blacklist-table td{padding:8px 14px;font-size:13px;border-bottom:1px solid rgba(255,255,255,.03);}
.blacklist-table tr:last-child td{border-bottom:none;}
.blacklist-table tr:hover td{background:rgba(255,255,255,.02);}
.btn-unblock{font-size:11px;padding:2px 8px;border-radius:5px;border:1px solid rgba(240,85,104,.25);background:transparent;color:var(--red);cursor:pointer;opacity:.7;transition:opacity .15s,background .15s;}
.btn-unblock:hover{opacity:1;background:rgba(240,85,104,.1);}
.blacklist-addin-info{font-size:11px;color:var(--text3);padding:0 16px 10px;display:flex;align-items:center;gap:6px;}
.blacklist-addin-info i{color:var(--green);font-size:10px;}

/* ── DEVICE LOG MODAL ────────────────────────────── */
#log-modal{display:none;position:fixed;inset:0;z-index:3500;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);align-items:center;justify-content:center;}
.log-modal-box{background:var(--card);border:1px solid var(--border);border-radius:8px;width:min(860px,96vw);max-height:85vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,20,60,.25);animation:fadeUp .18s ease;}
.log-modal-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border2);flex-shrink:0;}
.log-modal-title{font-size:15px;font-weight:700;flex:1;}
.log-modal-sub{font-size:12px;color:var(--text3);}
.log-modal-close{width:30px;height:30px;border-radius:7px;border:1px solid var(--border);background:var(--bg2);color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;transition:all .15s;}
.log-modal-close:hover{border-color:var(--red);color:var(--red);}
.log-modal-toolbar{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--border2);flex-shrink:0;flex-wrap:wrap;}
.log-source-row{display:flex;gap:6px;width:100%;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:2px;}
.log-source-btn{flex:1;padding:5px 10px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text2);cursor:pointer;font-size:12px;font-weight:600;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:6px;}
.log-source-btn:hover{border-color:var(--accent);color:var(--accent);}
.log-source-btn.active{background:rgba(0,76,151,.15);border-color:rgba(0,76,151,.4);color:var(--accent2);}
.log-filter-btn{padding:4px 12px;border-radius:2px;font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;border:1px solid rgba(255,255,255,.055);background:transparent;color:var(--text3);cursor:pointer;transition:all .15s;}
.log-filter-btn:hover,.log-filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;}
.log-search{display:flex;align-items:center;gap:6px;background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:4px 10px;margin-left:auto;}
.log-search i{color:var(--text3);font-size:11px;}
.log-search input{background:none;border:none;outline:none;color:var(--text);font-size:12px;width:180px;}
.log-table-wrap{flex:1;overflow-y:auto;min-height:0;}
.log-table{width:100%;border-collapse:collapse;font-size:12px;}
.log-table th{position:sticky;top:0;background:var(--bg2);padding:8px 14px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text3);border-bottom:1px solid var(--border2);text-align:left;z-index:1;}
.log-table td{padding:7px 14px;border-bottom:1px solid rgba(255,255,255,.03);vertical-align:top;}
.log-table tr:hover td{background:rgba(255,255,255,.025);}
.log-table tr:last-child td{border-bottom:none;}
.log-sev{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:2px;font-size:10px;font-family:var(--mono);font-weight:500;white-space:nowrap;}
.log-sev-0,.log-sev-1{background:rgba(240,85,104,.15);color:var(--red);border:1px solid rgba(240,85,104,.25);}
.log-sev-2,.log-sev-3{background:rgba(251,191,36,.15);color:var(--amber);border:1px solid rgba(251,191,36,.25);}
.log-sev-4,.log-sev-5{background:rgba(0,76,151,.12);color:var(--blue);border:1px solid rgba(0,76,151,.2);}
.log-sev-6,.log-sev-7{background:rgba(255,255,255,.06);color:var(--text2);border:1px solid var(--border);}
.log-raw{font-family:var(--mono);font-size:11px;color:var(--text);word-break:break-word;line-height:1.5;}
.log-modal-footer{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--border2);flex-shrink:0;}
.log-count-info{font-size:12px;color:var(--text3);flex:1;}
.log-load-more{padding:5px 14px;border-radius:7px;border:1px solid var(--border);background:var(--bg2);color:var(--text2);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;}
.log-load-more:hover{border-color:var(--accent);color:var(--accent);}
.log-load-more:disabled{opacity:.4;cursor:not-allowed;}
.log-empty{text-align:center;padding:40px;color:var(--text3);}

/* ── PREDICTIVE ANOMALY – LANCOM Brand Colors ─────── */
/* Electric Blue #2d5fff · Dark Blue #001f40 · Light Blue var(--accent)  */
/* Apple Green #34d97b · Red #f05568 · Turquoise #fbbf24            */
.pa-wrap{padding:0 24px 32px;display:flex;flex-direction:column;gap:20px;}
.pa-kpi-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
.pa-kpi{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;}
.pa-kpi-val{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
.pa-kpi-lbl{font-size:10px;color:var(--text2);font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-top:3px;}
.pa-kpi-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;margin-bottom:8px;}
.pki-red   {background:rgba(240,85,104,.15);  color:#f05568;}
.pki-amber {background:rgba(251,191,36,.15);color:#fbbf24;}
.pki-blue  {background:rgba(0,76,151,.15); color:var(--accent);}
.pki-green {background:rgba(52,217,123,.15);color:#34d97b;}
.pa-section-title{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.pa-section-title i{color:var(--accent);}
.pa-alert-list{display:flex;flex-direction:column;gap:8px;}
.pa-alert{background:var(--card);border:1px solid rgba(0,76,151,.2);border-radius:10px;padding:14px;display:flex;align-items:flex-start;gap:12px;}
.pa-alert-critical{border-color:rgba(240,85,104,.5);background:rgba(240,85,104,.04);}
.pa-alert-warning {border-color:rgba(0,76,151,.4);background:rgba(0,76,151,.04);}
.pa-alert-icon{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.pai-critical{background:rgba(240,85,104,.15);  color:#f05568;}
.pai-warning {background:rgba(0,76,151,.15); color:var(--accent);}
.pa-alert-body{flex:1;min-width:0;}
.pa-alert-title{font-size:13px;font-weight:700;margin-bottom:3px;}
.pa-alert-desc{font-size:12px;color:var(--text2);line-height:1.45;}
.pa-alert-meta{display:flex;align-items:center;gap:10px;margin-top:5px;flex-wrap:wrap;}
.pa-model-badge{background:rgba(0,76,151,.15);border:1px solid rgba(0,76,151,.35);color:var(--accent);font-size:10px;font-weight:700;padding:1px 7px;border-radius:8px;}
.pa-conf-badge{font-size:11px;font-weight:700;padding:2px 7px;border-radius:6px;background:rgba(0,76,151,.12);color:var(--accent);border:1px solid rgba(0,76,151,.3);}
.pa-risk-table{width:100%;border-collapse:collapse;font-size:12.5px;}
.pa-risk-table th{text-align:left;padding:7px 14px;background:rgba(0,40,85,.6);color:var(--accent);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid rgba(0,76,151,.3);}
.pa-risk-table td{padding:8px 14px;border-bottom:1px solid var(--border);vertical-align:middle;}
.pa-risk-table tr:last-child td{border-bottom:none;}
.pa-risk-table tbody tr:hover>td{background:rgba(0,76,151,.05);}
.pa-device-detail{padding:14px;background:rgba(0,17,48,.35);display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;}
.pa-pred-card{background:var(--card);border:1px solid rgba(0,76,151,.2);border-radius:9px;padding:12px 14px;}
.pa-pred-critical{border-color:rgba(240,85,104,.4); background:rgba(240,85,104,.03);}
.pa-pred-warning {border-color:rgba(0,76,151,.4);background:rgba(0,76,151,.03);}
.pa-pred-header{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px;}
.pa-pred-icon{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;margin-top:1px;}
.ppi-critical{background:rgba(240,85,104,.15);  color:#f05568;}
.ppi-warning {background:rgba(0,76,151,.15); color:var(--accent);}
.pa-pred-title{font-size:12px;font-weight:700;margin-bottom:2px;}
.pa-pred-desc{font-size:11px;color:var(--text2);line-height:1.4;}
.pa-sparkline{margin:8px 0;border-radius:4px;overflow:hidden;background:rgba(0,40,85,.3);padding:4px 6px 2px;}
.pa-fixes{margin-top:8px;}
.pa-fix-chip{display:inline-flex;align-items:center;gap:4px;background:rgba(0,40,85,.5);border:1px solid rgba(0,76,151,.3);color:var(--accent);font-size:10px;font-weight:600;padding:3px 8px;border-radius:7px;}
.pa-model-row{font-size:10px;color:var(--text3);margin-top:8px;display:flex;align-items:center;gap:5px;}

/* ── WIFI MESH ───────────────────────────────────────── */
.mesh-wrap{padding:20px 24px 32px;display:flex;flex-direction:column;gap:16px;}
.mesh-ap-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.mesh-ap-header{display:flex;align-items:center;gap:12px;padding:13px 18px;background:var(--card2);border-bottom:1px solid var(--border);}
.mesh-ap-name{font-weight:700;font-size:15px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mesh-ap-ip{font-size:11px;color:var(--text3);font-family:monospace;white-space:nowrap;}
.mesh-ap-badge{font-size:10px;font-family:var(--mono);font-weight:500;padding:2px 7px;border-radius:2px;white-space:nowrap;}
.mesh-ap-badge.wds-yes{background:rgba(0,76,151,.18);color:var(--accent2);border:1px solid rgba(0,76,151,.35);}
.mesh-ap-badge.wds-no{background:rgba(255,255,255,.05);color:var(--text3);border:1px solid var(--border);}
.mesh-link-table{width:100%;border-collapse:collapse;font-size:13px;}
.mesh-link-table th{padding:8px 16px;text-align:left;color:var(--text3);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--border);background:rgba(0,40,85,.4);}
.mesh-link-table td{padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.04);}
.mesh-link-table tr:last-child td{border-bottom:none;}
.mesh-link-table tbody tr:hover td{background:rgba(0,76,151,.04);}
.mesh-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:middle;}
.mesh-dot-on{background:var(--green);box-shadow:0 0 5px var(--green);}
.mesh-dot-off{background:var(--text3);}
.mesh-no-link{padding:14px 18px;color:var(--text3);font-size:13px;display:flex;align-items:center;gap:8px;}
.mesh-summary{display:flex;gap:28px;padding:0 4px 8px;}
.mesh-summary-stat .ms-num{font-size:26px;font-weight:800;color:var(--accent2);}
.mesh-summary-stat .ms-lbl{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;}

/* ── L2TPv3 (reuses .mesh-* classes, no extra CSS needed) */

/* ── LIFECYCLE PLANNER ───────────────────────────────── */
.lc-wrap{padding:0 24px 32px;display:flex;flex-direction:column;gap:20px;}
.lc-kpi-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
.lc-kpi{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;}
.lc-kpi-val{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
.lc-kpi-lbl{font-size:10px;color:var(--text2);font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-top:3px;}
.lc-kpi-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;margin-bottom:8px;}
.lki-red   {background:rgba(240,85,104,.15);color:var(--red);}
.lki-amber {background:rgba(251,191,36,.15);color:var(--amber);}
.lki-blue  {background:rgba(0,76,151,.15);color:var(--blue);}
.lki-green {background:rgba(52,217,123,.15); color:var(--green);}
.lc-section-title{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.lc-section-title i{color:var(--accent2);}
.lc-filter-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.lc-filter-btn{padding:4px 12px;border-radius:2px;font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;border:1px solid rgba(255,255,255,.055);background:transparent;color:var(--text3);cursor:pointer;transition:all .15s;}
.lc-filter-btn:hover,.lc-filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;}
.lc-count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;border-radius:8px;font-size:9px;font-weight:700;padding:0 4px;margin-left:4px;}
.lcb-red   {background:rgba(240,85,104,.2);  color:var(--red);}
.lcb-amber {background:rgba(251,191,36,.2); color:var(--amber);}
.lcb-blue  {background:rgba(0,76,151,.2); color:var(--blue);}
.lcb-green {background:rgba(52,217,123,.2);  color:var(--green);}
.lc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px;}
.lc-card{background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color .15s;}
.lc-card:hover{border-color:var(--border2);}
.lc-card.lc-critical{border-color:rgba(240,85,104,.35);}
.lc-card.lc-soon    {border-color:rgba(251,191,36,.3);}
.lc-card-header{padding:12px 14px 10px;border-bottom:1px solid var(--border);}
.lc-card-name{font-size:13px;font-weight:700;margin-bottom:4px;}
.lc-card-meta{font-size:11px;color:var(--text2);display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.lc-risks{padding:10px 14px;display:flex;flex-direction:column;gap:6px;}
.lc-risk{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;border-radius:7px;background:var(--bg2);}
.lc-risk-icon{width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0;margin-top:1px;}
.lri-red   {background:rgba(240,85,104,.15);color:var(--red);}
.lri-amber {background:rgba(251,191,36,.15);color:var(--amber);}
.lri-blue  {background:rgba(0,76,151,.15);color:var(--blue);}
.lri-purple{background:rgba(0,76,151,.15);color:var(--purple);}
.lc-risk-body{flex:1;min-width:0;}
.lc-risk-title{font-size:12px;font-weight:700;}
.lc-risk-desc{font-size:11px;color:var(--text2);margin-top:2px;line-height:1.45;}
.lc-cap-bar-wrap{background:var(--bg);border-radius:3px;height:4px;margin-top:5px;}
.lc-cap-bar{height:100%;border-radius:3px;}
.lc-risk-months{font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;align-self:flex-start;flex-shrink:0;white-space:nowrap;border:1px solid transparent;}
.lrm-critical{background:rgba(240,85,104,.15);color:var(--red);  border-color:rgba(240,85,104,.3);}
.lrm-soon    {background:rgba(251,191,36,.15);color:var(--amber);border-color:rgba(251,191,36,.3);}
.lrm-medium  {background:rgba(0,76,151,.12);color:var(--blue); border-color:rgba(0,76,151,.25);}
.lc-upgrade{margin:0 14px 12px;padding:9px 12px;background:rgba(0,76,151,.07);border:1px solid rgba(0,76,151,.2);border-radius:8px;font-size:11.5px;color:var(--text2);line-height:1.6;}
.lc-upgrade strong{color:var(--accent2);}
.lc-ok-state{padding:12px 14px;font-size:12px;color:var(--green);display:flex;align-items:center;gap:6px;}

/* ── ENERGIE DASHBOARD ───────────────────────────────── */
.energy-wrap{padding:0 24px 32px;display:flex;flex-direction:column;gap:20px;}
.energy-kpi-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;}
.energy-kpi{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:16px 18px;display:flex;flex-direction:column;gap:4px;}
.energy-kpi-val{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
.energy-kpi-lbl{font-size:11px;color:var(--text2);font-weight:600;text-transform:uppercase;letter-spacing:.05em;}
.energy-kpi-sub{font-size:10px;color:var(--text3);margin-top:2px;}
.energy-kpi-icon{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;margin-bottom:6px;}
.eki-power{background:rgba(251,191,36,.15);color:var(--amber);}
.eki-co2  {background:rgba(52,217,123,.15); color:var(--green);}
.eki-cost {background:rgba(0,76,151,.15);color:var(--accent2);}
.eki-poe  {background:rgba(0,76,151,.15);color:var(--blue);}
.eki-dev  {background:rgba(0,76,151,.15);color:var(--purple);}

.energy-section-title{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:10px;display:flex;align-items:center;gap:8px;}
.energy-section-title i{color:var(--accent2);}

.energy-sites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;}
.energy-site-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px 18px;}
.energy-site-name{font-size:13px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:6px;}
.energy-site-name i{color:var(--accent);font-size:12px;}
.energy-site-stats{display:flex;gap:14px;margin-bottom:12px;flex-wrap:wrap;}
.energy-site-stat{display:flex;flex-direction:column;gap:1px;}
.energy-site-stat-val{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;}
.energy-site-stat-lbl{font-size:9px;color:var(--text3);text-transform:uppercase;letter-spacing:.05em;}
.energy-bar-wrap{background:var(--bg);border-radius:4px;height:6px;overflow:hidden;}
.energy-bar{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--amber),var(--accent));transition:width .4s ease;}

.energy-dev-table{width:100%;border-collapse:collapse;font-size:12.5px;}
.energy-dev-table th{text-align:left;padding:7px 12px;background:var(--bg2);color:var(--text3);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border2);}
.energy-dev-table td{padding:7px 12px;border-bottom:1px solid var(--border);}
.energy-dev-table tr:last-child td{border-bottom:none;}
.energy-dev-table tr:hover td{background:rgba(255,255,255,.02);}
.energy-type-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;}
.etb-router{background:rgba(0,76,151,.15);color:var(--accent2);}
.etb-ap    {background:rgba(251,191,36,.15);color:var(--teal);}
.etb-switch{background:rgba(0,76,151,.15);color:var(--blue);}
.etb-other {background:rgba(255,255,255,.06);color:var(--text3);}

.energy-suggest-list{display:flex;flex-direction:column;gap:8px;}
.energy-suggest{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:14px 16px;display:flex;align-items:flex-start;gap:12px;}
.energy-suggest-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.esi-green {background:rgba(52,217,123,.15); color:var(--green);}
.esi-amber {background:rgba(251,191,36,.15);color:var(--amber);}
.esi-blue  {background:rgba(0,76,151,.15);color:var(--blue);}
.esi-purple{background:rgba(0,76,151,.15);color:var(--purple);}
.energy-suggest-body{flex:1;min-width:0;}
.energy-suggest-title{font-size:13px;font-weight:700;margin-bottom:3px;}
.energy-suggest-desc{font-size:12px;color:var(--text2);line-height:1.5;}
.energy-suggest-badge{margin-left:auto;flex-shrink:0;background:rgba(251,191,36,.15);color:var(--amber);font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;border:1px solid rgba(251,191,36,.25);align-self:flex-start;}
.energy-note{font-size:11px;color:var(--text3);margin-top:4px;line-height:1.4;}

/* ── WLAN CAPACITY ──────────────────────────────── */
.wc-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.wc-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.wc-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.wc-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;white-space:nowrap;}
.wc-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px;}
.wc-section{padding:16px 24px 0;}
.wc-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.wc-bar-wrap{position:relative;height:18px;background:var(--card2);border-radius:9px;overflow:hidden;min-width:80px;}
.wc-bar{height:100%;border-radius:9px;transition:width .3s;}
.wc-bar-label{position:absolute;right:6px;top:1px;font-size:10px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}
.wc-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:16px 24px 0;}
@media(max-width:700px){.wc-grid2{grid-template-columns:1fr;}}
.wc-chart-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;}
.wc-chart-title{font-size:11px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;}
.wc-stacked-bar{display:flex;height:24px;border-radius:4px;overflow:hidden;background:var(--card2);}
.wc-stacked-bar>div{min-width:2px;transition:width .3s;}
.wc-chart-legend{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:10px;font-size:11px;color:var(--text2);}
.wc-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.wc-ap-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px;}
.wc-ap-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px;}
.wc-ap-head{display:flex;align-items:baseline;gap:8px;margin-bottom:8px;}
.wc-ap-name{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px;}
.wc-ap-meta{font-size:10px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wc-ap-metrics{display:flex;align-items:baseline;gap:8px;margin-bottom:8px;flex-wrap:wrap;}
.wc-ap-count{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
.wc-ap-sub{font-size:10px;color:var(--text3);font-weight:600;text-transform:uppercase;margin-right:6px;}
.wc-ap-badge{font-size:10px;font-weight:600;padding:2px 7px;border-radius:6px;white-space:nowrap;}
.wc-histo{display:flex;align-items:flex-end;gap:12px;justify-content:center;padding:8px 0 4px;}
.wc-histo-col{display:flex;flex-direction:column;align-items:center;gap:4px;}
.wc-histo-val{font-size:11px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}
.wc-histo-bar{width:48px;border-radius:4px 4px 0 0;transition:height .3s;}
.wc-histo-lbl{font-size:9px;color:var(--text3);font-weight:600;white-space:nowrap;}
.wc-ssid-pill{display:inline-block;font-size:11px;font-weight:600;background:rgba(0,76,151,.08);color:var(--blue);padding:1px 8px;border-radius:8px;}

/* ── INTERFACE UTILIZATION ──────────────────────── */
.ifu-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.ifu-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.ifu-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.ifu-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;white-space:nowrap;}
.ifu-stat-sub{font-size:12px;font-weight:400;color:var(--text3);margin-left:2px;}
.ifu-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px;}
.ifu-section{padding:16px 24px 0;}
.ifu-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.ifu-top10{display:flex;flex-direction:column;gap:6px;}
.ifu-top-row{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:8px 14px;font-size:12px;}
.ifu-top-rank{font-weight:800;color:var(--text3);width:24px;flex-shrink:0;font-variant-numeric:tabular-nums;}
.ifu-top-name{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ifu-top-speed{color:var(--text3);font-size:11px;width:80px;text-align:right;flex-shrink:0;font-family:var(--mono);}
.ifu-top-rates{width:140px;flex-shrink:0;font-size:11px;font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;display:flex;gap:8px;justify-content:flex-end;}
.ifu-top-bar-wrap{width:120px;height:14px;background:var(--card2);border-radius:7px;overflow:hidden;flex-shrink:0;}
.ifu-top-bar{height:100%;border-radius:7px;transition:width .3s;}
.ifu-top-pct{width:52px;text-align:right;font-weight:800;font-variant-numeric:tabular-nums;font-size:13px;flex-shrink:0;}
.ifu-table th{font-size:10px!important;text-transform:uppercase;letter-spacing:.5px;}
.ifu-bar-wrap{height:16px;background:var(--card2);border-radius:8px;overflow:hidden;min-width:80px;}
.ifu-bar{height:100%;border-radius:8px;transition:width .3s;}
.ifu-chart-wrap{padding:8px 0 4px 34px;}
.ifu-chart-svg{width:100%;max-height:200px;display:block;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:4px;}
.ifu-chart-footer{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:6px;font-size:11px;color:var(--text2);align-items:center;}
.ifu-chart-legend{display:flex;align-items:center;gap:5px;}
.ifu-chart-dot{width:10px;height:3px;border-radius:2px;flex-shrink:0;}
.ifu-chart-peak{font-size:11px;color:var(--text3);}
.ifu-chart-peak strong{color:var(--text);}
.ifu-device-block{background:var(--card);border:1px solid var(--border);border-radius:var(--r);margin-bottom:10px;overflow:hidden;}
.ifu-device-block.collapsed .ifu-device-charts{display:none;}
.ifu-device-block.collapsed .ifu-device-chevron{transform:rotate(-90deg);}
.ifu-device-header{display:flex;align-items:center;gap:8px;padding:10px 14px;cursor:pointer;font-size:13px;user-select:none;border-bottom:1px solid var(--border);}
.ifu-device-header:hover{background:var(--card2);}
.ifu-device-chevron{font-size:10px;color:var(--text3);transition:transform .15s;width:14px;text-align:center;}
.ifu-device-charts{padding:12px 14px;display:flex;flex-direction:column;gap:16px;}
.ifu-port-chart{}
.ifu-port-chart-header{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin-bottom:6px;font-size:12px;}

/* ── SITE MAP ─────────────────────────────────────── */
.sm-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.sm-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.sm-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.sm-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.sm-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.sm-section{padding:16px 24px 0;}
.sm-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.sm-site-list{display:flex;flex-direction:column;gap:8px;}
.sm-site-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px;}
.sm-site-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.sm-site-name{font-size:14px;font-weight:700;}
.sm-site-count{font-size:11px;color:var(--text3);}
.sm-gps-badge{font-size:9px;font-weight:700;color:var(--accent2);background:rgba(77,166,255,.12);border:1px solid rgba(77,166,255,.25);border-radius:6px;padding:1px 7px;margin-left:auto;}
.sm-site-addr{font-size:11px;color:var(--text2);margin-top:6px;}
.sm-site-devs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.sm-dev-pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;background:var(--card2);border:1px solid var(--border);border-radius:6px;padding:3px 9px;}
.sm-dev-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}

/* ── SWITCH PORTS ─────────────────────────────────── */
.sp-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.sp-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.sp-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.sp-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.sp-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.sp-switches{display:flex;flex-direction:column;gap:14px;padding:16px 24px 0;}
.sp-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.sp-card-head{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--border);font-size:13px;}
.sp-card-name{font-weight:700;}
.sp-card-model{color:var(--text3);font-size:11px;}
.sp-unit{padding:14px 16px;}
.sp-unit-label{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;}
.sp-port-grid{display:flex;flex-wrap:wrap;gap:6px;}
.sp-port{width:52px;height:40px;border-radius:6px;border:2px solid var(--border);background:var(--card2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:default;transition:all .15s;position:relative;}
.sp-port-linked{border-color:rgba(52,217,123,.5);background:rgba(52,217,123,.08);}
.sp-port-linked .sp-port-num{color:var(--green);}
.sp-port-active{border-color:rgba(251,191,36,.4);background:rgba(251,191,36,.06);}
.sp-port-active .sp-port-num{color:var(--amber);}
.sp-port-down{border-color:var(--border);opacity:.5;}
.sp-port-sfp{border-style:dashed;}
.sp-port:hover{transform:scale(1.1);z-index:2;box-shadow:0 2px 12px rgba(0,0,0,.3);}
.sp-port-num{font-size:13px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;}
.sp-port-speed{font-size:8px;font-weight:700;color:var(--text3);text-transform:uppercase;}

/* ── SUBNET OVERVIEW ──────────────────────────────── */
.sn-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.sn-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.sn-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.sn-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.sn-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.sn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px;padding:16px 24px 0;}
.sn-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.sn-card-disabled{opacity:.55;}
.sn-card-head{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--border);flex-wrap:wrap;}
.sn-net-badge{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--accent2);}
.sn-central-badge{font-size:9px;font-weight:700;color:var(--purple);background:rgba(139,92,246,.12);border:1px solid rgba(139,92,246,.25);border-radius:6px;padding:1px 7px;}
.sn-disabled-badge{font-size:9px;font-weight:700;color:var(--red);background:rgba(240,85,104,.1);border:1px solid rgba(240,85,104,.25);border-radius:6px;padding:1px 7px;}
.sn-card-body{padding:10px 14px;display:flex;flex-direction:column;gap:6px;}
.sn-row{display:flex;align-items:center;gap:8px;font-size:12px;}
.sn-label{color:var(--text3);font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.3px;width:60px;flex-shrink:0;}
.sn-value{color:var(--text);font-variant-numeric:tabular-nums;}
.sn-bar-wrap{flex:1;height:8px;background:var(--card2);border-radius:4px;overflow:hidden;min-width:60px;}
.sn-bar{height:100%;border-radius:4px;background:var(--accent);transition:width .3s;}

/* ── FIRMWARE MATRIX ──────────────────────────────── */
.fwm-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.fwm-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.fwm-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.fwm-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.fwm-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.fwm-section{padding:16px 24px 0;}
.fwm-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.fwm-release-bar{display:flex;height:20px;border-radius:4px;overflow:hidden;background:var(--card2);}
.fwm-release-bar>div{min-width:2px;transition:width .3s;}
.fwm-release-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:10px;font-size:11px;color:var(--text2);}
.fwm-legend-item{display:flex;align-items:center;gap:5px;}
.fwm-legend-dot{width:10px;height:10px;border-radius:3px;flex-shrink:0;}
.fwm-group{display:flex;flex-direction:column;gap:8px;}
.fwm-fw-row{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px;}
.fwm-fw-header{display:flex;align-items:center;gap:10px;margin-bottom:8px;flex-wrap:wrap;}
.fwm-fw-badge{font-size:10px;font-weight:700;border:1px solid;border-radius:6px;padding:2px 8px;flex-shrink:0;}
.fwm-fw-version{font-size:12px;font-weight:700;font-family:var(--mono);color:var(--text);}
.fwm-fw-date{font-size:11px;color:var(--text3);}
.fwm-fw-count{margin-left:auto;font-size:12px;font-weight:700;color:var(--text2);font-variant-numeric:tabular-nums;}
.fwm-fw-devices{display:flex;flex-wrap:wrap;gap:6px;}
.fwm-dev-chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;background:var(--card2);border:1px solid var(--border);border-radius:6px;padding:3px 9px;}

/* ── ALERT TIMELINE ───────────────────────────────── */
.at-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.at-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.at-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.at-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.at-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.at-section{padding:16px 24px 0;}
.at-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.at-type-list{display:flex;flex-direction:column;gap:6px;}
.at-type-row{display:flex;align-items:center;gap:10px;font-size:12px;}
.at-type-name{width:200px;flex-shrink:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.at-type-bar-wrap{flex:1;height:10px;background:var(--card2);border-radius:5px;overflow:hidden;min-width:60px;}
.at-type-bar{height:100%;border-radius:5px;background:var(--accent);transition:width .3s;}
.at-type-count{width:40px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text2);}
.at-timeline{display:flex;flex-direction:column;gap:0;position:relative;padding-left:20px;}
.at-timeline::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:2px;background:var(--border);}
.at-item{display:flex;gap:12px;padding:10px 0;position:relative;}
.at-item-open{background:rgba(240,85,104,.03);border-radius:var(--r);margin:-2px -8px;padding:12px 8px;}
.at-item-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;margin-top:3px;border:2px solid var(--bg);position:relative;z-index:1;}
.at-item-content{flex:1;min-width:0;}
.at-item-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.at-item-type{font-size:13px;font-weight:700;}
.at-item-state{font-size:11px;font-weight:700;margin-left:auto;}
.at-item-devs{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;}
.at-dev-pill{font-size:10px;font-weight:600;background:rgba(77,166,255,.1);color:var(--accent2);border:1px solid rgba(77,166,255,.2);border-radius:5px;padding:1px 7px;}
.at-item-time{font-size:11px;color:var(--text3);margin-top:4px;display:flex;align-items:center;gap:5px;}

/* ── LOG ARCHIVE ──────────────────────────────────── */
.la-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.la-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.la-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.la-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.la-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.la-section{padding:16px 24px 0;}
.la-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.la-chart-svg{width:100%;max-height:240px;display:block;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:8px 4px;}
.la-bar{transition:opacity .15s;}
.la-bar:hover{opacity:.8;}
.la-list{display:flex;flex-direction:column;gap:4px;}
.la-row{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:8px 14px;font-size:12px;}
.la-row-date{width:80px;font-weight:700;flex-shrink:0;}
.la-row-count{width:90px;flex-shrink:0;font-variant-numeric:tabular-nums;color:var(--text2);}
.la-row-bar-wrap{flex:1;height:8px;background:var(--card2);border-radius:4px;overflow:hidden;min-width:60px;}
.la-row-bar{height:100%;border-radius:4px;background:var(--accent);transition:width .3s;}
.la-row-size{width:70px;text-align:right;flex-shrink:0;color:var(--text3);font-family:var(--mono);font-size:11px;}
.la-row-status{width:50px;text-align:right;flex-shrink:0;font-size:11px;font-weight:600;}

/* ── HEALTH SCORE ─────────────────────────────────── */
.hs-hero{display:flex;align-items:center;gap:40px;padding:32px 40px;flex-wrap:wrap;justify-content:center;}
.hs-gauge-wrap{position:relative;width:220px;height:220px;flex-shrink:0;}
.hs-gauge-svg{width:100%;height:100%;}
.hs-gauge-arc{transition:stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1);}
.hs-gauge-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.hs-gauge-val{font-size:56px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1;}
.hs-gauge-label{font-size:14px;font-weight:700;color:var(--text2);margin-top:4px;text-transform:uppercase;letter-spacing:.5px;}
.hs-hero-info{text-align:left;}
.hs-hero-title{font-size:22px;font-weight:800;margin-bottom:6px;}
.hs-hero-sub{font-size:14px;color:var(--text2);}
.hs-hero-time{font-size:11px;color:var(--text3);margin-top:8px;}
.hs-scores{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;padding:0 24px;}
.hs-score-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;}
.hs-score-header{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.hs-score-icon{font-size:14px;width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);}
.hs-score-label{font-size:12px;font-weight:700;flex:1;}
.hs-score-weight{font-size:10px;color:var(--text3);font-weight:600;}
.hs-score-body{display:flex;align-items:center;gap:10px;}
.hs-score-val{font-size:28px;font-weight:900;font-variant-numeric:tabular-nums;width:50px;flex-shrink:0;}
.hs-score-bar-wrap{flex:1;height:8px;background:var(--card2);border-radius:4px;overflow:hidden;min-width:40px;}
.hs-score-bar{height:100%;border-radius:4px;transition:width .8s cubic-bezier(.4,0,.2,1);}
.hs-score-detail{font-size:11px;color:var(--text3);white-space:nowrap;width:90px;text-align:right;flex-shrink:0;}
.hs-section{padding:20px 24px 0;}
.hs-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.hs-recs{display:flex;flex-direction:column;gap:8px;}
.hs-rec{display:flex;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px;align-items:flex-start;}
.hs-rec-icon{font-size:16px;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);flex-shrink:0;}
.hs-rec-title{font-size:13px;font-weight:700;margin-bottom:2px;}
.hs-rec-desc{font-size:12px;color:var(--text2);line-height:1.5;}

/* ── TV MODE ──────────────────────────────────────── */
#tv-overlay{position:fixed;inset:0;z-index:9999;background:#0a0e1a;flex-direction:column;font-family:var(--font);}
.tv-header{display:flex;align-items:center;padding:20px 32px;border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;}
.tv-logo{font-size:18px;font-weight:800;color:#fff;display:flex;align-items:center;gap:8px;}
.tv-logo span{color:var(--accent2);font-weight:400;}
.tv-logo i{color:var(--accent);}
.tv-header-mid{flex:1;text-align:center;font-size:13px;color:rgba(255,255,255,.4);}
.tv-header-right{display:flex;align-items:center;gap:16px;}
.tv-clock{font-size:36px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:1px;}
.tv-exit-btn{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:8px;color:rgba(255,255,255,.5);font-size:16px;padding:8px 12px;cursor:pointer;}
.tv-exit-btn:hover{background:rgba(240,85,104,.2);color:var(--red);}
.tv-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;animation:tvFade .6s ease;}
@keyframes tvFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.tv-slide-title{font-size:16px;font-weight:700;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:2px;margin-bottom:40px;}
.tv-big-numbers{display:flex;gap:60px;flex-wrap:wrap;justify-content:center;}
.tv-big{text-align:center;}
.tv-big-val{font-size:72px;font-weight:900;color:#fff;font-variant-numeric:tabular-nums;line-height:1;}
.tv-big-lbl{font-size:13px;color:rgba(255,255,255,.35);font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-top:10px;}
.tv-green{color:#34d97b!important;} .tv-red{color:#f05568!important;}
.tv-device-bar{width:min(500px,80%);height:12px;background:rgba(255,255,255,.06);border-radius:6px;overflow:hidden;margin:40px auto 12px;}
.tv-device-bar-on{height:100%;background:linear-gradient(90deg,#34d97b,#2dd4bf);border-radius:6px;transition:width .8s;}
.tv-device-legend{display:flex;gap:24px;justify-content:center;font-size:13px;color:rgba(255,255,255,.5);}
.tv-type-grid{display:flex;gap:40px;flex-wrap:wrap;justify-content:center;}
.tv-type-card{text-align:center;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:32px 40px;min-width:140px;}
.tv-site-grid{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;max-width:800px;}
.tv-site-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:16px 24px;display:flex;align-items:center;gap:10px;min-width:180px;}
.tv-site-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;}
.tv-site-name{font-size:14px;font-weight:700;color:#fff;flex:1;}
.tv-site-count{font-size:13px;color:rgba(255,255,255,.4);font-weight:600;font-variant-numeric:tabular-nums;}
.tv-dots{display:flex;gap:8px;justify-content:center;padding:20px;flex-shrink:0;}
.tv-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.15);transition:all .3s;}
.tv-dot-active{background:var(--accent);width:24px;border-radius:4px;}

/* ── PDF REPORT ───────────────────────────────────── */
.rpt-preview{padding:24px;display:flex;flex-direction:column;gap:20px;max-width:700px;margin:0 auto;}
.rpt-section{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:20px;}
.rpt-section-title{font-size:13px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.rpt-btn{background:var(--accent);border:none;border-radius:10px;color:#fff;font-size:14px;font-weight:700;padding:12px 28px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:transform .1s;}
.rpt-btn:hover{transform:scale(1.03);}
.rpt-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.rpt-prev-card{background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:14px;text-align:center;}
.rpt-prev-val{font-size:28px;font-weight:900;font-variant-numeric:tabular-nums;}
.rpt-prev-lbl{font-size:10px;color:var(--text3);font-weight:600;text-transform:uppercase;margin-top:4px;}
.rpt-checklist{display:flex;flex-direction:column;gap:8px;}
.rpt-check{display:flex;align-items:center;gap:10px;font-size:13px;padding:6px 0;}

/* ── CHANGE RADAR ─────────────────────────────────── */
.cr-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;padding:16px 24px 0;}
.cr-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.cr-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.cr-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.cr-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.cr-section{padding:16px 24px 0;}
.cr-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.cr-month-grid{display:flex;gap:4px;overflow-x:auto;padding-bottom:8px;align-items:flex-end;}
.cr-month-col{display:flex;flex-direction:column;align-items:center;min-width:50px;flex:1;}
.cr-month-bars{width:100%;height:120px;display:flex;align-items:flex-end;justify-content:center;}
.cr-month-bar{width:70%;border-radius:4px 4px 0 0;transition:height .4s;}
.cr-month-alert{font-size:9px;color:var(--amber);font-weight:700;margin-top:4px;white-space:nowrap;}
.cr-month-val{font-size:9px;color:var(--text2);font-weight:700;margin-top:2px;font-family:var(--mono);}
.cr-month-lbl{font-size:8px;color:var(--text3);margin-top:2px;}
.cr-insights{display:flex;flex-direction:column;gap:8px;}
.cr-insight{display:flex;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px;align-items:flex-start;}
.cr-insight-icon{font-size:16px;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);flex-shrink:0;}
.cr-insight-title{font-size:13px;font-weight:700;margin-bottom:2px;}
.cr-insight-desc{font-size:12px;color:var(--text2);line-height:1.5;}
.cr-timeline{position:relative;padding-left:10px;}
.cr-date-sep{font-size:11px;font-weight:700;color:var(--accent2);padding:12px 0 6px 50px;border-top:1px solid var(--border);margin-top:8px;}
.cr-date-sep:first-child{border-top:none;margin-top:0;}
.cr-event{display:flex;align-items:center;gap:8px;padding:4px 0;}
.cr-event-time{width:42px;font-size:10px;color:var(--text3);font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;flex-shrink:0;}
.cr-event-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.cr-event-body{flex:1;font-size:12px;display:flex;gap:6px;align-items:baseline;min-width:0;}
.cr-event-title{font-weight:700;white-space:nowrap;}
.cr-event-detail{color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ── DHCP LEASES ──────────────────────────────────── */
.dl-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:16px 24px 0;}
.dl-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.dl-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.dl-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.dl-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.dl-section{padding:16px 24px 0;}
.dl-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.dl-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r);background:var(--card);}
.dl-table{width:100%;border-collapse:collapse;font-size:12px;}
.dl-table th{background:var(--card2);padding:8px 12px;text-align:left;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1;}
.dl-table td{padding:7px 12px;border-bottom:1px solid var(--border);}
.dl-table tr:hover td{background:rgba(77,166,255,.04);}
.dl-td-mono{font-family:var(--mono);font-size:11px;}
.dl-td-dev{font-weight:600;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dl-td-time{font-family:var(--mono);font-size:11px;color:var(--text3);}
.dl-row-dup td{background:rgba(240,85,104,.04)!important;}
.dl-dup-list{display:flex;flex-direction:column;gap:6px;}
.dl-dup{display:flex;align-items:center;gap:10px;background:rgba(240,85,104,.06);border:1px solid rgba(240,85,104,.15);border-radius:var(--r);padding:8px 12px;font-size:12px;}
.dl-dup-ip{font-family:var(--mono);font-weight:700;width:110px;flex-shrink:0;}
.dl-dup-count{color:var(--red);font-weight:700;width:30px;flex-shrink:0;}
.dl-dup-macs{color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.toolbar-search{background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:6px 12px;font-size:12px;color:var(--text);font-family:var(--font);outline:none;}
.toolbar-search:focus{border-color:var(--accent);}

/* ── VLAN MAP ─────────────────────────────────────── */
.vm-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:16px 24px 0;}
.vm-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.vm-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.vm-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.vm-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.vm-section{padding:16px 24px 0;}
.vm-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.vm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;}
.vm-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:transform .15s;}
.vm-card:hover{transform:translateY(-2px);}
.vm-card-disabled{opacity:.55;}
.vm-card-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border);}
.vm-vlan-tag{font-size:11px;font-weight:800;padding:2px 8px;border-radius:6px;font-variant-numeric:tabular-nums;min-width:36px;text-align:center;}
.vm-card-name{font-size:14px;font-weight:700;flex:1;}
.vm-disabled-badge{font-size:10px;color:var(--red);font-weight:700;border:1px solid var(--red);border-radius:4px;padding:1px 6px;}
.vm-card-body{padding:10px 14px;display:flex;flex-direction:column;gap:4px;}
.vm-row{display:flex;justify-content:space-between;font-size:12px;}
.vm-label{color:var(--text3);}
.vm-value{font-weight:600;}
.vm-badges{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 12px;}
.vm-badge{font-size:10px;font-weight:700;border:1px solid;border-radius:4px;padding:2px 8px;}

/* ── ACCOUNT MEMBERS ──────────────────────────────── */
.am-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:16px 24px 0;}
.am-stat{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:10px;min-width:0;}
.am-stat-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.am-stat-val{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;}
.am-stat-lbl{font-size:9px;color:var(--text3);font-weight:600;text-transform:uppercase;letter-spacing:.4px;margin-top:2px;}
.am-section{padding:16px 24px 0;}
.am-section-title{font-size:12px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.am-user-card{display:flex;align-items:center;gap:16px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:16px 20px;}
.am-user-avatar{font-size:40px;color:var(--accent);opacity:.7;}
.am-user-name{font-size:16px;font-weight:800;}
.am-user-email{font-size:13px;color:var(--text2);margin-top:2px;}
.am-user-meta{display:flex;gap:16px;margin-top:8px;font-size:11px;color:var(--text3);flex-wrap:wrap;}
.am-user-meta span{display:flex;align-items:center;gap:4px;}
.am-role-badge{font-size:10px;font-weight:700;border-radius:4px;padding:2px 8px;display:inline-block;}
.am-role-owner{background:rgba(139,92,246,.15);color:var(--purple);}
.am-role-admin{background:rgba(0,76,151,.15);color:var(--blue);}
.am-role-member,.am-role-viewer{background:rgba(107,114,128,.15);color:var(--text2);}
.am-license-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;}
.am-license-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.am-lic-head{padding:10px 14px;border-bottom:1px solid var(--border);font-size:12px;font-weight:700;display:flex;align-items:center;gap:8px;}
.am-lic-body{padding:10px 14px;}
.am-lic-row{display:flex;justify-content:space-between;font-size:12px;padding:3px 0;}
.am-lic-row span:first-child{color:var(--text3);}
.am-lic-val{font-weight:600;}
.am-sec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;}
.am-sec-item{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;display:flex;gap:12px;align-items:flex-start;}
.am-sec-icon{font-size:18px;width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);flex-shrink:0;}
.am-sec-title{font-size:13px;font-weight:700;margin-bottom:2px;}
.am-sec-desc{font-size:11px;color:var(--text2);line-height:1.5;}
