/* Shared brand tokens are declared in the Phase 3C-2 source of truth below. */
:root {
  /* Assessment score meanings remain independent from the brand foundation. */
  --green: #3f8f59;
  --orange: #b8692d;
  --red: #a33f3f;
}

/* Phase 4A-4A: Owner assessment-finance workspace. */
.assessment-finance-panel,
.training-finance-panel {
  display: grid;
  gap: 18px;
}

.finance-workspace-heading {
  align-items: start;
  padding-bottom: 16px;
}

.finance-workspace-context {
  display: grid;
  gap: 3px;
  min-width: 210px;
  padding: 11px 13px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface-muted);
}

.finance-workspace-context span,
.finance-workspace-context strong {
  margin: 0;
}

.finance-workspace-context span,
.finance-filter-bar label > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.finance-workspace-context strong { color: var(--navy); font-size: 14px; }

.finance-attention-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 16px;
  border: 1px solid #e4d19b;
  border-left: 3px solid var(--gold);
  border-radius: 8px;
  background: #fffaf0;
}

.finance-attention-strip > div { display: grid; gap: 3px; }
.finance-attention-strip p,
.finance-attention-strip strong,
.finance-attention-strip span { margin: 0; }
.finance-attention-strip strong { color: var(--navy); font-size: 15px; }
.finance-attention-strip span { color: var(--muted); font-size: 12px; }

.finance-workspace-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface-muted);
}

.finance-workspace-tabs button {
  flex: 1 1 max-content;
  min-height: 36px;
  padding: 7px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
}

.finance-workspace-tabs button[aria-selected="true"] {
  background: var(--navy);
  color: #fff;
  box-shadow: var(--shadow-soft);
}

.finance-filter-bar {
  display: grid;
  grid-template-columns: minmax(260px, 1.4fr) minmax(190px, 0.65fr) minmax(180px, 0.7fr);
  align-items: end;
  gap: 12px;
  padding: 13px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface);
}

.finance-filter-bar label { display: grid; gap: 6px; min-width: 0; }
.finance-filter-bar input,
.finance-filter-bar select { min-width: 0; }
.finance-filter-summary { align-self: center; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.4; }

.assessment-finance-workspace,
.training-finance-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
  align-items: start;
  gap: 16px;
}

.assessment-finance-list-pane,
.training-finance-list-pane { display: grid; gap: 14px; min-width: 0; }
.assessment-finance-detail-pane,
.training-finance-detail-pane {
  position: sticky;
  top: 16px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface-muted);
  box-shadow: var(--shadow-soft);
}

.finance-detail-empty { display: grid; gap: 7px; min-height: 230px; align-content: center; padding: 18px; }
.finance-detail-empty p,
.finance-detail-empty h3 { margin: 0; }
.finance-detail-empty h3 { color: var(--navy); font-size: 20px; }
.finance-detail-empty p:not(.eyebrow) { color: var(--muted); line-height: 1.5; }

.finance-list-section {
  display: grid;
  gap: 12px;
  padding: 15px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 8px;
  background: var(--apd-surface-primary, #fff);
}

.finance-list-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.finance-list-heading > div { min-width: 0; }
.finance-list-heading p,
.finance-list-heading h3,
.finance-list-heading > span { margin: 0; }
.finance-list-heading h3 { margin-top: 2px; color: var(--navy); font-size: 18px; }
.finance-list-heading p:not(.eyebrow) { margin-top: 5px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.finance-list-heading > span {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--apd-surface-secondary, #f8faf9);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.finance-record-list { display: grid; gap: 9px; }
.finance-record-card {
  display: grid;
  gap: 13px;
  padding: 14px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 7px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.finance-record-stack { display: grid; gap: 9px; }
.finance-record-card.is-attention { border-left: 3px solid var(--color-warning); }
.finance-record-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 14px;
}
.finance-record-heading > div { min-width: 0; }
.finance-record-heading p,
.finance-record-heading h4,
.finance-record-note { margin: 0; }
.finance-record-heading h4 { margin-top: 2px; color: var(--navy); font-size: 15px; }
.finance-record-heading p:not(.eyebrow),
.finance-record-note { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.finance-record-heading > strong { flex: 0 0 auto; color: var(--navy); font-size: 19px; white-space: nowrap; }
.finance-record-card.is-attention .finance-record-heading > strong { color: var(--color-danger); }
.finance-record-statuses { display: flex; flex-wrap: wrap; gap: 6px; }
.finance-record-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  border: 1px solid var(--color-border);
  background: var(--color-border);
}
.finance-record-facts > div { min-width: 0; padding: 9px; background: var(--color-surface); }
.finance-record-facts dt { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: 0.065em; text-transform: uppercase; }
.finance-record-facts dd { margin: 4px 0 0; color: var(--navy); font-size: 12px; font-weight: 750; line-height: 1.35; overflow-wrap: anywhere; }
.finance-workspace-header-actions { display: flex; align-items: end; justify-content: end; flex-wrap: wrap; gap: 8px; }
.training-finance-context { border-color: var(--color-data-accent); }
.training-finance-tabs button { min-width: 112px; }
.finance-detail-back { display: none; justify-self: start; min-height: 32px; padding: 3px 0; }
.finance-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.finance-detail-subsection { display: grid; gap: 8px; padding-top: 14px; border-top: 1px solid var(--color-border); }
.finance-detail-subsection > p { margin: 0; }
.finance-detail-event {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-surface);
}
.finance-detail-event > div { display: grid; gap: 3px; min-width: 0; }
.finance-detail-event strong { color: var(--navy); font-size: 13px; }
.finance-detail-event span,
.finance-detail-event p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.finance-detail-event > div:last-child { justify-items: end; text-align: right; }
.finance-detail-event .secondary-button { min-height: 31px; padding: 5px 8px; }

.finance-record-card.is-reversed { border-left: 3px solid var(--color-danger); }
.finance-record-card.attention-card { border-left: 3px solid var(--gold); }
.finance-record-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 14px;
}

.finance-record-head > div:first-child { min-width: 0; }
.finance-record-head p,
.finance-record-head h4 { margin: 0; }
.finance-record-head h4 { margin-top: 2px; color: var(--navy); font-size: 15px; }
.finance-record-head p:not(.eyebrow) { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }

.finance-amount-stack { display: grid; justify-items: end; gap: 2px; flex: 0 0 auto; text-align: right; }
.finance-amount-stack strong { color: var(--navy); font-size: 19px; white-space: nowrap; }
.finance-amount-stack span { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: 0.06em; text-transform: uppercase; }
.finance-amount-stack.is-negative strong,
.finance-timeline-row > strong.is-negative { color: var(--color-danger); }

.finance-card-facts,
.finance-detail-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  border: 1px solid var(--color-border);
  background: var(--color-border);
}

.finance-card-facts > div,
.finance-detail-facts > div {
  min-width: 0;
  padding: 9px;
  background: var(--color-surface);
}

.finance-card-facts dt,
.finance-detail-facts dt,
.finance-allocation-row dt,
.finance-correction-projection dt {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

.finance-card-facts dd,
.finance-detail-facts dd,
.finance-allocation-row dd,
.finance-correction-projection dd {
  margin: 4px 0 0;
  color: var(--navy);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.finance-card-actions,
.finance-detail-action-row { display: flex; justify-content: end; flex-wrap: wrap; gap: 8px; }
.finance-card-actions .secondary-button { min-height: 34px; padding: 6px 10px; }

.finance-detail-card { display: grid; gap: 14px; }
.finance-detail-card > p,
.finance-detail-card > h3 { margin: 0; }
.finance-detail-card > h3 { color: var(--navy); font-size: 21px; }
.finance-detail-card > p:not(.eyebrow) { color: var(--muted); font-size: 13px; line-height: 1.45; }
.finance-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.finance-detail-note { padding: 10px 11px; border-left: 2px solid var(--color-data-accent); background: var(--color-info-surface); }

.finance-allocation-section { display: grid; gap: 9px; padding-top: 14px; border-top: 1px solid var(--color-border); }
.finance-allocation-section p,
.finance-allocation-section h4 { margin: 0; }
.finance-allocation-section h4 { color: var(--navy); font-size: 15px; }
.finance-allocation-section > div > p:not(.eyebrow) { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.finance-allocation-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, 0.9fr);
  gap: 12px;
  padding: 10px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-surface);
}

.finance-allocation-row > div:first-child { display: grid; align-content: center; gap: 3px; min-width: 0; }
.finance-allocation-row strong { color: var(--navy); font-size: 13px; }
.finance-allocation-row > div:first-child span { color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.finance-allocation-row dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; border: 1px solid var(--color-border); background: var(--color-border); }
.finance-allocation-row dl > div { padding: 7px; background: var(--color-surface-muted); }

.finance-timeline-list { display: grid; gap: 8px; }
.finance-timeline-row { display: grid; grid-template-columns: 27px minmax(0, 1fr) auto auto; align-items: center; gap: 11px; }
.finance-timeline-marker {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: #e7f2ec;
  color: #287059;
  font-size: 17px;
  font-weight: 800;
}
.finance-timeline-marker.is-negative { background: var(--color-danger-surface); color: var(--color-danger); }
.finance-timeline-row .quiet-button { min-height: 30px; padding: 5px 8px; }

.finance-danger-button {
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid var(--color-danger);
  border-radius: 6px;
  background: #fff;
  color: var(--color-danger);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}
.finance-danger-button:hover { background: #fff0ee; }

.finance-mobile-back { display: none; justify-self: start; min-height: 32px; padding: 3px 0; }
.finance-correction-projection {
  display: grid;
  gap: 8px;
  padding: 13px;
  border: 1px solid var(--color-border);
  border-radius: 7px;
  background: var(--color-surface-muted);
}
.finance-correction-projection > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.finance-correction-projection > .eyebrow { color: var(--navy); }
.finance-correction-projection dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; border: 1px solid var(--color-border); background: var(--color-border); }
.finance-correction-projection dl > div { padding: 9px; background: var(--color-surface); }

@media (max-width: 1024px) {
  .assessment-finance-workspace,
  .training-finance-workspace { grid-template-columns: minmax(0, 1fr); }
  .assessment-finance-detail-pane,
  .training-finance-detail-pane { position: static; }
}

@media (max-width: 1100px) {
  .finance-filter-bar { grid-template-columns: minmax(0, 1fr) minmax(180px, 0.65fr); }
  .finance-filter-summary { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .finance-filter-bar { grid-template-columns: minmax(0, 1fr) minmax(190px, 0.65fr); }
  .finance-filter-summary { grid-column: 1 / -1; }
  .finance-card-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.staff-access-panel { display: grid; gap: 14px; }
.staff-access-controls { display: grid; grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(150px, 1fr)); gap: 10px; padding: 12px; border: 1px solid var(--color-border, #d6dde0); background: var(--surface-muted, #f5f7f8); }
.staff-access-controls label { display: grid; gap: 5px; color: var(--text-secondary, #53616b); font-size: 12px; font-weight: 700; }
.staff-access-layout { display: grid; grid-template-columns: minmax(330px, .9fr) minmax(420px, 1.1fr); gap: 14px; align-items: start; }
.staff-access-directory, .staff-access-detail { min-width: 0; border: 1px solid var(--color-border, #d6dde0); background: var(--surface, #fff); padding: 12px; }
.staff-access-detail { position: sticky; top: 18px; }
.staff-access-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid var(--color-border, #d6dde0); border-left: 3px solid var(--brand-gold); background: var(--surface-muted, #f5f7f8); margin-bottom: 10px; }
.staff-access-row.is-selected { border-color: var(--brand-teal); background: var(--surface, #fff); }
.staff-access-row h4, .staff-detail-card h3 { margin: 0; color: var(--text-primary, #0d1b2a); }
.staff-access-row p { margin: 4px 0; }
.staff-access-statuses { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.staff-row-context, .staff-access-note { color: var(--text-secondary, #53616b); font-size: 13px; }
.staff-detail-card { display: grid; gap: 14px; }
.staff-detail-card section { border-top: 1px solid var(--color-border, #d6dde0); padding-top: 12px; }
.staff-detail-card section h4 { margin: 0 0 7px; }
.staff-detail-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border: 1px solid var(--color-border, #d6dde0); }
.staff-detail-facts > div { padding: 9px; border: 1px solid var(--color-border, #d6dde0); }
.staff-detail-facts dt { color: var(--text-secondary, #53616b); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.staff-detail-facts dd { margin: 3px 0 0; font-weight: 800; }
.staff-permission-list { display: grid; gap: 8px; }
.staff-permission-list > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px; border: 1px solid var(--color-border, #d6dde0); }
.staff-permission-candidates { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--color-border, #d6dde0); }
.staff-permission-candidates > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px; border: 1px solid var(--color-border, #d6dde0); background: var(--surface-muted, #f5f7f8); }
.staff-detail-back { display: none; justify-self: start; }
.staff-access-editor-dialog { width: min(860px, calc(100vw - 32px)); max-height: min(90vh, 960px); padding: 0; border: 1px solid var(--color-border, #d6dde0); background: var(--surface, #fff); color: var(--ink, #0d1b2a); box-shadow: 0 24px 72px rgba(11, 35, 47, .28); }
.staff-access-editor-dialog::backdrop { background: rgba(11, 35, 47, .48); }
.staff-access-editor-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; border-bottom: 1px solid var(--color-border, #d6dde0); background: var(--surface-muted, #f5f7f8); }
.staff-access-editor-dialog-header h3 { margin: 3px 0 0; color: var(--text-primary, #0d1b2a); }
.staff-access-editor-dialog #testerAccountEditorSection { max-height: calc(90vh - 85px); overflow: auto; padding: 18px; }
.staff-access-editor-dialog .staff-access-guide { display: none; }
@media (max-width: 1024px) { .staff-access-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); } .staff-access-layout { grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr); } }
@media (max-width: 620px) {
  .staff-access-controls { grid-template-columns: 1fr; }
  .staff-access-row { grid-template-columns: 1fr; align-items: stretch; }
  .staff-access-row .secondary-button { width: 100%; }
  .staff-detail-facts { grid-template-columns: 1fr; }
  .staff-permission-list > div, .staff-permission-candidates > div { align-items: stretch; flex-direction: column; }
  .staff-permission-list button, .staff-permission-candidates button { width: 100%; }
  .staff-access-editor-dialog { width: min(100vw - 20px, 620px); }
  .staff-access-editor-dialog-header { align-items: flex-start; }
  .staff-access-editor-dialog #testerAccountEditorSection { max-height: calc(100vh - 96px); padding: 14px; }
  .finance-workspace-heading { display: grid; gap: 12px; }
  .finance-workspace-header-actions { align-items: stretch; justify-content: stretch; }
  .finance-workspace-header-actions > * { width: 100%; }
  .finance-workspace-context { min-width: 0; }
  .finance-attention-strip { align-items: stretch; flex-direction: column; }
  .finance-attention-strip .secondary-button { width: 100%; }
  .finance-filter-bar { grid-template-columns: 1fr; }
  .finance-filter-summary { grid-column: auto; }
  .finance-record-head { align-items: stretch; flex-direction: column; }
  .finance-record-heading { align-items: stretch; flex-direction: column; }
  .finance-amount-stack { justify-items: start; text-align: left; }
  .finance-card-actions > button,
  .finance-detail-action-row > button,
  .finance-detail-actions > button { width: 100%; }
  .finance-detail-event { align-items: stretch; flex-direction: column; }
  .finance-detail-event > div:last-child { justify-items: start; text-align: left; }
  .finance-allocation-row { grid-template-columns: 1fr; }
  .finance-timeline-row { grid-template-columns: 27px minmax(0, 1fr); align-items: start; }
  .finance-timeline-row > strong { grid-column: 2; }
  .finance-timeline-row .quiet-button { grid-column: 2; justify-self: start; }
  .finance-correction-projection dl { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .staff-access-layout { display: block; }
  .staff-access-panel.is-mobile-detail-open > .owner-workspace-heading,
  .staff-access-panel.is-mobile-detail-open > .operations-summary-grid,
  .staff-access-panel.is-mobile-detail-open > .staff-access-controls,
  .staff-access-panel.is-mobile-detail-open .staff-access-directory { display: none; }
  .staff-access-panel.is-mobile-detail-open .staff-access-detail { display: block; position: static; }
  .staff-access-detail { display: none; }
  .staff-access-panel .staff-detail-back { display: inline-flex; }
  .assessment-finance-panel .assessment-finance-detail-pane { display: none; }
  .assessment-finance-panel.is-finance-mobile-detail-open .assessment-finance-list-pane { display: none; }
  .assessment-finance-panel.is-finance-mobile-detail-open .assessment-finance-detail-pane { display: grid; }
  .assessment-finance-panel.is-finance-mobile-detail-open .finance-workspace-tabs,
  .assessment-finance-panel.is-finance-mobile-detail-open .finance-filter-bar,
  .assessment-finance-panel.is-finance-mobile-detail-open .finance-attention-strip,
  .assessment-finance-panel.is-finance-mobile-detail-open #assessmentFinanceMetrics { display: none; }
  .training-finance-panel .training-finance-detail-pane { display: none; }
  .training-finance-panel.is-finance-mobile-detail-open .training-finance-list-pane { display: none; }
  .training-finance-panel.is-finance-mobile-detail-open .training-finance-detail-pane { display: grid; }
  .training-finance-panel.is-finance-mobile-detail-open .finance-workspace-tabs,
  .training-finance-panel.is-finance-mobile-detail-open .finance-filter-bar,
  .training-finance-panel.is-finance-mobile-detail-open .finance-attention-strip,
  .training-finance-panel.is-finance-mobile-detail-open #trainingFinanceMetrics { display: none; }
  .finance-mobile-back { display: inline-flex; }
  .finance-detail-back { display: inline-flex; }
  .finance-detail-facts { grid-template-columns: 1fr; }
  .finance-record-facts { grid-template-columns: 1fr; }
  .finance-allocation-row dl { grid-template-columns: 1fr; }
}

/* Phase 4C-5: Evaluator Training workspace. */
body.app-body.evaluator-mode .evaluator-training-panel {
  gap: 18px;
}

body.app-body.evaluator-mode .evaluator-training-panel > #evaluatorTrainingWorkspaceSummary {
  margin-top: -8px;
}

body.app-body.evaluator-mode .evaluator-training-panel > #evaluatorTrainingWorkspaceSummary .panel-description {
  margin: 0;
}

body.app-body.evaluator-mode .evaluator-training-controls {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(220px, 0.7fr);
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 8px;
  background: var(--color-surface-muted, #f1f4f6);
}

body.app-body.evaluator-mode .evaluator-training-controls label,
body.app-body.evaluator-mode .evaluator-training-controls input,
body.app-body.evaluator-mode .evaluator-training-controls select {
  min-width: 0;
  width: 100%;
}

body.app-body.evaluator-mode .evaluator-training-controls label > span {
  display: block;
  margin-bottom: 6px;
  color: var(--color-text-muted, #657789);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.app-body.evaluator-mode .evaluator-training-overview {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

body.app-body.evaluator-mode .evaluator-training-overview article {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 124px;
  padding: 14px;
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 8px;
  background: var(--color-surface-muted, #f1f4f6);
}

body.app-body.evaluator-mode .evaluator-training-overview span,
body.app-body.evaluator-mode .evaluator-training-progress-grid span {
  color: var(--color-text-muted, #657789);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

body.app-body.evaluator-mode .evaluator-training-overview strong {
  color: var(--color-navy, #102534);
  font-size: 26px;
  line-height: 1;
}

body.app-body.evaluator-mode .evaluator-training-overview small {
  color: var(--color-text-muted, #657789);
  font-size: 12px;
  line-height: 1.35;
}

body.app-body.evaluator-mode .evaluator-training-attention {
  padding: 18px;
  border: 1px solid #294657;
  border-radius: 8px;
  background: var(--color-navy, #102534);
  color: #f8f7f2;
}

body.app-body.evaluator-mode .evaluator-training-attention-heading,
body.app-body.evaluator-mode .evaluator-training-detail-heading,
body.app-body.evaluator-mode .evaluator-training-cycle-card-head,
body.app-body.evaluator-mode .evaluator-training-cycle-card-footer,
body.app-body.evaluator-mode .evaluator-training-session-row,
body.app-body.evaluator-mode .evaluator-training-next-action {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

body.app-body.evaluator-mode .evaluator-training-attention .eyebrow,
body.app-body.evaluator-mode .evaluator-training-attention h3,
body.app-body.evaluator-mode .evaluator-training-attention p,
body.app-body.evaluator-mode .evaluator-training-attention strong {
  color: inherit;
}

body.app-body.evaluator-mode .evaluator-training-attention h3 {
  margin: 3px 0 0;
}

body.app-body.evaluator-mode .evaluator-training-attention-list {
  display: grid;
  margin-top: 12px;
}

body.app-body.evaluator-mode .evaluator-training-attention-list article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}

body.app-body.evaluator-mode .evaluator-training-attention-list p {
  margin: 4px 0 0;
  color: #dbe5e8;
  font-size: 13px;
}

body.app-body.evaluator-mode .evaluator-training-attention-list small {
  display: block;
  margin-top: 6px;
  color: #c7d5da;
  font-size: 11px;
  line-height: 1.4;
}

body.app-body.evaluator-mode .evaluator-training-attention-list article.is-grouped {
  border-left: 3px solid var(--color-gold, #c5a15b);
  padding-left: 12px;
}

body.app-body.evaluator-mode .evaluator-training-attention-list .secondary-button {
  flex: 0 0 auto;
  border-color: #fff;
  background: #fff;
  color: var(--color-navy, #102534);
}

body.app-body.evaluator-mode .evaluator-training-clear {
  padding: 4px 0;
}

body.app-body.evaluator-mode .evaluator-training-clear p {
  margin: 5px 0 0;
  color: #dbe5e8;
}

body.app-body.evaluator-mode .evaluator-training-action-toggle {
  margin-top: 12px;
  border-color: rgba(255, 255, 255, 0.7);
  color: #fff;
}

body.app-body.evaluator-mode .evaluator-training-action-toggle:hover,
body.app-body.evaluator-mode .evaluator-training-action-toggle:focus-visible {
  background: rgba(255, 255, 255, 0.1);
}

body.app-body.evaluator-mode .evaluator-training-layout {
  display: grid;
  grid-template-columns: minmax(310px, 0.78fr) minmax(0, 1.55fr);
  align-items: start;
  gap: 16px;
}

body.app-body.evaluator-mode .evaluator-training-list-panel,
body.app-body.evaluator-mode .evaluator-training-detail {
  min-width: 0;
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 8px;
  background: var(--color-surface, #ffffff);
  box-shadow: var(--shadow-card, 0 8px 22px rgba(14, 31, 44, 0.08));
}

body.app-body.evaluator-mode .evaluator-training-list-panel {
  display: grid;
  gap: 12px;
  max-height: calc(100vh - 170px);
  padding: 15px;
  overflow: auto;
}

body.app-body.evaluator-mode .evaluator-training-list-panel h3,
body.app-body.evaluator-mode .evaluator-training-detail h3,
body.app-body.evaluator-mode .evaluator-training-detail h4 {
  margin: 3px 0 0;
}

body.app-body.evaluator-mode .evaluator-training-cycle-list {
  display: grid;
  gap: 10px;
}

body.app-body.evaluator-mode .evaluator-training-cycle-card,
body.app-body.evaluator-mode .evaluator-training-detail-section,
body.app-body.evaluator-mode .evaluator-training-empty,
body.app-body.evaluator-mode .evaluator-training-detail-empty {
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 8px;
  background: var(--color-surface, #ffffff);
}

body.app-body.evaluator-mode .evaluator-training-cycle-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}

body.app-body.evaluator-mode .evaluator-training-cycle-card.is-selected {
  border-color: var(--color-gold, #c5a15b);
  box-shadow: inset 3px 0 0 var(--color-gold, #c5a15b);
}

body.app-body.evaluator-mode .evaluator-training-cycle-card h4 {
  margin: 2px 0 0;
}

body.app-body.evaluator-mode .evaluator-training-cycle-card-head p,
body.app-body.evaluator-mode .evaluator-training-cycle-card-footer p {
  margin: 4px 0 0;
  color: var(--color-text-muted, #657789);
  font-size: 12px;
  line-height: 1.4;
}

body.app-body.evaluator-mode .evaluator-training-cycle-card-facts,
body.app-body.evaluator-mode .evaluator-training-identity-grid,
body.app-body.evaluator-mode .evaluator-training-term-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 7px;
  background: var(--color-border, #d6dde4);
}

body.app-body.evaluator-mode .evaluator-training-cycle-card-facts div,
body.app-body.evaluator-mode .evaluator-training-identity-grid div,
body.app-body.evaluator-mode .evaluator-training-term-grid div {
  min-width: 0;
  padding: 9px;
  background: var(--color-surface-muted, #f1f4f6);
}

body.app-body.evaluator-mode .evaluator-training-cycle-card-facts dt,
body.app-body.evaluator-mode .evaluator-training-identity-grid dt,
body.app-body.evaluator-mode .evaluator-training-term-grid dt {
  color: var(--color-text-muted, #657789);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

body.app-body.evaluator-mode .evaluator-training-cycle-card-facts dd,
body.app-body.evaluator-mode .evaluator-training-identity-grid dd,
body.app-body.evaluator-mode .evaluator-training-term-grid dd {
  margin: 4px 0 0;
  color: var(--color-navy, #102534);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.app-body.evaluator-mode .evaluator-training-detail {
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 440px;
  padding: 18px;
}

body.app-body.evaluator-mode .evaluator-training-detail-empty,
body.app-body.evaluator-mode .evaluator-training-empty {
  padding: 22px;
  color: var(--color-text-muted, #657789);
}

body.app-body.evaluator-mode .evaluator-training-detail-empty h3,
body.app-body.evaluator-mode .evaluator-training-empty strong {
  color: var(--color-navy, #102534);
}

body.app-body.evaluator-mode .evaluator-training-detail-heading > div > p,
body.app-body.evaluator-mode .evaluator-training-detail-heading .eyebrow {
  margin-bottom: 0;
}

body.app-body.evaluator-mode .evaluator-training-detail-heading > div > h3 + p {
  margin: 5px 0 0;
  color: var(--color-text-muted, #657789);
}

body.app-body.evaluator-mode .evaluator-training-detail-section {
  padding: 16px;
}

body.app-body.evaluator-mode .evaluator-training-progress-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

body.app-body.evaluator-mode .evaluator-training-progress-grid article {
  min-width: 0;
  padding: 12px;
  border-radius: 7px;
  background: var(--color-surface-muted, #f1f4f6);
}

body.app-body.evaluator-mode .evaluator-training-progress-grid strong {
  display: block;
  margin-top: 5px;
  color: var(--color-navy, #102534);
  font-size: 19px;
  overflow-wrap: anywhere;
}

body.app-body.evaluator-mode .evaluator-training-term-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 12px;
}

body.app-body.evaluator-mode .evaluator-training-term-note {
  margin: 12px 0 0;
  color: var(--color-text-muted, #657789);
  font-size: 13px;
  line-height: 1.5;
}

body.app-body.evaluator-mode .evaluator-training-phase-callout {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 7px;
  background: var(--color-surface-muted, #f1f4f6);
}

body.app-body.evaluator-mode .evaluator-training-phase-callout.is-grace {
  border-color: #d7bf82;
  background: #fff8e9;
}

body.app-body.evaluator-mode .evaluator-training-phase-callout strong {
  color: var(--color-navy, #102534);
}

body.app-body.evaluator-mode .evaluator-training-phase-callout p,
body.app-body.evaluator-mode .evaluator-training-makeup-range {
  margin: 5px 0 0;
  color: var(--color-text-muted, #657789);
  font-size: 13px;
  line-height: 1.5;
}

body.app-body.evaluator-mode .evaluator-training-next-action {
  align-items: center;
  border-color: #d7bf82;
  background: #fff7e8;
}

body.app-body.evaluator-mode .evaluator-training-next-action p {
  margin: 5px 0 0;
  color: var(--color-text-muted, #657789);
}

body.app-body.evaluator-mode .evaluator-training-session-list {
  display: grid;
  margin-top: 12px;
}

body.app-body.evaluator-mode .evaluator-training-session-row {
  align-items: center;
  padding: 13px 0;
  border-top: 1px solid var(--color-border, #d6dde4);
}

body.app-body.evaluator-mode .evaluator-training-session-row:first-child {
  border-top: 0;
  padding-top: 0;
}

body.app-body.evaluator-mode .evaluator-training-session-row > div:first-child {
  display: grid;
  min-width: 0;
  gap: 3px;
}

body.app-body.evaluator-mode .evaluator-training-session-row span,
body.app-body.evaluator-mode .evaluator-training-session-row small {
  color: var(--color-text-muted, #657789);
  line-height: 1.35;
}

body.app-body.evaluator-mode .evaluator-training-session-row > div:nth-child(2) {
  display: grid;
  justify-items: end;
  gap: 5px;
}

body.app-body.evaluator-mode .evaluator-training-legacy-note {
  border-color: #d8c28c;
  background: #fff8e9;
}

body.app-body.evaluator-mode .evaluator-training-makeup-context {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 14px 0 0;
  overflow: hidden;
  border: 1px solid var(--color-border, #d6dde4);
  border-radius: 7px;
  background: var(--color-border, #d6dde4);
}

body.app-body.evaluator-mode .evaluator-training-makeup-context div {
  min-width: 0;
  padding: 10px;
  background: var(--color-surface-muted, #f1f4f6);
}

body.app-body.evaluator-mode .evaluator-training-makeup-context dt {
  color: var(--color-text-muted, #657789);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

body.app-body.evaluator-mode .evaluator-training-makeup-context dd {
  margin: 5px 0 0;
  color: var(--color-navy, #102534);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

body.app-body.evaluator-mode .evaluator-training-member-feedback {
  border-top: 1px solid var(--color-border, #d6dde4);
  padding-top: 14px;
}

body.app-body.evaluator-mode .evaluator-training-internal-note {
  border: 1px solid #d7bf82;
  border-radius: 7px;
  padding: 12px;
  background: #fff8e9;
}

body.app-body.evaluator-mode .evaluator-training-report-actions {
  justify-content: flex-end;
}

body.app-body.evaluator-mode .evaluator-training-back {
  justify-self: start;
}

@media (max-width: 1180px) {
  body.app-body.evaluator-mode .evaluator-training-overview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.app-body.evaluator-mode .evaluator-training-layout { grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.4fr); }
}

@media (max-width: 820px) {
  body.app-body.evaluator-mode .evaluator-training-layout { grid-template-columns: 1fr; }
  body.app-body.evaluator-mode .evaluator-training-list-panel { max-height: none; }
  body.app-body.evaluator-mode .evaluator-training-detail { min-height: 0; }
  body.app-body.evaluator-mode .evaluator-training-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  body.app-body.evaluator-mode .evaluator-training-controls,
  body.app-body.evaluator-mode .evaluator-training-cycle-card-facts,
  body.app-body.evaluator-mode .evaluator-training-identity-grid,
  body.app-body.evaluator-mode .evaluator-training-term-grid,
  body.app-body.evaluator-mode .evaluator-training-makeup-context,
  body.app-body.evaluator-mode .evaluator-training-progress-grid { grid-template-columns: 1fr; }
  body.app-body.evaluator-mode .evaluator-training-attention-heading,
  body.app-body.evaluator-mode .evaluator-training-attention-list article,
  body.app-body.evaluator-mode .evaluator-training-detail-heading,
  body.app-body.evaluator-mode .evaluator-training-cycle-card-head,
  body.app-body.evaluator-mode .evaluator-training-cycle-card-footer,
  body.app-body.evaluator-mode .evaluator-training-session-row,
  body.app-body.evaluator-mode .evaluator-training-next-action { align-items: stretch; flex-direction: column; }
  body.app-body.evaluator-mode .evaluator-training-attention-list .secondary-button,
  body.app-body.evaluator-mode .evaluator-training-session-row button,
  body.app-body.evaluator-mode .evaluator-training-next-action button,
  body.app-body.evaluator-mode .evaluator-training-cycle-card-footer button,
  body.app-body.evaluator-mode .evaluator-training-report-actions button { width: 100%; }
  body.app-body.evaluator-mode .evaluator-training-session-row > div:nth-child(2) { justify-items: start; }
  body.app-body.evaluator-mode .evaluator-training-detail { padding: 14px; }
  body.app-body.evaluator-mode .evaluator-training-detail-section { padding: 13px; }
}

@media (max-width: 430px) {
  body.app-body.evaluator-mode .evaluator-training-panel { gap: 13px; }
  body.app-body.evaluator-mode .evaluator-training-overview { gap: 8px; }
  body.app-body.evaluator-mode .evaluator-training-overview article { min-height: 98px; padding: 11px; }
  body.app-body.evaluator-mode .evaluator-training-overview strong { font-size: 23px; }
  body.app-body.evaluator-mode .evaluator-training-overview small { font-size: 11px; }
  body.app-body.evaluator-mode .evaluator-training-attention { padding: 14px; }
  body.app-body.evaluator-mode .evaluator-training-attention-list article { padding: 12px 0; }
  body.app-body.evaluator-mode .evaluator-training-action-toggle { width: 100%; }
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open > .panel-heading,
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open > #evaluatorTrainingWorkspaceSummary,
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open > .evaluator-training-controls,
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open > #evaluatorTrainingOverview,
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open > #evaluatorTrainingNeedsAttention,
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open .evaluator-training-list-panel { display: none; }
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open .evaluator-training-layout { display: block; }
  body.app-body.evaluator-mode .evaluator-training-panel.is-mobile-detail-open .evaluator-training-detail { display: grid; min-width: 0; }
}

/* Phase 4B-4: Supervisor Training, Payments, Commission, and Account workspaces. */
body.app-body.supervisor-mode .supervisor-workspace-panel {
  display: grid;
  gap: 16px;
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-workspace-panel[hidden] {
  display: none;
}

body.app-body.supervisor-mode .supervisor-split-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(320px, 0.82fr);
  gap: 16px;
  align-items: start;
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-record-list,
body.app-body.supervisor-mode .supervisor-ledger-list,
body.app-body.supervisor-mode .supervisor-payout-list,
body.app-body.supervisor-mode .supervisor-evaluator-permissions {
  display: grid;
  gap: 10px;
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-workspace-detail {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 16px;
  min-width: 0;
  min-height: 260px;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.supervisor-mode .supervisor-workspace-record {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
}

body.app-body.supervisor-mode .supervisor-workspace-record.is-selected {
  border-color: rgba(194, 155, 72, 0.82);
  box-shadow: inset 3px 0 0 var(--brand-gold), var(--shadow-card);
}

body.app-body.supervisor-mode .supervisor-workspace-record-head,
body.app-body.supervisor-mode .supervisor-workspace-record-footer,
body.app-body.supervisor-mode .supervisor-detail-heading,
body.app-body.supervisor-mode .supervisor-ledger-row,
body.app-body.supervisor-mode .supervisor-payout-row,
body.app-body.supervisor-mode .supervisor-identity-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-workspace-record h4,
body.app-body.supervisor-mode .supervisor-detail-heading h3,
body.app-body.supervisor-mode .supervisor-commission-section h3,
body.app-body.supervisor-mode .supervisor-account-section h3 {
  margin: 2px 0 3px;
  color: var(--color-brand-primary);
  font-size: 16px;
  line-height: 1.3;
}

body.app-body.supervisor-mode .supervisor-workspace-record p,
body.app-body.supervisor-mode .supervisor-detail-heading p,
body.app-body.supervisor-mode .supervisor-payout-row p,
body.app-body.supervisor-mode .supervisor-account-rate p {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  line-height: 1.45;
}

body.app-body.supervisor-mode .supervisor-workspace-record-facts,
body.app-body.supervisor-mode .supervisor-detail-facts,
body.app-body.supervisor-mode .supervisor-identity-card dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px 12px;
  margin: 0;
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-workspace-record-facts div,
body.app-body.supervisor-mode .supervisor-detail-facts div,
body.app-body.supervisor-mode .supervisor-identity-card dl div {
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-workspace-record-facts dt,
body.app-body.supervisor-mode .supervisor-detail-facts dt,
body.app-body.supervisor-mode .supervisor-identity-card dt {
  color: var(--color-text-muted-accessible);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: .04em;
  text-transform: uppercase;
}

body.app-body.supervisor-mode .supervisor-workspace-record-facts dd,
body.app-body.supervisor-mode .supervisor-detail-facts dd,
body.app-body.supervisor-mode .supervisor-identity-card dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.35;
}

body.app-body.supervisor-mode .supervisor-workspace-record-footer {
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid var(--color-border);
}

body.app-body.supervisor-mode .supervisor-workspace-record-footer p {
  margin: 0;
  max-width: 70%;
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  line-height: 1.45;
}

body.app-body.supervisor-mode .supervisor-workspace-record-footer .secondary-button,
body.app-body.supervisor-mode .supervisor-detail-section .primary-button,
body.app-body.supervisor-mode .supervisor-detail-section .secondary-button {
  flex: 0 0 auto;
}

body.app-body.supervisor-mode .supervisor-next-event {
  display: grid;
  gap: 3px;
  padding: 12px;
  border: 1px solid rgba(42, 125, 114, 0.3);
  border-radius: var(--radius-control);
  background: var(--color-success-surface);
}

body.app-body.supervisor-mode .supervisor-next-event.is-empty {
  border-color: var(--color-border);
  background: var(--color-surface-muted);
}

body.app-body.supervisor-mode .supervisor-next-event span,
body.app-body.supervisor-mode .supervisor-next-event small {
  color: var(--color-text-muted-accessible);
  font-size: 11px;
  line-height: 1.35;
}

body.app-body.supervisor-mode .supervisor-next-event strong {
  color: var(--color-brand-primary);
  font-size: 14px;
}

body.app-body.supervisor-mode .supervisor-session-history {
  display: grid;
  gap: 7px;
  padding: 0;
  margin: 0;
  list-style: none;
}

body.app-body.supervisor-mode .supervisor-session-history li {
  display: grid;
  gap: 2px;
  padding: 9px 0;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text-muted-accessible);
  font-size: 12px;
}

body.app-body.supervisor-mode .supervisor-session-history li:last-child { border-bottom: 0; }

body.app-body.supervisor-mode .supervisor-payment-entry {
  padding: 16px;
  border: 1px solid rgba(194, 155, 72, 0.45);
  border-radius: var(--radius-surface);
  background: var(--color-warning-surface);
}

body.app-body.supervisor-mode .supervisor-payment-entry .section-heading-row { margin-bottom: 12px; }

body.app-body.supervisor-mode .supervisor-commission-layout,
body.app-body.supervisor-mode .supervisor-account-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  gap: 16px;
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-commission-section,
body.app-body.supervisor-mode .supervisor-account-section,
body.app-body.supervisor-mode .supervisor-identity-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.supervisor-mode .supervisor-commission-callout {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  border: 1px solid rgba(42, 125, 114, 0.35);
  border-radius: var(--radius-surface);
  background: var(--color-success-surface);
}

body.app-body.supervisor-mode .supervisor-commission-callout.is-carry {
  border-color: rgba(194, 155, 72, 0.48);
  background: var(--color-warning-surface);
}

body.app-body.supervisor-mode .supervisor-commission-callout h3,
body.app-body.supervisor-mode .supervisor-commission-callout p { margin: 0; }
body.app-body.supervisor-mode .supervisor-commission-callout h3 { color: var(--color-brand-primary); font-size: 24px; }
body.app-body.supervisor-mode .supervisor-commission-callout p:not(.eyebrow) { color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.45; }

body.app-body.supervisor-mode .supervisor-ledger-row,
body.app-body.supervisor-mode .supervisor-payout-row {
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--color-border);
}

body.app-body.supervisor-mode .supervisor-ledger-row:last-child,
body.app-body.supervisor-mode .supervisor-payout-row:last-child { border-bottom: 0; }

body.app-body.supervisor-mode .supervisor-ledger-row div,
body.app-body.supervisor-mode .supervisor-payout-row div { display: grid; gap: 3px; min-width: 0; }
body.app-body.supervisor-mode .supervisor-ledger-row span,
body.app-body.supervisor-mode .supervisor-payout-row span:not(.status-chip) { color: var(--color-text-muted-accessible); font-size: 12px; overflow-wrap: anywhere; }
body.app-body.supervisor-mode .supervisor-ledger-row > strong { color: var(--color-success); white-space: nowrap; }
body.app-body.supervisor-mode .supervisor-ledger-row > strong.is-negative { color: var(--color-warning); }

body.app-body.supervisor-mode .supervisor-account-layout { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.app-body.supervisor-mode .supervisor-account-section { display: grid; align-content: start; gap: 8px; }
body.app-body.supervisor-mode .supervisor-account-rate { display: grid; gap: 7px; }
body.app-body.supervisor-mode .supervisor-account-rate strong { color: var(--color-brand-primary); font-size: 28px; line-height: 1; }
body.app-body.supervisor-mode .supervisor-account-actions { display: grid; gap: 8px; margin-top: 5px; }

body.app-body.supervisor-mode .supervisor-identity-card { align-items: center; }
body.app-body.supervisor-mode .supervisor-account-avatar { display: inline-grid; width: 50px; height: 50px; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--color-brand-primary); color: var(--color-surface); font-size: 16px; font-weight: 850; }
body.app-body.supervisor-mode .supervisor-identity-card > div { min-width: 0; flex: 1 1 auto; }
body.app-body.supervisor-mode .supervisor-identity-card h3,
body.app-body.supervisor-mode .supervisor-identity-card p { margin: 0; }
body.app-body.supervisor-mode .supervisor-identity-card p:not(.eyebrow) { color: var(--color-text-muted-accessible); font-size: 13px; overflow-wrap: anywhere; }
body.app-body.supervisor-mode .supervisor-identity-card dl { min-width: min(100%, 300px); grid-template-columns: repeat(2, minmax(0, 1fr)); }

body.app-body.supervisor-mode .supervisor-evaluator-permissions article {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 9px 0;
  border-bottom: 1px solid var(--color-border);
}

body.app-body.supervisor-mode .supervisor-evaluator-permissions article:last-child { border-bottom: 0; }
body.app-body.supervisor-mode .supervisor-evaluator-permissions article > span { display: inline-grid; width: 28px; height: 28px; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--color-information-surface); color: var(--color-information); font-size: 10px; font-weight: 800; }
body.app-body.supervisor-mode .supervisor-evaluator-permissions article div { display: grid; min-width: 0; gap: 2px; }
body.app-body.supervisor-mode .supervisor-evaluator-permissions small { overflow-wrap: anywhere; color: var(--color-text-muted-accessible); font-size: 11px; }
body.app-body.supervisor-mode .supervisor-evaluator-permissions em { margin-left: auto; color: var(--color-success); font-size: 11px; font-style: normal; font-weight: 800; }

/* Phase 4C-6: Evaluator longitudinal Performance History. */
body.app-body.evaluator-mode .evaluator-performance-history-panel {
  display: grid;
  gap: 22px;
}

body.app-body.evaluator-mode .evaluator-performance-history-heading {
  align-items: flex-start;
}

body.app-body.evaluator-mode .evaluator-performance-history-heading .quiet-button {
  flex: 0 0 auto;
}

body.app-body.evaluator-mode .evaluator-performance-history {
  display: grid;
  gap: 20px;
  min-width: 0;
}

body.app-body.evaluator-mode .performance-history-loading {
  display: grid;
  gap: 6px;
  padding: 22px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface-muted);
  color: var(--color-text-muted-accessible);
}

body.app-body.evaluator-mode .performance-history-loading strong {
  color: var(--color-brand-primary);
  font-size: 16px;
}

body.app-body.evaluator-mode .performance-history-loading p { margin: 0; line-height: 1.5; }
body.app-body.evaluator-mode .performance-history-loading.is-error { border-color: rgba(178, 69, 62, 0.42); background: var(--color-danger-surface); }

body.app-body.evaluator-mode .performance-history-athlete-header,
body.app-body.evaluator-mode .performance-history-cycle-heading,
body.app-body.evaluator-mode .performance-history-episode-heading,
body.app-body.evaluator-mode .performance-history-coaching-heading,
body.app-body.evaluator-mode .performance-history-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

body.app-body.evaluator-mode .performance-history-athlete-header {
  padding: 20px;
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-brand-teal);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.evaluator-mode .performance-history-athlete-header h3,
body.app-body.evaluator-mode .performance-history-athlete-header p,
body.app-body.evaluator-mode .performance-history-section-heading h3,
body.app-body.evaluator-mode .performance-history-section-heading p,
body.app-body.evaluator-mode .performance-history-cycle-heading h4,
body.app-body.evaluator-mode .performance-history-cycle-heading p,
body.app-body.evaluator-mode .performance-history-episode-heading h4,
body.app-body.evaluator-mode .performance-history-episode-heading p,
body.app-body.evaluator-mode .performance-history-coaching-heading p { margin: 0; }

body.app-body.evaluator-mode .performance-history-athlete-header h3,
body.app-body.evaluator-mode .performance-history-section-heading h3 { color: var(--color-brand-primary); }
body.app-body.evaluator-mode .performance-history-athlete-header h3 { font-size: 26px; }
body.app-body.evaluator-mode .performance-history-athlete-header p:not(.eyebrow),
body.app-body.evaluator-mode .performance-history-section-heading p:not(.eyebrow),
body.app-body.evaluator-mode .performance-history-episode-heading p:not(.eyebrow),
body.app-body.evaluator-mode .performance-history-cycle-heading p:not(.eyebrow) { color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.45; }

body.app-body.evaluator-mode .performance-history-athlete-header dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(130px, 1fr));
  gap: 12px;
  margin: 0;
}

body.app-body.evaluator-mode .performance-history-athlete-header dt,
body.app-body.evaluator-mode .performance-history-facts-grid dt,
body.app-body.evaluator-mode .performance-history-cycle-progress span,
body.app-body.evaluator-mode .performance-history-snapshot-grid span,
body.app-body.evaluator-mode .performance-history-context-grid span,
body.app-body.evaluator-mode .performance-history-score-comparison > article > span,
body.app-body.evaluator-mode .performance-history-coaching-list dt {
  color: var(--color-text-muted-accessible);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.35;
  text-transform: uppercase;
}

body.app-body.evaluator-mode .performance-history-athlete-header dd,
body.app-body.evaluator-mode .performance-history-facts-grid dd { margin: 4px 0 0; color: var(--color-text); font-size: 13px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }

body.app-body.evaluator-mode .performance-history-section {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding-top: 20px;
  border-top: 1px solid var(--color-border);
}

body.app-body.evaluator-mode .performance-history-section-heading h3 { font-size: 21px; }
body.app-body.evaluator-mode .performance-history-section-heading p { margin-top: 5px; max-width: 720px; }
body.app-body.evaluator-mode .performance-history-empty-copy { margin: 0; padding: 14px; color: var(--color-text-muted-accessible); border: 1px dashed var(--color-border-strong); border-radius: var(--radius-control); background: var(--color-surface-muted); line-height: 1.45; }

body.app-body.evaluator-mode .performance-history-snapshot {
  display: grid;
  gap: 14px;
  padding: 20px;
  border: 1px solid rgba(42, 125, 114, .3);
  border-radius: var(--radius-surface);
  background: linear-gradient(130deg, var(--color-success-surface), var(--color-surface));
}

body.app-body.evaluator-mode .performance-history-snapshot-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  overflow: hidden;
  background: var(--color-surface);
}

body.app-body.evaluator-mode .performance-history-snapshot-grid article {
  display: grid;
  min-width: 0;
  gap: 6px;
  padding: 14px;
  border-right: 1px solid var(--color-border);
}

body.app-body.evaluator-mode .performance-history-snapshot-grid article:last-child { border-right: 0; }
body.app-body.evaluator-mode .performance-history-snapshot-grid article.is-focus { grid-column: span 2; border-top: 1px solid var(--color-border); background: rgba(42, 125, 114, .06); }
body.app-body.evaluator-mode .performance-history-snapshot-grid strong { overflow-wrap: anywhere; color: var(--color-brand-primary); font-size: 17px; line-height: 1.25; }
body.app-body.evaluator-mode .performance-history-snapshot-grid small { color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.4; }

body.app-body.evaluator-mode .performance-history-episode-list,
body.app-body.evaluator-mode .performance-history-cycle-list,
body.app-body.evaluator-mode .performance-history-coaching-list,
body.app-body.evaluator-mode .performance-history-no-show-list { display: grid; gap: 12px; }

body.app-body.evaluator-mode .performance-history-episode-card,
body.app-body.evaluator-mode .performance-history-cycle-card,
body.app-body.evaluator-mode .performance-history-coaching-list > article,
body.app-body.evaluator-mode .performance-history-no-show-list > article {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.evaluator-mode .performance-history-episode-card { border-left: 3px solid var(--color-gold); }
body.app-body.evaluator-mode .performance-history-episode-heading h4,
body.app-body.evaluator-mode .performance-history-cycle-heading h4 { color: var(--color-brand-primary); font-size: 18px; }
body.app-body.evaluator-mode .performance-history-episode-score { display: flex; align-items: baseline; gap: 8px; margin: 14px 0; }
body.app-body.evaluator-mode .performance-history-episode-score strong { color: var(--color-brand-primary); font-size: 26px; line-height: 1; }
body.app-body.evaluator-mode .performance-history-episode-score span { color: var(--color-text-muted-accessible); font-size: 12px; }

body.app-body.evaluator-mode .performance-history-facts-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  overflow: hidden;
}

body.app-body.evaluator-mode .performance-history-facts-grid > div { min-width: 0; padding: 10px; border-right: 1px solid var(--color-border); }
body.app-body.evaluator-mode .performance-history-facts-grid > div:last-child { border-right: 0; }
body.app-body.evaluator-mode .performance-history-episode-cycle-links { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
body.app-body.evaluator-mode .performance-history-episode-cycle-links span { padding: 6px 8px; color: var(--color-brand-primary); border-radius: 999px; background: var(--color-information-surface); font-size: 11px; font-weight: 800; }
body.app-body.evaluator-mode .performance-history-episode-empty { margin: 12px 0 0; color: var(--color-text-muted-accessible); font-size: 12px; }

body.app-body.evaluator-mode .performance-history-context-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
body.app-body.evaluator-mode .performance-history-context-grid article { display: grid; gap: 5px; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface-muted); }
body.app-body.evaluator-mode .performance-history-context-grid article:first-child { border-color: rgba(42, 125, 114, .4); background: var(--color-success-surface); }
body.app-body.evaluator-mode .performance-history-context-grid strong { color: var(--color-brand-primary); font-size: 17px; line-height: 1.25; }
body.app-body.evaluator-mode .performance-history-context-grid small { color: var(--color-text-muted-accessible); font-size: 12px; }

body.app-body.evaluator-mode .performance-history-metric-table { display: grid; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-surface); background: var(--color-surface); }
body.app-body.evaluator-mode .performance-history-metric-head,
body.app-body.evaluator-mode .performance-history-metric-table article { display: grid; grid-template-columns: minmax(170px, 1.55fr) repeat(5, minmax(95px, .85fr)); min-width: 0; }
body.app-body.evaluator-mode .performance-history-metric-head { background: var(--color-surface-muted); }
body.app-body.evaluator-mode .performance-history-metric-head span { padding: 10px; color: var(--color-text-muted-accessible); font-size: 10px; font-weight: 850; letter-spacing: .06em; line-height: 1.3; text-transform: uppercase; }
body.app-body.evaluator-mode .performance-history-metric-table article { border-top: 1px solid var(--color-border); }
body.app-body.evaluator-mode .performance-history-metric-table article > div { display: grid; align-content: start; gap: 3px; min-width: 0; padding: 10px; border-right: 1px solid var(--color-border); }
body.app-body.evaluator-mode .performance-history-metric-table article > div:last-child { border-right: 0; }
body.app-body.evaluator-mode .performance-history-metric-table article strong { color: var(--color-text); font-size: 12px; line-height: 1.35; overflow-wrap: anywhere; }
body.app-body.evaluator-mode .performance-history-metric-table article small { color: var(--color-text-muted-accessible); font-size: 10px; line-height: 1.35; }
body.app-body.evaluator-mode .performance-history-score { width: max-content; margin-top: 3px; padding: 3px 6px; border-radius: 999px; color: #fff; font-size: 10px; font-weight: 850; }
body.app-body.evaluator-mode .performance-history-score.score-0 { background: var(--red); }
body.app-body.evaluator-mode .performance-history-score.score-1 { background: var(--orange); }
body.app-body.evaluator-mode .performance-history-score.score-2,
body.app-body.evaluator-mode .performance-history-score.score-3 { background: var(--green); }
body.app-body.evaluator-mode .performance-history-score.score-na { background: var(--color-text-muted-accessible); }

body.app-body.evaluator-mode .performance-history-score-comparison { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
body.app-body.evaluator-mode .performance-history-score-comparison > article { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface); }
body.app-body.evaluator-mode .performance-history-score-comparison > article > div { display: grid; gap: 3px; }
body.app-body.evaluator-mode .performance-history-score-comparison strong { color: var(--color-brand-primary); font-size: 15px; line-height: 1.25; }
body.app-body.evaluator-mode .performance-history-score-comparison small { color: var(--color-text-muted-accessible); font-size: 10px; text-transform: uppercase; }

body.app-body.evaluator-mode .performance-history-cycle-card { display: grid; gap: 13px; border-left: 3px solid var(--color-brand-teal); }
body.app-body.evaluator-mode .performance-history-cycle-progress { display: grid; grid-template-columns: auto 1fr; align-items: baseline; column-gap: 8px; row-gap: 3px; }
body.app-body.evaluator-mode .performance-history-cycle-progress strong { grid-row: span 2; color: var(--color-brand-primary); font-size: 28px; line-height: 1; }
body.app-body.evaluator-mode .performance-history-cycle-progress small { grid-column: 2; color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.4; }
body.app-body.evaluator-mode .performance-history-cycle-stat-row { display: flex; flex-wrap: wrap; gap: 8px 18px; padding-top: 12px; border-top: 1px solid var(--color-border); color: var(--color-text-muted-accessible); font-size: 12px; }
body.app-body.evaluator-mode .performance-history-cycle-stat-row strong { color: var(--color-text); }

body.app-body.evaluator-mode .performance-history-session-chart { padding: 14px; border: 1px solid var(--color-border); border-radius: var(--radius-surface); background: var(--color-surface); }
body.app-body.evaluator-mode .performance-history-session-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
body.app-body.evaluator-mode .performance-history-session-chart text { fill: var(--color-text-muted-accessible); font-size: 10px; font-family: inherit; }
body.app-body.evaluator-mode .performance-history-session-chart .performance-history-chart-grid { stroke: var(--color-border); stroke-width: 1; }
body.app-body.evaluator-mode .performance-history-session-chart .performance-history-chart-line { fill: none; stroke: var(--color-brand-teal); stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
body.app-body.evaluator-mode .performance-history-session-chart .performance-history-chart-point { fill: var(--color-surface); stroke: var(--color-brand-teal); stroke-width: 3; }
body.app-body.evaluator-mode .performance-history-session-chart .performance-history-chart-value { fill: var(--color-brand-teal); font-size: 12px; font-weight: 850; }
body.app-body.evaluator-mode .performance-history-session-score-list { display: flex; flex-wrap: wrap; gap: 8px; }
body.app-body.evaluator-mode .performance-history-session-score-list article,
body.app-body.evaluator-mode .performance-history-single-score { display: grid; gap: 3px; padding: 10px; border: 1px solid rgba(42, 125, 114, .28); border-radius: var(--radius-control); background: var(--color-success-surface); }
body.app-body.evaluator-mode .performance-history-session-score-list strong,
body.app-body.evaluator-mode .performance-history-single-score strong,
body.app-body.evaluator-mode .performance-history-session-score { color: var(--color-brand-teal); font-size: 16px; }
body.app-body.evaluator-mode .performance-history-session-score-list span,
body.app-body.evaluator-mode .performance-history-session-score-list small,
body.app-body.evaluator-mode .performance-history-single-score span,
body.app-body.evaluator-mode .performance-history-single-score p { color: var(--color-text-muted-accessible); font-size: 11px; line-height: 1.35; }
body.app-body.evaluator-mode .performance-history-single-score { grid-template-columns: auto 1fr; align-items: center; gap: 14px; }
body.app-body.evaluator-mode .performance-history-single-score small { font-size: 12px; }
body.app-body.evaluator-mode .performance-history-single-score p { margin: 2px 0 0; }

body.app-body.evaluator-mode .performance-history-coaching-list > article { display: grid; gap: 14px; }
body.app-body.evaluator-mode .performance-history-coaching-heading > div { display: grid; gap: 3px; }
body.app-body.evaluator-mode .performance-history-coaching-heading > div > span { color: var(--color-text-muted-accessible); font-size: 12px; }
body.app-body.evaluator-mode .performance-history-session-score { flex: 0 0 auto; padding: 5px 8px; border-radius: 999px; background: var(--color-success-surface); font-size: 12px; font-weight: 850; }
body.app-body.evaluator-mode .performance-history-coaching-list dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; }
body.app-body.evaluator-mode .performance-history-coaching-list dl > div { min-width: 0; padding: 11px; border-radius: var(--radius-control); background: var(--color-surface-muted); }
body.app-body.evaluator-mode .performance-history-coaching-list dl > div.is-internal { grid-column: span 3; border-left: 3px solid var(--color-gold); background: var(--color-warning-surface); }
body.app-body.evaluator-mode .performance-history-coaching-list dd { margin: 5px 0 0; color: var(--color-text); font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }

body.app-body.evaluator-mode .performance-history-no-show-list > article { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
body.app-body.evaluator-mode .performance-history-no-show-list > article > div { display: grid; align-content: start; gap: 6px; min-width: 0; }
body.app-body.evaluator-mode .performance-history-no-show-list p { margin: 0; color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.4; }

body.app-body.evaluator-mode .evaluator-training-history-action { margin: 0; }

@media (max-width: 1024px) {
  body.app-body.evaluator-mode .performance-history-snapshot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.app-body.evaluator-mode .performance-history-snapshot-grid article:nth-child(2) { border-right: 0; }
  body.app-body.evaluator-mode .performance-history-snapshot-grid article:nth-child(n + 3) { border-top: 1px solid var(--color-border); }
  body.app-body.evaluator-mode .performance-history-snapshot-grid article.is-focus { grid-column: span 2; }
  body.app-body.evaluator-mode .performance-history-score-comparison { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.app-body.evaluator-mode .performance-history-metric-head,
  body.app-body.evaluator-mode .performance-history-metric-table article { grid-template-columns: minmax(150px, 1.5fr) repeat(5, minmax(80px, .85fr)); }
}

@media (max-width: 820px) {
  body.app-body.evaluator-mode .evaluator-performance-history-heading,
  body.app-body.evaluator-mode .performance-history-athlete-header { flex-direction: column; }
  body.app-body.evaluator-mode .evaluator-performance-history-heading .quiet-button { width: 100%; }
  body.app-body.evaluator-mode .performance-history-athlete-header dl,
  body.app-body.evaluator-mode .performance-history-facts-grid { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.app-body.evaluator-mode .performance-history-facts-grid > div:nth-child(2) { border-right: 0; }
  body.app-body.evaluator-mode .performance-history-facts-grid > div:nth-child(n + 3) { border-top: 1px solid var(--color-border); }
  body.app-body.evaluator-mode .performance-history-metric-table { gap: 10px; overflow: visible; border: 0; background: transparent; }
  body.app-body.evaluator-mode .performance-history-metric-head { display: none; }
  body.app-body.evaluator-mode .performance-history-metric-table article { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface); }
  body.app-body.evaluator-mode .performance-history-metric-table article > div { border-right: 0; border-top: 1px solid var(--color-border); }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:first-child { grid-column: span 2; border-top: 0; background: var(--color-surface-muted); }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:nth-child(2n) { border-right: 1px solid var(--color-border); }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:nth-child(2)::before { content: "Current"; }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:nth-child(3)::before { content: "Previous"; }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:nth-child(4)::before { content: "Baseline"; }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:nth-child(5)::before { content: "Change from previous"; }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:nth-child(6)::before { content: "Change from baseline"; }
  body.app-body.evaluator-mode .performance-history-metric-table article > div:not(:first-child)::before { color: var(--color-text-muted-accessible); font-size: 9px; font-weight: 850; letter-spacing: .06em; line-height: 1.35; text-transform: uppercase; }
  body.app-body.evaluator-mode .performance-history-coaching-list dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.app-body.evaluator-mode .performance-history-coaching-list dl > div.is-internal { grid-column: span 2; }
}

@media (max-width: 620px) {
  body.app-body.evaluator-mode .performance-history-panel { padding: 16px; }
  body.app-body.evaluator-mode .performance-history-section-heading,
  body.app-body.evaluator-mode .performance-history-cycle-heading,
  body.app-body.evaluator-mode .performance-history-episode-heading,
  body.app-body.evaluator-mode .performance-history-coaching-heading { flex-direction: column; }
  body.app-body.evaluator-mode .performance-history-snapshot,
  body.app-body.evaluator-mode .performance-history-athlete-header { padding: 16px; }
  body.app-body.evaluator-mode .performance-history-snapshot-grid { grid-template-columns: minmax(0, 1fr); }
  body.app-body.evaluator-mode .performance-history-snapshot-grid article,
  body.app-body.evaluator-mode .performance-history-snapshot-grid article:nth-child(2) { border-right: 0; border-top: 1px solid var(--color-border); }
  body.app-body.evaluator-mode .performance-history-snapshot-grid article:first-child { border-top: 0; }
  body.app-body.evaluator-mode .performance-history-snapshot-grid article.is-focus { grid-column: auto; }
  body.app-body.evaluator-mode .performance-history-context-grid,
  body.app-body.evaluator-mode .performance-history-score-comparison,
  body.app-body.evaluator-mode .performance-history-coaching-list dl,
  body.app-body.evaluator-mode .performance-history-no-show-list > article { grid-template-columns: minmax(0, 1fr); }
  body.app-body.evaluator-mode .performance-history-coaching-list dl > div.is-internal { grid-column: auto; }
  body.app-body.evaluator-mode .performance-history-athlete-header dl,
  body.app-body.evaluator-mode .performance-history-facts-grid { grid-template-columns: minmax(0, 1fr); }
  body.app-body.evaluator-mode .performance-history-athlete-header dl > div,
  body.app-body.evaluator-mode .performance-history-facts-grid > div,
  body.app-body.evaluator-mode .performance-history-facts-grid > div:nth-child(2) { border-right: 0; border-top: 1px solid var(--color-border); }
  body.app-body.evaluator-mode .performance-history-athlete-header dl > div:first-child,
  body.app-body.evaluator-mode .performance-history-facts-grid > div:first-child { border-top: 0; }
  body.app-body.evaluator-mode .performance-history-session-chart { padding: 8px; }
  body.app-body.evaluator-mode .performance-history-session-chart svg g > text:not(.performance-history-chart-value) { display: none; }
  body.app-body.evaluator-mode .performance-history-cycle-stat-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
}

@media (max-width: 1024px) {
  body.app-body.supervisor-mode .supervisor-split-workspace,
  body.app-body.supervisor-mode .supervisor-commission-layout { grid-template-columns: minmax(0, 1fr) minmax(280px, .78fr); }
  body.app-body.supervisor-mode .supervisor-account-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  body.app-body.supervisor-mode .supervisor-split-workspace,
  body.app-body.supervisor-mode .supervisor-commission-layout { grid-template-columns: minmax(0, 1fr); }
  body.app-body.supervisor-mode .supervisor-workspace-detail { position: static; }
  body.app-body.supervisor-mode .supervisor-workspace-record-facts,
  body.app-body.supervisor-mode .supervisor-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  body.app-body.supervisor-mode .supervisor-workspace-record-head,
  body.app-body.supervisor-mode .supervisor-workspace-record-footer,
  body.app-body.supervisor-mode .supervisor-detail-heading,
  body.app-body.supervisor-mode .supervisor-identity-card { align-items: stretch; flex-direction: column; }
  body.app-body.supervisor-mode .supervisor-workspace-record-footer p { max-width: none; }
  body.app-body.supervisor-mode .supervisor-workspace-record-footer .secondary-button,
  body.app-body.supervisor-mode .supervisor-detail-section .primary-button,
  body.app-body.supervisor-mode .supervisor-detail-section .secondary-button { width: 100%; }
  body.app-body.supervisor-mode .supervisor-account-layout { grid-template-columns: minmax(0, 1fr); }
  body.app-body.supervisor-mode .supervisor-identity-card dl { min-width: 0; }
}

@media (max-width: 430px) {
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"] .supervisor-workspace-detail,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"] .supervisor-workspace-detail { display: none; }
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open > .supervisor-workspace-heading,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open > .supervisor-workspace-summary,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open > .supervisor-workspace-controls,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open > .supervisor-workspace-list-heading,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open .supervisor-record-list,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open > .supervisor-workspace-heading,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open > .supervisor-workspace-summary,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open > .supervisor-payment-entry,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open > .supervisor-workspace-controls,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open .supervisor-record-list { display: none; }
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open .supervisor-split-workspace,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open .supervisor-split-workspace { display: block; }
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-training"].is-mobile-detail-open .supervisor-workspace-detail,
  body.app-body.supervisor-mode [data-workspace-panel="supervisor-payments"].is-mobile-detail-open .supervisor-workspace-detail { display: grid; }
  body.app-body.supervisor-mode .supervisor-workspace-record-facts,
  body.app-body.supervisor-mode .supervisor-detail-facts,
  body.app-body.supervisor-mode .supervisor-identity-card dl { grid-template-columns: minmax(0, 1fr); }
  body.app-body.supervisor-mode .supervisor-payment-entry,
  body.app-body.supervisor-mode .supervisor-commission-section,
  body.app-body.supervisor-mode .supervisor-account-section,
  body.app-body.supervisor-mode .supervisor-workspace-detail { padding: 14px; }
  body.app-body.supervisor-mode .supervisor-ledger-row,
  body.app-body.supervisor-mode .supervisor-payout-row { align-items: flex-start; }
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html,
body {
  margin: 0;
  min-height: 100%;
  font-family: "Aptos", "Segoe UI", Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
}

body {
  padding: 18px;
}

body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: 240px;
  background: linear-gradient(135deg, rgba(16, 36, 52, 0.08), rgba(184, 137, 37, 0.12));
  pointer-events: none;
  z-index: -1;
}

.login-console {
  min-height: calc(100vh - 36px);
  display: grid;
  place-items: center;
}

.login-console-panel {
  width: min(460px, 100%);
  display: grid;
  gap: 14px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.login-shortcuts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.quiet-link {
  justify-self: center;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.quiet-link:hover {
  color: var(--navy);
}

.login-footer-links {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.login-console-panel h1 {
  margin: 0 0 8px;
  font-size: 28px;
  line-height: 1.1;
}

.login-choice-description {
  margin: -2px 0 4px;
  color: var(--muted);
  line-height: 1.5;
}

.role-choice-panel {
  width: min(520px, 100%);
}

.role-choice-list {
  display: grid;
  gap: 10px;
}

.role-choice-button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 12px;
  align-items: center;
  width: 100%;
  min-height: 88px;
  padding: 14px;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease;
}

.role-choice-button:hover,
.role-choice-button:focus-visible {
  border-color: rgba(184, 137, 37, 0.68);
  background: #fffdf7;
  box-shadow: var(--shadow-soft);
  outline: none;
}

.role-choice-button .role-chip {
  grid-row: span 2;
  margin: 0;
}

.role-choice-button strong {
  color: var(--navy);
  font-size: 16px;
}

.role-choice-button small {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.staff-bar {
  max-width: 1680px;
  margin: 12px auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.role-chip {
  margin-left: auto;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(63, 143, 89, 0.12);
  border: 1px solid rgba(63, 143, 89, 0.24);
  color: #23613a;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.role-chip[data-access="owner"] {
  background: rgba(184, 137, 37, 0.16);
  border-color: rgba(184, 137, 37, 0.35);
  color: #765711;
}

.role-chip[data-access="manager"] {
  background: rgba(16, 36, 52, 0.09);
  border-color: rgba(16, 36, 52, 0.18);
  color: var(--navy);
}

.staff-bar strong,
.staff-bar span {
  display: block;
}

.staff-bar span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}

.app-header,
.workspace {
  max-width: 1680px;
  margin-inline: auto;
}

.app-header {
  min-height: 86px;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(380px, 520px);
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.eyebrow {
  margin: 0 0 6px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}

.app-header h1,
.panel h2,
.subheading {
  margin: 0;
  font-weight: 700;
}

.app-header h1 {
  font-size: 28px;
  line-height: 1.1;
}

.header-summary {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.metric-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.metric-tile {
  min-height: 56px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 8px;
  background: var(--surface-muted);
  border: 1px solid var(--line);
}

.metric-tile span {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

.metric-tile strong {
  font-size: 24px;
  color: var(--navy);
}

.workspace {
  display: grid;
  grid-template-columns: minmax(240px, 280px) minmax(0, 1fr);
  gap: 18px;
  margin-top: 16px;
  align-items: start;
}

.workspace-sidebar,
.workspace-content {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
}

.workspace-sidebar {
  position: sticky;
  top: 16px;
}

.workspace-sidebar-header {
  padding: 16px 18px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: var(--shadow-soft);
  border-left: 4px solid var(--gold);
}

.workspace-sidebar-header h2 {
  margin: 0;
  color: var(--navy);
  font-size: 22px;
  line-height: 1.12;
}

.role-scope-card {
  padding: 16px 18px;
  border-radius: 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--green);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.role-scope-card[data-access="owner"] {
  border-left-color: var(--gold);
}

.role-scope-card[data-access="manager"] {
  border-left-color: var(--navy);
}

.role-scope-card h3 {
  margin: 0 0 8px;
  color: var(--navy);
  font-size: 18px;
  line-height: 1.2;
}

.role-scope-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.role-scope-card ul {
  margin: 12px 0 0;
  padding-left: 18px;
  display: grid;
  gap: 7px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.4;
}

.workspace-menu {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.menu-group-label {
  margin: 10px 4px 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.menu-group-label:first-child {
  margin-top: 0;
}

.workspace-menu-button {
  width: 100%;
  min-height: 42px;
  justify-content: flex-start;
  padding: 10px 12px;
  color: var(--ink);
  background: transparent;
  border-color: transparent;
  font-weight: 700;
  text-align: left;
}

.workspace-menu-button:hover {
  background: var(--surface-muted);
  transform: none;
}

.workspace-menu-button.active,
.workspace-menu-button[aria-selected="true"] {
  color: var(--navy);
  background: #f4efe2;
  border-color: #dfc889;
}

.workspace-panel {
  display: none;
}

.workspace-panel.is-active {
  display: block;
}

.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 18px;
}

.panel:hover {
  box-shadow: var(--shadow-soft);
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.panel-heading.compact {
  margin-bottom: 10px;
  padding-bottom: 0;
  border-bottom: 0;
}

.panel h2 {
  font-size: 20px;
  line-height: 1.2;
}

.stack-form,
.manual-groups,
.result-stack,
.list-stack {
  display: grid;
  gap: 12px;
}

.workspace-panel > .stack-form + .stack-form {
  margin-top: 14px;
}

.field-grid {
  display: grid;
  gap: 10px;
}

.field-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.field-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

label {
  display: grid;
  gap: 6px;
}

label span,
.subheading,
.field-help {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--muted);
}

.field-help {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  line-height: 1.35;
}

input,
select,
textarea,
button {
  font: inherit;
}

input,
select,
textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 9px 11px;
  background: var(--surface);
  color: var(--ink);
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

input[type="color"] {
  min-height: 42px;
  padding: 4px;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(184, 137, 37, 0.16);
}

.date-field {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.date-field input[readonly] {
  cursor: pointer;
  background: var(--surface);
}

.date-picker-button {
  min-height: 40px;
  border: 1px solid #dfc889;
  border-radius: 8px;
  padding: 9px 12px;
  color: var(--navy);
  background: #f4efe2;
  font-weight: 800;
  cursor: pointer;
}

.date-picker-popover {
  position: absolute;
  z-index: 40;
  top: calc(100% + 8px);
  left: 0;
  width: min(308px, calc(100vw - 48px));
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 18px 42px rgba(19, 32, 44, 0.18);
}

.date-picker-popover[hidden] {
  display: none;
}

.date-picker-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.date-picker-head strong {
  text-align: center;
  color: var(--navy);
}

.date-picker-head button,
.date-picker-footer button,
.date-picker-day {
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
  color: var(--ink);
  font-weight: 800;
  cursor: pointer;
  transform: none;
}

.date-picker-weekdays,
.date-picker-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}

.date-picker-weekdays {
  margin-bottom: 5px;
}

.date-picker-weekdays span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.date-picker-day {
  min-width: 0;
  padding: 0;
  background: white;
}

.date-picker-day.is-muted {
  color: #a3adb7;
  background: #f8f9fa;
}

.date-picker-day.is-today {
  border-color: rgba(184, 137, 37, 0.48);
}

.date-picker-day.is-selected {
  color: white;
  border-color: var(--navy);
  background: var(--navy);
}

.date-picker-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}

textarea {
  resize: vertical;
}

.report-narrative-input > span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.character-counter {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.character-counter.is-at-limit {
  color: var(--orange);
}

.manual-group {
  padding: 14px;
  border-radius: 8px;
  background: var(--surface-soft);
  border: 1px solid var(--line);
}

.manual-group-heading {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 12px;
}

.manual-group-heading > span {
  color: var(--accent-deep);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
}

.manual-group h3 {
  margin: 0;
  font-size: 15px;
}

.manual-source-copy,
.manual-reference figcaption {
  color: #455564;
  font-size: 13px;
  line-height: 1.55;
}

.manual-source-copy {
  margin: 0 0 14px;
  padding: 12px;
  border-left: 3px solid #d6b455;
  background: rgba(255, 255, 255, 0.58);
}

.manual-reference {
  display: grid;
  grid-template-columns: minmax(180px, 360px) minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  margin: 0 0 14px;
  padding: 12px;
  border: 1px solid #dbe2e7;
  border-radius: 6px;
  background: #fff;
}

.manual-reference img {
  display: block;
  width: 100%;
  max-height: 330px;
  object-fit: contain;
  border: 1px solid #e0e5e8;
  border-radius: 4px;
}

.manual-reference figcaption {
  margin: 0;
}

.manual-score-field {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.manual-score-field legend {
  margin-bottom: 6px;
  padding: 0;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--muted);
}

.manual-score-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: #fff;
}

.manual-score-options label {
  display: grid;
  place-items: center;
  min-height: 42px;
  border-right: 1px solid var(--line);
  cursor: pointer;
}

.manual-score-options label:last-child {
  border-right: 0;
}

.manual-score-options input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  min-inline-size: 0;
  margin: -1px;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.manual-score-options span {
  color: var(--navy);
  font-size: 14px;
  font-weight: 800;
}

.manual-score-options label:has(input:checked) {
  background: var(--navy);
}

.manual-score-options label:has(input:checked) span {
  color: #fff;
}

.proposal-box {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(184, 137, 37, 0.32);
  border-radius: 8px;
  background: #fffaf0;
}

.customer-access-box {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(16, 36, 52, 0.14);
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff, #f7f8fa);
}

.customer-access-box h3 {
  margin: 2px 0 0;
  color: var(--navy);
  font-size: 16px;
}

.member-directory-section {
  display: grid;
  gap: 12px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.member-directory-section h3 {
  margin: 0;
  color: var(--navy);
  font-size: 18px;
}

.member-card {
  display: grid;
  gap: 12px;
}

.member-card-head,
.member-login-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.member-login-row {
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.member-login-row span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.member-login-row strong {
  color: var(--navy);
  font-size: 14px;
}

.member-access-note {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.member-access-note strong {
  color: var(--navy);
}

.draft-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(184, 137, 37, 0.32);
  border-radius: 8px;
  background: #fffaf0;
}

.draft-panel-heading,
.draft-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.draft-panel-heading h3 {
  margin: 2px 0 0;
  color: var(--navy);
  font-size: 16px;
}

.draft-list {
  display: grid;
  gap: 10px;
}

.draft-card {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.draft-card .card-meta {
  margin: 7px 0 0;
}

.draft-card .secondary-button {
  flex: 0 0 auto;
}

.proposal-box h4 {
  margin: 0;
  color: var(--navy);
  font-size: 15px;
}

.proposal-heading-row,
.plan-option-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.plan-option-list {
  display: grid;
  gap: 12px;
}

.plan-option-box {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.plan-option-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 54px;
  padding: 12px;
  cursor: pointer;
  list-style: none;
}

.plan-option-summary::-webkit-details-marker {
  display: none;
}

.plan-option-summary::after {
  content: "+";
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--navy);
  font-weight: 900;
}

.plan-option-box[open] .plan-option-summary::after {
  content: "-";
}

.plan-option-summary span {
  padding: 5px 9px;
  border-radius: 999px;
  background: #f4efe2;
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
}

.plan-option-summary strong {
  min-width: 0;
  color: var(--navy);
}

.plan-option-summary small {
  justify-self: end;
  color: var(--muted);
  font-weight: 700;
}

.plan-option-body {
  display: grid;
  gap: 10px;
  padding: 0 12px 12px;
}

.plan-option-box h5 {
  margin: 0;
  color: var(--navy);
  font-size: 14px;
}

.member-plan-selection {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff, #f7f8fa);
}

.selection-empty {
  color: var(--muted);
  font-weight: 700;
}

.selection-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.72fr);
  gap: 14px;
  align-items: stretch;
}

.selection-overview h4 {
  margin: 2px 0 6px;
  color: var(--navy);
  font-size: 20px;
}

.selection-overview p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.selection-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.selection-metrics span {
  min-height: 68px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.selection-metrics strong {
  color: var(--navy);
  font-size: 22px;
  line-height: 1;
  text-transform: none;
  letter-spacing: 0;
}

.selection-history {
  display: grid;
  gap: 8px;
}

.selection-history-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.selection-history-card.is-current {
  border-color: rgba(63, 143, 89, 0.42);
  box-shadow: inset 3px 0 0 var(--green);
}

.selection-history-card h5 {
  margin: 0 0 4px;
  color: var(--navy);
  font-size: 14px;
}

.selection-history-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.selection-progress {
  display: grid;
  justify-items: end;
  gap: 5px;
  color: var(--muted);
  font-weight: 700;
}

.manual-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.manual-fields:empty {
  display: none;
}

button,
.secondary-button,
.primary-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 9px 13px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease, transform 120ms ease;
}

button:hover,
.secondary-button:hover,
.primary-button:hover {
  transform: translateY(-1px);
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
  transform: none;
}

.primary-button {
  color: #ffffff;
  background: var(--navy);
}

.primary-button:hover {
  background: #16354c;
}

.secondary-button {
  color: var(--navy);
  background: #f4efe2;
  border-color: #dfc889;
}

.secondary-button:hover {
  background: #efe5c9;
}

.danger-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e2b6b6;
  border-radius: 8px;
  padding: 9px 13px;
  color: #8a2424;
  background: #fff1f1;
  font-weight: 700;
  cursor: pointer;
}

.danger-button:hover {
  background: #f8dddd;
}

.toggle-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.toggle {
  display: flex;
  gap: 9px;
  align-items: center;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--surface-muted);
  border: 1px solid var(--line);
}

.toggle input {
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0;
}

.result-card,
.list-card,
.preview-meta {
  padding: 12px 14px;
  border-radius: 8px;
  background: var(--surface);
  border: 1px solid var(--line);
}

.list-card {
  border-left: 4px solid rgba(184, 137, 37, 0.42);
}

.result-card h4,
.list-card h4 {
  margin: 0 0 6px;
  font-size: 15px;
}

.card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 10px;
}

.card-meta span {
  padding: 4px 8px;
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 999px;
}

.card-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
}

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

.form-actions button {
  flex: 1 1 180px;
}

.card-note {
  margin: 0 0 10px;
  color: var(--muted);
  line-height: 1.5;
}

.split-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.account-list {
  margin-top: 12px;
}

.subheading {
  margin: 0 0 10px;
}

.preview-selector {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.preview-actions {
  display: flex;
  gap: 10px;
  margin: 12px 0 14px;
}

#previewFrame {
  width: 100%;
  min-height: 620px;
  border-radius: 8px;
  border: 1px solid var(--line-strong);
  background: white;
}

.empty-card {
  color: var(--muted);
  background: var(--surface-muted);
}

.status-chip {
  display: inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.status-chip.good {
  background: rgba(63, 143, 89, 0.14);
  color: #23613a;
}

.status-chip.warn {
  background: rgba(184, 105, 45, 0.14);
  color: #7a4217;
}

.status-chip.bad {
  background: rgba(163, 63, 63, 0.14);
  color: #812929;
}

.toast {
  position: fixed;
  right: 18px;
  top: 18px;
  bottom: auto;
  max-width: 360px;
  padding: 12px 14px;
  border-radius: 8px;
  background: rgba(16, 36, 52, 0.96);
  color: white;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
  pointer-events: none;
  z-index: 80;
}

.panel-description {
  max-width: 760px;
  margin: 7px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.follow-up-selector-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f9fa;
}

.member-search-field {
  display: grid;
  gap: 8px;
}

.member-search-results {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.assessment-member-search {
  min-width: 0;
}

.assessment-member-selected {
  min-height: 0;
}

.assessment-member-selection {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid #d7e1e7;
  border-radius: 7px;
  background: #fff;
}

.assessment-member-selection strong {
  color: var(--navy);
  font-size: 14px;
}

.assessment-member-selection span {
  color: var(--muted);
  font-size: 12px;
}

.member-search-hint {
  padding: 10px 12px;
  border: 1px dashed #bfc9d1;
  border-radius: 8px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.72);
  font-size: 13px;
}

.member-search-result {
  display: grid;
  gap: 3px;
  min-height: 76px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink);
  text-align: left;
  font: inherit;
}

.member-search-result:hover,
.member-search-result.is-selected {
  border-color: #d4ad4f;
  background: #fffaf0;
}

.member-search-result strong {
  color: var(--navy);
  font-size: 14px;
}

.member-search-result span,
.member-search-result small {
  color: var(--muted);
  font-size: 12px;
}

.follow-up-member-profile {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 14px;
  border: 1px solid #d7e1e7;
  border-radius: 8px;
  background: white;
}

.follow-up-member-profile h4 {
  margin: 3px 0 4px;
  color: var(--navy);
  font-size: 18px;
}

.follow-up-member-profile p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.follow-up-member-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.follow-up-member-meta span {
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7f9fa;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

#followUpWorkflowContent[hidden] {
  display: none;
}

.follow-up-selector-heading,
.workflow-stage-heading,
.operations-heading,
.queue-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.follow-up-selector-heading h3,
.operations-heading h4 {
  margin: 3px 0 0;
  color: var(--navy);
  font-size: 17px;
}

.follow-up-workflow-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.workflow-status-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  min-height: 78px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.workflow-status-card.is-complete {
  border-color: rgba(63, 143, 89, 0.38);
  box-shadow: inset 3px 0 0 var(--green);
}

.workflow-status-card > span,
.workflow-stage-heading > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #f4efe2;
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
}

.workflow-status-card strong,
.workflow-status-card small {
  display: block;
}

.workflow-status-card strong {
  color: var(--navy);
  font-size: 13px;
}

.workflow-status-card small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.follow-up-report-queue {
  display: grid;
  gap: 9px;
}

.queue-heading {
  align-items: center;
}

.queue-heading p {
  margin: 0;
}

.queue-heading strong {
  color: var(--muted);
  font-size: 12px;
}

.follow-up-queue-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 9px;
}

.follow-up-queue-card {
  min-height: 96px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  color: var(--ink);
  text-align: left;
  font: inherit;
}

.follow-up-queue-card:hover,
.follow-up-queue-card.is-selected {
  border-color: #d4ad4f;
  background: #fffaf0;
}

.follow-up-queue-card span,
.follow-up-queue-card small {
  color: var(--muted);
  font-size: 12px;
}

.follow-up-queue-card strong {
  color: var(--navy);
  font-size: 14px;
}

.follow-up-queue-card em {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: center;
  color: #7a5815;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  text-align: right;
}

.workflow-stage {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
  margin-top: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.workflow-stage > * {
  min-width: 0;
  max-width: 100%;
}

.workflow-stage-heading {
  justify-content: flex-start;
}

.workflow-stage-heading h3 {
  margin: 3px 0 5px;
  color: var(--navy);
  font-size: 18px;
}

.workflow-stage-heading p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.workflow-stage .proposal-heading-row h4 {
  margin: 0;
  color: var(--navy);
  font-size: 15px;
}

#followUpMemberAccess {
  display: block;
  min-height: 0;
  height: auto;
  align-self: stretch;
}

.training-operations-stage {
  background: #fbfcfd;
}

.operations-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.operations-column,
.session-report-form {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.compact-stack {
  gap: 10px;
}

.compact-list {
  margin-top: 2px;
}

.operations-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.operations-card strong,
.operations-card small {
  display: block;
}

.operations-card strong {
  color: var(--navy);
  font-size: 14px;
}

.operations-card small,
.operations-card p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.operations-card-action {
  display: grid;
  justify-items: end;
  gap: 7px;
}

.operations-card-action .danger-button {
  min-height: 32px;
  padding: 6px 9px;
  font-size: 12px;
}

.intake-submission-list {
  display: grid;
  gap: 14px;
}

.assessment-request-operations {
  display: grid;
  gap: 14px;
}

.legacy-intake-operations {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.assessment-request-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  margin: 0;
}

.assessment-request-facts div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-muted, #f8fafb);
}

.assessment-request-facts dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.assessment-request-facts dd {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.intake-submission-card {
  display: grid;
  gap: 13px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.intake-submission-head,
.intake-assignment-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.intake-submission-head h3 {
  margin: 3px 0 4px;
  color: var(--navy);
  font-size: 18px;
}

.intake-submission-head p:not(.eyebrow),
.intake-submission-meta {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.intake-submission-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
}

.intake-answer-details {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.intake-answer-details summary {
  color: var(--navy);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.intake-answer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 0;
}

.intake-answer-grid div {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fafb;
}

.intake-answer-grid dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.intake-answer-grid dd {
  margin: 5px 0 0;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.intake-assignment-row {
  align-items: end;
  padding-top: 2px;
}

.intake-assignment-row label {
  display: grid;
  min-width: min(100%, 300px);
  gap: 6px;
}

.intake-assignment-row label span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.evaluator-assignment-board {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 16px;
  border: 1px solid #d9c891;
  border-radius: 8px;
  background: #fffaf0;
}

.evaluator-assignment-heading,
.evaluator-assignment-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.evaluator-assignment-heading h3,
.evaluator-assignment-card-head h4 {
  margin: 3px 0 0;
  color: var(--navy);
}

.evaluator-assignment-heading h3 {
  font-size: 17px;
}

.evaluator-assignment-list {
  display: grid;
  gap: 10px;
}

.evaluator-assignment-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #e3dcc7;
  border-radius: 7px;
  background: #fff;
}

.evaluator-assignment-card-head h4 {
  font-size: 16px;
}

.evaluator-assignment-card-head p:not(.eyebrow),
.evaluator-assignment-meta {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.evaluator-assignment-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 16px;
}

.reassessment-history-panel,
.reassessment-manager-workspace,
.reassessment-request-section,
.reassessment-selected-member {
  display: grid;
  gap: 12px;
}

.reassessment-history-panel {
  min-height: 0;
  padding: 14px;
  border: 1px solid #d9c891;
  border-radius: 8px;
  background: #fffaf0;
}

.reassessment-history-panel.empty-card {
  border-color: var(--line);
  background: #f8fafb;
}

.reassessment-history-head,
.reassessment-selected-member,
.reassessment-request-card-head,
.section-heading-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.reassessment-history-head h3,
.reassessment-request-card-head h3,
.section-heading-row h3 {
  margin: 3px 0 0;
  color: var(--navy);
  font-size: 17px;
}

.reassessment-history-list,
.reassessment-request-list {
  display: grid;
  gap: 10px;
}

.reassessment-history-item,
.reassessment-request-card {
  display: grid;
  gap: 10px;
  padding: 13px;
  border: 1px solid #e3dcc7;
  border-radius: 7px;
  background: #fff;
}

.reassessment-history-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.reassessment-history-item strong,
.reassessment-selected-member strong {
  color: var(--navy);
}

.reassessment-history-item p,
.reassessment-request-card p,
.reassessment-selected-member p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.reassessment-request-section {
  margin-top: 22px;
}

.reassessment-manager-workspace .member-request-section {
  margin-top: 0;
}

@media (max-width: 1180px) {
  .app-header,
  .split-results,
  .toggle-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .workspace {
    grid-template-columns: 1fr;
  }

  .workspace-sidebar {
    position: static;
  }

  .workspace-menu {
    grid-template-columns: 1fr;
  }

  .menu-group-label {
    grid-column: 1 / -1;
  }
}

@media (max-width: 820px) {
  body {
    padding: 10px;
  }

  .app-header,
  .panel,
  .workspace-sidebar-header,
  .role-scope-card {
    padding: 14px;
  }

  .workspace-menu {
    grid-template-columns: 1fr;
  }

  .metric-strip,
  .selection-overview,
  .selection-metrics,
  .follow-up-workflow-summary,
  .operations-grid,
  .field-grid.two,
  .field-grid.three,
  .field-grid.four,
  .manual-fields {
    grid-template-columns: 1fr;
  }

  .manual-reference {
    grid-template-columns: 1fr;
  }

  .selection-history-card {
    grid-template-columns: 1fr;
  }

  .follow-up-member-profile {
    align-items: flex-start;
    flex-direction: column;
  }

  .intake-submission-head,
  .intake-assignment-row,
  .evaluator-assignment-heading,
  .evaluator-assignment-card-head,
  .reassessment-history-head,
  .reassessment-selected-member,
  .reassessment-request-card-head,
  .section-heading-row {
    align-items: stretch;
    flex-direction: column;
  }

  .reassessment-history-item {
    grid-template-columns: 1fr;
  }

  .intake-answer-grid {
    grid-template-columns: 1fr;
  }

  .follow-up-member-meta {
    justify-content: flex-start;
  }

  .selection-progress {
    justify-items: start;
  }

  .panel-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .member-card-head,
  .member-login-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .staff-bar {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Evaluator assessment workspace: the original form remains mounted so draft values survive section changes. */
.assessment-workspace-form {
  gap: 16px;
}

.assessment-workspace-shell {
  display: grid;
  gap: 14px;
}

.assessment-context-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid #203b4d;
  border-radius: 8px;
  background: var(--navy);
  color: #fff;
}

.assessment-context-header .eyebrow,
.assessment-context-header p,
.assessment-context-header small {
  color: #c9d3da;
}

.assessment-context-primary h3,
.assessment-section-rail h3,
.assessment-current-section h3 {
  margin: 0;
}

.assessment-context-primary h3 {
  font-size: 22px;
  line-height: 1.18;
}

.assessment-context-primary p:last-child {
  margin: 5px 0 0;
  font-size: 14px;
}

.assessment-context-meta {
  display: grid;
  justify-items: end;
  gap: 4px;
  text-align: right;
}

.assessment-context-meta strong {
  font-size: 14px;
}

.assessment-context-meta small {
  max-width: 310px;
  font-size: 12px;
  line-height: 1.35;
}

.assessment-save-state {
  font-size: 13px;
  font-weight: 800;
}

.assessment-save-state[data-state="saved"] {
  color: #b5e5c4;
}

.assessment-save-state[data-state="unsaved"],
.assessment-save-state[data-state="saving"] {
  color: #f3d27d;
}

.assessment-save-state[data-state="failed"],
.assessment-save-state[data-state="offline"] {
  color: #ffb5b5;
}

.assessment-workspace-layout {
  display: grid;
  grid-template-columns: minmax(210px, 250px) minmax(0, 820px);
  gap: 14px;
  justify-content: start;
  align-items: start;
}

.assessment-section-rail {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.assessment-section-rail-heading,
.assessment-current-section-heading,
.assessment-review-summary,
.assessment-reference-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.assessment-section-rail-heading h3 {
  color: var(--navy);
  font-size: 17px;
}

.icon-button {
  width: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  color: var(--navy);
  background: #fff;
  border-color: var(--line-strong);
  font-size: 19px;
  line-height: 1;
}

.assessment-section-select-label {
  display: none;
}

.assessment-section-select-label span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.assessment-section-navigator {
  display: grid;
  gap: 4px;
}

.assessment-section-nav-item {
  width: 100%;
  min-height: 48px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 8px;
  color: var(--ink);
  background: transparent;
  border-color: transparent;
  text-align: left;
  transform: none;
}

.assessment-section-nav-item:hover {
  background: #fff;
  transform: none;
}

.assessment-section-nav-item[aria-current="step"] {
  color: var(--navy);
  background: #fff;
  border-color: #d9c37e;
  box-shadow: inset 3px 0 0 var(--gold);
}

.assessment-section-index {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.assessment-section-nav-item[data-state="complete"] .assessment-section-index {
  color: #23613a;
  border-color: rgba(63, 143, 89, 0.42);
  background: rgba(63, 143, 89, 0.1);
}

.assessment-section-nav-item[data-state="attention"] .assessment-section-index {
  color: #765711;
  border-color: rgba(184, 137, 37, 0.45);
  background: rgba(184, 137, 37, 0.1);
}

.assessment-section-nav-item[data-state="na"] .assessment-section-index {
  color: #6f7b85;
  background: #edf0f2;
}

.assessment-section-nav-copy {
  display: grid;
  min-width: 0;
  gap: 1px;
}

.assessment-section-nav-copy strong,
.assessment-section-nav-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.assessment-section-nav-copy strong {
  font-size: 13px;
}

.assessment-section-nav-copy small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.assessment-section-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.assessment-section-legend span {
  padding: 3px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: #fff;
  font-size: 10px;
  font-weight: 700;
}

.assessment-section-legend [data-state="complete"] { color: #23613a; }
.assessment-section-legend [data-state="current"] { color: var(--navy); border-color: #d9c37e; }
.assessment-section-legend [data-state="attention"] { color: #765711; }
.assessment-section-legend [data-state="na"] { color: #6f7b85; }

.assessment-workspace-main {
  min-width: 0;
  padding-bottom: 82px;
}

.assessment-setup-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.45fr) minmax(180px, 0.8fr) minmax(180px, 0.8fr);
  gap: 10px;
  margin-bottom: 14px;
}

.assessment-current-section {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  scroll-margin-block: 16px 120px;
}

.assessment-current-section-heading {
  align-items: flex-start;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.assessment-current-section h3 {
  color: var(--navy);
  font-size: 22px;
  line-height: 1.15;
}

.assessment-section-instruction {
  margin: -4px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.assessment-current-section .manual-groups {
  gap: 14px;
}

.assessment-current-section .manual-group {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.assessment-current-section .manual-group + .manual-group {
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.assessment-current-section .manual-group-heading {
  margin-bottom: 10px;
}

.manual-reference-media {
  display: block;
  width: 100%;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border-color: #e0e5e8;
  border-radius: 4px;
  cursor: zoom-in;
}

.manual-reference-media:hover {
  transform: none;
  border-color: var(--gold);
}

.manual-reference-media img {
  margin: 0;
  border: 0;
}

.assessment-review-panel {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(184, 137, 37, 0.42);
  border-radius: 8px;
  background: #fffaf0;
}

.assessment-review-summary {
  align-items: flex-start;
}

.assessment-review-summary h4 {
  margin: 2px 0 5px;
  color: var(--navy);
  font-size: 16px;
}

.assessment-review-summary p {
  max-width: 640px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.assessment-review-list {
  display: grid;
  gap: 6px;
}

.assessment-review-jump {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
  color: var(--navy);
  background: #fff;
  border-color: var(--line);
  text-align: left;
}

.assessment-review-jump strong {
  color: #765711;
  font-size: 12px;
}

.assessment-workspace-actions {
  position: sticky;
  bottom: max(10px, env(safe-area-inset-bottom));
  z-index: 5;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 18px rgba(19, 32, 44, 0.14);
}

.assessment-workspace-actions button {
  min-height: 46px;
}

.assessment-reference-dialog {
  width: min(900px, calc(100vw - 28px));
  max-height: min(900px, calc(100dvh - 28px));
  padding: 14px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  box-shadow: 0 24px 60px rgba(19, 32, 44, 0.28);
}

.assessment-reference-dialog::backdrop {
  background: rgba(16, 36, 52, 0.62);
}

.assessment-reference-dialog-head {
  margin-bottom: 10px;
  color: var(--navy);
}

.assessment-reference-dialog img {
  display: block;
  max-width: 100%;
  max-height: calc(100dvh - 120px);
  margin: 0 auto;
  object-fit: contain;
}

@media (max-width: 1024px) {
  .assessment-workspace-layout {
    grid-template-columns: 1fr;
  }

  .assessment-section-rail {
    position: static;
  }

  .assessment-section-select-label {
    display: block;
  }

  .assessment-section-navigator {
    max-height: 300px;
    overflow: auto;
    padding-right: 2px;
  }

  .assessment-setup-grid {
    grid-template-columns: minmax(240px, 1.3fr) minmax(160px, 0.8fr);
  }

  .assessment-setup-grid > :first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 820px) {
  .assessment-context-header {
    grid-template-columns: 1fr;
  }

  .assessment-context-meta {
    justify-items: start;
    text-align: left;
  }

  .assessment-workspace-layout {
    grid-template-columns: 1fr;
  }

  .assessment-section-rail {
    position: static;
  }

  .assessment-section-select-label {
    display: block;
  }

  .assessment-section-navigator {
    max-height: 300px;
    overflow: auto;
    padding-right: 2px;
  }

  .assessment-workspace-main {
    padding-bottom: 98px;
  }

  .assessment-setup-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px) {
  .assessment-workspace-intro .panel-description {
    display: none;
  }

  .assessment-context-header,
  .assessment-current-section,
  .assessment-section-rail {
    padding: 12px;
  }

  .assessment-context-primary h3,
  .assessment-current-section h3 {
    font-size: 20px;
  }

  .assessment-setup-grid {
    grid-template-columns: 1fr;
  }

  .assessment-setup-grid > :first-child {
    grid-column: auto;
  }

  .assessment-section-navigator {
    max-height: 250px;
  }

  .assessment-review-summary,
  .assessment-current-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .assessment-workspace-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    bottom: 0;
    padding: 8px 8px max(8px, env(safe-area-inset-bottom));
  }

  .assessment-workspace-actions button {
    min-width: 0;
    min-height: 48px;
    padding-inline: 8px;
    font-size: 13px;
  }

  .assessment-workspace-actions #assessmentSubmitButton,
  .assessment-workspace-actions #resetAssessmentButton {
    grid-column: 1 / -1;
  }

  .manual-score-options label {
    min-height: 48px;
  }

  .manual-reference {
    padding: 8px;
  }
}

/* Evaluator daily-work dashboard. The assessment workspace remains a focused view. */
.evaluator-app-nav {
  max-width: 1680px;
  min-height: 66px;
  display: grid;
  grid-template-columns: minmax(200px, 1fr) auto minmax(200px, 1fr);
  align-items: center;
  gap: 18px;
  margin: 12px auto 0;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow);
}

.evaluator-brand {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--navy);
  text-decoration: none;
}

.evaluator-brand img {
  width: 36px;
  height: 36px;
  padding: 6px;
  object-fit: contain;
  border: 1px solid #e1d5a8;
  border-radius: 6px;
  background: #fffdf7;
}

.evaluator-brand span,
.evaluator-brand strong,
.evaluator-brand small {
  display: block;
}

.evaluator-brand strong {
  font-size: 14px;
  line-height: 1.1;
}

.evaluator-brand small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.1;
}

.evaluator-primary-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.evaluator-mobile-more { display: none; }

.evaluator-nav-button {
  min-height: 44px;
  padding: 8px 12px;
  color: #4f5d66;
  border-color: transparent;
  background: transparent;
  font-size: 13px;
  font-weight: 800;
}

.evaluator-nav-button:hover,
.evaluator-nav-button.active,
.evaluator-nav-button[aria-selected="true"] {
  color: var(--navy);
  border-color: #dfc889;
  background: #fbf7ec;
  transform: none;
}

.evaluator-profile-menu {
  justify-self: end;
  position: relative;
}

.evaluator-profile-menu summary {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 7px 4px 4px;
  color: var(--navy);
  border: 1px solid transparent;
  border-radius: 7px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  list-style: none;
}

.evaluator-profile-menu summary::-webkit-details-marker { display: none; }
.evaluator-profile-menu summary:hover { border-color: var(--line); background: var(--surface-muted); }

.evaluator-avatar,
.workflow-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 50%;
  font-weight: 900;
}

.evaluator-avatar {
  width: 34px;
  height: 34px;
  color: #765711;
  background: #f6edcf;
  border: 1px solid #dec985;
  font-size: 12px;
}

.evaluator-profile-popover {
  position: absolute;
  z-index: 20;
  top: calc(100% + 8px);
  right: 0;
  width: 180px;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(19, 32, 44, 0.16);
}

.evaluator-profile-popover .role-chip { margin: 0; justify-self: start; }
.evaluator-profile-popover .secondary-button { min-height: 42px; }

body.evaluator-mode .site-nav { display: none; }
body.evaluator-mode .workspace { grid-template-columns: minmax(0, 1fr); margin-top: 16px; }
body.evaluator-mode .workspace-sidebar { display: none; }
body.evaluator-mode .workspace-content { max-width: 1320px; width: 100%; margin-inline: auto; }

.workspace-panel.evaluator-dashboard-panel {
  display: none;
  gap: 24px;
  padding: 24px;
  background: #fcfcfa;
}

.workspace-panel.evaluator-dashboard-panel.is-active { display: grid; }

.evaluator-dashboard-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.evaluator-dashboard-heading h2 {
  margin: 0;
  color: var(--navy);
  font-size: 28px;
  line-height: 1.1;
}

.evaluator-dashboard-heading .panel-description {
  max-width: 610px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.evaluator-dashboard-filters {
  display: grid;
  grid-template-columns: 150px minmax(240px, 300px);
  gap: 10px;
}

.evaluator-dashboard-filters label,
.dashboard-member-search {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.evaluator-dashboard-filters input,
.evaluator-dashboard-filters select,
.dashboard-member-search input {
  min-height: 44px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.evaluator-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.evaluator-summary-grid article {
  min-height: 112px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 16px;
  border-right: 1px solid var(--line);
}

.evaluator-summary-grid article:last-child { border-right: 0; }
.evaluator-summary-grid .evaluator-attention-summary { border-top: 3px solid var(--brand-gold); background: #fffaf0; }
.evaluator-summary-grid span { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.evaluator-summary-grid strong { color: var(--navy); font-size: 29px; line-height: 1; }
.evaluator-summary-grid small { color: var(--muted); font-size: 12px; line-height: 1.35; }

.evaluator-priority-section,
.dashboard-queue-section {
  display: grid;
  gap: 12px;
}

.evaluator-priority-section {
  padding: 18px;
  border: 1px solid #d9c37e;
  border-radius: 8px;
  background: #fffdf7;
}

.evaluator-today-section {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--color-surface);
}

.section-heading-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.section-heading-row h3,
.dashboard-queue-section h3 {
  margin: 0;
  color: var(--navy);
  font-size: 18px;
  line-height: 1.18;
}

.quiet-button {
  min-height: 36px;
  padding: 6px 8px;
  color: #53636d;
  border-color: transparent;
  background: transparent;
  font-size: 12px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.quiet-button:hover { color: var(--navy); background: transparent; transform: none; }

.workflow-queue-list {
  display: grid;
  gap: 8px;
}

.workflow-queue-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.workflow-queue-item:first-child { padding-top: 0; }
.workflow-queue-item:last-child { padding-bottom: 0; border-bottom: 0; }

.workflow-avatar {
  width: 36px;
  height: 36px;
  color: #31546b;
  border: 1px solid #c9d8e2;
  background: #edf4f7;
  font-size: 11px;
}

.workflow-queue-copy { min-width: 0; }
.workflow-queue-title-row { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.workflow-queue-title-row > div { min-width: 0; display: grid; gap: 2px; }
.workflow-queue-title-row strong { color: var(--navy); font-size: 15px; }
.workflow-queue-title-row span:not(.status-chip) { color: var(--muted); font-size: 11px; font-weight: 700; }
.workflow-queue-copy p { margin: 5px 0 3px; color: #475761; font-size: 13px; line-height: 1.42; }
.workflow-queue-copy small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.workflow-queue-responsibility { color: var(--brand-teal); font-weight: 800; }
.workflow-queue-actions { display: grid; gap: 7px; min-width: 144px; }
.workflow-queue-action { min-width: 144px; min-height: 44px; padding-inline: 12px; font-size: 13px; }
.workflow-queue-technical-review { background: var(--surface); }
.workflow-queue-next-action {
  min-width: 144px;
  color: #516473;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  text-align: right;
}

.dashboard-empty-state {
  padding: 14px 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.evaluator-workspace-summary {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--brand-teal);
  border-radius: 8px;
  background: var(--color-surface);
  box-shadow: var(--shadow-soft);
}

.evaluator-workspace-summary-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.evaluator-workspace-summary-heading h3 {
  margin: 3px 0 5px;
  color: var(--brand-navy);
  font-size: 19px;
  line-height: 1.2;
}

.evaluator-workspace-summary-heading p:not(.eyebrow),
.evaluator-workspace-summary-footnote {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.evaluator-workspace-summary-list { display: grid; }
.evaluator-workspace-summary-footnote { padding-top: 2px; border-top: 1px solid var(--line); }

.evaluator-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 32px;
  align-items: start;
}

.dashboard-column { display: grid; gap: 28px; min-width: 0; }
.dashboard-queue-section + .dashboard-queue-section { padding-top: 24px; border-top: 1px solid var(--line); }

.returning-member-section {
  padding: 16px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  border-radius: 8px;
  background: #fff;
}

.returning-member-section .card-note { margin: 5px 0 12px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.dashboard-member-result { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.dashboard-member-result:last-child { border-bottom: 0; }
.dashboard-member-result > div { min-width: 0; display: grid; gap: 3px; }
.dashboard-member-result strong { color: var(--navy); font-size: 14px; }
.dashboard-member-result span,
.dashboard-member-result small { color: var(--muted); font-size: 12px; line-height: 1.3; }
.dashboard-member-result .secondary-button { min-height: 42px; white-space: nowrap; }

.dashboard-activity-list { display: grid; }
.dashboard-activity-list article { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.dashboard-activity-list article:last-child { border-bottom: 0; }
.dashboard-activity-list article > span { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }
.dashboard-activity-list strong,
.dashboard-activity-list small { display: block; }
.dashboard-activity-list strong { color: var(--navy); font-size: 13px; }
.dashboard-activity-list small,
.dashboard-activity-list time { color: var(--muted); font-size: 11px; line-height: 1.35; }
.dashboard-activity-list time { text-align: right; }

.evaluator-account-summary { display: grid; gap: 16px; }
.evaluator-account-identity {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface);
  box-shadow: var(--shadow-soft);
}
.evaluator-account-avatar {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  color: #fff;
  border-radius: 50%;
  background: var(--brand-navy);
  font-size: 15px;
  font-weight: 900;
}
.evaluator-account-identity h3,
.evaluator-account-grid h3 { margin: 0; color: var(--brand-navy); }
.evaluator-account-identity p { margin: 4px 0 0; color: var(--muted); }
.evaluator-account-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.evaluator-account-grid > article { display: grid; align-content: start; gap: 10px; min-height: 184px; padding: 18px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface); box-shadow: var(--shadow-soft); }
.evaluator-account-grid p { margin: 0; color: var(--muted); line-height: 1.5; }
.evaluator-account-grid .primary-button { align-self: end; }

/* Evaluator report publication is intentionally separate from technical entry. */
.workspace-panel.evaluator-reports-panel {
  display: none;
  gap: 20px;
  padding: 24px;
  background: var(--color-surface);
}

.workspace-panel.evaluator-reports-panel.is-active { display: grid; }
.evaluator-reports-panel > .panel-heading { padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.evaluator-reports-panel > .panel-heading h2 { margin: 0; color: var(--brand-navy); font-size: 28px; line-height: 1.1; }
.evaluator-reports-panel > .panel-heading .panel-description { max-width: 720px; margin: 8px 0 0; color: var(--muted); line-height: 1.5; }
.evaluator-report-layout { display: grid; grid-template-columns: minmax(270px, 340px) minmax(0, 1fr); gap: 20px; align-items: start; }
.evaluator-report-queue-panel,
.evaluator-report-content {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface);
  box-shadow: var(--shadow-soft);
}
.evaluator-report-queue-panel { position: sticky; top: 14px; display: grid; gap: 14px; }
.evaluator-report-search { display: grid; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.evaluator-report-search input { min-height: 44px; letter-spacing: 0; text-transform: none; }
.evaluator-report-queue { display: grid; gap: 10px; }
.evaluator-report-queue-item { display: grid; gap: 9px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.evaluator-report-queue-item.is-active { border-color: var(--brand-gold); box-shadow: inset 3px 0 0 var(--brand-gold); }
.evaluator-report-queue-title-row { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.evaluator-report-queue-title-row > div { min-width: 0; display: grid; gap: 3px; }
.evaluator-report-queue-title-row strong { color: var(--brand-navy); font-size: 14px; line-height: 1.25; }
.evaluator-report-queue-title-row span:not(.status-chip),
.evaluator-report-queue-item p,
.evaluator-report-queue-item small { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.evaluator-report-queue-item .secondary-button { min-height: 40px; }
.evaluator-report-content { display: grid; gap: 16px; }
.evaluator-report-back-to-queue { display: none; justify-self: start; }
.evaluator-report-context { padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.evaluator-report-context-heading { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.evaluator-report-context-heading h3 { margin: 2px 0 3px; color: var(--brand-navy); font-size: 24px; line-height: 1.16; }
.evaluator-report-context-heading p:not(.eyebrow) { margin: 0; color: var(--muted); }
.evaluator-report-context-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 16px 0 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.evaluator-report-context-grid div { min-width: 0; padding: 12px; border-right: 1px solid var(--line); background: var(--surface-muted); }
.evaluator-report-context-grid div:last-child { border-right: 0; }
.evaluator-report-context-grid dt { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.evaluator-report-context-grid dd { margin: 5px 0 0; color: var(--brand-navy); font-size: 13px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
.evaluator-report-longitudinal,
.evaluator-report-technical-summary,
.evaluator-report-review,
.evaluator-report-published { padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.evaluator-report-section-heading { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.evaluator-report-section-heading h3 { margin: 3px 0 0; color: var(--brand-navy); font-size: 18px; }
.evaluator-report-section-heading > span { color: var(--muted); font-size: 12px; font-weight: 800; }
.evaluator-report-history-grid,
.evaluator-report-published-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.evaluator-report-history-grid article,
.evaluator-report-published-grid article { display: grid; gap: 5px; padding: 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--color-surface); }
.evaluator-report-history-grid span,
.evaluator-report-published-grid span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.evaluator-report-history-grid strong,
.evaluator-report-published-grid strong { color: var(--brand-navy); font-size: 14px; line-height: 1.3; }
.evaluator-report-history-grid small,
.evaluator-report-published-grid small,
.evaluator-report-history-note,
.evaluator-report-technical-summary > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.evaluator-report-history-note { margin-top: 12px; }
.evaluator-report-score-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.evaluator-report-score-list article { display: grid; gap: 4px; padding: 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--color-surface); }
.evaluator-report-score-list span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.evaluator-report-score-list strong { color: var(--brand-navy); font-size: 20px; line-height: 1; }
.evaluator-report-editor { gap: 15px; padding: 18px; border: 1px solid var(--brand-gold); border-radius: 8px; background: var(--color-surface); }
.evaluator-report-editor textarea { min-height: 0; resize: vertical; line-height: 1.5; }
.evaluator-report-editor label > span em { margin-left: 5px; color: var(--muted); font-size: 11px; font-style: normal; font-weight: 700; }
.evaluator-report-actions { justify-content: flex-end; }
.evaluator-report-review { display: grid; gap: 16px; border-top: 3px solid var(--brand-gold); }
.evaluator-report-review-grid { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 12px; }
.evaluator-report-review-grid section,
.evaluator-report-review-copy { padding: 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--color-surface); }
.evaluator-report-review h4 { margin: 0 0 8px; color: var(--brand-navy); font-size: 15px; }
.evaluator-report-review p { margin: 8px 0 0; color: var(--muted); line-height: 1.5; }
.evaluator-report-review-grid p { display: flex; align-items: center; gap: 7px; }
.evaluator-report-review-copy p { color: var(--navy); white-space: normal; overflow-wrap: anywhere; }
.evaluator-report-publication-confirmation { padding: 18px; border: 1px solid var(--gold-border); border-radius: 7px; background: var(--gold-soft); }
.evaluator-report-publication-confirmation h4,
.evaluator-report-publication-confirmation p { margin-top: 0; }
.evaluator-report-published { display: grid; gap: 16px; border-top: 3px solid var(--brand-teal); }

@media (max-width: 1024px) {
  .evaluator-report-layout { grid-template-columns: minmax(240px, 290px) minmax(0, 1fr); gap: 16px; }
  .evaluator-report-context-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .evaluator-report-context-grid div:nth-child(2) { border-right: 0; }
  .evaluator-report-context-grid div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .evaluator-report-score-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .workspace-panel.evaluator-reports-panel { padding: 20px; }
  .evaluator-report-layout { grid-template-columns: 1fr; }
  .evaluator-report-queue-panel { position: static; }
  .evaluator-report-queue { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .evaluator-report-queue-item { height: 100%; }
  .workspace-panel.evaluator-reports-panel.has-active-report #evaluatorReportsWorkspaceSummary { display: none; }
  .evaluator-report-layout.has-active-report .evaluator-report-queue-panel { display: none; }
  .evaluator-report-back-to-queue { display: inline-flex; }
  .evaluator-report-history-grid { grid-template-columns: 1fr; }
  .evaluator-report-published-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .workspace-panel.evaluator-reports-panel { gap: 16px; padding: 16px; }
  .evaluator-reports-panel > .panel-heading h2 { font-size: 24px; }
  .evaluator-report-queue-panel,
  .evaluator-report-content { padding: 14px; }
  .evaluator-report-queue { grid-template-columns: 1fr; }
  .evaluator-report-queue-title-row,
  .evaluator-report-context-heading,
  .evaluator-report-section-heading { align-items: stretch; flex-direction: column; }
  .evaluator-report-context-grid,
  .evaluator-report-published-grid,
  .evaluator-report-score-list,
  .evaluator-report-review-grid { grid-template-columns: 1fr; }
  .evaluator-report-context-grid div { border-right: 0; border-top: 1px solid var(--line); }
  .evaluator-report-context-grid div:first-child { border-top: 0; }
  .evaluator-report-context-grid div:nth-child(2) { border-top: 1px solid var(--line); }
  .evaluator-report-actions { display: grid; grid-template-columns: 1fr; }
  .evaluator-report-actions > * { width: 100%; }
  .evaluator-report-editor { padding: 14px; }
}

/* Evaluator Training Plans stays separate from report publication and training delivery. */
.workspace-panel.evaluator-training-plans-panel {
  display: none;
  gap: 20px;
  padding: 24px;
  background: var(--color-surface);
}
.workspace-panel.evaluator-training-plans-panel.is-active { display: grid; }
.evaluator-training-plans-panel > .panel-heading { padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.evaluator-training-plans-panel > .panel-heading h2 { margin: 0; color: var(--brand-navy); font-size: 28px; line-height: 1.1; }
.evaluator-training-plans-panel > .panel-heading .panel-description { max-width: 740px; margin: 8px 0 0; color: var(--muted); line-height: 1.5; }
.evaluator-training-plans-layout { display: grid; grid-template-columns: minmax(270px, 340px) minmax(0, 1fr); gap: 20px; align-items: start; }
.evaluator-training-plans-layout:not(.has-active-plan) { grid-template-columns: minmax(0, 1fr); }
.evaluator-training-plans-layout:not(.has-active-plan) .evaluator-training-plans-queue { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.evaluator-training-plans-queue-panel,
.evaluator-training-plans-content {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface);
  box-shadow: var(--shadow-soft);
}
.evaluator-training-plans-queue-panel { position: sticky; top: 14px; display: grid; gap: 14px; }
.evaluator-training-plans-queue { display: grid; gap: 10px; }
.evaluator-training-plans-queue .evaluator-report-queue-item { min-width: 0; }
.evaluator-training-plans-content { display: grid; gap: 16px; }
.evaluator-training-plans-back-to-queue { display: none; justify-self: start; }
.evaluator-training-plans-layout.has-active-plan .evaluator-training-plans-back-to-queue { display: inline-flex; }
.evaluator-training-plans-report-context,
.evaluator-training-plans-existing-options,
.evaluator-training-plans-editor,
.evaluator-training-plans-review,
.evaluator-training-plans-selection {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.evaluator-training-plans-editor { border-color: var(--brand-gold); background: var(--color-surface); }
.evaluator-training-plans-review { border-top: 3px solid var(--brand-gold); }
.evaluator-training-plans-selection { border-top: 3px solid var(--brand-teal); }
.evaluator-training-plans-report-context > p,
.evaluator-training-plans-empty { margin: 0; color: var(--muted); line-height: 1.5; }
.evaluator-training-plan-option-cards,
.evaluator-training-plan-review-list { display: grid; gap: 10px; }
.evaluator-training-plan-option-card,
.evaluator-training-plan-review-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--color-surface);
}
.evaluator-training-plan-option-card.is-selected { border-color: var(--brand-teal); box-shadow: inset 3px 0 0 var(--brand-teal); }
.evaluator-training-plan-option-card > div { min-width: 0; }
.evaluator-training-plan-option-card span,
.evaluator-training-plan-review-list span,
.evaluator-training-plan-selection-grid span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.evaluator-training-plan-option-card h4,
.evaluator-training-plan-review-list h4 { margin: 4px 0; color: var(--brand-navy); font-size: 15px; line-height: 1.3; }
.evaluator-training-plan-option-card p,
.evaluator-training-plan-review-list p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.evaluator-training-plan-option-card > div:last-child,
.evaluator-training-plan-review-list article > div:last-child { display: grid; justify-items: end; gap: 4px; text-align: right; }
.evaluator-training-plan-option-card strong,
.evaluator-training-plan-review-list strong { color: var(--brand-navy); font-size: 14px; }
.evaluator-training-plan-option-card small,
.evaluator-training-plan-review-list small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.evaluator-training-plan-option-card em { padding: 4px 7px; color: var(--brand-teal); border: 1px solid rgba(57, 124, 122, 0.24); border-radius: 999px; background: rgba(57, 124, 122, 0.1); font-size: 10px; font-style: normal; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; }
.evaluator-training-plan-selection-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.evaluator-training-plan-selection-grid article { min-width: 0; display: grid; gap: 5px; padding: 13px; border: 1px solid var(--line); border-radius: 7px; background: var(--color-surface); }
.evaluator-training-plan-selection-grid strong { color: var(--brand-navy); font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.evaluator-training-plan-selection-grid small { color: var(--muted); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.evaluator-training-plans-actions { justify-content: flex-end; }
.member-training-option-notice { margin: 0; padding: 10px 12px; color: var(--navy); border: 1px solid var(--gold-border); border-radius: 7px; background: var(--gold-soft); font-size: 13px; line-height: 1.45; }

@media (max-width: 1024px) {
  .evaluator-training-plans-layout { grid-template-columns: minmax(240px, 290px) minmax(0, 1fr); gap: 16px; }
  .evaluator-training-plan-selection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .workspace-panel.evaluator-training-plans-panel { padding: 20px; }
  .evaluator-training-plans-layout { grid-template-columns: 1fr; }
  .evaluator-training-plans-queue-panel { position: static; }
  .evaluator-training-plans-queue { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .evaluator-training-plans-queue .evaluator-report-queue-item { height: 100%; }
  .workspace-panel.evaluator-training-plans-panel.has-active-plan #evaluatorTrainingPlansWorkspaceSummary { display: none; }
  .evaluator-training-plans-layout.has-active-plan .evaluator-training-plans-queue-panel { display: none; }
  .evaluator-training-plans-back-to-queue { display: inline-flex; }
}

@media (max-width: 620px) {
  .workspace-panel.evaluator-training-plans-panel { gap: 16px; padding: 16px; }
  .evaluator-training-plans-panel > .panel-heading h2 { font-size: 24px; }
  .evaluator-training-plans-queue-panel,
  .evaluator-training-plans-content { padding: 14px; }
  .evaluator-training-plans-queue,
  .evaluator-training-plan-selection-grid { grid-template-columns: 1fr; }
  .evaluator-training-plan-option-card,
  .evaluator-training-plan-review-list article { grid-template-columns: 1fr; }
  .evaluator-training-plan-option-card > div:last-child,
  .evaluator-training-plan-review-list article > div:last-child { justify-items: start; text-align: left; }
  .evaluator-training-plans-actions { display: grid; grid-template-columns: 1fr; }
  .evaluator-training-plans-actions > * { width: 100%; }
  .evaluator-training-plans-editor { padding: 14px; }
}

@media (max-width: 1024px) {
  .evaluator-app-nav { grid-template-columns: auto minmax(0, 1fr) auto; }
  .evaluator-primary-nav { justify-content: flex-end; }
  .evaluator-nav-button { padding-inline: 9px; }
  .evaluator-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .evaluator-summary-grid article:nth-child(3) { border-right: 0; }
  .evaluator-summary-grid article:nth-child(n + 4) { border-top: 1px solid var(--line); }
  .evaluator-dashboard-grid { gap: 24px; }
}

@media (max-width: 820px) {
  .evaluator-app-nav { margin-top: 10px; padding: 10px 12px; }
  .evaluator-primary-nav { gap: 0; }
  .evaluator-nav-button { min-height: 42px; padding-inline: 8px; font-size: 12px; }
  .evaluator-dashboard-panel { gap: 20px; padding: 20px; }
  .evaluator-dashboard-heading { align-items: stretch; flex-direction: column; gap: 16px; }
  .evaluator-dashboard-filters { grid-template-columns: 160px minmax(0, 1fr); }
  .evaluator-dashboard-grid { grid-template-columns: 1fr; gap: 24px; }
  .dashboard-column { gap: 24px; }
}

@media (max-width: 620px) {
  body.evaluator-mode { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .evaluator-app-nav { min-height: 58px; margin: 0 -2px 0; padding: 8px 6px; border-radius: 0 0 8px 8px; }
  .evaluator-brand img { width: 31px; height: 31px; padding: 5px; }
  .evaluator-brand small,
  .evaluator-profile-menu summary > span:last-child { display: none; }
  .evaluator-primary-nav {
    position: fixed;
    z-index: 30;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: calc(62px + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    padding: 5px 8px max(5px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 -8px 24px rgba(19, 32, 44, 0.08);
  }
  .evaluator-desktop-nav { display: none; }
  .evaluator-mobile-more { display: block; position: relative; min-width: 0; }
  .evaluator-mobile-more summary {
    min-height: 48px;
    display: grid;
    place-items: center;
    padding: 6px 4px;
    color: #4f5d66;
    border-radius: 6px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
    list-style: none;
  }
  .evaluator-mobile-more summary::-webkit-details-marker { display: none; }
  .evaluator-mobile-more[open] summary { color: var(--brand-navy); background: #fbf7ec; }
  .evaluator-mobile-more > div {
    position: absolute;
    right: 0;
    bottom: calc(100% + 8px);
    width: 176px;
    display: grid;
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-surface);
    box-shadow: 0 -10px 28px rgba(19, 32, 44, 0.16);
  }
  .evaluator-mobile-more button { min-height: 42px; color: var(--brand-navy); border-color: transparent; background: transparent; font-weight: 800; text-align: left; }
  .evaluator-mobile-more button:hover { background: #fbf7ec; }
  .evaluator-nav-button { min-width: 0; min-height: 48px; padding: 6px 4px; border-radius: 6px; font-size: 11px; }
  .evaluator-dashboard-panel { padding: 16px; }
  .evaluator-dashboard-heading h2 { font-size: 24px; }
  .evaluator-dashboard-filters { grid-template-columns: 1fr; }
  .evaluator-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .evaluator-summary-grid article { min-height: 96px; padding: 13px; border-right: 1px solid var(--line); border-top: 1px solid var(--line); }
  .evaluator-summary-grid article:nth-child(1),
  .evaluator-summary-grid article:nth-child(2) { border-top: 0; }
  .evaluator-summary-grid article:nth-child(2n) { border-right: 0; }
  .evaluator-summary-grid article:last-child { grid-column: 1 / -1; border-right: 0; }
  .evaluator-summary-grid strong { font-size: 25px; }
  .evaluator-priority-section { padding: 14px; }
  .workflow-queue-item { grid-template-columns: 34px minmax(0, 1fr); gap: 10px; }
  .workflow-queue-actions { grid-column: 2; min-width: 0; width: 100%; }
  .workflow-queue-action { width: 100%; min-width: 0; }
  .workflow-queue-next-action { grid-column: 2; min-width: 0; text-align: left; }
  .workflow-queue-title-row { align-items: start; flex-direction: column; gap: 6px; }
  .dashboard-member-result { align-items: stretch; flex-direction: column; }
  .dashboard-member-result .secondary-button { width: 100%; }
  .dashboard-activity-list article { grid-template-columns: 8px minmax(0, 1fr); }
  .dashboard-activity-list time { grid-column: 2; text-align: left; }
  .evaluator-today-section { padding: 14px; }
  .evaluator-workspace-summary { padding: 14px; }
  .evaluator-workspace-summary-heading { display: grid; }
  .evaluator-workspace-summary-heading .status-chip { justify-self: start; }
  .evaluator-account-identity { grid-template-columns: auto minmax(0, 1fr); }
  .evaluator-account-identity .role-chip { grid-column: 1 / -1; justify-self: start; }
  .evaluator-account-grid { grid-template-columns: 1fr; }
}

/* Owner and manager operations workspace. Existing management forms remain separate focused views. */
body.management-mode .app-header {
  padding: 20px 22px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

body.management-mode .staff-bar {
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: var(--shadow-soft);
}

.management-mobile-nav { display: none; }

.staff-access-summary {
  display: grid;
  gap: 5px;
  padding: 13px 14px;
  border: 1px solid #d8e1e6;
  border-left: 3px solid #6b93aa;
  border-radius: 8px;
  background: #f7fafb;
}

.staff-access-summary[data-access="manager"] { border-left-color: #b3862a; background: #fffaf0; }
.staff-access-summary[data-access="evaluator"] { border-left-color: #4d8c65; background: #f5fbf7; }
.staff-access-summary strong { color: var(--navy); font-size: 14px; }
.staff-access-summary p { margin: 0; color: #4d5e68; font-size: 13px; line-height: 1.45; }

.staff-account-directory,
.staff-account-editor {
  display: grid;
  gap: 14px;
}

.staff-account-directory {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.staff-account-editor {
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.staff-account-editor .panel-description {
  margin: 5px 0 0;
}

.staff-account-role-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.staff-account-role-summary span {
  display: flex;
  align-items: baseline;
  gap: 6px;
  min-height: 50px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.staff-account-role-summary span:nth-child(1) { border-top: 3px solid #c79732; }
.staff-account-role-summary span:nth-child(2) { border-top: 3px solid #63889d; }
.staff-account-role-summary span:nth-child(3) { border-top: 3px solid #5b9c70; }
.staff-account-role-summary strong { color: var(--navy); font-size: 21px; }

.staff-role-assignment {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
}

.staff-role-assignment legend {
  padding: 0;
  color: var(--navy);
  font-size: 13px;
  font-weight: 800;
}

.staff-role-assignment .field-help {
  margin: -3px 0 0;
}

.staff-role-assignment-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.staff-role-option {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  min-height: 106px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
  cursor: pointer;
}

.staff-role-option:has(input:checked) {
  border-color: rgba(63, 143, 89, 0.48);
  background: #f5fbf7;
}

.staff-role-option[data-access="owner"]:has(input:checked) {
  border-color: rgba(184, 137, 37, 0.55);
  background: #fffaf0;
}

.staff-role-option input {
  width: 17px;
  height: 17px;
  margin: 1px 0 0;
  accent-color: var(--green);
}

.staff-role-option span {
  display: grid;
  gap: 5px;
}

.staff-role-option strong { color: var(--navy); font-size: 14px; }
.staff-role-option small { color: #4d5e68; font-size: 12px; line-height: 1.4; }

.staff-access-guide {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-top: 1px solid var(--line);
}

.staff-access-guide h3 { margin: 3px 0 0; color: var(--navy); font-size: 17px; }
.staff-access-guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.staff-access-guide-grid article { padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.staff-access-guide-grid article[data-access="manager"] { border-top: 3px solid #c79732; }
.staff-access-guide-grid article[data-access="evaluator"] { border-top: 3px solid #5b9c70; }
.staff-access-guide-grid span { color: var(--navy); font-size: 13px; font-weight: 800; }
.staff-access-guide-grid p { margin: 7px 0 0; color: #4d5e68; font-size: 13px; line-height: 1.45; }

.staff-directory-card { border-left: 3px solid #63889d; }
.staff-directory-card[data-access="manager"] { border-left-color: #c79732; }
.staff-directory-card[data-access="evaluator"] { border-left-color: #5b9c70; }
.staff-directory-summary { max-width: 760px; margin: 10px 0 0; color: #4d5e68; font-size: 13px; line-height: 1.45; }
.staff-role-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.staff-role-chips .role-chip { margin: 0; }

.workspace-panel.operations-dashboard-panel {
  display: none;
  gap: 24px;
  padding: 24px;
  background: #fcfcfa;
}

.workspace-panel.operations-dashboard-panel.is-active { display: grid; }

.payment-records-panel {
  display: none;
  gap: 22px;
}

.payment-records-panel.is-active {
  display: grid;
}

.payment-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.finance-metric-card {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 138px;
  border-top: 3px solid var(--apd-border-default, var(--line));
}

.finance-metric-card p,
.finance-metric-card span { margin: 0; }

.finance-metric-card strong {
  color: var(--navy);
  font-size: 23px;
  line-height: 1.1;
}

.finance-metric-card span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.finance-metric-card.is-revenue { border-top-color: var(--gold, #c89b3c); }
.finance-metric-card.is-commission { border-top-color: #5b9c70; }
.finance-metric-card.is-eligible { border-top-color: #8aa670; }
.finance-metric-card.is-settled { border-top-color: #7d8d98; }
.finance-metric-card.is-muted { border-top-color: #a9b5bd; }
.finance-metric-card.is-attention { border-top-color: #c79732; }
.finance-metric-card.is-disputed { border-top-color: #b34a45; }
.finance-metric-card.is-carry { border-top-color: #b18242; }

.finance-metric-card.is-available {
  border-top-color: var(--gold, #c89b3c);
  background: var(--navy);
}

.finance-metric-card.is-available p,
.finance-metric-card.is-available span { color: rgba(255, 255, 255, 0.72); }
.finance-metric-card.is-available strong { color: #fffdf8; font-size: 28px; }

.payment-entry-section,
.payment-history-section {
  display: grid;
  gap: 14px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.finance-owner-controls {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 16px;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-surface-secondary, #f8faf9);
}

.finance-owner-controls p,
.finance-owner-controls h3 {
  margin: 0;
}

.finance-owner-controls h3 {
  margin-top: 4px;
  color: var(--navy);
  font-size: 16px;
}

.finance-owner-controls .panel-description {
  max-width: 70ch;
  margin-top: 5px;
}

.finance-owner-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.commission-position-section,
.supervisor-statement-section,
.commission-payout-history-section {
  display: grid;
  gap: 14px;
}

.commission-position-card {
  border-left: 3px solid var(--gold, #c89b3c);
}

.finance-settlement-priority {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-border-default, var(--line));
}

.finance-settlement-priority > div {
  display: grid;
  align-content: center;
  gap: 4px;
  min-height: 76px;
  padding: 13px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.finance-settlement-priority > div:first-child { background: var(--navy); }

.finance-settlement-priority span,
.finance-settlement-priority small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.finance-settlement-priority strong {
  color: var(--navy);
  font-size: 20px;
  line-height: 1.1;
}

.finance-settlement-priority > div:first-child span,
.finance-settlement-priority > div:first-child small { color: rgba(255, 255, 255, 0.72); }
.finance-settlement-priority > div:first-child strong { color: #fffdf8; font-size: 25px; }

.finance-settlement-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.finance-detail-disclosure {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.finance-detail-disclosure summary {
  width: fit-content;
  color: var(--navy);
  cursor: pointer;
  font-size: 13px;
  font-weight: 750;
}

.finance-detail-facts {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-surface-secondary, #f8faf9);
}

.finance-unavailable-note {
  max-width: 190px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}

.commission-position-card .payment-history-head > .payment-history-actions > strong {
  color: var(--navy);
  font-size: 20px;
  white-space: nowrap;
}

.commission-statement-card {
  display: grid;
  gap: 14px;
}

.finance-statement-heading { align-items: start; }
.finance-statement-heading .eyebrow { margin: 0 0 3px; }

.finance-statement-available {
  display: grid;
  gap: 3px;
  min-width: 180px;
  padding: 11px 13px;
  background: var(--navy);
}

.finance-statement-available span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.finance-statement-available strong {
  color: #fffdf8;
  font-size: 22px;
}

.refund-confirmation-summary ul {
  display: grid;
  gap: 5px;
  max-height: 132px;
  margin: 14px 0 0;
  padding: 0;
  padding-right: 8px;
  list-style: none;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.refund-confirmation-summary li {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 0;
  border-top: 1px solid var(--apd-border-default, var(--line));
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.refund-confirmation-summary li > div { display: grid; gap: 2px; }
.refund-confirmation-summary li strong { color: var(--navy); }
.refund-confirmation-summary li b { color: var(--navy); white-space: nowrap; }

.finance-preview-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}

.finance-preview-heading h3,
.finance-preview-heading p { margin: 0; }
.finance-preview-heading h3 { margin-top: 3px; color: var(--navy); font-size: 16px; }
.finance-preview-heading > strong { color: var(--navy); font-size: 24px; }

.finance-preview-balance {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 14px 0 0;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-border-default, var(--line));
}

.finance-preview-balance > div { padding: 10px; background: var(--apd-surface-primary, #fff); }
.finance-preview-balance dt { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.finance-preview-balance dd { margin: 3px 0 0; color: var(--navy); font-size: 17px; font-weight: 750; }

.payment-balance-context {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 82px;
  padding: 12px 14px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 8px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.payment-balance-context p,
.payment-balance-context span {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.payment-balance-context strong {
  color: var(--navy);
  font-size: 20px;
}

.payment-balance-context .status-chip {
  justify-self: start;
  margin-top: 2px;
}

.finance-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}

.payment-history-card {
  display: grid;
  gap: 14px;
}

.payment-history-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.payment-history-head h4,
.payment-history-head p {
  margin: 0;
}

.payment-history-head p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.payment-history-head > strong {
  color: var(--navy);
  font-size: 20px;
  white-space: nowrap;
}

.payment-history-actions {
  display: flex;
  align-items: center;
  justify-content: end;
  flex-wrap: wrap;
  gap: 10px;
}

.payment-history-actions .secondary-button {
  min-height: 36px;
  padding: 7px 12px;
}

.payment-history-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}

.payment-history-facts div {
  min-width: 0;
}

.payment-history-facts dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.payment-history-facts dd {
  margin: 4px 0 0;
  color: var(--navy);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.refund-history-list {
  display: grid;
  gap: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.refund-history-list > .eyebrow {
  margin: 0;
}

.refund-history-item {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-surface-secondary, #f8faf9);
}

.refund-history-item > div {
  display: grid;
  gap: 3px;
}

.refund-history-item > div:first-child strong,
.refund-history-item > div:last-of-type strong {
  color: var(--navy);
}

.refund-history-item span,
.refund-history-item p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.refund-history-item > div:last-of-type {
  text-align: right;
}

.refund-history-item .secondary-button {
  margin-top: 5px;
  min-height: 32px;
  padding: 5px 9px;
}

@media (max-width: 620px) {
  .finance-owner-actions,
  .payment-history-actions {
    justify-content: stretch;
  }

  .finance-owner-actions > button,
  .payment-history-actions > button {
    flex: 1 1 180px;
  }
}

.finance-event-reversed {
  color: var(--muted);
  font-weight: 700;
}

.refund-history-item.is-reversed,
.financial-timeline-item.is-reversed {
  background: var(--apd-surface-primary, #fff);
}

.financial-timeline {
  display: grid;
  gap: 8px;
}

.financial-timeline-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-surface-secondary, #f8faf9);
}

.financial-timeline-item > div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.financial-timeline-item span {
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}

.financial-timeline-item > strong {
  color: var(--navy);
  white-space: nowrap;
}

.finance-timeline-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.finance-status-text {
  color: var(--apd-text-secondary, var(--muted));
  font-size: 12px;
  font-weight: 650;
}

.refund-dialog {
  width: min(760px, calc(100vw - 32px));
  max-height: min(860px, calc(100vh - 32px));
  padding: 0;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 8px;
  background: var(--apd-surface-primary, #fff);
  box-shadow: var(--apd-shadow-lg, 0 18px 44px rgba(13, 27, 36, 0.2));
}

.refund-dialog::backdrop { background: rgba(5, 18, 29, 0.52); }

.refund-form {
  max-height: inherit;
  overflow: auto;
  padding: 24px;
}

.dialog-heading-row {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
}

.dialog-heading-row h2,
.dialog-heading-row p { margin: 0; }
.dialog-heading-row h2 { margin-top: 4px; color: var(--navy); }
.dialog-heading-row p:not(.eyebrow) { max-width: 56ch; margin-top: 8px; color: var(--muted); line-height: 1.45; }

.refund-payment-context,
.refund-confirmation-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-border-default, var(--line));
}

.refund-payment-context > div,
.refund-confirmation-summary dl > div {
  display: grid;
  gap: 4px;
  padding: 12px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.refund-payment-context > .finance-context-highlight {
  grid-column: 1 / -1;
  background: var(--apd-navy-900, var(--navy));
}

.refund-payment-context > .finance-context-highlight span,
.refund-payment-context > .finance-context-highlight small {
  color: rgba(255, 255, 255, 0.72);
}

.refund-payment-context > .finance-context-highlight strong {
  color: #fff;
  font-size: 21px;
}

.refund-payment-context span,
.refund-confirmation-summary dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.refund-payment-context strong,
.refund-confirmation-summary dd {
  margin: 0;
  color: var(--navy);
  font-size: 14px;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.refund-confirmation-summary {
  padding: 16px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.refund-confirmation-summary h3,
.refund-confirmation-summary .eyebrow { margin: 0; }
.refund-confirmation-summary h3 { color: var(--navy); }
.refund-confirmation-summary dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; border: 1px solid var(--apd-border-default, var(--line)); background: var(--apd-border-default, var(--line)); }

.dialog-actions {
  display: flex;
  justify-content: end;
  flex-wrap: wrap;
  gap: 10px;
}

@media (max-width: 820px) {
  .payment-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .payment-history-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .finance-settlement-priority { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-settlement-priority > :first-child { grid-column: 1 / -1; }
  .finance-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .payment-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .payment-history-head,
  .refund-history-item { align-items: stretch; flex-direction: column; }
  .payment-history-actions { justify-content: space-between; }
  .refund-history-item > div:last-of-type { text-align: left; }
  .refund-payment-context,
  .refund-confirmation-summary dl { grid-template-columns: 1fr; }
  .finance-settlement-priority,
  .finance-detail-facts,
  .finance-preview-balance { grid-template-columns: 1fr; }
  .refund-confirmation-summary ul { max-height: 112px; }
  .refund-form { padding: 18px; }
  .dialog-heading-row { gap: 12px; }
  .dialog-actions > button { flex: 1 1 180px; }
  .finance-owner-controls { align-items: stretch; flex-direction: column; }
  .financial-timeline-item { align-items: start; flex-direction: column; }
}

.operations-dashboard-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.operations-dashboard-heading h2 {
  margin: 0;
  color: var(--navy);
  font-size: 28px;
  line-height: 1.1;
}

.operations-dashboard-heading .panel-description {
  max-width: 640px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.operations-dashboard-controls {
  display: grid;
  grid-template-columns: 150px minmax(240px, 300px);
  gap: 10px;
}

.operations-dashboard-controls label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.operations-dashboard-controls input,
.operations-dashboard-controls select {
  min-width: 0;
  min-height: 44px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.operations-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.operations-summary-grid.payment-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.operations-summary-grid article {
  min-height: 112px;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 16px;
  border-right: 1px solid var(--line);
}

.operations-summary-grid article:last-child { border-right: 0; }
.operations-summary-grid span { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.operations-summary-grid strong { color: var(--navy); font-size: 29px; line-height: 1; }
.operations-summary-grid small { color: var(--muted); font-size: 12px; line-height: 1.35; }

.operations-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.operations-quick-actions .secondary-button {
  min-height: 42px;
  border-color: #dccd9d;
  background: #fffdf7;
}

.operations-priority-section {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid #d9c37e;
  border-radius: 8px;
  background: #fffdf7;
}

.operations-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 32px;
  align-items: start;
}

.operations-team-section .workflow-queue-item {
  grid-template-columns: 38px minmax(0, 1fr) auto;
}

.system-control-panel {
  display: none;
  gap: 20px;
}

.system-control-panel.is-active {
  display: grid;
}

.system-control-panel .panel-heading {
  align-items: start;
}

.system-control-panel .panel-heading > .status-chip {
  margin-left: auto;
}

.owner-system-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
}

.owner-system-summary article {
  min-height: 118px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.owner-system-summary article:nth-child(4n) { border-right: 0; }
.owner-system-summary article:nth-last-child(-n + 3) { border-bottom: 0; }
.owner-system-summary span { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.owner-system-summary strong { color: var(--navy); font-size: 25px; line-height: 1.1; overflow-wrap: anywhere; }
.owner-system-summary small { color: var(--muted); font-size: 12px; line-height: 1.4; }

.owner-system-safeguards,
.owner-backup-section {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.owner-system-safeguards h3,
.owner-backup-section h3 {
  margin: 3px 0 0;
  color: var(--navy);
  font-size: 18px;
}

.owner-system-safeguards ul {
  display: grid;
  gap: 9px;
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.homepage-content-panel {
  display: none;
  gap: 20px;
}

.homepage-content-panel.is-active {
  display: grid;
}

.homepage-content-heading {
  align-items: start;
}

.homepage-content-heading > .status-chip {
  margin-left: auto;
}

.homepage-content-form {
  display: grid;
  gap: 0;
}

.homepage-editor-band {
  display: grid;
  gap: 14px;
  padding: 22px 0;
  border-top: 1px solid var(--line);
}

.homepage-editor-band:first-child {
  padding-top: 0;
  border-top: 0;
}

.homepage-editor-band h3 {
  margin: 3px 0 0;
  color: var(--navy);
  font-size: 18px;
}

.homepage-editor-band .section-heading-row {
  align-items: start;
}

.homepage-editor-band textarea {
  resize: vertical;
}

.homepage-toggle-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.homepage-content-actions {
  margin-top: 6px;
}

.cms-settings-block,
.cms-preview,
.pdf-logo-settings {
  display: grid;
  gap: 16px;
  margin: 0 0 24px;
  padding: 20px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
  box-shadow: var(--apd-shadow-xs);
}

.cms-content-map {
  display: grid;
  gap: 14px;
  margin: 0 0 20px;
  padding: 18px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
  box-shadow: var(--apd-shadow-xs);
}

.cms-content-map h3 {
  margin: 3px 0 0;
  color: var(--apd-text-primary);
  font-size: 18px;
}

.cms-content-map p {
  margin: 6px 0 0;
  color: var(--apd-text-secondary);
}

.cms-content-map-items {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cms-content-map-status {
  grid-column: 1 / -1;
  margin: 0 !important;
  font-size: 13px;
}

.cms-content-map-card {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-primary);
  color: inherit;
  text-decoration: none;
}

.cms-content-map-card:hover {
  border-color: var(--apd-accent-gold);
}

.cms-content-map-card span,
.cms-content-map-card small {
  color: var(--apd-text-secondary);
  font-size: 12px;
}

.cms-content-map-card strong,
.cms-content-map-card small {
  overflow-wrap: anywhere;
}

.cms-subsection,
.cms-field-group {
  display: grid;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--apd-border-default);
}

.cms-subsection h4,
.cms-field-group h4,
.cms-preview h3,
.pdf-logo-settings h3 {
  margin: 3px 0 0;
  color: var(--apd-text-primary);
  font-size: 17px;
}

.cms-field-group-heading,
.cms-preview-heading,
.cms-media-actions,
.cms-preview-devices,
.cms-contrast-checks,
.field-action-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
}

.cms-field-group-heading {
  justify-content: space-between;
}

.cms-generated-fields {
  display: grid;
  gap: 18px;
}

.cms-navigation-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.cms-navigation-fields label {
  display: grid;
  gap: 6px;
}

.cms-navigation-field {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}

.field-action-row {
  margin-top: -6px;
}

.cms-navigation-fields small,
.cms-asset-card small,
.cms-asset-card em {
  color: var(--apd-text-secondary);
  font-size: 12px;
  font-style: normal;
}

.cms-asset-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.cms-asset-card {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-primary);
}

.cms-asset-card > div:not(.cms-asset-preview) {
  display: grid;
  gap: 3px;
}

.cms-asset-preview {
  height: 94px;
  overflow: hidden;
  border: 1px solid var(--apd-border-subtle);
  background: white;
}

.cms-asset-preview.is-background {
  height: 128px;
  background: var(--apd-surface-muted);
}

.cms-asset-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cms-asset-preview.is-background img {
  object-fit: cover;
}

.file-action {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  cursor: pointer;
}

.file-action input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.cms-contrast-checks span {
  padding: 6px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.cms-contrast-checks .is-pass {
  color: var(--apd-success);
  background: var(--apd-success-surface);
}

.cms-contrast-checks .is-fail {
  color: var(--apd-danger);
  background: var(--apd-danger-surface);
}

.cms-preview-heading {
  align-items: flex-start;
  justify-content: space-between;
}

.cms-preview-heading p:not(.eyebrow) {
  max-width: 60ch;
  margin: 7px 0 0;
  color: var(--apd-text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

.cms-preview-devices .is-active {
  color: var(--apd-text-on-dark);
  border-color: var(--apd-navy-800);
  background: var(--apd-navy-800);
}

.cms-preview-viewport {
  overflow: auto;
  min-height: 720px;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: #dfe4e7;
}

.cms-preview-viewport iframe {
  display: block;
  width: 1440px;
  height: 900px;
  margin: 0 auto;
  border: 1px solid var(--apd-border-strong);
  background: white;
  box-shadow: var(--apd-shadow-sm);
}

.cms-preview-viewport[data-preview-width="390"] iframe {
  height: 844px;
}

.pdf-logo-settings {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.55fr);
  align-items: end;
}

.pdf-logo-settings > div {
  grid-row: span 2;
}

.pdf-logo-settings p:not(.eyebrow) {
  margin: 7px 0 0;
  color: var(--apd-text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 760px) {
  .homepage-content-panel {
    gap: 16px;
    padding: 16px;
  }

  .homepage-content-heading {
    display: grid;
    gap: 12px;
  }

  .homepage-content-heading > .status-chip {
    margin-left: 0;
    justify-self: start;
  }

  .homepage-editor-band {
    padding: 18px 0;
  }

  .homepage-toggle-grid {
    grid-template-columns: 1fr;
  }

  .homepage-content-actions {
    display: grid;
  }

  .cms-settings-block,
  .cms-preview,
  .pdf-logo-settings {
    padding: 16px;
  }

  .cms-navigation-fields,
  .cms-asset-grid,
  .cms-content-map-items,
  .pdf-logo-settings {
    grid-template-columns: 1fr;
  }

  .pdf-logo-settings > div {
    grid-row: auto;
  }

  .cms-preview-heading {
    display: grid;
  }
}

/* Phase 1 supervisor surfaces reuse the existing operations layout. */
body.supervisor-mode .staff-bar {
  border-color: var(--apd-border-default);
}

.supervisor-dashboard-panel .operations-dashboard-grid {
  margin-top: 18px;
}

.supervisor-dashboard-panel .metric-card {
  min-height: 116px;
  display: grid;
  align-content: center;
  gap: 8px;
}

.supervisor-dashboard-panel .metric-card p {
  margin: 0;
  color: var(--apd-text-secondary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.supervisor-dashboard-panel .metric-card strong {
  color: var(--apd-text-primary);
  font-size: 32px;
  line-height: 1;
}

.status-summary-card {
  align-self: start;
  padding: 12px 14px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
  color: var(--apd-text-primary);
  font-size: 13px;
  font-weight: 700;
}

.member-transfer-controls {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--apd-border-subtle);
}

.member-transfer-controls summary {
  cursor: pointer;
  color: var(--apd-text-primary);
  font-size: 13px;
  font-weight: 700;
}

.member-transfer-controls .intake-assignment-row,
#ownershipAssignmentList .intake-assignment-row {
  margin-top: 12px;
}

.transfer-history {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.transfer-history-item {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid var(--apd-border-subtle);
  background: var(--apd-surface-secondary);
}

.transfer-history-item strong { color: var(--apd-text-primary); }
.transfer-history-item span,
.transfer-history-item small { color: var(--apd-text-secondary); }

.toggle-field {
  display: grid;
  align-content: center;
  gap: 9px;
  min-height: 100%;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
}

.toggle-field label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--apd-text-primary);
  font-size: 13px;
  font-weight: 700;
}

@media (max-width: 620px) {
  .supervisor-dashboard-panel .operations-dashboard-grid {
    gap: 14px;
  }

  .status-summary-card {
    width: 100%;
  }

  .member-transfer-controls .intake-assignment-row,
  #ownershipAssignmentList .intake-assignment-row {
    grid-template-columns: 1fr;
  }
}

.owner-backup-section .section-heading-row {
  align-items: end;
}

.owner-backup-section .panel-description { max-width: 720px; margin: 7px 0 0; }

.owner-backup-list {
  display: grid;
  border-top: 1px solid var(--line);
}

.owner-backup-row {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}

.owner-backup-row > div { min-width: 0; display: grid; gap: 3px; }
.owner-backup-row strong { color: var(--navy); font-size: 14px; }
.owner-backup-row small { overflow-wrap: anywhere; color: var(--muted); font-size: 12px; line-height: 1.4; }
.owner-backup-row .secondary-button { flex: 0 0 auto; text-decoration: none; }

@media (max-width: 1180px) {
  .operations-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .operations-summary-grid.payment-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .operations-summary-grid article:nth-child(3) { border-right: 0; }
  .operations-summary-grid article:nth-child(n + 4) { border-top: 1px solid var(--line); }
  .owner-system-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .owner-system-summary article:nth-child(4n) { border-right: 1px solid var(--line); }
  .owner-system-summary article:nth-last-child(-n + 3) { border-bottom: 1px solid var(--line); }
  .owner-system-summary article:nth-child(3n) { border-right: 0; }
  .owner-system-summary article:nth-last-child(-n + 1) { border-bottom: 0; }
}

@media (max-width: 820px) {
  body.management-mode .app-header { padding: 16px; }
  body.supervisor-mode .app-header { padding: 16px; }
  body.management-mode { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  body.supervisor-mode { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  body.management-mode .app-header { min-height: 0; grid-template-columns: minmax(0, 1fr); }
  body.supervisor-mode .app-header { min-height: 0; grid-template-columns: minmax(0, 1fr); }
  body.management-mode .app-header .metric-strip { display: none; }
  body.supervisor-mode .app-header .metric-strip { display: none; }
  body.management-mode .app-header h1 { font-size: 25px; }
  body.supervisor-mode .app-header h1 { font-size: 25px; }
  body.management-mode .staff-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  body.supervisor-mode .staff-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  body.management-mode .staff-bar .secondary-button,
  body.management-mode .staff-bar .quiet-button,
  body.supervisor-mode .staff-bar .secondary-button,
  body.supervisor-mode .staff-bar .quiet-button { grid-column: 1 / -1; width: 100%; }
  body.management-mode .workspace { display: block; margin-top: 12px; }
  body.supervisor-mode .workspace { display: block; margin-top: 12px; }
  body.management-mode .workspace-sidebar { display: none; }
  body.supervisor-mode .workspace-sidebar { display: none; }
  body.management-mode .workspace-content { max-width: 920px; margin-inline: auto; }
  body.supervisor-mode .workspace-content { max-width: 920px; margin-inline: auto; }
  .management-mobile-nav {
    position: fixed;
    z-index: 30;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: calc(62px + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    padding: 5px 8px max(5px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 -8px 24px rgba(19, 32, 44, 0.08);
  }
  .management-mobile-nav > button,
  .management-mobile-more summary {
    min-width: 0;
    min-height: 48px;
    display: grid;
    place-items: center;
    padding: 6px 4px;
    color: #4f5d66;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
  }
  .management-mobile-nav > button:hover,
  .management-mobile-nav > button.active,
  .management-mobile-nav > button[aria-selected="true"],
  .management-mobile-more[open] summary {
    color: var(--navy);
    border-color: #dfc889;
    background: #fbf7ec;
  }
  .management-mobile-more { position: relative; }
  .management-mobile-more summary { list-style: none; }
  .management-mobile-more summary::-webkit-details-marker { display: none; }
  .management-mobile-more > div {
    position: absolute;
    right: 0;
    bottom: calc(100% + 8px);
    width: min(220px, calc(100vw - 24px));
    display: grid;
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(19, 32, 44, 0.16);
  }
  .management-mobile-more > div button {
    min-height: 42px;
    padding: 9px 10px;
    color: var(--navy);
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    text-align: left;
  }
  .management-mobile-more > div button:hover { border-color: #dfc889; background: #fbf7ec; }
  .workspace-panel.operations-dashboard-panel { gap: 20px; padding: 20px; }
  .system-control-panel { padding: 20px; }
  .operations-dashboard-heading { align-items: stretch; flex-direction: column; gap: 16px; }
  .operations-dashboard-controls { grid-template-columns: 160px minmax(0, 1fr); }
  .operations-dashboard-grid { grid-template-columns: 1fr; gap: 24px; }
}

@media (max-width: 620px) {
  body.management-mode .app-header { padding: 14px; }
  body.management-mode .staff-bar { padding: 11px 12px; }
  .workspace-panel.operations-dashboard-panel { padding: 16px; }
  .system-control-panel { gap: 16px; padding: 16px; }
  .operations-dashboard-heading h2 { font-size: 24px; }
  .operations-dashboard-controls { grid-template-columns: 1fr; }
  .operations-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operations-summary-grid.payment-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .payment-history-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operations-summary-grid article { min-height: 96px; padding: 13px; border-right: 1px solid var(--line); border-top: 1px solid var(--line); }
  .operations-summary-grid article:nth-child(1),
  .operations-summary-grid article:nth-child(2) { border-top: 0; }
  .operations-summary-grid article:nth-child(2n) { border-right: 0; }
  .operations-summary-grid article:last-child { grid-column: 1 / -1; border-right: 0; }
  .operations-summary-grid strong { font-size: 25px; }
  .operations-priority-section { padding: 14px; }
  .operations-quick-actions { display: grid; grid-template-columns: 1fr; }
  .operations-quick-actions .secondary-button { width: 100%; }
  .staff-access-guide-grid { grid-template-columns: 1fr; }
  .staff-role-assignment-grid { grid-template-columns: 1fr; }
  .staff-account-role-summary { grid-template-columns: 1fr; }
  .system-control-panel .panel-heading { display: grid; gap: 12px; }
  .system-control-panel .panel-heading > .status-chip { margin-left: 0; justify-self: start; }
  .owner-system-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .owner-system-summary article,
  .owner-system-summary article:nth-child(4n),
  .owner-system-summary article:nth-child(3n) { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .owner-system-summary article:nth-child(2n) { border-right: 0; }
  .owner-system-summary article:last-child { border-bottom: 0; }
  .owner-system-safeguards,
  .owner-backup-section { padding: 14px; }
  .owner-backup-section .section-heading-row { align-items: stretch; flex-direction: column; }
  .owner-backup-section .primary-button { width: 100%; }
  .owner-backup-row { align-items: stretch; flex-direction: column; gap: 9px; }
  .owner-backup-row .secondary-button { width: 100%; text-align: center; }
}

/* Ascendrix Performance Depth pilots. These rules are visual-only and deliberately limited to the approved workspaces. */
body.evaluator-mode {
  background: var(--apd-app-background);
}

body.evaluator-mode::before,
body.management-mode:has(#staffAccessBadge[data-access="owner"])::before {
  background: none;
}

body.evaluator-mode .evaluator-app-nav {
  border-color: var(--apd-border-default);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: var(--apd-shadow-sm);
}

body.evaluator-mode .evaluator-brand,
body.evaluator-mode .evaluator-dashboard-heading h2,
body.evaluator-mode .section-heading-row h3,
body.evaluator-mode .dashboard-queue-section h3,
body.evaluator-mode .workflow-queue-title-row strong,
body.evaluator-mode .dashboard-member-result strong,
body.evaluator-mode .dashboard-activity-list strong {
  color: var(--apd-text-primary);
}

body.evaluator-mode .evaluator-brand small,
body.evaluator-mode .evaluator-dashboard-heading .panel-description,
body.evaluator-mode .evaluator-dashboard-filters label,
body.evaluator-mode .dashboard-member-search,
body.evaluator-mode .workflow-queue-title-row span:not(.status-chip),
body.evaluator-mode .workflow-queue-copy small,
body.evaluator-mode .workflow-queue-copy p,
body.evaluator-mode .dashboard-empty-state,
body.evaluator-mode .returning-member-section .card-note,
body.evaluator-mode .dashboard-member-result span,
body.evaluator-mode .dashboard-member-result small,
body.evaluator-mode .dashboard-activity-list small,
body.evaluator-mode .dashboard-activity-list time {
  color: var(--apd-text-secondary);
}

body.evaluator-mode .evaluator-brand img {
  border-color: var(--apd-gold-300);
  background: var(--apd-warm-background);
}

body.evaluator-mode .evaluator-nav-button {
  color: var(--apd-text-secondary);
}

body.evaluator-mode .evaluator-nav-button:hover,
body.evaluator-mode .evaluator-nav-button.active,
body.evaluator-mode .evaluator-nav-button[aria-selected="true"] {
  border-color: transparent;
  background: var(--apd-surface-muted);
  color: var(--apd-navy-800);
  box-shadow: inset 0 -2px 0 var(--apd-gold-500);
}

body.evaluator-mode .evaluator-profile-menu summary {
  color: var(--apd-text-primary);
}

body.evaluator-mode .evaluator-profile-menu summary:hover {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-muted);
}

body.evaluator-mode .evaluator-avatar {
  border-color: var(--apd-gold-300);
  background: var(--apd-gold-100);
  color: var(--apd-gold-700);
}

body.evaluator-mode .evaluator-profile-popover {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-md);
}

body.evaluator-mode .workspace-panel.evaluator-dashboard-panel {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-sm);
}

body.evaluator-mode .evaluator-dashboard-heading,
body.evaluator-mode .dashboard-queue-section + .dashboard-queue-section,
body.evaluator-mode .workflow-queue-item,
body.evaluator-mode .dashboard-member-result,
body.evaluator-mode .dashboard-activity-list article {
  border-color: var(--apd-border-subtle);
}

body.evaluator-mode .evaluator-dashboard-filters input,
body.evaluator-mode .evaluator-dashboard-filters select,
body.evaluator-mode .dashboard-member-search input {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  color: var(--apd-text-primary);
}

body.evaluator-mode .evaluator-dashboard-filters input:focus,
body.evaluator-mode .evaluator-dashboard-filters select:focus,
body.evaluator-mode .dashboard-member-search input:focus {
  border-color: var(--apd-information);
  box-shadow: var(--apd-focus-ring);
}

body.evaluator-mode .evaluator-summary-grid {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-xs);
}

body.evaluator-mode .evaluator-summary-grid article {
  border-color: var(--apd-border-subtle);
  background: var(--apd-surface-primary);
}

body.evaluator-mode .evaluator-summary-grid span,
body.evaluator-mode .evaluator-summary-grid small {
  color: var(--apd-text-secondary);
}

body.evaluator-mode .evaluator-summary-grid strong {
  color: var(--apd-navy-800);
}

body.evaluator-mode .evaluator-priority-section {
  border-color: rgba(35, 103, 135, 0.3);
  background: var(--apd-information-surface);
  box-shadow: var(--apd-shadow-xs);
}

body.evaluator-mode .evaluator-priority-section .status-chip {
  border-color: rgba(53, 101, 123, 0.25);
  background: var(--apd-surface-primary);
  color: var(--apd-information);
}

body.evaluator-mode .workflow-avatar {
  border-color: rgba(53, 101, 123, 0.22);
  background: var(--apd-information-surface);
  color: var(--apd-information);
}

body.evaluator-mode .workflow-queue-action.primary-button {
  border-color: var(--apd-navy-900);
  background: var(--apd-navy-900);
  color: var(--apd-text-on-dark);
}

body.evaluator-mode .workflow-queue-action.secondary-button,
body.evaluator-mode .dashboard-member-result .secondary-button {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  color: var(--apd-navy-900);
}

body.evaluator-mode .quiet-button {
  color: var(--apd-information);
}

body.evaluator-mode .quiet-button:hover {
  color: var(--apd-navy-900);
}

body.evaluator-mode .returning-member-section {
  border-color: var(--apd-border-default);
  border-left-color: var(--apd-information);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-xs);
}

body.evaluator-mode .dashboard-activity-list article > span {
  background: var(--apd-gold-500);
}

body.evaluator-mode .evaluator-dashboard-panel button:focus-visible,
body.evaluator-mode .evaluator-dashboard-panel input:focus-visible,
body.evaluator-mode .evaluator-dashboard-panel select:focus-visible {
  outline: 2px solid var(--apd-information);
  outline-offset: 3px;
}

/* The public header is hidden after evaluator sign-in, so remove the login-page header reserve. */
body.app-body.evaluator-mode {
  padding: 18px;
}

body.evaluator-mode .evaluator-app-nav {
  margin-top: 0;
}

/* Administrator desktop dashboard pilot. The owner role is intentionally isolated from manager and evaluator workspaces. */
body.management-mode:has(#staffAccessBadge[data-access="owner"]) {
  background: var(--apd-app-background);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .app-header,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .staff-bar,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-sidebar {
  border-color: var(--apd-border-default);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--apd-shadow-sm);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .app-header {
  border-left-color: var(--apd-gold-700);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .staff-bar {
  border-left: 3px solid var(--apd-gold-700);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .app-header h1,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-sidebar h2,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-heading h2,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .section-heading-row h3,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .dashboard-queue-section h3,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .workflow-queue-title-row strong {
  color: var(--apd-text-primary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .header-summary,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .staff-bar span,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-heading .panel-description,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-controls label,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .workflow-queue-copy p,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .workflow-queue-copy small,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .workflow-queue-title-row span:not(.status-chip) {
  color: var(--apd-text-secondary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .metric-tile,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid article {
  border-color: var(--apd-border-subtle);
  background: var(--apd-surface-primary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .metric-tile strong,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid strong {
  color: var(--apd-navy-800);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-menu-button {
  color: var(--apd-text-secondary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-menu-button:hover,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-menu-button.active,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-menu-button[aria-selected="true"] {
  border-color: transparent;
  background: var(--apd-surface-muted);
  color: var(--apd-navy-800);
  box-shadow: inset 3px 0 0 var(--apd-gold-500);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-panel.operations-dashboard-panel {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-sm);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-heading,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .workflow-queue-item {
  border-color: var(--apd-border-subtle);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-controls input,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-controls select {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  color: var(--apd-text-primary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-controls input:focus,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-controls select:focus {
  border-color: var(--apd-information);
  box-shadow: var(--apd-focus-ring);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-xs);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid span,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid small {
  color: var(--apd-text-secondary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid .finance-metric-card.is-available {
  border-color: var(--apd-gold-400, var(--gold));
  background: var(--apd-navy-900, var(--navy));
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid .finance-metric-card.is-available strong {
  color: #fffdf8;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid .finance-metric-card.is-available p,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-summary-grid .finance-metric-card.is-available span {
  color: rgba(255, 255, 255, 0.76);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-quick-actions .secondary-button {
  border-color: var(--apd-border-default);
  background: var(--apd-surface-secondary);
  color: var(--apd-navy-900);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section {
  border-color: var(--apd-dark-border);
  background: var(--apd-dark-background);
  box-shadow: var(--apd-shadow-md);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .eyebrow {
  color: var(--apd-gold-300);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section h3,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .section-heading-row h3,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-queue-title-row strong {
  color: var(--apd-text-on-dark);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-queue-item {
  border-color: var(--apd-dark-border);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-queue-copy p,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-queue-copy small,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-queue-title-row span:not(.status-chip) {
  color: var(--apd-text-muted-on-dark);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .status-chip {
  border-color: rgba(232, 198, 116, 0.35);
  background: rgba(255, 255, 255, 0.1);
  color: var(--apd-gold-300);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-avatar {
  border-color: rgba(232, 198, 116, 0.28);
  background: var(--apd-dark-elevated);
  color: var(--apd-gold-300);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-priority-section .workflow-queue-action.primary-button {
  border-color: var(--apd-gold-500);
  background: var(--apd-gold-500);
  color: var(--apd-navy-950);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel .workflow-avatar {
  border-color: rgba(53, 101, 123, 0.22);
  background: var(--apd-information-surface);
  color: var(--apd-information);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel button:focus-visible,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel input:focus-visible,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .operations-dashboard-panel select:focus-visible {
  outline: 2px solid var(--apd-information);
  outline-offset: 3px;
}

@media (max-width: 820px) {
  body.app-body.evaluator-mode {
    padding: 10px;
  }
}

@media (max-width: 620px) {
  body.app-body.evaluator-mode {
    padding: 10px 10px calc(72px + env(safe-area-inset-bottom));
  }
}

.report-cover-settings {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.72fr);
  gap: 20px;
  margin: 6px 0 2px;
  padding: 20px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
  box-shadow: var(--apd-shadow-xs);
}

.report-cover-settings-heading {
  align-self: start;
}

.report-cover-settings-heading .eyebrow {
  margin-bottom: 7px;
}

.report-cover-settings-heading h3 {
  margin: 0;
  color: var(--apd-text-primary);
}

.report-cover-settings-heading p:not(.eyebrow) {
  max-width: 56ch;
  margin: 8px 0 0;
  color: var(--apd-text-secondary);
}

.report-cover-preview {
  position: relative;
  grid-column: 2;
  grid-row: 1 / span 2;
  min-height: 232px;
  overflow: hidden;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-dark-background);
}

.report-cover-preview::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(100deg, rgba(3, 10, 17, 0.82), rgba(4, 15, 26, 0.48) 65%, rgba(5, 17, 29, 0.2));
  pointer-events: none;
}

.report-cover-preview img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 232px;
  object-fit: cover;
}

.report-cover-preview-overlay {
  position: absolute;
  z-index: 1;
  inset: auto 14px 14px;
  color: var(--apd-text-on-dark);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.cover-background-form {
  display: grid;
  gap: 10px;
  align-self: end;
}

.cover-file-field {
  display: grid;
  gap: 7px;
  color: var(--apd-text-primary);
  font-size: 13px;
  font-weight: 700;
}

.cover-file-field input {
  width: 100%;
  color: var(--apd-text-secondary);
}

.cover-upload-guidance,
.cover-background-status {
  margin: 0;
  color: var(--apd-text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.cover-background-status {
  min-height: 18px;
  color: var(--apd-text-primary);
}

.cover-background-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

@media (max-width: 760px) {
  .report-cover-settings {
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .report-cover-preview {
    grid-column: 1;
    grid-row: auto;
    min-height: 210px;
  }

  .report-cover-preview img {
    min-height: 210px;
  }
}

/* Phase 1 final visual QA: ownership and Supervisor operations stay compact and task-led. */
.member-ownership-context {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 3px 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--apd-border-default);
  border-left: 3px solid var(--apd-gold-500);
  background: var(--apd-surface-secondary);
}

.member-ownership-context span,
.member-ownership-context small {
  color: var(--apd-text-secondary);
  font-size: 12px;
  line-height: 1.4;
}

.member-ownership-context span {
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.member-ownership-context strong {
  color: var(--apd-text-primary);
  font-size: 14px;
}

.member-ownership-context small {
  grid-column: 2;
}

.member-assignment-line {
  margin: 0;
  color: var(--apd-text-secondary);
  font-size: 13px;
}

.member-assignment-line strong {
  color: var(--apd-text-primary);
}

.member-workflow-status,
.member-ownership-facts,
.ownership-queue-facts,
.staff-supervisor-summary dl,
.member-transfer-summary dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.member-workflow-status div,
.member-ownership-facts div,
.ownership-queue-facts div,
.staff-supervisor-summary dl div,
.member-transfer-summary dl div {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--apd-border-subtle);
  background: var(--apd-surface-secondary);
}

.member-workflow-status dt,
.member-ownership-facts dt,
.ownership-queue-facts dt,
.staff-supervisor-summary dt,
.member-transfer-summary dt {
  color: var(--apd-text-muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.member-workflow-status dd,
.member-ownership-facts dd,
.ownership-queue-facts dd,
.staff-supervisor-summary dd,
.member-transfer-summary dd {
  margin: 4px 0 0;
  color: var(--apd-text-primary);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.member-ownership-details,
.member-transfer-workflow {
  border-top: 1px solid var(--apd-border-subtle);
}

.member-ownership-details {
  margin-top: 2px;
  padding-top: 12px;
}

.member-ownership-details > summary,
.member-transfer-workflow > summary {
  cursor: pointer;
  color: var(--apd-text-primary);
  font-size: 13px;
  font-weight: 800;
}

.member-ownership-details[open] > summary,
.member-transfer-workflow[open] > summary {
  margin-bottom: 12px;
}

.member-transfer-workflow {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-primary);
}

.member-transfer-summary {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
  color: var(--apd-text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.member-transfer-summary dl {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.member-transfer-summary dl div:last-child {
  grid-column: 1 / -1;
}

.transfer-ready-copy,
.transfer-conflict-copy {
  margin: 0;
  font-weight: 700;
}

.transfer-ready-copy { color: var(--apd-success); }
.transfer-conflict-copy { color: var(--apd-warning); }

.member-transfer-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.member-transfer-form-grid label,
.transfer-confirmation {
  display: grid;
  gap: 6px;
  color: var(--apd-text-secondary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.transfer-confirmation {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: var(--apd-text-primary);
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
}

.transfer-confirmation input {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  margin: 0;
}

.ownership-unassigned-note {
  margin: 12px 0 0;
  color: var(--apd-text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.ownership-queue-card {
  display: grid;
  gap: 12px;
}

.ownership-queue-card .card-note {
  max-width: 720px;
  margin: 5px 0 0;
}

.staff-supervisor-summary {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
}

.staff-supervisor-summary > p {
  margin: 0;
  color: var(--apd-text-primary);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

#supervisorDashboardMetrics.operations-dashboard-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 0;
}

#supervisorDashboardMetrics .metric-card {
  min-height: 104px;
  padding: 15px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-primary);
  box-shadow: var(--apd-shadow-xs);
}

#supervisorDashboardMetrics .metric-card p {
  font-size: 11px;
}

#supervisorDashboardMetrics .metric-card strong {
  font-size: 30px;
}

.supervisor-dashboard-panel .operations-dashboard-grid > .operations-dashboard-card .list-card small {
  display: block;
  margin-top: 4px;
  color: var(--apd-text-muted);
  font-size: 12px;
}

#supervisorMobileNav {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.team-groups-panel {
  display: grid;
  gap: 22px;
}

.team-operations-heading {
  align-items: end;
}

.team-heading-actions,
.team-master-actions,
.team-detail-actions,
.team-action-buttons,
.team-record-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.team-operations-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 8px;
  background: var(--apd-border-default, var(--line));
}

.team-operations-summary > article {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 82px;
  padding: 14px 16px;
  background: var(--apd-surface-primary, #fff);
}

.team-operations-summary span,
.team-operations-summary strong {
  overflow-wrap: anywhere;
}

.team-operations-summary span {
  color: var(--apd-text-muted, var(--muted));
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.team-operations-summary strong {
  color: var(--navy);
  font-size: 25px;
  line-height: 1;
}

.team-operations-summary > article.is-attention {
  border-left: 3px solid var(--apd-status-warning, #c79732);
}

.team-operations-tabs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: fit-content;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 8px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.team-operations-tabs button {
  min-height: 38px;
  padding: 8px 14px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--apd-text-muted, var(--muted));
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.team-operations-tabs button.active {
  background: var(--navy);
  color: #fffdf8;
  box-shadow: var(--apd-shadow-xs);
}

.team-operations-view {
  display: grid;
  grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr);
  gap: 16px;
  align-items: start;
}

.team-operations-master,
.team-operations-detail,
.team-operations-action-panel {
  min-width: 0;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 8px;
  background: var(--apd-surface-primary, #fff);
  box-shadow: var(--apd-shadow-xs);
}

.team-operations-master,
.team-operations-detail {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.team-operations-master .section-heading-row,
.team-operations-detail > .section-heading-row,
.batch-payment-summary-section > .section-heading-row {
  align-items: start;
}

.team-operations-master .panel-description,
.team-operations-detail .panel-description {
  max-width: 52ch;
  margin: 5px 0 0;
}

.team-record-list {
  display: grid;
  gap: 9px;
}

.team-record-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 7px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.team-record-card.is-selected {
  border-color: var(--apd-accent-gold, var(--gold));
  box-shadow: inset 3px 0 0 var(--apd-accent-gold, var(--gold));
}

.team-record-main,
.team-roster-record,
.team-related-batch,
.team-detail-toolbar,
.team-action-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.team-record-main h4,
.team-record-main p,
.team-roster-record h4,
.team-roster-record p,
.team-related-batch h4,
.team-related-batch p,
.team-action-heading h3,
.team-action-heading p {
  margin: 0;
}

.team-record-main h4,
.team-roster-record h4,
.team-related-batch h4 {
  margin-top: 3px;
  color: var(--navy);
  font-size: 15px;
  line-height: 1.25;
}

.team-record-main p:not(.eyebrow),
.team-related-batch p,
.team-roster-record > div > p:not(.card-note) {
  margin-top: 4px;
  color: var(--apd-text-muted, var(--muted));
  font-size: 12px;
  line-height: 1.4;
}

.team-record-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  color: var(--apd-text-secondary, var(--muted));
  font-size: 12px;
  font-weight: 700;
}

.team-record-card .card-note {
  margin: 0;
}

.team-record-actions {
  justify-content: flex-end;
}

.team-detail-toolbar {
  align-items: end;
}

.team-mobile-back {
  display: none;
}

.team-information-card {
  min-width: 0;
}

.team-operational-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 14px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-left: 3px solid var(--apd-accent-gold, var(--gold));
  border-radius: 7px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.team-operational-context h4,
.team-operational-context p {
  margin: 0;
}

.team-operational-context h4 {
  margin-top: 3px;
  color: var(--navy);
  font-size: 14px;
}

.team-operational-context p:not(.eyebrow) {
  margin-top: 4px;
  color: var(--apd-text-muted, var(--muted));
  font-size: 12px;
  line-height: 1.45;
}

.team-information-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 7px;
  background: var(--apd-border-default, var(--line));
}

.team-information-facts > div {
  min-width: 0;
  padding: 11px 12px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.team-information-facts dt {
  color: var(--apd-text-muted, var(--muted));
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.team-information-facts dd {
  margin: 4px 0 0;
  color: var(--navy);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.team-information-facts .team-information-notes {
  grid-column: 1 / -1;
}

.team-detail-actions {
  padding-bottom: 2px;
}

.team-detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.team-detail-section {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 7px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.team-detail-section h4 {
  margin: 3px 0 0;
  color: var(--navy);
  font-size: 15px;
}

.team-roster-record,
.team-related-batch {
  align-items: center;
  padding: 11px 0;
  border-top: 1px solid var(--apd-border-default, var(--line));
}

.team-roster-record:first-child,
.team-related-batch:first-child {
  padding-top: 0;
  border-top: 0;
}

.team-roster-actions {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 7px;
}

.team-roster-record > div:first-child,
.team-related-batch > div:first-child {
  min-width: 0;
}

.batch-progress-card {
  display: grid;
  gap: 14px;
}

.batch-progress-facts,
.batch-payment-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--apd-border-default, var(--line));
  background: var(--apd-border-default, var(--line));
}

.batch-progress-facts > div,
.batch-payment-facts > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px;
  background: var(--apd-surface-primary, #fff);
}

.batch-progress-facts > div.is-attention {
  border-left: 3px solid var(--apd-status-warning, #c79732);
}

.batch-progress-facts span,
.batch-payment-facts span,
.batch-progress-stages span {
  color: var(--apd-text-muted, var(--muted));
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  line-height: 1.3;
  text-transform: uppercase;
}

.batch-progress-facts strong,
.batch-payment-facts strong,
.batch-progress-stages strong {
  color: var(--navy);
  font-size: 16px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.batch-progress-stages {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.batch-progress-stages > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 0;
  border-top: 2px solid var(--apd-border-default, var(--line));
}

.batch-payment-summary-section {
  margin-top: 14px;
}

.batch-payment-summary-section .section-heading-row {
  gap: 12px;
}

.batch-payment-facts {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.batch-payment-summary-section .card-note {
  margin: 0;
}

.team-operations-action-panel {
  display: grid;
  gap: 16px;
  padding: 20px;
  border-color: var(--apd-accent-gold, var(--gold));
}

.team-operations-action-panel[hidden] {
  display: none;
}

.team-action-heading h3 {
  margin-top: 3px;
  color: var(--navy);
  font-size: 18px;
}

.team-action-heading .panel-description {
  max-width: 66ch;
  margin-top: 6px;
}

.team-action-form {
  max-width: 720px;
}

.team-action-form[hidden],
.team-group-payment-workspace[hidden] {
  display: none;
}

.team-action-form .field-grid,
.team-group-payment-workspace .field-grid {
  min-width: 0;
}

.team-action-buttons {
  justify-content: flex-start;
}

.team-csv-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.team-csv-steps span {
  padding: 5px 8px;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 999px;
  color: var(--apd-text-secondary, var(--muted));
  font-size: 11px;
  font-weight: 750;
}

.credential-notice:not(:empty) {
  padding: 11px 12px;
  border: 1px solid var(--apd-status-warning, #c79732);
  border-radius: 6px;
  background: var(--apd-surface-secondary, #f8faf9);
  color: var(--navy);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.team-group-workspace,
.team-group-forms {
  display: grid;
  gap: 16px;
}

.team-group-workspace {
  padding: 18px;
  border: 1px solid var(--apd-border-default);
  background: var(--apd-surface-secondary);
  border-radius: 8px;
}

.team-group-forms {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.team-group-forms .panel-subsection {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--apd-border-default);
  border-radius: 8px;
  background: var(--apd-surface-primary);
}

.team-group-forms label,
.inline-select {
  min-width: 0;
}

.inline-select {
  display: grid;
  gap: 6px;
  min-width: min(280px, 100%);
}

.team-groups-panel .list-card.is-selected {
  border-color: var(--apd-accent-gold);
  box-shadow: 0 0 0 1px rgba(197, 145, 30, 0.28);
}

.batch-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}

.batch-summary-row span {
  color: var(--apd-text-muted);
  font-size: 12px;
  font-weight: 700;
}

.team-group-payment-workspace {
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--apd-border-default);
  border-radius: 8px;
  background: var(--apd-surface-secondary);
}

.group-payment-candidate,
.group-payment-confirm-card,
.group-payment-total-card {
  display: grid;
  gap: 12px;
}

.group-payment-candidate.is-ineligible {
  opacity: 0.78;
}

.group-payment-selector {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
}

.group-payment-confirmation {
  display: grid;
  gap: 12px;
}

.group-payment-confirm-card {
  padding: 18px;
  border: 1px solid var(--apd-accent-gold);
  border-radius: 8px;
  background: var(--apd-surface-primary);
}

.group-payment-detail {
  gap: 10px;
}

.group-payment-allocation-preview {
  display: grid;
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--apd-border-default, var(--line));
  border-radius: 6px;
  background: var(--apd-surface-secondary, #f8faf9);
}

.group-payment-allocation-preview > p {
  margin: 0;
  padding: 9px 10px;
  border-bottom: 1px solid var(--apd-border-default, var(--line));
}

.group-payment-allocation-preview > div,
.team-payment-history-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border-top: 1px solid var(--apd-border-default, var(--line));
}

.group-payment-allocation-preview > div:first-of-type {
  border-top: 0;
}

.group-payment-allocation-preview span,
.team-payment-history-row p {
  min-width: 0;
  color: var(--apd-text-secondary, var(--muted));
  font-size: 12px;
  overflow-wrap: anywhere;
}

.group-payment-allocation-preview strong,
.team-payment-history-row strong {
  flex-shrink: 0;
  color: var(--navy);
  font-size: 13px;
}

.team-payment-history-row > div:last-child {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.team-payment-history-row p {
  margin: 4px 0 0;
}

@media (max-width: 820px) {
  .team-operations-view {
    grid-template-columns: 1fr;
  }

  .team-detail-grid {
    grid-template-columns: 1fr;
  }

  .team-information-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .batch-payment-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .batch-progress-stages {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .team-group-forms { grid-template-columns: 1fr; }
  .team-group-workspace { padding: 14px; }
  .team-group-payment-workspace { padding: 14px; }
}

@media (max-width: 620px) {
  .team-operations-heading,
  .team-action-heading,
  .batch-payment-summary-section > .section-heading-row {
    align-items: stretch;
    flex-direction: column;
  }

  .team-heading-actions > button,
  .team-master-actions > button,
  .team-detail-actions > button,
  .team-action-buttons > button {
    flex: 1 1 180px;
  }

  .team-operations-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .team-operations-summary > article {
    min-height: 74px;
    padding: 12px;
  }

  .team-operations-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .team-operations-tabs button {
    min-width: 0;
    padding-inline: 8px;
  }

  .team-operations-master,
  .team-operations-detail,
  .team-operations-action-panel {
    padding: 14px;
  }

  .team-detail-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .team-operational-context,
  .team-payment-history-row {
    align-items: stretch;
    flex-direction: column;
  }

  .team-payment-history-row > div:last-child {
    align-items: stretch;
    justify-content: flex-start;
  }

  .inline-select {
    width: 100%;
  }

  .team-information-facts,
  .batch-progress-facts,
  .batch-payment-facts {
    grid-template-columns: 1fr;
  }

  .team-information-facts .team-information-notes {
    grid-column: auto;
  }

  .batch-progress-stages {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .team-roster-record,
  .team-related-batch {
    align-items: start;
  }

  .team-roster-actions {
    align-items: end;
    flex-direction: column;
  }

  .team-groups-panel { gap: 16px; }
  .team-group-workspace { padding: 12px; }
  .team-group-payment-workspace { padding: 12px; }
  .team-group-workspace > .section-heading-row { align-items: stretch; }
  .inline-select { width: 100%; }
  .batch-summary-row { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 430px) {
  .team-groups-panel.is-mobile-detail-open[data-team-operations-view="teams"] #teamsWorkspaceView > .team-operations-master,
  .team-groups-panel.is-mobile-detail-open[data-team-operations-view="batches"] #batchesWorkspaceView > .team-operations-master {
    display: none;
  }

  .team-groups-panel:not(.is-mobile-detail-open)[data-team-operations-view="teams"] #teamDetailPane,
  .team-groups-panel:not(.is-mobile-detail-open)[data-team-operations-view="batches"] #batchDetailPane {
    display: none;
  }

  .team-groups-panel.is-mobile-detail-open .team-mobile-back {
    display: inline-flex;
    width: fit-content;
  }

  .team-groups-panel.is-mobile-detail-open .team-operations-detail {
    min-height: min(540px, calc(100vh - 160px));
  }

  .team-detail-actions,
  .team-action-buttons {
    display: grid;
    grid-template-columns: 1fr;
  }

  .team-detail-actions > button,
  .team-action-buttons > button {
    width: 100%;
  }

  .team-csv-steps span {
    flex: 1 1 42%;
    text-align: center;
  }
}

@media (max-width: 820px) {
  #supervisorDashboardMetrics.operations-dashboard-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .member-transfer-form-grid,
  .member-ownership-facts,
  .ownership-queue-facts,
  .staff-supervisor-summary dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .staff-supervisor-summary dl div:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  #supervisorDashboardMetrics.operations-dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  #supervisorDashboardMetrics .metric-card {
    min-height: 92px;
    padding: 13px;
  }

  .member-workflow-status,
  .member-ownership-facts,
  .ownership-queue-facts,
  .member-transfer-summary dl,
  .staff-supervisor-summary dl,
  .member-transfer-form-grid {
    grid-template-columns: 1fr;
  }

  .member-transfer-summary dl div:last-child,
  .staff-supervisor-summary dl div:last-child {
    grid-column: auto;
  }

  .member-transfer-workflow .primary-button,
  .ownership-queue-card .primary-button,
  .ownership-queue-card .intake-assignment-row label {
    width: 100%;
  }

  .member-ownership-context {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .member-ownership-context small {
    grid-column: auto;
  }
}

/*
 * Phase 3C-2: shared Staff Console visual foundation.
 * These aliases retain the established selectors and role-specific workflow
 * structure while giving Owner, Supervisor, and Evaluator one visual system.
 */
:root {
  --brand-navy: #0d1b2a;
  --brand-slate: #223547;
  --surface-page: #f4f6f7;
  --surface-card: #ffffff;
  --text-primary: #121a21;
  --text-secondary: #6e7b85;
  --border-default: #d8dfe4;
  --brand-gold: #b69b6b;
  --brand-teal: #397c7a;

  --color-brand-primary: var(--brand-navy);
  --color-brand-secondary: var(--brand-slate);
  --color-brand-accent: var(--brand-gold);
  --color-data-accent: var(--brand-teal);
  --color-page-bg: var(--surface-page);
  --color-surface: var(--surface-card);
  --color-surface-muted: #eef1f3;
  --color-text: var(--text-primary);
  --color-text-muted: var(--text-secondary);
  --color-text-muted-accessible: #62717c;
  --color-border: var(--border-default);
  --color-border-strong: #bfc9d1;
  --color-success: #2f6b55;
  --color-success-surface: #e6f0eb;
  --color-warning: #875713;
  --color-warning-surface: #f8ecd8;
  --color-danger: #a54545;
  --color-danger-surface: #f6e6e6;
  --color-info: #35657b;
  --color-info-surface: #e5eef2;
  --color-focus: var(--brand-gold);
  --color-disabled: #a5b0b8;
  --color-disabled-surface: #e9edf0;

  --font-heading: "Sora", "Aptos Display", "Segoe UI", Arial, sans-serif;
  --font-body: "Inter", "Aptos", "Segoe UI", Arial, sans-serif;
  --radius-control: 8px;
  --radius-surface: 8px;
  --shadow-surface: 0 2px 5px rgba(13, 27, 42, 0.06), 0 10px 24px rgba(13, 27, 42, 0.05);
  --shadow-overlay: 0 14px 34px rgba(13, 27, 42, 0.16);

  /* Legacy aliases are intentionally retained so no workflow renderer changes. */
  --apd-navy-950: var(--brand-navy);
  --apd-navy-900: var(--brand-navy);
  --apd-navy-800: var(--brand-slate);
  --apd-navy-700: #2d475a;
  --apd-navy-600: var(--brand-teal);
  --apd-gold-700: #8c754d;
  --apd-gold-600: #a68a5c;
  --apd-gold-500: var(--brand-gold);
  --apd-gold-300: #ded0b4;
  --apd-gold-100: #f5f1e9;
  --apd-app-background: var(--surface-page);
  --apd-warm-background: #f8f9f9;
  --apd-surface-primary: var(--surface-card);
  --apd-surface-secondary: #f8f9fa;
  --apd-surface-muted: var(--color-surface-muted);
  --apd-dark-background: var(--brand-navy);
  --apd-dark-surface: var(--brand-slate);
  --apd-dark-elevated: #2d475a;
  --apd-dark-border: #405667;
  --apd-text-primary: var(--text-primary);
  --apd-text-secondary: var(--text-secondary);
  --apd-text-muted: #7c8992;
  --apd-text-on-dark: #f8fafb;
  --apd-text-muted-on-dark: #c1cbd1;
  --apd-border-subtle: #e7ebee;
  --apd-border-default: var(--border-default);
  --apd-border-strong: var(--color-border-strong);
  --apd-success: var(--color-success);
  --apd-success-surface: var(--color-success-surface);
  --apd-warning: var(--color-warning);
  --apd-warning-surface: var(--color-warning-surface);
  --apd-danger: var(--color-danger);
  --apd-danger-surface: var(--color-danger-surface);
  --apd-information: var(--color-info);
  --apd-information-surface: var(--color-info-surface);
  --apd-shadow-xs: 0 1px 2px rgba(13, 27, 42, 0.05);
  --apd-shadow-sm: var(--shadow-surface);
  --apd-shadow-md: 0 5px 12px rgba(13, 27, 42, 0.08), 0 18px 36px rgba(13, 27, 42, 0.08);
  --apd-shadow-lg: 0 10px 24px rgba(13, 27, 42, 0.1), 0 26px 50px rgba(13, 27, 42, 0.1);
  --apd-focus-ring: 0 0 0 3px rgba(182, 155, 107, 0.3);
  --bg: var(--surface-page);
  --surface: var(--surface-card);
  --surface-muted: var(--color-surface-muted);
  --surface-soft: #fbfcfc;
  --ink: var(--text-primary);
  --muted: var(--text-secondary);
  --line: var(--border-default);
  --line-strong: var(--color-border-strong);
  --navy: var(--brand-navy);
  --gold: var(--brand-gold);
  --shadow: var(--shadow-surface);
  --shadow-soft: 0 1px 3px rgba(13, 27, 42, 0.05), 0 7px 18px rgba(13, 27, 42, 0.04);
}

body.app-body.management-mode,
body.app-body.evaluator-mode {
  padding: 18px;
  color: var(--color-text);
  background: var(--color-page-bg);
  font-family: var(--font-body);
  --apd-text-secondary: var(--color-text-muted-accessible);
  --apd-text-muted: var(--color-text-muted-accessible);
}

/* Management keeps the shared public navigation after sign-in. Reserve its
   physical height so the fixed navigation never covers the console header. */
body.app-body.management-mode {
  padding: 104px 18px 18px;
}

body.app-body.management-mode::before,
body.app-body.evaluator-mode::before {
  height: 180px;
  background: linear-gradient(135deg, rgba(13, 27, 42, 0.055), rgba(57, 124, 122, 0.035));
}

body.app-body.management-mode .app-header,
body.app-body.management-mode .staff-bar,
body.app-body.management-mode .workspace-sidebar,
body.app-body.management-mode .workspace-panel,
body.app-body.evaluator-mode .evaluator-app-nav,
body.app-body.evaluator-mode .workspace-panel {
  border-color: var(--color-border);
  border-radius: var(--radius-surface);
}

body.app-body.management-mode .app-header,
body.app-body.management-mode .staff-bar,
body.app-body.evaluator-mode .evaluator-app-nav {
  background: rgba(255, 255, 255, 0.98);
  box-shadow: var(--shadow-surface);
}

body.app-body.management-mode .app-header,
body.app-body.evaluator-mode .evaluator-app-nav {
  border-left-color: var(--brand-gold);
}

body.app-body.management-mode .workspace-sidebar,
body.app-body.management-mode .workspace-menu,
body.app-body.evaluator-mode .workspace-panel.evaluator-dashboard-panel,
body.app-body.management-mode .workspace-panel.operations-dashboard-panel {
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.management-mode h1,
body.app-body.management-mode h2,
body.app-body.management-mode h3,
body.app-body.evaluator-mode h1,
body.app-body.evaluator-mode h2,
body.app-body.evaluator-mode h3 {
  color: var(--color-text);
  font-family: var(--font-heading);
}

body.app-body.management-mode .eyebrow,
body.app-body.evaluator-mode .eyebrow {
  color: var(--color-text-muted-accessible);
}

body.app-body.management-mode .metric-tile,
body.app-body.management-mode .operations-summary-grid article,
body.app-body.evaluator-mode .evaluator-summary-grid,
body.app-body.evaluator-mode .evaluator-summary-grid article {
  border-color: var(--color-border);
  background: var(--color-surface);
}

body.app-body.management-mode .metric-tile strong,
body.app-body.management-mode .operations-summary-grid strong,
body.app-body.evaluator-mode .evaluator-summary-grid strong {
  color: var(--color-brand-primary);
}

body.app-body.management-mode .workspace-menu-button,
body.app-body.evaluator-mode .evaluator-nav-button {
  color: var(--color-brand-secondary);
}

body.app-body.management-mode .workspace-menu-button:hover,
body.app-body.management-mode .workspace-menu-button.active,
body.app-body.management-mode .workspace-menu-button[aria-selected="true"],
body.app-body.evaluator-mode .evaluator-nav-button:hover,
body.app-body.evaluator-mode .evaluator-nav-button.active,
body.app-body.evaluator-mode .evaluator-nav-button[aria-selected="true"] {
  color: var(--color-brand-primary);
  border-color: transparent;
  background: #f6f1e7;
  box-shadow: inset 3px 0 0 var(--brand-gold);
}

body.app-body.evaluator-mode .evaluator-nav-button:hover,
body.app-body.evaluator-mode .evaluator-nav-button.active,
body.app-body.evaluator-mode .evaluator-nav-button[aria-selected="true"] {
  box-shadow: inset 0 -2px 0 var(--brand-gold);
}

body.app-body.management-mode input,
body.app-body.management-mode select,
body.app-body.management-mode textarea,
body.app-body.evaluator-mode input,
body.app-body.evaluator-mode select,
body.app-body.evaluator-mode textarea {
  color: var(--color-text);
  border-color: var(--color-border-strong);
  background: var(--color-surface);
  border-radius: var(--radius-control);
}

body.app-body.management-mode input::placeholder,
body.app-body.management-mode textarea::placeholder,
body.app-body.evaluator-mode input::placeholder,
body.app-body.evaluator-mode textarea::placeholder {
  color: #89949c;
}

body.app-body.management-mode input:focus,
body.app-body.management-mode select:focus,
body.app-body.management-mode textarea:focus,
body.app-body.evaluator-mode input:focus,
body.app-body.evaluator-mode select:focus,
body.app-body.evaluator-mode textarea:focus {
  border-color: var(--brand-gold);
  box-shadow: var(--apd-focus-ring);
}

body.app-body.management-mode .primary-button,
body.app-body.evaluator-mode .primary-button {
  color: #121a21;
  border-color: var(--brand-gold);
  background: var(--brand-gold);
}

body.app-body.management-mode .primary-button:hover,
body.app-body.evaluator-mode .primary-button:hover {
  border-color: #a98c5d;
  background: #a98c5d;
}

body.app-body.management-mode .secondary-button,
body.app-body.evaluator-mode .secondary-button {
  color: var(--brand-navy);
  border-color: var(--color-border-strong);
  background: var(--color-surface);
}

body.app-body.management-mode .secondary-button:hover,
body.app-body.evaluator-mode .secondary-button:hover {
  border-color: var(--brand-gold);
  background: #f8f5ef;
}

body.app-body.management-mode .quiet-button,
body.app-body.evaluator-mode .quiet-button {
  color: var(--brand-slate);
}

body.app-body.management-mode .quiet-button:hover,
body.app-body.evaluator-mode .quiet-button:hover {
  color: var(--brand-navy);
}

body.app-body.management-mode button:focus-visible,
body.app-body.management-mode a:focus-visible,
body.app-body.management-mode input:focus-visible,
body.app-body.management-mode select:focus-visible,
body.app-body.management-mode textarea:focus-visible,
body.app-body.evaluator-mode button:focus-visible,
body.app-body.evaluator-mode a:focus-visible,
body.app-body.evaluator-mode input:focus-visible,
body.app-body.evaluator-mode select:focus-visible,
body.app-body.evaluator-mode textarea:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
}

body.app-body.management-mode button:disabled,
body.app-body.evaluator-mode button:disabled {
  color: #6e7b85;
  border-color: var(--color-border);
  background: var(--color-disabled-surface);
  opacity: 1;
}

body.app-body.management-mode .status-chip,
body.app-body.evaluator-mode .status-chip {
  border: 1px solid transparent;
  background: var(--color-surface-muted);
  color: var(--brand-slate);
}

body.app-body.management-mode .status-chip.good,
body.app-body.evaluator-mode .status-chip.good {
  border-color: rgba(47, 107, 85, 0.22);
  background: var(--color-success-surface);
  color: var(--color-success);
}

body.app-body.management-mode .status-chip.warn,
body.app-body.evaluator-mode .status-chip.warn {
  border-color: rgba(167, 110, 29, 0.22);
  background: var(--color-warning-surface);
  color: var(--color-warning);
}

body.app-body.management-mode .status-chip.bad,
body.app-body.evaluator-mode .status-chip.bad {
  border-color: rgba(165, 69, 69, 0.22);
  background: var(--color-danger-surface);
  color: var(--color-danger);
}

body.app-body.management-mode .list-card,
body.app-body.management-mode .result-card,
body.app-body.management-mode .preview-meta,
body.app-body.evaluator-mode .list-card,
body.app-body.evaluator-mode .result-card,
body.app-body.evaluator-mode .preview-meta {
  border-color: var(--color-border);
  background: var(--color-surface);
}

body.app-body.management-mode .list-card,
body.app-body.evaluator-mode .list-card {
  border-left-color: rgba(182, 155, 107, 0.72);
}

body.app-body.management-mode .manual-group,
body.app-body.evaluator-mode .manual-group,
body.app-body.management-mode .panel-subsection,
body.app-body.evaluator-mode .panel-subsection {
  border-color: var(--color-border);
  background: var(--color-surface-muted);
}

body.app-body.evaluator-mode .assessment-section-nav-item[aria-current="step"] {
  border-color: var(--brand-gold);
  background: #f6f1e7;
}

body.app-body.evaluator-mode .assessment-section-nav-item[aria-current="step"] .assessment-section-index {
  color: var(--brand-navy);
  border-color: var(--brand-gold);
  background: #f7eed8;
}

body.app-body.evaluator-mode .assessment-section-rail,
body.app-body.evaluator-mode .assessment-workspace-main,
body.app-body.evaluator-mode .assessment-workspace-actions,
body.app-body.evaluator-mode .manual-reference {
  border-color: var(--color-border);
}

body.app-body.evaluator-mode .evaluator-priority-section {
  border-color: rgba(57, 124, 122, 0.3);
  background: #f3f8f7;
}

body.app-body.evaluator-mode .workflow-avatar {
  color: var(--brand-teal);
  border-color: rgba(57, 124, 122, 0.22);
  background: #e8f2f1;
}

body.app-body.management-mode table,
body.app-body.evaluator-mode table {
  border-color: var(--color-border);
  background: var(--color-surface);
}

/* Phase 4C-2: focused, field-ready technical assessment workspace. */
body.app-body.evaluator-mode .assessment-workspace-shell {
  display: grid;
  gap: 14px;
}

body.app-body.evaluator-mode .assessment-context-header {
  grid-template-columns: minmax(190px, 0.8fr) minmax(360px, 1.35fr) minmax(210px, 0.68fr);
  gap: 14px;
  padding: 18px;
  border-color: var(--brand-navy);
  background: var(--brand-navy);
}

body.app-body.evaluator-mode .assessment-context-primary {
  min-width: 0;
}

body.app-body.evaluator-mode .assessment-context-primary h3 {
  color: #fff;
  font-size: 24px;
}

body.app-body.evaluator-mode .assessment-context-primary p:last-child {
  color: #e8d59d;
  font-weight: 800;
}

.assessment-context-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border: 1px solid rgba(229, 238, 243, 0.2);
  border-radius: 7px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.06);
}

.assessment-context-facts > div {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 10px 11px;
  border-right: 1px solid rgba(229, 238, 243, 0.16);
}

.assessment-context-facts > div:last-child { border-right: 0; }
.assessment-context-facts dt { color: #b8c7d1; font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.assessment-context-facts dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: #fff; font-size: 13px; font-weight: 800; line-height: 1.3; }

body.app-body.evaluator-mode .assessment-context-meta {
  align-content: center;
  justify-items: start;
  gap: 5px;
  text-align: left;
}

body.app-body.evaluator-mode .assessment-context-meta strong { color: #fff; }
body.app-body.evaluator-mode .assessment-context-meta small { color: #c9d3da; }
body.app-body.evaluator-mode .assessment-context-meta .status-chip.neutral { color: #d7e2e8; border-color: rgba(215, 226, 232, 0.32); background: rgba(215, 226, 232, 0.12); }

.assessment-progress {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(150px, auto) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding-top: 2px;
}

.assessment-progress > div:first-child { display: flex; justify-content: space-between; gap: 12px; color: #c9d3da; font-size: 12px; font-weight: 800; }
.assessment-progress strong { color: #fff; }
.assessment-progress-track { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(255, 255, 255, 0.18); }
.assessment-progress-track span { display: block; height: 100%; min-width: 0; border-radius: inherit; background: var(--brand-gold); transition: width 140ms ease; }

body.app-body.evaluator-mode .assessment-section-rail {
  gap: 12px;
  padding: 14px;
  background: var(--color-surface);
  box-shadow: var(--shadow-soft);
}

body.app-body.evaluator-mode .assessment-section-nav-item {
  min-height: 52px;
  border-radius: 6px;
}

body.app-body.evaluator-mode .assessment-section-nav-item[data-state="attention"] {
  background: #fffaf0;
}

.assessment-current-section-heading > div { min-width: 0; }
.assessment-section-completion { margin: 7px 0 0; color: var(--muted); font-size: 12px; font-weight: 700; line-height: 1.35; }

body.app-body.evaluator-mode .assessment-current-section {
  gap: 16px;
  padding: 20px;
  background: var(--color-surface);
  box-shadow: var(--shadow-soft);
}

body.app-body.evaluator-mode .assessment-current-section h3 { font-size: 24px; }
body.app-body.evaluator-mode .assessment-section-instruction { max-width: 760px; margin-top: -6px; font-size: 14px; }

body.app-body.evaluator-mode .assessment-current-section .manual-groups { gap: 18px; }
body.app-body.evaluator-mode .assessment-current-section .manual-group { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--color-border); border-left: 3px solid #d3dde2; border-radius: 7px; background: var(--color-surface-muted); }
body.app-body.evaluator-mode .assessment-current-section .manual-group[data-completion="attention"] { border-left-color: var(--gold); }
body.app-body.evaluator-mode .assessment-current-section .manual-group[data-completion="complete"] { border-left-color: var(--green); }
body.app-body.evaluator-mode .assessment-current-section .manual-group + .manual-group { padding-top: 16px; border-top: 1px solid var(--color-border); }

body.app-body.evaluator-mode .manual-group-heading { align-items: start; justify-content: space-between; margin: 0; }
body.app-body.evaluator-mode .manual-group-heading > div { min-width: 0; }
body.app-body.evaluator-mode .manual-group-heading > div > span { display: block; margin-bottom: 4px; }
body.app-body.evaluator-mode .manual-group-heading h3 { font-size: 17px; line-height: 1.25; }
.manual-group-progress { flex: 0 0 auto; padding: 5px 7px; border-radius: 999px; color: var(--muted); background: #edf1f3; font-size: 10px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; white-space: nowrap; }

.manual-instruction { border: 1px solid var(--color-border); border-radius: 6px; background: #fff; }
.manual-instruction summary { padding: 10px 12px; color: var(--brand-navy); cursor: pointer; font-size: 13px; font-weight: 800; }
.manual-instruction[open] summary { border-bottom: 1px solid var(--color-border); }
.manual-instruction .manual-source-copy { margin: 0; padding: 12px; border-left: 3px solid var(--brand-gold); background: #fffdf7; }

body.app-body.evaluator-mode .manual-reference { grid-template-columns: minmax(190px, 330px) minmax(0, 1fr); gap: 14px; margin: 0; padding: 12px; border-color: var(--color-border); background: #fff; }
body.app-body.evaluator-mode .manual-reference figcaption { display: grid; align-content: start; gap: 8px; color: #455564; }
body.app-body.evaluator-mode .manual-reference figcaption strong { color: var(--brand-navy); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
body.app-body.evaluator-mode .manual-reference-media { align-self: start; }
body.app-body.evaluator-mode .manual-reference-media img { max-height: 280px; object-fit: contain; }

body.app-body.evaluator-mode .manual-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.app-body.evaluator-mode .manual-text-field,
body.app-body.evaluator-mode .manual-score-field { min-width: 0; padding: 11px; border: 1px solid var(--color-border); border-radius: 6px; background: #fff; scroll-margin-bottom: 120px; }
body.app-body.evaluator-mode .manual-text-field[data-assessment-side="right"] { border-left: 3px solid #5b879b; }
body.app-body.evaluator-mode .manual-text-field[data-assessment-side="left"] { border-left: 3px solid var(--brand-teal); }
body.app-body.evaluator-mode [data-assessment-field][data-completion="incomplete"] { border-color: #d8c690; }
body.app-body.evaluator-mode [data-assessment-field][data-completion="complete"] { border-color: rgba(63, 143, 89, 0.35); }
body.app-body.evaluator-mode .assessment-form-read-only .manual-group::after { content: "Historical reference"; justify-self: end; margin-top: -4px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
body.app-body.evaluator-mode .assessment-form-read-only [data-assessment-field] { opacity: 0.78; }
body.app-body.evaluator-mode .assessment-form-complete .manual-group::after { content: "Technical assessment scored"; justify-self: end; margin-top: -4px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
body.app-body.evaluator-mode .assessment-form-complete [data-assessment-field] { opacity: 0.82; }
body.app-body.evaluator-mode .assessment-member-selection small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 700; }
.manual-field-label { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; min-width: 0; }
.manual-field-label small { flex: 0 0 auto; color: var(--brand-teal); font-size: 11px; font-weight: 800; letter-spacing: 0; text-transform: none; }
body.app-body.evaluator-mode .manual-score-field legend { width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 8px; }
body.app-body.evaluator-mode .manual-score-field legend small { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
body.app-body.evaluator-mode .manual-score-options { border-color: var(--color-border-strong, var(--line-strong)); }
body.app-body.evaluator-mode .manual-score-options label:has(input[value="0"]:checked) { background: var(--red); }
body.app-body.evaluator-mode .manual-score-options label:has(input[value="1"]:checked) { background: var(--orange); }
body.app-body.evaluator-mode .manual-score-options label:has(input[value="2"]:checked),
body.app-body.evaluator-mode .manual-score-options label:has(input[value="3"]:checked) { background: var(--green); }

body.app-body.evaluator-mode .assessment-review-panel { gap: 14px; padding: 16px; border-color: #d9c891; background: #fffaf0; }
body.app-body.evaluator-mode .assessment-review-summary { align-items: center; }
body.app-body.evaluator-mode .assessment-report-handoff { min-width: 204px; min-height: 54px; display: grid; gap: 2px; text-align: center; }
.assessment-report-handoff span { color: #e9d18a; font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
body.app-body.evaluator-mode .assessment-review-jump > span { display: grid; gap: 3px; color: var(--brand-navy); font-weight: 800; }
body.app-body.evaluator-mode .assessment-review-jump > span small { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }

body.app-body.evaluator-mode .assessment-workspace-actions { border-color: var(--color-border); box-shadow: 0 10px 24px rgba(19, 32, 44, 0.14); }

@media (max-width: 1024px) {
  body.app-body.evaluator-mode .assessment-context-header { grid-template-columns: minmax(0, 1fr) minmax(220px, 0.72fr); }
  body.app-body.evaluator-mode .assessment-context-primary,
  body.app-body.evaluator-mode .assessment-context-facts,
  body.app-body.evaluator-mode .assessment-progress { grid-column: 1 / -1; }
  .assessment-section-rail { grid-template-columns: minmax(0, 1fr) minmax(220px, 360px); align-items: end; }
  .assessment-section-rail-heading { grid-column: 1; }
  .assessment-section-select-label { grid-column: 2; margin: 0; }
  .assessment-section-legend { grid-column: 1 / -1; }
  .assessment-section-navigator { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  body.app-body.evaluator-mode .assessment-context-header,
  .assessment-section-rail { grid-template-columns: 1fr; }
  body.app-body.evaluator-mode .assessment-context-header { padding: 14px; }
  body.app-body.evaluator-mode .assessment-context-primary h3 { font-size: 21px; }
  .assessment-context-facts { grid-template-columns: 1fr; }
  .assessment-context-facts > div { grid-template-columns: minmax(112px, 0.7fr) minmax(0, 1fr); align-items: baseline; border-right: 0; border-bottom: 1px solid rgba(229, 238, 243, 0.16); }
  .assessment-context-facts > div:last-child { border-bottom: 0; }
  .assessment-progress { grid-template-columns: 1fr; gap: 7px; }
  .assessment-section-rail-heading,
  .assessment-section-select-label,
  .assessment-section-legend,
  .assessment-section-navigator { grid-column: auto; }
  .assessment-section-select-label { width: 100%; }
  body.app-body.evaluator-mode .assessment-current-section { padding: 14px; }
  body.app-body.evaluator-mode .assessment-current-section h3 { font-size: 21px; }
  body.app-body.evaluator-mode .assessment-current-section .manual-group { padding: 13px; }
  body.app-body.evaluator-mode .manual-group-heading { align-items: stretch; flex-direction: column; }
  .manual-group-progress { justify-self: start; }
  body.app-body.evaluator-mode .manual-reference,
  body.app-body.evaluator-mode .manual-fields { grid-template-columns: 1fr; }
  body.app-body.evaluator-mode .manual-reference-media img { max-height: 220px; }
  body.app-body.evaluator-mode .assessment-review-summary { align-items: stretch; flex-direction: column; }
  body.app-body.evaluator-mode .assessment-report-handoff { width: 100%; }
  body.app-body.evaluator-mode .assessment-workspace-actions { bottom: calc(62px + env(safe-area-inset-bottom)); }
}

body.app-body.management-mode th,
body.app-body.evaluator-mode th {
  color: var(--brand-navy);
  border-color: var(--color-border);
  background: #f7f9fa;
}

body.app-body.management-mode td,
body.app-body.evaluator-mode td {
  color: var(--color-text);
  border-color: #e7ebee;
}

body.app-body.management-mode tbody tr:hover,
body.app-body.evaluator-mode tbody tr:hover {
  background: #fbfaf7;
}

body.app-body.management-mode .finance-metric-card,
body.app-body.management-mode .finance-settlement-priority,
body.app-body.management-mode .finance-owner-controls,
body.app-body.management-mode .finance-detail-facts,
body.app-body.management-mode .finance-preview-balance,
body.app-body.management-mode .finance-statement-available {
  border-color: var(--color-border);
}

body.app-body.management-mode .finance-metric-card.is-revenue,
body.app-body.management-mode .commission-position-card {
  border-top-color: var(--brand-gold);
}

body.app-body.management-mode .finance-metric-card.is-commission,
body.app-body.management-mode .finance-metric-card.is-eligible {
  border-top-color: var(--color-success);
}

body.app-body.management-mode .finance-metric-card.is-attention,
body.app-body.management-mode .finance-metric-card.is-carry {
  border-top-color: var(--color-warning);
}

body.app-body.management-mode .finance-metric-card.is-disputed {
  border-top-color: var(--color-danger);
}

body.app-body.management-mode .finance-metric-card.is-available,
body.app-body.management-mode .finance-settlement-priority > div:first-child,
body.app-body.management-mode .finance-statement-available {
  background: var(--brand-navy);
}

body.app-body.management-mode .finance-metric-card.is-available,
body.app-body.management-mode .finance-settlement-priority > div:first-child,
body.app-body.management-mode .finance-statement-available {
  color: var(--apd-text-on-dark);
}

body.app-body.management-mode .finance-metric-card.is-available strong,
body.app-body.management-mode .finance-settlement-priority > div:first-child strong,
body.app-body.management-mode .finance-statement-available strong {
  color: var(--apd-text-on-dark);
}

body.app-body.management-mode .finance-metric-card.is-available p,
body.app-body.management-mode .finance-metric-card.is-available span,
body.app-body.management-mode .finance-settlement-priority > div:first-child span,
body.app-body.management-mode .finance-settlement-priority > div:first-child small,
body.app-body.management-mode .finance-statement-available span {
  color: var(--apd-text-muted-on-dark);
}

body.app-body.management-mode dialog,
body.app-body.evaluator-mode dialog,
body.app-body.management-mode .dialog-panel,
body.app-body.evaluator-mode .dialog-panel {
  border-color: var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-overlay);
}

/* Supervisor uses the same operational shell with a role-specific body class. */
body.app-body.supervisor-mode {
  padding: 18px;
  color: var(--color-text);
  background: var(--color-page-bg);
  font-family: var(--font-body);
  --apd-text-secondary: var(--color-text-muted-accessible);
  --apd-text-muted: var(--color-text-muted-accessible);
}

body.app-body.supervisor-mode::before {
  height: 180px;
  background: linear-gradient(135deg, rgba(13, 27, 42, 0.055), rgba(57, 124, 122, 0.035));
}

body.app-body.supervisor-mode .app-header,
body.app-body.supervisor-mode .staff-bar,
body.app-body.supervisor-mode .workspace-sidebar,
body.app-body.supervisor-mode .workspace-panel {
  border-color: var(--color-border);
  border-radius: var(--radius-surface);
}

body.app-body.supervisor-mode .app-header,
body.app-body.supervisor-mode .staff-bar,
body.app-body.supervisor-mode .workspace-sidebar,
body.app-body.supervisor-mode .workspace-menu,
body.app-body.supervisor-mode .workspace-panel,
body.app-body.supervisor-mode .operations-dashboard-panel {
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.supervisor-mode .app-header {
  border-left-color: var(--brand-gold);
}

body.app-body.supervisor-mode h1,
body.app-body.supervisor-mode h2,
body.app-body.supervisor-mode h3 {
  color: var(--color-text);
  font-family: var(--font-heading);
}

body.app-body.supervisor-mode .eyebrow {
  color: var(--color-text-muted-accessible);
}

body.app-body.supervisor-mode .metric-tile,
body.app-body.supervisor-mode .operations-summary-grid article,
body.app-body.supervisor-mode .list-card,
body.app-body.supervisor-mode .result-card,
body.app-body.supervisor-mode .preview-meta {
  border-color: var(--color-border);
  background: var(--color-surface);
}

body.app-body.supervisor-mode .metric-tile strong,
body.app-body.supervisor-mode .operations-summary-grid strong {
  color: var(--color-brand-primary);
}

body.app-body.supervisor-mode .workspace-menu-button {
  color: var(--color-brand-secondary);
}

body.app-body.supervisor-mode .workspace-menu-button:hover,
body.app-body.supervisor-mode .workspace-menu-button.active,
body.app-body.supervisor-mode .workspace-menu-button[aria-selected="true"] {
  color: var(--color-brand-primary);
  border-color: transparent;
  background: var(--apd-gold-100);
  box-shadow: inset 3px 0 0 var(--brand-gold);
}

body.app-body.supervisor-mode input,
body.app-body.supervisor-mode select,
body.app-body.supervisor-mode textarea {
  color: var(--color-text);
  border-color: var(--color-border-strong);
  background: var(--color-surface);
  border-radius: var(--radius-control);
}

body.app-body.supervisor-mode input::placeholder,
body.app-body.supervisor-mode textarea::placeholder {
  color: var(--apd-text-muted);
}

body.app-body.supervisor-mode input:focus,
body.app-body.supervisor-mode select:focus,
body.app-body.supervisor-mode textarea:focus {
  border-color: var(--brand-gold);
  box-shadow: var(--apd-focus-ring);
}

body.app-body.supervisor-mode .primary-button {
  color: var(--color-text);
  border-color: var(--brand-gold);
  background: var(--brand-gold);
}

body.app-body.supervisor-mode .secondary-button {
  color: var(--brand-navy);
  border-color: var(--color-border-strong);
  background: var(--color-surface);
}

body.app-body.supervisor-mode .quiet-button {
  color: var(--brand-slate);
}

body.app-body.supervisor-mode button:focus-visible,
body.app-body.supervisor-mode a:focus-visible,
body.app-body.supervisor-mode input:focus-visible,
body.app-body.supervisor-mode select:focus-visible,
body.app-body.supervisor-mode textarea:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
}

body.app-body.supervisor-mode button:disabled {
  color: var(--color-text-muted);
  border-color: var(--color-border);
  background: var(--color-disabled-surface);
  opacity: 1;
}

body.app-body.supervisor-mode .status-chip {
  border: 1px solid transparent;
  background: var(--color-surface-muted);
  color: var(--brand-slate);
}

body.app-body.supervisor-mode .status-chip.good {
  border-color: rgba(47, 107, 85, 0.22);
  background: var(--color-success-surface);
  color: var(--color-success);
}

body.app-body.supervisor-mode .status-chip.warn {
  border-color: rgba(167, 110, 29, 0.22);
  background: var(--color-warning-surface);
  color: var(--color-warning);
}

body.app-body.supervisor-mode .status-chip.bad {
  border-color: rgba(165, 69, 69, 0.22);
  background: var(--color-danger-surface);
  color: var(--color-danger);
}

body.app-body.supervisor-mode .list-card {
  border-left-color: rgba(182, 155, 107, 0.72);
}

body.app-body.supervisor-mode .manual-group,
body.app-body.supervisor-mode .panel-subsection {
  border-color: var(--color-border);
  background: var(--color-surface-muted);
}

body.app-body.supervisor-mode table {
  border-color: var(--color-border);
  background: var(--color-surface);
}

body.app-body.supervisor-mode th {
  color: var(--brand-navy);
  border-color: var(--color-border);
  background: var(--apd-surface-secondary);
}

body.app-body.supervisor-mode td {
  color: var(--color-text);
  border-color: var(--apd-border-subtle);
}

body.app-body.supervisor-mode tbody tr:hover {
  background: var(--surface-soft);
}

body.app-body.supervisor-mode dialog,
body.app-body.supervisor-mode .dialog-panel {
  border-color: var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-overlay);
}

/* Evaluator scheduling is a real inline form; only its responsive arrangement changes. */
body.app-body.evaluator-mode #evaluatorAssessmentScheduling .intake-assignment-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  align-items: end;
}

body.app-body.evaluator-mode #evaluatorAssessmentScheduling .intake-assignment-row label {
  min-width: 0;
}

@media (max-width: 820px) {
  body.app-body.management-mode,
  body.app-body.supervisor-mode,
  body.app-body.evaluator-mode {
    padding: 12px;
  }

  body.app-body.management-mode {
    padding: 132px 12px calc(74px + env(safe-area-inset-bottom));
  }

  body.app-body.management-mode .app-header,
  body.app-body.supervisor-mode .app-header,
  body.app-body.evaluator-mode .evaluator-app-nav {
    margin-top: 0;
  }
}

@media (max-width: 620px) {
  body.app-body.management-mode {
    padding: 142px 10px calc(74px + env(safe-area-inset-bottom));
  }

  body.app-body.management-mode .workspace-menu-button,
  body.app-body.supervisor-mode .workspace-menu-button,
  body.app-body.evaluator-mode .evaluator-nav-button {
    box-shadow: none;
  }

  body.app-body.management-mode .workspace-menu-button.active,
  body.app-body.management-mode .workspace-menu-button[aria-selected="true"],
  body.app-body.supervisor-mode .workspace-menu-button.active,
  body.app-body.supervisor-mode .workspace-menu-button[aria-selected="true"],
  body.app-body.evaluator-mode .evaluator-nav-button.active,
  body.app-body.evaluator-mode .evaluator-nav-button[aria-selected="true"] {
    color: var(--brand-navy);
    background: #f6f1e7;
  }
}

@media (max-width: 1120px) {
  body.app-body.evaluator-mode .evaluator-dashboard-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body.app-body.evaluator-mode .dashboard-queue-section,
  body.app-body.evaluator-mode .workflow-queue-list,
  body.app-body.evaluator-mode .workflow-queue-copy,
  body.app-body.evaluator-mode .section-heading-row > div {
    min-width: 0;
  }

  body.app-body.evaluator-mode #evaluatorAssessmentScheduling .intake-assignment-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-body.evaluator-mode #evaluatorAssessmentScheduling .intake-assignment-row .primary-button {
    grid-column: 1 / -1;
    width: 100%;
  }
}

@media (max-width: 620px) {
  body.app-body.evaluator-mode #evaluatorAssessmentScheduling .intake-assignment-row {
    grid-template-columns: 1fr;
  }
}

/* Phase 4A-1: Owner operations information hierarchy. Scoped to the Owner role only. */
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-dashboard {
  display: grid;
  gap: 22px;
  min-width: 0;
}

/* Owner navigation already selects one workspace. Keep inactive workspaces out of the Operations page flow. */
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .workspace-panel:not(.is-active) {
  display: none;
}

/* Phase 4B-1: Supervisor shell and dashboard. Presentation-only; existing workspaces remain the source of every action. */
body.app-body.supervisor-mode .site-nav,
body.app-body.supervisor-mode .app-header,
body.app-body.supervisor-mode .staff-bar,
body.app-body.supervisor-mode .workspace-sidebar {
  display: none !important;
}

body.app-body.supervisor-mode .workspace {
  display: block;
  max-width: 1440px;
  margin: 18px auto 44px;
}

body.app-body.supervisor-mode .workspace-content {
  width: 100%;
  max-width: 1360px;
  margin-inline: auto;
}

/* Component display rules for Teams and Report Archive previously overrode the base inactive state. */
body.app-body.supervisor-mode .workspace-panel:not(.is-active) {
  display: none !important;
}

/* Evaluator workspaces use the same one-active-panel contract as Owner and Supervisor. */
body.app-body.evaluator-mode .workspace-panel:not(.is-active) {
  display: none !important;
}

body.app-body.supervisor-mode .workspace-panel.supervisor-dashboard-panel.is-active,
body.app-body.supervisor-mode .workspace-panel.team-groups-panel.is-active,
body.app-body.supervisor-mode .workspace-panel.owner-report-archive-panel.is-active {
  display: grid;
}

.supervisor-app-nav {
  width: min(1440px, calc(100% - 40px));
  min-height: 68px;
  display: grid;
  grid-template-columns: minmax(190px, 0.8fr) minmax(0, 2.5fr) auto;
  align-items: center;
  gap: 18px;
  margin: 16px auto 0;
  padding: 8px 10px 8px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: color-mix(in srgb, var(--color-surface) 96%, transparent);
  box-shadow: var(--shadow-surface);
}

.supervisor-brand,
.supervisor-profile-menu > summary {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--color-text);
  text-decoration: none;
}

.supervisor-brand img {
  width: 32px;
  height: 32px;
  padding: 5px;
  border: 1px solid var(--brand-gold);
  border-radius: 8px;
  object-fit: contain;
  background: var(--color-surface);
}

.supervisor-brand span,
.supervisor-profile-menu > summary > span:last-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.supervisor-brand strong,
.supervisor-profile-menu strong { font-size: 13px; line-height: 1.1; }
.supervisor-brand small,
.supervisor-profile-menu small { color: var(--color-text-muted-accessible); font-size: 11px; line-height: 1.2; }

.supervisor-primary-nav {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.supervisor-nav-button {
  min-width: 0;
  min-height: 38px;
  padding: 8px 11px;
  color: var(--brand-slate);
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.supervisor-nav-button:hover,
.supervisor-nav-button.active,
.supervisor-nav-button[aria-selected="true"] {
  color: var(--brand-navy);
  border-color: var(--brand-gold);
  background: var(--apd-gold-100);
}

.supervisor-profile-menu { position: relative; min-width: 0; }
.supervisor-profile-menu > summary { list-style: none; cursor: pointer; padding: 5px 8px; border-radius: 8px; }
.supervisor-profile-menu > summary::-webkit-details-marker { display: none; }
.supervisor-profile-menu[open] > summary { background: var(--apd-gold-100); }
.supervisor-avatar {
  width: 32px;
  height: 32px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  color: var(--brand-navy);
  border: 1px solid var(--brand-gold);
  border-radius: 50%;
  background: var(--color-surface);
  font-size: 11px;
  font-weight: 900;
}

.supervisor-profile-popover {
  position: absolute;
  z-index: 45;
  top: calc(100% + 9px);
  right: 0;
  width: min(260px, calc(100vw - 28px));
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-float);
}

.supervisor-profile-rate { margin: 0; color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.35; }

.supervisor-dashboard-panel {
  min-width: 0;
  gap: 20px;
  padding: 24px;
}

.supervisor-operations-header {
  align-items: end;
  gap: 22px;
  padding-bottom: 4px;
}

.supervisor-operations-header .panel-description { max-width: 700px; }

.supervisor-dashboard-profile {
  min-width: 210px;
  display: grid;
  justify-items: end;
  gap: 4px;
  text-align: right;
}

.supervisor-dashboard-profile strong { color: var(--brand-navy); font-family: var(--font-heading); font-size: 17px; }
.supervisor-dashboard-profile small { color: var(--color-text-muted-accessible); font-size: 12px; }

.supervisor-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.supervisor-summary-card,
.supervisor-dashboard-section {
  min-width: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

.supervisor-summary-card {
  min-height: 124px;
  display: grid;
  align-content: start;
  gap: 7px;
  padding: 16px;
}

.supervisor-summary-card > span {
  color: var(--color-text-muted-accessible);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.supervisor-summary-card strong { color: var(--brand-navy); font-family: var(--font-heading); font-size: 32px; line-height: 1; }
.supervisor-summary-card small { color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.35; }
.supervisor-summary-card.is-attention { border-top: 3px solid var(--brand-gold); }
.supervisor-summary-card.is-finance { border-top: 3px solid var(--brand-teal); }

.supervisor-priority-section {
  display: grid;
  gap: 16px;
  padding: 22px;
  border: 1px solid var(--apd-dark-border);
  border-radius: var(--radius-surface);
  background: var(--brand-navy);
  box-shadow: var(--shadow-surface);
}

.supervisor-priority-section .eyebrow,
.supervisor-priority-section h3,
.supervisor-priority-section .section-supporting-copy { color: var(--apd-text-on-dark); }
.supervisor-priority-section .eyebrow,
.supervisor-priority-section .section-supporting-copy { color: var(--apd-text-muted-on-dark); }
.supervisor-priority-section .status-chip { flex: 0 0 auto; }

.supervisor-priority-list { display: grid; gap: 0; }
.supervisor-priority-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 15px 0;
  border-top: 1px solid var(--apd-dark-border);
}

.supervisor-priority-row:first-child { border-top: 0; padding-top: 0; }
.supervisor-priority-row:last-child { padding-bottom: 0; }
.supervisor-priority-copy { min-width: 0; display: grid; gap: 6px; }
.supervisor-priority-title { min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.supervisor-priority-title strong { color: var(--apd-text-on-dark); font-size: 15px; }
.supervisor-priority-title span,
.supervisor-priority-row p { margin: 0; color: var(--apd-text-muted-on-dark); font-size: 13px; line-height: 1.42; }
.supervisor-priority-row .card-meta { margin: 0; }
.supervisor-priority-row .card-meta > span:first-child { color: var(--apd-text-muted-on-dark); }
.supervisor-priority-action { min-width: 138px; }

.supervisor-clear-state {
  padding: 15px 0 1px;
  color: var(--apd-text-on-dark);
  border-top: 1px solid var(--apd-dark-border);
}
.supervisor-clear-state strong { font-size: 15px; }
.supervisor-clear-state p { margin: 5px 0 0; color: var(--apd-text-muted-on-dark); line-height: 1.45; }

.supervisor-dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.82fr);
  align-items: start;
  gap: 20px;
}

.supervisor-dashboard-primary-column,
.supervisor-dashboard-secondary-column { min-width: 0; display: grid; gap: 20px; }
.supervisor-dashboard-section { padding: 20px; }
.supervisor-dashboard-section .section-heading-row { align-items: start; gap: 14px; margin-bottom: 15px; }
.supervisor-dashboard-section .section-heading-row > div { min-width: 0; }
.supervisor-dashboard-section .panel-description { max-width: 620px; margin: 5px 0 0; }

.supervisor-workflow-list,
.supervisor-work-list,
.supervisor-compact-list,
.supervisor-activity-list { display: grid; gap: 0; }

.supervisor-workflow-stage {
  min-width: 0;
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  padding: 13px 0;
  border-top: 1px solid var(--color-border);
}
.supervisor-workflow-stage:first-child { border-top: 0; padding-top: 0; }
.supervisor-workflow-stage:last-child { padding-bottom: 0; }
.supervisor-workflow-stage > div:first-child { display: grid; gap: 3px; }
.supervisor-workflow-stage > div:first-child span { color: var(--color-text-muted-accessible); font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.supervisor-workflow-stage > div:first-child strong { color: var(--brand-navy); font-family: var(--font-heading); font-size: 24px; line-height: 1; }
.supervisor-workflow-stage b { color: var(--color-text); font-size: 13px; }
.supervisor-workflow-stage p { margin: 4px 0 0; color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.4; }

.supervisor-upcoming-row,
.supervisor-compact-row,
.supervisor-activity-row {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 13px 0;
  border-top: 1px solid var(--color-border);
}
.supervisor-upcoming-row:first-child,
.supervisor-compact-row:first-child,
.supervisor-activity-row:first-child { border-top: 0; padding-top: 0; }
.supervisor-upcoming-row:last-child,
.supervisor-compact-row:last-child,
.supervisor-activity-row:last-child { padding-bottom: 0; }
.supervisor-upcoming-row { grid-template-columns: 104px minmax(0, 1fr); }
.supervisor-upcoming-date { display: grid; align-content: start; gap: 3px; }
.supervisor-upcoming-date strong { color: var(--brand-navy); font-size: 13px; }
.supervisor-upcoming-date span,
.supervisor-upcoming-row p { color: var(--color-text-muted-accessible); font-size: 12px; }
.supervisor-upcoming-row > div:last-child { min-width: 0; display: grid; gap: 3px; }
.supervisor-upcoming-row > div:last-child > strong { color: var(--color-text); font-size: 14px; }
.supervisor-upcoming-row p { margin: 0; line-height: 1.35; }

.supervisor-compact-row { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.supervisor-compact-row > div { min-width: 0; display: grid; gap: 3px; }
.supervisor-compact-row strong { color: var(--color-text); font-size: 13px; }
.supervisor-compact-row span:not(.status-chip),
.supervisor-compact-row p { color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.35; }
.supervisor-compact-row p { margin: 2px 0 0; }

.supervisor-payment-snapshot { border-top: 3px solid var(--brand-teal); }
.supervisor-commission-snapshot { border-top: 3px solid var(--brand-gold); }
.supervisor-finance-snapshot dl { display: grid; gap: 0; margin: 0; }
.supervisor-finance-snapshot dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--color-border); }
.supervisor-finance-snapshot dl > div:first-child { padding-top: 0; border-top: 0; }
.supervisor-finance-snapshot dl > div:last-child { padding-bottom: 0; }
.supervisor-finance-snapshot dt { color: var(--color-text-muted-accessible); font-size: 12px; }
.supervisor-finance-snapshot dd { margin: 0; color: var(--brand-navy); font-size: 13px; font-weight: 800; text-align: right; }

.supervisor-activity-row { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.supervisor-activity-row > div { min-width: 0; }
.supervisor-activity-row strong { color: var(--color-text); font-size: 13px; }
.supervisor-activity-row p { margin: 3px 0 0; color: var(--color-text-muted-accessible); font-size: 12px; line-height: 1.35; }
.supervisor-activity-row time { color: var(--color-text-muted-accessible); font-size: 11px; white-space: nowrap; }
.dashboard-empty-state { color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.45; }

.supervisor-finance-workspace-context {
  display: grid;
  gap: 4px;
  margin: 4px 0 18px;
  padding: 14px 16px;
  border-left: 3px solid var(--brand-gold);
  background: var(--apd-gold-100);
}
.supervisor-finance-workspace-context p { margin: 0; color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.42; }
.supervisor-finance-workspace-context strong { color: var(--brand-navy); font-family: var(--font-heading); font-size: 17px; }

#supervisorMobileNav { grid-template-columns: repeat(5, minmax(0, 1fr)); }

@media (max-width: 1180px) {
  .supervisor-app-nav { grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; }
  .supervisor-nav-button { padding-inline: 8px; font-size: 11px; }
  .supervisor-dashboard-main-grid { grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr); }
  .supervisor-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  body.app-body.supervisor-mode { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  body.app-body.supervisor-mode .workspace { margin-top: 12px; }
  body.app-body.supervisor-mode .workspace-content { max-width: 920px; }
  .supervisor-app-nav { width: min(100% - 24px, 920px); grid-template-columns: minmax(0, 1fr) auto; min-height: 60px; margin-top: 12px; padding: 8px 10px; }
  .supervisor-primary-nav { display: none; }
  .supervisor-dashboard-panel { gap: 18px; padding: 20px; }
  .supervisor-dashboard-main-grid { grid-template-columns: 1fr; gap: 18px; }
  .supervisor-dashboard-primary-column,
  .supervisor-dashboard-secondary-column { gap: 18px; }
}

@media (max-width: 430px) {
  body.app-body.supervisor-mode .workspace { margin-top: 10px; }
  .supervisor-app-nav { width: calc(100% - 20px); min-height: 56px; margin-top: 10px; }
  .supervisor-brand img { width: 30px; height: 30px; }
  .supervisor-profile-menu > summary { padding: 3px; }
  .supervisor-profile-menu > summary > span:last-child { display: none; }
  .supervisor-dashboard-panel { display: grid; gap: 16px; padding: 15px; }
  .supervisor-dashboard-panel > .supervisor-operations-header { order: 1; }
  .supervisor-dashboard-panel > .supervisor-priority-section { order: 2; }
  .supervisor-dashboard-panel > .supervisor-summary-grid { order: 3; }
  .supervisor-dashboard-panel > .supervisor-dashboard-main-grid { order: 4; }
  .supervisor-operations-header { align-items: start; gap: 10px; }
  .supervisor-operations-header h2 { font-size: 24px; }
  .supervisor-dashboard-profile { min-width: 0; justify-items: start; text-align: left; }
  .supervisor-dashboard-profile strong,
  .supervisor-dashboard-profile small { display: none; }
  .supervisor-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .supervisor-summary-card { min-height: 96px; gap: 5px; padding: 12px; }
  .supervisor-summary-card strong { font-size: 26px; }
  .supervisor-summary-card small { font-size: 11px; }
  .supervisor-summary-card:last-child { grid-column: 1 / -1; }
  .supervisor-priority-section { gap: 14px; padding: 16px; }
  .supervisor-priority-row { grid-template-columns: 1fr; gap: 12px; padding: 14px 0; }
  .supervisor-priority-action { width: 100%; }
  .supervisor-dashboard-section { padding: 16px; }
  .supervisor-dashboard-section .section-heading-row { display: grid; gap: 10px; }
  .supervisor-dashboard-section .section-heading-row .quiet-button { width: fit-content; padding-inline: 0; }
  .supervisor-workflow-stage { grid-template-columns: 68px minmax(0, 1fr); align-items: start; gap: 14px; }
  .supervisor-workflow-stage > .status-chip { grid-column: 2; justify-self: start; }
  .supervisor-upcoming-row { grid-template-columns: 84px minmax(0, 1fr); }
  .supervisor-compact-row { grid-template-columns: 1fr; }
  .supervisor-compact-row > .status-chip { justify-self: start; }
  .supervisor-activity-row { grid-template-columns: 1fr; gap: 5px; }
  .supervisor-activity-row time { justify-self: start; }
  #supervisorMobileNav { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header {
  align-items: end;
  gap: 28px;
  padding-bottom: 20px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header .panel-description {
  max-width: 700px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section {
  min-width: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 190px;
  padding: 18px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-attention {
  border-top: 3px solid var(--brand-gold);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-finance {
  border-top: 3px solid var(--brand-teal);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card > span,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary span,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-pipeline-stage > span {
  color: var(--color-text-muted-accessible);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card > strong {
  color: var(--brand-navy);
  font-family: var(--font-heading);
  font-size: 33px;
  line-height: 1;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card > small,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary small,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-pipeline-stage small {
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  line-height: 1.45;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card .quiet-button {
  width: max-content;
  margin-top: auto;
  padding: 0;
  color: var(--brand-slate);
  font-size: 13px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations {
  gap: 16px;
  padding: 22px;
  border-color: var(--apd-dark-border);
  background: var(--brand-navy);
  box-shadow: var(--apd-shadow-md);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .section-supporting-copy {
  max-width: 620px;
  margin: 6px 0 0;
  color: var(--apd-text-muted-on-dark);
  line-height: 1.45;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .section-heading-row > .status-chip {
  flex: 0 0 auto;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .workflow-queue-list {
  display: grid;
  gap: 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .workflow-queue-item {
  padding: 15px 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .dashboard-empty-state {
  border-color: var(--apd-dark-border);
  background: var(--apd-dark-surface);
  color: var(--apd-text-muted-on-dark);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.78fr);
  gap: 20px;
  align-items: start;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-primary-column,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-secondary-column {
  display: grid;
  gap: 20px;
  min-width: 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section {
  padding: 20px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .section-heading-row {
  align-items: start;
  gap: 16px;
  margin-bottom: 16px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .section-heading-row .quiet-button {
  flex: 0 0 auto;
  color: var(--brand-slate);
  font-weight: 800;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .section-supporting-copy {
  max-width: 580px;
  margin: 6px 0 0;
  color: var(--color-text-muted-accessible);
  font-size: 13px;
  line-height: 1.45;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-pipeline {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-pipeline-stage {
  position: relative;
  display: grid;
  align-content: start;
  gap: 7px;
  min-width: 0;
  min-height: 136px;
  padding: 14px;
  border: 1px solid var(--apd-border-subtle);
  border-radius: var(--radius-control);
  background: var(--apd-surface-secondary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-pipeline-stage > strong {
  color: var(--brand-navy);
  font-family: var(--font-heading);
  font-size: 28px;
  line-height: 1;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary article {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--apd-border-subtle);
  border-radius: var(--radius-control);
  background: var(--apd-surface-secondary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary strong {
  color: var(--brand-navy);
  font-family: var(--font-heading);
  font-size: 25px;
  line-height: 1;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-list .workflow-queue-item,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-staff-section .workflow-queue-item {
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-list .workflow-queue-action,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-staff-section .workflow-queue-action {
  grid-column: 2;
  justify-self: start;
  margin-top: 2px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-lower-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
  gap: 20px;
  align-items: start;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-quick-actions-section .operations-quick-actions {
  display: grid;
  grid-template-columns: 1fr;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-quick-actions-section .secondary-button {
  justify-content: flex-start;
  width: 100%;
  min-height: 42px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .legacy-manager-operations {
  display: grid;
  gap: 18px;
}

@media (max-width: 1280px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-pipeline {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1120px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-main-grid,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-lower-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-dashboard {
    gap: 16px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header {
    align-items: stretch;
    gap: 16px;
    padding-bottom: 16px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card {
    min-height: 162px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section {
    padding: 16px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-pipeline {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-summary,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-pipeline,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card {
    min-height: 150px;
    padding: 15px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card > strong {
    font-size: 29px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-pipeline-stage {
    min-height: 126px;
    padding: 13px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .workflow-queue-item,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .workflow-queue-item {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations .workflow-queue-action,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .workflow-queue-action {
    grid-column: 2;
    justify-self: start;
    width: 100%;
    margin-top: 4px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .section-heading-row {
    align-items: stretch;
    flex-direction: column;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-dashboard-section .section-heading-row .quiet-button {
    align-self: flex-start;
  }
}

@media (max-width: 375px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-pipeline,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-finance-summary {
    grid-template-columns: 1fr;
  }
}

/* Phase 4A-1.1: bring the Owner's actionable work ahead of secondary metrics on phones. */
@media (max-width: 430px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-dashboard {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-main-grid,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-lower-grid {
    flex: 0 0 100%;
    width: 100%;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header {
    order: 1;
    gap: 12px;
    padding-bottom: 0;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header .panel-description {
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.4;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header .operations-dashboard-controls {
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 8px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header .operations-dashboard-controls label {
    gap: 4px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header .operations-dashboard-controls input,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-header .operations-dashboard-controls select {
    min-height: 40px;
    font-size: 13px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-summary {
    display: contents;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card {
    flex: 0 0 calc(50% - 6px);
    min-height: 138px;
    order: 4;
    padding: 14px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-attention {
    display: grid;
    grid-template-areas:
      "label value"
      "copy copy"
      "action action";
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 12px;
    flex-basis: 100%;
    min-height: 0;
    order: 2;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-attention > span { grid-area: label; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-attention > strong { grid-area: value; font-size: 32px; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-attention > small { grid-area: copy; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card.is-attention .quiet-button {
    grid-area: action;
    margin-top: 2px;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-priority-operations { order: 3; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-main-grid { order: 5; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-operations-lower-grid { order: 6; }
}

@media (max-width: 375px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-summary-card:not(.is-attention) {
    flex-basis: 100%;
    min-height: 124px;
  }
}

/* Phase 4A-2: Owner member and assessment operations. Presentation only; existing queues stay available for compatibility. */
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .legacy-workspace-navigation,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .legacy-manager-mobile-item,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .legacy-manager-mobile-more {
  display: none;
}

.owner-workspace-menu {
  display: grid;
  gap: 8px;
}

.owner-navigation-group {
  overflow: clip;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface);
}

.owner-navigation-group summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 40px;
  padding: 8px 12px;
  color: var(--color-brand-primary);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  list-style: none;
}

.owner-navigation-group summary::-webkit-details-marker { display: none; }
.owner-navigation-group summary::after { content: "+"; color: var(--color-text-muted-accessible); font-size: 16px; }
.owner-navigation-group[open] summary::after { content: "-"; }

.owner-navigation-group > div {
  display: grid;
  gap: 2px;
  padding: 0 6px 7px;
}

.owner-navigation-group .workspace-menu-button {
  min-height: 36px;
  padding-block: 8px;
  font-size: 12px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--color-border);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-heading h2 {
  margin: 2px 0 0;
  font-size: 28px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-heading .panel-description {
  max-width: 690px;
  margin: 6px 0 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary article {
  display: grid;
  align-content: start;
  gap: 6px;
  min-height: 132px;
  padding: 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface-muted);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary span,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary small,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-facts dt,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-facts dt,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts dt {
  color: var(--color-text-muted-accessible);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-transform: uppercase;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary strong {
  color: var(--color-brand-primary);
  font-family: var(--font-heading);
  font-size: 31px;
  line-height: 1;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1.45fr) repeat(4, minmax(130px, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface-muted);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-controls {
  grid-template-columns: minmax(230px, 1.5fr) repeat(2, minmax(155px, 1fr));
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.8fr);
  gap: 16px;
  align-items: start;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-list-section,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-list-section {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-list,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-operations-list {
  display: grid;
  gap: 10px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record {
  position: relative;
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record.is-selected,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record.is-selected {
  border-color: rgba(194, 155, 72, 0.75);
  box-shadow: inset 3px 0 0 var(--brand-gold);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-main,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-head,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-heading,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-footer,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-primary-action {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record h4,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record h4,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail h3,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail h4 {
  margin: 0;
  color: var(--color-brand-primary);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record p,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record p,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-heading p {
  margin: 3px 0 0;
  color: var(--color-text-muted-accessible);
  font-size: 13px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-facts,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-facts,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-facts div,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-facts div,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts div {
  min-width: 0;
  padding-top: 8px;
  border-top: 1px solid var(--color-border);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-facts dd,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-facts dd,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-footer {
  align-items: center;
  padding-top: 3px;
  color: var(--color-text-muted-accessible);
  font-size: 12px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-record-tag {
  position: absolute;
  top: 14px;
  right: 14px;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--color-information-surface);
  color: var(--color-information);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 16px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-mobile-back-row {
  display: none;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-empty {
  padding: 8px 2px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-empty h3 { margin: 4px 0 0; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-empty p { color: var(--color-text-muted-accessible); line-height: 1.5; }

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-section {
  display: grid;
  gap: 9px;
  padding-top: 15px;
  border-top: 1px solid var(--color-border);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-section:first-of-type { padding-top: 0; border-top: 0; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-section h4 { font-size: 14px; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-emphasis,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-note { margin: 0; color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.5; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-emphasis { color: var(--color-text); font-weight: 800; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-emphasis.is-attention { color: var(--color-warning); }

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-action-block {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(194, 155, 72, 0.52);
  border-radius: var(--radius-control);
  background: var(--color-warning-surface);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-action-block h4,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-action-block p { margin: 0; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-action-block p:not(.eyebrow) { color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.45; }

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-inline-action {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-inline-action label {
  min-width: 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-inline-action .primary-button {
  grid-column: 1 / -1;
  width: 100%;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-filter-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 35px;
  padding: 7px 10px;
  color: var(--color-brand-secondary);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-surface);
  font-size: 12px;
  font-weight: 800;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-filter-tabs button span {
  display: inline-grid;
  min-width: 19px;
  min-height: 19px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-surface-muted);
  color: var(--color-text-muted-accessible);
  font-size: 10px;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-filter-tabs button.active {
  color: var(--color-brand-primary);
  border-color: var(--brand-gold);
  background: #f6f1e7;
  box-shadow: inset 0 -2px 0 var(--brand-gold);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-list-section { display: grid; gap: 12px; }

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-head { align-items: flex-start; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-statuses { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-line {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--color-brand-secondary);
  font-size: 12px;
  font-weight: 800;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-line span:first-child {
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--color-information-surface);
  color: var(--color-information);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-primary-action {
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
  color: var(--color-text-muted-accessible);
  font-size: 13px;
  line-height: 1.4;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-primary-action:not(.is-waiting) {
  border-color: rgba(194, 155, 72, 0.48);
  background: #fcf8ed;
  color: var(--color-text);
  font-weight: 700;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record .intake-assignment-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  width: 100%;
  min-width: 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record .intake-assignment-row label {
  min-width: 0;
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-secondary-actions { display: flex; flex-wrap: wrap; gap: 8px; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-secondary-actions .quiet-button { padding: 0; font-size: 12px; }

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-empty-state {
  padding: 22px;
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
}

body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-empty-state h4,
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-empty-state p { margin: 0; }
body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-empty-state p { margin-top: 5px; color: var(--color-text-muted-accessible); font-size: 13px; }

@media (max-width: 1180px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-controls > label:first-child { grid-column: 1 / -1; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-layout { grid-template-columns: minmax(0, 1fr) minmax(290px, 0.72fr); }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail .owner-inline-action { grid-template-columns: 1fr; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record .intake-assignment-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record .intake-assignment-row .primary-button { grid-column: 1 / -1; width: 100%; }
}

@media (max-width: 820px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-layout { grid-template-columns: 1fr; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail { position: static; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-heading,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-main,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-head,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-footer,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-primary-action { align-items: stretch; flex-direction: column; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-heading .status-chip { align-self: flex-start; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-heading h2 { font-size: 24px; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-controls,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-controls { grid-template-columns: 1fr; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-controls > label:first-child { grid-column: auto; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-list-section,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-detail,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-list-section { padding: 13px; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-inline-action { grid-template-columns: 1fr; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record .intake-assignment-row { grid-template-columns: 1fr; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-inline-action .primary-button,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-primary-action .primary-button,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-primary-action .secondary-button,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-footer .secondary-button { width: 100%; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-statuses { justify-content: flex-start; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-record-tag { position: static; width: max-content; }
}

@media (max-width: 375px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-workspace-summary,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-record-facts,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-assessment-record-facts,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-detail-facts { grid-template-columns: 1fr; }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-filter-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-stage-filter-tabs button { justify-content: space-between; }
}

@media (max-width: 620px) {
  .toast {
    top: auto;
    right: 12px;
    bottom: calc(72px + env(safe-area-inset-bottom));
    left: 12px;
    max-width: none;
    text-align: center;
  }
}

@media (max-width: 430px) {
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel .owner-member-detail {
    display: none;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open > .owner-workspace-heading,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open > .owner-workspace-summary,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open > .owner-workspace-controls,
  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open .owner-member-list-section {
    display: none;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open .owner-members-layout {
    display: block;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open .owner-member-detail {
    display: grid;
    position: static;
    min-width: 0;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open .owner-detail-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open .owner-detail-mobile-back-row {
    display: block;
    grid-column: 1 / -1;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-members-panel.is-mobile-detail-open .owner-detail-heading > div:not(.owner-detail-mobile-back-row) {
    min-width: 0;
  }

  body.management-mode:has(#staffAccessBadge[data-access="owner"]) .owner-member-back-button {
    width: max-content;
    min-height: 36px;
    padding-inline: 0;
  }
}

/* Phase 4A-6: Owner reports and configuration workspaces. */
.owner-reports-summary,
.owner-settings-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.owner-reports-summary article,
.owner-settings-grid article,
.owner-reports-paths article {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

.owner-reports-summary span,
.owner-reports-summary small {
  color: var(--color-text-muted-accessible);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-transform: uppercase;
}

.owner-reports-summary strong {
  color: var(--color-brand-primary);
  font-family: var(--font-heading);
  font-size: 30px;
  line-height: 1;
}

.owner-reports-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.owner-reports-paths h3,
.owner-settings-grid h3,
.owner-reports-recent h3 {
  margin: 0;
  color: var(--color-brand-primary);
  font-size: 17px;
}

.owner-reports-paths p:not(.eyebrow),
.owner-settings-grid p:not(.eyebrow) {
  margin: 0;
  color: var(--color-text-muted-accessible);
  font-size: 13px;
  line-height: 1.5;
}

.owner-reports-paths .primary-button,
.owner-reports-paths .secondary-button,
.owner-settings-grid .secondary-button {
  width: 100%;
  margin-top: 4px;
}

.owner-reports-recent {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--color-border);
}

.owner-recent-report {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
}

.owner-recent-report div { display: grid; gap: 3px; min-width: 0; }
.owner-recent-report strong { color: var(--color-brand-primary); }
.owner-recent-report span { color: var(--color-text-muted-accessible); font-size: 12px; overflow-wrap: anywhere; }

.admin-utility-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin-bottom: 16px;
  padding: 12px;
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--brand-teal);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
  color: var(--color-text-muted-accessible);
  font-size: 13px;
  line-height: 1.45;
}

.admin-utility-note strong { color: var(--color-brand-primary); }

.settings-context-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 16px;
  padding: 8px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface-muted);
}

.settings-context-nav button {
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  background: transparent;
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  font-weight: 800;
}

.settings-context-nav button:hover,
.settings-context-nav button:focus-visible {
  border-color: var(--color-border-strong);
  color: var(--color-brand-primary);
  outline: none;
}

.settings-context-nav button.is-active {
  border-color: rgba(194, 155, 72, 0.68);
  background: var(--color-surface);
  box-shadow: inset 0 -2px 0 var(--brand-gold);
  color: var(--color-brand-primary);
}

#templateSettingsPanel[data-settings-focus="brand"] #templateForm,
#templateSettingsPanel[data-settings-focus="navigation"] #templateForm,
#templateSettingsPanel[data-settings-focus="templates"] .cms-settings-block,
#templateSettingsPanel[data-settings-focus="report-branding"] .cms-settings-block {
  display: none;
}

#templateSettingsPanel[data-settings-focus="brand"] [data-settings-focus-group]:not([data-settings-focus-group="brand"]),
#templateSettingsPanel[data-settings-focus="navigation"] [data-settings-focus-group]:not([data-settings-focus-group="navigation"]),
#templateSettingsPanel[data-settings-focus="templates"] [data-settings-focus-group]:not([data-settings-focus-group="templates"]),
#templateSettingsPanel[data-settings-focus="report-branding"] [data-settings-focus-group]:not([data-settings-focus-group="report-branding"]) {
  display: none;
}

#homepageContentPanel[data-homepage-content-focus="hero"] [data-homepage-content-section]:not([data-homepage-content-section="hero"]),
#homepageContentPanel[data-homepage-content-focus="content"] [data-homepage-content-section]:not([data-homepage-content-section="content"]),
#homepageContentPanel[data-homepage-content-focus="visibility"] [data-homepage-content-section]:not([data-homepage-content-section="visibility"]),
#homepageContentPanel[data-homepage-content-focus="member"] [data-homepage-content-section]:not([data-homepage-content-section="member"]) {
  display: none;
}

.owner-report-archive-panel { display: grid; gap: 16px; }

.report-archive-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(5, minmax(135px, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface-muted);
}

.report-archive-filters label { display: grid; gap: 5px; min-width: 0; color: var(--color-text-muted-accessible); font-size: 11px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.report-archive-filters input,
.report-archive-filters select { min-width: 0; }
.report-search-field { grid-column: span 2; }

.owner-report-archive-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 0.9fr);
  gap: 16px;
  align-items: start;
}

.owner-report-list { display: grid; gap: 10px; min-width: 0; }

.owner-report-card,
.owner-report-detail {
  min-width: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

.owner-report-card {
  display: grid;
  gap: 12px;
  padding: 15px;
}

.owner-report-card.is-selected { border-color: rgba(194, 155, 72, 0.76); box-shadow: inset 3px 0 0 var(--brand-gold), var(--shadow-surface); }
.owner-report-card-main,
.owner-report-detail-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.owner-report-card-main > div { display: grid; gap: 3px; min-width: 0; }
.owner-report-card h3,
.owner-report-detail h3 { margin: 0; color: var(--color-brand-primary); font-size: 18px; }
.owner-report-card p:not(.eyebrow),
.owner-report-detail-heading p { margin: 0; color: var(--color-text-muted-accessible); font-size: 12px; overflow-wrap: anywhere; }

.owner-report-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid var(--color-border);
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  line-height: 1.4;
}

.owner-report-score {
  margin-left: auto;
  color: var(--brand-teal);
  font-size: 18px;
  font-weight: 900;
}

.owner-report-score small { color: var(--color-text-muted-accessible); font-size: 11px; font-weight: 800; }
.owner-report-detail { position: sticky; top: 16px; min-height: 150px; padding: 16px; }
.owner-report-detail-empty { display: grid; gap: 6px; padding: 6px; }
.owner-report-detail-empty h3,
.owner-report-detail-empty p { margin: 0; }
.owner-report-detail-empty p { color: var(--color-text-muted-accessible); line-height: 1.5; }
.owner-report-detail-card { display: grid; gap: 16px; }
.owner-report-detail-back { display: none; width: max-content; min-height: 34px; padding: 0; border: 0; background: transparent; color: var(--color-brand-primary); font-size: 12px; font-weight: 800; text-decoration: underline; }

.owner-report-detail-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.owner-report-detail-facts div { min-width: 0; padding-top: 9px; border-top: 1px solid var(--color-border); }
.owner-report-detail-facts dt { color: var(--color-text-muted-accessible); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.owner-report-detail-facts dd { margin: 4px 0 0; color: var(--color-text); font-size: 13px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.owner-report-detail-summary { padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface-muted); }
.owner-report-detail-summary p { margin: 0; color: var(--color-text-muted-accessible); font-size: 13px; line-height: 1.5; white-space: pre-wrap; }
.owner-report-detail-summary .eyebrow { margin-bottom: 5px; }
.owner-report-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.owner-report-pdf-frame { width: 100%; min-height: 560px; border: 1px solid var(--color-border); border-radius: var(--radius-control); background: var(--color-surface-muted); }

@media (max-width: 1180px) {
  .report-archive-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .report-search-field { grid-column: 1 / -1; }
  .owner-report-archive-layout { grid-template-columns: minmax(0, 1fr) minmax(330px, 0.85fr); }
}

@media (max-width: 820px) {
  .owner-reports-summary,
  .owner-settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .owner-reports-paths { grid-template-columns: 1fr; }
  .owner-report-archive-layout { grid-template-columns: 1fr; }
  .owner-report-detail { position: static; }
  .owner-report-pdf-frame { min-height: 500px; }
}

@media (max-width: 620px) {
  .settings-context-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
  .settings-context-nav button { flex: 0 0 auto; }
  .admin-utility-note { grid-template-columns: 1fr; }
  .report-archive-filters { grid-template-columns: 1fr; padding: 12px; }
  .report-search-field { grid-column: auto; }
  .owner-recent-report { align-items: stretch; flex-direction: column; }
  .owner-recent-report .secondary-button { width: 100%; }
}

@media (max-width: 430px) {
  .owner-reports-summary,
  .owner-settings-grid,
  .owner-report-detail-facts { grid-template-columns: 1fr; }
  .owner-reports-summary article,
  .owner-settings-grid article,
  .owner-reports-paths article { padding: 14px; }
  .owner-report-card-main,
  .owner-report-detail-heading { align-items: stretch; flex-direction: column; }
  .owner-report-card-main .status-chip,
  .owner-report-detail-heading .status-chip { align-self: flex-start; }
  .owner-report-facts { display: grid; gap: 6px; }
  .owner-report-score { margin-left: 0; }
  .owner-report-detail-actions { display: grid; grid-template-columns: 1fr; }
  .owner-report-detail-actions a { width: 100%; }
  .owner-report-pdf-frame { min-height: 430px; }
  .owner-report-archive-panel .owner-report-detail { display: none; }
  .owner-report-archive-panel.is-mobile-detail-open > .panel-heading,
  .owner-report-archive-panel.is-mobile-detail-open > .report-archive-filters,
  .owner-report-archive-panel.is-mobile-detail-open #reportArchive { display: none; }
  .owner-report-archive-panel.is-mobile-detail-open .owner-report-archive-layout { display: block; }
  .owner-report-archive-panel.is-mobile-detail-open .owner-report-detail { display: block; min-width: 0; }
  .owner-report-detail-back { display: inline-flex; }
}

/* Phase 4B-2: Supervisor Member and Assessment Operations workspaces. */
#supervisorMembersWorkspace,
#supervisorAssessmentsWorkspace {
  display: none;
}

body.app-body.supervisor-mode [data-workspace-panel="members"] > .panel-heading,
body.app-body.supervisor-mode [data-workspace-panel="members"] > #athleteForm,
body.app-body.supervisor-mode [data-workspace-panel="members"] > .member-directory-section,
body.app-body.supervisor-mode [data-workspace-panel="intake-queue"] > .panel-heading,
body.app-body.supervisor-mode [data-workspace-panel="intake-queue"] > .assessment-request-operations {
  display: none;
}

body.app-body.supervisor-mode #supervisorMembersWorkspace,
body.app-body.supervisor-mode #supervisorAssessmentsWorkspace {
  display: grid;
  gap: 18px;
}

body.app-body.supervisor-mode .supervisor-workspace-heading,
body.app-body.supervisor-mode .supervisor-member-record-main,
body.app-body.supervisor-mode .supervisor-member-record-footer,
body.app-body.supervisor-mode .supervisor-assessment-record-head,
body.app-body.supervisor-mode .supervisor-assessment-record-footer,
body.app-body.supervisor-mode .supervisor-detail-heading,
body.app-body.supervisor-mode .supervisor-primary-action {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

body.app-body.supervisor-mode .supervisor-workspace-heading > div,
body.app-body.supervisor-mode .supervisor-member-record-main > div,
body.app-body.supervisor-mode .supervisor-assessment-record-head > div,
body.app-body.supervisor-mode .supervisor-detail-heading > div {
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-workspace-heading h2,
body.app-body.supervisor-mode .supervisor-member-record h4,
body.app-body.supervisor-mode .supervisor-assessment-record h4,
body.app-body.supervisor-mode .supervisor-member-detail h3,
body.app-body.supervisor-mode .supervisor-member-detail h4,
body.app-body.supervisor-mode .supervisor-assessment-detail h3,
body.app-body.supervisor-mode .supervisor-assessment-detail h4,
body.app-body.supervisor-mode .supervisor-detail-empty h3 {
  margin: 0;
  color: var(--color-brand-primary);
}

body.app-body.supervisor-mode .supervisor-workspace-heading .panel-description,
body.app-body.supervisor-mode .supervisor-member-record p,
body.app-body.supervisor-mode .supervisor-assessment-record p,
body.app-body.supervisor-mode .supervisor-detail-heading p,
body.app-body.supervisor-mode .supervisor-detail-note,
body.app-body.supervisor-mode .supervisor-detail-empty p {
  margin: 4px 0 0;
  color: var(--color-text-muted-accessible);
  font-size: 13px;
  line-height: 1.5;
}

body.app-body.supervisor-mode .supervisor-workspace-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

body.app-body.supervisor-mode .supervisor-workspace-summary article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
}

body.app-body.supervisor-mode .supervisor-workspace-summary span,
body.app-body.supervisor-mode .supervisor-member-record-facts dt,
body.app-body.supervisor-mode .supervisor-detail-facts dt,
body.app-body.supervisor-mode .supervisor-member-journey dt,
body.app-body.supervisor-mode .supervisor-assessment-record-facts dt {
  color: var(--color-text-muted-accessible);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

body.app-body.supervisor-mode .supervisor-workspace-summary strong {
  color: var(--color-brand-primary);
  font-family: var(--font-heading);
  font-size: 25px;
  line-height: 1;
}

body.app-body.supervisor-mode .supervisor-workspace-controls,
body.app-body.supervisor-mode .supervisor-assessment-controls {
  display: grid;
  grid-template-columns: minmax(240px, 1.45fr) repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface-muted);
}

body.app-body.supervisor-mode .supervisor-assessment-controls {
  grid-template-columns: minmax(260px, 1.55fr) minmax(180px, 0.7fr);
}

body.app-body.supervisor-mode .supervisor-workspace-controls label,
body.app-body.supervisor-mode .supervisor-assessment-controls label {
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-member-filter-toggle {
  display: none;
}

body.app-body.supervisor-mode .supervisor-member-advanced-filters {
  display: contents;
}

body.app-body.supervisor-mode .supervisor-workspace-controls label span,
body.app-body.supervisor-mode .supervisor-assessment-controls label span {
  display: block;
  margin-bottom: 5px;
  color: var(--color-text-muted-accessible);
  font-size: 11px;
  font-weight: 800;
}

body.app-body.supervisor-mode .supervisor-workspace-list-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

body.app-body.supervisor-mode .supervisor-workspace-list-heading h3 {
  margin: 0;
  font-size: 17px;
}

body.app-body.supervisor-mode .supervisor-workspace-list-heading span {
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  font-weight: 700;
}

body.app-body.supervisor-mode .supervisor-members-layout,
body.app-body.supervisor-mode .supervisor-assessments-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(330px, 0.8fr);
  gap: 16px;
  align-items: start;
}

body.app-body.supervisor-mode .supervisor-member-list-section,
body.app-body.supervisor-mode .supervisor-member-detail,
body.app-body.supervisor-mode .supervisor-assessment-list-section,
body.app-body.supervisor-mode .supervisor-assessment-detail {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-surface);
}

body.app-body.supervisor-mode .supervisor-member-list,
body.app-body.supervisor-mode .supervisor-assessment-list {
  display: grid;
  gap: 10px;
}

body.app-body.supervisor-mode .supervisor-member-record,
body.app-body.supervisor-mode .supervisor-assessment-record {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface);
}

body.app-body.supervisor-mode .supervisor-member-record.is-selected,
body.app-body.supervisor-mode .supervisor-assessment-record.is-selected {
  border-color: rgba(194, 155, 72, 0.76);
  box-shadow: inset 3px 0 0 var(--brand-gold);
}

body.app-body.supervisor-mode .supervisor-member-record-facts,
body.app-body.supervisor-mode .supervisor-detail-facts,
body.app-body.supervisor-mode .supervisor-member-journey,
body.app-body.supervisor-mode .supervisor-assessment-record-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

body.app-body.supervisor-mode .supervisor-assessment-record-facts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-body.supervisor-mode .supervisor-detail-facts,
body.app-body.supervisor-mode .supervisor-member-journey {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-body.supervisor-mode .supervisor-member-record-facts div,
body.app-body.supervisor-mode .supervisor-detail-facts div,
body.app-body.supervisor-mode .supervisor-member-journey div,
body.app-body.supervisor-mode .supervisor-assessment-record-facts div {
  min-width: 0;
  padding-top: 8px;
  border-top: 1px solid var(--color-border);
}

body.app-body.supervisor-mode .supervisor-member-record-facts dd,
body.app-body.supervisor-mode .supervisor-detail-facts dd,
body.app-body.supervisor-mode .supervisor-member-journey dd,
body.app-body.supervisor-mode .supervisor-assessment-record-facts dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.38;
}

body.app-body.supervisor-mode .supervisor-member-record-footer,
body.app-body.supervisor-mode .supervisor-assessment-record-footer {
  align-items: center;
  padding-top: 3px;
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  line-height: 1.4;
}

body.app-body.supervisor-mode .supervisor-member-detail,
body.app-body.supervisor-mode .supervisor-assessment-detail {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 16px;
}

body.app-body.supervisor-mode .supervisor-detail-mobile-back-row {
  display: none;
}

body.app-body.supervisor-mode .supervisor-detail-empty {
  display: grid;
  gap: 6px;
  min-height: 150px;
  padding: 6px;
}

body.app-body.supervisor-mode .supervisor-detail-section {
  display: grid;
  gap: 9px;
  padding-top: 15px;
  border-top: 1px solid var(--color-border);
}

body.app-body.supervisor-mode .supervisor-detail-section:first-of-type {
  padding-top: 0;
  border-top: 0;
}

body.app-body.supervisor-mode .supervisor-detail-section h4 {
  font-size: 14px;
}

body.app-body.supervisor-mode .supervisor-detail-emphasis {
  margin: 0;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.5;
}

body.app-body.supervisor-mode .supervisor-primary-action {
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(194, 155, 72, 0.48);
  border-radius: var(--radius-control);
  background: var(--color-warning-surface);
  color: var(--color-text);
  font-size: 13px;
  line-height: 1.45;
}

body.app-body.supervisor-mode .supervisor-primary-action.is-waiting {
  border-color: var(--color-border);
  background: var(--color-surface-muted);
  color: var(--color-text-muted-accessible);
}

body.app-body.supervisor-mode .supervisor-primary-action p {
  margin: 0 0 3px;
}

body.app-body.supervisor-mode .supervisor-primary-action .intake-assignment-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  width: 100%;
}

body.app-body.supervisor-mode .supervisor-primary-action .intake-assignment-row label {
  min-width: 0;
}

body.app-body.supervisor-mode .supervisor-primary-action .intake-assignment-row input,
body.app-body.supervisor-mode .supervisor-primary-action .intake-assignment-row select {
  min-width: 0;
  width: 100%;
}

body.app-body.supervisor-mode .supervisor-primary-action .intake-assignment-row .primary-button {
  grid-column: 1 / -1;
  width: 100%;
}

body.app-body.supervisor-mode .supervisor-stage-filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

body.app-body.supervisor-mode .supervisor-stage-filter-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 35px;
  padding: 7px 10px;
  color: var(--color-brand-secondary);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: var(--color-surface);
  font-size: 12px;
  font-weight: 800;
}

body.app-body.supervisor-mode .supervisor-stage-filter-tabs button span {
  display: inline-grid;
  min-width: 19px;
  min-height: 19px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-surface-muted);
  color: var(--color-text-muted-accessible);
  font-size: 10px;
}

body.app-body.supervisor-mode .supervisor-stage-filter-tabs button.active {
  color: var(--color-brand-primary);
  border-color: var(--brand-gold);
  background: #f6f1e7;
  box-shadow: inset 0 -2px 0 var(--brand-gold);
}

body.app-body.supervisor-mode .supervisor-assessment-statuses {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

body.app-body.supervisor-mode .supervisor-stage-line {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--color-text-muted-accessible);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

body.app-body.supervisor-mode .supervisor-stage-line span:first-child {
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--color-information-surface);
  color: var(--color-information);
  font-weight: 800;
}

body.app-body.supervisor-mode .supervisor-empty-state {
  padding: 22px;
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-control);
  background: var(--color-surface-muted);
}

body.app-body.supervisor-mode .supervisor-empty-state h4,
body.app-body.supervisor-mode .supervisor-empty-state p {
  margin: 0;
}

body.app-body.supervisor-mode .supervisor-empty-state p {
  margin-top: 5px;
  color: var(--color-text-muted-accessible);
  font-size: 13px;
}

body.app-body.supervisor-mode .supervisor-member-dialog {
  width: min(680px, calc(100% - 32px));
  max-height: min(860px, calc(100dvh - 28px));
  padding: 0;
  overflow: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-surface);
  background: var(--color-surface);
  box-shadow: var(--shadow-overlay);
}

body.app-body.supervisor-mode .supervisor-member-dialog::backdrop {
  background: rgba(7, 19, 29, 0.45);
}

body.app-body.supervisor-mode .supervisor-member-dialog form {
  display: grid;
  gap: 14px;
  padding: 20px;
}

body.app-body.supervisor-mode .supervisor-member-dialog .dialog-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

body.app-body.supervisor-mode .supervisor-member-dialog .dialog-heading h2,
body.app-body.supervisor-mode .supervisor-member-dialog .dialog-heading p {
  margin: 0;
}

body.app-body.supervisor-mode .supervisor-member-dialog .dialog-heading p:not(.eyebrow) {
  margin-top: 5px;
  color: var(--color-text-muted-accessible);
  font-size: 13px;
  line-height: 1.5;
}

body.app-body.supervisor-mode .supervisor-create-result {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid rgba(47, 107, 85, 0.3);
  border-radius: var(--radius-control);
  background: var(--color-success-surface);
  color: var(--color-success);
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-workspace-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-workspace-summary article {
  gap: 3px;
  min-height: 66px;
  padding: 10px;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-workspace-summary span {
  font-size: 9px;
  line-height: 1.2;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-workspace-summary strong {
  font-size: 22px;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-workspace-controls {
  gap: 8px;
  padding: 10px;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-member-filter-toggle {
  display: inline-flex;
  width: 100%;
  justify-content: center;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-member-advanced-filters {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-member-advanced-filters[hidden] {
  display: none;
}

body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-member-advanced-filters label,
body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-compact .supervisor-member-advanced-filters select {
  min-width: 0;
  width: 100%;
}

@media (max-width: 1180px) {
  body.app-body.supervisor-mode .supervisor-workspace-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.app-body.supervisor-mode .supervisor-search-control { grid-column: 1 / -1; }
  body.app-body.supervisor-mode .supervisor-members-layout,
  body.app-body.supervisor-mode .supervisor-assessments-layout { grid-template-columns: minmax(0, 1fr) minmax(290px, 0.8fr); }
  body.app-body.supervisor-mode .supervisor-assessment-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  body.app-body.supervisor-mode .supervisor-workspace-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.app-body.supervisor-mode .supervisor-members-layout,
  body.app-body.supervisor-mode .supervisor-assessments-layout { grid-template-columns: 1fr; }
  body.app-body.supervisor-mode .supervisor-member-detail,
  body.app-body.supervisor-mode .supervisor-assessment-detail { position: static; }
  body.app-body.supervisor-mode .supervisor-member-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  body.app-body.supervisor-mode .supervisor-workspace-heading,
  body.app-body.supervisor-mode .supervisor-member-record-main,
  body.app-body.supervisor-mode .supervisor-member-record-footer,
  body.app-body.supervisor-mode .supervisor-assessment-record-head,
  body.app-body.supervisor-mode .supervisor-assessment-record-footer,
  body.app-body.supervisor-mode .supervisor-detail-heading,
  body.app-body.supervisor-mode .supervisor-primary-action { align-items: stretch; flex-direction: column; }
  body.app-body.supervisor-mode .supervisor-workspace-heading .primary-button,
  body.app-body.supervisor-mode .supervisor-workspace-heading .secondary-button,
  body.app-body.supervisor-mode .supervisor-member-record-footer .secondary-button,
  body.app-body.supervisor-mode .supervisor-assessment-record-footer .secondary-button,
  body.app-body.supervisor-mode .supervisor-primary-action .primary-button,
  body.app-body.supervisor-mode .supervisor-primary-action .secondary-button { width: 100%; }
  body.app-body.supervisor-mode .supervisor-workspace-controls,
  body.app-body.supervisor-mode .supervisor-assessment-controls { grid-template-columns: 1fr; }
  body.app-body.supervisor-mode .supervisor-search-control { grid-column: auto; }
  body.app-body.supervisor-mode .supervisor-member-list-section,
  body.app-body.supervisor-mode .supervisor-member-detail,
  body.app-body.supervisor-mode .supervisor-assessment-list-section,
  body.app-body.supervisor-mode .supervisor-assessment-detail { padding: 13px; }
  body.app-body.supervisor-mode .supervisor-assessment-statuses { justify-content: flex-start; }
  body.app-body.supervisor-mode .supervisor-primary-action .intake-assignment-row { grid-template-columns: 1fr; min-width: 0; }
}

@media (max-width: 430px) {
  body.app-body.supervisor-mode .supervisor-workspace-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  body.app-body.supervisor-mode .supervisor-workspace-summary article { gap: 3px; min-height: 66px; padding: 10px; }
  body.app-body.supervisor-mode .supervisor-workspace-summary span { font-size: 9px; line-height: 1.2; }
  body.app-body.supervisor-mode .supervisor-workspace-summary strong { font-size: 22px; }
  body.app-body.supervisor-mode .supervisor-workspace-controls { gap: 8px; padding: 10px; }
  body.app-body.supervisor-mode .supervisor-member-filter-toggle { display: inline-flex; width: 100%; justify-content: center; }
  body.app-body.supervisor-mode .supervisor-member-advanced-filters { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  body.app-body.supervisor-mode .supervisor-member-advanced-filters[hidden] { display: none; }
  body.app-body.supervisor-mode .supervisor-member-advanced-filters label { min-width: 0; }
  body.app-body.supervisor-mode .supervisor-member-advanced-filters select { width: 100%; min-width: 0; }
  body.app-body.supervisor-mode .supervisor-member-record-facts,
  body.app-body.supervisor-mode .supervisor-detail-facts,
  body.app-body.supervisor-mode .supervisor-member-journey,
  body.app-body.supervisor-mode .supervisor-assessment-record-facts { grid-template-columns: 1fr; }
  body.app-body.supervisor-mode .supervisor-stage-filter-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.app-body.supervisor-mode .supervisor-stage-filter-tabs button { justify-content: space-between; }
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open > .supervisor-workspace-heading,
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open > .supervisor-workspace-summary,
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open > .supervisor-workspace-controls,
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open > .supervisor-workspace-list-heading,
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open .supervisor-member-list-section,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open > .supervisor-workspace-heading,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open > .supervisor-assessment-controls,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open > .supervisor-stage-filter-tabs,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open > .supervisor-workspace-list-heading,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open .supervisor-assessment-list-section { display: none; }
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open .supervisor-members-layout,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open .supervisor-assessments-layout { display: block; }
  body.app-body.supervisor-mode .supervisor-members-workspace.is-mobile-detail-open .supervisor-member-detail,
  body.app-body.supervisor-mode .supervisor-assessments-workspace.is-mobile-detail-open .supervisor-assessment-detail { display: grid; min-width: 0; }
  body.app-body.supervisor-mode .supervisor-detail-mobile-back-row { display: block; }
}