:root {
    color-scheme:dark;
    --bg-primary:#0a0e17;--bg-secondary:#111827;--bg-tertiary:#1a2236;--bg-card:#141c2e;
    --bg-input:#0d1220;--border:#1e2d4a;--border-focus:#3b82f6;
    --text-primary:#e2e8f0;--text-secondary:#94a3b8;--text-muted:#64748b;
    --accent-blue:#3b82f6;--accent-cyan:#06b6d4;--accent-green:#10b981;
    --accent-purple:#8b5cf6;--accent-orange:#f59e0b;--accent-red:#ef4444;
    --accent-pink:#ec4899;
    --vnet-stroke:#3b82f6;--subnet-public:#06b6d4;--subnet-private:#8b5cf6;
    --fw-gw-color:#10b981;--nat-color:#f59e0b;--vhub-color:#ec4899;
    --vgw-color:#ef4444;--pe-color:#a78bfa;--pcx-color:#fb923c;
    --igw-color:var(--fw-gw-color);--tgw-color:var(--vhub-color);--vpce-color:var(--pe-color);
    --alb-color:#38bdf8;--vpn-color:#f97316;
    --fw-color:#ef4444;--bastion-color:#10b981;--aks-color:#8b5cf6;
    /* Legacy alias for any remaining references */
    --vpc-stroke:var(--vnet-stroke);
    --txt-scale:1;--dp-txt-scale:1;
    /* Transparency variables (dark defaults) */
    --overlay-bg:rgba(10,17,30,.92);
    --panel-bg:rgba(10,14,23,.97);
    --hover-bg-subtle:rgba(255,255,255,.03);
    --hover-bg:rgba(255,255,255,.05);
    --hover-bg-strong:rgba(255,255,255,.1);
    --shadow-color:rgba(0,0,0,.4);
    --shadow-heavy:rgba(0,0,0,.5);
    --grid-color:rgba(50,70,100,.35);
  }
  /* ── Light theme overrides ──────────────────────────────────── */
  [data-theme="light"] {
    color-scheme:light;
    --bg-primary:#e8ecf1;--bg-secondary:#dfe4eb;--bg-tertiary:#d0d7e0;--bg-card:#edf0f4;
    --bg-input:#e4e8ee;--border:#b8c1ce;--border-focus:#2563eb;
    --text-primary:#111824;--text-secondary:#2d3a4d;--text-muted:#5c6b7f;
    /* Darkened accents for readable contrast on light backgrounds */
    --accent-blue:#1d4ed8;--accent-cyan:#0e7490;--accent-green:#047857;
    --accent-purple:#6d28d9;--accent-orange:#b45309;--accent-red:#dc2626;
    --accent-pink:#be185d;
    /* Darkened resource colors */
    --vnet-stroke:#2563eb;--subnet-public:#0891b2;--subnet-private:#7c3aed;
    --fw-gw-color:#059669;--nat-color:#d97706;--vhub-color:#db2777;
    --vgw-color:#dc2626;--pe-color:#7c3aed;--pcx-color:#ea580c;
    --igw-color:var(--fw-gw-color);--tgw-color:var(--vhub-color);--vpce-color:var(--pe-color);
    --alb-color:#0284c7;--vpn-color:#ea580c;
    --fw-color:#dc2626;--bastion-color:#059669;--aks-color:#7c3aed;
    --vpc-stroke:var(--vnet-stroke);
    --overlay-bg:rgba(228,232,238,.96);
    --panel-bg:rgba(232,236,241,.97);
    --hover-bg-subtle:rgba(0,0,0,.04);
    --hover-bg:rgba(0,0,0,.06);
    --hover-bg-strong:rgba(0,0,0,.1);
    --shadow-color:rgba(0,0,0,.1);
    --shadow-heavy:rgba(0,0,0,.15);
    --grid-color:rgba(160,175,195,.3);
  }
  *{margin:0;padding:0;box-sizing:border-box}
  body{font-family:"Segoe UI",system-ui,sans-serif;background:var(--bg-primary);color:var(--text-primary);height:100vh;overflow:hidden;display:flex}
  .sidebar{position:fixed;top:0;left:0;width:360px;min-width:360px;background:var(--bg-secondary);border-right:1px solid var(--border);display:flex;flex-direction:column;height:100vh;z-index:10;transition:transform .15s ease;will-change:transform}
  .sidebar.collapsed{transform:translateX(-360px);border-right:none}
  .sidebar-toggle{position:fixed;top:8px;left:4px;z-index:11;width:24px;height:24px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease,background .15s;line-height:1;transform:translateX(356px);will-change:transform}
  .sidebar-toggle:hover{background:var(--border);color:var(--text-primary)}
  .sidebar.collapsed~.sidebar-toggle{transform:translateX(0)}
  .sidebar-header{padding:14px 16px;border-bottom:1px solid var(--border);background:var(--bg-tertiary)}
  .sidebar-header h1{font-family:"Segoe UI",system-ui,sans-serif;font-size:14px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent-cyan);margin-bottom:3px}
  .sidebar-header p{font-size:11px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif}
  .brand-row{display:flex;align-items:center;gap:10px;margin-bottom:6px}
  .brand-icon{width:36px;height:36px;background:linear-gradient(135deg,rgba(6,182,212,.15),rgba(59,130,246,.15));border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .brand-text h1{font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--accent-cyan);margin-bottom:1px}
  .brand-ver{font-size:9px;font-weight:400;color:var(--text-muted);background:var(--bg-primary);padding:1px 5px;border-radius:8px;margin-left:4px;letter-spacing:0;text-transform:none}
  .brand-text p{font-size:10px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif}
  .global-txt-ctrl{display:flex;align-items:center;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
  .gtc-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase}
  .gtc-btn{width:26px;height:26px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}
  .gtc-btn:hover{background:var(--border);color:var(--text-primary)}
  .gtc-val{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--accent-cyan);min-width:36px;text-align:center}
  .theme-toggle{font-size:16px!important;width:28px!important;height:28px!important}
  [data-theme="light"] .theme-toggle::after{content:''}
  .theme-toggle::after{content:''}
  .sidebar-body{flex:1;overflow-y:auto;padding:0}
  .sidebar-body::-webkit-scrollbar{width:6px}
  .sidebar-body::-webkit-scrollbar-track{background:transparent}
  .sidebar-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
  .sec-hdr{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--bg-tertiary);border-bottom:1px solid var(--border);cursor:pointer;user-select:none}
  .sec-hdr:hover{background:rgba(30,45,74,.5)}
  .sec-hdr span{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px}
  .sec-hdr .arr{color:var(--text-muted);font-size:10px;transition:transform .2s}
  .sec-hdr.collapsed .arr{transform:rotate(-90deg)}
  .sec-dot{width:4px;height:16px;border-radius:2px;flex-shrink:0}
  .sec-hdr .arr{margin-left:auto}
  .sec-body{padding:6px 10px;border-bottom:1px solid var(--border);background:rgba(0,0,0,.08)}
  .sec-body.hidden{display:none}
  .ig{margin-bottom:5px}
  .ig-lbl{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px;padding:0 2px}
  .ig-lbl span{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));font-weight:500;color:var(--text-secondary);letter-spacing:.4px}
  .ig-lbl code{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-muted);background:var(--bg-primary);padding:1px 4px;border-radius:3px}
  .ji{width:100%;height:56px;background:var(--bg-input);border:1px solid var(--border);border-radius:5px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));padding:5px 7px;resize:none;transition:border-color .2s;line-height:1.4}
  .ji:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px rgba(59,130,246,.15)}
  .ji.valid{border-color:var(--accent-green)}.ji.invalid{border-color:var(--accent-red)}
  .sidebar-actions{padding:10px 12px;border-top:1px solid var(--border);display:flex;gap:8px;background:var(--bg-tertiary)}
  .btn{flex:1;padding:9px 14px;border:none;border-radius:8px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale));font-weight:600;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:all .2s}
  .btn-primary{background:var(--accent-blue);color:#fff}.btn-primary:hover{background:#2563eb}
  .btn-secondary{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border);color:var(--text-primary)}
  .btn-demo{background:transparent;color:var(--accent-cyan);border:1px solid var(--accent-cyan);opacity:.7}.btn-demo:hover{opacity:1;background:rgba(6,182,212,.08)}
  .main{flex:1;position:relative;background:var(--bg-primary);overflow:hidden;display:flex;flex-direction:column}
  .main svg{flex:1;min-height:0;width:100%;display:block;touch-action:none}
  .grid-bg{position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,var(--grid-color) 1px,transparent 0);background-size:24px 24px;pointer-events:none}
  .empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
  .empty-state .icon{width:80px;height:80px;border:2px dashed var(--border);border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--text-muted);font-size:32px}
  .empty-state h2{font-family:"Segoe UI",system-ui,sans-serif;font-size:14px;font-weight:500;color:var(--text-muted);margin-bottom:8px}
  .empty-state p{font-size:12px;color:var(--text-muted);opacity:.6}
  .landing{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:60px 40px 40px;overflow-y:auto;pointer-events:auto}
  .landing-hero{text-align:center;margin-bottom:32px}
  .landing-icon{width:64px;height:64px;background:linear-gradient(135deg,rgba(6,182,212,.15),rgba(59,130,246,.15));border-radius:16px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:16px}
  .landing-icon svg{width:36px;height:36px}
  .landing h1{font-family:"Segoe UI",system-ui,sans-serif;font-size:22px;font-weight:600;color:var(--text-primary);letter-spacing:1px;margin-bottom:6px}
  .landing .tagline{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;color:var(--text-muted);margin-bottom:24px}
  .landing-cta{display:flex;gap:10px;justify-content:center;margin-bottom:40px}
  .landing-cta .btn-cta{padding:10px 24px;border:none;border-radius:8px;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;letter-spacing:.3px}
  .landing-cta .btn-cta:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.3)}
  .landing-cta .btn-cta.primary{background:linear-gradient(135deg,#06b6d4,#3b82f6);color:#fff}
  .landing-cta .btn-cta.secondary{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border)}
  .landing-cta .btn-cta.secondary:hover{border-color:var(--accent-cyan);color:var(--text-primary)}
  .landing-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:860px;width:100%}
  .landing-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;padding:16px 18px;border-left:3px solid var(--accent-cyan);transition:all .15s;opacity:0;animation:cardUp .4s ease forwards}
  .landing-card:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(0,0,0,.3);border-color:rgba(59,130,246,.3)}
  .landing-card h3{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;font-weight:600;color:var(--text-primary);margin-bottom:4px;display:flex;align-items:center;gap:6px}
  .landing-card p{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);line-height:1.5}
  .landing-card:nth-child(1){border-left-color:#06b6d4;animation-delay:.05s}.landing-card:nth-child(2){border-left-color:#3b82f6;animation-delay:.1s}.landing-card:nth-child(3){border-left-color:#8b5cf6;animation-delay:.15s}
  .landing-card:nth-child(4){border-left-color:#10b981;animation-delay:.2s}.landing-card:nth-child(5){border-left-color:#f59e0b;animation-delay:.25s}.landing-card:nth-child(6){border-left-color:#ef4444;animation-delay:.3s}
  .landing-card:nth-child(7){border-left-color:#ec4899;animation-delay:.35s}.landing-card:nth-child(8){border-left-color:#a78bfa;animation-delay:.4s}.landing-card:nth-child(9){border-left-color:#38bdf8;animation-delay:.45s}
  @keyframes cardUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
  .landing-footer{margin-top:32px;text-align:center;font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-muted);opacity:.5}
  .landing-footer a{color:var(--accent-cyan);text-decoration:none}
  .stats-bar{position:relative;display:none;gap:5px;flex-wrap:wrap;flex-shrink:0;z-index:5;justify-content:center;padding:6px 280px 6px 16px;background:var(--bg-primary);border-bottom:1px solid var(--border)}
  .main.merge-active .stats-bar,.main.flow-active .stats-bar,.main.diff-active .stats-bar,.main.history-active .stats-bar{padding-top:42px}
  .main:has(.design-banner.visible) .stats-bar{padding-top:40px}
  .main:has(.detail-panel.open) .export-bar{right:432px}
  .stat-chip{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale));font-weight:500;padding:5px 10px;border-radius:8px;background:rgba(17,24,39,.9);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;transition:border-color .15s,background .15s}
  .stat-chip:hover{border-color:var(--accent-blue);background:rgba(59,130,246,.12)}
  .stat-chip.accent-amber{border-color:rgba(245,158,11,.3);background:rgba(245,158,11,.08)}
  .stat-chip.accent-purple{border-color:rgba(139,92,246,.3);background:rgba(139,92,246,.08)}
  .stat-chip.accent-blue{border-color:rgba(59,130,246,.3);background:rgba(59,130,246,.08)}
  .stat-chip b{color:var(--text-primary);font-weight:600;margin-right:3px}
  .dock-toolbar{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:7;display:none;align-items:stretch;background:var(--overlay-bg);border:1px solid var(--hover-bg-strong);border-radius:14px;backdrop-filter:blur(16px);padding:5px 6px 18px;gap:2px;box-shadow:0 8px 32px var(--shadow-color),0 0 0 1px rgba(255,255,255,.04) inset}
  .dock-group{display:flex;align-items:center;gap:3px;padding:0 6px;position:relative}
  .dock-group:not(:last-child)::after{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:22px;background:rgba(255,255,255,.15)}
  .dock-label{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted);opacity:.65;white-space:nowrap;pointer-events:none}
  .dock-btn{height:30px;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;cursor:pointer;display:flex;align-items:center;gap:5px;padding:0 10px;transition:all .15s;white-space:nowrap}
  .dock-btn:hover{background:var(--hover-bg-strong);border-color:rgba(255,255,255,.12);transform:translateY(-1px)}
  .dock-btn:active{transform:translateY(0)}
  .dock-btn svg{width:13px;height:13px;flex-shrink:0}
  .dock-btn.green{color:#34d399;border-color:rgba(52,211,153,.15)}.dock-btn.green:hover{background:rgba(16,185,129,.15);border-color:rgba(52,211,153,.3)}
  .dock-btn.orange{color:#fb923c;border-color:rgba(251,146,60,.15)}.dock-btn.orange:hover{background:rgba(249,115,22,.15);border-color:rgba(251,146,60,.3)}
  .dock-btn.cyan{color:#22d3ee;border-color:rgba(34,211,238,.15)}.dock-btn.cyan:hover{background:rgba(6,182,212,.15);border-color:rgba(34,211,238,.3)}
  .dock-btn.mint{color:#6ee7b7;border-color:rgba(110,231,183,.15)}.dock-btn.mint:hover{background:rgba(110,231,183,.15);border-color:rgba(110,231,183,.3)}
  .dock-btn.pink{color:#f472b6;border-color:rgba(244,114,182,.15)}.dock-btn.pink:hover{background:rgba(244,114,182,.15);border-color:rgba(244,114,182,.3)}
  .dock-btn.red{color:#f87171;border-color:rgba(248,113,113,.15)}.dock-btn.red:hover{background:rgba(239,68,68,.15);border-color:rgba(248,113,113,.3)}
  .dock-btn.purple{color:#c084fc;border-color:rgba(192,132,252,.15)}.dock-btn.purple:hover{background:rgba(168,85,247,.15);border-color:rgba(192,132,252,.3)}
  .dock-btn.amber{color:#fbbf24;border-color:rgba(251,191,36,.15)}.dock-btn.amber:hover{background:rgba(245,158,11,.15);border-color:rgba(251,191,36,.3)}
  .dock-btn.help{width:30px;padding:0;justify-content:center;border-radius:50%;font-size:13px;font-weight:700;color:var(--accent-cyan);border-color:rgba(34,211,238,.2)}
  .legend{position:absolute;bottom:76px;left:12px;display:none;flex-direction:column;gap:3px;background:var(--overlay-bg);border:1px solid var(--border);border-radius:8px;padding:10px 14px;backdrop-filter:blur(8px);z-index:8;transition:all .2s}
  .legend-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);margin-bottom:3px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;user-select:none}
  .legend-title .lg-arr{font-size:7px;transition:transform .2s}
  .legend.collapsed .legend-title .lg-arr{transform:rotate(-90deg)}
  .legend.collapsed .legend-item,.legend.collapsed .legend-hint{display:none}
  .legend-item{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--text-secondary)}
  .legend-swatch{width:10px;height:10px;border-radius:2px;flex-shrink:0}
  .legend-hint{font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;color:var(--text-muted);margin-top:4px;padding-top:4px;border-top:1px solid var(--border);opacity:.7}
  .zoom-controls{position:absolute;bottom:72px;right:12px;display:flex;flex-direction:column;align-items:center;gap:4px;z-index:5}
  .zoom-btn{width:32px;height:32px;background:var(--overlay-bg);border:1px solid var(--border);border-radius:6px;color:var(--text-secondary);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:"Segoe UI",system-ui,sans-serif;transition:all .15s;backdrop-filter:blur(8px)}
  .zoom-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}
  .zoom-btn.wide{width:auto;padding:0 10px;font-size:9px;letter-spacing:.5px}
  .zoom-btn.active{border-color:var(--accent-blue);color:var(--accent-blue);background:rgba(59,130,246,.12)}
  .tooltip{position:absolute;display:none;background:var(--panel-bg);border:1px solid var(--border);border-radius:8px;padding:12px 16px;max-width:420px;min-width:200px;z-index:100;pointer-events:none;backdrop-filter:blur(12px);box-shadow:0 8px 32px var(--shadow-heavy)}
  .tt-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;font-weight:600;color:var(--accent-cyan);margin-bottom:5px;word-break:break-all}
  .tt-sub{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin-bottom:7px;word-break:break-all}
  .tt-sec{margin-bottom:5px}
  .tt-sh{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:2px}
  .tt-r{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--text-secondary);line-height:1.6;padding-left:8px}
  .tt-r .a{color:var(--accent-green)}.tt-r .d{color:var(--accent-red)}.tt-r .p{color:var(--accent-orange)}.tt-r .i{color:var(--accent-cyan)}
  .vnet-group rect{stroke-dasharray:6 3;rx:8;ry:8}
  /* Legacy alias */
  .vnet-group rect{stroke-dasharray:6 3;rx:8;ry:8}
  .vnet-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(13px * var(--txt-scale));font-weight:600;fill:var(--vnet-stroke);text-transform:uppercase;letter-spacing:.5px}
  /* Legacy alias */
  .vnet-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(13px * var(--txt-scale));font-weight:600;fill:var(--vnet-stroke);text-transform:uppercase;letter-spacing:.5px}
  .vnet-cidr{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));fill:var(--text-muted)}
  .vnet-cidr{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));fill:var(--text-muted)}
  .subnet-node rect{rx:5;ry:5;cursor:pointer}
  .subnet-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale));font-weight:500;fill:#fff;pointer-events:none}
  .subnet-cidr{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale));fill:rgba(255,255,255,.7);pointer-events:none}
  .subnet-badge{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale));font-weight:600;pointer-events:none}
  .gw-node{cursor:pointer}
  .gw-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));font-weight:600;pointer-events:none}
  .gw-id{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale));fill:var(--text-muted);pointer-events:none}
  .gw-name{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale));fill:var(--text-secondary);pointer-events:none}
  .route-group{opacity:.35;filter:url(#alphaClamp)}
  .struct-group{opacity:1}
  .route-line{fill:none;stroke-width:1.5;opacity:1;pointer-events:none}
  .route-line.route-structural{stroke-dasharray:6 3;animation:dashStruct 1s linear infinite}
  .route-trunk{fill:none;stroke-width:1.5;opacity:1;pointer-events:none}
  .route-trunk.animated{stroke-dasharray:6 3;animation:dashStruct 1s linear infinite}
  .pe-service-line{transition:opacity .3s ease;pointer-events:none}
  .pe-dns-line{transition:opacity .3s ease;pointer-events:none}
  .pe-ext-target{transition:opacity .3s ease}
  .route-structural{opacity:1}
  .route-trunk.route-structural{stroke-dasharray:6 3;animation:dashStruct 1s linear infinite}
  .hl-active .route-group{opacity:.06}
  .hl-active .struct-group{opacity:.06}
  .hl-active .route-structural{opacity:.06}
  .peering-group{opacity:.35;filter:url(#alphaClamp)}
  .peering-line{fill:none;stroke-width:2;opacity:1;stroke-dasharray:9 9;animation:dashFlow 1.2s linear infinite}
  .peering-label-g{opacity:1}
  .hl-active .peering-group{opacity:.03}
  .hl-active .pe-summary{opacity:.15}
  .hl-active .pe-service-line{opacity:.08}
  .hl-active .pe-ext-target{opacity:.15}
  .hl-active .pe-dns-line{opacity:.08}
  .hl-active .dns-summary{opacity:.15}
  .hl-active .peering-label-g{opacity:.08}
  .hl-active .gw-node{opacity:.15}
  .hl-active .gw-node.gw-hl{opacity:1}
  .hl-active .lz-gw-node{opacity:.15}
  .hl-active .lz-gw-node.lz-hl{opacity:1}
  .hl-active .lz-tgw-node{opacity:.15}
  .hl-active .lz-tgw-node.lz-hl{opacity:1}
  .hl-active .internet-node{opacity:.08}
  .hl-active .internet-node.lz-hl{opacity:1}
  .export-bar.collapsed .export-btn,.export-bar.collapsed .export-btn+.export-btn{display:none}
  .export-bar .eb-toggle{padding:4px 10px;background:var(--overlay-bg);border:1px solid var(--border);border-radius:5px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;cursor:pointer;white-space:nowrap;transition:all .15s}
  .export-bar .eb-toggle:hover{color:var(--text-primary);border-color:var(--accent-blue)}
  .hl-locked-indicator{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);background:rgba(17,24,39,.95);border:1px solid var(--accent-cyan);border-radius:6px;padding:5px 14px;font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--accent-cyan);display:none;z-index:10;cursor:pointer;backdrop-filter:blur(8px)}
  .hl-locked-indicator:hover{background:rgba(17,24,39,1);border-color:#fff}
  .hl-active .route-label-g:not(.visible){opacity:.08}
  .hl-active .region-boundary{opacity:.08}
  .hl-active .dns-section{opacity:.08}
  .hl-active .s3-section{opacity:.08}
  .hl-active .cf-section{opacity:.08}
  .hl-active .legend{opacity:.08}
  .route-hitarea{fill:none;stroke:transparent;stroke-width:16;cursor:pointer;pointer-events:stroke !important}
  .dp-nav-btn{display:inline-block;font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;color:var(--accent-blue);cursor:pointer;margin-left:6px;padding:1px 5px;border:1px solid rgba(59,130,246,.3);border-radius:3px;background:rgba(59,130,246,.08);transition:background .15s}
  .dp-nav-btn:hover{background:rgba(59,130,246,.2)}
  .route-label-g{display:none;pointer-events:none}.route-label-g.visible{display:block}
  .label-layer{pointer-events:none}
  .internet-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale));font-weight:600;fill:var(--text-secondary)}
  @keyframes dashFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-18}}
  @keyframes dashFlowIn{from{stroke-dashoffset:0}to{stroke-dashoffset:18}}
  @keyframes dashStruct{from{stroke-dashoffset:0}to{stroke-dashoffset:18}}
  .animated{animation:dashStruct 1s linear infinite}
  .export-bar{position:absolute;top:12px;right:12px;display:none;gap:4px;z-index:10;flex-direction:column;align-items:flex-end}
  .eb-row{display:flex;align-items:center;gap:6px}
  .eb-layout-controls{display:flex;align-items:center;gap:6px;padding-right:8px;border-right:1px solid var(--border)}
  .eb-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;color:var(--text-muted);text-transform:uppercase}
  .eb-select{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;padding:4px 6px;cursor:pointer}
  .export-btn{padding:8px 12px;background:var(--overlay-bg);border:1px solid var(--border);border-radius:5px;color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale));font-weight:500;cursor:pointer;backdrop-filter:blur(8px);transition:all .15s;text-align:left;white-space:nowrap}
  .export-btn:hover{background:var(--bg-tertiary);color:var(--text-primary);border-color:var(--accent-blue)}
  .export-btn span{color:var(--text-muted);font-size:7px;display:block;margin-top:1px}
  .upload-row{padding:8px 14px;display:flex;gap:4px;flex-wrap:wrap}
  .btn-action{padding:6px 12px;border:none;border-radius:8px;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;font-weight:600;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:4px;text-transform:uppercase;letter-spacing:.3px;color:#fff}
  .btn-action:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.3)}
  .btn-action.green{background:linear-gradient(135deg,#10b981,#059669)}
  .btn-action.amber{background:linear-gradient(135deg,#f59e0b,#d97706)}
  .btn-action.indigo{background:linear-gradient(135deg,#6366f1,#4f46e5)}
  .upload-status{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--accent-green);padding:4px 12px;display:none;border-bottom:1px solid var(--border)}
  /* Detail panel - right side slide-out */
  .detail-panel{position:absolute;top:0;right:0;width:420px;height:100%;background:var(--panel-bg);border-left:1px solid var(--border);backdrop-filter:blur(16px);z-index:50;display:none;flex-direction:column;box-shadow:-4px 0 24px var(--shadow-color);container-type:inline-size;container-name:dp}
  .detail-panel.open{display:flex}
  .detail-panel.fullscreen{position:fixed;width:100vw;left:0;right:0;top:0;bottom:0;height:100vh;border-left:none;z-index:200;background:var(--bg-primary)}
  .detail-panel.fullscreen .dp-body{padding:0 max(20px,4%)}
  .detail-panel.fullscreen .dp-header{padding:14px max(20px,4%)}
  .detail-panel.fullscreen .dp-toolbar{padding-left:max(20px,4%);padding-right:max(20px,4%)}
  .dp-grid{display:flex;flex-direction:column}
  .detail-panel.fullscreen .dp-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
  .detail-panel.fullscreen .dp-col-left,.detail-panel.fullscreen .dp-col-right{min-width:0}
  .detail-panel.fullscreen .dp-col-full{grid-column:1/-1}
  .dp-header{padding:clamp(6px,2cqw,14px) clamp(10px,3.5cqw,18px);border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:clamp(6px,2cqw,10px);flex-shrink:0}
  .dp-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:clamp(11px,3.2cqw,15px);font-weight:600;color:var(--accent-cyan);word-break:break-all;line-height:1.2;min-width:0}
  .dp-subtitle{font-family:"Segoe UI",system-ui,sans-serif;font-size:clamp(8px,2.6cqw,11px);color:var(--text-muted);margin-top:clamp(1px,0.6cqw,3px);word-break:break-all;line-height:1.3}
  .dp-close{width:clamp(22px,6cqw,30px);height:clamp(22px,6cqw,30px);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:5px;color:var(--text-muted);font-size:clamp(11px,3.2cqw,15px);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;position:relative;z-index:10}
  .dp-close:hover{background:var(--border);color:var(--text-primary)}
  .dp-body{flex:1;overflow-y:auto;padding:0;-webkit-overflow-scrolling:touch}
  .dp-body::-webkit-scrollbar{width:6px}
  .dp-body::-webkit-scrollbar-track{background:transparent}
  .dp-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
  .dp-section{border-bottom:1px solid var(--border)}
  .dp-sec-hdr{display:flex;align-items:center;justify-content:space-between;padding:9px 16px;cursor:pointer;user-select:none;transition:background .15s}
  .dp-sec-hdr:hover{background:rgba(30,45,74,.3)}
  .dp-sec-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.8px}
  .dp-sec-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-muted);background:var(--bg-tertiary);padding:2px 6px;border-radius:3px}
  .dp-sec-arr{color:var(--text-muted);font-size:10px;transition:transform .2s;margin-left:6px}
  .dp-sec-hdr.collapsed .dp-sec-arr{transform:rotate(-90deg)}
  .dp-sec-body{padding:4px 16px 10px}
  .dp-sec-body.hidden{display:none}
  .dp-row{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-secondary);line-height:1.7;padding:3px 0;border-bottom:1px solid rgba(30,45,74,.3)}
  .dp-row:last-child{border-bottom:none}
  .dp-row[data-act]{cursor:pointer;transition:background .15s}
  .dp-row[data-act]:hover{background:rgba(59,130,246,.1)}
  .dp-link{text-decoration:none;transition:text-decoration .15s,opacity .15s}
  .dp-link:hover{text-decoration:underline;opacity:.85}
/* Related Resources — Network Flow Paths */
.dp-flow-paths{padding:4px 0 8px;border-bottom:1px solid var(--border);margin-bottom:8px}
.dp-flow-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale) * var(--dp-txt-scale));font-weight:700;color:var(--text-muted);letter-spacing:1px;text-transform:uppercase;padding:4px 0 2px}
.dp-flow-row{display:flex;flex-wrap:wrap;align-items:center;gap:3px 4px;padding:4px 0}
.dp-flow-hop{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:5px;padding:4px 8px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;transition:all .15s;display:flex;align-items:flex-start;gap:5px;min-width:0}
.dp-flow-hop:hover{background:rgba(103,232,249,.1);border-color:var(--accent-cyan)}
.dp-flow-hopnum{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:rgba(103,232,249,.15);color:var(--accent-cyan);font-size:calc(8px * var(--txt-scale) * var(--dp-txt-scale));font-weight:700;flex-shrink:0;margin-top:2px}
.dp-flow-hopbody{display:flex;flex-direction:column;min-width:0}
.dp-flow-hoplbl{font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-primary);font-weight:600;white-space:nowrap}
.dp-flow-hopdet{font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-secondary);white-space:nowrap}
.dp-flow-hoprole{font-size:calc(7px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-muted);opacity:.7;white-space:nowrap;letter-spacing:.3px;text-transform:uppercase}
.dp-dep-arrow{color:var(--text-muted);font-size:10px;flex-shrink:0}
.dp-related-group{margin:6px 0 10px}
.dp-related-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;padding:4px 0;border-bottom:1px solid rgba(30,45,74,.3);margin-bottom:4px}
.dp-related-item{display:flex;align-items:center;gap:6px;padding:4px 8px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-secondary);cursor:pointer;border-left:2px solid transparent;border-radius:2px;transition:all .12s}
.dp-related-item:hover{background:rgba(103,232,249,.06);border-left-color:var(--accent-cyan);color:var(--text-primary)}
.dp-related-item .rel-name{color:var(--accent-cyan);font-weight:500}
.dp-related-item .rel-cidr{color:var(--text-muted);font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale))}
.dp-related-item .rel-az{color:var(--text-muted);font-size:calc(8px * var(--txt-scale) * var(--dp-txt-scale));margin-left:auto}
.dp-related-item .rel-count{color:var(--accent-orange);font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale))}
.dp-related-item .rel-badge{display:inline-block;padding:1px 5px;border-radius:3px;font-size:calc(8px * var(--txt-scale) * var(--dp-txt-scale));font-weight:600}
.dp-related-item .rel-badge.pub{background:rgba(6,182,212,.15);color:var(--accent-cyan)}
.dp-related-item .rel-badge.prv{background:rgba(139,92,246,.1);color:var(--accent-purple)}
/* Account indicator pills (reusable across dashboards) */
.acct-pill{display:inline-flex;align-items:center;gap:3px;padding:1px 6px;border-radius:3px;font-size:8px;font-weight:600;white-space:nowrap;font-family:"Segoe UI",system-ui,sans-serif}
.acct-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;display:inline-block}
.dp-rel-link{color:var(--accent-blue);font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));cursor:pointer;transition:opacity .15s}
.dp-rel-link:hover{text-decoration:underline;opacity:.85}
  .dp-row .lbl{color:var(--text-muted);font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));display:block}
  .dp-row .val{color:var(--text-primary)}
  .dp-det{transition:max-height .15s}
  .dp-row.collapsed .dp-det{display:none}
  .dp-tog{font-size:9px;color:var(--accent-blue);margin-right:4px;display:inline-block;transition:transform .15s;cursor:pointer;user-select:none}
  .dp-row.collapsed .dp-tog{transform:rotate(-90deg)}
  .dp-row .a{color:var(--accent-green)}.dp-row .d{color:var(--accent-red)}.dp-row .p{color:var(--accent-orange)}.dp-row .i{color:var(--accent-cyan)}.dp-row .s{color:var(--accent-purple)}
  .dp-kv{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:3px 0}
  .dp-kv .k{color:var(--text-muted);font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));flex-shrink:0}
  .dp-kv .v{color:var(--text-primary);font-size:calc(11px * var(--txt-scale) * var(--dp-txt-scale));text-align:right;word-break:break-all;cursor:pointer}
  .dp-kv .v:hover{color:var(--accent-cyan)}
  table.dp-kv{width:100%;border-collapse:collapse;font-size:calc(10px * var(--txt-scale,1) * var(--dp-txt-scale,1))}
  table.dp-kv td{padding:3px 0;vertical-align:top}
  table.dp-kv td:first-child{color:var(--text-muted);white-space:nowrap;padding-right:12px;width:1%;font-size:calc(10px * var(--txt-scale,1) * var(--dp-txt-scale,1))}
  table.dp-kv td:last-child{color:var(--text-primary);word-break:break-all;font-size:calc(11px * var(--txt-scale,1) * var(--dp-txt-scale,1))}
  .dp-badge{display:inline-block;padding:clamp(1px,0.5cqw,3px) clamp(4px,1.4cqw,7px);border-radius:3px;font-size:clamp(7px,2cqw,10px);font-weight:600;margin-left:clamp(3px,1cqw,5px)}
  .dp-badge.running{background:rgba(16,185,129,.15);color:var(--accent-green)}
  .dp-badge.stopped{background:rgba(239,68,68,.15);color:var(--accent-red)}
  .dp-badge.pub{background:rgba(6,182,212,.15);color:var(--accent-cyan)}
  .dp-badge.prv{background:rgba(139,92,246,.15);color:var(--accent-purple)}
  .dp-empty{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-muted);padding:6px 0;font-style:italic}
  /* sub-group within a dp-row (Storage, ENIs, etc.) */
  .dp-sub{margin-top:6px;padding:5px 8px;background:rgba(255,255,255,.025);border:1px solid rgba(30,45,74,.4);border-radius:4px}
  .dp-sub-title{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:3px;display:flex;align-items:center;gap:6px}
  .dp-sub-title .dp-sub-count{font-weight:400;font-size:calc(8px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-muted);background:var(--bg-tertiary);padding:1px 5px;border-radius:3px}
  .dp-sub-item{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));color:var(--text-secondary);padding:2px 0;border-bottom:1px solid rgba(30,45,74,.2);line-height:1.6}
  .dp-sub-item:last-child{border-bottom:none}
  .dp-props{display:grid;grid-template-columns:auto 1fr;gap:1px 10px;margin-top:3px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale))}
  .dp-props .k{color:var(--text-muted);font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));white-space:nowrap;padding:2px 0}
  .dp-props .v{color:var(--text-primary);padding:2px 0;word-break:break-all}
  /* text size controls */
  .dp-toolbar{display:flex;align-items:center;gap:clamp(4px,1.2cqw,8px);padding:clamp(4px,1.2cqw,8px) clamp(10px,3.5cqw,18px);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:nowrap}
  .dp-size-btn{width:clamp(18px,5cqw,26px);height:clamp(18px,5cqw,26px);background:var(--bg-tertiary);border:1px solid var(--border);border-radius:3px;color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:clamp(9px,2.8cqw,13px);font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center}
  .dp-size-btn:hover{background:var(--border);color:var(--text-primary)}
  .dp-size-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:clamp(8px,2.4cqw,10px);color:var(--text-muted)}
  .dp-action-btn{font-family:"Segoe UI",system-ui,sans-serif;font-size:clamp(8px,2.4cqw,10px);cursor:pointer;padding:clamp(2px,0.6cqw,4px) clamp(5px,1.8cqw,10px);border-radius:3px;white-space:nowrap}
  .dp-action-btn.blue{color:var(--accent-blue);border:1px solid rgba(59,130,246,.3);background:rgba(59,130,246,.08)}
  .dp-action-btn.cyan{color:#22d3ee;border:1px solid rgba(34,211,238,.3);background:rgba(34,211,238,.08)}
  #dpFullscreen{color:var(--text-muted);border:1px solid var(--border);background:var(--bg-tertiary);font-size:14px;padding:2px 6px;line-height:1}
  #dpFullscreen:hover{color:var(--text-primary);background:var(--border)}
  /* firewall visual */
  .fw-visual{padding:8px 0}
  .fw-rule-bar{display:flex;align-items:center;gap:6px;margin:3px 0;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale))}
  .fw-arrow{width:40px;height:22px;position:relative;flex-shrink:0}
  .fw-arrow-line{position:absolute;top:10px;left:0;right:8px;height:2px}
  .fw-arrow-head{position:absolute;right:0;top:5px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent}
  .fw-arrow.allow .fw-arrow-line{background:var(--accent-green)}.fw-arrow.allow .fw-arrow-head{border-left:8px solid var(--accent-green)}
  .fw-arrow.deny .fw-arrow-line{background:var(--accent-red)}.fw-arrow.deny .fw-arrow-head{border-left:8px solid var(--accent-red)}
  .fw-port{padding:2px 8px;border-radius:4px;font-weight:600;font-size:calc(11px * var(--txt-scale) * var(--dp-txt-scale))}
  .fw-port.allow{background:rgba(16,185,129,.12);color:var(--accent-green);border:1px solid rgba(16,185,129,.25)}
  .fw-port.deny{background:rgba(239,68,68,.12);color:var(--accent-red);border:1px solid rgba(239,68,68,.25)}
  .fw-src{color:var(--text-secondary);font-size:calc(11px * var(--txt-scale) * var(--dp-txt-scale));margin-left:auto;max-width:150px;text-align:right;word-break:break-all}
  .fw-proto{color:var(--accent-orange);font-size:calc(10px * var(--txt-scale) * var(--dp-txt-scale));min-width:32px;flex-shrink:0;text-align:center;font-weight:500}
  .fw-legend{display:flex;gap:12px;padding:4px 0 6px;font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;color:var(--text-muted);border-bottom:1px solid rgba(30,45,74,.3);margin-bottom:4px}
  .fw-legend span{display:flex;align-items:center;gap:3px}
  .fw-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
  /* firewall editor */
  .fw-edit-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:4px;margin:3px 0;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale) * var(--dp-txt-scale));border:1px solid transparent}
  .fw-edit-row.modified{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.25)}
  .fw-edit-row.deleted{background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.2);text-decoration:line-through;opacity:.5}
  .fw-edit-row.new-rule{background:rgba(59,130,246,.08);border-color:rgba(59,130,246,.25)}
  .fw-edit-btn{width:24px;height:24px;border:none;border-radius:4px;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}
  .fw-edit-btn.edit{background:rgba(59,130,246,.15);color:var(--accent-blue)}.fw-edit-btn.edit:hover{background:rgba(59,130,246,.3)}
  .fw-edit-btn.del{background:rgba(239,68,68,.15);color:var(--accent-red)}.fw-edit-btn.del:hover{background:rgba(239,68,68,.3)}
  .fw-edit-btn.add{background:rgba(16,185,129,.15);color:var(--accent-green);width:auto;padding:4px 12px;gap:4px;font-size:11px}.fw-edit-btn.add:hover{background:rgba(16,185,129,.3)}
  .fw-edit-btn.save{background:rgba(16,185,129,.15);color:var(--accent-green);width:auto;padding:4px 12px;font-size:11px}.fw-edit-btn.save:hover{background:rgba(16,185,129,.3)}
  .fw-edit-btn.cancel{background:rgba(239,68,68,.15);color:var(--accent-red);width:auto;padding:4px 12px;font-size:11px}.fw-edit-btn.cancel:hover{background:rgba(239,68,68,.3)}
  .fw-input{background:var(--bg-input);border:1px solid var(--border);border-radius:3px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));padding:2px 4px}
  .fw-input.invalid{border-color:var(--accent-red);background:rgba(239,68,68,.08)}
  .fw-input:focus{border-color:var(--accent-cyan);outline:none}
  .fw-select{background:var(--bg-input);border:1px solid var(--border);border-radius:3px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale) * var(--dp-txt-scale));padding:2px 4px}
  .fw-select:focus{border-color:var(--accent-cyan);outline:none}
  .fw-badge{font-size:8px;padding:1px 6px;border-radius:8px;font-weight:600;margin-left:6px}
  .fw-badge.edits{background:rgba(59,130,246,.15);color:var(--accent-blue)}
  .fw-badge.warning{background:rgba(245,158,11,.15);color:var(--accent-orange)}
  .fw-toolbar{display:flex;gap:4px;border-top:1px solid var(--border);margin-top:6px;padding:4px 0}
  .fw-toolbar button{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:3px;color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;padding:3px 8px;cursor:pointer;transition:background .15s}.fw-toolbar button:hover{background:var(--border);color:var(--text-primary)}
  .fw-full-panel{position:fixed;top:0;right:0;bottom:0;width:520px;background:var(--bg-primary);border-left:1px solid var(--border);z-index:600;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .2s ease}
  .fw-full-panel.open{transform:translateX(0)}
  .fw-fp-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border)}
  .fw-fp-header h3{margin:0;font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;font-weight:600;color:var(--text-primary)}
  .fw-fp-tabs{display:flex;gap:0;border-bottom:1px solid var(--border)}
  .fw-fp-tab{flex:1;padding:8px 12px;text-align:center;font-size:11px;color:var(--text-muted);cursor:pointer;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;font-family:"Segoe UI",system-ui,sans-serif;background:none;border-top:none;border-left:none;border-right:none}
  .fw-fp-tab.active{color:var(--accent-cyan);border-bottom-color:var(--accent-cyan)}
  .fw-fp-tab:hover{color:var(--text-primary)}
  .fw-fp-body{flex:1;overflow-y:auto;padding:12px 16px}
  .fw-fp-bottom{display:flex;border-top:1px solid var(--border);height:200px;flex-shrink:0}
  .fw-fp-visual{flex:1;overflow-y:auto;padding:8px 12px;border-right:1px solid var(--border)}
  .fw-fp-cli{flex:1;overflow-y:auto;padding:8px 12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--accent-green);white-space:pre-wrap;background:rgba(0,0,0,.3)}
  /* === FIREWALL DASHBOARD === */
  .fw-dash-hdr{gap:16px}
  .fw-dash-pills{display:flex;gap:6px}
  .fw-dash-pill{padding:4px 12px;border-radius:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .15s;background:rgba(255,255,255,.06);color:var(--text-muted)}
  .fw-dash-pill.active{border-color:currentColor}
  .fw-dash-pill[data-type="sg"]{color:#ef4444}.fw-dash-pill[data-type="sg"].active{background:rgba(239,68,68,.15)}
  .fw-dash-pill[data-type="subnet-nsg"]{color:#f59e0b}.fw-dash-pill[data-type="subnet-nsg"].active{background:rgba(245,158,11,.15)}
  .fw-dash-pill[data-type="route"]{color:#22d3ee}.fw-dash-pill[data-type="route"].active{background:rgba(34,211,238,.15)}
  .fw-dash-pill[data-type="all"]{color:var(--text-secondary)}.fw-dash-pill[data-type="all"].active{background:rgba(255,255,255,.08)}
  /* fw-dash-toolbar inherits from dash-toolbar */
  .fw-dash-body{flex:1;overflow-y:auto;padding:0}
  .fw-dash table{width:100%;border-collapse:collapse;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px}
  .fw-dash table th{position:sticky;top:0;background:var(--bg-secondary);padding:8px 12px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:2px solid var(--border);user-select:none;white-space:nowrap}
  .fw-dash table td{padding:6px 12px;border-bottom:1px solid rgba(30,45,74,.15);vertical-align:top}
  .fw-dash table tr.fw-row:hover{background:rgba(100,116,139,.06);cursor:pointer}
  .fw-dash table tr.fw-row.has-edits{background:rgba(16,185,129,.05)}
  .fw-dash .fw-type-badge{font-size:10px;font-weight:700;padding:3px 8px;border-radius:3px;text-transform:uppercase;letter-spacing:.5px}
  .fw-dash .fw-type-badge.sg{background:rgba(239,68,68,.15);color:#ef4444}
  .fw-dash .fw-type-badge.subnet-nsg{background:rgba(245,158,11,.15);color:#f59e0b}
  .fw-dash .fw-type-badge.route{background:rgba(34,211,238,.15);color:#22d3ee}
  .fw-dash .fw-edit-badge{font-size:9px;padding:2px 6px;border-radius:3px;background:rgba(16,185,129,.15);color:#10b981;font-weight:600}
  .fw-dash .fw-expand-row td{padding:8px 16px;background:var(--bg-secondary);border-bottom:2px solid var(--border)}
  .fw-dash-footer .fw-edit-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin-left:auto}
  /* Firewall dashboard summary cards */
  .fw-summary-cards{display:flex;gap:10px;padding:12px 16px;flex-wrap:wrap}
  .fw-summary-card{flex:1;min-width:120px;padding:12px 14px;border-radius:8px;border:1px solid var(--border);font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;transition:all .15s;background:var(--bg-secondary)}
  .fw-summary-card:hover{border-color:var(--accent-cyan);background:rgba(34,211,238,.04)}
  .fw-summary-card.active{border-color:var(--accent-cyan);background:rgba(34,211,238,.08)}
  .fw-summary-card .fw-card-count{font-size:22px;font-weight:700;line-height:1.2}
  .fw-summary-card .fw-card-label{font-size:9px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
  .fw-summary-card .fw-card-sub{font-size:9px;color:var(--text-muted);margin-top:4px}
  .fw-summary-card.severity-critical{border-color:rgba(220,38,38,.3)}.fw-summary-card.severity-critical .fw-card-count{color:#dc2626}
  .fw-summary-card.severity-high{border-color:rgba(245,158,11,.3)}.fw-summary-card.severity-high .fw-card-count{color:#f59e0b}
  .fw-summary-card.severity-medium{border-color:rgba(59,130,246,.3)}.fw-summary-card.severity-medium .fw-card-count{color:#3b82f6}
  .fw-summary-card.clean{border-color:rgba(16,185,129,.3)}.fw-summary-card.clean .fw-card-count{color:#10b981}
  /* Firewall sortable table */
  .fw-dash-table{width:100%;border-collapse:collapse;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px}
  .fw-dash-table th{position:sticky;top:0;background:var(--bg-secondary);padding:8px 12px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);cursor:pointer;user-select:none;white-space:nowrap;border-bottom:2px solid var(--border)}
  .fw-dash-table th:hover{color:var(--text-primary)}
  .fw-dash-table th.sort-asc::after{content:' ^';color:var(--accent-cyan)}
  .fw-dash-table th.sort-desc::after{content:' v';color:var(--accent-cyan)}
  .fw-dash-table td{padding:6px 12px;border-bottom:1px solid rgba(30,45,74,.15);vertical-align:middle}
  .fw-dash-table tr:hover{background:rgba(100,116,139,.06)}
  .fw-dash-table tr.has-edits{background:rgba(16,185,129,.04)}
  .fw-dash-table tr.has-findings{border-left:2px solid}
  .fw-dash-table tr.fw-group-header{background:var(--bg-tertiary);border-left:3px solid var(--accent-cyan);cursor:pointer;user-select:none}
  .fw-dash-table tr.fw-group-header td{padding:10px 12px;font-size:12px;color:var(--text-primary);letter-spacing:.3px;border-bottom:1px solid var(--border)}
  .fw-dash-table tr.fw-group-header:hover{background:rgba(103,232,249,.06)}
  .fw-dash-table tr.fw-group-header.collapsed{opacity:.7}
  .fw-group-chevron{display:inline-block;width:16px;font-size:9px;color:var(--text-muted);margin-right:6px;transition:transform .15s}
  .fw-anchor-bar{display:flex;gap:4px;padding:6px 8px;flex-wrap:wrap;border-bottom:1px solid var(--border);background:var(--bg-secondary)}
  .fw-anchor-dot{background:rgba(103,232,249,.08);border:1px solid rgba(103,232,249,.2);color:var(--text-secondary);padding:2px 8px;border-radius:10px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;white-space:nowrap;transition:all .15s}
  .fw-anchor-dot:hover{background:rgba(103,232,249,.15);color:var(--text-primary);border-color:var(--accent-cyan)}
  .fw-anchor-dot.has-findings{border-color:rgba(245,158,11,.4);color:var(--accent-orange)}
  .fw-anchor-dot.collapsed{opacity:.5}
  .fw-link{color:var(--accent-cyan);cursor:pointer;text-decoration:none;border-bottom:1px dashed rgba(103,232,249,.3)}
  .fw-link:hover{border-bottom-style:solid;border-bottom-color:var(--accent-cyan)}
  /* Detail panel compliance section */
  .fw-fp-compliance{border-top:1px solid var(--border);padding:16px 0}
  .fw-fp-finding{padding:10px 12px;margin:6px 0;border-radius:6px;border-left:3px solid;font-size:12px}
  .fw-fp-finding.sev-CRITICAL{border-left-color:#dc2626;background:rgba(220,38,38,.05)}
  .fw-fp-finding.sev-HIGH{border-left-color:#f59e0b;background:rgba(245,158,11,.05)}
  .fw-fp-finding.sev-MEDIUM{border-left-color:#3b82f6;background:rgba(59,130,246,.05)}
  .fw-fp-finding.sev-LOW{border-left-color:#10b981;background:rgba(16,185,129,.05)}
  .fw-fp-finding .fw-finding-ctrl{color:var(--accent-cyan);cursor:pointer;font-weight:600}
  .fw-fp-finding .fw-finding-ctrl:hover{text-decoration:underline}
  .iam-risk-card{display:inline-flex;flex-direction:column;align-items:center;padding:8px 14px;border-radius:6px;border:1px solid var(--border);font-family:"Segoe UI",system-ui,sans-serif;min-width:80px}
  .iam-risk-card .count{font-size:calc(18px * var(--txt-scale,1) * var(--dp-txt-scale,1));font-weight:700}
  .iam-risk-card .label{font-size:calc(9px * var(--txt-scale,1) * var(--dp-txt-scale,1));color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
  .iam-risk-card.critical{background:rgba(220,38,38,.1);border-color:rgba(220,38,38,.3);color:#dc2626}
  .iam-risk-card.warning{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.3);color:#f59e0b}
  .iam-risk-card.info{background:rgba(59,130,246,.1);border-color:rgba(59,130,246,.3);color:#3b82f6}
  .iam-risk-card.clean{background:rgba(16,185,129,.1);border-color:rgba(16,185,129,.3);color:#10b981}
  .iam-dashboard-link{background:rgba(139,92,246,.06);border:1px solid rgba(139,92,246,.2);border-radius:8px;padding:10px 14px;margin:0 0 10px;cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:#a78bfa;display:flex;align-items:center;justify-content:space-between;transition:all .15s}
  .iam-dashboard-link:hover{background:rgba(139,92,246,.12);border-color:rgba(139,92,246,.4)}
  /* region labels on canvas */
  .region-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(10px * var(--txt-scale));font-weight:600;fill:var(--text-muted);letter-spacing:1px;text-transform:uppercase;opacity:.6}
  .copyable{cursor:pointer;position:relative;border-bottom:1px dashed rgba(100,116,139,.4)}
  .copyable:hover{color:var(--accent-cyan);border-bottom-color:var(--accent-cyan)}
  .copy-toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);background:rgba(16,185,129,.9);color:#fff;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:6px 16px;border-radius:5px;z-index:200;pointer-events:none;opacity:0;transition:opacity .2s}
  .copy-toast.show{opacity:1}
  @keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
  .loading-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:rgba(10,14,23,.85);z-index:60;flex-direction:column;gap:12px}

  /* === DESIGN MODE === */
  .design-btn{background:var(--accent-orange);color:#fff;border:none;border-radius:5px;font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;font-weight:600;padding:6px 10px;cursor:pointer;letter-spacing:.5px;transition:background .2s,box-shadow .2s;position:relative}
  .design-btn:hover{background:#e08700;box-shadow:0 0 8px rgba(245,158,11,.4)}
  .design-btn.active{background:#dc2626;box-shadow:0 0 10px rgba(220,38,38,.5)}
  .design-btn .change-badge{position:absolute;top:-5px;right:-5px;background:#dc2626;color:#fff;font-size:7px;min-width:14px;height:14px;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 3px;font-weight:700}
  .design-toolbar{display:flex;gap:6px;padding:6px 8px;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.25);border-radius:5px;margin-bottom:8px;flex-wrap:wrap;align-items:center}
  .design-toolbar button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale,1) * var(--dp-txt-scale,1));padding:3px 8px;cursor:pointer;transition:background .15s}
  .design-toolbar button:hover{background:rgba(245,158,11,.15);border-color:var(--accent-orange)}
  .design-toolbar button:disabled{opacity:.4;cursor:not-allowed}
  .design-form{background:var(--bg-card);border:1px solid var(--border);border-radius:5px;padding:8px;margin:6px 0}
  .design-form label{display:block;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale,1) * var(--dp-txt-scale,1));color:var(--text-muted);margin-bottom:3px;text-transform:uppercase;letter-spacing:.5px}
  .design-form input,.design-form select{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale,1) * var(--dp-txt-scale,1));padding:4px 6px;margin-bottom:6px;box-sizing:border-box}
  .design-form input:focus,.design-form select:focus{outline:none;border-color:var(--accent-orange)}
  .design-form input.invalid{border-color:#dc2626}
  .design-form .form-hint{font-size:calc(7px * var(--txt-scale,1) * var(--dp-txt-scale,1));color:var(--text-muted);margin-bottom:4px}
  .design-form .form-error{font-size:calc(7px * var(--txt-scale,1) * var(--dp-txt-scale,1));color:#dc2626;margin-bottom:4px}
  .design-form .form-actions{display:flex;gap:6px;margin-top:6px}
  .design-form .form-actions button{flex:1;padding:4px 8px;border-radius:4px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(8px * var(--txt-scale,1) * var(--dp-txt-scale,1));cursor:pointer;border:1px solid var(--border)}
  .design-form .btn-confirm{background:var(--accent-orange);color:#fff;border-color:var(--accent-orange)}
  .design-form .btn-confirm:disabled{opacity:.4;cursor:not-allowed}
  .design-form .btn-cancel{background:transparent;color:var(--text-muted)}
  .change-log{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);background:var(--bg-card);border:1px solid var(--border);border-radius:6px;max-width:600px;width:90%;max-height:200px;overflow-y:auto;z-index:45;display:none;font-family:"Segoe UI",system-ui,sans-serif;box-shadow:0 4px 16px rgba(0,0,0,.3)}
  .change-log-header{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg-card);z-index:1}
  .change-log-header span{font-size:9px;font-weight:600;color:var(--accent-orange);text-transform:uppercase;letter-spacing:.5px}
  .change-log-header button{background:transparent;border:none;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;cursor:pointer;padding:2px 6px}
  .change-log-header button:hover{color:#dc2626}
  .change-log-item{display:flex;justify-content:space-between;align-items:center;padding:4px 10px;border-bottom:1px solid rgba(30,45,74,.15);font-size:8px;color:var(--text-secondary)}
  .change-log-item:last-child{border-bottom:none}
  .change-log-item .cl-desc{flex:1}
  .change-log-item .cl-undo{background:transparent;border:1px solid var(--border);border-radius:3px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:7px;padding:1px 6px;cursor:pointer}
  .change-log-item .cl-undo:hover{border-color:#dc2626;color:#dc2626}
  .design-added rect,.design-added circle{stroke:var(--accent-green)!important;stroke-width:2!important;stroke-dasharray:4 2!important}
  .design-modified rect,.design-modified circle{stroke:var(--accent-orange)!important;stroke-width:2!important}
  .design-removed{opacity:.4!important}
  .design-removed rect,.design-removed circle{stroke:#dc2626!important;stroke-dasharray:6 3!important}
  .design-banner{position:absolute;top:0;left:0;right:0;z-index:55;display:none;align-items:center;justify-content:center;gap:16px;padding:6px 16px;background:rgba(245,158,11,.12);border-bottom:1px solid rgba(245,158,11,.35);backdrop-filter:blur(8px);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--accent-orange)}
  .design-banner.visible{display:flex}
  .main:has(.design-banner.visible) .export-bar{top:40px}
  .main.flow-active .export-bar{top:44px}
  .main.diff-active .export-bar{top:44px}
  .main.merge-active .export-bar{top:44px}
  .design-banner .db-title{font-weight:700;letter-spacing:.5px;text-transform:uppercase}
  .design-banner .db-shortcuts{display:flex;gap:10px;color:var(--text-secondary);font-size:9px}
  .design-banner .db-shortcuts kbd{display:inline-block;padding:1px 5px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:3px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:8px;font-weight:600;margin:0 2px}
  .design-banner .db-close{background:none;border:none;color:var(--text-muted);font-size:14px;cursor:pointer;padding:0 4px;line-height:1}
  .design-banner .db-close:hover{color:var(--text-primary)}
  .design-help{position:absolute;bottom:calc(100% + 8px);right:0;width:220px;background:var(--panel-bg);border:1px solid var(--accent-orange);border-radius:6px;padding:10px 12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-secondary);line-height:1.6;display:none;z-index:60;box-shadow:0 4px 16px var(--shadow-color)}
  .design-help.visible{display:block}
  .design-help .dh-title{font-weight:700;color:var(--accent-orange);font-size:10px;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}
  .design-help ul{list-style:none;padding:0;margin:0}
  .design-help li{padding:2px 0;color:var(--text-muted)}
  .design-help li b{color:var(--text-primary);font-weight:500}
  .cl-action-badge{display:inline-block;padding:1px 4px;border-radius:2px;font-size:7px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;margin-right:4px}
  .cl-action-badge.add{background:rgba(16,185,129,.15);color:var(--accent-green)}
  .cl-action-badge.split{background:rgba(139,92,246,.15);color:var(--accent-purple)}
  .cl-action-badge.remove{background:rgba(239,68,68,.15);color:var(--accent-red)}
  .cl-action-badge.modify{background:rgba(245,158,11,.15);color:var(--accent-orange)}

  /* === COMPLIANCE ENGINE === */
  .compliance-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:8px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale,1));font-weight:500;cursor:pointer;transition:border-color .15s,background .15s;border:1px solid var(--border)}
  .compliance-chip.clean{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.3);color:#10b981}
  .compliance-chip.warn{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.3);color:#f59e0b}
  .compliance-chip.critical{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.3);color:#dc2626}
  .compliance-chip:hover{border-color:currentColor;background:rgba(255,255,255,.04)}
  .compliance-panel{padding:8px 0}
  .compliance-group{margin-bottom:10px}
  .compliance-group-header{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(12px * var(--txt-scale,1) * var(--dp-txt-scale,1));font-weight:600;color:var(--text-primary);padding:6px 0;border-bottom:1px solid var(--border);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}
  .finding-row{padding:5px 0;border-bottom:1px solid rgba(30,45,74,.12);cursor:pointer}
  .finding-row:hover{background:rgba(100,116,139,.06)}
  .finding-summary{display:flex;align-items:center;gap:8px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(12px * var(--txt-scale,1) * var(--dp-txt-scale,1))}
  .sev-badge{font-size:calc(10px * var(--txt-scale,1) * var(--dp-txt-scale,1));font-weight:700;padding:2px 7px;border-radius:3px;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}
  .sev-CRITICAL{background:rgba(239,68,68,.15);color:#ef4444}
  .sev-HIGH{background:rgba(249,115,22,.15);color:#f97316}
  .sev-MEDIUM{background:rgba(234,179,8,.12);color:#eab308}
  .sev-LOW{background:rgba(59,130,246,.12);color:#3b82f6}
  .finding-detail{display:none;padding:6px 0 6px 20px;font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale,1) * var(--dp-txt-scale,1));color:var(--text-muted);line-height:1.6}
  .finding-detail .fd-label{color:var(--text-secondary);font-weight:600;text-transform:uppercase;font-size:calc(9px * var(--txt-scale,1) * var(--dp-txt-scale,1));letter-spacing:.5px}
  .finding-row.expanded .finding-detail{display:block}
  .compliance-badge{position:absolute;top:-4px;right:-4px;width:10px;height:10px;border-radius:50%;border:1.5px solid var(--bg-card);z-index:2}
  .compliance-export-bar{display:flex;gap:6px;padding:6px 0;border-top:1px solid var(--border);margin-top:8px;flex-wrap:wrap}
  .compliance-export-bar button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale,1) * var(--dp-txt-scale,1));padding:5px 10px;cursor:pointer}
  .compliance-export-bar button:hover{background:rgba(96,165,250,.1);border-color:var(--accent-cyan)}
  .compliance-filter{display:flex;gap:4px;margin-bottom:8px;flex-wrap:wrap}
  .compliance-filter button{background:transparent;border:1px solid var(--border);border-radius:10px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(11px * var(--txt-scale,1) * var(--dp-txt-scale,1));padding:4px 12px;cursor:pointer}
  .compliance-filter button.active{background:rgba(96,165,250,.15);border-color:var(--accent-cyan);color:var(--accent-cyan)}
  /* Gateway label styles */
  .gw-id{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(7px * var(--txt-scale));fill:var(--text-muted);pointer-events:none;opacity:.6}
  .gw-name{font-family:"Segoe UI",system-ui,sans-serif;font-size:calc(9px * var(--txt-scale));fill:var(--text-primary);font-weight:500;pointer-events:none}
  /* Design highlight pulse */
  @keyframes designHlPulse{0%{opacity:.8;stroke-width:3}50%{opacity:.3;stroke-width:1}100%{opacity:.8;stroke-width:3}}
  /* Full-screen compliance dashboard */
  .comp-dash-hdr{display:flex;align-items:center;gap:16px;padding:12px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}
  .comp-dash-hdr h2{font-family:"Segoe UI",system-ui,sans-serif;font-size:16px;color:var(--accent-cyan);margin:0}
  .comp-dash-stats{display:flex;gap:8px;padding:10px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap;align-items:center}
  .comp-sev-pill{padding:4px 12px;border-radius:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .15s}
  .comp-sev-pill.active{border-color:currentColor}
  .comp-sev-pill[data-sev="CRITICAL"]{background:rgba(220,38,38,.15);color:#dc2626}
  .comp-sev-pill[data-sev="HIGH"]{background:rgba(245,158,11,.15);color:#f59e0b}
  .comp-sev-pill[data-sev="MEDIUM"]{background:rgba(96,165,250,.15);color:#60a5fa}
  .comp-sev-pill[data-sev="LOW"]{background:rgba(100,116,139,.15);color:#94a3b8}
  .comp-sev-pill[data-sev="ALL"]{background:rgba(255,255,255,.08);color:var(--text-secondary)}
  .comp-toolbar{display:flex;gap:8px;padding:8px 20px;background:var(--bg-tertiary);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap;align-items:center}
  .comp-toolbar input{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 10px;width:220px}
  .comp-toolbar select{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 8px;cursor:pointer}
  .comp-toolbar label{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
  .comp-body{flex:1;overflow-y:auto;padding:0}
  .comp-table{width:100%;border-collapse:collapse;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px}
  .comp-table th{position:sticky;top:0;background:var(--bg-secondary);padding:8px 12px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:2px solid var(--border);cursor:pointer;user-select:none;white-space:nowrap}
  .comp-table th:hover{color:var(--accent-cyan)}
  .comp-table td{padding:6px 12px;border-bottom:1px solid rgba(30,45,74,.15);vertical-align:top}
  .comp-table tr:hover{background:rgba(100,116,139,.06)}
  .comp-table tr.muted{opacity:.35}
  .comp-table tr.muted:hover{opacity:.6}
  .comp-mute-btn{background:none;border:1px solid var(--border);border-radius:3px;color:var(--text-muted);font-size:10px;padding:2px 8px;cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif;white-space:nowrap;min-width:40px;text-align:center}
  .comp-mute-btn:hover{border-color:var(--accent-orange);color:var(--accent-orange)}
  .comp-mute-btn.muted{border-color:var(--accent-orange);color:var(--accent-orange);background:rgba(245,158,11,.1)}
  .comp-remediation{color:var(--text-muted);font-size:10px;margin-top:3px;line-height:1.4}
  .comp-dash-footer{display:flex;gap:8px;padding:8px 20px;background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0;align-items:center;flex-wrap:wrap}
  .comp-dash-footer button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 12px;cursor:pointer}
  .comp-dash-footer button:hover{background:rgba(96,165,250,.1);border-color:var(--accent-cyan)}
  .comp-dash-footer .muted-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin-left:auto}
  /* === BUDR DASHBOARD === */
  .budr-hdr{display:flex;align-items:center;gap:16px;padding:12px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}
  .budr-hdr h2{font-family:"Segoe UI",system-ui,sans-serif;font-size:16px;color:#10b981;margin:0}
  .budr-pills{display:flex;gap:6px}
  .budr-pill{padding:4px 12px;border-radius:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .15s}
  .budr-pill.active{border-color:currentColor}
  .budr-pill[data-tier="all"]{background:rgba(255,255,255,.08);color:var(--text-secondary)}
  .budr-pill[data-tier="protected"]{background:rgba(16,185,129,.12);color:#10b981}
  .budr-pill[data-tier="partial"]{background:rgba(245,158,11,.12);color:#f59e0b}
  .budr-pill[data-tier="at_risk"]{background:rgba(239,68,68,.12);color:#ef4444}
  .budr-body{flex:1;overflow-y:auto;padding:0}
  .budr-summary{display:flex;gap:12px;padding:16px 20px;flex-wrap:wrap}
  .budr-card{flex:1;min-width:180px;padding:18px;border-radius:10px;border:1px solid;display:flex;flex-direction:column;gap:6px;transition:all .2s;cursor:pointer}
  .budr-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.3)}
  .budr-card .bc-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:36px;font-weight:700;line-height:1}
  .budr-card .bc-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
  .budr-card .bc-rto{font-size:11px;opacity:.7;font-family:"Segoe UI",system-ui,sans-serif}
  .budr-card.protected{background:rgba(16,185,129,.06);border-color:rgba(16,185,129,.3);color:#10b981}
  .budr-card.partial{background:rgba(245,158,11,.06);border-color:rgba(245,158,11,.3);color:#f59e0b}
  .budr-card.at_risk{background:rgba(239,68,68,.06);border-color:rgba(239,68,68,.3);color:#ef4444}
  .budr-section{padding:0 20px 16px}
  .budr-section-hdr{display:flex;align-items:center;gap:10px;padding:12px 0 8px;border-bottom:1px solid var(--border);margin-bottom:10px;cursor:pointer;user-select:none}
  .budr-section-hdr h3{font-family:"Segoe UI",system-ui,sans-serif;font-size:15px;font-weight:700;margin:0;letter-spacing:.3px}
  .budr-section-hdr .bs-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;opacity:.6}
  .budr-section-hdr .bs-chevron{font-size:12px;opacity:.4;transition:transform .2s}
  .budr-section-hdr.collapsed .bs-chevron{transform:rotate(-90deg)}
  .budr-res{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;margin-bottom:8px;overflow:hidden;transition:border-color .2s}
  .budr-res:hover{border-color:rgba(255,255,255,.12)}
  .budr-res-hdr{display:flex;align-items:center;gap:8px;padding:10px 14px;cursor:pointer;user-select:none}
  .budr-res-hdr .br-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
  .budr-res-hdr .br-dot.protected{background:#10b981}
  .budr-res-hdr .br-dot.partial{background:#f59e0b}
  .budr-res-hdr .br-dot.at_risk{background:#ef4444}
  .budr-res-hdr .br-type{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-muted);background:rgba(255,255,255,.06);padding:2px 6px;border-radius:3px;text-transform:uppercase;flex-shrink:0}
  .budr-res-hdr .br-name{font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;color:var(--text-primary);font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .budr-res-hdr .br-rto{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted)}
  .budr-res-body{display:none;border-top:1px solid var(--border);padding:10px 14px}
  .budr-res.expanded .budr-res-body{display:block}
  .budr-signal{display:flex;align-items:center;gap:8px;padding:4px 0;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--text-secondary)}
  .budr-signal .sig-icon{font-size:12px;width:16px;text-align:center}
  .budr-signal .sig-icon.good{color:#10b981}
  .budr-signal .sig-icon.bad{color:#ef4444}
  .budr-signal .sig-icon.warn{color:#f59e0b}
  .budr-signals{display:flex;flex-wrap:wrap;gap:4px;padding:6px 0}
  .budr-sig-badge{display:inline-block;padding:1px 6px;border-radius:3px;font-size:8px;font-family:"Segoe UI",system-ui,sans-serif;letter-spacing:.3px}
  .budr-sig-badge.good{background:rgba(16,185,129,.15);color:#10b981;border:1px solid rgba(16,185,129,.3)}
  .budr-sig-badge.bad{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3)}
  .budr-sig-badge.warn{background:rgba(245,158,11,.15);color:#f59e0b;border:1px solid rgba(245,158,11,.3)}
  .budr-findings{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.04)}
  .budr-finding{display:flex;gap:8px;padding:4px 0;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif}
  .budr-finding .bf-sev{font-size:9px;font-weight:700;padding:1px 5px;border-radius:3px;flex-shrink:0}
  .budr-finding .bf-sev.CRITICAL{background:rgba(239,68,68,.15);color:#ef4444}
  .budr-finding .bf-sev.HIGH{background:rgba(249,115,22,.15);color:#f97316}
  .budr-finding .bf-sev.MEDIUM{background:rgba(234,179,8,.12);color:#eab308}
  .budr-finding .bf-sev.LOW{background:rgba(59,130,246,.12);color:#3b82f6}
  .budr-finding .bf-msg{color:var(--text-secondary);flex:1}
  .budr-finding .bf-fix{color:var(--text-muted);font-size:10px;font-style:italic}
  .budr-footer{display:flex;gap:8px;padding:8px 20px;background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0;align-items:center}
  .budr-footer button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 12px;cursor:pointer}
  .budr-footer button:hover{background:rgba(16,185,129,.1);border-color:#10b981}
  #budrExportXLSX{background:rgba(16,185,129,.15);border-color:#10b981;font-weight:600}

  /* === GOVERNANCE DASHBOARD === */
  .gov-hdr{display:flex;align-items:center;gap:16px;padding:12px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}
  .gov-hdr h2{color:var(--accent-purple)}
  .gov-body{flex:1;overflow-y:auto;padding:20px;background:var(--bg-primary)}
  .gov-footer{display:flex;gap:8px;padding:8px 20px;background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0;align-items:center;flex-wrap:wrap}
  .gov-footer button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 12px;cursor:pointer;transition:all .15s}
  .gov-footer button:disabled{opacity:.3;cursor:default}
  .gov-tier-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:20px}
  .gov-tier-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:16px;text-align:center;cursor:pointer;transition:all .15s}
  .gov-tier-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.3)}
  .gov-tier-card h3{margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif}
  .gov-tier-count{font-size:32px;font-weight:700;margin-bottom:4px;font-family:"Segoe UI",system-ui,sans-serif}
  .gov-tier-meta{font-size:10px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif}
  .gov-table{width:100%;border-collapse:collapse;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px}
  .gov-table thead{position:sticky;top:0;z-index:2}
  .gov-table th{padding:8px 12px;text-align:left;font-weight:600;color:var(--text-muted);border-bottom:2px solid var(--border);cursor:pointer;user-select:none;text-transform:uppercase;font-size:10px;letter-spacing:.5px;background:var(--bg-primary)}
  .gov-table th:hover{color:var(--text-primary);background:rgba(255,255,255,.02)}
  .gov-table th.sort-asc::after{content:' ▲';font-size:8px}
  .gov-table th.sort-desc::after{content:' ▼';font-size:8px}
  .gov-table td{padding:8px 12px;border-bottom:1px solid var(--border);color:var(--text-secondary)}
  .gov-table tbody tr:hover{background:rgba(255,255,255,.02)}
  .gov-table tbody tr.expanded{background:rgba(139,92,246,.05)}
  .gov-tier-badge{padding:3px 8px;border-radius:4px;font-size:10px;font-weight:600;text-transform:uppercase;display:inline-block}
  .gov-tier-badge.critical{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3)}
  .gov-tier-badge.high{background:rgba(245,158,11,.15);color:#f59e0b;border:1px solid rgba(245,158,11,.3)}
  .gov-tier-badge.medium{background:rgba(34,211,238,.15);color:#22d3ee;border:1px solid rgba(34,211,238,.3)}
  .gov-tier-badge.low{background:rgba(100,116,139,.15);color:#64748b;border:1px solid rgba(100,116,139,.3)}
  .gov-override-select{background:var(--bg-input);border:1px solid var(--border);border-radius:3px;padding:2px 6px;font-size:9px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer}
  .gov-override-select:hover{border-color:#8b5cf6}
  .gov-iam-expand{display:none;padding:12px 16px;background:var(--bg-tertiary);border-left:2px solid #8b5cf6}
  .gov-iam-expand.open{display:table-cell}
  .gov-admin-badge{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3);padding:2px 6px;border-radius:3px;font-size:9px;font-weight:600;text-transform:uppercase}
  .gov-finding-badge{background:rgba(245,158,11,.15);color:#f59e0b;border:1px solid rgba(245,158,11,.3);padding:2px 6px;border-radius:3px;font-size:9px;font-weight:600}
  .gov-rules-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:600;background:rgba(11,17,32,.92);display:flex;align-items:stretch;justify-content:center;padding:24px}
  .gov-rules-panel{background:var(--bg-primary);border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;width:100%;max-width:960px;overflow:hidden}
  .gov-rules-hdr{display:flex;align-items:center;gap:12px;padding:14px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}
  .gov-rules-hdr h3{font-family:"Segoe UI",system-ui,sans-serif;font-size:14px;color:#8b5cf6;margin:0;flex:1}
  .gov-rules-hdr-actions{display:flex;gap:6px}
  .gov-rules-hdr-actions button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:4px 10px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-muted);cursor:pointer;transition:all .15s}
  .gov-rules-hdr-actions button:hover{border-color:#8b5cf6;color:var(--text-primary)}
  .gov-rules-content{display:flex;flex:1;overflow:hidden}
  .gov-rules-left{flex:1;overflow-y:auto;padding:16px 20px;border-right:1px solid var(--border)}
  .gov-rules-right{width:320px;flex-shrink:0;overflow-y:auto;padding:16px;background:var(--bg-secondary)}
  .gov-rules-right h4{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin:0 0 10px}
  .gov-rules-foot{display:flex;gap:8px;padding:10px 20px;background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0;align-items:center}
  .gov-rules-foot button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;padding:5px 12px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-primary);cursor:pointer;transition:all .15s}
  .gov-rules-foot button:hover{border-color:#8b5cf6;background:rgba(139,92,246,.08)}
  .gov-rules-foot .gov-rules-apply{margin-left:auto;background:#8b5cf6;border-color:#8b5cf6;color:#fff;font-weight:600;padding:6px 18px}
  .gov-rules-foot .gov-rules-apply:hover{background:#7c3aed;border-color:#7c3aed}
  .gov-rule-group{margin-bottom:16px}
  .gov-rule-group-hdr{display:flex;align-items:center;gap:8px;padding:6px 0;margin-bottom:6px;border-bottom:1px solid rgba(139,92,246,.15);cursor:pointer;user-select:none}
  .gov-rule-group-hdr:hover .gov-rule-group-label{color:#8b5cf6}
  .gov-rule-group-arrow{font-size:8px;color:var(--text-muted);transition:transform .15s;width:12px;text-align:center}
  .gov-rule-group-arrow.collapsed{transform:rotate(-90deg)}
  .gov-rule-group-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;transition:color .15s}
  .gov-rule-group-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-muted);margin-left:auto;background:var(--bg-input);padding:1px 6px;border-radius:8px}
  .gov-rule-group-body{overflow:hidden;transition:max-height .2s ease}
  .gov-rule-group-body.collapsed{max-height:0 !important;overflow:hidden}
  .gov-rule-row{display:flex;gap:6px;align-items:center;padding:5px 0 5px 4px;border-bottom:1px solid var(--hover-bg-subtle);font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;transition:background .1s;border-radius:3px}
  .gov-rule-row:hover{background:rgba(255,255,255,.02)}
  .gov-rule-row.disabled{opacity:.35}
  .gov-rule-row.invalid{border-left:2px solid #ef4444}
  .gov-rule-drag{cursor:grab;color:var(--text-muted);font-size:10px;width:16px;text-align:center;flex-shrink:0;user-select:none}
  .gov-rule-drag:active{cursor:grabbing}
  .gov-rule-toggle{width:28px;height:16px;border-radius:8px;background:var(--bg-input);border:1px solid var(--border);cursor:pointer;position:relative;flex-shrink:0;transition:all .15s}
  .gov-rule-toggle.on{background:rgba(139,92,246,.3);border-color:#8b5cf6}
  .gov-rule-toggle::after{content:'';position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:var(--text-muted);transition:all .15s}
  .gov-rule-toggle.on::after{left:14px;background:#8b5cf6}
  .gov-rule-row input,.gov-rule-row select{background:var(--bg-input);border:1px solid var(--border);border-radius:3px;padding:3px 6px;font-size:10px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif}
  .gov-rule-row input{flex:1;min-width:0}
  .gov-rule-row input.pattern{flex:2}
  .gov-rule-row input.weight{width:44px;flex:none;text-align:center}
  .gov-scope-sel{flex:none;width:72px;font-size:9px!important;color:var(--text-muted)!important;background:rgba(139,92,246,.06)!important;border-color:rgba(139,92,246,.2)!important}
  .gov-rule-row input.invalid-pattern{border-color:#ef4444;background:rgba(239,68,68,.05)}
  .gov-rule-match-ct{font-size:8px;color:var(--text-muted);background:var(--bg-input);padding:1px 5px;border-radius:8px;flex-shrink:0;min-width:20px;text-align:center}
  .gov-rule-match-ct.has-matches{color:#10b981;background:rgba(16,185,129,.1)}
  .gov-rule-del{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:12px;flex-shrink:0;padding:2px 4px;border-radius:3px;transition:all .1s}
  .gov-rule-del:hover{color:#ef4444;background:rgba(239,68,68,.1)}
  .gov-preview-card{background:var(--bg-input);border:1px solid var(--border);border-radius:6px;padding:10px;margin-bottom:8px}
  .gov-preview-card h5{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin:0 0 8px;text-transform:uppercase;letter-spacing:.3px}
  .gov-preview-bars{display:flex;flex-direction:column;gap:4px}
  .gov-preview-bar{display:flex;align-items:center;gap:6px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .gov-preview-bar-label{width:56px;color:var(--text-muted);flex-shrink:0}
  .gov-preview-bar-track{flex:1;height:14px;background:var(--hover-bg-subtle);border-radius:3px;overflow:hidden;position:relative}
  .gov-preview-bar-fill{height:100%;border-radius:3px;transition:width .3s ease}
  .gov-preview-bar-ct{font-size:9px;color:var(--text-secondary);width:30px;text-align:right;flex-shrink:0}
  .gov-preview-sample{margin-top:8px;max-height:180px;overflow-y:auto}
  .gov-preview-sample-row{display:flex;align-items:center;gap:6px;padding:3px 0;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;border-bottom:1px solid rgba(255,255,255,.02)}
  .gov-preview-sample-row .name{flex:1;color:var(--accent-cyan);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gov-preview-sample-row .type{color:var(--text-muted);width:48px;flex-shrink:0}
  .gov-preview-delta{display:flex;align-items:center;gap:6px;padding:8px 10px;background:var(--bg-input);border:1px solid var(--border);border-radius:6px;margin-top:8px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .gov-preview-delta .up{color:#10b981}
  .gov-preview-delta .down{color:#ef4444}
  .gov-preview-delta .same{color:var(--text-muted)}
  .gov-tag-discovery{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)}
  .gov-tag-chips{display:flex;flex-wrap:wrap;gap:4px}
  .gov-tag-chip{background:var(--bg-input);border:1px solid var(--border);border-radius:12px;padding:2px 8px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-secondary);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:4px}
  .gov-tag-chip:hover{border-color:#8b5cf6;color:var(--text-primary)}
  .gov-tag-chip.active{background:rgba(139,92,246,.12);border-color:#8b5cf6;color:#8b5cf6}
  .gov-tag-chip .ct{font-size:7px;background:rgba(255,255,255,.08);padding:0 4px;border-radius:6px;color:var(--text-muted)}

  /* === REPORT BUILDER === */
  .rpt-hdr{display:flex;align-items:center;gap:16px;padding:12px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}
  .rpt-hdr h2{font-family:"Segoe UI",system-ui,sans-serif;font-size:16px;color:#f59e0b;margin:0}
  .rpt-main{flex:1;display:flex;overflow:hidden}
  .rpt-picker{width:320px;border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto}
  .rpt-presets{display:flex;gap:6px;padding:12px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap}
  .rpt-preset{padding:4px 12px;border-radius:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text-secondary);transition:all .15s}
  .rpt-preset:hover{border-color:var(--accent-cyan);color:var(--text-primary)}
  .rpt-preset.active{background:rgba(34,211,238,.12);border-color:var(--accent-cyan);color:var(--accent-cyan)}
  .rpt-meta{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:8px}
  .rpt-meta label{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
  .rpt-meta input{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;padding:6px 10px}
  .rpt-logo-upload{display:flex;align-items:center;gap:8px}
  .rpt-logo-btn,.rpt-logo-clear{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:6px 12px;cursor:pointer;transition:all .15s}
  .rpt-logo-btn:hover,.rpt-logo-clear:hover{border-color:var(--accent-cyan);background:var(--bg-secondary)}
  .rpt-logo-preview{width:40px;height:40px;border:1px solid var(--border);border-radius:4px;background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;overflow:hidden}
  .rpt-logo-preview img{max-width:100%;max-height:100%;object-fit:contain}
  .rpt-modules{flex:1;overflow-y:auto;padding:8px}
  .rpt-mod-card{display:flex;align-items:center;gap:8px;padding:10px 12px;margin-bottom:4px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;cursor:grab;transition:all .15s;user-select:none}
  .rpt-mod-card:hover{border-color:rgba(255,255,255,.12)}
  .rpt-mod-card.dragging{opacity:.5;border-color:var(--accent-cyan)}
  .rpt-mod-card.drag-over{border-top:2px solid var(--accent-cyan)}
  .rpt-mod-card.disabled{opacity:.35;cursor:not-allowed}
  .rpt-mod-card .rm-grip{color:var(--text-muted);font-size:12px;cursor:grab;flex-shrink:0}
  .rpt-mod-card .rm-check{flex-shrink:0}
  .rpt-mod-card .rm-info{flex:1;min-width:0}
  .rpt-mod-card .rm-name{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;color:var(--text-primary);font-weight:600}
  .rpt-mod-card .rm-desc{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin-top:2px}
  .rpt-preview{flex:1;overflow-y:auto;background:var(--bg-tertiary);padding:20px}
  .rpt-preview-frame{max-width:900px;margin:0 auto;background:#0f172a;border:1px solid var(--border);border-radius:8px;overflow:hidden;min-height:400px}
  .rpt-preview-content{padding:30px}
  .rpt-footer{justify-content:flex-end}
  .rpt-generate{background:rgba(245,158,11,.15)!important;border-color:#f59e0b!important;font-weight:600}
  @media(max-width:768px){.udash-body.rpt-layout{flex-direction:column}.rpt-picker{width:100%;border-right:none;border-bottom:1px solid var(--border);max-height:55vh}.rpt-modules{min-height:180px}.rpt-preview{min-height:40vh}}

  /* === ANNOTATIONS === */
  .note-badge{cursor:pointer;pointer-events:all}
  .note-badge circle{fill:var(--accent-orange);stroke:var(--shadow-color);stroke-width:1}
  .note-badge text{fill:#000;font-size:7px;font-weight:700;font-family:"Segoe UI",system-ui,sans-serif;pointer-events:none}
  .note-badge.cat-owner circle{fill:#3b82f6}
  .note-badge.cat-status circle{fill:#10b981}
  .note-badge.cat-incident circle{fill:#ef4444}
  .note-badge.cat-todo circle{fill:#f59e0b}
  .note-badge.cat-info circle{fill:#06b6d4}
  .note-badge.cat-warning circle{fill:#f97316}
  /* Compliance badges on map nodes */
  .comp-badge{cursor:pointer;pointer-events:all}
  .comp-badge circle{stroke:var(--shadow-heavy);stroke-width:1}
  .comp-badge text{fill:#fff;font-size:6px;font-weight:700;font-family:"Segoe UI",system-ui,sans-serif;pointer-events:none}
  .comp-badge.sev-CRITICAL circle{fill:#ef4444}
  .comp-badge.sev-HIGH circle{fill:#f97316}
  .comp-badge.sev-MEDIUM circle{fill:#eab308}
  .comp-badge.sev-LOW circle{fill:#3b82f6}
  /* Compliance column in firewall dashboard */
  .fw-comp-badge{display:inline-block;padding:1px 5px;border-radius:3px;font-size:8px;font-weight:600;font-family:"Segoe UI",system-ui,sans-serif;margin-left:4px}
  .fw-comp-badge.sev-CRITICAL{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3)}
  .fw-comp-badge.sev-HIGH{background:rgba(249,115,22,.15);color:#f97316;border:1px solid rgba(249,115,22,.3)}
  .fw-comp-badge.sev-MEDIUM{background:rgba(234,179,8,.12);color:#eab308;border:1px solid rgba(234,179,8,.25)}
  .fw-comp-badge.sev-LOW{background:rgba(59,130,246,.12);color:#3b82f6;border:1px solid rgba(59,130,246,.25)}
  .fw-findings-section{margin-top:8px;padding:8px 10px;background:rgba(239,68,68,.04);border:1px solid rgba(239,68,68,.12);border-radius:6px}
  .fw-findings-section .fw-finding-item{padding:4px 0;border-bottom:1px solid rgba(255,255,255,.04);font-size:10px;color:var(--text-secondary);display:flex;gap:6px;align-items:baseline}
  .fw-findings-section .fw-finding-item:last-child{border-bottom:none}
  .fw-findings-section .fw-finding-ctrl{color:var(--accent-cyan);font-size:9px;min-width:80px}
  .fw-findings-section .fw-finding-msg{flex:1}
  .fw-findings-section .fw-finding-rem{color:var(--text-muted);font-size:9px;font-style:italic}
  /* Jump-to-resource button in compliance dashboard */
  .comp-jump-btn{background:none;border:1px solid var(--border);border-radius:3px;color:var(--accent-cyan);font-size:8px;padding:1px 6px;cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif;margin-left:4px;transition:all .15s}
  .comp-jump-btn:hover{background:rgba(34,211,238,.1);border-color:var(--accent-cyan)}
  /* Action Plan view */
  .comp-view-toggle{display:flex;background:rgba(255,255,255,.04);border-radius:6px;padding:2px;gap:1px}
  .comp-view-btn{background:none;border:none;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:4px 12px;border-radius:4px;cursor:pointer;transition:all .15s;text-transform:uppercase;letter-spacing:.5px}
  .comp-view-btn.active{background:rgba(34,211,238,.12);color:var(--accent-cyan)}
  .comp-view-btn:hover:not(.active){color:var(--text-secondary)}
  .comp-action-summary{display:flex;gap:12px;padding:16px 20px;flex-wrap:wrap}
  .comp-action-card{flex:1;min-width:160px;padding:16px;border-radius:10px;border:1px solid;display:flex;flex-direction:column;gap:4px;transition:all .2s}
  .comp-action-card:hover{transform:translateY(-1px)}
  .comp-action-card .ac-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:32px;font-weight:700;line-height:1}
  .comp-action-card .ac-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
  .comp-action-card .ac-effort{font-size:12px;opacity:.7;font-family:"Segoe UI",system-ui,sans-serif}
  .comp-action-card .ac-resources{font-size:11px;opacity:.5;font-family:"Segoe UI",system-ui,sans-serif;margin-top:2px}
  .comp-tier-section{padding:0 20px 16px}
  .comp-tier-header{display:flex;align-items:center;gap:10px;padding:12px 0 8px;border-bottom:1px solid var(--border);margin-bottom:10px;cursor:pointer;user-select:none}
  .comp-tier-header h3{font-family:"Segoe UI",system-ui,sans-serif;font-size:15px;font-weight:700;margin:0;letter-spacing:.3px}
  .comp-tier-header .tier-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;opacity:.6}
  .comp-tier-header .tier-effort{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;opacity:.5;margin-left:auto}
  .comp-tier-header .tier-chevron{font-size:12px;opacity:.4;transition:transform .2s}
  .comp-tier-header.collapsed .tier-chevron{transform:rotate(-90deg)}
  .comp-resource-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;margin-bottom:8px;overflow:hidden;transition:border-color .2s}
  .comp-resource-card:hover{border-color:rgba(255,255,255,.12)}
  .comp-rc-header{display:flex;align-items:center;gap:8px;padding:10px 14px;cursor:pointer;user-select:none}
  .comp-rc-header .rc-sev{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}
  .comp-rc-header .rc-name{font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;color:var(--text-primary);font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .comp-rc-header .rc-count{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--text-muted);background:rgba(255,255,255,.06);padding:2px 6px;border-radius:3px}
  .comp-rc-header .rc-jump{background:none;border:1px solid var(--border);border-radius:3px;color:var(--accent-cyan);font-size:10px;padding:2px 8px;cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif;transition:all .15s;flex-shrink:0;min-width:40px;text-align:center}
  .comp-rc-header .rc-jump:hover{background:rgba(34,211,238,.1);border-color:var(--accent-cyan)}
  .comp-rc-body{display:none;border-top:1px solid var(--border)}
  .comp-resource-card.expanded .comp-rc-body{display:block}
  .comp-finding-row{display:grid;grid-template-columns:68px 150px 1fr auto auto;gap:6px 8px;padding:8px 14px;border-bottom:1px solid var(--hover-bg-subtle);font-size:12px;align-items:baseline}
  .comp-finding-row:last-child{border-bottom:none}
  .comp-finding-row .fr-sev{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;font-weight:700;padding:2px 6px;border-radius:3px;text-transform:uppercase;text-align:center;white-space:nowrap}
  .comp-finding-row .fr-sev.CRITICAL{background:rgba(239,68,68,.15);color:#ef4444}
  .comp-finding-row .fr-sev.HIGH{background:rgba(249,115,22,.15);color:#f97316}
  .comp-finding-row .fr-sev.MEDIUM{background:rgba(234,179,8,.12);color:#eab308}
  .comp-finding-row .fr-sev.LOW{background:rgba(59,130,246,.12);color:#3b82f6}
  .comp-finding-row .fr-control{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--accent-cyan);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .comp-finding-row .fr-msg{color:var(--text-secondary);line-height:1.4;min-width:0}
  .comp-finding-row .fr-effort{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:2px 6px;border-radius:3px;white-space:nowrap}
  .comp-finding-row .fr-effort.low{background:rgba(34,197,94,.1);color:#22c55e;border:1px solid rgba(34,197,94,.2)}
  .comp-finding-row .fr-effort.med{background:rgba(245,158,11,.1);color:#f59e0b;border:1px solid rgba(245,158,11,.2)}
  .comp-finding-row .fr-effort.high{background:rgba(239,68,68,.1);color:#ef4444;border:1px solid rgba(239,68,68,.2)}
  .comp-finding-row .fr-actions{display:flex;gap:4px}
  .comp-finding-row .fr-remediation{color:var(--text-muted);font-size:11px;margin-top:3px;line-height:1.4}
  .comp-no-findings{text-align:center;padding:40px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:12px}
  .notes-panel{position:fixed;top:0;right:0;width:420px;height:100%;background:var(--panel-bg);border-left:1px solid var(--border);backdrop-filter:blur(16px);z-index:60;display:none;flex-direction:column;box-shadow:-4px 0 24px var(--shadow-color)}
  .notes-panel.open{display:flex}
  .notes-panel-hdr{padding:14px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
  .notes-panel-hdr h3{color:var(--accent-orange);font-size:14px;margin:0;font-family:"Segoe UI",system-ui,sans-serif}
  .notes-panel-body{flex:1;overflow-y:auto;padding:8px}
  .note-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:8px;position:relative}
  .note-card:hover{border-color:var(--accent-cyan)}
  .note-card-hdr{display:flex;align-items:center;gap:6px;margin-bottom:6px;padding-right:110px}
  .note-cat-badge{font-size:9px;padding:2px 6px;border-radius:4px;font-weight:600;font-family:"Segoe UI",system-ui,sans-serif;text-transform:uppercase}
  .note-cat-badge.cat-owner{background:rgba(59,130,246,.2);color:#60a5fa}
  .note-cat-badge.cat-status{background:rgba(16,185,129,.2);color:#34d399}
  .note-cat-badge.cat-incident{background:rgba(239,68,68,.2);color:#f87171}
  .note-cat-badge.cat-todo{background:rgba(245,158,11,.2);color:#fbbf24}
  .note-cat-badge.cat-info{background:rgba(6,182,212,.2);color:#22d3ee}
  .note-cat-badge.cat-warning{background:rgba(249,115,22,.2);color:#fb923c}
  .note-resource{font-size:10px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .note-text{font-size:12px;color:var(--text-primary);line-height:1.5;font-family:"Segoe UI",system-ui,sans-serif}
  .note-meta{font-size:9px;color:var(--text-muted);margin-top:6px;display:flex;align-items:center;gap:8px}
  .note-actions{position:absolute;top:8px;right:8px;display:flex;gap:4px}
  .note-actions button{background:none;border:1px solid var(--border);color:var(--text-muted);font-size:9px;padding:2px 6px;border-radius:4px;cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif}
  .note-actions button:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}
  .note-form{background:var(--bg-secondary);border:1px solid var(--accent-orange);border-radius:8px;padding:12px;margin-bottom:8px}
  .note-form textarea{width:100%;min-height:60px;background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);font-size:12px;padding:8px;border-radius:4px;resize:vertical;font-family:"Segoe UI",system-ui,sans-serif}
  .note-form select,.note-form input{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);font-size:11px;padding:4px 8px;border-radius:4px;font-family:"Segoe UI",system-ui,sans-serif}
  .note-form-row{display:flex;gap:8px;margin-top:8px;align-items:center}
  .note-form .btn-save{background:var(--accent-orange);color:#000;border:none;padding:4px 12px;border-radius:4px;cursor:pointer;font-size:11px;font-weight:600;font-family:"Segoe UI",system-ui,sans-serif}
  .note-form .btn-cancel{background:none;border:1px solid var(--border);color:var(--text-muted);padding:4px 12px;border-radius:4px;cursor:pointer;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif}
  .note-orphaned{opacity:.5;border-left:3px solid var(--accent-orange)}
  .notes-filter{padding:8px 16px;border-bottom:1px solid var(--border);display:flex;gap:8px;align-items:center}
  .notes-filter select,.notes-filter input{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);font-size:10px;padding:3px 6px;border-radius:4px;font-family:"Segoe UI",system-ui,sans-serif}
  /* === DEPENDENCY GRAPH === */
  .dep-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.85);z-index:80;display:none;flex-direction:column}
  .dep-overlay.open{display:flex}
  .dep-hdr{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
  .dep-hdr h3{color:var(--accent-cyan);font-size:14px;margin:0;font-family:"Segoe UI",system-ui,sans-serif}
  .dep-body{flex:1;overflow-y:auto;padding:16px 20px}
  .dep-summary{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}
  .dep-stat{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:10px 16px;min-width:120px}
  .dep-stat b{display:block;font-size:20px;font-family:"Segoe UI",system-ui,sans-serif}
  .dep-stat span{font-size:10px;color:var(--text-muted)}
  .dep-stat.dep-hard b{color:#ef4444}
  .dep-stat.dep-soft b{color:#f59e0b}
  .dep-stat.dep-config b{color:#3b82f6}
  .dep-tree{margin-top:12px}
  .dep-node{padding:6px 12px;border-left:2px solid var(--border);margin-left:16px;margin-bottom:4px;font-size:12px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;transition:all .15s;border-radius:0 4px 4px 0;background:rgba(255,255,255,.02)}
  .dep-node:hover{background:rgba(255,255,255,.06);border-left-color:var(--accent-cyan)}
  .dep-node.dep-hard{border-left-color:#ef4444}
  .dep-node.dep-soft{border-left-color:#f59e0b}
  .dep-node.dep-config{border-left-color:#3b82f6}
  .dep-node .dep-type{font-size:9px;color:var(--text-muted);margin-right:6px;text-transform:uppercase}
  .dep-node .dep-rel{font-size:9px;color:var(--accent-cyan);margin-left:8px}
  .dep-depth-0{margin-left:0;border-left-width:3px}
  .dep-depth-1{margin-left:20px}
  .dep-depth-2{margin-left:40px}
  .dep-depth-3{margin-left:60px}
  .blast-glow-hard{filter:drop-shadow(0 0 6px rgba(239,68,68,.8));opacity:1 !important}
  .blast-glow-soft{filter:drop-shadow(0 0 4px rgba(245,158,11,.6));opacity:1 !important}
  .blast-glow-config{filter:drop-shadow(0 0 3px rgba(59,130,246,.5));opacity:1 !important}
  .blast-dimmed{opacity:.15 !important;transition:opacity .3s}
  /* === TIME-SERIES SNAPSHOTS === */
  .timeline-bar{position:fixed;bottom:50px;left:340px;right:10px;height:60px;background:rgba(10,14,23,.95);border:1px solid var(--border);border-radius:8px;z-index:8;display:none;align-items:center;padding:0 16px;gap:12px;backdrop-filter:blur(8px)}
  .timeline-bar.open{display:flex}
  .timeline-bar.sidebar-collapsed{left:50px}
  .timeline-dots{flex:1;height:40px;position:relative;display:flex;align-items:center}
  .timeline-dot{width:10px;height:10px;border-radius:50%;background:var(--accent-cyan);cursor:pointer;position:absolute;transition:all .15s;border:2px solid transparent}
  .timeline-dot:hover{transform:scale(1.5);border-color:#fff}
  .timeline-dot.active{background:var(--accent-orange);border-color:#fff;transform:scale(1.4)}
  .timeline-dot.auto{background:var(--text-muted)}
  .timeline-tooltip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--bg-secondary);border:1px solid var(--border);border-radius:4px;padding:4px 8px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-primary);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s}
  .timeline-dot:hover .timeline-tooltip{opacity:1}
  .timeline-label{font-size:10px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;white-space:nowrap}
  .history-banner{position:fixed;top:6px;left:50%;transform:translateX(-50%);height:32px;background:linear-gradient(90deg,#78350f,#92400e);z-index:55;display:flex;align-items:center;justify-content:center;gap:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;color:#fbbf24;font-weight:600;border-radius:8px;padding:0 16px;border:1px solid rgba(251,191,36,.2);box-shadow:0 4px 12px var(--shadow-color)}
  .history-banner button{background:rgba(0,0,0,.3);border:1px solid rgba(251,191,36,.4);color:#fbbf24;padding:2px 10px;border-radius:4px;cursor:pointer;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .diff-banner{position:fixed;top:6px;left:50%;transform:translateX(-50%);height:32px;background:linear-gradient(90deg,#1e3a5f,#1a4731);z-index:60;display:flex;align-items:center;justify-content:center;gap:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;color:#6ee7b7;font-weight:600;border-radius:8px;padding:0 16px;border:1px solid rgba(110,231,183,.2);box-shadow:0 4px 12px var(--shadow-color)}
  .diff-banner button{background:rgba(0,0,0,.3);border:1px solid rgba(110,231,183,.4);color:#6ee7b7;padding:2px 10px;border-radius:4px;cursor:pointer;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .diff-banner button:hover{background:rgba(110,231,183,.15)}
  .diff-banner .diff-stat{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:400}
  .diff-banner .diff-stat.added{color:#10b981}
  .diff-banner .diff-stat.removed{color:#ef4444}
  .diff-banner .diff-stat.modified{color:#f59e0b}
  .diff-added{filter:drop-shadow(0 0 6px #10b981) !important}
  .diff-added rect,.diff-added circle{stroke:#10b981 !important;stroke-width:2.5px !important}
  .diff-removed{filter:drop-shadow(0 0 6px #ef4444) !important;opacity:.55 !important}
  .diff-removed rect,.diff-removed circle{stroke:#ef4444 !important;stroke-dasharray:6 3 !important;stroke-width:2.5px !important}
  @keyframes diff-pulse{0%,100%{filter:drop-shadow(0 0 4px #f59e0b)}50%{filter:drop-shadow(0 0 10px #fbbf24)}}
  .diff-modified{animation:diff-pulse 1.8s ease-in-out infinite !important}
  .diff-modified rect,.diff-modified circle{stroke:#f59e0b !important;stroke-width:2.5px !important}
  .diff-unchanged{opacity:.15 !important;transition:opacity .3s}
  .diff-summary{position:fixed;top:42px;right:0;width:340px;max-height:60vh;background:var(--panel-bg);border:1px solid var(--border);border-top:none;border-radius:0 0 0 8px;z-index:60;overflow-y:auto;padding:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;display:none;backdrop-filter:blur(8px)}
  .diff-summary.open{display:block}
  .diff-summary h4{color:var(--accent-cyan);font-size:12px;margin:0 0 8px}
  .diff-summary .diff-item{padding:4px 6px;border-radius:4px;margin-bottom:3px;cursor:pointer;display:flex;align-items:center;gap:6px}
  .diff-summary .diff-item:hover{background:var(--hover-bg)}
  .diff-summary .diff-item .diff-badge{width:6px;height:6px;border-radius:50%;flex-shrink:0}
  .diff-summary .diff-item .diff-badge.added{background:#10b981}
  .diff-summary .diff-item .diff-badge.removed{background:#ef4444}
  .diff-summary .diff-item .diff-badge.modified{background:#f59e0b}
  .diff-summary .diff-item .diff-label{color:var(--text-secondary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .diff-summary .diff-item .diff-type{color:var(--text-muted);font-size:9px;text-transform:uppercase}
  .diff-summary .diff-fields{padding:2px 0 4px 18px;font-size:10px;color:var(--text-muted)}
  .diff-summary .diff-fields .structural{color:#f59e0b}
  .diff-summary .diff-fields .metadata{color:var(--text-muted)}
  .diff-field-row{display:flex;align-items:baseline;gap:4px;padding:1px 0;flex-wrap:wrap}
  .diff-field-name{color:var(--text-muted);font-weight:600;min-width:0;flex-shrink:0}
  .diff-field-old{color:#ef4444;text-decoration:line-through;opacity:.8;word-break:break-all}
  .diff-field-arrow{color:var(--text-muted);flex-shrink:0;font-size:9px}
  .diff-field-new{color:#10b981;word-break:break-all}
  .diff-field-added{color:#10b981}
  .diff-field-removed{color:#ef4444;text-decoration:line-through;opacity:.8}
  .dp-diff-badge{display:inline-block;padding:2px 8px;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.5px;margin-left:6px}
  .dp-diff-badge.added{background:rgba(16,185,129,.15);color:#10b981;border:1px solid rgba(16,185,129,.3)}
  .dp-diff-badge.removed{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3)}
  .dp-diff-badge.modified{background:rgba(245,158,11,.15);color:#f59e0b;border:1px solid rgba(245,158,11,.3)}
  .dp-diff-change{padding:4px 0;border-bottom:1px solid rgba(30,45,74,.3)}
  .dp-diff-change:last-child{border-bottom:none}
  .dp-diff-change .dc-field{font-weight:600;color:var(--text-muted);font-size:calc(10px * var(--txt-scale,1) * var(--dp-txt-scale,1))}
  .dp-diff-change .dc-kind{font-size:7px;text-transform:uppercase;letter-spacing:.5px;padding:1px 4px;border-radius:2px;margin-left:4px}
  .dp-diff-change .dc-kind.structural{color:#f59e0b;background:rgba(245,158,11,.1)}
  .dp-diff-change .dc-kind.metadata{color:var(--text-muted);background:var(--hover-bg)}
  .dp-diff-change .dc-vals{margin-top:2px;font-size:calc(10px * var(--txt-scale,1) * var(--dp-txt-scale,1));line-height:1.6}
  .dp-diff-change .dc-old{color:#ef4444;text-decoration:line-through;opacity:.8;word-break:break-all}
  .dp-diff-change .dc-new{color:#10b981;word-break:break-all}
  .dp-diff-change .dc-arrow{color:var(--text-muted);margin:0 4px;font-size:9px}
  .dp-diff-json{max-height:300px;overflow:auto;background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:4px;padding:8px;font-size:9px;line-height:1.5;white-space:pre-wrap;word-break:break-all;color:var(--text-secondary)}
  /* === COMPARE DASHBOARD === */
  .diff-dash{position:fixed;top:0;left:0;right:0;bottom:0;z-index:110;background:var(--bg-primary);overflow:hidden;flex-direction:column;display:flex;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility 0s linear .2s}
  .diff-dash.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .2s ease,visibility 0s linear 0s}
  .diff-dash-hdr{gap:12px}
  .diff-dash-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:300px}
  .diff-dash-select{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:4px 8px;cursor:pointer;max-width:200px}
  .diff-dash-action{background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.3);border-radius:4px;color:#f59e0b;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:4px 12px;cursor:pointer;white-space:nowrap}
  .diff-dash-action:hover{background:rgba(245,158,11,.15)}
  .diff-dash-pills{display:flex;gap:6px;margin-left:auto;margin-right:8px}
  .diff-cat-pill{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:4px 10px;border-radius:12px;cursor:pointer;border:1px solid transparent;transition:all .15s;user-select:none}
  .diff-cat-pill:hover{opacity:.85}
  .diff-cat-pill.active{font-weight:700}
  .diff-cat-pill[data-cat="all"]{color:var(--text-secondary);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
  .diff-cat-pill[data-cat="all"].active{color:var(--text-primary);background:var(--hover-bg-strong);border-color:rgba(255,255,255,.2)}
  .diff-cat-pill[data-cat="added"]{color:#10b981;background:rgba(16,185,129,.06);border-color:rgba(16,185,129,.15)}
  .diff-cat-pill[data-cat="added"].active{background:rgba(16,185,129,.15);border-color:rgba(16,185,129,.4)}
  .diff-cat-pill[data-cat="removed"]{color:#ef4444;background:rgba(239,68,68,.06);border-color:rgba(239,68,68,.15)}
  .diff-cat-pill[data-cat="removed"].active{background:rgba(239,68,68,.15);border-color:rgba(239,68,68,.4)}
  .diff-cat-pill[data-cat="modified"]{color:#f59e0b;background:rgba(245,158,11,.06);border-color:rgba(245,158,11,.15)}
  .diff-cat-pill[data-cat="modified"].active{background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.4)}
  .diff-cat-pill[data-cat="unchanged"]{color:var(--text-muted);background:var(--hover-bg-subtle);border-color:rgba(255,255,255,.08)}
  .diff-cat-pill[data-cat="unchanged"].active{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15)}
  .diff-dash-body{flex:1;overflow-y:auto;padding:0}
  .diff-dash-body::-webkit-scrollbar{width:6px}
  .diff-dash-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
  .diff-dash-table{width:100%;border-collapse:collapse;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px}
  .diff-dash-table thead{position:sticky;top:0;z-index:2;background:var(--bg-secondary)}
  .diff-dash-table th{padding:8px 12px;text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:2px solid var(--border);cursor:pointer;user-select:none;white-space:nowrap}
  .diff-dash-table th:hover{color:var(--text-primary)}
  .diff-dash-table th.dd-sort-asc::after{content:' ▲';font-size:8px;color:var(--accent-cyan)}
  .diff-dash-table th.dd-sort-desc::after{content:' ▼';font-size:8px;color:var(--accent-cyan)}
  .diff-dash-table td{padding:6px 12px;border-bottom:1px solid rgba(30,45,74,.3);vertical-align:middle}
  .diff-dash-table tbody tr{transition:background .1s}
  .diff-dash-table tbody tr:hover{background:var(--hover-bg-subtle)}
  .diff-dash-table tbody tr.dd-expanded{background:rgba(245,158,11,.04)}
  .dd-status-badge{display:inline-block;padding:2px 8px;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
  .dd-status-badge.added{background:rgba(16,185,129,.15);color:#10b981;border:1px solid rgba(16,185,129,.3)}
  .dd-status-badge.removed{background:rgba(239,68,68,.15);color:#ef4444;border:1px solid rgba(239,68,68,.3)}
  .dd-status-badge.modified{background:rgba(245,158,11,.15);color:#f59e0b;border:1px solid rgba(245,158,11,.3)}
  .dd-status-badge.unchanged{background:rgba(255,255,255,.04);color:var(--text-muted);border:1px solid rgba(255,255,255,.08)}
  .dd-type-label{color:var(--text-secondary);font-size:10px}
  .dd-name{color:var(--text-primary);font-weight:500}
  .dd-key{color:var(--text-muted);font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .dd-changes{color:var(--text-secondary);font-size:10px}
  .dd-changes-structural{color:#f59e0b}
  .dd-changes-meta{color:var(--text-muted)}
  .dd-actions{display:flex;gap:4px}
  .dd-jump-btn,.dd-detail-btn{background:rgba(0,0,0,.2);border:1px solid var(--border);border-radius:3px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;padding:2px 8px;cursor:pointer;transition:all .15s}
  .dd-jump-btn:hover{color:var(--accent-cyan);border-color:var(--accent-cyan)}
  .dd-detail-btn:hover{color:#f59e0b;border-color:#f59e0b}
  .dd-expand-row{display:none}
  .dd-expand-row.open{display:table-row}
  .dd-expand-cell{padding:8px 12px 12px 44px;background:rgba(0,0,0,.15);border-bottom:1px solid rgba(30,45,74,.3)}
  .dd-expand-cell .diff-field-row{display:flex;align-items:baseline;gap:6px;padding:2px 0;flex-wrap:wrap;font-size:10px}
  .dd-expand-cell .diff-field-name{color:var(--text-muted);font-weight:600;min-width:0;flex-shrink:0}
  .dd-expand-cell .diff-field-old{color:#ef4444;text-decoration:line-through;opacity:.8;word-break:break-all}
  .dd-expand-cell .diff-field-arrow{color:var(--text-muted);flex-shrink:0;font-size:9px}
  .dd-expand-cell .diff-field-new{color:#10b981;word-break:break-all}
  .dd-expand-cell .diff-field-added{color:#10b981}
  .dd-expand-cell .diff-field-removed{color:#ef4444;text-decoration:line-through;opacity:.8}
  .dd-expand-toggle{cursor:pointer;color:var(--text-muted);font-size:10px;transition:transform .15s;display:inline-block;width:16px;text-align:center}
  .dd-expand-toggle.open{transform:rotate(90deg);color:#f59e0b}
  .diff-dash-toolbar{gap:8px}
  .diff-dash-toolbar label{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
  .diff-dash-toolbar input{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 10px;width:220px}
  .diff-dash-toolbar select{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 8px;cursor:pointer}
  .diff-dash-rowcount{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin-left:auto}
  .diff-dash-pagination{display:flex;gap:6px;align-items:center;margin-left:auto}
  .diff-page-prev,.diff-page-next{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:4px 10px;cursor:pointer}
  .diff-page-prev:hover,.diff-page-next:hover{border-color:var(--accent-cyan)}
  .diff-page-prev:disabled,.diff-page-next:disabled{opacity:.4;cursor:default}
  .diff-page-info{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);white-space:nowrap}
  .diff-per-page{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:3px 6px;cursor:pointer}
  .diff-dash-footer{gap:8px}
  .diff-dash-footer button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 12px;cursor:pointer}
  .diff-dash-footer button:hover{background:rgba(245,158,11,.1);border-color:#f59e0b}
  .dd-no-results{text-align:center;padding:40px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:12px}
  /* === TRAFFIC FLOW VISUALIZATION === */
  .flow-banner{position:fixed;top:6px;left:50%;transform:translateX(-50%);height:32px;background:linear-gradient(90deg,#0c2d4a,#0a3544);z-index:60;display:flex;align-items:center;justify-content:center;gap:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;color:#22d3ee;font-weight:600;border-radius:8px;padding:0 16px;border:1px solid rgba(34,211,238,.2);box-shadow:0 4px 12px var(--shadow-color)}
  .flow-banner button{background:rgba(0,0,0,.3);border:1px solid rgba(34,211,238,.4);color:#22d3ee;padding:2px 10px;border-radius:4px;cursor:pointer;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .flow-banner button:hover{background:rgba(34,211,238,.15)}
  .flow-banner .flow-status{font-size:11px;font-weight:400}
  .flow-banner .flow-status.allowed{color:#10b981}
  .flow-banner .flow-status.blocked{color:#ef4444}
  .flow-path{fill:none;stroke:#22d3ee;stroke-width:3;stroke-dasharray:8 4;animation:flow-dash 1s linear infinite;pointer-events:none}
  .flow-path.blocked{stroke:#ef4444;stroke-dasharray:4 4}
  .flow-hop{pointer-events:none}
  .flow-hop circle{stroke:#fff;stroke-width:1.5}
  .flow-hop text{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;font-weight:700;fill:#fff;text-anchor:middle;dominant-baseline:central}
  .flow-hop-allow circle{fill:#10b981}
  .flow-hop-block circle{fill:#ef4444}
  .flow-panel{padding:12px;font-family:"Segoe UI",system-ui,sans-serif}
  .flow-panel h4{font-size:12px;color:var(--accent-cyan);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}
  .flow-step{padding:8px 10px;margin-bottom:4px;border-radius:6px;border-left:3px solid var(--border);background:rgba(255,255,255,.02);font-size:11px;color:var(--text-secondary);cursor:pointer;transition:all .15s}
  .flow-step:hover{background:var(--hover-bg)}
  .flow-step.active{border-left-color:var(--accent-cyan);background:rgba(6,182,212,.08)}
  .flow-step.blocked{border-left-color:var(--accent-red);background:rgba(239,68,68,.08)}
  .flow-step .fs-num{display:inline-block;width:18px;height:18px;border-radius:50%;text-align:center;line-height:18px;font-size:9px;font-weight:700;color:#fff;margin-right:6px}
  .flow-step .fs-num.allow{background:#10b981}
  .flow-step .fs-num.block{background:#ef4444}
  .flow-step .fs-type{font-weight:600;color:var(--text-primary);font-size:10px;text-transform:uppercase;letter-spacing:.5px}
  .flow-step .fs-detail{font-size:10px;color:var(--text-muted);margin-top:3px;line-height:1.5}
  .flow-step .fs-rule{font-size:9px;color:var(--accent-cyan);margin-top:2px;padding:3px 6px;background:rgba(6,182,212,.06);border-radius:3px;display:inline-block}
  .flow-step .fs-suggestion{font-size:9px;color:var(--accent-orange);margin-top:4px}
  @keyframes flow-dash{0%{stroke-dashoffset:24}100%{stroke-dashoffset:0}}
  .flow-selecting .subnet-node,.flow-selecting .res-node,.flow-selecting .gw-node,.flow-selecting .lz-gw-node,.flow-selecting .internet-node{cursor:crosshair !important}
  .flow-selecting .subnet-node:hover rect,.flow-selecting .res-node:hover rect{filter:drop-shadow(0 0 6px #22d3ee) !important}
  .flow-selecting .internet-node:hover circle{filter:drop-shadow(0 0 8px #22d3ee) !important}
  .flow-path-leg{fill:none;stroke-width:3;stroke-dasharray:8 4;animation:flow-dash 1s linear infinite;pointer-events:none}
  .flow-path-leg.allowed{stroke:#22d3ee}
  .flow-path-leg.blocked{stroke:#ef4444;stroke-dasharray:4 4}
  .flow-path-leg.skipped{stroke:#4b5563;stroke-dasharray:3 6;opacity:.4}
  .flow-ingress-arrow{fill:none;stroke:#10b981;stroke-width:3;stroke-dasharray:8 4;animation:flow-dash .7s linear infinite;pointer-events:none;opacity:.9}
  .flow-fwd-arrow{fill:none;stroke:#10b981;stroke-width:2.5;stroke-dasharray:6 3;animation:flow-dash .8s linear infinite;pointer-events:none;opacity:.85}
  .fa-fwd-target{filter:drop-shadow(0 0 6px rgba(16,185,129,.5));stroke:#10b981 !important;stroke-width:2 !important}
  .fa-ingress-target{fill:rgba(16,185,129,.18) !important;filter:drop-shadow(0 0 18px rgba(16,185,129,1)) drop-shadow(0 0 8px rgba(16,185,129,.9));stroke:#10b981 !important;stroke-width:3.5 !important;opacity:1 !important}
  .flow-egress-arrow{fill:none;stroke:#fb923c;stroke-width:3;stroke-dasharray:8 4;animation:flow-dash .8s linear infinite;pointer-events:none;opacity:.9}
  .flow-egress-gw{fill:none;stroke:#fb923c;stroke-width:3.5;stroke-dasharray:none;pointer-events:none;opacity:1}
  .flow-egress-backbone{fill:none;stroke:#fb923c;stroke-width:4;stroke-dasharray:10 5;animation:flow-dash .9s linear infinite;pointer-events:none;opacity:.85}
  .fa-egress-source{fill:rgba(251,146,60,.18) !important;filter:drop-shadow(0 0 18px rgba(251,146,60,1)) drop-shadow(0 0 8px rgba(251,146,60,.8));stroke:#fb923c !important;stroke-width:3 !important;opacity:1 !important}
  .fa-bastion-target{fill:rgba(139,92,246,.18) !important;filter:drop-shadow(0 0 18px rgba(139,92,246,1)) drop-shadow(0 0 8px rgba(139,92,246,.8));stroke:#8b5cf6 !important;stroke-width:3 !important;opacity:1 !important}
  .fa-flow-bright text{paint-order:stroke fill;stroke:rgba(0,0,0,.85);stroke-width:3px;stroke-linejoin:round}
  .flow-waypoint-marker{pointer-events:none}
  .flow-waypoint-marker circle{fill:#f59e0b;stroke:#fff;stroke-width:2}
  .flow-leg{margin-bottom:6px;border:1px solid var(--border);border-radius:6px;overflow:hidden}
  .flow-leg-hdr{padding:8px 10px;background:var(--hover-bg-subtle);cursor:pointer;display:flex;align-items:center;gap:8px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-primary);font-weight:600}
  .flow-leg-hdr:hover{background:rgba(255,255,255,.06)}
  .flow-leg-hdr .leg-status{font-size:9px;padding:1px 6px;border-radius:3px;font-weight:700}
  .flow-leg-hdr .leg-status.allowed{background:rgba(16,185,129,.15);color:#10b981}
  .flow-leg-hdr .leg-status.blocked{background:rgba(239,68,68,.15);color:#ef4444}
  .flow-leg-hdr .leg-status.skipped{background:rgba(75,85,99,.2);color:#9ca3af}
  .flow-leg-body{padding:8px 10px;display:none}
  .flow-leg.expanded .flow-leg-body{display:block}
  .flow-suggestion{padding:8px 10px;margin-top:4px;background:rgba(34,211,238,.04);border:1px solid rgba(34,211,238,.15);border-radius:6px;font-size:10px;color:var(--text-secondary);cursor:pointer;transition:all .15s;font-family:"Segoe UI",system-ui,sans-serif}
  .flow-suggestion:hover{background:rgba(34,211,238,.1);border-color:rgba(34,211,238,.3)}
  .flow-suggestion .sug-name{color:var(--accent-cyan);font-weight:600}
  .flow-apply-sug{background:var(--accent-cyan);color:#000;border:none;border-radius:3px;padding:2px 8px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;font-weight:600;margin-left:6px}
  .flow-wp-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:12px;font-size:9px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif}
  .flow-wp-chip .wp-arrow{color:var(--text-muted);font-size:11px}
  .flow-wp-chip .wp-remove{cursor:pointer;color:var(--text-muted);font-size:11px;line-height:1;margin-left:2px}
  .flow-wp-chip .wp-remove:hover{color:var(--accent-red)}
  .fa-mode-pill{background:rgba(0,0,0,.3);border:1px solid rgba(34,211,238,.2);color:var(--text-muted);padding:2px 10px;border-radius:12px;cursor:pointer;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;transition:all .15s}
  .fa-mode-pill:hover{background:rgba(34,211,238,.1);color:#22d3ee}
  .fa-mode-pill.active{background:rgba(34,211,238,.2);color:#22d3ee;border-color:rgba(34,211,238,.5);font-weight:600}
  .flow-analysis-layer .fa-arrow{pointer-events:none}
  /* Flow analysis: dim map layers so flow paths stand out */
  .fa-active .route-group{opacity:.03;transition:opacity .3s}
  .fa-active .struct-group path{opacity:.05;transition:opacity .3s}
  .fa-active .nodes-layer > *{opacity:.18;transition:opacity .3s}
  .fa-active .nodes-layer > .fa-flow-bright{opacity:1 !important;transition:opacity .3s}
  .fa-active .lines-layer .peering-group{opacity:.05;transition:opacity .3s}
  .fa-active .lines-layer .peering-label-g{opacity:.05;transition:opacity .3s}
  .fa-active .label-layer{opacity:.1;transition:opacity .3s}
  .fa-hl-ingress{stroke:#10b981 !important;stroke-width:5px !important;opacity:1 !important;animation:dashFlowIn 1s linear infinite !important;stroke-dasharray:8 5 !important}
  /* Connected ingress backbone + vertical drops */
  .flow-ingress-backbone{stroke:#10b981;stroke-width:4;fill:none;opacity:.85;stroke-dasharray:10 5;animation:flow-dash .9s linear infinite}
  .flow-ingress-drop{stroke:#10b981;stroke-width:2.5;fill:none;opacity:.7;stroke-dasharray:6 4;animation:dashFlowIn 1s linear infinite}
  /* Engine-drawn egress paths — direction baked into d attribute, always normal */
  .flow-egress-fw{stroke:#fb923c;stroke-width:3;fill:none;opacity:.85;stroke-dasharray:8 5;animation:dashFlow 1s linear infinite}
  .flow-egress-nat{stroke:#a78bfa;stroke-width:3;fill:none;opacity:.85;stroke-dasharray:8 5;animation:dashFlow 1s linear infinite}
  .flow-egress-tgw{stroke:#ec4899;opacity:.85;stroke-dasharray:8 5;animation:dashFlow 1s linear infinite}
  .tier-badge{pointer-events:none;transition:opacity .2s}
  .fa-tier-row{padding:6px 10px;border-radius:4px;cursor:pointer;transition:background .15s;display:flex;align-items:center;gap:8px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif;margin-bottom:3px}
  .fa-tier-row:hover{background:var(--hover-bg)}
  .fa-tier-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
  .fa-path-item{padding:5px 8px;margin-bottom:2px;border-radius:4px;cursor:pointer;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-secondary);background:rgba(255,255,255,.02);border-left:2px solid var(--border);transition:all .15s}
  .fa-path-item:hover{background:rgba(255,255,255,.06);border-left-color:var(--accent-cyan)}
  /* Quick port buttons */
  .flow-quick-ports{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:10px}
  .flow-port-btn{background:rgba(34,211,238,.08);border:1px solid rgba(34,211,238,.2);color:var(--accent-cyan);padding:2px 8px;border-radius:3px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;transition:all .15s}
  .flow-port-btn:hover{background:rgba(34,211,238,.2);border-color:rgba(34,211,238,.5)}
  .flow-port-btn.active{background:rgba(34,211,238,.25);border-color:#22d3ee;font-weight:700;box-shadow:0 0 6px rgba(34,211,238,.2)}
  /* Trace bridge button on discovered paths */
  .fa-trace-btn{background:rgba(34,211,238,.1);border:1px solid rgba(34,211,238,.25);color:#22d3ee;padding:1px 6px;border-radius:3px;font-size:8px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;font-weight:600;margin-left:auto;flex-shrink:0;transition:all .15s}
  .fa-trace-btn:hover{background:rgba(34,211,238,.25);border-color:#22d3ee}
  /* Full analysis dashboard overlay */
  .fa-dash-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:200;background:rgba(11,17,32,.95);backdrop-filter:blur(8px);display:flex;flex-direction:column;animation:fadeIn .2s ease}
  .fa-dash-header{padding:12px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;background:var(--bg-secondary)}
  .fa-dash-header h2{font-family:"Segoe UI",system-ui,sans-serif;font-size:14px;color:var(--accent-cyan);letter-spacing:1px;text-transform:uppercase;font-weight:700}
  .fa-dash-body{flex:1;overflow-y:auto;padding:16px 20px}
  .fa-dash-close{background:none;border:1px solid var(--border);color:var(--text-secondary);padding:4px 12px;border-radius:4px;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;margin-left:auto}
  .fa-dash-close:hover{border-color:var(--accent-red);color:var(--accent-red)}
  .fa-dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
  .fa-dash-card{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;padding:14px;transition:border-color .15s}
  .fa-dash-card:hover{border-color:rgba(34,211,238,.3)}
  .fa-dash-card h4{font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;color:var(--accent-cyan);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}
  .fa-dash-stat{font-size:28px;font-weight:700;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif}
  .fa-dash-sub{font-size:10px;color:var(--text-muted);margin-top:2px}
  .fa-dash-table{width:100%;border-collapse:collapse;font-size:12px;font-family:"Segoe UI",system-ui,sans-serif}
  .fa-dash-table th{text-align:left;padding:8px 10px;border-bottom:1px solid var(--border);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}
  .fa-dash-table td{padding:7px 10px;border-bottom:1px solid var(--hover-bg-subtle);color:var(--text-secondary)}
  .fa-dash-table tr:hover td{background:rgba(255,255,255,.02)}
  .fa-dash-table .fa-section-divider td{padding:12px 10px 6px;border-bottom:1px solid rgba(255,255,255,.08);background:none}
  .fa-dash-table .fa-section-divider:first-child td{padding-top:4px}
  .fa-dash-filters{padding:8px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--bg-secondary)}
  .fa-dash-filters input{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);padding:5px 12px;border-radius:4px;font-size:12px;font-family:"Segoe UI",system-ui,sans-serif;width:260px}
  .fa-dash-filters input:focus{outline:none;border-color:var(--accent-cyan)}
  .fa-dash-pills{display:flex;gap:4px;flex:1}
  .fa-dash-pill{padding:4px 12px;border-radius:12px;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;border:1px solid var(--border);color:var(--text-muted);background:transparent;transition:all .15s}
  .fa-dash-pill.active{background:var(--accent-cyan);color:#000;border-color:var(--accent-cyan)}
  .fa-dash-pill:hover:not(.active){border-color:rgba(34,211,238,.3);color:var(--text-secondary)}
  .fa-dash-filters select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);padding:3px 6px;border-radius:4px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .fa-dash-footer{padding:10px 20px;border-top:1px solid var(--border);display:flex;align-items:center;gap:14px;background:var(--bg-secondary);font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;color:var(--text-muted)}
  .fa-dash-footer button{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);padding:4px 12px;border-radius:4px;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer}
  .fa-dash-footer button:disabled{opacity:.3;cursor:default}
  .fa-dash-table th[data-sort-col]{cursor:pointer;user-select:none}
  .fa-dash-table th[data-sort-col]:hover{color:var(--accent-cyan)}
  .fa-dash-table th.dd-sort-asc::after{content:' ▲';font-size:8px}
  .fa-dash-table th.dd-sort-desc::after{content:' ▼';font-size:8px}
  .fa-section-badge{display:inline-block;padding:2px 8px;border-radius:3px;font-size:10px;text-transform:uppercase;letter-spacing:.5px;font-weight:600}
  .fa-section-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted)}
  /* Right-click context menu */
  .flow-ctx-menu{position:fixed;z-index:300;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;box-shadow:0 8px 32px rgba(0,0,0,.6);padding:4px 0;min-width:180px;font-family:"Segoe UI",system-ui,sans-serif}
  .flow-ctx-item{padding:6px 14px;font-size:11px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;gap:8px;transition:background .1s}
  .flow-ctx-item:hover{background:rgba(34,211,238,.1);color:var(--text-primary)}
  .flow-ctx-item .ctx-icon{font-size:13px;width:18px;text-align:center}
  .flow-ctx-sep{height:1px;background:var(--border);margin:3px 0}
  /* Guided banner step styling */
  .flow-step-num{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:rgba(34,211,238,.2);color:#22d3ee;font-size:9px;font-weight:700;margin-right:4px}
  .flow-step-num.done{background:rgba(16,185,129,.2);color:#10b981}
  .flow-step-num.active{background:#22d3ee;color:#000}
  /* Multi-Account Panel */
  .account-panel{position:fixed;top:0;right:-320px;width:320px;height:100vh;background:var(--bg-secondary);border-left:1px solid var(--border);z-index:50;display:flex;flex-direction:column;transition:right .25s ease;box-shadow:-4px 0 24px var(--shadow-color)}
  .account-panel.open{right:0}
  .account-panel-hdr{padding:14px 16px;border-bottom:1px solid var(--border);background:var(--bg-tertiary);display:flex;justify-content:space-between;align-items:center}
  .account-panel-hdr h3{font-family:"Segoe UI",system-ui,sans-serif;font-size:13px;font-weight:600;color:var(--accent-cyan);letter-spacing:1px;text-transform:uppercase}
  .account-panel-body{flex:1;overflow-y:auto;padding:10px}
  .account-panel-body::-webkit-scrollbar{width:6px}
  .account-panel-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
  .account-card{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;padding:12px;margin-bottom:8px;transition:border-color .15s}
  .account-card:hover{border-color:var(--accent-blue)}
  .account-card .ac-top{display:flex;align-items:center;gap:8px;margin-bottom:6px}
  .account-card .ac-label{font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;font-weight:600;color:var(--text-primary);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .account-card .ac-region{font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;color:var(--text-muted);background:var(--bg-input);padding:2px 6px;border-radius:3px}
  .account-card .ac-meta{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-secondary);line-height:1.6}
  .account-card .ac-actions{display:flex;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
  .account-color-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;border:2px solid rgba(255,255,255,.15)}
  .account-toggle{background:none;border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:9px;padding:3px 8px;cursor:pointer;transition:all .15s}
  .account-toggle:hover{border-color:var(--accent-blue);color:var(--text-primary)}
  .account-toggle.hidden-acct{opacity:.5;text-decoration:line-through}
  .account-merge-banner{position:fixed;top:6px;left:50%;transform:translateX(-50%);height:32px;background:linear-gradient(90deg,#1a0c3e,#0c2d4a);z-index:55;display:flex;align-items:center;justify-content:center;gap:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:12px;color:var(--accent-purple);font-weight:600;border-radius:8px;padding:0 16px;border:1px solid rgba(168,85,247,.2);box-shadow:0 4px 12px var(--shadow-color)}
  .account-merge-banner.collapsed{gap:6px;padding:0 10px}
  .account-merge-banner button{background:rgba(0,0,0,.3);border:1px solid rgba(139,92,246,.4);color:var(--accent-purple);padding:2px 10px;border-radius:4px;cursor:pointer;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .account-merge-banner button:hover{background:rgba(139,92,246,.15)}
  .merge-acct-chip{display:flex;align-items:center;gap:4px;padding:2px 8px;border-radius:4px;font-size:9px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;border:1px solid rgba(255,255,255,.15);transition:all .15s;user-select:none}
  .merge-acct-chip:hover{border-color:rgba(255,255,255,.3)}
  .merge-acct-chip.hidden-chip{opacity:.35;text-decoration:line-through}
  .merge-acct-chip .mac-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
  /* === TERRAFORM / CLOUDFORMATION EXPORT === */
  .iac-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:600;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);align-items:center;justify-content:center}
  .iac-modal.open{display:flex}
  .iac-box{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;width:min(900px,90vw);max-height:85vh;display:flex;flex-direction:column;box-shadow:0 8px 32px var(--shadow-heavy)}
  .iac-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--border)}
  .iac-header h3{margin:0;font-family:"Segoe UI",system-ui,sans-serif;font-size:14px;color:var(--accent-cyan)}
  .iac-close{background:none;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:4px 8px}
  .iac-close:hover{color:var(--text-primary)}
  .iac-opts{display:flex;gap:12px;padding:12px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center}
  .iac-opts label{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);text-transform:uppercase;display:flex;align-items:center;gap:4px}
  .iac-opts select,.iac-opts input[type="checkbox"]{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:3px 6px}
  .iac-opts .iac-gen{background:var(--accent-cyan);color:#000;border:none;border-radius:4px;padding:5px 14px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:600;cursor:pointer}
  .iac-opts .iac-gen:hover{opacity:.85}
  .iac-preview{flex:1;overflow:auto;padding:0;position:relative;min-height:200px}
  .iac-preview pre{margin:0;padding:16px 20px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;line-height:1.6;white-space:pre;tab-size:2;color:var(--text-primary);background:var(--bg-primary)}
  .iac-preview .iac-warn{background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.3);border-radius:6px;padding:8px 12px;margin:8px 20px;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:#f59e0b}
  .iac-preview .hcl-kw{color:#c084fc}
  .iac-preview .hcl-str{color:#10b981}
  .iac-preview .hcl-num{color:#22d3ee}
  .iac-preview .hcl-cmt{color:var(--text-muted);font-style:italic}
  .iac-preview .hcl-type{color:#60a5fa}
  .iac-preview .hcl-ref{color:#f59e0b}
  .iac-actions{display:flex;gap:8px;padding:12px 20px;border-top:1px solid var(--border);justify-content:flex-end}
  .iac-actions button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:6px 14px;cursor:pointer;transition:all .15s}
  .iac-actions button:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}
  .iac-actions button.primary{background:var(--accent-cyan);color:#000;font-weight:600;border-color:var(--accent-cyan)}
  .iac-actions button.primary:hover{opacity:.85}
  .iac-empty{display:flex;align-items:center;justify-content:center;height:200px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:12px}

  /* ============================================
     RESPONSIVE / MOBILE-FRIENDLY LAYOUT
     Targets: iPhone, Android, iPad, tablets
     ============================================ */

  /* --- TABLET: iPad, landscape phones (max-width 1024px) --- */
  @media (max-width:1024px){
    .sidebar{width:300px;min-width:300px}
    .sidebar.collapsed{transform:translateX(-300px)}
    .sidebar-toggle{transform:translateX(296px)}
    .sidebar.collapsed~.sidebar-toggle{transform:translateX(0)}
    .detail-panel{width:360px}
    .stats-bar{padding:6px 12px}
    .main:has(.detail-panel.open) .export-bar{right:372px}
    .notes-panel{width:360px}
    .account-panel{width:300px}
    .diff-summary{width:300px}
    .comp-toolbar input{width:160px}
    .timeline-bar{left:280px}
  }

  /* --- PHONE / SMALL TABLET: (max-width 768px) --- */
  @media (max-width:768px){
    body{flex-direction:column}

    /* Sidebar: full-width overlay. Use svh so it ends above Safari's toolbar. */
    .sidebar{position:fixed;top:0;left:0;width:100vw;min-width:100vw;height:100vh;height:100svh;z-index:100;transform:translateX(-100%);transition:transform .25s ease;display:flex;flex-direction:column;overflow:hidden}
    .sidebar:not(.collapsed){transform:translateX(0)}
    .sidebar.collapsed{width:100vw;min-width:100vw;overflow:hidden;transform:translateX(-100%)}
    /* Sidebar body: must scroll, flex-shrink so actions stay pinned at bottom */
    .sidebar-body{flex:1;overflow-y:auto;min-height:0;-webkit-overflow-scrolling:touch}
    /* Upload row: compact on mobile */
    .upload-row{padding:6px 10px}
    .upload-status{padding:0 10px}

    /* Sidebar toggle: compact hamburger top-left */
    .sidebar-toggle{position:fixed;top:8px;left:8px;z-index:101;width:34px;height:34px;font-size:16px;border-radius:6px;background:var(--overlay-bg);backdrop-filter:blur(8px);border:1px solid var(--border);transition:transform .25s ease,background .15s;transform:translateX(0)}
    .sidebar.collapsed~.sidebar-toggle{transform:translateX(0)}
    .sidebar:not(.collapsed)~.sidebar-toggle{transform:translateX(calc(100vw - 50px));z-index:101}

    /* Sidebar header: compact on mobile */
    .sidebar-header{padding:10px 14px}
    .sidebar-header h1{font-size:13px;margin-bottom:1px}
    .sidebar-header p{font-size:9px}
    .global-txt-ctrl{margin-top:4px}

    /* Sidebar actions: pinned at bottom (sidebar is 100svh, so already above toolbar) */
    .sidebar-actions{padding:10px 12px 16px;gap:8px;flex-shrink:0;border-top:1px solid var(--border);background:var(--bg-secondary)}
    .btn{padding:10px 12px;font-size:calc(11px * var(--txt-scale))}
    .btn-action{padding:10px 12px;font-size:11px}

    /* Sidebar sections: compact inputs, all collapsed by default (via JS) */
    .ji{height:44px;font-size:calc(10px * var(--txt-scale))}
    .ig{padding:4px 10px}
    .ig-lbl{margin-bottom:2px}
    .ig-lbl code{font-size:8px}
    .sec-hdr{padding:8px 12px}
    .sec-hdr span{font-size:calc(9px * var(--txt-scale))}

    /* Main fills viewport — use svh so bottom elements clear Safari toolbar */
    .main{width:100vw;height:100vh;height:100svh}

    /* Detail panel: full-width overlay from bottom — use svh to clear Safari toolbar */
    .detail-panel{width:100vw;height:70vh;height:70svh;top:auto;bottom:0;border-left:none;border-top:1px solid var(--border);border-radius:16px 16px 0 0}
    .dp-header{padding:clamp(10px,3cqw,20px) clamp(12px,4cqw,24px)}
    .dp-close{width:clamp(28px,8cqw,40px);height:clamp(28px,8cqw,40px);font-size:clamp(14px,4cqw,20px)}
    .dp-sec-hdr{padding:12px 16px}

    /* Stats bar: hide on mobile, show as a floating row only when tapped */
    .stats-bar{display:none !important}

    /* Export bar: small toggle top-right */
    .export-bar{top:8px;right:8px}
    .main:has(.detail-panel.open) .export-bar{right:8px}
    .export-btn{padding:8px 12px;font-size:calc(11px * var(--txt-scale))}
    .eb-toggle{padding:5px 10px;font-size:9px}

    /* Hide layout controls on mobile */
    .eb-layout-controls{display:none}

    /* Zoom controls: above bottomToolbar (inline bottom:12px + ~34px tall + 6px gap) */
    .zoom-controls{bottom:52px;right:10px}
    .zoom-btn{width:36px;height:36px;font-size:17px;border-radius:6px}
    .zoom-btn.wide{display:inline-flex;width:36px;height:36px;font-size:12px;padding:0;justify-content:center;align-items:center;overflow:hidden;text-indent:-9999px}
    .zoom-btn.wide::after{text-indent:0;display:block}
    #btnExpand.zoom-btn.wide::after{content:'E';font-size:13px;font-weight:700}
    #btnCollapse.zoom-btn.wide::after{content:'C';font-size:13px;font-weight:700}
    .design-btn{padding:6px 10px;font-size:9px}
    /* Show expand/collapse on mobile, hide design help */
    #detailBtns{display:flex}
    .design-help{display:none !important}

    /* Legend: above bottomToolbar */
    .legend{bottom:76px;left:10px;max-width:160px;font-size:8px;padding:6px 10px}
    .legend-item{font-size:8px;gap:5px}
    .legend-swatch{width:8px;height:8px}
    .legend .legend-hint{display:none}
    .legend-title{font-size:8px}
    .legend.collapsed{padding:4px 8px;border-radius:12px;opacity:.7}
    .legend.collapsed .legend-title{font-size:7px;gap:4px;margin-bottom:0}

    /* Notes panel: full-width — use svh to clear Safari toolbar */
    .notes-panel{width:100vw;height:70vh;height:70svh;top:auto;bottom:0;border-radius:16px 16px 0 0}

    /* Account panel: full-width, hide fully off-screen when closed */
    .account-panel{width:100vw;right:-100vw}
    .account-panel.open{right:0}
    /* Push header text past the sidebar toggle arrow (34-40px wide at left:8px) */
    .account-panel-hdr{padding-left:56px}

    /* Dependency overlay */
    .dep-body{padding:12px}
    .dep-stat{min-width:90px;padding:8px 12px}
    .dep-stat b{font-size:16px}

    /* Compliance dashboard */
    .comp-dash-hdr{padding:10px 12px;gap:10px;flex-wrap:wrap}
    .comp-dash-hdr h2{font-size:13px}
    .comp-dash-stats{padding:8px 12px;gap:6px}
    .comp-sev-pill{font-size:10px;padding:4px 10px}
    .comp-toolbar{padding:8px 12px;gap:6px}
    .comp-toolbar input{width:100%;min-width:0}
    .comp-table{font-size:11px}
    .comp-table th{padding:6px 8px;font-size:9px}
    .comp-table td{padding:5px 8px}
    /* Compare dashboard responsive */
    .diff-dash-hdr{flex-wrap:wrap;padding:10px 12px}
    .diff-dash-pills{flex-wrap:wrap;gap:4px}
    .diff-dash-toolbar{flex-wrap:wrap;padding:8px 12px}
    .diff-dash-toolbar input{width:100%;min-width:0}
    .diff-dash-table th{padding:6px 8px;font-size:9px}
    .diff-dash-table td{padding:5px 8px}
    .diff-dash-pagination{flex-wrap:wrap;gap:4px}
    .comp-dash-footer{padding:8px 12px}

    /* IaC modal: full screen */
    .iac-box{width:100vw;max-height:100vh;border-radius:0}
    .iac-header{padding:12px 16px}
    .iac-opts{padding:10px 12px;gap:8px}
    .iac-opts select,.iac-opts input[type="checkbox"]{font-size:12px}
    .iac-actions{padding:10px 12px;gap:6px}
    .iac-actions button{padding:8px 12px;font-size:12px}

    /* Timeline bar */
    .timeline-bar{left:10px;bottom:70px;height:50px;padding:0 10px;gap:8px}
    .timeline-bar.sidebar-collapsed{left:10px}
    .timeline-label{font-size:9px}

    /* Diff summary */
    .diff-summary{width:280px;top:42px;right:0}

    /* Change log */
    .change-log{max-width:95%;bottom:70px}

    /* Tooltip: responsive width */
    .tooltip{max-width:85vw;min-width:160px}

    /* Empty state: responsive */
    .empty-state .icon{width:60px;height:60px;font-size:24px}
    .empty-state h2{font-size:13px}
    .empty-state p{font-size:11px}

    /* History / diff / flow banners */
    .history-banner,.diff-banner,.flow-banner,.account-merge-banner{font-size:10px;gap:8px;padding:0 8px;height:36px}
    .history-banner button,.diff-banner button,.flow-banner button,.account-merge-banner button{font-size:9px;padding:2px 8px}

    /* Bottom toolbar: scrollable on mobile (! needed to override inline styles) */
    #bottomToolbar{left:0 !important;right:0 !important;transform:none !important;align-items:center;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-x;overscroll-behavior-y:contain;padding:4px 10px !important;gap:5px !important;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%)}
    #bottomToolbar::-webkit-scrollbar{display:none}
    #bottomToolbar button{flex-shrink:0;font-size:10px;height:28px;padding:0 10px}
    .dock-toolbar{left:0 !important;right:0 !important;transform:none !important;align-items:center;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-x;padding:4px 10px !important;border-radius:0 !important;scrollbar-width:none}
    .dock-toolbar::-webkit-scrollbar{display:none}
    .dock-toolbar .dock-btn{flex-shrink:0}
    .dock-label{display:none}

    /* Locked indicator */
    .hl-locked-indicator{font-size:8px;padding:4px 10px;bottom:100px}

    /* Design banner */
    .design-banner{font-size:9px;padding:4px 10px;gap:8px;flex-wrap:wrap}
    .design-banner .db-shortcuts{display:none}
    .main:has(.design-banner.visible) .export-bar{top:42px}
  }

  /* --- SMALL PHONE: iPhone SE, narrow Android (max-width 430px) --- */
  @media (max-width:430px){
    /* Export buttons: hide descriptions */
    .export-btn span{display:none}

    /* Zoom controls: even smaller */
    .zoom-controls{right:8px}
    .zoom-btn{width:32px;height:32px;font-size:15px}

    .detail-panel{height:85vh;height:85svh}
    .notes-panel{height:85vh;height:85svh}

    /* Legend: extra compact */
    .legend{padding:5px 8px;max-width:140px}
    .legend-swatch{width:7px;height:7px}

    /* Compliance dashboard: tighter */
    .comp-dash-hdr{padding:8px 10px}
    .comp-dash-hdr h2{font-size:12px}
    .comp-dash-stats{padding:6px 10px}
    .comp-toolbar{flex-direction:column}
    .comp-dash-footer{flex-direction:column;gap:6px}

    /* Diff summary: full width */
    .diff-summary{width:100vw;right:0;border-radius:0}

    /* Sidebar header */
    .sidebar-header h1{font-size:13px}
    .sidebar-header p{font-size:10px}

    /* IaC opts: stack vertically */
    .iac-opts{flex-direction:column;align-items:stretch}
  }

  /* Mobile drag handle for bottom sheets */
  .dp-drag-handle{display:none;padding:8px 0 4px;cursor:grab;touch-action:none}
  .dp-drag-bar{width:36px;height:4px;background:var(--text-muted);border-radius:2px;margin:0 auto;opacity:.5}
  @media (max-width:768px){
    .dp-drag-handle{display:block}
  }
  /* Desktop resize handle on left edge */
  .dp-resize-handle{position:absolute;top:0;left:-4px;width:8px;height:100%;cursor:col-resize;z-index:55;background:transparent}
  .dp-resize-handle:hover,.dp-resize-handle.active{background:linear-gradient(90deg,transparent,var(--accent-cyan),transparent);opacity:.5}
  @media (max-width:768px){
    .dp-resize-handle{display:none}
  }

  /* --- TOUCH DEVICE ENHANCEMENTS --- */
  @media (hover:none) and (pointer:coarse){
    /* Larger tap targets for touch */
    .sidebar-toggle{width:40px;height:40px;font-size:20px}
    .zoom-btn{min-width:36px;min-height:36px}
    .dp-close{min-width:36px;min-height:36px}
    .gtc-btn{width:32px;height:32px;font-size:16px}
    .sec-hdr{padding:10px 14px}
    .dp-sec-hdr{padding:12px 16px;min-height:44px}
    .btn{min-height:44px}
    .btn-action{min-height:44px}
    .export-btn{min-height:44px}
    .comp-sev-pill{min-height:36px;display:inline-flex;align-items:center}
    .compliance-filter button{min-height:36px}
    .comp-mute-btn{min-height:32px;padding:4px 10px}
    .finding-summary{min-height:44px}
    .note-actions button{min-height:32px;padding:4px 10px}
    .account-toggle{min-height:36px;padding:6px 12px}

    /* Remove hover-only states on touch */
    .stat-chip:hover,.export-btn:hover,.zoom-btn:hover{background:initial}

    /* Smooth scrolling for touch */
    .sidebar-body,.dp-body,.comp-body,.dep-body,.notes-panel-body,.account-panel-body{
      -webkit-overflow-scrolling:touch;scroll-behavior:smooth}

    /* Prevent text selection on interactive elements */
    .btn,.zoom-btn,.export-btn,.stat-chip,.sidebar-toggle,.dp-close,.gtc-btn{
      -webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;user-select:none}
  }

  /* --- LANDSCAPE PHONE --- */
  @media (max-height:500px) and (orientation:landscape){
    .detail-panel{height:100vh;height:100svh;border-radius:0}
    .notes-panel{height:100vh;height:100svh;border-radius:0}
    .zoom-controls{bottom:8px;right:6px}
    .zoom-btn{width:30px;height:30px;font-size:14px}
    .legend{bottom:52px;left:6px;max-width:130px}
    .legend.collapsed{padding:4px 8px;border-radius:12px;opacity:.7}
    .legend.collapsed .legend-title{font-size:7px;gap:4px;margin-bottom:0}
    .timeline-bar{bottom:40px;height:40px}
    /* Bottom toolbar: scrollable in landscape (width > 768px so portrait rules don't apply) */
    #bottomToolbar,.dock-toolbar{left:0 !important;right:0 !important;transform:none !important;align-items:center;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-x;overscroll-behavior-y:contain;padding:4px 10px !important;border-radius:0 !important;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%)}
    #bottomToolbar::-webkit-scrollbar,.dock-toolbar::-webkit-scrollbar{display:none}
    #bottomToolbar button{flex-shrink:0}
    .dock-toolbar .dock-btn{flex-shrink:0}
    .dock-label{display:none}
    .stats-bar{display:none !important}
  }

  /* --- SAFE AREA INSETS for notched phones (iPhone X+) ---
       .main already uses height:100svh so bottom:0 = above Safari toolbar.
       env(safe-area-inset-bottom) only adds clearance for the home indicator. */
  /* === UNIFIED DASHBOARD SYSTEM === */
  /* Navigation tab bar shared across all full-screen dashboards */
  .dash-nav{display:flex;gap:2px;padding:0 4px;background:var(--hover-bg-subtle);border-radius:8px;margin-right:auto;margin-left:16px}
  .dash-nav-btn{background:none;border:1px solid transparent;border-radius:6px;color:var(--text-muted);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;font-weight:600;padding:5px 12px;cursor:pointer;transition:all .15s;text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:5px;white-space:nowrap}
  .dash-nav-btn:hover{color:var(--text-secondary);background:rgba(255,255,255,.04)}
  .dash-nav-btn.active{color:var(--accent-cyan);background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.2)}
  .dash-nav-btn.active[data-dash="compliance"]{color:var(--accent-cyan);background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.2)}
  .dash-nav-btn.active[data-dash="firewall"]{color:var(--accent-red);background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.2)}
  .dash-nav-btn.active[data-dash="budr"]{color:var(--accent-green);background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.2)}
  .dash-nav-btn.active[data-dash="reports"]{color:var(--accent-orange);background:rgba(245,158,11,.08);border-color:rgba(245,158,11,.2)}
  .dash-nav-btn .dn-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
  .dash-nav-btn[data-dash="compliance"] .dn-dot{background:var(--accent-cyan)}
  .dash-nav-btn[data-dash="firewall"] .dn-dot{background:var(--accent-red)}
  .dash-nav-btn[data-dash="budr"] .dn-dot{background:var(--accent-green)}
  .dash-nav-btn[data-dash="reports"] .dn-dot{background:var(--accent-orange)}
  /* dashFadeIn kept for any future use */
  @keyframes dashFadeIn{from{opacity:0}to{opacity:1}}
  /* Unified scrollbar for all dashboard bodies */
  .comp-body::-webkit-scrollbar,.fw-dash-body::-webkit-scrollbar,.budr-body::-webkit-scrollbar,.rpt-modules::-webkit-scrollbar,.rpt-preview::-webkit-scrollbar,.diff-dash-body::-webkit-scrollbar{width:6px}
  .comp-body::-webkit-scrollbar-track,.fw-dash-body::-webkit-scrollbar-track,.budr-body::-webkit-scrollbar-track,.rpt-modules::-webkit-scrollbar-track,.rpt-preview::-webkit-scrollbar-track{background:transparent}
  .comp-body::-webkit-scrollbar-thumb,.fw-dash-body::-webkit-scrollbar-thumb,.budr-body::-webkit-scrollbar-thumb,.rpt-modules::-webkit-scrollbar-thumb,.rpt-preview::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
  .comp-body::-webkit-scrollbar-thumb:hover,.fw-dash-body::-webkit-scrollbar-thumb:hover,.budr-body::-webkit-scrollbar-thumb:hover{background:rgba(100,116,139,.5)}
  /* Unified filter pill base class */
  .dash-pill{padding:4px 12px;border-radius:12px;font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .15s;background:rgba(255,255,255,.06);color:var(--text-muted);user-select:none}
  .dash-pill:hover{background:var(--hover-bg-strong)}
  .dash-pill.active{border-color:currentColor}
  /* Unified dashboard close button */
  .dash-close{background:none;border:1px solid var(--border);border-radius:6px;color:var(--text-muted);font-size:11px;padding:5px 14px;cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif;transition:all .15s;display:flex;align-items:center;gap:5px}
  .dash-close:hover{color:var(--text-primary);border-color:var(--text-muted);background:rgba(255,255,255,.04)}
  .dash-close kbd{font-size:9px;padding:1px 4px;background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:3px;color:var(--text-secondary)}
  /* Unified dashboard header */
  .dash-hdr{display:flex;align-items:center;gap:12px;padding:10px 20px;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}
  .dash-hdr h2{font-family:"Segoe UI",system-ui,sans-serif;font-size:15px;margin:0;flex-shrink:0}
  /* Unified dashboard toolbar */
  .dash-toolbar{display:flex;gap:8px;padding:8px 20px;background:var(--bg-tertiary);border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap;align-items:center}
  .dash-toolbar input[type="text"]{background:var(--bg-input);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 10px;width:220px;transition:border-color .15s}
  .dash-toolbar input[type="text"]:focus{border-color:var(--accent-cyan);outline:none}
  .dash-toolbar select{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 8px;cursor:pointer}
  .dash-toolbar label{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
  /* Unified dashboard footer */
  .dash-footer{display:flex;gap:8px;padding:8px 20px;background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0;align-items:center;flex-wrap:wrap}
  .dash-footer button{background:var(--bg-input);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:"Segoe UI",system-ui,sans-serif;font-size:11px;padding:5px 12px;cursor:pointer;transition:all .15s}
  .dash-footer button:hover{background:rgba(96,165,250,.08);border-color:rgba(96,165,250,.3)}
  .dash-footer .dash-footer-meta{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);margin-left:auto}
  /* === UNIFIED DASHBOARD SHELL === */
  .udash{position:fixed;top:0;left:0;right:0;bottom:0;z-index:500;background:var(--bg-primary);display:none;flex-direction:column;font-family:"Segoe UI",system-ui,sans-serif}
  .udash.open{display:flex}
  .udash-hdr{display:flex;align-items:center;border-bottom:1px solid var(--border);background:var(--bg-secondary);padding:0 12px;flex-shrink:0;height:42px}
  .udash-tabs{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
  .udash-acct-bar{display:flex;align-items:center;gap:4px;margin-right:8px;flex-shrink:0}
  .udash-acct-btn{font-size:9px;padding:3px 8px;border-radius:4px;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-muted);cursor:pointer;font-family:"Segoe UI",system-ui,sans-serif;font-weight:600;white-space:nowrap;display:inline-flex;align-items:center;gap:4px;transition:all .15s}
  .udash-acct-btn:hover{border-color:var(--text-muted)}
  .udash-acct-btn.active{background:var(--acct-bg,rgba(255,255,255,.08));color:var(--acct-fg,var(--text-primary));border-color:var(--acct-fg,var(--accent-cyan))}
  .udash-tabs::-webkit-scrollbar{display:none}
  .udash-tab{padding:10px 14px;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;cursor:pointer;border:none;background:transparent;color:var(--text-muted);border-bottom:2px solid transparent;transition:all .15s;white-space:nowrap;display:flex;align-items:center;gap:5px}
  .udash-tab:hover{color:var(--text-secondary);background:var(--hover-bg-subtle)}
  .udash-tab.active{color:var(--tab-color,var(--accent-cyan));border-bottom-color:var(--tab-color,var(--accent-cyan));font-weight:600}
  .udash-toolbar{flex-shrink:0;padding:8px 16px;border-bottom:1px solid var(--border);background:var(--bg-secondary);min-height:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px}
  .udash-toolbar:empty{display:none}
  .udash-toolbar label{color:var(--text-muted);font-size:9px;text-transform:uppercase;letter-spacing:.5px}
  .udash-toolbar input[type="text"]{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);padding:4px 10px;border-radius:4px;font-size:11px;font-family:"Segoe UI",system-ui,sans-serif;width:200px}
  .udash-toolbar input[type="text"]:focus{outline:none;border-color:var(--accent-cyan)}
  .udash-toolbar select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);padding:4px 8px;border-radius:4px;font-size:10px;font-family:"Segoe UI",system-ui,sans-serif}
  .udash-body{flex:1;overflow-y:auto;padding:0 16px 16px;background:var(--bg-primary)}
  .udash-body>:first-child{margin-top:16px}
  .udash-body.rpt-layout{display:flex;gap:0;padding:0;overflow:hidden}
  .udash-footer{flex-shrink:0;padding:8px 16px;border-top:1px solid var(--border);background:var(--bg-secondary);min-height:0;display:flex;gap:8px;align-items:center;font-family:"Segoe UI",system-ui,sans-serif;font-size:10px}
  .udash-footer:empty{display:none}
  .udash-footer button,.udash-btn{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;padding:4px 12px;cursor:pointer;transition:all .15s}
  .udash-footer button:hover,.udash-btn:hover{background:rgba(96,165,250,.08);border-color:rgba(96,165,250,.3);color:var(--text-primary)}
  .udash-footer button:disabled{opacity:.4;cursor:default}
  /* BUDR toolbar (new) */

  @supports (padding: env(safe-area-inset-top)){
    @media (max-width:768px){
      .sidebar-header{padding-top:calc(14px + env(safe-area-inset-top))}
      .sidebar-toggle{top:calc(8px + env(safe-area-inset-top))}
      .export-bar{top:calc(8px + env(safe-area-inset-top))}
      #bottomToolbar,.dock-toolbar{bottom:calc(12px + env(safe-area-inset-bottom)) !important}
      .zoom-controls{bottom:calc(52px + env(safe-area-inset-bottom))}
      .legend{bottom:calc(52px + env(safe-area-inset-bottom))}
      .detail-panel{padding-bottom:env(safe-area-inset-bottom)}
      .notes-panel{padding-bottom:env(safe-area-inset-bottom)}
      .sidebar-actions{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
      .timeline-bar{bottom:calc(52px + env(safe-area-inset-bottom))}
      .hl-locked-indicator{bottom:calc(90px + env(safe-area-inset-bottom))}
      .change-log{bottom:calc(52px + env(safe-area-inset-bottom))}
    }
  }
  /* === Resource Spotlight (zoom window) === */
  @keyframes spotlightFadeIn{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
  @keyframes spotlightRingPulse{0%{stroke-opacity:.9;stroke-width:3}50%{stroke-opacity:.4;stroke-width:1.5}100%{stroke-opacity:.9;stroke-width:3}}
  .resource-spotlight{position:fixed;z-index:80;pointer-events:none}
  .resource-spotlight.active{pointer-events:auto}
  .spotlight-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.35);opacity:0;transition:opacity .4s ease;z-index:79;cursor:pointer}
  .spotlight-backdrop.active{opacity:1}
  .spotlight-card{position:fixed;bottom:24px;right:24px;width:380px;max-height:calc(100vh - 80px);background:var(--panel-bg);border:1px solid rgba(34,211,238,.3);border-radius:14px;box-shadow:0 8px 40px rgba(0,0,0,.6),0 0 20px rgba(34,211,238,.08);backdrop-filter:blur(20px);overflow:hidden;animation:spotlightFadeIn .4s ease forwards;z-index:81;display:flex;flex-direction:column}
  .spotlight-header{padding:16px 18px 12px;background:linear-gradient(135deg,rgba(34,211,238,.06),transparent);border-bottom:1px solid var(--border);position:relative}
  .spotlight-header .sl-type-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;margin-bottom:6px}
  .spotlight-header h3{font-family:"Segoe UI",system-ui,sans-serif;font-size:15px;font-weight:700;color:var(--text-primary);margin:0 0 4px;line-height:1.3;word-break:break-all}
  .spotlight-header .sl-id{font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;color:var(--text-muted);cursor:pointer}
  .spotlight-header .sl-id:hover{color:var(--accent-cyan)}
  .spotlight-close{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:6px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text-muted);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .15s}
  .spotlight-close:hover{background:var(--hover-bg-strong);color:var(--text-primary);border-color:rgba(255,255,255,.2)}
  .spotlight-body{flex:1;overflow-y:auto;padding:14px 18px;font-family:"Segoe UI",system-ui,sans-serif}
  .spotlight-section{margin-bottom:14px}
  .spotlight-section-title{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:8px;display:flex;align-items:center;gap:6px}
  .spotlight-section-title::after{content:'';flex:1;height:1px;background:var(--border)}
  .spotlight-kv{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:11px}
  .spotlight-kv dt{color:var(--text-muted);white-space:nowrap}
  .spotlight-kv dd{color:var(--text-secondary);margin:0;word-break:break-all}
  .spotlight-nearby{display:flex;flex-wrap:wrap;gap:6px}
  .spotlight-nearby-item{display:flex;align-items:center;gap:6px;padding:6px 10px;background:var(--hover-bg-subtle);border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all .2s;flex:1;min-width:140px}
  .spotlight-nearby-item:hover{border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.06);transform:translateY(-1px)}
  .spotlight-nearby-item .sn-badge{display:inline-block;width:6px;height:6px;border-radius:50%;flex-shrink:0}
  .spotlight-nearby-item .sn-name{font-size:10px;color:var(--text-primary);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
  .spotlight-nearby-item .sn-type{font-size:8px;color:var(--text-muted);text-transform:uppercase;flex-shrink:0}
  .spotlight-actions{display:flex;gap:6px;padding:12px 18px;border-top:1px solid var(--border);background:rgba(255,255,255,.02)}
  .spotlight-actions button{flex:1;padding:8px 12px;border-radius:6px;border:1px solid var(--border);background:var(--hover-bg-subtle);color:var(--text-secondary);font-family:"Segoe UI",system-ui,sans-serif;font-size:10px;cursor:pointer;transition:all .15s}
  .spotlight-actions button:hover{background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.3);color:var(--accent-cyan)}
  .spotlight-actions button.primary{background:rgba(34,211,238,.1);border-color:rgba(34,211,238,.3);color:var(--accent-cyan);font-weight:600}
  @media(max-width:767px){
    .spotlight-card{left:8px;right:8px;bottom:56px;width:auto;max-height:50vh;border-radius:14px 14px 8px 8px}
    .spotlight-backdrop{display:none}
  }
  /* ── Light theme: component overrides for white-alpha values ── */
  [data-theme="light"] .dock-btn{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.06)}
  [data-theme="light"] .dock-btn:hover{background:var(--hover-bg-strong);border-color:rgba(0,0,0,.12)}
  [data-theme="light"] .dock-toolbar{border-color:var(--border)}
  [data-theme="light"] .sec-hdr:hover{background:rgba(0,0,0,.04)}
  [data-theme="light"] .sec-body{background:rgba(0,0,0,.02)}
  [data-theme="light"] .rpt-preset,
  [data-theme="light"] .compliance-chip,
  [data-theme="light"] .comp-view-toggle,
  [data-theme="light"] .dash-nav-btn,
  [data-theme="light"] .dash-close,
  [data-theme="light"] .spotlight-close,
  [data-theme="light"] .spotlight-actions button,
  [data-theme="light"] .dd-status-badge.unchanged{background:rgba(0,0,0,.04)}
  [data-theme="light"] .fw-dash-pill[data-type="all"].active,
  [data-theme="light"] .comp-sev-pill[data-sev="ALL"],
  [data-theme="light"] .budr-pill[data-tier="all"],
  [data-theme="light"] .diff-cat-pill[data-cat="all"].active{background:rgba(0,0,0,.08)}
  [data-theme="light"] .diff-cat-pill[data-cat="unchanged"]{background:rgba(0,0,0,.03);border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .diff-cat-pill[data-cat="all"]{background:rgba(0,0,0,.06);border-color:rgba(0,0,0,.12)}
  [data-theme="light"] .budr-res:hover,
  [data-theme="light"] .rpt-mod-card:hover,
  [data-theme="light"] .comp-resource-card:hover{border-color:rgba(0,0,0,.12)}
  [data-theme="light"] .budr-findings,
  [data-theme="light"] .fw-findings-section .fw-finding-item{border-color:rgba(0,0,0,.06)}
  [data-theme="light"] .spotlight-close:hover,
  [data-theme="light"] .dash-pill:hover{background:rgba(0,0,0,.08)}
  [data-theme="light"] .dp-sub{background:rgba(0,0,0,.02);border-color:rgba(0,0,0,.08)}
  /* ── Light theme: dock sizing + contrast ──────────────────── */
  [data-theme="light"] .dock-btn,
  [data-theme="light"] #bottomToolbar button{font-size:12px;font-weight:600;height:36px;padding:0 14px}
  [data-theme="light"] .dock-btn svg{width:15px;height:15px}
  [data-theme="light"] .dock-label{font-size:9px;opacity:.8}
  [data-theme="light"] .dock-group:not(:last-child)::after{background:rgba(0,0,0,.12)}
  [data-theme="light"] .dock-btn.green{color:#047857;border-color:rgba(4,120,87,.2)}
  [data-theme="light"] .dock-btn.green:hover{background:rgba(4,120,87,.1);border-color:rgba(4,120,87,.3)}
  [data-theme="light"] .dock-btn.cyan{color:#0e7490;border-color:rgba(14,116,144,.2)}
  [data-theme="light"] .dock-btn.cyan:hover{background:rgba(14,116,144,.1);border-color:rgba(14,116,144,.3)}
  [data-theme="light"] .dock-btn.pink{color:#be185d;border-color:rgba(190,24,93,.2)}
  [data-theme="light"] .dock-btn.pink:hover{background:rgba(190,24,93,.1);border-color:rgba(190,24,93,.3)}
  [data-theme="light"] .dock-btn.red{color:#dc2626;border-color:rgba(220,38,38,.2)}
  [data-theme="light"] .dock-btn.red:hover{background:rgba(220,38,38,.1);border-color:rgba(220,38,38,.3)}
  [data-theme="light"] .dock-btn.purple{color:#6d28d9;border-color:rgba(109,40,217,.2)}
  [data-theme="light"] .dock-btn.purple:hover{background:rgba(109,40,217,.1);border-color:rgba(109,40,217,.3)}
  [data-theme="light"] .dock-btn.amber{color:#b45309;border-color:rgba(180,83,9,.2)}
  [data-theme="light"] .dock-btn.amber:hover{background:rgba(180,83,9,.1);border-color:rgba(180,83,9,.3)}
  /* ── Light theme: banners ───────────────────────────────────── */
  [data-theme="light"] .account-merge-banner{background:linear-gradient(90deg,#ede9fe,#dbeafe);color:#6d28d9;border-color:rgba(109,40,217,.3)}
  [data-theme="light"] .account-merge-banner button{background:rgba(109,40,217,.08);border-color:rgba(109,40,217,.25);color:#6d28d9}
  [data-theme="light"] .history-banner{background:linear-gradient(90deg,#fef3c7,#fde68a);color:#92400e;border-color:rgba(180,83,9,.3)}
  [data-theme="light"] .diff-banner{background:linear-gradient(90deg,#d1fae5,#a7f3d0);color:#047857;border-color:rgba(4,120,87,.3)}
  [data-theme="light"] .flow-banner{background:linear-gradient(90deg,#cffafe,#a5f3fc);color:#0e7490;border-color:rgba(14,116,144,.3)}
  [data-theme="light"] .history-banner button,.diff-banner button,.flow-banner button{background:rgba(0,0,0,.06);color:inherit}
  /* ── Light theme: SVG overrides ─────────────────────────────── */
  [data-theme="light"] #mapSvg{background:var(--bg-primary)}
  [data-theme="light"] .subnet-label{fill:var(--text-primary)}
  [data-theme="light"] .subnet-cidr{fill:var(--text-secondary)}
  [data-theme="light"] .subnet-badge{fill:var(--text-secondary)}
  [data-theme="light"] .comp-badge text{fill:var(--text-primary)}
  [data-theme="light"] .gw-label-bg{fill:rgba(228,232,238,.94)!important}
  [data-theme="light"] .route-label-bg{fill:rgba(228,232,238,.94)!important}
  [data-theme="light"] .note-label-bg{fill:rgba(228,232,238,.96)!important}
  /* ── Light theme: dock toolbar ────────────────────────────── */
  [data-theme="light"] .dock-toolbar{box-shadow:0 8px 32px var(--shadow-color),0 0 0 1px rgba(0,0,0,.06) inset}
  [data-theme="light"] .dock-btn{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .dock-btn:hover{border-color:rgba(0,0,0,.15)}
  [data-theme="light"] .dock-btn.orange{color:#b45309;border-color:rgba(180,83,9,.2)}
  [data-theme="light"] .dock-btn.orange:hover{background:rgba(180,83,9,.1);border-color:rgba(180,83,9,.3)}
  [data-theme="light"] .dock-btn.mint{color:#047857;border-color:rgba(4,120,87,.2)}
  [data-theme="light"] .dock-btn.mint:hover{background:rgba(4,120,87,.1);border-color:rgba(4,120,87,.3)}
  [data-theme="light"] .dock-btn.help{color:#0e7490;border-color:rgba(14,116,144,.25)}
  [data-theme="light"] .account-color-dot{border-color:rgba(0,0,0,.15)}
  [data-theme="light"] .merge-acct-chip{border-color:rgba(0,0,0,.15)}
  [data-theme="light"] .merge-acct-chip:hover{border-color:rgba(0,0,0,.3)}
  /* ── Light theme: dark overlay panels ─────────────────────── */
  [data-theme="light"] .stat-chip{background:rgba(0,0,0,.05)}
  [data-theme="light"] .hl-locked-indicator{background:rgba(228,232,238,.95)}
  [data-theme="light"] .hl-locked-indicator:hover{background:rgba(220,225,232,1)}
  [data-theme="light"] .loading-overlay{background:rgba(228,232,238,.85)}
  [data-theme="light"] .gov-rules-overlay{background:rgba(228,232,238,.92)}
  [data-theme="light"] .timeline-bar{background:rgba(228,232,238,.95)}
  [data-theme="light"] .fa-dash-overlay{background:rgba(228,232,238,.95)}
  [data-theme="light"] .rpt-preview-frame{background:var(--bg-card)}
  /* ── Light theme: white-alpha → black-alpha conversions ──── */
  [data-theme="light"] .fw-dash-pill{background:rgba(0,0,0,.05)}
  [data-theme="light"] .compliance-chip:hover{background:rgba(0,0,0,.05)}
  [data-theme="light"] .budr-res-hdr .br-type{background:rgba(0,0,0,.06)}
  [data-theme="light"] .comp-rc-header .rc-count{background:rgba(0,0,0,.06)}
  [data-theme="light"] .gov-table th:hover,
  [data-theme="light"] .gov-table tbody tr:hover,
  [data-theme="light"] .gov-rule-row:hover{background:rgba(0,0,0,.03)}
  [data-theme="light"] .gov-preview-sample-row{border-color:rgba(0,0,0,.06)}
  [data-theme="light"] .rpt-preset{background:rgba(0,0,0,.04)}
  [data-theme="light"] .comp-view-toggle{background:rgba(0,0,0,.04)}
  [data-theme="light"] .dep-node{background:rgba(0,0,0,.02)}
  [data-theme="light"] .dep-node:hover{background:rgba(0,0,0,.06)}
  [data-theme="light"] .flow-step{background:rgba(0,0,0,.02)}
  [data-theme="light"] .flow-leg-hdr:hover{background:rgba(0,0,0,.06)}
  [data-theme="light"] .flow-wp-chip{background:rgba(0,0,0,.05)}
  [data-theme="light"] .fa-path-item{background:rgba(0,0,0,.02)}
  [data-theme="light"] .fa-path-item:hover{background:rgba(0,0,0,.06)}
  [data-theme="light"] .fa-dash-table tr:hover td{background:rgba(0,0,0,.03)}
  [data-theme="light"] .fa-dash-table .fa-section-divider td{border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .dash-nav-btn:hover{background:rgba(0,0,0,.05)}
  [data-theme="light"] .dash-pill{background:rgba(0,0,0,.05)}
  [data-theme="light"] .dash-close kbd{background:rgba(0,0,0,.06);border-color:rgba(0,0,0,.1)}
  [data-theme="light"] .spotlight-close{background:rgba(0,0,0,.04)}
  [data-theme="light"] .spotlight-actions{background:rgba(0,0,0,.03)}
  /* ── Light theme: dark border conversions (rgba 30,45,74) ── */
  [data-theme="light"] .sec-hdr:hover{background:rgba(0,0,0,.05)}
  [data-theme="light"] .dp-sec-hdr:hover{background:rgba(0,0,0,.04)}
  [data-theme="light"] .dp-row{border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .dp-sub-item{border-color:rgba(0,0,0,.06)}
  [data-theme="light"] .fw-legend{border-color:rgba(0,0,0,.1)}
  [data-theme="light"] .fw-dash table td,
  [data-theme="light"] .fw-dash-table td{border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .change-log-item{border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .finding-row{border-color:rgba(0,0,0,.06)}
  [data-theme="light"] .comp-table td{border-color:rgba(0,0,0,.08)}
  [data-theme="light"] .dp-diff-change{border-color:rgba(0,0,0,.1)}
  [data-theme="light"] .diff-dash-table td{border-color:rgba(0,0,0,.1)}
  [data-theme="light"] .dd-expand-cell{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.1)}
  /* ── Light theme: SVG text fills ──────────────────────────── */
  [data-theme="light"] .subnet-label{fill:var(--text-primary)!important}
  [data-theme="light"] .subnet-cidr{fill:var(--text-secondary)!important}
  [data-theme="light"] .subnet-badge{fill:var(--text-secondary)!important}
  [data-theme="light"] .gw-label{fill:currentColor}
  [data-theme="light"] .comp-badge text{fill:var(--text-primary)!important}
  [data-theme="light"] .note-cat-badge.cat-owner{background:rgba(37,99,235,.12);color:#1d4ed8}
  [data-theme="light"] .note-cat-badge.cat-status{background:rgba(5,150,105,.12);color:#047857}
  [data-theme="light"] .note-cat-badge.cat-incident{background:rgba(220,38,38,.12);color:#b91c1c}
  [data-theme="light"] .note-cat-badge.cat-todo{background:rgba(202,138,4,.12);color:#a16207}
  [data-theme="light"] .note-cat-badge.cat-info{background:rgba(8,145,178,.12);color:#0e7490}
  [data-theme="light"] .note-cat-badge.cat-warning{background:rgba(234,88,12,.12);color:#c2410c}