:root {
  --navy: #071638;
  --ink: #0b183a;
  --muted: #60729b;
  --line: #dbe6fa;
  --line-strong: #bed1f3;
  --surface: rgba(255,255,255,.94);
  --soft: #f4f8ff;
  --electric: #075fff;
  --electric-2: #00a2ff;
  --cyan: #16d6ff;
  --green: #09b980;
  --red: #f53262;
  --orange: #f79b1e;
  --violet: #7a42f4;
  --sidebar: 246px;
  --shadow: 0 16px 44px rgba(23, 80, 166, .1);
}

* { box-sizing: border-box; }
html { background: #f7faff; scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background: #f7faff;
  font-family: Inter, "Noto Sans Thai", "Leelawadee UI", "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(7,95,255,.22);
  outline-offset: 2px;
}
svg { width: 1em; height: 1em; flex: 0 0 auto; }

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--sidebar) minmax(0,1fr);
  background:
    radial-gradient(circle at 72% 0%, rgba(13,106,255,.07), transparent 27rem),
    linear-gradient(180deg, #fbfdff, #f4f8ff);
}
.ambient-grid {
  position: fixed; inset: 0; pointer-events: none; opacity: .32;
  background-image: linear-gradient(rgba(51,108,199,.035) 1px, transparent 1px), linear-gradient(90deg,rgba(51,108,199,.035) 1px,transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, black, transparent 75%);
}
.ambient-glow {
  position: fixed; z-index: 0; width: 640px; height: 640px; top: -420px; left: 42%;
  border-radius: 50%; pointer-events: none;
  background: rgba(0,144,255,.14); filter: blur(80px);
}

.brand { display:flex; align-items:center; gap:11px; white-space:nowrap; }
.brand-shield {
  width:43px; height:46px; display:grid; place-items:center; color:white;
  background: linear-gradient(150deg,#0b76ff,#0539c9);
  clip-path: polygon(50% 0,94% 14%,88% 72%,50% 100%,12% 72%,6% 14%);
  filter: drop-shadow(0 8px 10px rgba(0,86,255,.2));
}
.brand strong { display:block; font-size:20px; letter-spacing:-.7px; line-height:1; }
.brand strong span { color:var(--electric); }
.brand small { display:block; margin-top:5px; color:#3a69ca; font-size:9px; font-weight:800; letter-spacing:1.2px; }
.brand-compact .brand-shield { width:34px; height:36px; }
.brand-compact > div:last-child { display:none; }

.sidebar {
  position:fixed; z-index:40; inset:0 auto 0 0; width:var(--sidebar);
  display:flex; flex-direction:column; min-height:100vh; padding:15px 12px 12px;
  border-right:1px solid var(--line);
  background:rgba(255,255,255,.91);
  backdrop-filter: blur(20px) saturate(1.2);
  transition:width .24s cubic-bezier(.2,.8,.2,1), transform .24s ease;
}
.sidebar-top { display:flex; min-height:61px; align-items:center; justify-content:space-between; padding:2px 7px 13px 8px; }
.sidebar-collapse,.mobile-close {
  width:30px;height:30px;border:0;border-radius:9px;background:transparent;color:#7890ba;cursor:pointer;
}
.sidebar-collapse:hover,.mobile-close:hover { color:var(--electric); background:#eef4ff; }
.mobile-close { display:none; }
.sidebar nav { flex:1; overflow-y:auto; scrollbar-width:thin; padding-right:2px; }
.nav-group { margin:12px 0 17px; }
.nav-group > span { display:block; padding:0 10px 7px; color:#7390c2; font-size:9px; font-weight:900; letter-spacing:1.15px; }
.nav-group button {
  position:relative; width:100%; min-height:39px; display:flex; align-items:center; gap:11px;
  padding:0 11px; margin:2px 0; border:1px solid transparent; border-radius:10px;
  background:transparent; color:#314a7d; cursor:pointer; transition:.18s ease;
}
.nav-group button svg { width:17px; height:17px; stroke-width:1.9; }
.nav-group button em { font-size:12.5px; font-weight:650; font-style:normal; }
.nav-group button:hover { color:var(--electric); background:#f1f6ff; transform:translateX(2px); }
.nav-group button.active {
  color:var(--electric); border-color:#dce8fc;
  background:linear-gradient(90deg,#edf4ff,#f8fbff);
  box-shadow:0 8px 18px rgba(21,96,222,.07);
}
.nav-group button.active i { position:absolute; left:-12px; width:3px; height:21px; border-radius:0 3px 3px 0; background:var(--electric); box-shadow:0 0 13px var(--electric-2); }
.sidebar-ai {
  position:relative; overflow:hidden; display:flex; align-items:center; gap:9px; min-height:82px;
  padding:9px; border:1px solid #cfddf7; border-radius:13px; background:linear-gradient(135deg,#f8fbff,#eaf3ff);
  cursor:pointer; text-align:left; box-shadow:0 10px 25px rgba(20,90,188,.08);
}
.sidebar-ai::after { content:""; position:absolute; width:80px;height:80px;right:-45px;top:-50px;border:1px solid #96c9ff;border-radius:50%;box-shadow:0 0 0 12px rgba(19,109,255,.05),0 0 0 24px rgba(19,109,255,.025); }
.sidebar-ai:hover { border-color:#8ebcff; transform:translateY(-1px); }
.ai-avatar-crop {
  width:46px;height:59px;flex:0 0 auto;border-radius:10px;
  background-image:url('/assets/cherry-defense.png');
  background-size:304% auto;background-position:50.5% 25%;background-repeat:no-repeat;
  box-shadow:inset 0 0 0 1px rgba(70,127,231,.15);
}
.sidebar-ai div:nth-child(2) { min-width:0; }
.sidebar-ai div:nth-child(2)>span { display:block; white-space:nowrap; font-size:10.5px; font-weight:800; }
.sidebar-ai b,.new-badge { padding:2px 5px;border-radius:5px;background:var(--electric);color:white;font-size:7px; }
.sidebar-ai small { display:block; margin-top:5px; color:var(--muted); font-size:9px; }
.sidebar-ai>svg { width:15px;color:var(--electric); }
.sidebar-version { display:flex; align-items:center; justify-content:space-between; padding:11px 6px 0;color:#6d80a8;font-size:9px; }

.sidebar-collapsed { --sidebar:76px; }
.sidebar-collapsed .sidebar { padding-inline:10px; }
.sidebar-collapsed .sidebar-top { justify-content:center; }
.sidebar-collapsed .sidebar-collapse { display:none; }
.sidebar-collapsed .nav-group>span,.sidebar-collapsed .nav-group button em,.sidebar-collapsed .sidebar-version,.sidebar-collapsed .sidebar-ai div:nth-child(n+2) { display:none; }
.sidebar-collapsed .nav-group button { justify-content:center;padding:0; }
.sidebar-collapsed .sidebar-ai { padding:6px;justify-content:center; }
.sidebar-collapsed .ai-avatar-crop { width:44px; }

.app-main { position:relative; z-index:1; min-width:0; grid-column:2; }
.topbar {
  position:sticky; z-index:30; top:0; height:76px; display:flex; align-items:center; gap:25px;
  padding:0 24px; border-bottom:1px solid var(--line); background:rgba(252,254,255,.85); backdrop-filter:blur(22px) saturate(1.25);
}
.topbar-left { min-width:250px; display:flex;align-items:center;gap:10px; }
.topbar-left h1 { margin:0;color:var(--ink);font-size:18px;letter-spacing:-.4px; }
.topbar-left p { margin:4px 0 0;color:#6d80a7;font-size:10px; }
.mobile-menu { display:none;width:36px;height:36px;border:0;border-radius:10px;background:#eef4ff;color:var(--electric); }
.topbar-center { flex:1;display:flex;justify-content:center;gap:16px; }
.core-status,.global-search {
  height:39px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.76);color:#5a6f99;
  display:flex;align-items:center;gap:8px;padding:0 12px;cursor:pointer;font-size:10px;box-shadow:0 5px 18px rgba(29,80,150,.04);
}
.core-status>i { width:7px;height:7px;background:#08ba82;border-radius:50%;box-shadow:0 0 0 5px rgba(8,186,130,.1),0 0 12px rgba(8,186,130,.55);animation:pulse-core 2s infinite; }
.core-status>b { width:1px;height:18px;background:var(--line); }
.core-status strong { color:#2b5fbe;font-weight:750; }
.global-search { min-width:300px;justify-content:flex-start; }
.global-search svg { width:16px; }
.global-search span { flex:1;text-align:left;color:#8295b9; }
kbd { padding:3px 6px;border:1px solid #d5e0f3;border-radius:6px;background:#f8fbff;color:#7990b8;font:9px ui-monospace,monospace;box-shadow:inset 0 -1px #d9e5f6; }
.topbar-right { display:flex;align-items:center;gap:9px; }
.icon-button {
  width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;color:#45608f;cursor:pointer;transition:.16s;
}
.icon-button:hover { color:var(--electric);border-color:#a8c7ff;background:#f4f8ff;transform:translateY(-1px); }
.icon-button svg { width:17px;height:17px; }
.notification-button { position:relative; }
.notification-button>i { position:absolute;top:-5px;right:-4px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#f51f52;color:#fff;font-size:8px;font-style:normal;font-weight:800;border:2px solid white; }
.profile-wrap { position:relative; }
.profile-button { height:44px;border:0;background:transparent;display:flex;align-items:center;gap:10px;cursor:pointer;padding:0 2px 0 7px; }
.profile-button>div { text-align:right; }
.profile-button strong { display:block;font-size:11px; }
.profile-button span { display:block;margin-top:3px;color:#5271aa;font-size:9px; }
.profile-button>b { display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,#eaf2ff,#f7faff);color:var(--electric);font-size:11px;border:1px solid #dbe7fb; }
.profile-button>svg { width:13px; }
.profile-menu,.notifications-popover {
  position:absolute;z-index:60;top:52px;right:0;width:220px;padding:8px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 22px 55px rgba(23,62,126,.18);animation:popover-in .16s ease both;
}
.profile-menu button { width:100%;display:flex;align-items:center;gap:9px;border:0;border-radius:8px;background:transparent;padding:10px;color:#42567e;text-align:left;font-size:11px;cursor:pointer; }
.profile-menu button:hover { background:#f1f6ff;color:var(--electric); }
.profile-menu svg { width:15px; }
.notifications-popover { top:66px;right:185px;width:360px;padding:0; }
.notifications-popover header { display:flex;justify-content:space-between;align-items:center;padding:14px 15px;border-bottom:1px solid var(--line); }
.notifications-popover header strong { font-size:13px; }
.notifications-popover header button { border:0;background:transparent;cursor:pointer; }
.notifications-popover>div { display:flex;gap:10px;padding:13px 15px;border-bottom:1px solid #ebf1fb; }
.notif-icon { width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#ebf3ff;color:var(--electric); }
.notif-icon.warning { background:#fff4df;color:var(--orange); }.notif-icon.danger { background:#fff0f4;color:var(--red); }
.notif-icon svg { width:15px; }
.notifications-popover p { margin:0;font-size:10px;line-height:1.4; }
.notifications-popover p strong,.notifications-popover p small { display:block; }
.notifications-popover p small { margin-top:4px;color:var(--muted);font-size:8.5px; }
.popover-footer { width:100%;padding:12px;border:0;background:#f7faff;color:var(--electric);font-size:10px;font-weight:700;cursor:pointer; }

.workspace { max-width:1680px;margin:0 auto;padding:14px 24px 36px; }
.page-header { min-height:42px;display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:13px; }
.breadcrumb { display:flex;align-items:center;gap:7px;color:#50658f;font-size:9.5px; }
.breadcrumb>span:first-child { color:#8b9aba; }
.breadcrumb>svg { width:11px; }
.page-actions { display:flex;align-items:center;gap:8px; }
.button,.select-button {
  min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px;
  border:1px solid var(--line-strong);border-radius:9px;background:#fff;color:#315384;font-size:10.5px;font-weight:750;cursor:pointer;transition:.17s ease;
}
.button:hover,.select-button:hover { transform:translateY(-1px);border-color:#8eb5ff;box-shadow:0 8px 18px rgba(12,82,204,.09); }
.button svg,.select-button svg { width:15px; }
.button.primary { color:#fff;border-color:transparent;background:linear-gradient(110deg,#065cff,#087dff);box-shadow:0 9px 20px rgba(5,96,255,.19); }
.button.primary:hover { background:linear-gradient(110deg,#0755ea,#00a2ff); }
.button.secondary { background:#fff; }
.button.full { width:100%; }
.button.small { min-height:31px;padding:0 10px;font-size:9.5px; }
.button:disabled { opacity:.55;cursor:not-allowed;transform:none; }
.deploy-button { color:white;border-color:#0b5cff;background:linear-gradient(110deg,#0c61f4,#006fff); }
.deploy-button i { display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#ff315f;font-size:8px;font-style:normal; }
.link-button { display:inline-flex;align-items:center;gap:4px;border:0;background:transparent;color:var(--electric);font-size:9.5px;font-weight:750;cursor:pointer; }
.route-content { animation:route-enter .32s cubic-bezier(.2,.8,.2,1) both; }
.stack { display:grid;gap:13px; }
.page-grid { display:grid;grid-template-columns:1.03fr 1.38fr .9fr;gap:13px; }
.span-full { grid-column:1/-1; }
.reveal { animation:reveal .42s both; }
.page-grid>.reveal:nth-child(2){animation-delay:.04s}.page-grid>.reveal:nth-child(3){animation-delay:.08s}.page-grid>.reveal:nth-child(4){animation-delay:.12s}
.metrics-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }
.metric-card {
  position:relative;overflow:hidden;min-height:107px;display:flex;align-items:flex-start;gap:12px;
  padding:17px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 10px 30px rgba(29,84,163,.06);
}
.metric-card::after { content:"";position:absolute;width:82px;height:82px;right:-50px;top:-49px;border:1px solid #b5d1ff;border-radius:50%;box-shadow:0 0 0 11px rgba(12,101,255,.025),0 0 0 22px rgba(12,101,255,.012); }
.metric-icon { width:39px;height:39px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:#eaf2ff;color:var(--electric); }
.tone-mint,.metric-icon.tone-mint { background:#e5faf3;color:var(--green); }.tone-pink,.metric-icon.tone-pink { background:#fff0f4;color:var(--red); }.tone-amber,.metric-icon.tone-amber { background:#fff4e2;color:var(--orange); }.tone-violet,.metric-icon.tone-violet { background:#f1eaff;color:var(--violet); }.tone-blue { background:#eaf2ff;color:var(--electric); }
.metric-copy { min-width:0;flex:1; }
.metric-copy>span { display:block;font-size:9.5px;font-weight:650;color:#31466f;white-space:nowrap; }
.metric-copy>strong { display:block;margin-top:5px;color:#07173a;font-size:23px;letter-spacing:-.8px;line-height:1.1; }
.metric-copy>strong small { margin-left:4px;font-size:10px;letter-spacing:0; }
.metric-copy>em { display:flex;align-items:center;gap:3px;margin-top:6px;color:var(--green);font-size:8.5px;font-style:normal;white-space:nowrap; }
.metric-copy>em.negative { color:var(--green); }
.sparkline { align-self:flex-end;width:82px;height:32px;color:var(--electric);overflow:visible; }
.sparkline polyline { stroke-dasharray:200;stroke-dashoffset:200;animation:draw-line 1.1s .18s ease forwards; }
.sparkline circle { opacity:0;animation:fade-in .2s 1.15s forwards; }
.spark-red{color:var(--red)}.spark-green{color:var(--green)}.spark-orange{color:var(--orange)}.spark-violet{color:var(--violet)}

.panel { min-width:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 11px 34px rgba(26,76,145,.055);overflow:hidden; }
.panel-head { min-height:49px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px 10px; }
.panel-head h2 { margin:0;font-size:12.5px;letter-spacing:-.1px; }
.panel-head p { margin:3px 0 0;color:var(--muted);font-size:8.5px; }
.panel-action { display:flex;align-items:center;gap:7px; }
.panel-footer-button { width:calc(100% - 28px);height:32px;margin:0 14px 13px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--electric);padding:0 10px;font-size:9.5px;font-weight:700;cursor:pointer; }
.new-badge { font-size:8px;letter-spacing:.3px; }

.posture-content { display:flex;align-items:center;gap:17px;padding:10px 17px 15px; }
.donut {
  width:126px;height:126px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;
  background:conic-gradient(var(--electric) calc(var(--value)*1%),#e7eef9 0);
  animation:donut-in .9s ease both;
}
.donut::before { content:"";grid-area:1/1;width:96px;height:96px;border-radius:50%;background:white;box-shadow:inset 0 0 18px rgba(28,83,171,.05); }
.donut>div { grid-area:1/1;z-index:1;text-align:center; }
.donut strong,.donut span { display:block; }.donut strong{font-size:22px;letter-spacing:-1px}.donut span{margin-top:3px;color:var(--electric);font-size:9px;font-weight:800}
.posture-list { flex:1;display:grid;gap:5px; }
.posture-list>div,.tls-list>div { display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;background:#f8faff;font-size:8.5px; }
.posture-list svg,.tls-list svg { width:13px;color:var(--green); }.posture-list .warn svg,.tls-list .warn svg{color:var(--orange)}.posture-list .danger svg,.tls-list .danger svg{color:var(--red)}
.posture-list strong,.tls-list strong { font-size:9px; }

.traffic-chart-panel { min-height:280px; }
.chart-legend { display:flex;justify-content:center;gap:18px;color:#526889;font-size:8px; }
.chart-legend span { display:flex;align-items:center;gap:5px; }.chart-legend i{width:10px;height:2px}.blue-dot{background:var(--electric)}.red-dot{background:var(--red)}
.traffic-chart { display:block;width:100%;height:151px;padding:5px 16px 0;overflow:visible; }
.grid-line { stroke:#e4ebf7;stroke-width:1; }
.chart-line { fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:900;stroke-dashoffset:900;animation:draw-line 1.5s .15s ease forwards; }
.chart-line.requests { stroke:var(--electric); }.chart-line.blocked{stroke:var(--red);animation-delay:.35s}
.point { fill:white;stroke:var(--electric);stroke-width:2; }
.chart-stats { display:grid;grid-template-columns:repeat(3,1fr);padding:7px 16px 13px; }
.chart-stats>div { padding-left:14px;border-left:1px solid var(--line); }
.chart-stats>div:first-child { padding-left:0;border:0; }
.chart-stats span,.chart-stats strong,.chart-stats em { display:block; }.chart-stats span{font-size:8px;color:var(--muted)}.chart-stats strong{margin-top:5px;font-size:15px}.chart-stats em{margin-top:-13px;margin-left:58px;color:var(--green);font-size:8px;font-style:normal}

.assistant-card { padding:0 13px 13px;background:linear-gradient(145deg,#fff,#f2f7ff); }
.assistant-card .panel-head { padding-inline:2px; }
.assistant-orb { position:relative;width:60px;height:60px;margin:0 auto 4px;display:grid;place-items:center;color:white;border-radius:44% 56% 52% 48%;background:linear-gradient(145deg,#dceaff,#fff);box-shadow:0 8px 25px rgba(25,99,234,.18),inset 0 0 0 1px #c7dcff; }
.assistant-orb svg { z-index:1;color:var(--electric); }
.assistant-orb::before { content:"";position:absolute;inset:12px;border-radius:50%;background:linear-gradient(135deg,#102a69,#0875ff);box-shadow:0 0 14px #168cff; }
.assistant-orb span { position:absolute;width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:orbit 3s linear infinite; }
.assistant-orb span:last-child { animation-delay:-1.5s; }
.assistant-copy { text-align:center; }.assistant-copy strong{font-size:10px}.assistant-copy p{margin:5px auto 9px;color:var(--muted);font-size:8px;line-height:1.45;max-width:250px}
.recommendation-list { display:grid;gap:5px;padding:8px;border:1px solid #e4ecfa;border-radius:9px;background:rgba(255,255,255,.7); }
.recommendation-list>div { display:grid;grid-template-columns:15px 1fr auto;gap:5px;align-items:center;font-size:8px; }
.recommendation-list svg { color:var(--green); }.recommendation-list em{font-style:normal;color:var(--electric);font-size:7px}.recommendation-list .high{color:var(--red)}.recommendation-list .medium{color:var(--orange)}
.assistant-card .button { margin-top:8px; }

.events-panel { grid-column:1/3; }
.table-wrap { overflow-x:auto; }
table { width:100%;border-collapse:collapse;min-width:650px; }
th,td { padding:10px 13px;border-top:1px solid #e7eef9;text-align:left;vertical-align:middle; }
th { color:#7084a8;background:#fbfdff;font-size:7.5px;text-transform:uppercase;letter-spacing:.45px; }
td { font-size:8.8px;color:#314b78; }
tbody tr { transition:.14s; }.table-wrap tbody tr:hover{background:#f6f9ff}
td small { color:var(--muted);font-size:7.5px; }
.severity { font-size:7.5px;font-weight:750; }.severity.critical{color:var(--red)}.severity.high{color:#f04a48}.severity.medium{color:var(--orange)}.severity.low{color:var(--electric)}
.action-state { display:inline-flex;align-items:center;gap:4px;font-size:7.5px;font-weight:700; }.action-state.blocked{color:var(--red)}.action-state.challenged{color:var(--electric)}
.mono,code { font-family:"SFMono-Regular",Consolas,monospace; }

.map-panel { grid-column:3; }
.world-map { position:relative;height:132px;margin:0 13px;overflow:hidden;border-radius:10px;background:radial-gradient(circle at 53% 50%,rgba(0,132,255,.14),transparent 42%),linear-gradient(145deg,#eef5ff,#fbfdff); }
.map-grid { position:absolute;inset:0;opacity:.45;background-image:radial-gradient(circle,#78aef9 1px,transparent 1.3px);background-size:11px 11px;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 400'%3E%3Cpath fill='black' d='M61 77l79-33 76 8 56 47 14 55-29 25-53-24-40 16-36-30-50 5-45-25zm252 62l35-49 60-14 51 37 25 66-36 39-12 87-52 44-38-70-18-66zm214-44l74-40 108 28 36 57-38 45-83-3-33 38-48-45-31-38zm109 172l61-23 59 21 13 45-45 28-65-12-29-36z'/%3E%3C/svg%3E");mask-repeat:no-repeat;mask-size:100% 100%; }
.attack-node { position:absolute;z-index:3;display:flex;align-items:center;gap:3px;color:#3e5f94;font-size:6px;font-weight:800; }
.attack-node i { width:6px;height:6px;border:2px solid #fff;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px rgba(245,50,98,.15),0 0 12px var(--red);animation:node-pulse 2s infinite; }
.map-core { position:absolute;z-index:4;left:53%;top:50%;transform:translate(-50%,-50%);width:35px;height:35px;display:grid;place-items:center;color:white;border:2px solid white;border-radius:50%;background:var(--electric);box-shadow:0 0 0 7px rgba(7,95,255,.12),0 0 25px rgba(7,95,255,.36); }
.beam { position:absolute;z-index:2;height:1px;left:53%;top:50%;transform-origin:left;background:linear-gradient(90deg,var(--electric),transparent);animation:beam 1.8s infinite; }.beam-a{width:35%;transform:rotate(-148deg)}.beam-b{width:31%;transform:rotate(-24deg);animation-delay:-.8s}.beam-c{width:28%;transform:rotate(145deg);animation-delay:-1.2s}
.country-list { display:grid;gap:0;padding:7px 14px 11px; }.country-list>div{display:flex;justify-content:space-between;padding:4px 0;font-size:7.5px}.country-list strong{color:#2d4c82}

.tls-health { display:flex;align-items:center;gap:15px;padding:11px 15px 13px; }
.tls-ring { width:108px;height:108px;flex:0 0 auto;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--green);border:11px solid var(--green);box-shadow:0 0 0 5px #e8faf4,inset 0 0 16px rgba(10,185,128,.1); }
.tls-ring strong { margin-top:5px;font-size:10px; }.tls-list{flex:1;display:grid;gap:5px}

.toolbar { min-height:57px;display:flex;align-items:center;gap:8px;padding:10px 13px;border-bottom:1px solid var(--line); }
.toolbar.right { justify-content:flex-end; }.search-field { min-width:230px;height:35px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#8a9abb; }
.search-field.wide { flex:1; }.search-field svg{width:15px}.search-field input{width:100%;border:0;outline:0;color:var(--ink);font-size:9.5px;background:transparent}.search-field input::placeholder{color:#93a5c7}
.select-button { min-height:35px;font-weight:600; }.toolbar .icon-button{height:35px}
.applications-layout,.users-layout { display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:13px;align-items:start; }
.apps-table-panel { min-width:0; }
.cell-title { display:flex;align-items:center;gap:8px; }.cell-title>svg{color:var(--electric)}.cell-title strong,.cell-title small{display:block}.cell-title small{margin-top:3px}
.block { display:block;margin-top:3px; }.inline-good,.inline-muted{display:inline-flex;align-items:center;gap:4px;color:var(--green);font-size:8px}.inline-muted{color:#8999b5}
.policy-chip,.role-chip { display:inline-flex;align-items:center;gap:4px;padding:4px 6px;border:1px solid #d4e1f5;border-radius:6px;background:#f6f9ff;color:#3162b4;font-size:7.5px;white-space:nowrap; }
td .sparkline { width:46px;height:18px;display:inline-block;vertical-align:middle;margin-right:6px; }
.selected-row { position:relative;background:#f4f8ff;box-shadow:inset 2px 0 var(--electric); }
.status-chip { display:inline-flex;align-items:center;gap:5px;padding:4px 7px;border:1px solid;border-radius:999px;font-size:7px;font-weight:800;white-space:nowrap; }
.status-chip i { width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor; }
.status-green{color:#05996d;border-color:#b9ead9;background:#effbf7}.status-blue{color:#216ce8;border-color:#c9ddff;background:#f1f6ff}.status-orange{color:#d77b02;border-color:#f9d9a8;background:#fff8ed}.status-red{color:#e52a55;border-color:#ffc7d4;background:#fff3f6}.status-gray{color:#71809c;border-color:#dfe5ee;background:#f7f8fa}
.table-footer { min-height:45px;display:flex;align-items:center;justify-content:space-between;padding:7px 13px;border-top:1px solid var(--line);color:var(--muted);font-size:8px; }
.table-footer>div { display:flex;gap:5px; }.pagination{width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;background:white;color:#55709f;cursor:pointer;font-size:8px}.pagination.active{border-color:var(--electric);background:var(--electric);color:#fff}
.detail-rail { display:grid;gap:11px; }
.app-detail { padding:13px; }.detail-title{display:flex;align-items:center;gap:9px}.detail-title>div:nth-child(2){min-width:0;flex:1}.detail-title h3{margin:0;font-size:11px;overflow:hidden;text-overflow:ellipsis}.detail-title span{font-size:7.5px;color:var(--muted)}.domain-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#eaf2ff;color:var(--electric)}
.definition-list { margin:12px 0;display:grid;gap:0; }.definition-list>div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #e9eff8;font-size:8px}.definition-list dt{color:var(--muted)}.definition-list dd{margin:0;font-weight:700}
.origin-list { display:grid;padding:2px 14px 12px; }.origin-list>div{display:grid;grid-template-columns:1fr auto auto;gap:9px;padding:7px 0;border-bottom:1px solid #e9eff8;font-size:8px}.origin-list span{display:flex;align-items:center;gap:5px}.origin-list span i{width:6px;height:6px;border-radius:50%;background:var(--green)}.origin-list em{color:var(--green);font-style:normal}.origin-list strong{font-size:8px}
.request-split { display:flex;align-items:center;gap:14px;padding:5px 14px 15px; }.mini-donut{width:104px;height:104px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--electric) 0 68%,var(--green) 68% 90%,var(--orange) 90% 96%,var(--red) 96%);}.mini-donut::before{content:"";grid-area:1/1;width:69px;height:69px;border-radius:50%;background:white}.mini-donut span{grid-area:1/1;z-index:1;text-align:center;color:var(--muted);font-size:7px}.mini-donut strong{display:block;color:var(--ink);font-size:12px}
.method-list{flex:1;display:grid;gap:6px;font-size:7.5px}.method-list>div{display:grid;grid-template-columns:8px 1fr auto;align-items:center}.method-list i{width:6px;height:6px;border-radius:50%;background:var(--electric)}.method-list .post{background:var(--green)}.method-list .put{background:var(--orange)}.method-list .delete{background:var(--red)}

.profile-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 13px 13px; }
.profile-card { position:relative;display:grid;grid-template-columns:38px 1fr auto;gap:9px;min-height:122px;padding:13px;border:1px solid var(--line);border-radius:10px;background:#fff;text-align:left;cursor:pointer;overflow:hidden;transition:.18s; }
.profile-card:hover,.profile-card.selected{border-color:#4d8eff;box-shadow:0 9px 24px rgba(7,95,255,.1);transform:translateY(-1px)}.profile-card.selected::after{content:"SELECTED";position:absolute;right:-21px;top:10px;transform:rotate(45deg);width:75px;background:var(--electric);color:#fff;text-align:center;font-size:6px;font-weight:900;letter-spacing:.5px}
.profile-icon{width:34px;height:36px;display:grid;place-items:center;border-radius:9px}.profile-main h3{margin:0;font-size:11px}.profile-main>span{display:inline-block;margin-top:4px;padding:2px 5px;border-radius:4px;background:#eaf2ff;color:var(--electric);font-size:6px;font-weight:800}.profile-main p{margin:8px 0 0;color:var(--muted);font-size:7.5px;line-height:1.45}.profile-stat{display:flex;gap:14px}.profile-stat span{color:var(--muted);font-size:6.5px}.profile-stat strong{display:block;margin-top:4px;color:var(--ink);font-size:11px}.severity-bar{position:absolute;bottom:0;left:0;right:0;height:3px;display:flex}.severity-bar i:nth-child(1){width:44%;background:var(--red)}.severity-bar i:nth-child(2){width:38%;background:var(--orange)}.severity-bar i:nth-child(3){flex:1;background:var(--green)}
.policy-layout { display:grid;grid-template-columns:1.12fr 1.05fr .82fr;gap:13px; }
.setting-list { display:grid;padding:0 13px 8px; }.setting-row{display:grid;grid-template-columns:30px 1fr auto auto;gap:8px;align-items:center;min-height:43px;border-bottom:1px solid #e8eef8}.setting-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:7px;background:#edf4ff;color:var(--electric)}.setting-row strong,.setting-row span{display:block}.setting-row strong{font-size:9px}.setting-row span{margin-top:2px;color:var(--muted);font-size:7px}.setting-row em{font-size:7.5px;font-style:normal;color:#4f6590}
.toggle { width:31px;height:18px;padding:2px;border:0;border-radius:99px;background:#d9e2f0;cursor:pointer;transition:.2s; }.toggle span{display:block!important;width:14px;height:14px;margin:0!important;border-radius:50%;background:white!important;box-shadow:0 1px 4px rgba(0,0,0,.16);transition:.2s}.toggle.active{background:var(--electric)}.toggle.active span{transform:translateX(13px)}
.panel-bottom-meta{display:flex;justify-content:space-between;padding:10px 13px;border-top:1px solid var(--line);color:var(--muted);font-size:7px}.panel-bottom-meta strong{color:var(--ink)}
.inspection-panel { position:relative; }
.inspection-flow { position:relative;display:flex;align-items:center;justify-content:center;gap:9px;min-height:98px;padding:7px 10px; }
.flow-stage{width:58px;text-align:center;color:#41587f;font-size:7px}.flow-stage svg{width:34px;height:34px;padding:8px;border-radius:50%;background:#f1f5fb}.flow-stage span{display:block;margin-top:5px}.flow-stage.active{position:relative;color:var(--electric);font-weight:700}.flow-stage.active svg{color:white;background:linear-gradient(145deg,#1583ff,#0750e5);box-shadow:0 0 0 7px #e7f1ff,0 0 22px rgba(7,95,255,.23)}.scan-line{position:absolute;left:8px;right:8px;top:4px;height:2px;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:scan-vertical 2s infinite}
.flow-arrow{color:#90a9d1}.flow-result{display:grid;gap:6px}.flow-result span{display:flex;align-items:center;gap:5px;font-size:7px}.flow-result svg{width:18px;height:18px;padding:4px;border-radius:50%;color:white}.flow-result .allowed svg{background:var(--green)}.flow-result .blocked svg{background:var(--red)}
.inspection-flow>.packet{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:flow-packet 2.7s linear infinite}.inspection-flow>.packet-1{left:12%;top:50%}.inspection-flow>.packet-2{left:12%;top:50%;animation-delay:-1.35s}
.inspection-steps{margin:2px 24px 8px 130px;padding:8px 10px;list-style:none;border:1px solid var(--line);border-radius:8px;background:#fbfdff}.inspection-steps li{display:grid;grid-template-columns:15px 1fr 5px;gap:5px;align-items:center;padding:3px;font-size:7px}.inspection-steps li span{color:#7c91b6}.inspection-steps li i{width:5px;height:5px;border-radius:50%;background:var(--green)}.inspection-steps li i.warn{background:var(--orange)}
.flow-legend{display:flex;justify-content:center;gap:10px;padding:8px;border-top:1px solid var(--line);font-size:6.5px;color:var(--muted)}.flow-legend span{display:flex;align-items:center;gap:4px}.flow-legend i{width:6px;height:6px;border-radius:50%}.flow-legend .green{background:var(--green)}.flow-legend .red{background:var(--red)}.flow-legend .orange{background:var(--orange)}.flow-legend .blue{background:var(--electric)}
.timeline{position:relative;padding:4px 13px 12px}.timeline::before{content:"";position:absolute;left:25px;top:13px;bottom:22px;width:1px;background:#b8cff0}.timeline>div{position:relative;display:grid;grid-template-columns:25px 1fr;gap:7px;padding:6px 0}.timeline>div>i{z-index:1;width:15px;height:15px;margin-left:5px;border:2px solid #9eb9e4;border-radius:50%;background:white}.timeline>.current>i{display:grid;place-items:center;color:white;border-color:var(--green);background:var(--green);box-shadow:0 0 0 4px #e4f8f2}.timeline>.current>i svg{width:9px}.timeline strong,.timeline p,.timeline small{display:block;margin:0}.timeline strong{font-size:8.5px}.timeline strong span{padding:2px 4px;border-radius:4px;background:#e5f8f2;color:var(--green);font-size:6px}.timeline p{margin-top:3px;color:#4c6592;font-size:7.5px}.timeline small{margin-top:2px;color:var(--muted);font-size:6.5px}
.apply-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px;padding:10px;border:1px solid #cce0ff;border-radius:9px;background:linear-gradient(90deg,#eef5ff,#f8fbff)}.apply-strip>div{display:flex;align-items:center;gap:8px;color:var(--electric);font-size:8px}.apply-strip span{color:#506890}.apply-strip strong{color:var(--ink)}

.lb-layout{display:grid;grid-template-columns:1.12fr .88fr;gap:13px}.pool-list{display:grid}.pool-card{display:grid;grid-template-columns:36px 1.25fr 1fr .55fr .55fr auto 15px;gap:10px;align-items:center;min-height:62px;padding:9px 13px;border:0;border-top:1px solid #e6edf8;background:transparent;text-align:left;cursor:pointer}.pool-card:hover{background:#f5f9ff}.pool-badge{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#eaf2ff;color:var(--electric)}.pool-name strong,.pool-name span,.pool-card small,.pool-card>div>strong{display:block}.pool-name strong,.pool-card>div>strong{font-size:8.5px}.pool-name span,.pool-card small{margin-top:3px;color:var(--muted);font-size:7px}.pool-card>svg{color:#8ba0c4}
.origin-bars{display:grid;gap:13px;padding:10px 16px}.origin-bars>div>div:first-child{display:flex;justify-content:space-between;font-size:8px}.origin-bars span{display:flex;align-items:center;gap:5px}.origin-bars span i{width:6px;height:6px;border-radius:50%;background:var(--green)}.bar{height:6px;margin-top:6px;border-radius:8px;background:#e9eff8;overflow:hidden}.bar i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--electric),var(--cyan));animation:bar-grow .8s both}
.health-check{display:flex;align-items:center;gap:14px;margin:4px 14px 14px;padding:12px;border:1px solid var(--line);border-radius:9px;background:#f8fbff}.radar{position:relative;width:62px;height:62px;display:grid;place-items:center;border:1px solid #aac8f6;border-radius:50%;background:radial-gradient(circle,rgba(7,95,255,.08),transparent)}.radar span{position:absolute;width:80%;height:80%;border:1px solid #d3e1f7;border-radius:50%}.radar span:nth-child(2){width:55%;height:55%}.radar span:nth-child(3){width:30%;height:30%}.radar::after{content:"";position:absolute;width:50%;height:2px;left:50%;background:linear-gradient(90deg,var(--electric),transparent);transform-origin:left;animation:radar-spin 2.5s linear infinite}.radar svg{z-index:2;color:var(--green)}.health-check strong{font-size:9px}.health-check p{margin:4px 0 7px;color:var(--muted);font-size:7px}
.performance-chart,.audit-volume{height:145px;display:flex;align-items:flex-end;gap:7px;padding:10px 18px 0;background:linear-gradient(#fff,#f7faff)}.performance-chart i,.audit-volume i{flex:1;min-width:5px;border-radius:5px 5px 0 0;background:linear-gradient(to top,rgba(7,95,255,.2),var(--electric));transform-origin:bottom;animation:bar-in .55s both}.chart-axis{display:flex;justify-content:space-between;padding:7px 18px 12px;color:var(--muted);font-size:7px}

.architecture-hero{position:relative;padding:22px;overflow:hidden;background:radial-gradient(circle at 52% 45%,rgba(0,158,255,.13),transparent 27%),rgba(255,255,255,.94)}.architecture-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(7,95,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(7,95,255,.04) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,black,transparent)}.architecture-head{position:relative;z-index:2;display:flex;justify-content:space-between;gap:15px}.eyebrow{display:flex;align-items:center;gap:5px;color:var(--electric);font-size:7px;font-weight:900;letter-spacing:1px}.architecture-head h2,.recovery-hero h2{margin:5px 0 3px;font-size:20px;letter-spacing:-.7px}.architecture-head p,.recovery-hero p{margin:0;color:var(--muted);font-size:8.5px}.architecture-actions{display:flex;align-items:flex-start;gap:8px}
.topology{position:relative;z-index:2;min-height:235px;display:flex;align-items:center;justify-content:center;gap:0;padding:28px 4px}.topology-node{position:relative;width:117px;min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid #cfe0fa;border-radius:14px;background:rgba(255,255,255,.93);box-shadow:0 15px 30px rgba(30,80,155,.09)}.topology-node>svg{width:28px;height:28px;margin-bottom:8px;color:var(--electric)}.topology-node strong{font-size:10px}.topology-node span{margin-top:4px;color:var(--muted);font-size:7px}.topology-node em{margin-top:8px;padding:3px 6px;border-radius:5px;background:#edf4ff;color:#2f64bd;font-size:6.5px;font-style:normal}.topology-node.active{border-color:#65a1ff;background:linear-gradient(145deg,#f3f8ff,#fff);box-shadow:0 0 0 7px rgba(7,95,255,.06),0 16px 40px rgba(7,95,255,.17)}.topology-node.active>svg{color:white;padding:5px;border-radius:9px;background:var(--electric);box-shadow:0 0 18px rgba(7,95,255,.5)}
.node-scan{position:absolute;inset:0;overflow:hidden;border-radius:14px}.node-scan::after{content:"";position:absolute;left:-20%;right:-20%;height:20px;background:linear-gradient(transparent,rgba(22,214,255,.25),transparent);animation:scan-vertical 2.4s linear infinite}
.topology-link{position:relative;width:68px;height:2px;background:#b7cff2}.topology-link::after{content:"";position:absolute;right:-2px;top:-3px;border:4px solid transparent;border-left-color:#87aee8}.topology-link>span{position:absolute;top:8px;width:100%;text-align:center;color:#6e87b0;font-size:6px}.topology-link .packet{position:absolute;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 9px var(--cyan);animation:link-packet 2.2s linear infinite}.topology-link .p2{animation-delay:-.7s}.topology-link .p3{animation-delay:-1.4s}
.origin-cluster{width:122px;display:grid;gap:5px;padding-left:12px}.origin-cluster>div{display:flex;align-items:center;gap:7px;padding:8px;border:1px solid #d6e3f7;border-radius:8px;background:#fff;box-shadow:0 7px 15px rgba(21,74,148,.06);font-size:7px;font-weight:750}.origin-cluster svg{color:var(--electric);font-size:16px}
.architecture-legend{position:relative;z-index:2;display:flex;align-items:center;gap:15px;padding-top:12px;border-top:1px solid #dce7f7;color:var(--muted);font-size:7px}.architecture-legend span{display:flex;align-items:center;gap:5px}.architecture-legend i{width:7px;height:7px;border-radius:50%}.architecture-legend .healthy{background:var(--green)}.architecture-legend .inspection{background:var(--electric)}.architecture-legend .encrypted{background:var(--cyan)}.architecture-legend em{margin-left:auto;font-style:normal}
.three-grid,.two-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.two-grid{grid-template-columns:repeat(2,1fr)}.compact-stat-list{padding:2px 15px 13px}.compact-stat-list>div{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e7eef8;font-size:8px}.compact-stat-list span{color:var(--muted)}.big-gauge{display:flex;align-items:center;justify-content:center;gap:9px;padding:11px}.big-gauge svg{width:29px;height:29px;color:var(--electric)}.big-gauge strong{font-size:18px}.big-gauge span{font-size:7px;color:var(--muted)}.mini-bars{height:55px;display:flex;align-items:flex-end;gap:6px;padding:0 15px 12px}.mini-bars i{flex:1;border-radius:3px 3px 0 0;background:linear-gradient(var(--cyan),var(--electric))}.chain-list{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;padding:6px 15px 14px}.chain-list>div{display:flex;align-items:center;gap:5px;padding:7px;border-radius:7px;background:#f5f9ff;color:#3d5786;font-size:7.5px}.chain-list svg{color:var(--green)}

.rule-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.rule-summary-grid>div{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:white}.rule-summary-grid>div>svg{width:28px;height:28px;padding:6px;border-radius:8px;background:#eaf2ff;color:var(--electric)}.rule-summary-grid span{flex:1;color:var(--muted);font-size:7.5px}.rule-summary-grid span strong{display:block;margin-top:3px;color:var(--ink);font-size:14px}.rule-summary-grid em{color:var(--green);font-size:7px;font-style:normal}
.rule-tabs{display:flex;gap:3px;padding:8px 13px 0;border-bottom:1px solid var(--line);overflow:auto}.rule-tabs button{padding:8px 9px;border:0;border-bottom:2px solid transparent;background:transparent;color:#617397;font-size:8px;font-weight:650;white-space:nowrap;cursor:pointer}.rule-tabs button.active{color:var(--electric);border-bottom-color:var(--electric)}.rule-tabs span{padding:2px 5px;border-radius:5px;background:#edf3fc;font-size:6.5px}.rule-name{display:flex;align-items:flex-start;gap:7px}.rule-name>span{padding:3px 5px;border-radius:5px;background:#edf4ff;color:var(--electric);font:7px ui-monospace}.rule-name strong,.rule-name small{display:block}.rule-name strong{font-size:8px}.rule-name small{margin-top:3px}.action-chip{padding:4px 6px;border-radius:5px;font-size:7px;font-weight:700}.action-chip.block{background:#fff0f4;color:var(--red)}.action-chip.challenge{background:#fff5e5;color:var(--orange)}.action-chip.log{background:#edf4ff;color:var(--electric)}
.coverage-list{display:grid;gap:9px;padding:7px 15px 15px}.coverage-list>div{display:grid;grid-template-columns:95px 1fr 35px;align-items:center;gap:8px;font-size:8px}.coverage-list>div>div{height:6px;border-radius:8px;background:#e7eef8;overflow:hidden}.coverage-list i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--electric),var(--cyan));animation:bar-grow .8s}.coverage-list strong{text-align:right}
.virtual-patch-card{display:flex;align-items:center;gap:11px;padding:8px 15px 15px}.patch-icon{width:46px;height:46px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;background:linear-gradient(145deg,#eaf2ff,#fff);color:var(--electric);box-shadow:0 8px 18px rgba(7,95,255,.1)}.patch-icon svg{width:23px}.virtual-patch-card>div:nth-child(2){flex:1}.virtual-patch-card strong{font-size:9px}.virtual-patch-card p{margin:4px 0 8px;color:var(--muted);font-size:7.5px;line-height:1.45}.virtual-patch-card>div>div{display:flex;align-items:center;gap:8px}.virtual-patch-card>div>div>span:last-child{color:#58709d;font-size:7px}

.cert-bottom-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:13px}.secure-storage{display:flex;align-items:center;padding:16px;min-height:160px}.secure-storage-copy{display:flex;gap:11px;flex:1}.secure-storage h3{margin:0;font-size:11px}.secure-storage p{max-width:490px;margin:7px 0;color:var(--muted);font-size:8px;line-height:1.55}.vault-graphic{position:relative;width:105px;height:100px;display:grid;place-items:center}.vault-graphic>div{width:72px;height:80px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(145deg,#edf4ff,#bcd5ff);color:var(--electric);box-shadow:12px 14px 24px rgba(31,98,210,.15),inset -6px -6px 15px rgba(24,89,206,.12)}.vault-graphic>div svg{width:28px}.vault-graphic>svg{position:absolute;left:4px;bottom:5px;width:45px;height:45px;padding:9px;border-radius:13px;background:var(--electric);color:white;box-shadow:0 8px 16px rgba(7,95,255,.24)}
.acme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:6px 13px 11px}.acme-grid>div{display:flex;gap:7px;padding:10px;border:1px solid var(--line);border-radius:8px}.acme-grid svg{color:var(--electric)}.acme-grid span,.acme-grid strong,.acme-grid em{display:block}.acme-grid span{font-size:7px;color:var(--muted)}.acme-grid strong{margin-top:5px;color:var(--ink);font-size:8px}.acme-grid em{margin-top:3px;color:var(--green);font-size:6px;font-style:normal}.acme-grid+.button{margin:0 13px 13px}.text-danger{color:var(--red)!important}.text-orange{color:var(--orange)!important}

.safe-apply-banner,.audit-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 15px;border:1px solid #bce8dc;border-radius:10px;background:linear-gradient(90deg,#effbf7,#f9fefd)}.safe-apply-banner>div,.audit-banner{display:flex;align-items:center;gap:9px}.safe-apply-banner svg,.audit-banner>svg{color:var(--green)}.safe-apply-banner span,.audit-banner span{font-size:8.5px;color:#516b7a}.safe-apply-banner strong,.audit-banner strong{color:var(--ink)}
.network-layout{display:grid;grid-template-columns:1.18fr .82fr;gap:13px}.interface-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;padding:4px 13px 13px}.interface-card{display:grid;grid-template-columns:42px 1fr auto;gap:9px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:10px;background:#fbfdff;text-align:left;cursor:pointer;transition:.16s}.interface-card:hover{border-color:#8fb8ff;background:#f5f9ff;transform:translateY(-1px)}.port-graphic{width:38px;height:34px;display:grid;grid-template-columns:repeat(2,6px);justify-content:center;align-content:center;gap:4px;border:2px solid #6e92c7;border-radius:6px;background:#e9f1ff}.port-graphic span{width:6px;height:6px;border-radius:1px;background:#6e92c7}.interface-card>div:nth-child(2) strong,.interface-card>div:nth-child(2) span{display:block}.interface-card>div:nth-child(2) strong{font-size:9px}.interface-card>div:nth-child(2) span{color:var(--muted);font-size:7px}.interface-card dl{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);margin:4px 0 0;padding-top:8px;border-top:1px solid #e5edf8}.interface-card dl div{min-width:0}.interface-card dt,.interface-card dd{margin:0}.interface-card dt{color:var(--muted);font-size:6.5px}.interface-card dd{margin-top:3px;overflow:hidden;text-overflow:ellipsis;font-size:7.5px;font-weight:700}
.ha-visual{display:flex;align-items:center;justify-content:center;padding:13px}.ha-node{width:112px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#f8fbff;text-align:center}.ha-node svg{width:28px;height:28px;color:#6482b4}.ha-node strong,.ha-node span,.ha-node em{display:block}.ha-node strong{margin-top:6px;font-size:8px}.ha-node span{margin:4px auto;width:max-content;padding:2px 5px;border-radius:4px;background:#edf2f8;color:#7183a1;font-size:6px;font-weight:900}.ha-node em{margin-top:5px;color:var(--muted);font-size:7px;font-style:normal}.ha-node.active{border-color:#76a6f4;box-shadow:0 0 0 5px #eef5ff}.ha-node.active svg{color:var(--electric)}.ha-node.active span{background:#e6f9f2;color:var(--green)}
.ha-sync{position:relative;width:90px;text-align:center;color:var(--muted);font-size:6px}.ha-sync::before,.ha-sync::after{content:"";position:absolute;top:4px;width:32px;height:1px;background:#a8c3ec}.ha-sync::before{left:0}.ha-sync::after{right:0}.ha-sync i{display:block;width:8px;height:8px;margin:0 auto 5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:node-pulse 1.6s infinite}.ha-sync span,.ha-sync strong{display:block}.ha-sync strong{margin-top:2px;color:var(--ink)}
.ha-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:0 13px 13px;padding:10px;border-radius:8px;background:#f6f9fe}.ha-stats span,.ha-stats strong{display:block;text-align:center}.ha-stats span{color:var(--muted);font-size:6.5px}.ha-stats strong{margin-top:4px;font-size:7.5px}.network-detail,.dns-card{display:flex;align-items:center;gap:9px;margin:0 13px;padding:9px 0;border-bottom:1px solid #e8eef8}.network-detail>svg,.dns-card>svg{width:19px;color:var(--electric)}.network-detail>div,.dns-card>div{flex:1}.network-detail strong,.network-detail span,.dns-card strong,.dns-card span{display:block}.network-detail strong,.dns-card strong{font-size:8px}.network-detail span,.dns-card span{margin-top:3px;color:var(--muted);font-size:7px}.dns-card>svg:last-child{color:var(--green);width:15px}.connectivity-list{display:grid;padding:2px 13px 13px}.connectivity-list>div{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid #e8eef8;font-size:8px}

.recovery-hero{position:relative;overflow:hidden;display:flex;align-items:center;gap:18px;min-height:130px;padding:20px 28px;border:1px solid #bcd3fa;border-radius:13px;background:radial-gradient(circle at 10% 50%,rgba(0,131,255,.13),transparent 12rem),linear-gradient(120deg,#f5f9ff,#fff);box-shadow:var(--shadow)}.recovery-hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,transparent 49%,rgba(12,97,240,.04) 50%,transparent 51%);background-size:28px 100%}.recovery-orbit{position:relative;z-index:1;width:82px;height:82px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #95bbf4;border-radius:50%;color:var(--electric);box-shadow:0 0 0 10px rgba(7,95,255,.04),0 0 0 20px rgba(7,95,255,.02)}.recovery-orbit>svg{width:35px;height:35px}.recovery-orbit span{position:absolute;inset:9px;border:1px dashed #6aa2f3;border-radius:50%;animation:radar-spin 5s linear infinite}.recovery-hero>div:nth-child(2){z-index:1;flex:1}.recovery-score{z-index:1;text-align:right}.recovery-score strong,.recovery-score span{display:block}.recovery-score strong{font-size:30px;color:var(--electric)}.recovery-score span{color:var(--muted);font-size:8px}.row-actions{display:flex;gap:5px}.row-actions button{width:25px;height:25px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;background:white;color:#5874a6;cursor:pointer}.row-actions svg{width:13px}.table-edit{min-height:28px;padding:0 9px;font-size:8px}
.schedule-card{display:flex;align-items:center;gap:10px;margin:0 13px;padding:10px 0;border-bottom:1px solid #e7eef8}.schedule-card>svg{width:22px;color:var(--electric)}.schedule-card>div{flex:1}.schedule-card strong,.schedule-card span{display:block}.schedule-card strong{font-size:8.5px}.schedule-card span{margin-top:3px;color:var(--muted);font-size:7px}.dr-callout{display:flex;gap:11px;padding:8px 15px 15px}.dr-callout>svg{width:31px;height:31px;color:var(--electric)}.dr-callout strong{font-size:9px}.dr-callout p{margin:5px 0 9px;color:var(--muted);font-size:7.5px;line-height:1.45}

.users-main{min-width:0}.user-cell{display:flex;align-items:center;gap:8px}.user-cell>span,.actor-cell>span{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#e9f1ff,#fff);color:var(--electric);border:1px solid #d5e2f7;font-size:8px;font-weight:800}.user-cell strong,.user-cell small{display:block}.role-list{display:grid;padding:0 13px 13px}.role-list>div{display:grid;grid-template-columns:9px 1fr auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid #e9eff8}.role-dot{width:8px;height:8px;border-radius:50%;background:var(--electric)}.role-dot.super{background:var(--violet)}.role-dot.operator{background:var(--electric)}.role-dot.viewer{background:#8293b1}.role-list p{margin:0;font-size:7px;color:var(--muted)}.role-list p strong{display:block;color:var(--ink);font-size:8px}.role-list em{font-style:normal;font-size:8px}.setting-mini{display:flex;align-items:center;justify-content:space-between;padding:9px 13px;border-top:1px solid #e7eef8}.setting-mini strong,.setting-mini small{display:block}.setting-mini strong{font-size:8px}.setting-mini small{margin-top:3px;color:var(--muted);font-size:7px}.setting-mini>svg{width:14px;color:#8fa3c4}

.audit-banner{justify-content:flex-start;background:linear-gradient(90deg,#effbf7,#f8fbff)}.audit-banner>div{flex:1}.audit-banner strong,.audit-banner span{display:block}.audit-banner span{margin-top:3px}.actor-cell{display:flex;align-items:center;gap:7px}.actor-cell>span{width:25px;height:25px}td code{padding:3px 5px;border-radius:5px;background:#edf3fc;color:#3561a6;font-size:7.5px}.audit-volume{height:155px}.audit-volume i{background:linear-gradient(to top,rgba(8,185,128,.18),var(--green))}.rank-list{display:grid;padding:0 13px 13px}.rank-list>div{display:grid;grid-template-columns:23px 1fr auto;align-items:center;padding:8px 0;border-bottom:1px solid #e8eef8}.rank-list>div>span{width:20px;height:20px;display:grid;place-items:center;border-radius:6px;background:#edf4ff;color:var(--electric);font-size:7px;font-weight:800}.rank-list code{font-size:7.5px;color:#405a87}.rank-list strong{font-size:8px}

.config-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:13px}.config-editor-panel{min-width:0}.editor-tabs{height:49px;display:flex;align-items:end;gap:2px;padding:0 11px;border-bottom:1px solid var(--line);background:#f8fbff}.editor-tabs button{height:38px;display:flex;align-items:center;gap:6px;padding:0 10px;border:1px solid transparent;border-bottom:0;border-radius:7px 7px 0 0;background:transparent;color:#597099;font:8px ui-monospace;cursor:pointer}.editor-tabs button.active{border-color:var(--line);background:#0a1731;color:#cde0ff}.editor-tabs svg{width:13px}.editor-tabs>span{margin-left:auto;align-self:center;color:var(--muted);font-size:7px}.code-editor-shell{position:relative;min-height:575px;display:grid;grid-template-columns:45px 1fr;overflow:auto;background:#071326;color:#bad5ff}.line-numbers{padding:17px 10px;text-align:right;border-right:1px solid rgba(135,175,236,.13);background:#061020;color:#4e668d;font:10px/1.65 ui-monospace}.line-numbers span{display:block}.code-editor-shell pre{margin:0;padding:17px;white-space:pre;tab-size:2;font:10px/1.65 ui-monospace}.editor-scan{position:absolute;left:45px;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 10px rgba(22,214,255,.6);animation:editor-scan 7s linear infinite}.editor-status{height:35px;display:flex;align-items:center;gap:14px;padding:0 12px;border-top:1px solid #142848;background:#0a1830;color:#7f9bc7;font-size:7px}.editor-status span{display:flex;align-items:center;gap:4px}.editor-status svg{color:var(--green)}.editor-status em{margin-left:auto;font-style:normal}.config-side{display:grid;gap:11px;align-content:start}.config-state{display:grid;padding:2px 13px 12px}.config-state>div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #e8eef8;font-size:8px}.config-state span{color:var(--muted)}.config-side .panel>.button{width:calc(100% - 26px);margin:0 13px 12px}.config-side .chain-list{grid-template-columns:1fr}

.app-footer{min-height:44px;display:flex;align-items:center;justify-content:center;gap:22px;padding:8px 22px;border-top:1px solid var(--line);color:#7185aa;background:rgba(255,255,255,.82);font-size:7.5px}.app-footer>span{display:flex;align-items:center;gap:5px}.app-footer>span i{width:6px;height:6px;border-radius:50%;background:var(--green)}.app-footer button{display:flex;align-items:center;gap:3px;border:0;background:transparent;color:var(--electric);font-size:7.5px;cursor:pointer}.app-footer .brand{margin-left:auto}
.mobile-bottom-nav,.mobile-ai-fab{display:none}

.modal-backdrop,.command-backdrop,.drawer-shell{position:fixed;z-index:100;inset:0}.modal-backdrop,.command-backdrop{display:grid;place-items:center;padding:20px;background:rgba(3,14,38,.48);backdrop-filter:blur(7px);animation:fade-in .16s ease}
.modal{width:min(760px,calc(100vw - 30px));max-height:calc(100vh - 38px);overflow:auto;border:1px solid #bdd2f4;border-radius:17px;background:#fff;box-shadow:0 30px 80px rgba(4,34,88,.3);animation:modal-in .24s cubic-bezier(.2,.8,.2,1)}
.modal>header{position:sticky;z-index:3;top:0;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.92);backdrop-filter:blur(15px)}.modal h2{margin:4px 0 0;font-size:16px;letter-spacing:-.4px}.modal-content{padding:18px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.stepper{display:flex;align-items:center;margin-bottom:20px}.stepper>span{display:flex;align-items:center;gap:6px;color:#9aa8bf;font-size:8px;font-weight:700;white-space:nowrap}.stepper i{width:23px;height:23px;display:grid;place-items:center;border:1px solid #cfd9e9;border-radius:50%;font-style:normal}.stepper>span.active{color:var(--electric)}.stepper>span.active i{color:white;border-color:var(--electric);background:var(--electric);box-shadow:0 0 0 4px #edf4ff}.stepper>b{flex:1;height:1px;margin:0 7px;background:#dbe4f2}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.field{display:block}.field.full,.switch-field.full,.review-box.full{grid-column:1/-1}.field>span{display:block;margin-bottom:6px;color:#40577f;font-size:8px;font-weight:700}.field input,.field select,.field textarea{width:100%;min-height:39px;padding:0 11px;border:1px solid #cfdcf0;border-radius:8px;background:#fbfdff;color:var(--ink);outline:0;font-size:9px}.field input:disabled{color:#7b8eaf;background:#f2f6fc}.field textarea{min-height:108px;padding:10px;resize:vertical;line-height:1.5}.field input:focus,.field select:focus,.field textarea:focus{border-color:#6fa2f8;box-shadow:0 0 0 3px #edf4ff}.field small{display:block;margin-top:5px;color:var(--muted);font-size:7px}.form-error{margin-top:13px;padding:9px 11px;border:1px solid #ffc7d4;border-radius:8px;background:#fff3f6;color:#c8274e;font-size:8px}.choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.choice{min-height:86px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;padding:11px;border:1px solid var(--line);border-radius:9px;background:#fbfdff;color:#42608f;text-align:left;font-size:9px;font-weight:800;cursor:pointer}.choice svg{width:20px;color:var(--electric)}.choice small{color:var(--muted);font-size:7px;font-weight:400}.choice.active,.choice:hover{border-color:#70a1f7;background:#f1f6ff;box-shadow:inset 0 0 0 1px #bfdaff}.switch-field{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px;border:1px solid var(--line);border-radius:9px;background:#fbfdff}.switch-field strong,.switch-field small{display:block}.switch-field strong{font-size:8.5px}.switch-field small{margin-top:4px;color:var(--muted);font-size:7px}.review-box,.secure-note,.ai-suggestion{display:flex;align-items:center;gap:9px;padding:11px;border:1px solid #bcd9ff;border-radius:9px;background:#f1f7ff;color:#42628e;font-size:8px}.review-box>svg,.secure-note>svg,.ai-suggestion>svg{color:var(--electric);width:21px}.review-box strong{display:block;color:var(--ink);font-size:9px}
.deploy-summary{display:flex;align-items:center;gap:15px;padding:13px;border:1px solid #c4dcff;border-radius:11px;background:linear-gradient(100deg,#eff6ff,#fbfdff)}.deploy-orbit{position:relative;width:66px;height:66px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #94bdfc;border-radius:50%;color:var(--electric);box-shadow:0 0 0 7px rgba(7,95,255,.05)}.deploy-orbit>svg{width:27px}.deploy-orbit span{position:absolute;inset:6px;border:1px dashed #6da4f7;border-radius:50%;animation:radar-spin 4s linear infinite}.deploy-summary h3{margin:0;font-size:13px}.deploy-summary p{margin:5px 0 0;color:var(--muted);font-size:8px;line-height:1.5}.deploy-steps{display:grid;margin-top:12px}.deploy-steps>div{display:grid;grid-template-columns:26px 1fr auto;align-items:center;padding:9px;border-bottom:1px solid #e8eef8;font-size:8px}.deploy-steps>div>span{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#e8f8f2;color:var(--green)}.deploy-steps>div>span svg{width:12px}.deploy-steps em{color:var(--green);font-size:7px;font-style:normal}.deploy-steps .running svg{animation:spin 1s linear infinite}.certificate-methods{margin-bottom:15px}.secure-note{margin-top:13px;border-color:#d1def2;background:#f7faff}.secure-note>svg{color:var(--green)}
.ai-suggestion{margin-top:13px}.ai-suggestion span{flex:1}.ai-suggestion strong{display:block;color:var(--ink);font-size:8.5px}.input-combo{display:grid;grid-template-columns:90px 1fr}.input-combo select{border-radius:8px 0 0 8px}.input-combo input{border-left:0;border-radius:0 8px 8px 0}.simulator-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.simulation-result{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;border:1px solid #ffc5d3;border-radius:12px;background:radial-gradient(circle at 50% 30%,#fff0f4,white 60%);text-align:center}.result-shield{width:58px;height:62px;display:grid;place-items:center;color:white;background:linear-gradient(145deg,#ff3c69,#d91845);clip-path:polygon(50% 0,94% 14%,88% 72%,50% 100%,12% 72%,6% 14%);filter:drop-shadow(0 8px 12px rgba(245,50,98,.25))}.result-shield svg{width:25px}.simulation-result>.status-chip{margin-top:11px}.simulation-result h3{margin:9px 0 4px;font-size:13px}.simulation-result p{margin:0;color:var(--muted);font-size:8px;line-height:1.5}.simulation-result dl{width:100%;margin:12px 0 0;padding-top:7px;border-top:1px solid #f2d8df}.simulation-result dl>div{display:flex;justify-content:space-between;padding:5px;font-size:8px}.simulation-result dd{margin:0;font-weight:700}

.command-backdrop{align-items:start;padding-top:min(14vh,120px)}.command-palette{width:min(680px,calc(100vw - 28px));overflow:hidden;border:1px solid #bcd1f1;border-radius:16px;background:white;box-shadow:0 30px 80px rgba(4,31,79,.32);animation:command-in .2s ease}.command-palette>label{height:59px;display:flex;align-items:center;gap:10px;padding:0 15px;border-bottom:1px solid var(--line);color:#7590bc}.command-palette>label svg{width:20px}.command-palette>label input{flex:1;border:0;outline:0;font-size:12px;color:var(--ink)}.command-results{max-height:520px;overflow:auto;padding:8px}.command-results>span{display:block;padding:9px 10px 5px;color:#91a0b8;font-size:7px;font-weight:900;letter-spacing:.8px;text-transform:uppercase}.command-results button{width:100%;display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:6px;padding:9px;border:0;border-radius:9px;background:transparent;text-align:left;cursor:pointer}.command-results button:hover{background:#f1f6ff}.command-results button>svg:first-child{width:18px;color:var(--electric)}.command-results strong,.command-results small{grid-column:2}.command-results strong{font-size:9px}.command-results small{color:var(--muted);font-size:7px}.command-results button>svg:last-child{grid-column:3;grid-row:1/3;width:14px;color:#91a3c1}

.drawer-shell{z-index:110}.drawer-scrim{position:absolute;inset:0;background:rgba(5,17,42,.34);backdrop-filter:blur(3px);animation:fade-in .15s}.assistant-drawer{position:absolute;inset:0 0 0 auto;width:min(430px,100vw);display:flex;flex-direction:column;background:#f8fbff;box-shadow:-22px 0 60px rgba(7,38,89,.25);animation:drawer-in .28s cubic-bezier(.2,.8,.2,1)}.assistant-drawer>header{display:flex;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid var(--line);background:white}.assistant-mini-orb{position:relative;width:39px;height:39px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#113472,#0875ff);color:white;box-shadow:0 0 0 5px #edf4ff}.assistant-mini-orb span{position:absolute;width:6px;height:6px;right:0;bottom:3px;border:2px solid white;border-radius:50%;background:var(--green)}.assistant-drawer header>div:nth-child(2){flex:1}.assistant-drawer header strong{display:block;font-size:11px}.assistant-drawer header span{display:flex;align-items:center;gap:4px;margin-top:3px;color:var(--muted);font-size:7px}.assistant-drawer header span i{width:5px;height:5px;border-radius:50%;background:var(--green)}.assistant-context{display:flex;align-items:center;gap:7px;padding:8px 13px;border-bottom:1px solid var(--line);background:#eef5ff;color:#5270a2;font-size:7.5px}.assistant-context svg{color:var(--electric)}.chat-messages{flex:1;overflow:auto;padding:15px}.chat-bubble{display:flex;gap:7px;margin-bottom:11px}.chat-bubble>svg{width:25px;height:25px;padding:5px;border-radius:50%;background:var(--electric);color:white}.chat-bubble p{max-width:82%;margin:0;padding:10px 12px;border:1px solid var(--line);border-radius:4px 13px 13px 13px;background:white;color:#354f7c;font-size:8.5px;line-height:1.6;box-shadow:0 7px 19px rgba(24,71,143,.06)}.chat-bubble.user{justify-content:flex-end}.chat-bubble.user p{color:white;border:0;border-radius:13px 4px 13px 13px;background:linear-gradient(135deg,#075fff,#078cff)}.quick-prompts{display:flex;flex-wrap:wrap;gap:6px;margin-left:32px}.quick-prompts button{display:flex;align-items:center;gap:5px;padding:7px 8px;border:1px solid var(--line);border-radius:8px;background:white;color:#43608e;font-size:7.5px;cursor:pointer}.quick-prompts button:hover{border-color:#8eb8ff;color:var(--electric)}.assistant-action{padding:0 13px 9px}.assistant-action>div{display:grid;grid-template-columns:20px 1fr auto;align-items:center;gap:7px;padding:9px;border:1px solid #c9ddff;border-radius:9px;background:#eef5ff}.assistant-action svg{color:var(--electric)}.assistant-action span{font-size:7px;color:#4b6694}.assistant-action strong{display:block;color:var(--ink)}.assistant-action button{border:0;background:transparent;color:var(--electric);font-size:7px;font-weight:800;cursor:pointer}.assistant-drawer form{padding:11px 13px;border-top:1px solid var(--line);background:white}.assistant-drawer form label{height:42px;display:flex;align-items:center;gap:7px;padding:0 8px;border:1px solid #bed2f2;border-radius:10px}.assistant-drawer form label>svg{color:#7f95b8}.assistant-drawer form input{flex:1;border:0;outline:0;font-size:8.5px}.assistant-drawer form button{width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:8px;background:var(--electric);color:white;cursor:pointer}.assistant-drawer form small{display:block;margin-top:6px;text-align:center;color:var(--muted);font-size:6.5px}

.toast-stack{position:fixed;z-index:160;right:18px;bottom:18px;display:grid;gap:8px;width:min(360px,calc(100vw - 28px))}.toast{display:flex;align-items:flex-start;gap:9px;padding:12px;border:1px solid #bde7d9;border-radius:11px;background:white;box-shadow:0 16px 45px rgba(15,61,126,.18);animation:toast-in .28s ease}.toast>span{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#e8f9f3;color:var(--green)}.toast>div{flex:1}.toast strong{font-size:9px}.toast p{margin:3px 0 0;color:var(--muted);font-size:7.5px;line-height:1.4}.toast>button{border:0;background:transparent;color:#8da0be;cursor:pointer}.toast.warning{border-color:#f8d8a7}.toast.warning>span{background:#fff5e7;color:var(--orange)}

.login-page{min-height:100vh;display:grid;grid-template-columns:1.65fr 1fr;background:#fff}.login-visual{position:relative;min-height:100vh;overflow:hidden;padding:32px 42px 24px;background:radial-gradient(circle at 76% 52%,rgba(0,145,255,.17),transparent 22rem),linear-gradient(145deg,#fff,#f2f8ff);border-right:1px solid var(--line)}.login-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(7,95,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(7,95,255,.045) 1px,transparent 1px);background-size:35px 35px;mask-image:radial-gradient(circle at 60% 50%,black,transparent 72%)}.login-scan{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 16px var(--cyan);opacity:.4;animation:editor-scan 7s linear infinite}.login-visual>.brand{position:relative;z-index:3}.login-copy{position:relative;z-index:3;width:55%;margin-top:55px}.login-copy h1{max-width:590px;margin:10px 0;font-size:42px;line-height:1.04;letter-spacing:-2px}.login-copy h1 em{color:var(--electric);font-style:normal}.login-copy p{max-width:540px;margin:0;color:#49638f;font-size:12px;line-height:1.7}.login-metrics{display:flex;gap:15px;margin-top:26px}.login-metrics>div{display:flex;align-items:center;gap:8px;min-width:130px}.login-metrics svg{width:31px;height:31px;padding:7px;border-radius:9px;background:white;color:var(--electric);box-shadow:0 7px 20px rgba(30,83,162,.1)}.login-metrics span,.login-metrics strong{display:block}.login-metrics span{color:#53709f;font-size:7.5px}.login-metrics strong{margin-bottom:3px;color:var(--ink);font-size:16px}.login-art{position:absolute;z-index:2;right:-7%;top:10%;width:69%;height:79%;overflow:hidden;background-image:url('/assets/cherry-defense.png');background-size:307% auto;background-position:99% 38%;background-repeat:no-repeat;filter:drop-shadow(0 25px 30px rgba(29,89,177,.15));mask-image:linear-gradient(to bottom,black 0 85%,transparent)}.login-art::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,#f7fbff 0,rgba(247,251,255,.97) 7%,rgba(247,251,255,0) 22%)}.login-features{position:absolute;z-index:4;left:40px;right:40px;bottom:40px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.login-features>div{display:flex;align-items:center;gap:8px;min-height:60px;padding:10px;border:1px solid #cfdff6;border-radius:10px;background:rgba(255,255,255,.87);backdrop-filter:blur(8px);box-shadow:0 8px 20px rgba(32,79,149,.07)}.login-features svg{width:20px;color:var(--electric)}.login-features span,.login-features strong{display:block}.login-features span{color:var(--muted);font-size:6.5px;line-height:1.4}.login-features strong{margin-bottom:3px;color:var(--ink);font-size:7.5px}
.login-panel{position:relative;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 100% 0,rgba(7,95,255,.07),transparent 18rem)}.login-card{width:min(410px,100%);padding:35px;border:1px solid #d5e2f7;border-radius:20px;background:rgba(255,255,255,.95);box-shadow:0 25px 65px rgba(25,72,142,.12)}.login-card-logo{display:flex;justify-content:center}.login-card h2{margin:15px 0 4px;text-align:center;font-size:25px;letter-spacing:-.8px}.login-card>p{margin:0 0 25px;text-align:center;color:var(--muted);font-size:10px}.input-icon{height:43px;display:flex;align-items:center;gap:8px;padding:0 11px;border:1px solid #cfdcf0;border-radius:9px}.input-icon svg{color:#7891bb}.input-icon input{height:100%;padding:0;border:0;background:transparent;box-shadow:none!important}.login-options{display:flex;align-items:center;justify-content:space-between;margin:10px 0 17px;color:#58709a;font-size:8px}.login-options label{display:flex;align-items:center;gap:5px}.login-options input{accent-color:var(--electric)}.login-options button{border:0;background:transparent;color:var(--electric);font-size:8px;cursor:pointer}.login-submit{height:44px}.or{display:flex;align-items:center;gap:9px;margin:14px 0;color:#8a9bb8;font-size:8px}.or span{flex:1;height:1px;background:var(--line)}.secure-connection{display:flex;align-items:center;gap:9px;margin-top:20px;padding:10px;border-radius:9px;background:#f3f7fd;color:#597198;font-size:7px}.secure-connection svg{color:var(--electric)}.secure-connection strong{display:block;color:var(--ink);font-size:8px}.login-panel footer{position:absolute;left:30px;right:30px;bottom:22px;display:flex;justify-content:space-between;color:#7d91b4;font-size:7px}

/* Login motion stage */
.login-visual>.brand{animation:login-rise .75s .05s cubic-bezier(.2,.8,.2,1) both}
.login-copy{animation:login-rise .82s .16s cubic-bezier(.2,.8,.2,1) both}
.login-copy h1 em{position:relative;text-shadow:0 0 28px rgba(7,95,255,.16)}
.login-copy h1 em::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:linear-gradient(90deg,var(--electric),var(--cyan),transparent);transform-origin:left;animation:login-line-in 1s .72s both}
.login-metrics>div{animation:login-rise .55s cubic-bezier(.2,.8,.2,1) both}
.login-metrics>div:nth-child(1){animation-delay:.42s}.login-metrics>div:nth-child(2){animation-delay:.52s}.login-metrics>div:nth-child(3){animation-delay:.62s}
.login-metrics svg{animation:metric-breathe 3s ease-in-out infinite}.login-metrics>div:nth-child(2) svg{animation-delay:-1s}.login-metrics>div:nth-child(3) svg{animation-delay:-2s}
.login-art{animation:guardian-enter 1.05s .15s cubic-bezier(.2,.8,.2,1) both,guardian-float 6s 1.2s ease-in-out infinite}
.login-radar{position:absolute;z-index:1;right:2.5%;top:20%;width:470px;height:470px;display:grid;place-items:center;border-radius:50%;opacity:.7;animation:login-radar-in 1.2s .25s both}
.login-radar>span{position:absolute;width:100%;height:100%;border:1px solid rgba(41,125,255,.22);border-radius:50%;animation:radar-ring 5.5s linear infinite}
.login-radar>span:nth-child(2){width:76%;height:76%;animation-direction:reverse;animation-duration:7s}.login-radar>span:nth-child(3){width:51%;height:51%;animation-duration:4.2s}.login-radar>span:nth-child(4){width:27%;height:27%;border-style:dashed;animation-direction:reverse;animation-duration:3.1s}
.login-radar>span::before{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 13px var(--cyan)}
.login-radar>svg{width:58px;height:58px;padding:13px;border-radius:50%;color:white;background:linear-gradient(145deg,#087cff,#073ec9);box-shadow:0 0 0 9px rgba(7,95,255,.09),0 0 38px rgba(7,95,255,.36);animation:shield-charge 2.8s ease-in-out infinite}
.login-particles{position:absolute;z-index:2;inset:0;pointer-events:none}
.login-particles i{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);opacity:0;animation:login-particle 5.5s linear infinite}
.login-particles i:nth-child(1){left:9%;top:24%;animation-delay:-.4s}.login-particles i:nth-child(2){left:18%;top:66%;animation-delay:-1.7s}.login-particles i:nth-child(3){left:31%;top:17%;animation-delay:-3.2s}.login-particles i:nth-child(4){left:39%;top:57%;animation-delay:-4.1s}.login-particles i:nth-child(5){left:48%;top:29%;animation-delay:-2.6s}.login-particles i:nth-child(6){left:56%;top:74%;animation-delay:-.9s}.login-particles i:nth-child(7){left:64%;top:12%;animation-delay:-3.8s}.login-particles i:nth-child(8){left:72%;top:61%;animation-delay:-2.1s}.login-particles i:nth-child(9){left:82%;top:31%;animation-delay:-4.7s}.login-particles i:nth-child(10){left:91%;top:70%;animation-delay:-1.2s}.login-particles i:nth-child(11){left:25%;top:43%;animation-delay:-4.4s}.login-particles i:nth-child(12){left:45%;top:82%;animation-delay:-2.9s}.login-particles i:nth-child(13){left:59%;top:38%;animation-delay:-.2s}.login-particles i:nth-child(14){left:76%;top:80%;animation-delay:-3.5s}.login-particles i:nth-child(15){left:88%;top:18%;animation-delay:-1.9s}.login-particles i:nth-child(16){left:13%;top:84%;animation-delay:-4.9s}
.login-floating-card{position:absolute;z-index:3;border:1px solid rgba(157,194,250,.72);border-radius:11px;background:rgba(255,255,255,.8);box-shadow:0 18px 45px rgba(28,91,185,.14);backdrop-filter:blur(13px) saturate(1.15);color:#2e4e82;pointer-events:none}
.login-floating-card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.74) 45%,transparent 70%);transform:translateX(-120%);animation:card-sheen 5s 1.8s ease-in-out infinite}
.login-floating-card header{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-bottom:1px solid rgba(198,216,244,.7);font-size:7px;font-weight:800}.login-floating-card header em{color:var(--green);font-size:6px;font-style:normal}.login-floating-card header svg{color:var(--electric)}
.login-traffic-card{right:8%;top:10%;width:215px;transform:perspective(700px) rotateY(-7deg) rotateX(2deg);animation:card-in-right .8s .65s both,card-float-a 5.5s 1.5s ease-in-out infinite}
.login-traffic-card svg{display:block;width:100%;height:62px;padding:8px 10px 3px;overflow:visible}.login-traffic-card svg path{fill:none;stroke:var(--electric);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:320;stroke-dashoffset:320;animation:draw-line 1.5s 1.1s forwards}.login-traffic-card svg .danger-line{stroke:var(--red);animation-delay:1.3s}.login-traffic-card footer{display:flex;gap:18px;padding:7px 10px;background:rgba(241,247,255,.7)}.login-traffic-card footer span{font-size:10px;font-weight:800}.login-traffic-card footer small{display:block;margin-top:2px;color:var(--muted);font-size:5px;font-weight:500}
.login-policy-card{right:35%;top:37%;width:180px;transform:perspective(700px) rotateY(9deg);animation:card-in-left .8s .78s both,card-float-b 6s 1.6s ease-in-out infinite}.login-policy-card>div{position:relative;z-index:1;display:flex;align-items:center;gap:8px;padding:9px 10px}.login-policy-card b{font-size:9px}.login-policy-card em{color:var(--muted);font-size:6px;font-style:normal}.login-policy-card .status-chip{margin-left:auto}.policy-scan-bar{height:3px!important;padding:0!important;margin:0 10px 8px;border-radius:3px;background:#e7eef8!important;overflow:hidden}.policy-scan-bar i{display:block;width:42%;height:100%;border-radius:3px;background:linear-gradient(90deg,var(--electric),var(--cyan));animation:policy-scan 2.1s ease-in-out infinite}
.login-flow-card{right:6%;top:57%;width:190px;transform:perspective(700px) rotateY(-8deg);animation:card-in-right .8s .92s both,card-float-c 5s 1.75s ease-in-out infinite}.mini-flow{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:12px 8px}.mini-flow svg{width:20px;height:20px;padding:4px;border-radius:50%;background:#edf4ff;color:var(--electric)}.mini-flow svg:nth-of-type(2){color:white;background:var(--electric);box-shadow:0 0 12px rgba(7,95,255,.4)}.mini-flow i{position:relative;width:25px;height:1px;background:#a9c5ee}.mini-flow i::after{content:"";position:absolute;width:5px;height:5px;top:-2px;border-radius:50%;background:var(--cyan);box-shadow:0 0 7px var(--cyan);animation:mini-packet 1.6s linear infinite}.login-flow-card footer{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;background:rgba(241,247,255,.7);font-size:6px}
.login-features>div{animation:login-rise .6s both}.login-features>div:nth-child(1){animation-delay:.82s}.login-features>div:nth-child(2){animation-delay:.9s}.login-features>div:nth-child(3){animation-delay:.98s}.login-features>div:nth-child(4){animation-delay:1.06s}
.login-features>div:hover{transform:translateY(-3px);border-color:#7baeff;box-shadow:0 13px 28px rgba(20,87,190,.13)}
.login-panel{overflow:hidden}.login-panel-waves{position:absolute;inset:0;pointer-events:none;opacity:.72}.login-panel-waves i{position:absolute;width:540px;height:540px;right:-380px;top:-390px;border:1px solid rgba(7,95,255,.16);border-radius:46% 54% 61% 39%;animation:wave-spin 17s linear infinite}.login-panel-waves i:nth-child(2){inset:auto auto -410px -390px;animation-duration:23s;animation-direction:reverse}.login-panel-waves i:nth-child(3){right:-350px;top:-360px;width:480px;height:480px;animation-duration:13s}.login-panel-waves i:nth-child(4){inset:auto auto -375px -350px;width:470px;height:470px;animation-duration:19s}
.login-card{position:relative;z-index:2;animation:login-card-in .75s .18s cubic-bezier(.2,.8,.2,1) both}.login-card::before{content:"";position:absolute;inset:-1px;border-radius:20px;padding:1px;background:linear-gradient(145deg,rgba(7,95,255,.35),transparent 42%,rgba(22,214,255,.28));mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none}.login-card-logo{position:relative}.login-card-logo>i{position:absolute;left:50%;top:50%;width:72px;height:72px;border:1px solid rgba(7,95,255,.15);border-radius:50%;transform:translate(-50%,-50%);animation:logo-ring 2.8s ease-out infinite}.login-card-logo>i:last-child{animation-delay:1.4s}.login-card-logo .brand-shield{animation:shield-hover 3s ease-in-out infinite}
.input-icon{transition:.18s ease}.input-icon:focus-within{border-color:#6b9ffc;box-shadow:0 0 0 4px rgba(7,95,255,.075),0 8px 18px rgba(7,95,255,.07);transform:translateY(-1px)}.input-icon:focus-within svg{color:var(--electric)}
.login-submit{position:relative;overflow:hidden}.login-submit::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.35) 50%,transparent 80%);transform:translateX(-120%);animation:button-sheen 3.4s 1.4s infinite}
.secure-connection{position:relative;overflow:hidden}.secure-connection::after{content:"";position:absolute;left:-20%;top:0;width:20%;height:100%;background:linear-gradient(90deg,transparent,rgba(7,95,255,.1),transparent);animation:secure-scan 4s linear infinite}
.mobile-login-guardian{display:none}
.login-transition{position:absolute;z-index:20;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(248,252,255,.97);backdrop-filter:blur(18px);animation:fade-in .22s both}.login-transition>div{position:relative;width:92px;height:92px;display:grid;place-items:center}.login-transition>div>svg{z-index:2;width:55px;height:55px;padding:12px;color:white;background:linear-gradient(145deg,#0a83ff,#073fd0);clip-path:polygon(50% 0,94% 14%,88% 72%,50% 100%,12% 72%,6% 14%);filter:drop-shadow(0 12px 18px rgba(7,95,255,.3));animation:shield-charge 1.2s ease-in-out infinite}.login-transition>div span{position:absolute;inset:0;border:1px solid #5ba0ff;border-radius:50%;animation:transition-ring 1.4s ease-out infinite}.login-transition>div span:nth-child(3){animation-delay:.7s}.login-transition strong{margin-top:14px;font-size:13px}.login-transition small{margin-top:7px;color:var(--muted);font-size:7.5px}.login-transition>i{width:180px;height:3px;margin-top:18px;overflow:hidden;border-radius:4px;background:#e3ecf9}.login-transition>i::after{content:"";display:block;width:45%;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--electric),var(--cyan));animation:login-progress .9s ease-in-out infinite}

@keyframes login-rise{from{opacity:0;transform:translateY(18px)}}@keyframes login-line-in{from{transform:scaleX(0)}}@keyframes guardian-enter{from{opacity:0;transform:translateX(50px) scale(.94);filter:blur(4px) drop-shadow(0 25px 30px rgba(29,89,177,.15))}}@keyframes guardian-float{50%{translate:0 -9px}}@keyframes login-radar-in{from{opacity:0;transform:scale(.68) rotate(-18deg)}}@keyframes radar-ring{to{transform:rotate(360deg)}}@keyframes shield-charge{50%{transform:scale(1.07);filter:brightness(1.12);box-shadow:0 0 0 15px rgba(7,95,255,0),0 0 46px rgba(7,95,255,.5)}}@keyframes login-particle{0%{opacity:0;transform:translate3d(0,28px,0) scale(.6)}20%{opacity:.8}70%{opacity:.35}100%{opacity:0;transform:translate3d(35px,-95px,0) scale(1.3)}}@keyframes card-sheen{0%,68%{transform:translateX(-120%)}88%,100%{transform:translateX(120%)}}@keyframes card-in-right{from{opacity:0;translate:38px 0;scale:.92}}@keyframes card-in-left{from{opacity:0;translate:-35px 0;scale:.92}}@keyframes card-float-a{50%{translate:0 -7px;rotate:.5deg}}@keyframes card-float-b{50%{translate:0 8px;rotate:-.7deg}}@keyframes card-float-c{50%{translate:-5px -6px;rotate:.6deg}}@keyframes policy-scan{0%{transform:translateX(-115%)}60%,100%{transform:translateX(245%)}}@keyframes mini-packet{from{left:0;opacity:0}15%{opacity:1}85%{opacity:1}to{left:100%;opacity:0}}@keyframes metric-breathe{50%{transform:translateY(-2px);box-shadow:0 10px 26px rgba(7,95,255,.18)}}@keyframes wave-spin{to{transform:rotate(360deg)}}@keyframes login-card-in{from{opacity:0;transform:translateY(22px) scale(.98)}}@keyframes logo-ring{0%{opacity:.8;transform:translate(-50%,-50%) scale(.65)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}@keyframes shield-hover{50%{transform:translateY(-4px);filter:drop-shadow(0 11px 12px rgba(7,95,255,.28))}}@keyframes button-sheen{0%,55%{transform:translateX(-120%)}78%,100%{transform:translateX(120%)}}@keyframes secure-scan{to{left:120%}}@keyframes transition-ring{from{opacity:.8;transform:scale(.55)}to{opacity:0;transform:scale(1.3)}}@keyframes login-progress{0%{transform:translateX(-110%)}100%{transform:translateX(260%)}}

@keyframes pulse-core{50%{box-shadow:0 0 0 8px rgba(8,186,130,0),0 0 17px rgba(8,186,130,.75)}}@keyframes reveal{from{opacity:0;transform:translateY(8px)}}@keyframes route-enter{from{opacity:0;transform:translateY(7px)}}@keyframes draw-line{to{stroke-dashoffset:0}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes donut-in{from{transform:rotate(-45deg) scale(.86);opacity:0}}@keyframes orbit{from{transform:rotate(0) translateX(32px) rotate(0)}to{transform:rotate(360deg) translateX(32px) rotate(-360deg)}}@keyframes node-pulse{50%{transform:scale(1.35);opacity:.65}}@keyframes beam{0%{opacity:0;transform-origin:left}50%{opacity:1}100%{opacity:0}}@keyframes popover-in{from{opacity:0;transform:translateY(-5px) scale(.98)}}@keyframes scan-vertical{0%{top:6%;opacity:0}10%{opacity:1}90%{opacity:1}100%{top:90%;opacity:0}}@keyframes flow-packet{from{left:12%;opacity:0}10%{opacity:1}90%{opacity:1}to{left:88%;opacity:0}}@keyframes bar-grow{from{width:0}}@keyframes radar-spin{to{transform:rotate(360deg)}}@keyframes bar-in{from{transform:scaleY(0)}}@keyframes link-packet{from{left:0;opacity:0}10%{opacity:1}90%{opacity:1}to{left:100%;opacity:0}}@keyframes editor-scan{from{top:0}to{top:100%}}@keyframes modal-in{from{opacity:0;transform:translateY(12px) scale(.98)}}@keyframes command-in{from{opacity:0;transform:translateY(-8px) scale(.98)}}@keyframes drawer-in{from{transform:translateX(100%)}}@keyframes toast-in{from{opacity:0;transform:translateX(18px)}}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin .85s linear infinite}

@media (max-width: 1320px){
  :root{--sidebar:220px}
  .topbar{gap:14px}.topbar-left{min-width:195px}.core-status{display:none}.global-search{min-width:240px}
  .page-grid{grid-template-columns:1fr 1.2fr}.assistant-card{grid-column:1}.map-panel{grid-column:2}.tls-panel{grid-column:2}.events-panel{grid-column:1/3}
  .metric-card{padding:14px}.sparkline{width:62px}
  .applications-layout,.users-layout{grid-template-columns:minmax(0,1fr) 275px}.policy-layout{grid-template-columns:1fr 1fr}.version-panel{grid-column:1/-1}.timeline{display:grid;grid-template-columns:repeat(4,1fr)}.timeline::before{left:22px;right:22px;top:18px;bottom:auto;width:auto;height:1px}
  .pool-card{grid-template-columns:32px 1.1fr .8fr .5fr .5fr auto}.pool-card>svg{display:none}
  .login-copy{width:62%}.login-copy h1{font-size:36px}.login-features{grid-template-columns:repeat(2,1fr)}
}

@media (max-width: 1050px){
  .metrics-grid,.rule-summary-grid{grid-template-columns:repeat(2,1fr)}
  .topbar-left p{display:none}.topbar-left{min-width:auto}.profile-button>div{display:none}.notifications-popover{right:65px}.workspace{padding-inline:16px}
  .page-grid{grid-template-columns:1fr}.posture-panel,.traffic-chart-panel,.assistant-card,.events-panel,.map-panel,.tls-panel{grid-column:1}.traffic-chart-panel{min-height:270px}
  .applications-layout,.users-layout,.lb-layout,.network-layout,.config-layout{grid-template-columns:1fr}.detail-rail{grid-template-columns:repeat(3,1fr)}.app-detail,.detail-rail>.panel{min-width:0}.config-side{grid-template-columns:repeat(3,1fr)}
  .profile-grid{grid-template-columns:1fr}.profile-card{min-height:100px}.policy-layout{grid-template-columns:1fr 1fr}.version-panel{grid-column:1/-1}
  .topology{transform:scale(.88);margin-inline:-55px}.three-grid{grid-template-columns:1fr 1fr}.three-grid>.panel:last-child{grid-column:1/-1}
  .cert-bottom-grid{grid-template-columns:1fr}.login-page{grid-template-columns:1fr}.login-visual{display:none}.login-panel{min-height:100vh;padding:48px 22px 68px}.login-radar,.login-floating-card,.login-particles{display:none}.mobile-login-guardian{position:absolute;right:-52px;top:-48px;width:230px;height:230px;display:grid;place-items:center;color:var(--electric);opacity:.16;pointer-events:none}.mobile-login-guardian>svg{z-index:2;width:74px;height:74px;padding:16px;border:1px solid currentColor;clip-path:polygon(50% 0,94% 14%,88% 72%,50% 100%,12% 72%,6% 14%);animation:shield-charge 2.8s ease-in-out infinite}.mobile-login-guardian span{position:absolute;inset:18px;border:1px dashed currentColor;border-radius:50%;animation:radar-ring 15s linear infinite}.mobile-login-guardian span:last-child{inset:48px;animation-duration:10s;animation-direction:reverse}
}

@media (max-width: 780px){
  :root{--sidebar:278px}
  .app-shell{display:block;padding-bottom:65px}.app-main{grid-column:auto}.sidebar{transform:translateX(-105%);box-shadow:20px 0 50px rgba(9,39,88,.18)}.sidebar.mobile-open{transform:translateX(0)}.sidebar-top{justify-content:space-between}.sidebar-collapse{display:none}.mobile-close{display:block}.mobile-scrim{position:fixed;z-index:35;inset:0;border:0;background:rgba(5,19,44,.4);backdrop-filter:blur(3px)}
  .topbar{height:62px;padding:0 12px}.mobile-menu{display:grid;place-items:center}.topbar-left h1{font-size:15px}.topbar-center{justify-content:flex-end}.global-search{min-width:36px;width:36px;padding:0;justify-content:center}.global-search span,.global-search kbd{display:none}.topbar-right{gap:5px}.hide-small{display:none}.profile-button{gap:3px}.profile-button>b{width:31px;height:31px}.profile-button>svg{display:none}.notifications-popover{position:fixed;top:62px;right:8px;left:8px;width:auto}
  .workspace{padding:10px 10px 22px}.page-header{align-items:flex-start}.breadcrumb{display:none}.page-actions{width:100%;overflow-x:auto;justify-content:flex-end;padding-bottom:2px}.page-actions .button{white-space:nowrap}.page-actions .deploy-button{display:none}
  .metrics-grid,.rule-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.metric-card{min-height:100px;padding:12px;gap:9px}.metric-icon{width:34px;height:34px}.metric-copy>span{white-space:normal;font-size:8px}.metric-copy>strong{font-size:20px}.sparkline{position:absolute;right:9px;bottom:10px;width:55px}
  .panel{border-radius:10px}.posture-content{flex-direction:column}.posture-list{width:100%}.chart-stats{gap:5px}.chart-stats>div{padding-left:7px}.chart-stats strong{font-size:12px}.chart-stats em{margin:3px 0 0}
  .detail-rail,.config-side{grid-template-columns:1fr}.profile-grid{padding-inline:9px}.policy-layout,.two-grid,.three-grid{grid-template-columns:1fr}.three-grid>.panel:last-child{grid-column:auto}.timeline{grid-template-columns:1fr}.timeline::before{left:25px;right:auto;top:13px;bottom:22px;width:1px;height:auto}
  .inspection-steps{margin-left:20px}.flow-stage{width:48px}.flow-stage svg{width:29px;height:29px}.flow-arrow{width:13px}.flow-result{display:none}
  .topology{min-height:585px;transform:none;margin:0;flex-direction:column;gap:0}.topology-node{width:160px;min-height:90px}.topology-link{width:2px;height:48px}.topology-link::after{right:-3px;top:auto;bottom:-3px;border-left-color:transparent;border-top-color:#87aee8}.topology-link>span{top:18px;left:9px;width:max-content}.topology-link .packet{left:-3px;animation:link-packet-vertical 2.2s linear infinite}.origin-cluster{width:180px;padding:10px 0 0}.architecture-head{flex-direction:column}.architecture-actions{align-self:flex-start}.architecture-legend{flex-wrap:wrap}.architecture-legend em{width:100%;margin:0}
  .pool-card{grid-template-columns:34px 1fr auto;padding:10px}.pool-card>div:nth-child(n+3):not(:last-of-type){display:none}.lb-layout{grid-template-columns:1fr}
  .interface-grid{grid-template-columns:1fr}.ha-visual{flex-direction:column}.ha-sync{height:52px;width:100%}.ha-sync::before,.ha-sync::after{display:none}
  .recovery-hero{padding:16px}.recovery-score{display:none}.recovery-orbit{width:62px;height:62px}.recovery-hero h2{font-size:16px}
  .cert-bottom-grid{grid-template-columns:1fr}.secure-storage{min-height:0}.vault-graphic{display:none}.acme-grid{grid-template-columns:1fr}.schedule-card{padding-inline:0}
  .toolbar{overflow-x:auto}.search-field{min-width:200px}.toolbar .select-button{white-space:nowrap}
  .responsive-table{overflow:visible;padding:0 9px 9px}.responsive-table table,.responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%;min-width:0}.responsive-table thead{display:none}.responsive-table tr{margin:8px 0;padding:8px;border:1px solid var(--line);border-radius:9px;background:white}.responsive-table td{min-height:29px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 3px;border-top:1px solid #edf2fa;text-align:right}.responsive-table td:first-child{border-top:0}.responsive-table td::before{content:attr(data-label);color:#8191aa;font-size:7px;text-transform:uppercase;letter-spacing:.3px}.responsive-table td>div,.responsive-table td>span{max-width:70%;text-align:left}.responsive-table .cell-title,.responsive-table .rule-name,.responsive-table .user-cell,.responsive-table .actor-cell{margin-left:auto}.table-footer{padding-inline:12px}
  .config-editor-panel{border-radius:10px}.editor-tabs{overflow-x:auto}.code-editor-shell{min-height:480px}.code-editor-shell pre,.line-numbers{font-size:8px}.editor-status span:nth-child(n+3){display:none}
  .app-footer{display:none}.mobile-bottom-nav{position:fixed;z-index:32;left:0;right:0;bottom:0;height:61px;display:grid;grid-template-columns:repeat(5,1fr);padding:4px 5px max(4px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:rgba(255,255,255,.94);backdrop-filter:blur(16px);box-shadow:0 -8px 24px rgba(31,68,126,.09)}.mobile-bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;border-radius:8px;background:transparent;color:#7386a8;font-size:7px;cursor:pointer}.mobile-bottom-nav button svg{width:18px}.mobile-bottom-nav button.active{color:var(--electric);background:#edf4ff}.mobile-ai-fab{position:fixed;z-index:31;right:12px;bottom:72px;display:flex;align-items:center;gap:4px;height:34px;padding:0 11px;border:0;border-radius:18px;background:linear-gradient(135deg,#075fff,#00a1ff);color:white;box-shadow:0 10px 25px rgba(7,95,255,.3);font-size:8px;font-weight:800}.mobile-ai-fab svg{width:14px}
  .modal{max-height:calc(100vh - 20px)}.modal-content{padding:14px}.form-grid,.choice-grid,.simulator-layout{grid-template-columns:1fr}.field.full,.switch-field.full,.review-box.full{grid-column:auto}.stepper>span{font-size:0}.stepper i{font-size:8px}.modal-actions{position:sticky;bottom:-14px;margin-inline:-14px;padding:11px 14px;background:white}.certificate-methods{grid-template-columns:1fr}.choice{min-height:68px}.deploy-summary{align-items:flex-start}.deploy-orbit{width:50px;height:50px}.command-backdrop{padding-top:8px}.command-palette{max-height:calc(100vh - 16px)}.command-results{max-height:calc(100vh - 85px)}
  .toast-stack{right:8px;bottom:72px}
}

@media (max-width: 430px){
  .metrics-grid,.rule-summary-grid{grid-template-columns:1fr 1fr}.metric-card{min-height:112px;display:block}.metric-icon{margin-bottom:7px}.sparkline{width:52px}
  .topbar-right .notification-button{display:none}.topbar-left{flex:1}.global-search{display:none}.page-actions>.button.secondary{display:none}
  .chart-stats{grid-template-columns:1fr}.chart-stats>div{display:grid;grid-template-columns:1fr auto auto;align-items:center;padding:7px 0;border-left:0;border-top:1px solid var(--line)}.chart-stats>div:first-child{border-top:0}.chart-stats strong{margin:0}.chart-stats em{margin:0}.world-map{height:155px}.tls-health{flex-direction:column}.tls-list{width:100%}
  .profile-card{grid-template-columns:35px 1fr}.profile-stat{grid-column:1/-1;justify-content:flex-end}.inspection-flow{gap:4px;padding-inline:3px}.inspection-steps{margin-inline:9px}.apply-strip{align-items:flex-start;flex-direction:column}.apply-strip .button{width:100%}
  .architecture-hero{padding:14px}.architecture-head h2{font-size:17px}.architecture-actions .button{display:none}.safe-apply-banner{align-items:flex-start;flex-direction:column}.interface-card dl{grid-template-columns:1fr 1fr}.interface-card dl>div:last-child{display:none}
  .secure-storage{padding:13px}.secure-storage-copy>.metric-icon{display:none}.acme-grid{padding-inline:9px}
  .assistant-drawer{width:100vw}.assistant-drawer form{padding-bottom:max(11px,env(safe-area-inset-bottom))}.login-panel{padding:24px 14px 66px;place-items:center}.login-card{padding:27px 21px;border-radius:16px}.login-card h2{font-size:23px}.login-card>p{margin-bottom:20px}.login-panel footer{left:16px;right:16px;bottom:17px;gap:12px}.login-panel footer span:first-child{display:none}.mobile-login-guardian{right:-78px;top:-72px;width:210px;height:210px;opacity:.12}.login-transition>i{width:150px}
}

@keyframes link-packet-vertical{from{top:0;opacity:0}10%{opacity:1}90%{opacity:1}to{top:100%;opacity:0}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

.windows-download {
  min-height:48px;display:flex;align-items:center;gap:10px;margin-top:12px;padding:8px 11px;
  border:1px solid #c8daf8;border-radius:10px;background:linear-gradient(110deg,#f6f9ff,#edf5ff);
  color:#244f93;text-decoration:none;transition:.18s ease;
}
.windows-download:hover { border-color:#7aaaff;transform:translateY(-1px);box-shadow:0 9px 22px rgba(7,95,255,.1); }
.windows-download>svg { width:22px;height:22px;fill:#0876eb; }
.windows-download>span { flex:1; }
.windows-download strong,.windows-download small { display:block; }
.windows-download strong { font-size:9px; }
.windows-download small { margin-top:4px;color:#7188ad;font-size:7px; }
.windows-download>b { width:25px;height:25px;display:grid;place-items:center;border-radius:7px;background:#fff;color:var(--electric);font-size:13px; }

.auth-status{min-height:16px;margin:8px 0 2px;color:var(--red);font-size:8px;line-height:1.4;text-align:center}
.auth-status.success{color:var(--green)}
.password-toggle{width:22px;height:24px;padding:0;border:0;background:transparent;color:#7891bb;cursor:pointer;font-size:12px;line-height:1}
.password-toggle:hover{color:var(--electric)}
.protection-panel{position:relative}

/* Readability pass for the production sign-in screen. */
.login-copy p{font-size:15px}
.login-metrics span{font-size:10px}.login-metrics strong{font-size:20px}
.login-features span{font-size:10px}.login-features strong{font-size:11px}
.login-card h2{font-size:29px}.login-card>p{font-size:13px}
.field>span{font-size:12px}.input-icon input{font-size:14px}
.login-options{font-size:11px}.login-options button{font-size:11px}
.button{font-size:13px}.secure-connection{font-size:10px}.secure-connection strong{font-size:11px}
.auth-status{font-size:11px}
