:root {
  color-scheme: dark;
  --bg: #07141f;
  --surface: rgba(15, 34, 49, 0.94);
  --surface-soft: rgba(20, 46, 64, 0.72);
  --line: rgba(151, 198, 220, 0.18);
  --text: #edf7fb;
  --muted: #9bb4c2;
  --cyan: #50d5d0;
  --blue: #4b8ff7;
  --green: #46c995;
  --amber: #f3b85a;
  --red: #f06b72;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.24);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

body {
  min-height: 100vh;
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 12% 8%, rgba(50, 140, 185, 0.16), transparent 26rem),
    radial-gradient(circle at 88% 22%, rgba(80, 213, 208, 0.10), transparent 30rem),
    linear-gradient(145deg, #06111a 0%, var(--bg) 55%, #091b27 100%);
}

body::before {
  position: fixed;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: 0.22;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, black, transparent 70%);
}

button, input, select, textarea { font: inherit; }
[hidden] { display: none !important; }

.topbar {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1240px;
  margin: 0 auto;
  padding: 26px 28px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: var(--text);
  text-decoration: none;
}

.brand-mark {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(80, 213, 208, 0.55);
  border-radius: 14px;
  color: var(--cyan);
  background: rgba(80, 213, 208, 0.08);
  box-shadow: inset 0 0 24px rgba(80, 213, 208, 0.08);
  font-weight: 800;
  letter-spacing: 0.04em;
}

.brand strong, .brand small { display: block; }
.brand strong { font-size: 0.98rem; letter-spacing: 0.01em; }
.brand small { margin-top: 3px; color: var(--muted); font-size: 0.72rem; }

.badge {
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
}

.badge-waiting { color: var(--amber); }
.badge-ok { color: var(--green); border-color: rgba(70, 201, 149, 0.35); }
.badge-error { color: var(--red); border-color: rgba(240, 107, 114, 0.35); }

main {
  position: relative;
  z-index: 1;
  width: min(1184px, calc(100% - 40px));
  margin: 0 auto;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 52px;
  align-items: end;
  padding: 64px 0 54px;
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--cyan);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

h1, h2, p { margin-top: 0; }

h1 {
  max-width: 780px;
  margin-bottom: 20px;
  font-size: clamp(2.5rem, 6vw, 5.25rem);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.hero-copy {
  max-width: 660px;
  margin-bottom: 0;
  color: var(--muted);
  font-size: 1.06rem;
  line-height: 1.7;
}

.scope-card {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(80, 213, 208, 0.08), rgba(75, 143, 247, 0.04));
  box-shadow: var(--shadow);
}

.scope-card span, .scope-card small { display: block; color: var(--muted); }
.scope-card span { margin-bottom: 9px; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.12em; }
.scope-card strong { display: block; margin-bottom: 9px; color: var(--cyan); font-family: "SFMono-Regular", Consolas, monospace; }
.scope-card small { line-height: 1.5; }

.grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: 20px;
}

.panel {
  min-width: 0;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--surface);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
}

.panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 26px;
}

.panel-heading-actions { display: flex; align-items: center; gap: 10px; }

.panel-heading h2 { margin-bottom: 0; font-size: 1.7rem; letter-spacing: -0.025em; }

.step {
  color: rgba(155, 180, 194, 0.35);
  font-size: 1.8rem;
  font-weight: 800;
}

form { display: grid; gap: 11px; }
label { color: #d7e8ef; font-size: 0.82rem; font-weight: 700; }
.optional { color: var(--muted); font-size: 0.7rem; font-weight: 500; }

input[type="text"], input[type="url"], input[type="email"], input[type="password"], input[type="number"], select, textarea {
  width: 100%;
  margin-bottom: 9px;
  padding: 14px 15px;
  border: 1px solid rgba(151, 198, 220, 0.2);
  border-radius: 11px;
  outline: none;
  color: var(--text);
  background: #091a27;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

textarea { min-height: 84px; resize: vertical; }

input:focus {
  border-color: rgba(80, 213, 208, 0.75);
  box-shadow: 0 0 0 3px rgba(80, 213, 208, 0.1);
}

.field-note { margin: -2px 0 8px; color: var(--muted); font-size: 0.75rem; line-height: 1.5; }
code { color: #b9eee8; }

.consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 8px 0 10px;
  color: var(--muted);
  font-weight: 500;
  line-height: 1.45;
}

.consent input { margin-top: 3px; accent-color: var(--cyan); }

#submit-button, #login-button, #quick-button, #activation-button, #smtp-test-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 14px 17px;
  border: 0;
  border-radius: 11px;
  color: #04171c;
  background: linear-gradient(95deg, var(--cyan), #84eee8);
  cursor: pointer;
  font-weight: 800;
  box-shadow: 0 12px 30px rgba(80, 213, 208, 0.16);
}

#submit-button:disabled, #login-button:disabled, #quick-button:disabled, #activation-button:disabled, #smtp-test-button:disabled { cursor: wait; opacity: 0.55; }

.smtp-status { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 0 0 18px; color: var(--muted); font-size: 0.8rem; }
.smtp-status strong { color: var(--text); }
.smtp-test-form { max-width: 760px; }
.smtp-test-controls { display: grid; grid-template-columns: minmax(220px, 1fr) auto; align-items: start; gap: 12px; }
.smtp-test-controls input { margin-bottom: 0; }
#smtp-test-button { width: auto; white-space: nowrap; }
@media (max-width: 640px) { .smtp-test-controls { grid-template-columns: 1fr; } #smtp-test-button { width: 100%; } }
.message { min-height: 20px; margin-bottom: 0; color: var(--muted); font-size: 0.8rem; }
.message.error { color: var(--red); }
.message.success { color: var(--green); }

.icon-button {
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--cyan);
  background: transparent;
  cursor: pointer;
  font-size: 1.2rem;
}

.scan-list { display: grid; gap: 12px; max-height: 520px; overflow-y: auto; padding-right: 4px; }
.empty-state { padding: 38px 18px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); text-align: center; }

.scan-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-soft);
}

.scan-top, .scan-bottom, .counts { display: flex; align-items: center; }
.scan-top { justify-content: space-between; gap: 14px; }
.scan-title { min-width: 0; }
.scan-title strong, .scan-title small { display: block; }
.scan-title strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scan-title small { margin-top: 4px; overflow: hidden; color: var(--muted); font-family: "SFMono-Regular", Consolas, monospace; font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }

.status {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.status-queued { color: var(--amber); background: rgba(243, 184, 90, 0.10); }
.status-pending_payment { color: #f4cf77; background: rgba(244, 207, 119, 0.12); }
.status-pending_verification { color: #c6a6ff; background: rgba(166, 120, 255, 0.12); }
.status-running { color: var(--cyan); background: rgba(80, 213, 208, 0.10); }
.status-completed { color: var(--green); background: rgba(70, 201, 149, 0.10); }
.status-failed { color: var(--red); background: rgba(240, 107, 114, 0.10); }

.scan-bottom { justify-content: space-between; gap: 12px; margin-top: 14px; }
.counts { gap: 6px; }
.va-review-counts-pending { width: fit-content; padding: 6px 10px; border: 1px solid rgba(80, 213, 208, 0.28); border-radius: 7px; background: rgba(80, 213, 208, 0.05); color: var(--cyan); font-size: 0.66rem; font-weight: 800; }
.count { padding: 4px 6px; border-radius: 6px; background: rgba(255, 255, 255, 0.04); color: var(--muted); font-size: 0.68rem; }
.count.high { color: #ff8a90; }
.count.medium { color: #ffc66d; }
.count.low { color: #76b5ff; }

.report-link { color: var(--cyan); font-size: 0.76rem; font-weight: 800; text-decoration: none; }
.scan-error { margin: 12px 0 0; color: #ff9ba0; font-size: 0.75rem; line-height: 1.4; }
.provider-diagnostic { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; margin-top: 12px; padding: 9px 11px; border: 1px solid rgba(70, 201, 149, 0.28); border-radius: 9px; background: rgba(70, 201, 149, 0.06); font-size: 0.7rem; }
.provider-diagnostic strong { color: var(--green); }
.provider-diagnostic span { color: var(--muted); }
.provider-diagnostic.provider-warning { border-color: rgba(243, 184, 90, 0.34); background: rgba(243, 184, 90, 0.07); }
.provider-diagnostic.provider-warning strong { color: var(--amber); }

.module-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.module-tag { padding: 3px 6px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 0.64rem; }
.attempt-tag { padding: 3px 6px; border: 1px solid rgba(116, 210, 191, 0.32); border-radius: 999px; color: var(--muted); font-size: 0.64rem; }
.payment-tag { padding: 3px 6px; border: 1px solid rgba(243, 184, 90, 0.3); border-radius: 999px; color: var(--amber); font-size: 0.64rem; }
.product-tag { padding: 3px 6px; border: 1px solid rgba(80, 213, 208, 0.3); border-radius: 999px; color: var(--cyan); font-size: 0.64rem; }
.payment-box { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 12px; border: 1px solid rgba(243, 184, 90, 0.32); border-radius: 10px; background: rgba(243, 184, 90, 0.07); }
.payment-box strong, .payment-box small { display: block; }
.payment-box small { margin-top: 3px; color: var(--muted); font-size: 0.68rem; }
.payment-button { flex: 0 0 auto; padding: 8px 11px; border: 0; border-radius: 8px; color: #061016; background: var(--amber); cursor: pointer; font-size: 0.72rem; font-weight: 800; }
.report-actions { display: inline-flex; align-items: center; gap: 8px; }
.share-button { padding: 5px 8px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; font-size: 0.7rem; font-weight: 700; }
.retry-box { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: 12px; padding: 11px 12px; border: 1px solid rgba(235, 185, 72, 0.35); border-radius: 10px; background: rgba(235, 185, 72, 0.08); font-size: 0.72rem; }
.retry-button { padding: 7px 10px; border: 0; border-radius: 7px; background: var(--amber); color: #061016; cursor: pointer; font: inherit; font-weight: 800; }
.retry-button:disabled { cursor: wait; opacity: 0.65; }
.verification-box { margin-top: 14px; padding: 12px; border: 1px solid rgba(198, 166, 255, 0.28); border-radius: 10px; background: rgba(116, 77, 168, 0.08); }
.verification-box strong { display: block; margin-bottom: 8px; font-size: 0.76rem; }
.challenge { margin: 8px 0; padding-top: 8px; border-top: 1px solid var(--line); }
.challenge:first-of-type { border-top: 0; padding-top: 0; }
.challenge span, .challenge code { display: block; overflow-wrap: anywhere; }
.challenge span { color: var(--muted); font-size: 0.67rem; }
.challenge code { margin-top: 3px; font-size: 0.68rem; }
.challenge-error { margin-top: 4px; color: var(--amber) !important; }
.verify-button { width: 100%; margin-top: 8px; padding: 9px 12px; border: 1px solid rgba(80, 213, 208, 0.35); border-radius: 8px; color: var(--cyan); background: rgba(80, 213, 208, 0.06); cursor: pointer; font-size: 0.72rem; font-weight: 800; }
.verify-button:disabled { cursor: wait; opacity: 0.55; }

.pipeline {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  margin: 20px 0 70px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--line);
}

.pipeline div { position: relative; padding: 20px; background: rgba(10, 28, 40, 0.96); }
.pipeline span { display: block; margin-bottom: 18px; color: var(--cyan); font-size: 0.7rem; font-weight: 800; }
.pipeline strong, .pipeline small { display: block; }
.pipeline small { margin-top: 4px; color: var(--muted); }

footer { padding: 0 20px 28px; color: var(--muted); font-size: 0.72rem; text-align: center; }

.login-shell { display: grid; min-height: calc(100vh - 150px); place-items: center; padding: 40px 0 80px; }
.login-panel { width: min(560px, 100%); }
.login-panel h1 { margin-bottom: 18px; font-size: clamp(2.2rem, 7vw, 4.3rem); }
.login-panel form { margin-top: 30px; }
.login-help { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.75rem; line-height: 1.6; }
.activation-shell { display: grid; min-height: calc(100vh - 220px); place-items: center; padding: 42px 0 80px; }
.activation-panel { width: min(760px, 100%); }
.activation-panel h1 { margin-bottom: 18px; font-size: clamp(2.1rem, 5vw, 4rem); }
.activation-panel form { margin-top: 26px; }
.activation-account { display: grid; gap: 4px; margin-bottom: 12px; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: rgba(80, 213, 208, 0.05); }
.activation-account span, .activation-account small { color: var(--muted); font-size: 0.7rem; }
.activation-account strong { overflow-wrap: anywhere; color: var(--cyan); }
.activation-notice { padding: 13px; border: 1px solid rgba(243, 184, 90, 0.3); border-radius: 10px; color: var(--muted); background: rgba(243, 184, 90, 0.06); line-height: 1.55; }
.lab-activation-link { color: var(--cyan); font-weight: 800; }
.session-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 18px; padding: 13px 16px; border: 1px solid var(--line); border-radius: 14px; background: rgba(10, 28, 40, 0.75); }
.session-bar strong, .session-bar small { display: block; }
.session-bar small { margin-top: 3px; color: var(--muted); font-size: 0.7rem; }
.session-actions { display: flex; align-items: center; gap: 8px; }
.secondary-button { padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: transparent; cursor: pointer; font-size: 0.75rem; font-weight: 700; }
.portal-menu-toggle { display: none; }

.portal-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  padding-top: 20px;
}

.portal-navigation {
  position: sticky;
  top: 18px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(10, 28, 40, 0.92);
  box-shadow: var(--shadow);
}

.portal-navigation nav, .portal-nav-admin { display: grid; gap: 6px; }
.portal-nav-admin { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.portal-nav-label { margin: 2px 8px 5px; color: var(--muted); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; }
.portal-navigation button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 700;
  text-align: left;
}
.portal-navigation button:hover { color: var(--text); background: rgba(80, 213, 208, 0.05); }
.portal-navigation button.is-active { border-color: rgba(80, 213, 208, 0.32); color: var(--cyan); background: rgba(80, 213, 208, 0.09); }
.portal-navigation button em { min-width: 22px; padding: 2px 6px; border-radius: 999px; color: #06141d; background: var(--amber); font-size: 0.61rem; font-style: normal; text-align: center; }
.portal-content { min-width: 0; }
.portal-message { position: sticky; z-index: 4; top: 12px; min-height: 0; margin: 0 0 12px; padding: 11px 13px; border: 1px solid rgba(70, 201, 149, 0.34); border-radius: 10px; background: rgba(9, 31, 40, 0.97); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22); }
.portal-message.error { border-color: rgba(240, 107, 114, 0.38); }
.portal-summary { padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
.portal-page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 15px; }
.portal-page-heading h2 { margin-bottom: 0; font-size: 1.75rem; }
.portal-summary-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 10px; }
.portal-summary-card { display: grid; gap: 5px; min-height: 118px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface-soft); cursor: pointer; text-align: left; }
.portal-summary-card:hover { border-color: rgba(80, 213, 208, 0.42); transform: translateY(-1px); }
.portal-summary-card span { color: var(--muted); font-size: 0.68rem; font-weight: 750; }
.portal-summary-card strong { color: var(--cyan); font-size: 1.65rem; }
.portal-summary-card small { color: var(--muted); font-size: 0.66rem; line-height: 1.4; }
.portal-dashboard-hero { padding: 38px 0 32px; }
.portal-dashboard-hero h1 { font-size: clamp(2.2rem, 4.8vw, 4.2rem); }

.product-section { padding: 24px 0 10px; }
.product-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.product-heading h2 { margin-bottom: 0; font-size: clamp(1.5rem, 3vw, 2.2rem); }
.catalog-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.product-card { display: grid; gap: 8px; padding: 17px; border: 1px solid var(--line); border-radius: 15px; background: rgba(10, 28, 40, 0.82); }
.product-card > span { color: var(--cyan); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.product-card > strong { font-size: 1.35rem; }
.product-card > small { min-height: 44px; color: var(--muted); line-height: 1.45; }
.product-flags { display: flex; flex-wrap: wrap; gap: 5px; }
.product-flags em { padding: 3px 6px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 0.62rem; font-style: normal; }

.login-shell { grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.8fr); gap: 20px; align-items: start; place-items: stretch; }
.login-panel, .quick-panel { width: 100%; }
.login-panel h1 { font-size: clamp(1.75rem, 3.5vw, 2.7rem); }
.login-shell.has-quick-result .quick-panel { grid-column: 1 / -1; }
.login-shell.has-quick-result .login-panel { grid-column: 1 / -1; justify-self: end; width: min(460px, 100%); }
.login-shell.has-quick-result .quick-assessment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.quick-panel h2 { margin-bottom: 14px; font-size: clamp(1.8rem, 4vw, 3rem); letter-spacing: -0.04em; }
.quick-panel .hero-copy { font-size: 0.9rem; }
.quick-panel form { margin-top: 25px; }
.quick-result { margin-top: 18px; padding: 14px; border: 1px solid rgba(80, 213, 208, 0.25); border-radius: 12px; background: rgba(80, 213, 208, 0.05); }
.quick-summary strong, .quick-summary small { display: block; overflow-wrap: anywhere; }
.quick-summary small { margin-top: 4px; color: var(--muted); }
.quick-counts { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.quick-counts span { padding: 4px 7px; border-radius: 7px; background: rgba(255, 255, 255, 0.05); color: var(--muted); font-size: 0.68rem; }
.quick-assessment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 14px 0; }
.quick-assessment-card { display: grid; align-content: start; gap: 9px; min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 11px; background: rgba(8, 23, 34, 0.88); }
.quick-card-heading { display: flex; align-items: start; justify-content: space-between; gap: 7px; }
.quick-card-heading > div { min-width: 0; }
.quick-card-heading > div > strong, .quick-card-heading > div > small { display: block; }
.quick-card-heading > div > strong { color: var(--text); font-size: 0.72rem; line-height: 1.35; }
.quick-card-heading > div > small { margin-top: 3px; color: var(--muted); font-size: 0.59rem; line-height: 1.4; }
.quick-card-grade { display: inline-grid; min-width: 35px; min-height: 34px; place-items: center; padding: 0 5px; border-radius: 8px; font-size: 0.8rem; font-weight: 850; }
.quick-card-score { display: flex; align-items: center; justify-content: space-between; gap: 5px; font-size: 0.63rem; }
.quick-card-score > span, .quick-card-score-label { color: var(--muted); font-size: 0.59rem; }
.quick-card-score > strong { color: var(--text); }
.quick-card-progress { appearance: none; overflow: hidden; width: 100%; height: 6px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.1); }
.quick-card-progress::-webkit-progress-bar { border-radius: 999px; background: rgba(255, 255, 255, 0.1); }
.quick-card-progress::-webkit-progress-value { border-radius: 999px; }
.quick-card-progress::-moz-progress-bar { border-radius: 999px; }
.card-good .quick-card-grade { color: var(--green); background: rgba(70, 201, 149, 0.13); }
.card-good .quick-card-progress::-webkit-progress-value { background: var(--green); }
.card-good .quick-card-progress::-moz-progress-bar { background: var(--green); }
.card-warning .quick-card-grade { color: var(--amber); background: rgba(243, 184, 90, 0.13); }
.card-warning .quick-card-progress::-webkit-progress-value { background: var(--amber); }
.card-warning .quick-card-progress::-moz-progress-bar { background: var(--amber); }
.card-critical .quick-card-grade { color: var(--red); background: rgba(240, 107, 114, 0.13); }
.card-critical .quick-card-progress::-webkit-progress-value { background: var(--red); }
.card-critical .quick-card-progress::-moz-progress-bar { background: var(--red); }
.card-info .quick-card-grade { color: var(--cyan); background: rgba(80, 213, 208, 0.12); }
.card-muted .quick-card-grade { color: var(--muted); background: rgba(255, 255, 255, 0.07); }
.quick-card-summary { margin: 0; color: var(--muted); font-size: 0.61rem; line-height: 1.48; }
.quick-card-controls { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.quick-card-control { display: grid; grid-template-columns: 12px minmax(0, 1fr); gap: 5px; align-items: start; }
.quick-card-control > span:last-child { min-width: 0; }
.quick-card-control strong, .quick-card-control small { display: block; overflow-wrap: anywhere; }
.quick-card-control strong { color: var(--text); font-size: 0.59rem; font-weight: 550; line-height: 1.35; }
.quick-card-control small { margin-top: 2px; color: var(--muted); font-size: 0.56rem; line-height: 1.35; }
.quick-card-icon { color: var(--amber); font-size: 0.72rem; font-weight: 800; }
.control-observed .quick-card-icon { color: var(--green); }
.control-inconclusive .quick-card-icon { color: var(--muted); }
.quick-card-more > summary { color: var(--cyan); cursor: pointer; font-size: 0.59rem; }
.quick-card-more > ul { margin-top: 7px; }
.quick-card-metadata { display: grid; gap: 4px; }
.quick-card-metadata small, .quick-card-source { color: var(--muted); font-size: 0.56rem; line-height: 1.4; }
.quick-card-source { padding-top: 7px; border-top: 1px solid var(--line); }
.quick-posture { margin: 13px 0 0; padding: 12px; border: 1px solid rgba(243, 184, 90, 0.28); border-radius: 10px; background: rgba(243, 184, 90, 0.07); }
.quick-posture.posture-good { border-color: rgba(70, 201, 149, 0.3); background: rgba(70, 201, 149, 0.07); }
.quick-posture strong { color: var(--text); font-size: 0.86rem; }
.quick-posture p { margin: 5px 0 0; color: var(--muted); font-size: 0.7rem; line-height: 1.5; }
.quick-priorities { display: block; margin: 12px 0; padding: 11px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, 0.025); }
.quick-priorities > strong { font-size: 0.74rem; }
.quick-priorities ol { display: grid; gap: 7px; margin: 8px 0 0; padding-left: 0; list-style: none; }
.quick-priorities li strong, .quick-priorities li small { display: block; }
.quick-priorities li strong { color: var(--amber); font-size: 0.7rem; }
.quick-priorities li small { margin-top: 2px; color: var(--muted); font-size: 0.65rem; line-height: 1.4; }
.observation-list { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.observation-list li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line); font-size: 0.72rem; }
.observation-observed { color: var(--green); }
.observation-attention { color: var(--amber); }
.observation-not_observed { color: var(--amber); }
.observation-inconclusive { color: var(--muted); }
.observation-disabled { color: var(--muted); }
.quick-intelligence { display: grid; gap: 8px; margin-top: 13px; padding: 11px; border: 1px solid rgba(107, 143, 255, 0.22); border-radius: 10px; background: rgba(107, 143, 255, 0.055); }
.quick-intelligence > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.quick-intelligence strong { font-size: 0.73rem; }
.quick-intelligence em { font-size: 0.66rem; font-style: normal; }
.quick-intelligence small { color: var(--muted); font-size: 0.66rem; }
.quick-intelligence p { margin: 0; color: var(--muted); font-size: 0.64rem; line-height: 1.45; }
.quick-intel-metrics, .quick-technologies { display: flex; flex-wrap: wrap; gap: 5px; }
.quick-intel-metrics span, .quick-technologies span { padding: 3px 6px; border-radius: 6px; background: rgba(255, 255, 255, 0.055); color: var(--muted); font-size: 0.62rem; }
.quick-technologies span { color: var(--cyan); }
.quick-report-actions { display: grid; gap: 5px; margin-top: 13px; }
.quick-report-button { width: 100%; padding: 10px 12px; border: 1px solid rgba(80, 213, 208, 0.48); border-radius: 9px; color: #06141d; background: var(--cyan); cursor: pointer; font-weight: 800; }
.quick-report-button:disabled { cursor: wait; opacity: 0.55; }
.quick-report-expiry { color: var(--muted); font-size: 0.62rem; text-align: center; }
.quick-result > p { margin: 13px 0 0; color: var(--muted); font-size: 0.7rem; line-height: 1.5; }
.quick-lead-form { margin-top: 8px !important; padding: 15px; border: 1px solid rgba(80, 213, 208, 0.27); border-radius: 12px; background: rgba(7, 20, 31, 0.6); }
.lead-form-heading strong, .lead-form-heading small { display: block; }
.lead-form-heading strong { font-size: 0.88rem; }
.lead-form-heading small { margin-top: 4px; color: var(--muted); font-size: 0.72rem; }
.lead-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 12px; }
.lead-form-grid input { margin: 5px 0 0; padding: 10px 11px; }
.lead-form-grid label { font-size: 0.7rem; }
.lead-consent { margin: 5px 0; font-size: 0.69rem; }
.quick-lead-complete { display: grid; gap: 8px; padding: 12px; border: 1px solid rgba(70, 201, 149, 0.26); border-radius: 10px; background: rgba(70, 201, 149, 0.05); }
.quick-assessment-button, .operations-action, .remediation-request-button, .exception-button { padding: 9px 12px; border: 1px solid rgba(80, 213, 208, 0.45); border-radius: 8px; color: var(--cyan); background: rgba(80, 213, 208, 0.08); cursor: pointer; font-size: 0.73rem; font-weight: 800; }
.quick-assessment-button { width: 100%; }
.quick-assessment-button:disabled { cursor: default; opacity: 0.72; }
.quick-assessment-message { margin: 2px 0 0; padding: 0; line-height: 1.5; }
.quick-assessment-message:not(:empty) { padding: 11px; border: 1px solid rgba(80, 213, 208, 0.3); border-radius: 9px; background: rgba(80, 213, 208, 0.06); }
.quick-assessment-message.success { color: var(--green); border-color: rgba(70, 201, 149, 0.36); background: rgba(70, 201, 149, 0.08); }
.quick-assessment-message.error { border-color: rgba(255, 104, 104, 0.35); background: rgba(255, 104, 104, 0.07); }
.manual-approval-tag { padding: 3px 6px; border: 1px solid rgba(198, 166, 255, 0.35); border-radius: 999px; color: #d1b8ff; font-size: 0.64rem; }
.it-provider-link { display: block; margin-top: 10px; color: var(--cyan); font-size: 0.7rem; }
.exception-details, .remediation-request-box { display: grid; gap: 8px; margin-top: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: rgba(7, 20, 31, 0.36); }
.exception-details > summary, .remediation-request-box > summary { color: var(--cyan); cursor: pointer; font-size: 0.72rem; font-weight: 750; }
.exception-details > p, .remediation-request-box > small, .exception-state > small { display: block; margin: 7px 0; color: var(--muted); font-size: 0.68rem; line-height: 1.5; }
.authorization-mail-box { display: grid; gap: 6px; margin: 10px 0 14px; padding: 11px; border: 1px solid rgba(80, 213, 208, 0.3); border-radius: 9px; background: rgba(80, 213, 208, 0.06); }
.authorization-mail-box > strong { color: var(--text); font-size: 0.71rem; }
.authorization-mail-box > a { width: fit-content; color: var(--cyan); font-size: 0.72rem; font-weight: 750; overflow-wrap: anywhere; }
.authorization-mail-box > small { color: var(--muted); font-size: 0.66rem; line-height: 1.45; }
.authorization-template-link { margin-top: 3px; }
.authorization-mail-warning { border-color: rgba(243, 184, 90, 0.35); background: rgba(243, 184, 90, 0.07); }
.exception-details > label, .remediation-request-box > label { display: block; margin-top: 8px; font-size: 0.69rem; }
.exception-details input[type="text"], .exception-details textarea, .remediation-request-box select, .remediation-request-box textarea { margin: 5px 0; padding: 9px; }
.exception-state { margin-top: 12px; padding: 10px; border: 1px solid rgba(243, 184, 90, 0.35); border-radius: 9px; background: rgba(243, 184, 90, 0.06); }
.exception-state > strong { font-size: 0.72rem; }

.operations-panel { margin-top: 20px; }
.operations-panel .panel-heading { margin-bottom: 14px; }
.collection-toolbar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 145px), 1fr)); align-items: end; gap: 8px; margin: 0 0 12px; padding: 10px; border: 1px solid rgba(143, 177, 195, 0.18); border-radius: 10px; background: rgba(6, 18, 28, 0.34); }
.collection-toolbar > * { min-width: 0; max-width: 100%; }
.collection-toolbar > label { display: grid; gap: 4px; color: var(--muted); font-size: 0.63rem; }
.collection-toolbar input, .collection-toolbar select { min-width: 0; margin: 0; padding: 8px 9px; font-size: 0.68rem; }
.collection-pagination { display: flex; grid-column: 1 / -1; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; min-width: 0; min-height: 35px; }
.collection-pagination button { min-width: 34px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--cyan); background: transparent; cursor: pointer; }
.collection-pagination button:disabled { color: var(--muted); cursor: not-allowed; opacity: 0.45; }
.collection-pagination span { flex: 0 1 150px; min-width: 0; color: var(--muted); font-size: 0.64rem; text-align: center; overflow-wrap: anywhere; }
.operations-list { display: grid; gap: 11px; }
.operations-card { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(8, 23, 34, 0.7); }
.operations-card-header, .operations-card-footer { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.operations-card-header > div > strong, .operations-card-header > div > small, .operations-card-footer > small { display: block; }
.operations-card-header > div > strong { font-size: 0.86rem; }
.operations-card-header > div > small, .operations-card-footer > small { margin-top: 4px; color: var(--muted); font-size: 0.7rem; }
.operations-card > p { margin: 10px 0; color: var(--muted); font-size: 0.71rem; overflow-wrap: anywhere; }
.lead-score-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.lead-score-tags span { padding: 4px 7px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); font-size: 0.66rem; }
.lead-state-editor { display: flex; align-items: center; gap: 7px; }
.lead-state-editor select { width: auto; min-width: 150px; margin: 0; padding: 7px 9px; font-size: 0.69rem; }
.status-lead-new, .status-remediation-requested { color: var(--amber); background: rgba(243, 184, 90, 0.12); }
.status-lead-interested, .status-remediation-quoted { color: var(--cyan); background: rgba(80, 213, 208, 0.12); }
.status-lead-assessment_purchased, .status-lead-remediation_proposed, .status-remediation-approved, .status-remediation-completed { color: var(--green); background: rgba(70, 201, 149, 0.12); }
.status-remediation-in_progress, .status-lead-contacted { color: #b2c6ff; background: rgba(107, 143, 255, 0.13); }
.status-remediation-declined, .status-lead-closed { color: var(--muted); background: rgba(155, 180, 194, 0.1); }
.remediation-quote-summary { display: grid; gap: 5px; margin: 10px 0; }
.remediation-quote-summary > strong { color: var(--cyan); font-size: 0.8rem; }
.remediation-quote-summary > small { color: var(--muted); font-size: 0.7rem; line-height: 1.45; }
.remediation-quote-summary > .notification-sent { color: var(--green); }
.remediation-quote-summary > .notification-failed { color: var(--amber); }
.remediation-quote-summary > .notification-muted { color: var(--muted); }
.quote-field-note { display: block; margin: -3px 0 5px; color: var(--muted); font-size: 0.66rem; line-height: 1.4; }
.quote-field-note strong { color: var(--text); }
.required-label { margin-left: 4px; color: var(--amber); font-size: 0.62rem; font-weight: 700; text-transform: uppercase; }
.quote-message { min-height: 1.1em; margin: 2px 0 0; }
.quote-editor { display: grid; gap: 6px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--line); }
.quote-editor > label { font-size: 0.7rem; }
.quote-editor > input, .quote-editor > textarea { margin: 0; padding: 9px; }
.quote-editor > button { justify-self: start; }
.quote-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.operations-secondary { padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: transparent; cursor: pointer; font-size: 0.73rem; }

.shares-box { margin-top: 12px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; background: rgba(6, 18, 28, 0.32); }
.shares-box > strong { display: block; margin-bottom: 7px; font-size: 0.74rem; }
.shares-box ul { display: grid; gap: 5px; margin: 0 0 7px; padding: 0; list-style: none; }
.shares-box li { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 0.68rem; }
.shares-box li.share-active span { color: var(--green); }
.shares-box button { padding: 4px 7px; border: 1px solid rgba(240, 107, 114, 0.35); border-radius: 6px; color: var(--red); background: transparent; cursor: pointer; font-size: 0.66rem; }
.shares-box > small { color: var(--muted); font-size: 0.65rem; }

.va-card { border-color: rgba(198, 166, 255, 0.24); }
.va-scope-form, .va-approval { display: grid; gap: 9px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--line); }
.va-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 12px; }
.va-form-grid label, .va-scope-form > label, .va-approval > label { display: block; font-size: 0.69rem; }
.va-form-grid input, .va-form-grid select, .va-scope-form textarea, .va-approval textarea { margin: 5px 0 0; padding: 9px; }
.va-form-grid small { display: block; margin-top: 3px; color: var(--muted); font-size: 0.62rem; line-height: 1.4; }
.va-scope-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 12px 0; }
.va-scope-summary span { padding: 8px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-size: 0.66rem; }
.va-scope-summary strong { display: block; margin-top: 3px; color: var(--text); overflow-wrap: anywhere; }
.status-va-new, .status-va-submitted { color: var(--amber); background: rgba(243, 184, 90, 0.12); }
.status-va-approved, .status-va-scheduled { color: var(--cyan); background: rgba(80, 213, 208, 0.12); }
.status-va-running { color: #b2c6ff; background: rgba(107, 143, 255, 0.13); }
.status-va-completed { color: var(--green); background: rgba(70, 201, 149, 0.12); }
.status-va-rejected { color: var(--red); background: rgba(240, 107, 114, 0.10); }
.va-job-box { display: grid; gap: 8px; margin-top: 12px; padding: 11px; border: 1px solid rgba(80, 213, 208, 0.22); border-radius: 10px; background: rgba(6, 18, 28, 0.36); }
.va-job-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 0.7rem; }
.va-job-heading span, .va-job-empty { color: var(--muted); font-size: 0.66rem; }
.va-job-box progress { width: 100%; height: 7px; accent-color: var(--cyan); }
.va-run-control, .va-job-admin-actions { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.va-run-control label { display: grid; gap: 5px; min-width: 260px; color: var(--muted); font-size: 0.67rem; }
.va-run-control input { width: 100%; }
.va-schedule-note { align-self: center; max-width: 320px; color: var(--cyan); font-size: 0.65rem; line-height: 1.4; }
.va-schedule-state { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; margin: 0; padding: 8px; border: 1px solid rgba(80, 213, 208, 0.28); border-radius: 8px; background: rgba(80, 213, 208, 0.05); }
.va-schedule-state strong { color: var(--cyan); font-size: 0.67rem; }
.va-schedule-state span { color: var(--muted); font-size: 0.65rem; }
.va-renewal-form { display: grid; gap: 10px; margin-top: 12px; padding: 12px; border: 1px solid rgba(243, 184, 90, 0.35); border-radius: 10px; background: rgba(243, 184, 90, 0.06); }
.va-renewal-form > p, .va-timeout-note { margin: 0; color: var(--muted); font-size: 0.7rem; }
.va-timeout-note { padding: 9px 10px; border-left: 3px solid var(--amber); background: rgba(243, 184, 90, 0.07); }
.va-cleanup-state, .va-provider-ids { color: var(--muted); overflow-wrap: anywhere; }
.va-job-history { margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(148, 172, 190, 0.2); border-radius: 9px; }
.va-job-history > summary { cursor: pointer; color: var(--cyan); font-size: 0.7rem; font-weight: 800; }
.va-job-history-list { display: grid; gap: 8px; margin-top: 10px; }
.va-history-attempt { border: 1px solid rgba(148, 172, 190, 0.15); border-radius: 8px; background: rgba(5, 17, 27, 0.24); }
.va-history-attempt > summary { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 9px 10px; cursor: pointer; color: var(--text); font-size: 0.68rem; }
.va-history-attempt > summary > span { display: grid; gap: 3px; }
.va-history-attempt > summary small, .va-history-provider { color: var(--muted); font-size: 0.62rem; font-weight: 500; overflow-wrap: anywhere; }
.va-history-attempt[open] > summary { border-bottom: 1px solid rgba(148, 172, 190, 0.13); }
.va-history-attempt-body { padding: 0 10px 10px; }
.va-history-attempt-body > .va-job-box { margin-top: 10px; }
.va-simulation-warning { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; padding: 8px; border: 1px solid rgba(243, 184, 90, 0.35); border-radius: 8px; background: rgba(243, 184, 90, 0.07); }
.va-simulation-warning strong { color: var(--amber); font-size: 0.67rem; }
.va-simulation-warning span { color: var(--muted); font-size: 0.65rem; }
.va-provider-live { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; padding: 8px; border: 1px solid rgba(80, 213, 208, 0.35); border-radius: 8px; background: rgba(80, 213, 208, 0.06); }
.va-provider-live strong { color: var(--cyan); font-size: 0.67rem; }
.va-provider-live span { color: var(--muted); font-size: 0.65rem; }
.va-provider-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 6px; padding: 8px; border: 1px solid rgba(143, 177, 195, 0.18); border-radius: 8px; background: rgba(9, 29, 42, 0.45); }
.va-provider-metrics span { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 0.64rem; }
.va-provider-metrics strong { color: var(--text); text-align: right; }
.va-zero-result { margin: 0; color: var(--muted); font-size: 0.66rem; line-height: 1.5; }
.va-report-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.va-report-actions small { font-size: 0.64rem; line-height: 1.4; }
.va-report-actions .notification-sent { color: var(--green); }
.va-report-actions .notification-failed { color: var(--amber); }
.va-report-actions .notification-muted { color: var(--muted); }
.va-report-link { display: inline-flex; align-items: center; justify-content: center; width: fit-content; text-decoration: none; }
.va-findings > summary { color: var(--cyan); cursor: pointer; font-size: 0.68rem; }
.va-findings ul { display: grid; gap: 7px; margin: 8px 0 0; padding: 0; list-style: none; }
.va-findings li { display: grid; gap: 3px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; }
.va-findings li strong { font-size: 0.69rem; }
.va-findings li small, .va-findings li span { color: var(--muted); font-size: 0.63rem; line-height: 1.45; }
.va-finding-kind { width: fit-content; padding: 3px 6px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 0.6rem; font-weight: 800; text-transform: uppercase; }
.va-finding-kind-vulnerability { color: var(--red); border-color: rgba(240, 107, 114, 0.35); }
.va-finding-kind-informational { color: var(--cyan); border-color: rgba(80, 213, 208, 0.35); }
.va-finding-kind-transient_observation, .count.transient { color: var(--amber); border-color: rgba(243, 184, 90, 0.35); background: rgba(243, 184, 90, 0.08); }
.va-provider-evidence { padding-left: 8px; border-left: 2px solid rgba(143, 177, 195, 0.25); }
.va-local-message { margin: 3px 0 0; }

.va-review-waiting { display: grid; gap: 4px; margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(243, 184, 90, 0.35); border-radius: 9px; background: rgba(243, 184, 90, 0.06); }
.va-review-waiting strong { color: var(--amber); font-size: 0.7rem; }
.va-review-waiting span { color: var(--muted); font-size: 0.66rem; line-height: 1.45; }
.va-review-published { display: grid; gap: 5px; margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(70, 201, 149, 0.32); border-radius: 9px; background: rgba(70, 201, 149, 0.06); }
.va-review-published strong { color: var(--green); font-size: 0.7rem; }
.va-review-published span, .va-review-published p { margin: 0; color: var(--muted); font-size: 0.66rem; line-height: 1.45; }
.va-finding-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.va-review-tag { width: fit-content; padding: 3px 6px; border: 1px solid var(--line); border-radius: 999px; font-size: 0.6rem; font-style: normal; font-weight: 800; text-transform: uppercase; }
.va-review-tag-confirmed { color: var(--green); border-color: rgba(70, 201, 149, 0.35); }
.va-review-tag-false_positive { color: var(--muted); border-color: rgba(143, 177, 195, 0.28); }
.va-review-tag-risk_accepted { color: var(--amber); border-color: rgba(243, 184, 90, 0.35); }
.va-review-tag-needs_verification { color: var(--amber); border-color: rgba(243, 184, 90, 0.35); }
.va-review-note-readonly { padding-left: 8px; border-left: 2px solid rgba(70, 201, 149, 0.28); }
.va-review-editor { margin-top: 10px; padding: 10px 12px; border: 1px solid rgba(80, 213, 208, 0.28); border-radius: 9px; background: rgba(80, 213, 208, 0.04); }
.va-review-editor > summary { color: var(--cyan); cursor: pointer; font-size: 0.7rem; font-weight: 800; }
.va-review-body { display: grid; gap: 10px; margin-top: 10px; }
.va-review-row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(150px, 0.75fr); gap: 8px 10px; min-width: 0; padding: 10px; border: 1px solid rgba(143, 177, 195, 0.18); border-radius: 8px; background: rgba(9, 29, 42, 0.4); }
.va-review-row > strong { min-width: 0; overflow-wrap: anywhere; font-size: 0.69rem; }
.va-review-row > label:last-child { grid-column: 1 / -1; }
.va-review-row label, .va-review-body > label { display: grid; gap: 5px; min-width: 0; color: var(--muted); font-size: 0.67rem; }
.va-review-row select, .va-review-row textarea, .va-review-body textarea { width: 100%; min-width: 0; max-width: 100%; margin: 0; padding: 8px 9px; }
.va-review-row textarea, .va-review-body textarea { min-height: 72px; resize: vertical; }
.va-review-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.va-remediation-link { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 5px; padding-top: 7px; border-top: 1px solid rgba(143, 177, 195, 0.16); }
.va-remediation-link > span { color: var(--muted); font-size: 0.64rem; }
.va-remediation-link > span strong { color: var(--text); }
.va-remediation-link button { padding: 6px 9px; font-size: 0.65rem; }
.va-remediation-declined { color: var(--muted); font-style: italic; }
.va-retest-ready { width: fit-content; padding: 3px 7px; border: 1px solid rgba(70, 201, 149, 0.35); border-radius: 999px; color: var(--green) !important; background: rgba(70, 201, 149, 0.08); font-size: 0.61rem; font-style: normal; font-weight: 800; text-transform: uppercase; }
.remediation-source { display: grid; gap: 4px; margin: 10px 0; padding: 9px 10px; border: 1px solid rgba(198, 166, 255, 0.24); border-radius: 8px; background: rgba(198, 166, 255, 0.05); }
.remediation-source strong { color: #d1b8ff; font-size: 0.69rem; }
.remediation-source span, .remediation-source small { color: var(--muted); font-size: 0.65rem; line-height: 1.45; overflow-wrap: anywhere; }

@media (max-width: 850px) {
  .va-review-row { grid-template-columns: 1fr; }
  .va-review-row > label:last-child { grid-column: auto; }
  .portal-shell { grid-template-columns: 1fr; }
  .portal-menu-toggle { display: inline-flex; }
  .portal-navigation { display: none; position: static; }
  .portal-navigation.is-open { display: block; }
  .portal-navigation nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-nav-admin { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 0; padding-top: 0; border-top: 0; }
  .portal-nav-label { grid-column: 1 / -1; margin-top: 8px; }
  .hero { grid-template-columns: 1fr; gap: 26px; padding-top: 38px; }
  .scope-card { max-width: 360px; }
  .grid { grid-template-columns: 1fr; }
  .catalog-list, .login-shell, .va-form-grid, .va-scope-summary { grid-template-columns: 1fr; }
  .collection-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .collection-pagination { justify-content: start; }
  .login-shell.has-quick-result .quick-assessment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .topbar { padding: 20px; }
  .brand small { display: none; }
  .badge { max-width: 130px; text-align: center; }
  main { width: min(100% - 24px, 1184px); }
  .hero { padding-bottom: 36px; }
  .panel { padding: 20px; }
  .portal-navigation nav { grid-template-columns: 1fr; }
  .portal-nav-admin { grid-template-columns: 1fr; }
  .portal-summary-cards { grid-template-columns: 1fr; }
  .collection-toolbar { grid-template-columns: 1fr; }
  .quick-assessment-grid, .login-shell.has-quick-result .quick-assessment-grid, .lead-form-grid { grid-template-columns: 1fr; }
  .operations-card-header, .operations-card-footer { flex-direction: column; }
  .lead-state-editor { flex-wrap: wrap; }
  .pipeline { grid-template-columns: repeat(2, 1fr); }
}

/* 0.6.6 - ciclo remediation -> re-test VA */
.remediation-retest {
  margin-top: 1rem;
  padding-top: .9rem;
  border-top: 1px solid rgba(123, 229, 222, .18);
  display: grid;
  gap: .75rem;
}
.remediation-retest-actions,
.remediation-retest-blocked,
.remediation-retest-history,
.remediation-retest-item {
  display: grid;
  gap: .45rem;
}
.remediation-retest-actions small,
.remediation-retest-blocked small,
.remediation-retest-item small {
  color: var(--muted);
}
.remediation-retest-blocked em {
  width: fit-content;
  font-style: normal;
  font-weight: 700;
  color: var(--warning, #e6b65c);
}
.remediation-retest-history > strong {
  font-size: .92rem;
}
.remediation-retest-item {
  padding: .7rem .8rem;
  border: 1px solid rgba(123, 229, 222, .15);
  border-radius: .7rem;
  background: rgba(0, 0, 0, .08);
}
.remediation-retest-item > div:first-child {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-wrap: wrap;
}
.remediation-retest-outcome {
  display: inline-flex;
  width: fit-content;
  border-radius: 999px;
  padding: .16rem .48rem;
  font-size: .72rem;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .035em;
  border: 1px solid currentColor;
}
.remediation-retest-outcome.retest-resolved { color: #6dd9a7; }
.remediation-retest-outcome.retest-persistent { color: #ff9d8f; }
.remediation-retest-outcome.retest-non_verifiable { color: #e6b65c; }
.remediation-retest-outcome.retest-review_pending,
.remediation-retest-outcome.retest-pending { color: #7be5de; }
.remediation-retest-new summary { cursor: pointer; }
.remediation-retest-new ul { margin: .45rem 0 0; padding-left: 1.15rem; }
.remediation-retest-new li { margin: .35rem 0; }
.remediation-retest-new li small { display: block; }
.remediation-retest-outcome.retest-new { color: #9bc8ff; margin-left: .4rem; }

/* 0.6.6 - report comparativo remediation/re-test */
.remediation-retest-links { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: .35rem; }
.remediation-retest-report { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }

/* 0.7.3 - Exposure Assessment outside-in */
.exposure-note { border-left: 3px solid var(--accent, #49d6d1); padding-left: .75rem; }
.exposure-summary { margin: 1rem 0; padding: 1rem; border: 1px solid rgba(73,214,209,.25); border-radius: 14px; background: rgba(73,214,209,.04); display: grid; gap: .55rem; }
.exposure-summary > strong { color: var(--accent, #49d6d1); }
.exposure-summary > div { display: grid; grid-template-columns: minmax(120px, .35fr) 1fr; gap: .75rem; align-items: start; }
.exposure-summary span { color: var(--muted, #9bb1bf); }
.exposure-summary b { font-weight: 600; overflow-wrap: anywhere; }
.exposure-summary small { color: var(--muted, #9bb1bf); line-height: 1.45; }
@media (max-width: 720px) { .exposure-summary > div { grid-template-columns: 1fr; gap: .15rem; } }

/* CEL 0.7.3 - inventario Exposure multi-asset */
.exposure-inventory { margin-top: 14px; border: 1px solid rgba(74, 214, 208, .24); border-radius: 12px; padding: 12px 14px; background: rgba(12, 36, 48, .45); }
.exposure-inventory summary { cursor: pointer; font-weight: 700; color: var(--accent, #62ddd5); }
.exposure-asset-list { list-style: none; padding: 0; margin: 12px 0; display: grid; gap: 8px; }
.exposure-asset-list li { border: 1px solid rgba(151, 180, 197, .18); border-radius: 9px; padding: 9px 11px; display: grid; gap: 3px; }
.exposure-asset-list li span, .exposure-asset-list li small { overflow-wrap: anywhere; }

/* CEL 0.7.3 - confronto con esposizione attesa */
.exposure-expectations { margin-top: 14px; padding: 14px 16px; border: 1px solid rgba(91,219,214,.24); border-radius: 14px; }
.exposure-expectations summary { cursor: pointer; font-weight: 700; color: var(--accent, #5bdbd6); }
.exposure-expectation-summary { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 14px 0; }
.exposure-expectation-summary span { padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.035); }
.exposure-expectation-list { list-style: none; margin: 10px 0 14px; padding: 0; display: grid; gap: 10px; }
.exposure-expectation-list li { min-width: 0; padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; display: grid; gap: 10px; }
.exposure-service-main { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 10px; }
.exposure-service-main > span { display: grid; gap: 3px; min-width: 0; }
.exposure-expectation-list li small, .exposure-service-main strong { overflow-wrap: anywhere; word-break: break-word; }
.exposure-expectation-status { align-self: start; padding: 5px 9px; border-radius: 999px; font-size: .78rem; letter-spacing: .02em; white-space: nowrap; }
.exposure-expectation-status.expected { color: #63e6be; border: 1px solid rgba(99,230,190,.55); }
.exposure-expectation-status.unexpected { color: #ffb454; border: 1px solid rgba(255,180,84,.62); }
.exposure-expectation-status.review { color: #b7c7d8; border: 1px solid rgba(183,199,216,.42); }

/* CEL 0.7.3 - qualificazione exposure e proposta VA mirata */
.exposure-qualification-control { width: 100%; min-width: 0; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 9px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.06); }
.exposure-qualification-control label { min-width: 0; flex: 1 1 220px; display: grid; gap: 5px; color: var(--muted, #9bb1bf); font-size: .72rem; }
.exposure-qualification-control label > span { display: flex; align-items: baseline; gap: 5px; }
.exposure-qualification-control select, .exposure-qualification-control input { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.exposure-qualification-save { flex: 0 0 auto; min-height: 42px; white-space: nowrap; }
.exposure-qualification-hint { flex: 1 1 100%; color: var(--muted, #9bb1bf); }
.exposure-customer-qualification { margin-top: 3px; font-style: normal; font-size: .78rem; color: #c6d8e3; }
.exposure-customer-qualification.qualification-expected { color: #63e6be; }
.exposure-customer-qualification.qualification-unknown { color: #ffd166; }
.exposure-customer-qualification.qualification-should_not_be_exposed { color: #ff9d8f; }
.exposure-va-proposal { margin: 14px 0; padding: 12px 14px; border: 1px solid rgba(255,180,84,.34); border-radius: 12px; background: rgba(255,180,84,.045); display: grid; gap: 7px; }
.exposure-va-proposal strong { color: #ffbf69; }
.va-exposure-proposal-banner { margin-bottom: 14px; padding: 12px 14px; border: 1px solid rgba(91,219,214,.34); border-radius: 12px; background: rgba(91,219,214,.05); display: grid; gap: 6px; }
.va-exposure-proposal-banner strong { color: var(--accent, #5bdbd6); }
@media (max-width: 720px) {
  .exposure-service-main { grid-template-columns: 1fr; }
  .exposure-expectation-status { justify-self: start; }
  .exposure-qualification-control label, .exposure-qualification-save { flex-basis: 100%; width: 100%; }
}

/* 0.7.5 - le card Exposure crescono con il contenuto: niente scrollbar annidate */
.scan-list { max-height: none; overflow: visible; padding-right: 0; min-width: 0; }
.scan-card { min-width: 0; overflow: hidden; }
.exposure-expectations, .exposure-inventory, .exposure-summary { min-width: 0; max-width: 100%; box-sizing: border-box; }

/* CEL 0.7.5 - correlazione Exposure -> VA pubblicato */
.exposure-va-correlation { margin-top: 14px; padding: 14px 16px; border: 1px solid rgba(91,219,214,.32); border-radius: 14px; background: rgba(91,219,214,.025); }
.exposure-va-correlation > summary { cursor: pointer; font-weight: 800; color: var(--accent, #5bdbd6); }
.exposure-va-correlation.pending, .exposure-va-correlation.warning { display: grid; gap: 7px; }
.exposure-va-correlation.warning { border-color: rgba(255,180,84,.42); background: rgba(255,180,84,.04); }
.exposure-va-correlation-summary { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.exposure-va-correlation-summary span { padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.035); }
.exposure-va-correlation-list { list-style: none; padding: 0; margin: 10px 0 14px; display: grid; gap: 10px; }
.exposure-va-correlation-row { padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; min-width: 0; }
.exposure-va-correlation-main { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: start; }
.exposure-va-correlation-main > span { display: grid; gap: 3px; min-width: 0; }
.exposure-va-correlation-main strong, .exposure-va-correlation-main small { overflow-wrap: anywhere; }
.exposure-va-correlation-main em { font-style: normal; color: var(--muted, #9bb1bf); font-size: .78rem; }
.exposure-va-outcome { padding: 5px 9px; border-radius: 999px; white-space: nowrap; font-size: .76rem; }
.exposure-va-outcome.confirmed { color: #63e6be; border: 1px solid rgba(99,230,190,.55); }
.exposure-va-outcome.not-confirmed { color: #ffd166; border: 1px solid rgba(255,209,102,.55); }
.exposure-va-correlation-row p { margin: 8px 0 0; color: var(--muted, #9bb1bf); }
.exposure-va-findings { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 5px; }
.exposure-va-findings li { display: grid; gap: 2px; }
.exposure-va-correlation-note { display: grid; gap: 4px; margin: 10px 0 12px; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.03); color: var(--muted, #9bb1bf); }
.va-exposure-origin { margin: 10px 0 14px; padding: 10px 12px; border: 1px solid rgba(91,219,214,.28); border-radius: 10px; display: grid; gap: 4px; background: rgba(91,219,214,.035); }
.va-exposure-origin strong { color: var(--accent, #5bdbd6); }
.va-exposure-origin span, .va-exposure-origin small { overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .exposure-va-correlation-main { grid-template-columns: 1fr; }
  .exposure-va-outcome { justify-self: start; }
}

/* CEL 0.7.5 - correlazione outside-in / inside-out dichiarativa */
.inside-out-correlation { margin-top: 14px; padding: 14px 16px; border: 1px solid rgba(144,123,255,.34); border-radius: 14px; background: rgba(144,123,255,.035); min-width: 0; }
.inside-out-correlation > summary { cursor: pointer; font-weight: 800; color: #c9b8ff; }
.inside-out-summary { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.inside-out-summary span { padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.035); }
.inside-out-list { list-style: none; padding: 0; margin: 10px 0 14px; display: grid; gap: 10px; }
.inside-out-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 12px; align-items: start; padding: 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; min-width: 0; }
.inside-out-row > div { display: grid; gap: 3px; min-width: 0; }
.inside-out-row strong, .inside-out-row small, .inside-out-row em { overflow-wrap: anywhere; }
.inside-out-row em { font-style: normal; color: var(--muted, #9bb1bf); font-size: .78rem; }
.inside-out-row > span { grid-column: 1 / -1; color: var(--muted, #9bb1bf); font-size: .8rem; }
.inside-out-status { padding: 5px 9px; border-radius: 999px; white-space: nowrap; font-size: .72rem; border: 1px solid rgba(183,199,216,.4); color: #b7c7d8; }
.inside-out-status.va_confirmed { color: #63e6be; border-color: rgba(99,230,190,.55); }
.inside-out-status.externally_observed { color: #ffd166; border-color: rgba(255,209,102,.55); }
.inside-out-status.declared_not_observed { color: #ffb454; border-color: rgba(255,180,84,.55); }
.inside-out-status.internal_only { color: #b7c7d8; }
.inside-inventory-form { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); display: grid; gap: 10px; }
.inside-inventory-form label:not(.consent) { display: grid; gap: 6px; }
.inside-inventory-form textarea { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; resize: vertical; }
.inside-out-unmapped { margin: 12px 0; }
.inside-out-unmapped ul { display: grid; gap: 6px; padding-left: 18px; }
.inside-out-unmapped li { overflow-wrap: anywhere; }
@media (max-width: 720px) { .inside-out-row { grid-template-columns: 1fr; } .inside-out-status { justify-self: start; } }

/* CEL 0.7.6 - collector interno autorizzato via VPN */
.inside-collector { margin-top: 1rem; border: 1px solid var(--border); border-radius: 14px; padding: .8rem 1rem; }
.inside-collector > summary { cursor: pointer; font-weight: 700; }
.inside-collector-form { display: grid; gap: .75rem; margin-top: .9rem; }
.inside-collector-form textarea { width: 100%; min-height: 6rem; resize: vertical; }
.inside-collector-window { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.inside-collector-window label { display: grid; gap: .35rem; }
.inside-collector-ready, .inside-collector-disabled { display: block; margin: .6rem 0; font-size: .9rem; }
.inside-collector-scope-summary { display: grid; gap: .35rem; margin: .75rem 0; padding: .75rem; border-radius: 12px; background: rgba(255,255,255,.035); }
.inside-collector-summary { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.inside-collector-summary span { padding: .35rem .55rem; border-radius: 999px; background: rgba(255,255,255,.05); }
.inside-observation { display: block; width: 100%; margin-top: .35rem; font-size: .82rem; }
.inside-observation.observed b { color: var(--success, #8fe3c1); }
.inside-observation.not_observed b, .inside-observation.inconclusive b { color: var(--warning, #ffd27a); }
@media (max-width: 720px) { .inside-collector-window { grid-template-columns: 1fr; } }

/* CEL 0.7.6.1 - chiarimenti UX collector/VA */
.inside-collector-next-step { margin: .75rem 0; padding: .7rem .8rem; border: 1px solid rgba(91,219,214,.24); border-radius: 10px; background: rgba(91,219,214,.035); color: var(--muted); }
.inside-collector-next-step strong { color: var(--text); }
.va-workflow-separation-note { margin-bottom: 14px; padding: 12px 14px; border: 1px solid rgba(245,177,65,.34); border-radius: 12px; background: rgba(245,177,65,.05); display: grid; gap: 6px; }
.va-workflow-separation-note strong { color: #f5b141; }
.va-workflow-separation-note span, .va-workflow-separation-note small { overflow-wrap: anywhere; }
.va-workflow-separation-note code { font-size: .95em; }

/* CEL 0.7.8 - foundation VA interno endpoint-exact */
.inside-va-proposal { display: grid; gap: .45rem; margin: .8rem 0; padding: .8rem; border: 1px solid rgba(99,230,190,.28); border-radius: 12px; background: rgba(99,230,190,.035); }
.inside-va-proposal strong, .va-inside-exact-banner strong, .va-inside-origin strong { color: #63e6be; }
.inside-va-proposal span, .inside-va-proposal small { overflow-wrap: anywhere; }
.va-exact-endpoint-list { grid-column: 1 / -1; display: grid; gap: .55rem; padding: .8rem; border: 1px solid rgba(99,230,190,.24); border-radius: 12px; background: rgba(99,230,190,.025); }
.va-exact-endpoint { margin: 0; padding: .45rem .55rem; border-radius: 9px; background: rgba(255,255,255,.025); }
.va-exact-foundation { border: 1px solid rgba(245,177,65,.28); border-radius: 12px; padding: .8rem; background: rgba(245,177,65,.04); display: grid; gap: .35rem; }
/* CEL 0.7.8 - esito VA interno endpoint-exact */
.inside-va-result { display:block; width:100%; margin-top:.35rem; font-size:.82rem; }
.inside-va-result.evidence_observed b { color: var(--success, #8fe3c1); }
.inside-va-result.no_imported_evidence b { color: var(--muted, #aebdca); }
.va-exact-ready { border-color: rgba(90, 225, 191, .45); }

/* 0.8.0 - Continuous Exposure Monitoring */
.monitoring-foundation-note,
.monitoring-drift {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(11, 35, 49, 0.72);
}
.monitoring-foundation-note strong,
.monitoring-drift strong { color: var(--cyan); }
.monitoring-drift.changed strong { color: var(--amber); }
.monitoring-drift.stable strong { color: var(--green); }
.monitoring-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin: 8px 0 12px;
}
.monitoring-meta span {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--muted);
}
.monitoring-meta b { color: var(--text); }
.monitoring-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.status-monitoring-active { color: var(--green); }
.status-monitoring-paused { color: var(--amber); }
.status-monitoring-expired { color: var(--muted); }

/* 0.8.1 - Monitoring history, timeline and drift notifications */
.monitoring-alert-state {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(90, 225, 191, .28);
  border-radius: 10px;
  background: rgba(90, 225, 191, .04);
}
.monitoring-alert-state strong { color: var(--green); }
.monitoring-alert-state span { color: var(--muted); overflow-wrap: anywhere; }
.monitoring-alert-state.muted { border-color: var(--line); background: rgba(255,255,255,.02); }
.monitoring-alert-state.muted strong { color: var(--muted); }
.monitoring-history {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  background: rgba(11, 35, 49, .45);
}
.monitoring-history summary { cursor: pointer; color: var(--cyan); font-weight: 700; }
.monitoring-history-list { display: grid; gap: 8px; margin: 10px 0; }
.monitoring-history-row {
  display: grid;
  grid-template-columns: minmax(190px, .8fr) minmax(220px, 1.2fr);
  gap: 12px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.monitoring-history-row > div { display: grid; gap: 3px; }
.monitoring-history-row small { color: var(--muted); }
.monitoring-notification { font-size: .78rem; color: var(--muted); }
.monitoring-notification.status-sent { color: var(--green); }
.monitoring-notification.status-failed,
.monitoring-notification.status-not_configured,
.monitoring-notification.status-policy_skipped { color: var(--amber); }
@media (max-width: 720px) {
  .monitoring-history-row { grid-template-columns: 1fr; }
  .monitoring-alert-state { align-items: flex-start; flex-direction: column; }
}


/* 0.8.2 - Monitoring notification policies */
.monitoring-policy-form {
  display: flex;
  align-items: end;
  gap: .75rem;
  flex-wrap: wrap;
  margin-top: .75rem;
}
.monitoring-policy-form label {
  flex: 1 1 260px;
}
.monitoring-policy-form select {
  width: 100%;
}
.monitoring-policy-form small,
.monitoring-policy-form .message {
  flex-basis: 100%;
  margin: 0;
}
.monitoring-policy-form small { color: var(--muted); }

/* 0.8.4 - Monitoring trends dashboard */
.monitoring-trends {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(11, 35, 49, .55);
  display: grid;
  gap: 12px;
}
.monitoring-trends-header {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 12px;
  align-items: end;
}
.monitoring-trends-header > div { display: grid; gap: 3px; }
.monitoring-trends-header > div > strong { color: var(--cyan); }
.monitoring-trends-header small { color: var(--muted); }
.monitoring-trends-header label { min-width: 130px; }
.monitoring-trends-header select { width: 100%; }
.monitoring-surface-state {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .04em;
  white-space: nowrap;
}
.monitoring-surface-state.stable { color: var(--green); border-color: rgba(90,225,191,.35); }
.monitoring-surface-state.changed { color: var(--amber); border-color: rgba(245,177,65,.4); }
.monitoring-surface-state.no_data { color: var(--muted); }
.monitoring-trend-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 8px;
}
.monitoring-trend-metrics > span {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.monitoring-trend-metrics small { color: var(--muted); }
.monitoring-trend-metrics b { font-size: 1.25rem; color: var(--text); }
.monitoring-trend-deltas {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 8px;
}
.monitoring-trend-deltas > div {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.monitoring-trend-deltas strong { color: var(--cyan); }
.monitoring-trend-deltas span { color: var(--muted); }
.monitoring-trend-deltas b { color: var(--text); }
.monitoring-trend-chart {
  display: grid;
  gap: 8px;
  padding-top: 2px;
}
.monitoring-trend-chart-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}
.monitoring-trend-chart-head small,
.monitoring-trend-chart > small { color: var(--muted); }
.monitoring-trend-bars {
  min-height: 126px;
  display: flex;
  align-items: end;
  gap: 8px;
  padding: 10px 8px 6px;
  border-bottom: 1px solid rgba(255,255,255,.12);
  overflow-x: auto;
}
.monitoring-trend-run {
  flex: 1 0 42px;
  min-width: 42px;
  max-width: 62px;
  display: grid;
  grid-template-rows: 22px 62px 18px;
  gap: 4px;
  align-items: end;
  text-align: center;
}
.monitoring-trend-run > strong {
  align-self: center;
  font-size: .76rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.monitoring-trend-bar {
  width: 100%;
  height: 62px;
  border-radius: 7px 7px 3px 3px;
  border: 1px solid rgba(90,225,191,.42);
  background: rgba(90,225,191,.28);
  box-shadow: inset 0 -12px 18px rgba(0,0,0,.08);
}
.monitoring-trend-run.changed > strong { color: rgba(245,177,65,.95); }
.monitoring-trend-run.changed .monitoring-trend-bar { background: rgba(245,177,65,.42); border-color: rgba(245,177,65,.65); }
.monitoring-trend-run.inconclusive .monitoring-trend-bar { background: transparent; border-style: dashed; border-color: rgba(255,255,255,.35); }
.monitoring-trend-run em {
  align-self: start;
  font-size: .68rem;
  font-style: normal;
  color: var(--text);
  opacity: .9;
}
.monitoring-trends-empty { margin-top: 12px; color: var(--muted); }
@media (max-width: 900px) {
  .monitoring-trends-header { grid-template-columns: 1fr 1fr; }
  .monitoring-surface-state { justify-self: start; }
  .monitoring-trend-metrics { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .monitoring-trend-deltas { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .monitoring-trends-header { grid-template-columns: 1fr; }
  .monitoring-trend-metrics { grid-template-columns: 1fr 1fr; }
  .monitoring-trend-chart-head { display: grid; }
}

/* 0.8.4 - Monitoring portfolio overview */
.monitoring-portfolio {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(11, 35, 49, .62);
  display: grid;
  gap: 12px;
}
.monitoring-portfolio-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
}
.monitoring-portfolio-head > div { display: grid; gap: 3px; }
.monitoring-portfolio-head strong { color: var(--cyan); font-size: 1.05rem; }
.monitoring-portfolio-head small,
.monitoring-portfolio-note { color: var(--muted); }
.monitoring-portfolio-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(105px, 1fr));
  gap: 8px;
}
.monitoring-portfolio-metrics > span {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.monitoring-portfolio-metrics small { color: var(--muted); }
.monitoring-portfolio-metrics b { font-size: 1.25rem; color: var(--text); }
.monitoring-portfolio-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 320px);
  gap: 12px;
  align-items: end;
}
.monitoring-portfolio-filters { display: flex; gap: 7px; flex-wrap: wrap; }
.monitoring-portfolio-filter {
  appearance: none;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 11px;
  color: var(--muted);
  background: rgba(255,255,255,.02);
  cursor: pointer;
  font: inherit;
  font-size: .82rem;
}
.monitoring-portfolio-filter b { color: var(--text); margin-left: 4px; }
.monitoring-portfolio-filter:hover,
.monitoring-portfolio-filter.is-active {
  color: var(--cyan);
  border-color: rgba(90,225,191,.45);
  background: rgba(90,225,191,.08);
}
.monitoring-portfolio-search { margin: 0; }
.monitoring-portfolio-search input { width: 100%; }
@media (max-width: 1050px) {
  .monitoring-portfolio-metrics { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
}
@media (max-width: 720px) {
  .monitoring-portfolio-head { align-items: stretch; flex-direction: column; }
  .monitoring-portfolio-controls { grid-template-columns: 1fr; }
  .monitoring-portfolio-metrics { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
}
@media (max-width: 480px) {
  .monitoring-portfolio-metrics { grid-template-columns: 1fr; }
}

/* 0.8.6.2 - Monitoring portfolio interaction hotfix */
.monitoring-portfolio-status {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  padding-top: 2px;
}
.monitoring-portfolio-status strong { color: var(--text); font-size: .78rem; }
.monitoring-portfolio-status small { color: var(--muted); }
.monitoring-programs-view { display: grid; gap: 11px; }
.operations-secondary:disabled {
  cursor: not-allowed;
  opacity: .45;
}
@media (max-width: 720px) {
  .monitoring-portfolio-status { align-items: start; flex-direction: column; }
}


/* 0.8.6.2 - Monitoring recent activity & upcoming operations */
.monitoring-operations-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .85fr);
  gap: 10px;
  padding-top: 2px;
}
.monitoring-activity-panel {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 9px;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background: rgba(255,255,255,.018);
}
.monitoring-activity-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.monitoring-activity-head > div { display: grid; gap: 2px; }
.monitoring-activity-head strong { color: var(--cyan); }
.monitoring-activity-head small { color: var(--muted); font-size: .72rem; }
.monitoring-activity-list,
.monitoring-upcoming-list { display: grid; gap: 7px; }
.monitoring-activity-row {
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.monitoring-activity-row:last-child { border-bottom: 0; }
.monitoring-activity-row > div { display: grid; gap: 2px; min-width: 0; }
.monitoring-activity-row strong { color: var(--text); font-size: .82rem; }
.monitoring-activity-row small,
.monitoring-activity-row span { color: var(--muted); font-size: .72rem; overflow-wrap: anywhere; }
.monitoring-activity-dot {
  width: 8px;
  height: 8px;
  margin-top: 5px;
  border-radius: 999px;
  background: rgba(245,177,65,.85);
}
.monitoring-activity-row.notification .monitoring-activity-dot { background: rgba(90,225,191,.9); }
.monitoring-activity-row.attention .monitoring-activity-dot { background: rgba(239,111,108,.9); }
.monitoring-upcoming-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.monitoring-upcoming-row:last-child { border-bottom: 0; }
.monitoring-upcoming-row > div { display: grid; gap: 2px; min-width: 0; }
.monitoring-upcoming-row > div:last-child { text-align: right; }
.monitoring-upcoming-row strong,
.monitoring-upcoming-row b { color: var(--text); font-size: .78rem; }
.monitoring-upcoming-row small { color: var(--muted); font-size: .7rem; overflow-wrap: anywhere; }
.monitoring-upcoming-row.overdue b,
.monitoring-upcoming-row.overdue small { color: var(--amber); }
.monitoring-activity-empty {
  padding: 10px;
  color: var(--muted);
  border: 1px dashed rgba(255,255,255,.1);
  border-radius: 8px;
  font-size: .76rem;
}
@media (max-width: 860px) {
  .monitoring-operations-overview { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .monitoring-upcoming-row { grid-template-columns: 1fr; }
  .monitoring-upcoming-row > div:last-child { text-align: left; }
}

/* 0.8.6.2 - Monitoring global search across programs and baselines */
.monitoring-foundation-note small { color: var(--muted); }
.monitoring-candidates-view[hidden] { display: none !important; }


/* 0.8.6.2 - Monitoring operational digest */
.monitoring-digest-panel {
  display: grid; gap: 10px; padding: 12px; border: 1px solid rgba(90,225,191,.22); border-radius: 11px; background: rgba(90,225,191,.025);
}
.monitoring-digest-head { display: flex; justify-content: space-between; align-items: start; gap: 12px; flex-wrap: wrap; }
.monitoring-digest-head > div { display: grid; gap: 3px; }
.monitoring-digest-head strong { color: var(--cyan); }
.monitoring-digest-head small { color: var(--muted); max-width: 760px; }
.monitoring-digest-meta { display: grid; grid-template-columns: repeat(4, minmax(145px, 1fr)); gap: 8px; }
.monitoring-digest-meta span { display: grid; gap: 3px; padding: 9px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; color: var(--muted); font-size: .72rem; }
.monitoring-digest-meta b { color: var(--text); overflow-wrap: anywhere; }
.monitoring-digest-form { display: grid; gap: 9px; }
.monitoring-digest-form-grid { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 8px; }
.monitoring-digest-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 900px) { .monitoring-digest-meta, .monitoring-digest-form-grid { grid-template-columns: repeat(2, minmax(145px, 1fr)); } }
@media (max-width: 560px) { .monitoring-digest-meta, .monitoring-digest-form-grid { grid-template-columns: 1fr; } }

/* 0.8.7 - Monitoring digest delivery history & audit */
.monitoring-digest-history { border-top: 1px solid rgba(255,255,255,.07); padding-top: 4px; }
.monitoring-digest-history summary { cursor: pointer; color: var(--cyan); font-weight: 700; padding: 6px 0; }
.monitoring-digest-history-list { display: grid; gap: 7px; margin-top: 4px; }
.monitoring-digest-history-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 10px; border: 1px solid rgba(255,255,255,.07); border-radius: 9px; background: rgba(255,255,255,.018); }
.monitoring-digest-history-main { display: grid; gap: 3px; min-width: 0; }
.monitoring-digest-history-main strong { color: var(--text); }
.monitoring-digest-history-main small { color: var(--muted); overflow-wrap: anywhere; }
.monitoring-digest-history-status { font-size: .75rem; font-weight: 800; color: var(--muted); white-space: nowrap; }
.monitoring-digest-history-status.is-sent { color: var(--green); }
.monitoring-digest-history-status.is-failed, .monitoring-digest-error { color: var(--amber) !important; }
@media (max-width: 640px) { .monitoring-digest-history-row { grid-template-columns: 1fr; } }

/* 0.8.8 - Monitoring digest delivery troubleshooting */
.monitoring-digest-history-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 2px 0 8px; }
.monitoring-digest-history-toolbar small { color: var(--muted); }
.monitoring-digest-export { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }
.monitoring-digest-history-actions { display: grid; justify-items: end; gap: 7px; }
.monitoring-digest-legacy-note { color: var(--muted); font-size: .7rem; max-width: 180px; text-align: right; }
.monitoring-digest-detail-host { grid-column: 1 / -1; }
.monitoring-digest-detail-card { display: grid; gap: 10px; padding: 11px; border: 1px solid rgba(92,178,255,.2); border-radius: 9px; background: rgba(92,178,255,.025); }
.monitoring-digest-detail-head { display: flex; justify-content: space-between; align-items: start; gap: 12px; flex-wrap: wrap; }
.monitoring-digest-detail-head > div { display: grid; gap: 2px; }
.monitoring-digest-detail-head small { color: var(--muted); }
.monitoring-digest-detail-grid, .monitoring-digest-detail-counts { display: grid; grid-template-columns: repeat(4, minmax(135px, 1fr)); gap: 7px; }
.monitoring-digest-detail-grid span, .monitoring-digest-detail-counts span { display: grid; gap: 2px; padding: 8px; border: 1px solid rgba(255,255,255,.06); border-radius: 7px; color: var(--muted); font-size: .7rem; }
.monitoring-digest-detail-grid b, .monitoring-digest-detail-counts b { color: var(--text); overflow-wrap: anywhere; }
.monitoring-digest-smtp-error { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 9px; border: 1px solid rgba(255,190,92,.24); border-radius: 8px; background: rgba(255,190,92,.04); }
.monitoring-digest-smtp-error strong { color: var(--amber); }
.monitoring-digest-smtp-error span { color: var(--text); }
.monitoring-digest-smtp-error code { color: var(--muted); overflow-wrap: anywhere; }
.monitoring-digest-detail-snapshot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.monitoring-digest-detail-section { display: grid; gap: 5px; padding: 9px; border: 1px solid rgba(255,255,255,.06); border-radius: 8px; }
.monitoring-digest-detail-section strong { color: var(--cyan); font-size: .78rem; }
.monitoring-digest-detail-section small { color: var(--muted); }
.monitoring-digest-detail-section ul { margin: 0; padding-left: 18px; color: var(--muted); font-size: .72rem; display: grid; gap: 3px; }
.monitoring-digest-detail-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.monitoring-digest-retry-note { color: var(--muted); }
@media (max-width: 900px) { .monitoring-digest-detail-grid, .monitoring-digest-detail-counts { grid-template-columns: repeat(2, minmax(135px, 1fr)); } }
@media (max-width: 640px) { .monitoring-digest-history-actions { justify-items: start; } .monitoring-digest-legacy-note { text-align: left; max-width: none; } .monitoring-digest-detail-grid, .monitoring-digest-detail-counts, .monitoring-digest-detail-snapshot { grid-template-columns: 1fr; } .monitoring-digest-smtp-error { grid-template-columns: 1fr; } }

/* 0.8.9 - Monitoring scheduling health & recovery */
.monitoring-schedule-health {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(90,225,191,.28);
  border-radius: 10px;
  background: rgba(90,225,191,.035);
}
.monitoring-schedule-health > div { display: grid; gap: 3px; min-width: 0; }
.monitoring-schedule-health strong { color: var(--green); }
.monitoring-schedule-health span { color: var(--muted); overflow-wrap: anywhere; }
.monitoring-schedule-health.issue { border-color: rgba(245,177,65,.42); background: rgba(245,177,65,.045); }
.monitoring-schedule-health.issue strong { color: var(--amber); }
.monitoring-schedule-health.muted { border-color: var(--line); background: rgba(255,255,255,.018); }
.monitoring-schedule-health.muted strong { color: var(--muted); }
@media (max-width: 720px) {
  .monitoring-schedule-health { align-items: flex-start; flex-direction: column; }
}

/* 0.8.10 - overdue recovery provenance */
.monitoring-recovery {
  display: flex;
  gap: 12px;
  margin: -2px 0 12px;
  padding: 9px 12px;
  border: 1px solid rgba(90,225,191,.20);
  border-radius: 10px;
  background: rgba(90,225,191,.025);
}
.monitoring-recovery > div { display: grid; gap: 3px; }
.monitoring-recovery strong { color: var(--cyan); }
.monitoring-recovery span, .monitoring-recovery small { color: var(--muted); overflow-wrap: anywhere; }
.monitoring-recovery.issue { border-color: rgba(245,177,65,.38); background: rgba(245,177,65,.04); }
.monitoring-recovery.issue strong { color: var(--amber); }