:root {
  --bg: #070808;
  --bg-lift: #0c0d0e;
  --panel: #121315;
  --panel-soft: #181a1d;
  --panel-strong: #1e2024;
  --ink: #eceff1;
  --muted: #9a9fa6;
  --quiet: #686e76;
  --line: #2b2e34;
  --line-soft: #202329;
  --accent: #aeb6c2;
  --accent-dim: #333944;
  --gold: #b7a36b;
  --plum: #8f849f;
  --slate: #7e8b9d;
  --rust: #b47b65;
  --red: #c98181;
  --blue: #8195ad;
  --shadow: rgba(0, 0, 0, .32);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --fast: 160ms;
  --med: 260ms;
  --radius-tag: 6px;
  --radius-panel: 8px;
}

* { box-sizing: border-box; }

* {
  scrollbar-color: #3b424c #0b0c0d;
  scrollbar-width: thin;
}

*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

*::-webkit-scrollbar-track {
  background: #0b0c0d;
}

*::-webkit-scrollbar-thumb {
  border: 3px solid #0b0c0d;
  border-radius: 999px;
  background: #3b424c;
}

*::-webkit-scrollbar-thumb:hover {
  background: #505966;
}

*::-webkit-scrollbar-corner {
  background: #0b0c0d;
}

@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(7px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes soft-scale {
  from {
    opacity: .88;
    transform: scale(.992);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing: 0;
  overflow-x: hidden;
}

button, input, select { font: inherit; }

button {
  border: 1px solid var(--line);
  background: #202523;
  color: var(--ink);
  border-radius: 6px;
  padding: 8px 11px;
  cursor: pointer;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    color var(--med) var(--ease),
    opacity var(--med) var(--ease),
    transform var(--med) var(--ease);
}

button:hover {
  border-color: #59616c;
  background: #24272c;
  color: #f8fffc;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .22);
  transform: translateY(-1px);
}

button:active {
  transform: translateY(0);
}

button:disabled,
button:disabled:hover {
  cursor: not-allowed;
  opacity: .45;
  box-shadow: none;
  transform: none;
}

.icon-button {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
}

.icon-button .icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition:
    opacity var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.icon-button:hover .icon {
  opacity: .95;
  transform: rotate(38deg);
}

.topbar .icon-button {
  width: 32px;
  height: 32px;
  border-color: #303741;
  background: rgba(255, 255, 255, .035);
}

.topbar .icon-button .icon {
  width: 16px;
  height: 16px;
}

button:focus-visible,
select:focus-visible,
input:focus-visible,
summary:focus-visible {
  outline: none;
  border-color: #8792a0;
  box-shadow: 0 0 0 3px rgba(126, 139, 157, .2);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.app-shell {
  display: grid;
  grid-template-columns: 248px 1fr;
  min-width: 0;
  max-width: 100%;
  min-height: 100vh;
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  color: var(--ink);
  padding: 22px 16px;
  background: rgba(9, 10, 11, .96);
  border-right: 1px solid var(--line);
  box-shadow: 12px 0 34px rgba(0,0,0,.2);
}

.brand {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 24px;
}

.brand-mark {
  width: 42px;
  height: 42px;
  border: 1px solid #343b45;
  border-radius: 50%;
  background: #f6f7f8;
  object-fit: cover;
  padding: 3px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .26);
  transition:
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    filter var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.brand strong { color: #f3f6f4; }
.brand small { display: block; color: var(--muted); margin-top: 2px; }

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

nav button {
  position: relative;
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: center;
  width: 100%;
  min-height: 38px;
  text-align: left;
  color: #c5c9ce;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  transform: none;
}

.nav-icon {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .72;
  transition: opacity var(--med) var(--ease);
}

nav button span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

nav button:hover {
  color: #f8fffc;
  background: rgba(255, 255, 255, .04);
  border-color: transparent;
  box-shadow: none;
  transform: none;
}

nav button.active {
  color: #f8fffc;
  background: rgba(255, 255, 255, .055);
  border-color: transparent;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .018);
}

nav button.active .nav-icon,
nav button:hover .nav-icon {
  opacity: .88;
}

nav button.active .nav-icon {
  opacity: 1;
}

main {
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
  padding: 22px;
}

.topbar {
  display: flex;
  justify-content: flex-start;
  gap: 14px;
  align-items: center;
  margin-bottom: 10px;
  min-height: 40px;
  padding: 6px 0 9px;
  border-bottom: 1px solid var(--line-soft);
  background: transparent;
  box-shadow: none;
  position: relative;
}

.topbar[hidden] {
  display: none !important;
}

.source-block {
  min-width: 0;
  display: grid;
  flex: 1 1 auto;
  gap: 2px;
}

.top-back-button {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  flex: 0 0 auto;
  color: #d5dae0;
  background: rgba(255, 255, 255, .035);
  border-color: #303741;
}

.top-back-button[hidden] {
  display: none;
}

.button-icon {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

h1 { margin: 0; font-size: 18px; line-height: 1.18; color: #f6f9f7; }
h2 { margin: 0; font-size: 19px; color: #f1f5f2; }
h3 { margin: 0 0 10px; font-size: 13px; color: #c1c7d0; text-transform: uppercase; letter-spacing: .06em; }
p { margin: 6px 0 0; color: var(--muted); }

.source-label {
  color: #686e76;
  font-size: 10px;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .06em;
}

#sourceLine {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}

.source-chip {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  max-width: 100%;
  border: 0;
  border-radius: 0;
  padding: 0;
  color: #aeb4bd;
  background: transparent;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.source-file {
  max-width: min(520px, 100%);
  overflow: hidden;
  text-overflow: ellipsis;
  color: #d7dce2;
  font-weight: 600;
}

.source-empty {
  color: var(--muted);
}

.top-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-left: auto;
  flex: 0 0 auto;
}

label {
  position: relative;
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 12px;
}

select, input[type="file"] {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #0b0c0d;
  color: var(--ink);
  padding: 7px 9px;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    color var(--med) var(--ease),
    transform var(--med) var(--ease);
}

select {
  appearance: auto;
  min-width: 150px;
  padding: 8px 10px;
  background: #0b0c0d;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

select:hover {
  border-color: #59616c;
  background-color: #111317;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .18);
}

select:focus, input:focus {
  outline: none;
  border-color: #7c8795;
  box-shadow: 0 0 0 3px rgba(126, 139, 157, .18);
}

input::file-selector-button {
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #1a1c20;
  color: var(--ink);
  padding: 5px 8px;
  margin-right: 8px;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    color var(--med) var(--ease);
}

input::file-selector-button:hover {
  background: #24272c;
  border-color: #59616c;
}

.filter-band {
  display: grid;
  gap: 9px;
  align-content: start;
  background: #101113;
  border: 1px solid #303640;
  border-radius: 8px;
  padding: 9px;
  margin-bottom: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    0 12px 32px var(--shadow);
  transition:
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    background-color var(--med) var(--ease);
}

.filter-band:hover {
  border-color: #3a414c;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .04),
    0 16px 36px rgba(0, 0, 0, .32);
}

.filter-band[hidden] {
  display: none !important;
}

.filter-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 38px;
  border: 1px solid rgba(255, 255, 255, .055);
  border-radius: 7px;
  padding: 7px 8px 7px 10px;
  background: #15171a;
}

.filter-head h2 {
  font-size: 14px;
  line-height: 1.1;
}

.filter-head p {
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.15;
}

.filter-head .icon-button {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  border-color: #303741;
  color: #eceff1;
  background: rgba(255, 255, 255, .035);
}

.filter-head .icon-button:hover {
  border-color: #4b5562;
  background: rgba(255, 255, 255, .055);
  color: #f2f5f8;
}

.filter-head .icon-button .icon {
  width: 16px;
  height: 16px;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(148px, 1fr));
  gap: 8px 9px;
  align-items: end;
}

.filter-grid.all-filters {
  align-items: start;
  border: 1px solid rgba(255, 255, 255, .04);
  border-radius: 7px;
  padding: 10px;
  background: #0b0c0d;
}

.filter-grid.compact {
  grid-template-columns: repeat(4, minmax(130px, 1fr));
}

.filter-field {
  min-width: 0;
  gap: 5px;
  color: #9ca2ab;
  font-size: 11px;
  font-weight: 700;
}

.filter-select {
  position: relative;
  min-width: 0;
}

.filter-select-trigger {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  gap: 8px;
  align-items: center;
  width: 100%;
  min-height: 34px;
  border: 1px solid #2a3038;
  border-radius: 7px;
  padding: 7px 9px;
  color: #e5e9ee;
  background: #0c0e11;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
  text-align: left;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    color var(--med) var(--ease);
}

.filter-select-trigger span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.filter-select-trigger svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: #9ca5b1;
  transition: transform var(--med) var(--ease), color var(--med) var(--ease);
}

.filter-select-trigger:hover {
  border-color: #414a56;
  background: #111419;
  color: #f4f7fa;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
}

.filter-select.open .filter-select-trigger {
  border-color: #6a7481;
  background: #13171d;
  box-shadow: 0 0 0 3px rgba(128, 140, 154, .12);
}

.filter-select.open .filter-select-trigger svg {
  color: #d6dce3;
  transform: rotate(180deg);
}

.filter-select.has-value .filter-select-trigger {
  border-color: #4a5664;
  background: #141820;
}

.filter-select-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 246px;
  overflow-y: auto;
  border: 1px solid #3a424d;
  border-radius: 8px;
  padding: 5px;
  background: #0d0f13;
  box-shadow: 0 18px 34px rgba(0, 0, 0, .45);
}

.filter-select-option {
  display: block;
  width: 100%;
  min-height: 31px;
  border: 0;
  border-radius: 6px;
  padding: 7px 8px;
  color: #d6dce3;
  background: transparent;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: none;
  transform: none;
}

.filter-select-option:hover {
  color: #f4f7fa;
  background: rgba(255, 255, 255, .055);
  box-shadow: none;
  transform: none;
}

.filter-select-option[aria-selected="true"] {
  color: #f4f7fa;
  background: rgba(126, 139, 157, .18);
}

.filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 0;
  border: 1px solid rgba(255, 255, 255, .045);
  border-radius: 7px;
  padding: 7px;
  background: #0b0c0d;
}

.filter-chips[hidden] {
  display: none !important;
}

.filter-chip {
  min-height: 28px;
  border-radius: 999px;
  font-size: 12px;
  color: #dce1e7;
  background: #1b1e23;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    color var(--med) var(--ease),
    opacity var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.filter-chip:hover {
  border-color: #687180;
  background: #242831;
  color: #f7f9fb;
  opacity: .96;
  transform: translateY(-1px);
}

.view { display: none; }
.view.active {
  display: grid;
  gap: 14px;
  min-width: 0;
  max-width: 100%;
  animation: fade-up var(--med) var(--ease) both;
}

.view.active.is-page-loading {
  min-height: 220px;
}

.view.active.is-page-loading > :not(.page-loading-indicator) {
  display: none !important;
  pointer-events: none;
}

.page-loading-indicator {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 14px;
  min-height: 220px;
  border: 1px solid var(--line);
  border-radius: 0;
  background: #eaecef;
  color: #16181d;
  box-shadow: none;
}

.page-loading-spinner {
  width: 42px;
  height: 42px;
  border: 3px solid rgba(22, 24, 29, .16);
  border-top-color: #000;
  border-radius: 999px;
  animation: loading-spin .8s linear infinite;
}

@keyframes loading-spin {
  to { transform: rotate(360deg); }
}

.skeleton-placeholder {
  display: grid;
  gap: 10px;
  width: 100%;
  min-width: 0;
}

.skeleton-line {
  display: block;
  width: var(--skeleton-width, 100%);
  max-width: 100%;
  height: var(--skeleton-height, 13px);
  border-radius: 3px;
  background:
    linear-gradient(90deg, rgba(145, 157, 172, .18) 0%, rgba(145, 157, 172, .38) 45%, rgba(145, 157, 172, .18) 90%)
    0 0 / 220% 100%;
  animation: skeleton-shimmer 1.15s ease-in-out infinite;
}

.skeleton-line-small {
  --skeleton-height: 9px;
  opacity: .78;
}

.skeleton-pill {
  --skeleton-height: 24px;
  border-radius: var(--radius-tag);
}

.skeleton-value {
  --skeleton-height: 16px;
}

.skeleton-track-fill {
  --skeleton-height: 100%;
  border-radius: inherit;
}

@keyframes skeleton-shimmer {
  to { background-position: -220% 0; }
}

.skeleton-progress-card,
.skeleton-contact {
  gap: 12px;
}

.skeleton-progress-row {
  display: grid;
  grid-template-columns: minmax(88px, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.skeleton-progress-track,
.skeleton-funnel-bar {
  height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(145, 157, 172, .14);
}

.skeleton-chart-head,
.skeleton-rate-row {
  display: grid;
  grid-template-columns: minmax(145px, 1.05fr) repeat(var(--skeleton-cols, 2), minmax(120px, 1fr));
  align-items: center;
  gap: 14px;
}

.skeleton-chart-head {
  padding: 0 0 2px;
}

.skeleton-rate-label {
  display: grid;
  gap: 6px;
}

.skeleton-funnel {
  gap: 12px;
}

.skeleton-funnel-step {
  display: grid;
  grid-template-columns: minmax(130px, .7fr) minmax(180px, 1.3fr);
  align-items: center;
  gap: 12px;
}

.skeleton-funnel-step > div:first-child,
.skeleton-action-row > div,
.skeleton-detail-item {
  display: grid;
  gap: 6px;
}

.skeleton-hero-funnel {
  width: 100%;
}

.skeleton-table-row {
  display: grid;
  grid-template-columns: repeat(var(--skeleton-cols, 6), minmax(0, 1fr));
  align-items: center;
  gap: 10px;
  min-height: 34px;
  padding: 8px 10px;
  border: 1px solid rgba(145, 157, 172, .14);
  background: rgba(145, 157, 172, .045);
}

.skeleton-table-head {
  min-height: 28px;
  background: rgba(145, 157, 172, .08);
}

.skeleton-block-map {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.skeleton-block-tile {
  display: grid;
  gap: 7px;
  min-height: 70px;
  border: 1px solid rgba(145, 157, 172, .14);
  border-radius: 6px;
  padding: 10px;
  background: rgba(145, 157, 172, .055);
}

.skeleton-heatmap {
  display: grid;
  grid-template-columns: repeat(var(--skeleton-cols, 5), minmax(42px, 1fr));
  gap: 5px;
}

.skeleton-heatmap-cell {
  min-height: 42px;
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(145, 157, 172, .16) 0%, rgba(145, 157, 172, .34) 45%, rgba(145, 157, 172, .16) 90%)
    0 0 / 220% 100%;
  animation: skeleton-shimmer 1.15s ease-in-out infinite;
}

.skeleton-heatmap-head {
  min-height: 26px;
  opacity: .72;
}

.skeleton-depth-stack {
  display: flex;
  gap: 4px;
  height: 28px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(145, 157, 172, .12);
}

.skeleton-depth-segment {
  --skeleton-height: 100%;
  flex: 0 0 var(--skeleton-width, 20%);
  width: auto;
  border-radius: 0;
}

.skeleton-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  border: 1px solid rgba(145, 157, 172, .14);
  border-radius: 6px;
  padding: 10px;
  background: rgba(145, 157, 172, .045);
}

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

.skeleton-detail-item {
  border: 1px solid rgba(145, 157, 172, .12);
  border-radius: 6px;
  padding: 10px;
  background: rgba(145, 157, 172, .045);
}

table.skeleton-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

table.skeleton-table th,
table.skeleton-table td {
  min-height: 34px;
  padding: 10px;
}

table.skeleton-table th {
  background: rgba(145, 157, 172, .08);
}

@media (prefers-reduced-motion: reduce) {
  .skeleton-line,
  .skeleton-heatmap-cell {
    animation: none;
  }
}

@media (max-width: 860px) {
  .skeleton-chart-head,
  .skeleton-rate-row,
  .skeleton-funnel-step {
    grid-template-columns: 1fr;
  }

  .skeleton-block-map,
  .skeleton-detail-grid {
    grid-template-columns: 1fr;
  }
}

.panel {
  min-width: 0;
  max-width: 100%;
  background: rgba(18, 19, 21, .98);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 16px 44px var(--shadow);
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.panel:hover {
  border-color: #373c45;
  box-shadow: 0 22px 54px rgba(0, 0, 0, .36);
}

.panel-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  min-height: 42px;
  margin: -2px -2px 14px;
  padding: 9px 10px;
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 7px;
  background: rgba(255, 255, 255, .04);
}

.panel-head h2 {
  font-size: 16px;
  line-height: 1.2;
  color: #f4f7fa;
}

.panel-head .status-pill,
.panel-head button {
  flex: 0 0 auto;
}

.upload-row {
  display: flex;
  gap: 10px;
  align-items: center;
  margin: 12px 0;
}

.upload-row input[type="file"],
.upload-row button {
  min-height: 44px;
}

.upload-row .upload-button {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
}

.upload-row input[type="file"] {
  padding: 6px 9px;
}

.upload-row input::file-selector-button {
  min-height: 30px;
}

.snapshot-upload-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}

.snapshot-upload-row label {
  display: grid;
  flex: 0 1 190px;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  min-width: 0;
}

.snapshot-upload-row input[type="file"] {
  width: 100%;
  min-width: 0;
}

.snapshot-upload-row .snapshot-file-field {
  flex: 0 1 290px;
}

.snapshot-upload-row .snapshot-revision-field {
  flex: 0 0 76px;
}

.snapshot-upload-row input[type="file"],
.snapshot-upload-row input[type="number"],
.snapshot-upload-row select {
  box-sizing: border-box;
  width: 100%;
  height: 34px;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 9px;
  font: inherit;
  color: var(--text);
  background: var(--panel);
}

.snapshot-upload-row input[type="file"] {
  padding: 3px 6px;
  font-size: 11px;
}

.snapshot-upload-row input::file-selector-button {
  min-height: 26px;
  margin-right: 8px;
  padding: 0 8px;
  font: inherit;
}

.snapshot-upload-row input[type="number"] {
  width: 100%;
  min-width: 0;
}

.snapshot-upload-row .snapshot-file-field[hidden] {
  display: none;
}



.snapshot-coverage-summary {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  margin: 0 0 0 auto;
}

.snapshot-coverage-summary span {
  white-space: nowrap;
}

.snapshot-coverage-summary span {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 11px;
  color: var(--muted);
  background: rgba(255, 255, 255, .025);
  font-size: 12px;
}

.snapshot-coverage-summary strong {
  color: var(--text);
}

.snapshot-create-button {
  width: auto;
  min-width: 0;
  flex: 0 0 auto;
  height: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  padding: 0 12px;
  gap: 6px;
  font-size: 12px;
  border-radius: 6px;
}

.snapshot-create-button .icon {
  width: 18px;
  height: 18px;
}

@media (max-width: 540px) {
  .snapshot-upload-row label,
  .snapshot-upload-row .snapshot-file-field {
    flex-basis: 100%;
  }

  .snapshot-upload-row .snapshot-revision-field {
    flex-basis: 76px;
  }
}

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 4px 10px;
  color: #d8dfda;
  background: #1b1d21;
  font-size: 12px;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    color var(--med) var(--ease),
    opacity var(--med) var(--ease);
}

.status-pill:hover {
  border-color: #555e69;
  background: #22252b;
  color: #f3f6f8;
}

.callout {
  border-left: 4px solid var(--gold);
  padding: 10px 12px;
  background: rgba(194, 161, 90, .11);
  color: #e8d9b6;
}

.callout.muted {
  border-color: var(--quiet);
  background: rgba(255, 255, 255, .035);
  color: var(--muted);
}

.callout.error {
  border-color: var(--red);
  background: rgba(211, 123, 123, .1);
  color: #f2b3b3;
}

.admin-config-layout {
  display: grid;
  gap: 0;
}

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

.admin-form-full,
.admin-form-actions {
  grid-column: 1 / -1;
}

.admin-form-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.kpi {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px;
  background: #181a1d;
  min-height: 90px;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    filter var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.kpi:hover {
  border-color: #4b535f;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .28);
  filter: brightness(1.04);
  transform: translateY(-2px);
}

.kpi span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.kpi strong {
  display: block;
  margin-top: 8px;
  font-size: 22px;
  color: #f6f9f7;
}

.quality-summary-band {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(0, 2.8fr);
  gap: 14px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 0 0 14px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, .026);
}

.quality-summary-title h2 {
  margin: 0;
  color: #f4f7fa;
  font-size: 17px;
  line-height: 1.2;
}

.quality-summary-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  min-width: 0;
}

.quality-kpi {
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 2px;
  min-width: 0;
  min-height: 52px;
  border-left: 1px solid var(--line-soft);
  padding: 1px 14px;
}

.quality-kpi:first-child {
  border-left: 0;
}

.quality-kpi span {
  color: var(--quiet);
  font-size: 10px;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.quality-kpi strong {
  color: #f7f8f8;
  font-size: 18px;
  line-height: 1.1;
}

.quality-kpi em {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 2px;
  color: rgba(154, 159, 166, .72);
  font-size: 9px;
  font-weight: 500;
  font-style: normal;
  line-height: 1;
  letter-spacing: .01em;
  white-space: nowrap;
}

.quality-kpi i {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 999px;
  background: rgba(110, 116, 124, .72);
  box-shadow: none;
}

.quality-kpi-ok i {
  background: rgba(139, 152, 167, .7);
}

.quality-kpi-warn strong {
  color: #f0d9a4;
}

.quality-kpi-warn i {
  background: rgba(208, 168, 95, .74);
}

.quality-kpi-bad strong {
  color: #eeb4b4;
}

.quality-kpi-bad i {
  background: rgba(199, 125, 125, .76);
}

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

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

.chart-block, .display-card {
  min-width: 0;
  max-width: 100%;
  min-height: 190px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #0d0e10;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    filter var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.chart-block:hover, .display-card:hover {
  border-color: #424954;
  background: #101215;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .3);
  filter: brightness(1.03);
  transform: translateY(-2px);
}

.chart-card-head {
  --chart-head-control-size: 18px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  margin: 0 0 10px;
}

.chart-card-head > h3,
.chart-card-head > h4 {
  min-width: 0;
  margin: 0;
  margin-right: auto !important;
}

.chart-info-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: var(--chart-head-control-size, 18px);
  height: var(--chart-head-control-size, 18px);
  border: 1px solid var(--line);
  border-radius: 50%;
  padding: 0;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  cursor: default;
  transition: border-color var(--fast) var(--ease), color var(--fast) var(--ease), background-color var(--fast) var(--ease);
}

.chart-info-icon:hover,
.chart-info-icon:focus-visible {
  border-color: #8fb4df;
  color: #1f6dbb;
  background: #f3f8ff;
  outline: none;
}

.block-chart-toggle {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: var(--chart-head-control-size, 18px);
  height: var(--chart-head-control-size, 18px);
  border: 1px solid var(--line);
  border-radius: 50%;
  padding: 0;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  transition:
    border-color var(--fast) var(--ease),
    color var(--fast) var(--ease),
    background-color var(--fast) var(--ease);
}

.block-chart-toggle[hidden] {
  display: none;
}

.block-chart-toggle:hover,
.block-chart-toggle:focus-visible {
  border-color: #8fb4df;
  color: #1f6dbb;
  background: #f3f8ff;
  outline: none;
}

.block-chart-toggle-icon {
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-1px) rotate(45deg);
  transition: transform var(--fast) var(--ease);
}

.block-chart-toggle[aria-expanded="true"] .block-chart-toggle-icon {
  transform: translateY(1px) rotate(225deg);
}

.chart-block:has(.heatmap):hover,
.display-card:has(.heatmap):hover {
  border-color: var(--line);
  background: #0d0e10;
  box-shadow: none;
  filter: none;
  transform: none;
}

.chart-block:has(.heatmap),
.display-card:has(.heatmap) {
  align-self: start;
  min-height: 0;
}

.display-card.wide { grid-column: span 2; }
.display-card.full { grid-column: 1 / -1; }

.employment-chart-trio {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
  align-items: start;
}

.employment-chart-trio:not(:has(> .display-card:not([hidden]))) {
  display: none;
}

#employmentDetailShareMajorCard:only-child,
.employment-chart-trio:has(> #employmentDetailTopTitlesCard[hidden]) > #employmentDetailShareMajorCard {
  grid-column: 1 / -1;
}

.display-card.compact-card {
  min-height: 0;
}

.display-card-stack {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.display-card-stack.wide { grid-column: span 2; }

.share-chart .rate-chart-track i {
  background: var(--share-color);
}

.share-chart .rate-chart-row {
  grid-template-columns: minmax(180px, 1.2fr) minmax(95px, 1fr) 42px minmax(95px, 1fr) 42px minmax(95px, 1fr) 42px;
  column-gap: 6px;
}

.share-chart-head {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(95px, 1fr) 42px minmax(95px, 1fr) 42px minmax(95px, 1fr) 42px;
  gap: 6px;
  align-items: end;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.share-chart .rate-chart-value {
  text-align: left;
}

.share-chart .match-track i {
  background: var(--share-color);
}

.share-chart .selected-share-value {
  color: #365c72;
}

.share-chart .match-value {
  color: #6f5a10;
}

.top-match-chart .rate-chart-track i,
.top-internship-chart .rate-chart-track i,
.internship-risk-chart .rate-chart-track i {
  background: var(--share-color);
}

.top-match-chart .rate-chart-row,
.top-match-chart-head,
.top-further-chart .rate-chart-row,
.top-further-chart-head,
.top-internship-chart .rate-chart-row,
.top-internship-chart-head,
.internship-risk-chart .rate-chart-row,
.internship-risk-chart-head {
  display: grid;
  grid-template-columns: minmax(180px, 1.25fr) minmax(110px, 1fr) 48px minmax(110px, 1fr) 48px;
  gap: 6px;
  align-items: center;
}

.top-match-chart.has-sector-column .rate-chart-row,
.top-match-chart.has-sector-column .top-match-chart-head {
  grid-template-columns: minmax(165px, 1.15fr) minmax(94px, .85fr) 48px minmax(94px, .85fr) 48px minmax(128px, max-content);
}

.top-further-chart .rate-chart-row,
.top-further-chart .top-further-chart-head {
  grid-template-columns: minmax(170px, 1.15fr) minmax(0, 1fr) 48px minmax(0, 1fr) 48px minmax(118px, .9fr);
  column-gap: 10px;
}

.top-further-chart.rate-only .rate-chart-row,
.top-further-chart.rate-only .top-further-chart-head {
  grid-template-columns: minmax(170px, 1.15fr) minmax(0, 2fr) 48px;
}

.top-further-chart .top-further-chart-head strong:last-child,
.top-further-chart .sector-majority-tag {
  justify-self: start;
  min-width: 0;
  max-width: 100%;
}

.top-internship-chart .rate-chart-row,
.top-internship-chart .top-internship-chart-head {
  grid-template-columns: minmax(180px, 1.1fr) repeat(3, minmax(96px, .85fr) 54px);
}

.top-internship-chart.has-current-employer .rate-chart-row,
.top-internship-chart.has-current-employer .top-internship-chart-head,
.top-internship-chart.has-satisfaction .rate-chart-row,
.top-internship-chart.has-satisfaction .top-internship-chart-head {
  grid-template-columns: minmax(180px, 1.1fr) repeat(4, minmax(96px, .85fr) 54px);
}

.top-internship-chart.has-satisfaction.has-current-employer .rate-chart-row,
.top-internship-chart.has-satisfaction.has-current-employer .top-internship-chart-head {
  grid-template-columns: minmax(180px, 1.1fr) repeat(5, minmax(84px, .78fr) 54px);
}

.internship-risk-chart .rate-chart-row,
.internship-risk-chart .internship-risk-chart-head {
  grid-template-columns: minmax(180px, 1.1fr) repeat(5, minmax(84px, .78fr) 54px);
}

.internship-risk-reason-panel {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--line-soft);
  background: color-mix(in srgb, var(--panel-soft) 72%, transparent);
}

.internship-risk-reason-head,
.internship-risk-reason-row {
  display: grid;
  grid-template-columns: minmax(180px, .9fr) minmax(120px, 2fr) 52px;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.internship-risk-reason-head {
  padding: 7px 10px;
  border-left: 3px solid #3f8ee8;
  background: #eef5ff;
  color: #243144;
}

.internship-risk-reason-head strong,
.internship-risk-reason-head span {
  font-size: 12px;
  font-weight: 800;
}

.internship-risk-reason-head span {
  justify-self: end;
  color: #526273;
}

.internship-risk-reason-label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 8px;
  min-width: 0;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}

.internship-risk-reason-label strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.internship-risk-reason-label span,
.internship-risk-reason-row b {
  color: var(--muted);
  font-size: 12px;
}

.internship-risk-reason-track {
  height: 10px;
  min-width: 0;
  overflow: hidden;
  border-radius: 999px;
  background: #e7eef5;
}

.internship-risk-reason-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--reason-color);
}

.internship-risk-reason-row b {
  justify-self: end;
}

.top-match-chart-head,
.top-further-chart-head,
.top-internship-chart-head,
.internship-risk-chart-head {
  align-items: end;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.top-match-chart .rate-chart-value,
.top-further-chart .rate-chart-value,
.top-internship-chart .rate-chart-value,
.internship-risk-chart .rate-chart-value {
  text-align: left;
}

.top-match-chart .match-track i {
  background: var(--share-color);
}

.top-match-chart .match-value {
  color: #6f5a10;
}

.top-match-label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.top-match-label strong {
  flex: 0 1 auto;
}

.sector-majority-tag {
  justify-self: start;
  max-width: 168px;
  overflow: hidden;
  border: 1px solid #c8d8ea;
  border-radius: var(--radius-tag);
  padding: 3px 8px;
  background: #f4f8fc;
  color: #365c72;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.share-chart .rate-chart-meta em {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25;
}

.employment-share-chart .rate-chart-track i {
  background: var(--share-color);
}

.employment-share-chart .rate-chart-row,
.employment-share-chart-head {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(110px, 1fr) 48px minmax(110px, 1fr) 48px;
  gap: 6px;
  align-items: center;
}

.employment-share-chart-head {
  align-items: end;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.employment-share-chart .rate-chart-value {
  text-align: left;
}

.employment-share-chart .employment-rate-value {
  color: #365c72;
}

.pg-share-chart .rate-chart-row,
.pg-share-chart .employment-share-chart-head {
  grid-template-columns: minmax(112px, 1fr) repeat(4, minmax(46px, .62fr) 42px);
  gap: 4px;
}

.pg-share-chart .employment-share-chart-head {
  font-size: 9px;
  line-height: 1.05;
}

.pg-share-chart .rate-chart-meta strong {
  font-size: 16px;
}

.pg-share-chart .rate-chart-meta span {
  font-size: 12px;
}

.pg-share-chart .rate-chart-value {
  font-size: 12px;
}

.bar-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) minmax(54px, 1.15fr) minmax(50px, max-content);
  gap: 8px;
  align-items: center;
  margin: 7px 0;
  font-size: 13px;
  border-radius: 5px;
  max-width: 100%;
  min-width: 0;
  transition:
    background-color var(--med) var(--ease),
    opacity var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.bar-rank {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid #303741;
  border-radius: 6px;
  color: #aeb6c2;
  background: #15181c;
  font-size: 10px;
  font-weight: 700;
}

.bar-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #dfe3e7;
  transition: color var(--med) var(--ease);
}

.bar-track {
  height: 10px;
  border-radius: 999px;
  background: #202329;
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  background: var(--blue);
  transition:
    filter var(--med) var(--ease),
    opacity var(--med) var(--ease),
    width 420ms var(--ease);
}

.bar-row:nth-child(2n) .bar-fill { background: var(--slate); }
.bar-row:nth-child(3n) .bar-fill { background: var(--gold); }
.bar-row:nth-child(4n) .bar-fill { background: var(--plum); }
.bar-row:nth-child(5n) .bar-fill { background: var(--rust); }

.bar-value {
  display: grid;
  gap: 2px;
  min-width: 0;
  text-align: right;
}

.bar-value strong {
  color: #e7ebef;
  font-size: 12px;
  line-height: 1;
}

.bar-value span {
  color: #8d959f;
  font-size: 10px;
  line-height: 1;
}

.legend {
  display: grid;
  gap: 6px;
  font-size: 12px;
}

.chart-tooltip {
  position: fixed;
  z-index: 2000;
  max-width: min(280px, calc(100vw - 24px));
  border: 1px solid #49515e;
  border-radius: 7px;
  padding: 7px 9px;
  color: #f4f7fa;
  background: #111419;
  box-shadow: 0 14px 32px rgba(0, 0, 0, .42);
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  opacity: 0;
  pointer-events: auto;
  transform: translateY(4px);
  transition: opacity 160ms var(--ease), transform 160ms var(--ease);
}

.chart-tooltip.is-chart-info-tooltip {
  max-width: min(420px, calc(100vw - 24px));
  width: min(420px, calc(100vw - 24px));
  font-weight: 600;
  line-height: 1.35;
}

.chart-tooltip-text {
  display: block;
  white-space: pre-line;
}

.chart-tooltip.is-chart-info-tooltip .chart-tooltip-text {
  max-height: min(60vh, 420px);
  overflow: auto;
  font-weight: 600;
}

.chart-tooltip.is-alumni-score-tooltip {
  width: min(420px, calc(100vw - 24px));
}

.chart-tooltip.is-alumni-score-guide-tooltip {
  width: min(520px, calc(100vw - 24px));
  max-width: min(520px, calc(100vw - 24px));
  max-height: min(76vh, 640px);
  overflow: auto;
  gap: 9px;
  padding: 11px 12px;
  color: #263442 !important;
}

.alumni-score-guide-heading,
.alumni-score-guide-formula,
.alumni-score-guide-ranking {
  display: grid;
  gap: 3px;
}

.alumni-score-guide-heading > strong {
  font-size: 13px;
  font-weight: 850;
}

.alumni-score-guide-heading > span,
.alumni-score-guide-formula > span,
.alumni-score-guide-ranking > span {
  color: #465565;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
}

.alumni-score-guide-formula,
.alumni-score-guide-ranking {
  padding: 8px;
  border: 1px solid #c4d7eb;
  border-radius: 5px;
  background: #f1f6fb;
}

.alumni-score-guide-formula > strong,
.alumni-score-guide-ranking > strong {
  font-size: 10px;
  font-weight: 850;
}

.alumni-score-guide-measures {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.alumni-score-guide-measures > div {
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border-bottom: 1px solid rgba(127, 144, 160, .28);
}

.alumni-score-guide-measures strong,
.alumni-score-guide-item strong {
  font-size: 10px;
  font-weight: 850;
}

.alumni-score-guide-measures span,
.alumni-score-guide-item p {
  color: #52606d !important;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.35;
}

.alumni-score-guide-expiry {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid #d3dde7;
  border-radius: 5px;
  background: #f8fafc;
}

.alumni-score-guide-expiry-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.alumni-score-guide-expiry-heading > strong {
  font-size: 10px;
  font-weight: 850;
}

.alumni-score-guide-expiry-heading > span,
.alumni-score-guide-expiry > small {
  color: #52606d;
  font-size: 9px;
  font-weight: 600;
}

.alumni-score-guide-expiry-windows {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.alumni-score-guide-expiry-windows > span {
  display: grid;
  gap: 1px;
  padding: 5px 6px;
  border-left: 2px solid #79a6d2;
  color: #52606d;
  background: #ffffff;
  font-size: 9px;
  font-weight: 650;
}

.alumni-score-guide-expiry-windows strong {
  color: #246aa8;
  font-size: 10px;
  font-weight: 850;
}

.alumni-score-guide-expiry > small {
  line-height: 1.35;
}

.alumni-score-guide-components {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 14px;
}

.alumni-score-guide-item {
  min-width: 0;
}

.alumni-score-guide-item > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.alumni-score-guide-item > div > span {
  color: #246aa8;
  font-size: 10px;
  font-weight: 800;
}

.alumni-score-guide-item p {
  margin: 2px 0 0;
}

.alumni-score-guide-ranking em {
  color: #263442;
  font-style: normal;
  font-weight: 750;
}

.alumni-score-guide-note {
  color: #52606d;
  font-size: 10px;
  font-weight: 650;
}

.alumni-tooltip-meta {
  display: flex;
  gap: 18px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(127, 144, 160, .28);
  font-size: 10px;
  font-weight: 600;
}

.alumni-tooltip-meta span {
  display: inline-flex;
  gap: 5px;
  opacity: .82;
}

.alumni-tooltip-meta strong {
  opacity: 1;
  font-weight: 800;
}

.alumni-tooltip-components {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
}

.alumni-tooltip-component {
  min-width: 0;
}

.alumni-tooltip-component-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  margin-bottom: 3px;
  font-size: 9px;
  font-weight: 650;
  line-height: 1.2;
}

.alumni-tooltip-component-heading span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: .82;
}

.alumni-tooltip-component-heading strong {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 850;
}

.alumni-tooltip-component-track {
  overflow: hidden;
  height: 5px;
  border-radius: 999px;
  background: rgba(127, 144, 160, .22);
}

.alumni-tooltip-component-track i {
  display: block;
  min-width: 3px;
  height: 100%;
  border-radius: inherit;
  background: var(--share-color) !important;
}

.alumni-tooltip-component.is-unavailable {
  opacity: .56;
}

.funnel-info-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 8px;
}

.funnel-info-title {
  min-width: 0;
  margin-right: auto;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted, #8b93a0);
}

.chart-tooltip:has(.chart-tooltip-trend) {
  width: min(440px, calc(100vw - 24px));
  max-width: min(440px, calc(100vw - 24px));
}

/* Showing a prediction adds a forecast column to the trend chart, so the card
   widens (animated) to keep the x-axis labels apart. */
.chart-tooltip:has(.chart-tooltip-trend) {
  transition:
    opacity 160ms var(--ease),
    transform 160ms var(--ease),
    width 340ms cubic-bezier(.2, .8, .2, 1),
    max-width 340ms cubic-bezier(.2, .8, .2, 1);
}

.chart-tooltip.is-forecast-wide:has(.chart-tooltip-trend) {
  width: min(580px, calc(100vw - 24px));
  max-width: min(580px, calc(100vw - 24px));
}

.chart-tooltip.is-forecast-resizing {
  transition:
    opacity 160ms var(--ease),
    transform 160ms var(--ease),
    width 340ms cubic-bezier(.2, .8, .2, 1),
    max-width 340ms cubic-bezier(.2, .8, .2, 1),
    left 340ms cubic-bezier(.2, .8, .2, 1),
    top 340ms cubic-bezier(.2, .8, .2, 1);
}

@media (prefers-reduced-motion: reduce) {
  .chart-tooltip:has(.chart-tooltip-trend),
  .chart-tooltip.is-forecast-resizing { transition: opacity 160ms var(--ease); }
  .chart-tooltip-forecast-result { animation: none; }
}

.chart-tooltip-trend {
  display: grid;
  gap: 5px;
  margin-top: 8px;
  border-top: 1px solid color-mix(in srgb, currentColor 24%, transparent);
  padding-top: 8px;
  font-size: 11px;
  font-weight: 600;
}

.chart-tooltip-trend.is-loading,
.chart-tooltip-trend-empty {
  color: color-mix(in srgb, currentColor 72%, transparent);
  font-weight: 500;
}

.chart-tooltip-trend.is-loading span::before {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 6px;
  border: 2px solid color-mix(in srgb, currentColor 28%, transparent);
  border-top-color: currentColor;
  border-radius: 50%;
  vertical-align: -1px;
  content: "";
  animation: chart-tooltip-spin .75s linear infinite;
}

@keyframes chart-tooltip-spin {
  to { transform: rotate(360deg); }
}

.chart-tooltip-trend-head,
.chart-tooltip-trend-change {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.chart-tooltip-trend-head > span:first-child {
  color: color-mix(in srgb, currentColor 68%, transparent);
}

.chart-tooltip-trend-head strong {
  font-size: 13px;
}

.chart-tooltip-trend-values {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.chart-tooltip-trend-values > span {
  display: grid;
  gap: 1px;
  text-align: right;
}

.chart-tooltip-trend-values small {
  color: color-mix(in srgb, currentColor 55%, transparent);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.chart-tooltip-trend-current-value {
  position: relative;
  z-index: 1;
}

.chart-tooltip-trend-svg {
  display: block;
  width: 100%;
  height: 72px;
  overflow: visible;
}

.chart-tooltip-trend-axis {
  fill: none;
  stroke: color-mix(in srgb, currentColor 18%, transparent);
  stroke-width: 1;
}

.chart-tooltip-trend-line {
  fill: none;
  stroke: #4d9bf0;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.chart-tooltip-trend-current-guide {
  fill: none;
  stroke: color-mix(in srgb, #4d9bf0 70%, currentColor);
  stroke-width: 1.25;
  stroke-dasharray: 3 3;
}

.chart-tooltip-forecast-line {
  fill: none;
  stroke: #286ba8;
  stroke-width: 2.5;
  stroke-dasharray: 6 5;
  stroke-linecap: round;
}

.chart-tooltip-trend-svg circle {
  fill: #ffffff;
  stroke: #4d9bf0;
  stroke-width: 2;
}

.chart-tooltip-trend-svg circle.is-current {
  fill: #4d9bf0;
  stroke: #ffffff;
}

.chart-tooltip-trend-svg circle.is-forecast {
  fill: #ffffff;
  stroke: #286ba8;
  stroke-width: 2.5;
}

.chart-tooltip-trend-change {
  border-radius: 5px;
  padding: 4px 6px;
  background: color-mix(in srgb, currentColor 7%, transparent);
}

.chart-tooltip-trend-change.is-positive strong {
  color: #1b9a59;
}

.chart-tooltip-trend-change.is-negative strong {
  color: #df5962;
}

.chart-tooltip-trend-change span {
  color: color-mix(in srgb, currentColor 68%, transparent);
  font-weight: 500;
}

.chart-tooltip-trend-range {
  display: grid;
  grid-template-columns: auto minmax(120px, 1fr) auto;
  align-items: center;
  gap: 9px;
  margin-top: 2px;
  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 7px;
  padding: 6px 8px;
  background: color-mix(in srgb, currentColor 4%, transparent);
}

.chart-tooltip-trend-range.has-forecast {
  grid-template-columns: auto minmax(42px, 1fr) auto minmax(42px, 1fr) auto;
  gap: 5px;
}

.chart-tooltip-trend-endpoint {
  display: grid;
  gap: 1px;
  min-width: 34px;
  line-height: 1;
}

.chart-tooltip-trend-endpoint.is-latest {
  justify-items: end;
  text-align: right;
}

.chart-tooltip-trend-endpoint.is-forecast {
  justify-items: end;
  text-align: right;
}

.chart-tooltip-trend-endpoint small {
  color: color-mix(in srgb, currentColor 55%, transparent);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.chart-tooltip-trend-endpoint strong {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.chart-tooltip-trend-range-track {
  --trend-range-arrow: #9da6b0;
  position: relative;
  display: grid;
  min-width: 0;
  height: 28px;
  place-items: center;
}

.chart-tooltip-trend-range-track i {
  position: absolute;
  top: 50%;
  right: 18px;
  left: 18px;
  height: 2px;
  border-radius: 999px;
  background: var(--trend-range-arrow);
  transform: translateY(-50%);
}

.chart-tooltip-trend-range-track i::before,
.chart-tooltip-trend-range-track i::after {
  position: absolute;
  top: 50%;
  width: 6px;
  height: 6px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  background: #4d9bf0;
  box-shadow: 0 0 0 1px #4d9bf0;
  content: "";
  transform: translateY(-50%);
}

.chart-tooltip-trend-range-track i::before {
  left: -18px;
}

.chart-tooltip-trend-range-track i::after {
  right: -18px;
}

.chart-tooltip-trend-range-track::after {
  position: absolute;
  top: 50%;
  right: 21px;
  width: 7px;
  height: 7px;
  border-top: 2px solid var(--trend-range-arrow);
  border-right: 2px solid var(--trend-range-arrow);
  content: "";
  transform: translateY(-50%) rotate(45deg);
}

.chart-tooltip-trend-range-track.is-forecast i {
  right: 14px;
  left: 14px;
  height: 0;
  border-top: 2px dashed #286ba8;
  background: transparent;
}

.chart-tooltip-trend-range-track.is-forecast i::before {
  left: -14px;
  background: #ffffff;
  box-shadow: 0 0 0 1px #8b97a5;
}

.chart-tooltip-trend-range-track.is-forecast i::after {
  right: -14px;
  background: #ffffff;
  box-shadow: 0 0 0 1px #286ba8;
}

.chart-tooltip-trend-range.has-forecast .chart-tooltip-trend-range-track i {
  right: 14px;
  left: 14px;
}

.chart-tooltip-trend-range.has-forecast .chart-tooltip-trend-range-track i::before {
  left: -14px;
}

.chart-tooltip-trend-range.has-forecast .chart-tooltip-trend-range-track i::after {
  right: -14px;
}

.chart-tooltip-trend-range.has-forecast .chart-tooltip-trend-range-track::after,
.chart-tooltip-trend-range-track.is-forecast::after {
  display: none;
}

.chart-tooltip-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.chart-tooltip-review-button,
.chart-tooltip-forecast-button {
  align-self: flex-start;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 6px;
  padding: 5px 8px;
  color: #ffffff;
  background: rgba(63, 142, 232, .92);
  font: inherit;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
}

.chart-tooltip-review-button:hover,
.chart-tooltip-review-button:focus-visible,
.chart-tooltip-forecast-button:hover,
.chart-tooltip-forecast-button:focus-visible {
  background: #2f78cf;
  outline: none;
}

.chart-tooltip-forecast-controls {
  display: grid;
  gap: 7px;
  margin-top: 0;
  border-top: 1px solid color-mix(in srgb, currentColor 24%, transparent);
  padding-top: 8px;
}

.chart-tooltip-forecast-controls.is-loading > span::before {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 6px;
  border: 2px solid color-mix(in srgb, currentColor 28%, transparent);
  border-top-color: currentColor;
  border-radius: 50%;
  vertical-align: -1px;
  content: "";
  animation: chart-tooltip-spin .75s linear infinite;
}

.chart-tooltip-forecast-controls.is-loading {
  align-content: start;
}

.chart-tooltip-forecast-controls.has-error > span {
  color: #ffd4d8;
}

.chart-tooltip-forecast-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  font-size: 10px;
}

.chart-tooltip-forecast-meta span {
  color: color-mix(in srgb, currentColor 65%, transparent);
}

.chart-tooltip-forecast-result {
  display: grid;
  gap: 8px;
  animation: chart-tooltip-forecast-in 320ms cubic-bezier(.2, .8, .2, 1) both;
}

@keyframes chart-tooltip-forecast-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

.chart-tooltip-forecast-result-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.chart-tooltip-forecast-result-grid span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--chart-forecast-metric-tone, #94a3b8) 24%, transparent);
  border-radius: 12px;
  padding: 9px 11px;
  color: #33465a;
  background: color-mix(in srgb, var(--chart-forecast-metric-tone, #94a3b8) 9%, transparent);
}

.chart-tooltip-forecast-result small,
.chart-tooltip-forecast-summary small {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.chart-tooltip-forecast-result-grid small {
  color: color-mix(in srgb, var(--chart-forecast-metric-tone, #64748b) 70%, #334155);
}

.chart-tooltip-forecast-summary small {
  color: color-mix(in srgb, var(--chart-forecast-summary-tone, #64748b) 64%, #334155);
}

.chart-tooltip-forecast-result-grid strong {
  overflow: hidden;
  font-size: 14px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chart-tooltip-forecast-summary {
  display: grid;
  gap: 3px;
  border: 1px solid color-mix(in srgb, var(--chart-forecast-summary-tone, #94a3b8) 22%, transparent);
  border-radius: 12px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--chart-forecast-summary-tone, #94a3b8) 7%, transparent);
}

.chart-tooltip-forecast-summary p {
  margin: 0;
  color: color-mix(in srgb, currentColor 88%, transparent);
  font-size: 11px;
  line-height: 1.5;
}

.chart-tooltip-forecast-summary-block {
  display: grid;
  gap: 3px;
}

.chart-tooltip-forecast-summary-block + .chart-tooltip-forecast-summary-block {
  margin-top: 6px;
  border-top: 1px solid color-mix(in srgb, var(--chart-forecast-summary-tone, #94a3b8) 20%, transparent);
  padding-top: 8px;
}

.chart-tooltip-forecast-summary-block > b {
  display: flex;
  align-items: center;
  gap: 6px;
  color: color-mix(in srgb, var(--chart-forecast-summary-tone, #64748b) 64%, #334155);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.chart-tooltip-forecast-summary-block > b::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--chart-forecast-summary-tone, #94a3b8);
}

.chart-tooltip-forecast-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.chart-tooltip-forecast-button.is-primary {
  background: rgba(63, 142, 232, .92);
}

.chart-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.chart-tooltip[hidden] {
  display: none !important;
}

.heatmap-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 6px;
  scrollbar-color: #8aa9c9 #e7f1fc;
}

.heatmap {
  --heatmap-row-label-width: 190px;
  display: grid;
  width: 100%;
  min-width: 0;
  gap: 0;
}

.heatmap-row {
  display: grid;
  grid-template-columns: minmax(150px, var(--heatmap-row-label-width)) repeat(var(--cols), minmax(0, 1fr));
  gap: 0;
  align-items: stretch;
}

.heatmap-axis-label, .heatmap-cell {
  min-height: 44px;
  border: 0;
  border-radius: 0;
  padding: 7px 8px;
  font-size: 12px;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    color var(--med) var(--ease),
    filter var(--med) var(--ease),
    opacity var(--med) var(--ease);
}

.heatmap-axis-label {
  display: flex;
  align-items: center;
  color: #dbe2de;
  background: #181a1e;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.heatmap-corner {
  min-height: 54px;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #9fa8b4;
  background: #101215;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.heatmap-column-label {
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 54px;
  padding: 8px 7px 9px;
  color: #eef3f8;
  background: linear-gradient(180deg, #1f2630 0%, #171c24 100%);
  font-weight: 800;
  line-height: 1.12;
  overflow-wrap: break-word;
  word-break: normal;
  white-space: normal;
  hyphens: auto;
}

.heatmap-row-label {
  justify-content: flex-end;
  text-align: right;
  padding-inline: 10px;
  color: #eef3f8;
  background: linear-gradient(90deg, #202733 0%, #171c24 100%);
  font-weight: 800;
  white-space: nowrap;
}

.heatmap-cell {
  display: grid;
  place-items: center;
  color: var(--heatmap-text, #ffffff);
  background: var(--heatmap-fill, #60a076);
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .28);
  cursor: default;
}

.gpa-outcome-heatmap {
  --heatmap-row-label-width: 196px;
  min-width: 780px;
  gap: 0;
  padding: 0;
  background: #ffffff;
}

.gpa-outcome-heatmap .heatmap-row {
  grid-template-columns: minmax(176px, var(--heatmap-row-label-width)) repeat(var(--cols), minmax(128px, 1fr));
  gap: 0;
}

.gpa-outcome-heatmap .heatmap-axis-label,
.gpa-outcome-heatmap .heatmap-cell {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.gpa-outcome-heatmap .heatmap-corner,
.gpa-outcome-heatmap .heatmap-column-label,
.gpa-outcome-heatmap .heatmap-row-label {
  color: #f8fafc;
  background: #303030;
}

.gpa-outcome-heatmap .heatmap-corner {
  color: #f8fafc;
  font-size: 12px;
  letter-spacing: 0;
}

.gpa-outcome-heatmap .heatmap-column-label {
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 64px;
  padding: 10px 12px;
  border: 0;
  color: #f8fafc;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0)),
    #303030;
  font-size: 15px;
  line-height: 1.08;
}

.gpa-outcome-heatmap .heatmap-row-label {
  min-height: 72px;
  justify-content: flex-end;
  text-align: right;
  border: 0;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, 0)),
    #303030;
}

.gpa-outcome-heatmap .heatmap-cell {
  min-height: 72px;
  padding: 10px;
  color: var(--heatmap-text, #ffffff);
  background: var(--heatmap-fill, #60a076);
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .28);
}

.gpa-outcome-heatmap .heatmap-cell strong {
  font-size: 18px;
  line-height: 1;
}

.gpa-heatmap-label {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.gpa-heatmap-label strong,
.gpa-heatmap-label em {
  overflow: hidden;
  text-overflow: ellipsis;
}

.gpa-heatmap-label em {
  color: rgba(248, 250, 252, .82);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.gpa-outcome-heatmap .heatmap-cell-empty {
  color: #66717f;
  background: #e8ecf0;
  text-shadow: none;
}

.gpa-outcome-heatmap .heatmap-cell:not(.heatmap-cell-empty):hover {
  border: 0 !important;
  box-shadow: none;
  filter: none;
  transform: none;
}

@media (max-width: 760px) {
  .heatmap {
    min-width: 720px;
  }
}

.rate-chart {
  min-width: 0;
}

.rate-chart-meta strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rate-chart-meta span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}

.rate-chart {
  display: grid;
  gap: 10px;
}

.rate-chart-row {
  display: grid;
  grid-template-columns: minmax(130px, 1.3fr) minmax(90px, 2fr) 52px;
  gap: 10px;
  align-items: center;
}

.rate-chart-meta {
  min-width: 0;
}

.rate-chart-track {
  position: relative;
  min-width: 0;
  border-radius: 999px;
  background: #e7f0fa;
  overflow: hidden;
}

.rate-chart-track {
  height: 12px;
}

.rate-chart-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2563eb, #0f766e);
}

.rate-chart-value {
  color: var(--ink);
  font-size: 12px;
  text-align: right;
}

.contact-method-chart {
  display: grid;
  gap: 14px;
}

.contact-method-bars {
  display: grid;
  gap: 10px;
}

.contact-method-row {
  display: grid;
  grid-template-columns: minmax(118px, 1.05fr) minmax(72px, 1.5fr) minmax(48px, max-content);
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.contact-method-label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.contact-method-label i,
.contact-depth-legend i {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-radius: 999px;
}

.contact-method-label strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contact-method-track {
  height: 11px;
  min-width: 0;
  border-radius: 999px;
  background: #e7f0fa;
  overflow: hidden;
}

.contact-method-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--contact-color);
}

.contact-method-value {
  display: grid;
  min-width: 0;
  gap: 2px;
  text-align: right;
}

.contact-method-value strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1;
}

.contact-method-value span {
  color: var(--muted);
  font-size: 10px;
  line-height: 1;
}

.contact-depth-panel {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: 10px;
  background: var(--panel-soft);
}

.contact-depth-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--ink);
  font-size: 12px;
}

.contact-depth-head span {
  color: var(--muted);
}

.contact-depth-stack {
  display: flex;
  height: 26px;
  border-radius: 6px;
  overflow: hidden;
  background: #e7f0fa;
}

.contact-depth-stack span {
  display: grid;
  place-items: center;
  min-width: 3px;
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .2);
}

.contact-depth-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  color: var(--muted);
  font-size: 10px;
}

.contact-depth-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.contact-depth-legend b {
  color: var(--ink);
  font-weight: 700;
}

.heatmap-cell-empty {
  background: #e8ecf0;
  color: #66717f;
  text-shadow: none;
}

/* Heatmap cells use shared chart-focus dimming/tooltips only — no lift/scale standout. */
.heatmap-cell:not(.heatmap-cell-empty):hover {
  border: 0;
  box-shadow: none;
  filter: none;
  transform: none;
  cursor: pointer;
}

.table-wrap {
  max-width: 100%;
  overflow-x: auto;
  margin-top: 12px;
}

.worksheet-table-wrap {
  width: 100%;
  max-width: 100%;
  max-height: 560px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: auto;
  overscroll-behavior: contain;
  background: #0d0e10;
}

.worksheet-table-wrap table {
  width: max-content;
  min-width: 4200px;
}

.worksheet-table-wrap th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.worksheet-table-wrap th:first-child,
.worksheet-table-wrap td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
}

.worksheet-table-wrap td:first-child {
  background: #15181c;
  color: #f0f3f6;
  font-weight: 700;
}

.worksheet-table-wrap th:first-child {
  z-index: 3;
}

.worksheet-table-wrap td {
  min-width: 135px;
  white-space: nowrap;
}

.detail-table-wrap {
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior: auto;
  background: #0b0c0d;
}

.detail-table-wrap table {
  min-width: 720px;
}

.missing-fields-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  border: 1px solid rgba(201, 129, 129, .32);
  border-radius: 8px;
  margin: 0 0 14px;
  padding: 12px;
  background: rgba(201, 129, 129, .075);
}

.missing-fields-summary.is-complete {
  border-color: rgba(116, 166, 126, .28);
  background: rgba(68, 128, 82, .09);
}

.missing-fields-summary span {
  display: block;
  color: var(--quiet);
  font-size: 11px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.missing-fields-summary strong {
  display: block;
  margin-top: 5px;
  color: #f4f6f8;
  font-size: 16px;
  line-height: 1.2;
}

.missing-field-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
}

.missing-field-chips span,
.missing-value-badge {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  border: 1px solid rgba(201, 129, 129, .42);
  border-radius: 999px;
  padding: 3px 8px;
  color: #eab2b2;
  background: rgba(201, 129, 129, .13);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-transform: none;
}

.workbook-fields-table .missing-field-row td {
  border-color: rgba(201, 129, 129, .36);
  background: rgba(201, 129, 129, .085);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

th, td {
  border: 1px solid var(--line);
  padding: 8px;
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    color var(--med) var(--ease);
}

th {
  background: #1f2328;
  color: #edf1ee;
  font-weight: 700;
}

td { color: #dce3df; }
tr:nth-child(even) td { background: rgba(255, 255, 255, .025); }
tbody tr:hover td {
  background: rgba(129, 149, 173, .075);
  border-color: #3d4550;
  color: #f2f5f7;
}

tbody tr.is-clickable-row {
  cursor: pointer;
}

tr.selected-row td {
  background: rgba(129, 149, 173, .12);
  border-color: #586273;
}

tbody tr.selected-row:hover td {
  background: rgba(129, 149, 173, .16);
  border-color: #687485;
}

.record-table-pager {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 10px 12px;
  color: var(--muted);
  font-size: 12px;
  overflow-anchor: none;
}

.table-wrap > table {
  overflow-anchor: none;
}

.table-empty-placeholder {
  display: grid;
  min-height: 96px;
  padding: 24px;
  place-items: center;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
}

.record-page-sentinel {
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  pointer-events: none;
}

.record-page-error {
  color: var(--danger);
}

.quality-table th,
.quality-table td {
  padding: 7px 8px;
}

.quality-table th:last-child,
.quality-table td:last-child {
  text-align: right;
}

.table-action {
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 6px;
  font-size: 12px;
  white-space: nowrap;
}

.muted-text {
  color: var(--quiet);
  font-size: 12px;
}

.drilldown-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin: 2px 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: rgba(255, 255, 255, .026);
}

.missing-summary-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.missing-summary-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border: 1px solid rgba(201, 129, 129, .42);
  border-radius: 8px;
  color: var(--red);
  background: rgba(201, 129, 129, .11);
}

.missing-summary-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.missing-summary-copy {
  min-width: 0;
}

.missing-summary-copy span,
.missing-summary-metric span {
  display: block;
  color: var(--quiet);
  font-size: 12px;
  line-height: 1.2;
}

.missing-summary-copy strong {
  display: block;
  margin-top: 6px;
  color: #f4f6f8;
  font-size: 22px;
  line-height: 1.1;
}

.missing-summary-metric {
  min-width: 150px;
  padding-left: 18px;
  border-left: 1px solid var(--line-soft);
  text-align: right;
}

.missing-summary-metric strong {
  display: block;
  margin-top: 6px;
  color: #fff0f0;
  font-size: 26px;
  line-height: 1;
}

.missing-summary-metric em {
  display: block;
  margin-top: 7px;
  color: #c7a0a0;
  font-size: 12px;
  font-style: normal;
  line-height: 1.2;
  white-space: nowrap;
}

.rate-badge {
  display: inline-flex;
  justify-content: center;
  min-width: 64px;
  border: 1px solid transparent;
  border-radius: 9px;
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.rate-good {
  border-color: rgba(116, 166, 126, .42);
  color: #b8d7bd;
  background: rgba(68, 128, 82, .18);
}

.rate-ok {
  border-color: rgba(183, 163, 107, .46);
  color: #e0d1a5;
  background: rgba(183, 163, 107, .14);
}

.rate-watch {
  border-color: rgba(180, 123, 101, .5);
  color: #e1b49f;
  background: rgba(180, 123, 101, .16);
}

.rate-bad {
  border-color: rgba(201, 129, 129, .52);
  color: #eab2b2;
  background: rgba(201, 129, 129, .15);
}

.rate-na {
  border-color: rgba(255, 255, 255, .08);
  color: var(--muted);
  background: rgba(255, 255, 255, .035);
}

.sensitivity-badge {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-transform: capitalize;
}

.format-badge {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 3px 8px;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.format-text {
  color: #adb4bd;
  background: rgba(255, 255, 255, .025);
  border-color: rgba(255, 255, 255, .04);
}

.format-structured {
  color: #d1c9df;
  background: rgba(143, 132, 159, .14);
  border-color: rgba(143, 132, 159, .34);
}

.format-validated {
  color: #bfd2e7;
  background: rgba(129, 149, 173, .15);
  border-color: rgba(129, 149, 173, .4);
  font-weight: 700;
}

.schema-example {
  display: inline-block;
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
  border: 1px solid rgba(255, 255, 255, .04);
  border-radius: 5px;
  padding: 3px 7px;
  color: #cbd1d8;
  background: rgba(255, 255, 255, .025);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  white-space: nowrap;
}

.sensitivity-low {
  border-color: rgba(116, 166, 126, .42);
  color: #b8d7bd;
  background: rgba(68, 128, 82, .18);
}

.sensitivity-moderate {
  border-color: rgba(183, 163, 107, .46);
  color: #e0d1a5;
  background: rgba(183, 163, 107, .14);
}

.sensitivity-note {
  border-color: rgba(180, 123, 101, .5);
  color: #e1b49f;
  background: rgba(180, 123, 101, .16);
}

.sensitivity-alert {
  border-color: rgba(201, 129, 129, .52);
  color: #eab2b2;
  background: rgba(201, 129, 129, .15);
}

.sensitivity-critical {
  border-color: rgba(220, 92, 92, .62);
  color: #f0a0a0;
  background: rgba(220, 92, 92, .18);
}

.detail-pane {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #0d0e10;
  animation: fade-up var(--med) var(--ease) both;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease);
}

.detail-pane:hover {
  border-color: #424954;
  background: #101215;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .26);
}

.record-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  margin: 12px 0;
}

.record-toolbar label {
  flex: 1 1 auto;
  width: 100%;
}

.record-toolbar input {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #0b0c0d;
  color: var(--ink);
  padding: 7px 9px;
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    box-shadow var(--med) var(--ease),
    color var(--med) var(--ease);
}

.record-toolbar input:hover {
  border-color: #59616c;
  background: #111317;
}

.focus-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.focus-header > div {
  min-width: 0;
}

.focus-header strong {
  display: block;
  margin-top: 5px;
  font-size: 22px;
  color: #f4f6f8;
  overflow-wrap: anywhere;
}

.focus-header p {
  overflow-wrap: anywhere;
}

.focus-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-width: 0;
  gap: 12px;
  margin-bottom: 14px;
}

.focus-grid .display-card,
.focus-grid .display-card:hover {
  border-color: var(--line);
  background: #0d0e10;
  box-shadow: none;
  filter: none;
  transform: none;
  transition: none;
}

.focus-grid .fact-list div {
  transition: none;
}

.fact-list {
  display: grid;
  gap: 9px;
}

.fact-list div {
  display: grid;
  gap: 2px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line-soft);
  transition:
    background-color var(--med) var(--ease),
    border-color var(--med) var(--ease),
    transform var(--med) var(--ease);
}

.fact-list div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.fact-list span {
  color: var(--quiet);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.fact-list strong {
  color: #e8ecef;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.fact-list div:hover {
  border-color: #39404a;
  background: rgba(255, 255, 255, .025);
  transform: translateX(2px);
}

.focus-grid .fact-list div:hover {
  border-color: var(--line-soft);
  background: transparent;
  transform: none;
  transition: none;
}

#chat.active {
  min-height: calc(100vh - 44px);
}

@media (max-width: 1120px) {
  .display-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-grid, .filter-grid.compact, .focus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; }
  nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar, .upload-row { flex-direction: column; align-items: stretch; }
  .filter-band,
.filter-grid,
.filter-grid.compact,
.display-grid,
.focus-grid,
.drilldown-summary { grid-template-columns: 1fr; }
  .quality-summary-band { grid-template-columns: 1fr; gap: 10px; }
  .quality-summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 10px; }
  .quality-kpi:nth-child(odd) { border-left: 0; }
  .display-card.wide,
.display-card-stack.wide { grid-column: span 1; }
  .filter-head, .record-toolbar, .focus-header { flex-direction: column; align-items: stretch; }
  #chat.active { min-height: 680px; }
  .missing-fields-summary { grid-template-columns: 1fr; }
  .missing-summary-metric {
    min-width: 0;
    padding-top: 12px;
    padding-left: 0;
    border-top: 1px solid var(--line-soft);
    border-left: 0;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Light blue platform theme */
:root {
  --bg: #f3f8ff;
  --bg-lift: #eaf3fd;
  --panel: #ffffff;
  --panel-soft: #f8fbff;
  --panel-strong: #edf6ff;
  --ink: #10233f;
  --muted: #52657a;
  --quiet: #72849a;
  --line: #cfe0f1;
  --line-soft: #e1ecf7;
  --accent: #2563eb;
  --accent-dim: #dbeafe;
  --gold: #b45309;
  --plum: #7c3aed;
  --slate: #475569;
  --rust: #c2410c;
  --red: #dc2626;
  --blue: #2563eb;
  --shadow: rgba(30, 58, 100, .1);
}

* {
  scrollbar-color: #9fb8d4 #eaf3fd;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner {
  background: #eaf3fd;
}

*::-webkit-scrollbar-thumb {
  border-color: #eaf3fd;
  background: #9fb8d4;
}

*::-webkit-scrollbar-thumb:hover {
  background: #7f9fbe;
}

body {
  color: var(--ink);
  background:
    linear-gradient(180deg, #f8fbff 0%, #eef6ff 44%, #f6faff 100%);
}

button {
  border-color: #bdd2e8;
  background: #ffffff;
  color: #12385f;
  box-shadow: 0 1px 2px rgba(22, 50, 86, .05);
}

button:hover {
  border-color: #7da3cb;
  background: #f1f7ff;
  color: #08233f;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .12);
}

button:focus-visible,
select:focus-visible,
input:focus-visible,
summary:focus-visible {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .16);
}

.sidebar {
  color: #eaf3ff;
  background: linear-gradient(180deg, #09254a 0%, #061b38 100%);
  border-right-color: rgba(179, 205, 235, .22);
  box-shadow: 18px 0 38px rgba(15, 42, 83, .16);
}

.brand-mark {
  border-color: rgba(219, 234, 254, .5);
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(0, 20, 51, .22);
}

.brand strong {
  color: #ffffff;
}

.brand small {
  color: #a8c2df;
}

nav button {
  color: #cfe0f5;
}

nav button:hover {
  color: #ffffff;
  background: rgba(147, 197, 253, .12);
}

nav button.active {
  color: #ffffff;
  background: rgba(147, 197, 253, .18);
  box-shadow: inset 3px 0 0 #7dd3fc, inset 0 0 0 1px rgba(219, 234, 254, .08);
}

main {
  background: transparent;
}

.topbar {
  border-bottom-color: #d9e8f7;
}

.topbar .icon-button,
.top-back-button {
  color: #12385f;
  border-color: #c7daee;
  background: #ffffff;
}

h1,
h2,
.panel-head h2,
.quality-summary-title h2 {
  color: #10233f;
}

h3 {
  color: #40566d;
}

p,
.source-empty {
  color: var(--muted);
}

.source-label,
.quality-kpi span,
.fact-list span,
.missing-fields-summary span {
  color: #72849a;
}

.source-chip {
  color: #53677d;
}

.source-file {
  color: #12385f;
}

select,
input[type="file"] {
  border-color: #c5d8ec;
  background: #ffffff;
  color: #10233f;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

select {
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

select:hover,
select:focus,
input:focus,
input:hover {
  border-color: #84aacf;
  background-color: #f8fbff;
  box-shadow: 0 8px 18px rgba(37, 99, 235, .09);
}

input::file-selector-button {
  border-color: #b7cee6;
  background: #edf6ff;
  color: #12385f;
}

input::file-selector-button:hover {
  border-color: #7da3cb;
  background: #dcebff;
}

.filter-band,
.panel {
  border-color: #d3e3f4;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 18px 40px rgba(26, 63, 112, .1);
}

.filter-band:hover,
.panel:hover {
  border-color: #b8cfe8;
  box-shadow: 0 22px 48px rgba(26, 63, 112, .13);
}

.filter-head,
.panel-head,
.quality-summary-band,
.drilldown-summary {
  border-color: #d8e7f6;
  background: linear-gradient(180deg, #fbfdff 0%, #eef6ff 100%);
}

.filter-head .icon-button {
  border-color: #c5d8ec;
  color: #12385f;
  background: #ffffff;
}

.filter-head .icon-button:hover {
  border-color: #84aacf;
  background: #f1f7ff;
  color: #08233f;
}

.filter-grid.all-filters,
.filter-chips {
  border-color: #ddebf8;
  background: #f8fbff;
}

.filter-field {
  color: #52657a;
}

.filter-select-trigger {
  border-color: #c8dced;
  color: #173b61;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.filter-select-trigger svg {
  color: #64748b;
}

.filter-select-trigger:hover {
  border-color: #8eb3d7;
  background: #f4f9ff;
  color: #10233f;
}

.filter-select.open .filter-select-trigger,
.filter-select.has-value .filter-select-trigger {
  border-color: #2563eb;
  background: #edf6ff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.filter-select.open .filter-select-trigger svg {
  color: #2563eb;
}

.filter-select-menu {
  border-color: #b8cfe8;
  background: #ffffff;
  box-shadow: 0 18px 34px rgba(20, 52, 91, .18);
}

.filter-select-option {
  color: #223f5d;
}

.filter-select-option:hover,
.filter-select-option[aria-selected="true"] {
  color: #10233f;
  background: #edf6ff;
}

.filter-chip,
.status-pill {
  border-color: #b8d4ef;
  color: #12385f;
  background: #eaf4ff;
}

.filter-chip:hover,
.status-pill:hover {
  border-color: #7da3cb;
  background: #dcebff;
  color: #08233f;
}

.panel-head .status-pill {
  background: #e6f5f3;
  border-color: #a8d7d0;
  color: #0f5d56;
}

.callout {
  border-color: var(--gold);
  background: #fff7ed;
  color: #7c2d12;
}

.callout.muted {
  border-color: #90a9c2;
  background: #f4f9ff;
  color: #52657a;
}

.callout.error {
  border-color: #dc2626;
  background: #fef2f2;
  color: #991b1b;
}

.kpi,
.chart-block,
.display-card,
.focus-grid .display-card,
.focus-grid .display-card:hover {
  border-color: #d4e3f3;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.kpi:hover,
.chart-block:hover,
.display-card:hover {
  border-color: #b7cee6;
  background: #fbfdff;
  box-shadow: 0 16px 34px rgba(26, 63, 112, .1);
}

.chart-block:has(.heatmap):hover,
.display-card:has(.heatmap):hover {
  border-color: #d4e3f3;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.kpi span {
  color: #64748b;
}

.kpi strong,
.quality-kpi strong,
.bar-value strong,
.fact-list strong,
.focus-header strong,
.missing-fields-summary strong {
  color: #10233f;
}

.quality-kpi em,
.bar-value span {
  color: #64748b;
}

.quality-kpi {
  border-left-color: #d8e7f6;
}

.quality-kpi i {
  background: #90a9c2;
}

.quality-kpi-ok i {
  background: #0f766e;
}

.quality-kpi-warn strong {
  color: #92400e;
}

.quality-kpi-warn i {
  background: #d97706;
}

.quality-kpi-bad strong {
  color: #b91c1c;
}

.quality-kpi-bad i {
  background: #dc2626;
}

.bar-rank {
  border-color: #d5e4f5;
  color: #52657a;
  background: #f8fbff;
}

.bar-label,
.heatmap-axis-label {
  color: #223f5d;
}

.bar-track {
  border-color: #d8e7f6;
  background: #e7f0fa;
}

.bar-fill {
  background: var(--blue);
}

.bar-row:nth-child(2n) .bar-fill { background: #0f766e; }
.bar-row:nth-child(3n) .bar-fill { background: #b45309; }
.bar-row:nth-child(4n) .bar-fill { background: #7c3aed; }
.bar-row:nth-child(5n) .bar-fill { background: #db2777; }

.chart-tooltip {
  border-color: #0b2a52;
  color: #f8fbff;
  background: #09254a;
  box-shadow: 0 14px 32px rgba(9, 37, 74, .24);
}

.heatmap-axis-label,
.heatmap-cell {
  border: 0;
}

.heatmap-axis-label {
  background: #f1f7ff;
}

.heatmap-corner {
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #55708c;
  background: #eaf4ff;
}

.heatmap-column-label {
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #12385f;
  background: linear-gradient(180deg, #f8fbff 0%, #e7f1fc 100%);
}

.heatmap-row-label {
  justify-content: flex-end;
  text-align: right;
  color: #12385f;
  background: linear-gradient(90deg, #f8fbff 0%, #eaf4ff 100%);
}

.heatmap-cell {
  color: var(--heatmap-text, #ffffff);
  background: var(--heatmap-fill, #60a076);
}

.heatmap-cell-empty {
  background: #e8ecf0;
  color: #66717f;
}

.heatmap-cell:not(.heatmap-cell-empty):hover {
  border: 0;
  box-shadow: none;
  filter: none;
  transform: none;
}

.muted-text {
  color: var(--muted);
}

.worksheet-table-wrap,
.detail-table-wrap {
  border-color: #d4e3f3;
  background: #ffffff;
}

.worksheet-table-wrap td:first-child {
  background: #edf6ff;
  color: #10233f;
}

.missing-fields-summary,
.drilldown-summary .missing-summary-icon,
.missing-summary-icon {
  border-color: rgba(220, 38, 38, .25);
  background: #fff5f5;
}

.missing-fields-summary.is-complete {
  border-color: rgba(15, 118, 110, .28);
  background: #f0fdfa;
}

.missing-field-chips span,
.missing-value-badge {
  border-color: rgba(220, 38, 38, .34);
  color: #b91c1c;
  background: #fee2e2;
}

.workbook-fields-table .missing-field-row td {
  border-color: rgba(220, 38, 38, .24);
  background: #fff5f5;
}

th {
  background: #eaf4ff;
  color: #10233f;
}

td {
  color: #223f5d;
}

tr:nth-child(even) td {
  background: #f8fbff;
}

tbody tr:hover td,
tr.selected-row td,
tbody tr.selected-row:hover td {
  background: #edf6ff;
  border-color: #abc6e4;
  color: #10233f;
}

.sensitivity-badge,
.format-badge,
.schema-example {
  border-color: #d4e3f3;
  background: #f8fbff;
  color: #52657a;
}

.sensitivity-direct,
.sensitivity-note {
  border-color: rgba(220, 38, 38, .36);
  color: #b91c1c;
  background: #fee2e2;
}

.sensitivity-low,
.format-validated {
  border-color: rgba(15, 118, 110, .32);
  color: #0f766e;
  background: #ccfbf1;
}

.format-structured {
  border-color: rgba(180, 83, 9, .32);
  color: #92400e;
  background: #ffedd5;
}

.format-text {
  border-color: rgba(37, 99, 235, .25);
  color: #1d4ed8;
  background: #dbeafe;
}

.fact-list div {
  border-bottom-color: #d8e7f6;
}

.fact-list div:hover {
  border-color: #bdd2e8;
  background: #f8fbff;
}

.message {
  background: #f1f7ff;
  color: #10233f;
}

.message:hover {
  background: #e6f1ff;
  box-shadow: 0 10px 24px rgba(26, 63, 112, .12);
}

.message.user {
  background: #dbeafe;
}

.message.user:hover {
  background: #cfe3ff;
}

/* High-contrast tag and badge text for the light theme */
.source-chip,
.filter-chip,
.status-pill,
.rate-badge,
.sensitivity-badge,
.format-badge,
.missing-field-chips span,
.missing-value-badge {
  font-weight: 700;
}

.source-chip {
  color: #334155;
}

.source-file {
  color: #0f2f56;
}

.filter-chip,
.status-pill {
  color: #0f2f56;
  background: #e8f3ff;
  border-color: #adc9e8;
}

.panel-head .status-pill {
  color: #07534d;
  background: #e2f8f5;
  border-color: #8bcac2;
}

.rate-badge {
  color: #10233f;
  background: #eef6ff;
  border-color: #bed6ef;
}

.rate-good {
  color: #07534d;
  background: #d9f7f2;
  border-color: #82c9bf;
}

.rate-ok {
  color: #7c3d07;
  background: #fff1d6;
  border-color: #f3bf6f;
}

.rate-watch {
  color: #8b2f09;
  background: #ffeadb;
  border-color: #e99a6a;
}

.rate-bad {
  color: #991b1b;
  background: #fee2e2;
  border-color: #f5a6a6;
}

.rate-na {
  color: #475569;
  background: #f1f5f9;
  border-color: #cbd5e1;
}

.sensitivity-badge,
.format-badge {
  color: #10233f;
  background: #f1f7ff;
  border-color: #c7dced;
}

.sensitivity-low {
  color: #07534d;
  background: #d9f7f2;
  border-color: #82c9bf;
}

.sensitivity-moderate {
  color: #7c3d07;
  background: #fff1d6;
  border-color: #f3bf6f;
}

.sensitivity-note {
  color: #8b2f09;
  background: #ffeadb;
  border-color: #e99a6a;
}

.sensitivity-alert,
.sensitivity-critical,
.sensitivity-direct {
  color: #991b1b;
  background: #fee2e2;
  border-color: #f5a6a6;
}

.format-text {
  color: #334155;
  background: #f1f5f9;
  border-color: #cbd5e1;
}

.format-structured {
  color: #5b21b6;
  background: #ede9fe;
  border-color: #c4b5fd;
}

.format-validated {
  color: #1d4ed8;
  background: #dbeafe;
  border-color: #93c5fd;
}

.missing-field-chips span,
.missing-value-badge {
  color: #991b1b;
  background: #fee2e2;
  border-color: #f5a6a6;
}

/* Data quality missing-value drilldown dark theme */
#quality-missing .drilldown-summary {
  border-color: #294f72;
  background: linear-gradient(180deg, #132f4e 0%, #0e243d 100%);
}

#quality-missing .missing-summary-copy span,
#quality-missing .missing-summary-metric span {
  color: #9fb8d4;
}

#quality-missing .missing-summary-copy strong,
#quality-missing .missing-summary-metric strong {
  color: #eef7ff;
}

#quality-missing .missing-summary-metric {
  border-left-color: #1b3858;
}

#quality-missing .missing-summary-metric em {
  color: #fed7aa;
}

#quality-missing .record-toolbar input {
  border-color: #2d5579;
  background: #0a1a2c;
  color: #eef7ff;
}

#quality-missing .record-toolbar input:hover,
#quality-missing .record-toolbar input:focus {
  border-color: #3f8bc1;
  background: #102943;
  box-shadow: 0 8px 18px rgba(0, 8, 22, .28);
}

#quality-missing .detail-pane,
#quality-missing .detail-pane:hover {
  border-color: #244766;
  background: #0a1a2c;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

.heatmap-axis-label {
  border: 0;
  color: #223f5d;
  background: #f1f7ff;
}

.heatmap-corner {
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #64748b;
  background: #eaf4ff;
}

.heatmap-column-label {
  justify-content: center;
  align-items: center;
  text-align: center;
  border: 0;
  color: #10233f;
  background: linear-gradient(180deg, #f8fbff 0%, #eaf4ff 100%);
}

.heatmap-row-label {
  justify-content: flex-end;
  text-align: right;
  border: 0;
  color: #10233f;
  background: linear-gradient(90deg, #f8fbff 0%, #eaf4ff 100%);
}

.heatmap-cell-empty {
  background: #e8ecf0;
  color: #66717f;
}

/* Keep dashboard surfaces static; reserve hover motion for controls and heatmap cells. */
.filter-band:hover,
.panel:hover {
  border-color: #d3e3f4;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 18px 40px rgba(26, 63, 112, .1);
  filter: none;
  transform: none;
}

.kpi:hover,
.chart-block:hover,
.display-card:hover,
.focus-grid .display-card:hover {
  border-color: #d4e3f3;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
  filter: none;
  transform: none;
}

.fact-list div:hover {
  border-color: #d8e7f6;
  background: transparent;
  transform: none;
}

.message:hover {
  background: #f1f7ff;
  box-shadow: none;
  transform: none;
}

.message.user:hover {
  background: #dbeafe;
}

/* Blue field-explorer redesign */
:root {
  --duo-blue: #1cb0f6;
  --duo-blue-dark: #0f63c9;
  --duo-blue-shadow: #0b72b9;
  --duo-navy: #10233f;
  --duo-sky: #e7f6ff;
  --duo-teal: #0f9f8f;
  --duo-amber: #f59e0b;
  --duo-coral: #fb7185;
}

body {
  background:
    radial-gradient(circle at 8% 0%, rgba(28, 176, 246, .16), transparent 28%),
    linear-gradient(180deg, #f8fcff 0%, #eef8ff 48%, #f7fbff 100%);
}

.app-shell {
  grid-template-columns: 286px 1fr;
}

.sidebar {
  overflow-y: auto;
  padding: 20px 14px;
  background: linear-gradient(180deg, #0e67bf 0%, #094a95 52%, #073771 100%);
  border-right: 0;
  box-shadow: 22px 0 42px rgba(15, 66, 120, .16);
}

.brand {
  min-height: 58px;
  margin-bottom: 18px;
  border-radius: 18px;
  padding: 8px;
  background: rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
}

.brand-mark {
  width: 46px;
  height: 46px;
  border-width: 2px;
  border-radius: 15px;
}

nav {
  display: grid;
  gap: 16px;
}

.nav-group {
  display: grid;
  gap: 7px;
}

.nav-group-label {
  display: block;
  padding: 0 10px;
  color: rgba(255, 255, 255, .64);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.field-nav-empty {
  border: 1px dashed rgba(255, 255, 255, .25);
  border-radius: 16px;
  padding: 12px;
  color: rgba(255, 255, 255, .7);
  font-size: 12px;
  line-height: 1.35;
}

nav button {
  min-height: 44px;
  grid-template-columns: 20px minmax(0, 1fr);
  border: 2px solid transparent;
  border-radius: 16px;
  padding: 9px 11px;
  color: #e9f7ff;
  font-weight: 800;
}

nav button:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, .15);
  transform: translateY(-1px);
}

nav button.active {
  color: #063262;
  background: #ffffff;
  border-color: rgba(255, 255, 255, .9);
  box-shadow: 0 5px 0 rgba(8, 52, 104, .28);
}

nav button:active,
nav button.active:active {
  transform: translateY(3px);
  box-shadow: 0 2px 0 rgba(8, 52, 104, .22);
}

.nav-icon {
  width: 19px;
  height: 19px;
  opacity: .95;
}

main {
  padding: 24px;
}

button,
.filter-select-trigger,
.filter-chip,
.status-pill,
.table-action {
  border-width: 2px;
  border-radius: 14px;
  box-shadow: 0 4px 0 rgba(24, 97, 166, .16);
  font-weight: 800;
}

button:hover,
.filter-select-trigger:hover,
.filter-chip:hover,
.status-pill:hover,
.table-action:hover {
  box-shadow: 0 5px 0 rgba(24, 97, 166, .18), 0 12px 24px rgba(28, 176, 246, .12);
  transform: translateY(-1px);
}

button:active,
.filter-select-trigger:active,
.filter-chip:active,
.status-pill:active,
.table-action:active {
  transform: translateY(3px);
  box-shadow: 0 1px 0 rgba(24, 97, 166, .16);
}

.icon-button,
.top-back-button {
  border-radius: 14px;
}

.panel,
.filter-band,
.detail-pane {
  border-width: 2px;
  border-radius: 18px;
  box-shadow: 0 12px 0 rgba(12, 89, 164, .05), 0 22px 46px rgba(26, 97, 170, .1);
}

.panel-head,
.filter-head,
.quality-summary-band,
.drilldown-summary {
  border-width: 2px;
  border-radius: 16px;
}

.filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
}

.filter-select-trigger {
  min-height: 42px;
}

.filter-select-menu {
  border-width: 2px;
  border-radius: 16px;
  padding: 7px;
}

.filter-select-option {
  border-radius: 12px;
  font-weight: 800;
}

.kpi {
  position: relative;
  overflow: hidden;
  border-width: 2px;
  border-radius: 18px;
  padding-bottom: 18px;
}

.kpi::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  height: 7px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, var(--duo-blue), var(--duo-blue-dark)) 0 0 / var(--metric-progress, 100%) 100% no-repeat,
    #dceeff;
}

.kpi:hover {
  border-color: #8cccf5;
  background: #ffffff;
  box-shadow: 0 5px 0 rgba(24, 97, 166, .16), 0 18px 34px rgba(28, 176, 246, .13);
  transform: translateY(-2px);
}

.table-action:hover {
  border-color: #55b9ed;
  background: #153556;
  color: #ffffff;
  box-shadow: 0 5px 0 rgba(2, 18, 38, .58), 0 12px 22px rgba(28, 176, 246, .14);
  transform: translateY(-1px);
}

.chart-block,
.display-card {
  border-width: 2px;
  border-radius: 16px;
}

.chart-block:hover,
.display-card:hover {
  border-color: #c9e0f5;
}

.field-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  gap: 18px;
  align-items: stretch;
  border: 2px solid #a4daf9;
  border-radius: 24px;
  padding: 20px;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .18), transparent 36%),
    linear-gradient(135deg, #1cb0f6 0%, #0f63c9 100%);
  box-shadow: 0 8px 0 #0b72b9, 0 24px 44px rgba(15, 99, 201, .18);
}

.field-hero-copy {
  display: grid;
  align-content: center;
  gap: 8px;
  min-width: 0;
}

.field-kicker {
  width: max-content;
  max-width: 100%;
  border: 2px solid rgba(255, 255, 255, .42);
  border-radius: 999px;
  padding: 5px 10px;
  background: rgba(255, 255, 255, .16);
  color: #e8f8ff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.field-hero h2 {
  color: #ffffff;
  font-size: 34px;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.field-hero p {
  max-width: 780px;
  color: #e7f7ff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
}

.field-stat-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-content: center;
}

.field-stat {
  min-width: 0;
  border: 2px solid rgba(255, 255, 255, .28);
  border-radius: 18px;
  padding: 12px;
  background: rgba(255, 255, 255, .17);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
}

.field-stat span {
  display: block;
  color: rgba(255, 255, 255, .78);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.field-stat strong {
  display: block;
  margin-top: 6px;
  color: #ffffff;
  font-size: 22px;
  line-height: 1;
}

.field-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  border: 2px solid #d1e7fa;
  border-radius: 20px;
  padding: 10px;
  background: #ffffff;
  box-shadow: 0 8px 0 rgba(15, 99, 201, .06);
}

.field-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  border-color: #bee2fa;
  color: #0f4f8f;
  background: #f1f9ff;
}

.field-tab.active {
  border-color: #0f63c9;
  color: #ffffff;
  background: var(--duo-blue);
  box-shadow: 0 5px 0 var(--duo-blue-shadow);
}

.field-tab .button-icon {
  width: 18px;
  height: 18px;
}

.field-tab-panel {
  display: none;
}

.field-tab-panel.active {
  display: grid;
  gap: 14px;
  animation: fade-up var(--med) var(--ease) both;
}

.employment-block-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 12px;
}

.employment-block-grid .display-card {
  min-height: 0;
}

.block-search {
  display: grid;
  width: 100%;
  margin: 8px 0 12px;
  color: #6f86a3;
  font-size: 12px;
  font-weight: 800;
}

.block-search[hidden] {
  display: none;
}

.block-search input {
  width: 100%;
  min-height: 42px;
  border: 1px solid #c7d5e5;
  border-radius: 0;
  background: #ffffff;
  color: #10243a;
  padding: 10px 12px;
  transition: border-color var(--fast) var(--ease), box-shadow var(--fast) var(--ease);
}

.block-search input:hover {
  border-color: #9fb4cf;
  box-shadow: 0 2px 10px rgba(25, 67, 112, 0.08);
}

.block-search input::placeholder {
  color: #8aa0ba;
}

.chart-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin: 0 0 10px;
}

.chart-search input {
  min-width: 0;
  width: 100%;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  padding: 8px 10px;
  color: #263241;
  background: #f8fafc;
  transition: background-color var(--fast) var(--ease), border-color var(--fast) var(--ease);
}

.chart-search input:hover {
  border-color: #cbd5e1;
  background: #ffffff;
  box-shadow: none;
}

.chart-search input:focus {
  border-color: #8798ad;
  background: #ffffff;
  box-shadow: none;
}

.chart-search em {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.chart-search-results {
  min-width: 0;
}

.block-map-section {
  display: grid;
  gap: 8px;
}

.block-map-section + .block-map-section {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(51, 65, 85, .14);
}

.block-map-section h4 {
  margin: 0;
  color: #24466c;
  font-size: 13px;
  font-weight: 900;
}

.block-map-section[hidden] {
  display: none;
}

.duo-block-chart {
  position: relative;
  width: 100%;
  min-height: 440px;
  border-radius: 10px;
  overflow: hidden;
  background: #071827;
}

.duo-block-note {
  margin-top: 10px;
  color: #9fb8d4;
  font-size: 12px;
  font-weight: 800;
}

.duo-block-tile {
  position: absolute;
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) auto;
  align-content: stretch;
  gap: 5px;
  border: 3px solid #071827;
  border-radius: 8px;
  padding: 9px;
  overflow: hidden;
  color: #ffffff;
  background: var(--tile-color);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
}

.duo-block-tile strong {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  color: #ffffff;
  font-size: 13px;
  line-height: 1.12;
  overflow: hidden;
  overflow-wrap: anywhere;
  min-height: 0;
}

.duo-block-tile span {
  color: rgba(255, 255, 255, .86);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
}

.duo-block-large strong {
  font-size: 22px;
}

.duo-block-large span {
  font-size: 16px;
}

.field-records-panel {
  margin-top: 12px;
  border: 2px solid #d4e9fa;
  border-radius: 18px;
  padding: 12px;
  background: #f8fcff;
}

.record-table-panel-head {
  margin-bottom: 0 !important;
}

.record-table-panel-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
}

.panel-actions .status-pill,
.record-table-panel-actions .status-pill {
  pointer-events: none;
  transition: none;
}

.record-table-toggle {
  width: 28px;
  height: 28px;
}

.record-table-panel-body {
  margin-top: 10px;
}

.record-table-panel-body[hidden] {
  display: none !important;
}

.record-toolbar input {
  border-width: 2px;
  border-radius: 14px;
}

th,
td {
  border-color: #d6e7f7;
}

th {
  border-bottom-width: 2px;
}

.heatmap-axis-label,
.heatmap-cell {
  border: 0;
  border-radius: 0;
}

.bar-fill,
.rate-chart-track i,
.contact-method-track span {
  background: linear-gradient(90deg, var(--duo-blue), var(--duo-blue-dark));
}

.bar-row:nth-child(2n) .bar-fill { background: var(--duo-teal); }
.bar-row:nth-child(3n) .bar-fill { background: var(--duo-amber); }
.bar-row:nth-child(4n) .bar-fill { background: #7c3aed; }
.bar-row:nth-child(5n) .bar-fill { background: var(--duo-coral); }

@media (max-width: 1120px) {
  .field-hero {
    grid-template-columns: 1fr;
  }

  .employment-block-grid {
    grid-template-columns: 1fr;
  }

  .duo-block-chart {
    min-height: 380px;
  }

  .field-stat-strip {
    grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
  }

}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: sticky;
    top: 0;
    z-index: 90;
    height: auto;
    max-height: 58vh;
    border-bottom: 2px solid rgba(255, 255, 255, .16);
  }

  nav,
.nav-group {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 7px;
  }

  .nav-group {
    flex-direction: column;
    overflow: visible;
  }

  .nav-group-label {
    padding-left: 4px;
  }

  nav button {
    flex: 0 0 auto;
    width: max-content;
    max-width: min(260px, 80vw);
  }

  main {
    padding: 16px;
  }

  .field-hero {
    border-radius: 20px;
    padding: 16px;
  }

  .field-hero h2 {
    font-size: 28px;
  }

  .field-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .field-tab {
    flex: 0 0 auto;
  }
}

@media (max-width: 640px) {
  .duo-block-chart {
    min-height: 320px;
  }

  .field-stat-strip,
.filter-grid {
    grid-template-columns: 1fr;
  }

  .field-hero h2 {
    font-size: 24px;
  }
}

/* Dark blue field-explorer theme */
:root {
  --bg: #07111f;
  --bg-lift: #0b1c32;
  --panel: #0f2239;
  --panel-soft: #132b47;
  --panel-strong: #18395d;
  --ink: #eef7ff;
  --muted: #9fb8d4;
  --quiet: #6f8dac;
  --line: #254768;
  --line-soft: #1b3858;
  --accent: #1cb0f6;
  --accent-dim: #0d3d66;
  --gold: #f59e0b;
  --plum: #8b5cf6;
  --slate: #78a6cf;
  --rust: #fb923c;
  --red: #fb7185;
  --blue: #1cb0f6;
  --shadow: rgba(0, 8, 22, .38);
  --duo-blue: #1cb0f6;
  --duo-blue-dark: #0f63c9;
  --duo-blue-shadow: #064c86;
  --duo-navy: #07111f;
  --duo-sky: #102d4a;
  --duo-teal: #19c2b0;
  --duo-amber: #fbbf24;
  --duo-coral: #fb7185;
}

* {
  scrollbar-color: #2c5c86 #081626;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner {
  background: #081626;
}

*::-webkit-scrollbar-thumb {
  border-color: #081626;
  background: #2c5c86;
}

*::-webkit-scrollbar-thumb:hover {
  background: #3b78aa;
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at 10% -10%, rgba(28, 176, 246, .2), transparent 32%),
    radial-gradient(circle at 86% 4%, rgba(25, 194, 176, .12), transparent 24%),
    linear-gradient(180deg, #07111f 0%, #0a192b 48%, #07111f 100%);
}

button {
  border-color: #2f5c84;
  background: #102943;
  color: #e7f6ff;
  box-shadow: 0 4px 0 rgba(2, 18, 38, .7);
}

button:hover {
  border-color: #3f8bc1;
  background: #153556;
  color: #ffffff;
  box-shadow: 0 5px 0 rgba(2, 18, 38, .72), 0 14px 28px rgba(28, 176, 246, .14);
}

button:focus-visible,
select:focus-visible,
input:focus-visible,
summary:focus-visible {
  border-color: var(--duo-blue);
  box-shadow: 0 0 0 3px rgba(28, 176, 246, .24);
}

.sidebar {
  color: #eaf7ff;
  background:
    linear-gradient(180deg, rgba(28, 176, 246, .16), transparent 28%),
    linear-gradient(180deg, #0b3159 0%, #071f3b 54%, #06182d 100%);
  box-shadow: 22px 0 46px rgba(0, 8, 22, .34);
}

.brand {
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 6px 0 rgba(0, 12, 30, .2);
}

.brand strong {
  color: #ffffff;
}

.brand small,
.nav-group-label {
  color: #9bd6ff;
}

nav button {
  color: #cfeeff;
}

nav button:hover {
  color: #ffffff;
  background: rgba(28, 176, 246, .18);
}

nav button.active {
  color: #ffffff;
  background: linear-gradient(180deg, #1cb0f6 0%, #0f79d0 100%);
  border-color: #7dd3fc;
  box-shadow: 0 5px 0 #064c86, 0 14px 26px rgba(28, 176, 246, .18);
}

.field-nav-empty {
  border-color: rgba(125, 211, 252, .3);
  color: #a8dfff;
  background: rgba(255, 255, 255, .035);
}

.topbar {
  border-bottom-color: #173352;
}

.topbar .icon-button,
.top-back-button {
  color: #dff4ff;
  border-color: #2f5c84;
  background: #102943;
}

h1,
h2,
.panel-head h2,
.quality-summary-title h2 {
  color: #f4fbff;
}

h3 {
  color: #b6d1ea;
}

p,
.source-empty,
.muted-text {
  color: var(--muted);
}

.source-label,
.quality-kpi span,
.fact-list span,
.missing-fields-summary span {
  color: var(--quiet);
}

.source-chip {
  color: #a9c5de;
}

.source-file {
  color: #eef7ff;
}

select,
input[type="file"],
.record-toolbar input {
  border-color: #2d5579;
  background: #0a1a2c;
  color: #eef7ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

select:hover,
select:focus,
input:focus,
input:hover {
  border-color: #3f8bc1;
  background-color: #102943;
  box-shadow: 0 8px 18px rgba(0, 8, 22, .28);
}

input::file-selector-button {
  border-color: #315f89;
  background: #132f4e;
  color: #e7f6ff;
}

input::file-selector-button:hover {
  border-color: #3f8bc1;
  background: #17406a;
}

.panel,
.filter-band,
.detail-pane {
  border-color: #244766;
  background: rgba(13, 31, 52, .96);
  box-shadow: 0 7px 0 rgba(0, 10, 24, .46), 0 24px 52px rgba(0, 8, 22, .34);
}

.filter-band:hover,
.panel:hover,
.detail-pane:hover {
  border-color: #2d5579;
  background: rgba(13, 31, 52, .96);
  box-shadow: 0 7px 0 rgba(0, 10, 24, .46), 0 24px 52px rgba(0, 8, 22, .34);
}

.filter-head,
.panel-head,
.quality-summary-band,
.drilldown-summary {
  border-color: #294f72;
  background: linear-gradient(180deg, #132f4e 0%, #0e243d 100%);
}

.filter-grid.all-filters,
.filter-chips,
.field-tabs,
.field-records-panel {
  border-color: #244766;
  background: #0a1a2c;
}

.filter-field {
  color: #adc7df;
}

.filter-select-trigger {
  border-color: #2d5579;
  color: #e7f6ff;
  background: #0e243d;
  box-shadow: 0 4px 0 rgba(2, 18, 38, .7);
}

.filter-select-trigger svg {
  color: #9fb8d4;
}

.filter-select-trigger:hover {
  border-color: #3f8bc1;
  background: #132f4e;
  color: #ffffff;
}

.filter-select.open .filter-select-trigger,
.filter-select.has-value .filter-select-trigger {
  border-color: var(--duo-blue);
  background: #123a61;
  box-shadow: 0 0 0 3px rgba(28, 176, 246, .18), 0 4px 0 rgba(2, 18, 38, .7);
}

.filter-select-menu {
  border-color: #32628d;
  background: #081626;
  box-shadow: 0 20px 38px rgba(0, 8, 22, .56);
}

.filter-select-option {
  color: #cfe6f8;
}

.filter-select-option:hover,
.filter-select-option[aria-selected="true"] {
  color: #ffffff;
  background: #123a61;
}

.filter-chip,
.status-pill {
  border-color: #386b98;
  color: #e7f6ff;
  background: #123a61;
}

.filter-chip:hover,
.status-pill:hover {
  border-color: #55b9ed;
  background: #174d7d;
  color: #ffffff;
}

.callout {
  border-color: var(--duo-amber);
  background: rgba(251, 191, 36, .13);
  color: #fde68a;
}

.callout.muted {
  border-color: #3b6d98;
  background: rgba(31, 68, 104, .36);
  color: #b4cce3;
}

.callout.error {
  border-color: var(--duo-coral);
  background: rgba(251, 113, 133, .12);
  color: #fecdd3;
}

.field-hero {
  border-color: #63c9fb;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .15), transparent 36%),
    linear-gradient(135deg, #0f79d0 0%, #0a3f78 100%);
  box-shadow: 0 8px 0 #053763, 0 24px 44px rgba(0, 8, 22, .38);
}

.field-kicker,
.field-stat {
  border-color: rgba(191, 232, 255, .32);
  background: rgba(255, 255, 255, .11);
}

.field-hero h2,
.field-stat strong {
  color: #ffffff;
}

.field-hero p,
.field-stat span {
  color: #d7f1ff;
}

.field-tabs {
  box-shadow: 0 6px 0 rgba(0, 10, 24, .42);
}

.field-tab {
  border-color: #2d5579;
  color: #dff4ff;
  background: #102943;
}

.field-tab:hover {
  border-color: #3f8bc1;
  background: #153556;
}

.field-tab.active {
  border-color: #7dd3fc;
  color: #ffffff;
  background: linear-gradient(180deg, #1cb0f6 0%, #0f79d0 100%);
  box-shadow: 0 5px 0 #064c86;
}

.kpi,
.chart-block,
.display-card,
.focus-grid .display-card,
.focus-grid .display-card:hover,
.contact-depth-panel {
  border-color: #244766;
  background: #0e243d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

.kpi:hover,
.chart-block:hover,
.display-card:hover,
.focus-grid .display-card:hover {
  border-color: #32628d;
  background: #102943;
  box-shadow: 0 5px 0 rgba(2, 18, 38, .64), 0 16px 34px rgba(0, 8, 22, .26);
}

.kpi::after {
  background:
    linear-gradient(90deg, var(--duo-blue), #3b82f6) 0 0 / var(--metric-progress, 100%) 100% no-repeat,
    #1a3b5a;
}

.kpi span,
.quality-kpi em,
.bar-value span,
.rate-chart-meta span,
.contact-method-value span,
.contact-depth-head span,
.contact-depth-legend {
  color: #9fb8d4;
}

.kpi strong,
.quality-kpi strong,
.bar-value strong,
.fact-list strong,
.focus-header strong,
.missing-fields-summary strong,
.rate-chart-meta strong,
.rate-chart-value,
.contact-method-label strong,
.contact-method-value strong,
.contact-depth-head,
.contact-depth-legend b {
  color: #eef7ff;
}

.quality-kpi {
  border-left-color: #1b3858;
}

.quality-kpi i {
  background: #4d7fa8;
}

.quality-kpi-ok i {
  background: var(--duo-teal);
}

.quality-kpi-warn strong {
  color: #fde68a;
}

.quality-kpi-warn i {
  background: var(--duo-amber);
}

.quality-kpi-bad strong {
  color: #fecdd3;
}

.quality-kpi-bad i {
  background: var(--duo-coral);
}

.bar-label,
.heatmap-axis-label {
  color: #d8ecfb;
}

.bar-rank {
  border-color: #2d5579;
  color: #b8d8ef;
  background: #102943;
}

.bar-track,
.rate-chart-track,
.contact-method-track,
.contact-depth-stack {
  border-color: #1b3858;
  background: #1a3b5a;
}

.chart-tooltip {
  border-color: #55b9ed;
  color: #f8fcff;
  background: #06182d;
  box-shadow: 0 16px 36px rgba(0, 8, 22, .58);
}

.heatmap-axis-label,
.heatmap-cell {
  border: 0;
}

.heatmap-axis-label {
  background: #102943;
}

.heatmap-corner {
  color: #9fb8d4;
  background: #0a1a2c;
}

.heatmap-column-label {
  justify-content: center;
  align-items: center;
  text-align: center;
  border: 0;
  color: #eef7ff;
  background: linear-gradient(180deg, #153556 0%, #102943 100%);
}

.heatmap-row-label {
  justify-content: flex-end;
  text-align: right;
  border: 0;
  color: #eef7ff;
  background: linear-gradient(90deg, #153556 0%, #102943 100%);
}

.heatmap-cell {
  color: var(--heatmap-text, #f8fcff);
  background: var(--heatmap-fill, #60a076);
}

.heatmap-cell-empty {
  background: #e8ecf0;
  color: #66717f;
}

.worksheet-table-wrap,
.detail-table-wrap {
  border-color: #244766;
  background: #081626;
}

.worksheet-table-wrap td:first-child {
  background: #102943;
  color: #eef7ff;
}

table {
  color: #d9ebfa;
}

th,
td {
  border-color: #1d3b5c;
}

th {
  background: #132f4e;
  color: #eef7ff;
}

td {
  color: #cfe2f3;
}

tr:nth-child(even) td {
  background: rgba(255, 255, 255, .024);
}

tbody tr:hover td,
tr.selected-row td,
tbody tr.selected-row:hover td {
  background: #123a61;
  border-color: #32628d;
  color: #ffffff;
}

.sensitivity-badge,
.format-badge,
.schema-example,
.rate-badge {
  color: #dff4ff;
  background: #102943;
  border-color: #2d5579;
}

.rate-good,
.sensitivity-low {
  color: #bffaf2;
  background: rgba(25, 194, 176, .14);
  border-color: rgba(25, 194, 176, .38);
}

.rate-ok,
.sensitivity-moderate {
  color: #fde68a;
  background: rgba(251, 191, 36, .13);
  border-color: rgba(251, 191, 36, .38);
}

.rate-watch,
.sensitivity-note {
  color: #fed7aa;
  background: rgba(251, 146, 60, .13);
  border-color: rgba(251, 146, 60, .38);
}

.rate-bad,
.sensitivity-alert,
.sensitivity-critical,
.sensitivity-direct {
  color: #fecdd3;
  background: rgba(251, 113, 133, .13);
  border-color: rgba(251, 113, 133, .38);
}

.rate-na,
.format-text {
  color: #b6cde2;
  background: rgba(255, 255, 255, .04);
  border-color: #2d5579;
}

.format-structured {
  color: #ddd6fe;
  background: rgba(139, 92, 246, .12);
  border-color: rgba(139, 92, 246, .34);
}

.format-validated {
  color: #bae6fd;
  background: rgba(28, 176, 246, .13);
  border-color: rgba(28, 176, 246, .38);
}

.missing-fields-summary,
.drilldown-summary .missing-summary-icon,
.missing-summary-icon {
  border-color: rgba(251, 113, 133, .32);
  background: rgba(251, 113, 133, .1);
}

.missing-fields-summary.is-complete {
  border-color: rgba(25, 194, 176, .32);
  background: rgba(25, 194, 176, .1);
}

.missing-field-chips span,
.missing-value-badge {
  color: #fecdd3;
  background: rgba(251, 113, 133, .14);
  border-color: rgba(251, 113, 133, .38);
}

.workbook-fields-table .missing-field-row td {
  border-color: rgba(251, 113, 133, .28);
  background: rgba(251, 113, 133, .09);
}

.detail-pane,
#quality-missing .detail-pane,
#quality-missing .detail-pane:hover {
  border-color: #244766;
  background: #0a1a2c;
}

.fact-list div {
  border-bottom-color: #1b3858;
}

.fact-list div:hover {
  border-color: #244766;
  background: rgba(255, 255, 255, .035);
}

@media (max-width: 980px) {
  .sidebar {
    background:
      linear-gradient(90deg, rgba(28, 176, 246, .16), transparent 42%),
      linear-gradient(180deg, #0b3159 0%, #071f3b 100%);
    border-bottom-color: #244766;
  }
}

/* Trading-terminal inspired dashboard theme */
:root {
  --bg: #050814;
  --bg-lift: #090d1a;
  --panel: #111522;
  --panel-soft: #171b28;
  --panel-strong: #202636;
  --ink: #f3f6ff;
  --muted: #99a4b8;
  --quiet: #677287;
  --line: rgba(255, 255, 255, .09);
  --line-soft: rgba(255, 255, 255, .055);
  --accent: #2f6bff;
  --accent-dim: #183b94;
  --gold: #f5b84b;
  --plum: #9b8cff;
  --slate: #7f91ad;
  --rust: #ff8f5b;
  --red: #ff6f8f;
  --blue: #2f6bff;
  --shadow: rgba(0, 0, 0, .42);
  --duo-blue: #2f6bff;
  --duo-blue-dark: #1f55e8;
  --duo-blue-shadow: rgba(47, 107, 255, .25);
  --duo-navy: #050814;
  --duo-sky: #121a2d;
  --duo-teal: #21c7b7;
  --duo-amber: #f5b84b;
  --duo-coral: #ff6f8f;
}

* {
  scrollbar-color: #29334a #070a15;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner {
  background: #070a15;
}

*::-webkit-scrollbar-thumb {
  border-color: #070a15;
  background: #29334a;
}

*::-webkit-scrollbar-thumb:hover {
  background: #3a4560;
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at 24% -12%, rgba(47, 107, 255, .18), transparent 26%),
    radial-gradient(circle at 92% 2%, rgba(79, 121, 255, .11), transparent 20%),
    linear-gradient(180deg, #060916 0%, #080b16 44%, #040711 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.app-shell {
  grid-template-columns: 78px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  z-index: 80;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
  overflow: visible;
  padding: 14px 10px;
  background:
    linear-gradient(180deg, rgba(47, 107, 255, .12), transparent 28%),
    rgba(7, 10, 21, .94);
  border-right: 1px solid var(--line);
  box-shadow: 10px 0 32px rgba(0, 0, 0, .32);
  backdrop-filter: blur(18px);
}

.brand {
  display: grid;
  place-items: center;
  min-height: 52px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 6px;
  background: rgba(255, 255, 255, .045);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.brand > div {
  display: none;
}

.brand-mark {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 50%;
  padding: 2px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}

nav {
  display: grid;
  gap: 18px;
  min-height: 0;
}

.nav-group {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.nav-group-label {
  width: 100%;
  padding: 0;
  color: var(--quiet);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
}

nav button {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 0;
  color: #c5cee0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

nav button span {
  position: absolute;
  z-index: 90;
  left: calc(100% + 12px);
  top: 50%;
  width: max-content;
  max-width: 240px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 9px;
  color: #f5f8ff;
  background: #111522;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .42);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-50%) translateX(-4px);
  transition: opacity var(--fast) var(--ease), transform var(--fast) var(--ease);
}

nav button:hover span,
nav button:focus-visible span {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.nav-icon {
  width: 19px;
  height: 19px;
  opacity: .86;
}

nav button:hover {
  border-color: rgba(255, 255, 255, .12);
  color: #ffffff;
  background: rgba(255, 255, 255, .055);
  box-shadow: none;
  transform: none;
}

nav button.active {
  border-color: rgba(125, 160, 255, .58);
  color: #ffffff;
  background: linear-gradient(180deg, #3f7cff 0%, #245eea 100%);
  box-shadow: 0 0 0 3px rgba(47, 107, 255, .16), 0 16px 32px rgba(47, 107, 255, .2);
}

.field-nav-empty {
  width: 44px;
  height: 44px;
  border: 1px dashed rgba(255, 255, 255, .15);
  border-radius: 12px;
  padding: 0;
  overflow: hidden;
  color: transparent;
  background: rgba(255, 255, 255, .025);
}

.field-nav-empty::before {
  content: "...";
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: var(--quiet);
  font-weight: 800;
}

main {
  min-width: 0;
  padding: 18px 22px 28px;
  overflow-x: hidden;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 60;
  display: flex;
  min-height: 58px;
  margin: -18px -22px 18px;
  padding: 10px 22px;
  border-bottom: 1px solid var(--line);
  background: rgba(6, 9, 18, .82);
  box-shadow: 0 16px 38px rgba(0, 0, 0, .22);
  backdrop-filter: blur(18px);
}

.source-block {
  display: flex;
  align-items: center;
  gap: 14px;
}

.source-label {
  color: #6f7b91;
  font-size: 10px;
  letter-spacing: .14em;
}

#sourceLine {
  align-items: center;
  gap: 8px;
}

.source-chip {
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 10px;
  color: #c5cee0;
  background: rgba(255, 255, 255, .045);
  font-size: 12px;
}

.source-file {
  color: #f3f6ff;
}

.top-actions {
  gap: 8px;
}

button,
.filter-select-trigger,
.filter-chip,
.status-pill,
.table-action,
select,
input[type="file"],
.record-toolbar input {
  border-width: 1px;
  border-radius: 9px;
  border-color: var(--line);
  color: #e6ebf7;
  background: rgba(255, 255, 255, .055);
  box-shadow: none;
  font-weight: 650;
}

button:hover,
.filter-select-trigger:hover,
.filter-chip:hover,
.status-pill:hover,
.table-action:hover {
  border-color: rgba(125, 160, 255, .42);
  color: #ffffff;
  background: rgba(255, 255, 255, .08);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .24);
  transform: none;
}

button:active,
.filter-select-trigger:active,
.filter-chip:active,
.status-pill:active,
.table-action:active {
  box-shadow: none;
  transform: none;
}

button:focus-visible,
select:focus-visible,
input:focus-visible,
summary:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(47, 107, 255, .22);
}

.icon-button,
.top-back-button,
.topbar .icon-button {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: #dce5f7;
  background: rgba(255, 255, 255, .055);
}

h1,
h2,
.panel-head h2,
.quality-summary-title h2 {
  color: #f7f9ff;
  font-weight: 750;
}

h2 {
  font-size: 20px;
}

h3 {
  margin-bottom: 10px;
  color: #aab5c9;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .11em;
}

p,
.source-empty,
.muted-text {
  color: var(--muted);
}

.view.active {
  gap: 14px;
}

.panel,
.filter-band,
.detail-pane {
  border: 1px solid var(--line);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .032), rgba(255, 255, 255, .012)),
    rgba(14, 18, 30, .96);
  box-shadow: 0 22px 52px rgba(0, 0, 0, .3);
}

.panel,
.filter-band {
  padding: 12px;
}

.panel:hover,
.filter-band:hover,
.detail-pane:hover {
  border-color: rgba(255, 255, 255, .13);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .014)),
    rgba(14, 18, 30, .96);
  box-shadow: 0 22px 52px rgba(0, 0, 0, .3);
  transform: none;
}

.panel-head,
.filter-head,
.quality-summary-band,
.drilldown-summary {
  min-height: 40px;
  border: 1px solid var(--line-soft);
  border-radius: 11px;
  background: rgba(255, 255, 255, .035);
}

.panel-head {
  margin: 0 0 12px;
  padding: 9px 10px;
}

.panel-head h2,
.filter-head h2 {
  font-size: 15px;
}

.filter-band {
  gap: 10px;
  margin-bottom: 14px;
}

.filter-grid.all-filters,
.filter-chips,
.field-tabs,
.field-records-panel {
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: rgba(5, 8, 20, .52);
  box-shadow: none;
}

.filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(154px, 1fr));
  gap: 8px;
}

.filter-field {
  color: #9aa6bb;
}

.filter-select-trigger {
  min-height: 34px;
  background: rgba(255, 255, 255, .045);
}

.filter-select.open .filter-select-trigger,
.filter-select.has-value .filter-select-trigger {
  border-color: rgba(47, 107, 255, .72);
  background: rgba(47, 107, 255, .16);
  box-shadow: 0 0 0 3px rgba(47, 107, 255, .14);
}

.filter-select-menu {
  border: 1px solid rgba(125, 160, 255, .28);
  border-radius: 12px;
  background: #090d1a;
  box-shadow: 0 22px 48px rgba(0, 0, 0, .58);
}

.filter-select-option {
  border-radius: 8px;
  color: #c8d1e2;
  font-weight: 650;
}

.filter-select-option:hover,
.filter-select-option[aria-selected="true"] {
  color: #ffffff;
  background: rgba(47, 107, 255, .2);
}

.filter-chip,
.status-pill {
  color: #d7def0;
  background: rgba(255, 255, 255, .055);
}

.field-hero {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .95fr);
  gap: 14px;
  border: 1px solid rgba(125, 160, 255, .24);
  border-radius: 14px;
  padding: 14px;
  color: var(--ink);
  background:
    radial-gradient(circle at 100% 0%, rgba(47, 107, 255, .22), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, .042), rgba(255, 255, 255, .014)),
    rgba(14, 18, 30, .96);
  box-shadow: 0 22px 52px rgba(0, 0, 0, .3);
}

.field-hero-copy {
  gap: 7px;
}

.field-kicker {
  border: 1px solid rgba(125, 160, 255, .36);
  border-radius: 999px;
  padding: 5px 9px;
  color: #b8c7ff;
  background: rgba(47, 107, 255, .14);
  font-size: 10px;
  letter-spacing: .12em;
}

.field-hero h2 {
  color: #f7f9ff;
  font-size: 24px;
  line-height: 1.08;
}

.field-hero p {
  max-width: 760px;
  color: #9eabc0;
  font-size: 13px;
  font-weight: 500;
}

.field-stat-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.field-stat,
.kpi,
.chart-block,
.display-card,
.focus-grid .display-card,
.focus-grid .display-card:hover,
.contact-depth-panel {
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: rgba(255, 255, 255, .042);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055);
}

.field-stat {
  padding: 11px;
}

.field-stat span,
.kpi span,
.quality-kpi em,
.bar-value span,
.rate-chart-meta span,
.contact-method-value span,
.contact-depth-head span,
.contact-depth-legend {
  color: #99a4b8;
}

.field-stat strong,
.kpi strong,
.quality-kpi strong,
.bar-value strong,
.fact-list strong,
.focus-header strong,
.missing-fields-summary strong,
.rate-chart-meta strong,
.rate-chart-value,
.contact-method-label strong,
.contact-method-value strong,
.contact-depth-head,
.contact-depth-legend b {
  color: #f2f6ff;
}

.kpi:hover,
.chart-block:hover,
.display-card:hover,
.focus-grid .display-card:hover {
  border-color: rgba(125, 160, 255, .22);
  background: rgba(255, 255, 255, .06);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .24);
  filter: none;
  transform: none;
}

.kpi {
  min-height: 94px;
  padding: 12px;
  overflow: hidden;
}

.kpi::after {
  left: 12px;
  right: 12px;
  bottom: 9px;
  height: 3px;
  background:
    linear-gradient(90deg, #2f6bff, #66a0ff) 0 0 / var(--metric-progress, 100%) 100% no-repeat,
    rgba(255, 255, 255, .09);
}

.kpi strong {
  font-size: 22px;
}

.display-grid {
  gap: 12px;
}

.chart-block,
.display-card {
  min-height: 180px;
  padding: 12px;
}

.field-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 7px;
}

.field-tab {
  min-height: 36px;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 8px 14px;
  color: #aeb8cc;
  background: transparent;
  box-shadow: none;
  font-size: 13px;
}

.field-tab:hover {
  border-color: rgba(255, 255, 255, .1);
  color: #ffffff;
  background: rgba(255, 255, 255, .055);
}

.field-tab.active {
  border-color: rgba(125, 160, 255, .56);
  color: #ffffff;
  background: linear-gradient(180deg, #3f7cff 0%, #245eea 100%);
  box-shadow: 0 0 0 3px rgba(47, 107, 255, .16), 0 12px 24px rgba(47, 107, 255, .16);
}

.duo-block-chart {
  border-radius: 10px;
  background: #070a15;
}

.duo-block-tile {
  border-color: #070a15;
  border-radius: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
}

.bar-rank,
.sensitivity-badge,
.format-badge,
.schema-example,
.rate-badge {
  border-color: var(--line-soft);
  color: #b9c4d8;
  background: rgba(255, 255, 255, .045);
}

.bar-label,
.heatmap-axis-label {
  color: #d6deed;
}

.bar-track,
.rate-chart-track,
.contact-method-track,
.contact-depth-stack {
  border-color: rgba(255, 255, 255, .055);
  background: rgba(255, 255, 255, .075);
}

.bar-fill,
.rate-chart-track i,
.contact-method-track span {
  background: linear-gradient(90deg, #2f6bff, #66a0ff);
}

.rate-good,
.sensitivity-low {
  color: #c8fff7;
  background: rgba(33, 199, 183, .12);
  border-color: rgba(33, 199, 183, .3);
}

.rate-ok,
.sensitivity-moderate {
  color: #ffe3a3;
  background: rgba(245, 184, 75, .12);
  border-color: rgba(245, 184, 75, .3);
}

.rate-watch,
.sensitivity-note {
  color: #ffd7bd;
  background: rgba(255, 143, 91, .12);
  border-color: rgba(255, 143, 91, .3);
}

.rate-bad,
.sensitivity-alert,
.sensitivity-critical,
.sensitivity-direct {
  color: #ffd0dc;
  background: rgba(255, 111, 143, .12);
  border-color: rgba(255, 111, 143, .32);
}

.rate-na,
.format-text {
  color: #b9c4d8;
  background: rgba(255, 255, 255, .045);
  border-color: var(--line-soft);
}

.format-structured {
  color: #d8d1ff;
  background: rgba(155, 140, 255, .12);
  border-color: rgba(155, 140, 255, .28);
}

.format-validated {
  color: #cbd9ff;
  background: rgba(47, 107, 255, .14);
  border-color: rgba(47, 107, 255, .32);
}

.bar-row:nth-child(2n) .bar-fill { background: #21c7b7; }
.bar-row:nth-child(3n) .bar-fill { background: #f5b84b; }
.bar-row:nth-child(4n) .bar-fill { background: #9b8cff; }
.bar-row:nth-child(5n) .bar-fill { background: #ff8f5b; }

.chart-tooltip {
  border-color: rgba(125, 160, 255, .42);
  color: #f8fbff;
  background: #090d1a;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .56);
}

.heatmap-axis-label,
.heatmap-cell {
  border: 0;
  border-radius: 0;
}

.heatmap-axis-label {
  background: rgba(255, 255, 255, .045);
}

.heatmap-corner {
  color: #8f9bb1;
  background: rgba(255, 255, 255, .03);
}

.heatmap-column-label {
  justify-content: center;
  align-items: center;
  text-align: center;
  border: 0;
  color: #f0f4ff;
  background: rgba(255, 255, 255, .06);
}

.heatmap-row-label {
  justify-content: flex-end;
  text-align: right;
  border: 0;
  color: #f0f4ff;
  background: rgba(255, 255, 255, .045);
}

.heatmap-cell {
  color: var(--heatmap-text, #ffffff);
  background: var(--heatmap-fill, #60a076);
}

.heatmap-cell-empty {
  color: #66717f;
  background: #e8ecf0;
}

.quality-summary-band {
  grid-template-columns: minmax(210px, 1fr) minmax(0, 2.8fr);
}

.quality-kpi {
  border-left-color: var(--line-soft);
}

.quality-kpi i {
  background: #7f91ad;
}

.quality-kpi-ok i {
  background: var(--duo-teal);
}

.quality-kpi-warn strong {
  color: #ffe3a3;
}

.quality-kpi-warn i {
  background: var(--duo-amber);
}

.quality-kpi-bad strong {
  color: #ffd0dc;
}

.quality-kpi-bad i {
  background: var(--duo-coral);
}

.table-wrap {
  margin-top: 10px;
}

.worksheet-table-wrap,
.detail-table-wrap {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #070a15;
}

table {
  color: #d8e1f0;
  font-size: 12px;
}

th,
td {
  border-color: rgba(255, 255, 255, .055);
  padding: 8px 10px;
}

th {
  color: #f0f4ff;
  background: #151a28;
  font-weight: 750;
}

td {
  color: #c8d2e4;
}

tr:nth-child(even) td {
  background: rgba(255, 255, 255, .018);
}

tbody tr:hover td,
tr.selected-row td,
tbody tr.selected-row:hover td {
  border-color: rgba(125, 160, 255, .22);
  color: #ffffff;
  background: rgba(47, 107, 255, .14);
}

.worksheet-table-wrap td:first-child {
  color: #f0f4ff;
  background: #111827;
}

.table-action {
  min-height: 27px;
  border-radius: 8px;
  padding: 5px 9px;
  font-size: 11px;
}

.callout {
  border: 1px solid rgba(245, 184, 75, .28);
  border-left-width: 3px;
  border-radius: 10px;
  background: rgba(245, 184, 75, .1);
  color: #ffe3a3;
}

.callout.muted {
  border-color: rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .04);
  color: #9faabe;
}

.callout.error {
  border-color: rgba(255, 111, 143, .36);
  background: rgba(255, 111, 143, .1);
  color: #ffd0dc;
}

.missing-fields-summary,
.drilldown-summary .missing-summary-icon,
.missing-summary-icon {
  border-color: rgba(255, 111, 143, .28);
  background: rgba(255, 111, 143, .09);
}

.missing-fields-summary.is-complete {
  border-color: rgba(33, 199, 183, .28);
  background: rgba(33, 199, 183, .09);
}

.missing-field-chips span,
.missing-value-badge {
  color: #ffd0dc;
  background: rgba(255, 111, 143, .12);
  border-color: rgba(255, 111, 143, .32);
}

.field-records-panel {
  padding: 10px;
}

select,
input[type="file"],
.record-toolbar input {
  background: rgba(5, 8, 20, .62);
  color: #e6ebf7;
}

select:hover,
select:focus,
input:focus,
input:hover {
  border-color: rgba(125, 160, 255, .42);
  background-color: rgba(255, 255, 255, .065);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .24);
}

input::file-selector-button {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .055);
  color: #e6ebf7;
  font-weight: 650;
}

@media (max-width: 1120px) {
  .field-hero {
    grid-template-columns: 1fr;
  }

  .field-stat-strip {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: sticky;
    top: 0;
    display: block;
    height: auto;
    max-height: none;
    padding: 10px 12px;
    overflow-x: auto;
    overflow-y: hidden;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    background: rgba(7, 10, 21, .94);
  }

  .brand {
    display: none;
  }

  nav,
.nav-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    max-height: none;
    overflow: visible;
    padding: 0;
  }

  nav {
    min-width: max-content;
  }

  .nav-group-label {
    display: none;
  }

  nav button {
    flex: 0 0 42px;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
  }

  nav button span {
    left: 50%;
    top: calc(100% + 10px);
    transform: translateX(-50%) translateY(-4px);
  }

  nav button:hover span,
  nav button:focus-visible span {
    transform: translateX(-50%) translateY(0);
  }

  main {
    padding: 14px;
  }

  .topbar {
    margin: -14px -14px 14px;
    padding: 9px 14px;
  }

  .topbar,
  .source-block,
  .upload-row {
    align-items: stretch;
  }

  .source-block {
    display: grid;
    gap: 5px;
  }

  .field-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
  }
}

@media (max-width: 640px) {
  .field-hero h2 {
    font-size: 22px;
  }

  .field-stat-strip,
.filter-grid,
.quality-summary-metrics {
    grid-template-columns: 1fr;
  }

  .quality-summary-band {
    grid-template-columns: 1fr;
  }

  .quality-kpi {
    border-left: 0;
    border-top: 1px solid var(--line-soft);
    padding: 8px 0;
  }

  .quality-kpi:first-child {
    border-top: 0;
  }
}

/* Flat-color finish: no gradients. */
*,
*::before,
*::after {
  background-image: none !important;
}

body {
  background: #050814 !important;
}

.sidebar {
  background: #070a15 !important;
}

.topbar {
  background: rgba(6, 9, 18, .92) !important;
}

.panel,
.filter-band,
.detail-pane,
.field-hero {
  background: rgba(14, 18, 30, .96) !important;
}

.panel:hover,
.filter-band:hover,
.detail-pane:hover {
  background: rgba(16, 20, 33, .98) !important;
}

.panel-head,
.filter-head,
.quality-summary-band,
.drilldown-summary,
.filter-grid.all-filters,
.filter-chips,
.field-tabs,
.field-records-panel,
.field-stat,
.kpi,
.chart-block,
.display-card,
.focus-grid .display-card,
.contact-depth-panel,
.source-chip,
.filter-select-trigger,
.filter-chip,
.status-pill,
.table-action,
select,
input[type="file"],
.record-toolbar input {
  background: #171b28 !important;
}

.kpi:hover,
.chart-block:hover,
.display-card:hover,
.focus-grid .display-card:hover,
.filter-select-trigger:hover,
.filter-chip:hover,
.status-pill:hover,
.table-action:hover,
.field-tab:hover {
  background: #1d2333 !important;
}

nav button.active,
.field-tab.active {
  background: #2f6bff !important;
}

nav button:hover {
  background: #171b28 !important;
}

.field-tab,
nav button {
  background: transparent !important;
}

.field-kicker,
.filter-select.open .filter-select-trigger,
.filter-select.has-value .filter-select-trigger,
tbody tr:hover td,
tr.selected-row td,
tbody tr.selected-row:hover td {
  background: rgba(47, 107, 255, .16) !important;
}

.kpi::after,
.bar-fill,
.rate-chart-track i,
.contact-method-track span {
  background: #2f6bff !important;
}

.bar-row:nth-child(2n) .bar-fill { background: #21c7b7 !important; }
.bar-row:nth-child(3n) .bar-fill { background: #f5b84b !important; }
.bar-row:nth-child(4n) .bar-fill { background: #9b8cff !important; }
.bar-row:nth-child(5n) .bar-fill { background: #ff6f8f !important; }

th,
.worksheet-table-wrap td:first-child {
  background: #151a28 !important;
}

td,
tr:nth-child(even) td {
  background: transparent !important;
}

.callout,
.callout.muted,
.callout.error,
.rate-good,
.rate-ok,
.rate-watch,
.rate-bad,
.rate-na,
.format-text,
.format-structured,
.format-validated,
.sensitivity-low,
.sensitivity-moderate,
.sensitivity-note,
.sensitivity-alert,
.sensitivity-critical,
.sensitivity-direct {
  background-image: none !important;
}

/* AppDynamics-style light operations console theme */
:root {
  --bg: #f5f6f7;
  --bg-lift: #ffffff;
  --panel: #ffffff;
  --panel-soft: #f8f9fa;
  --panel-strong: #eef1f4;
  --ink: #333333;
  --muted: #666f78;
  --quiet: #8a929a;
  --line: #d9dde2;
  --line-soft: #edf0f2;
  --accent: #3f8ee8;
  --accent-dim: #d9ecff;
  --gold: #f4c542;
  --plum: #8fa3b8;
  --slate: #748394;
  --rust: #e99a3f;
  --red: #e85d65;
  --blue: #3f8ee8;
  --shadow: rgba(30, 40, 55, .12);
  --duo-blue: #3f8ee8;
  --duo-blue-dark: #2f78cf;
  --duo-blue-shadow: rgba(63, 142, 232, .2);
  --duo-navy: #333333;
  --duo-sky: #edf6ff;
  --duo-teal: #6ec64d;
  --duo-amber: #f4c542;
  --duo-coral: #e85d65;
}

body {
  color: var(--ink) !important;
  background: #f5f6f7 !important;
  font-family: "Helvetica Neue", Arial, ui-sans-serif, system-ui, sans-serif;
}

* {
  scrollbar-color: #b7c1cc #eef0f2 !important;
  scrollbar-width: thin;
}

*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-corner {
  background: #eef0f2 !important;
}

*::-webkit-scrollbar-thumb {
  border: 3px solid #eef0f2 !important;
  border-radius: 999px;
  background: #b7c1cc !important;
}

*::-webkit-scrollbar-thumb:hover {
  background: #8fa3b8 !important;
}

.app-shell {
  grid-template-columns: 252px minmax(0, 1fr) !important;
  background: #f5f6f7;
}

.sidebar {
  display: flex !important;
  flex-direction: column;
  gap: 0 !important;
  width: 252px;
  height: 100vh;
  padding: 0 !important;
  overflow: hidden auto !important;
  color: #555555 !important;
  background: #e4e4e4 !important;
  border-right: 1px solid #c9cdd2 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.brand {
  display: flex !important;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  min-height: 44px !important;
  width: 100%;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 8px 22px !important;
  color: #dcdcdc !important;
  background: #333333 !important;
  box-shadow: none !important;
}

.brand > div {
  display: block !important;
}

.brand-mark {
  width: 24px !important;
  height: 24px !important;
  border: 0 !important;
  border-radius: 4px !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.brand strong {
  color: #f0f0f0 !important;
  font-size: 13px;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.brand small {
  color: #b9b9b9 !important;
  font-size: 10px;
}

nav {
  display: block !important;
  min-height: 0;
  padding: 0 !important;
  gap: 0 !important;
}

.nav-group {
  display: grid !important;
  justify-items: stretch !important;
  gap: 0 !important;
}

.nav-group-label {
  display: block !important;
  width: auto !important;
  padding: 18px 22px 8px !important;
  color: #555555 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-transform: none !important;
}

nav button {
  position: relative;
  display: grid !important;
  grid-template-columns: 26px minmax(0, 1fr) !important;
  place-items: center start !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 45px !important;
  min-height: 45px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 22px !important;
  color: #5d646b !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transform: none !important;
}

nav button span {
  position: static !important;
  width: auto !important;
  max-width: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  color: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1 !important;
  transform: none !important;
}

.nav-icon {
  width: 18px !important;
  height: 18px !important;
  opacity: .78 !important;
}

nav button:hover {
  color: #333333 !important;
  background: #d8d8d8 !important;
}

nav button.active {
  color: #ffffff !important;
  background: #3f8ee8 !important;
  box-shadow: none !important;
}

nav button.active .nav-icon {
  opacity: 1 !important;
}

.field-nav-empty {
  width: auto !important;
  height: auto !important;
  min-height: 38px;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 10px 22px !important;
  color: #777777 !important;
  background: transparent !important;
  font-size: 12px;
}

.field-nav-empty::before {
  display: none !important;
}

main {
  padding: 0 24px 24px !important;
  background: #f5f6f7;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 70;
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  min-height: 44px !important;
  margin: 0 -24px 18px !important;
  padding: 0 24px !important;
  color: #dcdcdc !important;
  background: #333333 !important;
  border-bottom: 1px solid #252525 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.source-block {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 220px;
  max-width: 360px;
  padding-right: 18px;
}

.source-label {
  color: #bdbdbd !important;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#sourceLine {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 !important;
}

.source-chip {
  min-height: 26px !important;
  border: 1px solid #4b4b4b !important;
  border-radius: 2px !important;
  padding: 5px 8px !important;
  color: #eeeeee !important;
  background: #3d3d3d !important;
  font-size: 12px !important;
}

.source-file {
  max-width: 220px;
  color: #ffffff !important;
}

.header-field-tabs {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  min-height: 44px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  overflow-x: auto;
  background: transparent !important;
  box-shadow: none !important;
}

.field-tab {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  min-height: 44px !important;
  height: 44px;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 20px !important;
  color: #d6d6d6 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.field-tab:hover {
  color: #ffffff !important;
  background: #3d3d3d !important;
}

.field-tab.active {
  color: #ffffff !important;
  background: #3f8ee8 !important;
}

.field-tab .button-icon {
  width: 16px;
  height: 16px;
}

.top-actions {
  display: flex;
  align-items: center;
  gap: 8px !important;
  margin-left: auto !important;
  padding-left: 12px;
}

.topbar .icon-button,
.top-back-button {
  width: 34px !important;
  height: 34px !important;
  align-self: center;
  border: 1px solid #565656 !important;
  border-radius: 2px !important;
  color: #eeeeee !important;
  background: #3d3d3d !important;
}

.topbar .icon-button:hover,
.top-back-button:hover {
  background: #484848 !important;
}

h1,
h2,
.panel-head h2,
.quality-summary-title h2 {
  color: #333333 !important;
  font-weight: 600 !important;
}

h2 {
  font-size: 18px !important;
}

h3 {
  color: #4f78a8 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

p,
.source-empty,
.muted-text {
  color: #666f78 !important;
}

.view.active {
  gap: 14px !important;
}

.field-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr) !important;
  gap: 18px !important;
  min-height: 104px;
  border: 1px solid #d9dde2 !important;
  border-radius: 0 !important;
  padding: 16px 18px !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.field-kicker {
  width: max-content;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: #4f78a8 !important;
  background: transparent !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.field-hero h2 {
  color: #333333 !important;
  font-size: 22px !important;
  font-weight: 500 !important;
}

.employment-detail-sector-tag {
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid #c8d8ea;
  border-radius: var(--radius-tag);
  padding: 3px 8px;
  background: #f4f8fc;
  color: #365c72;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-hero p {
  color: #666f78 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.field-stat-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.panel,
.filter-band,
.detail-pane,
.field-stat,
.kpi,
.chart-block,
.display-card,
.focus-grid .display-card,
.contact-depth-panel {
  border: 1px solid #d9dde2 !important;
  border-radius: 0 !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.panel,
.filter-band {
  padding: 12px !important;
}

.panel:hover,
.filter-band:hover,
.detail-pane:hover,
.kpi:hover,
.chart-block:hover,
.display-card:hover,
.focus-grid .display-card:hover {
  border-color: #c7d3df !important;
  background: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.panel-head,
.filter-head,
.quality-summary-band,
.drilldown-summary {
  min-height: 38px !important;
  border: 1px solid #e4e7eb !important;
  border-radius: 0 !important;
  background: #f8f9fa !important;
}

.panel-head {
  margin: 0 0 12px !important;
  padding: 8px 10px !important;
}

.panel-head h2,
.filter-head h2 {
  color: #333333 !important;
  font-size: 15px !important;
}

.filter-grid.all-filters,
.filter-chips,
.field-records-panel {
  border: 1px solid #d9dde2 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.filter-select-trigger,
.filter-chip,
.status-pill,
.table-action,
select,
input[type="file"],
.record-toolbar input,
input::file-selector-button {
  border: 1px solid #cbd3dc !important;
  border-radius: 2px !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-weight: 600 !important;
}

.filter-select-trigger:hover,
.filter-chip:hover,
.status-pill:hover,
.table-action:hover {
  border-color: #aebbc8 !important;
  color: #222222 !important;
  background: #f1f3f5 !important;
  box-shadow: none !important;
  transform: none !important;
}

button:focus-visible,
select:focus-visible,
input:focus-visible,
summary:focus-visible {
  border-color: #3f8ee8 !important;
  box-shadow: 0 0 0 2px rgba(63, 142, 232, .2) !important;
}

.filter-select.open .filter-select-trigger,
.filter-select.has-value .filter-select-trigger {
  border-color: #3f8ee8 !important;
  background: #edf6ff !important;
  box-shadow: none !important;
}

.filter-select-menu {
  top: calc(100% + 4px) !important;
  border: 1px solid #cbd3dc !important;
  border-radius: 0 !important;
  padding: 4px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 24px rgba(30, 40, 55, .14) !important;
}

.filter-select-option {
  min-height: 34px !important;
  border-radius: 0 !important;
  padding: 8px 10px !important;
  color: #333333 !important;
  background: transparent !important;
  font-weight: 600 !important;
}

.filter-select-option:hover {
  color: #1f5d9d !important;
  background: #edf6ff !important;
}

.filter-select-option[aria-selected="true"] {
  color: #1f5d9d !important;
  background: #e8f2fc !important;
}

.filter-select.open .filter-select-trigger svg {
  transform: rotate(180deg);
  color: #3f8ee8 !important;
}

.filter-chip,
.status-pill {
  color: #3d5268 !important;
  background: #f8f9fa !important;
}

.field-stat span,
.kpi span,
.quality-kpi em,
.bar-value span,
.rate-chart-meta span,
.contact-method-value span,
.contact-depth-head span,
.contact-depth-legend {
  color: #666f78 !important;
}

.field-stat strong,
.kpi strong,
.quality-kpi strong,
.bar-value strong,
.fact-list strong,
.focus-header strong,
.missing-fields-summary strong,
.rate-chart-meta strong,
.rate-chart-value,
.contact-method-label strong,
.contact-method-value strong,
.contact-depth-head,
.contact-depth-legend b {
  color: #333333 !important;
}

.kpi {
  min-height: 86px !important;
  padding: 11px !important;
}

.kpi::after {
  height: 3px !important;
  background: #3f8ee8 !important;
}

.bar-rank,
.sensitivity-badge,
.format-badge,
.schema-example,
.rate-badge {
  border-color: #d9dde2 !important;
  color: #4d5965 !important;
  background: #f8f9fa !important;
}

.bar-label,
.heatmap-axis-label {
  color: #333333 !important;
}

.bar-track,
.rate-chart-track,
.contact-method-track,
.contact-depth-stack {
  border-color: #d9dde2 !important;
  background: #eef1f4 !important;
}

.bar-fill,
.rate-chart-track i,
.contact-method-track span {
  background: #3f8ee8 !important;
}

.bar-row:nth-child(2n) .bar-fill { background: #6ec64d !important; }
.bar-row:nth-child(3n) .bar-fill { background: #f4c542 !important; }
.bar-row:nth-child(4n) .bar-fill { background: #8fa3b8 !important; }
.bar-row:nth-child(5n) .bar-fill { background: #e85d65 !important; }

.duo-block-chart {
  background: #f8f9fa !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}

.duo-block-tile {
  border-color: #ffffff !important;
  border-radius: 0 !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.chart-tooltip {
  border-color: #9ebada !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: 0 8px 20px rgba(30, 40, 55, .18) !important;
}

.heatmap-axis-label,
.heatmap-cell {
  border: 0 !important;
  border-radius: 0 !important;
}

.heatmap-axis-label,
.heatmap-corner {
  background: #f8f9fa !important;
}

.heatmap-column-label {
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  color: #333333 !important;
  background: #eef1f4 !important;
}

.heatmap-row-label {
  justify-content: flex-end !important;
  text-align: right !important;
  color: #333333 !important;
  background: #eef1f4 !important;
}

.heatmap-cell-empty {
  color: #999999 !important;
  background: #f8f9fa !important;
}

.quality-kpi-ok i {
  background: #6ec64d !important;
}

.quality-kpi-bad i {
  background: #e85d65 !important;
}

.quality-kpi-warn i {
  background: #f4c542 !important;
}

.quality-kpi-warn strong {
  color: #9b7420 !important;
}

.quality-kpi-bad strong {
  color: #bd3e46 !important;
}

.rate-good,
.sensitivity-low {
  color: #3d8d2a !important;
}

.callout {
  border-color: #ead894 !important;
  color: #6f5710 !important;
  background: #fff9df !important;
}

.callout.muted {
  border-color: #d9dde2 !important;
  color: #666f78 !important;
  background: #f8f9fa !important;
}

.callout.error {
  border-color: #edb6bb !important;
  color: #bd3e46 !important;
  background: #fff2f3 !important;
}

.rate-good,
.sensitivity-low {
  background: #edf9e9 !important;
  border-color: #bfe4b2 !important;
}

.rate-ok,
.sensitivity-moderate {
  color: #87691a !important;
  background: #fff8da !important;
  border-color: #ead894 !important;
}

.rate-watch,
.sensitivity-note {
  color: #a35f17 !important;
  background: #fff3e5 !important;
  border-color: #edcc9f !important;
}

.rate-bad,
.sensitivity-alert,
.sensitivity-critical,
.sensitivity-direct {
  color: #bd3e46 !important;
  background: #fff2f3 !important;
  border-color: #edb6bb !important;
}

.rate-na,
.format-text {
  color: #666f78 !important;
  background: #f8f9fa !important;
  border-color: #d9dde2 !important;
}

.format-structured {
  color: #4d667d !important;
  background: #eef4fa !important;
  border-color: #c7d3df !important;
}

.format-validated {
  color: #1f5d9d !important;
  background: #edf6ff !important;
  border-color: #b8d5f4 !important;
}

.missing-fields-summary,
.drilldown-summary .missing-summary-icon,
.missing-summary-icon,
.missing-field-chips span,
.missing-value-badge {
  border-color: #edb6bb !important;
  color: #bd3e46 !important;
  background: #fff2f3 !important;
}

.missing-fields-summary.is-complete {
  border-color: #bfe4b2 !important;
  background: #edf9e9 !important;
}

.worksheet-table-wrap,
.detail-table-wrap {
  border: 1px solid #d9dde2 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
}

table {
  color: #333333 !important;
  font-size: 12px !important;
}

th,
td {
  border-color: #e4e7eb !important;
  padding: 8px 10px !important;
}

th,
.worksheet-table-wrap td:first-child {
  color: #333333 !important;
  background: #eef1f4 !important;
}

td,
tr:nth-child(even) td {
  color: #333333 !important;
  background: #ffffff !important;
}

tbody tr:hover td,
tr.selected-row td,
tbody tr.selected-row:hover td {
  border-color: #c7d3df !important;
  color: #333333 !important;
  background: #edf6ff !important;
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr !important;
  }

  .sidebar {
    position: sticky;
    top: 0;
    z-index: 80;
    width: 100%;
    height: auto;
    max-height: none;
    display: block !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border-right: 0 !important;
    border-bottom: 1px solid #c9cdd2 !important;
  }

  .brand {
    display: none !important;
  }

  nav,
.nav-group {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0 !important;
    min-width: max-content;
  }

  .nav-group-label {
    display: none !important;
  }

  nav button {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 44px !important;
    padding: 0 14px !important;
  }

  nav button span {
    display: none !important;
  }

  main {
    padding: 0 14px 18px !important;
  }

  .topbar {
    margin: 0 -14px 14px !important;
    padding: 0 14px !important;
    overflow-x: auto;
  }

  .source-block {
    min-width: max-content;
  }

  .header-field-tabs {
    flex: 0 0 auto;
  }

  .field-tab {
    flex: 0 0 auto;
    padding: 0 14px !important;
  }

  .field-hero {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  .field-stat-strip,
.filter-grid,
.quality-summary-metrics {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 981px) {
  .sidebar {
    padding: 45px 0 0 !important;
    scrollbar-width: none !important;
  }

  .sidebar::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
  }

  .brand {
    position: fixed !important;
    z-index: 110;
    top: 0;
    left: 0;
    width: 252px !important;
    height: 45px !important;
    min-height: 45px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #252525 !important;
  }

  .topbar {
    z-index: 100;
    height: 45px !important;
    min-height: 45px !important;
    border-left: 0 !important;
  }
}

.sensitivity-badge,
.format-badge,
.schema-example,
.rate-badge,
.missing-field-chips span,
.missing-value-badge {
  border-radius: var(--radius-tag) !important;
}

.top-back-button {
  margin-right: 12px !important;
}

.topbar .top-back-button {
  border-color: rgba(210, 224, 242, .42) !important;
  color: #f3f7fb !important;
  background: rgba(255, 255, 255, .055) !important;
  box-shadow: none !important;
  transition:
    background-color var(--fast) var(--ease),
    border-color var(--fast) var(--ease),
    box-shadow var(--fast) var(--ease),
    color var(--fast) var(--ease),
    transform var(--fast) var(--ease) !important;
}

.topbar .top-back-button .button-icon {
  transition:
    opacity var(--fast) var(--ease),
    transform var(--fast) var(--ease) !important;
}

.topbar .top-back-button:hover,
.topbar .top-back-button:focus-visible {
  border-color: rgba(105, 163, 230, .82) !important;
  color: #ffffff !important;
  background: rgba(63, 142, 232, .18) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .08),
    0 0 0 3px rgba(63, 142, 232, .14) !important;
  transform: translateX(-1px) !important;
}

.topbar .top-back-button:hover .button-icon,
.topbar .top-back-button:focus-visible .button-icon {
  opacity: 1 !important;
  transform: translateX(-2px) !important;
}

#quality-missing .drilldown-summary {
  border-color: #d9dde2 !important;
  color: #333333 !important;
  background: #f8f9fa !important;
}

#quality-missing .missing-summary-copy span,
#quality-missing .missing-summary-metric span {
  color: #6f7b86 !important;
  font-weight: 600 !important;
}

#quality-missing .missing-summary-copy strong {
  color: #333333 !important;
  font-weight: 600 !important;
}

#quality-missing .missing-summary-metric {
  border-left-color: #9aa9b8 !important;
}

#quality-missing .missing-summary-metric strong {
  color: #4f78a8 !important;
  font-weight: 600 !important;
}

#quality-missing .missing-summary-metric em {
  color: #b56d18 !important;
  font-weight: 500 !important;
}

#quality-missing .missing-summary-icon {
  color: #e85d65 !important;
  border-color: #edb6bb !important;
  background: #fff2f3 !important;
}

.detail-pane .display-card:hover,
.detail-pane .fact-list div:hover,
.field-records-panel .display-card:hover,
.field-records-panel .fact-list div:hover {
  border-color: #d9dde2 !important;
  color: inherit !important;
  background: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.detail-pane .focus-grid .display-card,
.detail-pane .focus-grid .display-card:hover,
.field-records-panel .focus-grid .display-card,
.field-records-panel .focus-grid .display-card:hover {
  border-color: #d9dde2 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  transition: none !important;
}

.detail-pane .focus-grid .fact-list div,
.detail-pane .focus-grid .fact-list div:hover,
.field-records-panel .focus-grid .fact-list div,
.field-records-panel .focus-grid .fact-list div:hover {
  border: 0 !important;
  border-bottom: 1px solid #d9dde2 !important;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  transition: none !important;
}

.detail-pane .focus-grid .fact-list div:last-child,
.detail-pane .focus-grid .fact-list div:last-child:hover,
.field-records-panel .focus-grid .fact-list div:last-child,
.field-records-panel .focus-grid .fact-list div:last-child:hover {
  border-bottom-color: transparent !important;
}

.duo-block-tile[data-drilldown-dimension] {
  cursor: pointer;
  isolation: isolate;
  transition:
    background-color var(--fast) var(--ease);
}

.duo-block-tile[data-drilldown-dimension]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, .14);
  opacity: 0;
  transition: opacity var(--fast) var(--ease);
}

.duo-block-tile[data-drilldown-dimension] strong,
.duo-block-tile[data-drilldown-dimension] span {
  position: relative;
  z-index: 1;
}

.duo-block-tile[data-drilldown-dimension]:hover,
.duo-block-tile[data-drilldown-dimension]:focus-visible {
  filter: none;
  box-shadow: none !important;
  outline: 0;
  z-index: 2;
}

.duo-block-tile[data-drilldown-dimension]:hover::before,
.duo-block-tile[data-drilldown-dimension]:focus-visible::before {
  opacity: 1;
}

.drilldown-hero {
  margin-bottom: 16px;
}

.drilldown-grid {
  align-items: stretch;
}

.panel-note {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.panel-head.compact {
  margin-bottom: 10px;
}

:root {
  --fixed-topbar-height: 45px;
  --fixed-sidebar-width: 252px;
}

main {
  padding-top: calc(var(--fixed-topbar-height) + 24px) !important;
}

.topbar {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  left: var(--fixed-sidebar-width) !important;
  z-index: 1000 !important;
  min-height: var(--fixed-topbar-height) !important;
  height: var(--fixed-topbar-height) !important;
  margin: 0 !important;
  padding: 0 24px !important;
}

@media (max-width: 900px) {
  .topbar {
    left: 0 !important;
  }
}

@media (min-width: 981px) {
  .sidebar {
    padding-top: var(--fixed-topbar-height) !important;
  }

  .brand {
    height: var(--fixed-topbar-height) !important;
    min-height: var(--fixed-topbar-height) !important;
  }
}

.share-chart .rate-chart-track i,
.share-chart .match-track i {
  background: var(--share-color) !important;
}

.employment-share-chart .rate-chart-track i {
  background: var(--share-color) !important;
}

#employmentDetailFurtherDegrees .bar-fill,
#employmentDetailFurtherCountries .bar-fill {
  background: var(--bar-color) !important;
}

#employmentDetailContactMethods .contact-method-track span,
#fieldEmploymentContactMethods .contact-method-track span,
#fieldUnemploymentContactMethods .contact-method-track span {
  background: var(--contact-color) !important;
}

.internship-risk-chart .rate-chart-track i {
  background: var(--share-color) !important;
}

.internship-risk-reason-track i {
  background: var(--reason-color) !important;
}

.field-scope-bar {
  position: fixed !important;
  top: var(--fixed-topbar-height) !important;
  right: 0 !important;
  left: var(--fixed-sidebar-width) !important;
  z-index: 900;
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 44px;
  height: 44px;
  margin: 0 !important;
  padding: 0 24px;
  border-bottom: 1px solid #c6ccd3;
  background: #e9ecef !important;
  box-shadow: 0 4px 10px rgba(35, 42, 52, .08);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.field-scope-bar::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.field-scope-bar[hidden] {
  display: none !important;
}

.field-scope-list {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 0;
  min-width: max-content;
}

.field-scope-tab {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: max-content;
  min-height: 44px !important;
  height: 44px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 20px !important;
  color: #5d646b !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  transform: none !important;
}

.field-scope-tab span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.field-scope-tab:hover {
  color: #333333 !important;
  background: #d8dde4 !important;
  box-shadow: none !important;
  transform: none !important;
}

.field-scope-tab.active {
  color: #20262d !important;
  background: #cfd6de !important;
}

.field-scope-bar .field-nav-empty {
  display: grid;
  place-items: center start;
  min-height: 44px;
  padding: 0 18px !important;
  color: #6f7780 !important;
  background: transparent !important;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .field-scope-bar {
    left: 0 !important;
    margin: 0 !important;
    padding: 0 14px;
  }

  .field-scope-tab {
    padding: 0 16px !important;
  }
}

body[data-view="fields"] main,
body[data-view="employment-detail"] main {
  padding-top: calc(var(--fixed-topbar-height) + 44px + 24px) !important;
}

.header-field-tabs .field-tab,
.header-field-tabs .field-tab:hover,
.header-field-tabs .field-tab.active,
.header-field-tabs .field-tab:focus-visible {
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}

.duo-block-chart {
  min-height: 480px !important;
  border: 1px solid #1a2b25 !important;
  background: #0d1714 !important;
}

.duo-block-chart-grouped {
  min-height: 680px !important;
  border-color: #101916 !important;
  background: #101916 !important;
}

.duo-block-tile {
  border: 1px solid #1a2c25 !important;
  border-radius: 0 !important;
  padding: 8px 9px !important;
  background: var(--tile-color) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .42);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06) !important;
}

.duo-block-tile strong {
  color: #ffffff !important;
  display: block !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  overflow-wrap: anywhere;
  word-break: break-word;
  -webkit-line-clamp: unset !important;
}

.duo-block-tile span {
  align-self: end;
  color: rgba(255, 255, 255, .94) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.duo-block-large strong {
  font-size: 19px !important;
}

.duo-block-large span {
  font-size: 14px !important;
}

.map-bar-chart {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.map-bar-chart-grouped {
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
}

.map-bar-group {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 0;
  border-top: 1px solid #e4e8ee;
  border-radius: 0;
  padding-top: 12px;
  background: #ffffff;
  box-shadow: none;
}

.map-bar-group:first-child {
  border-top: 0;
  padding-top: 0;
}

.map-bar-group-label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 24px;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0;
  color: #4d75a6 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 14px;
  font-weight: 900;
  text-align: left;
  transform: none !important;
}

.map-bar-group-label[data-drilldown-dimension] {
  cursor: pointer;
}

.map-bar-group-label[data-drilldown-dimension]:hover,
.map-bar-group-label[data-drilldown-dimension]:focus-visible {
  background: #f1f6fc !important;
  color: #2f5f96 !important;
  box-shadow: none !important;
}

.map-bar-group-label > span:not(.map-bar-group-tags) {
  grid-column: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.map-bar-group-label .map-bar-group-tags {
  grid-column: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  justify-self: end;
  min-width: 0;
  height: 20px;
}

.map-bar-group-label strong,
.map-bar-group-label em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  border: 1px solid #c8d8ea;
  border-radius: var(--radius-tag);
  height: 20px;
  padding: 0 8px;
  background: #f4f8fc;
  color: #365c72;
  font-size: 11px;
  font-style: normal;
  line-height: 1;
  text-align: right;
  white-space: nowrap;
}

.map-bar-group-label em {
  border-color: #d7e0ec;
  background: #ffffff;
  color: #617184;
}

.map-bar-rows {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  min-width: 0;
  gap: 8px;
  padding: 0;
}

.map-bar-row {
  grid-template-columns: minmax(0, 1fr) 48px;
  min-height: 54px;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 7px;
  padding: 4px 6px;
  background: transparent;
  transition:
    background-color var(--fast) var(--ease),
    border-color var(--fast) var(--ease);
}

.map-bar-chart > .map-bar-row {
  background: transparent;
}

.map-bar-row[data-drilldown-dimension] {
  cursor: pointer;
}

.map-bar-row[data-drilldown-dimension]:hover,
.map-bar-row[data-drilldown-dimension]:focus-visible {
  background: #f1f6fc;
  outline: 0;
}

.map-bar-label {
  min-width: 0;
  gap: 1px;
}

.map-bar-label strong {
  max-width: 100%;
  overflow: hidden;
  color: #2f3033;
  font-size: 13px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.map-bar-label span {
  color: #66717f;
  font-size: 11px;
  line-height: 1.15;
}

.map-radial-meter {
  position: relative;
  display: grid;
  place-items: center;
  justify-self: end;
  width: 46px;
  height: 46px;
  border: var(--meter-border, 2px) solid var(--meter-color, #21c768);
  border-radius: 50%;
  background: #ffffff !important;
  background-image: none !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--meter-color, #21c768) 24%, transparent),
    0 2px 5px rgba(29, 39, 51, .12);
}

.map-radial-meter::before {
  content: none;
}

.map-radial-meter span {
  position: relative;
  z-index: 1;
  max-width: 34px;
  overflow: hidden;
  color: #1d2733;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 780px) {
  .map-bar-chart {
    grid-template-columns: 1fr;
  }

  .map-bar-chart-grouped {
    grid-template-columns: 1fr;
  }

  .map-bar-group-label {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .map-bar-group-label > span:not(.map-bar-group-tags) {
    grid-column: 1;
  }

  .map-bar-group-label .map-bar-group-tags {
    grid-column: 2;
  }

  .map-bar-label strong {
    white-space: normal;
    line-height: 1.2;
  }
}

.employment-outcome-mix {
  display: grid;
  gap: 14px;
}

.employment-outcome-summary,
.employment-outcome-legend {
  display: grid;
  gap: 8px;
}

.employment-outcome-summary {
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
}

.unemployment-signal-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.employment-outcome-summary div {
  min-width: 0;
  border-bottom: 1px solid rgba(51, 65, 85, .18);
  padding: 0 0 8px;
}

.employment-outcome-summary div {
  display: grid;
  align-content: start;
  min-height: 74px;
}

.employment-outcome-summary span,
.employment-reason-label span,
.employment-reasons-head span {
  display: block;
  color: #5f6f82;
  font-size: 11px;
  font-weight: 800;
}

.employment-outcome-summary strong {
  display: block;
  margin-top: 3px;
  color: #283241;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}

.employment-outcome-summary em {
  display: block;
  margin-top: 6px;
  color: #7a8798;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.25;
}

.employment-outcome-summary .outcome-metric-difference {
  display: block;
  margin-top: 5px;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
}

.employment-outcome-summary .outcome-metric-difference.favorable {
  color: #16833a;
}

.employment-outcome-summary .outcome-metric-difference.unfavorable {
  color: #c0342b;
}

.employment-outcome-stack {
  display: flex;
  width: 100%;
  min-height: 42px;
  overflow: hidden;
  border: 1px solid #c8d5e4;
  background: #edf2f8;
}

.employment-outcome-subchart {
  display: grid;
  gap: 8px;
  padding-top: 4px;
}

.employment-outcome-subchart-head {
  display: flex;
  min-width: 0;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.employment-outcome-subchart-head strong {
  color: #314155;
  font-size: 12px;
  font-weight: 900;
}

.employment-outcome-subchart-head span {
  color: #6a7a8f;
  font-size: 10px;
  font-weight: 800;
}

.employment-outcome-segment {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  color: #ffffff;
  background: var(--outcome-color);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
  text-shadow: 0 1px 1px rgba(20, 28, 38, .35);
  white-space: normal;
}

.employment-satisfaction-overall {
  display: grid;
  gap: 7px;
  padding: 10px 12px;
  border-left: 3px solid #4094e8;
  background: #f4f8fe;
}

.employment-satisfaction-head {
  display: flex;
  min-width: 0;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.employment-satisfaction-head strong {
  min-width: 0;
  color: #283241;
  font-size: 13px;
  font-weight: 900;
}

.employment-satisfaction-head span {
  color: #283241;
  font-size: 18px;
  font-weight: 900;
  line-height: 1;
}

.employment-satisfaction-track {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e7eef7;
}

.employment-satisfaction-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--satisfaction-color);
}

.employment-satisfaction-overall em {
  color: #6a7a8f;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.employment-outcome-legend {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.postgraduate-outcome-legend {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.employment-outcome-legend-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 4px 7px;
  align-items: center;
  color: #314155;
  font-size: 11px;
  font-weight: 800;
}

.employment-outcome-legend-item i {
  width: 10px;
  height: 10px;
}

.employment-outcome-legend-item strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.employment-outcome-legend-item span,
.employment-outcome-legend-item b {
  font-weight: 900;
}

.employment-outcome-legend-item b {
  grid-column: 2 / 4;
  color: #6a7a8f;
  font-size: 10px;
}

.employment-outcome-detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.employment-reasons {
  display: grid;
  min-width: 0;
  gap: 8px;
}

.unemployment-signal-reason-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.employment-reasons-head,
.employment-reason-row,
.employment-reason-label {
  display: grid;
  gap: 8px;
  align-items: center;
}

.employment-reasons-head {
  grid-template-columns: minmax(0, 1fr) auto;
  border-left: 3px solid #3f8ee8;
  padding: 8px 10px;
  background: #f3f7fc;
}

.employment-reasons-head strong,
.employment-reason-label strong {
  min-width: 0;
  color: #283241;
  font-size: 12px;
  font-weight: 900;
}

.employment-reasons-head strong {
  color: #1f3147;
  font-size: 13px;
}

.employment-reasons-head span {
  color: #43546b;
  font-weight: 900;
}

.employment-reason-row {
  grid-template-columns: minmax(190px, .45fr) minmax(0, 1fr) 52px;
}

.employment-reason-label {
  grid-template-columns: minmax(0, 1fr) auto;
}

.employment-reason-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #edf2f8;
}

.employment-reason-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--reason-color);
}

.employment-reason-row b {
  color: #516175;
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.employment-signal-grid {
  display: grid;
  gap: 14px;
}

.employment-signal-rates {
  display: grid;
  grid-template-columns: repeat(var(--signal-card-count, 6), minmax(0, 1fr));
  gap: 10px;
}

.employment-signal-rates-without-offers {
  grid-template-columns: repeat(var(--signal-card-count, 4), minmax(0, 1fr));
}

.employment-signal-card {
  display: grid;
  min-width: 0;
  min-height: 86px;
  align-content: start;
  gap: 7px;
  border-bottom: 1px solid rgba(51, 65, 85, .18);
  padding-bottom: 10px;
}

.employment-signal-card span,
.employment-signal-card em {
  color: #5f6f82;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.employment-signal-card strong {
  color: #283241;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}

.employment-signal-card em {
  font-style: normal;
}

.employment-signal-track {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: #edf2f8;
}

.employment-signal-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--signal-color);
}

.employment-signal-reason-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.employment-signal-reasons {
  display: grid;
  min-width: 0;
  gap: 8px;
}

.employment-signal-reasons .employment-reason-row {
  grid-template-columns: minmax(120px, .95fr) minmax(90px, 1fr) 48px;
  gap: 8px;
}

.employment-signal-reasons .employment-reason-label strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1120px) {
  .employment-signal-rates,
  .employment-signal-reason-grid,
  .unemployment-signal-reason-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .employment-signal-rates,
  .employment-signal-reason-grid,
  .unemployment-signal-summary,
  .unemployment-signal-reason-grid,
  .employment-signal-reasons .employment-reason-row,
  .unemployment-signal-reason-grid .employment-reason-row {
    grid-template-columns: 1fr;
  }

  .employment-signal-reasons .employment-reason-row b,
  .unemployment-signal-reason-grid .employment-reason-row b {
    text-align: left;
  }
}

.employment-share-chart-match .rate-chart-row,
.employment-share-chart-match .employment-share-chart-head {
  grid-template-columns: minmax(130px, 1fr) minmax(72px, .85fr) 46px minmax(72px, .85fr) 46px minmax(72px, .85fr) 46px;
}

.employment-share-chart .job-match-track i {
  background: var(--share-color);
}

.employment-share-chart .job-match-value {
  color: #6f5a10;
}

.top-match-chart .rate-chart-track i,
.top-match-chart .match-track i,
.top-further-chart .rate-chart-track i,
.top-internship-chart .rate-chart-track i,
.employment-share-chart .job-match-track i {
  background: var(--share-color) !important;
}

.employment-reason-track i {
  background: var(--reason-color) !important;
}

#fieldEmploymentFurtherDegrees .bar-fill,
#fieldEmploymentFurtherCountries .bar-fill,
#employmentDetailFurtherDegrees .bar-fill,
#employmentDetailFurtherCountries .bar-fill,
#fieldFurtherDegrees .bar-fill {
  border-radius: inherit;
  background: var(--bar-color) !important;
}

.bar-row.bar-row-colored .bar-fill {
  border-radius: inherit;
  background: var(--bar-color) !important;
}

.degree-split-stack .degree-split-segment:first-child {
  border-radius: 999px 0 0 999px;
}

.degree-split-stack .degree-split-segment:last-child {
  border-radius: 0 999px 999px 0;
}

.degree-split-stack .degree-split-segment:only-child {
  border-radius: 999px;
}

.gpa-outcome-heatmap {
  --heatmap-row-label-width: 126px;
  width: 100%;
  min-width: 0 !important;
  gap: 0 !important;
  padding: 0 !important;
}

.gpa-heatmap-average {
  display: block;
  min-height: 0;
  margin-top: 2px;
  padding: 0;
  color: #607086;
  background: transparent;
  text-align: center;
}

.gpa-heatmap-corner-label {
  display: block;
}

.gpa-heatmap-average span {
  color: inherit;
  font-size: 7px;
  font-weight: 800;
  line-height: 1;
}

.gpa-heatmap-average strong {
  color: #40566d;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

.gpa-outcome-heatmap .heatmap-row {
  grid-template-columns: minmax(108px, var(--heatmap-row-label-width)) repeat(var(--cols), minmax(0, 1fr)) !important;
  gap: 0 !important;
}

.gpa-outcome-heatmap .heatmap-axis-label,
.gpa-outcome-heatmap .heatmap-cell {
  min-height: 42px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 6px 7px !important;
  cursor: default !important;
}

.gpa-outcome-heatmap .heatmap-corner,
.gpa-outcome-heatmap .heatmap-column-label,
.gpa-outcome-heatmap .heatmap-row-label {
  color: #333333 !important;
  background: #f3f5f7 !important;
  text-shadow: none !important;
}

.gpa-outcome-heatmap .heatmap-corner,
.gpa-outcome-heatmap .heatmap-column-label {
  min-height: 44px !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  text-align: center !important;
}

.gpa-outcome-heatmap .heatmap-corner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.gpa-outcome-heatmap .heatmap-row-label {
  min-height: 42px !important;
  justify-content: flex-end !important;
  text-align: right !important;
}

.gpa-outcome-heatmap .heatmap-cell {
  color: var(--heatmap-text, #ffffff) !important;
  background: var(--heatmap-fill, #60a076) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .28) !important;
}

.gpa-outcome-heatmap .heatmap-cell strong {
  font-size: 13px !important;
  line-height: 1 !important;
}

.gpa-heatmap-label {
  gap: 1px !important;
}

.gpa-heatmap-label strong {
  font-size: 12px !important;
  line-height: 1.05 !important;
}

.gpa-heatmap-label em {
  color: #66717f !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

.gpa-outcome-heatmap .heatmap-cell-empty {
  color: #66717f !important;
  background: #e8ecf0 !important;
  text-shadow: none !important;
}

.gpa-outcome-heatmap .heatmap-cell:not(.heatmap-cell-empty):hover {
  border-color: transparent !important;
  box-shadow: none !important;
  cursor: default !important;
  filter: none !important;
  transform: none !important;
}

.skill-development-heatmap {
  --heatmap-row-label-width: 190px;
  width: 100%;
  min-width: 0 !important;
  gap: 0 !important;
  padding: 0 !important;
}

.skill-development-heatmap .heatmap-row {
  grid-template-columns: minmax(150px, var(--heatmap-row-label-width)) repeat(var(--cols), minmax(0, 1fr)) !important;
  gap: 0 !important;
}

.skill-development-heatmap .heatmap-column-label {
  justify-content: center !important;
  text-align: center !important;
}

.skill-development-heatmap .heatmap-row-label {
  justify-content: flex-end !important;
  text-align: right !important;
}

.skill-development-heatmap .heatmap-axis-label,
.skill-development-heatmap .heatmap-cell {
  min-height: 42px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 6px 7px !important;
  cursor: default !important;
}

.skill-development-heatmap .heatmap-corner,
.skill-development-heatmap .heatmap-column-label,
.skill-development-heatmap .heatmap-row-label {
  color: #333333 !important;
  background: #f3f5f7 !important;
  text-shadow: none !important;
}

.skill-development-heatmap .heatmap-corner,
.skill-development-heatmap .heatmap-column-label {
  min-height: 44px !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  text-align: center !important;
}

.skill-development-heatmap .heatmap-cell {
  color: var(--heatmap-text, #ffffff) !important;
  background: var(--heatmap-fill, #60a076) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .28) !important;
}

.skill-development-heatmap .heatmap-cell strong {
  font-size: 13px !important;
  line-height: 1 !important;
}

.skill-development-heatmap .heatmap-cell-empty {
  color: #66717f !important;
  background: #e8ecf0 !important;
  text-shadow: none !important;
}

.skill-development-heatmap .heatmap-cell:not(.heatmap-cell-empty):hover {
  border-color: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

@media (max-width: 900px) {
  .employment-outcome-summary,
.employment-outcome-legend,
.employment-outcome-detail {
    grid-template-columns: 1fr 1fr;
  }

  .employment-outcome-detail {
    gap: 14px;
  }
}

@media (max-width: 640px) {
  .employment-outcome-summary,
.employment-outcome-legend,
.employment-outcome-detail,
.employment-reason-row {
    grid-template-columns: 1fr;
  }

  .employment-reason-row b {
    text-align: left;
  }
}

.priority-row {
  border: 1px solid #e4e8ee;
  border-radius: 8px;
  background: #ffffff;
}

.priority-copy span {
  color: #66717f;
  font-size: 12px;
}

.funnel-rate-chart {
  display: grid;
  max-width: 980px;
  gap: 10px;
}

.funnel-rate-head,
.funnel-rate-row {
  display: grid;
  grid-template-columns: minmax(190px, 280px) minmax(240px, 420px) 72px 108px;
  align-items: center;
  gap: 14px;
  justify-content: start;
}

.funnel-rate-head {
  color: #66717f;
  font-size: 13px;
  text-transform: uppercase;
}

.funnel-rate-head strong {
  font-weight: 900;
}

.funnel-rate-row {
  min-height: 46px;
}

.funnel-rate-meta {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.funnel-rate-meta strong {
  min-width: 0;
  overflow: hidden;
  color: #2f3033;
  font-size: 17px;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.funnel-rate-meta span {
  color: #66717f;
  font-size: 13px;
  line-height: 1.15;
}

.funnel-rate-meta .funnel-rate-secondary {
  color: #516175;
  font-size: 12px;
  font-weight: 850;
}

.funnel-rate-track {
  position: relative;
  height: 13px;
  overflow: hidden;
  border-radius: 999px;
  background: #ebeff4;
  box-shadow: inset 0 1px 2px rgba(29, 39, 51, .08);
}

.funnel-rate-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--funnel-color, #21c768);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24);
}

.funnel-rate-track .funnel-rate-overlay {
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 2;
  background: var(--funnel-overlay-color, #21c768);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    inset 0 0 0 1px rgba(15, 23, 42, .08);
}

.funnel-rate-value {
  color: #2f3033;
  font-size: 16px;
  text-align: right;
}

.funnel-drop-value {
  display: inline-flex;
  min-height: 34px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 4px 8px;
  border: 1px solid color-mix(in srgb, var(--funnel-drop-color, #21c768) 32%, #ffffff);
  border-radius: var(--radius-tag);
  background: color-mix(in srgb, var(--funnel-drop-color, #21c768) 12%, #ffffff);
  color: color-mix(in srgb, var(--funnel-drop-color, #21c768) 82%, #1d2733);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
}

.funnel-drop-value small {
  display: block;
  max-width: 100%;
  overflow: hidden;
  font-size: 8px;
  font-weight: 800;
  line-height: 1;
  opacity: .72;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.funnel-drop-value.muted {
  border-color: #dde5ee;
  background: #f4f7fa;
  color: #66717f;
}

.field-hero.field-hero-with-funnel {
  grid-template-columns: minmax(280px, .58fr) minmax(700px, 1.42fr) !important;
  align-items: center !important;
}

.field-hero-funnel {
  display: grid;
  min-width: 0;
  gap: 10px;
  align-content: center;
}

.field-hero-funnel .funnel-rate-chart {
  max-width: none;
  gap: 9px;
}

.field-hero-funnel .funnel-rate-head,
.field-hero-funnel .funnel-rate-row {
  grid-template-columns: minmax(150px, 210px) minmax(220px, 1fr) 64px 112px;
  gap: 10px;
}

.field-hero-funnel .funnel-rate-row {
  min-height: 38px;
}

.field-hero-funnel .funnel-rate-meta {
  gap: 1px;
}

.field-hero-funnel .funnel-rate-meta strong {
  font-size: 14px;
  line-height: 1.05;
}

.field-hero-funnel .funnel-rate-meta span {
  font-size: 12px;
}

.field-hero-funnel .funnel-rate-head {
  font-size: 11px;
}

.field-hero-funnel .funnel-rate-track {
  height: 12px;
}

.field-hero-funnel .funnel-rate-value {
  font-size: 13px;
}

.field-hero-funnel .funnel-drop-value {
  min-height: 30px;
  padding: 3px 8px;
  font-size: 11px;
}

.priority-copy strong {
  min-width: 0;
  overflow: hidden;
  color: #1d2733;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.priority-track {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9eef4;
  box-shadow: inset 0 1px 2px rgba(29, 39, 51, .08);
}

.priority-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24);
}

.priority-track i { background: var(--priority-color, #21c768); }

.funnel-retention {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border: 1px solid color-mix(in srgb, var(--funnel-retention, #21c768) 35%, #ffffff);
  border-radius: var(--radius-tag);
  background: color-mix(in srgb, var(--funnel-retention, #21c768) 12%, #ffffff);
  color: color-mix(in srgb, var(--funnel-retention, #21c768) 78%, #1d2733);
  font-size: 12px;
  font-weight: 800;
}

.funnel-retention.muted {
  border-color: #dde5ee;
  background: #f4f7fa;
  color: #66717f;
}

.equity-chart {
  display: grid;
  gap: 8px;
  overflow-x: auto;
}

.equity-chart-head,
.equity-chart-row {
  display: grid;
  grid-template-columns: minmax(160px, .9fr) 78px repeat(4, minmax(140px, 1fr));
  min-width: 900px;
  align-items: center;
  gap: 12px;
}

.equity-chart-head {
  padding: 0 10px;
  color: #66717f;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.equity-chart-row {
  padding: 10px;
  border: 1px solid #e4e8ee;
  border-radius: 8px;
  background: #ffffff;
}

.local-segment-equity-chart .equity-chart-head,
.local-segment-equity-chart .equity-chart-row {
  min-width: 0;
  gap: 8px;
}

.local-segment-equity-chart .equity-chart-head {
  padding-inline: 8px;
  font-size: 9px;
  line-height: 1.1;
}

.local-segment-equity-chart .equity-chart-row {
  padding: 8px;
}

.local-segment-equity-chart .equity-metric {
  grid-template-columns: minmax(42px, 1fr) 38px;
  gap: 4px;
}

.local-segment-equity-chart .equity-metric b,
.local-segment-equity-chart .equity-records {
  font-size: 12px;
}

.local-segment-equity-chart .equity-segment strong {
  font-size: 13px;
}

.equity-segment {
  display: grid;
  min-width: 0;
}

.equity-segment strong {
  min-width: 0;
  overflow: hidden;
  color: #1d2733;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.equity-records {
  color: #2f3033;
  font-size: 14px;
}

.segment-signal-value {
  color: #1d2733;
  font-size: 13px;
  text-align: left;
}

.equity-metric {
  display: grid;
  grid-template-columns: minmax(70px, 1fr) 48px;
  align-items: center;
  gap: 8px;
}

.equity-metric b {
  color: #1d2733;
  font-size: 13px;
  text-align: right;
}

.equity-track {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9eef4;
  box-shadow: inset 0 1px 2px rgba(29, 39, 51, .08);
}

.equity-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--equity-color, #21c768);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24);
}

.degree-split-chart {
  display: grid;
  gap: 12px;
}

.degree-split-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: flex-end;
  color: #5b6878;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.degree-split-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.degree-split-legend i {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}

.degree-split-legend i.ku,
.degree-split-segment.ku {
  background: #16a34a;
}

.degree-split-legend i.other,
.degree-split-segment.other {
  background: #4477c9;
}

#fieldFurtherPanel .degree-split-legend i.other,
#fieldFurtherPanel .degree-split-segment.other {
  background: #ef2935;
}

.degree-split-legend i.current-outside,
.degree-split-segment.current-outside {
  background: #ef8f23;
}

.degree-split-legend i.current-uae,
.degree-split-segment.current-uae {
  background: #3f8ee8;
}

.degree-split-legend i.current-ku,
.degree-split-segment.current-ku {
  background: #16a34a;
}

.degree-split-label {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.degree-split-label strong {
  min-width: 0;
  overflow: hidden;
  color: #2f3033;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.degree-split-label span {
  min-width: 0;
  overflow: hidden;
  color: #66717f;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.degree-split-track {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9eef4;
}

.degree-split-stack {
  display: flex;
  height: 100%;
  overflow: hidden;
  border-radius: inherit;
}

.degree-split-segment {
  display: block;
  height: 100%;
}

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

.priority-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.3fr) minmax(150px, 1fr) 92px auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
}

.priority-row.is-empty {
  opacity: .64;
}

.priority-copy,
.priority-metric {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.priority-metric {
  justify-items: end;
}

.priority-metric strong {
  color: #1d2733;
  font-size: 18px;
  line-height: 1;
}

.priority-metric span {
  color: #66717f;
  font-size: 12px;
}

.missing-summary-copy em {
  color: #66717f;
  font-size: 12px;
  font-style: normal;
}

@media (max-width: 900px) {
  .field-hero.field-hero-with-funnel {
    grid-template-columns: 1fr !important;
  }

  .funnel-rate-head,
  .funnel-rate-row {
    grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) 68px 96px;
  }

  .priority-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .priority-metric {
    justify-items: start;
  }
}

.panel-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-left: auto;
}

.panel-actions .status-pill,
.panel-actions .icon-button {
  height: 36px;
}

.panel-actions .status-pill {
  min-height: 36px;
  padding-block: 0;
}

.icon-button.is-downloading .icon {
  opacity: .75;
  transform: translateY(1px);
}

.dashboard-report-stage {
  position: fixed;
  z-index: -1;
  top: 0;
  left: -200vw;
  width: 1120px;
  overflow: hidden;
  pointer-events: none;
}

.dashboard-pdf-report {
  display: grid;
  width: 1120px;
  gap: 14px;
  padding: 0;
  background: #ffffff;
  color: #1d2733;
}

.dashboard-pdf-report,
.dashboard-pdf-report * {
  animation: none !important;
  transition: none !important;
}

.dashboard-pdf-report * {
  scrollbar-width: none;
}

.dashboard-pdf-report *::-webkit-scrollbar {
  display: none;
}

.dashboard-pdf-report .dashboard-report-cover {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
  gap: 18px;
  align-items: start;
  padding: 22px;
  border: 1px solid #d9e2ee;
  border-radius: var(--radius-panel);
  background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%);
  color: #1d2733;
}

.dashboard-pdf-report .dashboard-report-cover span {
  display: block;
  color: #4b76aa;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dashboard-pdf-report .dashboard-report-cover h1 {
  margin: 7px 0 8px;
  color: #1d2733;
  font-size: 30px;
  line-height: 1.08;
}

.dashboard-pdf-report .dashboard-report-cover p {
  margin: 0;
  color: #5d6b7c;
  font-size: 14px;
  font-weight: 750;
}

.dashboard-pdf-report .dashboard-report-cover dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
}

.dashboard-pdf-report .dashboard-report-cover dl div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid #e1e8f1;
  border-radius: var(--radius-tag);
  background: #ffffff;
}

.dashboard-pdf-report .dashboard-report-cover dt {
  color: #6a7687;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.dashboard-pdf-report .dashboard-report-cover dd {
  min-width: 0;
  margin: 3px 0 0;
  overflow: hidden;
  color: #1d2733;
  font-size: 12px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-pdf-report .dashboard-report-filter-panel {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid #d9e2ee;
  border-radius: var(--radius-panel);
  background: #f8fafc;
}

.dashboard-pdf-report .dashboard-report-filter-panel h3 {
  margin: 0;
  color: #1d2733;
  font-size: 14px;
}

.dashboard-pdf-report .dashboard-report-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.dashboard-pdf-report .dashboard-report-filter-chip {
  min-height: 28px;
  border: 1px solid #cbd7e6;
  border-radius: var(--radius-tag);
  padding: 5px 10px;
  color: #2f455f;
  background: #ffffff;
  font-size: 12px;
  font-weight: 800;
}

.dashboard-pdf-report .dashboard-report-card-block,
.dashboard-pdf-report .dashboard-report-panel-head {
  display: grid;
  min-width: 0;
  max-width: 100%;
  overflow: visible !important;
}

.dashboard-pdf-report .dashboard-report-card-block[data-report-chunk="row-chart"] .display-card {
  align-content: start;
}

.dashboard-pdf-report .panel {
  margin: 0;
  box-shadow: none;
}

.dashboard-pdf-report .panel:hover,
.dashboard-pdf-report .display-card:hover,
.dashboard-pdf-report .chart-block:hover {
  border-color: #d9e2ee;
  box-shadow: none;
  transform: none;
}

.dashboard-pdf-report .field-hero,
.dashboard-pdf-report .panel,
.dashboard-pdf-report .display-card,
.dashboard-pdf-report .chart-block {
  width: 100%;
  max-width: 100%;
  overflow: visible !important;
  border-color: #d9e2ee;
  background: #ffffff;
  color: #1d2733;
  box-shadow: none;
}


.dashboard-pdf-report .panel-head {
  margin: 0;
  border-color: #d9e2ee;
  background: #f8fafc;
}

.dashboard-pdf-report .panel-head h2,
.dashboard-pdf-report .display-card h3,
.dashboard-pdf-report .chart-block h3 {
  color: #1d2733;
}

.dashboard-pdf-report .status-pill {
  border-color: #cbd7e6;
  color: #2f455f;
  background: #ffffff;
}

.dashboard-pdf-report .field-hero {
  grid-template-columns: minmax(240px, .48fr) minmax(0, 1.52fr) !important;
}

.dashboard-pdf-report .field-hero-copy h2,
.dashboard-pdf-report .field-hero h2 {
  color: #1d2733;
}

.dashboard-pdf-report .field-hero-copy p,
.dashboard-pdf-report .field-hero p {
  color: #536174;
}

.dashboard-pdf-report .rate-chart,
.dashboard-pdf-report .share-chart,
.dashboard-pdf-report .top-match-chart,
.dashboard-pdf-report .top-further-chart,
.dashboard-pdf-report .top-internship-chart,
.dashboard-pdf-report .internship-risk-chart,
.dashboard-pdf-report .degree-split-chart,
.dashboard-pdf-report .chart-search-results,
.dashboard-pdf-report .equity-chart,
.dashboard-pdf-report .heatmap,
.dashboard-pdf-report .heatmap-scroll,
.dashboard-pdf-report .gpa-outcome-heatmap,
.dashboard-pdf-report .skill-development-heatmap,
.dashboard-pdf-report .contact-method-chart {
  width: 100%;
  max-width: 100%;
  min-width: 0 !important;
  overflow: visible !important;
}

.dashboard-pdf-report .heatmap-scroll {
  padding-bottom: 0 !important;
}

.dashboard-pdf-report .equity-chart {
  gap: 7px;
}

.dashboard-pdf-report .equity-chart-head,
.dashboard-pdf-report .equity-chart-row {
  grid-template-columns: minmax(118px, 1.05fr) 52px 64px repeat(5, minmax(72px, .78fr)) !important;
  min-width: 0 !important;
  gap: 8px;
}

.dashboard-pdf-report .equity-chart-head {
  font-size: 10px;
}

.dashboard-pdf-report .equity-chart-row {
  padding: 9px;
}

.dashboard-pdf-report .equity-segment strong {
  font-size: 13px;
}

.dashboard-pdf-report .equity-records,
.dashboard-pdf-report .segment-signal-value,
.dashboard-pdf-report .equity-metric b {
  font-size: 11px;
}

.dashboard-pdf-report .equity-metric {
  grid-template-columns: minmax(34px, 1fr) 36px;
  gap: 5px;
}

.dashboard-pdf-report .top-match-chart.has-sector-column .rate-chart-row,
.dashboard-pdf-report .top-match-chart.has-sector-column .top-match-chart-head {
  grid-template-columns: minmax(190px, 1.25fr) minmax(92px, .8fr) 42px minmax(92px, .8fr) 42px minmax(118px, .85fr) !important;
}

.dashboard-pdf-report .top-internship-chart .rate-chart-row,
.dashboard-pdf-report .top-internship-chart .top-internship-chart-head,
.dashboard-pdf-report .internship-risk-chart .rate-chart-row,
.dashboard-pdf-report .internship-risk-chart .internship-risk-chart-head {
  gap: 6px !important;
}

.dashboard-pdf-report .top-internship-chart.has-satisfaction.has-current-employer .rate-chart-row,
.dashboard-pdf-report .top-internship-chart.has-satisfaction.has-current-employer .top-internship-chart-head,
.dashboard-pdf-report .internship-risk-chart .rate-chart-row,
.dashboard-pdf-report .internship-risk-chart .internship-risk-chart-head {
  grid-template-columns: minmax(170px, 1.08fr) repeat(5, minmax(82px, .78fr) 50px) !important;
}

.dashboard-pdf-report .top-internship-chart.has-satisfaction:not(.has-current-employer) .rate-chart-row,
.dashboard-pdf-report .top-internship-chart.has-satisfaction:not(.has-current-employer) .top-internship-chart-head,
.dashboard-pdf-report .top-internship-chart.has-current-employer:not(.has-satisfaction) .rate-chart-row,
.dashboard-pdf-report .top-internship-chart.has-current-employer:not(.has-satisfaction) .top-internship-chart-head {
  grid-template-columns: minmax(180px, 1.12fr) repeat(4, minmax(94px, .86fr) 50px) !important;
}

.dashboard-pdf-report .top-internship-chart:not(.has-satisfaction):not(.has-current-employer) .rate-chart-row,
.dashboard-pdf-report .top-internship-chart:not(.has-satisfaction):not(.has-current-employer) .top-internship-chart-head {
  grid-template-columns: minmax(180px, 1.12fr) repeat(3, minmax(104px, .92fr) 50px) !important;
}

.dashboard-pdf-report .top-match-chart .rate-chart-value,
.dashboard-pdf-report .top-further-chart .rate-chart-value,
.dashboard-pdf-report .top-internship-chart .rate-chart-value,
.dashboard-pdf-report .internship-risk-chart .rate-chart-value {
  font-size: 11px;
}

.dashboard-pdf-report .field-records-panel,
.dashboard-pdf-report .map-bar-chart,
.dashboard-pdf-report .map-bar-chart-grouped,
.dashboard-pdf-report .duo-block-chart,
.dashboard-pdf-report .duo-block-chart-grouped,
.dashboard-pdf-report .block-search,
.dashboard-pdf-report .chart-search,
.dashboard-pdf-report .chart-info-icon,
.dashboard-pdf-report .record-toolbar,
.dashboard-pdf-report .table-wrap,
.dashboard-pdf-report .detail-pane,
.dashboard-pdf-report button,
.dashboard-pdf-report input {
  display: none !important;
}

.dashboard-pdf-report [hidden] {
  display: none !important;
}

/* A tooltip's focused datum stays vivid; every other chart datum fades to one neutral tone. */
:root {
  --chart-focus-muted: #d5dce5;
  --chart-focus-fade-duration: 280ms;
}

[data-chart-tooltip],
[data-chart-tooltip] > i,
[data-chart-tooltip] > b,
[data-chart-tooltip] > span,
[data-chart-tooltip] .bar-fill,
[data-chart-tooltip] .degree-split-segment {
  transition:
    background-color var(--chart-focus-fade-duration) var(--ease),
    border-color var(--chart-focus-fade-duration) var(--ease),
    box-shadow var(--chart-focus-fade-duration) var(--ease),
    color var(--chart-focus-fade-duration) var(--ease),
    fill var(--chart-focus-fade-duration) var(--ease),
    filter var(--chart-focus-fade-duration) var(--ease),
    opacity var(--chart-focus-fade-duration) var(--ease),
    stroke var(--chart-focus-fade-duration) var(--ease),
    transform var(--chart-focus-fade-duration) var(--ease),
    width 420ms var(--ease) !important;
}

.is-chart-item-dimmed:is(
  .heatmap-cell,
  .employment-outcome-segment,
  .contact-depth-stack span
) {
  background: var(--chart-focus-muted) !important;
  color: #586575 !important;
  text-shadow: none !important;
}

/* Override the source color tokens as well as the painted background. This wins
   over chart-specific ID rules and inline stock-scale colors. */
.is-chart-item-dimmed,
.is-chart-item-dimmed > :is(i, b, span, .bar-fill, .degree-split-stack),
.is-chart-item-dimmed .degree-split-segment {
  --bar-color: var(--chart-focus-muted) !important;
  --contact-color: var(--chart-focus-muted) !important;
  --equity-color: var(--chart-focus-muted) !important;
  --funnel-color: var(--chart-focus-muted) !important;
  --heatmap-fill: var(--chart-focus-muted) !important;
  --outcome-color: var(--chart-focus-muted) !important;
  --priority-color: var(--chart-focus-muted) !important;
  --reason-color: var(--chart-focus-muted) !important;
  --satisfaction-color: var(--chart-focus-muted) !important;
  --share-color: var(--chart-focus-muted) !important;
  --signal-color: var(--chart-focus-muted) !important;
}

body.has-focused-chart-item .contact-method-label i,
body.has-focused-chart-item .contact-depth-legend i,
body.has-focused-chart-item .employment-outcome-legend-item i,
body.has-focused-chart-item .degree-split-legend i {
  --contact-color: var(--chart-focus-muted) !important;
  --series-color: var(--chart-focus-muted) !important;
  background: var(--chart-focus-muted) !important;
  border-color: var(--chart-focus-muted) !important;
  box-shadow: none !important;
  transition:
    background-color var(--chart-focus-fade-duration) var(--ease),
    border-color var(--chart-focus-fade-duration) var(--ease),
    box-shadow var(--chart-focus-fade-duration) var(--ease) !important;
}

body.has-focused-chart-item .contact-method-row:has(.is-chart-item-focused) .contact-method-label i {
  background: var(--contact-source-color) !important;
}

.is-chart-item-dimmed:is(
  .bar-track,
  .degree-split-track,
  .rate-chart-track,
  .funnel-rate-track,
  .equity-track,
  .priority-track,
  .employment-reason-track,
  .employment-signal-track,
  .internship-risk-reason-track,
  .employment-satisfaction-track,
  .contact-method-track
) > :is(i, b, span, .bar-fill, .degree-split-stack),
.is-chart-item-dimmed .degree-split-segment {
  background: var(--chart-focus-muted) !important;
  background-image: none !important;
  color: #586575 !important;
  text-shadow: none !important;
}

.map-radial-meter.is-chart-item-dimmed {
  --meter-color: var(--chart-focus-muted) !important;
  border-color: var(--chart-focus-muted) !important;
  box-shadow: 0 0 0 1px rgba(213, 220, 229, .42), 0 2px 5px rgba(29, 39, 51, .08) !important;
}

svg .is-chart-item-dimmed:not(.radar-hit) {
  fill: var(--chart-focus-muted) !important;
  stroke: var(--chart-focus-muted) !important;
}

.is-chart-item-focused {
  filter: none !important;
  opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  [data-chart-tooltip],
[data-chart-tooltip] > i,
[data-chart-tooltip] > b,
[data-chart-tooltip] > span,
[data-chart-tooltip] .bar-fill,
[data-chart-tooltip] .degree-split-segment,
.contact-method-label i,
.contact-depth-legend i,
.employment-outcome-legend-item i,
.degree-split-legend i {
    transition: none !important;
  }
}

/* Shared platform dropdowns — match input chrome and apply everywhere. */
@keyframes ui-select-menu-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ui-select {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}

.filter-select-native,
.ui-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.ui-select-trigger {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 16px;
  gap: 8px;
  align-items: center;
  width: 100%;
  min-height: 38px;
  border: 1px solid #cbd3dc !important;
  border-radius: 0 !important;
  padding: 8px 10px !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  text-align: left;
  font-weight: 600 !important;
  cursor: pointer;
}

.ui-select-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-select-chevron {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #666f78;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 160ms cubic-bezier(.2, .7, .2, 1), stroke 160ms ease;
}

.ui-select-trigger:hover {
  border-color: #aebbc8 !important;
  color: #222222 !important;
  background: #f8f9fa !important;
}

.ui-select.open .ui-select-trigger,
.ui-select-trigger:focus-visible {
  border-color: #3f8ee8 !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 2px rgba(63, 142, 232, .2) !important;
}

.ui-select.open .ui-select-chevron {
  stroke: #3f8ee8;
  transform: rotate(180deg);
}

.ui-select.is-disabled .ui-select-trigger {
  opacity: .6;
  cursor: not-allowed;
  background: #f8f9fa !important;
}

.ui-select-menu,
.filter-select-menu {
  position: absolute;
  z-index: 80;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 240px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid #cbd3dc !important;
  border-radius: 0 !important;
  padding: 4px !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: 0 10px 24px rgba(30, 40, 55, .14) !important;
  transform-origin: top center;
}

.ui-select.open .ui-select-menu:not([hidden]),
.filter-select.open .filter-select-menu:not([hidden]) {
  animation: ui-select-menu-in 150ms cubic-bezier(.2, .7, .2, 1);
}

.ui-select-option,
.filter-select-option {
  display: block;
  width: 100%;
  min-height: 34px;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 8px 10px !important;
  color: #333333 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600 !important;
  cursor: pointer;
}

.filter-select-menu[aria-multiselectable="true"] .filter-select-option {
  display: flex !important;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}

.filter-select-menu[aria-multiselectable="true"] .filter-select-option-label {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.filter-select-menu[aria-multiselectable="true"] .filter-select-check-slot {
  display: inline-flex;
  flex: 0 0 14px;
  align-items: center;
  justify-content: center;
  align-self: center;
  margin-inline-start: auto;
  width: 14px;
  height: 14px;
  line-height: 0;
}

.filter-select-menu[aria-multiselectable="true"] .filter-select-check {
  display: block;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: none !important;
}

.ui-select-option:hover,
.filter-select-option:hover {
  color: #1f5d9d !important;
  background: #edf6ff !important;
  transform: none !important;
}

.ui-select-option[aria-selected="true"],
.filter-select-option[aria-selected="true"] {
  color: #1f5d9d !important;
  background: #e8f2fc !important;
}

.ui-select-option:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* Admin AI settings — match light console / employment page components. */
#admin .panel {
  max-width: 720px;
  margin: 0 auto;
}

#admin .admin-config-layout {
  display: grid;
  gap: 0;
}

#admin .admin-settings-section {
  border: 0 !important;
  border-radius: 0 !important;
  color: #333333 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#admin .alumni-freshness-settings {
  margin-top: 22px;
  padding-top: 20px !important;
  border-top: 1px solid #d9dde2 !important;
}

#admin .admin-settings-heading {
  margin-bottom: 12px;
}

#admin .admin-settings-heading h3,
#admin .admin-settings-heading p {
  margin: 0;
}

#admin .admin-settings-heading h3 {
  color: #333333;
  font-size: 17px;
}

#admin .admin-settings-heading p {
  margin-top: 3px;
  color: #66717f !important;
  font-size: 11px;
}

#admin .admin-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
}

#admin .admin-form-simple {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#admin .admin-form label {
  display: grid;
  gap: 6px;
  color: #555555 !important;
  font-size: 12px;
  font-weight: 700;
}

#admin .admin-form .field-help {
  color: #6b7480;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
}

#admin .admin-form input {
  width: 100%;
  min-height: 38px;
  border: 1px solid #cbd3dc !important;
  border-radius: 0 !important;
  padding: 8px 10px;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-weight: 600;
}

#admin .admin-form input:hover {
  border-color: #aebbc8 !important;
  background: #f8f9fa !important;
}

#admin .admin-form input:focus {
  outline: none;
  border-color: #3f8ee8 !important;
  box-shadow: 0 0 0 2px rgba(63, 142, 232, .2) !important;
}

#admin .admin-toggle-field {
  display: flex !important;
  align-items: flex-start;
  gap: 9px !important;
  padding: 10px;
  border: 1px solid #d9dde2;
  background: #f8fafc;
  cursor: pointer;
}

#admin .admin-toggle-field input {
  flex: 0 0 auto;
  width: 17px !important;
  min-height: 17px !important;
  height: 17px;
  margin: 1px 0 0;
  padding: 0;
}

#admin .admin-toggle-field > span {
  display: grid;
  gap: 2px;
}

#admin .admin-toggle-field strong {
  color: #333333;
  font-size: 12px;
}

#admin .admin-toggle-field small,
#admin .alumni-freshness-summary {
  color: #66717f;
  font-size: 10px;
  font-weight: 550;
  line-height: 1.4;
}

#admin .alumni-freshness-summary {
  margin: -2px 0 0;
}

.alumni-automation-scope {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 11px !important;
  border: 1px solid #d9dde2 !important;
  background: #f8fafc;
}

.alumni-automation-scope legend {
  padding: 0 4px;
  color: #333333;
  font-size: 12px;
  font-weight: 750;
}

.alumni-automation-scope > p,
.alumni-automation-scope > small {
  margin: 0;
  color: #66717f;
  font-size: 10px;
  font-weight: 550;
  line-height: 1.4;
}

.alumni-automation-scope > label {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 7px !important;
  cursor: pointer;
}

.alumni-automation-scope > label input,
.alumni-semester-options input {
  width: 15px !important;
  min-height: 15px !important;
  height: 15px;
  margin: 0;
  padding: 0;
}

.alumni-semester-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px 12px;
  max-height: 190px;
  overflow-y: auto;
  padding: 8px;
  border: 1px solid #dfe4e9;
  background: #ffffff;
}

.alumni-semester-options label {
  display: grid !important;
  grid-template-columns: 15px minmax(0, 1fr) auto !important;
  align-items: center;
  gap: 6px !important;
  color: #3e4854 !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  cursor: pointer;
}

.alumni-semester-options label small {
  color: #7b8490;
  font-size: 9px;
}

.alumni-semester-options input:disabled + span {
  color: #9aa2aa;
}

#admin .admin-form .ui-select {
  width: 100%;
}

#admin .admin-form .ui-select-trigger {
  min-height: 38px;
}

#admin .admin-form-full,
#admin .admin-form-actions {
  grid-column: 1 / -1;
}

#admin .admin-form-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
}

#admin .admin-form-actions button {
  min-height: 38px;
  border: 1px solid #3f8ee8 !important;
  border-radius: 0 !important;
  padding: 8px 16px;
  color: #ffffff !important;
  background: #3f8ee8 !important;
  font-weight: 700 !important;
  cursor: pointer;
}

#admin .admin-form-actions button:hover {
  border-color: #2f7ad0 !important;
  background: #2f7ad0 !important;
  color: #ffffff !important;
}

#aiSaveStatus,
#alumniFreshnessSaveStatus {
  color: #666f78 !important;
  font-size: 13px;
}

@media (max-width: 780px) {
  #admin .admin-form,
  #admin .admin-form-simple {
    grid-template-columns: 1fr;
  }

  #admin .admin-form-actions {
    flex-direction: column;
    align-items: stretch;
  }

  #admin .admin-form-actions button {
    width: 100%;
  }
}

/* Snapshot and file history carry lineage metadata, so let these tables
   scroll horizontally instead of wrapping every cell. */
#snapshotHistory > table,
#importHistory > table {
  width: max-content;
  min-width: 1180px;
}

#snapshotHistory th,
#snapshotHistory td,
#importHistory th,
#importHistory td {
  white-space: nowrap;
  overflow-wrap: normal;
}



#snapshotHistory th:nth-child(5),
#snapshotHistory td:nth-child(5),
#importHistory th:nth-child(5),
#importHistory td:nth-child(5) {
  min-width: 360px;
  white-space: normal;
}

/* Undergraduate-to-postgraduate pathway heatmap axes and long major labels. */
.heatmap-axis-frame.pathway-heatmap {
  position: relative;
  display: grid;
  grid-template-columns: 30px 205px minmax(0, 1fr);
  grid-template-areas:
    "y-axis . x-axis"
    "y-axis map map";
  gap: 0;
  min-width: 0;
}

.heatmap-axis-frame.pathway-heatmap::before {
  content: "";
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 235px;
  height: 76px;
  background: #ffffff;
}

.heatmap-axis-frame.pathway-heatmap::after {
  content: "";
  position: absolute;
  z-index: 4;
  top: 22px;
  right: 0;
  left: 235px;
  height: 1px;
  background: #cbd4df;
}

.heatmap-axis-frame.pathway-heatmap .heatmap-x-axis-title {
  position: relative;
  z-index: 2;
  grid-area: x-axis;
  color: #425f7d;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
  padding: 6px 8px;
  text-align: center;
  text-transform: uppercase;
  background: #eef1f4;
}

.heatmap-axis-frame.pathway-heatmap .heatmap-y-axis-title {
  position: relative;
  z-index: 1;
  grid-area: y-axis;
  display: grid;
  place-items: center;
  min-height: 100%;
  color: #425f7d;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: #eef1f4;
  border-right: 1px solid #cbd4df;
}

.heatmap-axis-frame.pathway-heatmap .heatmap-y-axis-title span {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.heatmap-axis-frame.pathway-heatmap .heatmap-axis-map {
  grid-area: map;
  min-width: 0;
}

.heatmap-axis-frame.pathway-heatmap .heatmap-scroll {
  width: 100%;
  overflow-x: hidden;
}

.heatmap.pathway-heatmap {
  --heatmap-row-label-width: 205px;
  width: 100%;
  min-width: 0;
}

.heatmap.pathway-heatmap .heatmap-row {
  grid-template-columns: minmax(180px, var(--heatmap-row-label-width))
    repeat(var(--cols), minmax(0, 1fr));
}

.heatmap.pathway-heatmap .heatmap-row-label {
  min-height: 58px;
  overflow: visible !important;
  padding: 10px 14px;
  text-overflow: clip;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.25;
}

@media (max-width: 1400px) {
  .heatmap.pathway-heatmap .heatmap-column-label {
    overflow: hidden !important;
    padding: 5px 2px;
    font-size: 9px;
    line-height: 1.05;
    text-overflow: clip;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}

/* Alumni intelligence directory and focus experience */
.alumni-view,
.alumni-focus-view {
  max-width: 1500px;
  margin: 0 auto;
}

.alumni-page-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin: 18px 0;
}

.alumni-page-heading h1,
.alumni-identity-header h1 {
  margin-top: 5px;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.05;
}

.alumni-directory-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(190px, 260px) auto;
  gap: 12px;
  align-items: end;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-panel);
  background: var(--panel);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .18);
}

.alumni-directory-toolbar label,
.alumni-filter-grid label {
  display: grid;
  gap: 7px;
  color: #c7cdd4;
  font-size: 12px;
  font-weight: 700;
}

.alumni-directory-toolbar input,
.alumni-directory-toolbar select,
.alumni-filter-grid input,
.alumni-filter-grid select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #343943;
  border-radius: 6px;
  color: var(--ink);
  background: #0e1012;
  padding: 9px 11px;
}

.alumni-search-field small {
  color: var(--quiet);
  font-weight: 400;
}

.alumni-sort-direction {
  min-height: 42px;
  white-space: nowrap;
}

.alumni-filter-panel {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-panel);
  background: var(--panel);
}

.alumni-filter-panel summary {
  cursor: pointer;
  padding: 14px 16px;
  color: #d9dde2;
  font-size: 13px;
  font-weight: 800;
}

.alumni-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
  padding: 4px 16px 16px;
}

.alumni-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  min-height: 12px;
  margin: 12px 0;
}

.alumni-filter-chip {
  padding: 6px 9px;
  border-color: #3b4653;
  color: #d8dee6;
  background: #17202a;
  box-shadow: none;
  font-size: 11px;
  cursor: pointer;
}

.alumni-filter-chip:hover,
.alumni-filter-chip:active {
  border-color: #687180;
  color: #f7f9fb;
  background: #242831;
  box-shadow: none;
  transform: none;
}

.alumni-state {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 26px;
  margin: 12px 0;
  text-align: center;
}

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

.alumni-card {
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: var(--radius-panel);
  background: linear-gradient(145deg, #141619, #101214);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .17);
  transition: border-color var(--med) var(--ease), transform var(--med) var(--ease), box-shadow var(--med) var(--ease);
}

.alumni-card:hover {
  border-color: #46505c;
  transform: translateY(-2px);
  box-shadow: 0 22px 50px rgba(0, 0, 0, .24);
}

.alumni-card-header {
  display: grid;
  grid-template-columns: auto 58px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.alumni-avatar-wrap,
.alumni-focus-avatar-wrap {
  position: relative;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  flex: 0 0 auto;
  border: 1px solid #3a424d;
  border-radius: 50%;
  color: #eef2f6;
  background: #26303a;
}

.alumni-avatar-wrap {
  width: 58px;
  height: 58px;
}

.alumni-avatar,
.alumni-focus-avatar {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #26303a;
}

.alumni-avatar-fallback,
.alumni-focus-avatar-fallback {
  font-weight: 900;
  letter-spacing: .04em;
}

.alumni-card-identity {
  min-width: 0;
}

.alumni-card-name {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  color: #f3f6f8;
  font-size: 17px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.alumni-card-role,
.alumni-card-employer,
.alumni-card-details {
  overflow: hidden;
  margin-top: 4px;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.alumni-card-details {
  color: var(--quiet);
  font-size: 10px;
}

.alumni-card-score-grid {
  margin-top: 15px;
  padding: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  background: rgba(255, 255, 255, .018);
}

.alumni-definition-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.alumni-definition-list dt {
  color: var(--quiet);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.alumni-definition-list dd {
  margin: 4px 0 0;
  color: #e2e6ea;
  font-size: 12px;
  font-weight: 750;
}

.alumni-score-meter {
  overflow: hidden;
  height: 5px;
  margin-top: 11px;
  border-radius: 999px;
  background: #2b3036;
}

.alumni-score-meter-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #74869a, #b7a36b);
}

.alumni-card-summary {
  min-height: 42px;
  margin-top: 13px;
  color: #b8bec6;
  font-size: 12px;
  line-height: 1.5;
}

.alumni-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px solid var(--line-soft);
  color: var(--quiet);
  font-size: 10px;
}

.alumni-card-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.alumni-card-update-meta {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.alumni-card-updated-date {
  white-space: nowrap;
}

.alumni-card-action {
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #9eb7cf;
  border-radius: 2px;
  font: inherit;
  font-size: 9px;
  font-weight: 750;
  line-height: 1.2;
  cursor: pointer;
}

.alumni-card-action-secondary {
  color: #356da8;
  background: #ffffff;
}

.alumni-card-action-primary {
  border-color: #356da8;
  color: #ffffff;
  background: #356da8;
}

.alumni-card-action:hover,
.alumni-card-action:focus-visible {
  border-color: #214f7e;
  outline: none;
}

.alumni-card-action-secondary:hover,
.alumni-card-action-secondary:focus-visible {
  background: #edf5fc;
}

.alumni-card-action-primary:hover,
.alumni-card-action-primary:focus-visible {
  background: #214f7e;
}

.alumni-update-button.is-queued,
.alumni-focus-update-button.is-queued {
  border-color: #b8d3c2 !important;
  color: #356b4b !important;
  background: #f3f8f5 !important;
  cursor: default;
}

.alumni-card a,
.alumni-focus-view a {
  color: #bdcbd9;
  text-underline-offset: 3px;
}

.alumni-card a:focus-visible,
.alumni-focus-view a:focus-visible {
  border-radius: 3px;
  outline: 2px solid #8792a0;
  outline-offset: 3px;
}

.alumni-pagination {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 20px 0;
}

.alumni-pagination span {
  color: var(--muted);
  font-size: 12px;
}

@keyframes alumni-loading {
  to { background-position: -200% 0; }
}

.alumni-empty {
  padding: 14px 0;
  color: var(--muted);
}

.alumni-identity-header {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr) minmax(180px, auto);
  gap: 22px;
  align-items: center;
  margin-bottom: 16px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-panel);
  background: radial-gradient(circle at top right, #222933 0, #14171b 35%, #101214 100%);
}

.alumni-focus-avatar-wrap {
  width: 118px;
  height: 118px;
  font-size: 28px;
}

.alumni-identity-meta {
  font-size: 12px;
}

.alumni-identity-actions {
  display: grid;
  justify-items: start;
  gap: 9px;
  color: var(--muted);
  font-size: 11px;
}

.alumni-primary-link {
  display: inline-flex;
  padding: 9px 11px;
  border: 1px solid #43505e;
  border-radius: 6px;
  text-decoration: none;
  background: #1c2630;
}

#alumniFocusAdminStatus,
#alumniAdminStatus {
  margin-top: 14px;
}

@media (max-width: 1120px) {
  .alumni-filter-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .alumni-definition-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .alumni-directory-grid { grid-template-columns: 1fr; }
  .alumni-directory-toolbar { grid-template-columns: 1fr 1fr; }
  .alumni-search-field { grid-column: 1 / -1; }
  .alumni-filter-grid { grid-template-columns: repeat(2, minmax(140px, 1fr)); }
  .alumni-identity-header { grid-template-columns: minmax(0, 1fr); }
  .alumni-focus-avatar-wrap { width: 88px; height: 88px; }
  .alumni-identity-actions { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  .alumni-page-heading { align-items: stretch; flex-direction: column; }
  .alumni-directory-toolbar,
  .alumni-filter-grid { grid-template-columns: 1fr; }
  .alumni-card { padding: 13px; }
  .alumni-card-header { grid-template-columns: 48px minmax(0, 1fr); }
  .alumni-avatar-wrap { grid-column: 1; grid-row: 1; width: 48px; height: 48px; }
  .alumni-card-identity { grid-column: 2; grid-row: 1 / span 2; }
  .alumni-definition-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alumni-card-footer { align-items: flex-start; flex-direction: column; }
  .alumni-card-links { justify-content: flex-start; }
  .alumni-identity-header { grid-template-columns: 1fr; padding: 0; text-align: left; }
  .alumni-focus-avatar-wrap { width: 82px; height: 82px; }
  .alumni-pagination { justify-content: space-between; }
}

@media (prefers-reduced-motion: reduce) {
  .alumni-skeleton-banner,
.alumni-skeleton-avatar,
.alumni-skeleton-radio,
.alumni-skeleton-meter { animation: none; }
  .alumni-card { transition: none; }
}

/* Alumni intelligence — align the directory and profile with the analytics UI. */
.alumni-view,
.alumni-focus-view {
  max-width: none;
  margin: 0;
}

.alumni-page-heading {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px 18px !important;
  align-items: center !important;
  min-height: 104px;
  margin: 0 0 14px !important;
  padding: 16px 18px !important;
}

.alumni-page-heading h1,
.alumni-identity-header h1 {
  margin: 5px 0 0;
  color: #333333 !important;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.12;
}

.alumni-page-heading p {
  max-width: 760px;
  margin: 8px 0 0;
  color: #666f78 !important;
  font-size: 13px;
  line-height: 1.45;
}

.alumni-page-heading .status-pill {
  align-self: start;
  min-height: 30px;
  border-color: #c8d8ea !important;
  color: #365c72 !important;
  background: #f4f8fc !important;
  white-space: nowrap;
}

.alumni-heading-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  align-self: start;
  grid-column: 2;
  grid-row: 1;
}

.alumni-heading-metric {
  white-space: nowrap;
}

.alumni-review-queue-button {
  cursor: pointer;
}

.alumni-page-heading .alumni-review-queue-button:hover,
.alumni-page-heading .alumni-review-queue-button:focus-visible,
.alumni-page-heading .alumni-review-queue-button.is-active {
  border-color: #79a6d2 !important;
  color: #244f72 !important;
  background: #e8f2fc !important;
}

.alumni-heading-metric[hidden] {
  display: none;
}

.alumni-heading-copy {
  grid-column: 1;
  grid-row: 1 / 3;
}

.alumni-page-heading .alumni-last-completed {
  margin: 5px 0 0;
  color: #7a838d !important;
  font-size: 10px !important;
  line-height: 1.3;
}

.alumni-page-heading .alumni-directory-description {
  margin-top: 4px;
}

.alumni-directory-toolbar {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(190px, 250px) auto;
  gap: 12px;
  align-items: end;
  margin: 0 0 12px;
  padding: 12px;
  border: 1px solid #d9dde2;
  border-radius: 0;
  color: #333333;
  background: #ffffff;
  box-shadow: none;
}

.alumni-directory-toolbar label,
.alumni-filter-grid label {
  display: grid;
  min-width: 0;
  gap: 5px;
  color: #66717f;
  font-size: 11px;
  font-weight: 700;
}

.alumni-directory-toolbar input,
.alumni-directory-toolbar select,
.alumni-filter-grid input,
.alumni-filter-grid select {
  width: 100%;
  min-height: 34px;
  border: 1px solid #cbd3dc !important;
  border-radius: 2px !important;
  padding: 7px 9px;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 12px;
}

.alumni-directory-toolbar input::placeholder,
.alumni-filter-grid input::placeholder {
  color: #8a939d;
}

.alumni-search-field small {
  color: #7c858f;
  font-size: 10px;
  font-weight: 400;
}

.alumni-sort-direction {
  min-height: 34px;
  padding-inline: 12px;
  white-space: nowrap;
}

.alumni-filter-panel {
  display: block;
  margin: 0 0 12px;
  padding: 12px !important;
  overflow: visible;
  border: 1px solid #d9dde2 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.alumni-filter-panel summary {
  padding: 11px 12px;
  color: #333333;
  background: #f8f9fa;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  list-style-position: inside;
}

.alumni-filter-panel[open] summary {
  border-bottom: 1px solid #e4e7eb;
}

.alumni-filter-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px 9px;
  align-items: start;
  overflow: visible;
  padding: 10px;
}

.alumni-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 0;
  margin: 0 0 12px;
}

.alumni-active-filters:empty {
  display: none;
}

.alumni-filter-chip {
  min-height: 28px;
  padding: 5px 8px;
  border: 1px solid #c8d8ea;
  border-radius: 2px;
  color: #365c72;
  background: #f4f8fc;
  box-shadow: none;
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
}

.alumni-filter-chip:hover,
.alumni-filter-chip:active {
  border-color: #7da3cb;
  color: #365c72;
  background: #e4eef8;
  box-shadow: none;
  transform: none;
}

.alumni-state {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 26px;
  margin: 0 0 12px;
  color: #666f78;
  text-align: center;
}

.alumni-state:empty {
  display: none;
  min-height: 0;
  margin: 0;
}

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

.alumni-card.display-card {
  min-width: 0;
  min-height: 0;
  padding: 14px !important;
  overflow: hidden;
  border: 1px solid #d9dde2 !important;
  border-radius: 0 !important;
  color: #333333 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  transition: border-color var(--med) var(--ease);
}

.alumni-card.display-card:hover {
  border-color: #9eb7cf !important;
  background: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.alumni-card-header {
  display: grid;
  grid-template-columns: 44px 52px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
}

.alumni-avatar-wrap,
.alumni-focus-avatar-wrap {
  border: 1px solid #cbd3dc;
  color: #596675;
  background: #f5f7f9;
}

.alumni-avatar-wrap {
  width: 52px;
  height: 52px;
}

.alumni-avatar,
.alumni-focus-avatar {
  background: #f5f7f9;
}

.alumni-avatar-fallback,
.alumni-focus-avatar-fallback {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
  background: #f5f7f9;
  color: transparent;
  font-size: 0;
}

.alumni-avatar-fallback::before,
.alumni-focus-avatar-fallback::before {
  position: absolute;
  top: 19%;
  left: 33%;
  width: 34%;
  height: 34%;
  border-radius: 50%;
  background: #dce3ea;
  content: '';
}

.alumni-avatar-fallback::after,
.alumni-focus-avatar-fallback::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 49%;
  border-radius: 50% 50% 0 0;
  background: #dce3ea;
  content: '';
}

.alumni-card-name {
  color: #2f3033 !important;
  font-size: 16px;
  font-weight: 700;
  text-decoration-color: #a8bfd6;
}

.alumni-card-role,
.alumni-card-employer,
.alumni-card-details {
  margin: 3px 0 0;
  color: #505962 !important;
  font-size: 11px;
}

.alumni-card-employer {
  font-weight: 600;
}

.alumni-card-details {
  color: #7a838d !important;
  font-size: 10px;
}

.alumni-card-score-grid {
  margin-top: 13px;
  padding: 11px;
  border: 1px solid #e4e7eb;
  border-radius: 0;
  background: #f8f9fa;
}

.alumni-definition-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.alumni-definition-list dt {
  color: #66717f;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.alumni-definition-list dd {
  margin: 4px 0 0;
  color: #333333;
  font-size: 12px;
  font-weight: 700;
}

.alumni-score-meter {
  overflow: hidden;
  height: 4px;
  margin-top: 10px;
  border-radius: 0;
  background: #e2e7ec;
}

.alumni-score-meter-fill {
  display: block;
  height: 100%;
  border-radius: 0;
  background: #3f8ee8;
}

.alumni-card-summary {
  min-height: 38px;
  margin: 12px 0 0;
  color: #505962 !important;
  font-size: 11px;
  line-height: 1.5;
}

.alumni-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #e4e7eb;
  color: #7a838d;
  font-size: 10px;
}

.alumni-card-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.alumni-card a,
.alumni-focus-view a {
  color: #356da8;
  text-underline-offset: 3px;
}

.alumni-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 16px 0;
}

.alumni-pagination span {
  color: #66717f;
  font-size: 11px;
}

.alumni-empty {
  padding: 12px 0;
  color: #66717f;
  font-size: 12px;
}

.alumni-header-operations {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  align-items: center;
  min-width: 0;
  grid-column: 2;
  grid-row: 2;
  align-self: end;
}

.alumni-header-operations[hidden] {
  display: none;
}

.alumni-header-operations .panel-actions {
  gap: 7px;
  margin-left: 0;
}

.alumni-header-operations .panel-actions button {
  min-height: 30px;
  padding: 5px 9px;
  font-size: 10px;
  white-space: nowrap;
}

.alumni-run-scope-select {
  width: 136px;
  min-width: 136px;
}

.alumni-run-scope-select .filter-select-trigger {
  min-height: 30px !important;
  height: 30px;
  border-radius: 2px !important;
  font-size: 10px !important;
}

.alumni-run-scope-select .filter-select-menu {
  right: 0;
  left: auto;
  width: 250px;
  z-index: 90;
}

.alumni-run-scope-select .alumni-run-scope-option {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto 14px;
  gap: 8px 12px;
  align-items: center;
}

.alumni-run-scope-option small {
  color: #7a8490;
  font-size: 9px;
  font-weight: 650;
}

.alumni-run-scope-option[aria-selected="true"] small {
  color: #1f5d9d;
}

.alumni-run-experience {
  display: grid;
  gap: 8px;
  margin: 10px 0 12px;
  padding: 11px 13px 10px;
  border: 1px solid #c5d8ea;
  background: #f7fbfe;
  color: #2c3948;
}

.alumni-run-experience[hidden] {
  display: none;
}

.alumni-run-head,
.alumni-run-heading,
.alumni-run-title-row,
.alumni-run-head-actions,
.alumni-run-footer {
  display: flex;
  align-items: center;
}

.alumni-run-head {
  justify-content: space-between;
  gap: 18px;
}

.alumni-run-heading {
  min-width: 0;
  gap: 9px;
}

.alumni-run-title-row {
  flex-wrap: wrap;
  gap: 6px;
}

.alumni-run-title-row h2 {
  margin: 0;
  color: #1f4f7a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.alumni-run-heading p,
.alumni-run-footer p {
  margin: 2px 0 0;
  color: #5e6b78;
  font-size: 9px;
  line-height: 1.3;
}

.alumni-run-spinner {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 14px;
  height: 14px;
  border: 2px solid #c5daf0;
  border-top-color: #2e7fc8;
  border-radius: 50%;
  animation: alumni-run-spin .8s linear infinite;
}

.alumni-run-experience.is-complete .alumni-run-spinner {
  border: 0;
  background: #3d9a55;
  animation: none;
}

.alumni-run-experience.is-complete .alumni-run-spinner::after {
  color: #ffffff;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  content: '\2713';
}

.alumni-run-experience.is-cancelled .alumni-run-spinner,
.alumni-run-experience.is-failed .alumni-run-spinner {
  border: 0;
  background: #a94b4b;
  animation: none;
}

.alumni-run-experience.is-cancelled .alumni-run-spinner::after,
.alumni-run-experience.is-failed .alumni-run-spinner::after {
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  content: '\00d7';
}

.alumni-run-status-label {
  display: none;
}

.alumni-run-head-actions {
  flex: 0 0 auto;
  gap: 8px;
  color: #617184;
  font-size: 9px;
}

.alumni-run-percent {
  color: #2e7fc8;
  font-size: 11px;
  font-weight: 700;
}

.alumni-run-experience.is-complete .alumni-run-percent {
  color: #2d744f;
}

.alumni-run-experience.is-cancelled .alumni-run-percent,
.alumni-run-experience.is-failed .alumni-run-percent {
  color: #8f3f3f;
}

.alumni-run-hide,
.alumni-run-cancel {
  min-height: 24px !important;
  padding: 2px 7px !important;
  border-color: #cbd3dc !important;
  color: #4e5965 !important;
  background: #ffffff !important;
  font-size: 8px !important;
}

.alumni-run-cancel {
  border-color: #d8aaaa !important;
  color: #963f3f !important;
}

.alumni-run-cancel:hover:not(:disabled) {
  border-color: #b86565 !important;
  background: #fff7f7 !important;
}

.alumni-run-cancel[hidden] {
  display: none;
}

.alumni-run-progress-copy {
  color: #52667b;
  font-size: 9px;
}

.alumni-run-progress-copy strong {
  color: inherit;
  font-size: inherit;
  font-weight: 600;
}

.alumni-run-progress {
  --alumni-run-progress: 0%;
  position: relative;
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #e3ebf3;
}

.alumni-run-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--alumni-run-progress);
  border-radius: inherit;
  background-color: #2e7fc8;
  background-image: repeating-linear-gradient(135deg, transparent 0, transparent 9px, rgba(255, 255, 255, .2) 9px, rgba(255, 255, 255, .2) 18px);
  background-size: 28px 28px;
  animation: alumni-run-stripes .75s linear infinite;
  transition: width .3s linear;
}

.alumni-run-experience.is-complete .alumni-run-progress-fill {
  background: #2d8a57;
  animation: none;
}

.alumni-run-experience.is-cancelled .alumni-run-progress-fill,
.alumni-run-experience.is-failed .alumni-run-progress-fill {
  background: #a94b4b;
  animation: none;
}

.alumni-run-detail-row {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.alumni-run-metrics {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 13px;
  margin: 0;
}

.alumni-run-metrics > div {
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: max-content;
}

.alumni-run-metrics dt {
  color: #728090;
  font-size: 8px;
}

.alumni-run-metrics dd {
  margin: 0;
  color: #34495e;
  font-size: 10px;
  font-weight: 700;
}

.alumni-run-stages {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.alumni-run-stages li {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: #7a8a99;
}

.alumni-run-stages li > span {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 10px;
  height: 10px;
  border: 1.5px solid #c5d0db;
  border-radius: 50%;
  background: #ffffff;
}

.alumni-run-stages strong {
  color: inherit;
  font-size: 8px;
  line-height: 1.3;
}

.alumni-run-stages li.is-active {
  color: #356da8;
}

.alumni-run-stages li.is-active > span {
  border-color: #3d8bce;
  background: #3d8bce;
  box-shadow: 0 0 0 3px rgba(61, 139, 206, .12);
}

.alumni-run-stages li.is-complete {
  color: #2d744f;
}

.alumni-run-stages li.is-complete > span {
  border-color: #2d8a57;
  background: #2d8a57;
}

.alumni-run-stages li.is-complete > span::after {
  color: #ffffff;
  font-size: 7px;
  font-weight: 800;
  line-height: 1;
  content: '\2713';
}

.alumni-run-footer {
  justify-content: space-between;
  gap: 16px;
  padding-top: 1px;
}

.alumni-run-footer p {
  margin: 0;
}

.alumni-run-footer span {
  color: #65717d;
  font-size: 9px;
  white-space: nowrap;
}

.alumni-profile-run-experience {
  margin: 10px 0 12px;
}

.alumni-card .alumni-profile-run-experience {
  gap: 6px;
  margin: 10px 0 0;
  padding: 9px 10px;
}

.alumni-profile-run-experience .alumni-run-head {
  align-items: flex-start;
}

.alumni-profile-run-experience .alumni-run-heading p {
  max-width: 620px;
}

@keyframes alumni-run-spin {
  to { transform: rotate(360deg); }
}

@keyframes alumni-run-stripes {
  to { background-position: 28px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .alumni-run-spinner { animation: none; }
  .alumni-run-progress-fill { animation: none; transition: none; }
}

#alumniAdminStatus {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
  margin-top: 0;
}

.alumni-identity-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  align-items: stretch !important;
  min-height: 0;
  margin: 0 0 14px !important;
  padding: 0 !important;
  overflow: hidden;
}

.alumni-identity-banner-wrap {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 1;
  background: #d7e0ea;
}

.alumni-identity-banner {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 1;
  object-fit: contain;
}

.alumni-identity-body {
  position: relative;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) max-content;
  gap: 14px;
  align-items: start;
  padding: 0 16px 10px;
}

.alumni-focus-avatar-wrap {
  grid-column: 1;
  grid-row: 1;
  z-index: 2;
  width: 92px;
  height: 92px;
  margin-top: -32px;
  border: 3px solid #ffffff;
  border-radius: 50%;
  font-size: 25px;
  background: #eaf1f7;
}

.alumni-identity-copy {
  display: grid;
  grid-column: 2;
  grid-row: 1;
  align-content: start;
  gap: 3px;
  padding-top: 2px;
}

.alumni-identity-name-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 7px;
}

.alumni-identity-name-row h1 {
  min-width: 0;
  margin: 0;
  font-size: 24px !important;
  line-height: 1.12;
}

.alumni-identity-name-row .alumni-score-rank,
.alumni-identity-name-row .alumni-predicted-linkedin-tag,
.alumni-identity-name-row .alumni-linkedin-only-tag,
.alumni-identity-name-row .alumni-no-linkedin-tag,
.alumni-identity-name-row .alumni-review-required-tag {
  flex: 0 0 auto;
}

.alumni-identity-role-line {
  margin: 2px 0 0;
  color: #505962 !important;
  font-size: 13px;
  line-height: 1.3;
}

.alumni-identity-employer {
  color: #505962;
}

.alumni-identity-employer::before {
  content: '\00b7';
  margin: 0 6px;
  color: #9aa3ad;
  font-weight: 400;
}

.alumni-identity-meta {
  min-width: 0;
  margin: 0;
  color: #66717f !important;
  font-size: 11px;
  line-height: 1.3;
}

.alumni-identity-meta-row {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 3px 8px;
  min-width: 0;
}

.alumni-identity-updated {
  position: absolute;
  right: 16px;
  bottom: 10px;
  flex: 0 0 auto;
  margin-left: 0;
  color: #66717f;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.3;
  white-space: nowrap;
}

.alumni-identity-actions {
  display: flex;
  grid-column: 3;
  grid-row: 1;
  align-self: center;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 6px;
  padding-top: 0;
  color: #66717f;
  font-size: 10px;
}

.alumni-primary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 32px;
  padding: 8px 10px;
  border: 1px solid #b8cce0;
  border-radius: 2px;
  color: #285f98 !important;
  background: #f4f8fc;
  font-weight: 700;
  font: inherit;
  font-weight: 700;
  text-decoration: none;
}

.alumni-focus-action-button {
  min-width: 78px;
  white-space: nowrap;
}

.alumni-focus-update-button {
  cursor: pointer;
}

.alumni-identity-glassdoor {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 3px 8px;
  margin: 4px 0 0;
  color: #66717f;
  font-size: 12px;
  line-height: 1.3;
}

.alumni-identity-glassdoor-label {
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 10px;
  color: #0caa41;
}

.alumni-identity-glassdoor-rating {
  color: #2e3945;
  font-weight: 700;
}

.panel.alumni-recognition-panel,
.panel.alumni-recognition-panel:hover {
  margin: 0 0 14px !important;
  padding: 16px !important;
  border: 1px solid #d5dfeb !important;
  border-left: 4px solid #2f6fb0 !important;
  border-radius: 0 !important;
  background: #f9fbfe !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.alumni-recognition-head h2 {
  margin: 3px 0 5px;
  color: #2e3945;
  font-size: 18px;
  line-height: 1.3;
}

.alumni-recognition-description {
  max-width: 760px;
  margin: 0 0 12px;
  color: #66717f;
  font-size: 13px;
  line-height: 1.45;
}

.alumni-recognition-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.alumni-recognition-item {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid #e1e8f1;
  background: #fff;
}

.alumni-recognition-meta {
  color: #66717f;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.alumni-recognition-title {
  color: #1f4f85;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
}

.alumni-recognition-title:hover,
.alumni-recognition-title:focus-visible {
  text-decoration: underline;
}

.alumni-recognition-summary {
  margin: 0;
  color: #3f4b59;
  font-size: 13px;
  line-height: 1.45;
}

.panel.alumni-identity-review-panel,
.panel.alumni-identity-review-panel:hover {
  margin: 0 0 14px !important;
  padding: 16px !important;
  border: 1px solid #d5dfeb !important;
  border-left: 4px solid #c58a22 !important;
  border-radius: 0 !important;
  background: #fffdf8 !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.alumni-identity-review-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.alumni-identity-review-head h2 {
  margin: 3px 0 5px;
  color: #2e3945;
  font-size: 18px;
  line-height: 1.3;
}

.alumni-identity-review-head p {
  max-width: 760px;
  margin: 0;
  color: #626d7a;
  font-size: 12px;
  line-height: 1.55;
}

.alumni-identity-review-statuses {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.alumni-identity-review-statuses .status-pill,
.alumni-identity-review-statuses .status-pill:hover,
.alumni-identity-review-confidence,
.alumni-identity-review-confidence:hover {
  align-self: start;
  min-height: 30px;
  border-color: #c8d8ea !important;
  color: #365c72 !important;
  background: #f4f8fc !important;
  white-space: nowrap;
}

.alumni-identity-review-snapshot {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid #e3e8ee;
  background: #ffffff;
}

.alumni-identity-review-snapshot h3,
.alumni-identity-review-candidates legend {
  margin: 0 0 9px;
  color: #334b66;
  font-size: 12px;
  font-weight: 800;
}

.alumni-identity-review-snapshot dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px 16px;
  margin: 0;
}

.alumni-identity-review-snapshot dl > div {
  min-width: 0;
}

.alumni-identity-review-snapshot dt {
  margin: 0 0 2px;
  color: #788391;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.alumni-identity-review-snapshot dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: #34404d;
  font-size: 11px;
  font-weight: 700;
}

.alumni-identity-review-candidates {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin: 14px 0 0;
  padding: 0;
  border: 0;
}

.alumni-identity-review-candidates legend {
  width: 100%;
  padding: 0;
}

.alumni-identity-review-candidates.is-multiple {
  grid-template-columns: repeat(var(--candidate-columns, 3), minmax(0, 1fr));
}

.alumni-identity-review-candidates.is-multiple legend {
  grid-column: 1 / -1;
}

.alumni-identity-review-candidates.is-multiple .alumni-identity-evidence-grid {
  grid-template-columns: 1fr;
}

.alumni-identity-review-candidate.display-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: 12px !important;
  border: 1px solid #dfe5ec !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  cursor: pointer;
}

.alumni-identity-review-candidate.display-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(36, 52, 68, .045);
  opacity: 0;
  pointer-events: none;
  transition: opacity 120ms ease;
}

.alumni-identity-review-candidate.display-card:hover {
  border-color: #dfe5ec !important;
  background: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.alumni-identity-review-candidate.display-card:hover:has(input:checked) {
  border-color: #6f99c5 !important;
}

.alumni-identity-review-candidate.display-card:hover::after {
  opacity: 1;
}

.alumni-identity-review-candidate:has(input:checked) {
  border-color: #6f99c5 !important;
  outline: 2px solid color-mix(in srgb, #4b8de5 20%, transparent);
  outline-offset: 0;
}

.alumni-identity-review-candidate-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.alumni-identity-review-choice {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  color: #2f3c49;
  cursor: pointer;
}

.alumni-identity-review-choice input {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  accent-color: #356da8;
}

.alumni-identity-review-rank {
  flex: 0 0 auto;
  color: #6c7784;
  font-size: 10px;
  font-weight: 800;
}

.alumni-identity-review-candidate-name {
  min-width: 0;
  color: #2f3c49;
  font-size: 14px;
  font-weight: 800;
}

.alumni-identity-review-confidence {
  flex: 0 0 auto;
  font-size: 10px !important;
}

.alumni-identity-review-profile-meta,
.alumni-identity-review-education {
  margin: 8px 0 0;
  color: #596675;
  font-size: 11px;
  line-height: 1.5;
}

.alumni-identity-review-education {
  color: #6b7581;
}

.alumni-identity-evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.alumni-identity-evidence {
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid #e4e8ed;
  border-top: 3px solid #9ba6b2;
  background: #fafbfc;
}

.alumni-identity-evidence.is-supporting { border-top-color: #4f9d72; }
.alumni-identity-evidence.is-conflicting { border-top-color: #c26868; }
.alumni-identity-evidence.is-missing { border-top-color: #c59a48; }

.alumni-identity-evidence h4 {
  margin: 0 0 5px;
  color: #44515e;
  font-size: 10px;
}

.alumni-identity-evidence p,
.alumni-identity-evidence ul {
  margin: 0;
  color: #66717f;
  font-size: 10px;
  line-height: 1.45;
}

.alumni-identity-evidence ul {
  padding-left: 15px;
}

.alumni-identity-review-candidate-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
}

.alumni-identity-review-candidate-buttons {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.alumni-identity-review-reject-candidate,
.alumni-identity-review-profile-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 2px;
  font-size: 10px;
  font-weight: 600;
  text-decoration: none;
}

.alumni-identity-review-reject-candidate {
  color: #8a4141 !important;
}

.alumni-identity-review-profile-link {
  border: 1px solid #cbd3dc;
  color: #333333 !important;
  background: #ffffff;
}

.alumni-identity-review-choice input:focus-visible {
  outline: 2px solid #4b8de5;
  outline-offset: 2px;
}

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

.alumni-identity-review-confirm {
  width: auto;
  min-height: 32px;
  padding: 6px 12px;
  font-size: 12px;
}

.alumni-identity-review-actions button:disabled,
.alumni-identity-review-candidate-actions button:disabled {
  cursor: not-allowed;
  opacity: .55;
}

.alumni-identity-review-state {
  min-height: 16px;
  margin-top: 8px;
  color: #596675;
  font-size: 10px;
  font-weight: 700;
}

@media (max-width: 820px) {
  .alumni-identity-review-snapshot dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .alumni-identity-evidence-grid {
    grid-template-columns: 1fr;
  }

  .alumni-identity-review-candidates.is-multiple {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .alumni-identity-review-panel {
    padding: 12px !important;
  }

  .alumni-identity-review-head,
  .alumni-identity-review-candidate-head {
    align-items: stretch;
    flex-direction: column;
  }

  .alumni-identity-review-statuses {
    justify-content: flex-start;
  }

  .alumni-identity-review-snapshot dl {
    grid-template-columns: 1fr;
  }

  .alumni-identity-review-choice {
    flex-wrap: wrap;
  }

  .alumni-identity-review-candidate-actions {
    flex-wrap: wrap;
  }
}

.alumni-predicted-linkedin-tag,
.alumni-linkedin-only-tag,
.alumni-no-linkedin-tag,
.alumni-review-required-tag {
  flex: 0 0 auto;
  white-space: nowrap;
}

.alumni-review-required-tag {
  color: #8a5a12;
  background: #fff6e8;
  border-color: #f0d4a8;
}

@media (max-width: 1180px) {
  .alumni-filter-grid { grid-template-columns: repeat(4, minmax(140px, 1fr)); }
}

@media (max-width: 900px) {
  .alumni-filter-grid { grid-template-columns: repeat(3, minmax(140px, 1fr)); }
  .alumni-directory-grid { grid-template-columns: 1fr; }
  .alumni-identity-header {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .alumni-identity-body { grid-template-columns: 88px minmax(0, 1fr); }
  .alumni-focus-avatar-wrap { width: 88px; height: 88px; }
  .alumni-identity-actions { grid-column: 1 / -1; grid-row: 2; align-self: start; }
  .alumni-identity-updated {
    position: static;
    margin-left: auto;
  }
}

@media (max-width: 680px) {
  .alumni-page-heading {
    grid-template-columns: 1fr !important;
    align-items: start !important;
  }
  .alumni-heading-copy,
  .alumni-heading-metrics,
  .alumni-header-operations {
    grid-column: 1;
    grid-row: auto;
  }
  .alumni-heading-metrics { width: 100%; }
  .alumni-directory-toolbar { grid-template-columns: 1fr 1fr; }
  .alumni-search-field { grid-column: 1 / -1; }
  .alumni-filter-grid { grid-template-columns: repeat(2, minmax(130px, 1fr)); }
  .alumni-definition-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alumni-header-operations { flex-wrap: wrap; }
  .alumni-run-head,
  .alumni-run-footer {
    align-items: flex-start;
    flex-direction: column;
  }
  .alumni-run-head-actions {
    justify-content: space-between;
    width: 100%;
  }
  .alumni-run-detail-row { grid-template-columns: 1fr; gap: 8px; }
  .alumni-run-metrics { justify-content: flex-start; flex-wrap: wrap; }
  .alumni-run-stages {
    display: flex;
    overflow-x: auto;
    padding-bottom: 5px;
  }
  .alumni-run-stages li { flex: 0 0 auto; }
}

@media (max-width: 560px) {
  .alumni-page-heading { padding: 14px !important; }
  .alumni-page-heading h1,
  .alumni-identity-header h1 { font-size: 24px; }
  .alumni-directory-toolbar,
  .alumni-filter-grid { grid-template-columns: 1fr; }
  .alumni-definition-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alumni-card-footer { align-items: flex-start; flex-direction: column; }
  .alumni-card-links { justify-content: flex-start; }
  .alumni-identity-header {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 0 !important;
    text-align: left;
  }
  .alumni-identity-body { grid-template-columns: 1fr; padding: 0 14px 14px; }
  .alumni-focus-avatar-wrap { grid-column: 1; grid-row: 1; }
  .alumni-identity-copy { grid-column: 1; grid-row: 2; }
  .alumni-identity-actions { grid-column: 1; grid-row: 3; justify-content: flex-start; }
  .alumni-identity-banner-wrap { height: auto; }
  .alumni-focus-avatar-wrap { width: 78px; height: 78px; margin-top: -28px; }
  .alumni-pagination { justify-content: space-between; }
}

/* Alumni directory controls — one control height, aligned baselines, grouped filters. */
.alumni-directory-toolbar {
  grid-template-columns: minmax(240px, 1fr) auto;
  align-items: end;
  gap: 12px;
  padding: 12px !important;
}

.alumni-directory-toolbar label,
.alumni-sort-label-row > label,
.alumni-filter-grid label {
  color: #66717f;
  font-size: 11px;
  font-weight: 700;
}

.alumni-sort-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.alumni-sort-label-row {
  display: grid;
  grid-template-columns: minmax(180px, 230px) 34px;
  align-items: center;
}

.alumni-score-guide-button {
  --chart-head-control-size: 17px;
  justify-self: end;
  margin-inline-end: 1px;
}

.alumni-sort-group {
  display: grid;
  grid-template-columns: minmax(180px, 230px) 34px;
}

.alumni-directory-toolbar input,
.alumni-directory-toolbar select,
.alumni-filter-grid input,
.alumni-filter-grid select {
  min-height: 34px;
  height: 34px;
}

.alumni-filter-grid .filter-select-trigger {
  min-height: 34px;
  height: 34px;
}

.alumni-sort-group .alumni-sort-select {
  min-width: 0;
}

.alumni-sort-group .alumni-sort-select .filter-select-trigger {
  min-height: 34px !important;
  height: 34px;
  border-radius: 2px 0 0 2px !important;
}

.alumni-sort-group .alumni-sort-select .filter-select-trigger,
.alumni-sort-group .alumni-sort-select .filter-select-option {
  font-size: 11px !important;
}

.alumni-sort-group .filter-select-menu,
.alumni-filter-grid .filter-select-menu {
  z-index: 60;
}

.alumni-filter-option-search {
  position: sticky;
  z-index: 1;
  top: -4px;
  display: block;
  margin: -4px -4px 4px;
  padding: 7px;
  border-bottom: 1px solid #d8dee6;
  background: #ffffff;
}

.alumni-filter-option-search input {
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid #bfc9d5;
  border-radius: 2px;
  color: #333333;
  background: #ffffff;
  font: inherit;
}

.alumni-filter-option-search input:focus {
  border-color: #3f8ee8;
  outline: 0;
  box-shadow: 0 0 0 2px rgba(63, 142, 232, .16);
}

.alumni-filter-no-options {
  margin: 0;
  padding: 10px;
  color: #6b7480;
  font-size: 11px;
}

.alumni-sort-direction {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  margin-left: -1px;
  padding: 0 !important;
  border-radius: 0 2px 2px 0 !important;
  color: #4a5560 !important;
}

.alumni-sort-direction .button-icon {
  width: 15px;
  height: 15px;
}

.alumni-sort-direction[data-direction="asc"] .button-icon {
  transform: rotate(180deg);
}

.alumni-filter-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px 9px;
  align-items: start;
  overflow: visible;
  padding: 10px;
}

.alumni-filter-grid .filter-field,
.alumni-filter-grid label {
  display: grid;
  align-content: start;
  min-width: 0;
  gap: 5px;
}

.alumni-filter-label-row {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  min-height: 17px;
  line-height: 1.2;
}

.alumni-filter-info {
  --chart-head-control-size: 15px;
  border-color: #b6c0cb;
  color: #718096;
  font-size: 9px;
}

@media (max-width: 1400px) {
  .alumni-filter-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
  .alumni-filter-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .alumni-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .alumni-directory-toolbar { grid-template-columns: 1fr; }
  .alumni-sort-group { grid-template-columns: minmax(0, 1fr) 34px; }
}

@media (max-width: 680px) {
  .alumni-directory-toolbar { grid-template-columns: 1fr; }
  .alumni-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .alumni-directory-toolbar,
  .alumni-filter-grid { grid-template-columns: 1fr; }
}

/* Alumni directory cards — compact rows scored on the employment red-to-green ramp. */
.alumni-runs-page {
  padding: 18px !important;
}

.alumni-runs-head {
  align-items: flex-start;
  gap: 16px;
}

.alumni-runs-billing-note {
  margin: 14px 0;
  padding: 12px 14px;
  border-left: 3px solid #3f8ee8;
  color: #42566b;
  background: #f4f8fc;
}

.alumni-runs-billing-note strong {
  color: #263b50;
  font-size: 13px;
}

.alumni-runs-billing-note p {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.5;
}

.alumni-runs-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}

.alumni-runs-summary article {
  display: grid;
  align-content: start;
  min-height: 104px;
  padding: 13px;
  border: 1px solid #d8e0e8;
  background: #fff;
}

.alumni-runs-summary span,
.alumni-runs-summary small {
  color: #6b7988;
  font-size: 11px;
}

.alumni-runs-summary strong {
  margin: 8px 0 4px;
  color: #21364b;
  font-size: 20px;
  line-height: 1.1;
}

.alumni-runs-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(130px, 180px)) auto;
  gap: 10px;
  align-items: end;
  margin: 14px 0 12px;
  padding: 12px;
  border: 1px solid #d8e0e8;
  background: #f8fafc;
}

.alumni-runs-toolbar label {
  display: grid;
  gap: 5px;
  color: #637384;
  font-size: 11px;
  font-weight: 700;
}

.alumni-runs-toolbar input,
.alumni-runs-toolbar select {
  width: 100%;
  height: 36px;
  border: 1px solid #cbd4dd;
  border-radius: 2px;
  padding: 7px 9px;
  color: #26384a;
  background: #fff;
}

.alumni-runs-search-field input,
.alumni-runs-search-field input:hover,
.alumni-runs-search-field input:focus {
  min-height: 34px !important;
  height: 34px !important;
  border: 1px solid #cbd3dc !important;
  border-radius: 2px !important;
  padding: 7px 9px !important;
  color: #333 !important;
  background: #fff !important;
  box-shadow: none !important;
  font-size: 12px;
}

.alumni-runs-search-field input::placeholder {
  color: #8a939d;
}

.alumni-runs-search-field input:focus {
  border-color: #6f9dcc !important;
  outline: 2px solid rgba(76, 142, 210, .16);
  outline-offset: 1px;
}

.alumni-runs-toolbar .status-pill {
  align-self: end;
  min-height: 36px;
  padding: 9px 11px;
  white-space: nowrap;
}

.alumni-runs-list {
  display: grid;
  gap: 8px;
}

.alumni-run-audit-card {
  border: 1px solid #d7e0e9;
  background: #fff;
}

.alumni-run-audit-card[open] {
  border-color: #a9c5df;
  box-shadow: 0 8px 22px rgba(34, 65, 96, .08);
}

.alumni-run-audit-card > summary {
  display: grid;
  grid-template-columns: minmax(260px, 1.5fr) minmax(115px, .7fr) repeat(4, minmax(95px, .55fr));
  gap: 12px;
  align-items: center;
  padding: 13px 15px;
  cursor: pointer;
  list-style: none;
}

.alumni-run-audit-card > summary::-webkit-details-marker {
  display: none;
}

.alumni-run-audit-card > summary:hover {
  background: #f7f9fb;
}

.alumni-run-audit-card > summary:focus-visible {
  outline: 2px solid #3f8ee8;
  outline-offset: 2px;
}

.alumni-run-audit-primary {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.alumni-run-audit-primary strong {
  overflow: hidden;
  color: #21364b;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.alumni-run-audit-primary span {
  overflow: hidden;
  color: #758392;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.alumni-run-audit-card > summary > span:not(.alumni-run-audit-status) {
  display: grid;
  gap: 3px;
}

.alumni-run-audit-card > summary > span > strong {
  color: #2f4357;
  font-size: 12px;
}

.alumni-run-audit-card > summary > span > small {
  color: #7a8794;
  font-size: 10px;
}

.alumni-run-audit-status {
  font-size: 11px;
  font-weight: 800;
}

.alumni-run-audit-status[data-tone="progress"] { color: #1f6fb0; }
.alumni-run-audit-status[data-tone="success"] { color: #23704c; }
.alumni-run-audit-status[data-tone="danger"] { color: #a33b42; }
.alumni-run-audit-status[data-tone="neutral"] { color: #637384; }

.alumni-run-audit-details {
  padding: 14px 15px 16px;
  border-top: 1px solid #e2e7ec;
  background: #fbfcfd;
}

.alumni-run-audit-details dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 18px;
  margin: 0 0 12px;
}

.alumni-run-audit-details dl div {
  min-width: 0;
}

.alumni-run-audit-details dt {
  margin-bottom: 3px;
  color: #748292;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.alumni-run-audit-details dd {
  margin: 0;
  color: #30465a;
  font-size: 12px;
  line-height: 1.4;
}

.alumni-run-audit-details a {
  color: #176eb5;
  font-size: 12px;
  font-weight: 700;
}

.alumni-run-audit-error {
  margin: 10px 0 0;
  color: #a33b42;
  font-size: 12px;
}

.alumni-runs-empty {
  padding: 26px;
  border: 1px dashed #cbd5df;
  color: #657586;
  text-align: center;
  background: #fafbfd;
}

.alumni-runs-empty p {
  margin: 5px 0 0;
  font-size: 12px;
}

@media (max-width: 1350px) {
  .alumni-runs-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .alumni-run-audit-card > summary { grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(90px, .6fr)); }
  .alumni-run-audit-card > summary > span:nth-last-child(-n+2) { display: none; }
}

@media (max-width: 900px) {
  .alumni-runs-toolbar { grid-template-columns: 1fr 1fr; }
  .alumni-run-audit-details dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .alumni-runs-summary,
  .alumni-runs-toolbar { grid-template-columns: 1fr; }
  .alumni-run-audit-card > summary { grid-template-columns: minmax(0, 1fr) auto; }
  .alumni-run-audit-card > summary > span:not(.alumni-run-audit-status) { display: none; }
  .alumni-run-audit-details dl { grid-template-columns: 1fr; }
}

.alumni-card.display-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0 0 12px !important;
}

.alumni-card-cover {
  position: relative;
  z-index: 0;
  flex: 0 0 72px;
  height: 72px;
  background: #f7f9fb;
}

.alumni-banner-badges {
  position: absolute;
  z-index: 3;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  pointer-events: none;
}

.alumni-identity-banner-badges {
  top: 14px;
  right: 16px;
}

.alumni-banner-rank {
  position: relative;
  z-index: 2;
  min-height: 20px;
  padding: 3px 7px;
  border-color: rgba(255, 255, 255, .82);
  color: #245f98;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 1px 4px rgba(24, 47, 72, .18);
  font-size: 10px;
  backdrop-filter: blur(3px);
  cursor: default;
  pointer-events: none;
}

.alumni-banner-rank.alumni-score-rank-unranked {
  color: #536170;
  background: rgba(255, 255, 255, .94);
  font-size: 9px;
}

.alumni-identity-banner-rank {
  min-height: 24px;
  padding: 4px 9px;
  font-size: 11px;
}

.alumni-identity-banner-rank.alumni-predicted-linkedin-tag,
.alumni-identity-banner-rank.alumni-linkedin-only-tag,
.alumni-identity-banner-rank.alumni-no-linkedin-tag,
.alumni-identity-banner-rank.alumni-review-required-tag {
  font-size: 10px;
  font-weight: 700;
}

.alumni-card-banner {
  display: block;
  width: 100%;
  height: 100%;
}

.alumni-card-banner {
  object-fit: cover;
}

.alumni-card-header {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: -22px 12px 0;
  position: relative;
  z-index: 2;
}

.alumni-avatar-wrap {
  width: 56px;
  height: 56px;
  border: 2px solid #ffffff;
  border-radius: 50%;
}

.alumni-avatar-fallback {
  font-size: 14px;
}

.alumni-card-identity {
  min-width: 0;
  padding-top: 26px;
}

.alumni-card-name-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 6px;
}

.alumni-card-name-row .alumni-card-name {
  min-width: 0;
}

.alumni-card-name,
.alumni-card a.alumni-card-name {
  color: #2f3033 !important;
  font-size: 14px;
  text-decoration: none;
}

.alumni-card a.alumni-card-name:hover,
.alumni-card a.alumni-card-name:focus-visible {
  color: #356da8 !important;
  text-decoration: underline;
}

.alumni-card-role {
  margin: 2px 0 0;
}

.alumni-card-employer::before {
  content: '·';
  margin: 0 5px;
  color: #9aa3ad;
  font-weight: 400;
}

.alumni-card-details {
  margin: 1px 0 0;
}

.alumni-card-score-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 6px;
  margin: 6px 12px 0;
  padding: 4px 7px;
  border: 1px solid #e4e7eb;
  border-radius: 0;
  background: #f8f9fa;
}

.alumni-card-score-lead {
  display: flex;
  align-items: center;
  align-self: stretch;
  gap: 7px;
  padding-right: 0;
  border-right: 0;
}

.alumni-score-heading {
  display: flex;
  align-items: center;
  gap: 4px;
}

.alumni-score-rank {
  display: inline-flex;
  align-items: center;
  min-height: 16px;
  padding: 1px 4px;
  border: 1px solid #cbdced;
  border-radius: 2px;
  color: #356da8;
  background: #edf5fc;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.alumni-score-rank.alumni-banner-rank:hover,
.alumni-predicted-linkedin-tag:hover,
.alumni-linkedin-only-tag:hover {
  border-color: #cbdced;
  color: #356da8;
  background: #edf5fc;
  box-shadow: 0 1px 4px rgba(24, 47, 72, .18);
  cursor: default;
}

.alumni-no-linkedin-tag:hover {
  border-color: #d5dae0;
  color: #536170;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 1px 4px rgba(24, 47, 72, .18);
  cursor: default;
}

.alumni-score-rank.alumni-banner-rank.alumni-review-required-tag:hover,
.alumni-review-required-tag:hover {
  border-color: #f0d4a8 !important;
  color: #8a5a12 !important;
  background: #fff6e8 !important;
  box-shadow: none !important;
  cursor: default;
}

.alumni-card-name-row .alumni-score-rank,
.alumni-card-name-row .alumni-predicted-linkedin-tag,
.alumni-card-name-row .alumni-linkedin-only-tag,
.alumni-card-name-row .alumni-no-linkedin-tag,
.alumni-card-name-row .alumni-review-required-tag {
  flex: 0 0 auto;
}

.alumni-score-rank-unranked {
  color: #66717f;
  background: #f2f4f6;
  font-size: 8px;
  text-transform: none;
}

.alumni-score-caption {
  color: #66717f;
  font-size: 8px;
  font-weight: 700;
}

.alumni-score-value {
  color: color-mix(in srgb, var(--alumni-score-color, #21c768) 82%, #1d2733);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}

.alumni-score-value small {
  margin-left: 3px;
  color: #7a838d;
  font-size: 9px;
  font-weight: 700;
}

.alumni-card-score-grid .alumni-score-meter {
  grid-column: 1 / -1;
  height: 4px;
  margin-top: 3px;
  border-radius: 999px;
  background: #e9eef4;
  box-shadow: inset 0 1px 2px rgba(29, 39, 51, .08);
}

.alumni-card-score-grid .alumni-score-meter-fill {
  min-width: 3px;
  border-radius: inherit;
  background: var(--share-color) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24);
}

.alumni-card-summary {
  display: -webkit-box;
  overflow: hidden;
  flex: 1 1 auto;
  min-height: 33px;
  margin: 9px 12px 0;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1.5;
}

.alumni-card-review-reason {
  display: grid;
  gap: 2px;
  margin: 9px 12px 0;
  padding: 7px 8px;
  border-left: 3px solid #c47a2c;
  color: #5d4630;
  background: #fff8ef;
  font-size: 9px;
  line-height: 1.35;
}

.alumni-card-review-reason strong {
  color: #8b501d;
  font-size: 9px;
  font-weight: 800;
}

.alumni-card-review-reason span {
  font-weight: 650;
}

.alumni-card-footer {
  margin: 9px 12px 0;
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px solid #e4e7eb;
  font-size: 9px;
}

.alumni-card.display-card.alumni-card-skeleton,
.alumni-card-skeleton {
  display: flex !important;
  flex-direction: column !important;
  pointer-events: none;
}

.alumni-card-skeleton .skeleton-line,
.alumni-identity-header-skeleton .skeleton-line,
.alumni-identity-review-skeleton .skeleton-line {
  flex: 0 0 auto;
}

.alumni-skeleton-banner {
  --skeleton-width: 100%;
  --skeleton-height: 72px;
  border-radius: 0;
}

.alumni-skeleton-identity-banner {
  --skeleton-height: 100%;
  min-height: 0;
  aspect-ratio: 4 / 1;
}

.alumni-skeleton-avatar {
  --skeleton-width: 56px;
  --skeleton-height: 56px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
}

.alumni-skeleton-focus-avatar {
  --skeleton-width: 92px;
  --skeleton-height: 92px;
  width: 92px;
  height: 92px;
  margin-top: -32px;
}

.alumni-skeleton-title {
  --skeleton-height: 18px;
}

.alumni-skeleton-info {
  --skeleton-width: 16px;
  --skeleton-height: 16px;
  width: 16px;
  height: 16px;
}

.alumni-skeleton-score-grid .alumni-card-score-lead {
  min-height: 18px;
}

.alumni-skeleton-meter {
  grid-column: 1 / -1;
  height: 4px;
  margin-top: 0;
  border-radius: 0;
}

.alumni-skeleton-summary {
  display: grid;
  gap: 6px;
}

.alumni-skeleton-radio {
  --skeleton-width: 16px;
  --skeleton-height: 16px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
}

.alumni-skeleton-evidence {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid #e8ecf0;
  background: #f7f8fa;
}

.alumni-identity-header-skeleton,
.alumni-identity-review-skeleton {
  pointer-events: none;
}

.alumni-identity-review-skeleton .alumni-identity-review-head p {
  display: grid;
  gap: 6px;
}

.alumni-identity-review-skeleton .status-pill {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  min-height: 0;
}

.alumni-skeleton-candidate {
  cursor: default;
}

@media (max-width: 560px) {
  .alumni-card.display-card { padding: 0 0 12px !important; }
  .alumni-card-header {
    grid-template-columns: 52px minmax(0, 1fr);
    margin-inline: 12px;
  }
  .alumni-avatar-wrap { width: 52px; height: 52px; }
}

/* Alumni directory pagination */
.alumni-pagination {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 12px !important;
  width: max-content;
  max-width: 100%;
  margin: 14px auto 20px;
  padding: 6px 8px !important;
  border: 1px solid #d9dde2;
  border-radius: 4px;
  background: #ffffff;
}

.alumni-pagination-summary {
  display: flex;
  align-items: baseline;
  gap: 4px;
  padding: 0 4px;
  color: #66717f;
  font-size: 11px;
  white-space: nowrap;
}

.alumni-pagination-summary strong {
  color: #2f3033;
  font-size: 12px;
}

.alumni-pagination-controls,
.alumni-pagination-pages {
  display: flex;
  align-items: center;
}

.alumni-pagination-controls {
  justify-content: center;
  gap: 4px;
  min-width: 0;
}

.alumni-pagination-pages {
  gap: 4px;
}

#alumniPagination .alumni-page-button {
  position: static !important;
  display: inline-flex !important;
  grid-template-columns: none !important;
  align-items: center;
  justify-content: center !important;
  place-items: center !important;
  width: auto !important;
  min-width: 30px !important;
  height: auto !important;
  min-height: 30px !important;
  margin: 0 !important;
  padding: 5px 7px !important;
  border: 1px solid #cfd6de !important;
  border-radius: 3px !important;
  color: #46515e !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1;
}

#alumniPagination .alumni-page-step {
  min-width: 30px !important;
  padding-inline: 7px !important;
  font-size: 18px !important;
  font-weight: 500 !important;
}

#alumniPagination .alumni-page-button:hover:not(:disabled),
#alumniPagination .alumni-page-button:focus-visible {
  border-color: #7fa4c7 !important;
  color: #245f96 !important;
  background: #f2f7fc !important;
}

#alumniPagination .alumni-page-button.is-current {
  border-color: #356da8 !important;
  color: #ffffff !important;
  background: #356da8 !important;
}

#alumniPagination .alumni-page-button:disabled {
  border-color: #e3e6ea !important;
  color: #a5adb6 !important;
  background: #f5f6f7 !important;
  cursor: not-allowed;
}

.alumni-page-ellipsis {
  display: inline-grid;
  min-width: 24px;
  min-height: 30px;
  place-items: center;
  color: #7a838d !important;
  font-size: 12px !important;
}

@media (max-width: 560px) {
  .alumni-pagination {
    flex-wrap: wrap;
    gap: 7px 10px !important;
    width: calc(100% - 16px);
    padding: 7px !important;
  }
  .alumni-pagination-summary {
    flex: 1 1 auto;
    justify-content: center;
  }
  .alumni-pagination-controls {
    order: 3;
    flex: 1 0 100%;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 3px;
  }
}
/* Arabic and mixed-script values keep the application grid LTR while their
   own text direction is resolved independently from the first strong glyph. */
.bidi-auto-text {
  unicode-bidi: plaintext;
  text-align: start;
}

bdi.bidi-isolate {
  unicode-bidi: isolate;
}

svg .bidi-svg-text {
  unicode-bidi: isolate;
}

/* Match the snapshot coverage control to the compact upload fields. */
.snapshot-upload-row .ui-select-trigger {
  height: 34px;
  min-height: 34px;
  padding: 0 9px;
  border-radius: 6px;
  font-size: 12px;
}

/* Keep snapshot controls consistent with the compact, square form inputs. */
.snapshot-upload-row input[type="number"] {
  border: 1px solid #cbd3dc;
  border-radius: 0;
  color: #333333;
  background: #ffffff;
  font-weight: 600;
  box-shadow: none;
}

.snapshot-create-button:focus-visible {
  outline: 2px solid #2679c9;
  outline-offset: 2px;
}

.snapshot-create-button .icon {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: inherit;
}

#unlinkedImports {
  margin-top: 12px;
}

#unlinkedImports summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 8px;
}

/* Data Quality: compact summary and progressive disclosure of diagnostics. */
#quality .quality-summary-band { padding: 10px 12px !important; min-height: 0; }
#quality .quality-summary-title h2 { font-size: 15px !important; }
#quality .quality-kpi { padding: 0 12px !important; min-height: 0 !important; }
#quality .quality-kpi strong { font-size: 18px !important; }
#quality .quality-kpi em { display: none; }
#quality .priority-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 8px; }
#quality .priority-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 1fr auto; padding: 12px; gap: 12px; align-items: start; }
#quality .priority-track { display: none; }
#quality .priority-copy strong { font-size: 12px; white-space: normal; overflow: visible; text-overflow: clip; }
#quality .priority-copy span { font-size: 11px; }
#quality .priority-metric strong { font-size: 17px; }
#quality .priority-row.is-empty { opacity: 1; }
#quality .quality-details { margin: 16px 0; border: 1px solid var(--line); padding: 10px; }
#quality .quality-details > summary { cursor: pointer; font-weight: 600; font-size: 13px; }
.quality-warning-group { margin: 8px 0; border: 1px solid var(--line); border-radius: 5px; }
.quality-warning-group > summary { cursor: pointer; padding: 12px; font-size: 12px; }
.quality-warning-group > summary span { margin: 0 14px; color: var(--muted); }
.quality-warning-group > summary b { float: right; }
.quality-warning-body { padding: 0 12px 12px; }
.quality-warning-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 8px; font-size: 12px; }
@media (max-width: 640px) {
  #quality .priority-list { grid-template-columns: 1fr; }
  .quality-warning-group > summary span { display: block; margin: 6px 0; }
}

#quality .priority-row > .table-action {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: 2px;
  min-height: 30px;
  text-align: center;
}
#quality .priority-metric span {
  color: var(--quality-priority-color) !important;
  font-weight: 700;
  font-size: 12px;
}
#quality .quality-details,
#quality .quality-warning-group {
  padding: 0;
  border: 1px solid #dce3eb;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
#quality .quality-details > summary,
#quality .quality-warning-group > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  list-style: none;
  padding: 13px 14px;
  min-height: 44px;
  cursor: pointer;
  background: #f8fafc;
  transition: background .15s ease;
}
#quality summary::-webkit-details-marker { display: none; }
#quality summary::marker { content: ''; }
#quality .quality-details > summary::after,
#quality .quality-warning-group > summary::after {
  content: '';
  flex: 0 0 7px;
  width: 7px;
  height: 7px;
  border-right: 2px solid #66788a;
  border-bottom: 2px solid #66788a;
  transform: rotate(45deg);
  transition: transform .15s ease;
  margin: -4px 3px 0 auto;
}
#quality details[open] > summary::after { transform: rotate(225deg); margin-top: 4px; }
#quality details[open] > summary { border-bottom: 1px solid #dce3eb; }
#quality summary:hover { background: #eef4fa; }
#quality summary:focus-visible { outline: 2px solid #2679c9; outline-offset: -2px; }
#quality .quality-warning-group > summary span { flex: 1; margin: 0; }
#quality .quality-warning-group > summary b {
  float: none;
  padding: 3px 8px;
  border-radius: 5px;
  background: #eaf0f6;
  color: #40566c;
  white-space: nowrap;
}
#quality .quality-details > .panel-note { padding: 10px 14px 0; }
#quality .quality-details > .table-wrap { padding: 0 14px 14px; }
#quality .quality-warning-body:not(:empty) { padding-top: 12px; }
@media (max-width: 640px) {
  #quality .quality-warning-group > summary { flex-wrap: wrap; }
  #quality .quality-warning-group > summary span { flex-basis: 100%; order: 4; }
}

.snapshot-mapping-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.snapshot-regenerate-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  width: auto; height: 34px; padding: 0 12px; border-radius: 6px;
  font-size: 12px; font-weight: 600; white-space: nowrap;
  color: var(--text); background: #f4f7fb; border: 1px solid #d6e0ec;
}
.snapshot-regenerate-button:hover:not(:disabled) { background: #e8eff8; }
.snapshot-regenerate-button:disabled { opacity: .55; cursor: default; }

/* Snapshot actions share compact, square controls; creation is primary. */
#imports .snapshot-create-button,
#imports .snapshot-regenerate-button {
  height: 34px;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 0 !important;
  font-size: 12px;
  font-weight: 600;
  box-shadow: none;
}
#imports .snapshot-create-button {
  color: #ffffff !important;
  background: #2679c9 !important;
  border: 1px solid #2679c9 !important;
}
#imports .snapshot-create-button:hover:not(:disabled) {
  background: #2067ac !important;
  border-color: #2067ac !important;
}
.source-alumni-count { white-space: nowrap; }

/* Hide the entire administration group when its action is unavailable. */
#nav .nav-group[hidden] { display: none !important; }

/* Keep ungenerated alumni cards complete, with persistent per-person actions. */
.alumni-card-score-grid.is-empty .alumni-score-value { color: #7a838d; }
.alumni-card-summary.is-empty { color: #7a838d !important; }
.alumni-card .alumni-card-footer {
  flex: 0 0 auto;
  flex-wrap: wrap;
  row-gap: 8px;
  margin-top: 9px;
}
.alumni-card .alumni-card-action { min-height: 32px; font-size: 11px; }
.alumni-card .alumni-card-links { margin-left: auto; }
.alumni-card .alumni-card-action:disabled {
  color: #7a838d;
  border-color: #d9dde2;
  background: #f7f9fb;
  cursor: default;
}

.alumni-card-run-status:empty { display: none; }
.alumni-card-run-status { margin: 8px 12px 0; font-size: 11px; color: #8b501d; }

/* Keep banner media inside its cover rather than over the summary and actions. */
.alumni-card-cover { overflow: hidden; }
.alumni-card-banner-wrap { position: absolute; inset: 0; pointer-events: none; }
.alumni-card-banner { width: 100%; height: 100%; object-fit: cover; }
.alumni-card .alumni-card-summary { flex: 1 0 auto; min-height: 33px; }
.alumni-card .alumni-card-footer { position: relative; border-top: 1px solid #e4e7eb; }
.alumni-card .alumni-card-action { min-height: 24px; font-size: 9px; }

/* PDF report: the page layout is kept (card grids, stacks, tab sections), with
   AI analytics ahead of the charts. */
.dashboard-pdf-report .display-grid,
.dashboard-pdf-report .employment-block-grid {
  width: 100%;
  min-width: 0;
}

.dashboard-pdf-report .dashboard-report-ai {
  display: grid;
  min-width: 0;
  gap: 14px;
}

.dashboard-pdf-report .dashboard-report-subhead {
  margin: 0 0 12px;
  color: #1d2733;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.01em;
}

.dashboard-pdf-report .block-map-section {
  display: block !important;
}

/* Keep the desktop card grid whatever size the window is. */
.dashboard-pdf-report .display-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.dashboard-pdf-report .display-grid > .display-card,
.dashboard-pdf-report .display-grid > .display-card-stack {
  grid-column: span 1;
}

.dashboard-pdf-report .display-grid > .display-card.wide,
.dashboard-pdf-report .display-grid > .display-card-stack.wide {
  grid-column: span 2;
}

.dashboard-pdf-report .display-grid > .display-card.full,
.dashboard-pdf-report .display-grid > .dashboard-section-head,
.dashboard-pdf-report .display-grid > .employment-chart-trio,
.dashboard-pdf-report .display-grid > .employment-who-grid {
  grid-column: 1 / -1;
}

/* The AI section prints frameless so page breaks never cut a border. */
.dashboard-pdf-report .dashboard-report-ai > .aia {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Inline record details stay within the visible table width, including wide worksheets. */
.expandable-record-table {
  container-type: inline-size;
}
.expandable-record-table > table > tbody > tr > td {
  transition: none;
}
.expandable-record-table > table > tbody > .record-detail-row > td {
  padding: 0;
  position: static;
  white-space: normal;
  font-weight: normal;
}
.record-inline-panel {
  position: sticky;
  left: 0;
  width: calc(100cqw - 2px);
  max-width: 100%;
  max-height: 620px;
  box-sizing: border-box;
  padding: 20px;
  overflow: auto;
  overscroll-behavior: contain;
  background: var(--surface, var(--panel, #fff));
  color: var(--text);
  contain: layout paint;
}
.record-inline-panel > .focus-header { padding-right: 44px; }
.record-inline-panel .focus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.record-inline-panel .detail-table-wrap table { min-width: 0; }
.record-detail-toggle {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.record-detail-toggle:focus-visible {
  outline: 2px solid var(--accent, #47775c);
  outline-offset: 3px;
}
@media (max-width: 700px) {
  .record-inline-panel { padding: 14px; }
  .record-inline-panel .focus-grid { grid-template-columns: minmax(0, 1fr); }
}

@layer ku {
  .expandable-record-table > table > tbody > tr {
    background: var(--surface) !important;
  }
  .expandable-record-table > table > tbody > tr > td {
    color: var(--ink-2) !important;
    transition: none !important;
  }
  .expandable-record-table > table > tbody > tr.selected-row > td {
    background: var(--brand-soft) !important;
    color: var(--ink) !important;
  }
  .expandable-record-table > table > tbody > .record-detail-row > td {
    padding: 0 !important;
    position: static !important;
    background: var(--surface) !important;
  }
  .record-inline-panel,
  .record-inline-panel .focus-header strong,
  .record-inline-panel .fact-list strong,
  .record-inline-panel .missing-fields-summary strong {
    color: var(--ink) !important;
  }
  .record-inline-panel .fact-list span,
  .record-inline-panel .focus-header p {
    color: var(--ink-3) !important;
  }
  .record-inline-panel .fact-list div {
    border-color: var(--line) !important;
  }
    .record-detail-toggle {
    color: inherit !important;
    background: transparent !important;
  }
}