:root {
  color-scheme: light;
  --sidebar-width: 236px;
  --bg: #f5f7f9;
  --surface: #ffffff;
  --surface-muted: #eef2f5;
  --border: #d9e1e8;
  --text: #17212b;
  --muted: #647283;
  --link: #075ca8;
  --pass: #0f7b4f;
  --pass-bg: #e8f5ee;
  --fail: #b42318;
  --fail-bg: #fdecec;
  --warn: #8a5b00;
  --warn-bg: #fff4d7;
  --unknown: #556070;
  --unknown-bg: #eef2f5;
  --disclosure-control-size: 22px;
  --disclosure-summary-indent: 42px;
  --checkbox-size: 14px;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.45 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.auth-page {
  min-height: 100vh;
}
body.sidebar-collapsed {
  --sidebar-width: 72px;
}
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
input[type="checkbox"] {
  accent-color: var(--link);
  height: var(--checkbox-size);
  margin: 0;
  vertical-align: middle;
  width: var(--checkbox-size);
}
.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
}
.sidebar {
  background: var(--surface);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: sticky;
  top: 0;
  z-index: 3;
}
.sidebar-head {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  min-height: 60px;
  padding: 14px 12px 10px 16px;
}
.brand {
  font-size: 16px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-toggle {
  align-items: center;
  background: #ffffff;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 20px;
  font-weight: 700;
  height: 32px;
  justify-content: center;
  line-height: 1;
  min-width: 32px;
}
.nav {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 4px;
  padding: 8px;
}
.nav a {
  align-items: center;
  border-radius: 6px;
  color: var(--text);
  display: flex;
  gap: 10px;
  font-weight: 600;
  min-height: 36px;
  overflow: hidden;
  padding: 8px 10px;
  white-space: nowrap;
}
.nav span.is-disabled {
  align-items: center;
  border-radius: 6px;
  color: var(--muted);
  cursor: not-allowed;
  display: flex;
  gap: 10px;
  font-weight: 600;
  min-height: 36px;
  opacity: 0.6;
  overflow: hidden;
  padding: 8px 10px;
  white-space: nowrap;
}
.nav-icon {
  flex: 0 0 auto;
  fill: none;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 18px;
}
.nav a.active {
  background: var(--surface-muted);
  font-weight: 650;
}
.nav .is-disabled.active {
  background: var(--surface-muted);
}
.sidebar-footer {
  border-top: 1px solid var(--border);
  padding: 10px 8px;
}
.cache-refresh-button {
  gap: 8px;
  justify-content: center;
  width: 100%;
}
body.sidebar-collapsed .brand,
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .cache-label {
  opacity: 0;
  pointer-events: none;
  width: 0;
}
body.sidebar-collapsed .sidebar-head {
  justify-content: center;
  padding-left: 8px;
  padding-right: 8px;
}
body.sidebar-collapsed .sidebar-toggle {
  transform: rotate(180deg);
}
body.sidebar-collapsed .nav a {
  justify-content: center;
  padding-left: 8px;
  padding-right: 8px;
}
main {
  padding: 20px 18px 32px;
  width: 100%;
}
.codex-local-auth-banner {
  background: #fff4d7;
  border: 1px solid #e3b341;
  border-radius: 8px;
  color: #6f4700;
  font-weight: 750;
  margin: 0 0 16px;
  padding: 10px 12px;
}
.auth-main {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 100vh;
  padding: 24px;
  width: 100%;
}
.page-head {
  align-items: end;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 14px;
}
.breadcrumbs {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
.breadcrumbs a {
  color: var(--link);
}
.breadcrumbs .current {
  color: var(--text);
  font-weight: 650;
}
.breadcrumbs .separator {
  color: var(--muted);
}
.page-head-actions {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-left: auto;
}
.dashboard-page-head {
  justify-content: flex-end;
  margin-bottom: 12px;
  min-height: 0;
}
.refresh-panel {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-left: auto;
  text-align: right;
}
.refresh-meta {
  color: var(--text);
  font-size: 13px;
  line-height: 1.35;
}
.refresh-state {
  margin-top: 4px;
}
.refresh-state.active {
  color: var(--warn);
  font-weight: 650;
}
h1 {
  font-size: 24px;
  line-height: 1.2;
  margin: 0;
}
h2 {
  font-size: 18px;
  line-height: 1.25;
  margin: 22px 0 10px;
}
.muted { color: var(--muted); }
.panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
.ec2-spike-widget {
  margin-bottom: 10px;
}
.section-note {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  color: var(--muted);
  padding: 10px 12px;
}
.openai-import-status {
  margin-bottom: 12px;
  overflow: hidden;
}
.openai-import-status .section-note {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
}
.openai-import-status-message {
  color: var(--text);
  font-size: 13px;
  line-height: 1.45;
  padding: 10px 12px 12px;
}
.email-field-state {
  margin-left: 6px;
  vertical-align: middle;
}
table {
  border-collapse: collapse;
  width: 100%;
}
th, td {
  border-bottom: 1px solid var(--border);
  padding: 10px 12px;
  text-align: left;
  vertical-align: middle;
}
th {
  background: #f9fbfc;
  color: #425164;
  font-size: 12px;
  letter-spacing: 0;
  text-transform: uppercase;
}
tr:last-child td { border-bottom: 0; }
.number { font-variant-numeric: tabular-nums; text-align: right; }
.fail-value { color: var(--fail); font-weight: 750; }
.warn-value { color: var(--warn); font-weight: 750; }
.pass-value { color: var(--pass); font-weight: 750; }
.actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-left: auto;
}
.provider-tabs-sticky {
  background: var(--bg);
  margin: 2px 0 14px;
  padding: 1px 0 8px;
  position: sticky;
  top: 0;
  z-index: 2;
}
.provider-tabs-sticky .filter-form {
  border-radius: 0 0 8px 8px;
  border-top: 0;
  margin-bottom: 0;
}
.provider-tabs-sticky .filter-form form,
.provider-tabs-sticky form.filter-form {
  margin: 0;
}
.tabs {
  border-bottom: 1px solid var(--border);
  display: flex;
  gap: 4px;
}
.tab-button {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 700;
  gap: 6px;
  padding: 8px 12px 7px;
  position: relative;
}
.tab-button.active {
  border-bottom-color: #075ca8;
  color: var(--text);
}
.help-icon {
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  display: inline-flex;
  font-size: 11px;
  height: 17px;
  justify-content: center;
  line-height: 1;
  position: relative;
  width: 17px;
}
.help-icon:hover::after,
.tab-button:focus .help-icon::after {
  background: #17212b;
  border-radius: 6px;
  bottom: -8px;
  color: #ffffff;
  content: attr(data-tooltip);
  font-size: 12px;
  font-weight: 500;
  left: 50%;
  line-height: 1.35;
  max-width: min(360px, calc(100vw - 48px));
  padding: 8px 10px;
  position: absolute;
  text-align: left;
  text-transform: none;
  transform: translate(-50%, 100%);
  white-space: normal;
  width: max-content;
  z-index: 5;
}
.button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 650;
  min-height: 30px;
  padding: 5px 9px;
  text-decoration: none;
}
.button.primary {
  background: #075ca8;
  border-color: #075ca8;
  color: #ffffff;
}
.button.flowcx-link {
  background: #075ca8;
  border-color: #075ca8;
  color: #ffffff;
}
.button:hover { text-decoration: none; }
.button:disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.7;
}
.button.is-running,
.button.is-running:disabled {
  background: #d9ecff;
  border-color: #93c5fd;
  color: #075ca8;
  opacity: 1;
}
.button.is-complete,
.button.is-complete:disabled {
  background: #e7f7ed;
  border-color: #7cc69a;
  color: #0f7b4f;
  opacity: 1;
}
.button.is-error,
.button.is-error:disabled {
  background: #fde8e8;
  border-color: #f4a5a5;
  color: #b42318;
  opacity: 1;
}
.scenario-builder {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(360px, 1.1fr) minmax(360px, 0.9fr);
  padding: 14px;
}
.scenario-builder-panel {
  border: 1px solid var(--border);
  border-radius: 10px;
  min-width: 0;
  overflow: hidden;
}
.scenario-builder-panel-head {
  align-items: flex-start;
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px 14px;
}
.scenario-builder-panel-head h3 {
  font-size: 15px;
  margin: 0 0 4px;
}
.scenario-builder-toolbar {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.scenario-builder-search {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
}
.scenario-builder-search input {
  width: 100%;
}
.scenario-builder-list,
.scenario-builder-library {
  display: grid;
  gap: 10px;
  max-height: 680px;
  overflow: auto;
  padding: 12px;
}
.scenario-builder-list.is-drop-at-end::after {
  background: #075ca8;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(7, 92, 168, 0.14);
  content: "";
  display: block;
  height: 4px;
}
.scenario-builder-empty {
  align-items: center;
  background: #f7fafc;
  border: 1px dashed #9fb2c5;
  border-radius: 10px;
  color: var(--muted);
  display: flex;
  justify-content: center;
  min-height: 180px;
  padding: 18px;
  text-align: center;
}
.scenario-builder-empty.is-drop-target {
  background: #edf6ff;
  border-color: #075ca8;
  color: #075ca8;
}
.scenario-builder-selected-row,
.scenario-builder-library-row {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d7e2ec;
  border-radius: 9px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px;
}
.scenario-builder-selected-row {
  position: relative;
}
.scenario-builder-selected-row.is-drop-before::before,
.scenario-builder-selected-row.is-drop-after::after {
  background: #075ca8;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(7, 92, 168, 0.14);
  content: "";
  height: 4px;
  left: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  z-index: 1;
}
.scenario-builder-selected-row.is-drop-before::before {
  top: -8px;
}
.scenario-builder-selected-row.is-drop-after::after {
  bottom: -8px;
}
.scenario-builder-selected-row {
  grid-template-columns: auto 34px minmax(0, 1fr) minmax(150px, 220px) auto;
}
.scenario-builder-library-row {
  grid-template-columns: auto minmax(0, 1fr) minmax(140px, 190px) auto;
}
.scenario-builder-selected-row:hover,
.scenario-builder-library-row:hover {
  border-color: #9fb2c5;
  box-shadow: 0 1px 6px rgba(23, 33, 43, 0.08);
}
.scenario-builder-select {
  display: inline-flex;
}
.scenario-builder-order {
  align-items: center;
  background: #eef4fb;
  border-radius: 999px;
  color: #075ca8;
  display: inline-flex;
  font-weight: 800;
  height: 30px;
  justify-content: center;
  width: 30px;
}
.scenario-builder-case-main {
  min-width: 0;
}
.scenario-builder-case-main strong,
.scenario-builder-case-main .muted {
  display: block;
  overflow-wrap: anywhere;
}
.scenario-builder-version {
  color: var(--muted);
  display: grid;
  font-size: 12px;
  gap: 5px;
}
.scenario-builder-version select {
  width: 100%;
}
.scenario-builder-grab,
.scenario-builder-library-copy {
  align-items: center;
  border: 1px solid #c6d3df;
  border-radius: 6px;
  color: #556070;
  cursor: grab;
  display: inline-flex;
  font-weight: 900;
  justify-content: center;
  letter-spacing: -2px;
  min-height: 30px;
  min-width: 30px;
}
.scenario-builder-grab:active,
.scenario-builder-library-copy:active {
  cursor: grabbing;
}
.scenario-builder-library .collapsible {
  border: 1px solid #d7e2ec;
  border-radius: 9px;
  overflow: hidden;
}
.scenario-builder-library .details-body {
  display: grid;
  gap: 10px;
}
.scenario-builder-library-folder > summary {
  gap: 10px;
}
.scenario-builder-library-folder > summary .button {
  margin-left: auto;
}
.scenario-builder-library-folderless {
  display: grid;
  gap: 10px;
}
.internal-qa-cycle-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr;
}
.internal-qa-customer-groups {
  display: grid;
  gap: 18px;
}
.internal-qa-customer-group {
  background: linear-gradient(180deg, #ffffff, #fbfcfe);
  border: 1px solid #d7e2ec;
  border-radius: 12px;
  padding: 18px;
}
.internal-qa-customer-group-head {
  align-items: end;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  margin-bottom: 14px;
}
.internal-qa-customer-group-head h3 {
  margin: 4px 0 0;
}
.internal-qa-customer-group-kicker {
  color: #5f7188;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.internal-qa-cycle-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 16px;
}
.internal-qa-cycle-card h3 {
  margin: 4px 0;
}
.internal-qa-cycle-card-head {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.internal-qa-cycle-customer {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.internal-qa-cycle-customer.hero {
  color: #075ca8;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.15;
  margin-bottom: 8px;
}
.internal-qa-progress {
  background: #e7ebf2;
  border-radius: 999px;
  height: 10px;
  overflow: hidden;
}
.internal-qa-progress.wide {
  margin-bottom: 18px;
}
.internal-qa-progress-bar {
  background: linear-gradient(90deg, #0f7b4f, #075ca8);
  height: 100%;
}
.internal-qa-cycle-banner {
  align-items: end;
  background:
    linear-gradient(135deg, rgba(7, 92, 168, 0.08), rgba(15, 123, 79, 0.12)),
    #fbfcff;
  border: 1px solid #d9e4ef;
  border-radius: 10px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 16px;
  padding: 18px 20px;
}
.internal-qa-cycle-banner h2 {
  margin: 4px 0 6px;
}
.internal-qa-cycle-banner-kicker {
  color: #075ca8;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.internal-qa-cycle-meta {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 10px 14px;
}
.internal-qa-section {
  border: 1px solid #d7e2ec;
  border-radius: 10px;
  margin: 14px 0;
  overflow: hidden;
}
.internal-qa-section summary {
  background: linear-gradient(180deg, #f8fbfe, #eef4fb);
  border-bottom: 1px solid #d7e2ec;
  min-height: 52px;
  padding: 14px 16px 14px var(--disclosure-summary-indent);
}
.internal-qa-section-summary {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  width: 100%;
}
.internal-qa-section-title-wrap {
  display: grid;
  gap: 4px;
}
.internal-qa-section-kicker {
  color: #5f7188;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.internal-qa-section-title {
  color: #172033;
  font-size: 16px;
  font-weight: 800;
}
.internal-qa-section-summary-meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.internal-qa-section-toggle {
  align-items: center;
  color: #425164;
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  gap: 6px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.internal-qa-section-toggle input[type="checkbox"] {
  accent-color: #0f7b4f;
  height: 16px;
  margin: 0;
  width: 16px;
}
.internal-qa-section-percent {
  color: #425164;
  font-size: 13px;
  font-weight: 700;
}
.internal-qa-section-body {
  background: linear-gradient(180deg, #ffffff, #fbfcfe);
  display: grid;
  gap: 10px;
}
.internal-qa-task-form {
  background: #ffffff;
  border: 1px solid #e5ebf3;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(18, 30, 55, 0.04);
  gap: 0;
  padding: 0;
}
.internal-qa-task-row {
  align-items: start;
  cursor: pointer;
  display: grid;
  gap: 12px;
  grid-template-columns: auto 1fr;
  padding: 12px 14px;
}
.internal-qa-task-row input[type="checkbox"] {
  accent-color: #0f7b4f;
  height: 18px;
  margin-top: 2px;
  width: 18px;
}
.internal-qa-task-row.is-checked {
  background: linear-gradient(180deg, #f3fbf6, #eef8f2);
}
.internal-qa-task-body {
  display: grid;
  gap: 8px;
}
.internal-qa-task-head {
  align-items: start;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}
.internal-qa-task-label {
  color: #172033;
  font-weight: 600;
}
.internal-qa-task-meta,
.internal-qa-history-list {
  font-size: 12px;
}
.internal-qa-task-meta.primary {
  color: #314257;
  font-weight: 600;
}
.internal-qa-task-meta.secondary,
.internal-qa-history-list {
  color: var(--muted);
}
.internal-qa-task-last-change {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
}
.internal-qa-task-history summary {
  background: transparent;
  border: 0;
  color: #075ca8;
  font-size: 12px;
  font-weight: 600;
  min-height: 30px;
  padding: 0 0 0 calc(var(--disclosure-summary-indent) - 2px);
}
.internal-qa-history-list {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}
.internal-qa-history-item {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
@media (max-width: 860px) {
  .internal-qa-customer-group-head,
  .internal-qa-cycle-banner,
  .internal-qa-task-head,
  .internal-qa-section-summary {
    align-items: start;
    flex-direction: column;
  }
}
.split-refresh-control {
  display: inline-flex;
}
.split-refresh-control .button {
  border-radius: 0;
}
.split-refresh-control .button:first-child {
  border-radius: 6px 0 0 6px;
}
.split-refresh-control .button + .button {
  margin-left: -1px;
}
.split-refresh-control .button:last-child {
  border-radius: 0 6px 6px 0;
}
.refresh-countdown-button {
  font-variant-numeric: tabular-nums;
  justify-content: center;
  min-width: 52px;
}
.pause-button.paused {
  background: #8a5b00;
  border-color: #8a5b00;
  color: #ffffff;
}
.table-sort-button {
  align-items: center;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: inherit;
  gap: 5px;
  letter-spacing: inherit;
  padding: 0;
  text-align: inherit;
  text-transform: inherit;
}
.table-sort-button::after {
  color: var(--muted);
  content: "-";
  font-size: 11px;
}
.table-sort-button[data-sort-direction="asc"]::after { content: "^"; }
.table-sort-button[data-sort-direction="desc"]::after { content: "v"; }
.compact-button {
  min-height: 30px;
  padding: 5px 8px;
  white-space: nowrap;
}
.badge {
  border-radius: 999px;
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  min-width: 66px;
  padding: 4px 9px;
  text-align: center;
  text-transform: uppercase;
}
.badge.pass { background: var(--pass-bg); color: var(--pass); }
.badge.fail { background: var(--fail-bg); color: var(--fail); }
.badge.warn { background: var(--warn-bg); color: var(--warn); }
.badge.unknown { background: var(--unknown-bg); color: var(--unknown); }
.badge.disabled {
  background: #e1e6eb;
  color: #5f6d7a;
}
.schedule-state-icon-badge {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  border-radius: 999px;
  height: 24px;
  min-width: 24px;
  padding: 0;
  width: 24px;
}
.schedule-state-icon {
  display: inline-flex;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}
.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}
.compatibility-status {
  min-width: 84px;
}
.compatibility-placeholder-panel {
  margin-top: 16px;
}
.schedule-state {
  border: 1px solid currentColor;
  min-width: 86px;
}
.schedule-state.schedule-state-icon-badge {
  min-width: 24px;
  width: 24px;
  height: 24px;
  padding: 0;
}
.lens-state-row,
.lens-header-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.lens-state-row {
  margin-top: 4px;
}
.lens-name-cell {
  display: grid;
  gap: 4px;
}
.environment-identity,
.environment-summary-label {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  min-width: 0;
}
.environment-name {
  overflow-wrap: anywhere;
}
.schedule-counts {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.schedule-snapshot-hint {
  align-items: center;
  background: #eef4fb;
  border: 1px solid #b8d0e8;
  border-radius: 999px;
  color: #075ca8;
  cursor: help;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  height: 20px;
  justify-content: center;
  min-width: 20px;
}
.schedule-snapshot-hint.is-disabled {
  background: #e7ebef;
  border-color: #c7d0d8;
  color: var(--muted);
}
.schedule-count-badge {
  min-width: 0;
  white-space: nowrap;
}
.schedule-counts.is-disabled .badge {
  background: var(--surface-muted);
  color: var(--muted);
  border-color: var(--border);
}
.infrastructure-row.is-disabled td {
  background: #e1e6eb;
  color: var(--muted);
}
.infrastructure-row.is-disabled .badge {
  background: #d6dde4;
  border-color: #c1cad3;
  color: var(--muted);
}
.lens-run-summary {
  display: flex;
  justify-content: flex-start;
  min-width: 0;
}
.lens-run-summary.is-disabled {
  color: var(--muted);
}
.lens-run-summary.is-disabled .badge,
.lens-run-summary.is-disabled .schedule-cycle-dots {
  opacity: 0.55;
}
.schedule-cycle-dots {
  align-items: center;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 3px;
  min-height: 26px;
  white-space: nowrap;
}
.schedule-cycle-dot {
  align-items: stretch;
  background: #f5f8fb;
  border: 2px solid #8fa2b4;
  border-radius: 0;
  box-shadow: inset 0 0 0 1px rgba(23, 33, 43, 0.08);
  cursor: help;
  display: grid;
  gap: 1px;
  grid-template-rows: 1fr 1fr;
  height: 24px;
  overflow: hidden;
  width: 24px;
}
.schedule-cycle-dot-pass,
.schedule-cycle-dot-fail {
  display: block;
  min-width: 0;
}
.schedule-cycle-dot-pass {
  background: var(--pass);
}
.schedule-cycle-dot-fail {
  background: var(--fail);
}
.schedule-cycle-dot.pass {
  border-color: rgba(15, 123, 79, 0.6);
}
.schedule-cycle-dot.fail {
  border-color: rgba(180, 35, 24, 0.85);
}
.schedule-cycle-dot.unknown {
  background: var(--unknown-bg);
  border-color: #879cb0;
}
.schedule-cycle-dot.unknown .schedule-cycle-dot-pass,
.schedule-cycle-dot.unknown .schedule-cycle-dot-fail {
  background: transparent;
}
.metric-badges {
  align-items: flex-start;
  display: flex;
  font-size: 18px;
}
details.collapsible {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 12px;
  overflow: hidden;
}
details.collapsible.customer-themed {
  background: rgba(var(--customer-accent-rgb), 0.08);
  border-color: rgba(var(--customer-accent-rgb), 0.28);
  box-shadow: inset 4px 0 0 rgba(var(--customer-accent-rgb), 0.72);
}
details.collapsible.customer-themed > summary {
  background: rgba(var(--customer-accent-rgb), 0.14);
}
details.collapsible.customer-themed > summary:hover {
  background: rgba(var(--customer-accent-rgb), 0.18);
}
details.collapsible.customer-themed > .details-body {
  background: rgba(255, 255, 255, 0.72);
}
details.workflow-section > summary,
details.collapsible > summary,
.internal-qa-section > summary,
.lens-row > summary,
.schedule-batch-row > summary,
.stored-schedule-row > summary,
.stored-batch-row > summary,
.qa-test-steps > summary,
.qa-result-collapsible summary,
.internal-qa-task-history summary {
  cursor: pointer;
  list-style: none;
  position: relative;
}
details.workflow-section > summary::-webkit-details-marker,
details.collapsible > summary::-webkit-details-marker,
.internal-qa-section > summary::-webkit-details-marker,
.lens-row > summary::-webkit-details-marker,
.schedule-batch-row > summary::-webkit-details-marker,
.stored-schedule-row > summary::-webkit-details-marker,
.stored-batch-row > summary::-webkit-details-marker,
.qa-test-steps > summary::-webkit-details-marker,
.qa-result-collapsible summary::-webkit-details-marker,
.internal-qa-task-history summary::-webkit-details-marker {
  display: none;
}
details.workflow-section > summary::before,
details.collapsible > summary::before,
.internal-qa-section > summary::before,
.lens-row > summary::before,
.schedule-batch-row > summary::before,
.stored-schedule-row > summary::before,
.stored-batch-row > summary::before,
.qa-test-steps > summary::before,
.qa-result-collapsible summary::before,
.internal-qa-task-history summary::before {
  background: #ffffff;
  border: 1px solid #b8c6d2;
  border-radius: 999px;
  content: "";
  height: var(--disclosure-control-size);
  left: 12px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: var(--disclosure-control-size);
}
details.workflow-section > summary::after,
details.collapsible > summary::after,
.internal-qa-section > summary::after,
.lens-row > summary::after,
.schedule-batch-row > summary::after,
.stored-schedule-row > summary::after,
.stored-batch-row > summary::after,
.qa-test-steps > summary::after,
.qa-result-collapsible summary::after,
.internal-qa-task-history summary::after {
  border-bottom: 2px solid var(--muted);
  border-right: 2px solid var(--muted);
  content: "";
  height: 7px;
  left: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
  transition: transform 120ms ease;
  width: 7px;
}
details.workflow-section[open] > summary::after,
details.collapsible[open] > summary::after,
.internal-qa-section[open] > summary::after,
.lens-row[open] > summary::after,
.schedule-batch-row[open] > summary::after,
.stored-schedule-row[open] > summary::after,
.stored-batch-row[open] > summary::after,
.qa-test-steps[open] > summary::after,
.qa-result-collapsible[open] summary::after,
.internal-qa-task-history[open] summary::after {
  transform: translateY(-62%) rotate(45deg);
}
details.workflow-section > summary:hover::before,
details.collapsible > summary:hover::before,
.internal-qa-section > summary:hover::before,
.lens-row > summary:hover::before,
.schedule-batch-row > summary:hover::before,
.stored-schedule-row > summary:hover::before,
.stored-batch-row > summary:hover::before,
.qa-test-steps > summary:hover::before,
.qa-result-collapsible summary:hover::before,
.internal-qa-task-history summary:hover::before,
details.workflow-section > summary:focus-visible::before,
details.collapsible > summary:focus-visible::before,
.internal-qa-section > summary:focus-visible::before,
.lens-row > summary:focus-visible::before,
.schedule-batch-row > summary:focus-visible::before,
.stored-schedule-row > summary:focus-visible::before,
.stored-batch-row > summary:focus-visible::before,
.qa-test-steps > summary:focus-visible::before,
.qa-result-collapsible summary:focus-visible::before,
.internal-qa-task-history summary:focus-visible::before {
  border-color: #7da8cb;
  box-shadow: 0 0 0 3px rgba(7, 92, 168, 0.12);
}
details.workflow-section:not([open]) > .details-body {
  display: none;
}
details.workflow-section > summary {
  align-items: center;
  display: flex;
  font-weight: 750;
  gap: 10px;
  justify-content: space-between;
  min-height: 42px;
  padding: 11px 12px 11px var(--disclosure-summary-indent);
}
details.collapsible > summary {
  align-items: center;
  display: flex;
  font-weight: 750;
  gap: 10px;
  justify-content: space-between;
  min-height: 42px;
  padding: 11px 12px 11px var(--disclosure-summary-indent);
}
details.collapsible > summary label,
details.collapsible > summary .scenario-builder-group-toggle,
details.collapsible > summary .scenario-builder-folder-toggle {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  min-width: 0;
}
details.collapsible > summary label input[type="checkbox"] {
  flex: 0 0 auto;
}
details.collapsible > summary:hover {
  background: #f9fbfc;
}
details.collapsible.is-disabled > summary,
.lens-row.is-disabled > summary {
  background: #e7ebef;
  color: var(--muted);
}
.scenario-case-row {
  align-items: flex-start;
  display: flex;
  gap: 10px;
  padding: 8px 0;
}
.scenario-case-row > span {
  display: grid;
  gap: 2px;
}
.scenario-assignment-order-list {
  display: grid;
  gap: 10px;
}
.scenario-assignment-order-row {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 8px 0;
}
.report-environment-card-list {
  display: grid;
  gap: 14px;
}
.report-environment-card-head {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 12px;
}
.report-environment-card-sections {
  display: grid;
  gap: 14px;
}
.report-environment-card-section {
  margin: 0;
}
.report-environment-card-section > h3 {
  margin-top: 0;
}
details.collapsible.is-disabled > summary:hover,
.lens-row.is-disabled > summary:hover {
  background: #e1e6eb;
}
details.collapsible.is-disabled > summary .badge,
.lens-row.is-disabled > summary .badge {
  background: #dbe2e8;
  border-color: var(--border);
  color: var(--muted);
}
details.collapsible.is-disabled > summary .button,
.lens-row.is-disabled > summary .button {
  background: #e9edf1;
  border-color: #c7d0d8;
  color: var(--muted);
}
details.collapsible.is-disabled > summary .environment-type-placeholder,
.lens-row.is-disabled > summary .environment-type-placeholder {
  background: #e1e6eb;
  border-color: #c7d0d8;
  color: var(--muted);
}
details.collapsible.is-disabled > summary .lens-name-cell strong,
.lens-row.is-disabled > summary .lens-name-cell strong {
  color: var(--muted);
}
.customer-color-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin: 0;
}
.customer-control-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  margin-bottom: 12px;
}
.customer-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.customer-summary-actions {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  margin-left: auto;
}
.customer-summary-pill {
  cursor: pointer;
}
.customer-color-form {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin: 0;
}
.customer-inline-panel {
  margin: 12px 0;
}
.customer-breakdown-source {
  display: none;
}
.card-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
.card-panel-header {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  color: #425164;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  padding: 10px 12px;
  text-transform: uppercase;
}
.card-panel .section-note {
  background: #f9fbfc;
}
.card-panel .form-grid {
  padding-top: 0;
}
.customer-color-dialog {
  border: 0;
  border-radius: 10px;
  max-width: min(92vw, 420px);
  padding: 0;
  width: 100%;
}
.customer-color-dialog::backdrop {
  background: rgba(23, 33, 43, 0.5);
}
.customer-color-dialog-surface {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 18px;
}
.customer-color-dialog-surface h3 {
  margin: 0 0 14px;
}
.customer-color-palette {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  margin: 4px 0 18px;
}
.customer-color-swatch {
  appearance: none;
  background: var(--swatch-color);
  border: 2px solid rgba(23, 33, 43, 0.12);
  border-radius: 8px;
  cursor: pointer;
  display: block;
  min-height: 38px;
  padding: 0;
  position: relative;
  width: 100%;
}
.customer-color-swatch:hover {
  transform: translateY(-1px);
}
.customer-color-swatch[data-customer-color-selected="true"] {
  border-color: #17212b;
  box-shadow: 0 0 0 3px rgba(23, 33, 43, 0.14);
}
.customer-color-swatch[data-customer-color-selected="true"]::after {
  color: #ffffff;
  content: "✓";
  font-size: 16px;
  font-weight: 800;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}
.customer-color-swatch:focus-visible {
  outline: 2px solid #075ca8;
  outline-offset: 2px;
}
.customer-breakdown-dialog {
  border: 0;
  border-radius: 10px;
  max-width: min(94vw, 760px);
  padding: 0;
  width: 100%;
}
.customer-breakdown-dialog::backdrop {
  background: rgba(23, 33, 43, 0.5);
}
.customer-breakdown-dialog-surface {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.customer-breakdown-dialog-head {
  align-items: center;
  border-bottom: 1px solid var(--border);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 16px 18px;
}
.customer-breakdown-dialog-head h3 {
  margin: 0;
}
.customer-breakdown-dialog-content {
  max-height: min(70vh, 640px);
  overflow: auto;
}
.customer-breakdown-dialog-content .empty {
  margin: 16px;
}
.customer-group-list {
  display: grid;
  gap: 0;
}
.customer-drag-handle {
  align-items: center;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(23, 33, 43, 0.14);
  border-radius: 8px;
  color: #556070;
  cursor: grab;
  display: inline-flex;
  font-size: 18px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
  min-height: 30px;
  min-width: 30px;
  padding: 0 6px;
  user-select: none;
  white-space: nowrap;
}
.customer-drag-handle:hover {
  background: #ffffff;
  border-color: rgba(23, 33, 43, 0.24);
}
.customer-drag-handle:active {
  cursor: grabbing;
}
details[data-customer-group] > summary {
  transition: background 120ms ease, box-shadow 120ms ease;
}
details[data-customer-group].is-dragging {
  opacity: 0.62;
}
details[data-customer-group].is-drag-over > summary {
  box-shadow: inset 0 -3px 0 #075ca8;
}
.collapsible-summary-meta {
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
  margin-left: auto;
}
.dashboard-customer-summary-actions .collapsible-summary-meta {
  margin-left: 0;
}
.dashboard-hidden-summary-pill {
  background: #eaf1f7;
  border: 1px solid #bdd0df;
  border-radius: 999px;
  color: #34516b;
  padding: 4px 9px;
}
.dashboard-customer-summary-actions {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.customer-environment-kpis {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-end;
}
.customer-environment-kpi {
  align-items: center;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(23, 33, 43, 0.08);
  border-radius: 999px;
  display: inline-flex;
  gap: 6px;
  min-height: 22px;
  padding: 1px 6px 1px 7px;
}
.customer-environment-kpi.is-disabled {
  opacity: 0.72;
}
.customer-environment-kpi-name {
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}
.customer-environment-kpi .environment-type-badge,
.customer-environment-kpi .environment-type-icon,
.customer-environment-kpi .environment-type-placeholder {
  height: 18px;
  min-width: 18px;
  width: 18px;
}
.customer-environment-kpi .environment-type-placeholder {
  border-radius: 999px;
  font-size: 9px;
  padding: 0 3px;
}
.dashboard-customer-order-controls {
  display: inline-flex;
  gap: 6px;
}
.dashboard-order-form {
  gap: 0;
  display: inline-flex;
  padding: 0;
}
.dashboard-order-form .button {
  min-height: 30px;
  padding: 5px 8px;
}
.details-body {
  border-top: 1px solid var(--border);
  padding: 12px;
}
.recent-runs-search {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  display: grid;
  gap: 10px;
  padding: 12px 14px;
}
.recent-runs-search label {
  max-width: 440px;
}
.recent-runs-results {
  padding-top: 12px;
}
.grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}
.metric {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
}
.metric-label {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}
.metric-value {
  font-size: 28px;
  font-weight: 750;
  line-height: 1.1;
  margin-top: 6px;
}
.metric-text {
  font-size: 18px;
  overflow-wrap: anywhere;
}
.filter-form {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 18px;
}
.chart-panel {
  padding: 14px;
}
.workspace-chart-panel {
  margin-top: 14px;
}
.workspace-chart-panel h3 {
  font-size: 15px;
  margin: 0 0 12px;
}
.leaderboard-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.axis-chart {
  display: grid;
  gap: 6px 10px;
  grid-template-columns: 22px 58px minmax(0, 1fr);
  grid-template-rows: 220px auto auto;
}
.y-axis-label {
  align-self: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  grid-row: 1;
  transform: rotate(-90deg);
  white-space: nowrap;
}
.y-axis-markers {
  color: var(--muted);
  display: flex;
  flex-direction: column;
  font-size: 12px;
  grid-column: 2;
  grid-row: 1;
  justify-content: space-between;
  text-align: right;
}
.usage-chart {
  background: #f8fafc;
  border: 1px solid var(--border);
  border-radius: 6px;
  display: block;
  grid-column: 3;
  grid-row: 1;
  height: 220px;
  width: 100%;
}
.chart-grid {
  stroke: #d9e1e8;
  stroke-width: 0.4;
  vector-effect: non-scaling-stroke;
}
.chart-x-tick {
  stroke: #8b9aaa;
  stroke-width: 0.5;
  vector-effect: non-scaling-stroke;
}
.chart-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  vector-effect: non-scaling-stroke;
}
.chart-line.discrete {
  stroke: #075ca8;
}
.chart-line.cumulative {
  stroke: #0f7b4f;
}
.chart-bar {
  fill: rgba(7, 92, 168, 0.78);
}
.chart-bar:hover {
  fill: rgba(7, 92, 168, 0.92);
}
.chart-point {
  cursor: help;
  fill: #ffffff;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}
.chart-point.discrete {
  stroke: #075ca8;
}
.chart-point.cumulative {
  stroke: #0f7b4f;
}
.chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 10px;
}
.x-axis-markers {
  color: var(--muted);
  font-size: 12px;
  grid-column: 3;
  grid-row: 2;
  min-height: 18px;
  position: relative;
}
.x-axis-markers span {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  white-space: nowrap;
}
.x-axis-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  grid-column: 3;
  grid-row: 3;
  text-align: center;
  text-transform: uppercase;
}
.chart-legend span {
  align-items: center;
  color: var(--muted);
  display: inline-flex;
  gap: 6px;
}
.legend-swatch {
  border-radius: 999px;
  display: inline-block;
  height: 10px;
  width: 10px;
}
.legend-swatch.discrete {
  background: #075ca8;
}
.legend-swatch.cumulative {
  background: #0f7b4f;
}
form {
  display: grid;
  gap: 14px;
  padding: 16px;
}
.inline-form {
  display: inline-flex;
  gap: 0;
  padding: 0;
}
.form-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
label {
  display: grid;
  gap: 6px;
  font-weight: 650;
}
input, select, textarea {
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  min-height: 38px;
  padding: 8px 10px;
  width: 100%;
}
textarea {
  resize: vertical;
}
.full-width {
  grid-column: 1 / -1;
}
.checkbox {
  align-items: center;
  display: flex;
  gap: 8px;
}
.checkbox input {
  min-height: auto;
  width: auto;
}
.inline-checkbox {
  align-items: center;
  display: inline-flex;
  font-weight: 600;
  gap: 8px;
}
.inline-checkbox span {
  line-height: 1.3;
}
.monitoring-checkbox-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
}
.notice {
  background: #fff7e6;
  border: 1px solid #eacb83;
  border-radius: 8px;
  color: #5f4300;
  margin-bottom: 16px;
  padding: 12px 14px;
}
.notice.pass {
  background: var(--pass-bg);
  border-color: #91c7aa;
  color: var(--pass);
}
.notice.warn {
  background: var(--warn-bg);
  border-color: #eacb83;
  color: var(--warn);
}
.notice.fail {
  background: var(--fail-bg);
  border-color: #f0a7a0;
  color: var(--fail);
}
.auth-shell {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin: 0 auto;
  max-width: 460px;
  overflow: hidden;
  width: min(100%, 460px);
}
.auth-shell h1 {
  border-bottom: 1px solid var(--border);
  padding: 18px 18px 0;
}
.empty {
  color: var(--muted);
  padding: 18px;
}
.empty.compact {
  padding: 12px 14px;
}
.nowrap { white-space: nowrap; }
.wrap-anywhere { overflow-wrap: anywhere; }
.dashboard-table {
  min-width: 1080px;
}
.dashboard-header,
.dashboard-row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(180px, 0.72fr) minmax(105px, 0.42fr) minmax(590px, 2.25fr) minmax(225px, 0.72fr);
  padding: 7px 10px;
}
.dashboard-row {
  padding-left: 26px;
  position: relative;
}
.dashboard-row .lens-name-cell {
  min-width: 0;
}
.lens-name-cell {
  align-items: center;
  display: flex;
  gap: 6px;
}
.environment-identity {
  gap: 6px;
  min-width: 0;
}
.environment-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lens-state-row {
  flex-wrap: wrap;
}
.sanity-archive-filter-form {
  margin-bottom: 14px;
}
.environment-type-label {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  min-width: 0;
}
.environment-type-text {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  white-space: nowrap;
}
.environment-type-badge {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
}
.environment-type-icon {
  display: block;
  height: 32px;
  object-fit: contain;
  width: 32px;
}
.environment-type-placeholder {
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--muted);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  height: 32px;
  justify-content: center;
  letter-spacing: 0.02em;
  line-height: 1;
  min-width: 32px;
  padding: 0 6px;
}
.environment-type-placeholder.flowcx {
  background: #eef6ff;
  color: #075ca8;
}
.environment-type-placeholder.flowax {
  background: #f5f1ff;
  color: #6c3ea0;
}
.environment-type-placeholder.action-centre {
  background: #eefbf3;
  color: #16774b;
}
.environment-type-placeholder.dashboard-legacy {
  background: #fff4d7;
  color: #8a5b00;
}
.environment-type-placeholder.dashboard-react {
  background: #eaf7fb;
  color: #0e7490;
}
.dashboard-header {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  color: #425164;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}
.dashboard-customer-group > summary {
  padding: 8px 12px;
}
.lens-row {
  border-bottom: 1px solid var(--border);
}
.lens-row:last-child {
  border-bottom: 0;
}
.lens-row summary {
  min-height: 34px;
  padding-left: var(--disclosure-summary-indent);
}
.lens-expanded {
  background: #f8fafc;
  border-top: 1px solid var(--border);
  box-shadow: inset 4px 0 0 #b8c6d2;
  padding: 8px 10px 10px;
}
.dashboard-batch-breakdown {
  margin-top: 2px;
}
.dashboard-batch-breakdown > summary {
  min-height: 30px;
}
.dashboard-batch-breakdown > summary .muted {
  font-size: 11px;
  font-weight: 500;
  margin-left: 4px;
}
.dashboard-batch-breakdown > .details-body {
  padding: 6px 2px 0;
}
.dashboard-customer-group > .details-body {
  padding: 8px 10px 10px;
}
.dashboard-hidden-environments {
  margin-top: 8px;
}
.dashboard-hidden-environments > summary {
  align-items: center;
  background: #e8f1f8;
  border: 1px solid #b8ccdc;
  border-radius: 10px;
  display: flex;
  gap: 8px;
  padding: 6px 10px 6px 30px;
}
.dashboard-hidden-environments > summary:hover {
  background: #deebf5;
}
.dashboard-hidden-environments > .details-body {
  padding: 8px 0 0;
}
.quick-tooltip {
  background: rgba(23, 33, 43, 0.96);
  border-radius: 6px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  left: 0;
  line-height: 1.45;
  max-width: min(420px, calc(100vw - 16px));
  padding: 10px 12px;
  pointer-events: none;
  position: fixed;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.28);
  top: 0;
  width: max-content;
  z-index: 9999;
}
.batch-summary { display: inline-block; }
.batch-summary.with-chart {
  align-items: center;
  display: inline-flex;
  gap: 8px;
}
.batch-mini {
  border-collapse: collapse;
  min-width: 0;
  width: auto;
}
.batch-mini th,
.batch-mini td {
  background: transparent;
  border: 0;
  color: var(--text);
  font-size: 12px;
  line-height: 1.1;
  min-width: 44px;
  padding: 0 10px 2px 0;
  text-align: right;
}
.batch-mini th {
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
}
.batch-mini td {
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
}
.batch-coverage {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.2;
}
.dashboard-actions {
  align-items: center;
  gap: 4px;
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.dashboard-actions .button {
  min-height: 26px;
  padding: 4px 6px;
}
.dashboard-actions .inline-form {
  display: inline-flex;
}
.lens-run-summary {
  min-width: 0;
}
.schedule-cycle-dots-cycles {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 2px;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 2px;
  scrollbar-width: thin;
}
.schedule-cycle-dots-cycles::-webkit-scrollbar {
  height: 6px;
}
.schedule-cycle-dots-cycles::-webkit-scrollbar-thumb {
  background: rgba(143, 162, 180, 0.65);
  border-radius: 999px;
}
.batch-status-icon {
  display: inline-block;
  flex: 0 0 auto;
  height: 24px;
  position: relative;
  vertical-align: middle;
  width: 24px;
}
.batch-status-icon.pass {
  background:
    conic-gradient(var(--pass) 0 var(--pass-percent), var(--fail) var(--pass-percent) 100%);
  border: 1px solid #9fb1bf;
  border-radius: 50%;
}
.batch-status-icon.pass::after {
  background: var(--surface);
  border-radius: 50%;
  content: "";
  height: 8px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
}
.batch-status-icon.fail {
  background: var(--fail);
  border: 1px solid var(--fail);
  border-radius: 50%;
}
.batch-status-icon.fail::after {
  background: var(--fail-bg);
  border-radius: 50%;
  content: "";
  height: 12px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
}
.batch-status-icon.alert {
  background: var(--fail);
  border: 1px solid var(--fail);
  clip-path: polygon(50% 8%, 95% 92%, 5% 92%);
}
.batch-status-icon.alert::after {
  background: var(--fail-bg);
  clip-path: polygon(44% 20%, 56% 20%, 56% 60%, 44% 60%);
  content: "";
  height: 100%;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.batch-status-icon.compact-pie,
.batch-status-icon.pass.compact-pie {
  height: 18px;
  width: 18px;
}
.batch-status-icon.pass.compact-pie::after {
  height: 6px;
  width: 6px;
}
.result-total-with-chart {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  justify-content: flex-end;
}
.quick-filter-bar {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}
.quick-filter-button {
  background: #f3f7fa;
  border: 1px solid #c8d4df;
  border-radius: 999px;
  color: #425164;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  min-height: 28px;
  padding: 6px 10px;
}
.quick-filter-button:hover {
  background: #eaf1f7;
}
.quick-filter-button.is-active {
  background: #dcecff;
  border-color: #7aa8d6;
  color: #075ca8;
}
.schedule-batch-toolbar {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 10px;
}
.schedule-batch-list {
  min-width: 860px;
}
.schedule-batch-header,
.schedule-batch-summary {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(280px, 1.25fr) minmax(180px, 0.75fr) minmax(360px, 1.5fr);
  padding: 12px 14px;
}
.schedule-batch-header {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  color: #425164;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}
.schedule-batch-row {
  border-bottom: 1px solid var(--border);
}
.schedule-batch-row:last-child {
  border-bottom: 0;
}
.schedule-batch-row > summary {
  min-height: 48px;
  padding-left: var(--disclosure-summary-indent);
}
.schedule-batch-runs {
  background: #f3f7fa;
  border-top: 1px solid var(--border);
  box-shadow: inset 4px 0 0 #8fb4cf;
  padding: 12px 14px 14px 28px;
}
.schedule-run-heading {
  align-items: center;
  color: #425164;
  display: flex;
  font-size: 12px;
  font-weight: 750;
  justify-content: space-between;
  margin: 0 0 8px;
  text-transform: uppercase;
}
.schedule-run-heading-actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.schedule-run-table {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
.schedule-run-table th,
.schedule-run-table td {
  background: transparent;
  font-size: 13px;
}
.schedule-run-table tbody tr:nth-child(even) {
  background: #f7fafc;
}
.schedule-run-row.pass {
  box-shadow: inset 3px 0 0 var(--pass);
}
.schedule-run-row.fail {
  box-shadow: inset 3px 0 0 var(--fail);
}
.schedule-run-row.warn {
  box-shadow: inset 3px 0 0 var(--warn);
}
.stored-schedule-tree {
  min-width: 1040px;
}
.stored-schedule-header,
.stored-schedule-summary {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(360px, 1.6fr) minmax(120px, 0.55fr) 90px 90px;
  padding: 12px 14px;
}
.stored-schedule-header {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  color: #425164;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}
.stored-schedule-row,
.stored-batch-row {
  border-bottom: 1px solid var(--border);
}
.stored-schedule-row.schedule-enabled > summary {
  box-shadow: inset 4px 0 0 var(--pass);
}
.stored-schedule-row.schedule-disabled > summary {
  background: #fffafa;
  box-shadow: inset 4px 0 0 var(--fail);
}
.stored-schedule-row.schedule-unknown > summary {
  box-shadow: inset 4px 0 0 var(--unknown);
}
.stored-schedule-row:last-child,
.stored-batch-row:last-child {
  border-bottom: 0;
}
.stored-schedule-row > summary,
.stored-batch-row > summary {
  min-height: 48px;
  padding-left: var(--disclosure-summary-indent);
}
.stored-schedule-batches {
  background: #f8fafc;
  border-top: 1px solid var(--border);
  box-shadow: inset 4px 0 0 #b8c6d2;
  padding: 12px 14px 14px 28px;
}
.stored-batch-list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
.stored-batch-header,
.stored-batch-summary {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(260px, 1.3fr) minmax(190px, 1fr) 70px 70px 70px;
  padding: 12px 14px;
}
.stored-batch-header {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  color: #425164;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}
.stored-result-runs {
  background: #f3f7fa;
  border-top: 1px solid var(--border);
  box-shadow: inset 4px 0 0 #8fb4cf;
  padding: 12px 14px 14px 28px;
}
.schedule-result-table {
  min-width: 980px;
}
.qa-quick-actions {
  margin-bottom: 16px;
}
.qa-quick-actions-body {
  display: grid;
  gap: 12px;
  padding: 14px;
}
.qa-quick-actions-header {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
}
.qa-quick-actions-title {
  display: grid;
  gap: 4px;
}
.qa-quick-actions-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.qa-quick-actions-list .button {
  gap: 8px;
}
.qa-quick-actions-list .button[data-qa-preset-blocked="true"] {
  border-style: dashed;
}
.qa-quick-actions-list .button.active {
  background: #075ca8;
  border-color: #075ca8;
  color: #ffffff;
}
.qa-quick-actions-list .button.active .badge {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}
.qa-preset-warning {
  margin-bottom: 0;
}
.qa-test-item input:disabled + span {
  opacity: 0.72;
}
.qa-test-steps {
  background: #f8fafc;
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-top: 8px;
  overflow: hidden;
}
.qa-test-steps summary {
  align-items: center;
  background: #eef4f8;
  border-bottom: 1px solid transparent;
  color: var(--link);
  display: flex;
  font-size: 12px;
  font-weight: 650;
  min-height: 40px;
  padding: 8px 10px 8px var(--disclosure-summary-indent);
}
.qa-test-steps[open] summary {
  border-bottom-color: var(--border);
}
.qa-test-steps ol {
  color: var(--muted);
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 10px 10px 10px 28px;
}
.qa-group-list {
  display: grid;
  gap: 12px;
}
.qa-group-block {
  border: 1px solid var(--border);
  border-radius: 8px;
  display: grid;
  overflow: hidden;
}
.qa-group-row,
.qa-folder-row {
  align-items: flex-start;
  background: #f8fbfd;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.qa-group-row {
  border-bottom: 1px solid var(--border);
  padding: 0;
}
.qa-folder-row {
  border: 1px solid #d9e5ed;
  border-radius: 6px;
  padding: 8px 10px;
}
.qa-collapse-toggle {
  align-items: center;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 650;
  height: 30px;
  justify-content: center;
  line-height: 1;
  margin: 12px 12px 0 0;
  padding: 0 10px;
  width: 78px;
}
.qa-collapse-toggle:hover {
  background: #e4edf3;
  color: var(--text);
}
.qa-group-option {
  align-items: flex-start;
  display: flex;
  flex: 1 1 auto;
  gap: 10px;
  padding: 12px;
}
.qa-group-option input {
  height: 13px;
  margin-top: 4px;
  min-height: auto;
  flex: 0 0 auto;
  width: 13px;
}
.qa-group-option span {
  display: grid;
  gap: 3px;
}
.qa-test-count {
  color: var(--muted);
  font-size: 12px;
}
.qa-test-list {
  background: #fff;
  border-left: 0;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 12px 14px 14px 28px;
}
.qa-test-folder {
  border-left: 3px solid #c6d8e4;
  display: grid;
  gap: 8px;
  margin-left: calc(var(--qa-folder-depth) * 18px);
  padding-left: 10px;
}
.qa-group-block.is-collapsed > .qa-test-list,
.qa-test-folder.is-collapsed > .qa-test-folder-children {
  display: none;
}
.qa-folder-option {
  align-items: flex-start;
  color: var(--text);
  display: flex;
  flex: 1 1 auto;
  gap: 8px;
}
.qa-folder-option input {
  flex: 0 0 auto;
  height: 13px;
  margin-top: 3px;
  min-height: auto;
  width: 13px;
}
.qa-folder-option span {
  display: grid;
  gap: 2px;
}
.qa-test-folder-children {
  border-left: 1px solid #d9e5ed;
  display: grid;
  gap: 8px;
  margin-left: 6px;
  padding-left: 14px;
}
.qa-test-item {
  align-items: flex-start;
  display: flex;
  gap: 8px;
}
.qa-test-item input {
  flex: 0 0 auto;
  height: 13px;
  margin-top: 3px;
  min-height: auto;
  width: 13px;
}
.qa-test-item span {
  display: grid;
  gap: 2px;
}
.qa-report-group {
  border-bottom: 1px solid var(--border);
  padding: 16px;
}
.qa-report-group:last-child {
  border-bottom: 0;
}
.qa-report-group h3 {
  font-size: 15px;
  margin: 0 0 10px;
}
.qa-report-unviewed td {
  background: #f7fbff;
}
.qa-report-unviewed td:first-child {
  box-shadow: inset 4px 0 0 #2d76b8;
}
.qa-run-list {
  display: grid;
  gap: 10px;
}
.qa-sticky-runbar {
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
  padding: 12px 14px;
  position: sticky;
  top: 0;
  z-index: 2;
}
.qa-sticky-runbar-inner {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
}
.qa-run-estimate {
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}
.qa-run-row {
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 10px 12px;
}
.qa-result-list {
  display: grid;
  gap: 12px;
}
.qa-result-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: inset 4px 0 0 var(--border);
  padding: 14px;
}
.qa-result-card.pass {
  box-shadow: inset 4px 0 0 var(--pass);
}
.qa-result-card.fail {
  box-shadow: inset 4px 0 0 var(--fail);
}
.qa-result-card.warn {
  box-shadow: inset 4px 0 0 var(--warn);
}
.qa-result-meta {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 8px;
}
.qa-result-title {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.qa-result-times {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  gap: 10px;
  justify-content: flex-end;
  text-align: right;
}
.qa-result-message {
  margin-top: 8px;
}
.qa-result-collapsible {
  border-top: 1px solid var(--border);
  margin-top: 10px;
  padding-top: 10px;
}
.qa-result-collapsible summary {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  min-height: 36px;
  padding-left: var(--disclosure-summary-indent);
  text-transform: uppercase;
}
.qa-result-collapsible-body {
  margin-top: 10px;
}
.qa-results-card {
  margin-bottom: 16px;
}
.qa-results-summary {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.qa-results-meta {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 13px;
}
.qa-results-history {
  border-top: 1px solid var(--border);
  padding: 0;
}
.qa-results-history-table {
  overflow-x: auto;
}
.qa-pagination {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  padding: 12px 14px 14px;
}
.inline-link {
  color: inherit;
  font-weight: 700;
}
.qa-failure-point {
  background: #fff5f5;
  border: 1px solid #feb2b2;
  border-radius: 6px;
  color: var(--fail);
  font-weight: 700;
  margin-top: 10px;
  padding: 8px 10px;
}
.qa-detail-heading {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  margin-top: 8px;
  text-transform: uppercase;
}
.qa-details {
  display: grid;
  gap: 4px;
  margin: 8px 0 0;
}
.qa-details div {
  display: grid;
  gap: 8px;
  grid-template-columns: 120px minmax(0, 1fr);
}
.qa-details dt {
  color: var(--muted);
  font-weight: 700;
}
.qa-details dd {
  margin: 0;
  overflow-wrap: anywhere;
}
@media (max-width: 760px) {
  .app-shell {
    grid-template-columns: 1fr;
  }
  .sidebar {
    border-bottom: 1px solid var(--border);
    border-right: 0;
    height: auto;
    position: static;
  }
  .sidebar-head {
    min-height: 0;
  }
  .nav {
    flex-direction: row;
    overflow-x: auto;
  }
  .sidebar-footer {
    border-top: 0;
    padding-top: 0;
  }
  body.sidebar-collapsed .brand,
  body.sidebar-collapsed .nav-label,
  body.sidebar-collapsed .cache-label {
    opacity: 1;
    pointer-events: auto;
    width: auto;
  }
  body.sidebar-collapsed .sidebar-toggle {
    transform: none;
  }
  .provider-tabs-sticky { top: 0; }
  .page-head {
    align-items: stretch;
    flex-direction: column;
  }
  table { min-width: 720px; }
  .batch-mini { min-width: 0; }
  .panel { overflow-x: auto; }
  .dashboard-table { min-width: 1080px; }
  .qa-result-meta,
  .qa-result-times {
    align-items: flex-start;
    flex-direction: column;
    text-align: left;
  }
  .customer-color-palette {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .scenario-builder {
    grid-template-columns: 1fr;
  }
  .scenario-builder-selected-row,
  .scenario-builder-library-row {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .scenario-builder-order,
  .scenario-builder-version,
  .scenario-builder-grab,
  .scenario-builder-library-copy,
  .scenario-builder-library-row .button {
    grid-column: 1 / -1;
  }
}

/* Daily status report */
.dr-stack > * + * {
  margin-top: 14px;
}

/* voip.ms Call Records */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 20px 24px;
  padding: 18px 18px;
}
.stat {
  min-width: 0;
}
.stat-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-bottom: 6px;
  white-space: nowrap;
}
.stat-value {
  font-size: 17px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  padding: 14px 16px;
}
.filter-row label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--muted);
}
.filter-row input {
  min-height: 32px;
  padding: 4px 8px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  font: inherit;
  background: #fff;
  color: var(--text);
}
.filter-row .filter-search {
  flex: 1 1 260px;
}
.filter-row .filter-search input {
  width: 100%;
  box-sizing: border-box;
}
.table-scroll {
  overflow-x: auto;
}
.cdr-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  padding: 14px 16px;
}
.cdr-pager__pages {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.cdr-page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 32px;
  padding: 0 9px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
  font-size: 13px;
  line-height: 1;
}
.cdr-page:hover {
  border-color: #075ca8;
  color: #075ca8;
}
.cdr-page--active {
  background: #075ca8;
  border-color: #075ca8;
  color: #fff;
  font-weight: 600;
}
.cdr-page--disabled {
  opacity: 0.45;
  pointer-events: none;
}
.cdr-page--gap {
  min-width: 20px;
  border: none;
  background: transparent;
  pointer-events: none;
}
.cdr-pager__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
}
.cdr-pager__form {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
}
.cdr-pager__form label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--muted);
}
.cdr-pager__jump {
  width: 74px;
  min-height: 30px;
  padding: 3px 6px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  font: inherit;
  background: #fff;
  color: var(--text);
}

/* Release notes (Admin section preview + /release-notes page) */
.release-notes {
  padding: 14px 18px;
}
.release-notes h2 {
  font-size: 17px;
  margin: 18px 0 6px;
  padding-top: 14px;
  border-top: 1px solid var(--border, #d9e1e8);
}
.release-notes h2:first-child { margin-top: 0; padding-top: 0; border-top: none; }
.release-notes h3 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin: 14px 0 4px;
}
.release-notes ul { margin: 0 0 8px; padding-left: 1.3em; }
.release-notes li { margin: 3px 0; }
.release-notes p.muted { font-size: 13px; }

.dr-controls-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px 16px 4px;
}
.dr-controls-note {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
  padding: 0 16px 14px;
}

.dr-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 28px;
  padding: 16px 18px;
}
.dr-summary__lead {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dr-summary__badge {
  min-width: 78px;
  font-size: 13px;
  padding: 6px 12px;
}
.dr-summary__title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.25;
}
.dr-summary__sub {
  color: var(--muted);
  font-size: 13px;
  margin-top: 2px;
}
.dr-summary__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  margin: 0;
}
.dr-summary__meta > div {
  min-width: 0;
}
.dr-summary__meta dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.dr-summary__meta dd {
  margin: 3px 0 0;
  color: var(--text);
  font-size: 13px;
  white-space: nowrap;
}

.section-note.dr-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  flex-wrap: wrap;
  color: var(--text);
  font-weight: 650;
}
.dr-tally {
  display: inline-flex;
  align-items: center;
  gap: 4px 14px;
  flex-wrap: wrap;
  font-weight: 500;
  font-size: 12px;
}
.dr-tally span::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  margin-right: 6px;
  vertical-align: middle;
  background: currentColor;
}
.dr-tally .dr-tally--pass { color: var(--pass); }
.dr-tally .dr-tally--fail { color: var(--fail); }
.dr-tally .dr-tally--warn { color: var(--warn); }

.dr-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 15px 16px 15px 13px;
  border-top: 1px solid var(--border);
  border-left: 3px solid transparent;
}
.dr-item:first-child {
  border-top: none;
}
.dr-item--bad {
  border-left-color: var(--fail);
}
.dr-item--warn {
  border-left-color: var(--warn);
}
.dr-item__status {
  flex: 0 0 88px;
  display: flex;
  padding-top: 1px;
}
.dr-item__body {
  flex: 1;
  min-width: 0;
}
.dr-item__name {
  font-weight: 700;
  color: var(--text);
  line-height: 1.3;
}
.dr-item__desc {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
  margin-top: 3px;
  overflow-wrap: anywhere;
}
.dr-item__note {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
  margin-top: 5px;
}

.dr-locate {
  margin-top: 8px;
  font-size: 13px;
}
.dr-locate > summary {
  cursor: pointer;
  color: var(--link);
  font-weight: 600;
  width: fit-content;
  list-style: none;
}
.dr-locate > summary::-webkit-details-marker {
  display: none;
}
.dr-locate > summary::before {
  content: "\25B8";
  display: inline-block;
  margin-right: 6px;
  font-size: 11px;
}
.dr-locate[open] > summary::before {
  content: "\25BE";
}
.dr-locate__list {
  list-style: none;
  margin: 8px 0 2px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.dr-locate__item {
  border-left: 2px solid var(--border);
  padding: 1px 0 1px 10px;
}
.dr-locate__case {
  color: var(--text);
  font-weight: 600;
}
.dr-locate__rate {
  color: var(--muted);
  font-weight: 400;
  font-size: 12px;
  margin-left: 8px;
}
.dr-locate__path {
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  overflow-wrap: anywhere;
}
.dr-locate__link {
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 600;
  color: #075ca8;
  text-decoration: none;
}
.dr-locate__link:hover { text-decoration: underline; }

.dr-images {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 12px;
}
.dr-figure {
  margin: 0;
  max-width: 460px;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
}
.dr-figure img {
  display: block;
  max-width: 100%;
  height: auto;
}
.dr-figure figcaption {
  color: var(--muted);
  font-size: 12px;
  padding: 7px 10px;
  border-top: 1px solid var(--border);
}

@media (max-width: 640px) {
  .dr-item {
    flex-direction: column;
    gap: 8px;
  }
  .dr-summary__meta dd {
    white-space: normal;
  }
}

/* Daily report — client tabs + warnings strip */
.dr-client-tabs .tabs {
  flex-wrap: wrap;
}
.dr-tab-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  margin-right: 7px;
  background: var(--pass);
  vertical-align: baseline;
}
.dr-tab-dot--warn { background: var(--warn); }
.dr-tab-dot--fail { background: var(--fail); }

.dr-warnings__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  padding: 10px 14px 10px 11px;
  border-top: 1px solid var(--border);
  border-left: 3px solid transparent;
}
.dr-warnings__row:first-child {
  border-top: none;
}
.dr-warnings__row--bad { border-left-color: var(--fail); }
.dr-warnings__row--warn { border-left-color: var(--warn); }
.dr-warnings__row--ok { border-left-color: var(--pass); }
.dr-warnings__client {
  font-weight: 700;
  white-space: nowrap;
}
.dr-warnings__text {
  color: var(--muted);
  font-size: 13px;
  overflow-wrap: anywhere;
  min-width: 0;
  flex: 1;
}
.dr-warnings__jump {
  background: none;
  border: none;
  padding: 0;
  color: var(--link);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.dr-warnings__jump:hover {
  text-decoration: underline;
}

.dr-client-panel > * + * {
  margin-top: 14px;
}

.dr-live__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 14px;
}
.dr-live__chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  font-size: 13px;
  font-weight: 600;
}
.dr-live__chip--fail {
  border-color: var(--fail);
  background: var(--fail-bg);
  color: var(--fail);
}
.dr-mon__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dr-mon {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 12px;
  border-top: 1px solid var(--border);
  min-width: 0;
}
.dr-mon__grid .dr-mon:nth-child(odd) { border-right: 1px solid var(--border); }
.dr-mon--snoozed { background: #fbfaf3; }
.dr-mon--fail { background: var(--fail-bg); }
.dr-mon__name {
  flex: 0 1 auto;
  min-width: 40px;
  font-weight: 650;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dr-mon .badge { min-width: 0; padding: 2px 8px; }
.dr-mon__spacer { flex: 1 1 auto; }
.dr-mon__since { font-size: 12px; }
.dr-mon__snoozechip {
  font-size: 12px;
  color: var(--warn, #8a5b00);
  background: var(--warn-bg, #fbf3e0);
  padding: 2px 9px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.dr-mon__inline { display: inline; margin: 0; }
.dr-mon__resume {
  border: none;
  background: none;
  color: #075ca8;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  text-decoration: underline;
  padding: 0 4px;
}
.dr-menu { display: inline-flex; }
.dr-menu__toggle {
  min-height: 26px;
  padding: 1px 9px 4px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  background: #fff;
  color: var(--muted);
  font: inherit;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
}
.dr-menu__toggle:hover { background: #f3f7fa; }
.dr-menu__pop {
  display: none;
  position: fixed;
  z-index: 1000;
  width: 250px;
  background: var(--surface, #fff);
  border: 1px solid var(--border, #d9e1e8);
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(15, 33, 51, 0.18);
  padding: 12px;
}
.dr-menu__pop.open { display: block; }
.dr-menu__h {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-bottom: 8px;
}
.dr-menu__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.dr-menu__chip {
  font-size: 12px;
  border: 1px solid #b8c6d2;
  background: #fff;
  border-radius: 999px;
  padding: 4px 11px;
  cursor: pointer;
  color: var(--text);
  font: inherit;
}
.dr-menu__chip:hover { border-color: #075ca8; color: #075ca8; }
.dr-menu__divider { height: 1px; background: var(--border, #d9e1e8); margin: 12px -12px; }
.dr-menu__tol { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; }
.dr-menu__tol label { font-size: 13px; }
.dr-menu__select {
  min-height: 28px;
  padding: 3px 6px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  font: inherit;
  font-size: 12px;
  background: #fff;
  color: var(--text);
}
.dr-menu__note { font-size: 12px; color: var(--muted); }
.dr-menu__chan { display: flex; flex-direction: column; gap: 7px; margin: 0; }
.dr-menu__check {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
}
.dr-menu__check input { margin: 0; }
.dr-menu__input {
  min-height: 28px;
  padding: 4px 7px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  font: inherit;
  font-size: 12px;
  background: #fff;
  color: var(--text);
  width: 100%;
  box-sizing: border-box;
}
.dr-menu__save {
  align-self: flex-start;
  font-size: 12px;
  border: 1px solid #b8c6d2;
  background: #fff;
  border-radius: 6px;
  padding: 4px 11px;
  cursor: pointer;
  color: var(--text);
  font: inherit;
}
.dr-menu__save:hover { border-color: #075ca8; color: #075ca8; }
.dr-mon__events { padding: 8px 12px; }
.dr-mon__events > summary { cursor: pointer; color: var(--muted); font-size: 13px; }
@media (max-width: 920px) {
  .dr-mon__grid { grid-template-columns: 1fr; }
  .dr-mon__grid .dr-mon:nth-child(odd) { border-right: none; }
}

/* Per-client config popups (alert thresholds / failure tolerance) */
.infra-cog,
.dr-mon__cog {
  min-height: 26px;
  padding: 3px 10px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}
.infra-cog { margin-left: 8px; }
.dr-mon__cog { margin-left: 6px; padding: 3px 8px; }
.infra-cog:hover,
.dr-mon__cog:hover { background: #f3f7fa; }
.infra-cog__custom {
  margin-left: 5px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #eef4ff;
  color: #075ca8;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
dialog.modal {
  border: none;
  border-radius: 12px;
  padding: 0;
  width: min(560px, 92vw);
  box-shadow: 0 12px 40px rgba(15, 33, 51, 0.25);
  color: var(--text);
}
dialog.modal::backdrop { background: rgba(15, 33, 51, 0.45); }
.modal__form { padding: 18px 20px 16px; }
.modal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.modal__title { margin: 0; font-size: 17px; }
.modal__x { border: none; background: none; font-size: 22px; line-height: 1; cursor: pointer; color: var(--muted); }
.modal__note { margin: 6px 0 14px; font-size: 13px; }
.modal__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.modal__col { border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; background: #f9fbfc; }
.modal__coltitle { font-weight: 700; font-size: 12px; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.modal__field { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; }
.modal__field span { font-size: 13px; }
.modal__field input,
.modal__select {
  width: 84px;
  min-height: 30px;
  padding: 4px 6px;
  border: 1px solid #b8c6d2;
  border-radius: 6px;
  font: inherit;
  text-align: right;
}
.modal__select { width: auto; text-align: left; }
.modal__row { margin: 10px 0; display: flex; align-items: center; gap: 10px; }
.modal__actions { display: flex; align-items: center; gap: 8px; margin-top: 18px; }
.modal__spacer { flex: 1; }
@media (max-width: 640px) { .modal__grid { grid-template-columns: 1fr; } }

@keyframes dr-item-flash {
  0% { background: var(--warn-bg); }
  100% { background: transparent; }
}
.dr-item--flash {
  animation: dr-item-flash 1.5s ease-out;
}

@media (max-width: 760px) {
  .dr-client-tabs .tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
  }
}

/* Infrastructure page */
.infra-issues__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  padding: 10px 14px 10px 11px;
  border-top: 1px solid var(--border);
  border-left: 3px solid transparent;
}
.infra-issues__row:first-child {
  border-top: none;
}
.infra-issues__row--alert { border-left-color: var(--fail); }
.infra-issues__row--warn { border-left-color: var(--warn); }
.infra-issues__row--ok { border-left-color: var(--pass); }
.infra-issues__where {
  min-width: 0;
}
.infra-issues__reason {
  font-size: 13px;
  overflow-wrap: anywhere;
}
.infra-issues__jump {
  margin-left: auto;
  color: var(--link);
  font-weight: 600;
  white-space: nowrap;
}

.infra-account {
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  margin: 0 0 12px;
  background: var(--surface);
}
.infra-account-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding: 10px 14px;
  background: #f9fbfc;
  border-bottom: 1px solid var(--border);
}
.infra-account-title {
  font-weight: 700;
  color: var(--text);
}
.infra-account-meta {
  color: var(--muted);
  font-size: 13px;
}
.infra-account-error {
  background: var(--fail-bg);
  color: var(--fail);
  padding: 8px 14px;
  font-size: 13px;
  border-bottom: 1px solid var(--border);
}
.infra-asof {
  font-size: 12px;
  margin-left: auto;
  white-space: nowrap;
}
.infra-asof--stale {
  color: var(--warn);
  font-weight: 650;
}

.infra-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
}
.infra-chip {
  display: inline-block;
  padding: 2px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}
.infra-chip--manual {
  border-style: dashed;
  color: var(--muted);
  background: var(--surface);
}

.infra-table-wrap {
  overflow-x: auto;
}
.infra-state-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  vertical-align: baseline;
  background: var(--unknown);
}
.infra-state-dot--running { background: var(--pass); }
.infra-state-dot--stopped { background: #8fa2b4; }
.infra-state-dot--pending { background: var(--warn); }
.infra-state-dot--terminated { background: var(--fail); }

tr.infra-row--warn > td:first-child { box-shadow: inset 3px 0 0 var(--warn); }
tr.infra-row--alert > td:first-child { box-shadow: inset 3px 0 0 var(--fail); }
.infra-row--stopped td { color: var(--muted); }
.infra-row--stopped .badge { opacity: 0.55; }
.infra-metric-na {
  color: var(--muted);
  cursor: help;
}
.infra-check {
  min-width: 26px;
  width: 26px;
  padding: 4px 0;
}