:root {
  --bg: #0f172a;
  --bg-elevated: #111827;
  --surface: #ffffff;
  --surface-muted: #f8fafc;
  --surface-strong: #e2e8f0;
  --border: #dbe3ef;
  --border-strong: #c7d2e3;
  --text: #0f172a;
  --text-muted: #475569;
  --text-soft: #64748b;
  --brand: #2563eb;
  --brand-strong: #1d4ed8;
  --success: #047857;
  --warning: #b45309;
  --danger: #b91c1c;
  --shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
  --shadow-soft: 0 10px 28px rgba(15, 23, 42, 0.06);
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 10px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%); color: var(--text); font-family: var(--font-sans); min-height: 100%; }
a { color: var(--brand-strong); text-decoration: none; }
a:hover { text-decoration: underline; }
body.portal-shell { min-height: 100vh; }
.portal-shell__frame { display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: 100vh; }
.portal-sidebar { background: linear-gradient(180deg, #0f172a 0%, #111827 100%); color: #e5eefc; padding: var(--space-6); position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; gap: var(--space-6); }
.portal-brand { display: flex; gap: var(--space-4); align-items: center; }
.portal-brand img { width: 48px; height: 48px; object-fit: contain; border-radius: 12px; background: rgba(255,255,255,.06); padding: 6px; }
.portal-brand__text strong { display: block; font-size: 18px; letter-spacing: .02em; }
.portal-brand__text span { display: block; color: #9fb3d1; font-size: 13px; margin-top: 4px; }
.portal-nav { display: flex; flex-direction: column; gap: var(--space-2); }
.portal-nav__section-label { color: #7f95b5; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; margin: var(--space-2) 0 var(--space-1); }
.portal-nav a { color: #d9e7fb; padding: 12px 14px; border-radius: 12px; display: flex; align-items: center; justify-content: space-between; font-weight: 600; border: 1px solid transparent; }
.portal-nav a:hover { background: rgba(255,255,255,.06); text-decoration: none; }
.portal-nav a.is-active { background: rgba(37, 99, 235, .18); border-color: rgba(96, 165, 250, .35); box-shadow: inset 0 0 0 1px rgba(147, 197, 253, .08); }
.portal-nav__meta { color: #7f95b5; font-size: 12px; }
.portal-nav__separator { height: 1px; background: rgba(148, 163, 184, .28); margin: var(--space-3) 0 var(--space-2); }
.portal-sidebar__footer { margin-top: auto; border-top: 1px solid rgba(203, 213, 225, .16); padding-top: var(--space-5); color: #9fb3d1; font-size: 13px; }
.portal-main { min-width: 0; padding: var(--space-6); display: grid; grid-template-rows: auto auto 1fr auto; gap: var(--space-5); }
.portal-header { background: rgba(255,255,255,.82); backdrop-filter: blur(12px); border: 1px solid rgba(219,227,239,.9); border-radius: var(--radius-lg); padding: var(--space-5) var(--space-6); box-shadow: var(--shadow-soft); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-5); align-items: start; }
.portal-header__title h1 { margin: 0; font-size: 30px; line-height: 1.1; }
.portal-header__title p { margin: 8px 0 0; color: var(--text-muted); max-width: 72ch; }
.portal-header__actions { display: grid; gap: var(--space-3); min-width: 320px; }
.portal-user-card, .portal-tenant-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); padding: var(--space-4); }
.portal-user-card__row { display: flex; justify-content: space-between; gap: var(--space-4); align-items: center; }
.portal-user-card__identity strong { display: block; }
.portal-user-card__identity span, .portal-kv span { color: var(--text-soft); font-size: 13px; }
.portal-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.portal-pill--brand { background: rgba(37,99,235,.12); color: var(--brand-strong); }
.portal-pill--success { background: rgba(4,120,87,.12); color: var(--success); }
.portal-pill--warning { background: rgba(180,83,9,.12); color: var(--warning); }
.portal-pill--danger { background: rgba(185,28,28,.12); color: var(--danger); }
.portal-banner-stack { display: grid; gap: var(--space-3); }
.portal-banner { border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); padding: var(--space-4) var(--space-5); box-shadow: var(--shadow-soft); }
.portal-banner--error { border-color: rgba(185,28,28,.18); background: linear-gradient(180deg, #ffffff 0%, #fff8f8 100%); }
.portal-banner--success { border-color: rgba(4,120,87,.18); background: linear-gradient(180deg, #ffffff 0%, #f8fffb 100%); }
.portal-banner--warning { border-color: rgba(37,99,235,.14); background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%); }
.portal-page { min-width: 0; display: grid; gap: var(--space-5); }
.portal-grid { display: grid; gap: var(--space-5); }
.portal-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.portal-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.portal-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.portal-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); overflow: hidden; }
.portal-card__header { padding: var(--space-5) var(--space-5) 0; }
.portal-card__header h2, .portal-card__header h3 { margin: 0; }
.portal-card__header p { margin: 8px 0 0; color: var(--text-muted); }
.portal-card__body { padding: var(--space-5); }
.portal-stat { padding: var(--space-5); border: 1px solid var(--border); border-radius: var(--radius-md); background: linear-gradient(180deg, #fff 0%, #f8fbff 100%); }
.portal-stat__label { color: var(--text-soft); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.portal-stat__value { margin-top: var(--space-2); font-size: 30px; font-weight: 800; line-height: 1; }
.portal-stat__meta { margin-top: var(--space-2); color: var(--text-muted); font-size: 13px; }
.portal-kv-list { display: grid; gap: var(--space-4); }
.portal-kv { display: grid; gap: 4px; }
.portal-kv strong { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-soft); }
.portal-stack { display: grid; gap: var(--space-4); }
.portal-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--space-4); }
.portal-field { display: grid; gap: 6px; }
.portal-field label { font-size: 13px; font-weight: 700; color: var(--text-muted); }
.portal-input, .portal-select, .portal-textarea { width: 100%; border: 1px solid var(--border-strong); border-radius: 12px; padding: 11px 13px; font: inherit; background: #fff; color: var(--text); }
.portal-input:focus, .portal-select:focus, .portal-textarea:focus { outline: 3px solid rgba(37,99,235,.15); border-color: var(--brand); }
.portal-actions { display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: center; }
.portal-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 12px; padding: 11px 15px; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; border: 1px solid transparent; white-space: nowrap; flex-shrink: 0; }
.portal-button:hover { text-decoration: none; }
.portal-button--primary { background: var(--brand); color: #fff; }
.portal-button--primary:hover { background: var(--brand-strong); }
.portal-button--secondary { background: #fff; color: var(--text); border-color: var(--border-strong); }
.portal-button--danger { background: var(--danger); color: #fff; }
.portal-button--ghost { background: transparent; color: var(--text-muted); border-color: transparent; }
.portal-table-wrap { overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-md); }
 table.portal-table { width: 100%; border-collapse: collapse; min-width: 860px; }
.portal-table th, .portal-table td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: top; word-break: normal; overflow-wrap: normal; hyphens: none; }
.portal-table thead th { background: var(--surface-muted); color: var(--text-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.portal-table tbody tr:hover { background: #f8fbff; }
.portal-state { border: 1px dashed var(--border-strong); border-radius: var(--radius-md); padding: var(--space-6); background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%); }
.portal-state h3 { margin: 0 0 var(--space-2); }
.portal-state p { margin: 0; color: var(--text-muted); }
.portal-notice-list { display: grid; gap: var(--space-3); }
.portal-notice { padding: var(--space-4); border-radius: var(--radius-md); background: var(--surface-muted); border: 1px solid var(--border); }
.portal-footer { color: var(--text-soft); font-size: 13px; display: flex; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; }
.portal-mobile-nav-toggle { display: none; }
@media (max-width: 1180px) {
  .portal-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-header { grid-template-columns: 1fr; }
  .portal-header__actions { min-width: 0; }
}
@media (max-width: 960px) {
  .portal-shell__frame { grid-template-columns: 1fr; }
  .portal-sidebar { position: static; height: auto; }
  .portal-main { padding-top: 0; }
  .portal-grid--three, .portal-grid--two, .portal-form-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .portal-main, .portal-sidebar { padding: var(--space-4); }
  .portal-header__title h1 { font-size: 24px; }
  .portal-grid--four { grid-template-columns: 1fr; }
}
code.portal-code, .portal-code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; word-break: break-all; }

.portal-card--hero { margin-bottom: var(--space-5); }
.portal-card--hero .portal-card__header p { max-width: 920px; font-size: 16px; line-height: 1.65; }

/* Dashboard workflow buttons */
.portal-workflow-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}
.portal-workflow-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  width: 100%;
  min-height: 72px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(37, 99, 235, .18);
  background: linear-gradient(180deg, #f8fbff 0%, #eef4ff 100%);
  color: var(--brand-strong);
  font-weight: 700;
  text-decoration: none;
  box-shadow: var(--shadow-soft);
}
.portal-workflow-button:hover {
  text-decoration: none;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border-color: rgba(37, 99, 235, .32);
}
.portal-workflow-button__title {
  font-size: 18px;
  line-height: 1.1;
}
.portal-workflow-button__meta {
  font-size: 13px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-soft);
}

/* DataTables / registry table containment */
.portal-card,
.portal-table-wrap,
.dataTables_wrapper,
.dataTables_scroll,
.dataTables_scrollBody,
.dataTables_scrollHead,
.dataTables_scrollHeadInner {
  max-width: 100%;
}
.portal-table-wrap {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
.table.portal-table,
.portal-table,
.dataTable,
table.dataTable {
  width: 100% !important;
  max-width: 100%;
}
.dataTables_wrapper {
  width: 100%;
  overflow-x: auto;
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
  margin-bottom: var(--space-4);
}
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
  max-width: 100%;
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
  margin-top: var(--space-4);
}
.dataTables_wrapper .dataTables_paginate {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.dataTables_wrapper .paginate_button {
  min-width: 44px;
}

/* Registry tables should stop forcing page blowout */
.portal-table--registry,
.portal-table--comparisons {
  min-width: 0;
}

@media (max-width: 980px) {
  .portal-workflow-grid {
    grid-template-columns: 1fr;
  }
  .dataTables_wrapper .dataTables_length,
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_info,
  .dataTables_wrapper .dataTables_paginate {
    float: none !important;
    text-align: left !important;
  }
}

.portal-table--registry,
.portal-table--comparisons,
table.dataTable.portal-table--registry,
table.dataTable.portal-table--comparisons {
  min-width: 0 !important;
}



.portal-card__header--collapsible { display:flex; align-items:flex-start; justify-content:space-between; gap: var(--space-4); }
.portal-card--collapsible.is-collapsed .portal-card__body { display:none; }
.portal-card--collapsible [data-collapsible-toggle] { flex: 0 0 auto; }
.portal-banner > div { min-width: 0; }
.portal-banner strong, .portal-banner div { overflow-wrap: break-word; }
.portal-table td .portal-actions { align-items:flex-start; }
.portal-datatables .dataTables_toolbar, .portal-datatables .dataTables_footer { width:100%; }
.portal-datatables .dataTables_filter input { width:min(100%, 320px); }
@media (max-width: 720px) {
  .portal-card__header--collapsible { flex-direction: column; align-items: stretch; }
  .portal-card__header--collapsible [data-collapsible-toggle] { align-self: flex-start; }
}


.portal-banner { position: relative; overflow: hidden; }
.portal-banner::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--brand); opacity: .9; }
.portal-banner--success::before { background: var(--success); }
.portal-banner--error::before { background: var(--danger); }
.portal-banner__inner { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.portal-banner__copy { min-width: 0; padding-left: 4px; }
.portal-banner__message { margin-top: 6px; color: var(--text-muted); }
.portal-banner__dismiss { padding-inline: 10px; color: var(--text-soft); }
.portal-status, .portal-pill, .portal-nav__meta, .portal-summary-chip, .portal-link-button { white-space: nowrap; }
.portal-inline-meta { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
.portal-inline-meta > span { min-width: 0; }
.portal-kv span { overflow-wrap: break-word; }
.portal-table--registry { min-width: 1180px !important; }
.portal-table--registry th:nth-child(2), .portal-table--registry td:nth-child(2) { min-width: 92px; }
.portal-table--registry th:nth-child(3), .portal-table--registry td:nth-child(3) { min-width: 156px; }
.portal-table--registry th:nth-child(4), .portal-table--registry td:nth-child(4) { min-width: 170px; }
.portal-table--registry th:nth-child(5), .portal-table--registry td:nth-child(5) { min-width: 120px; }
.portal-table--registry th:nth-child(6), .portal-table--registry td:nth-child(6) { min-width: 220px; }
.portal-table--registry td:nth-child(6) .portal-actions { flex-direction: column; align-items: stretch; }
.portal-table--registry td:nth-child(6) .portal-button { width: 100%; }
.portal-table--registry .portal-status { display: inline-flex; }
.portal-table--registry .portal-code { word-break: break-all; }
.portal-table--registry details summary { cursor: pointer; }
.portal-card--collapsible .portal-card__body[hidden] { display: none !important; }
@media (max-width: 720px) {
  .portal-banner__inner { flex-direction: column; align-items: stretch; }
  .portal-banner__dismiss { align-self: flex-start; }
}


/* Header refinement pass */
.portal-header {
  background: linear-gradient(180deg, #0f2f66 0%, #0b2450 100%);
  border-color: rgba(96, 165, 250, .24);
  box-shadow: 0 18px 45px rgba(8, 23, 52, 0.22);
  color: #ffffff;
  display: block;
}
.portal-header__topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}
.portal-header__toggle-copy {
  min-width: 0;
  text-align: left;
}
.portal-header__toggle-copy h1 {
  margin: 0;
  font-size: 34px;
  line-height: 1.05;
  font-weight: 800;
  color: #ffffff;
}
.portal-header__toggle-copy p {
  margin: 10px 0 0;
  font-size: 20px;
  line-height: 1.35;
  color: rgba(226, 236, 255, 0.96);
  max-width: 72ch;
}
.portal-header__toggle {
  margin-left: auto;
  align-self: flex-start;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
}
.portal-header__toggle-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  color: #fff;
  border: 1px solid rgba(191, 219, 254, .35);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.portal-header__toggle:hover .portal-header__toggle-indicator,
.portal-header__toggle:focus-visible .portal-header__toggle-indicator {
  background: rgba(255,255,255,.18);
  border-color: rgba(191, 219, 254, .55);
}
.portal-header__body {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid rgba(191, 219, 254, .20);
}
.portal-header__body[hidden] { display: none !important; }
.portal-header__utility,
.portal-header__utility-row,
.portal-membership-summary,
.portal-header__actions,
.portal-header .portal-kv strong,
.portal-header .portal-kv span,
.portal-header .portal-user-card__identity strong,
.portal-header .portal-user-card__identity span {
  color: #ffffff;
}
.portal-header .portal-status--authenticated {
  background: rgba(255,255,255,.12);
  color: #fff;
  border-color: rgba(191, 219, 254, .3);
}
.portal-header .portal-select {
  background: rgba(255,255,255,.08);
  border-color: rgba(191, 219, 254, .28);
  color: #fff;
}
.portal-header .portal-select option { color: #0f172a; }
.portal-header .portal-button--secondary {
  background: rgba(255,255,255,.12);
  color: #fff;
  border-color: rgba(191, 219, 254, .28);
}
.portal-header .portal-button--secondary:hover {
  background: rgba(255,255,255,.18);
}
.portal-actions--header {
  width: 100%;
  justify-content: space-between;
  align-items: flex-end;
}
.portal-header__logout-form {
  margin-left: auto;
}
.portal-button--header-logout {
  background: rgba(255,255,255,.14);
  color: #fff;
  border-color: rgba(191, 219, 254, .3);
  border-radius: 999px;
  padding: 10px 18px;
}
.portal-button--header-logout:hover {
  background: rgba(255,255,255,.22);
}
@media (max-width: 960px) {
  .portal-header__topbar,
  .portal-actions--header {
    flex-direction: column;
    align-items: stretch;
  }
  .portal-header__toggle {
    margin-left: 0;
  }
  .portal-header__logout-form {
    margin-left: 0;
    align-self: flex-start;
  }
}

/* Scan-centric operational cards and lazy revision timeline */
.scan-container-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 18px;
}
.scan-set-card {
    border: 1px solid #dbe5f3;
    border-radius: 20px;
    background: #ffffff;
    padding: 20px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}
.scan-set-card__topline,
.scan-revision-item__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.scan-set-card__revision-count {
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.scan-set-card__heading h3 {
    margin: 14px 0 4px;
    font-size: 24px;
    line-height: 1.15;
    color: #0f172a;
}
.scan-set-card__heading p {
    margin: 0;
    color: #475569;
}
.scan-set-card__identity {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 18px 0;
}
.scan-set-card__identity div {
    border: 1px solid #edf2f7;
    border-radius: 14px;
    padding: 10px 12px;
    background: #f8fafc;
}
.scan-set-card__identity strong,
.scan-set-card__decision-label {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.scan-set-card__identity span {
    color: #0f172a;
    font-weight: 650;
}
.scan-set-card__decision {
    border: 1px solid #dbe5f3;
    border-radius: 18px;
    padding: 16px;
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}
.scan-set-card__decision--high { border-color: #fca5a5; background: #fff7f7; }
.scan-set-card__decision--medium { border-color: #fcd34d; background: #fffbeb; }
.scan-set-card__decision--low { border-color: #bfdbfe; background: #eff6ff; }
.scan-set-card__decision h4 {
    margin: 0 0 6px;
    color: #0f172a;
    font-size: 18px;
}
.scan-set-card__decision p,
.scan-revision-item__decision p {
    margin: 0;
    color: #475569;
    line-height: 1.5;
}
.scan-set-card__counts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.scan-set-card__counts span {
    border-radius: 999px;
    background: #e2e8f0;
    color: #0f172a;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 800;
}
.scan-set-card__context { margin-top: 14px; }
.scan-set-card__actions { margin-top: 16px; justify-content: flex-start; }
.scan-set-card__launch-message {
    margin-top: 10px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}
.scan-revision-timeline {
    margin-top: 18px;
    border-top: 1px solid #e2e8f0;
    padding-top: 18px;
}
.scan-revision-timeline__loading {
    color: #64748b;
    font-weight: 700;
}
.scan-revision-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
}
.scan-revision-item {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: 12px;
}
.scan-revision-item__marker {
    width: 14px;
    height: 14px;
    margin-top: 6px;
    border-radius: 999px;
    background: #2563eb;
    box-shadow: 0 0 0 4px #dbeafe;
}
.scan-revision-item__body {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 14px;
    background: #ffffff;
}
.scan-revision-item__decision {
    margin-top: 10px;
}
.scan-revision-item__actions {
    margin-top: 12px;
    justify-content: flex-start;
}
@media (max-width: 720px) {
    .scan-container-grid { grid-template-columns: 1fr; }
    .scan-set-card { padding: 16px; }
}

/* SCAN-CONTAINER-UX-1-R5: bounded scan sets, color coordination, action dropdown */
.scan-set-card {
    position: relative;
    overflow: visible;
    border-width: 2px;
}
.scan-set-card__accent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 7px;
    border-radius: 20px 20px 0 0;
    background: #2563eb;
}
.scan-set-card--tone-1 { border-color: #bfdbfe; background: linear-gradient(180deg, #eff6ff 0%, #ffffff 26%); }
.scan-set-card--tone-1 .scan-set-card__accent { background: #2563eb; }
.scan-set-card--tone-1 .scan-set-card__identity div { border-color: #dbeafe; background: #f8fbff; }
.scan-set-card--tone-2 { border-color: #bbf7d0; background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 26%); }
.scan-set-card--tone-2 .scan-set-card__accent { background: #16a34a; }
.scan-set-card--tone-2 .scan-set-card__identity div { border-color: #dcfce7; background: #fbfffc; }
.scan-set-card--tone-3 { border-color: #fde68a; background: linear-gradient(180deg, #fffbeb 0%, #ffffff 26%); }
.scan-set-card--tone-3 .scan-set-card__accent { background: #d97706; }
.scan-set-card--tone-3 .scan-set-card__identity div { border-color: #fef3c7; background: #fffdf7; }
.scan-set-card--tone-4 { border-color: #ddd6fe; background: linear-gradient(180deg, #f5f3ff 0%, #ffffff 26%); }
.scan-set-card--tone-4 .scan-set-card__accent { background: #7c3aed; }
.scan-set-card--tone-4 .scan-set-card__identity div { border-color: #ede9fe; background: #fcfbff; }
.scan-set-card--tone-5 { border-color: #fecdd3; background: linear-gradient(180deg, #fff1f2 0%, #ffffff 26%); }
.scan-set-card--tone-5 .scan-set-card__accent { background: #e11d48; }
.scan-set-card--tone-5 .scan-set-card__identity div { border-color: #ffe4e6; background: #fffafb; }
.scan-set-card--tone-6 { border-color: #bae6fd; background: linear-gradient(180deg, #f0f9ff 0%, #ffffff 26%); }
.scan-set-card--tone-6 .scan-set-card__accent { background: #0284c7; }
.scan-set-card--tone-6 .scan-set-card__identity div { border-color: #e0f2fe; background: #f8fdff; }
.scan-actions-menu {
    margin-top: 16px;
    border: 1px solid #dbe5f3;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.86);
}
.scan-actions-menu[open] {
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}
.scan-actions-menu summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    color: #0f172a;
    font-weight: 850;
    list-style: none;
}
.scan-actions-menu summary::-webkit-details-marker { display: none; }
.scan-actions-menu summary::after {
    content: "▾";
    color: #64748b;
    font-size: 14px;
    transition: transform .16s ease;
}
.scan-actions-menu[open] summary::after { transform: rotate(180deg); }
.scan-actions-menu__hint {
    margin-left: auto;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}
.scan-actions-menu__body {
    border-top: 1px solid #e2e8f0;
    padding: 14px;
    display: grid;
    gap: 14px;
}
.scan-actions-menu__group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.scan-actions-menu__label {
    flex: 0 0 100%;
    color: #64748b;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.scan-actions-menu__url-row {
    flex: 1 1 100%;
    display: grid;
    gap: 6px;
    min-width: 0;
}
.scan-actions-menu__url-row strong {
    color: #334155;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.scan-actions-menu__url-row .portal-code,
.scan-actions-menu__url-row pre.portal-code {
    display: block;
    margin: 0;
    max-width: 100%;
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: anywhere;
}

/* Runtime topology visibility: local/prod safety signal. */
.runtime-environment-banner {
    position: sticky;
    top: 0;
    z-index: 10000;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: #eef7ff;
    color: #17415f;
    border-bottom: 1px solid rgba(23,65,95,.18);
}
.runtime-environment-banner.runtime-env-production {
    background: #fff1f1;
    color: #7a1f1f;
    border-bottom-color: rgba(122,31,31,.25);
}
.runtime-environment-banner.runtime-env-staging {
    background: #fff8e1;
    color: #6f4e00;
    border-bottom-color: rgba(111,78,0,.25);
}


/* Progressive view rendering and disclosure controls */
.portal-page > * { animation: portalFadeUp .22s ease-out both; }
.portal-card__body, .portal-banner, .portal-stat { animation: portalFadeIn .18s ease-out both; }
@keyframes portalFadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes portalFadeIn { from { opacity: 0; } to { opacity: 1; } }
.portal-drawer-trigger {
  position: fixed;
  right: 0;
  top: 132px;
  z-index: 80;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  border-radius: 12px 0 0 12px;
  border: 1px solid rgba(37,99,235,.22);
  background: #ffffff;
  color: var(--brand-strong);
  box-shadow: var(--shadow-soft);
  padding: 14px 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
.portal-drawer {
  position: fixed;
  top: 110px;
  right: 0;
  width: min(440px, calc(100vw - 32px));
  max-height: calc(100vh - 132px);
  transform: translateX(104%);
  transition: transform .22s ease-out;
  z-index: 90;
  background: var(--surface);
  border: 1px solid var(--border);
  border-right: 0;
  border-radius: 20px 0 0 20px;
  box-shadow: 0 24px 70px rgba(15,23,42,.24);
  overflow: hidden;
}
.portal-drawer.is-open { transform: translateX(0); }
.portal-drawer__header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:18px 20px; background:linear-gradient(180deg,#f8fbff 0%,#eef4ff 100%); border-bottom:1px solid var(--border); }
.portal-drawer__header h2 { margin:0; font-size:20px; }
.portal-drawer__header p { margin:6px 0 0; color:var(--text-muted); }
.portal-drawer__body { padding:20px; overflow:auto; max-height:calc(100vh - 220px); }
.portal-drawer__body .portal-form-grid { grid-template-columns:1fr; }
.portal-admin-tabs { display:flex; flex-wrap:wrap; gap:10px; }
.portal-admin-tab.is-active { background:var(--brand); color:#fff; border-color:var(--brand); }
.portal-admin-panel[hidden] { display:none !important; }
.portal-admin-panel.is-active { animation: portalFadeUp .2s ease-out both; }
.portal-modal[hidden] { display:none !important; }
.portal-modal { position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:24px; }
.portal-modal__backdrop { position:absolute; inset:0; background:rgba(15,23,42,.55); }
.portal-modal__dialog { position:relative; width:min(620px,100%); background:#fff; border-radius:24px; box-shadow:0 30px 90px rgba(15,23,42,.32); border:1px solid var(--border); overflow:hidden; }
.portal-modal__header { display:flex; justify-content:space-between; gap:16px; padding:22px 24px; border-bottom:1px solid var(--border); background:linear-gradient(180deg,#f8fbff 0%,#fff 100%); }
.portal-modal__header h2 { margin:0; }
.portal-modal__body { padding:24px; color:var(--text-muted); line-height:1.65; }
.portal-modal-open { overflow:hidden; }
@media (prefers-reduced-motion: reduce) { .portal-page > *, .portal-card__body, .portal-banner, .portal-stat, .portal-admin-panel.is-active { animation:none; } .portal-drawer { transition:none; } }
@media (max-width: 720px) { .portal-drawer-trigger { top:auto; bottom:88px; } .portal-drawer { top:80px; max-height:calc(100vh - 96px); } }

/* Drawer safety: keep help/filter drawers collapsed until local JS opens them. */
.portal-drawer[hidden] { display: none !important; }


/* Revision 4: reliable right-side drawers and admin one-panel switching. */
.portal-drawer-toggle-input { position: fixed; right: -9999px; top: -9999px; opacity: 0; }
.portal-drawer-trigger {
  position: fixed !important;
  right: 0 !important;
  top: 148px !important;
  z-index: 10050 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 40px !important;
  min-height: 96px !important;
  width: auto !important;
  height: auto !important;
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
  border-radius: 14px 0 0 14px !important;
  border: 1px solid rgba(37,99,235,.36) !important;
  background: linear-gradient(180deg, #ffffff 0%, #eff6ff 100%) !important;
  color: var(--brand-strong) !important;
  box-shadow: 0 18px 45px rgba(15,23,42,.18) !important;
  padding: 14px 10px !important;
  font-weight: 900 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  line-height: 1 !important;
}
.portal-drawer-trigger:hover { background: #dbeafe !important; color:#1e40af !important; }
.portal-drawer {
  position: fixed !important;
  top: 104px !important;
  right: 0 !important;
  width: min(460px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 128px) !important;
  transform: translateX(104%) !important;
  transition: transform .22s ease-out, opacity .18s ease-out !important;
  z-index: 10040 !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-right: 0 !important;
  border-radius: 20px 0 0 20px !important;
  box-shadow: 0 24px 70px rgba(15,23,42,.26) !important;
  overflow: hidden !important;
  display: block !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.portal-drawer-toggle-input:checked + .portal-drawer-trigger + .portal-drawer,
.portal-drawer.is-open {
  transform: translateX(0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.portal-drawer-toggle-input:checked + .portal-drawer-trigger { background: var(--brand) !important; color:#fff !important; }
.portal-drawer__close { cursor: pointer; }
.portal-admin-tabs { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.portal-admin-panel { display:none; }
.portal-admin-panel.is-active { display:block; animation: portalFadeUp .2s ease-out both; }
.portal-admin-panel[hidden] { display:none !important; }
