main {
  max-width: none;
  padding: 20px;
}
#workspace-nav {
  display: flex;
  gap: 12px;
  margin: 20px 0 30px;
}
#workspace-nav button {
  background: #142438;
  color: #56dfce;
}
.nav-badge {
  display: inline-grid;
  min-width: 21px;
  height: 21px;
  margin-left: 6px;
  padding: 0 6px;
  place-items: center;
  border-radius: 999px;
  background: #ffb188;
  color: #07111f;
  font-size: 11px;
  font-weight: 800;
}
.pipeline-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.pipeline-heading p {
  font-size: 14px;
}
.pipeline-filters {
  display: flex;
  gap: 12px;
  margin: 20px 0;
}
.pipeline-filters input {
  flex: 1;
  min-width: 0;
}
.pipeline-filters select {
  max-width: 260px;
  min-width: 0;
}
.active-filter-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: -8px 0 16px;
  padding: 10px 12px;
  border: 1px solid #356475;
  border-radius: 10px;
  background: #122b3d;
}
.active-filter-strip[hidden] { display: none; }
.active-filter-strip > div { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.active-filter-strip strong { flex: none; color: #69e2d5; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.active-filter-strip span { overflow: hidden; color: #c0d3df; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.active-filter-strip button { flex: none; padding: 7px 10px; background: #173d4b; color: #7be7db; }
.scroll-label {
  color: #99afc2;
  font-size: 12px;
  gap: 2px;
  margin-bottom: 12px;
}
#lane-scroll {
  width: 100%;
  accent-color: #56dfce;
  padding: 0;
  cursor: ew-resize;
}
#production-board {
  display: flex;
  gap: 14px;
  overflow: auto;
  scrollbar-color: #56dfce #142438;
  padding-bottom: 16px;
  min-height: 300px;
  cursor: grab;
  touch-action: pan-y pinch-zoom;
  overscroll-behavior-x: contain;
}
#production-board.is-dragging {
  cursor: grabbing;
  user-select: none;
}
#production-board.is-dragging .student-card {
  cursor: grabbing;
}
.pipeline-lane {
  min-width: 275px;
  width: 275px;
  background: #0e1c2c;
  border: 1px solid #1b3045;
  border-radius: 10px;
  padding: 14px;
}
.pipeline-lane h3 {
  font-size: 13px;
  min-height: 38px;
  margin: 0 0 14px;
  color: #c5d7e6;
}
.lane-title-with-help {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.lane-count-help { position: relative; flex: none; }
.lane-count-help summary {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid #42627c;
  border-radius: 50%;
  color: #72e5d8;
  cursor: pointer;
  list-style: none;
}
.lane-count-help summary::-webkit-details-marker { display: none; }
.lane-count-help p {
  position: absolute;
  z-index: 15;
  top: 28px;
  right: 0;
  width: 225px;
  margin: 0;
  padding: 11px;
  border: 1px solid #36546c;
  border-radius: 8px;
  background: #172b40;
  box-shadow: 0 12px 26px #02070dcc;
  color: #d7e3ee;
  font-size: 11px;
  line-height: 1.45;
}
.pipeline-lane .lane-context {
  min-height: 34px;
  margin: -8px 0 12px;
  color: #91aec7;
  font-size: 11px;
  line-height: 1.35;
}
.student-card {
  display: block;
  width: 100%;
  text-align: left;
  background: linear-gradient(135deg, #1a3047, #142438);
  border-color: #2c455c;
  color: #f2f7fc;
  margin: 0 0 14px;
  padding: 16px;
  font-weight: 400;
}
.student-card strong {
  font-size: 16px;
}
.student-card small {
  display: block;
  margin-top: 8px;
}
.certification-count {
  display: inline-flex;
  margin-top: 10px;
  padding: 4px 8px;
  border: 1px solid #3c5a73;
  border-radius: 999px;
  color: #c9d9e7;
  font-size: 11px;
  line-height: 1;
}
.student-card p {
  font-size: 13px;
  margin-bottom: 0;
  color: #d7e3ee;
}
.student-card .next-label {
  color: #56dfce;
  letter-spacing: 1px;
  font-size: 10px;
  margin-top: 16px;
}
.graduation {
  display: block;
  font-size: 11px;
  padding: 7px;
  margin-top: 12px;
  border-radius: 5px;
  background: #2e4053;
}
.graduation[data-color="blue"] {
  background: #19456b;
}
.graduation[data-color="purple"] {
  background: #523770;
}
.graduation[data-color="green"] {
  background: #194c3c;
}
.graduation[data-color="yellow"] {
  background: #eed782;
  color: #282513;
}
.graduation[data-color="orange"] {
  background: #e9a674;
  color: #2a2018;
}
.graduation[data-color="red"] {
  background: #bd424d;
}
.compliance-badge {
  display: block;
  margin-top: 7px;
  padding: 7px 8px;
  border-radius: 5px;
  background: #23405a;
  color: #dceaf5;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
}
.compliance-badge[data-tone="complete"] {
  background: #194c3c;
  color: #d7f6e9;
}
.compliance-badge[data-tone="warning"] {
  background: #eed782;
  color: #282513;
}
.compliance-badge[data-tone="due"] {
  background: #e9a674;
  color: #2a2018;
}
.compliance-badge[data-tone="critical"] {
  background: #bd424d;
  color: #fff;
}
#student-detail {
  inset: 0;
  margin: 0;
  max-width: none;
  width: 100vw;
  height: 100dvh;
  max-height: none;
  background: transparent;
  border: 0;
  padding: 0;
}
.student-detail-panel {
  box-sizing: border-box;
  margin-left: auto;
  width: min(100%, 480px);
  height: 100%;
  overflow-y: auto;
  background: #101e30;
  border-left: 1px solid #304b63;
  padding: 28px;
  color: #f2f7fc;
}
#student-detail::backdrop {
  background: #030912c9;
}
.student-notes {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.student-notes-panel {
  margin-top: 20px;
  margin-bottom: 26px;
}
.student-notes-panel .detail-field {
  border-color: #3a6470;
  background: #152b3d;
}
.student-profile {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 24px;
}
.detail-field {
  margin: 0;
  padding: 12px;
  border: 1px solid #29425a;
  border-radius: 7px;
  background: #142438;
}
.detail-field-wide {
  grid-column: 1 / -1;
}
.detail-field dt {
  margin-bottom: 6px;
  color: #8fa8bd;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.detail-field dd {
  margin: 0;
  color: #eef6fc;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
.detail-statuses {
  margin-bottom: 24px;
}
.lane-explanation {
  margin: 20px 0 24px;
  padding: 15px 16px;
  border: 1px solid #32706f;
  border-left: 4px solid #56dfce;
  border-radius: 9px;
  background: linear-gradient(135deg,#153242,#14283b);
}
.lane-explanation-kicker,
.lane-milestone-label {
  color: #62e4d5;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .11em;
}
.lane-explanation-reason { margin: 7px 0 0; color: #f0f7fb; font-size: 14px; line-height: 1.5; }
.lane-explanation-details { margin-top: 11px; border-top: 1px solid #315169; padding-top: 10px; }
.lane-explanation-details summary { color: #8eece1; cursor: pointer; font-size: 12px; font-weight: 750; }
.lane-driver-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }
.lane-driver-list .detail-field { padding: 10px; }
.lane-explanation-details > p { margin: 5px 0 0; }

#changes-drawer,
#lane-rules-drawer {
  inset: 0;
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
#changes-drawer::backdrop,
#lane-rules-drawer::backdrop { background: #030912c9; }
.changes-panel,
.lane-rules-panel {
  box-sizing: border-box;
  width: min(100%,680px);
  height: 100%;
  margin-left: auto;
  overflow-y: auto;
  padding: 28px;
  border-left: 1px solid #304b63;
  background: #101e30;
  color: #f2f7fc;
}
.lane-rules-panel { width: min(100%,760px); }
.changes-heading,
.lane-rules-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.changes-heading span,
.lane-rules-heading span { color: #56dfce; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.changes-heading h2,
.lane-rules-heading h2 { margin: 7px 0 3px; }
.changes-heading p,
.lane-rules-heading p { margin: 0; }
.changes-heading form,
.lane-rules-heading form { display: block; }
.changes-overview { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; margin: 24px 0; }
.changes-summary { display: grid; gap: 5px; min-width: 0; padding: 11px; border: 1px solid #29465d; border-radius: 8px; background: #15293d; }
.changes-summary strong { color: #56dfce; font-size: 20px; }
.changes-summary span { color: #9fb5c8; font-size: 10px; line-height: 1.25; }
.changes-latest h3 { margin-bottom: 11px; }
.change-item {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 0 8px;
  padding: 12px 13px;
  border: 1px solid #29465d;
  border-radius: 8px;
  background: #14283c;
  color: #f2f7fc;
  text-align: left;
  font-weight: 500;
}
button.change-item:hover { border-color: #56dfce; background: #193148; }
.change-copy { display: grid; gap: 4px; min-width: 0; }
.change-copy small { color: #a8bdce; overflow-wrap: anywhere; }
.change-owner { flex: none; color: #70ded2; font-size: 11px; }
.changes-all { margin-top: 18px; padding-top: 14px; border-top: 1px solid #29465d; }
.changes-all > summary { color: #76eadc; cursor: pointer; font-weight: 750; }
.changes-group { margin-top: 20px; }
.changes-group h3 { color: #a8bdce; font-size: 13px; }
.changes-empty { padding: 18px; border: 1px dashed #3b566d; border-radius: 9px; background: #132437; }
.lane-rules-intro {
  margin: 24px 0 16px;
  padding: 14px 16px;
  border: 1px solid #32706f;
  border-left: 4px solid #56dfce;
  border-radius: 9px;
  background: #13283b;
}
.lane-rules-intro strong { color: #8ff3e7; }
.lane-rules-intro p { margin: 7px 0 0; color: #dce9f1; }
.lane-rules-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
}
.lane-rule-card {
  min-width: 0;
  padding: 14px;
  border: 1px solid #29465d;
  border-radius: 8px;
  background: #14283c;
}
.lane-rule-card h3 {
  margin: 0 0 12px;
  color: #f2f7fc;
  font-size: 15px;
}
.lane-rule-card p {
  margin: 5px 0 12px;
  color: #d2e1ec;
  font-size: 12px;
  line-height: 1.45;
}
.lane-rule-label {
  display: block;
  color: #75e7d8;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.lane-rule-next {
  display: block;
  padding-top: 10px;
  border-top: 1px solid #29465d;
  color: #a8bdce;
  font-size: 12px;
  font-weight: 750;
}
.timeline-rules {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid #29465d;
}
.timeline-rules h3 { margin: 0 0 12px; font-size: 15px; }
.timeline-rule-list {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(140px,1fr));
  gap: 8px;
}
.timeline-rule-item {
  min-width: 0;
  padding: 12px;
  border: 1px solid #29465d;
  border-top: 4px solid #56dfce;
  border-radius: 8px;
  background: #132437;
}
.timeline-rule-item strong,
.timeline-rule-item span {
  display: block;
}
.timeline-rule-item strong {
  display: inline-flex;
  width: fit-content;
  padding: 3px 7px;
  border-radius: 999px;
  background: #2e4053;
  color: #f2f7fc;
  font-size: 12px;
}
.timeline-rule-item span { margin-top: 5px; color: #f2f7fc; font-size: 12px; font-weight: 750; }
.timeline-rule-item p { margin: 8px 0 0; color: #a8bdce; font-size: 11px; line-height: 1.4; }
.timeline-rule-item[data-color="neutral"] { border-top-color: #2e4053; }
.timeline-rule-item[data-color="neutral"] strong { background: #2e4053; color: #f2f7fc; }
.timeline-rule-item[data-color="blue"] { border-top-color: #19456b; }
.timeline-rule-item[data-color="blue"] strong { background: #19456b; color: #f2f7fc; }
.timeline-rule-item[data-color="purple"] { border-top-color: #523770; }
.timeline-rule-item[data-color="purple"] strong { background: #523770; color: #f2f7fc; }
.timeline-rule-item[data-color="green"] { border-top-color: #194c3c; }
.timeline-rule-item[data-color="green"] strong { background: #194c3c; color: #d7f6e9; }
.timeline-rule-item[data-color="yellow"] { border-top-color: #eed782; }
.timeline-rule-item[data-color="yellow"] strong { background: #eed782; color: #282513; }
.timeline-rule-item[data-color="orange"] { border-top-color: #e9a674; }
.timeline-rule-item[data-color="orange"] strong { background: #e9a674; color: #2a2018; }
.timeline-rule-item[data-color="red"] { border-top-color: #bd424d; }
.timeline-rule-item[data-color="red"] strong { background: #bd424d; color: #fff; }
.dashboard-heading,
.comparison-heading,
.queue-heading,
.view-controls,
.dashboard-actions,
.segmented,
.update-notice {
  display: flex;
  align-items: center;
  gap: 10px;
}
#dashboard {
  margin: 6px 0 34px;
  padding: 22px;
  border: 1px solid #213b52;
  border-radius: 14px;
  background: linear-gradient(145deg, #101e30, #0c1828);
}
.dashboard-heading {
  justify-content: space-between;
  align-items: flex-end;
}
.dashboard-heading h2,
.dashboard-heading .eyebrow,
.comparison-heading h3,
.comparison-heading p {
  margin: 0;
}
.dashboard-heading .eyebrow {
  margin-bottom: 8px;
}
.dashboard-heading p {
  margin-bottom: 0;
}
.dashboard-actions button,
.view-controls button,
.segmented button,
.update-notice button,
.lane-more,
.queue-more {
  background: #14283d;
  color: #76eadc;
}
.dashboard-metrics {
  display: grid;
  grid-template-columns: repeat(7, minmax(115px, 1fr));
  gap: 10px;
  margin: 22px 0 12px;
}
.metric {
  min-height: 92px;
  padding: 13px;
  text-align: left;
  background: #172b40;
  color: #f2f7fc;
}
.metric:hover,
.metric:focus-visible {
  border-color: #56dfce;
  background: #1b344d;
}
.metric.critical strong {
  color: #ffb188;
}
.metric-label {
  display: block;
  min-height: 32px;
  color: #9fb4c7;
  font-size: 11px;
  line-height: 1.35;
}
.metric strong {
  display: block;
  margin-top: 7px;
  color: #56dfce;
  font-size: 27px;
  line-height: 1;
}
.countdown-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(110px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid #29425a;
  border-radius: 8px;
  background: #29425a;
}
.countdown-item {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  background: #102035;
  color: #9fb4c7;
  font-size: 11px;
}
.countdown-item strong {
  color: #f2f7fc;
  font-size: 14px;
}
#workload-comparison,
#audit-section,
#online-section {
  margin-top: 28px;
}
.online-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 8px;
  border-radius: 50%;
  background: #56dfce;
  box-shadow: 0 0 0 3px rgb(86 223 206 / 14%);
}
#online-count {
  display: inline-grid;
  min-width: 28px;
  height: 28px;
  margin-left: 6px;
  place-items: center;
  border-radius: 999px;
  background: #56dfce;
  color: #07111f;
  font-size: 14px;
  vertical-align: middle;
}
.health-heading {
  margin: 34px 0 18px;
}
.health-state {
  margin-bottom: 14px;
  padding: 15px 17px;
  border: 1px solid #29425a;
  border-radius: 9px;
  font-weight: 700;
}
.health-state.healthy {
  border-color: #257f72;
  background: #12372f;
  color: #8ef0df;
}
.health-state.attention {
  border-color: #a96634;
  background: #3a291e;
  color: #ffd0a7;
}
.health-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 12px;
}
.health-card {
  min-height: 122px;
  padding: 17px;
  border: 1px solid #29425a;
  border-radius: 9px;
  background: #172b40;
}
.health-card > span,
.health-card small {
  display: block;
  color: #9fb4c7;
}
.health-card strong {
  display: block;
  margin: 10px 0 8px;
  color: #56dfce;
  font-size: 22px;
}
.health-card[data-tone="warning"] strong,
.health-card[data-tone="attention"] strong {
  color: #ffb188;
}
.health-note {
  margin-top: 14px;
}
.comparison-heading {
  justify-content: space-between;
  margin-bottom: 12px;
}
.comparison-heading label {
  display: flex;
  align-items: center;
  grid-template-columns: auto minmax(150px, 220px);
  color: #9fb4c7;
}
.table-scroll {
  overflow: auto;
  border: 1px solid #29425a;
  border-radius: 8px;
}
table {
  width: 100%;
  border-collapse: collapse;
  background: #0f1d2e;
  font-size: 12px;
}
th,
td {
  padding: 10px 12px;
  border-bottom: 1px solid #20374d;
  text-align: right;
  white-space: nowrap;
}
th:first-child,
td:first-child {
  text-align: left;
}
th {
  color: #9fb4c7;
  background: #172b40;
}
#comparison-body tr {
  cursor: pointer;
}
#comparison-body tr:hover {
  background: #183149;
}
.pipeline-filters {
  display: grid;
  grid-template-columns: minmax(280px, 2.4fr) repeat(6, minmax(135px, 1fr));
}
.pipeline-filters input,
.pipeline-filters select {
  width: 100%;
  max-width: none;
}
.custom-select {
  position: relative;
  min-width: 0;
}
.custom-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.custom-select-trigger {
  position: relative;
  width: 100%;
  min-height: 45px;
  padding-right: 36px;
  overflow: hidden;
  background: #142438;
  color: #f2f7fc;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.custom-select-trigger::after {
  content: "⌄";
  position: absolute;
  top: 50%;
  right: 13px;
  translate: 0 -55%;
  color: #86a1b6;
  font-size: 18px;
}
.custom-select.is-open .custom-select-trigger {
  border-color: #56dfce;
  outline: 2px solid #56dfce;
  outline-offset: 2px;
}
.custom-select-menu {
  position: absolute;
  z-index: 50;
  top: calc(100% + 6px);
  left: 0;
  width: max(100%, 230px);
  max-height: min(360px, 55vh);
  overflow-y: auto;
  padding: 6px;
  border: 1px solid #3a566f;
  border-radius: 9px;
  background: #101e30;
  box-shadow: 0 15px 38px #02070dc9;
}
.custom-select-option {
  display: block;
  width: 100%;
  padding: 10px 11px;
  border: 0;
  background: transparent;
  color: #e6f0f7;
  text-align: left;
  font-weight: 500;
}
.custom-select-option:hover,
.custom-select-option:focus-visible {
  background: #1d374f;
}
.custom-select-option[aria-selected="true"] {
  background: #214b52;
  color: #8ff3e7;
  font-weight: 750;
}
.view-controls {
  justify-content: flex-end;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.view-controls label {
  display: flex;
  align-items: center;
  grid-template-columns: auto 160px;
  color: #9fb4c7;
}
.segmented {
  padding: 3px;
  border: 1px solid #29425a;
  border-radius: 9px;
  background: #0d1928;
}
.segmented button {
  padding: 8px 13px;
  border: 0;
  background: transparent;
}
.segmented button[aria-pressed="true"] {
  background: #56dfce;
  color: #082329;
}
.update-notice {
  justify-content: space-between;
  margin: 14px 0;
  padding: 12px 14px;
  border: 1px solid #80623b;
  border-radius: 8px;
  background: #332818;
  color: #f2d29e;
}
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.card-header strong {
  min-width: 0;
}
.priority {
  flex: none;
  padding: 3px 7px;
  border-radius: 999px;
  background: #31485d;
  color: #dceaf5;
  font-size: 10px;
  font-weight: 800;
}
.priority-p1 { background: #9f3540; color: white; }
.priority-p2 { background: #a85d21; color: white; }
.priority-p3 { background: #245f65; color: white; }
.queue-heading {
  justify-content: space-between;
  margin: 8px 0 16px;
  color: #9fb4c7;
  font-size: 13px;
}
.queue-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 14px;
}
.queue-card {
  height: 100%;
  margin: 0;
}
.lane-more,
.queue-more {
  width: 100%;
  margin-top: 8px;
}
body[data-density="compact"] .pipeline-lane {
  min-width: 235px;
  width: 235px;
  padding: 10px;
}
body[data-density="compact"] .student-card {
  padding: 11px;
  margin-bottom: 9px;
}
body[data-density="compact"] .student-card p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
body[data-theme="light"] #workspace-nav button,
body[data-theme="light"] .dashboard-actions button,
body[data-theme="light"] .view-controls button,
body[data-theme="light"] .update-notice button,
body[data-theme="light"] .lane-more,
body[data-theme="light"] .queue-more {
  border-color: #a8bccb;
  background: #dbe3e8;
  color: #075f5b;
}
body[data-theme="light"] #dashboard {
  border-color: #8fa2ae;
  background: linear-gradient(145deg, #c8d3da, #bbc9d1);
  box-shadow: 0 8px 24px #29465d24;
}
body[data-theme="light"] .metric,
body[data-theme="light"] .countdown-item,
body[data-theme="light"] table {
  border-color: #a9bac5;
  background: #d3dce1;
  color: #0b2236;
}
body[data-theme="light"] .metric:hover,
body[data-theme="light"] .metric:focus-visible,
body[data-theme="light"] #comparison-body tr:hover {
  background: #e8f3f3;
}
body[data-theme="light"] .metric-label,
body[data-theme="light"] .countdown-item,
body[data-theme="light"] .queue-heading,
body[data-theme="light"] .view-controls label,
body[data-theme="light"] .comparison-heading label {
  color: #324f65;
}
body[data-theme="light"] .metric {
  box-shadow: inset 0 1px #ffffff70, 0 2px 6px #29465d12;
}
body[data-theme="light"] .metric strong {
  color: #06433f;
}
body[data-theme="light"] .metric.critical strong {
  color: #a7471a;
}
body[data-theme="light"] .countdown-item strong {
  color: #0b3852;
}
body[data-theme="light"] .countdown-summary,
body[data-theme="light"] .table-scroll {
  border-color: #bdcbd6;
  background: #aebdc8;
}
body[data-theme="light"] th {
  border-color: #cbd6df;
  background: #c9d4dc;
  color: #203d53;
}
body[data-theme="light"] td {
  border-color: #d8e1e8;
}
body[data-theme="light"] .segmented {
  border-color: #a8bccb;
  background: #cbd6dd;
}
body[data-theme="light"] .custom-select-trigger {
  border-color: #a8bccb;
  background: #e2e8ec;
  color: #0b2236;
}
body[data-theme="light"] .custom-select-menu {
  border-color: #9fb4c4;
  background: #e2e8ec;
  box-shadow: 0 15px 30px #29465d42;
}
body[data-theme="light"] .custom-select-option {
  color: #0b2236;
}
body[data-theme="light"] .custom-select-option:hover,
body[data-theme="light"] .custom-select-option:focus-visible {
  background: #cfdee5;
}
body[data-theme="light"] .custom-select-option[aria-selected="true"] {
  background: #b9dcd9;
  color: #075f5b;
}
body[data-theme="light"] .active-filter-strip { border-color: #8faab8; background: #c8d7dd; }
body[data-theme="light"] .active-filter-strip strong { color: #076c66; }
body[data-theme="light"] .active-filter-strip span { color: #294b60; }
body[data-theme="light"] .active-filter-strip button { border-color: #91aaa8; background: #dce7e9; color: #075f5b; }
body[data-theme="light"] .segmented button[aria-pressed="true"] {
  background: #19ae9f;
  color: #ffffff;
}
body[data-theme="light"] .update-notice {
  border-color: #d4a358;
  background: #fff3df;
  color: #704719;
}
body[data-theme="light"] .pipeline-lane {
  border-color: #8fa2ae;
  background: #b9c6ce;
  box-shadow: inset 0 1px #ffffff70;
}
body[data-theme="light"] .pipeline-lane h3 {
  color: #29465d;
}
body[data-theme="light"] .pipeline-lane .lane-context {
  color: #526d82;
}
body[data-theme="light"] .student-card {
  border-color: #8fa6b5;
  background: linear-gradient(145deg, #d6dfe4, #c9d5dc);
  color: #0b2236;
  box-shadow: 0 3px 9px #29465d24;
}
body[data-theme="light"] .student-card p,
body[data-theme="light"] .student-card small {
  color: #304e64;
}
body[data-theme="light"] .certification-count {
  border-color: #9db3c2;
  color: #315065;
}
body[data-theme="light"] #student-detail .student-detail-panel {
  border-color: #9db3c2;
  background: #cbd6dd;
  color: #0b2236;
}
body[data-theme="light"] .detail-field,
body[data-theme="light"] .student-notes-panel .detail-field {
  border-color: #b4c6d2;
  background: #e1e7eb;
}
body[data-theme="light"] .detail-field dt {
  color: #36556b;
}
body[data-theme="light"] .detail-field dd {
  color: #0b2236;
}
body[data-theme="light"] .lane-explanation,
body[data-theme="light"] .changes-panel,
body[data-theme="light"] .lane-rules-panel { border-color: #7e9aaa; background: #c8d4da; color: #0b2236; }
body[data-theme="light"] .lane-explanation-reason,
body[data-theme="light"] .changes-heading h2,
body[data-theme="light"] .lane-rules-heading h2,
body[data-theme="light"] .change-item { color: #0b2236; }
body[data-theme="light"] .lane-count-help p,
body[data-theme="light"] .changes-summary,
body[data-theme="light"] .change-item,
body[data-theme="light"] .changes-empty { border-color: #93a9b6; background: #d7e1e6; }
body[data-theme="light"] .change-copy small,
body[data-theme="light"] .changes-summary span { color: #3d5c70; }
body[data-theme="light"] .lane-rules-intro,
body[data-theme="light"] .lane-rule-card,
body[data-theme="light"] .timeline-rule-item {
  border-color: #93a9b6;
  background: #d7e1e6;
}
body[data-theme="light"] .timeline-rule-item[data-color="neutral"] { border-top-color: #2e4053; }
body[data-theme="light"] .timeline-rule-item[data-color="blue"] { border-top-color: #19456b; }
body[data-theme="light"] .timeline-rule-item[data-color="purple"] { border-top-color: #523770; }
body[data-theme="light"] .timeline-rule-item[data-color="green"] { border-top-color: #194c3c; }
body[data-theme="light"] .timeline-rule-item[data-color="yellow"] { border-top-color: #eed782; }
body[data-theme="light"] .timeline-rule-item[data-color="orange"] { border-top-color: #e9a674; }
body[data-theme="light"] .timeline-rule-item[data-color="red"] { border-top-color: #bd424d; }
body[data-theme="light"] .lane-rules-intro strong,
body[data-theme="light"] .lane-rule-label,
body[data-theme="light"] .timeline-rule-item strong { color: #06433f; }
body[data-theme="light"] .timeline-rule-item[data-color="neutral"] strong,
body[data-theme="light"] .timeline-rule-item[data-color="blue"] strong,
body[data-theme="light"] .timeline-rule-item[data-color="purple"] strong,
body[data-theme="light"] .timeline-rule-item[data-color="red"] strong { color: #fff; }
body[data-theme="light"] .timeline-rule-item[data-color="green"] strong { color: #d7f6e9; }
body[data-theme="light"] .timeline-rule-item[data-color="yellow"] strong { color: #282513; }
body[data-theme="light"] .timeline-rule-item[data-color="orange"] strong { color: #2a2018; }
body[data-theme="light"] .lane-rules-intro p,
body[data-theme="light"] .lane-rule-card p,
body[data-theme="light"] .timeline-rule-item p { color: #294b60; }
body[data-theme="light"] .lane-rule-card h3,
body[data-theme="light"] .timeline-rules h3,
body[data-theme="light"] .timeline-rule-item span { color: #0b2236; }
body[data-theme="light"] .lane-rule-next,
body[data-theme="light"] .timeline-rules { border-color: #93a9b6; color: #36556b; }
body[data-theme="light"] .health-card {
  border-color: #a9bdcc;
  background: #e2e8ec;
}
body[data-theme="light"] .health-card > span,
body[data-theme="light"] .health-card small,
body[data-theme="light"] .health-note {
  color: #324f65;
}
body[data-theme="light"] .health-card strong {
  color: #06433f;
}
body[data-theme="light"] .health-card[data-tone="warning"] strong,
body[data-theme="light"] .health-card[data-tone="attention"] strong {
  color: #a7471a;
}
body[data-theme="light"] .health-state.healthy {
  border-color: #6ea99f;
  background: #c8e4de;
  color: #075f5b;
}
body[data-theme="light"] .health-state.attention {
  border-color: #cc9a70;
  background: #efd8c5;
  color: #7d381b;
}
@media (max-width: 600px) {
  .pipeline-filters select {
    max-width: none;
    width: 100%;
  }
  .pipeline-heading,
  .pipeline-filters {
    flex-direction: column;
    align-items: stretch;
  }
  .active-filter-strip { align-items: stretch; flex-direction: column; gap: 9px; }
  .active-filter-strip > div { align-items: flex-start; flex-direction: column; gap: 4px; }
  .active-filter-strip span { white-space: normal; }
  .pipeline-lane {
    min-width: 260px;
  }
  .pipeline-heading h2 {
    margin-top: 10px;
  }
  .student-profile {
    grid-template-columns: 1fr;
  }
  .detail-field-wide {
    grid-column: auto;
  }
  .lane-driver-list { grid-template-columns: 1fr; }
  .changes-panel { width: 100%; height: min(88dvh,760px); margin: 12dvh 0 0; padding: 20px 16px; border-top: 1px solid #304b63; border-left: 0; border-radius: 16px 16px 0 0; }
  .changes-overview { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .change-item { align-items: flex-start; flex-direction: column; gap: 6px; }
  #dashboard {
    padding: 16px;
  }
  .dashboard-heading,
  .comparison-heading,
  .queue-heading {
    align-items: stretch;
    flex-direction: column;
  }
  .dashboard-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .dashboard-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .countdown-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pipeline-filters {
    display: grid;
    grid-template-columns: 1fr;
  }
  .view-controls,
  .view-controls label {
    align-items: stretch;
    display: grid;
    grid-template-columns: 1fr;
  }
  .segmented {
    grid-template-columns: 1fr 1fr;
  }
  .lane-rules-panel {
    padding: 20px;
  }
  .lane-rules-heading {
    display: grid;
  }
  .lane-rules-grid,
  .timeline-rule-list {
    grid-template-columns: 1fr;
  }
  .queue-grid {
    grid-template-columns: 1fr;
  }
  .health-grid {
    grid-template-columns: 1fr;
  }
}

/* Monthly website-only KPI dashboard */
.performance-page { display: grid; gap: 16px; }
.performance-heading { align-items: center; }
.performance-period {
  flex: none;
  padding: 9px 13px;
  border: 1px solid #3b5a70;
  border-radius: 999px;
  background: #14283b;
  color: #6fe4d8;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .04em;
}
.performance-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}
.performance-toolbar label { display: grid; gap: 6px; width: min(330px,100%); color: #9fb7c8; font-size: 11px; font-weight: 700; }
.performance-toolbar select { width: 100%; }
.performance-toolbar p { margin: 0 0 10px; color: #9fb7c8; font-size: 12px; }
.performance-metrics { display: grid; grid-template-columns: repeat(4,minmax(180px,1fr)); gap: 12px; }
.performance-card {
  min-height: 142px;
  padding: 17px;
  border: 1px solid #2d4961;
  border-radius: 11px;
  background: #172a3f;
}
.performance-card-top { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.performance-card-top span { color: #abc1d1; font-size: 12px; font-weight: 700; }
.performance-card-top strong { color: #55dfcf; font-size: 27px; line-height: 1; }
.performance-card > small { display: block; margin: 8px 0 16px; color: #809db2; }
.performance-card progress { width: 100%; height: 7px; accent-color: #47cbbb; }
.performance-card-footer { display: flex; justify-content: space-between; gap: 8px; margin-top: 5px; color: #91adbf; font-size: 10px; }
.performance-breakdown { border: 1px solid #2d4961; border-radius: 11px; background: #112237; overflow: hidden; }
.performance-breakdown > summary { padding: 14px 16px; color: #dce9f2; font-size: 13px; font-weight: 750; cursor: pointer; }
.performance-breakdown .table-scroll { border-top: 1px solid #2d4961; }
.performance-breakdown table { width: 100%; border-collapse: collapse; font-size: 11px; }
.performance-breakdown th,.performance-breakdown td { padding: 10px 12px; border-bottom: 1px solid #263f55; text-align: right; white-space: nowrap; }
.performance-breakdown th:first-child { text-align: left; }
.performance-note { padding: 13px 15px; border-left: 3px solid #48cfbf; border-radius: 7px; background: #10283a; }
.performance-note strong { color: #6fe4d8; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.performance-note p { margin: 5px 0 0; color: #a8bdcc; font-size: 11px; line-height: 1.55; }
body[data-theme="light"] .performance-period,
body[data-theme="light"] .performance-card,
body[data-theme="light"] .performance-breakdown { border-color: #8fa5b3; background: #c2cfd7; }
body[data-theme="light"] .performance-card-top span,
body[data-theme="light"] .performance-toolbar label,
body[data-theme="light"] .performance-toolbar p,
body[data-theme="light"] .performance-card-footer { color: #36556a; }
body[data-theme="light"] .performance-card-top strong,
body[data-theme="light"] .performance-period,
body[data-theme="light"] .performance-note strong { color: #06433f; }
body[data-theme="light"] .performance-card > small { color: #4c687b; }
body[data-theme="light"] .performance-breakdown > summary { color: #112b40; }
body[data-theme="light"] .performance-note { background: #b7c8d1; }
body[data-theme="light"] .performance-note p { color: #27485d; }
@media (max-width: 1000px) { .performance-metrics { grid-template-columns: repeat(2,minmax(170px,1fr)); } }
@media (max-width: 600px) {
  .performance-heading,.performance-toolbar { align-items: stretch; flex-direction: column; }
  .performance-period { align-self: flex-start; }
  .performance-toolbar p { margin: 0; }
  .performance-metrics { grid-template-columns: 1fr; }
  .performance-card { min-height: 125px; }
}

/* Monthly JOA results from the dedicated Salesforce export */
.joa-page { display: grid; gap: 16px; }
.joa-heading {
  align-items: center;
  margin-bottom: 0;
  padding: 16px 18px;
  border: 1px solid #2b4862;
  border-radius: 11px;
  background: #122338;
}
.joa-heading .eyebrow { margin-bottom: 5px; }
.joa-heading h2 { font-size: 22px; }
.joa-heading p:last-child { margin-top: 7px; color: #a9c0d2; font-size: 13px; line-height: 1.45; }
.joa-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.joa-summary-card { display: grid; gap: 7px; padding: 16px 18px; border: 1px solid #2b4862; border-radius: 11px; background: #122338; }
.joa-summary-card span { color: #91aec7; font-size: 12px; font-weight: 700; }
.joa-summary-card strong { color: #59ddce; font-size: 26px; }
.joa-filters { display: grid; grid-template-columns: minmax(240px,1fr) minmax(210px,320px); gap: 10px; }
.joa-count { margin: -4px 0 0; color: #91aec7; font-size: 12px; }
.joa-teams { display: grid; gap: 15px; }
.joa-team { overflow: hidden; border: 1px solid #2b4862; border-radius: 12px; background: #0e1c2c; }
.joa-team-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; background: #172d43; }
.joa-team-heading h3 { margin: 0; color: #f2f7fb; }
.joa-team-heading strong { color: #59ddce; }
.joa-csa-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding: 12px; }
.joa-csa-card { min-width: 0; padding: 15px; border: 1px solid #29445c; border-radius: 10px; background: #14263a; }
.joa-csa-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.joa-csa-heading h4 { margin: 0; color: #eef6fb; font-size: 15px; }
.joa-csa-heading strong { color: #59ddce; font-size: 28px; }
.joa-progress-text { margin: 8px 0; color: #b5c9d9; font-size: 12px; }
.joa-csa-card progress { width: 100%; height: 7px; accent-color: #42cbbb; }
.joa-pace { display: inline-block; margin-top: 9px; padding: 4px 8px; border-radius: 999px; color: #87e7dc; background: #153d42; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.joa-pace.attention { color: #ffd7aa; background: #4a2f1e; }
.joa-records { margin-top: 12px; border-top: 1px solid #29445c; padding-top: 10px; }
.joa-records summary { color: #71ded2; cursor: pointer; font-weight: 750; font-size: 12px; }
.joa-record { display: grid; gap: 3px; margin-top: 8px; padding: 9px 10px; border-radius: 7px; background: #0d1b2a; }
.joa-record strong { color: #edf5fa; font-size: 12px; }
.joa-record span { color: #91aec7; font-size: 11px; line-height: 1.4; }
.joa-definition { padding: 14px 16px; border-left: 3px solid #59ddce; border-radius: 8px; background: #102438; }
.joa-definition strong { color: #eaf5f9; }
.joa-definition p { margin: 5px 0 0; color: #a9c0d2; line-height: 1.5; }

body[data-theme="light"] .joa-heading { border-color: #9eb2bf; background: #d3dde2; }
body[data-theme="light"] .joa-heading p:last-child { color: #49697e; }
body[data-theme="light"] .joa-summary-card,
body[data-theme="light"] .joa-team,
body[data-theme="light"] .joa-csa-card { border-color: #9eb2bf; background: #d3dde2; }
body[data-theme="light"] .joa-team-heading { background: #c2d0d7; }
body[data-theme="light"] .joa-team-heading h3,
body[data-theme="light"] .joa-csa-heading h4,
body[data-theme="light"] .joa-record strong,
body[data-theme="light"] .joa-definition strong { color: #102b3e; }
body[data-theme="light"] .joa-summary-card span,
body[data-theme="light"] .joa-progress-text,
body[data-theme="light"] .joa-count,
body[data-theme="light"] .joa-record span,
body[data-theme="light"] .joa-definition p { color: #49697e; }
/* Deep teal text stays readable on the light JOA cards and team headers. */
body[data-theme="light"] .joa-summary-card strong,
body[data-theme="light"] .joa-team-heading strong,
body[data-theme="light"] .joa-csa-heading strong,
body[data-theme="light"] .joa-records summary { color: #06433f; }
body[data-theme="light"] .joa-records summary:hover,
body[data-theme="light"] .joa-records summary:focus-visible { color: #032d2a; text-decoration: underline; }
body[data-theme="light"] .joa-progress-text,
body[data-theme="light"] .joa-summary-card span,
body[data-theme="light"] .joa-record span { color: #29485b; }
body[data-theme="light"] .joa-record { background: #dfeaf0; }
body[data-theme="light"] .joa-definition { background: #e4eef2; }

@media (max-width: 900px) {
  .joa-csa-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 600px) {
  .joa-summary, .joa-csa-grid, .joa-filters { grid-template-columns: 1fr; }
  .joa-team-heading { align-items: flex-start; }
}

.joa-run-rate {
  margin: 14px 0;
  padding: 18px;
  border: 1px solid #2b5168;
  border-radius: 14px;
  background: radial-gradient(circle at top right,#174753 0,#11263a 40%,#0e1c2c 100%);
  box-shadow: 0 12px 30px #02070d35;
}
.joa-run-rate-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.joa-run-rate-heading .eyebrow,
.joa-run-rate-heading h3,
.joa-run-rate-heading p { margin: 0; }
.joa-run-rate-heading .eyebrow { margin-bottom: 4px; }
.joa-run-rate-heading h3 { color: #f2f7fb; font-size: 21px; }
.joa-run-rate-heading p { margin-top: 5px; }
.joa-run-rate-heading button { flex: none; }
.joa-run-rate-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.joa-run-rate-actions #joa-run-rate-copy { border-color: #4b807c; background: #173e46; color: #82eee2; }
.joa-run-rate-metrics {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 9px;
  margin-top: 15px;
}
.joa-run-rate-metric {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid #2d4d65;
  border-radius: 9px;
  background: #142a3f;
}
.joa-run-rate-metric > span { color: #8daac0; font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.joa-run-rate-metric > strong { color: #59ddce; font-size: 23px; }
.joa-run-rate-metric.status > strong { font-size: 17px; }
.joa-run-rate-metric.status.on-pace > strong,
.joa-run-rate-metric.status.goal-met > strong { color: #75e7b8; }
.joa-run-rate-metric.status.slightly-behind > strong { color: #f1cb76; }
.joa-run-rate-metric.status.behind > strong { color: #ff9d87; }
.joa-run-rate-progress { display: grid; grid-template-columns: minmax(180px,1fr) auto; gap: 14px; align-items: center; margin-top: 12px; }
.joa-run-rate-progress progress { width: 100%; height: 9px; accent-color: #42cbbb; }
.joa-run-rate-progress span { color: #d7e6ee; font-size: 12px; font-weight: 650; }
.joa-run-rate-pace {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  margin-top: 12px;
  border: 1px solid #2d4d65;
  border-radius: 9px;
  overflow: hidden;
}
.joa-run-rate-pace > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 13px; border-right: 1px solid #2d4d65; }
.joa-run-rate-pace > span:last-child { border-right: 0; }
.joa-run-rate-pace small { font-size: 10px; }
.joa-run-rate-pace strong { color: #e9f4f8; font-size: 14px; }
.joa-run-rate-detail { margin-top: 12px; border-top: 1px solid #2d4d65; padding-top: 11px; }
.joa-run-rate-detail > summary { cursor: pointer; color: #71ded2; font-size: 12px; font-weight: 750; }
.joa-run-rate-csas { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 11px; }
.joa-run-rate-csa { padding: 13px; border: 1px solid #2d4d65; border-radius: 9px; background: #122438; }
.joa-run-rate-csa-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.joa-run-rate-csa-heading > strong { color: #eef6fb; font-size: 13px; }
.joa-run-rate-csa-heading .joa-pace { margin-top: 0; white-space: nowrap; }
.joa-pace.goal-met,.joa-pace.on-pace { color: #9cf0c8; background: #16473b; }
.joa-pace.slightly-behind { color: #ffe2a4; background: #4d3d20; }
.joa-pace.behind { color: #ffd1c7; background: #5a2d2b; }
.joa-run-rate-csa-result { display: flex; align-items: baseline; gap: 8px; margin-top: 11px; }
.joa-run-rate-csa-result > strong { color: #59ddce; font-size: 20px; }
.joa-run-rate-csa-result small { font-size: 10px; }
.joa-run-rate-csa-detail { display: grid; grid-template-columns: repeat(5,1fr); gap: 5px; margin-top: 10px; }
.joa-run-rate-csa-detail > span { display: grid; gap: 2px; padding: 7px; border-radius: 6px; background: #0e1d2d; }
.joa-run-rate-csa-detail small { font-size: 8px; line-height: 1.25; }
.joa-run-rate-csa-detail strong { color: #dfebf2; font-size: 11px; }

body[data-theme="light"] .joa-run-rate {
  border-color: #879fac;
  background: radial-gradient(circle at top right,#99c8c6 0,#c0ced6 42%,#b3c2cb 100%);
  box-shadow: 0 12px 28px #29465d25;
}
body[data-theme="light"] .joa-run-rate-heading h3,
body[data-theme="light"] .joa-run-rate-pace strong,
body[data-theme="light"] .joa-run-rate-csa-heading > strong,
body[data-theme="light"] .joa-run-rate-csa-detail strong { color: #0b2236; }
body[data-theme="light"] .joa-run-rate-metric,
body[data-theme="light"] .joa-run-rate-csa { border-color: #91a6b2; background: #ccd7dd; }
body[data-theme="light"] .joa-run-rate-metric > span { color: #38566b; }
body[data-theme="light"] .joa-run-rate-metric > strong,
body[data-theme="light"] .joa-run-rate-csa-result > strong { color: #06433f; }
body[data-theme="light"] .joa-run-rate-pace,
body[data-theme="light"] .joa-run-rate-pace > span,
body[data-theme="light"] .joa-run-rate-detail { border-color: #8fa4b1; }
body[data-theme="light"] .joa-run-rate-progress span { color: #173149; }
body[data-theme="light"] .joa-run-rate-csa-detail > span { background: #b9c8d0; }

@media (max-width: 900px) {
  .joa-run-rate-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .joa-run-rate-csas { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .joa-run-rate { padding: 14px; }
  .joa-run-rate-heading { align-items: stretch; flex-direction: column; }
  .joa-run-rate-actions { align-items: stretch; flex-direction: column; }
  .joa-run-rate-heading button { width: 100%; }
  .joa-run-rate-progress { grid-template-columns: 1fr; }
  .joa-run-rate-pace { grid-template-columns: 1fr; }
  .joa-run-rate-pace > span { border-right: 0; border-bottom: 1px solid #2d4d65; }
  .joa-run-rate-pace > span:last-child { border-bottom: 0; }
  .joa-run-rate-csa-detail { grid-template-columns: repeat(2,1fr); }
}
@media (min-width: 601px) and (max-width: 1200px) {
  .dashboard-metrics { grid-template-columns: repeat(4, minmax(115px, 1fr)); }
  .countdown-summary { grid-template-columns: repeat(3, minmax(110px, 1fr)); }
  .pipeline-filters { grid-template-columns: minmax(260px, 2fr) repeat(3, minmax(140px, 1fr)); }
  .health-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
}
@media print {
  :root { color-scheme: light; background: white; color: #122338; }
  body { background: white; color: #122338; }
  header, #workspace-nav, .dashboard-actions, .pipeline-heading button, .pipeline-filters, .active-filter-strip, .view-controls, .scroll-label, #production-board, #board-empty, footer { display: none !important; }
  main { padding: 0; }
  #dashboard { border: 0; background: white; padding: 0; }
  .metric, .countdown-item, table, th { background: white; color: #122338; border-color: #bbc7d1; }
  .metric strong, .countdown-item strong { color: #087f79; }
  #production-queue { display: block !important; }
  .queue-grid { grid-template-columns: repeat(3, 1fr); }
  .student-card { break-inside: avoid; background: white; color: #122338; border-color: #9baab7; }
}

/* Daily work, student timeline, and trend views */
.today-heading,
.panel-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}
.today-heading {
  margin-bottom: 22px;
}
.today-heading h2,
.today-heading .eyebrow,
.panel-heading h3,
.panel-heading .eyebrow {
  margin: 0;
}
.today-heading .eyebrow,
.panel-heading .eyebrow {
  margin-bottom: 7px;
}
.today-heading p:last-child {
  margin-bottom: 0;
}
.quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(125px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.quick-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 66px;
  padding: 13px 15px;
  text-align: left;
  background: #14283d;
  color: #d8e7f2;
}
.quick-action strong {
  color: #56dfce;
  font-size: 23px;
}
.quick-action:first-child strong {
  color: #ffb188;
}
.today-grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr;
  gap: 14px;
}
.today-panel {
  min-width: 0;
  padding: 18px;
  border: 1px solid #213b52;
  border-radius: 12px;
  background: linear-gradient(145deg, #101e30, #0c1828);
}
.today-urgent {
  border-color: #664a37;
}
.panel-heading {
  min-height: 51px;
  margin-bottom: 13px;
}
.panel-heading button {
  padding: 8px 10px;
  background: #14283d;
  color: #76eadc;
  font-size: 12px;
}
.work-list {
  display: grid;
  gap: 8px;
}
.work-item {
  width: 100%;
  padding: 12px;
  border-color: #29445c;
  background: #142438;
  color: #f2f7fc;
  text-align: left;
  font-weight: 400;
}
.work-item:hover,
.work-item:focus-visible {
  border-color: #56dfce;
  background: #193047;
}
.work-item-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.work-item-heading strong {
  overflow-wrap: anywhere;
}
.work-item small {
  display: block;
  margin-top: 5px;
}
.work-item p {
  display: -webkit-box;
  margin: 8px 0 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #d4e0ea;
  font-size: 12px;
  line-height: 1.4;
}
.empty-work {
  margin: 0;
  padding: 15px 5px;
  font-size: 13px;
}
.csa-summary {
  margin-top: 18px;
  padding: 16px 18px;
  border: 1px solid #213b52;
  border-radius: 12px;
  background: #0d1928;
}
.csa-summary summary {
  cursor: pointer;
  color: #dce9f3;
  font-weight: 750;
}
.csa-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
  gap: 10px;
  margin-top: 15px;
}
.csa-summary-card {
  display: grid;
  gap: 6px;
  padding: 13px;
  background: #142438;
  color: #eff6fb;
  text-align: left;
}
.csa-summary-card > span {
  color: #9fb4c7;
  font-size: 12px;
}
.csa-card-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.csa-card-metrics span {
  padding: 4px 6px;
  border-radius: 5px;
  background: #253b50;
  color: #d4e2ed;
  font-size: 10px;
}
.csa-card-metrics span.critical {
  background: #71343a;
  color: #fff;
}
.detail-actions {
  margin: 15px 0 4px;
}
.detail-save {
  width: 100%;
  background: #17374a;
  color: #74e7d8;
}
.detail-save[aria-pressed="true"] {
  border-color: #e8bd79;
  background: #493820;
  color: #f5d59e;
}
.profile-timeline {
  margin: 25px 0;
}
.timeline-list {
  position: relative;
  display: grid;
  gap: 0;
  margin: 13px 0 0;
  padding: 0;
  list-style: none;
}
.timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 18px 78px 1fr;
  gap: 8px;
  align-items: start;
  min-height: 48px;
  padding: 0 0 13px;
  color: #e7f0f7;
}
.timeline-item:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 14px;
  bottom: -2px;
  left: 6px;
  width: 2px;
  background: #304b63;
}
.timeline-dot {
  position: relative;
  z-index: 1;
  width: 14px;
  height: 14px;
  border: 3px solid #7b91a4;
  border-radius: 50%;
  background: #101e30;
}
.timeline-item[data-tone="complete"] .timeline-dot { border-color: #56dfce; }
.timeline-item[data-tone="warning"] .timeline-dot { border-color: #eed782; }
.timeline-item[data-tone="due"] .timeline-dot { border-color: #e9a674; }
.timeline-item[data-tone="critical"] .timeline-dot { border-color: #ef6570; }
.timeline-item strong {
  font-size: 12px;
}
.timeline-item p {
  margin: -2px 0 0;
  color: #b9ccdb;
  font-size: 12px;
  line-height: 1.4;
}
.trend-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.trend-page {
  max-width: 1900px;
  margin: 0 auto;
}
.trends-heading {
  align-items: center;
  margin-bottom: 16px;
  padding: 23px 25px;
  border: 1px solid #29425a;
  border-radius: 14px;
  background: radial-gradient(circle at top right, #173c4b 0, #101e30 42%, #0c1828 100%);
}
.trends-heading h2 {
  font-size: 28px;
}
.trend-card {
  padding: 16px;
  border: 1px solid #29425a;
  border-radius: 9px;
  background: #142438;
}
.trend-card small {
  display: block;
  margin-top: 8px;
  color: #718ba0;
  font-size: 11px;
}
.trend-table-wrap {
  border-radius: 12px;
  box-shadow: 0 12px 30px #02070d45;
}
.trend-table-wrap table {
  font-size: 13px;
}
.trend-table-wrap th {
  padding-top: 13px;
  padding-bottom: 13px;
  color: #b2c5d5;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.trend-table-wrap tbody tr {
  transition: background 120ms ease;
}
.trend-table-wrap tbody tr:hover {
  background: #152b40;
}
.trend-table-wrap td {
  height: 58px;
}
.trend-name {
  min-width: 220px;
  padding: 0;
}
.trend-open {
  display: grid;
  width: 100%;
  min-height: 57px;
  padding: 10px 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #f2f7fc;
  text-align: left;
}
.trend-open span {
  margin-top: 4px;
  color: #69dacc;
  font-size: 10px;
  font-weight: 650;
  opacity: 0;
  transition: opacity 120ms ease;
}
.trend-open:hover span,
.trend-open:focus-visible span {
  opacity: 1;
}
.trend-value {
  min-width: 120px;
}
.trend-value strong {
  display: inline-block;
  min-width: 34px;
  color: #dce9f3;
  font-size: 14px;
}
.trend-value progress {
  width: clamp(52px, 6vw, 115px);
  height: 7px;
  border: 0;
  border-radius: 999px;
  overflow: hidden;
  background: #263d52;
  vertical-align: middle;
}
.trend-value progress::-webkit-progress-bar { background: #263d52; border-radius: 999px; }
.trend-value progress::-webkit-progress-value { background: #4d8d94; border-radius: 999px; }
.trend-value progress::-moz-progress-bar { background: #4d8d94; border-radius: 999px; }
.trend-value.trend-critical progress::-webkit-progress-value { background: #df6570; }
.trend-value.trend-critical progress::-moz-progress-bar { background: #df6570; }
.trend-value.trend-warning progress::-webkit-progress-value { background: #e8a56f; }
.trend-value.trend-warning progress::-moz-progress-bar { background: #e8a56f; }
.trend-change {
  min-width: 125px;
  font-size: 11px;
  font-weight: 750;
}
.trend-steady { color: #9fb4c7; }
.trend-note {
  padding: 12px 15px;
  border: 1px solid #29425a;
  border-radius: 8px;
  background: #0f1d2e;
}
.trend-card span {
  display: block;
  color: #9fb4c7;
  font-size: 11px;
}
.trend-card strong {
  display: block;
  margin-top: 7px;
  color: #56dfce;
  font-size: 25px;
}
.trend-good { color: #75e7d8; font-weight: 750; }
.trend-watch { color: #ffb188; font-weight: 750; }

body[data-theme="light"] .quick-action,
body[data-theme="light"] .panel-heading button,
body[data-theme="light"] .work-item,
body[data-theme="light"] .csa-summary-card,
body[data-theme="light"] .detail-save,
body[data-theme="light"] .trend-card {
  border-color: #a8bccb;
  background: #dce4e9;
  color: #0b2236;
}
body[data-theme="light"] .trends-heading {
  border-color: #b5c5d0;
  background: radial-gradient(circle at top right, #c5dedf 0, #d7e1e6 45%, #cbd6dd 100%);
}
body[data-theme="light"] .trend-table-wrap {
  box-shadow: 0 10px 24px #29465d1f;
}
body[data-theme="light"] .trend-table-wrap tbody tr:hover {
  background: #d6e6e8;
}
body[data-theme="light"] .trend-open,
body[data-theme="light"] .trend-value strong {
  color: #0b2236;
}
body[data-theme="light"] .trend-open span {
  color: #06433f;
}
body[data-theme="light"] .trend-note {
  border-color: #b5c5d0;
  background: #dce4e9;
}
body[data-theme="light"] .trend-value progress,
body[data-theme="light"] .trend-value progress::-webkit-progress-bar {
  background: #bac8d1;
}
body[data-theme="light"] .today-panel,
body[data-theme="light"] .csa-summary {
  border-color: #8fa2ae;
  background: #c2cfd7;
}
body[data-theme="light"] .quick-action strong,
body[data-theme="light"] .trend-card strong {
  color: #06433f;
}
body[data-theme="light"] .quick-action:first-child strong,
body[data-theme="light"] .trend-watch {
  color: #a7471a;
}
body[data-theme="light"] .work-item p,
body[data-theme="light"] .timeline-item p,
body[data-theme="light"] .trend-card span,
body[data-theme="light"] .csa-summary-card > span {
  color: #304e64;
}
body[data-theme="light"] .csa-summary summary,
body[data-theme="light"] .timeline-item {
  color: #0b2236;
}
body[data-theme="light"] .csa-card-metrics span {
  background: #c3d0d8;
  color: #173149;
}
body[data-theme="light"] .csa-card-metrics span.critical {
  background: #a84751;
  color: #fff;
}
body[data-theme="light"] .timeline-dot {
  background: #cbd6dd;
}
body[data-theme="light"] .detail-save[aria-pressed="true"] {
  border-color: #ad7d36;
  background: #eeddbd;
  color: #5f4011;
}
body[data-theme="light"] .trend-good { color: #06433f; }

@media (max-width: 1000px) {
  .quick-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .today-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  #workspace-nav { overflow-x: auto; padding-bottom: 4px; }
  #workspace-nav button { flex: none; }
  .today-heading,
  .panel-heading { align-items: stretch; flex-direction: column; }
  .quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-action { min-height: 58px; padding: 10px; }
  .today-panel { padding: 14px; }
  .csa-summary-grid,
  .trend-summary { grid-template-columns: 1fr; }
  .timeline-item { grid-template-columns: 18px 68px 1fr; }
  .trend-table-wrap { overflow-x: auto; }
}

/* Administrator preview and compact publication trends */
.preview-banner {
  position: sticky; z-index: 20; top: 8px; display: flex; align-items: center;
  justify-content: space-between; gap: 18px; margin: -14px 0 20px; padding: 12px 15px;
  border: 1px solid #d0a055; border-radius: 10px; background: #352817;
  box-shadow: 0 10px 28px #02070d70;
}
.preview-banner div { display: grid; gap: 3px; }
.preview-banner span { color: #e8bd79; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.preview-banner strong { color: #fff3dc; }
.preview-banner button { padding: 9px 13px; background: #e8bd79; color: #33230d; }
.preview-page { max-width: 1000px; margin: 0 auto; }
.preview-heading { padding: 22px 24px; border: 1px solid #29425a; border-radius: 14px; background: linear-gradient(145deg,#101e30,#0c1828); }
.preview-picker { margin-top: 15px; padding: 20px; border: 1px solid #29425a; border-radius: 12px; background: #101e30; }
.preview-picker > input { width: 100%; margin: 8px 0 14px; }
.preview-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.preview-person { display: flex; justify-content: space-between; gap: 16px; padding: 13px; background: #14283d; color: #edf6fc; text-align: left; }
.preview-person > span { display: grid; gap: 4px; min-width: 0; }
.preview-person small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.preview-person-context { text-align: right; }
.preview-person-context > span { color: #69dacc; font-size: 11px; font-weight: 750; text-transform: uppercase; }
.read-only-chip { display: inline-block; padding: 7px 10px; border: 1px solid #d0a055; border-radius: 999px; color: #f2d29e; font-size: 11px; font-weight: 750; }
.trend-chart-panel { margin-bottom: 16px; padding: 16px 18px 12px; border: 1px solid #29425a; border-radius: 12px; background: #101e30; }
.trend-chart-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.trend-chart-heading .eyebrow, .trend-chart-heading h3 { margin: 0; }
.trend-chart-heading .eyebrow { margin-bottom: 5px; }
.trend-chart-controls { display: flex; flex-wrap: wrap; gap: 6px; }
.trend-chart-choice { padding: 7px 10px; border-color: #34516b; background: #14283d; color: #a9c1d3; font-size: 11px; }
.trend-chart-choice[aria-pressed="true"] { border-color: #56dfce; background: #193c47; color: #75e7d8; }
.trend-chart { min-height: 190px; }
.trend-chart svg { display: block; width: 100%; height: 190px; overflow: visible; }
.trend-axis { stroke: #38536a; stroke-width: 1; }
.trend-line { stroke: #56dfce; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.trend-dot { fill: #0d1928; stroke: #75e7d8; stroke-width: 3; }
.trend-value-label { fill: #e8f2f8; font-size: 11px; font-weight: 750; }
.trend-date-label { fill: #8da6ba; font-size: 10px; }
.trend-chart-empty { display: grid; min-height: 180px; margin: 0; place-items: center; text-align: center; }
body[data-theme="light"] .preview-heading,
body[data-theme="light"] .preview-picker,
body[data-theme="light"] .trend-chart-panel { border-color: #b5c5d0; background: #d4dee4; }
body[data-theme="light"] .preview-person,
body[data-theme="light"] .trend-chart-choice { border-color: #a8bccb; background: #dce4e9; color: #0b2236; }
body[data-theme="light"] .preview-banner { background: #f2e1c4; box-shadow: 0 10px 24px #29465d30; }
body[data-theme="light"] .preview-banner strong { color: #402d12; }
body[data-theme="light"] .read-only-chip { color: #704719; }
body[data-theme="light"] .trend-chart-choice[aria-pressed="true"] { border-color: #087b73; background: #b9dcd9; color: #075f5b; }
body[data-theme="light"] .trend-axis { stroke: #9aafbd; }
body[data-theme="light"] .trend-line { stroke: #078d84; }
body[data-theme="light"] .trend-dot { fill: #d4dee4; stroke: #078d84; }
body[data-theme="light"] .trend-value-label { fill: #0b2236; }
body[data-theme="light"] .trend-date-label { fill: #3c586d; }
@media (max-width: 600px) {
  .preview-results { grid-template-columns: 1fr; }
  .preview-person { flex-direction: column; }
  .preview-person-context { text-align: left; }
  .preview-banner { align-items: stretch; flex-direction: column; }
  .trend-chart-heading { align-items: stretch; flex-direction: column; }
  .trend-chart { overflow-x: auto; }
  .trend-chart svg { min-width: 620px; }
}

/* Role-scoped PG and EVF review */
.compliance-page { max-width: 1900px; margin: 0 auto; }
.compliance-heading { align-items: center; margin-bottom: 15px; padding: 23px 25px; border: 1px solid #29425a; border-radius: 14px; background: radial-gradient(circle at top right,#173c4b 0,#101e30 42%,#0c1828 100%); }
.compliance-heading h2 { font-size: 28px; }
.compliance-tabs {
  display: flex;
  width: fit-content;
  max-width: 100%;
  gap: 4px;
  margin: 0 0 14px;
  padding: 4px;
  border: 1px solid #29425a;
  border-radius: 10px;
  background: #0d1a2a;
}
.compliance-tabs button { border-color: transparent; background: transparent; color: #9eb6c8; }
.compliance-tabs button[aria-selected="true"] { background: #56dfce; color: #082329; }
.compliance-summary { display: grid; grid-template-columns: repeat(6,minmax(120px,1fr)); gap: 9px; margin-bottom: 14px; }
.compliance-summary-card { display: grid; gap: 6px; padding: 13px; background: #142438; color: #9fb4c7; text-align: left; }
.compliance-summary-card strong { color: #56dfce; font-size: 23px; }
.compliance-filters { display: grid; grid-template-columns: minmax(280px,1.7fr) repeat(3,minmax(150px,.7fr)); gap: 9px; margin: 14px 0 6px; }
.compliance-count { margin: 8px 0 13px; font-size: 12px; }
.compliance-list { display: grid; gap: 11px; }
.compliance-record { padding: 17px; border: 1px solid #29425a; border-radius: 11px; background: #101e30; box-shadow: 0 8px 24px #02070d30; }
.compliance-record-heading { display: grid; grid-template-columns: minmax(240px,1fr) auto auto; gap: 13px; align-items: center; }
.compliance-record-heading h3,.compliance-record-heading p { margin: 0; }
.compliance-record-heading p { margin-top: 4px; font-size: 11px; }
.compliance-priority { padding: 7px 11px; border-radius: 999px; background: #30475b; color: #dae8f2; font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.compliance-priority-group { display: grid; justify-items: end; }
.compliance-priority[data-priority="CRITICAL"] { background: #8f2e3b; color: #fff; }
.compliance-priority[data-priority="ACTION REQUIRED"] { background: #8c5428; color: #fff1df; }
.compliance-priority[data-priority="DATA GAP"] { background: #5b427b; color: #f2eaff; }
.compliance-priority[data-priority="MONITOR"] { background: #64552c; color: #fff4c7; }
.compliance-priority[data-priority="COMPLETE"] { background: #18584b; color: #d7fff8; }
.compliance-open { padding: 8px 10px; background: #14283d; color: #75e7d8; font-size: 11px; }
.compliance-status-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-top: 14px; }
.compliance-status { padding: 12px; border: 1px solid #29425a; border-radius: 8px; background: #142438; }
.compliance-status > span,.compliance-follow-up > span,.compliance-priority-explanation > span { display: block; margin-bottom: 5px; color: #75e7d8; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.compliance-status strong { display: block; color: #e9f2f8; font-size: 13px; }
.compliance-status p,.compliance-follow-up p,.compliance-priority-explanation p,.compliance-notes p { margin: 5px 0 0; font-size: 12px; line-height: 1.5; }
.compliance-insights { display: grid; grid-template-columns: 1fr 1fr; margin-top: 9px; border-left: 3px solid #56dfce; border-radius: 5px; background: #10283a; }
.compliance-follow-up,.compliance-priority-explanation { padding: 12px 14px; }
.compliance-priority-explanation { border-left: 1px solid #29425a; }
.compliance-priority-explanation p { color: #e2edf4; font-size: 13px; font-weight: 650; }
.compliance-notes { margin-top: 9px; padding-top: 9px; border-top: 1px solid #29425a; color: #c8d8e4; font-size: 12px; }
.compliance-notes summary { cursor: pointer; color: #75e7d8; font-weight: 700; }
.compliance-more { justify-self: center; min-width: 180px; margin: 5px 0; }
.data-quality-panel { display: grid; gap: 0; }
.data-quality-intro {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 14px;
  padding: 18px 20px;
  border: 1px solid #29425a;
  border-radius: 11px;
  background: #101e30;
}
.data-quality-intro .eyebrow,.data-quality-intro h3,.data-quality-intro p { margin: 0; }
.data-quality-intro .eyebrow { margin-bottom: 4px; }
.data-quality-intro h3 { color: #f1f7fb; font-size: 20px; }
.data-quality-intro input { width: min(360px,42vw); }
.data-quality-summary { display: grid; grid-template-columns: repeat(5,minmax(135px,1fr)); gap: 9px; }
.data-quality-card {
  display: grid;
  min-height: 94px;
  gap: 8px;
  padding: 13px;
  border-color: #29425a;
  background: #142438;
  color: #a8bccd;
  text-align: left;
}
.data-quality-card span { font-size: 11px; line-height: 1.35; }
.data-quality-card strong { align-self: end; color: #56dfce; font-size: 24px; }
.data-quality-card[aria-pressed="true"] { border-color: #56dfce; background: #173342; box-shadow: inset 0 0 0 1px #56dfce; }
.data-quality-list { display: grid; gap: 9px; }
.data-quality-record {
  display: grid;
  grid-template-columns: minmax(200px,.7fr) minmax(300px,1.5fr) auto;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid #29425a;
  border-radius: 10px;
  background: #101e30;
}
.data-quality-identity { display: grid; gap: 4px; min-width: 0; }
.data-quality-identity strong { color: #edf5fa; }
.data-quality-identity small { overflow-wrap: anywhere; }
.data-quality-finding { display: grid; gap: 4px; min-width: 0; padding-left: 14px; border-left: 3px solid #56dfce; }
.data-quality-finding > span { color: #6ee6d8; font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.data-quality-finding > strong { color: #e7f0f6; font-size: 13px; overflow-wrap: anywhere; }
.data-quality-finding p { margin: 0; font-size: 11px; }
body[data-theme="light"] .compliance-heading { border-color: #b5c5d0; background: radial-gradient(circle at top right,#c5dedf 0,#d7e1e6 45%,#cbd6dd 100%); }
body[data-theme="light"] .compliance-summary-card,
body[data-theme="light"] .compliance-record,
body[data-theme="light"] .compliance-status { border-color: #a8bccb; background: #dce4e9; color: #0b2236; }
body[data-theme="light"] .compliance-summary-card strong,
body[data-theme="light"] .compliance-status > span,
body[data-theme="light"] .compliance-follow-up > span,
body[data-theme="light"] .compliance-notes summary { color: #06433f; }
body[data-theme="light"] .compliance-status strong { color: #0b2236; }
body[data-theme="light"] .compliance-insights { background: #cfe0e5; }
body[data-theme="light"] .compliance-priority-explanation { border-color: #afc0cc; }
body[data-theme="light"] .compliance-priority-explanation p { color: #173149; }
body[data-theme="light"] .compliance-notes { border-color: #afc0cc; color: #0b2236; }
body[data-theme="light"] .compliance-tabs { border-color: #8299a8; background: #a9b8c2; }
body[data-theme="light"] .compliance-tabs button { color: #27475c; }
body[data-theme="light"] .compliance-tabs button[aria-selected="true"] { background: #087f78; color: #fff; }
body[data-theme="light"] .data-quality-intro,
body[data-theme="light"] .data-quality-card,
body[data-theme="light"] .data-quality-record { border-color: #a8bccb; background: #d3dde3; color: #0b2236; }
body[data-theme="light"] .data-quality-card[aria-pressed="true"] { border-color: #087f78; background: #c2d9da; box-shadow: inset 0 0 0 1px #087f78; }
body[data-theme="light"] .data-quality-intro h3,
body[data-theme="light"] .data-quality-identity strong,
body[data-theme="light"] .data-quality-finding > strong { color: #0b2236; }
body[data-theme="light"] .data-quality-card strong,
body[data-theme="light"] .data-quality-finding > span { color: #06433f; }
@media (max-width: 1000px) {
  .compliance-summary { grid-template-columns: repeat(3,minmax(120px,1fr)); }
  .compliance-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .data-quality-summary { grid-template-columns: repeat(3,minmax(135px,1fr)); }
  .data-quality-record { grid-template-columns: minmax(180px,.7fr) 1.5fr auto; }
}
@media (max-width: 600px) {
  .compliance-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .compliance-filters,.compliance-status-grid,.compliance-insights { grid-template-columns: 1fr; }
  .compliance-record-heading { grid-template-columns: 1fr auto; }
  .compliance-record-heading > div { grid-column: 1 / -1; }
  .compliance-priority-group { max-width: none; justify-items: start; text-align: left; }
  .compliance-priority-explanation { border-top: 1px solid #29425a; border-left: 0; }
  .compliance-tabs { width: 100%; }
  .compliance-tabs button { flex: 1; }
  .data-quality-intro { align-items: stretch; flex-direction: column; }
  .data-quality-intro input { width: 100%; }
  .data-quality-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .data-quality-record { grid-template-columns: 1fr auto; }
  .data-quality-finding { grid-column: 1 / -1; grid-row: 2; }
}

/* Compact People & access dashboard */
.admin-dashboard-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 14px;
  padding: 22px 24px;
  border: 1px solid #29425a;
  border-radius: 14px;
  background: radial-gradient(circle at top right, #173c4b 0, #101e30 44%, #0c1828 100%);
}
.admin-dashboard-heading .eyebrow,
.admin-dashboard-heading h2,
.admin-dashboard-heading p,
.admin-panel-heading .eyebrow,
.admin-panel-heading h3,
.admin-panel-heading p { margin: 0; }
.admin-dashboard-heading .eyebrow,
.admin-panel-heading .eyebrow { margin-bottom: 5px; }
.admin-dashboard-heading h2 { font-size: 28px; }
.access-overview {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 9px;
  margin-bottom: 14px;
}
.access-metric {
  display: grid;
  gap: 4px;
  min-height: 105px;
  padding: 14px;
  border-color: #29425a;
  background: #142438;
  color: #9fb4c7;
  text-align: left;
}
.access-metric:hover { border-color: #4e8191; background: #182d43; }
.access-metric span { font-size: 11px; font-weight: 750; }
.access-metric strong { color: #56dfce; font-size: 27px; }
.access-metric small { font-size: 10px; }
.access-metric.attention strong { color: #ffb188; }
.access-metric.online strong { color: #75e7d8; }
.account-editor {
  margin-bottom: 14px;
  border: 1px solid #29425a;
  border-radius: 11px;
  background: #101e30;
  overflow: hidden;
}
.account-editor summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px 18px;
  cursor: pointer;
  list-style: none;
}
.account-editor summary::-webkit-details-marker { display: none; }
.account-editor summary > span:first-child { display: grid; gap: 3px; }
.account-editor summary small { color: #56dfce; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.account-editor summary strong { color: #eef6fb; }
.account-editor-action { color: #75e7d8; font-size: 12px; font-weight: 750; }
.account-editor[open] .account-editor-action { font-size: 0; }
.account-editor[open] .account-editor-action::after { content: "Close form"; font-size: 12px; }
.account-editor-body { padding: 0 18px 18px; border-top: 1px solid #29425a; }
.account-editor-body > p { margin: 14px 0; }
.account-editor #account-form { padding: 18px; border: 1px solid #29425a; }
.admin-tabs {
  display: flex;
  gap: 5px;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 10px;
  padding: 4px;
  border: 1px solid #29425a;
  border-radius: 10px;
  background: #0d1a2a;
}
.admin-tabs button {
  padding: 9px 13px;
  border-color: transparent;
  background: transparent;
  color: #9eb6c8;
  white-space: nowrap;
}
.admin-tabs button[aria-selected="true"] { background: #56dfce; color: #082329; }
.admin-tabs button span {
  display: inline-grid;
  min-width: 19px;
  height: 19px;
  margin-left: 5px;
  padding: 0 5px;
  place-items: center;
  border-radius: 999px;
  background: #20374b;
  color: #dce9f2;
  font-size: 10px;
}
.admin-tabs button[aria-selected="true"] span { background: #0b625e; color: #fff; }
.admin-panel {
  min-height: 250px;
  padding: 18px;
  border: 1px solid #29425a;
  border-radius: 12px;
  background: #101e30;
}
.admin-panel-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 12px;
}
.admin-panel-heading h3 { font-size: 19px; }
.admin-panel-heading > button { flex: none; }
.account-search { width: min(360px, 100%); color: #9fb4c7; font-size: 11px; }
.account-search input { width: 100%; padding: 10px; }
.account-list,
#request-list { max-height: 54vh; overflow-y: auto; border: 1px solid #29425a; border-radius: 9px; }
.account-list:empty,
#request-list:empty { display: none; }
.admin-panel .person:last-child { border-bottom: 0; }
.admin-empty { margin: 40px auto; color: #8da6ba; text-align: center; }
#audit-section,
#online-section { margin-top: 0; }
#admin-panel-audit .table-scroll,
#admin-panel-online .table-scroll { max-height: 55vh; overflow: auto; }

body[data-theme="light"] .admin-dashboard-heading {
  border-color: #8fa2ae;
  background: radial-gradient(circle at top right, #9dc7c7 0, #c2cfd7 46%, #b5c3cc 100%);
}
body[data-theme="light"] .access-metric,
body[data-theme="light"] .account-editor,
body[data-theme="light"] .admin-panel {
  border-color: #8fa2ae;
  background: #c2cfd7;
  color: #173149;
}
body[data-theme="light"] .access-metric:hover { border-color: #6f919e; background: #b8c8d1; }
body[data-theme="light"] .access-metric strong,
body[data-theme="light"] .account-editor summary small,
body[data-theme="light"] .account-editor-action { color: #06433f; }
body[data-theme="light"] .access-metric.attention strong { color: #a7471a; }
body[data-theme="light"] .account-editor summary strong { color: #0b2236; }
body[data-theme="light"] .account-editor-body,
body[data-theme="light"] .account-editor #account-form,
body[data-theme="light"] .account-list,
body[data-theme="light"] #request-list { border-color: #91a5b1; }
body[data-theme="light"] .admin-tabs { border-color: #8299a8; background: #a9b8c2; }
body[data-theme="light"] .admin-tabs button { color: #173149; }
body[data-theme="light"] .admin-tabs button[aria-selected="true"] { background: #087f78; color: #fff; }
body[data-theme="light"] .admin-tabs button span { background: #8299a8; color: #fff; }
body[data-theme="light"] .admin-tabs button[aria-selected="true"] span { background: #d5e5e5; color: #075f5b; }
body[data-theme="light"] .account-search { color: #173149; }
body[data-theme="light"] .admin-empty { color: #3c586d; }

@media (max-width: 900px) {
  .access-overview { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
}
@media (max-width: 600px) {
  .admin-dashboard-heading,
  .admin-panel-heading { align-items: stretch; flex-direction: column; }
  .admin-dashboard-heading > button,
  .admin-panel-heading > button { width: 100%; }
  .access-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .access-metric { min-height: 92px; padding: 12px; }
  .admin-tabs { width: 100%; overflow-x: auto; }
  .admin-tabs button { flex: none; }
  .admin-panel { min-height: 220px; padding: 13px; }
  .account-search { width: 100%; }
  .account-editor summary { align-items: flex-start; }
  .account-editor #account-form { padding: 14px; }
  .person button { flex: 1; }
}

/* Text accents on light surfaces must not inherit luminous dark-mode colors. */
body[data-theme="light"] .eyebrow,
body[data-theme="light"] .next-label,
body[data-theme="light"] .changes-heading span,
body[data-theme="light"] .changes-summary strong,
body[data-theme="light"] .changes-all > summary,
body[data-theme="light"] .compliance-priority-explanation > span,
body[data-theme="light"] .trend-open span { color: #06433f; }

/* Depth polish: keep the existing palette, but give the workspace a clearer
   visual hierarchy and a little more feedback as users move through it. */
body:not([data-theme="light"]) #workspace-nav {
  padding: 6px;
  border: 1px solid #1e3449;
  border-radius: 13px;
  background: linear-gradient(135deg, #0d1a2a, #101f31);
  box-shadow: 0 12px 28px #02081255, inset 0 1px #ffffff0a;
}
#workspace-nav button,
.pipeline-filters,
.today-heading,
.dashboard-heading,
.joa-heading,
.trends-heading,
.compliance-heading {
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
#workspace-nav button:hover,
.pipeline-filters input:hover,
.pipeline-filters select:hover,
.today-heading:hover,
.dashboard-heading:hover,
.joa-heading:hover,
.trends-heading:hover,
.compliance-heading:hover {
  border-color: #4a7d91;
  box-shadow: 0 10px 24px #0208123d;
}
#workspace-nav button[aria-current="page"] {
  box-shadow: 0 0 0 3px #56dfce24, 0 8px 20px #02081255;
}
.pipeline-lane,
.today-panel,
.metric,
.joa-summary-card,
.joa-team,
.joa-csa-card,
.compliance-summary,
.data-quality-panel,
.trend-chart-panel,
.dashboard-heading,
.today-heading,
.joa-heading,
.trends-heading,
.compliance-heading {
  box-shadow: 0 12px 28px #0208122e, inset 0 1px #ffffff08;
}
.pipeline-lane {
  background: linear-gradient(160deg, #112238, #0d1a2a 72%);
}
.student-card,
.metric,
.joa-csa-card,
.today-panel,
.compliance-card,
.data-quality-card {
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.student-card:hover,
.metric:hover,
.joa-csa-card:hover,
.today-panel:hover,
.compliance-card:hover,
.data-quality-card:hover {
  transform: translateY(-2px);
  border-color: #4d8992;
  box-shadow: 0 12px 24px #0208124d;
}
.pipeline-lane h3,
.dashboard-heading h2,
.today-heading h2,
.joa-heading h2,
.trends-heading h2,
.compliance-heading h2 {
  text-shadow: 0 1px 14px #56dfce1c;
}
body[data-theme="light"] #workspace-nav {
  padding: 6px;
  border: 1px solid #91a6b3;
  border-radius: 13px;
  background: linear-gradient(135deg, #b8c7cf, #cbd6dc);
  box-shadow: 0 12px 26px #38536a26, inset 0 1px #ffffffbb;
}
body[data-theme="light"] #workspace-nav button[aria-current="page"] {
  box-shadow: 0 0 0 3px #087f7826, 0 8px 18px #38536a2e;
}
body[data-theme="light"] .pipeline-lane,
body[data-theme="light"] .today-panel,
body[data-theme="light"] .metric,
body[data-theme="light"] .joa-summary-card,
body[data-theme="light"] .joa-team,
body[data-theme="light"] .joa-csa-card,
body[data-theme="light"] .compliance-summary,
body[data-theme="light"] .data-quality-panel,
body[data-theme="light"] .trend-chart-panel,
body[data-theme="light"] .dashboard-heading,
body[data-theme="light"] .today-heading,
body[data-theme="light"] .joa-heading,
body[data-theme="light"] .trends-heading,
body[data-theme="light"] .compliance-heading {
  box-shadow: 0 12px 26px #38536a24, inset 0 1px #ffffffa8;
}
body[data-theme="light"] .pipeline-lane {
  background: linear-gradient(160deg, #d4dfe4, #c5d1d8 72%);
}
body[data-theme="light"] .student-card:hover,
body[data-theme="light"] .metric:hover,
body[data-theme="light"] .joa-csa-card:hover,
body[data-theme="light"] .today-panel:hover,
body[data-theme="light"] .compliance-card:hover,
body[data-theme="light"] .data-quality-card:hover {
  border-color: #5b8b99;
  box-shadow: 0 12px 24px #38536a38;
}
body[data-theme="light"] .pipeline-lane h3,
body[data-theme="light"] .dashboard-heading h2,
body[data-theme="light"] .today-heading h2,
body[data-theme="light"] .joa-heading h2,
body[data-theme="light"] .trends-heading h2,
body[data-theme="light"] .compliance-heading h2 {
  text-shadow: 0 1px 10px #ffffff88;
}

/* Compact board filters: keep the high-use controls visible and move the
   larger CWP/ITSA facets into one responsive panel. */
.filter-launch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
}
.filter-launch span {
  display: inline-grid;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  place-items: center;
  border-radius: 999px;
  background: #0b625e;
  color: #fff;
  font-size: 10px;
}
.board-filters-drawer {
  width: min(720px, calc(100vw - 28px));
  max-height: min(760px, calc(100vh - 28px));
  padding: 0;
  border: 1px solid #36566e;
  border-radius: 16px;
  background: #0d1b2b;
  color: #f2f7fc;
  box-shadow: 0 24px 70px #020812b8, inset 0 1px #ffffff12;
}
.board-filters-drawer::backdrop { background: #020812aa; backdrop-filter: blur(3px); }
.board-filters-panel { display: grid; gap: 22px; padding: 24px; }
.board-filters-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.board-filters-heading .eyebrow { margin: 0 0 6px; }
.board-filters-heading h2 { margin: 0; font-size: 25px; }
.board-filters-heading p:last-child { margin: 6px 0 0; font-size: 12px; }
.board-filters-heading > button { flex: none; padding: 8px 11px; background: #172d42; color: #b9d0de; }
.board-filter-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.board-filter-groups label { color: #a9c2d2; font-size: 11px; font-weight: 750; letter-spacing: .04em; }
.board-filter-groups select { width: 100%; margin-top: 6px; background: #14263a; }
.board-filters-actions { display: flex; justify-content: space-between; gap: 10px; padding-top: 4px; border-top: 1px solid #29445c; }
.board-filters-actions button { padding: 9px 13px; }
.board-filters-actions #board-filters-clear { background: transparent; color: #a9c2d2; }
.board-filters-actions .filter-done { margin-left: auto; }
body[data-theme="light"] .filter-launch span { background: #087f78; }
body[data-theme="light"] .board-filters-drawer { border-color: #8fa6b5; background: #cbd7dc; color: #0b2236; box-shadow: 0 24px 70px #38536a55, inset 0 1px #ffffffcc; }
body[data-theme="light"] .board-filters-drawer::backdrop { background: #29485b66; }
body[data-theme="light"] .board-filters-heading > button { border-color: #8fa6b5; background: #dce6ea; color: #173149; }
body[data-theme="light"] .board-filter-groups label { color: #294b60; }
body[data-theme="light"] .board-filter-groups select { border-color: #8fa6b5; background: #dce6ea; color: #0b2236; }
body[data-theme="light"] .board-filters-actions { border-color: #9aadb7; }
body[data-theme="light"] .board-filters-actions #board-filters-clear { color: #294b60; }
@media (max-width: 600px) {
  .board-filter-groups { grid-template-columns: 1fr; gap: 11px; }
  .board-filters-panel { padding: 18px; }
  .board-filters-heading h2 { font-size: 22px; }
}