/* blockcdp console — v2
   Palette moves deliberately toward indigo/graphite: this is a data
   protection product, and cool blue reads as trustworthy/secure in
   backup and security tooling specifically (distinct from the generic
   dark-mode teal/cyan look). Layout follows the admin-panel convention
   familiar from WHM/cPanel and observability dashboards: fixed sidebar,
   content column, stat cards up top. The block-grid motif from v1
   remains the one signature element, now used more sparingly. */

:root {
  --bg: #0A0D13;
  --sidebar-bg: #0D1017;
  --panel: #12161F;
  --panel-elevated: #161B26;
  --border: #232937;
  --border-soft: #1B2029;
  --text: #ECEEF3;
  --muted: #8991A3;
  --muted-2: #5C6577;

  --accent: #5B8DEF;        /* primary: indigo-blue */
  --accent-hover: #74A0F3;
  --accent-dim: #1E2A47;
  --accent-text: #9DBBF6;

  --success: #34D399;
  --success-dim: #123328;
  --warn: #F2A93B;
  --warn-dim: #3A2C10;
  --danger: #F0576B;
  --danger-dim: #3A1620;

  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;

  --radius: 8px;
  --radius-lg: 12px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 14.5px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--accent-text); text-decoration: none; }
a:hover { color: var(--accent-hover); }
.mono { font-family: var(--font-mono); font-size: 0.92em; letter-spacing: -0.01em; }
.muted { color: var(--muted); }
.hint { color: var(--muted-2); font-size: 0.83em; margin: -4px 0 10px; line-height: 1.5; }
.error-text { color: var(--danger); font-size: 0.9em; }

/* ---------------- layout: sidebar + content ---------------- */
.app-shell { display: flex; min-height: 100vh; }

.sidebar {
  width: 216px; flex-shrink: 0;
  background: var(--sidebar-bg);
  border-right: 1px solid var(--border-soft);
  display: flex; flex-direction: column;
  padding: 22px 16px;
  position: sticky; top: 0; height: 100vh;
}
.sidebar .brand { padding: 0 8px 24px; }
.side-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.side-nav a {
  display: flex; align-items: center; gap: 10px;
  color: var(--muted); font-size: 0.9em; font-weight: 500;
  padding: 9px 10px; border-radius: 7px;
}
.side-nav a:hover { color: var(--text); background: var(--panel); }
.side-nav a.active { color: var(--text); background: var(--accent-dim); }
.side-nav .icon { width: 16px; height: 16px; color: currentColor; opacity: 0.85; flex-shrink: 0; }
.sidebar-footer { border-top: 1px solid var(--border-soft); padding-top: 14px; }
.current-user { font-size: 0.82em; margin-bottom: 8px; padding: 0 2px; }
.logout-link { font-size: 0.85em; color: var(--muted-2); }
.logout-link:hover { color: var(--text); }

.main-col { flex: 1; min-width: 0; }
.shell { max-width: 1140px; margin: 0 auto; padding: 40px 36px 90px; }
.shell-loggedout { max-width: none; padding: 0; }

/* ---------------- brand mark (signature) ---------------- */
.brand {
  display: flex; align-items: center; gap: 10px;
  font-weight: 650; font-size: 1.02rem; color: var(--text);
  letter-spacing: -0.01em;
}
.brand-lg { font-size: 1.5rem; }
.brand-mark { display: block; width: 22px; height: auto; flex-shrink: 0; }
.brand a { display: flex; line-height: 0; }
.brand a:hover .brand-mark { opacity: 0.85; }
.brand-lg .brand-mark, .login-card .brand .brand-mark { width: 34px; }
.brand-mark-lockup { width: 220px !important; height: auto; }
.brand-lockup { justify-content: center; }

/* ---------------- headings / page head ---------------- */
.page-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 24px; gap: 16px; flex-wrap: wrap;
}
h1 { font-size: 1.5rem; margin: 0 0 4px; letter-spacing: -0.015em; font-weight: 650; }
h2 { font-size: 1.02rem; margin: 36px 0 14px; color: var(--text); font-weight: 620; }
h3 { font-size: 0.78em; margin: 0 0 14px; color: var(--muted-2); font-weight: 650; text-transform: uppercase; letter-spacing: 0.06em; }

.actions { display: flex; gap: 10px; }
.actions form { display: inline; }

/* ---------------- stat strip ---------------- */
.stat-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 28px; }
.stat-card {
  background: var(--panel); border: 1px solid var(--border-soft); border-radius: var(--radius-lg);
  padding: 16px 18px;
}
.stat-card .stat-value { font-size: 1.55rem; font-weight: 650; letter-spacing: -0.02em; }
.stat-card .stat-label { font-size: 0.78em; color: var(--muted); margin-top: 2px; }
@media (max-width: 720px) { .stat-strip { grid-template-columns: 1fr; } }

/* ---------------- buttons ---------------- */
.btn {
  font-family: var(--font-ui);
  font-size: 0.87em; font-weight: 600;
  padding: 9px 16px; border-radius: 7px; border: 1px solid transparent;
  cursor: pointer; transition: background 0.12s, border-color 0.12s;
}
.btn-primary { background: var(--accent); color: #08101F; }
.btn-primary:hover { background: var(--accent-hover); }
.btn-ghost { background: transparent; border-color: var(--border); color: var(--text); }
.btn-ghost:hover { border-color: var(--muted-2); background: var(--panel); }
.btn-danger { background: transparent; border-color: var(--border); color: var(--danger); }
.btn-danger:hover { border-color: var(--danger); background: var(--danger-dim); }

/* ---------------- forms ---------------- */
.stack { display: flex; flex-direction: column; gap: 6px; max-width: 520px; }
.stack label { font-size: 0.84em; color: var(--muted); margin-top: 12px; font-weight: 500; }
.stack input, .stack select {
  background: var(--panel-elevated); border: 1px solid var(--border); color: var(--text);
  padding: 10px 12px; border-radius: 7px; font-family: var(--font-ui); font-size: 0.95em;
}
.stack input:focus, .stack select:focus { outline: none; border-color: var(--accent); }
.stack .row { display: flex; gap: 16px; }
.stack .row > div { flex: 1; display: flex; flex-direction: column; }
.stack button { margin-top: 20px; align-self: flex-start; }
.field-group { border-top: 1px solid var(--border-soft); margin-top: 18px; padding-top: 4px; }

/* ---------------- cards ---------------- */
.card {
  background: var(--panel); border: 1px solid var(--border-soft); border-radius: var(--radius-lg);
  padding: 22px 24px;
}
.card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 8px; }
@media (max-width: 720px) { .card-grid { grid-template-columns: 1fr; } }

.kv { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; margin: 0; }
.kv dt { color: var(--muted); font-size: 0.83em; }
.kv dd { margin: 0; font-family: var(--font-mono); font-size: 0.87em; }

.info-box {
  background: var(--accent-dim); border: 1px solid rgba(91,141,239,0.25); border-radius: var(--radius);
  padding: 12px 14px; font-size: 0.86em; color: var(--accent-text); margin-top: 8px;
}

/* ---------------- table ---------------- */
.job-table { width: 100%; border-collapse: collapse; }
.job-table th {
  text-align: left; font-size: 0.74em; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--muted-2); padding: 0 14px 10px; font-weight: 650;
}
.job-table td { padding: 15px 14px; border-top: 1px solid var(--border-soft); }
.job-table tbody tr[onclick] { cursor: pointer; }
.job-table tbody tr[onclick]:hover { background: var(--panel); }
.job-name { font-weight: 600; }
.job-type-badge {
  display: inline-block; font-size: 0.72em; font-weight: 650; padding: 2px 7px; border-radius: 4px;
  background: var(--panel-elevated); color: var(--muted); margin-left: 8px; vertical-align: middle;
  text-transform: uppercase; letter-spacing: 0.03em;
}

/* ---------------- status pills ---------------- */
.pill {
  display: inline-block; padding: 3px 10px; border-radius: 100px;
  font-size: 0.78em; font-weight: 650; font-family: var(--font-mono);
}
.pill-ok { background: var(--success-dim); color: var(--success); }
.pill-running { background: var(--warn-dim); color: var(--warn); }
.pill-failed { background: var(--danger-dim); color: var(--danger); }
.pill-never-run { background: var(--panel-elevated); color: var(--muted); }

/* ---------------- block-grid sparkline ---------------- */
.block-grid { display: flex; gap: 3px; }
.block { width: 8px; height: 8px; border-radius: 2px; }
.block-ok { background: var(--success); opacity: 0.9; }
.block-empty { background: var(--border-soft); }

/* ---------------- misc ---------------- */
.empty-state {
  text-align: center; padding: 64px 20px; color: var(--muted);
  border: 1px dashed var(--border); border-radius: var(--radius-lg);
}
.empty-state .btn { margin-top: 16px; }

.flashes { margin-bottom: 22px; }
.flash { padding: 11px 14px; border-radius: var(--radius); margin-bottom: 8px; font-size: 0.89em; }
.flash-info { background: var(--success-dim); color: var(--success); }
.flash-error { background: var(--danger-dim); color: var(--danger); }

.login-wrap { display: flex; justify-content: center; align-items: center; min-height: 100vh; background: var(--bg); }
.login-card {
  background: var(--panel); border: 1px solid var(--border-soft); border-radius: var(--radius-lg);
  padding: 40px 44px; width: 340px; text-align: left;
  box-shadow: 0 20px 60px rgba(0,0,0,0.35);
}
.login-card .stack { max-width: none; margin-top: 20px; }
.login-card button { align-self: stretch; text-align: center; padding: 11px; }
.login-card .muted { font-size: 0.88em; margin-top: 2px; }

/* ---------------- progress ---------------- */
.progress-wrap {
  width: 100%; max-width: 260px; height: 6px;
  background: var(--border-soft); border-radius: 100px; overflow: hidden;
}
.progress-bar {
  height: 100%; background: var(--accent); border-radius: 100px;
  transition: width 0.4s ease;
}
.pill-cancelled { background: var(--panel-elevated); color: var(--warn); }

/* ==========================================================
   LionGuard CDP — Enterprise Console UI v2.1
   Dashboard layer. Existing forms/detail views remain compatible.
   ========================================================== */
:root {
  --console-bg: #08111b;
  --console-bg-2: #0b1521;
  --console-panel: #0f1b29;
  --console-panel-2: #122131;
  --console-line: #203044;
  --console-line-soft: rgba(129,153,181,.14);
  --console-gold: #f3b51b;
  --console-cyan: #35c7ce;
  --console-purple: #a567e8;
}
body { background: radial-gradient(circle at 78% 0%, rgba(42,95,142,.10), transparent 36%), var(--console-bg); }
.sidebar {
  width: 250px; padding: 18px 14px 16px; background: linear-gradient(180deg,#0b1622 0%,#09131e 72%,#08111a 100%);
  border-right-color: #1c2b3a; z-index: 40; box-shadow: 12px 0 32px rgba(0,0,0,.12);
}
.brand-console { padding: 0 8px 22px !important; gap: 11px; }
.brand-console .brand-mark { width: 34px; }
.brand-copy { display:flex; flex-direction:column; line-height:1.1; min-width:0; }
.brand-copy strong { color:#f5f8fc; font-size:15px; letter-spacing:.035em; white-space:nowrap; }
.brand-copy strong span { color:var(--console-gold); }
.brand-copy small { margin-top:5px; color:#8290a2; font-size:9px; letter-spacing:.02em; white-space:nowrap; }
.side-nav { gap:3px; }
.side-nav a { min-height:42px; padding:10px 12px; border-radius:7px; color:#a8b4c4; font-size:.88em; }
.side-nav a:hover { background:#111f2e; color:#fff; }
.side-nav a.active { background:linear-gradient(90deg,#184c9e,#174180); color:#fff; box-shadow:inset 3px 0 0 #5d9cff, 0 6px 16px rgba(0,45,112,.18); }
.side-nav .icon { width:17px; height:17px; }
.nav-label { color:#56677b; font-size:10px; text-transform:uppercase; letter-spacing:.13em; font-weight:700; padding:18px 12px 6px; }
.sidebar-footer { padding:14px 8px 0; }
.console-version { color:#68778a; font-size:10px; margin-bottom:9px; }
.console-version span { color:#8c9aad; }
.current-user { display:flex; align-items:center; gap:5px; }
.status-dot { width:7px; height:7px; border-radius:50%; background:var(--success); box-shadow:0 0 0 3px rgba(52,211,153,.10); }

.main-col { background:transparent; }
.topbar { height:72px; position:sticky; top:0; z-index:30; display:flex; align-items:center; padding:0 30px; background:rgba(7,16,25,.92); border-bottom:1px solid #1d2c3d; backdrop-filter:blur(14px); }
.topbar-title { font-size:16px; font-weight:650; color:#f5f7fa; }
.topbar-right { margin-left:auto; display:flex; align-items:center; gap:22px; }
.top-health { display:flex; align-items:center; gap:10px; padding-right:22px; border-right:1px solid #1d2c3d; }
.shield-dot { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:#0c3a2a; border:1px solid rgba(52,211,153,.22); color:#54e7a8; font-weight:800; }
.top-health div { display:flex; flex-direction:column; }
.top-health strong { font-size:11px; color:#e8edf3; }
.top-health strong span { color:#57e39c; }
.top-health small { color:#7f8da0; font-size:10px; margin-top:2px; }
.user-chip { color:#d9e0e8; font-size:12px; font-weight:600; padding:7px 10px; border-radius:7px; background:#101c29; border:1px solid #1d2c3d; }
.mobile-menu { display:none; background:none; border:0; color:#e9eef5; font-size:22px; padding:5px 9px 5px 0; cursor:pointer; }
.nav-scrim { display:none; }
.shell { max-width:1520px; padding:28px 28px 72px; }

.dashboard-head { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; margin-bottom:22px; }
.dashboard-head h1 { font-size:1.48rem; }
.eyebrow { color:#6c8cb5; font-size:10px; font-weight:750; letter-spacing:.14em; text-transform:uppercase; margin-bottom:5px; }
.page-subtitle { margin:4px 0 0; font-size:12px; }
.head-actions { display:flex; gap:8px; }

.metric-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:14px; }
.metric-card { position:relative; min-height:137px; padding:17px 17px 15px; border:1px solid var(--console-line); border-radius:7px; background:linear-gradient(180deg,rgba(17,31,45,.98),rgba(13,25,37,.98)); box-shadow:0 10px 30px rgba(0,0,0,.10); overflow:hidden; }
.metric-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,rgba(100,155,220,.26),transparent); }
.metric-icon { position:absolute; right:15px; top:17px; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-weight:800; border:1px solid currentColor; font-size:14px; }
.metric-blue { color:#60a3ff; background:rgba(45,111,204,.15); }
.metric-green { color:#4bd887; background:rgba(37,153,88,.14); }
.metric-red { color:#ff6d6d; background:rgba(185,55,55,.14); }
.metric-purple { color:#b57af2; background:rgba(127,69,184,.15); }
.metric-cyan { color:#44d1d7; background:rgba(38,151,158,.14); }
.metric-label { color:#afbbc9; font-size:10px; text-transform:uppercase; letter-spacing:.055em; font-weight:700; padding-right:42px; }
.metric-value { margin-top:12px; color:#f7f9fc; font-size:27px; line-height:1; font-weight:680; letter-spacing:-.025em; }
.metric-value small { font-size:12px; color:#a2afbd; font-weight:600; }
.metric-note { margin-top:12px; color:#8190a3; font-size:10px; }
.metric-note .good, .good { color:#4ed68a; }
.mini-meter { height:5px; background:#1a2938; border-radius:20px; margin:12px 0 -5px; overflow:hidden; }
.mini-meter span { height:100%; display:block; background:linear-gradient(90deg,#7d4ed5,#a463e6); border-radius:20px; }

.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr); gap:14px; margin-bottom:14px; }
.dashboard-grid-bottom { grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr); }
.console-card { background:linear-gradient(180deg,#0f1b28,#0d1824); border:1px solid var(--console-line); border-radius:7px; box-shadow:0 8px 28px rgba(0,0,0,.10); }
.card-head { min-height:57px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 16px; border-bottom:1px solid var(--console-line-soft); }
.card-head h2 { margin:0; font-size:12px; text-transform:uppercase; letter-spacing:.025em; color:#eef3f8; }
.card-head p { margin:2px 0 0; color:#718195; font-size:9.5px; }
.card-kpi { color:#91a7be; font-size:11px; font-family:var(--font-mono); }
.live-chip { font-size:8px; font-weight:800; letter-spacing:.1em; color:#4ddd91; padding:4px 7px; border:1px solid rgba(60,209,133,.25); background:rgba(33,133,85,.12); border-radius:20px; }

.protection-summary { min-height:218px; display:flex; align-items:center; justify-content:space-around; gap:28px; padding:24px 30px; }
.health-ring { --pct:100; width:145px; height:145px; flex:0 0 145px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(#35c76f calc(var(--pct)*1%),#1b2b39 0); position:relative; }
.health-ring::before { content:""; width:111px; height:111px; border-radius:50%; background:#0f1b28; position:absolute; box-shadow:inset 0 0 0 1px rgba(255,255,255,.025); }
.health-ring div { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; }
.health-ring strong { font-size:24px; letter-spacing:-.04em; }
.health-ring span { color:#77879a; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.protection-counts { display:grid; grid-template-columns:repeat(2,minmax(100px,1fr)); width:100%; max-width:410px; gap:10px; }
.protection-counts > div { position:relative; padding:15px 14px 12px 27px; background:#101e2b; border:1px solid #1d3043; border-radius:6px; }
.protection-counts b { display:block; font-size:20px; color:#f3f6fa; }
.protection-counts small { color:#7e8ea1; font-size:9px; }
.legend-dot { position:absolute; left:11px; top:20px; width:7px; height:7px; border-radius:50%; }
.legend-dot.ok { background:#3ecf78; }.legend-dot.running { background:#55a1ff; }.legend-dot.failed { background:#f55f64; }.legend-dot.pending { background:#7b8795; }

.repo-list { padding:5px 16px 8px; }
.repo-row { display:block; padding:11px 0; border-bottom:1px solid rgba(129,153,181,.09); color:inherit; }
.repo-row:hover { color:inherit; }
.repo-row:last-child { border-bottom:0; }
.repo-row-top { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.repo-row-top > div { min-width:0; }
.repo-row strong { font-size:10.5px; display:inline-block; color:#e7edf4; }
.repo-row small { display:block; padding-left:24px; color:#617286; font-size:8.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:370px; }
.repo-icon { display:inline-grid; place-items:center; width:18px; height:18px; margin-right:5px; color:#91a9bf; background:#132536; border-radius:4px; font-size:10px; }
.repo-row .mono { color:#aab6c4; font-size:9px; white-space:nowrap; margin-top:3px; }
.usage-track { height:5px; margin-top:8px; border-radius:20px; background:#192837; overflow:hidden; }
.usage-track span { display:block; height:100%; border-radius:20px; background:linear-gradient(90deg,#427fd0,#66a8fb); }
.usage-track.warning span { background:linear-gradient(90deg,#e8a31b,#ffc043); }
.usage-track.unmetered span { background:#50687f; }
.warning-strip { padding:9px 16px; background:#261d0b; border-top:1px solid #4b3b17; color:#ffc22c; font-size:9.5px; }

.live-jobs,.alert-list { min-height:170px; }
.live-job-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(170px,.65fr); gap:25px; align-items:center; padding:13px 16px; border-bottom:1px solid rgba(129,153,181,.09); color:inherit; }
.live-job-row:hover,.alert-row:hover { background:rgba(67,117,166,.06); color:inherit; }
.live-job-main { display:flex; align-items:center; gap:10px; min-width:0; }
.live-job-main div { min-width:0; }
.live-job-main strong { display:block; color:#eaf0f6; font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.live-job-main small { display:block; color:#708195; font-size:8.8px; margin-top:2px; }
.pulse-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#47d684; box-shadow:0 0 0 4px rgba(71,214,132,.08); }
.job-progress > div:first-child { display:flex; justify-content:space-between; color:#52d98b; font-size:9px; }
.job-progress b { color:#b8c5d2; font-size:9px; font-family:var(--font-mono); }
.alert-count { min-width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#152434; color:#7890a8; font-size:10px; font-weight:700; }
.alert-count.has-alerts { background:#512329; color:#ff777c; border:1px solid #723037; }
.alert-row { display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid rgba(129,153,181,.09); color:inherit; }
.alert-symbol { display:grid; place-items:center; width:22px; height:22px; flex:0 0 22px; border-radius:50%; font-size:13px; font-weight:800; }
.alert-symbol.danger { background:#51242a; color:#ff7378; }.alert-symbol.warn { background:#47340e; color:#ffc244; }
.alert-row strong { color:#e6ecf3; font-size:10px; display:block; }
.alert-row small { color:#758598; font-size:8.5px; display:block; max-width:470px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.compact-empty { min-height:135px; display:flex; align-items:center; justify-content:center; color:#708195; font-size:10px; padding:20px; text-align:center; }
.success-empty { gap:10px; text-align:left; }
.success-empty > span { width:28px; height:28px; border-radius:50%; background:#123a29; color:#4cdb8b; display:grid; place-items:center; font-weight:800; }
.success-empty strong { display:block; color:#b9c7d4; font-size:10px; }.success-empty small { display:block; color:#657589; font-size:8.5px; }

.server-table-card { margin-top:14px; scroll-margin-top:90px; overflow:hidden; }
.table-action { font-size:9.5px; color:#75aef4; }
.table-scroll { overflow-x:auto; }
.console-table { min-width:900px; }
.console-table th { background:#0c1722; padding:11px 13px; font-size:9px; color:#627489; }
.console-table td { padding:13px; font-size:10.5px; border-top-color:rgba(129,153,181,.11); }
.console-table tbody tr[onclick]:hover { background:#111f2d; }
.server-bullet { display:inline-block; width:7px; height:7px; border-radius:50%; background:#4d93e2; margin-right:8px; box-shadow:0 0 0 3px rgba(77,147,226,.08); }
.capacity-badge { margin-left:5px; color:#ffc14d; font-size:8px; }

@media (max-width: 1220px) {
  .metric-grid { grid-template-columns:repeat(3,1fr); }
  .dashboard-grid,.dashboard-grid-bottom { grid-template-columns:1fr; }
}
@media (max-width: 900px) {
  .sidebar { position:fixed; left:-260px; transition:left .18s ease; }
  body.nav-open .sidebar { left:0; }
  .nav-scrim { position:fixed; inset:0; z-index:35; background:rgba(0,0,0,.52); }
  body.nav-open .nav-scrim { display:block; }
  .mobile-menu { display:block; }
  .topbar { height:62px; padding:0 18px; }
  .top-health { display:none; }
  .shell { padding:22px 18px 55px; }
  .metric-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 600px) {
  .dashboard-head { align-items:flex-start; flex-direction:column; }
  .head-actions { width:100%; }
  .head-actions .btn { flex:1; text-align:center; }
  .metric-grid { grid-template-columns:1fr; }
  .metric-card { min-height:118px; }
  .protection-summary { padding:22px 18px; flex-direction:column; }
  .protection-counts { grid-template-columns:1fr 1fr; }
  .live-job-row { grid-template-columns:1fr; gap:9px; }
  .repo-row-top { flex-direction:column; gap:3px; }
  .repo-row small { max-width:280px; }
  .user-chip { display:none; }
  .topbar-right { gap:0; }
  .dashboard-head h1 { font-size:1.3rem; }
}

/* LionGuard v2.2 - Lion Server Firewall security center */
.firewall-head{align-items:center}.security-badge{display:inline-flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.025);font-weight:700;font-size:12px;white-space:nowrap}.security-badge.good{color:#66df91;border-color:rgba(45,190,102,.3)}.security-badge.bad{color:#ff7777;border-color:rgba(229,78,78,.32)}.security-orb{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 13px currentColor}.warning-panel{border-color:rgba(245,179,47,.34);background:rgba(245,179,47,.055);color:#e9d49a;margin-bottom:18px}.fw-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:18px;margin-bottom:18px}.panel-title{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:15px}.panel-title h2{margin:3px 0 0;font-size:17px}.eyebrow{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:800}.pill{display:inline-flex;padding:4px 8px;border-radius:999px;border:1px solid var(--line);font-size:10px;color:var(--muted);white-space:nowrap}.pill-ok{color:#55d987;border-color:rgba(56,201,112,.28);background:rgba(56,201,112,.07)}.pill-danger{color:#ff7474;border-color:rgba(231,77,77,.28);background:rgba(231,77,77,.07)}.terminal-output{min-height:180px;max-height:340px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;background:#070d15;border:1px solid rgba(125,151,181,.13);border-radius:8px;padding:14px;margin:0;font:11px/1.6 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:#b9c9d9}.terminal-output.small{min-height:120px;margin-top:12px}.events-output{min-height:220px}.inline-search{display:flex;gap:9px}.inline-search input{flex:1;min-width:0}.fw-action-form{display:grid;grid-template-columns:1fr 1fr 220px;gap:14px;align-items:end}.fw-action-form label{display:flex;flex-direction:column;gap:7px}.fw-action-form label span{font-size:11px;color:var(--muted);font-weight:700}.fw-actions{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:14px}.btn-good{border-color:rgba(56,201,112,.35)!important;color:#69df93!important}.btn-danger{border-color:rgba(231,77,77,.38)!important;color:#ff7373!important}.btn-warn{border-color:rgba(245,179,47,.38)!important;color:#f4c45d!important}.btn-ghost{opacity:.8}.guardrail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.guardrail-grid>div{padding:13px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.018)}.guardrail-grid strong,.guardrail-grid span{display:block}.guardrail-grid strong{font-size:12px;margin-bottom:5px}.guardrail-grid span{font-size:11px;color:var(--muted);line-height:1.45}.security-notes{margin-bottom:26px}
@media(max-width:1050px){.fw-grid{grid-template-columns:1fr}.fw-action-form{grid-template-columns:1fr 1fr}.guardrail-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.firewall-head{align-items:flex-start}.fw-action-form{grid-template-columns:1fr}.guardrail-grid{grid-template-columns:1fr}.inline-search{flex-direction:column}.security-badge{margin-top:8px}}
/* LionGuard v2.3 Protection Center */
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 22px}.page-heading h1{margin:0 0 5px}.restore-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.restore-tile{background:var(--card,#111c2b);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:20px;min-height:150px}.restore-tile b{font-size:25px}.restore-tile h3{margin:16px 0 7px}.restore-tile p{color:#8fa0b5;font-size:.9rem}.restore-tile.disabled{opacity:.62}.restore-tile span,.nav-soon{font-size:.64rem;letter-spacing:.08em;color:#60a5fa}.score-orb{width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:7px solid #22c55e;background:#0d1724}.score-orb strong{font-size:1.8rem}.score-orb small{color:#8fa0b5}.score-warn{border-color:#f59e0b}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.metric-card{background:var(--card,#111c2b);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:18px}.metric-card small{display:block;color:#8fa0b5}.metric-card strong{font-size:1.8rem}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.health-bars{height:150px;display:flex;align-items:flex-end;gap:3px;border-bottom:1px solid rgba(255,255,255,.08);padding-top:10px}.health-bars i{display:block;flex:1;min-width:3px;max-width:12px;background:currentColor;color:#22c55e;border-radius:3px 3px 0 0;opacity:.75}.table-scroll{overflow-x:auto}pre{overflow:auto;background:#08111d;padding:14px;border-radius:9px}@media(max-width:950px){.restore-grid,.metric-grid{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}@media(max-width:560px){.restore-grid,.metric-grid{grid-template-columns:1fr}.page-heading{align-items:flex-start;flex-direction:column}}

/* LionGuard v2.4 granular recovery */
.recovery-picker{display:grid;grid-template-columns:1fr 1.4fr 1.4fr auto;gap:12px;align-items:end}.recovery-picker label{display:grid;gap:6px;color:#8fa0b5;font-size:.82rem}.recovery-picker select{min-width:0}.restore-tile .btn{margin-top:10px;margin-right:5px}.restore-tile:not(.disabled){transition:transform .15s ease,border-color .15s ease}.restore-tile:not(.disabled):hover{transform:translateY(-2px);border-color:rgba(96,165,250,.4)}@media(max-width:950px){.recovery-picker{grid-template-columns:1fr 1fr}}@media(max-width:560px){.recovery-picker{grid-template-columns:1fr}}
/* LionGuard v2.5 guarded live restore */
.danger-zone{border-color:rgba(239,68,68,.32);background:linear-gradient(180deg,rgba(239,68,68,.045),rgba(15,23,42,.72))}.btn-danger{background:#b91c1c;border-color:#dc2626;color:#fff}.btn-danger:hover{filter:brightness(1.08)}.danger-zone code{color:#fecaca}

/* LionGuard v2.6 recovery queue, progress, verification & rollback */
.recovery-guardrails{margin-top:18px}.recovery-worker-note{margin-bottom:16px}.recovery-worker-note>div{display:flex;align-items:center;gap:9px}.recovery-worker-note p{margin:8px 0 0;color:var(--muted);font-size:.86rem}.recovery-ops{display:grid;gap:14px}.recovery-op{padding:18px}.recovery-op-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.recovery-op-head h3{margin:4px 0 0}.recovery-progress{height:8px;background:#09131e;border:1px solid rgba(129,153,181,.12);border-radius:999px;overflow:hidden;margin:16px 0 8px}.recovery-progress i{display:block;height:100%;min-width:0;background:linear-gradient(90deg,#2563eb,#38bdf8);transition:width .35s ease}.recovery-meta{display:flex;justify-content:space-between;gap:14px;color:#7f90a4;font-size:.74rem}.recovery-meta b{color:#dbe8f5}.op-message{margin:11px 0 5px;color:#aebdcd}.status-queued{color:#93c5fd;border-color:rgba(96,165,250,.3)}.status-running{color:#67e8f9;border-color:rgba(34,211,238,.3)}.status-completed,.status-rolled_back{color:#6ee7a2;border-color:rgba(52,211,153,.32)}.status-completed_unverified,.status-rolled_back_unverified{color:#f6c85f;border-color:rgba(245,158,11,.34)}.status-failed{color:#ff7c7c;border-color:rgba(239,68,68,.35)}.verification{display:grid;gap:4px;margin:12px 0;padding:11px 13px;border-radius:9px;border:1px solid}.verification strong{font-size:.78rem}.verification span{font-size:.74rem;color:#aab8c7}.verification-ok{border-color:rgba(52,211,153,.25);background:rgba(52,211,153,.05)}.verification-ok strong{color:#6ee7a2}.verification-warn{border-color:rgba(245,158,11,.3);background:rgba(245,158,11,.055)}.verification-warn strong{color:#f6c85f}.operation-error{border:1px solid rgba(239,68,68,.25);background:rgba(127,29,29,.16);color:#fecaca;white-space:pre-wrap;font-size:.75rem}.rollback-form{display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(240px,1.2fr);gap:10px;align-items:end;margin-top:15px;padding-top:15px;border-top:1px solid rgba(129,153,181,.12)}.rollback-form label{display:grid;gap:6px;color:#9aacbd;font-size:.76rem}.rollback-form .hint{align-self:center;margin:0}.rollback-path code{word-break:break-all}@media(max-width:800px){.rollback-form{grid-template-columns:1fr}.recovery-meta{flex-direction:column;gap:4px}.recovery-op-head{flex-direction:column}.recovery-op-head .pill{align-self:flex-start}}
.status-interrupted{color:#fca5a5;border-color:rgba(248,113,113,.34)}
.compact-form{display:grid;grid-template-columns:1fr 120px 2fr auto;gap:8px;margin-top:16px}.compact-form input,.compact-form select{min-width:0}@media(max-width:900px){.compact-form{grid-template-columns:1fr}}
.token-secret{padding:14px;border:1px solid rgba(76,201,240,.35);border-radius:10px;background:rgba(76,201,240,.07);word-break:break-all;font-size:14px}.scope-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}.scope-grid label{display:flex;gap:8px;align-items:center}.scope-grid input{width:auto;margin:0}@media(max-width:700px){.scope-grid{grid-template-columns:1fr}}