/* src/css/foundation/foundation_theme.css */
html {
  font-size: clamp(87.5%, 0.2vw + 69.75%, 106.25%);
}
:root {
  font-family:
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif;
  --text-xs: 0.8125rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 2rem;
  --text-2xl: 3rem;
  color: #242424;
  background: #f4f3f1;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --cgi-red: #e31937;
  --cgi-red-dark: #b80f29;
  --cgi-purple: #3b0b5a;
  --ink: #242424;
  --muted: #686868;
  --paper: #ffffff;
  --line: #ddd9d5;
  --soft: #f7f5f3;
  --success: #26734d;
  --warning: #945d00;
  --shadow: 0 1.125rem 3rem rgba(45, 35, 31, 0.08);
  --shadow-panel: 0 1px 0 var(--line), 0 0.75rem 2rem -1.5rem rgba(45, 35, 31, 0.18);
  --focus-ring: #242424;
  --icon-sign-out: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E");
  --radius-sm: 0.5rem;
}
* {
  box-sizing: border-box;
}
html {
  min-width: min(320px, 100%);
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}
body {
  min-width: min(320px, 100%);
  min-height: 100vh;
  margin: 0;
}
button,
select {
  font: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.primary-button:disabled {
  opacity: 1;
  border-color: transparent;
  background: #ebe8e5;
  color: #5a5552;
  box-shadow: none;
}
a {
  color: inherit;
}
[hidden] {
  display: none !important;
}
:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.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;
}

/* src/css/foundation/foundation_header.css */
.app-shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main {
  flex: 1;
}
.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 6.375rem;
  padding: 0 clamp(1.25rem, 5vw, 4.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  background: rgba(255, 255, 255, 0.97);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(0.625rem);
}
.topbar[data-assessment-locked=true] :is(button, a, input, select, summary, [tabindex]) {
  opacity: 0.45;
  filter: grayscale(1);
  cursor: not-allowed;
}
.brand {
  min-width: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}
.brand-logo {
  display: block;
  width: 4.625rem;
  height: 2.9375rem;
  flex: 0 0 auto;
  object-fit: contain;
}
.brand-divider {
  width: 1px;
  height: 3rem;
  flex: 0 0 auto;
  background: var(--line);
}
.academy-brand-logo {
  display: block;
  width: 5.75rem;
  height: 5.75rem;
  flex: 0 0 auto;
  object-fit: contain;
}
.brand-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.brand-label strong {
  font-size: var(--text-md);
}
.brand-area {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.arena-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.arena-brand-copy {
  min-width: 0;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 0.75rem;
}
.arena-brand-copy .brand-title {
  flex: 0 0 auto;
}
.arena-brand-copy .brand-label strong {
  white-space: nowrap;
}
.release-label {
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 400;
  line-height: 1.4;
  white-space: nowrap;
}
.release-version {
  color: #333333;
  font-weight: 600;
  text-decoration: none;
}
.release-version:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.release-version:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}
.dev-pill {
  flex: 0 0 auto;
  padding: 0.1875rem 0.5rem;
  border: 1px solid #e6c680;
  border-radius: 999px;
  background: #fff5da;
  color: #775000;
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}

/* src/css/foundation/foundation_maintenance.css */
.maintenance-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.375rem 0.6875rem;
  border: 1px solid #e6c680;
  border-radius: 999px;
  background: #fff5da;
  color: #775000;
  font-size: var(--text-xs);
  font-weight: 700;
  white-space: nowrap;
}
.maintenance-badge::before {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: currentColor;
}
.maintenance-symbol {
  display: inline-grid;
  place-items: center;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: var(--radius-sm);
  background: #fff5da;
  color: #775000;
}
.access-card.maintenance-card h1 {
  font-size: var(--text-xl);
}
.maintenance-card h1:focus {
  outline: none;
}
.access-card > .maintenance-reason {
  padding: 0.875rem 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--soft);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.maintenance-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* src/css/notifications/notifications_toasts.css */
.toast-stack {
  box-sizing: border-box;
  position: fixed;
  right: 1rem;
  bottom: 1.5rem;
  left: auto;
  top: auto;
  margin: 0;
  border: 0;
  padding: 0;
  background: transparent;
  z-index: 40;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.75rem;
  width: min(26.25rem, calc(100% - 2rem));
  pointer-events: none;
}
.toast {
  box-sizing: border-box;
  max-width: 100%;
  padding: 0.875rem 1.0625rem;
  border-radius: var(--radius-sm, 0.25rem);
  background: #2d2927;
  color: #fff;
  box-shadow: var(--shadow-panel, 0 8px 24px #0002);
  line-height: 1.45;
  overflow-wrap: anywhere;
  pointer-events: auto;
}
.toast.error {
  background: #8c1628;
}
@media print {
  .toast-stack {
    display: none !important;
  }
}

/* src/css/account/account_navigation.css */
@media (max-width: 1220px) {
  .brand-area:has(.maintenance-badge:not([hidden])) {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding-bottom: 0.5rem;
  }
  .maintenance-badge {
    margin-left: 0.25rem;
  }
}
@media (max-width: 760px) {
  .topbar:has(.maintenance-badge:not([hidden])) .brand-area {
    grid-area: brand;
  }
  .topbar:has(.maintenance-badge:not([hidden])) {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "brand account" "navigation navigation";
  }
  .topbar:has(.maintenance-badge:not([hidden])) .account {
    grid-area: account;
    justify-self: end;
  }
  .topbar:has(.maintenance-badge:not([hidden])) .arena-navigation {
    grid-area: navigation;
    justify-self: center;
  }
}
.arena-navigation {
  min-width: 0;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.875rem;
}
.arena-navigation:has(.main-navigation[hidden]) {
  display: none;
}
.main-navigation {
  margin-left: 0;
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 0.25rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--soft);
}
.main-navigation button {
  min-height: 2.125rem;
  padding: 0 0.8125rem;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: #625d59;
  font-size: var(--text-xs);
  font-weight: 700;
}
.main-navigation button:hover {
  color: var(--cgi-red-dark);
}
.main-navigation button.active {
  background: #fff;
  color: var(--ink);
  box-shadow: 0 1px 0.3125rem rgba(45, 35, 31, 0.12);
}
.meeting-header-link {
  padding: 0.375rem 0.25rem;
  color: var(--cgi-purple);
  font-size: var(--text-xs);
  font-weight: 650;
  text-decoration: none;
  white-space: nowrap;
}
.meeting-header-link:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* src/css/account/account_identity.css */
.account {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-align: right;
  font-size: var(--text-sm);
}
.admin-trigger {
  width: 2.375rem;
  height: 2.375rem;
  flex: 0 0 2.375rem;
  padding: 0.5rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: #5b5551;
}
.admin-trigger:hover,
.admin-trigger.active {
  border-color: #d79aa3;
  background: #fff4f6;
  color: var(--cgi-red-dark);
}
.admin-trigger:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.admin-trigger svg {
  width: 1.3125rem;
  height: 1.3125rem;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}
.profile-trigger {
  min-width: 0;
  padding: 3px;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
}
.profile-trigger:hover {
  background: var(--soft);
}
.profile-trigger:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.account-copy {
  display: grid;
  min-width: 0;
  max-width: 11.875rem;
  gap: 2px;
  line-height: 1.2;
  text-align: left;
}
.profile-trigger strong {
  max-width: 11.875rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-role {
  overflow: hidden;
  color: #716b70;
  font-size: 0.6875rem;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-avatar {
  width: 2rem;
  height: 2rem;
  flex: 0 0 2rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #d9d2ce;
  border-radius: 50%;
  background: #f5e8eb center / cover no-repeat;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 800;
}

/* src/css/rank/rank_badge.css */
.skill-rank-account {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.3125rem;
  flex: 0 0 auto;
}
.skill-rank-illustration {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  object-fit: contain;
}
.skill-rank-badge {
  width: 2.625rem;
  height: 2.625rem;
  display: grid;
  place-items: center;
  border: 2px solid #a69ac4;
  border-radius: 50%;
  background: #f5f1fc;
  color: #523580;
  font-size: var(--text-lg);
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
.skill-rank-badge:hover {
  background: #eae1f7;
  border-color: #7754a8;
}
.skill-rank-badge:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
.skill-rank-badge.is-manual-level {
  background: #fff4d1;
  border-color: #a37b28;
  color: #815500;
}
.skill-rank-tooltip {
  position: fixed;
  z-index: 40;
  top: var(--rank-tooltip-top, 4rem);
  right: 0.75rem;
  width: min(21.875rem, calc(100vw - 1.5rem));
  max-height: calc(100dvh - var(--rank-tooltip-top, 4rem) - 0.75rem);
  overflow-y: auto;
  padding: 1.0625rem 1.1875rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font-size: var(--text-sm);
  line-height: 1.55;
  text-align: left;
  box-shadow: 0 1rem 2.5rem -1rem rgba(45, 35, 31, 0.35);
}
.skill-rank-tooltip > strong {
  display: block;
  font-size: var(--text-md);
}
.skill-rank-tooltip-heading {
  display: block;
  margin-top: 0.75rem;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.skill-rank-tooltip ul {
  margin: 0.4375rem 0 0;
  padding-left: 1.0625rem;
}
.skill-rank-tooltip ul {
  color: #4a4542;
  font-size: var(--text-sm);
  line-height: 1.5;
}
.skill-rank-tooltip li + li {
  margin-top: 0.4375rem;
}
.skill-rank-tooltip li::marker {
  color: #4f3482;
}

/* src/css/rank/rank_progress.css */
.rank-page {
  width: min(76rem, 100%);
  margin: 0 auto;
  padding: 1.625rem clamp(1.125rem, 3vw, 2.75rem) 3.375rem;
}
.rank-heading {
  margin-bottom: 1rem;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 1.375rem;
}
.rank-heading h1 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.rank-heading > p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
}
.rank-progress {
  overflow: hidden;
  margin-bottom: 1.375rem;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.rank-progress:empty {
  display: none;
}
.rank-progress-top {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 1.25rem clamp(1rem, 2.5vw, 1.75rem) 0.75rem;
}
.rank-hero-number {
  width: 4.875rem;
  height: 4.875rem;
  flex: 0 0 4.875rem;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #4f3482;
  color: #fff;
  font-size: var(--text-xl);
  font-weight: 800;
}
.rank-marker {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.rank-artwork {
  display: block;
  object-fit: contain;
  border-radius: 50%;
}
.rank-marker-hero .rank-artwork {
  width: 5rem;
  height: 5rem;
}
.rank-marker-row {
  width: 3rem;
  min-height: 3rem;
}
.rank-marker-row .rank-artwork {
  width: 3rem;
  height: 3rem;
}
.has-artwork .rank-hero-number {
  position: absolute;
  right: -3px;
  bottom: -2px;
  width: 2rem;
  height: 2rem;
  font-size: var(--text-md);
}
.has-artwork .rank-row-number {
  position: absolute;
  right: -3px;
  bottom: -2px;
  width: 1.375rem;
  height: 1.375rem;
  font-size: var(--text-xs);
}
.rank-identity h2 {
  margin: 0 0 0.25rem;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.rank-identity p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
}
.rank-next-review {
  display: grid;
  gap: 0.375rem;
  min-width: 15rem;
  max-width: 19rem;
  margin-left: auto;
  font-size: var(--text-sm);
}
.rank-next-review small {
  color: var(--muted);
}
.rank-assessment-action {
  margin-top: 0.25rem;
  padding: 0.625rem 0.875rem;
  font-size: var(--text-sm);
  white-space: normal;
}
.rank-assessment-wait {
  color: var(--ink);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.5;
}
.rank-next-review .rank-training-action {
  min-width: 0;
  min-height: 2.625rem;
  margin-top: 0.25rem;
  padding: 0.625rem 0.875rem;
  font-size: var(--text-sm);
  white-space: normal;
}
.rank-next-review .rank-training-action:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.rank-track {
  margin: 0;
  padding: 0.25rem clamp(1rem, 2.5vw, 1.75rem) 1rem;
  display: grid;
  grid-template-columns: repeat(11, minmax(0, 1fr));
  gap: 0.25rem;
  list-style: none;
}
.rank-track li {
  height: 1.75rem;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm);
  background: #ebe8ec;
  color: #6f6a74;
  font-size: var(--text-xs);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.rank-track li.is-reached {
  background: #4f3482;
  color: #fff;
}
.rank-track li.is-next {
  background: #fff;
  box-shadow: inset 0 0 0 2px var(--cgi-red);
  color: var(--cgi-red-dark);
}
.rank-progress-note {
  margin: 0;
  padding: 0.75rem clamp(1rem, 2.5vw, 1.75rem);
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}

/* src/css/rank/rank_record.css */
.rank-achievement-record {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem 0.75rem;
  margin-top: 0.875rem;
}
.rank-record-download {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.875rem;
  font-size: var(--text-sm);
  white-space: normal;
  text-align: left;
}
.rank-record-icon {
  flex: 0 0 auto;
  width: 1.125rem;
  height: 1.125rem;
}
.rank-achievement-record small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.rank-test-level {
  min-width: 0;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.rank-test-select {
  width: min(20rem, 100%);
  max-width: 100%;
  min-height: 2.5rem;
}
@media (max-width: 760px) {
  .rank-achievement-record {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* src/css/rank/rank_guide.css */
.rank-guide {
  overflow: hidden;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.rank-guide-heading {
  padding: 1.125rem clamp(1rem, 2.5vw, 1.75rem) 0.875rem;
}
.rank-guide-heading h2 {
  margin: 0 0 0.25rem;
  font-size: var(--text-lg);
  font-weight: 800;
}
.rank-guide-heading p {
  max-width: 42.5rem;
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.rank-list {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--text-sm);
}
.rank-list > li {
  display: grid;
  grid-template-columns: 16.25rem minmax(0, 1fr);
  border-top: 1px solid var(--line);
}
.rank-list-label,
.rank-list-description {
  min-width: 0;
  padding: 0.875rem clamp(1rem, 2.5vw, 1.75rem);
}
.rank-list-label {
  display: flex;
  align-items: center;
  font-weight: 600;
}
.rank-list-description {
  color: #4a4542;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.rank-level-summary {
  margin: 0 0 0.375rem;
  font-weight: 700;
  color: var(--ink);
}
.rank-capabilities {
  margin: 0;
  padding-left: 1.25rem;
  list-style-type: square;
}
.rank-capabilities li {
  padding-left: 2px;
  margin-top: 0.25rem;
}
.rank-capabilities li::marker {
  color: #4f3482;
}
.rank-row-label {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}
.rank-row-number {
  width: 1.875rem;
  height: 1.875rem;
  display: inline-grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #ebe8ec;
  color: #6f6a74;
  font-weight: 800;
  vertical-align: middle;
}
.rank-row-title {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 800;
  line-height: 1.3;
}
.rank-row-title small {
  display: block;
  margin-top: 2px;
  font-size: var(--text-xs);
  font-weight: 700;
  color: #4f3482;
}
.rank-list .current-rank {
  background: #f6f2fb;
  box-shadow: inset 3px 0 #4f3482;
}
.rank-list .manual-rank {
  background: #fffbef;
  box-shadow: inset 3px 0 #a37b28;
}
.rank-list .manual-rank .rank-row-title small {
  color: #815500;
}
.rank-track .is-manual-level {
  background: #fff4d1;
  color: #815500;
  border-color: #a37b28;
}
.current-rank .rank-row-number,
.earned-rank .rank-row-number {
  background: #4f3482;
  color: #fff;
}
.rank-list .next-rank .rank-row-title small {
  color: var(--cgi-red-dark);
}
.next-rank .rank-row-number {
  background: #fff;
  box-shadow: inset 0 0 0 2px var(--cgi-red);
  color: var(--cgi-red-dark);
}
.rank-list .future-rank .rank-list-description {
  color: var(--muted);
}
.rank-list .future-rank .rank-level-summary {
  color: #4a4542;
}
.admin-question-meta .rank-level-meta {
  color: #644287;
  background: #f0eaf7;
}
#adminRankLevelHelp {
  line-height: 1.5;
  color: var(--muted);
  font-weight: 400;
}
@media (max-width: 760px) {
  .rank-progress-top {
    flex-wrap: wrap;
    padding: 1.25rem;
    gap: 0.875rem;
  }
  .rank-next-review {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0.3125rem 0 0;
  }
  .rank-list > li {
    grid-template-columns: 9.0625rem minmax(0, 1fr);
  }
  .rank-list-label,
  .rank-list-description {
    padding: 0.75rem 0.9375rem;
  }
  .rank-row-label {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
  }
  .rank-list-description {
    font-size: var(--text-sm);
  }
  .rank-hero-number {
    width: 3.875rem;
    height: 3.875rem;
    flex-basis: 3.875rem;
    font-size: var(--text-xl);
  }
  .rank-identity {
    flex: 1;
    min-width: 9.375rem;
  }
  .rank-identity h2 {
    font-size: var(--text-md);
  }
  .rank-progress-note {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
  }
  .skill-rank-badge {
    width: 2.25rem;
    height: 2.25rem;
    font-size: var(--text-lg);
  }
}

/* src/css/foundation/foundation_buttons.css */
.primary-button,
.secondary-button,
.text-button {
  min-height: 2.75rem;
  padding: 0 1.125rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: var(--radius-sm);
  font-weight: 700;
  text-decoration: none;
  transition:
    transform 0.15s ease,
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
.primary-button {
  border: 0;
  background: var(--cgi-red);
  color: #fff;
  box-shadow: var(--shadow-panel);
}
.primary-button:hover:not(:disabled) {
  transform: translateY(-1px);
  background: var(--cgi-red-dark);
  box-shadow: var(--shadow-panel);
}
.secondary-button {
  border: 1px solid var(--line);
  background: #fff;
  color: #444;
}
.secondary-button:hover:not(:disabled) {
  border-color: #aaa39e;
  background: #fcfbfa;
}
.primary-button.compact,
.secondary-button.compact {
  min-height: 2.25rem;
  padding: 0 0.6875rem;
  font-size: var(--text-xs);
}
.text-button {
  min-height: 2.25rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--line);
}
.text-button:hover:not(:disabled) {
  text-decoration-color: currentColor;
}
.wide {
  width: 100%;
}
.eyebrow {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.loading-page {
  min-height: calc(100vh - 7.375rem);
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 0.75rem;
  color: var(--muted);
}
.loading-page p {
  margin: 0;
}
.spinner {
  width: 1.375rem;
  height: 1.375rem;
  display: inline-block;
  border: 2px solid #ded9d6;
  border-top-color: var(--cgi-red);
  border-radius: 50%;
  animation: spin 0.75s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.access-page {
  min-height: calc(100vh - 7.375rem);
  padding: 3.375rem 1.25rem;
  display: grid;
  place-items: center;
  background:
    linear-gradient(
      135deg,
      rgba(227, 25, 55, 0.035),
      transparent 48%),
    #f5f4f2;
}
.access-card {
  width: min(100%, 26.25rem);
  padding: 2rem 2.25rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
}
.access-card h1 {
  margin: 0.625rem 0 0.625rem;
  font-size: var(--text-2xl);
  line-height: 1.05;
}
.access-card > p:not(.eyebrow) {
  margin: 0 0 1.5rem;
  color: #57504c;
  line-height: 1.5;
}
.access-note {
  margin-top: 0.75rem;
  display: block;
  color: var(--muted);
  text-align: center;
  line-height: 1.4;
}

/* src/css/learning/learning_launch.css */
.home-page {
  padding-bottom: 2.125rem;
}
.path-section {
  width: min(118rem, 100%);
  margin: 0 auto;
  padding: 1.625rem clamp(1.125rem, 3vw, 2.75rem) 1.25rem;
}
.path-section > .learning-heading {
  margin-bottom: 1rem;
}
.path-section .learning-heading h1 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.streak-launch {
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.streak-launch > div {
  min-width: 0;
  display: grid;
  gap: 0.125rem;
}
.streak-launch .eyebrow {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.streak-launch strong {
  font-size: var(--text-lg);
  font-weight: 800;
}
.streak-launch span {
  max-width: 45rem;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.streak-launch button {
  min-width: 8.25rem;
  box-shadow: none;
}
.section-heading {
  margin-bottom: 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 2rem;
}
.section-heading h2 {
  margin: 0.375rem 0 0;
  font-size: var(--text-xl);
}
.section-heading > p {
  max-width: 28.125rem;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.path-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.875rem;
}
.level-challenge-grid {
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
}

/* src/css/learning/learning_cards.css */
.path-card {
  position: relative;
  min-width: 0;
  padding: 1.125rem;
  display: flex;
  flex-direction: column;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.path-card-heading {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.path-card-heading > div:last-child {
  min-width: 0;
}
.path-card-heading p {
  margin: 0 0 0.125rem;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.2;
}
.path-icon {
  width: 2.5rem;
  height: 2.5rem;
  flex: 0 0 2.5rem;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm);
  background: #efeaf7;
  color: #4f3482;
  font-size: var(--text-md);
  font-weight: 800;
}
.path-card h3 {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.path-topics {
  margin: 1.125rem 0 0;
  padding: 0;
  list-style: none;
}
.path-topics li {
  position: relative;
  padding: 0.5625rem 0 0.5625rem 0.9375rem;
  border-top: 1px solid #eee9e6;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.42;
}
.path-topics li::before {
  position: absolute;
  top: 0.875rem;
  left: 1px;
  width: 0.3125rem;
  height: 0.3125rem;
  border-radius: 50%;
  background: var(--cgi-red);
  content: "";
}
.path-topics strong,
.path-topics span {
  display: block;
}
.path-topics strong {
  margin-bottom: 2px;
  color: #3e3936;
  font-size: var(--text-xs);
}
.track-actions {
  margin-top: auto;
  padding-top: 1rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}
.path-start {
  width: 100%;
  min-height: 2.375rem;
  padding: 0 0.625rem;
  font-size: var(--text-sm);
}
.level-card {
  min-height: 11.5rem;
}
.level-card .path-card-heading {
  align-items: flex-start;
}
.level-card .track-actions {
  grid-template-columns: 1fr;
}
.level-card-description {
  margin: 0.875rem 0 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.level-card.is-reached .path-icon {
  background: #4f3482;
  color: #fff;
}
.level-card.current-level {
  border-color: #d9cfeb;
}
.level-card.current-level .path-card-heading p {
  color: #4f3482;
}
.level-card.featured {
  border-color: rgba(227, 25, 55, 0.35);
}
.level-card.featured .path-card-heading p {
  color: var(--cgi-red-dark);
}
.level-card.featured .path-icon {
  background: #fdecef;
  color: var(--cgi-red-dark);
}

/* src/css/assessment/assessment_launch.css */
.assessment-page {
  width: min(76rem, 100%);
  margin: 0 auto;
  padding: 1.625rem clamp(1.125rem, 3vw, 2.75rem) 4rem;
}
.assessment-heading {
  max-width: 45rem;
}
.assessment-heading .eyebrow {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.assessment-heading h1 {
  margin: 0.125rem 0 0;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.assessment-launch-card {
  margin-top: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 24rem);
  align-items: center;
  gap: 2rem;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow);
}
.assessment-launch-card > div {
  min-width: 0;
}
.assessment-launch-card h2 {
  margin: 0.125rem 0 0.5rem;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.assessment-launch-card p {
  color: var(--muted);
  line-height: 1.5;
}
.assessment-overview {
  width: 100%;
  margin: 0.875rem 0;
}
.assessment-overview video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 1px solid #ded8e5;
  border-radius: var(--radius-sm);
  background: #f3eef8;
}
.assessment-overview figcaption {
  margin-top: 0.375rem;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.4;
}
@media (max-width: 520px) {
  .assessment-overview {
    margin-inline: auto;
  }
}
.assessment-topics {
  margin: 0.625rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  list-style: none;
}
.assessment-topics > li {
  max-width: 100%;
  padding: 0.25rem 0.5rem;
  border-radius: var(--radius-sm);
  background: #f3eef8;
  color: #583775;
  font-size: var(--text-xs);
  font-weight: 600;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
@media (max-width: 520px) {
  .assessment-topics {
    justify-content: center;
  }
}

/* src/css/assessment/assessment_readiness.css */
.assessment-rules {
  margin: 1rem 0 0;
  padding-left: 1.25rem;
  color: #554f4b;
  font-size: var(--text-sm);
  line-height: 1.65;
}
.assessment-rules > li + li {
  margin-top: 0.375rem;
}
.assessment-rules.assessment-follow-up-rules {
  display: block;
  margin-top: 0.875rem;
  padding: 0.625rem 0.875rem 0.625rem 2rem;
  border: 1px solid #e8e5e2;
  border-radius: var(--radius-sm);
  background: #f3f2f0;
  color: #655e59;
  font-size: var(--text-xs);
  line-height: 1.6;
  text-align: left;
}
.assessment-follow-up-rules > li + li {
  margin-top: 0.25rem;
}
.assessment-passing-rule {
  margin: 0.3125rem 0;
  color: var(--cgi-red-dark);
  font-size: var(--text-md);
  line-height: 1.5;
}
.assessment-passing-rule strong {
  font-weight: 800;
}
.assessment-time-rule small {
  display: block;
  margin-top: 0.375rem;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.assessment-actions {
  display: grid;
  gap: 0.625rem;
  min-width: 11.875rem;
}
.assessment-actions > button {
  width: 100%;
}
.assessment-actions .assessment-follow-up-rules {
  margin: 0;
}
.assessment-readiness {
  padding: 0.75rem 0.875rem;
  border: 1px solid #ded9d5;
  border-left: 3px solid #82746c;
  border-radius: var(--radius-sm);
  background: #faf9f8;
  color: #554f4b;
  font-size: var(--text-xs);
  line-height: 1.5;
  text-align: left;
}
.assessment-readiness[data-readiness=warning] {
  border-color: #e8b9bd;
  border-left-color: #ad3544;
  background: #fff5f5;
  color: #8d2935;
}
.assessment-readiness[data-readiness=recommendation] {
  border-color: #e7d6a4;
  border-left-color: #b18320;
  background: #fffbf0;
  color: #78581b;
}
.assessment-readiness[data-readiness=ready] {
  border-color: #bedbc8;
  border-left-color: #368557;
  background: #f2faf5;
  color: #28623f;
}
.assessment-readiness-heading {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
}
.assessment-readiness-heading > strong {
  font-size: var(--text-sm);
}
.assessment-readiness-icon {
  flex: 0 0 1rem;
}
.assessment-readiness > p {
  margin: 0.3125rem 0 0;
  color: inherit;
  line-height: 1.5;
}
.assessment-training-note {
  display: block;
  margin: 0.375rem 0 0.5rem;
  font-size: var(--text-xs);
  line-height: 1.5;
}
.assessment-training-link {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.assessment-training-link:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 0.25rem;
  border-radius: var(--radius-sm);
}

/* src/css/quiz/quiz_layout.css */
.quiz-page {
  width: min(80rem, 100%);
  margin: 0 auto;
  padding: 2rem clamp(1.125rem, 4vw, 3.25rem) 4.375rem;
}
.quiz-header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1.25rem;
}
.quiz-identity {
  text-align: center;
}
.quiz-identity strong {
  margin-top: 0.25rem;
  display: block;
}
.quiz-timer {
  justify-self: end;
  min-width: 5.5rem;
  display: flex;
  flex-direction: column;
  text-align: right;
}
.quiz-timer small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.quiz-timer strong {
  font-variant-numeric: tabular-nums;
}
.progress-track {
  height: 0.3125rem;
  margin-top: 1.5rem;
  overflow: hidden;
  border-radius: 999px;
  background: #dfdcda;
}
.progress-track span {
  height: 100%;
  display: block;
  border-radius: inherit;
  background: var(--cgi-red);
  transition: width 0.2s ease;
}
.quiz-layout {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: 11.875rem minmax(0, 51.25rem);
  gap: 2rem;
  justify-content: center;
  align-items: start;
}
.quiz-page.streak-page {
  padding-top: 1.5625rem;
}
.quiz-layout.streak-layout {
  margin-top: 0.875rem;
  grid-template-columns: minmax(0, 56.25rem);
}
.streak-page .question-actions {
  justify-content: flex-end;
}
.streak-run-status {
  width: min(56.25rem, 100%);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid #e3c7cc;
  border-radius: var(--radius-sm);
  background:
    linear-gradient(
      90deg,
      #fff9fa,
      #fff);
  box-shadow: var(--shadow-panel);
}
.streak-run-status[hidden] {
  display: none;
}
.streak-run-summary {
  padding: 0.75rem 1.0625rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.375rem;
}
.streak-run-summary > div {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 0.5625rem;
}
.streak-run-status small {
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 900;
}
.streak-run-status strong {
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
}
.streak-run-summary > div:first-child strong {
  font-size: var(--text-md);
}

/* src/css/quiz/quiz_navigator.css */
.quiz-sidebar {
  position: sticky;
  top: 6.5625rem;
  min-width: 0;
}
.assessment-controls {
  margin-top: 1rem;
  display: grid;
  gap: 0.625rem;
}
.assessment-controls button {
  width: 100%;
  white-space: normal;
}
.question-map {
  padding: 1.1875rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
}
.question-map > small {
  display: block;
  color: var(--muted);
  font-weight: 800;
}
.question-map > div {
  margin: 0.875rem 0 1.125rem;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.3125rem;
}
.question-map button {
  aspect-ratio: 1;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: #5b5652;
  font-size: var(--text-xs);
}
.question-map > div button {
  position: relative;
}
.question-map button.bookmarked::after {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 0;
  height: 0;
  border-top: 0.4375rem solid #ad741b;
  border-left: 0.4375rem solid transparent;
  content: "";
}
.question-map .bookmark-review-button {
  aspect-ratio: auto;
  width: 100%;
  min-height: 2rem;
  margin-top: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4375rem;
  border-color: #dec78d;
  background: #fff9eb;
  color: #825614;
  font-size: var(--text-xs);
}
.question-map .bookmark-review-button:hover {
  border-color: #ad741b;
}
.question-map button:hover {
  border-color: #cb8e97;
}
.question-map button.current {
  border-color: var(--cgi-red);
  box-shadow: 0 0 0 2px rgba(227, 25, 55, 0.12);
  color: var(--cgi-red-dark);
}
.question-map button.answered {
  border-color: #b9d3c5;
  background: #e9f4ee;
  color: var(--success);
}
.question-map > span {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  color: var(--muted);
  font-size: var(--text-xs);
}
.question-map i {
  width: 0.5625rem;
  height: 0.5625rem;
  border-radius: var(--radius-sm);
  background: #e9f4ee;
  border: 1px solid #b9d3c5;
}

/* src/css/question/question_header.css */
.question-card {
  min-width: 0;
  padding: clamp(1.5rem, 5vw, 3rem);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow);
}
.question-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.question-meta span {
  padding: 0.3125rem 0.5rem;
  border-radius: var(--radius-sm);
  background: var(--soft);
  color: #625d59;
  font-size: var(--text-xs);
  font-weight: 800;
}
.question-meta .level-badge {
  margin-left: auto;
  border: 1px solid #c9b6db;
  background: #f3eef8;
  color: #583775;
}
.learning-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.875rem;
}
.learning-heading h1 {
  min-width: 0;
}
.question-bookmark-button {
  flex: 0 0 auto;
  min-width: 2.125rem;
  min-height: 2.125rem;
  padding: 0.4375rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: #6b6258;
  cursor: pointer;
}
.question-bookmark-button[aria-pressed=true] {
  border-color: #dec78d;
  background: #fff9eb;
  color: #825614;
}
.question-bookmark-button[aria-pressed=true] svg {
  fill: currentColor;
}
.question-bookmark-button:focus-visible,
.bookmark-review-button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
@media (max-width: 600px) {
  .question-bookmark-button {
    min-width: 40px;
    min-height: 40px;
  }
  .question-meta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    gap: 6px 8px;
  }
  .question-meta > span {
    grid-column: 1;
    justify-self: start;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  .question-meta .level-badge {
    margin-left: 0;
  }
  .question-meta > .question-bookmark-button {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: start;
  }
}

/* src/css/question/question_answer_options.css */
.question-card h1 {
  margin: 1.25rem 0 1.75rem;
  font-size: var(--text-xl);
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.quiz-page[data-assessment-active=true]:not([hidden]) :is(#questionPrompt, #answerOptions) {
  -webkit-user-select: none;
  user-select: none;
}
.question-card fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.625rem;
  border: 0;
}
.answer-option {
  min-width: 0;
  padding: 0.9375rem 1.0625rem;
  display: grid;
  grid-template-columns: 1.875rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: start;
  border: 1px solid #d8d3cf;
  border-radius: var(--radius-sm);
  background: #fff;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.answer-option:hover {
  border-color: #d58a95;
  background: #fffafb;
}
.answer-option:has(input:checked) {
  border-color: var(--ink);
  background: #f6f5f4;
  box-shadow: 0 0 0 1px var(--ink);
}
.answer-option input {
  position: absolute;
  opacity: 0;
}
.option-letter {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  border: 1px solid #cdc7c3;
  border-radius: 50%;
  color: #665f5b;
  font-size: var(--text-xs);
  font-weight: 800;
}
.answer-option:has(input:checked) .option-letter {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}
.option-text {
  min-width: 0;
  padding-top: 3px;
  color: #494441;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.answer-option input:focus-visible + .option-letter {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.answer-option.correct {
  border-color: #8fc2a6;
  background: #f0f8f4;
}
.answer-option.incorrect {
  border-color: #dfa5ae;
  background: #fff3f5;
}
.answer-option.correct .option-letter {
  border-color: var(--success);
  background: var(--success);
  color: #fff;
}
.answer-option.incorrect .option-letter {
  border-color: var(--cgi-red-dark);
  background: var(--cgi-red-dark);
  color: #fff;
}
.streak-page .answer-option {
  transition: none;
}
.streak-page .answer-option:has(input:checked) {
  border-color: #aeb8b3;
  background: #f5f7f6;
  box-shadow: 0 0 0 2px rgba(75, 92, 84, 0.07);
}
.streak-page .answer-option:has(input:checked) .option-letter {
  border-color: #66736c;
  background: #66736c;
  color: #fff;
}
.streak-page .answer-option.checking:has(input:checked) {
  border-color: #aeb8b3;
  background: #f5f7f6;
  box-shadow: 0 0 0 2px rgba(75, 92, 84, 0.07);
  cursor: wait;
}
.streak-page .answer-option.checking:has(input:checked) .option-letter {
  border-color: #66736c;
  background: #66736c;
  color: #fff;
}
.streak-page .answer-option.correct:has(input:checked) {
  border-color: #8fc2a6;
  background: #f0f8f4;
  box-shadow: 0 0 0 2px rgba(31, 122, 79, 0.08);
}
.streak-page .answer-option.correct:has(input:checked) .option-letter {
  border-color: var(--success);
  background: var(--success);
  color: #fff;
}
.streak-page .answer-option.incorrect:has(input:checked) {
  border-color: #dfa5ae;
  background: #fff3f5;
  box-shadow: 0 0 0 2px rgba(140, 22, 40, 0.07);
}
.streak-page .answer-option.incorrect:has(input:checked) .option-letter {
  border-color: var(--cgi-red-dark);
  background: var(--cgi-red-dark);
  color: #fff;
}
.answer-option:has(input:disabled) {
  cursor: default;
}

/* src/css/streak/streak_feedback.css */
.streak-feedback {
  margin-top: 1.125rem;
  padding: 0.9375rem 1.0625rem;
  border-left: 0.25rem solid var(--success);
  border-radius: var(--radius-sm);
  background: #f0f8f4;
  color: #3e4e45;
  line-height: 1.5;
}
.streak-feedback.incorrect {
  border-left-color: var(--cgi-red-dark);
  background: #fff3f5;
  color: #5e343a;
}
.streak-feedback strong,
.streak-feedback span {
  display: block;
}
.streak-feedback span {
  margin-top: 0.3125rem;
  font-size: var(--text-sm);
}
.streak-feedback .streak-feedback-count {
  width: fit-content;
  margin: 0.5rem 0 2px;
  padding: 0.25rem 0.5rem;
  border-radius: 999px;
  background: rgba(31, 122, 79, 0.1);
  color: var(--success);
  font-size: var(--text-xs);
  font-weight: 900;
}
.streak-feedback.incorrect .streak-feedback-count {
  background: rgba(140, 22, 40, 0.09);
  color: var(--cgi-red-dark);
}
.streak-feedback p {
  margin: 0.5rem 0 0;
  font-size: var(--text-sm);
}

/* src/css/question/question_resources.css */
.question-resources {
  margin-top: 0.75rem;
}
.question-resource-content {
  padding: 0.75rem;
  display: grid;
  gap: 0.625rem;
  justify-items: center;
  border: 1px solid #e5dfdb;
  border-radius: var(--radius-sm);
  background: #fbfaf9;
}
.question-resource-content figure {
  width: min(100%, 40rem);
  margin: 0;
  justify-self: center;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.question-resource-content img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  display: block;
  object-fit: contain;
}
.question-resource-content a {
  min-height: 2rem;
  padding: 0 0.625rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid #d8d0cc;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 800;
  text-decoration: none;
}
.question-resource-content a::after {
  margin-left: 0.4375rem;
  content: "↗";
  font-size: var(--text-sm);
}
.question-resource-content a:hover {
  border-color: #b8aaa5;
  background: #fff7f8;
}
.question-resource-content a:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.question-actions {
  margin-top: 1.875rem;
  padding-top: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  border-top: 1px solid #eeeae7;
}
.question-actions > span {
  margin: 0 auto;
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/question/question_preview.css */
.question-preview-window {
  background: #f4f3f1;
}
.question-preview-window .brand {
  text-decoration: none;
}
.question-preview-topbar {
  position: static;
}
.question-preview-window-actions {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.question-preview-language {
  padding: 3px;
  display: flex;
  gap: 2px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--soft);
}
.question-preview-language button {
  min-width: 2.25rem;
  min-height: 1.875rem;
  padding: 0 0.5rem;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: #665f5b;
  font-size: var(--text-xs);
  font-weight: 800;
}
.question-preview-language button.active {
  background: #fff;
  color: var(--cgi-red-dark);
  box-shadow: 0 1px 0.25rem rgba(45, 35, 31, 0.1);
}
.question-preview-language button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 1px;
}
.question-preview-page {
  width: min(61.25rem, 100%);
  margin: 0 auto;
  padding: 2.375rem clamp(1.125rem, 5vw, 3rem) 4.375rem;
}
.question-preview-heading {
  margin-bottom: 1.375rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
}
.question-preview-heading h1 {
  margin: 0.3125rem 0 0;
  font-size: var(--text-xl);
}
.question-preview-heading > div:first-child > p:last-child {
  max-width: 40.625rem;
  margin: 0.5625rem 0 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.question-preview-record {
  flex: 0 1 auto;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5625rem;
  overflow-wrap: anywhere;
}
.question-preview-record span {
  padding: 0.3125rem 0.5rem;
  border-radius: 999px;
  font-size: var(--text-xs);
  font-weight: 900;
}
.question-preview-record span.live {
  background: #e9f5ee;
  color: var(--success);
}
.question-preview-record span.offline {
  background: #e7e4e2;
  color: #68615d;
}
.question-preview-record span.snapshot {
  background: #eee9f3;
  color: var(--cgi-purple);
}
.question-preview-record code {
  color: var(--muted);
  font-size: var(--text-xs);
}
.question-preview-loading {
  min-height: 18.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  color: var(--muted);
}
.question-preview-error {
  min-height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.question-preview-card {
  width: min(56.25rem, 100%);
  margin: 0 auto;
}
.question-preview-card .answer-option {
  cursor: default;
}

/* src/css/question/question_results.css */
.results-page {
  width: min(70rem, 100%);
  margin: 0 auto;
  padding: 3rem clamp(1.125rem, 5vw, 3.75rem) 4.5rem;
}
.result-hero {
  padding: clamp(1.625rem, 5vw, 3rem);
  display: grid;
  grid-template-columns: 11.25rem 1fr;
  gap: clamp(1.875rem, 6vw, 4rem);
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow);
}
.result-hero[data-result-mode=assessment] {
  grid-template-columns: 10.625rem minmax(0, 1fr) 7.5rem;
  gap: clamp(1rem, 3vw, 2rem);
}
.result-copy {
  min-width: 0;
}
.result-outcome {
  width: 7.5rem;
  height: 7.5rem;
  display: grid;
  place-items: center;
  justify-self: end;
  border: 1px solid #c2decf;
  border-radius: 50%;
  background: #edf7f1;
  color: var(--success);
}
.result-outcome[data-outcome=failed] {
  border-color: #e5c9cd;
  background: #fbf0f1;
  color: #a55460;
}
.result-outcome svg {
  width: 65%;
  height: 65%;
}
@media (max-width: 700px) {
  .result-hero[data-result-mode=assessment] {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }
  .result-hero[data-result-mode=assessment] .result-outcome {
    grid-row: 2;
    width: 5rem;
    height: 5rem;
    justify-self: center;
  }
}
.score-ring {
  --score: 0%;
  width: 10.625rem;
  height: 10.625rem;
  display: grid;
  place-content: center;
  justify-items: center;
  border-radius: 50%;
  background:
    radial-gradient(
      circle closest-side,
      white 79%,
      transparent 80% 99%),
    conic-gradient(#4f3482 var(--score), #e7e2df 0);
}
.score-ring strong {
  font-weight: 800;
  font-size: var(--text-2xl);
}
.score-ring small {
  color: var(--muted);
}
.result-metrics {
  margin-top: 1.625rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
}
.result-metrics span {
  min-width: 8.125rem;
  padding: 0.6875rem 0.8125rem;
  display: flex;
  flex-direction: column;
  gap: 3px;
  border-radius: var(--radius-sm);
  background: var(--soft);
}
.result-metrics small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.result-actions {
  margin: 1.125rem 0 2.875rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5625rem;
}

/* src/css/question/question_review.css */
.review-list {
  display: grid;
  gap: 0.625rem;
}
.review-item {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
}
.review-item summary {
  padding: 1.0625rem 1.1875rem;
  display: grid;
  grid-template-columns: 2.0625rem 1fr auto;
  gap: 0.75rem;
  align-items: center;
  cursor: pointer;
  list-style: none;
}
.review-item summary::-webkit-details-marker {
  display: none;
}
.review-status {
  width: 1.8125rem;
  height: 1.8125rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #e9f4ee;
  color: var(--success);
  font-weight: 900;
}
.review-item.incorrect .review-status {
  background: #fce8eb;
  color: var(--cgi-red-dark);
}
.review-item summary strong {
  font-size: var(--text-sm);
  line-height: 1.4;
}
.review-item summary small {
  color: var(--muted);
}
.review-body {
  padding: 0 1.25rem 1.25rem 4rem;
  color: #514b48;
  line-height: 1.55;
}
.review-answer {
  margin: 0 0 0.625rem;
  padding: 0.625rem 0.75rem;
  border-left: 3px solid var(--success);
  background: #f0f7f3;
}
.review-body p:last-child {
  margin-bottom: 0;
}

/* src/css/feedback/question_feedback_dialog.css */
.question-feedback-link {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0.875rem auto 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #68616a;
  font: inherit;
  font-size: 0.75rem;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  cursor: pointer;
}
.question-feedback-link:hover {
  color: #403a43;
}
.question-feedback-link:disabled {
  color: #777;
  cursor: default;
  text-decoration: none;
}
.question-feedback-link:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}
.question-feedback-dialog textarea {
  width: 100%;
  margin: 0.4375rem 0;
  padding: 0.625rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  resize: vertical;
  font: inherit;
  font-weight: 400;
}
.question-feedback-dialog .question-feedback-context {
  margin: 0.75rem 0 1rem;
  max-height: 5rem;
  overflow: auto;
  overflow-wrap: anywhere;
}
.question-feedback-dialog output {
  display: block;
  margin-top: 0.375rem;
  color: var(--muted);
  font-size: var(--text-xs);
  text-align: right;
}
.question-feedback-dialog .brown-bag-dialog-actions {
  flex-wrap: wrap;
}
.question-feedback-rating {
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}
.question-feedback-rating legend {
  margin-bottom: 0.375rem;
  font-size: var(--text-sm);
}
.question-feedback-stars {
  display: flex;
  gap: 0.375rem;
}
.question-feedback-stars label {
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  cursor: pointer;
}
.question-feedback-stars label span {
  color: #887b8b;
  font-size: 1.875rem;
  line-height: 1;
}
.question-feedback-stars label.is-filled span {
  color: #a46d00;
}
.question-feedback-stars input:focus-visible + span {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
  border-radius: 3px;
}
.question-feedback-rating:disabled label {
  opacity: 0.65;
  cursor: wait;
}

/* src/css/feedback/feedback_inbox.css */
.feedback-inbox-rating {
  grid-column: 1 / -1;
  color: #a46d00;
  letter-spacing: 0.1em;
  font-size: 1rem;
}
.feedback-inbox-card {
  padding: 1rem;
  border: 1px solid #e5dfdc;
  border-radius: var(--radius-sm);
  background: #fff;
}
.feedback-inbox-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.625rem;
}
.feedback-inbox-filters label {
  display: grid;
  gap: 0.375rem;
  color: var(--muted);
  font-size: var(--text-xs);
}
.feedback-inbox-filters input,
.feedback-inbox-filters select {
  min-width: 0;
  min-height: 2.25rem;
  padding: 0.4375rem 0.625rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  font: inherit;
  font-size: var(--text-sm);
}
.feedback-inbox-search {
  flex: 1 1 16rem;
}
.feedback-inbox-list {
  padding: 0;
  margin: 1rem 0;
  list-style: none;
}
.feedback-inbox-row {
  display: flex;
  align-items: start;
  gap: 0.875rem;
  padding: 0.875rem 0;
  border-bottom: 1px solid #e9e4e8;
}
.feedback-inbox-detail {
  min-width: 0;
  flex: 1;
}
.feedback-inbox-actions {
  display: grid;
  flex: 0 0 auto;
  align-content: start;
  gap: 0.375rem;
}
.feedback-inbox-actions > .secondary-button {
  width: 100%;
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
}
.feedback-inbox-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.375rem 0.75rem;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.feedback-inbox-summary time,
.feedback-inbox-summary small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.feedback-inbox-summary small,
.feedback-inbox-preview {
  grid-column: 1 / -1;
}
.feedback-inbox-preview {
  color: #514953;
  font-size: var(--text-sm);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.feedback-inbox-summary:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
.feedback-inbox-content {
  padding: 0.875rem;
  margin-top: 0.875rem;
  border-radius: var(--radius-sm);
  background: #f6f3f7;
  overflow-wrap: anywhere;
  font-size: var(--text-sm);
}
.feedback-inbox-content p {
  margin: 0 0 0.75rem;
}
.feedback-inbox-content h4 {
  margin: 1rem 0 0.625rem;
  font-size: var(--text-sm);
}
.feedback-inbox-message {
  white-space: pre-wrap;
  font-weight: 700;
}
.feedback-inbox-meta {
  color: var(--muted);
  font-size: var(--text-xs);
}
.feedback-inbox-options {
  list-style: upper-alpha;
  margin: 0.75rem 0 1rem;
  padding-left: 1.5rem;
}
.feedback-inbox-options li + li {
  margin-top: 0.375rem;
}
.feedback-inbox-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
}
.feedback-inbox-pagination > span {
  flex: 1;
  color: var(--muted);
  font-size: var(--text-xs);
}
@media (max-width: 600px) {
  .feedback-inbox-card {
    padding: 0.75rem;
  }
  .feedback-inbox-row {
    flex-direction: column;
  }
  .feedback-inbox-detail {
    width: 100%;
  }
  .feedback-inbox-summary {
    grid-template-columns: minmax(0, 1fr);
  }
  .feedback-inbox-search {
    flex-basis: 100%;
  }
  .feedback-inbox-filters label {
    max-width: 100%;
  }
  .feedback-inbox-filters input {
    width: 100%;
  }
}

/* src/css/prf/prf_path_layout.css */
.prf-page,
.admin-page {
  --prf-level: #4f3482;
  --prf-level-soft: #efeaf7;
  --prf-bonus: #b4691c;
  --prf-bonus-soft: #fbefe2;
  --prf-track: #e8e5e9;
  --prf-rule: #efecee;
  --prf-open: #23744f;
  --prf-open-soft: #e7f4ec;
}
.prf-page {
  width: min(118rem, 100%);
  margin: 0 auto;
  padding: 1.625rem clamp(1.125rem, 3vw, 2.75rem) 3rem;
}
.prf-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.375rem 1.375rem;
}
.prf-introduction {
  flex: 1;
  min-width: 0;
}
.prf-disclaimer {
  margin: 0.3125rem 0 0;
  color: #a91630;
  font-size: var(--text-md);
  font-weight: 700;
  line-height: 1.5;
}
.prf-title-group {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.prf-heading h1 {
  margin: 0;
  font-size: var(--text-xl);
  letter-spacing: -0.01em;
}
.prf-lede {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
}
.prf-path {
  margin-top: 1rem;
  padding: 1.125rem clamp(1rem, 2.5vw, 1.75rem) 1.125rem;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.prf-path-loading {
  position: relative;
  min-height: 15rem;
}
.prf-path-loading .prf-loading {
  position: absolute;
  inset: 0;
  min-height: 0;
  background: rgb(255 255 255 / 35%);
  font-size: var(--text-sm);
}
.prf-skeleton-heading {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}
.prf-skeleton-heading i {
  width: 17rem;
  max-width: 60%;
  height: 2.75rem;
}
.prf-skeleton-heading i:last-child {
  width: 8rem;
  height: 1.75rem;
}
.prf-skeleton-line {
  height: 0.5rem;
  margin: 2.5rem 1.5rem 2rem;
}
.prf-skeleton-moves {
  display: flex;
  gap: 0.875rem;
}
.prf-skeleton-moves i {
  flex: 1;
  height: 3.75rem;
}
@media (max-width: 520px) {
  .prf-path-loading {
    min-height: 29rem;
  }
  .prf-skeleton-heading {
    flex-direction: column-reverse;
    align-items: center;
    gap: 0.75rem;
  }
  .prf-skeleton-moves {
    flex-direction: column;
  }
  .prf-skeleton-moves i {
    flex: none;
    height: 6rem;
  }
}
@media (max-width: 360px) {
  .prf-path-loading {
    min-height: 31rem;
  }
}
.prf-path-loading i,
.prf-skeleton-line,
.training-time-placeholder i,
.training-skeleton-plan,
.training-skeleton-line,
.brown-bag-placeholder i,
.brown-bag-placeholder span {
  display: block;
  border-radius: 0.375rem;
  background: #f1eff2;
}
.prf-path-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.prf-path-head p {
  margin: 0 0 0.125rem;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.prf-path-head h2 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.prf-path-score {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}
.prf-path-score strong {
  color: var(--cgi-red);
  font-size: var(--text-xl);
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: lining-nums;
}
.prf-path-score span {
  color: var(--muted);
  font-size: var(--text-sm);
  font-weight: 600;
}

/* src/css/prf/prf_path_progress.css */
.prf-line {
  position: relative;
  height: 4.25rem;
  margin: 0.5rem 1.5rem 0;
}
.prf-line-rail {
  position: absolute;
  top: 2rem;
  right: 0;
  left: 0;
  height: 0.5rem;
  border-radius: 999px;
  background: var(--prf-track);
}
.prf-line-rail i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: 999px;
}
.prf-line-rail .is-level {
  background: var(--prf-level);
}
.prf-line-rail .is-bonus {
  background: var(--prf-bonus);
}
.prf-line-rail .is-preview {
  background:
    repeating-linear-gradient(
      135deg,
      var(--prf-bonus) 0 0.375rem,
      #dca46a 0.375rem 0.75rem);
  opacity: 0.45;
}
.prf-line-ticks {
  position: absolute;
  top: 3.1rem;
  right: 0;
  left: 0;
  display: flex;
  justify-content: space-between;
  color: #76717a;
  font-size: var(--text-xs);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.prf-line-ticks span {
  width: 0;
  display: flex;
  justify-content: center;
}
.prf-station {
  position: absolute;
  top: 1.5rem;
  transform: translateX(-50%);
  display: grid;
  justify-items: center;
  text-align: center;
}
.prf-station > span {
  width: 1.5rem;
  height: 1.5rem;
  border: 0.1875rem solid var(--prf-track);
  border-radius: 50%;
  background: #fff;
}
.prf-station.is-reached > span {
  border-color: var(--prf-level);
  background: var(--prf-level);
}
.prf-station abbr {
  margin-top: 0.1rem;
  font-size: var(--text-xs);
  font-weight: 800;
  line-height: 1.4;
  text-decoration: none;
  white-space: nowrap;
}
.prf-line-marker {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  display: grid;
  justify-items: center;
  padding: 3px 0.625rem;
  border-radius: 999px;
  background: var(--cgi-red);
  color: #fff;
  font-size: var(--text-xs);
  font-weight: 800;
  white-space: nowrap;
}
.prf-line-marker::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 3px;
  height: 0.625rem;
  margin-left: -1.5px;
  background: var(--cgi-red);
}

/* src/css/prf/prf_segments.css */
.prf-page,
.admin-page {
  --prf-manual: #a37b28;
}
.prf-line-rail .is-manual,
.prf-bar .is-manual {
  background: var(--prf-manual);
  border-radius: 999px 0 0 999px;
}
.prf-segment-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem 1rem;
  margin: 0.5rem 1.5rem 0.75rem;
  padding: 0;
  list-style: none;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}
.prf-segment-legend li {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
.prf-segment-swatch {
  flex: 0 0 0.625rem;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 2px;
}
.prf-segment-swatch.is-manual {
  background: var(--prf-manual);
}
.prf-segment-swatch.is-level {
  background: var(--prf-level);
}
.prf-segment-swatch.is-bonus {
  background: var(--prf-bonus);
}
.admin-rating-panel .prf-segment-legend {
  margin-inline: 1rem;
}
@media (max-width: 520px) {
  .prf-path > .prf-segment-legend {
    margin-inline: 0;
  }
}

/* src/css/prf/prf_path_actions.css */
.prf-moves {
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18.75rem, 1fr));
  gap: 0.875rem;
}
.prf-move {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
}
.prf-move-icon {
  width: 2.25rem;
  height: 2.25rem;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm);
  font-size: var(--text-md);
  font-weight: 800;
}
.prf-move-level .prf-move-icon {
  background: var(--prf-level-soft);
  color: var(--prf-level);
}
.prf-move-bonus .prf-move-icon {
  background: var(--prf-bonus-soft);
  color: #8a4e10;
}
.prf-move h3 {
  margin: 0 0 1px;
  font-size: var(--text-sm);
}
.prf-move p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.4;
}
.prf-move button {
  min-height: 2.125rem;
  padding: 0.375rem 0.875rem;
  white-space: nowrap;
}
.prf-move-loading {
  background: #fcfbfd;
  border-color: #f1eff2;
}
.prf-move-loading h3 {
  color: var(--muted);
  font-weight: 400;
}
.prf-move-loading-action {
  display: block;
  min-width: 6.25rem;
  height: 2.125rem;
  border-radius: 0.375rem;
  background: #f1eff2;
}
@media (max-width: 700px) {
  .prf-move-loading-action {
    grid-column: 1 / -1;
  }
}
@media (max-width: 360px) {
  .prf-move-loading {
    padding-block: 1.375rem;
  }
}

/* src/css/training_time/training_time_panel.css */
.rating-layout {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  gap: 1.375rem;
  align-items: start;
  margin: 1.375rem auto 0;
}
.training-time-panel {
  min-width: 0;
  height: min(82vh, 60rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: 0 1px 0 var(--line);
}
.training-time-subtitle {
  margin: 0.3125rem 0 0;
  color: var(--muted);
  font-size: var(--text-sm);
}
#trainingTimeContent {
  min-height: 0;
  flex: 1;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.training-time-balance {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 1.125rem 1.375rem 0.625rem;
}
.training-time-balance > div {
  min-width: 0;
  display: grid;
  gap: 0.3125rem;
}
.training-time-balance span {
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
}
.training-time-balance strong {
  color: var(--prf-level);
  font-size: var(--text-xl);
  font-variant-numeric: tabular-nums;
}
.training-time-year {
  margin: 0;
  padding: 0 1.375rem 1rem;
  color: var(--muted);
  font-size: var(--text-xs);
}
.training-time-notice {
  margin: 0;
  padding: 1rem 1.375rem;
  color: var(--muted);
  font-size: var(--text-sm);
}
.training-time-notice.error-message {
  color: var(--cgi-red-dark);
}
.training-time-placeholder {
  padding: 1rem 1.375rem;
}
.training-skeleton-balance {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  padding-bottom: 1.25rem;
}
.training-skeleton-balance i {
  height: 3.5rem;
}
.training-skeleton-fields {
  display: grid;
  grid-template-columns: 1fr 0.35fr;
  gap: 0.875rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}
.training-skeleton-fields i {
  height: 2.5rem;
}
.training-skeleton-plan {
  height: 8rem;
  margin-top: 2rem;
}
.training-skeleton-line {
  height: 0.75rem;
  margin-top: 1.5rem;
  width: 80%;
}
.brown-bag-placeholder {
  padding: 0 1.375rem;
}
.brown-bag-placeholder > div {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--line);
}
.brown-bag-placeholder i {
  height: 3.5rem;
}
.brown-bag-placeholder span {
  height: 5.5rem;
}

/* src/css/training_time/training_time_form.css */
.training-time-form {
  display: grid;
  gap: 0.625rem;
  padding: 1rem 1.375rem;
  border-top: 1px solid var(--line);
}
.training-time-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.6fr);
  gap: 0.875rem;
}
.training-time-form label,
.training-time-dialog label {
  min-width: 0;
  display: grid;
  gap: 0.3125rem;
  font-size: var(--text-sm);
  font-weight: 700;
}
.training-time-form input:not([type=checkbox]),
.training-time-form textarea,
.training-time-dialog select,
.training-time-dialog textarea,
.training-time-history select,
.training-time-review-actions input {
  width: 100%;
  min-width: 0;
  min-height: 2.5rem;
  padding: 0.5rem 0.625rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-sm);
}
.training-time-form textarea,
.training-time-dialog textarea {
  resize: vertical;
}
.training-time-form .training-time-commitment {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-weight: 400;
  line-height: 1.45;
}
.training-time-commitment input {
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  margin: 0.1875rem 0 0;
  accent-color: var(--cgi-red);
}
.training-time-count {
  margin: -0.1875rem 0 0;
  color: var(--muted);
  font-size: var(--text-xs);
}
.training-time-policy {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}
.training-time-form > button {
  justify-self: start;
}
.training-time-panel .primary-button,
.training-time-dialog .primary-button {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

/* src/css/training_time/training_time_history.css */
.training-time-history,
.training-time-reviews {
  border-top: 1px solid var(--line);
}
.training-time-history > header,
.training-time-reviews > header {
  padding: 0.875rem 1.375rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.625rem;
}
.training-time-history h3,
.training-time-reviews h3 {
  margin: 0;
  font-size: var(--text-md);
}
.training-time-history select {
  width: auto;
  max-width: 100%;
  min-height: 2rem;
  padding: 0.3125rem 0.5rem;
  font-size: var(--text-xs);
}
.training-time-reviews header p {
  flex-basis: 100%;
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
}
.training-time-history ol,
.training-time-reviews ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
.training-time-entry {
  min-width: 0;
  padding: 0.875rem 1.375rem;
  border-top: 1px solid #efecee;
}
.training-time-entry-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.625rem;
}
.training-time-entry strong {
  font-size: var(--text-sm);
}
.training-time-entry p {
  margin: 0.4375rem 0 0;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
  overflow-wrap: anywhere;
  white-space: normal;
}
.training-time-entry details {
  margin-top: 0.4375rem;
  font-size: var(--text-xs);
}
.training-time-entry summary {
  color: var(--prf-level);
  cursor: pointer;
}
.training-time-status {
  padding: 0.25rem 0.5rem;
  flex: 0 0 auto;
  max-width: 48%;
  border-radius: var(--radius-sm);
  background: #efeaf7;
  color: #513775;
  font-size: var(--text-xs);
  font-weight: 700;
}
.training-time-status[data-status=approved],
.training-time-status[data-status=auto-approved] {
  background: #e7f4ec;
  color: #23744f;
}
.training-time-status[data-status=rejected] {
  background: #fff1f3;
  color: #a91630;
}
.training-time-review-actions {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.training-time-review-actions > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.training-time-entry.is-linked-request {
  box-shadow: inset 3px 0 var(--cgi-red);
  background: #fff8f9;
}

/* src/css/training_time/training_time_confirmation.css */
.training-time-dialog form > label {
  margin-top: 0.875rem;
}
.training-time-dialog .training-time-policy {
  margin-top: 0.875rem;
}
.training-time-booking-guidance {
  margin: 0.75rem 0 1rem;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.training-time-booking-guidance > p {
  margin: 0 0 0.5rem;
}
.training-time-booking-guidance > ul {
  margin: 0;
  padding-left: 1.125rem;
  display: grid;
  gap: 0.375rem;
}
.training-time-booking-guidance li {
  text-wrap: balance;
}
.training-time-booking-guidance strong {
  color: var(--ink);
}
#trainingTimeConfirmTitle {
  font-size: clamp(1.25rem, 6vw, 1.75rem);
}

/* src/css/training_time/training_time_adjustment.css */
.training-adjust-operations {
  min-width: 0;
  margin: 0.875rem 0;
  padding: 0;
  border: 0;
}
.training-adjust-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.3125rem;
  padding: 0.3125rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--soft);
}
.training-adjust-options label {
  position: relative;
  cursor: pointer;
}
.training-adjust-options span {
  min-height: 2.5rem;
  display: grid;
  place-content: center;
  padding: 0.375rem 0.5rem;
  border-radius: 0.3125rem;
  color: var(--muted);
  line-height: 1.25;
  text-align: center;
}
.training-adjust-options input:checked + span {
  background: var(--cgi-purple);
  color: #fff;
}
.training-adjust-options input:focus-visible + span {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.training-adjust-amount {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 0.625rem 1rem;
}
.training-adjust-amount > label {
  flex: 1 1 8rem;
}
.training-adjust-preview {
  display: grid;
  gap: 0.3125rem;
  padding-bottom: 0.5rem;
}
.training-adjust-preview span {
  color: var(--muted);
  font-size: var(--text-xs);
}
.training-adjust-preview strong {
  color: var(--cgi-purple);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.partner-training-time {
  min-width: 7.5rem;
}
.partner-training-time button {
  min-height: 1.875rem;
  padding: 0.25rem 0.5rem;
  font-size: var(--text-xs);
}
@media (max-width: 1050px) {
  .training-time-panel {
    height: auto;
  }
  #trainingTimeContent {
    overflow: visible;
  }
  .training-time-history ol,
  .training-time-reviews ol {
    max-height: 24rem;
    overflow: auto;
  }
}
@media (max-width: 520px) {
  .training-time-balance {
    padding-right: 1rem;
    padding-left: 1rem;
    gap: 0.5rem;
  }
  .training-time-balance strong {
    font-size: var(--text-lg);
  }
  .training-time-form,
  .training-time-entry {
    padding: 0.875rem 1rem;
  }
  .training-time-fields {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.55fr);
    gap: 0.625rem;
  }
}

/* src/css/prf/prf_panels.css */
.rating-panel,
.brown-bag-panel {
  min-width: 0;
  height: min(82vh, 60rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: 0 1px 0 var(--line);
}
.prf-panel-header,
.brown-bag-header {
  min-height: 4.625rem;
  padding: 1rem 1.375rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--line);
}
.prf-panel-header h2,
.brown-bag-header h2 {
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 800;
}
.prf-panel-meta {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
  font-weight: 600;
}
.rating-table-wrap,
.brown-bag-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

/* src/css/prf/prf_standings.css */
.rating-table {
  table-layout: fixed;
}
.rating-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 2.125rem;
  border-bottom: 1px solid var(--prf-rule);
  background: #fff;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.rating-table th,
.rating-table td {
  padding-right: 1.375rem;
  padding-left: 1.375rem;
}
.rating-table th:nth-child(2) {
  width: 11.875rem;
  text-align: right;
}
.rating-table td:first-child {
  white-space: normal;
}
.rating-table td:nth-child(2) {
  text-align: right;
}
.rating-table tbody tr {
  height: 3.375rem;
}
.rating-table tbody tr + tr td {
  border-top-color: var(--prf-rule);
}
.rating-table tbody tr.current-user {
  background: #fff4f6;
  box-shadow: none;
}
.rating-table tbody tr.current-user .prf-avatar {
  border-color: var(--cgi-red);
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--cgi-red);
}
.rating-table tbody tr.current-user .prf-points-total {
  color: var(--cgi-red-dark);
}
.rating-person {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.rating-position {
  width: 1.25rem;
  flex: 0 0 1.25rem;
  color: #6f6a74;
  font-size: var(--text-sm);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.rating-person .prf-avatar {
  width: 2.125rem;
  height: 2.125rem;
  flex: 0 0 2.125rem;
  border-color: transparent;
  background: var(--prf-level-soft);
  color: var(--prf-level);
}
.rating-person-copy {
  min-width: 0;
  overflow-wrap: anywhere;
}
.rating-person-copy strong,
.rating-person-copy small {
  display: block;
}
.rating-person-copy strong {
  font-size: var(--text-sm);
  font-weight: 600;
}
.rating-person-copy small {
  margin-top: 2px;
  color: var(--muted);
  font-size: var(--text-xs);
}
.rating-cutoff th {
  height: 1.75rem;
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  border-top: 1px solid var(--prf-rule);
  background: #faf9fc;
  color: var(--prf-level);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.rating-table tbody tr.rating-cutoff {
  height: 1.75rem;
}
.rating-table abbr {
  cursor: help;
  font-weight: 800;
  text-decoration: underline dotted;
  text-underline-offset: 3px;
}
.prf-points {
  display: inline-flex;
  align-items: center;
  gap: 0.875rem;
  vertical-align: middle;
}
.prf-bar {
  position: relative;
  width: 6.875rem;
  height: 0.375rem;
  overflow: hidden;
  border-radius: 999px;
  background: var(--prf-track);
}
.prf-bar i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}
.prf-bar .is-level {
  background: var(--prf-level);
}
.prf-bar .is-bonus {
  background: var(--prf-bonus);
}
.prf-points-total {
  min-width: 2ch;
  color: var(--ink);
  font-size: var(--text-md);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* src/css/brown_bag/brown_bag_cards.css */
.brown-bag-header p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.45;
}
.brown-bag-header .brown-bag-availability {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.3125rem 0.6875rem;
  border-radius: 999px;
  background: var(--prf-open-soft);
  color: var(--prf-open);
  font-size: var(--text-xs);
  font-weight: 800;
  white-space: nowrap;
}
.brown-bag-status-row {
  padding: 0.5625rem 1.375rem;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 0.875rem;
  border-bottom: 1px solid var(--prf-rule);
  background: #faf9fc;
}
.brown-bag-status {
  margin: 0;
  color: var(--ink);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.5;
}
.brown-bag-limit {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}
.brown-bag-card {
  padding: 0.9375rem 1.375rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 1.125rem;
  border-bottom: 1px solid var(--prf-rule);
}
.brown-bag-card:last-child {
  border-bottom: 0;
}
.brown-bag-card.is-mine {
  background: #fff4f6;
}
.brown-bag-card > form {
  grid-column: 1 / -1;
}
.brown-bag-card-head {
  min-width: 0;
  grid-column: 1;
  display: grid;
  grid-template-columns: 3.25rem minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.875rem;
}
.brown-bag-card:not(.is-booked) .brown-bag-card-head,
.brown-bag-card:not(.is-booked) .brown-bag-window {
  grid-column: 1 / -1;
}
.brown-bag-card-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.brown-bag-card-head > div {
  min-width: 0;
}
.brown-bag-number {
  width: 3.25rem;
  padding: 0.375rem 0 0.4375rem;
  display: grid;
  justify-items: center;
  border-radius: var(--radius-sm);
  background: var(--soft);
  color: var(--ink);
  line-height: 1.05;
}
.brown-bag-card:has(form) .brown-bag-number {
  background: var(--prf-open-soft);
  color: var(--prf-open);
}
.brown-bag-card.is-mine .brown-bag-number {
  background: var(--cgi-red);
  color: #fff;
}
.brown-bag-number span {
  color: inherit;
  font-size: var(--text-xs);
  font-weight: 700;
  opacity: 0.75;
}
.brown-bag-number strong {
  font-size: var(--text-lg);
  font-weight: 800;
  font-variant-numeric: lining-nums;
}
.brown-bag-card-head h3 {
  margin: 3px 0 2px;
  font-size: var(--text-md);
}
.brown-bag-card-head p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.4;
}
.brown-bag-window {
  grid-column: 1;
  margin: 0.375rem 0 0 4.125rem;
  color: #6f6a73;
  font-size: var(--text-xs);
}
.brown-bag-free {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.3125rem 0.6875rem;
  border-radius: 999px;
  background: var(--prf-open-soft);
  color: var(--prf-open);
  font-size: var(--text-sm);
  font-weight: 800;
  white-space: nowrap;
}
.brown-bag-free::before {
  content: "";
  width: 0.4375rem;
  height: 0.4375rem;
  border-radius: 50%;
  background: currentColor;
}

/* src/css/brown_bag/brown_bag_booking.css */
.brown-bag-dates {
  margin: 0.75rem 0 0.625rem 4.125rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4375rem;
  border: 0;
}
.brown-bag-dates legend {
  margin-bottom: 0.375rem;
  color: #5f5a63;
  font-size: var(--text-xs);
  font-weight: 700;
}
.brown-bag-dates label {
  padding: 0.4375rem 0.6875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  font-size: var(--text-sm);
  cursor: pointer;
}
.brown-bag-dates label:hover {
  border-color: #c9c3cc;
}
.brown-bag-dates label:has(input:checked) {
  border-color: var(--cgi-red);
  background: #fff4f6;
}
.brown-bag-dates label:has(input:disabled) {
  color: #aaa;
  cursor: not-allowed;
}
.brown-bag-dates input,
.brown-bag-confirm input {
  accent-color: var(--cgi-red);
}
.brown-bag-confirm {
  margin: 0 0 0.75rem 4.125rem;
  display: flex;
  align-items: flex-start;
  gap: 0.4375rem;
  font-size: var(--text-xs);
  line-height: 1.4;
}
.brown-bag-card button[type=submit] {
  margin-left: 4.125rem;
  min-height: 2.25rem;
  padding: 0.4375rem 0.875rem;
  font-size: var(--text-sm);
}
.brown-bag-presenter {
  min-width: 0;
  max-width: 22rem;
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.brown-bag-presenter-avatar {
  width: 2.5rem;
  height: 2.5rem;
  flex: 0 0 2.5rem;
  display: grid;
  place-items: center;
  object-fit: cover;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--prf-level-soft);
  box-shadow: 0 0 0 1px var(--line);
  color: var(--prf-level);
  font-size: var(--text-xs);
  font-weight: 800;
}
.brown-bag-presenter-identity {
  min-width: 0;
  display: grid;
  gap: 1px;
}
.brown-bag-presenter-identity strong {
  overflow: hidden;
  color: var(--ink);
  font-size: var(--text-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.brown-bag-presenter-identity span {
  color: var(--muted);
  font-size: var(--text-xs);
}
.brown-bag-presenter-identity time {
  color: var(--ink);
  font-size: var(--text-xs);
  font-weight: 700;
}
.brown-bag-empty {
  grid-column: 1;
  margin: 0.5rem 0 0 4.125rem;
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/brown_bag/brown_bag_responsive.css */
@media (max-width: 1050px) {
  .rating-layout {
    grid-template-columns: 1fr;
  }
  .rating-panel,
  .brown-bag-panel {
    height: auto;
  }
  .rating-table-wrap,
  .brown-bag-list {
    flex: none;
    max-height: 35rem;
  }
}
@media (max-width: 700px) {
  .prf-path-head {
    flex-direction: column-reverse;
    gap: 0.625rem;
  }
  .prf-path-score {
    justify-items: start;
    text-align: left;
  }
  .prf-line {
    margin-right: 1.125rem;
    margin-left: 1.125rem;
  }
  .prf-line-ticks span:nth-child(odd):not(:first-child):not(:last-child) {
    visibility: hidden;
  }
  .prf-move {
    grid-template-columns: 2.75rem minmax(0, 1fr);
  }
  .prf-move button {
    grid-column: 1 / -1;
  }
  .brown-bag-card {
    grid-template-columns: minmax(0, 1fr);
  }
  .brown-bag-card:not(.is-booked) .brown-bag-card-head {
    grid-template-columns: 3.25rem minmax(0, 1fr);
  }
  .brown-bag-card:not(.is-booked) .brown-bag-card-meta {
    grid-column: 2;
    justify-self: start;
  }
  .brown-bag-presenter {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    margin: 0.625rem 0 0 4.125rem;
  }
}
@media (max-width: 600px) {
  .prf-panel-header,
  .brown-bag-header {
    padding: 0.875rem 1rem;
    flex-wrap: wrap;
  }
  .brown-bag-status-row {
    padding: 0.5625rem 1rem;
  }
  .brown-bag-card {
    padding: 0.875rem 1rem;
  }
  .brown-bag-card-head {
    grid-template-columns: 2.875rem minmax(0, 1fr) 1.75rem;
    gap: 0.625rem;
  }
  .brown-bag-number {
    width: 2.875rem;
  }
  .brown-bag-dates,
  .brown-bag-confirm,
  .brown-bag-card button[type=submit],
  .brown-bag-window,
  .brown-bag-empty,
  .brown-bag-presenter,
  .brown-bag-free {
    margin-left: 0;
  }
  .rating-table th,
  .rating-table td {
    padding-right: 0.875rem;
    padding-left: 0.875rem;
  }
}
@media (max-width: 520px) {
  .rating-table th:nth-child(2) {
    width: 3.25rem;
  }
  .rating-table .prf-bar {
    display: none;
  }
  .rating-position {
    display: none;
  }
  .rating-person-copy small {
    font-size: var(--text-xs);
  }
}
@media (max-width: 360px) {
  .prf-line-ticks span:not(:first-child):not(:last-child) {
    visibility: hidden;
  }
}

/* src/css/partners/partner_toolbar.css */
.partner-team-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}
.partner-team-toolbar .partner-team-tabs {
  min-width: 0;
  max-width: 100%;
  border-bottom: 0;
}
.partner-team-toolbar > button {
  margin: 0.3125rem 1.25rem 0.3125rem auto;
}
.partner-team-toolbar > .partner-bulk-reminders {
  white-space: pre;
  line-height: 1.25;
}
.partner-team-toolbar > .partner-email-scheduled {
  max-width: 19.375rem;
}

/* src/css/vibe/vibe_sessions.css */
.vibe-session-card {
  position: relative;
  padding: 1.125rem 1.25rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(11.25rem, 36%, 21.25rem);
  grid-template-areas: "copy poster" "hosts poster";
  align-items: start;
  gap: 0.75rem 1.125rem;
  border-bottom: 1px solid #ded6ec;
  background:
    linear-gradient(
      115deg,
      #f0ebfa 0%,
      #f8f5fc 62%,
      #fff7f8 100%);
  box-shadow: inset 0.25rem 0 #7250a1;
}
.vibe-session-green {
  background:
    linear-gradient(
      115deg,
      #eaf5ee,
      #f6fbf8);
  box-shadow: inset 0.25rem 0 #47845f;
}
.vibe-session-green .vibe-session-label,
.vibe-session-green .vibe-session-copy h3,
.vibe-session-green .vibe-session-host strong {
  color: #2f6244;
}
.vibe-session-green .vibe-session-date {
  border-color: #c1dfcd;
  color: #2f6244;
}
.vibe-session-green .vibe-session-hosts {
  border-color: #d1e5d9;
}
.vibe-session-blue {
  background:
    linear-gradient(
      115deg,
      #eaf2fb,
      #f7faff);
  box-shadow: inset 0.25rem 0 #4b7db0;
}
.vibe-session-blue .vibe-session-label,
.vibe-session-blue .vibe-session-copy h3,
.vibe-session-blue .vibe-session-host strong {
  color: #315c87;
}
.vibe-session-blue .vibe-session-date {
  border-color: #c7dbef;
  color: #315c87;
}
.vibe-session-blue .vibe-session-hosts {
  border-color: #d7e4f1;
}
.vibe-session-copy {
  grid-area: copy;
  min-width: 0;
}
.vibe-session-label {
  margin: 0 0 0.375rem;
  color: #62438b;
  font-size: var(--text-xs);
  font-weight: 850;
}
.vibe-session-copy h3 {
  margin: 0 0 0.5625rem;
  color: #3f2b59;
  font-size: var(--text-lg);
  line-height: 1.2;
}
.vibe-session-date {
  display: inline-block;
  padding: 0.3125rem 0.5rem;
  border: 1px solid #d9ccec;
  border-radius: var(--radius-sm);
  background: #fff9;
  color: #523580;
  font-size: var(--text-xs);
  font-weight: 800;
  line-height: 1.45;
}
.vibe-session-agenda {
  margin: 0.6875rem 0 0;
  padding-left: 0.9375rem;
  color: #51475b;
  font-size: var(--text-xs);
  line-height: 1.55;
}
.vibe-session-agenda li + li {
  margin-top: 3px;
}
.vibe-session-agenda li::marker {
  color: #80609d;
}
.vibe-session-poster {
  grid-area: poster;
  align-self: center;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  display: block;
  border: 1px solid #dad0e4;
  border-radius: var(--radius-sm);
  object-fit: cover;
  box-shadow: var(--shadow-panel);
}
.vibe-session-hosts {
  grid-area: hosts;
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1.25rem;
  padding-top: 0.6875rem;
  border-top: 1px solid #e1d8ec;
}
.vibe-session-host {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.5625rem;
}
.vibe-session-host .brown-bag-presenter-avatar {
  width: 2rem;
  height: 2rem;
  flex-basis: 2rem;
  font-size: var(--text-xs);
}
.vibe-session-host strong {
  color: #3f2b59;
  font-size: var(--text-xs);
}
@media (max-width: 600px) {
  .vibe-session-card {
    grid-template-columns: minmax(0, 1fr) 6.5625rem;
    grid-template-areas: "copy poster" "hosts hosts";
    gap: 0.75rem;
    padding: 1rem;
  }
  .vibe-session-poster {
    align-self: center;
  }
  .vibe-session-label {
    font-size: var(--text-xs);
  }
  .vibe-session-copy h3 {
    font-size: var(--text-md);
  }
  .vibe-session-date {
    font-size: var(--text-xs);
  }
  .vibe-session-agenda {
    font-size: var(--text-xs);
  }
  .vibe-session-hosts {
    gap: 0.5625rem 1rem;
  }
}

/* src/css/brown_bag/brown_bag_help.css */
.brown-bag-info-button,
.brown-bag-card .brown-bag-info-button {
  width: 1.75rem;
  height: 1.75rem;
  min-height: 1.75rem;
  margin: 0;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid #d8d2ce;
  border-radius: 50%;
  background: #fff;
  color: #523580;
  font-size: var(--text-sm);
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
.brown-bag-info-button:hover,
.brown-bag-info-button[aria-expanded=true] {
  border-color: #80609d;
  background: #f5eff8;
}
.brown-bag-info-button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.brown-bag-topic-tooltip {
  position: fixed;
  z-index: 60;
  width: min(21.875rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  padding: 0.875rem 1rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  overflow-wrap: anywhere;
  transition-property: none;
  border: 1px solid #ddd4d1;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  box-shadow: inset 0 2px 0 #80609d, var(--shadow-panel);
}
.brown-bag-topic-tooltip[data-placement=left] {
  box-shadow: inset -2px 0 0 #80609d, var(--shadow-panel);
}
.brown-bag-topic-tooltip[data-placement=right] {
  box-shadow: inset 2px 0 0 #80609d, var(--shadow-panel);
}
.brown-bag-topic-tooltip[data-placement=above] {
  box-shadow: inset 0 -2px 0 #80609d, var(--shadow-panel);
}
.brown-bag-topic-illustration {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  margin: 0.5625rem 0;
}
.brown-bag-topic-tooltip strong {
  font-size: var(--text-sm);
}
.brown-bag-topic-tooltip p {
  margin: 0.4375rem 0 0;
  color: #514b48;
  font-size: var(--text-sm);
  line-height: 1.5;
}

/* src/css/brown_bag/brown_bag_confirmation.css */
.brown-bag-dialog {
  width: min(28.75rem, calc(100% - 1.75rem));
  max-height: calc(100vh - 1.75rem);
  padding: 0;
  overflow-y: auto;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  box-shadow: var(--shadow-panel);
}
.brown-bag-dialog::backdrop {
  background: rgba(35, 29, 27, 0.55);
  backdrop-filter: blur(2px);
}
.brown-bag-dialog form {
  padding: 1.5rem;
}
.brown-bag-dialog h2 {
  margin: 0.3125rem 0 0.4375rem;
  font-size: var(--text-xl);
}
.brown-bag-dialog p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.45;
}
.brown-bag-dialog-selection {
  margin: 1.125rem 0;
  padding: 0.8125rem 0.875rem;
  display: grid;
  gap: 0.25rem;
  border-left: 3px solid var(--cgi-red);
  border-radius: var(--radius-sm);
  background: #faf6f5;
}
.brown-bag-dialog-selection strong {
  font-size: var(--text-sm);
}
.brown-bag-dialog-selection span {
  color: #5f585d;
  font-size: var(--text-sm);
}
.brown-bag-dialog label {
  display: grid;
  gap: 3px;
  font-size: var(--text-sm);
  font-weight: 800;
}
.brown-bag-dialog input {
  width: 100%;
  min-height: 2.625rem;
  margin-top: 0.4375rem;
  padding: 0.5rem 0.6875rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  font: inherit;
}
.brown-bag-dialog input:focus-visible {
  outline: 2px solid var(--focus-ring);
  border-color: var(--cgi-red);
}
.brown-bag-dialog p.brown-bag-commitment-note {
  margin: 0.75rem 0 0;
  padding: 0.625rem 0.75rem;
  border-left: 2px solid #b80f29;
  border-radius: var(--radius-sm);
  background: #fff5f7;
  color: #8c1730;
  font-size: var(--text-xs);
  line-height: 1.5;
}
.brown-bag-dialog .brown-bag-dialog-error:not(:empty) {
  margin-top: 0.75rem;
  color: var(--cgi-red-dark);
}
.brown-bag-dialog-actions {
  margin-top: 1.375rem;
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* src/css/assessment/assessment_confirmation.css */
.brown-bag-dialog.assessment-confirmation {
  padding: 1.5rem;
}
#assessmentConfirmationMessage {
  display: grid;
  gap: 0.875rem;
  margin: 1rem 0;
}
.assessment-confirmation .brown-bag-dialog-actions {
  flex-wrap: wrap;
}

/* src/css/settings/settings_unsaved.css */
.settings-unsaved-dialog {
  width: min(38rem, calc(100% - 1.75rem));
  max-height: calc(100dvh - 1.75rem);
  padding: 1.5rem;
  overflow: auto;
  overscroll-behavior: contain;
  overflow-wrap: anywhere;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  box-shadow: var(--shadow-panel);
}
.settings-unsaved-dialog::backdrop {
  background: rgba(35, 29, 27, 0.55);
  backdrop-filter: blur(2px);
}
.settings-unsaved-dialog h2 {
  margin: 0 0 0.625rem;
  font-size: var(--text-xl);
  line-height: 1.2;
}
.settings-unsaved-dialog > p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.settings-unsaved-actions {
  margin-top: 1.375rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
}
.settings-unsaved-actions button {
  min-width: 0;
  max-width: 100%;
  padding: 0.625rem 0.875rem;
  font-size: var(--text-sm);
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
}
@media (max-width: 600px) {
  .settings-unsaved-dialog {
    padding: 1.125rem;
  }
  .settings-unsaved-actions button {
    flex: 1 1 100%;
  }
}

/* src/css/prf/prf_help.css */
.prf-help {
  position: relative;
  z-index: 16;
}
.prf-help::after {
  content: "";
  position: absolute;
  top: 100%;
  left: -0.3125rem;
  width: 2.5rem;
  height: 0.5rem;
}
.prf-help-button {
  width: 1.875rem;
  height: 1.875rem;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid #d8d2ce;
  border-radius: 50%;
  background: #fff;
  color: var(--cgi-red-dark);
  font-size: var(--text-sm);
  font-weight: 900;
  line-height: 1;
  box-shadow: var(--shadow-panel);
}
.prf-help-button:hover,
.prf-help-button[aria-expanded=true] {
  border-color: var(--cgi-red);
  background: #fff4f6;
}
.prf-help-button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.prf-help-panel {
  position: absolute;
  top: calc(100% + 0.3125rem);
  left: 0;
  width: min(33.75rem, calc(100vw - 2.75rem));
  max-height: calc(100vh - 7.5rem);
  padding: 1.125rem 1.25rem;
  overflow-y: auto;
  border: 1px solid #ddd4d1;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.prf-help-panel h2 {
  margin: 3px 0 0.8125rem;
  font-size: var(--text-lg);
}
.prf-help-group h3 {
  margin: 0 0 0.625rem;
  color: var(--cgi-red-dark);
  font-size: var(--text-sm);
  font-weight: 800;
}
.prf-help-panel ul {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.625rem;
  list-style: none;
}
.prf-help-panel li {
  position: relative;
  padding-left: 1rem;
  color: #514b48;
  font-size: var(--text-sm);
  line-height: 1.48;
}
.prf-help-panel li::before {
  content: "";
  position: absolute;
  top: 0.57em;
  left: 0;
  width: 0.3125rem;
  height: 0.3125rem;
  border-radius: 50%;
  background: var(--cgi-red);
}
.prf-help-panel li strong {
  color: var(--ink);
}
.prf-loading,
.prf-error {
  min-height: 11.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  color: var(--muted);
}
.prf-error {
  color: var(--cgi-red-dark);
}

/* src/css/teams/team_progress.css */
.team-progress-panel {
  margin-top: 1rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.team-progress-panel > header {
  min-height: 4.5rem;
  padding: 0.625rem 1rem;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.team-progress-panel h2 {
  margin: 3px 0 0;
  font-size: var(--text-lg);
}
.team-progress-table-wrap {
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
.team-progress-table-wrap:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}
.team-progress-table {
  width: 100%;
  min-width: 40rem;
  table-layout: fixed;
  border-collapse: collapse;
}
.team-progress-table th,
.team-progress-table td {
  padding: 0.5625rem 0.4375rem;
  text-align: center;
}
.team-progress-table th:first-child {
  width: 28%;
  text-align: left;
}
.team-progress-table th:nth-child(2) {
  width: 14%;
}
.team-progress-table th:nth-child(3) {
  width: 14%;
}
.team-progress-table th:nth-child(4) {
  width: 20%;
}
.team-progress-table th:last-child {
  width: 24%;
}
.team-progress-table .team-progress-secondary {
  border-left: 1px solid #e5dfdc;
}
.team-progress-table thead th {
  height: 3rem;
  border-bottom: 1px solid #eae4e0;
  background: #fff;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.25;
  white-space: normal;
}
.team-progress-table tbody tr {
  height: 3.25rem;
  background: #fff;
}
.team-progress-table tbody th,
.team-progress-table tbody td {
  background: transparent;
}
.team-progress-table tbody tr + tr {
  border-top: 1px solid #eeeae7;
}
.team-progress-table tbody th {
  color: var(--ink);
  font-size: var(--text-sm);
  font-weight: 700;
}
.team-progress-table tbody td {
  color: #4f3970;
  font-size: var(--text-sm);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.team-progress-percentage strong {
  color: var(--ink);
  font-size: var(--text-sm);
}
.team-progress-count {
  margin-right: 0.3125rem;
  color: #655d59;
  font-size: var(--text-sm);
  font-weight: 600;
}
.team-progress-meter {
  width: 4.5rem;
  height: 0.375rem;
  display: block;
  margin: 0.3125rem auto 0;
  overflow: hidden;
  border-radius: 999px;
  background: #e8e5e9;
}
.team-progress-meter > span {
  height: 100%;
  display: block;
  border-radius: inherit;
  background: #4f3482;
}

/* src/css/foundation/foundation_tables.css */
table {
  width: 100%;
  border-collapse: collapse;
}
th,
td {
  padding: 0.5rem 0.4375rem;
  text-align: left;
  white-space: nowrap;
}
th {
  height: 1.875rem;
  background: var(--soft);
  color: #6b6561;
  font-size: var(--text-xs);
}
tbody tr + tr td {
  border-top: 1px solid #eeeae7;
}
tbody tr {
  height: 3.375rem;
  background: #fff;
}
tbody tr.current-user {
  box-shadow: inset 3px 0 var(--cgi-red);
}
.prf-avatar {
  width: 1.875rem;
  height: 1.875rem;
  flex: 0 0 1.875rem;
  display: grid;
  place-items: center;
  object-fit: cover;
  border: 1px solid #e1dcda;
  border-radius: 50%;
  background: #f5e8eb;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 800;
}

/* src/css/admin/admin_shell.css */
html:has(#adminView:not([hidden])) {
  scrollbar-gutter: stable;
}
.admin-page {
  width: min(82rem, 100%);
  margin: 0 auto;
  padding: 1.75rem clamp(1.125rem, 2.5vw, 1.5rem) 3.375rem;
}
.admin-shell-heading,
.admin-section-bar {
  width: min(79rem, 100%);
  margin-inline: auto;
}
.admin-shell-heading h1 {
  margin: 0;
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.admin-section-bar {
  margin-top: 0.875rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.625rem 0.875rem;
}
.admin-tabs {
  width: fit-content;
  padding: 0.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}

/* src/css/admin/admin_navigation.css */
#adminAccessPanel .admin-roster {
  margin-top: 0;
}
#adminBrownBagPanel > .admin-settings-card {
  margin-inline: auto;
}
.admin-tabs button {
  min-height: 2.25rem;
  padding: 0 0.875rem;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
}
.admin-tabs button:hover {
  color: var(--ink);
}
.admin-tabs button.active {
  background: var(--cgi-purple);
  color: #fff;
}
.admin-tabs button.admin-tab-secondary {
  background: #f2edf7;
  color: #614274;
}
.admin-tabs button.admin-tab-secondary:hover:not(.active) {
  background: #eae1f1;
  color: #3b0b5a;
}
.admin-tabs button.admin-tab-secondary.active {
  background: #4b1b68;
  color: #fff;
}
.admin-tabs button.admin-tab-divider {
  position: relative;
  margin-left: 0.5rem;
}
.admin-tabs button.admin-tab-divider::before {
  content: "";
  position: absolute;
  left: -0.375rem;
  top: 0.375rem;
  bottom: 0.375rem;
  border-left: 1px solid #d7c9e2;
}
.admin-tabs button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* src/css/assessment/assessment_admin.css */
.assessment-launch-card .assessment-lock-message {
  margin: 0;
  padding: 0.625rem 0.875rem;
  border-left: 0.25rem solid #7450a5;
  background: #f5f0fc;
  color: #382552;
  font-weight: 700;
}
.admin-override-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.625rem;
  margin-top: 1rem;
}
.admin-override-button {
  padding: 0.5625rem 1rem;
  border: 1px dashed #777;
  border-radius: 0;
  background: #f3f3f3;
  color: #3c3c3c;
  font: 700 0.75rem/1.3 system-ui, sans-serif;
  letter-spacing: 0.03em;
  cursor: pointer;
  box-shadow: none;
}
.admin-override-button:hover {
  background: #e6e6e6;
  border-color: #444;
}
.admin-override-button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
.assessment-admin-level {
  min-width: 0;
  max-width: 100%;
}
.assessment-admin-level select {
  max-width: 100%;
}

/* src/css/question_library/question_variants.css */
.question-variant-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
  margin: 1.125rem 0 0.375rem;
  border-bottom: 1px solid #ddd5d0;
}
.question-variant-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  min-width: 0;
}
.question-variant-tabs button {
  padding: 0.625rem 0.8125rem;
  border: 1px solid transparent;
  border-radius: 0.3125rem 0.3125rem 0 0;
  background: #f3f1ef;
  color: #504946;
  font: 700 0.73rem/1.2 system-ui, sans-serif;
  cursor: pointer;
}
.question-variant-tabs button[aria-selected=true] {
  border-color: #d9d2cd;
  border-bottom-color: #fff;
  background: #fff;
  color: #a70e28;
}
.question-variant-tabs button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.question-variant-actions {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
  margin-left: auto;
  padding-bottom: 0.3125rem;
}
.question-variant-actions button {
  white-space: nowrap;
}
.question-variant-note {
  margin: 0.375rem 0 1rem;
  color: var(--muted);
  font-size: var(--text-sm);
}
.admin-exam-variants {
  margin-top: 1rem;
}
.admin-exam-variants h2 {
  margin: 0;
  font-size: var(--text-md);
}
.admin-exam-variants ol {
  margin: 0.4375rem 0 0;
  padding-left: 1.375rem;
}
@media (max-width: 680px) {
  .question-variant-actions {
    margin-left: 0;
  }
}

/* src/css/settings/settings_layout.css */
.admin-panel {
  margin-top: 1rem;
}
.admin-settings-card {
  max-width: 55rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.admin-settings-card > header {
  padding: 1rem 1.125rem;
  border-bottom: 1px solid #eeeae7;
}
.admin-settings-card h2 {
  margin: 0;
  font-size: var(--text-lg);
}
.admin-settings-grid {
  padding: 1.125rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.125rem 1.5rem;
}
.admin-settings-grid label {
  display: grid;
  gap: 0.5rem;
  color: #49413d;
  font-size: var(--text-sm);
  font-weight: 800;
}
.admin-settings-grid input {
  width: 100%;
  min-height: 2.625rem;
  padding: 0.5rem 0.6875rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-sm);
  font-weight: 600;
}
.admin-settings-grid input:focus-visible {
  outline: 2px solid var(--focus-ring);
  border-color: var(--cgi-red);
}
.admin-settings-actions {
  padding: 0 1.125rem 1.125rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
}
.admin-settings-actions p {
  width: 100%;
  min-height: 1.125rem;
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
}
.admin-settings-actions p:empty {
  display: none;
}
.admin-settings-card.arena-settings {
  max-width: none;
  overflow: visible;
}
.settings-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  padding: 1rem;
  background: #faf9f8;
}
#adminSettingsPanel .arena-settings > .settings-groups {
  background: var(--paper);
}
.settings-subpanel {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #f3f1ef;
}
.settings-subpanel > h3 {
  margin: 0 0 1rem;
  color: var(--cgi-purple);
  font-size: var(--text-lg);
}
.settings-subpanel-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}
.settings-top-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
  align-items: start;
}
.settings-top-controls .settings-maintenance-header {
  flex-wrap: wrap;
}
.settings-live-pill {
  display: inline-flex;
  margin-left: 0.5rem;
  padding: 0.1875rem 0.5rem;
  border: 1px solid #9ac6a6;
  border-radius: 999px;
  background: #e8f5ec;
  color: #20633c;
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.25;
  vertical-align: middle;
}
@media (max-width: 960px) {
  .settings-top-controls {
    grid-template-columns: 1fr;
  }
}
.admin-settings-grid.settings-go-live-schedule {
  grid-template-columns: max-content minmax(0, 20rem);
  justify-content: start;
  align-items: end;
}
.settings-go-live-schedule label {
  min-width: 0;
}
.settings-go-live input:disabled {
  background: var(--soft);
  color: var(--muted);
  opacity: 0.65;
  cursor: not-allowed;
}
.settings-go-live .maintenance-switch input:disabled {
  border-color: #b7b1ad;
  background: #dedbd7;
}
.admin-settings-grid.settings-go-live-schedule .setting-toggle {
  justify-content: flex-start;
}
.settings-go-live-schedule .setting-toggle input {
  order: -1;
  flex: 0 0 1.125rem;
}
@media (max-width: 480px) {
  .admin-settings-grid.settings-go-live-schedule {
    grid-template-columns: 1fr;
    gap: 0.625rem;
  }
}

/* src/css/settings/settings_help.css */
.settings-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 1rem;
}
.settings-delivery {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.875rem;
  padding: 0.875rem 1.125rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #f3f1ef;
}
.settings-delivery label {
  min-width: 0;
  display: grid;
  gap: 0.4375rem;
  color: #49413d;
  font-size: var(--text-xs);
  font-weight: 800;
}
.settings-delivery p {
  margin: 0 0 3px;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
  white-space: nowrap;
}
.settings-help-heading {
  position: relative;
}
.settings-help-label {
  display: block;
}
.settings-help-button {
  display: inline-grid;
  place-items: center;
  vertical-align: middle;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.5rem;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--cgi-purple);
  font-size: var(--text-xs);
  font-weight: 800;
}
.settings-help-panel {
  position: fixed;
  z-index: 80;
  box-sizing: border-box;
  margin: 0;
  padding: 0.875rem 1rem;
  overflow-y: auto;
  border: 1px solid #dacde2;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #493552;
  box-shadow: 0 0.375rem 1.5rem #3b0b5a20;
  font-size: var(--text-xs);
  font-weight: 400;
  line-height: 1.6;
  text-transform: none;
  letter-spacing: normal;
  transition-property: none;
}
.settings-help-list {
  margin: 0;
  padding-left: 1.125rem;
  white-space: normal;
}
.settings-help-list > li,
.prf-help-panel li,
.brown-bag-topic-tooltip li {
  text-wrap: balance;
}
.brown-bag-topic-tooltip p {
  text-wrap: pretty;
}
.settings-help-list > li + li {
  margin-top: 0.375rem;
}
.settings-group > .settings-delivery {
  margin: 0.875rem 1.125rem;
  padding: 0.75rem;
}

/* src/css/settings/settings_groups.css */
.settings-group {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
}
.settings-group > h3 {
  margin: 0;
  padding: 1rem 1.125rem;
  border-bottom: 1px solid var(--line);
  font-size: var(--text-lg);
}
.settings-group > h4 {
  margin: 0.3125rem 1.125rem 0;
  color: var(--muted);
  font-size: var(--text-xs);
}
.settings-group-wide {
  grid-column: 1 / -1;
}
.settings-batch-times {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.settings-intervals {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.125rem 1rem;
  align-items: end;
}
.settings-intervals label > span {
  line-height: 1.4;
}
.settings-note {
  margin: 0 1.125rem 1.125rem;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}

/* src/css/settings/settings_reserved_weeks.css */
.settings-reserved-week-picker {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  gap: 0.625rem;
}
.settings-reserved-week-picker button {
  min-height: 2.625rem;
}
.settings-reserved-date-field {
  position: relative;
  display: block;
  min-width: 0;
}
.settings-reserved-date-field input {
  padding-right: 4.5rem;
}
.settings-reserved-date-field input::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 0.625rem;
  top: 50%;
  transform: translateY(-50%);
}
.settings-reserved-date-week {
  position: absolute;
  right: 2.125rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 500;
  pointer-events: none;
}
.settings-reserved-weeks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  max-height: 12rem;
  overflow: auto;
  margin: 0 1.125rem 0.875rem;
  padding: 0;
  list-style: none;
}
.settings-reserved-week {
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3125rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--soft);
  font-size: var(--text-xs);
}
.settings-reserved-week span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.settings-reserved-week button {
  flex: 0 0 auto;
  min-width: 1.75rem;
  min-height: 1.75rem;
  padding: 0.125rem;
  border: 0;
  border-radius: 0.25rem;
  background: transparent;
  color: var(--cgi-red-dark);
  cursor: pointer;
  font: inherit;
}
.settings-reserved-week-empty {
  color: var(--muted);
  font-size: var(--text-xs);
}
@media (max-width: 400px) {
  .settings-reserved-week-picker {
    grid-template-columns: 1fr;
  }
  .settings-reserved-week-picker button {
    justify-self: start;
  }
}

/* src/css/settings/settings_fields.css */
.admin-settings-grid select,
.admin-settings-grid textarea,
.settings-delivery select,
.settings-roster input,
.settings-roster select {
  min-height: 2.625rem;
  min-width: 0;
  width: 100%;
  padding: 0.5rem 0.625rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  color: var(--ink);
  background: #fff;
  font: inherit;
  font-size: var(--text-sm);
}
.admin-settings-grid textarea {
  min-height: 5.25rem;
  resize: vertical;
}
.admin-settings-grid .setting-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 2.625rem;
}
.admin-settings-grid.settings-choices {
  grid-template-columns: 1fr;
  gap: 0.75rem;
  padding-bottom: 0.75rem;
}
.settings-choices .setting-toggle {
  justify-content: flex-start;
  min-height: 1.5rem;
}
.settings-choices .setting-toggle input {
  order: -1;
  flex: 0 0 1.125rem;
}
.settings-report-schedule {
  padding-top: 0.5rem;
}
.settings-diverse-controls {
  grid-template-columns: minmax(0, 1fr);
  padding-top: 0.375rem;
}
.admin-settings-grid .settings-prf-contribution {
  grid-template-columns: minmax(0, 1fr) 6.25rem;
  align-items: center;
  gap: 0.75rem;
}
.setting-toggle input[type=checkbox] {
  width: 1.125rem;
  min-height: 1.125rem;
  height: 1.125rem;
  accent-color: var(--cgi-red);
}

/* src/css/settings/settings_maintenance.css */
.settings-maintenance-controls {
  grid-template-columns: 1fr;
}
.settings-maintenance-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1rem 1.125rem;
  border-bottom: 1px solid var(--line);
}
.settings-maintenance-header h3 {
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 800;
}
.settings-maintenance-header .maintenance-switch {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.settings-maintenance-controls label {
  min-width: 0;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
}
.settings-maintenance-controls textarea {
  height: 2.625rem;
  min-height: 2.625rem;
  resize: none;
  font-weight: 400;
}
.setting-toggle.maintenance-switch input {
  appearance: none;
  width: 2.625rem;
  height: 1.5rem;
  min-height: 1.5rem;
  flex: 0 0 2.625rem;
  margin: 0;
  padding: 0;
  border: 1px solid #9a9692;
  border-radius: 999px;
  background: #e1deda;
  cursor: pointer;
}
.maintenance-switch input::before {
  content: "";
  display: block;
  width: 1.125rem;
  height: 1.125rem;
  margin: 2px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px #0003;
}
.maintenance-switch input:checked {
  border-color: var(--cgi-red);
  background: var(--cgi-red);
}
.maintenance-switch input:checked::before {
  transform: translateX(1.125rem);
}
.maintenance-switch input:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
.maintenance-switch-state {
  min-width: 1.5rem;
  color: var(--muted);
  font-size: var(--text-xs);
}
@media (max-width: 420px) {
  .settings-maintenance-controls label {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

/* src/css/settings/settings_teams.css */
.settings-team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}
.settings-team-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fcfbfa;
}
.settings-roster {
  min-width: 0;
}
.settings-roster > label {
  display: grid;
  gap: 0.5rem;
  margin: 0 0 0.875rem;
  font-size: var(--text-xs);
}
#teamsGroups {
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}
.settings-roster-scroll {
  max-height: 23.75rem;
  overflow: auto;
}
.settings-roster-table {
  width: 100%;
  min-width: 54rem;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--text-xs);
}
.settings-roster-table th,
.settings-roster-table td {
  padding: 0.625rem;
  border-bottom: 1px solid var(--line);
  text-align: left;
}
.settings-roster-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8f6f5;
  box-shadow: 0 1px 0 var(--line);
}
.settings-roster-table thead th:first-child {
  width: 30%;
}
.settings-roster-table thead th:nth-child(2) {
  width: 24%;
}
.settings-roster-table thead th:nth-child(3) {
  width: 13%;
}
.settings-roster-table thead th:nth-child(4) {
  width: 8rem;
}
.settings-roster-table thead th:last-child {
  width: 19%;
  white-space: normal;
}
.settings-roster-table small {
  display: block;
  margin-top: 0.3125rem;
  color: var(--muted);
  font-weight: 400;
  overflow-wrap: anywhere;
}
.settings-roster-table label {
  position: relative;
}
.settings-starting-level,
.settings-starting-level > label {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
.settings-starting-level > label {
  display: block;
}
.settings-starting-level select {
  width: 4rem;
  max-width: 100%;
}
.settings-starting-level select.has-starting-level {
  border-color: #a2c9a8;
  background: #e7f4e8;
  color: #24552b;
}
.manual-level-label {
  color: #815500;
  background: #fff4d1;
  border-radius: 0.3rem;
  padding: 0.2rem 0.4rem;
  font-size: var(--text-xs);
  font-weight: 600;
}

/* src/css/activity/activity_filters.css */
.activity-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  overflow: hidden;
}
.activity-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem;
  padding: 1.375rem 1.5rem;
  border-bottom: 1px solid var(--line);
}
.activity-heading h2 {
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 800;
}
.activity-heading p {
  margin: 0.5rem 0 0;
  font-size: var(--text-sm);
  line-height: 1.5;
  color: var(--muted);
}
.activity-filters {
  padding: 1.125rem 1.5rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1.2fr)) repeat(2, minmax(8.125rem, 1fr)) auto;
  align-items: end;
  gap: 0.875rem;
  background: var(--soft);
  border-bottom: 1px solid var(--line);
}
.activity-filters label {
  display: grid;
  min-width: 0;
  gap: 0.4375rem;
  font-size: var(--text-xs);
  font-weight: 700;
}
.activity-filters input,
.activity-filters select {
  width: 100%;
  min-width: 0;
  min-height: 2.625rem;
  padding: 0.5625rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: 400 0.8rem "Segoe UI", sans-serif;
}
.activity-status {
  margin: 0;
  padding: 0 1.5rem;
  color: var(--muted);
  font-size: var(--text-sm);
}
.activity-status:not(:empty) {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.activity-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* src/css/activity/activity_entries.css */
.activity-entry {
  --activity-color: #6b6260;
  --activity-tint: #f5f2f0;
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr) auto;
  gap: 0.875rem;
  align-items: start;
  padding: 1.125rem 1.5rem;
  border-bottom: 1px solid #eeeae7;
  border-left: 3px solid var(--activity-color);
}
.activity-admin {
  --activity-color: #754398;
  --activity-tint: #f4edf8;
}
.activity-manager {
  --activity-color: #2b648c;
  --activity-tint: #edf4fa;
}
.activity-levelUp {
  --activity-color: #26734d;
  --activity-tint: #eaf6ef;
}
.activity-system {
  --activity-color: #356355;
  --activity-tint: #eaf4ef;
}
.activity-email-details {
  min-width: 0;
  margin-top: 0.625rem;
  font-size: var(--text-xs);
}
.activity-email-details > summary {
  color: var(--activity-color);
  cursor: pointer;
  font-weight: 600;
}
.activity-email-details > summary:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
.activity-email-recipients {
  list-style: none;
  margin: 0.625rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.4375rem;
}
.activity-email-recipients li {
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
  min-width: 0;
}
.activity-email-role {
  min-width: 2rem;
  color: var(--muted);
}
.activity-email-identity {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.125rem 0.5rem;
  overflow-wrap: anywhere;
}
.activity-email-entry .activity-time {
  white-space: normal;
}
.activity-firstSignIn {
  --activity-color: #8c520b;
  --activity-tint: #fff1d6;
  background: #fffcf5;
}
.activity-mark {
  display: grid;
  place-items: center;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  background: var(--activity-tint);
  color: var(--activity-color);
  font-weight: 800;
  font-size: var(--text-lg);
}
.activity-entry-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
  font-size: var(--text-sm);
}
.activity-badge {
  border-radius: var(--radius-sm);
  padding: 3px 0.4375rem;
  background: var(--activity-tint);
  color: var(--activity-color);
  font-size: var(--text-xs);
  font-weight: 700;
}
.activity-people {
  margin: 0.4375rem 0 0;
  font-size: var(--text-sm);
  overflow-wrap: anywhere;
}
.activity-detail {
  margin: 0.3125rem 0 0;
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/activity/activity_assessments.css */
.activity-missed-questions {
  min-width: 0;
  margin-top: 0.75rem;
  padding: 0.625rem;
  border-radius: var(--radius-sm);
  background: #f6f4f2;
}
.activity-missed-questions > p {
  margin: 0 0 0.4375rem;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 600;
}
.activity-missed-questions > summary {
  color: var(--cgi-purple);
  font-size: var(--text-xs);
  font-weight: 600;
  cursor: pointer;
}
.activity-missed-questions > summary:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
  border-radius: var(--radius-sm);
}
.activity-missed-questions[open] > summary {
  margin-bottom: 0.625rem;
}
.activity-missed-questions ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4375rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.activity-missed-questions li {
  min-width: 0;
  max-width: 100%;
}
.activity-missed-questions a {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.4375rem;
  max-width: 100%;
  min-height: 2rem;
  padding: 0.375rem 0.5rem;
  border: 1px solid #e1d9e8;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--cgi-purple);
  font-size: var(--text-xs);
  text-decoration: none;
  overflow-wrap: anywhere;
}
.activity-missed-questions a:hover {
  background: #f2edf7;
  border-color: #ba9dcf;
}
.activity-missed-questions a:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.activity-missed-questions a span {
  min-width: 0;
  color: var(--muted);
}
.activity-missed-questions a small {
  color: var(--muted);
  font-size: inherit;
}

/* src/css/activity/activity_changes.css */
.activity-entry.activity-has-changes {
  grid-template-columns: 2rem minmax(16.25rem, 0.8fr) minmax(0, 1.2fr) auto;
}
.activity-changes {
  min-width: 0;
  padding-top: 1px;
  font-size: var(--text-xs);
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.activity-change {
  margin: 0;
}
.activity-change + .activity-change {
  margin-top: 3px;
}
.activity-change-label {
  color: var(--muted);
}
.activity-change-before {
  color: var(--muted);
}
.activity-change-after {
  font-weight: 600;
}
.activity-more-changes {
  margin-top: 0.3125rem;
}
.activity-more-changes summary {
  color: var(--activity-color);
  cursor: pointer;
  font-weight: 600;
}
@media (max-width: 1000px) {
  .activity-entry.activity-has-changes {
    grid-template-columns: 32px minmax(0, 1fr) auto;
  }
  .activity-has-changes .activity-changes {
    grid-column: 2 / -1;
    grid-row: 2;
  }
  .activity-has-changes .activity-time {
    grid-column: 3;
    grid-row: 1;
  }
}
.activity-time {
  margin-top: 3px;
  color: var(--muted);
  font-size: var(--text-xs);
  white-space: nowrap;
}
.activity-pagination {
  margin: 0;
  border: 0;
  border-radius: 0;
  padding: 1.125rem;
}
.activity-note {
  margin: 0;
  padding: 0 1.5rem 1.25rem;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}
@media (max-width: 1000px) {
  .activity-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .activity-heading,
  .activity-filters {
    padding: 18px;
  }
  .activity-entry {
    padding: 16px;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 12px;
  }
  .activity-mark {
    width: 28px;
    height: 28px;
  }
  .activity-time {
    grid-column: 2;
    margin-top: -4px;
  }
  .activity-filters {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .activity-entry.activity-has-changes {
    grid-template-columns: 28px minmax(0, 1fr);
  }
  .activity-has-changes .activity-changes {
    grid-column: 2;
    grid-row: 2;
  }
  .activity-has-changes .activity-time {
    grid-column: 2;
    grid-row: 3;
  }
}

/* src/css/settings/settings_roster_actions.css */
.settings-roster-table label > span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.settings-roster-table td:nth-child(3) .setting-toggle {
  display: flex;
  justify-content: center;
}
.settings-roster-table input[type=checkbox] {
  min-height: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
  margin: 0;
}
.arena-settings .admin-settings-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding: 0.875rem 1.125rem;
  border-top: 1px solid var(--line);
  background: #fff;
}
.arena-settings .admin-settings-actions p {
  width: auto;
}
.arena-settings .admin-settings-actions .settings-draft-status {
  color: var(--cgi-purple);
  font-weight: 600;
}
.partner-offboarding-dialog .primary-button {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.team-target-note {
  display: block;
  margin-top: 0.375rem;
  font-size: var(--text-xs);
  font-weight: 400;
  text-transform: none;
  color: var(--muted);
}
@media (max-width: 760px) {
  .settings-groups,
  .settings-team-grid {
    grid-template-columns: 1fr;
  }
  .settings-roster-table th,
  .settings-roster-table td {
    padding: 7px;
  }
}
@media (max-width: 960px) {
  .settings-subpanel-columns {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .settings-subpanel {
    padding: 0.75rem;
  }
}
@media (max-width: 600px) {
  .settings-delivery p {
    white-space: normal;
  }
}
@media (max-width: 600px) {
  .settings-delivery {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .settings-batch-times label {
    grid-template-columns: minmax(0, 1fr) 130px;
    align-items: center;
  }
  .settings-intervals label {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 0.375rem;
  }
  .settings-intervals label > span {
    min-height: 0;
  }
}

/* src/css/email_templates/email_template_fields.css */
.email-template-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 1.125rem;
  align-items: start;
}
.email-template-form {
  min-width: 0;
}
.email-template-form header p {
  margin: 0.5rem 0 0;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}
.email-template-fields {
  padding: 1.125rem;
  display: grid;
  gap: 1rem;
}
.email-template-fields label {
  min-width: 0;
  display: grid;
  gap: 0.4375rem;
  color: #49413d;
  font-size: var(--text-sm);
  font-weight: 800;
}
.email-template-selectors {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(5.9375rem, 1fr);
  gap: 0.75rem;
}
.email-template-fields input,
.email-template-fields textarea,
.email-template-fields select {
  width: 100%;
  min-width: 0;
  padding: 0.625rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: 400 0.8rem/1.5 system-ui, sans-serif;
}
.email-template-fields textarea {
  resize: vertical;
}
.email-template-fields :is(input, textarea, select):focus-visible {
  outline: 2px solid var(--focus-ring);
  border-color: var(--cgi-red);
}
.email-template-variables {
  padding: 0.625rem 0.75rem;
  border-radius: var(--radius-sm);
  background: #f5f1f9;
  color: #584078;
  font-size: var(--text-xs);
}
.email-template-variables > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 0.4375rem;
}
.email-template-variables button {
  padding: 0.25rem 0.4375rem;
  border: 1px solid #ded3ea;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #584078;
  font: 600 0.72rem/1.4 monospace;
  cursor: pointer;
}

/* src/css/email_templates/email_template_preview.css */
.email-template-preview {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
}
.email-template-preview header {
  padding: 1rem 1.125rem;
  border-bottom: 1px solid var(--line);
}
.email-template-preview h2 {
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 800;
}
.email-template-preview header p {
  margin: 0.625rem 0 0.375rem;
  color: var(--ink);
  font-size: var(--text-sm);
  font-weight: 700;
  overflow-wrap: anywhere;
}
.email-template-preview header small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.email-template-message {
  min-height: 6.25rem;
  background: #f3f1f0;
}
.email-template-preview header > [role=status] {
  display: block;
  margin-top: 0.5rem;
  color: var(--muted);
  font-size: var(--text-xs);
}
.email-template-actions {
  padding: 0 1.125rem 1.125rem;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.625rem;
}
.email-template-actions button {
  flex: 0 0 auto;
  min-height: 2.5rem;
  padding: 0.5rem 0.875rem;
  font-size: var(--text-sm);
  white-space: nowrap;
}
.email-template-actions p {
  min-width: 0;
  margin: 0 0 0 auto;
  color: var(--muted);
  font-size: var(--text-xs);
  text-align: right;
  overflow-wrap: anywhere;
}
.email-template-error {
  padding: 0.75rem 1rem;
  margin-bottom: 0.875rem;
  border: 1px solid #efc3cb;
  border-radius: var(--radius-sm);
  background: #fff3f5;
  color: var(--cgi-red-dark);
  font-size: var(--text-sm);
}
@media (max-width: 850px) {
  .email-template-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 390px) {
  .email-template-selectors {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .admin-settings-grid {
    grid-template-columns: 1fr;
  }
}

/* src/css/admin/admin_overview_layout.css */
.admin-library-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6875rem;
}
.admin-total-count {
  min-height: 1.75rem;
  padding: 0 0.6875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  border: 1px solid #e5deda;
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 700;
  white-space: nowrap;
}
.admin-total-count strong {
  color: var(--ink);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
}
.admin-loading,
.admin-error {
  min-height: 11.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  color: var(--muted);
}
.admin-error {
  color: var(--cgi-red-dark);
}
.admin-overview-content {
  margin-top: 0;
  display: grid;
  grid-template-columns: 24rem minmax(0, 1fr);
  align-items: stretch;
  gap: 0.875rem;
}
.admin-overview-detail {
  min-width: 0;
}
.admin-overview-top {
  margin-bottom: 0.875rem;
  display: grid;
  grid-template-columns: 18rem minmax(0, 1fr);
  gap: 0.875rem;
  align-items: stretch;
}
.admin-rating-panel {
  height: auto;
  min-height: 0;
  contain: size;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-panel);
}
.admin-rating-panel .prf-panel-header {
  min-height: 4.5rem;
  padding: 0.625rem 0.875rem;
  gap: 0.5rem;
}
.admin-rating-panel .prf-panel-header h2 {
  font-size: var(--text-md);
}
.admin-rating-panel .prf-panel-meta {
  font-size: var(--text-xs);
  white-space: nowrap;
}
.admin-rating-panel .rating-table th,
.admin-rating-panel .rating-table td {
  padding-right: 0.875rem;
  padding-left: 0.875rem;
}
.admin-rating-panel .rating-table th:nth-child(2) {
  width: 7.75rem;
}
.admin-rating-panel .prf-points {
  gap: 0.5rem;
}
.admin-rating-panel .prf-bar {
  width: 4rem;
}
.admin-rating-panel .rating-person {
  gap: 0.5rem;
}
.admin-rating-panel .rating-position {
  width: 1rem;
  flex-basis: 1rem;
}

/* src/css/admin/admin_overview_counters.css */
.prf-overview {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.prf-overview > header {
  min-height: 4.5rem;
  padding: 0.625rem 0.8125rem;
  display: grid;
  gap: 0.625rem;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.prf-overview h2 {
  margin: 3px 0 0;
  font-size: var(--text-md);
  white-space: nowrap;
}
.prf-onboarded {
  display: grid;
  justify-items: center;
  gap: 2px;
  text-align: center;
}
.prf-overview-counters {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0.5rem;
}
.prf-onboarded span {
  color: #5f585d;
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.2;
}
.prf-onboarded strong {
  color: var(--ink);
  font-size: var(--text-lg);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.prf-overview-counters .prf-onboarded span {
  font-size: var(--text-xs);
  white-space: nowrap;
}
.prf-overview-counters .prf-onboarded strong {
  font-size: var(--text-md);
}

/* src/css/brown_bag/brown_bag_email_settings.css */
.brown-bag-admin {
  margin-top: 0;
}
.brown-bag-email-settings {
  margin-top: 1.375rem;
}
.brown-bag-email-options {
  padding: 1.125rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}
.brown-bag-email-options fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.brown-bag-email-options legend {
  padding: 0;
  color: var(--ink);
  font-size: var(--text-sm);
  font-weight: 800;
}
.brown-bag-email-options fieldset > p {
  margin: 0.375rem 0 1rem;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.5;
}
.brown-bag-email-recipients {
  display: grid;
  gap: 0.875rem;
}
.brown-bag-email-options label {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: var(--text-sm);
  cursor: pointer;
}
.brown-bag-email-options input {
  width: 1.0625rem;
  height: 1.0625rem;
  flex: 0 0 1.0625rem;
  margin: 1px 0 0;
  accent-color: var(--cgi-red);
}
.brown-bag-email-options span {
  display: grid;
  gap: 3px;
}
.brown-bag-email-options strong {
  color: var(--ink);
}
.brown-bag-email-options small {
  color: var(--muted);
  font-size: var(--text-xs);
  overflow-wrap: anywhere;
}
@media (max-width: 600px) {
  .brown-bag-email-options {
    grid-template-columns: 1fr;
    padding: 18px;
  }
  .rating-person {
    gap: 7px;
  }
  .rating-person .prf-avatar {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }
}

/* src/css/brown_bag/brown_bag_admin.css */
.admin-brown-bag-list {
  max-height: 32.5rem;
  overflow-y: auto;
}
.admin-brown-bag-row {
  padding: 0.875rem 1.25rem;
  display: grid;
  grid-template-columns: minmax(9.375rem, 1fr) minmax(10rem, 1fr);
  align-items: start;
  gap: 0.625rem 1rem;
  border-bottom: 1px solid var(--line);
}
.admin-brown-bag-row:last-child {
  border-bottom: 0;
}
.admin-brown-bag-row > div:first-child {
  display: grid;
  gap: 0.25rem;
}
.admin-brown-bag-row > .admin-brown-bag-info {
  grid-template-columns: minmax(0, 1fr) 1.75rem;
  align-items: start;
  gap: 0.625rem;
}
.admin-brown-bag-info > div {
  min-width: 0;
  display: grid;
  gap: 0.25rem;
}
.admin-brown-bag-row strong {
  font-size: var(--text-sm);
}
.admin-brown-bag-row small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.admin-brown-bag-actions {
  min-width: 0;
  display: grid;
  gap: 0.4375rem;
}
.admin-brown-bag-date-actions {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
}
.admin-brown-bag-presenter-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.4375rem;
}
.admin-brown-bag-presenter-actions select {
  min-width: 0;
  flex: 1;
}
.admin-brown-bag-presenter-actions button {
  flex: 0 0 auto;
  white-space: nowrap;
}
.admin-brown-bag-actions select {
  max-width: 11.875rem;
  min-height: 2.0625rem;
  padding: 0.25rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  font: inherit;
  font-size: var(--text-xs);
}
.admin-brown-bag-actions button {
  min-height: 2.0625rem;
  padding: 0.3125rem 0.5625rem;
  font-size: var(--text-xs);
}
@media (max-width: 600px) {
  .admin-brown-bag-row {
    grid-template-columns: 1fr;
  }
  .prf-overview-counters {
    gap: 7px;
  }
}

/* src/css/admin/admin_overview_milestones.css */
.prf-stage-list {
  flex: 1;
  display: grid;
  grid-template-rows: repeat(4, minmax(2.6875rem, 1fr));
}
.prf-stage {
  --share: 0%;
  background:
    linear-gradient(
      90deg,
      #efeaf7 var(--share),
      transparent var(--share));
  padding: 0.375rem 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.375rem;
  border-bottom: 1px solid #e8e3e6;
}
.prf-stage span {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
  color: #513775;
  font-size: var(--text-sm);
  font-weight: 800;
  white-space: nowrap;
}
.prf-stage abbr {
  cursor: help;
  text-decoration: underline dotted;
  text-underline-offset: 3px;
}
.prf-stage small {
  color: #5f585d;
  font-size: var(--text-xs);
  font-weight: 600;
}
.prf-stage strong {
  color: #3e2a63;
  font-size: var(--text-md);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.admin-team-panel {
  min-width: 0;
}
.admin-team-panel .team-progress-panel {
  height: 100%;
  margin: 0;
}
.admin-team-panel .team-progress-table {
  min-width: 33.5rem;
}
.admin-team-panel .team-progress-table th:first-child {
  width: 30%;
}
.admin-team-panel .team-progress-table th:nth-child(2),
.admin-team-panel .team-progress-table th:nth-child(3) {
  width: 12%;
}
.admin-team-panel .team-progress-table th:last-child {
  width: 26%;
}
@media (max-width: 1280px) {
  .admin-overview-content {
    grid-template-columns: 1fr;
  }
  .admin-rating-panel {
    contain: none;
  }
  .admin-rating-panel .rating-table-wrap {
    flex: none;
    max-height: 35rem;
  }
}
@media (max-width: 850px) {
  .admin-overview-top {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 520px) {
  .admin-rating-panel .rating-table th:nth-child(2) {
    width: 3.25rem;
  }
}

/* src/css/partners/partner_roster.css */
.admin-roster {
  margin-top: 1.375rem;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.admin-roster > header {
  padding: 1rem 1.125rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  border-bottom: 1px solid #eeeae7;
}
.admin-roster h2 {
  margin: 0;
  font-size: var(--text-lg);
}
.admin-roster > header > span {
  min-width: 1.875rem;
  height: 1.875rem;
  padding: 0 0.5rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #fff1f3;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 900;
}
.admin-roster > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-roster-entry {
  min-width: 0;
  padding: 0.8125rem 1.125rem;
  display: flex;
  align-items: center;
  gap: 0.6875rem;
  border-bottom: 1px solid #f0edeb;
}
.admin-roster-entry:nth-child(odd) {
  border-right: 1px solid #f0edeb;
}
.admin-roster-icon {
  width: 1.875rem;
  height: 1.875rem;
  flex: 0 0 1.875rem;
  display: grid;
  place-items: center;
  border: 1px solid #efb8c1;
  border-radius: 50%;
  background: #fff4f6;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 900;
}
.admin-roster-entry div {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.admin-roster-entry strong {
  overflow: hidden;
  color: #332e2b;
  font-size: var(--text-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-roster-entry small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.admin-roster-add {
  padding: 1rem 1.125rem 0.625rem;
  display: grid;
  gap: 0.4375rem;
  border-bottom: 1px solid #f0edeb;
}
.admin-roster-add label {
  color: #514b48;
  font-size: var(--text-xs);
  font-weight: 800;
}
.admin-roster-add > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.admin-roster-add input {
  flex: 1 1 16.25rem;
  min-width: 0;
  min-height: 2.4375rem;
  padding: 0.4375rem 0.625rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  font: inherit;
  font-size: var(--text-sm);
}
.admin-roster-add button {
  min-height: 2.4375rem;
  font-size: var(--text-xs);
}
.admin-roster-status {
  min-height: 1.125rem;
  margin: 0;
  padding: 0.375rem 1.125rem;
  color: var(--success);
  font-size: var(--text-xs);
}
.admin-roster-status:empty,
#adminBrownBagStatus:empty {
  display: none;
}
.admin-roster-status[data-error=true] {
  color: var(--cgi-red-dark);
}
.admin-roster-remove {
  margin-left: auto;
  flex: 0 0 auto;
  font-size: var(--text-xs);
}
.role-pill {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.5625rem;
  border: 1px solid #e4dcf0;
  border-radius: 999px;
  background: #f3eef9;
  color: #503177;
  font-size: var(--text-xs);
  font-weight: 800;
  white-space: nowrap;
}
.admin-roster-entry .role-pill {
  color: #503177;
}
.admin-roster-entry .super-admin-pill {
  border-color: #efb8c1;
  background: #fff0f3;
  color: var(--cgi-red-dark);
}
.admin-roster-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3125rem;
}
.admin-roster-entry .team-lead-pill {
  border-color: #bcdccf;
  background: #edf7f1;
  color: #23634d;
}
.team-progress-note {
  margin: 0;
  padding: 0.5625rem 0.875rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/partners/partner_grid.css */
.partner-grid {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.partner-grid > header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1.125rem 1.25rem 0.625rem;
}
.partner-grid h2 {
  margin: 0;
  font-family: inherit;
  font-size: var(--text-sm);
}
.partner-grid-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem 1.125rem;
}
.partner-sort-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #655d59;
  font-size: var(--text-sm);
  cursor: pointer;
}
.partner-sort-toggle input {
  width: 0.9375rem;
  height: 0.9375rem;
  margin: 0;
  accent-color: var(--cgi-red);
}
.demo-pill {
  background: #fff7e6;
  border-color: #e8d2a2;
  color: #7c590b;
}
.partner-grid-note {
  margin: 0;
  padding: 0 1.25rem 1rem;
  font-size: var(--text-sm);
  line-height: 1.5;
  color: var(--muted);
}
.partner-team-tabs {
  display: flex;
  gap: 0.3125rem;
  overflow-x: auto;
  padding: 0.5rem 1.25rem;
  background: #fff;
}
.partner-team-tabs button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 0 0 auto;
  min-height: 2.25rem;
  padding: 0.375rem 0.875rem;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: #655d59;
  font: inherit;
  font-size: var(--text-sm);
  font-weight: 800;
  cursor: pointer;
}
.partner-team-tabs button.active {
  color: #fff;
  background: var(--cgi-purple);
}
.partner-team-tabs button span {
  min-width: 1.4375rem;
  padding: 3px 0.375rem;
  border-radius: 999px;
  background: #eeeae7;
  color: #655d59;
  font-size: var(--text-xs);
}
.partner-team-tabs button.active span {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}
.partner-team-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.375rem 1.25rem;
  padding: 0.9375rem 1.25rem;
}
.partner-team-summary h3 {
  margin: 0;
  color: #3e3936;
  font-size: var(--text-sm);
}
.partner-team-summary p {
  margin: 0;
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/partners/partner_table.css */
.partner-table-wrap {
  max-height: 36.25rem;
  overflow: auto;
  overscroll-behavior: contain;
}
.partner-table {
  width: 100%;
  min-width: 57rem;
  table-layout: fixed;
  border-collapse: collapse;
}
.partner-table th,
.partner-table td {
  padding: 0.625rem 0.75rem;
  text-align: center;
  white-space: normal;
}
.partner-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #fff;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: #655d59;
  font-size: var(--text-xs);
}
.partner-column-sort {
  display: inline-block;
  max-width: 100%;
  min-height: 1.5rem;
  padding: 0;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}
.partner-table th:first-child {
  text-align: left;
  width: 20rem;
}
.partner-table thead th:nth-child(2),
.partner-table thead th:nth-child(3) {
  width: 4.5rem;
}
.partner-table thead th:nth-child(4) {
  width: 8rem;
}
.partner-table thead th:nth-child(5) {
  width: 9rem;
}
.partner-table thead th:last-child {
  width: 11rem;
}
.partner-table td:last-child .partner-email-button {
  min-width: 0;
  max-width: 100%;
}
.partner-table tbody tr + tr {
  border-top: 1px solid #eeeae7;
}
.partner-table tbody th {
  background: transparent;
}
.partner-table tbody th.partner-name-success {
  box-shadow: inset 3px 0 #6fbf8c;
}
.partner-table tbody th.partner-name-incomplete {
  box-shadow: inset 3px 0 #ee9aaa;
}
.partner-table tbody td {
  color: #655d59;
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
}
.partner-person {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.partner-person > span {
  min-width: 0;
}
.partner-person strong,
.partner-person small {
  overflow-wrap: anywhere;
}
.partner-person strong {
  color: #38312e;
  font-size: var(--text-sm);
}
.partner-person small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 400;
}
.partner-avatar {
  flex: 0 0 2rem;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  border: 1px solid #e4dcf0;
  border-radius: 50%;
  background: #f3eef9;
  color: #503177;
  font-size: var(--text-xs);
  font-weight: 800;
}
.partner-status {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: var(--text-xs);
  font-weight: 700;
}
.partner-status > span {
  display: grid;
  place-items: center;
  width: 1.1875rem;
  height: 1.1875rem;
  border-radius: 50%;
  font-size: var(--text-sm);
}
.partner-status.yes {
  color: #18703b;
}
.partner-status.yes > span {
  background: #e4f4e8;
}
.partner-status.no {
  color: #b31834;
}
.partner-status.no > span {
  background: #fde8ed;
}

/* src/css/partners/partner_email_actions.css */
.partner-email-button {
  min-width: 6.5625rem;
  min-height: 2.0625rem;
  font-size: var(--text-xs);
}
.partner-email-button.partner-email-scheduled,
.partner-team-toolbar > .partner-email-scheduled {
  white-space: normal;
  line-height: 1.45;
  border-color: #dec48f;
  background: #fff5df;
  color: #7d4a09;
}
.partner-email-button.partner-email-scheduled:hover:not(:disabled),
.partner-team-toolbar > .partner-email-scheduled:hover:not(:disabled) {
  border-color: #b99148;
  background: #ffecd0;
}
.partner-email-button.partner-email-scheduled {
  min-width: 9.375rem;
  max-width: 14.375rem;
}
.partner-team-toolbar > .partner-invite-button {
  border-color: var(--cgi-red);
  background: var(--cgi-red);
  color: #fff;
}
.partner-team-toolbar > .partner-invite-button:hover:not(:disabled) {
  border-color: var(--cgi-red-dark);
  background: var(--cgi-red-dark);
}
.partner-reminder-button {
  border-color: #d9cce9;
  background: #f3eef9;
  color: #503177;
}
.partner-reminder-button:hover:not(:disabled) {
  border-color: #b49dce;
  background: #eae1f5;
}
.partner-email-button:disabled {
  opacity: 1;
  border-color: #e2ddda;
  background: #f4f1ef;
  color: #716963;
  cursor: not-allowed;
}
.partner-email-status {
  margin: 0;
  padding: 0.625rem 1.25rem;
  color: var(--success);
  font-size: var(--text-sm);
}
.partner-email-status:empty {
  display: none;
}
.partner-email-status[data-error=true] {
  color: var(--cgi-red-dark);
}

/* src/css/partners/partner_email_dialog.css */
.partner-email-dialog {
  width: min(38.75rem, calc(100vw - 1.75rem));
  max-height: calc(100dvh - 2.5rem);
  padding: 1.5rem;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: #38312e;
}
.partner-email-dialog::backdrop {
  background: rgba(35, 29, 27, 0.55);
  backdrop-filter: blur(2px);
}
.partner-email-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.9375rem;
}
.partner-email-header h2 {
  margin: 0.25rem 0 1.125rem;
  font-size: var(--text-xl);
}
.partner-email-dialog .partner-grid-note,
.partner-email-dialog .partner-email-status {
  padding-left: 0;
  padding-right: 0;
}
.partner-email-dialog h3 {
  font-size: var(--text-md);
}
.partner-email-recipient {
  font-size: var(--text-sm);
  color: var(--muted);
  overflow-wrap: anywhere;
}
.partner-email-text {
  padding: 1rem;
  background: #faf8f7;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  white-space: pre-wrap;
  font-size: var(--text-sm);
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.partner-email-dialog > .primary-button {
  margin-top: 1rem;
}
@media (max-width: 600px) {
  .partner-grid > header {
    padding: 0.9375rem 0.875rem 0.625rem;
  }
  .partner-grid-note {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
  .partner-team-tabs {
    padding: 0 0.375rem;
  }
  .partner-team-tabs button {
    padding: 0.625rem;
  }
  .partner-team-summary {
    padding: 0.875rem;
  }
}

/* src/css/question_library/question_import.css */
.admin-import-panel {
  margin-top: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 4fr);
  align-items: stretch;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.admin-create-actions {
  min-width: 0;
  padding: 0.9375rem 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid var(--line);
}
.admin-create-actions button {
  max-width: 100%;
  white-space: normal;
}
.admin-json-import {
  min-width: 0;
  padding: 0.9375rem 1rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.625rem 1rem;
}
.admin-import-copy {
  min-width: 0;
  display: flex;
  align-items: center;
}
.admin-import-copy strong {
  color: #332e2b;
  font-size: var(--text-sm);
}
.admin-import-actions {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5625rem;
}
.admin-import-actions input[type=file] {
  width: 16rem;
  min-width: 12rem;
  max-width: 16rem;
  color: #5e5753;
  font: inherit;
  font-size: var(--text-xs);
}
.admin-import-actions input[type=file]::file-selector-button {
  min-height: 2.125rem;
  margin-right: 0.5625rem;
  padding: 0 0.6875rem;
  border: 1px solid #d6d0cc;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #403a37;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.admin-import-actions input[type=file]::file-selector-button:hover {
  border-color: #aaa39e;
}
.admin-import-actions .secondary-button {
  min-height: 2.25rem;
}
.admin-template-link {
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 800;
  text-underline-offset: 3px;
}
.admin-template-link:hover {
  color: var(--cgi-red);
}

/* src/css/question_library/question_filters.css */
.admin-filters {
  margin-top: 0.75rem;
  padding: 0.875rem;
  display: grid;
  grid-template-columns: minmax(15rem, 1fr) repeat(2, minmax(8.125rem, 10.625rem));
  gap: 0.75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
}
.admin-filters label,
.question-editor-grid label,
.question-explanation-field,
.question-reference-field {
  min-width: 0;
  display: grid;
  gap: 0.375rem;
}
.admin-filters label > span,
.question-editor-grid label > span,
.question-explanation-field > span,
.question-reference-field > span {
  color: #514b48;
  font-size: var(--text-xs);
  font-weight: 800;
}
.question-reference-field > span small {
  color: var(--muted);
  font-size: inherit;
  font-weight: 500;
}
.admin-filters input,
.admin-filters select,
.question-editor-grid input,
.question-editor-grid select,
.question-editor-grid textarea,
.answer-editor textarea,
.question-explanation-field textarea,
.question-reference-field input {
  width: 100%;
  min-height: 2.625rem;
  padding: 0.5625rem 0.6875rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: inherit;
  line-height: 1.4;
}
.admin-filters input:focus,
.admin-filters select:focus,
.question-editor-form input:focus,
.question-editor-form select:focus,
.question-editor-form textarea:focus {
  border-color: var(--cgi-red);
  outline: 2px solid var(--focus-ring);
}
.admin-list-heading {
  margin: 1.25rem 0 0.625rem;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1.25rem;
}
.admin-list-heading h2 {
  margin: 0;
  font-size: var(--text-lg);
  font-weight: 800;
}
.admin-list-heading span {
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/question_library/question_pagination.css */
.admin-question-list {
  display: grid;
  gap: 0.5rem;
}
.admin-question-pagination {
  margin: 0.75rem 0 0;
  padding: 0.75rem 0.875rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--muted);
  font-size: var(--text-xs);
}
.admin-question-page-info {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem 0.75rem;
}
.admin-question-page-info > label {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  color: #514b48;
  font-weight: 800;
}
.admin-question-pagination select {
  min-height: 2.125rem;
  padding: 0.375rem 0.5625rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: inherit;
}
.admin-question-pagination select:focus {
  border-color: var(--cgi-red);
  outline: 2px solid var(--focus-ring);
}
.admin-question-page-range {
  min-width: 0;
  overflow-wrap: anywhere;
}
.admin-question-page-navigation {
  grid-column: 2;
  min-width: 0;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}
.admin-question-page-blocks {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: var(--ink);
}
.admin-question-page-navigation .secondary-button {
  min-width: 2.25rem;
  min-height: 2.25rem;
  padding: 0.375rem 0.5rem;
  font-variant-numeric: tabular-nums;
}
.admin-question-page-button[aria-current=page],
.admin-question-page-button[aria-current=page]:hover {
  border-color: var(--cgi-purple);
  background: var(--cgi-purple);
  color: #fff;
}
.admin-question-page-navigation button:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.admin-question-page-gap {
  padding: 0 0.125rem;
}
.admin-question-page-direction-icon {
  display: none;
}
@media (max-width: 1100px) {
  .admin-question-pagination {
    grid-template-columns: minmax(0, 1fr);
  }
  .admin-question-page-navigation {
    grid-column: 1;
  }
}
@media (max-width: 600px) {
  .admin-question-pagination {
    padding: 0.625rem 0.5rem;
  }
  .admin-question-page-direction-text {
    display: none;
  }
  .admin-question-page-direction-icon {
    display: inline;
  }
}

/* src/css/question_library/question_library_cards.css */
.admin-question-card {
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "head actions" "main actions" "details details";
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.admin-question-card > header {
  grid-area: head;
}
.admin-question-card > .admin-question-main {
  grid-area: main;
}

/* src/css/teams/team_photos.css */
.team-photo-editor {
  margin: 0 1.125rem 1.125rem;
  padding-top: 0.875rem;
  border-top: 1px solid var(--line);
  min-width: 0;
}
.team-photo-title {
  display: block;
  margin-bottom: 0.625rem;
  color: #49413d;
  font-size: var(--text-sm);
}
.team-photo-row {
  display: grid;
  grid-template-columns: 4.25rem minmax(0, 1fr);
  gap: 0.875rem;
  align-items: start;
}
.team-photo-preview {
  width: 4.25rem;
  height: 4.25rem;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid #d7c9e2;
  border-radius: 50%;
  background: #f3edf8;
  color: var(--cgi-purple);
  font-size: var(--text-lg);
  font-weight: 800;
}
.team-photo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.team-photo-picker {
  min-width: 0;
  display: grid;
  gap: 0.5rem;
}
.team-photo-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem 0.625rem;
}
.team-photo-actions button {
  max-width: 100%;
  white-space: normal;
  text-align: left;
}
.team-photo-override {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  color: #49413d;
  font-size: var(--text-xs);
  line-height: 1.45;
  cursor: pointer;
}
.team-photo-override input {
  order: -1;
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  margin: 0.125rem 0 0;
  accent-color: var(--cgi-purple);
}
.team-photo-hint,
.team-photo-formats,
.team-photo-crop-guidance {
  display: block;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.team-photo-formats {
  margin-top: 0.625rem;
}
.team-photo-loading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.75rem;
  color: var(--muted);
  font-size: var(--text-xs);
}
.team-photo-crop {
  padding: 0.875rem;
}
.team-photo-crop-title {
  display: block;
  margin-bottom: 0.3125rem;
  font-size: var(--text-sm);
}
.team-photo-crop .profile-crop-canvas {
  width: min(100%, 15rem);
}
.team-photo-crop .profile-crop-actions {
  flex-wrap: wrap;
}
.team-photo-crop .profile-crop-controls {
  grid-template-columns: minmax(0, 1fr);
  gap: 0.625rem;
}
.team-photo-editor button:focus-visible,
.team-photo-override input:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
@media (max-width: 390px) {
  .team-photo-row {
    grid-template-columns: 3.25rem minmax(0, 1fr);
    gap: 0.625rem;
  }
  .team-photo-preview {
    width: 3.25rem;
    height: 3.25rem;
  }
  .team-photo-editor {
    margin-inline: 0.75rem;
  }
}

/* src/css/question_library/question_card_details.css */
.admin-question-card > .admin-question-details {
  grid-area: details;
}
.admin-question-card > .admin-question-actions {
  grid-area: actions;
}
.admin-question-card.offline {
  border-color: #d7d2cf;
  background: #f3f1ef;
  box-shadow: none;
}
.admin-question-card.offline .admin-question-meta,
.admin-question-card.offline .admin-question-id,
.admin-question-card.offline .admin-question-main,
.admin-question-card.offline .admin-question-details {
  opacity: 0.58;
}
.admin-question-card > header {
  padding: 0.875rem 1rem 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
}
.admin-question-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}
.admin-question-meta span {
  padding: 0.25rem 0.4375rem;
  border-radius: 999px;
  background: var(--soft);
  color: #655e5a;
  font-size: var(--text-xs);
  font-weight: 800;
}
.admin-question-meta .modified {
  background: #fff0d5;
  color: #7d5200;
}
.admin-question-meta .custom {
  background: #eaf4ef;
  color: var(--success);
}
.admin-question-header-tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.admin-question-id {
  flex: 0 0 auto;
  color: var(--muted);
  font-family: Consolas, monospace;
  font-size: var(--text-xs);
}
.admin-question-delete {
  width: 1.6875rem;
  height: 1.6875rem;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: var(--text-lg);
  line-height: 1;
  cursor: pointer;
}
.admin-question-delete:hover {
  border-color: #efc2c9;
  background: #fff1f3;
  color: var(--cgi-red-dark);
}
.admin-question-delete:focus-visible {
  border-color: var(--cgi-red);
  outline: 2px solid var(--focus-ring);
}
.admin-question-delete:disabled {
  cursor: wait;
  opacity: 0.6;
}
.admin-question-main {
  padding: 0.6875rem 1rem 0.9375rem;
}
.admin-question-main h3 {
  margin: 0;
  color: #332e2b;
  font-size: var(--text-md);
  line-height: 1.45;
}
.admin-question-card.offline h3 {
  color: #746e6a;
}
.admin-correct-answer {
  margin: 0.5625rem 0 0;
  padding: 0.5rem 0.625rem;
  border-left: 3px solid var(--success);
  border-radius: var(--radius-sm);
  background: #f1f8f4;
  color: #3d4e44;
  font-size: var(--text-sm);
  line-height: 1.45;
}
.admin-correct-answer strong {
  margin-right: 0.3125rem;
  color: var(--success);
}
.admin-question-details {
  border-top: 1px solid #eeeae7;
}
.admin-question-details summary {
  padding: 0.625rem 1rem;
  color: #625b57;
  font-size: var(--text-xs);
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}
.admin-question-details summary::-webkit-details-marker {
  display: none;
}
.admin-question-details summary::before {
  margin-right: 0.4375rem;
  color: var(--cgi-red-dark);
  content: "+";
}
.admin-question-details[open] summary::before {
  content: "−";
}
.admin-question-detail-body {
  padding: 0 1rem 0.9375rem;
}
.admin-answer-list {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.375rem;
  list-style: none;
}
.admin-answer-list li {
  padding: 0.5rem 0.625rem;
  display: grid;
  grid-template-columns: 1.4375rem 1fr;
  gap: 0.5rem;
  border: 1px solid #ece7e4;
  border-radius: var(--radius-sm);
  color: #5a534f;
  font-size: var(--text-xs);
  line-height: 1.4;
}
.admin-answer-list li.correct {
  border-color: #b9d8c7;
  background: #f1f8f4;
  color: #35483e;
}
.admin-answer-list b {
  color: var(--cgi-red-dark);
}
.admin-explanation {
  margin: 0.625rem 0 0;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.55;
}
.admin-question-detail-body .question-resource-content {
  margin-top: 0.75rem;
  grid-template-columns: minmax(0, 16.25rem) auto;
  align-items: end;
}

/* src/css/question_library/question_card_actions.css */
.admin-question-actions {
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}
.admin-question-actions button {
  min-height: 2.125rem;
  padding: 0 0.6875rem;
  font-size: var(--text-xs);
}
.admin-question-actions .admin-preview-button {
  min-width: 4.75rem;
}
.admin-status-toggle {
  min-height: 2.125rem;
  padding: 0 0.625rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid #d6d0cc;
  border-radius: var(--radius-sm);
  background: #fff;
  color: #5d5652;
  font-size: var(--text-xs);
  font-weight: 800;
  cursor: pointer;
  user-select: none;
}
.admin-status-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}
.admin-status-toggle-track {
  width: 2rem;
  height: 1.125rem;
  padding: 2px;
  display: block;
  border-radius: 999px;
  background: #aaa4a0;
  transition: background 0.16s ease;
}
.admin-status-toggle-track::after {
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(45, 35, 31, 0.25);
  content: "";
  transition: transform 0.16s ease;
}
.admin-status-toggle input:checked + .admin-status-toggle-track {
  background: var(--success);
}
.admin-status-toggle input:checked + .admin-status-toggle-track::after {
  transform: translateX(0.875rem);
}
.admin-status-toggle input:focus-visible + .admin-status-toggle-track {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
.admin-status-toggle:has(input:disabled) {
  cursor: wait;
  opacity: 0.65;
}
.admin-empty {
  margin: 0;
  padding: 3.125rem 1.25rem;
  border: 1px dashed #cfc8c4;
  border-radius: var(--radius-sm);
  color: var(--muted);
  text-align: center;
}

/* src/css/question_library/question_editor_fields.css */
.question-editor-dialog {
  width: min(48.75rem, calc(100% - 1.75rem));
  max-height: calc(100vh - 1.75rem);
  padding: 0;
  overflow-y: auto;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  box-shadow: var(--shadow-panel);
}
.question-editor-dialog::backdrop {
  background: rgba(35, 29, 27, 0.58);
  backdrop-filter: blur(2px);
}
.question-editor-form {
  padding: 1.625rem;
}
.question-editor-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
}
.question-editor-heading h2 {
  margin: 0.375rem 0 0;
  font-size: var(--text-xl);
}
.question-editor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.875rem;
}
.question-editor-shared {
  margin: 1.5rem 0 1.125rem;
}
.question-library-field {
  min-height: 4.25rem;
  padding: 0.6875rem 0.75rem;
  display: grid;
  align-content: center;
  gap: 0.3125rem;
  border: 1px solid #ded8d4;
  border-radius: var(--radius-sm);
  background: #f7f4f2;
}
.question-library-field > span {
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 800;
}
.question-library-field > strong {
  font-size: var(--text-sm);
}
.localized-question-editor {
  min-width: 0;
  margin: 0.875rem 0 0;
  padding: 1rem;
  border: 1px solid #e3ddda;
  border-radius: var(--radius-sm);
  background: #fcfbfa;
}
.localized-question-editor > legend {
  padding: 0 0.4375rem;
  color: var(--ink);
  font-weight: 800;
}
.localized-language-flag {
  width: 1.5rem;
  height: 1rem;
  margin-right: 3px;
  object-fit: cover;
  vertical-align: -3px;
  border: 1px solid rgba(45, 35, 31, 0.22);
  border-radius: var(--radius-sm);
}
.question-editor-grid .wide-field {
  grid-column: 1 / -1;
}
.question-editor-grid textarea,
.answer-editor textarea,
.question-explanation-field textarea {
  resize: vertical;
}
.question-editor-grid small {
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/question_library/question_answer_editor.css */
.answer-editor {
  min-width: 0;
  margin: 1.25rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.5625rem;
  border: 0;
}
.answer-editor legend {
  margin-bottom: 0.5625rem;
  color: #514b48;
  font-size: var(--text-sm);
  font-weight: 800;
}
.answer-editor legend span {
  color: var(--muted);
  font-weight: 400;
}
.answer-editor-row {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: 0.5625rem;
  align-items: center;
}
.answer-editor-row > input {
  width: 1.3125rem;
  height: 1.3125rem;
  margin: 0 auto;
  accent-color: var(--cgi-red);
}
.answer-editor-row label {
  min-width: 0;
  position: relative;
  display: block;
}
.answer-editor-row label > span {
  position: absolute;
  top: 0.625rem;
  left: 0.6875rem;
  z-index: 1;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 900;
}
.answer-editor-row textarea {
  padding-left: 2.125rem;
}
.answer-editor-row:has(> input:checked) textarea {
  border-color: #92bea5;
  background: #f3faf6;
}
.answer-editor-row.translation-answer > span {
  text-align: center;
  color: var(--cgi-red-dark);
  font-size: var(--text-xs);
  font-weight: 900;
}
.answer-editor-row.translation-answer textarea {
  width: 100%;
  min-width: 0;
  padding-left: 0.6875rem;
  grid-column: 2;
}
.question-explanation-field {
  margin-top: 1.25rem;
}
.question-reference-field {
  margin-top: 0.875rem;
}

/* src/css/question_library/question_illustration_editor.css */
.question-illustration-editor {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid #e3ddda;
  border-radius: var(--radius-sm);
  background: #fcfbfa;
}
.question-illustration-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.125rem;
}
.question-illustration-heading > div:first-child {
  min-width: 0;
}
.question-illustration-heading strong,
.question-illustration-heading small {
  display: block;
}
.question-illustration-heading strong {
  font-size: var(--text-sm);
}
.question-illustration-heading strong span {
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 500;
}
.question-illustration-heading small {
  max-width: 31.25rem;
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.45;
}
.question-illustration-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.question-illustration-actions .text-button {
  min-height: 2.125rem;
  font-size: var(--text-xs);
}
.question-illustration-preview {
  width: min(100%, 40rem);
  margin: 0.875rem auto 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.question-illustration-preview img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  display: block;
  object-fit: contain;
}
.question-illustration-status {
  margin: 0.75rem 0 0;
  padding: 0.625rem 0.75rem;
  border-radius: var(--radius-sm);
  background: var(--soft);
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.45;
}
.question-illustration-status.error {
  background: #fff1f3;
  color: var(--cgi-red-dark);
}
.question-crop-editor {
  margin-top: 0.875rem;
  padding-top: 0.875rem;
  border-top: 1px solid #e5dfdb;
}
.question-crop-canvas {
  width: min(100%, 40rem);
  height: auto;
  margin: 0.875rem auto 0;
  display: block;
  border-radius: var(--radius-sm);
  background: #ece8e5;
  box-shadow: inset 0 0 0 1px rgba(45, 35, 31, 0.14);
  cursor: grab;
  touch-action: none;
}
.question-crop-canvas.dragging {
  cursor: grabbing;
}
.question-crop-canvas:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}

/* src/css/question_library/question_editor_actions.css */
.question-editor-actions {
  margin-top: 1.5rem;
  padding: 1.125rem 0 0;
  display: flex;
  justify-content: flex-end;
  gap: 0.5625rem;
  border-top: 1px solid #eeeae7;
  background: transparent;
}

/* src/css/profile/profile_dialog.css */
.profile-dialog {
  width: min(38.75rem, calc(100% - 1.75rem));
  max-height: calc(100vh - 1.75rem);
  padding: 0;
  overflow-y: auto;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  box-shadow: var(--shadow-panel);
}
.profile-dialog::backdrop {
  background: rgba(35, 29, 27, 0.52);
  backdrop-filter: blur(2px);
}

/* src/css/profile/profile_photo.css */
.profile-form {
  padding: 1.625rem;
}
.profile-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
}
.profile-heading h2 {
  margin: 0.375rem 0 0;
  font-size: var(--text-xl);
}
.profile-close {
  width: 2.125rem;
  height: 2.125rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--soft);
  color: #5d5652;
  font-size: var(--text-lg);
  line-height: 1;
}
.profile-onboarding-note {
  margin: 1.25rem 0 0;
  padding: 0.75rem 0.875rem;
  border-left: 3px solid var(--cgi-red);
  border-radius: var(--radius-sm);
  background: #fff5f6;
  color: #5c5551;
  font-size: var(--text-sm);
  line-height: 1.55;
}
.profile-required-marker {
  color: var(--cgi-red);
}
.profile-photo-editor {
  margin-top: 1.5rem;
  padding: 1rem;
  display: grid;
  grid-template-columns: 4.875rem 1fr;
  gap: 1rem;
  align-items: center;
  border-radius: var(--radius-sm);
  background: var(--soft);
}
.profile-photo-editor img,
.profile-photo-fallback {
  width: 4.875rem;
  height: 4.875rem;
  display: grid;
  place-items: center;
  object-fit: cover;
  border: 1px solid #d8d0cc;
  border-radius: 50%;
  background: #f5e8eb;
  color: var(--cgi-red-dark);
  font-weight: 800;
}
.profile-photo-editor > div {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.profile-photo-editor small {
  width: 100%;
  color: var(--muted);
  line-height: 1.4;
}
.profile-remove-photo {
  min-height: 2.125rem;
  font-size: var(--text-xs);
}
.profile-photo-status {
  margin: 0.75rem 0 0;
  padding: 0.625rem 0.75rem;
  border-radius: var(--radius-sm);
  background: var(--soft);
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.45;
}
.profile-photo-status.error {
  background: #fff1f3;
  color: var(--cgi-red-dark);
}
.profile-crop-editor {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid #e2dcda;
  border-radius: var(--radius-sm);
  background: #fbfaf9;
}
.profile-crop-heading strong,
.profile-crop-heading small {
  display: block;
}
.profile-crop-heading strong {
  font-size: var(--text-sm);
}
.profile-crop-heading small {
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.45;
}
.profile-crop-canvas {
  width: min(100%, 20rem);
  height: auto;
  margin: 0.875rem auto 0;
  display: block;
  border-radius: var(--radius-sm);
  background: #ece8e5;
  box-shadow: inset 0 0 0 1px rgba(45, 35, 31, 0.14);
  cursor: grab;
  touch-action: none;
}
.profile-crop-canvas.dragging {
  cursor: grabbing;
}
.profile-crop-canvas:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}
.profile-crop-controls {
  margin-top: 0.875rem;
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 0.75rem;
}
.profile-crop-controls label {
  min-width: 0;
  display: grid;
  gap: 0.3125rem;
  color: #5c5551;
  font-size: var(--text-xs);
  font-weight: 700;
}
.profile-crop-controls input {
  width: 100%;
  accent-color: var(--cgi-red);
}
.profile-crop-actions {
  margin-top: 0.9375rem;
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* src/css/profile/profile_language.css */
.profile-field {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.4375rem;
}
.profile-field > span {
  color: #504a47;
  font-size: var(--text-xs);
  font-weight: 800;
}
.profile-field select {
  width: 100%;
  min-height: 2.75rem;
  padding: 0 0.75rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
}
.language-picker {
  min-width: 0;
}
.language-picker-button {
  width: 100%;
  min-height: 2.75rem;
  padding: 0 0.8125rem 0 0.9375rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.875rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  text-align: left;
}
.language-picker-button:hover,
.language-picker-button.open {
  border-color: #aaa39e;
}
.language-picker-button:focus-visible,
.language-picker-menu button:focus-visible {
  border-color: var(--cgi-red);
  outline: 2px solid var(--focus-ring);
  outline-offset: 1px;
}
.language-picker-button.placeholder {
  color: var(--muted);
  font-weight: 400;
}
.language-picker-value {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 700;
}
.language-picker-value img,
.language-picker-menu img {
  width: 1.6875rem;
  height: 1.125rem;
  flex: 0 0 1.6875rem;
  object-fit: cover;
  border: 1px solid rgba(45, 35, 31, 0.22);
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 3px rgba(45, 35, 31, 0.12);
}
.language-picker-chevron {
  width: 0.875rem;
  height: 0.5625rem;
  flex: 0 0 0.875rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  transition: transform 0.15s ease;
}
.language-picker-button.open .language-picker-chevron {
  transform: rotate(180deg);
}
.language-picker-menu {
  margin-top: 0.3125rem;
  display: grid;
  overflow: hidden;
  border: 1px solid #cfc9c5;
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: var(--shadow-panel);
}
.language-picker-menu button {
  min-height: 2.75rem;
  padding: 0 0.875rem;
  display: grid;
  grid-template-columns: 1.6875rem minmax(0, 1fr) 1.125rem;
  align-items: center;
  gap: 0.75rem;
  border: 0;
  background: #fff;
  color: var(--ink);
  text-align: left;
}
.language-picker-menu button + button {
  border-top: 1px solid #eeeae7;
}
.language-picker-menu button:hover,
.language-picker-menu button:focus-visible {
  background: var(--soft);
}
.language-picker-menu button[aria-checked=true] {
  background: #fff4f6;
  color: var(--cgi-red-dark);
  font-weight: 800;
}
.language-picker-check {
  color: var(--cgi-red-dark);
  font-weight: 900;
  opacity: 0;
}
.language-picker-menu button[aria-checked=true] .language-picker-check {
  opacity: 1;
}

/* src/css/profile/profile_actions.css */
.profile-email-choice {
  min-height: 1.5rem;
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: var(--text-sm);
  font-weight: 400;
  cursor: pointer;
}
.profile-email-choice input {
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  margin: 0;
  accent-color: var(--cgi-red);
}
.profile-actions {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5625rem;
}
.profile-actions #replayIntroButton {
  margin-right: auto;
}

/* src/css/streak/streak_reminder.css */
.streak-nudge-dialog {
  width: min(33.75rem, calc(100% - 1.75rem));
  padding: 0;
  border: 0;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  box-shadow: var(--shadow-panel);
}
.streak-nudge-dialog::backdrop {
  background: rgba(35, 29, 27, 0.52);
  backdrop-filter: blur(2px);
}
.streak-nudge-content {
  padding: 1.875rem;
}
.streak-nudge-content h2 {
  margin: 0.4375rem 0 0.875rem;
  font-size: var(--text-xl);
}
.streak-nudge-content > p:not(.eyebrow) {
  margin: 0 0 0.6875rem;
  color: var(--muted);
  line-height: 1.6;
}
.streak-nudge-actions {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5625rem;
}

/* src/css/rank/rank_promotion.css */
.rank-promotion-toast {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  max-width: 100%;
  padding: 0.9375rem;
  border: 1px solid #b7a3d2;
  border-radius: var(--radius-sm);
  background: #f8f4ff;
  color: #422763;
  box-shadow: var(--shadow-panel);
  pointer-events: auto;
}
.rank-promotion-artwork {
  flex: 0 0 3.25rem;
  border-radius: 50%;
}
.rank-promotion-message {
  display: grid;
  gap: 0.25rem;
  font-size: var(--text-sm);
  line-height: 1.45;
}
.rank-promotion-message strong {
  font-size: var(--text-md);
}
.rank-promotion-dismiss {
  flex: 0 0 1.75rem;
  width: 1.75rem;
  height: 1.75rem;
  align-self: flex-start;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  font-size: var(--text-lg);
}
.rank-promotion-dismiss:hover {
  background: #e9dff5;
}
.rank-promotion-dismiss:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* src/css/foundation/foundation_footer.css */
footer {
  min-height: 3.125rem;
  padding: 0.75rem clamp(1.25rem, 5vw, 4.5rem);
  display: flex;
  align-items: center;
  gap: 1.25rem;
  border-top: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  font-size: var(--text-xs);
}

/* src/css/responsive/responsive_tablet.css */
@media (max-width: 1220px) and (min-width: 981px) {
  .level-challenge-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 980px) {
  .admin-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .admin-search {
    grid-column: 1 / -1;
  }
  .path-grid {
    grid-template-columns: 1fr;
  }
  .path-card {
    min-height: 0;
  }
  .level-challenge-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .assessment-launch-card {
    grid-template-columns: minmax(0, 1fr);
  }
  .assessment-actions {
    grid-column: 1 / -1;
  }
  .quiz-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  .quiz-sidebar {
    position: static;
  }
  .question-map > div {
    grid-template-columns: repeat(10, 1fr);
  }
}
@media (max-width: 1220px) {
  .topbar {
    padding-right: 1.25rem;
    padding-left: 1.25rem;
    gap: 0.875rem;
  }
  .account {
    gap: 0.5rem;
  }
  .profile-trigger strong {
    max-width: 6.875rem;
  }
  .profile-trigger .account-copy {
    max-width: 6.875rem;
  }
}
@media (min-width: 701px) and (max-width: 1060px) {
  .topbar {
    min-height: 5.625rem;
  }
  .profile-trigger .account-copy {
    display: none;
  }
  .brand-label strong {
    white-space: nowrap;
  }
  .brand {
    gap: 0.4375rem;
  }
  .brand-logo {
    width: 3.875rem;
    height: 2.5rem;
  }
  .brand-divider {
    height: 2.5rem;
  }
  .academy-brand-logo {
    width: 4.875rem;
    height: 4.875rem;
  }
  .main-navigation button {
    padding: 0 0.5rem;
  }
  .account .secondary-button.compact {
    max-width: 5.5rem;
    padding: 0 0.5rem;
    font-size: var(--text-xs);
  }
  .skill-rank-illustration {
    width: 2rem;
    height: 2rem;
  }
}
@media (min-width: 761px) and (max-width: 900px) {
  .brand-label {
    display: none;
  }
  .arena-brand-copy .brand-title {
    display: none;
  }
}
@media (min-width: 701px) and (max-width: 760px) {
  .topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "brand account" "navigation navigation";
    row-gap: 0.25rem;
    padding-top: 0.375rem;
    padding-bottom: 0.5rem;
  }
  .brand-area {
    grid-area: brand;
  }
  .brand-label {
    display: none;
  }
  .account {
    grid-area: account;
    justify-self: end;
  }
  .arena-navigation {
    grid-area: navigation;
    justify-self: center;
  }
}

/* src/css/responsive/responsive_phone_header.css */
@media (max-width: 700px) {
  .topbar {
    min-height: 5.125rem;
    padding: 0.5rem 0.875rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "brand account" "navigation navigation";
    gap: 0.5rem 0.625rem;
  }
  .brand-area {
    grid-area: brand;
  }
  .account {
    grid-area: account;
    justify-self: end;
  }
  .account {
    gap: 0.3125rem;
  }
  .admin-trigger {
    width: 2.125rem;
    height: 2.125rem;
    flex-basis: 2.125rem;
    padding: 0.4375rem;
  }
  .account .secondary-button.compact {
    width: 2.75rem;
    min-height: 2.75rem;
    padding: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    font-size: 0;
  }
  .account .secondary-button.compact::after {
    content: "";
    width: 1.125rem;
    height: 1.125rem;
    background: currentColor;
    -webkit-mask: var(--icon-sign-out) center / contain no-repeat;
    mask: var(--icon-sign-out) center / contain no-repeat;
  }
  .brand {
    gap: 0.375rem;
  }
  .brand-logo {
    width: 3.25rem;
    height: 2.125rem;
  }
  .brand-divider {
    height: 2.375rem;
  }
  .academy-brand-logo {
    width: 4.5rem;
    height: 4.5rem;
  }
  .skill-rank-illustration {
    width: 2rem;
    height: 2rem;
  }
  .brand-label,
  .profile-trigger .account-copy {
    display: none;
  }
  .arena-navigation {
    grid-area: navigation;
    width: 100%;
    margin-left: 0;
    gap: 0.5rem;
  }
  .main-navigation {
    min-width: 0;
    width: auto;
    flex: 1;
  }
  .main-navigation button {
    flex: 1;
    min-height: 2.75rem;
    padding: 0 0.5rem;
  }
  .meeting-header-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.75rem;
    padding-block: 0;
  }
}

/* src/css/responsive/responsive_phone_learning.css */
@media (max-width: 700px) {
  .path-section {
    padding-top: 1.5rem;
  }
  .streak-launch {
    align-items: stretch;
    flex-direction: column;
    gap: 0.75rem;
  }
  .streak-launch::after {
    right: -1.25rem;
    bottom: -1.75rem;
  }
  .streak-launch button {
    width: 100%;
  }
  .streak-run-summary {
    align-items: stretch;
    flex-direction: column;
    gap: 0.375rem;
  }
  .streak-run-summary > div {
    justify-content: space-between;
  }
  .team-progress-panel > header {
    padding: 0.75rem 0.875rem;
  }
  .section-heading {
    align-items: start;
    flex-direction: column;
    gap: 0.75rem;
  }
  .quiz-header {
    grid-template-columns: 1fr auto;
  }
  .quiz-identity {
    grid-row: 2;
    grid-column: 1 / -1;
  }
  .quiz-timer {
    grid-column: 2;
  }
  .question-map > div {
    grid-template-columns: repeat(6, 1fr);
  }
  .question-card {
    padding: 1.5rem 1.125rem;
  }
  .question-actions {
    flex-wrap: wrap;
  }
  .question-actions > span {
    width: 100%;
    order: -1;
    text-align: center;
  }
  .question-actions button {
    flex: 1;
  }
  .result-hero {
    grid-template-columns: 1fr;
  }
  .score-ring {
    margin: 0 auto;
  }
  .result-actions > button {
    width: 100%;
  }
  .review-item summary {
    grid-template-columns: 2.0625rem 1fr;
  }
  .review-item summary small {
    grid-column: 2;
  }
  .review-body {
    padding-left: 1.25rem;
  }
  .prf-heading {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* src/css/responsive/responsive_phone_admin.css */
@media (max-width: 700px) {
  .admin-roster > div {
    grid-template-columns: 1fr;
  }
  .admin-roster-entry:nth-child(odd) {
    border-right: 0;
  }
  .admin-import-panel {
    grid-template-columns: 1fr;
  }
  .admin-create-actions {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .admin-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .admin-search {
    grid-column: 1 / -1;
  }
  .admin-question-card > header {
    flex-direction: column;
    gap: 0.5rem;
  }
  .admin-question-actions {
    flex-wrap: wrap;
  }
  .admin-question-actions button {
    flex: 1;
  }
  .admin-question-actions .admin-status-toggle {
    flex: 1;
    justify-content: center;
  }
  .admin-question-detail-body .question-resource-content {
    grid-template-columns: 1fr;
  }
  .question-editor-form {
    padding: 1.3125rem 1.125rem;
  }
  .question-editor-grid {
    grid-template-columns: 1fr;
  }
  .question-editor-grid .wide-field {
    grid-column: auto;
  }
  .question-editor-actions button {
    flex: 1;
  }
  .question-preview-topbar {
    min-height: 4.25rem;
    display: flex;
    grid-template-columns: none;
  }
  .question-preview-window-actions {
    margin-left: auto;
  }
  .question-preview-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.75rem;
  }
  .question-illustration-heading {
    flex-direction: column;
  }
  .question-illustration-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

/* src/css/responsive/responsive_phone_profile.css */
@media (max-width: 700px) {
  .profile-form {
    padding: 1.3125rem 1.125rem;
  }
  .profile-photo-editor {
    grid-template-columns: 4rem 1fr;
  }
  .profile-photo-editor img,
  .profile-photo-fallback {
    width: 4rem;
    height: 4rem;
  }
  .profile-crop-controls {
    grid-template-columns: 1fr;
  }
  .streak-nudge-actions {
    flex-direction: column-reverse;
  }
  .streak-nudge-actions button {
    width: 100%;
  }
  footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* src/css/responsive/responsive_small_screens.css */
@media (max-width: 760px) {
  .prf-help-panel {
    position: fixed;
    top: var(--prf-help-top, 8.75rem);
    right: 1.125rem;
    left: 1.125rem;
    width: auto;
    max-height: calc(100dvh - var(--prf-help-top, 8.75rem) - 1.125rem);
  }
}
@media (max-width: 520px) {
  .brand-logo {
    width: 3rem;
    height: 1.9375rem;
  }
  .academy-brand-logo {
    width: 4rem;
    height: 4rem;
  }
  .rank-list > li {
    grid-template-columns: minmax(0, 1fr);
  }
  .rank-list-label {
    padding: 0.75rem 0.9375rem 0.25rem;
  }
  .rank-list-description {
    padding: 0.25rem 0.9375rem 0.9375rem;
  }
  .rank-row-label {
    align-items: center;
    flex-direction: row;
  }
  .topbar {
    min-height: 6.25rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "brand account" "navigation navigation";
    row-gap: 0.4375rem;
  }
  .brand-area {
    grid-area: brand;
  }
  .account {
    grid-area: account;
    justify-self: end;
  }
  .arena-navigation {
    grid-area: navigation;
    justify-self: center;
  }
  .path-section {
    padding-right: 0.875rem;
    padding-left: 0.875rem;
  }
  .path-card {
    padding-right: 1rem;
    padding-left: 1rem;
  }
  .level-challenge-grid {
    grid-template-columns: 1fr;
  }
  .assessment-launch-card {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .assessment-actions {
    grid-column: auto;
    width: 100%;
  }
  .assessment-rules {
    display: inline-block;
    text-align: left;
  }
  .track-actions {
    grid-template-columns: 1fr;
  }
  .admin-section-bar {
    align-items: stretch;
  }
  .admin-tabs {
    width: auto;
    flex: 1 1 13.75rem;
  }
  .admin-tabs button {
    flex: 1;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
  }
  .admin-import-actions {
    width: 100%;
    align-items: center;
    flex-direction: column;
  }
  .admin-import-actions input[type=file] {
    width: 100%;
    max-width: none;
  }
  .admin-import-actions .secondary-button,
  .admin-import-actions .primary-button {
    width: 100%;
  }
  .admin-filters {
    grid-template-columns: 1fr;
  }
  .admin-search {
    grid-column: auto;
  }
  .question-preview-topbar {
    min-height: 7rem;
    flex-wrap: wrap;
  }
  .question-preview-window-actions {
    width: 100%;
    margin: 0;
    justify-content: space-between;
  }
  .question-preview-page {
    padding-top: 1.625rem;
  }
  .question-preview-card {
    padding: 1.375rem 1rem;
  }
}
@media (max-width: 360px) {
  .brand-logo {
    width: 2.75rem;
    height: 1.8125rem;
  }
  .academy-brand-logo {
    width: 3.5rem;
    height: 3.5rem;
  }
  .skill-rank-illustration {
    display: none;
  }
  .arena-navigation:has(.meeting-header-link:not([hidden])) .main-navigation {
    gap: 1px;
  }
  .arena-navigation:has(.meeting-header-link:not([hidden])) .main-navigation button {
    padding-inline: 0.3125rem;
  }
}

/* src/css/responsive/responsive_header.css */
@media (min-width: 761px) and (max-width: 1540px) {
  .arena-brand-copy {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: center;
    gap: 3px 0.5rem;
  }
  .arena-brand-copy .release-label {
    grid-column: 1 / -1;
  }
}
@media (min-width: 761px) and (max-width: 1060px) {
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "brand account" "navigation navigation";
    gap: 0.25rem 0.875rem;
    padding-top: 0.375rem;
    padding-bottom: 0.5rem;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-area {
    grid-area: brand;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .account {
    grid-area: account;
    justify-self: end;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .arena-navigation {
    grid-area: navigation;
    justify-self: center;
    margin-left: 0;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-title,
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-label {
    display: flex;
  }
}
@media (max-width: 760px) {
  .arena-brand-copy .brand-title:has(.brand-label) {
    display: none;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "brand account" "release release" "navigation navigation";
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-area,
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .arena-brand {
    display: contents;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-identity {
    grid-area: brand;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .arena-brand-copy {
    grid-area: release;
    display: flex;
    align-items: baseline;
    gap: 0.25rem 0.5rem;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-title,
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .brand-label {
    display: flex;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])) .maintenance-badge {
    grid-column: 1 / -1;
    grid-row: 3;
    margin: 0;
    justify-self: start;
  }
  #arenaTopbar:has(.release-label:not([hidden]), .dev-pill:not([hidden])):has(.maintenance-badge:not([hidden])) {
    grid-template-areas: "brand account" "release release" "maintenance maintenance" "navigation navigation";
  }
}
@media (max-width: 420px) {
  #arenaTopbar:has(.release-label:not([hidden])) .arena-brand-copy {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: center;
    gap: 0.1875rem 0.5rem;
  }
  #arenaTopbar:has(.release-label:not([hidden])) .release-label {
    grid-column: 1 / -1;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* src/css/foundation/foundation_alpha_version.css */
.brand-identity {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.625rem;
}
.alpha-version-badge {
  flex: 0 0 auto;
  pointer-events: none;
}
.alpha-version-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.3125rem 0.75rem;
  border: 1px solid #e5bd4b;
  border-radius: 999px;
  background: #ffeb99;
  color: #624900;
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}
@media (max-width: 450px) {
  #arenaTopbar:has(.account:not([hidden])) .alpha-version-badge {
    display: none;
  }
}

/* src/css/app/app.css */

/* src/css/site_intro/site_intro_dialog.css */
.site-intro-dialog {
  --intro-purple: var(--cgi-purple, #3b0b5a);
  width: min(46rem, calc(100% - 2rem));
  max-height: calc(100vh - 2rem);
  max-height: calc(100dvh - 2rem);
  padding: 0;
  overflow: hidden;
  border: 1px solid #e3dce8;
  border-radius: 1rem;
  background: #fff;
  color: var(--ink, #242424);
  box-shadow: 0 1.5rem 5rem rgba(32, 10, 49, 0.24);
}
.site-intro-dialog[open] {
  display: flex;
  flex-direction: column;
}
.site-intro-dialog::backdrop {
  background: rgba(29, 17, 36, 0.6);
  backdrop-filter: blur(4px);
}
.site-intro-header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #eee9f2;
}
.site-intro-label {
  margin-right: auto;
  color: var(--intro-purple);
  font-size: var(--text-xs, 0.8125rem);
  font-weight: 800;
}
.site-intro-step-count {
  color: #716479;
  font-size: var(--text-xs, 0.8125rem);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.site-intro-later {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f4f0f7;
  color: #594564;
}
.site-intro-later svg {
  width: 1.125rem;
  height: 1.125rem;
}
.site-intro-later:hover {
  background: #e8dfee;
  color: var(--intro-purple);
}
.site-intro-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1.75rem 2rem 1.5rem;
}
.site-intro-body:focus-visible {
  outline: 2px solid var(--intro-purple);
  outline-offset: -3px;
}
.site-intro-title {
  margin: 0;
  color: var(--intro-purple);
  font-size: clamp(1.65rem, 3.5vw, 2.2rem);
  line-height: 1.16;
  letter-spacing: -0.035em;
  font-weight: 800;
}
.site-intro-title:focus {
  outline: none;
}
.site-intro-description {
  margin: 0.625rem 0 0;
  color: #65596c;
  font-size: var(--text-md, 1rem);
  line-height: 1.5;
}
.site-intro-illustration {
  margin: 1.5rem 0 1.25rem;
}

/* src/css/site_intro/site_intro_previews.css */
.site-intro-welcome-video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border-radius: 0.75rem;
  background: #160d20;
}
.site-intro-preview-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 0.875rem;
}
.site-intro-preview {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.875rem;
  margin: 0;
  padding: 1rem;
  overflow: hidden;
  border: 1px solid #e4dce9;
  border-radius: 0.75rem;
  background: #faf8fc;
}
.site-intro-preview-heading {
  width: 100%;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  color: var(--intro-purple);
  font-size: var(--text-sm, 0.875rem);
}
.site-intro-example {
  color: #716178;
  font-size: var(--text-xs, 0.8125rem);
  font-weight: 400;
}
.site-intro-preview-caption {
  width: 100%;
  margin: -0.375rem 0 0;
  color: #6a5c72;
  font-size: var(--text-xs, 0.8125rem);
  line-height: 1.5;
}
.site-intro-preview-image {
  display: block;
  width: 100%;
  max-width: 35.1875rem;
}
.site-intro-preview-image img {
  display: block;
  width: 100%;
  height: auto;
}
.site-intro-preview-image.is-control {
  max-width: 100%;
}
.site-intro-preview-image.is-assessment {
  width: 18.375rem;
}
.site-intro-preview-image.is-assessment-goal {
  width: 15.0625rem;
}
html[lang=de] .site-intro-preview-image.is-assessment-goal {
  width: 17.875rem;
}
.site-intro-preview-image.is-request {
  width: 11.5rem;
}
html[lang=de] .site-intro-preview-image.is-request {
  width: 12.9375rem;
}
.site-intro-assessment-preview {
  width: 100%;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 0.75rem;
  margin-block: auto;
}
.site-intro-detail {
  margin: 0;
  color: #3f3346;
  font-size: var(--text-sm, 0.875rem);
  line-height: 1.6;
}
.site-intro-note {
  margin: 0.5rem 0 0;
  color: #716178;
  font-size: var(--text-xs, 0.8125rem);
  line-height: 1.55;
}

/* src/css/site_intro/site_intro_controls.css */
.site-intro-footer {
  display: block;
  flex: 0 0 auto;
  padding: 0.875rem 1.5rem 1.25rem;
  border-top: 1px solid #eee9f2;
  background: #fff;
}
.site-intro-progress {
  display: flex;
  justify-content: center;
  gap: 0.375rem;
  margin: 0 0 1rem;
  padding: 0;
  list-style: none;
}
.site-intro-progress-step {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: #e6ddeb;
}
.site-intro-progress-step.is-visited {
  background: #b99dcc;
}
.site-intro-progress-step[aria-current=step] {
  width: 1.5rem;
  background: var(--intro-purple);
}
.site-intro-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
}
.site-intro-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 0 0 auto;
}
.site-intro-back,
.site-intro-next {
  min-height: 2.75rem;
  padding: 0.6875rem 1.125rem;
  border-radius: 0.5rem;
  font-size: var(--text-sm, 0.875rem);
  font-weight: 700;
  line-height: 1.25;
}
.site-intro-back {
  border: 1px solid #dfd5e6;
  background: #fff;
  color: #634a71;
}
.site-intro-back:hover {
  background: #f5f0f8;
}
.site-intro-next {
  border: 1px solid var(--intro-purple);
  background: var(--intro-purple);
  color: #fff;
}
.site-intro-next:hover {
  background: #57246f;
}
.site-intro-next:disabled {
  opacity: 1;
  border-color: #d7c9df;
  background: #e8dfee;
  color: #695474;
}
.site-intro-error {
  margin: 0 0 0.75rem;
  color: var(--cgi-red-dark, #b80f29);
  font-size: var(--text-sm, 0.875rem);
  line-height: 1.5;
}
.site-intro-dialog button:focus-visible {
  outline: 2px solid var(--intro-purple);
  outline-offset: 3px;
}

/* src/css/site_intro/site_intro_responsive.css */
@media (max-width: 700px) {
  .site-intro-preview-pair {
    grid-template-columns: 1fr;
  }
  .site-intro-preview-pair .site-intro-preview-image {
    max-width: 18.375rem;
  }
  .site-intro-assessment-preview {
    margin-block: 0;
  }
}
@media (max-width: 520px) {
  .site-intro-dialog {
    width: calc(100% - 1rem);
    max-height: calc(100vh - 1rem);
    max-height: calc(100dvh - 1rem);
    border-radius: 0.75rem;
  }
  .site-intro-header {
    padding: 0.75rem 1rem;
    gap: 0.5rem;
  }
  .site-intro-label {
    max-width: 17rem;
    line-height: 1.35;
  }
  .site-intro-body {
    padding: 1.25rem 1rem;
  }
  .site-intro-title {
    font-size: 1.75rem;
  }
  .site-intro-description {
    font-size: var(--text-sm, 0.875rem);
  }
  .site-intro-illustration {
    margin: 1.125rem 0;
  }
  .site-intro-preview-pair {
    gap: 0.75rem;
  }
  .site-intro-preview {
    padding: 0.75rem;
    gap: 0.75rem;
  }
  .site-intro-preview > .site-intro-preview-image {
    max-width: 16.375rem;
  }
  .site-intro-footer {
    padding: 0.75rem 1rem 1rem;
  }
  .site-intro-actions {
    justify-content: flex-end;
  }
  .site-intro-back,
  .site-intro-next {
    min-height: 2.875rem;
  }
}
@media (max-height: 540px) and (min-width: 521px) {
  .site-intro-header {
    padding: 0.625rem 1.25rem;
  }
  .site-intro-body {
    padding: 1.125rem 1.5rem;
  }
  .site-intro-footer {
    padding: 0.75rem 1.25rem;
  }
  .site-intro-progress {
    margin-bottom: 0.625rem;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .site-intro-dialog[open] {
    animation: site-intro-enter 160ms ease-out;
  }
  @keyframes site-intro-enter {
    from {
      opacity: 0;
      transform: translateY(0.5rem);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

/* src/css/site_intro/site_intro.css */

/* src/css/training_time/training_time_controls.css */
.training-time-fields {
  grid-template-columns: minmax(0, 1fr) 5.5rem;
}
.training-time-fields .training-date-field {
  display: grid;
  gap: 0.3125rem;
  min-width: 0;
}
.training-date-field > span {
  font-size: var(--text-sm);
  font-weight: 700;
}
.training-date-trigger {
  width: 100%;
  min-width: 0;
  min-height: 2.5rem;
  padding: 0.5rem 0.625rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: white;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-sm);
  text-align: left;
}
.training-date-trigger svg {
  width: 1.125rem;
  height: 1.125rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
  color: #74667d;
}
.training-date-week {
  margin-left: auto;
  flex: 0 0 auto;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 600;
}
.training-date-trigger:hover,
.training-date-trigger[aria-expanded=true] {
  border-color: #80609d;
}
.training-date-trigger[aria-invalid=true] {
  border-color: var(--cgi-red-dark);
}
.training-time-confirmations {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.75rem 1.25rem;
}
.training-time-confirmations > label {
  flex: 1 1 15rem;
}
.training-time-title {
  display: inline-flex;
  align-items: center;
}
.training-time-title .settings-help-button {
  flex: 0 0 auto;
}
#trainingTimeYear {
  --settings-help-max-width: 480px;
  white-space: pre-line;
}
#trainingTimeYear .settings-help-list > li {
  text-wrap: pretty;
}
.training-time-balance {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
}
.training-time-week small {
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: 1.35;
}
.training-time-week strong {
  font-size: var(--text-lg);
  overflow-wrap: anywhere;
}
.training-time-week[data-reserved=true] strong {
  color: var(--cgi-red-dark);
}
.training-time-dialog {
  overflow-x: hidden;
}
.training-time-dialog form,
.training-time-dialog form > * {
  min-width: 0;
}
.training-time-dialog .brown-bag-dialog-selection {
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  overflow-wrap: anywhere;
}
.training-time-reviews select {
  min-width: 0;
  max-width: 100%;
  min-height: 2rem;
  padding: 0.3125rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-xs);
}
.training-time-review-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  min-width: 0;
  max-width: 100%;
  margin-left: auto;
}
.training-time-review-filters select {
  flex: 0 1 auto;
  max-width: 100%;
}
@media (max-width: 520px) {
  .training-time-review-filters {
    width: 100%;
  }
  .training-time-review-filters select {
    flex: 1 1 0;
    width: 0;
  }
}
.training-time-status[data-status=cancelled] {
  background: #fff1f3;
  color: #a91630;
}
.training-time-booking-guidance {
  margin: 0.875rem 0;
  font-size: var(--text-sm);
  line-height: 1.55;
}
.training-time-form input:disabled,
.training-time-form textarea:disabled {
  background: var(--soft);
  color: var(--muted);
  cursor: not-allowed;
}
.training-time-commitment:has(input:disabled) {
  color: var(--muted);
}
@media (max-width: 600px) {
  .training-time-balance {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 0.875rem;
  }
}

/* src/css/training_time/training_time_calendar.css */
.training-date-calendar {
  position: fixed;
  z-index: 90;
  width: 320px;
  padding: 0.875rem;
  overflow: auto;
  overscroll-behavior: contain;
  border: 2px solid #73518d;
  border-radius: 0.75rem;
  background: white;
  color: var(--ink);
  box-shadow: 0 0.75rem 2rem #3b0b5a30;
  transition-property: none;
}
.training-calendar-header,
.training-calendar-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.training-calendar-header {
  position: sticky;
  top: 0;
  z-index: 1;
  background: white;
}
.training-calendar-header strong {
  color: var(--cgi-purple);
  font-size: var(--text-md);
  font-weight: 750;
  text-transform: capitalize;
}
.training-date-calendar button {
  min-width: 2rem;
  min-height: 2rem;
  padding: 0.25rem;
  border: 0;
  border-radius: 0.375rem;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-sm);
  cursor: pointer;
}
.training-calendar-header > button {
  font-size: 1.625rem;
  line-height: 1;
}
.training-date-calendar button:hover:not(:disabled) {
  background: #f0e8f6;
  color: var(--cgi-purple);
}
.training-date-calendar button:disabled {
  color: #a39ca8;
  opacity: 1;
  cursor: not-allowed;
}
.training-date-calendar table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0.125rem;
  margin: 0.5rem 0;
}
.training-date-calendar th {
  padding: 0.25rem 0;
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--muted);
  text-align: center;
}
.training-date-calendar td {
  padding: 0;
  text-align: center;
}
.training-date-calendar td button {
  width: 100%;
  border: 1px solid #e5e0e8;
  background: #fff;
  color: #211c25;
  font-weight: 700;
}
.training-date-calendar td button:disabled {
  border-color: transparent;
  background: #f5f3f6;
  color: #a39ca8;
  font-weight: 400;
}
.training-date-calendar button.is-adjacent-month:not(:disabled) {
  border-color: transparent;
  background: #faf9fb;
  color: #746d7d;
  font-weight: 400;
}
.training-date-calendar button[aria-current=date] {
  box-shadow: inset 0 0 0 1px #a48caf;
}
.training-date-calendar button.is-selected:not(:disabled) {
  background: var(--cgi-purple);
  color: white;
}
.training-calendar-footer {
  padding-top: 0.5rem;
  border-top: 1px solid var(--line);
}
.training-calendar-footer button {
  padding: 0.375rem 0.625rem;
  color: var(--cgi-purple);
  font-weight: 650;
}
@media (max-width: 520px) {
  .training-time-fields {
    grid-template-columns: minmax(0, 1fr) 5rem;
  }
  .training-time-confirmations > label {
    flex-basis: 100%;
  }
}

/* src/css/training_time/training_time.css */

/* src/css/admin_appearance/admin_appearance_groups.css */
#adminView {
  --admin-group-surface: #f3f1ef;
  --admin-card-surface: #fff;
  --admin-group-inset: 1rem;
  --admin-card-inset: 1.125rem;
}
#adminView .admin-panel:not(#adminSettingsPanel) {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--admin-card-surface);
  box-shadow: var(--shadow-panel);
}
#adminView .admin-panel > .admin-section-group {
  margin: var(--admin-group-inset);
}
#adminView .admin-section-group {
  min-width: 0;
  padding: var(--admin-group-inset);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--admin-group-surface);
}
#adminView :is(.admin-group-title, .settings-subpanel > h3) {
  margin: 0 0 1rem;
  color: var(--cgi-purple);
  font-size: var(--text-lg);
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
#adminView .admin-group-heading {
  min-width: 0;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.625rem 1rem;
}
#adminView .admin-group-heading .admin-group-title {
  margin-bottom: 0;
}
#adminView :is(.admin-settings-card, .admin-roster, .activity-card, .admin-rating-panel, .prf-overview, .team-progress-panel, .partner-grid, .email-template-preview, .admin-import-panel, .admin-filters, .settings-team-card, .admin-inner-card) {
  min-width: 0;
  border-color: var(--line);
  border-radius: var(--radius-sm);
  background: var(--admin-card-surface);
}
#adminView .admin-inner-card {
  border: 1px solid var(--line);
}
#adminView .admin-section-group > .admin-settings-card {
  max-width: none;
}
#adminView .admin-section-group > .brown-bag-email-settings {
  margin-top: 0;
}
#adminView .admin-section-group > .admin-roster {
  margin-top: 0;
}
#adminView :is(.admin-settings-card, .admin-roster, .activity-card, .email-template-preview) > header {
  padding: 1rem var(--admin-card-inset);
  border-bottom-color: var(--line);
  background: var(--admin-card-surface);
}
#adminView #adminTeamsForm {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#adminView #adminSettingsForm > .settings-groups {
  padding: var(--admin-group-inset);
}
#adminView #teamsGroups {
  margin: var(--admin-group-inset);
  padding: 0;
  background: transparent;
}

/* src/css/admin_appearance/admin_appearance_overview.css */
#adminView .admin-overview-content,
#adminView .email-template-layout {
  margin: var(--admin-group-inset);
}
#adminView .admin-overview-detail {
  display: grid;
  gap: 1rem;
}
#adminView .admin-overview-top {
  margin: 0;
  grid-template-columns: 15rem minmax(0, 1fr);
}
#adminView .admin-standings-group {
  min-height: 0;
  display: flex;
  flex-direction: column;
  contain: size;
}
#adminView .admin-standings-group .admin-rating-panel {
  flex: 1;
  contain: none;
}
#adminView .admin-standings-group .prf-panel-meta {
  margin: 0;
  font-size: var(--text-xs);
  color: var(--muted);
}
#adminView .admin-overview-top h2 {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 800;
  white-space: normal;
}
#adminView .admin-overview-top :is(.prf-overview, .team-progress-panel) > header {
  min-height: 0;
  padding: 0.75rem 0.875rem;
}
#adminView .admin-overview-top .team-progress-table {
  min-width: 0;
}
#adminView .admin-overview-top .team-progress-table :is(th, td) {
  padding-inline: 0.5rem;
  overflow-wrap: anywhere;
}
#adminView .admin-overview-top .team-progress-table th {
  white-space: normal;
}
#adminView .activity-filters {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--admin-card-surface);
}
#adminView .admin-list-heading {
  margin-top: 0;
}
#adminView .admin-roster-add {
  display: block;
}
#adminView .admin-access-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 27rem), 1fr));
  gap: var(--admin-group-inset);
  margin: var(--admin-group-inset);
}
#adminView .admin-access-actions > form {
  margin: 0;
}
#adminView .admin-access-fields input {
  min-width: 0;
  flex: 1 1 12rem;
}
#adminView .admin-roster-add > .admin-access-card {
  display: grid;
  padding: var(--admin-card-inset);
}
#adminView .admin-access-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
#adminView .admin-access-card label {
  margin-bottom: 0.4375rem;
}
#adminView .brown-bag-email-recipients {
  margin-top: 0.75rem;
}
#adminView .email-template-layout .admin-settings-card {
  max-width: none;
}
@media (max-width: 1280px) {
  #adminView .admin-standings-group {
    contain: none;
  }
}
@media (max-width: 850px) {
  #adminView .admin-overview-top {
    grid-template-columns: 1fr;
  }
}
#adminOverviewPanel .partner-column-sort {
  overflow-wrap: anywhere;
}
@media (min-width: 761px) {
  #adminOverviewPanel .partner-table {
    min-width: 0;
  }
  #adminOverviewPanel .partner-table th,
  #adminOverviewPanel .partner-table td {
    padding-inline: min(0.5rem, 0.3vw);
    overflow-wrap: anywhere;
  }
  #adminOverviewPanel .partner-table thead th:not(:first-child) {
    padding-inline: 0.125rem;
  }
  #adminOverviewPanel .partner-table th:first-child {
    width: 32%;
  }
  #adminOverviewPanel .partner-table thead th:nth-child(2) {
    width: 10%;
  }
  #adminOverviewPanel .partner-table thead th:nth-child(3) {
    width: 7%;
  }
  #adminOverviewPanel .partner-table thead th:nth-child(4) {
    width: 14%;
  }
  #adminOverviewPanel .partner-table thead th:nth-child(5) {
    width: 16%;
  }
  #adminOverviewPanel .partner-table thead th:last-child {
    width: 21%;
  }
  #adminOverviewPanel .partner-training-time {
    min-width: 0;
  }
  #adminOverviewPanel .partner-table button {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}
#adminOverviewPanel .partner-training-time > button {
  min-width: 4.5rem;
  max-width: 100%;
  white-space: nowrap;
  overflow-wrap: normal;
}
#adminView .settings-subpanel {
  background: var(--admin-group-surface);
}
#adminView .settings-roster {
  padding: 1rem var(--admin-card-inset);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--admin-card-surface);
}
#adminView .admin-section-group > .admin-filters {
  margin-top: 1rem;
  padding: 1rem var(--admin-card-inset);
}
#adminView .admin-question-card:not(.offline) {
  border-color: var(--line);
  background: var(--admin-card-surface);
}
#adminView .activity-filters {
  padding-inline: var(--admin-card-inset);
}
#adminView :is(.activity-entry, .activity-status, .activity-note) {
  padding-inline: var(--admin-card-inset);
}

/* src/css/admin_appearance/admin_appearance_requests.css */
#adminView .training-time-reviews.admin-section-group > header {
  padding: 0;
  margin-bottom: 1rem;
  background: transparent;
}
#adminView .training-time-reviews > header h3 {
  margin: 0;
  color: var(--cgi-purple);
  font-size: var(--text-lg);
  line-height: 1.35;
}
#adminView .admin-request-list-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--admin-card-surface);
}
#adminView .admin-request-list-card > ol {
  min-width: 0;
  max-height: 26rem;
  margin: 0;
  padding: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: var(--admin-card-surface);
}
#adminView .admin-request-list-card > .training-time-notice {
  margin: 0;
  padding: 1rem var(--admin-card-inset);
  overflow-wrap: anywhere;
}
#adminView .training-time-reviews .training-time-entry {
  min-width: 0;
  padding: 1rem var(--admin-card-inset);
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: var(--admin-card-surface);
}
#adminView .training-time-reviews .training-time-entry:last-child {
  border-bottom: 0;
}
#adminView .training-time-reviews .training-time-entry.is-linked-request {
  background: #fff8f9;
}
#adminView .training-notification-options {
  min-width: 0;
  margin: 0;
  padding: 0 1.125rem 1.125rem;
  border: 0;
}
#adminView .training-notification-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}
#adminView .training-notification-table :is(th, td) {
  padding: 0.85rem 0.625rem;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
}
#adminView .training-notification-table thead th {
  color: var(--cgi-purple);
  font-size: var(--text-sm);
  font-weight: 750;
  text-align: center;
  line-height: 1.3;
}
#adminView .training-notification-table :is(th, td):first-child {
  width: 44%;
  text-align: left;
}
#adminView .training-notification-table tbody tr {
  border-top: 1px solid var(--line);
}
#adminView .training-notification-table tbody th {
  font-size: var(--text-sm);
  font-weight: 600;
}
#adminView .training-notification-table tbody strong,
#adminView .training-notification-table tbody small {
  display: block;
}
#adminView .training-notification-table tbody small {
  margin-top: 0.3rem;
  color: var(--muted);
  font-size: var(--text-xs);
  font-weight: 400;
  line-height: 1.45;
}
#adminView .training-notification-requests {
  display: grid;
  justify-items: center;
  gap: 0.6rem;
}
#adminView .training-notification-choice {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  font-size: var(--text-xs);
  line-height: 1.3;
  cursor: pointer;
}
#adminView .training-notification-choice input {
  flex: 0 0 1rem;
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--cgi-red);
}
@media (max-width: 600px) {
  #adminView .training-notification-options {
    padding: 0 0.375rem 0.875rem;
  }
  #adminView .training-notification-table :is(th, td) {
    padding: 0.75rem 0.25rem;
  }
  #adminView .training-notification-table thead th {
    font-size: 0.75rem;
    hyphens: auto;
  }
  #adminView .training-notification-table tbody th {
    font-size: 0.875rem;
  }
  #adminView .training-notification-table tbody small {
    font-size: 0.68rem;
  }
  #adminView .training-notification-choice {
    flex-direction: column;
    gap: 0.3rem;
    font-size: 0.7rem;
  }
  #adminView {
    --admin-group-inset: 0.75rem;
    --admin-card-inset: 0.875rem;
  }
  #adminView .admin-group-title {
    margin-bottom: 0.875rem;
  }
  #adminView :is(.admin-settings-card, .admin-roster, .activity-card, .email-template-preview) > header {
    padding-block: 0.875rem;
  }
  #adminView .activity-heading {
    flex-wrap: wrap;
    gap: 0.75rem;
  }
}

/* src/css/admin_appearance/admin_appearance.css */

/* src/css/mass_email/mass_email_layout.css */
#adminMassEmailPanel {
  min-width: 0;
}
#adminMassEmailPanel [hidden] {
  display: none !important;
}
#adminMassEmailPanel .mass-email-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  grid-template-areas: "audience message" "preview message";
  gap: var(--admin-group-inset);
  margin: var(--admin-group-inset);
  align-items: start;
}
.mass-email-audience {
  grid-area: audience;
}
.mass-email-message {
  grid-area: message;
}
.mass-email-preview {
  grid-area: preview;
}
#adminMassEmailPanel .mass-email-card {
  min-width: 0;
  padding: var(--admin-card-inset);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
}
#adminMassEmailPanel label {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  font-size: var(--text-sm);
}
#adminMassEmailPanel label > span {
  font-weight: 800;
}
#adminMassEmailPanel :is(input:not([type=checkbox]), textarea, select) {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 2.625rem;
  padding: 0.5rem 0.6875rem;
  border: 1px solid #d8d2ce;
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: var(--text-sm);
}
#adminMassEmailPanel :is(input, textarea, select):focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
  border-color: var(--cgi-red);
}
#adminMassEmailPanel input[type=checkbox] {
  width: 1.0625rem;
  height: 1.0625rem;
  min-width: 1.0625rem;
  margin: 0;
  accent-color: var(--cgi-red);
}
#adminMassEmailPanel textarea {
  resize: vertical;
}
.mass-email-fields {
  display: grid;
  gap: 0.85rem;
}
.mass-email-button-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}
.mass-email-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
}
.mass-email-actions > button {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
.mass-email-actions > label {
  flex: 1 1 8rem;
}
.mass-email-language-field {
  display: grid;
  gap: 0.375rem;
}
.mass-email-language-field .mass-email-actions > select {
  flex: 1 1 8rem;
  min-width: 0;
}

/* src/css/mass_email/mass_email_audience.css */
#adminMassEmailPanel fieldset {
  min-width: 0;
  margin: 0 0 0.85rem;
  padding: 0;
  border: 0;
}
#adminMassEmailPanel legend {
  margin-bottom: 0.5rem;
  font-size: var(--text-sm);
  font-weight: 700;
}
.mass-email-selection {
  display: grid;
  gap: 0.5rem;
}
#adminMassEmailPanel .mass-email-selection label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  overflow-wrap: anywhere;
}
#adminMassEmailPanel .mass-email-selection label > span {
  font-weight: 600;
}
.mass-email-selection label {
  min-height: 2.125rem;
}
.mass-email-selection input {
  flex: 0 0 auto;
}
.mass-email-counts,
.mass-email-confirm-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.4rem 0.75rem;
  margin: 0.875rem 0 0;
  font-size: var(--text-sm);
}
.mass-email-counts dd,
.mass-email-confirm-summary dd {
  margin: 0;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.mass-email-counts {
  align-items: center;
  border-top: 1px solid var(--line);
  padding-top: 0.875rem;
}
.mass-email-counts:empty {
  display: none;
}
.mass-email-counts dd {
  color: var(--cgi-purple);
  font-size: 1.75rem;
  line-height: 1.2;
}
.mass-email-confirm-summary {
  margin-bottom: 1rem;
}
.mass-email-confirm-summary dd {
  max-width: 22rem;
  text-align: right;
}
.mass-email-status,
.mass-email-muted {
  margin: 0;
  font-size: var(--text-sm);
  overflow-wrap: anywhere;
}
.mass-email-muted {
  color: var(--muted);
}
#massEmailDeliveryDisabled {
  margin-top: 0.75rem;
}
#massEmailPreviewSubject {
  font-weight: 700;
  overflow-wrap: anywhere;
}
#massEmailPreview {
  max-width: 100%;
  overflow-x: auto;
}
#massEmailPreviewStatus {
  margin-bottom: 0.5rem;
}

/* src/css/mass_email/mass_email_history.css */
.mass-email-history {
  display: grid;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.mass-email-history-card {
  display: grid;
  gap: 0.6rem;
}
.mass-email-history-heading {
  display: flex;
  justify-content: space-between;
  align-items: start;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.mass-email-history-heading strong {
  overflow-wrap: anywhere;
}
.mass-email-progress {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.5rem;
  font-size: var(--text-sm);
}
.mass-email-count-pill {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}
.mass-email-count-pill[data-status=sent] {
  border-color: #b9d3c5;
  background: #e7f4ec;
  color: var(--success);
}
.mass-email-count-pill[data-status=failed] {
  border-color: #eac2ca;
  background: #fff1f3;
  color: #a91630;
}
.mass-email-count-pill[data-status=needsReview] {
  border-color: #e6c680;
  background: #fff5da;
  color: var(--warning);
}
.mass-email-count-pill:is([data-status=skipped], [data-status=cancelled]) {
  border-color: var(--line);
  background: var(--soft);
  color: var(--muted);
}
.mass-email-history progress {
  width: 100%;
  accent-color: var(--cgi-purple);
}
.mass-email-selected-details {
  margin-top: 0.75rem;
}
.mass-email-selected-details details + details {
  margin-top: 0.75rem;
}
.mass-email-selected-details summary {
  cursor: pointer;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.mass-email-recipients-wrap {
  max-height: 22rem;
  overflow: auto;
  margin-top: 0.75rem;
}
.mass-email-recipients {
  width: 100%;
  min-width: 44rem;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: var(--text-sm);
}
.mass-email-recipients :is(th, td) {
  padding: 0.5rem;
  text-align: left;
  border-bottom: 1px solid var(--line);
  white-space: normal;
  overflow-wrap: anywhere;
}
.mass-email-recipients th {
  position: sticky;
  top: 0;
  background: #fff;
}
.mass-email-audit {
  display: grid;
  gap: 0.75rem;
  padding-left: 1.25rem;
  font-size: var(--text-sm);
  overflow-wrap: anywhere;
}

/* src/css/mass_email/mass_email_confirmation.css */
.mass-email-confirm {
  width: min(34rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  padding: 1.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  overflow: auto;
}
.mass-email-confirm::backdrop {
  background: rgb(0 0 0 / 45%);
}
.mass-email-confirm form {
  display: grid;
  gap: 1rem;
}
.mass-email-confirm h2,
.mass-email-confirm p {
  margin: 0;
}
#adminMassEmailPanel :is(.mass-email-status, .mass-email-muted, .mass-email-selection, .mass-email-history-card, .mass-email-confirm-summary)[hidden] {
  display: none;
}
@media (max-width: 900px) {
  #adminMassEmailPanel .mass-email-layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "audience" "message" "preview";
  }
}
@media (max-width: 600px) {
  .mass-email-button-fields {
    grid-template-columns: minmax(0, 1fr);
  }
  .mass-email-confirm {
    padding: 1rem;
  }
  .mass-email-confirm .mass-email-actions > button {
    width: 100%;
  }
  .mass-email-confirm-summary {
    grid-template-columns: minmax(0, 1fr);
  }
  .mass-email-confirm-summary dd {
    text-align: left;
    margin-bottom: 0.4rem;
  }
}

/* src/css/mass_email/mass_email.css */

/* src/css/app.css */
