@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url("inter.woff2") format("woff2");}
:root {
  color-scheme: light;
  --ink: #3a3f46;
  --muted: #737b85;
  --line: #e6e8eb;
  --paper: #f6f7f9;
  --panel: #ffffff;
  --panel-tint: #f8f9fb;
  --primary: #3a3f46;
  --primary-deep: #2b2f35;
  --accent: #3f6fe6;
  --accent-soft: #eef3ff;
  --sage: #eef0f2;
  --success: #19724e;
  --gold: #c98a2e;
  --shadow-card: 0 12px 30px rgba(23, 33, 38, 0.08);
  --shadow-soft: 0 22px 60px rgba(23, 33, 38, 0.12);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: linear-gradient(180deg, #fbfcfd 0%, #f1f3f6 44%, var(--paper) 100%);
}

a {
  color: inherit;
}

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

button {
  cursor: pointer;
}

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 68px;
  padding: 0 32px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 253, 250, 0.9);
  backdrop-filter: blur(12px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  text-decoration: none;
}

.brand img {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 4px 12px rgba(23, 33, 38, 0.12);
}

.site-header nav {
  display: flex;
  align-items: center;
  gap: 8px;
}

.site-header nav a,
.logout-form button,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 15px;
  border: 1px solid transparent;
  border-radius: 9px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.site-header nav a,
.logout-form button {
  color: var(--muted);
}

.logout-form {
  margin: 0;
}

.logout-form button {
  background: transparent;
}

.site-header nav a:hover,
.logout-form button:hover {
  color: var(--ink);
  background: var(--sage);
}

.nav-user {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 10px;
  color: var(--primary);
  font-size: 14px;
  font-weight: 800;
}

.site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto 32px;
  padding: 18px 0 0;
  border-top: 1px solid rgba(58, 63, 70, 0.14);
  color: var(--muted);
}

.site-footer > div {
  display: grid;
  gap: 3px;
}

.site-footer strong {
  color: var(--ink);
}

.site-footer span {
  font-size: 13px;
  font-weight: 650;
}

.site-footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
}

.site-footer a {
  color: var(--primary);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.site-footer a:hover {
  text-decoration: underline;
}

.hero-shell,
.page-shell,
.admin-shell,
.auth-shell {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
  padding: 48px 0;
}

.hero-shell {
  width: min(1180px, calc(100% - 40px));
  padding: 64px 0;
}

.platform-signup-shell {
  display: grid;
  gap: 18px;
}

.platform-signup-heading {
  max-width: 760px;
}

.platform-signup-heading h1 {
  margin: 0 0 12px;
  font-size: clamp(42px, 7vw, 76px);
  line-height: 0.94;
}

.platform-signup-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 20px;
  line-height: 1.45;
}

.public-info-shell {
  display: grid;
  gap: 18px;
}

.public-info-hero {
  max-width: 780px;
  padding: 18px 0 8px;
}

.public-info-hero h1 {
  margin: 0 0 12px;
  font-size: clamp(42px, 7vw, 74px);
  line-height: 0.96;
}

.public-info-hero p {
  margin: 0;
  color: var(--muted);
  font-size: 20px;
  line-height: 1.45;
}

.public-info-hero .actions {
  margin-top: 22px;
}

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

.public-info-card {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  padding: 22px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 14px 34px rgba(23, 33, 38, 0.06);
}

.public-info-card h2 {
  margin: 0;
  color: var(--ink);
  font-size: 22px;
}

.public-info-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.public-info-card ul {
  display: grid;
  gap: 9px;
  margin: 0;
  padding-left: 18px;
  color: var(--ink);
  line-height: 1.45;
}

.platform-signup-card {
  display: grid;
  gap: 18px;
}

.platform-signup-includes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.platform-signup-includes article {
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 14px 34px rgba(23, 33, 38, 0.06);
}

.platform-signup-includes span {
  display: block;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.platform-signup-includes h2 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 22px;
}

.platform-signup-includes p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.platform-starter-pack-card {
  display: grid;
  gap: 18px;
}

.platform-starter-pack-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

.platform-starter-pack-item {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.13);
  border-radius: 8px;
  background: var(--panel-tint);
}

.platform-starter-pack-item.draft {
  border-left: 4px solid rgba(58, 63, 70, 0.4);
}

.platform-starter-pack-item.ready {
  border-left: 4px solid rgba(197, 138, 58, 0.75);
  background: #fffaf1;
}

.platform-starter-pack-item .status-pill {
  justify-self: start;
}

.starter-track-focus {
  display: inline-flex;
  justify-self: start;
  max-width: 100%;
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.platform-starter-pack-item h3 {
  margin: 0;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.15;
}

.platform-starter-pack-item strong {
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.platform-starter-pack-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.platform-starter-pack-item .button {
  justify-self: start;
  margin-top: 4px;
}

.starter-library-card-actions,
.starter-library-next-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.starter-library-activation-form {
  margin: 0;
}

.starter-library-activation-form .button {
  white-space: normal;
}

.platform-signup-plans {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.platform-signup-plan {
  display: grid;
  gap: 9px;
  align-content: start;
  min-width: 0;
  min-height: 210px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: var(--panel-tint);
  cursor: pointer;
}

.platform-signup-plan:has(input:checked) {
  border-color: var(--primary);
  box-shadow: inset 0 0 0 1px var(--primary), 0 16px 34px rgba(23, 33, 38, 0.08);
}

.platform-signup-plan input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.platform-signup-plan .status-pill {
  justify-self: start;
}

.platform-signup-plan strong {
  color: var(--ink);
  font-size: 24px;
}

.platform-signup-price {
  color: var(--primary);
  font-size: 18px;
  font-weight: 900;
}

.platform-signup-plan small,
.platform-signup-plan em,
.platform-signup-plan-note {
  color: var(--muted);
  font-style: normal;
  line-height: 1.45;
}

.platform-signup-plan-note {
  display: block;
  margin-top: auto;
  font-size: 13px;
  font-weight: 800;
}

.admin-shell {
  width: min(1320px, calc(100% - 40px));
}

.auth-shell {
  display: grid;
  place-items: center;
  min-height: calc(100vh - 68px);
}

body.admin-app-body {
  background: #f4f7f5;
}

.admin-app-frame {
  display: grid;
  grid-template-columns: 272px minmax(0, 1fr);
  min-height: 100vh;
}

.admin-sidebar {
  --sidebar-x: 16px;
  --sidebar-y: 20px;
  position: sticky;
  top: 0;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 18px;
  height: 100vh;
  overflow-y: auto;
  padding: var(--sidebar-y) var(--sidebar-x);
  border-right: 1px solid var(--line);
  background: #ffffff;
}

.admin-sidebar-brand {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 98px;
  margin: calc(var(--sidebar-y) * -1) calc(var(--sidebar-x) * -1) 4px;
  padding: 18px 20px;
  color: var(--ink);
  background: #f6f7f9;
  box-shadow: 0 1px 0 rgba(58, 63, 70, 0.12), 0 8px 10px rgba(23, 33, 38, 0.04);
  text-decoration: none;
  transition: background 0.18s ease;
}

.admin-sidebar-brand:hover {
  background: #f0f2f5;
}

.admin-sidebar-brand img,
.admin-brand-mark {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
}

.admin-brand-mark {
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--primary);
  font-weight: 900;
}

.admin-brand-mark.platform {
  background: #3a3f46;
}

.admin-sidebar-brand span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.admin-sidebar-brand strong {
  overflow: hidden;
  font-size: 17px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-sidebar-brand small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-library-source-badge {
  justify-self: start;
  margin-top: 3px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #0f6f48;
  background: #dff4e8;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.admin-sidebar-nav {
  display: grid;
  gap: 16px;
  padding-bottom: 10px;
}

.admin-sidebar-bottom {
  display: grid;
  gap: 10px;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(58, 63, 70, 0.12);
}

.admin-sidebar-section h2 {
  margin: 0 0 6px;
}

.admin-sidebar-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  padding: 0 8px;
  border: 0;
  border-radius: 8px;
  color: var(--ink);
  background: transparent;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0;
  text-align: left;
  transition: background 0.18s ease, color 0.18s ease;
}

.admin-sidebar-toggle-label {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 10px;
}

.admin-sidebar-icon {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  color: currentColor;
}

.admin-sidebar-toggle::after {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-1px) rotate(45deg);
  transition: transform 0.18s ease;
}

.admin-sidebar-toggle:hover {
  color: var(--ink);
  background: var(--sage);
}

.admin-sidebar-toggle:focus-visible {
  color: var(--ink);
  outline: 3px solid rgba(58, 63, 70, 0.14);
  outline-offset: 2px;
}

.admin-sidebar-section.is-collapsed .admin-sidebar-toggle::after {
  transform: translateY(1px) rotate(-45deg);
}

.admin-sidebar-links {
  display: grid;
  gap: 2px;
  padding-left: 36px;
}

.admin-sidebar-section.is-collapsed .admin-sidebar-links {
  display: none;
}

.admin-sidebar-links a {
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 8px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
  transition: background 0.18s ease, color 0.18s ease;
}

.admin-sidebar-links a:hover,
.admin-sidebar-links a.active {
  color: var(--primary);
  background: var(--sage);
}

.admin-sidebar-links a.active {
  font-weight: 650;
  box-shadow: inset 0 0 0 1px rgba(58, 63, 70, 0.1);
}

.admin-sidebar-footer {
  display: grid;
  gap: 4px;
  margin-top: 0;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f6faf7;
}

.admin-sidebar-footer span,
.admin-sidebar-footer small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-sidebar-footer strong {
  overflow-wrap: anywhere;
}

.admin-sidebar-footer .logout-form button {
  justify-content: flex-start;
  width: 100%;
  min-height: 34px;
  padding: 0;
  color: var(--primary);
}

.admin-workspace {
  min-width: 0;
}

.admin-appbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 64px;
  padding: 0 32px;
  border-bottom: 1px solid var(--line);
  background: #ffffff;
}

.admin-appbar-title {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-appbar-title span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-appbar-title strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-appbar-hint {
  overflow: hidden;
  max-width: min(58vw, 760px);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-appbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-appbar-actions a,
.admin-appbar-actions span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 10px;
  border-radius: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.admin-appbar-actions a:hover {
  color: var(--ink);
  background: var(--sage);
}

.admin-appbar-actions span {
  color: var(--primary);
}

.admin-app-frame .admin-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 32px;
}

.admin-app-frame .admin-topbar .page-heading {
  margin-bottom: 0;
}

.admin-app-frame .admin-actions {
  max-width: none;
}

.admin-app-frame .admin-grid {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}

.admin-app-frame .admin-card[id] {
  scroll-margin-top: 84px;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  align-items: center;
  gap: 40px;
  min-height: 500px;
}

.status-panel,
.admin-card,
.course-card,
.empty-state,
.course-hero,
.metrics > div {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.admin-card,
.empty-state,
.metrics > div {
  border-color: var(--line);
  background: var(--panel);
  box-shadow: 0 1px 2px rgba(23, 33, 38, 0.05);
}

.hero > div:first-child {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px 0;
}

.kicker {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

h1,
h2 {
  margin: 0;
  letter-spacing: 0;
}

h1 {
  max-width: 740px;
  font-size: 66px;
  line-height: 0.96;
}

h2 {
  font-size: 20px;
}

.lede {
  max-width: 620px;
  margin: 18px 0 0;
  color: var(--muted);
  font-size: 19px;
  line-height: 1.55;
}

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

.actions form {
  margin: 0;
}

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

.button.secondary {
  color: var(--ink);
  border-color: var(--line);
  background: var(--panel);
}

.button.primary:hover {
  opacity: 0.9;
}

.button.secondary:hover {
  background: var(--panel-tint);
  border-color: var(--muted);
}

.status-panel {
  display: grid;
  align-content: center;
  gap: 10px;
  padding: 32px;
  border-color: rgba(58, 63, 70, 0.16);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 251, 248, 0.94)),
    linear-gradient(135deg, var(--sage), var(--accent-soft));
  box-shadow: var(--shadow-soft);
}

.status-panel span,
.metrics span,
td,
.course-card p,
.page-heading p {
  color: var(--muted);
}

.status-panel strong {
  margin-bottom: 14px;
  font-size: 24px;
  line-height: 1.2;
}

.status-panel a {
  margin-bottom: 14px;
  color: var(--primary);
  font-size: 24px;
  font-weight: 900;
  line-height: 1.2;
  text-decoration: none;
}

.status-panel a:hover {
  text-decoration: underline;
}

.page-heading {
  margin-bottom: 24px;
}

.page-heading h1 {
  font-size: 48px;
}

/* Admin workspace screens follow the mockup's one-24px-title rule (the dashboard
   already had this via .admin-dashboard-shell; this extends it to every admin
   workspace screen — learners, offers, reports, etc.). Public/marketing heroes
   keep the larger .page-heading h1 above. */
.admin-shell .page-heading h1,
.admin-workspace .page-heading h1 {
  font-size: 24px;
  line-height: 1.2;
  font-weight: 680;
  letter-spacing: -0.3px;
  color: var(--ink);
}

.admin-shell .page-heading p,
.admin-workspace .page-heading p {
  font-size: 14px;
}

.page-heading p {
  max-width: 760px;
  line-height: 1.6;
}

.course-grid,
.admin-grid,
.metrics,
.editor-layout {
  display: grid;
  gap: 16px;
}

.course-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
}

.filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: -6px 0 24px;
}

.filter-chip {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--panel);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.filter-chip.active,
.filter-chip:hover {
  color: #fff;
  border-color: transparent;
  background: var(--primary);
}

.course-card,
.admin-card,
.empty-state,
.course-hero {
  padding: 24px;
}

.course-detail {
  display: grid;
  gap: 16px;
}

.course-hero p:last-child {
  max-width: 760px;
  color: var(--muted);
  line-height: 1.6;
}

.button.disabled {
  pointer-events: none;
  opacity: 0.62;
}

.button:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.learner-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: start;
}

.lesson-page .learner-layout {
  grid-template-columns: minmax(0, 1fr) 360px;
}

.learner-main {
  display: grid;
  gap: 18px;
}

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

.learner-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 24px;
  align-items: center;
  overflow: hidden;
  padding: 30px;
  border-color: rgba(16, 47, 54, 0.2);
  color: #fff;
  background: linear-gradient(135deg, var(--primary-deep) 0%, var(--primary) 68%, #6d5a39 100%);
  box-shadow: var(--shadow-soft);
}

.learner-hero h1 {
  font-size: 54px;
}

.learner-hero .kicker {
  color: #f4d190;
}

.learner-hero p {
  color: rgba(255, 255, 255, 0.82);
}

.learner-hero .button.secondary {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.32);
  background: rgba(255, 255, 255, 0.12);
}

/* Learner dashboard hero — scoped so the admin/course-detail hero spacing is untouched. */
.learner-hero .learner-hero-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0 6px;
}

.learner-hero .learner-hero-chips .hero-chip {
  margin: 0;
}

.learner-hero .learner-hero-welcome {
  margin-top: 6px;
  color: rgba(255, 255, 255, 0.96);
  font-size: 17px;
  font-weight: 600;
}

.learner-hero .learner-hero-monogram {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  min-height: 150px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #fff;
  background: linear-gradient(140deg, var(--accent), var(--primary-deep));
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28);
  font-size: 72px;
  font-weight: 800;
  letter-spacing: 2px;
}

.course-cover {
  overflow: hidden;
  min-height: 180px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: var(--sage);
  box-shadow: 0 18px 36px rgba(16, 47, 54, 0.2);
}

.learner-hero .course-cover {
  aspect-ratio: 16 / 9;
  min-height: 0;
}

.course-cover img,
.course-cover-fallback {
  width: 100%;
  height: 100%;
  min-height: 180px;
  object-fit: cover;
}

.learner-hero .course-cover img,
.learner-hero .course-cover-fallback {
  min-height: 0;
  object-fit: contain;
}

.course-cover-fallback {
  display: grid;
  place-items: center;
  color: var(--primary);
  background: linear-gradient(135deg, var(--sage), #f5f8f5);
  font-size: 28px;
  font-weight: 800;
}

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

.section-heading span {
  color: var(--muted);
  font-weight: 600;
}

.section-heading.compact {
  padding: 0 0 16px;
  border-bottom: 0;
}

.section-heading.compact p {
  margin: 6px 0 0;
}

/* Learner row-panel heading subtitle (Assessments/Resources/Announcements/Live
   Sessions) — matches the redesign's title+muted-subtitle idiom. Scoped to
   .learner-panel non-compact headings so admin cards and the dashboard/certificate
   compact headings are untouched. */
.learner-panel > .section-heading:not(.compact) > div {
  display: grid;
  gap: 4px;
}

.learner-panel > .section-heading:not(.compact) > div p {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted);
}

/* Announcement rows were flush to the panel edge; inset them to match the
   section-heading's 24px padding and space the items evenly. */
.announcement-list {
  display: grid;
  gap: 18px;
  padding: 18px 24px 22px;
}

.announcement-item h3 {
  margin: 0 0 4px;
}

.announcement-item p {
  margin: 6px 0 0;
}

.progress-panel,
.course-rail {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 14px;
  padding: 22px;
}

.progress-panel strong {
  font-size: 44px;
  line-height: 1;
}

.progress-panel > span {
  color: var(--muted);
}

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

.progress-track div {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), var(--success));
}

.progress-track.compact {
  height: 8px;
}

.learner-curriculum {
  display: grid;
}

.learner-module {
  display: block;
  padding: 20px 24px;
  border-bottom: 1px solid var(--line);
}

.learner-module:last-child {
  border-bottom: 0;
}

.learner-module-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  list-style: none;
  cursor: pointer;
}

.learner-module-summary::-webkit-details-marker {
  display: none;
}

.learner-module-summary::after {
  content: "";
  flex: none;
  width: 20px;
  height: 20px;
  background-color: var(--primary);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E") no-repeat center / 16px 16px;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E") no-repeat center / 16px 16px;
  transition: transform 0.18s ease;
}

.learner-module[open] .learner-module-summary::after {
  transform: rotate(90deg);
}

.learner-module-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.learner-module-copy strong {
  color: var(--muted);
  font-size: 15px;
  text-transform: uppercase;
}

.learner-module[open] .learner-module-copy strong {
  color: var(--primary);
}

.learner-module-copy small {
  color: var(--muted);
  font-size: 13px;
}

.learner-module[open] .learner-lessons {
  margin-top: 12px;
}

.learner-module h3 {
  margin: 0;
  font-size: 15px;
  color: var(--muted);
  text-transform: uppercase;
}

.learner-module h3 span {
  margin-left: 8px;
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  text-transform: none;
}

.learner-lessons {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.curriculum-link {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px 10px;
  border-top: 1px solid var(--line);
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.18s ease, color 0.18s ease;
}

.curriculum-link.active {
  color: var(--primary);
  background: var(--sage);
}

.curriculum-link.locked {
  color: var(--muted);
}

.curriculum-link:hover {
  background: var(--panel-tint);
}

.lesson-position {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-weight: 800;
}

.lesson-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.lesson-copy strong {
  overflow-wrap: anywhere;
}

.lesson-copy small {
  color: var(--muted);
}

.completion-chip {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  color: var(--muted);
  background: #eef3ef;
  font-size: 12px;
  font-weight: 800;
}

.completion-chip.complete {
  color: var(--success);
  background: #e3f4eb;
}

.completion-chip.locked {
  color: #7c4a16;
  background: #fff1d6;
}

.locked-content-panel {
  width: min(760px, 100%);
  margin: 0 auto;
  padding: 34px;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
  color: var(--muted);
  font-weight: 800;
}

.breadcrumb a {
  color: var(--primary);
  text-decoration: none;
}

.lesson-main {
  display: grid;
  gap: 22px;
  padding: 30px;
}

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

.lesson-heading h1 {
  font-size: 48px;
}

.lesson-body {
  color: var(--ink);
  font-size: 18px;
  line-height: 1.7;
}

.lesson-body p {
  margin: 0 0 18px;
}

.quiz-card-stack {
  display: grid;
  gap: 18px;
}

.quiz-question-card,
.quiz-result-card,
.quiz-builder-preview {
  display: grid;
  gap: 16px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(23, 33, 38, 0.05);
}

.quiz-question-label {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.quiz-question-card h2,
.quiz-builder-question h4 {
  margin: 0;
  font-size: 22px;
  line-height: 1.35;
}

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

.quiz-choice {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  cursor: pointer;
}

.quiz-choice input {
  width: 18px;
  height: 18px;
  accent-color: var(--primary);
}

.quiz-choice.readonly {
  cursor: default;
}

.quiz-choice.correct {
  border-color: rgba(0, 135, 81, 0.24);
  background: #e8f8ef;
}

.quiz-choice.incorrect {
  border-color: rgba(191, 43, 43, 0.22);
  background: #fff0f0;
}

.quiz-choice-dot {
  color: var(--muted);
  font-size: 18px;
}

.quiz-choice-mark {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}

.quiz-feedback,
.quiz-explanation {
  margin: 0;
  padding: 12px 14px;
  border-radius: 8px;
}

.quiz-feedback.correct {
  color: #075f3e;
  background: #cef4dd;
}

.quiz-feedback.incorrect {
  color: #8a1e1e;
  background: #fde8e8;
}

.quiz-explanation {
  color: var(--muted);
  background: var(--panel-tint);
}

.quiz-result-card {
  justify-items: center;
  text-align: center;
}

.quiz-result-card.passed {
  border-color: rgba(0, 135, 81, 0.2);
  background: #d8f7e2;
}

.quiz-result-card.failed {
  border-color: rgba(191, 43, 43, 0.16);
  background: #fde1e1;
}

.quiz-result-card strong {
  font-size: 22px;
}

.quiz-result-card p {
  margin: 0;
}

.quiz-result-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 34px;
}

.quiz-result-metrics div {
  display: grid;
  gap: 4px;
}

.quiz-result-metrics span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.quiz-result-metrics strong {
  font-size: 34px;
}

/* Quiz RESULTS view: tighten the top so the pass/fail banner + score are visible
   the instant the page loads, without scrolling. Take-quiz layout is untouched —
   this only applies when .quiz-results-view is set (a completed submission). */
.quiz-results-view {
  padding-top: 24px;
}

.quiz-results-view .admin-topbar {
  margin-bottom: 10px;
}

.quiz-results-view .page-heading {
  margin-bottom: 0;
}

.quiz-results-view .page-heading h1 {
  font-size: 30px;
}

.quiz-results-view .page-heading p:not(.kicker) {
  display: none;
}

.admin-actions.centered {
  justify-content: center;
}

.quiz-builder-preview,
.quiz-builder-panel {
  background: var(--panel-tint);
}

.quiz-builder-panel {
  display: grid;
  gap: 16px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.quiz-builder-settings {
  display: grid;
  grid-template-columns: minmax(140px, 220px) minmax(0, 1fr);
  gap: 14px;
  align-items: end;
}

.quiz-builder-review {
  display: grid;
  grid-template-columns: minmax(120px, 150px) minmax(120px, 150px) minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #fffdf9;
}

.quiz-builder-review-stat {
  display: grid;
  gap: 2px;
}

.quiz-builder-review span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.quiz-builder-review strong {
  color: var(--ink);
  font-size: 17px;
}

.quiz-builder-review p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.4;
}

.quiz-builder-review .button {
  justify-self: end;
  white-space: nowrap;
}

.quiz-builder-save-state {
  display: inline-flex;
  justify-self: end;
  align-items: center;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.quiz-builder-save-state.is-saved {
  background: #e8f7ef;
  color: #075f3e;
}

.quiz-builder-save-state.is-dirty {
  background: #fff3d9;
  color: #7a4b00;
}

.quiz-builder-navigator {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #fff;
}

.quiz-builder-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.quiz-builder-navigator > div:first-child {
  display: grid;
  gap: 2px;
}

.quiz-builder-navigator span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.quiz-builder-navigator strong {
  color: var(--ink);
  font-size: 15px;
}

.quiz-builder-nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.quiz-builder-nav-button {
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-weight: 900;
}

.quiz-builder-nav-button:hover,
.quiz-builder-nav-button:focus-visible,
.quiz-builder-nav-button.is-active {
  border-color: rgba(58, 63, 70, 0.36);
  background: #e9f2ef;
  color: var(--primary);
}

.quiz-builder-nav-button.is-invalid {
  border-color: #d46a5b;
  background: #fff0ed;
  color: #7a241b;
}

.quiz-builder-nav-button.is-needs-work:not(.is-invalid) {
  border-color: #f0c56d;
  background: #fff7e6;
  color: #704400;
}

.quiz-builder-nav-button.is-needs-work.is-active:not(.is-invalid),
.quiz-builder-nav-button.is-needs-work:hover:not(.is-invalid),
.quiz-builder-nav-button.is-needs-work:focus-visible:not(.is-invalid) {
  box-shadow: 0 0 0 3px rgba(240, 197, 109, 0.18);
}

.quiz-builder-nav-button.is-invalid.is-active,
.quiz-builder-nav-button.is-invalid:hover,
.quiz-builder-nav-button.is-invalid:focus-visible {
  box-shadow: 0 0 0 3px rgba(212, 106, 91, 0.12);
}

.input-with-suffix {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.input-with-suffix input {
  border: 0;
  box-shadow: none;
}

.input-with-suffix span {
  padding: 0 14px;
  color: var(--muted);
  font-weight: 900;
}

.quiz-builder-question-list {
  display: grid;
  gap: 12px;
}

.quiz-builder-add-question-row {
  display: flex;
  justify-content: flex-start;
  padding-top: 2px;
}

.quiz-builder-question,
.quiz-builder-question-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.quiz-builder-question-card {
  gap: 14px;
}

.quiz-builder-question-card.is-collapsed {
  gap: 8px;
  background: #fffdf9;
}

.quiz-builder-question-card.is-collapsed .quiz-question-label::after {
  content: " collapsed";
  margin-left: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.quiz-builder-question-body {
  display: grid;
  gap: 14px;
}

.quiz-builder-question-card.is-invalid {
  border-color: #d46a5b;
  box-shadow: 0 0 0 3px rgba(212, 106, 91, 0.12);
}

.quiz-builder-question-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.quiz-builder-question-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  padding: 2px 0 0;
}

.quiz-builder-question-summary {
  min-width: 220px;
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.quiz-builder-question-status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.quiz-builder-question-status.ready {
  background: #e8f7ef;
  color: #075f3e;
}

.quiz-builder-question-status.needs-work {
  background: #fff3d9;
  color: #7a4b00;
}

.quiz-builder-card-error {
  margin: -4px 0 0;
  padding: 10px 12px;
  border: 1px solid #efc8c1;
  border-radius: 8px;
  background: #fff0ed;
  color: #7a241b;
  font-weight: 900;
}

.quiz-builder-question-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.quiz-builder-question ol {
  margin: 0;
  padding-left: 22px;
}

.quiz-builder-question li {
  margin: 4px 0;
}

.quiz-builder-question li.correct {
  color: #075f3e;
  font-weight: 900;
}

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

.quiz-builder-choice-row {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr) minmax(150px, auto);
  gap: 10px;
  align-items: end;
}

.quiz-builder-choice-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.quiz-builder-correct-choice {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
  color: var(--ink);
}

.quiz-builder-correct-choice input {
  width: 18px;
  height: 18px;
  accent-color: var(--primary);
}

.quiz-builder-choice-text {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.quiz-builder-choice-text > span {
  display: grid;
  place-items: center;
  height: 42px;
  border-radius: 8px;
  background: var(--panel-tint);
  color: var(--muted);
  font-weight: 900;
}

.quiz-add-choice-button {
  justify-self: start;
}

.quiz-builder-json-drawer {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.quiz-builder-json-drawer summary {
  cursor: pointer;
  color: var(--muted);
  font-weight: 900;
}

.quiz-builder-json-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
}

.quiz-builder-json-status {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.quiz-builder-json-status.is-success {
  color: #075f3e;
}

.quiz-builder-json-status.is-warning {
  color: #7a4b00;
}

.quiz-builder-json-status.is-error {
  color: #7a241b;
}

.lesson-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.lesson-actions form {
  margin: 0;
}

.lesson-comments {
  display: grid;
  gap: 16px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.lesson-comments .section-heading {
  padding: 0;
  border-bottom: 0;
}

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

.lesson-comment {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.lesson-comment.instructor_only {
  border-color: rgba(58, 63, 70, 0.24);
  background: #f7fbfb;
}

.comment-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.comment-meta strong {
  color: var(--ink);
}

.lesson-comment p,
.comment-preview {
  margin: 8px 0 0;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.comment-form,
.filter-form {
  display: grid;
  gap: 12px;
}

.comment-form textarea {
  resize: vertical;
}

.live-session-list {
  display: grid;
  gap: 0;
}

.resource-list {
  display: grid;
  gap: 0;
}

.live-session-item {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
}

.resource-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
}

.live-session-item:last-child {
  border-bottom: 0;
}

.resource-item:last-child {
  border-bottom: 0;
}

.live-session-date {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: var(--panel-tint);
}

.live-session-date strong {
  font-size: 14px;
}

.live-session-date span,
.live-session-copy p {
  color: var(--muted);
  font-size: 13px;
}

.live-session-copy {
  display: grid;
  gap: 6px;
}

.live-session-copy h3,
.live-session-copy p,
.resource-item h3,
.resource-item p {
  margin: 0;
}

.resource-item > div:first-child {
  display: grid;
  gap: 8px;
}

.resource-item p {
  color: var(--muted);
  line-height: 1.5;
}

.course-audio-panel {
  display: grid;
  gap: 18px;
  padding: 24px 30px;
}

.course-audio-panel .section-heading {
  padding: 0;
  border-bottom: 0;
}

.course-audio-panel > p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.course-audio-player-shell {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: #f8f9fb;
}

.course-audio-player-shell audio {
  display: none;
}

.course-audio-controls {
  display: grid;
  grid-template-columns: auto auto minmax(180px, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.course-audio-play-toggle {
  min-width: 74px;
}

.course-audio-time {
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
}

.course-audio-progress {
  width: 100%;
  accent-color: var(--primary);
  cursor: pointer;
}

.course-audio-speed {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}

.course-audio-speed select {
  min-height: 36px;
  padding: 0 30px 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background-color: #fff;
  font-size: 14px;
  font-weight: 900;
}

.course-audio-resume-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.course-audio-chapters {
  display: grid;
  gap: 8px;
}

.course-audio-chapter-button {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 8px 12px;
  width: 100%;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.course-audio-chapter-button:hover,
.course-audio-chapter-button:focus-visible {
  border-color: rgba(58, 63, 70, 0.34);
  background: #f6faf8;
}

.course-audio-chapter-button.is-active {
  border-color: rgba(58, 63, 70, 0.42);
  background: #f6f7f9;
  box-shadow: inset 4px 0 0 var(--primary);
}

.course-audio-chapter-button span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.course-audio-chapter-button strong {
  overflow-wrap: anywhere;
}

.course-audio-now-playing {
  display: none;
  grid-column: 2;
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  color: #0f5d43;
  background: #e1f5ea;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.course-audio-chapter-button.is-active .course-audio-now-playing {
  display: inline-flex;
}

.course-audio-chapter-button small {
  grid-column: 2;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.course-audio-current-preview {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: #f8f9fb;
}

.course-audio-current-preview span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.course-audio-current-preview strong {
  color: var(--ink);
  font-size: 14px;
}

.course-audio-current-preview p {
  margin: 0;
}

.course-audio-current-preview audio {
  width: 100%;
}

.course-audio-import-note {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  color: var(--ink);
  background: #f8f9fb;
}

.course-audio-import-note span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.course-audio-remove-option {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.assessment-item {
  grid-template-columns: minmax(0, 1fr) minmax(148px, auto);
  align-items: start;
}

.assessment-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 100%;
}

.assessment-actions .button {
  min-width: 132px;
  white-space: nowrap;
}

.session-title-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.live-session-actions {
  display: flex;
  justify-content: flex-end;
}

.community-app-shell {
  display: grid;
  grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) minmax(270px, 320px);
  gap: 0;
  width: min(1680px, calc(100% - 40px));
  min-height: calc(100vh - 68px);
  margin: 0 auto;
  padding: 28px 0;
}

.community-app-rail,
.community-feed-panel,
.community-inspector {
  min-width: 0;
}

.community-app-rail {
  position: sticky;
  top: 88px;
  display: grid;
  align-content: start;
  gap: 18px;
  height: calc(100vh - 112px);
  overflow-y: auto;
  padding: 22px;
  border: 1px solid rgba(16, 47, 54, 0.18);
  border-radius: 8px 0 0 8px;
  color: #f8f9fb;
  background:
    linear-gradient(180deg, rgba(16, 47, 54, 0.96), rgba(23, 33, 38, 0.98)),
    var(--primary-deep);
}

.community-course-link {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  color: #f8f9fb;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.community-course-link:hover {
  background: rgba(255, 255, 255, 0.1);
}

.community-group-mark {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 12px;
  color: var(--primary-deep);
  background: #f8f9fb;
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.community-rail-heading {
  display: grid;
  gap: 8px;
}

.community-rail-heading span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.community-rail-heading h1 {
  max-width: none;
  font-size: 28px;
  line-height: 1.08;
}

.community-rail-heading p {
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.5;
}

.community-rail-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.12);
}

.community-rail-stats div {
  display: grid;
  gap: 3px;
  padding: 12px 10px;
  background: rgba(255, 255, 255, 0.06);
}

.community-rail-stats strong {
  font-size: 20px;
}

.community-rail-stats span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.community-rail-nav {
  display: grid;
  gap: 8px;
}

.community-rail-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
}

.community-rail-link:hover,
.community-rail-link.active {
  border-color: rgba(255, 255, 255, 0.18);
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
}

.community-rail-link span {
  display: grid;
  gap: 3px;
}

.community-rail-link small {
  color: rgba(255, 255, 255, 0.64);
  line-height: 1.35;
}

.community-rail-link em {
  min-width: 32px;
  padding: 4px 7px;
  border-radius: 999px;
  color: var(--primary-deep);
  background: #f8f9fb;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  text-align: center;
}

.community-rail-actions {
  display: grid;
  gap: 10px;
}

.community-feed-panel {
  display: grid;
  align-content: start;
  gap: 16px;
  padding: 24px;
  border-block: 1px solid rgba(58, 63, 70, 0.14);
  background: rgba(255, 253, 250, 0.82);
}

.community-feed-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.community-feed-toolbar h2,
.community-feed-toolbar p {
  margin: 0;
}

.community-feed-toolbar h2 {
  font-size: 28px;
}

.community-feed-toolbar p:not(.kicker) {
  margin-top: 6px;
  color: var(--muted);
  line-height: 1.5;
}

.community-composer-panel {
  display: grid;
}

.community-composer-panel .community-post-form,
.community-composer-panel .empty-state {
  margin-top: 0;
}

.community-feed-list {
  display: grid;
  gap: 14px;
}

.community-inspector {
  position: sticky;
  top: 88px;
  display: grid;
  align-content: start;
  gap: 14px;
  height: calc(100vh - 112px);
  overflow-y: auto;
  padding: 0 0 0 16px;
}

.community-inspector-card {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.community-home-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: start;
}

.community-thread-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.community-thread-card {
  display: grid;
  gap: 10px;
  min-height: 170px;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: var(--panel-tint);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, background 0.18s ease;
}

.community-thread-card:hover {
  border-color: rgba(58, 63, 70, 0.36);
  box-shadow: 0 14px 34px rgba(23, 33, 38, 0.1);
  transform: translateY(-1px);
}

.community-thread-card.active {
  border-color: var(--primary);
  background: linear-gradient(180deg, #ffffff 0%, var(--sage) 100%);
  box-shadow: inset 0 0 0 2px rgba(58, 63, 70, 0.08), 0 16px 38px rgba(23, 33, 38, 0.12);
}

.community-thread-card h3,
.community-thread-card p {
  margin: 0;
}

.community-thread-card p {
  color: var(--muted);
  line-height: 1.5;
}

.community-thread-card strong {
  color: var(--primary);
  font-size: 13px;
}

.community-post-stream {
  display: grid;
  gap: 14px;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.community-space-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

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

.community-post:target {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(58, 63, 70, 0.12), 0 18px 42px rgba(23, 33, 38, 0.12);
}

.community-post h3,
.community-post p {
  margin: 0;
}

.community-post p {
  color: var(--text);
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.community-attachment {
  display: grid;
  gap: 10px;
  justify-items: start;
  width: min(100%, 640px);
  max-width: 640px;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.community-attachment-image {
  width: 100%;
  max-height: min(520px, 70vh);
  object-fit: contain;
  border-radius: 6px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  background: #fff;
}

.community-attachment > .table-link {
  max-width: 100%;
  overflow-wrap: anywhere;
  line-height: 1.25;
}

.community-attachment-audio,
.community-attachment-video,
.community-attachment-embed {
  width: 100%;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 6px;
  background: #fff;
}

.community-attachment-audio {
  min-height: 42px;
}

.community-attachment-video,
.community-attachment-embed {
  aspect-ratio: 16 / 9;
}

.community-attachment-video {
  max-height: 260px;
  object-fit: contain;
}

.community-attachment-embed {
  display: block;
}

.community-replies {
  display: grid;
  gap: 10px;
  margin-top: 8px;
  padding: 12px 0 0 14px;
  border-left: 3px solid rgba(58, 63, 70, 0.12);
}

.community-reply-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: 13px;
}

.community-reply {
  display: grid;
  gap: 6px;
  padding: 10px 0 10px 12px;
  border-top: 1px solid var(--line);
}

.community-reply p,
.community-reply-empty {
  margin: 0;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.community-reply-form {
  display: grid;
  gap: 10px;
  padding-top: 6px;
}

.community-reply-form label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.community-reply-form textarea {
  min-height: 88px;
}

.community-post-form {
  margin-top: 6px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: var(--panel-tint);
}

.community-attachment-fields {
  align-items: end;
}

.community-attachment-fields input[type="file"] {
  width: 100%;
  padding: 11px;
  border: 1px dashed rgba(58, 63, 70, 0.28);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
}

.preference-form {
  display: grid;
  gap: 12px;
}

.preference-form .button {
  justify-self: start;
}

.community-post-target {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding-bottom: 2px;
}

.community-post-target strong {
  color: var(--primary);
}

.filter-form {
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: end;
}

.lesson-media {
  width: 100%;
  max-height: 420px;
  border-radius: 8px;
}

.lesson-video-media {
  background: #0f1f22;
}

.lesson-audio-shell {
  width: 100%;
  max-width: 860px;
  padding: 8px 10px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 18px;
  background: #eef5f2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.lesson-audio-media {
  display: block;
  max-height: none;
  height: 42px;
  border-radius: 999px;
  background: transparent;
}

.lesson-audio-media::-webkit-media-controls-enclosure {
  border-radius: 999px;
  background-color: #eef5f2;
}

.lesson-image-link {
  display: block;
  max-width: min(100%, 860px);
}

.lesson-image-media {
  display: block;
  max-height: min(680px, 75vh);
  object-fit: contain;
  border: 1px solid rgba(58, 63, 70, 0.12);
  background: #fff;
}

.access-card {
  margin-top: 16px;
}

.learner-test-handoff {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.learner-test-handoff.next {
  border-color: rgba(201, 145, 45, 0.34);
  background: #ffffff;
}

.learner-test-copy {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}

.learner-test-copy div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.learner-test-copy strong {
  color: var(--ink);
  font-size: 17px;
}

.learner-test-copy p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.learner-test-copy small {
  color: var(--primary);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.learner-test-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  min-width: 220px;
}

.enrollment-form {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.course-rail {
  padding: 0 0 18px;
}

.course-rail .section-heading {
  padding: 18px;
}

.course-rail .learner-module {
  padding: 14px 18px;
}

.course-rail .progress-track {
  margin: 0 18px;
}

.course-card {
  display: grid;
  gap: 14px;
  min-height: 210px;
  border-color: rgba(58, 63, 70, 0.14);
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.96), rgba(248, 251, 248, 0.96)),
    linear-gradient(135deg, var(--sage), var(--accent-soft));
  box-shadow: var(--shadow-card);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.course-card a {
  font-weight: 800;
  color: var(--primary);
  text-decoration: none;
}

.course-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-self: end;
}

.course-card:hover {
  border-color: rgba(197, 138, 58, 0.42);
  box-shadow: var(--shadow-soft);
  transform: translateY(-2px);
}

/* Public course-card chips — migrated off leftover gold/teal to redesign tokens
   (these four survived the de-teal sweep and were rendering brown-on-blue). */
.course-status {
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--accent);
  background: var(--accent-soft);
  font-size: 12px;
  font-weight: 800;
}

.course-category {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.course-category.library {
  color: var(--accent);
  background: var(--accent-soft);
}

.course-duration-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  width: fit-content;
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.course-category.hero-chip {
  display: inline-flex;
  margin: 8px 0 16px;
  margin-right: 8px;
}

.course-duration-pill.hero-chip {
  margin: 8px 0 16px;
  margin-right: 8px;
}

.library-storefront,
.library-course-detail {
  display: grid;
  gap: 22px;
}

.library-hero,
.library-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 28px;
  align-items: center;
  padding: 32px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.98), rgba(247, 252, 250, 0.98)),
    linear-gradient(135deg, rgba(58, 63, 70, 0.13), rgba(197, 138, 58, 0.16));
  box-shadow: var(--shadow-soft);
}

.library-hero h1,
.library-detail-hero h1 {
  max-width: 840px;
  font-size: 48px;
  line-height: 1;
}

.library-hero p,
.library-detail-hero p {
  max-width: 760px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.5;
}

.library-hero-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 22px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.8);
}

.library-hero-panel span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.library-hero-panel strong {
  margin-bottom: 8px;
  color: var(--ink);
  font-size: 23px;
  line-height: 1.15;
}

.library-section,
.library-section-card,
.library-offer-panel {
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.library-course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 360px));
  gap: 16px;
  align-items: stretch;
  justify-content: start;
  padding: 22px;
}

.library-course-grid > .empty-state {
  grid-column: 1 / -1;
}

.library-course-card {
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  min-width: 0;
  min-height: 420px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 14px 30px rgba(23, 33, 38, 0.06);
}

.library-course-card-cover {
  display: block;
  min-height: 180px;
  background: var(--sage);
}

.library-course-cover {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--sage);
}

.library-course-cover.large {
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  box-shadow: 0 16px 32px rgba(23, 33, 38, 0.12);
}

.library-course-cover.fallback {
  display: grid;
  place-items: center;
  color: var(--primary);
  background: linear-gradient(135deg, var(--sage), var(--accent-soft));
  font-size: 22px;
  font-weight: 900;
}

.library-course-card-copy {
  display: grid;
  gap: 12px;
  align-content: space-between;
  min-width: 0;
  padding: 18px;
}

.library-course-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.library-course-card h2 a {
  color: var(--ink);
  text-decoration: none;
}

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

.library-course-card-outcome {
  display: grid;
  gap: 5px;
  padding: 10px 12px;
  border-left: 3px solid var(--accent);
  background: rgba(246, 242, 230, 0.62);
}

.library-course-card-outcome span {
  color: var(--primary);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.library-course-card-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.library-course-card-facts div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(248, 251, 248, 0.82);
}

.library-course-card-facts dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.library-course-card-facts dd {
  overflow-wrap: anywhere;
  margin: 5px 0 0;
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.15;
}

.library-course-card-counts {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.library-course-card-note {
  padding: 9px 10px;
  border-radius: 8px;
  background: rgba(218, 239, 226, 0.72);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.library-bundle-section {
  display: grid;
  gap: 16px;
}

.library-bundle-card {
  display: grid;
  gap: 18px;
  padding: 24px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.98), rgba(248, 251, 248, 0.98)),
    linear-gradient(135deg, rgba(58, 63, 70, 0.09), rgba(197, 138, 58, 0.13));
  box-shadow: var(--shadow-card);
}

.library-bundle-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.library-bundle-card-header h2 {
  margin: 0;
}

.library-bundle-card-header p {
  max-width: 760px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

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

.library-bundle-signals div {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.7);
}

.library-bundle-signals dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.library-bundle-signals dd {
  margin: 6px 0 0;
  color: var(--ink);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.library-bundle-roadmap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 12px;
}

.library-bundle-item {
  display: grid;
  gap: 12px;
  align-content: space-between;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.86);
}

.library-bundle-item.active {
  border-color: rgba(30, 123, 83, 0.28);
  background: rgba(235, 248, 240, 0.82);
}

.library-bundle-item h3 {
  margin: 10px 0 6px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.15;
}

.library-bundle-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.library-bundle-item strong {
  color: var(--primary);
  font-size: 13px;
  line-height: 1.2;
}

.tenant-home {
  display: grid;
  gap: 22px;
}

.public-offers-shell {
  display: grid;
  gap: 22px;
}

.tenant-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 28px;
  align-items: stretch;
  padding: 32px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.98), rgba(248, 251, 248, 0.98)),
    linear-gradient(135deg, rgba(58, 63, 70, 0.12), rgba(197, 138, 58, 0.14));
  box-shadow: var(--shadow-soft);
}

.public-offers-hero {
  grid-template-columns: minmax(0, 760px);
}

.tenant-home-hero-copy {
  display: grid;
  align-content: center;
  gap: 18px;
  min-width: 0;
}

.tenant-home-hero h1 {
  max-width: 820px;
  font-size: 56px;
  line-height: 0.98;
}

.tenant-home-hero p {
  max-width: 760px;
  color: var(--muted);
  font-size: 19px;
  line-height: 1.5;
}

.tenant-home-hero-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 22px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 14px 30px rgba(23, 33, 38, 0.06);
}

.tenant-home-logo {
  width: 62px;
  height: 62px;
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 10px 22px rgba(23, 33, 38, 0.12);
}

.tenant-home-logo.fallback {
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  font-size: 24px;
  font-weight: 900;
}

.tenant-home-hero-panel span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.tenant-home-hero-panel strong {
  overflow-wrap: anywhere;
  margin-bottom: 8px;
  color: var(--ink);
  font-size: 24px;
  line-height: 1.1;
}

.tenant-home-section,
.tenant-home-paths {
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.tenant-home-course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 16px;
  padding: 22px;
}

.tenant-home-course-grid > .empty-state {
  grid-column: 1 / -1;
}

.tenant-home-course-card {
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  min-width: 0;
  min-height: 410px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 14px 30px rgba(23, 33, 38, 0.06);
}

.tenant-home-course-cover {
  display: block;
  min-height: 170px;
  color: var(--primary);
  text-decoration: none;
  background: var(--sage);
}

.tenant-home-course-cover img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.tenant-home-course-fallback {
  display: grid;
  place-items: center;
  min-height: 190px;
  background:
    linear-gradient(135deg, rgba(58, 63, 70, 0.13), rgba(197, 138, 58, 0.28)),
    var(--sage);
  font-size: 44px;
  font-weight: 900;
  letter-spacing: 0;
}

.tenant-home-course-copy {
  display: grid;
  gap: 12px;
  align-content: space-between;
  min-width: 0;
  padding: 18px;
}

.tenant-home-course-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tenant-home-course-card h2 a {
  color: var(--ink);
  text-decoration: none;
}

.tenant-home-course-card h2 a:hover {
  color: var(--primary);
}

.tenant-home-course-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.tenant-home-source-note {
  padding: 9px 10px;
  border-radius: 8px;
  background: rgba(218, 239, 226, 0.72);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.tenant-home-offer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 16px;
  padding: 22px;
}

.tenant-home-offer-card {
  display: grid;
  gap: 14px;
  align-content: space-between;
  min-width: 0;
  min-height: 260px;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.98), rgba(249, 252, 250, 0.98)),
    var(--panel-tint);
  box-shadow: 0 14px 30px rgba(23, 33, 38, 0.06);
}

.tenant-home-offer-cover {
  display: block;
  overflow: hidden;
  min-height: 132px;
  border-radius: 8px;
  color: var(--primary);
  text-decoration: none;
  background: var(--sage);
}

.tenant-home-offer-cover img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.tenant-home-offer-cover .tenant-home-course-fallback {
  min-height: 150px;
  font-size: 34px;
}

.tenant-home-offer-heading {
  display: grid;
  gap: 9px;
}

.tenant-home-offer-heading span {
  width: max-content;
  max-width: 100%;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(218, 239, 226, 0.82);
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.tenant-home-offer-card h3 {
  font-size: 22px;
  line-height: 1.15;
}

.tenant-home-offer-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.tenant-home-offer-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.tenant-home-offer-facts div {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(248, 251, 248, 0.82);
}

.tenant-home-offer-facts span,
.tenant-home-offer-course-list > span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.tenant-home-offer-facts strong {
  display: block;
  overflow-wrap: anywhere;
  margin-top: 6px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
}

.tenant-home-offer-course-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.tenant-home-offer-card ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  color: var(--muted);
  list-style: none;
}

.tenant-home-offer-card li {
  overflow-wrap: anywhere;
  padding-left: 12px;
  border-left: 3px solid rgba(197, 138, 58, 0.48);
  line-height: 1.35;
}

.tenant-home-offer-card .button {
  width: max-content;
  max-width: 100%;
}

.tenant-home-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}

.tenant-home-paths article {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 22px;
  border-right: 1px solid rgba(58, 63, 70, 0.12);
}

.tenant-home-paths article:last-child {
  border-right: 0;
}

.tenant-home-paths span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: #fff;
  background: var(--primary);
  font-size: 15px;
  font-weight: 900;
}

.tenant-home-paths h2 {
  font-size: 20px;
}

.tenant-home-paths p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.breadcrumb-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-weight: 800;
}

.breadcrumb-nav a {
  color: var(--primary);
  text-decoration: none;
}

.breadcrumb-nav a:hover {
  text-decoration: underline;
}

.library-detail-metrics {
  margin-bottom: 0;
}

.library-detail-overview {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.library-detail-overview article {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
}

.library-detail-overview span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.library-detail-overview strong {
  color: var(--ink);
  font-size: 16px;
  line-height: 1.25;
}

.library-detail-pathways {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.library-detail-pathway {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
}

.library-detail-pathway span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.library-detail-pathway h2 {
  margin: 0;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.library-detail-pathway p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.library-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.75fr);
  gap: 20px;
}

.library-module-list,
.library-offer-list {
  display: grid;
  gap: 12px;
  padding: 20px;
}

.library-module-preview,
.library-offer-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(248, 251, 248, 0.72);
}

.library-module-preview {
  grid-template-columns: minmax(180px, 0.55fr) minmax(0, 1fr);
}

.library-module-preview h3,
.library-offer-card h3 {
  margin: 0;
}

.library-module-preview p,
.library-offer-card p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.library-module-preview ol {
  margin: 0;
  padding-left: 20px;
  color: var(--ink);
  line-height: 1.6;
}

.library-offer-card {
  align-items: start;
}

.metrics {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  margin-bottom: 16px;
}

.metrics > div {
  display: grid;
  gap: 8px;
  padding: 18px;
}

.metrics strong {
  font-size: 22px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.domain-metrics > div {
  min-width: 0;
}

.domain-metrics .metric-long-value {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 24px;
  line-height: 1.15;
}

.domain-dns-handoff-card .section-heading p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.domain-dns-handoff-table {
  min-width: 1180px;
}

.domain-dns-handoff-table td {
  vertical-align: top;
}

.domain-dns-handoff-table code {
  display: inline-block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.sales-workspace-topbar,
.operations-workspace-topbar,
.people-workspace-topbar,
.build-workspace-topbar,
.community-workspace-topbar,
.settings-workspace-topbar,
.system-owner-workspace-topbar {
  margin-bottom: 12px;
}

.sales-workspace-actions,
.operations-workspace-actions,
.people-workspace-actions,
.build-workspace-actions,
.community-workspace-actions,
.settings-workspace-actions,
.system-owner-workspace-actions {
  align-self: start;
}

.sales-workspace-nav,
.operations-workspace-nav,
.people-workspace-nav,
.build-workspace-nav,
.community-workspace-nav,
.settings-workspace-nav,
.system-owner-workspace-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -4px 0 18px;
  padding: 6px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.72);
}

.sales-workspace-nav a,
.operations-workspace-nav a,
.people-workspace-nav a,
.build-workspace-nav a,
.community-workspace-nav a,
.settings-workspace-nav a,
.system-owner-workspace-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 6px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.sales-workspace-nav a:hover,
.sales-workspace-nav a.active,
.operations-workspace-nav a:hover,
.operations-workspace-nav a.active,
.people-workspace-nav a:hover,
.people-workspace-nav a.active,
.build-workspace-nav a:hover,
.build-workspace-nav a.active,
.community-workspace-nav a:hover,
.community-workspace-nav a.active,
.settings-workspace-nav a:hover,
.settings-workspace-nav a.active,
.system-owner-workspace-nav a:hover,
.system-owner-workspace-nav a.active {
  color: var(--ink);
  background: var(--sage);
}

.sales-workspace-nav a.active,
.operations-workspace-nav a.active,
.people-workspace-nav a.active,
.build-workspace-nav a.active,
.community-workspace-nav a.active,
.settings-workspace-nav a.active,
.system-owner-workspace-nav a.active {
  box-shadow: inset 0 0 0 1px rgba(58, 63, 70, 0.12);
}

.sales-metrics,
.operations-metrics,
.people-metrics,
.build-metrics,
.community-metrics,
.settings-metrics,
.system-owner-metrics {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.export-metrics {
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}

.payment-metrics strong {
  overflow-wrap: anywhere;
  font-size: 24px;
  line-height: 1.15;
}

.sales-table-card,
.operations-table-card,
.people-table-card,
.build-table-card,
.community-table-card,
.settings-table-card,
.system-owner-table-card {
  display: grid;
  gap: 16px;
}

.sales-workspace-table,
.operations-workspace-table,
.people-workspace-table,
.build-workspace-table,
.community-workspace-table,
.settings-workspace-table,
.system-owner-workspace-table {
  min-width: 1040px;
}

.domains-table,
.system-organizations-table {
  min-width: 1360px;
}

.orders-table {
  min-width: 1160px;
}

.upsells-table {
  min-width: 1120px;
}

.audit-log-table {
  min-width: 1280px;
}

.learners-table,
.learner-access-table {
  min-width: 1180px;
}

.contacts-table,
.intake-forms-table {
  min-width: 1160px;
}

.booking-pages-table {
  min-width: 1240px;
}

.community-posts-table,
.community-replies-table {
  min-width: 1320px;
}

.community-access-table {
  min-width: 1120px;
}

.community-spaces-table {
  min-width: 960px;
}

.community-activity-table,
.community-members-table {
  min-width: 760px;
}

.course-categories-table,
.course-import-table {
  min-width: 980px;
}

.lesson-video-handoff-panel {
  display: grid;
  gap: 10px;
  border: 1px solid rgba(31, 138, 112, 0.22);
  border-radius: 8px;
  background: #f6fbf8;
  padding: 12px;
}

.lesson-video-handoff-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
}

.lesson-video-handoff-heading h2 {
  margin: 0;
}

.lesson-video-handoff-heading span,
.lesson-video-handoff-actions span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 850;
}

.lesson-video-handoff-template {
  min-height: 220px;
  border: 1px solid rgba(31, 138, 112, 0.22);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  padding: 10px;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1.42;
  resize: vertical;
}

.lesson-video-handoff-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.lesson-video-handoff-actions span {
  margin-right: auto;
}

.course-resources-table {
  min-width: 1080px;
}

.media-library-summary-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 20px;
  align-items: start;
}

.media-library-summary-card h2 {
  margin: 0 0 8px;
  font-size: clamp(26px, 3vw, 40px);
  letter-spacing: 0;
}

.media-library-summary-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.media-library-summary-facts div {
  display: grid;
  gap: 6px;
  min-height: 96px;
  border: 1px solid rgba(31, 138, 112, 0.18);
  border-radius: 8px;
  background: #f6fbf8;
  padding: 14px;
}

.media-library-summary-facts span,
.media-library-facts dt {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
  text-transform: uppercase;
}

.media-library-summary-facts strong {
  color: var(--ink);
  font-size: 1.1rem;
  line-height: 1.2;
}

.media-library-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
}

.media-library-card {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow-card);
}

.media-library-preview {
  display: grid;
  min-height: 210px;
  aspect-ratio: 16 / 9;
  place-items: center;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: #eef5f2;
}

.media-library-preview.image img,
.media-library-preview.video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.media-library-preview.video video {
  background: #102b31;
}

.media-library-preview.audio {
  background: linear-gradient(135deg, #f8fbf7, #e9f3ef);
  padding: 18px;
}

.media-library-preview.audio > div {
  display: grid;
  width: min(100%, 520px);
  gap: 14px;
}

.media-library-preview.audio span {
  color: var(--deep);
  font-weight: 850;
  overflow-wrap: anywhere;
}

.media-library-preview.audio audio {
  width: 100%;
}

.media-library-placeholder {
  display: grid;
  width: calc(100% - 32px);
  min-height: 150px;
  place-items: center;
  gap: 8px;
  border: 1px dashed rgba(58, 63, 70, 0.24);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
  color: var(--muted);
  padding: 18px;
  text-align: center;
}

.media-library-placeholder strong {
  color: var(--deep);
  font-size: 1.35rem;
}

.media-library-placeholder span {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.media-library-card-body {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.media-library-card-body h2 {
  margin: 0;
  font-size: 1.25rem;
  letter-spacing: 0;
}

.media-library-card-pills,
.media-library-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.media-library-facts {
  display: grid;
  gap: 8px;
  margin: 0;
}

.media-library-facts div {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.media-library-facts dd {
  margin: 0;
  color: var(--ink);
  font-weight: 750;
  overflow-wrap: anywhere;
}

.media-library-empty {
  grid-column: 1 / -1;
}

.course-assessments-table,
.live-sessions-table {
  min-width: 1320px;
}

.course-comments-table {
  min-width: 1320px;
}

.assessment-submissions-table,
.course-comments-module-table {
  min-width: 920px;
}

.credentials-issued-table {
  min-width: 1320px;
}

.enrollments-table {
  min-width: 980px;
}

.credential-templates-table,
.learner-credentials-table,
.learner-email-table,
.tags-table,
.booking-requests-table,
.course-enrollments-table {
  min-width: 760px;
}

.report-grid table {
  min-width: 760px;
}

.report-split table {
  min-width: 560px;
}

.sales-workspace-table td:first-child span,
.sales-workspace-table td:nth-child(3) span,
.operations-workspace-table td:first-child span,
.people-workspace-table td:first-child span,
.build-workspace-table td:first-child span,
.community-workspace-table td:first-child span,
.community-workspace-table td:nth-child(2) span,
.settings-workspace-table td:first-child span,
.system-owner-workspace-table td:first-child span,
.audit-log-table td:nth-child(2) span,
.audit-log-table td:nth-child(4) span {
  display: block;
  margin-top: 3px;
}

.dashboard-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 420px;
  gap: 18px;
  align-items: start;
}

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

.dashboard-metrics > div {
  display: grid;
  gap: 6px;
  min-height: 92px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow-card);
}

.dashboard-metrics span,
.learning-progress span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.dashboard-metrics strong {
  font-size: 30px;
}

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

.learning-card {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow-card);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.learning-cover {
  overflow: hidden;
  min-height: 150px;
  border-radius: 8px;
  background: var(--sage);
}

.learning-card:hover {
  border-color: rgba(58, 63, 70, 0.22);
  box-shadow: var(--shadow-soft);
  transform: translateY(-2px);
}

.learning-cover img,
.learning-cover .course-cover-fallback {
  width: 100%;
  height: 100%;
  min-height: 150px;
  object-fit: cover;
}

.course-cover-fallback.compact {
  font-size: 20px;
}

.learning-copy {
  display: grid;
  gap: 14px;
  align-content: start;
}

.learning-copy h2 {
  margin-top: 10px;
}

.learning-copy h2 a {
  text-decoration: none;
}

.learning-copy p {
  max-width: 720px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.learning-progress {
  display: grid;
  gap: 8px;
}

.certificate-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.certificate-paper {
  display: grid;
  justify-items: center;
  min-height: 620px;
  padding: 58px;
  border: 10px double var(--accent);
  border-radius: 8px;
  color: #f7f0e2;
  background: linear-gradient(160deg, var(--primary-deep), #142428 72%, #1f3739);
  text-align: center;
  box-shadow: var(--shadow-soft), inset 0 0 0 2px rgba(255, 255, 255, 0.2);
}

.certificate-paper.locked {
  filter: grayscale(0.45);
  opacity: 0.72;
}

.certificate-paper h1 {
  margin-top: 22px;
  color: #fff;
  font-size: 86px;
}

.certificate-paper h2 {
  margin-top: -4px;
  color: #f7f0e2;
  font-size: 30px;
}

.certificate-paper strong {
  display: block;
  margin: 18px 0;
  color: var(--accent);
  font-size: 70px;
  line-height: 1;
}

.certificate-paper h3 {
  color: var(--accent);
  font-size: 22px;
}

.certificate-presented {
  margin-top: 54px;
}

.certificate-paper p {
  max-width: 560px;
  line-height: 1.6;
}

.badge-paper {
  display: grid;
  justify-items: center;
  min-height: 520px;
  padding: 54px;
  border: 8px solid var(--accent);
  border-radius: 28px;
  color: #f7f0e2;
  background: linear-gradient(145deg, var(--primary), var(--primary-deep) 72%);
  text-align: center;
  box-shadow: var(--shadow-soft), inset 0 0 0 2px rgba(255, 255, 255, 0.14);
}

.badge-paper.locked {
  filter: grayscale(0.45);
  opacity: 0.72;
}

.badge-paper h1 {
  max-width: 620px;
  margin-top: 24px;
  color: #fff;
  font-size: 58px;
}

.badge-paper strong {
  display: block;
  margin: 18px 0;
  color: var(--accent);
  font-size: 52px;
  line-height: 1.05;
}

.badge-paper h3 {
  color: var(--accent);
  font-size: 24px;
}

.badge-presented {
  margin-top: 42px;
}

.certificate-footer {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  margin-top: auto;
  padding-top: 42px;
  border-top: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font-weight: 800;
}

.certificate-sidebar {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 18px;
  padding: 22px;
}

.achievement-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.achievement-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(197, 138, 58, 0.34);
  border-radius: 999px;
  background: rgba(197, 138, 58, 0.12);
  color: var(--primary-deep);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.achievement-pill.badge {
  border-color: rgba(38, 114, 91, 0.3);
  background: rgba(38, 114, 91, 0.12);
}

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

.credential-mini-list h3 {
  margin: 0;
  font-size: 16px;
}

.credential-mini-card {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
}

.credential-mini-card strong {
  font-size: 15px;
}

.credential-mini-card small {
  color: var(--muted);
}

.launch-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 22px;
  border: 1px solid rgba(197, 138, 58, 0.28);
  border-left: 5px solid var(--accent);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 253, 250, 0.96), rgba(248, 251, 248, 0.96)),
    linear-gradient(135deg, var(--accent-soft), var(--sage));
  box-shadow: var(--shadow-card);
}

.launch-card.ready {
  grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr) auto;
  align-items: start;
}

.launch-copy {
  display: grid;
  gap: 8px;
}

.launch-copy p {
  max-width: 700px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.launch-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.launch-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 800;
}

.setup-steps {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.setup-steps li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 34px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
}

.setup-steps span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  font-size: 12px;
}

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

.onboarding-card {
  display: grid;
  gap: 24px;
}

.setup-preview {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.setup-preview p {
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.recommendation-panel {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
  padding: 22px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.recommendation-panel.compact {
  margin-bottom: 0;
  padding: 18px;
  box-shadow: none;
}

.recommendation-panel .section-heading p {
  max-width: 780px;
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.recommendation-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.recommendation-signals span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 999px;
  color: var(--primary);
  background: var(--panel-tint);
  font-size: 12px;
  font-weight: 800;
}

.recommendation-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
}

.recommendation-panel.compact .recommendation-grid {
  grid-template-columns: 1fr;
}

.recommendation-item {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-height: 138px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.recommendation-status {
  display: grid;
  place-items: center;
  min-height: 28px;
  border-radius: 999px;
  color: #6f4d12;
  background: var(--accent-soft);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.recommendation-item h3 {
  margin: 0;
  font-size: 16px;
}

.recommendation-item p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.recommendation-item .button {
  grid-column: 2;
  justify-self: start;
  margin-top: 4px;
}

.onboarding-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  padding-top: 8px;
}

.setup-checklist {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
  padding: 22px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.setup-progress {
  display: grid;
  gap: 5px;
  min-width: 220px;
  color: var(--primary);
  font-size: 13px;
  font-weight: 800;
  text-align: right;
}

.setup-progress span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.setup-progress strong {
  color: var(--primary);
  font-size: 14px;
}

.setup-progress small {
  max-width: 320px;
  justify-self: end;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.setup-progress div {
  overflow: hidden;
  height: 8px;
  border-radius: 999px;
  background: #e0e8e4;
}

.setup-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--primary), var(--accent));
}

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

.setup-task {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 92px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.setup-task.done {
  background: #eef8f2;
}

.setup-task:hover {
  border-color: rgba(58, 63, 70, 0.22);
  box-shadow: var(--shadow-card);
  transform: translateY(-1px);
}

.setup-check {
  display: grid;
  place-items: center;
  min-height: 34px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 800;
}

.setup-task.done .setup-check {
  color: var(--success);
  background: #dff4e7;
}

.setup-task h3 {
  margin: 0;
  font-size: 16px;
}

.setup-task p {
  margin: 5px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

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

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(16, 47, 54, 0.56);
}

.tutorial-modal {
  display: grid;
  gap: 18px;
  width: min(520px, 100%);
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow-soft);
}

.tutorial-modal p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.modal-close {
  min-height: 34px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.tutorial-status {
  padding: 12px 14px;
  border-radius: 6px;
  color: #61450e;
  background: var(--accent-soft);
  font-weight: 800;
}

.tutorial-status.done {
  color: #1e5036;
  background: #e9f7ef;
}

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

.branding-grid {
  align-items: start;
}

.color-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
}

.color-control input[type="color"] {
  width: 100%;
  min-height: 46px;
  padding: 4px;
}

.color-control code {
  min-width: 86px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
  color: var(--muted);
  text-align: center;
}

.brand-preview-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--sage), rgba(255, 253, 250, 0.95));
}

.brand-preview-logo {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  overflow: hidden;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  font-size: 28px;
  font-weight: 900;
}

.brand-preview-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.brand-preview-logo.small {
  width: 48px;
  height: 48px;
  font-size: 19px;
}

.brand-preview-card h3,
.brand-preview-card p {
  margin: 0;
}

.brand-preview-card h3 {
  font-size: 22px;
}

.brand-preview-card p {
  color: var(--muted);
  line-height: 1.5;
}

.brand-preview-card .button {
  margin-top: 12px;
}

.branding-public-preview-card {
  display: grid;
  gap: 14px;
}

.branding-home-preview {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--sage), rgba(255, 253, 250, 0.96));
}

.branding-home-preview-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

.branding-home-preview h3,
.branding-home-preview p {
  margin: 0;
}

.branding-home-preview h3 {
  font-size: 24px;
  line-height: 1.12;
}

.branding-home-preview p {
  color: var(--muted);
  line-height: 1.5;
}

.branding-home-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.branding-public-link-list {
  display: grid;
  gap: 8px;
}

.branding-public-link-list a {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #ffffff;
  color: inherit;
  text-decoration: none;
}

.branding-public-link-list a:hover {
  border-color: rgba(58, 63, 70, 0.28);
  background: #f8f9fb;
}

.branding-public-link-list span {
  min-width: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  overflow-wrap: anywhere;
}

.form-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.admin-topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.admin-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  max-width: 820px;
}

.admin-actions.stacked {
  align-items: stretch;
  flex-direction: column;
}

.account-switcher {
  display: inline-flex;
  align-items: end;
  gap: 8px;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.92);
  box-shadow: 0 8px 24px rgba(19, 40, 45, 0.06);
}

.account-switcher.single {
  align-items: center;
  min-height: 44px;
}

.account-switcher label {
  display: grid;
  gap: 5px;
  min-width: 260px;
  color: var(--text);
  font-weight: 800;
}

.account-switcher span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.account-switcher strong {
  color: var(--primary);
}

.account-switcher select {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  font: inherit;
  font-size: 14px;
}

.button.small {
  min-height: 34px;
  padding-inline: 10px;
  font-size: 13px;
}

.button.tiny {
  min-height: 28px;
  padding: 6px 9px;
  border-radius: 6px;
  font-size: 12px;
}

.system-summary-card {
  margin-bottom: 16px;
}

.course-workspace-course-search {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(150px, 190px) minmax(160px, 210px) auto;
  align-items: end;
  gap: 12px;
  margin: 8px 0 16px;
}

.course-workspace-course-search label {
  display: grid;
  gap: 6px;
}

.course-workspace-course-search label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.course-workspace-course-search .form-actions {
  margin: 0;
  justify-content: flex-end;
}

.owner-workbench-course-search {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) auto;
  align-items: end;
  gap: 12px;
  margin: 8px 0 16px;
}

.owner-workbench-course-search label {
  display: grid;
  gap: 6px;
}

.owner-workbench-course-search label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.owner-workbench-course-search .form-actions {
  margin: 0;
  justify-content: flex-end;
}

.system-owner-directory-search {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(180px, 240px) auto;
  align-items: end;
  gap: 12px;
}

.system-owner-directory-search label {
  display: grid;
  gap: 6px;
}

.system-owner-directory-search label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.system-owner-directory-search .form-actions {
  margin: 0;
  justify-content: flex-end;
}

.system-owner-directory-filters {
  margin: -4px 0 2px;
}

.system-owner-directory-filters .filter-chip span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  min-height: 22px;
  margin-left: 8px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(58, 63, 70, 0.1);
  color: inherit;
  font-size: 12px;
}

.system-owner-directory-filters .filter-chip.active span,
.system-owner-directory-filters .filter-chip:hover span {
  background: rgba(255, 255, 255, 0.2);
}

.system-owner-signals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.system-owner-signals > div {
  min-height: 78px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f6faf7;
}

.system-owner-signals span,
.system-org-meta,
.system-status-line {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.system-owner-signals strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 26px;
}

.starter-library-bundle-signals strong {
  font-size: 20px;
  line-height: 1.15;
}

.curriculum-library-bundle-card {
  border-left: 5px solid var(--primary);
}

.starter-library-next-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(197, 138, 58, 0.34);
  border-radius: 8px;
  background: linear-gradient(135deg, #fffaf1, #f8f9fb);
}

.starter-library-next-action.complete {
  border-color: rgba(25, 114, 78, 0.24);
  background: #f5fbf7;
}

.starter-library-next-action > div {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.starter-library-next-action .status-pill,
.starter-library-next-action .starter-track-focus {
  justify-self: start;
}

.starter-library-next-action h3,
.starter-library-next-action p {
  margin: 0;
}

.starter-library-next-action h3 {
  font-size: 22px;
}

.starter-library-next-action p {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.starter-library-source-list {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(58, 63, 70, 0.12);
}

.starter-library-source-list .section-heading {
  margin-bottom: 12px;
}

.starter-library-source-list .section-heading h3 {
  margin: 0;
  font-size: 22px;
}

.starter-library-source-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.starter-library-source-card {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: #fbfdfb;
}

.starter-library-source-card h3,
.starter-library-source-card p {
  margin: 0;
}

.starter-library-source-card p {
  color: var(--muted);
}

.starter-library-source-card.missing {
  border-color: rgba(122, 47, 34, 0.2);
  background: #fff8f6;
}

.starter-library-source-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
  gap: 10px;
  margin: 0;
}

.starter-library-source-facts div {
  min-height: 58px;
  padding: 10px;
  border: 1px solid rgba(58, 63, 70, 0.1);
  border-radius: 8px;
  background: #f3f8f6;
}

.starter-library-source-facts dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.starter-library-source-facts dd {
  margin: 4px 0 0;
  color: var(--ink);
  font-weight: 800;
}

.starter-library-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.system-org-meta {
  margin-top: 4px;
}

.system-status-line {
  margin-top: 7px;
}

.inline-admin-form {
  margin: 0;
}

.notice,
.alert {
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-weight: 700;
}

.notice {
  border-color: rgba(25, 114, 78, 0.18);
  color: var(--success);
  background: #e9f7ef;
}

.notice.error {
  border-color: rgba(122, 47, 34, 0.18);
  color: #7d251f;
  background: #fdebe8;
}

.preview-mode-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
  padding: 16px 18px;
  border: 1px solid rgba(215, 153, 34, 0.38);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: #fff8eb;
  box-shadow: 0 10px 28px rgba(23, 33, 38, 0.06);
}

.preview-mode-banner .kicker {
  color: #805611;
}

.preview-mode-banner h2 {
  margin: 3px 0 4px;
  font-size: 22px;
}

.preview-mode-banner p {
  margin: 0;
  color: var(--muted);
}

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

.preview-readonly-panel {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: var(--panel-tint);
  color: var(--muted);
}

.preview-readonly-panel strong {
  color: var(--ink);
}

.preview-readonly-panel p {
  margin: 0;
}

.alert {
  border-color: rgba(122, 47, 34, 0.18);
  color: #7d251f;
  background: #fdebe8;
}

.auth-card {
  width: min(440px, 100%);
}

.auth-card h1 {
  margin-bottom: 24px;
  font-size: 40px;
}

.auth-help {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.auth-help a {
  color: var(--ink);
  font-weight: 800;
}

.auth-recovery-card .muted {
  margin-top: -12px;
  margin-bottom: 6px;
  line-height: 1.45;
}

.admin-form {
  display: grid;
  gap: 16px;
}

.field-group {
  display: grid;
  gap: 14px;
}

.field-group + .field-group {
  margin-top: 28px;
}

.form-grid {
  display: grid;
  gap: 12px;
}

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

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

.form-grid.four {
  grid-template-columns: 1.4fr 0.8fr 0.8fr auto;
  align-items: end;
}

label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
}

.field-hint {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.password-field {
  position: relative;
}

.password-field input {
  padding-right: 44px;
}

.password-toggle {
  position: absolute;
  top: 50%;
  right: 4px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}

.password-toggle:hover,
.password-toggle:focus-visible {
  background: rgba(58, 63, 70, 0.08);
  color: var(--ink);
}

.password-toggle svg {
  width: 19px;
  height: 19px;
}

.enrollment-context-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.enrollment-context-card > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.enrollment-context-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.enrollment-context-card strong {
  color: var(--ink);
  font-size: 19px;
}

.enrollment-context-card p {
  max-width: 72ch;
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

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

.editor-breadcrumbs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-weight: 800;
}

.editor-breadcrumbs a {
  color: var(--primary);
  text-decoration: none;
}

.editor-breadcrumbs a:hover {
  text-decoration: underline;
}

.current-media-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.lesson-editor-media-preview {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
}

.lesson-editor-media-preview span,
.lesson-upload-preview-copy span {
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.lesson-editor-media-preview img,
.lesson-editor-media-preview video {
  display: block;
  width: 100%;
  max-height: 360px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #102b31;
  object-fit: contain;
}

.lesson-editor-media-preview audio {
  display: block;
  width: 100%;
}

.lesson-editor-media-preview.compact {
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #ffffff;
}

.current-media-panel strong {
  display: block;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.35;
}

.current-media-panel .checkbox-row {
  grid-column: 1 / -1;
}

.lesson-upload-preview {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.lesson-upload-preview[hidden] {
  display: none;
}

.lesson-upload-preview-frame {
  display: grid;
  min-height: 220px;
  aspect-ratio: 16 / 9;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: #102b31;
  color: #ffffff;
}

.lesson-upload-preview-frame img,
.lesson-upload-preview-frame video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.lesson-upload-preview-frame audio {
  width: min(92%, 760px);
}

.lesson-upload-file-placeholder {
  font-weight: 900;
}

.lesson-upload-preview-copy {
  display: grid;
  gap: 4px;
}

.lesson-upload-preview-copy strong {
  overflow-wrap: anywhere;
  color: var(--ink);
}

.lesson-upload-preview-copy p {
  margin: 0;
  color: var(--muted);
}

.lesson-upload-progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(58, 63, 70, 0.12);
}

.lesson-upload-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  transition: width 0.18s ease;
}

.lesson-upload-preview.is-complete {
  border-color: rgba(26, 127, 87, 0.25);
  background: #effaf2;
}

.lesson-upload-preview.has-error {
  border-color: rgba(139, 43, 34, 0.28);
  background: #fff3ef;
}

input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 12px;
  color: var(--ink);
  background: #ffffff;
  font-family: inherit;
  font-weight: 400;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

input::placeholder,
textarea::placeholder {
  color: var(--muted);
  font-weight: 400;
  opacity: 1;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
input:autofill {
  font-family: inherit;
  font-weight: 400;
  -webkit-text-fill-color: var(--ink);
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset;
  box-shadow: 0 0 0 1000px #ffffff inset;
  transition: background-color 9999s ease-in-out 0s, color 9999s ease-in-out 0s;
}

textarea {
  resize: vertical;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--accent);
  background: #fff;
  outline: 3px solid var(--accent-soft);
}

.editor-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: start;
}

.course-outline-editor {
  grid-template-columns: minmax(0, 1fr);
}

.course-outline-editor .editor-main {
  display: grid;
  gap: 18px;
}

.editor-sidebar {
  position: sticky;
  top: 86px;
  display: grid;
  gap: 20px;
}

.editor-summary {
  display: grid;
  gap: 14px;
  margin: 0;
}

.editor-summary div {
  display: grid;
  gap: 4px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(217, 227, 223, 0.72);
}

.editor-summary div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.editor-summary dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.editor-summary dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.curriculum-workspace-section {
  display: grid;
  gap: 12px;
}

.course-editor-section-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
}

.course-editor-section-heading h2 {
  margin-bottom: 4px;
}

.course-editor-section-heading .field-hint {
  margin: 0;
}

.course-editor-secondary-panels {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.course-editor-panel {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.course-editor-panel > summary {
  list-style: none;
}

.course-editor-panel > summary::-webkit-details-marker {
  display: none;
}

.course-editor-panel-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  padding: 18px 20px;
  cursor: pointer;
}

.course-editor-panel-summary > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.course-editor-panel-summary strong {
  font-size: 22px;
  line-height: 1.18;
}

.course-editor-panel-summary small {
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

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

.course-addon-card {
  display: grid;
  gap: 6px;
  min-height: 132px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.13);
  border-radius: 8px;
  color: var(--ink);
  background: var(--panel-tint);
  text-decoration: none;
}

.course-addon-card:hover,
.course-addon-card:focus-within {
  border-color: rgba(58, 63, 70, 0.34);
  background: #f6faf8;
}

.course-addon-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.course-addon-card strong {
  font-size: 24px;
  line-height: 1.1;
}

.course-addon-card small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.course-addon-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-self: end;
}

.course-addon-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  width: fit-content;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--primary);
  background: #fff;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.course-addon-actions a:hover,
.course-addon-actions a:focus-visible {
  border-color: rgba(58, 63, 70, 0.34);
  background: #f8f9fb;
}

.course-addon-actions a.primary {
  border-color: var(--primary);
  color: #fff;
  background: var(--primary);
  box-shadow: 0 8px 18px rgba(58, 63, 70, 0.14);
}

.course-addon-actions a.primary:hover,
.course-addon-actions a.primary:focus-visible {
  background: var(--primary-dark);
}

.course-addon-preview-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.13);
  border-radius: 8px;
  background: #f8f9fb;
}

.course-addon-preview-strip > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.course-addon-preview-strip strong {
  font-size: 16px;
  line-height: 1.25;
}

.course-addon-preview-strip small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.panel-summary-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--primary);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}

.panel-summary-close,
.course-editor-panel[open] .panel-summary-open,
.drip-module[open] .panel-summary-open {
  display: none;
}

.course-editor-panel[open] .panel-summary-close,
.drip-module[open] .panel-summary-close {
  display: inline;
}

.course-editor-panel:not([open]) .module-collapse-icon::before,
.drip-module:not([open]) .module-collapse-icon::before {
  transform: translateX(1px) rotate(-45deg);
}

.course-editor-panel-body {
  display: grid;
  gap: 18px;
  padding: 0 20px 20px;
}

.course-settings-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
  gap: 18px;
  align-items: start;
}

.course-settings-grid .field-group {
  margin: 0;
  padding: 0;
  border: 0;
}

.course-settings-summary {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.course-delete-zone {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 16px;
  border: 1px solid #efc9c4;
  border-radius: 8px;
  background: #fff8f6;
}

.course-delete-zone h3 {
  margin: 0 0 6px;
  font-size: 18px;
}

.course-delete-zone p {
  margin: 0;
  color: var(--muted);
  font-weight: 600;
  line-height: 1.45;
}

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

.payment-status-card,
.payment-webhook-card {
  display: grid;
  gap: 14px;
}

.payment-status-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.payment-readiness-card {
  display: grid;
  gap: 16px;
}

.payment-readiness-card .section-heading p {
  margin: 6px 0 0;
  max-width: 780px;
  color: var(--muted);
  line-height: 1.5;
}

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

.cloudflare-secret-checklist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
}

.cloudflare-secret-checklist > div {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #ffffff;
}

.cloudflare-secret-checklist span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.cloudflare-secret-checklist code {
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}

.cloudflare-secret-checklist strong {
  font-size: 14px;
}

.cloudflare-secret-checklist .ready {
  color: var(--success);
}

.cloudflare-secret-checklist .missing {
  color: #7d251f;
}

.cloudflare-secret-checklist .deferred {
  color: #735200;
}

.cloudflare-activation-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cloudflare-activation-steps li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 10px;
  align-items: start;
  min-height: 118px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.cloudflare-activation-steps li.ready {
  border-color: rgba(25, 114, 78, 0.2);
  background: #f0f2f5;
}

.cloudflare-activation-steps li.needed {
  border-color: rgba(197, 138, 58, 0.24);
  background: #ffffff;
}

.cloudflare-activation-steps li.locked {
  border-color: rgba(91, 109, 116, 0.18);
  background: #f6f8f8;
}

.cloudflare-activation-steps li.deferred {
  border-color: rgba(197, 138, 58, 0.24);
  background: #ffffff;
}

.cloudflare-activation-steps span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-weight: 900;
}

.cloudflare-activation-steps strong,
.cloudflare-activation-steps small {
  min-width: 0;
}

.cloudflare-activation-steps small {
  grid-column: 2;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.4;
}

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

.payment-check-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(23, 33, 38, 0.04);
}

.payment-check-item.active {
  border-color: rgba(25, 114, 78, 0.2);
  background: #f0f2f5;
}

.payment-check-item.pending {
  border-color: rgba(197, 138, 58, 0.24);
  background: #ffffff;
}

.payment-check-item.blocked {
  border-color: rgba(122, 47, 34, 0.22);
  background: #fff7f4;
}

.payment-check-item h3,
.payment-check-item p {
  margin: 0;
}

.payment-check-item p {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.45;
}

.launch-checklist-card,
.launch-support-card {
  border-left: 5px solid var(--primary);
}

.launch-check-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.launch-check-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
}

.launch-check-item.active {
  border-color: rgba(25, 114, 78, 0.22);
  background: #f1fbf5;
}

.launch-check-item.pending {
  border-color: rgba(197, 138, 58, 0.28);
  background: #ffffff;
}

.launch-check-item.deferred {
  border-color: rgba(98, 115, 122, 0.2);
  background: #f5f8f8;
}

.launch-check-item h3 {
  margin: 0 0 5px;
  font-size: 16px;
}

.launch-check-item p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
}

.launch-check-item .button {
  grid-column: 2;
  justify-self: start;
}

.launch-support-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.launch-support-shortcut {
  display: grid;
  gap: 8px;
  min-width: 0;
  min-height: 122px;
  padding: 15px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
  text-decoration: none;
}

.launch-support-shortcut:hover {
  border-color: rgba(58, 63, 70, 0.32);
  box-shadow: 0 12px 28px rgba(23, 33, 38, 0.08);
}

.launch-support-shortcut strong {
  color: var(--ink);
  font-size: 16px;
}

.launch-support-shortcut span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
}

.support-hub-shell {
  gap: 18px;
}

.support-hub-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 20px;
  align-items: start;
  border-left: 5px solid var(--primary);
}

.support-hub-hero h2,
.support-hub-hero p,
.support-hub-workspace span,
.support-hub-workspace strong {
  margin: 0;
}

.support-hub-hero p {
  max-width: 760px;
  margin-top: 8px;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.55;
}

.support-hub-workspace {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.support-hub-workspace span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.support-hub-workspace strong {
  overflow-wrap: anywhere;
  font-size: 20px;
}

.support-hub-signals {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.support-hub-signal {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.support-hub-signal.active {
  background: #f0f2f5;
}

.support-hub-signal.pending {
  background: #ffffff;
}

.support-hub-signal.blocked {
  background: #fff4f1;
}

.support-hub-signal span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
}

.support-hub-signal strong {
  color: var(--ink);
  font-size: 34px;
  line-height: 1;
}

.support-hub-signal p {
  min-height: 42px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.4;
}

.support-request-queue-card,
.support-request-list {
  display: grid;
  gap: 12px;
}

.support-request-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 240px);
  gap: 16px;
  align-items: start;
  min-width: 0;
  padding: 15px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
}

.support-request-card h3,
.support-request-card p {
  margin: 8px 0 0;
}

.support-request-card h3 {
  color: var(--ink);
  font-size: 18px;
}

.support-request-card p {
  color: var(--muted);
  font-weight: 650;
  line-height: 1.45;
}

.support-request-card dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0 0;
}

.support-request-card dt,
.support-request-card dd {
  margin: 0;
}

.support-request-card dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.support-request-card dd {
  margin-top: 3px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.support-request-actions {
  display: grid;
  gap: 8px;
  justify-items: stretch;
}

.support-request-actions .button,
.support-request-actions form,
.support-request-actions form button {
  width: 100%;
}

.support-hub-shortcuts-card {
  display: grid;
  gap: 16px;
}

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

.support-hub-shortcut {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  min-height: 118px;
  padding: 15px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
  text-decoration: none;
}

.support-hub-shortcut:hover {
  border-color: rgba(58, 63, 70, 0.32);
  box-shadow: 0 12px 28px rgba(23, 33, 38, 0.08);
}

.support-hub-shortcut strong {
  color: var(--ink);
  font-size: 16px;
}

.support-hub-shortcut span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
}

.support-hub-columns {
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.support-hub-checklist {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 22px;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.5;
}

.support-hub-platform-note {
  display: grid;
  gap: 6px;
  margin-top: 18px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
}

.support-hub-platform-note span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
}

.support-hub-events {
  display: grid;
  gap: 10px;
}

.support-hub-event,
.support-hub-empty {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 13px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #ffffff;
  text-decoration: none;
}

.support-hub-event:hover {
  border-color: rgba(58, 63, 70, 0.3);
}

.support-hub-event span {
  color: var(--primary);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.support-hub-event strong,
.support-hub-empty strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.support-hub-event small,
.support-hub-empty span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.4;
}

.launch-links-shell {
  gap: 18px;
}

.launch-links-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(320px, 1.14fr);
  gap: 20px;
  align-items: start;
  border-left: 5px solid var(--primary);
}

.launch-links-hero h2,
.launch-links-hero p {
  margin: 0;
}

.launch-links-hero p {
  margin-top: 8px;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.55;
}

.launch-home-copy-preview {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
}

.launch-home-copy-preview h3,
.launch-home-copy-preview p {
  margin: 0;
}

.launch-home-copy-preview h3 {
  font-size: 22px;
  line-height: 1.16;
}

.launch-home-copy-preview p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.launch-home-copy-preview .status-pill {
  width: fit-content;
}

.launch-home-copy-preview .admin-actions {
  justify-content: flex-start;
  margin-top: 2px;
}

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

.launch-links-check {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 13px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.launch-links-check.pending {
  border-color: rgba(197, 138, 58, 0.26);
  background: #ffffff;
}

.launch-links-check span {
  color: var(--primary);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.launch-links-check small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.4;
}

.launch-links-group {
  display: grid;
  gap: 16px;
}

.launch-packet-card {
  display: grid;
  gap: 14px;
  background: #f8f9fb;
}

.launch-packet-output {
  width: 100%;
  min-height: 224px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  font: 700 14px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}

.launch-links-list {
  display: grid;
  gap: 12px;
}

.launch-link-card {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(260px, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-width: 0;
  padding: 15px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #ffffff;
}

.launch-link-card.pending {
  background: #ffffff;
}

.launch-link-card-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.launch-link-card-main h3,
.launch-link-card-main p {
  margin: 0;
}

.launch-link-card-main p {
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
}

.launch-link-copy-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.launch-link-copy-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.launch-link-copy-field textarea {
  min-height: 54px;
  resize: vertical;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.4;
}

.launch-link-actions {
  display: grid;
  gap: 8px;
  justify-items: stretch;
  min-width: 128px;
}

.launch-link-actions span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  text-align: center;
}

.launch-packet-recipient {
  max-width: 220px;
  overflow-wrap: anywhere;
}

.automation-rule-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

.automation-rule-card {
  display: grid;
  gap: 16px;
}

.automation-rule-card .section-heading p,
.automation-next-card .section-heading p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

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

.automation-flow div {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-left: 4px solid var(--primary);
  border-radius: 8px;
  background: var(--panel-tint);
}

.automation-flow span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.automation-flow strong {
  color: var(--ink);
  font-size: 16px;
}

.automation-next-card {
  display: grid;
  gap: 16px;
}

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

.automation-next-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #ffffff;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.automation-next-item:hover {
  border-color: rgba(197, 138, 58, 0.34);
  box-shadow: var(--shadow-card);
  transform: translateY(-1px);
}

.automation-next-item h3,
.automation-next-item p {
  margin: 0;
}

.automation-next-item p {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.45;
}

.token-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.token-list code {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-tint);
  color: var(--muted);
  font-size: 12px;
}

.setup-value code {
  display: block;
  max-width: 100%;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: var(--panel-tint);
  font: 700 13px/1.45 "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  overflow-wrap: anywhere;
  white-space: normal;
}

.account-access-card {
  margin-bottom: 16px;
}

.setup-values {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin: 0;
}

.setup-values div {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.setup-values dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.setup-values dd {
  margin: 0;
  font-weight: 800;
}

.setup-values code {
  color: var(--primary);
  font: 800 13px/1.45 "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

.payment-checklist li {
  align-items: flex-start;
  line-height: 1.45;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 800;
}

.status-pill.published {
  color: var(--success);
  background: #e9f7ef;
}

.status-pill.archived {
  color: #5e6266;
  background: #eff1f2;
}

.status-pill.active,
.status-pill.completed,
.status-pill.download,
.status-pill.free,
.status-pill.link,
.status-pill.scheduled,
.status-pill.live,
.status-pill.webinar,
.status-pill.workshop,
.status-pill.provisioned,
.status-pill.owner,
.status-pill.admin,
.status-pill.instructor,
.status-pill.learner,
.status-pill.paid,
.status-pill.queued,
.status-pill.trialing,
.status-pill.template,
.status-pill.worksheet {
  color: var(--success);
  background: #e9f7ef;
}

.status-pill.pending,
.status-pill.incomplete,
.status-pill.past_due,
.status-pill.pending_payment {
  color: #6f4d12;
  background: #fff7de;
}

.status-pill.deferred {
  color: #6f4d12;
  background: #fff7de;
}

.status-pill.instructor_only,
.status-pill.hidden {
  color: #3a3f46;
  background: var(--sage);
}

.status-pill.cancelled,
.status-pill.blocked,
.status-pill.failed,
.status-pill.refunded,
.status-pill.deleted {
  color: #7a2f22;
  background: #fff0ea;
}

.muted-row {
  opacity: 0.72;
}

.button.danger {
  color: #8a241d;
  border-color: #efc9c4;
  background: #fff5f3;
}

.access-warning {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding: 14px;
  border: 1px solid rgba(197, 138, 58, 0.32);
  border-radius: 8px;
  background: #ffffff;
}

.access-warning p {
  margin: 0;
  color: var(--muted);
}

.access-warning.muted-warning {
  border-color: var(--line);
  background: var(--panel-tint);
}

.checkbox-line {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-weight: 700;
}

.checkbox-line input {
  margin-top: 3px;
}

.access-history {
  margin-top: 28px;
}

.access-event-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.access-event-list li {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #ffffff;
}

.access-event-list li > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.access-event-list span,
.access-event-list small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.access-event-list p {
  margin: 0;
}

.access-event-list .empty-access-event {
  color: var(--muted);
}

.table-link {
  color: var(--primary);
  font-weight: 800;
  text-decoration: none;
}

.table-actions {
  width: 1%;
  white-space: nowrap;
}

.curriculum-library-table {
  min-width: 1540px;
  table-layout: fixed;
}

.curriculum-library-table th:nth-child(1) {
  width: 26%;
}

.curriculum-library-table th:nth-child(2) {
  width: 12%;
}

.curriculum-library-table th:nth-child(3) {
  width: 10%;
}

.curriculum-library-table th:nth-child(4) {
  width: 25%;
}

.curriculum-library-table th:nth-child(5),
.curriculum-library-table th:nth-child(6) {
  width: 6%;
}

.curriculum-library-table th:nth-child(7) {
  width: 21%;
}

.curriculum-library-table td:nth-child(4),
.curriculum-library-table td:nth-child(7) {
  white-space: normal;
}

.curriculum-library-actions {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.curriculum-copy-form {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.curriculum-copy-form.compact {
  opacity: 0.86;
}

.curriculum-action-note {
  display: grid;
  gap: 3px;
  justify-items: end;
  max-width: 260px;
  padding: 10px 12px;
  border: 1px solid rgba(213, 159, 68, 0.4);
  border-radius: 8px;
  background: #fff8e7;
  color: var(--ink);
  text-align: right;
}

.curriculum-action-note strong {
  font-size: 13px;
}

.curriculum-action-note span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  white-space: normal;
}

.curriculum-copy-form select {
  flex: 1 1 150px;
  min-height: 34px;
  min-width: 150px;
  max-width: 210px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.curriculum-copy-form .button {
  flex: 0 0 auto;
}

.curriculum-version-targets {
  display: grid;
  gap: 6px;
  margin: 10px 0;
  padding: 0;
  list-style: none;
}

.curriculum-version-targets li {
  padding: 8px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 6px;
  background: #f6faf7;
}

.curriculum-version-targets strong,
.curriculum-version-targets span {
  display: block;
}

.curriculum-version-targets span,
.curriculum-version-form span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.curriculum-version-form {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.curriculum-version-form label {
  display: grid;
  gap: 4px;
}

.curriculum-version-form input {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 13px;
}

.curriculum-version-form .button {
  justify-self: start;
}

.platform-plans-table {
  min-width: 980px;
}

.platform-billing-model-table {
  min-width: 1040px;
}

.platform-pricing-secrets-table {
  min-width: 1180px;
}

.platform-checkout-requests-table {
  min-width: 1260px;
}

.platform-subscriptions-table,
.platform-provisioning-events-table {
  min-width: 1120px;
}

.platform-plans-table td,
.platform-billing-model-table td,
.platform-pricing-secrets-table td,
.platform-checkout-requests-table td,
.platform-subscriptions-table td,
.platform-provisioning-events-table td {
  vertical-align: top;
}

.platform-pricing-secrets-table code {
  color: var(--primary);
  overflow-wrap: anywhere;
  font: 800 12px/1.45 "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

.platform-provider-stack {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.platform-provider-stack span {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 7px;
  align-items: baseline;
  min-width: 0;
}

.platform-provider-stack strong {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
}

.platform-provider-stack code {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--primary);
  font: 800 12px/1.45 "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

.platform-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.platform-review-actions .inline-admin-form {
  display: inline-flex;
}

.platform-billing-signals {
  grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
}

.platform-readiness-explainer-card .section-heading p {
  max-width: 780px;
}

.platform-readiness-explainer-signals {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.platform-provisioning-steps,
.platform-lifecycle-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.platform-provisioning-steps li,
.platform-lifecycle-steps li {
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 8px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.platform-provisioning-steps span,
.platform-lifecycle-steps span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 900;
}

.platform-provisioning-steps strong,
.platform-lifecycle-steps strong {
  color: var(--ink);
  font-size: 15px;
}

.platform-provisioning-steps small,
.platform-lifecycle-steps small {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.platform-plan-readiness-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.platform-plan-readiness-card {
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.platform-plan-readiness-card .status-pill {
  justify-self: start;
}

.platform-plan-readiness-card strong {
  color: var(--ink);
  font-size: 16px;
}

.platform-plan-readiness-card small {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.workspace-create-form {
  max-width: 1120px;
}

.workspace-create-card {
  display: grid;
  gap: 18px;
}

.workspace-create-signals strong {
  overflow-wrap: anywhere;
}

.tenant-owner-start-card {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
}

.owner-workbench-entry-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  background: #f8f9fb;
}

.owner-workbench-entry-card h2,
.owner-workbench-entry-card p {
  margin: 0;
}

.owner-workbench-entry-card p:not(.kicker) {
  max-width: 72ch;
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.owner-workbench-entry-card .button {
  flex: 0 0 auto;
}

.owner-workbench-shell {
  display: grid;
  gap: 16px;
}

.owner-workbench-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  gap: 16px;
  align-items: stretch;
  background: #f8f9fb;
}

.owner-workbench-focus {
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 10px;
  padding: 4px;
}

.owner-workbench-focus span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.owner-workbench-focus h2,
.owner-workbench-focus p {
  margin: 0;
}

.owner-workbench-focus h2 {
  max-width: 18ch;
  color: var(--ink);
  font-size: 32px;
  line-height: 1.08;
  text-wrap: balance;
}

.owner-workbench-focus p {
  max-width: 64ch;
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.owner-workbench-signals {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.owner-workbench-signal {
  display: grid;
  gap: 6px;
  align-content: start;
  min-height: 118px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #fff;
}

.owner-workbench-signal span,
.owner-workbench-signal small {
  color: var(--muted);
  line-height: 1.35;
}

.owner-workbench-signal span {
  font-size: 12px;
  font-weight: 900;
}

.owner-workbench-signal strong {
  color: var(--ink);
  font-size: 28px;
  line-height: 1;
}

.owner-workbench-course-card,
.owner-workbench-flight,
.owner-workbench-operations,
.owner-workbench-group {
  display: grid;
  gap: 14px;
}

.owner-workbench-operation-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.owner-workbench-operation-metrics div {
  display: grid;
  gap: 5px;
  min-height: 88px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.owner-workbench-operation-metrics span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.owner-workbench-operation-metrics strong {
  color: var(--ink);
  font-size: 28px;
  line-height: 1;
}

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

.owner-workbench-operation-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.owner-workbench-operation-card.review {
  background: #ffffff;
}

.owner-workbench-operation-card.next {
  background: #f8f9fb;
}

.owner-workbench-operation-main {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.owner-workbench-operation-main h3,
.owner-workbench-operation-main p,
.owner-workbench-operation-main strong {
  margin: 0;
}

.owner-workbench-operation-main h3 {
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
}

.owner-workbench-operation-main strong {
  color: var(--ink);
}

.owner-workbench-operation-main p {
  color: var(--muted);
  line-height: 1.4;
  text-wrap: pretty;
}

.owner-workbench-operation-list {
  grid-column: 1 / -1;
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.35;
}

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

.owner-workbench-flight-check {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 6px 10px;
  align-items: center;
  min-height: 112px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  color: inherit;
  background: #f8f9fb;
  text-decoration: none;
}

.owner-workbench-flight-check:hover {
  border-color: rgba(58, 63, 70, 0.28);
  background: #f8f9fb;
}

.owner-workbench-flight-check.review {
  background: #ffffff;
}

.owner-workbench-flight-check.next {
  background: #f8f9fb;
}

.owner-workbench-flight-check strong {
  min-width: 0;
  color: var(--ink);
  font-size: 17px;
}

.owner-workbench-flight-check small {
  grid-column: 1 / -1;
  color: var(--muted);
  line-height: 1.4;
  text-wrap: pretty;
}

.owner-workbench-flight-check em {
  color: var(--primary);
  font-size: 13px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}

.owner-workbench-course-list {
  display: grid;
  gap: 10px;
}

.owner-workbench-course {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.8fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.owner-workbench-course.library {
  background: #f8f9fb;
}

.owner-workbench-course h3,
.owner-workbench-course p {
  margin: 0;
}

.owner-workbench-course h3 {
  margin-top: 6px;
  color: var(--ink);
  font-size: 20px;
}

.owner-workbench-course p {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.owner-workbench-course dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.owner-workbench-course dl div {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(58, 63, 70, 0.1);
  border-radius: 8px;
  background: #fff;
}

.owner-workbench-course dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.owner-workbench-course dd {
  margin: 3px 0 0;
  color: var(--ink);
  font-weight: 900;
}

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

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

.owner-workbench-shortcuts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.owner-workbench-shortcut {
  display: grid;
  gap: 6px;
  min-height: 126px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  color: inherit;
  background: #f8f9fb;
  text-decoration: none;
}

.owner-workbench-shortcut:hover {
  border-color: rgba(58, 63, 70, 0.28);
  background: #f8f9fb;
}

.owner-workbench-shortcut span {
  justify-self: start;
  padding: 4px 9px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 12px;
  font-weight: 900;
}

.owner-workbench-shortcut strong {
  color: var(--ink);
  font-size: 17px;
}

.owner-workbench-shortcut small {
  color: var(--muted);
  line-height: 1.4;
  text-wrap: pretty;
}

.tenant-owner-start-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.tenant-owner-next-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-owner-next-action > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tenant-owner-next-action span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.tenant-owner-next-action strong {
  color: var(--ink);
  font-size: 20px;
}

.tenant-owner-next-action small {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.tenant-owner-next-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.tenant-owner-next-buttons .button {
  white-space: nowrap;
}

.tenant-owner-plan-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-owner-plan-summary div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tenant-owner-plan-summary span:not(.status-pill) {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.tenant-owner-plan-summary strong {
  color: var(--ink);
  font-size: 18px;
}

.tenant-owner-plan-summary small {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.tenant-owner-start-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tenant-owner-start-steps li {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-owner-start-steps li.next {
  border-color: rgba(201, 145, 45, 0.35);
  background: #ffffff;
}

.tenant-owner-start-steps li.later {
  background: #f8f9fb;
}

.tenant-owner-start-steps span {
  justify-self: start;
  min-width: 52px;
  padding: 4px 9px;
  border-radius: 999px;
  color: #0f6f48;
  background: #dff4e8;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

.tenant-owner-start-steps li.next span {
  color: #7a4f00;
  background: #fff0bf;
}

.tenant-owner-start-steps li.later span {
  color: var(--muted);
  background: #e9eef0;
}

.tenant-owner-start-steps strong {
  color: var(--ink);
  font-size: 16px;
}

.tenant-owner-start-steps small {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.tenant-launch-readiness-card {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
  border-left: 4px solid var(--primary);
}

.tenant-launch-next {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-launch-next > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tenant-launch-next span,
.tenant-launch-support-links span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.tenant-launch-next strong {
  color: var(--ink);
  font-size: 20px;
}

.tenant-launch-next small {
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.tenant-launch-next .button {
  white-space: nowrap;
}

.tenant-launch-readiness-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.tenant-launch-readiness-item {
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 178px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-launch-readiness-item.ready {
  background: #f8f9fb;
}

.tenant-launch-readiness-item.pending {
  border-color: rgba(201, 145, 45, 0.28);
  background: #ffffff;
}

.tenant-launch-readiness-item > span {
  justify-self: start;
  padding: 4px 9px;
  border-radius: 999px;
  color: #0f6f48;
  background: #dff4e8;
  font-size: 12px;
  font-weight: 900;
}

.tenant-launch-readiness-item.pending > span {
  color: #7a4f00;
  background: #fff0bf;
}

.tenant-launch-readiness-item h3 {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
}

.tenant-launch-readiness-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
  text-wrap: pretty;
}

.tenant-launch-readiness-item .button {
  align-self: end;
  justify-self: start;
}

.tenant-launch-support-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 12px 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-launch-support-links a {
  color: var(--primary);
  font-weight: 900;
  text-decoration: none;
}

.tenant-launch-support-links a:hover {
  text-decoration: underline;
}

.workspace-handoff-card {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
}

.library-starter-handoff {
  border-left: 4px solid var(--accent);
}

.library-starter-handoff .section-heading h2 {
  text-wrap: balance;
}

.library-starter-handoff .workspace-handoff-steps span {
  color: #0f6f48;
  background: #dff4e8;
}

.tenant-library-courses-card {
  display: grid;
  gap: 16px;
  margin-bottom: 16px;
  border-left: 4px solid var(--accent);
}

.tenant-library-course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}

.tenant-library-course-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f8f9fb;
}

.tenant-library-course-card-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tenant-library-course-card h3 {
  margin: 0;
  font-size: 22px;
}

.tenant-library-course-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.tenant-library-course-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  margin: 0;
}

.tenant-library-course-facts div {
  padding: 10px;
  border: 1px solid rgba(58, 63, 70, 0.1);
  border-radius: 8px;
  background: #fff;
}

.tenant-library-course-facts dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.tenant-library-course-facts dd {
  margin: 4px 0 0;
  color: var(--ink);
  font-weight: 900;
  overflow-wrap: anywhere;
}

.tenant-library-course-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

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

.workspace-owner-invite-handoff {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: #f8f9fb;
}

.workspace-owner-invite-handoff div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.workspace-owner-invite-handoff span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.workspace-owner-invite-handoff strong {
  color: var(--ink);
  font-size: 18px;
}

.workspace-owner-invite-handoff small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.workspace-handoff-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.workspace-handoff-steps li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.workspace-handoff-steps span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  color: var(--primary);
  background: var(--sage);
  font-size: 13px;
  font-weight: 900;
}

.workspace-handoff-steps strong,
.workspace-handoff-steps small {
  display: block;
  grid-column: 2;
  min-width: 0;
}

.workspace-handoff-steps small {
  margin-top: -4px;
  color: var(--muted);
  line-height: 1.45;
  overflow-wrap: normal;
  text-wrap: pretty;
}

.action-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.community-groups-table {
  min-width: 1280px;
  table-layout: fixed;
}

.community-groups-title-col {
  width: 15%;
}

.community-groups-course-col {
  width: 11%;
}

.community-groups-status-col {
  width: 9%;
}

.community-groups-notifications-col {
  width: 14%;
}

.community-groups-url-col {
  width: auto;
}

.community-groups-count-col {
  width: 72px;
}

.community-groups-updated-col {
  width: 120px;
}

.community-groups-actions-col {
  width: 292px;
}

.community-groups-table td:nth-child(8) {
  white-space: nowrap;
}

.community-groups-table .table-actions {
  width: 292px;
  min-width: 292px;
  white-space: normal;
}

.community-groups-table .action-stack {
  justify-content: flex-start;
}

.community-groups-table td:nth-child(4) .muted {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.community-groups-table .button.small {
  min-width: 62px;
}

.community-dashboard-shell {
  display: grid;
  gap: 16px;
}

.community-dashboard-topbar {
  align-items: flex-start;
}

.community-dashboard-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(217, 227, 223, 0.82);
}

.community-dashboard-tabs a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 12px;
  border-radius: 8px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.community-dashboard-tabs a:hover,
.community-dashboard-tabs a.active {
  color: var(--ink);
  background: rgba(58, 63, 70, 0.08);
}

.community-dashboard-summary {
  display: grid;
  grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(170px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(58, 63, 70, 0.12);
}

.community-dashboard-summary > div {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 106px;
  padding: 18px;
  background: rgba(255, 253, 250, 0.96);
}

.community-dashboard-summary span,
.community-dashboard-card dt,
.community-space-row > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.community-dashboard-summary strong {
  overflow-wrap: anywhere;
  font-size: 18px;
}

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

.community-dashboard-grid.two {
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
}

.community-dashboard-card {
  display: grid;
  gap: 16px;
  align-content: start;
}

.community-dashboard-card .editor-summary {
  gap: 12px;
}

.community-dashboard-action-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.community-access-card {
  gap: 18px;
}

.community-access-table {
  min-width: 980px;
}

.community-access-table td:first-child span {
  display: block;
  margin-top: 3px;
}

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

.community-space-admin-card {
  min-height: 100%;
}

.community-space-admin-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: rgba(58, 63, 70, 0.1);
}

.community-space-admin-summary div {
  display: grid;
  gap: 4px;
  padding: 12px;
  background: var(--panel-tint);
}

.community-space-admin-summary span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.community-space-admin-summary strong {
  font-size: 22px;
}

.community-space-admin-card .editor-summary dd span {
  display: block;
  margin-top: 4px;
}

.community-spaces-table {
  min-width: 920px;
}

.community-spaces-table td:nth-child(3) span {
  display: block;
  margin-top: 3px;
}

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

.community-space-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(217, 227, 223, 0.72);
}

.community-space-row:last-child {
  border-bottom: 0;
}

.community-space-row div {
  display: grid;
  gap: 4px;
}

.community-space-row div span {
  color: var(--muted);
  line-height: 1.45;
}

.digest-scheduler-card {
  margin-bottom: 16px;
}

.digest-scheduler-form {
  align-items: end;
}

.digest-scheduler-form .button {
  min-height: 46px;
}

.email-status-filter-card {
  display: grid;
  gap: 14px;
}

.status-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.status-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  font-weight: 850;
  text-decoration: none;
}

.status-filter-chip:hover,
.status-filter-chip.active {
  border-color: rgba(58, 63, 70, 0.32);
  background: #f0f2f5;
}

.status-filter-chip strong {
  min-width: 28px;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(58, 63, 70, 0.1);
  color: var(--primary);
  font-size: 12px;
  text-align: center;
}

.support-request-status-row {
  margin: 0 0 16px;
}

.support-outbox-summary-card {
  display: grid;
  gap: 16px;
}

.support-outbox-summary-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.support-outbox-summary-grid a {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-decoration: none;
}

.support-outbox-summary-grid a:hover {
  border-color: rgba(58, 63, 70, 0.32);
  box-shadow: 0 12px 26px rgba(21, 76, 91, 0.08);
}

.support-outbox-summary-grid span,
.support-outbox-latest span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.support-outbox-summary-grid strong {
  font-size: 1.7rem;
  line-height: 1;
}

.support-outbox-latest {
  display: grid;
  gap: 7px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
}

.support-outbox-latest p {
  margin: 0;
  color: var(--muted);
}

.support-outbox-focused-card {
  display: grid;
  gap: 16px;
}

.support-request-focus-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.support-request-focus-grid > div,
.support-request-focus-message {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
}

.support-request-focus-grid span,
.support-request-focus-message span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.support-request-focus-grid strong {
  overflow-wrap: anywhere;
}

.support-request-focus-grid small {
  color: var(--muted);
  font-weight: 750;
  overflow-wrap: anywhere;
}

.support-request-focus-message p {
  margin: 0;
  max-width: 75ch;
  color: var(--ink);
  white-space: pre-wrap;
}

.support-request-focus-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.email-notifications-table {
  min-width: 1180px;
  table-layout: fixed;
}

.email-notifications-table th:nth-child(1) {
  width: 18%;
}

.email-notifications-table th:nth-child(2) {
  width: 12%;
}

.email-notifications-table th:nth-child(3) {
  width: 22%;
}

.email-notifications-table th:nth-child(4) {
  width: 9%;
}

.email-notifications-table th:nth-child(5),
.email-notifications-table th:nth-child(6) {
  width: 12%;
}

.email-notifications-table th:nth-child(7) {
  width: 190px;
}

.email-notification-focus-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid #f2d18a;
  border-radius: 8px;
  background: #fff9eb;
}

.email-notification-focus-notice span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.email-notification-focus-notice strong {
  margin-right: auto;
}

.email-notification-focus-notice a {
  color: var(--primary);
  font-weight: 800;
}

.email-notification-main-row.is-focused td,
.email-notification-preview-row.is-focused td {
  background: #fff9eb;
}

.email-notification-main-row.is-focused td:first-child {
  box-shadow: inset 4px 0 0 #d49a2e;
}

.support-request-row-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.support-request-row-facts span {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.email-notification-preview-row td {
  padding-top: 0;
  border-top: 0;
}

.email-preview-details {
  padding: 8px 0 16px;
}

.email-preview-details summary {
  width: max-content;
  color: var(--muted);
  cursor: pointer;
}

.email-notifications-table .table-actions {
  width: 190px;
  white-space: normal;
}

.email-notification-actions {
  justify-content: flex-start;
}

.email-notification-actions .button.small {
  min-width: 86px;
}

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

.assessment-performance-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  max-width: 220px;
}

.assessment-performance-stack .status-pill {
  white-space: nowrap;
}

.assessment-response-review {
  align-content: start;
  gap: 20px;
}

.response-answer-text {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.assessment-context-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid rgba(58, 63, 70, 0.16);
  border-radius: 8px;
  background: #f8f9fb;
}

.assessment-context-card div {
  display: grid;
  gap: 3px;
}

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

.assessment-context-card span,
.assessment-context-card small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.assessment-context-card span {
  text-transform: uppercase;
}

.assessment-context-card strong {
  color: var(--ink);
  font-size: 18px;
}

.assessment-editor-context {
  margin-top: -4px;
}

.assessment-filter-form {
  display: grid;
  grid-template-columns: minmax(150px, 0.8fr) minmax(220px, 1.4fr) minmax(180px, 1fr) minmax(140px, 0.7fr) minmax(140px, 0.7fr) auto;
  gap: 12px;
  align-items: end;
  margin: 18px 0 8px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.assessment-response-filter-form {
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) auto;
}

.assessment-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.assessment-filter-count {
  margin: 0 0 12px;
}

.inline-action {
  margin: 0;
}

.notification-preview {
  max-width: 520px;
  margin: 10px 0 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: var(--panel-tint);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.email-notification-preview-body {
  max-width: min(780px, 100%);
  margin-top: 12px;
}

.report-grid {
  display: grid;
  gap: 16px;
}

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

.report-card-heading p {
  max-width: 680px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.report-progress-cell {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 180px;
}

.report-progress-cell span {
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
}

.report-progress-cell small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

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

.table-scroll {
  overflow-x: auto;
  border-radius: 8px;
}

.domains-table-hint {
  margin: 0 0 10px;
  font-size: 13px;
}

.domain-preview-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dns-value-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.domain-setup-tips {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted, #f7f5f0);
  font-size: 13px;
}

.domain-setup-tips ul {
  margin: 6px 0 0;
  padding-left: 18px;
}

.domain-setup-tips li {
  margin-bottom: 4px;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tag-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  color: #61450e;
  background: var(--accent-soft);
  font-size: 12px;
  font-weight: 800;
}

.pipeline-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.pipeline-stage-card {
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 220px;
  padding: 18px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.pipeline-stage-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pipeline-stage-header h2 {
  font-size: 17px;
}

.stage-count {
  display: grid;
  place-items: center;
  min-width: 32px;
  height: 32px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--primary-deep));
  font-weight: 800;
}

.pipeline-contact-list {
  display: grid;
  gap: 8px;
}

.pipeline-contact-list a {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid rgba(58, 63, 70, 0.1);
  border-radius: 8px;
  background: var(--panel-tint);
  text-decoration: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.pipeline-contact-list a:hover {
  border-color: rgba(197, 138, 58, 0.32);
  box-shadow: 0 8px 20px rgba(23, 33, 38, 0.06);
  transform: translateY(-1px);
}

.pipeline-contact-list span {
  overflow-wrap: anywhere;
  color: var(--muted);
  font-size: 13px;
}

.check-row,
.checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
}

.check-row input,
.checkbox-row input {
  width: 18px;
  height: 18px;
}

.intake-shell {
  max-width: 760px;
}

.public-intake-card {
  display: grid;
  gap: 18px;
  padding: 32px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.public-intake-card h1 {
  font-size: 42px;
}

.intake-public-form {
  gap: 18px;
}

.booking-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.booking-meta span {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
  color: var(--muted);
  font-size: 14px;
}

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

.offer-course-option {
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.offer-course-option span {
  display: grid;
  gap: 3px;
}

.offer-course-option small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.offer-public-shell {
  width: min(1120px, calc(100% - 40px));
}

.offer-public-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 24px;
  align-items: start;
}

.offer-public-copy {
  display: grid;
  gap: 22px;
  padding: 36px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.96);
  box-shadow: var(--shadow-card);
}

.offer-public-copy h1 {
  font-size: 58px;
}

.offer-public-copy > p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.55;
}

.offer-course-summary {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.offer-course-summary li {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.offer-course-summary span,
.offer-checkout-card .muted {
  color: var(--muted);
  line-height: 1.5;
}

.offer-included-courses {
  display: grid;
  gap: 14px;
}

.offer-included-course-grid {
  display: grid;
  gap: 14px;
}

.offer-included-course-card {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.offer-included-course-cover {
  display: block;
  overflow: hidden;
  min-height: 118px;
  border-radius: 8px;
  color: var(--primary);
  text-decoration: none;
  background: var(--sage);
}

.offer-included-course-cover img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 118px;
  object-fit: cover;
}

.offer-included-course-cover .tenant-home-course-fallback {
  min-height: 118px;
  font-size: 30px;
}

.offer-included-course-card div {
  display: grid;
  gap: 8px;
  align-content: center;
  min-width: 0;
}

.offer-included-course-card h2 {
  font-size: 22px;
  line-height: 1.15;
}

.offer-included-course-card h2 a {
  color: var(--ink);
  text-decoration: none;
}

.offer-included-course-card h2 a:hover {
  color: var(--primary);
}

.offer-included-course-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

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

.offer-thanks-courses {
  margin-top: 18px;
}

.offer-thanks-course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}

.offer-thanks-course-card {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 16px;
  align-content: space-between;
  min-height: 180px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-soft);
}

.offer-thanks-course-cover {
  display: block;
  overflow: hidden;
  align-self: start;
  aspect-ratio: 16 / 10;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #eaf1ef;
}

.offer-thanks-course-cover img,
.offer-thanks-course-cover .tenant-home-course-fallback {
  width: 100%;
  height: 100%;
}

.offer-thanks-course-cover img {
  display: block;
  object-fit: cover;
}

.offer-thanks-course-card .button {
  grid-column: 2;
  justify-self: start;
}

.offer-thanks-course-card h3 {
  margin: 0 0 8px;
  font-size: 1.15rem;
}

.offer-thanks-course-card p {
  margin: 0;
  color: var(--muted);
}

.offer-thanks-course-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0 0;
}

.offer-thanks-course-facts div {
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(255, 253, 250, 0.72);
}

.offer-thanks-course-facts dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.offer-thanks-course-facts dd {
  margin: 3px 0 0;
  color: var(--ink);
  font-weight: 900;
}

.offer-checkout-card {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 16px;
}

.offer-checkout-card .button {
  width: 100%;
}

.thanks-card {
  min-height: 320px;
  align-content: center;
}

.course-library-source-editor-card {
  display: block;
  border-left: 4px solid var(--primary);
}
.course-library-source-body {
  display: grid;
  gap: 14px;
}
.course-library-source-body .course-library-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.course-library-source-editor-card h2 {
  margin: 6px 0 8px;
  font-size: 24px;
  line-height: 1.15;
}

.course-library-source-editor-card p {
  margin: 0;
  max-width: 680px;
  color: var(--muted);
  line-height: 1.5;
}

.course-library-source-editor-card .status-pill,
.course-library-source-editor-card .starter-track-focus {
  margin-right: 8px;
}

.course-library-source-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.course-library-source-facts div {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(58, 63, 70, 0.13);
  border-radius: 8px;
  background: var(--panel-tint);
}

.course-library-source-facts dt,
.course-library-source-facts dd {
  margin: 0;
}

.course-library-source-facts dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.course-library-source-facts dd {
  margin-top: 4px;
  color: var(--ink);
  font-size: 17px;
  font-weight: 900;
}

.course-library-source-actions {
  display: grid;
  gap: 10px;
  justify-items: stretch;
}

.course-builder-next-card {
  border-left: 4px solid var(--accent);
}

.course-builder-next-layout {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(320px, 1.25fr) auto;
  gap: 18px;
  align-items: center;
}

.course-builder-next-layout h2 {
  margin: 4px 0 8px;
  font-size: 24px;
}

.course-builder-next-layout p {
  max-width: 620px;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.course-builder-step-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.course-builder-step-list li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  background: var(--panel-tint);
}

.course-builder-step-list span {
  display: inline-grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: var(--accent);
  font-weight: 800;
}

.course-builder-step-list strong,
.course-builder-step-list small {
  display: block;
}

.course-builder-step-list small {
  color: var(--muted);
  line-height: 1.35;
}

.course-builder-step-list em {
  padding: 5px 9px;
  border-radius: 999px;
  color: var(--accent);
  background: var(--accent-soft);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.course-builder-step-list em.ready {
  color: #007244;
  background: #dff8ec;
}

.course-builder-step-list em.later {
  color: var(--muted);
  background: #edf2f0;
}

.course-builder-next-actions {
  display: grid;
  gap: 10px;
  justify-items: stretch;
  min-width: 170px;
}

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

.curriculum-list.is-sorting .course-outline-module,
.curriculum-lesson-order-list.is-sorting .curriculum-lesson-order-row {
  transition: background 0.12s ease, border-color 0.12s ease, transform 0.12s ease;
}

.curriculum-list.is-reordered,
.curriculum-lesson-order-list.is-reordered {
  border-color: rgba(214, 160, 61, 0.46);
  box-shadow: inset 3px 0 0 var(--gold);
}

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

.curriculum-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: space-between;
  margin-bottom: 12px;
}

.curriculum-toolbar-summary {
  display: grid;
  gap: 2px;
  min-width: 180px;
  margin-right: auto;
}

.curriculum-toolbar-summary strong {
  color: var(--ink);
  font-size: 20px;
  line-height: 1.1;
}

.curriculum-toolbar-summary span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.module-block {
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  padding: 16px;
  background: var(--panel-tint);
}

.course-outline-module {
  overflow: hidden;
  padding: 0;
  background: #ffffff;
  transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.course-outline-module.is-dragging,
.curriculum-lesson-order-row.is-dragging {
  opacity: 0.72;
  border-color: rgba(58, 63, 70, 0.26);
  background: #eef7f4;
  box-shadow: 0 10px 22px rgba(8, 38, 44, 0.12);
  cursor: grabbing;
}

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

.course-outline-module .module-heading {
  align-items: center;
  margin: 0;
  padding: 16px;
  list-style: none;
  cursor: pointer;
}

.course-outline-module .module-heading::-webkit-details-marker {
  display: none;
}

.course-outline-module .module-heading > div {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.course-outline-module .module-heading h3 {
  overflow-wrap: anywhere;
}

.module-drag-handle,
.lesson-drag-handle.compact {
  flex: 0 0 auto;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f6f7f9;
  color: var(--muted);
  cursor: grab;
  font: inherit;
  font-size: 0;
  line-height: 0;
  opacity: 0;
  position: relative;
  transition: background 0.16s ease, border-color 0.16s ease, opacity 0.16s ease;
}

.module-drag-handle {
  width: 38px;
  height: 32px;
  margin: 0;
}

.lesson-drag-handle.compact {
  width: 34px;
  height: 30px;
}

.order-nudge-actions {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 4px;
  opacity: 0;
  transition: opacity 0.16s ease;
}

.order-nudge-actions button {
  min-width: 28px;
  height: 30px;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.order-nudge-actions button:hover,
.order-nudge-actions button:focus-visible {
  border-color: rgba(58, 63, 70, 0.24);
  background: #e9f2ef;
  color: var(--primary);
}

.module-drag-handle::before,
.lesson-drag-handle.compact::before,
.lesson-drag-handle::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 50%;
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: rgba(58, 63, 70, 0.68);
  box-shadow: 0 6px 0 rgba(58, 63, 70, 0.68);
  transform: translateX(-50%);
}

.lesson-drag-handle.compact::before {
  width: 14px;
}

.course-outline-module:hover > .module-heading .module-drag-handle,
.course-outline-module:focus-within > .module-heading .module-drag-handle,
.course-outline-module:hover > .module-heading .order-nudge-actions,
.course-outline-module:focus-within > .module-heading .order-nudge-actions,
.curriculum-lesson-order-row:hover .lesson-drag-handle.compact,
.curriculum-lesson-order-row:focus-within .lesson-drag-handle.compact,
.curriculum-lesson-order-row:hover .order-nudge-actions,
.curriculum-lesson-order-row:focus-within .order-nudge-actions,
.module-editor-lessons .lesson-order-row:hover .lesson-drag-handle,
.module-editor-lessons .lesson-order-row:focus-within .lesson-drag-handle,
.module-drag-handle:is(:hover, :focus-visible, :active),
.lesson-drag-handle:is(:hover, :focus-visible, :active),
.order-nudge-actions:focus-within {
  opacity: 1;
}

.module-drag-handle:hover,
.lesson-drag-handle:hover {
  border-color: rgba(58, 63, 70, 0.24);
  background: #e9f2ef;
}

.module-drag-handle:active,
.lesson-drag-handle.compact:active {
  cursor: grabbing;
}

.module-drag-handle:focus-visible,
.lesson-drag-handle.compact:focus-visible,
.button.is-ready:focus-visible {
  outline: 3px solid rgba(214, 160, 61, 0.34);
  outline-offset: 2px;
}

.module-collapse-icon {
  position: relative;
  display: inline-grid;
  flex: 0 0 24px;
  place-items: center;
  width: 24px;
  height: 24px;
  margin-top: -1px;
  border-radius: 999px;
  background: var(--sage);
}

.module-collapse-icon::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid var(--primary);
  border-bottom: 2px solid var(--primary);
  transform: translateY(-1px) rotate(45deg);
  transition: transform 0.16s ease;
}

.course-outline-module:not([open]) .module-collapse-icon::before {
  transform: translateX(1px) rotate(-45deg);
}

.module-summary-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}

.module-summary-action-collapse {
  display: none;
}

.course-outline-module[open] .module-summary-action-expand {
  display: none;
}

.course-outline-module[open] .module-summary-action-collapse {
  display: inline;
}

.module-actions-row {
  justify-content: flex-end;
  padding: 0 16px 14px;
}

.course-outline-module > .lesson-list,
.course-outline-module > .curriculum-empty-module {
  margin: 0 16px 16px;
}

.curriculum-assessment-group {
  margin: 0 16px 16px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.curriculum-course-assessments {
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  padding: 14px 16px 16px;
  background: #ffffff;
}

.curriculum-course-assessments.is-empty {
  background: #f8fbf8;
}

.curriculum-assessment-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.curriculum-assessment-heading > div:first-child {
  display: grid;
  gap: 2px;
}

.curriculum-assessment-heading strong {
  color: var(--ink);
  font-size: 14px;
}

.curriculum-assessment-heading span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.curriculum-assessment-list {
  margin: 0;
}

.curriculum-assessment-row {
  align-items: center;
}

.curriculum-assessment-row > .status-pill {
  flex: 0 0 auto;
}

.curriculum-assessment-row > div:first-of-type {
  flex: 1;
  min-width: 0;
}

.module-block h3 {
  margin: 0;
  font-size: 16px;
}

.module-heading p {
  margin: 4px 0 0;
  font-size: 13px;
}

.module-block ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 20px;
}

.lesson-list {
  padding-left: 0;
  list-style-position: inside;
}

.module-block li {
  color: var(--muted);
}

.lesson-list li {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.curriculum-lesson-order-row > div:first-of-type {
  flex: 1;
  min-width: 0;
}

.button.is-ready {
  border-color: rgba(214, 160, 61, 0.6);
  box-shadow: 0 0 0 3px rgba(214, 160, 61, 0.12);
}

.module-editor-lessons {
  border: 1px solid rgba(58, 63, 70, 0.12);
  border-radius: 8px;
  padding: 0 14px;
  background: #ffffff;
}

.module-editor-lessons.is-sorting .lesson-order-row {
  transition: background 0.12s ease, transform 0.12s ease;
}

.module-editor-lessons.is-reordered {
  border-color: rgba(214, 160, 61, 0.46);
  box-shadow: inset 3px 0 0 var(--gold);
}

.lesson-order-row {
  align-items: center;
}

.lesson-order-row.is-dragging {
  opacity: 0.48;
  background: #edf5f3;
}

.lesson-order-main {
  flex: 1;
}

.lesson-drag-handle {
  flex: 0 0 auto;
  border: 1px solid rgba(58, 63, 70, 0.14);
  border-radius: 8px;
  background: #f6f7f9;
  color: var(--muted);
  cursor: grab;
  font: inherit;
  font-size: 0;
  line-height: 1;
  opacity: 0;
  position: relative;
  width: 38px;
  height: 32px;
  transition: background 0.16s ease, border-color 0.16s ease, opacity 0.16s ease;
}

.lesson-drag-handle:active {
  cursor: grabbing;
}

.lesson-drag-handle:focus-visible {
  outline: 3px solid rgba(214, 160, 61, 0.34);
  outline-offset: 2px;
}

.lesson-list li:first-child {
  border-top: 0;
}

.lesson-list li div {
  display: grid;
  gap: 3px;
}

.lesson-list li span {
  color: var(--muted);
  font-size: 13px;
}

.module-block li span {
  color: var(--ink);
  font-weight: 700;
}

.lesson-list li div span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 400;
}

.module-block li em {
  margin-left: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.lesson-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: max-content;
}

.lesson-list-empty {
  align-items: center;
}

.curriculum-empty-module {
  margin-top: 10px;
}

.drip-schedule-list {
  gap: 14px;
}

.drip-module {
  display: grid;
  gap: 0;
  padding: 0;
  overflow: hidden;
  background: #ffffff;
}

.drip-module > summary {
  list-style: none;
}

.drip-module > summary::-webkit-details-marker {
  display: none;
}

.drip-module-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  cursor: pointer;
}

.drip-module-summary > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.drip-module-summary span:first-child {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.drip-module-summary strong {
  overflow-wrap: anywhere;
}

.drip-module-summary small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.drip-module-body {
  display: grid;
  gap: 12px;
  padding: 0 16px 16px;
}

.drip-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(150px, 180px) minmax(130px, 170px) minmax(130px, 170px);
  gap: 12px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-tint);
}

.drip-lesson-list {
  display: grid;
  gap: 8px;
  padding-left: 18px;
}

.drip-copy {
  display: grid;
  gap: 3px;
  align-self: center;
  min-width: 0;
}

.drip-copy span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.drip-copy strong {
  overflow-wrap: anywhere;
}

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

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-top: 14px;
  font-size: 14px;
}

th,
td {
  padding: 12px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

th {
  color: var(--muted);
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

td {
  background: transparent;
  font-variant-numeric: tabular-nums;
}

tbody tr:hover td {
  background: var(--panel-tint);
}

.empty-state {
  text-align: center;
}

.empty-state.inline {
  padding: 18px;
  text-align: left;
}

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

@media (prefers-reduced-motion: reduce) {
  .admin-sidebar-brand,
  .admin-sidebar-toggle,
  .admin-sidebar-toggle::after {
    transition: none;
  }
}

@media (max-width: 1100px) {
  .admin-app-frame {
    grid-template-columns: 240px minmax(0, 1fr);
  }

  .admin-sidebar {
    --sidebar-x: 12px;
    --sidebar-y: 16px;
    padding: 16px 12px;
  }

  .admin-appbar {
    padding: 0 24px;
  }

  .admin-app-frame .admin-shell {
    padding: 28px 24px;
  }

  .community-app-shell {
    grid-template-columns: 1fr;
    width: min(960px, calc(100% - 32px));
    min-height: 0;
  }

  .community-app-rail,
  .community-inspector {
    position: static;
    height: auto;
    overflow: visible;
  }

  .community-app-rail {
    border-radius: 8px 8px 0 0;
  }

  .community-inspector {
    padding: 0;
  }

  .community-dashboard-summary,
  .community-dashboard-grid,
  .community-dashboard-grid.two,
  .community-spaces-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .course-builder-next-layout {
    grid-template-columns: 1fr;
  }

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

  .course-library-source-editor-card {
    grid-template-columns: 1fr;
  }

  .course-library-source-actions {
    display: flex;
    flex-wrap: wrap;
  }

  .course-workspace-course-search,
  .owner-workbench-course-search {
    grid-template-columns: 1fr 1fr;
  }

  .course-workspace-course-search .form-actions,
  .owner-workbench-course-search .form-actions {
    justify-content: flex-start;
  }

  .media-library-summary-card {
    grid-template-columns: 1fr;
  }

  .course-builder-next-actions {
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
  }

  .public-info-grid,
  .launch-support-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .site-header {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px 20px;
  }

  .site-header nav {
    width: 100%;
    flex-wrap: wrap;
  }

  .site-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .site-footer nav {
    justify-content: flex-start;
  }

  .admin-app-frame {
    display: block;
  }

  .course-workspace-course-search,
  .owner-workbench-course-search {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    height: auto;
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .admin-sidebar-nav {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
  }

  .admin-sidebar-bottom {
    margin-top: 12px;
  }

  .admin-sidebar-footer {
    margin-top: 0;
  }

  .course-library-source-facts {
    grid-template-columns: 1fr;
  }

  .media-library-grid {
    grid-template-columns: 1fr;
  }

  .media-library-summary-facts {
    grid-template-columns: 1fr;
  }

  .admin-appbar {
    position: static;
    align-items: flex-start;
    flex-direction: column;
    min-height: 0;
    padding: 16px 20px;
  }

  .admin-appbar-actions {
    justify-content: flex-start;
    width: 100%;
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .admin-app-frame .admin-shell {
    padding: 24px 20px;
  }

  .admin-app-frame .admin-grid {
    grid-template-columns: 1fr;
  }

  .hero,
  .admin-grid,
  .payment-status-grid,
  .live-session-item,
  .resource-item,
  .metrics,
  .dashboard-heading,
  .dashboard-metrics,
  .platform-signup-includes,
  .public-info-grid,
  .platform-starter-pack-grid,
  .starter-library-next-action,
  .platform-signup-plans,
  .launch-check-list,
  .launch-support-grid,
  .support-hub-hero,
  .support-hub-signals,
  .support-outbox-summary-grid,
  .support-request-focus-grid,
  .support-request-card,
  .support-request-card dl,
  .support-hub-grid,
  .support-hub-columns,
  .launch-links-hero,
  .launch-links-checks,
  .launch-link-card,
  .owner-workbench-hero,
  .owner-workbench-flight-grid,
  .owner-workbench-signals,
  .owner-workbench-operation-metrics,
  .owner-workbench-operation-grid,
  .owner-workbench-operation-card,
  .owner-workbench-course,
  .owner-workbench-course dl,
  .owner-workbench-grid,
  .learning-card,
  .certificate-layout,
  .launch-card,
  .launch-card.ready,
  .platform-plan-readiness-grid,
  .platform-provisioning-steps,
  .platform-lifecycle-steps,
  .tenant-owner-start-steps,
  .workspace-handoff-steps,
  .setup-task,
  .recommendation-item,
  .brand-preview-card,
  .editor-layout,
  .offer-public-card,
  .learner-layout,
  .lesson-page .learner-layout,
  .learner-hero,
  .community-home-grid,
  .community-thread-grid,
  .community-dashboard-summary,
  .community-dashboard-grid,
  .community-dashboard-grid.two,
  .community-spaces-grid,
  .library-hero,
  .library-detail-hero,
  .library-detail-overview,
  .library-detail-pathways,
  .library-detail-layout,
  .library-module-preview,
  .library-bundle-signals,
  .tenant-home-hero,
  .tenant-home-paths,
  .report-split {
    grid-template-columns: 1fr;
  }

  .admin-topbar {
    flex-direction: column;
  }

  .tenant-owner-next-action {
    align-items: stretch;
    flex-direction: column;
  }

  .owner-workbench-entry-card {
    align-items: stretch;
    flex-direction: column;
  }

  .owner-workbench-focus h2 {
    max-width: none;
    font-size: 28px;
  }

  .owner-workbench-course-actions {
    justify-content: flex-start;
  }

  .quiz-builder-settings,
  .quiz-builder-review,
  .quiz-builder-navigator,
  .quiz-builder-choice-row,
  .assessment-context-card,
  .assessment-filter-form {
    grid-template-columns: 1fr;
  }

  .course-addon-grid {
    grid-template-columns: 1fr;
  }

  .course-addon-preview-strip {
    grid-template-columns: 1fr;
  }

  .course-audio-panel {
    padding: 20px;
  }

  .course-audio-chapter-button {
    grid-template-columns: 1fr;
  }

  .course-audio-chapter-button small {
    grid-column: 1;
  }

  .course-audio-now-playing {
    grid-column: 1;
  }

  .course-audio-controls {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .course-audio-progress,
  .course-audio-speed {
    grid-column: 1 / -1;
  }

  .quiz-builder-header-actions {
    justify-content: flex-start;
  }

  .quiz-builder-choice-text {
    grid-template-columns: 28px minmax(0, 1fr);
  }

  .enrollment-context-card {
    align-items: stretch;
    flex-direction: column;
  }

  .tenant-owner-next-buttons,
  .enrollment-context-actions {
    justify-content: flex-start;
  }

  .tenant-home-hero {
    padding: 24px;
  }

  .tenant-home-hero h1 {
    font-size: 40px;
  }

  .tenant-home-paths article {
    border-right: 0;
    border-bottom: 1px solid rgba(58, 63, 70, 0.12);
  }

  .tenant-home-paths article:last-child {
    border-bottom: 0;
  }

  .tenant-home-offer-facts {
    grid-template-columns: 1fr;
  }

  .offer-included-course-card {
    grid-template-columns: 1fr;
  }

  .offer-thanks-course-card {
    grid-template-columns: 1fr;
  }

  .offer-thanks-course-card .button {
    grid-column: 1;
  }

  .offer-thanks-course-facts {
    grid-template-columns: 1fr;
  }

  .library-course-card-facts {
    grid-template-columns: 1fr;
  }

  .library-bundle-card-header {
    flex-direction: column;
  }

  .community-feed-panel {
    padding: 20px;
  }

  .community-feed-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .community-rail-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .account-switcher {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }

  .account-switcher label {
    min-width: 0;
  }

  .form-grid.two,
  .form-grid.three,
  .form-grid.four,
  .course-settings-grid,
  .course-delete-zone,
  .module-heading,
  .enrollment-form,
  .drip-row,
  .filter-form {
    grid-template-columns: 1fr;
  }

  .course-delete-zone .button {
    justify-self: start;
  }

  .module-heading {
    display: grid;
  }

  .learner-test-handoff,
  .learner-test-copy,
  .learner-test-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .learner-test-actions {
    min-width: 0;
  }

  .curriculum-toolbar,
  .lesson-list li,
  .lesson-row-actions,
  .preview-mode-banner {
    align-items: flex-start;
    justify-content: flex-start;
  }

  .curriculum-toolbar-summary {
    width: 100%;
  }

  .course-outline-module .module-heading {
    display: grid;
    gap: 10px;
  }

  .course-outline-module .module-heading > div {
    width: 100%;
  }

  .course-editor-panel-summary,
  .drip-module-summary {
    grid-template-columns: minmax(0, 1fr);
    align-items: flex-start;
  }

  .course-editor-panel-summary .status-pill,
  .drip-module-summary .status-pill,
  .panel-summary-action {
    width: fit-content;
  }

  .module-summary-action {
    white-space: normal;
  }

  .module-actions-row {
    justify-content: flex-start;
  }

  .preview-mode-banner,
  .preview-mode-actions {
    flex-direction: column;
  }

  .lesson-list li,
  .lesson-row-actions {
    flex-wrap: wrap;
  }

  .community-space-actions {
    justify-content: flex-start;
  }

  .drip-lesson-list {
    padding-left: 0;
  }

  .editor-sidebar {
    position: static;
  }

  .lesson-video-handoff-heading,
  .lesson-video-handoff-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .lesson-video-handoff-actions span {
    margin-right: 0;
  }

  .launch-actions {
    justify-content: flex-start;
  }

  .setup-progress {
    width: 100%;
    text-align: left;
  }

  .setup-progress small {
    justify-self: start;
  }

  .setup-task-actions {
    justify-content: flex-start;
  }

  .recommendation-item .button {
    grid-column: 1;
  }

  .payment-check-item {
    grid-template-columns: 1fr;
  }

  .payment-check-item .button {
    width: fit-content;
  }

  .live-session-actions {
    justify-content: flex-start;
  }

  .assessment-actions {
    justify-content: flex-start;
    min-height: 0;
  }

  .form-footer {
    justify-content: flex-start;
  }

  .automation-flow,
  .automation-next-item {
    grid-template-columns: 1fr;
  }

  .progress-panel,
  .course-rail,
  .certificate-sidebar {
    position: static;
  }

  .certificate-paper {
    min-height: 520px;
    padding: 34px 22px;
  }

  .certificate-footer {
    display: grid;
  }

  .hero > div:first-child {
    padding: 12px 0;
  }

  .learner-hero {
    gap: 18px;
    padding: 22px;
  }

  .curriculum-link {
    grid-template-columns: 30px minmax(0, 1fr);
  }

  .curriculum-link .completion-chip {
    grid-column: 2;
    width: fit-content;
  }

  .lesson-heading {
    display: grid;
  }

  h1 {
    font-size: 42px;
  }

  .page-heading h1,
  .learner-hero h1,
  .lesson-heading h1,
  .offer-public-copy h1 {
    font-size: 38px;
  }

  .certificate-paper h1 {
    font-size: 54px;
  }

  .certificate-paper strong {
    font-size: 42px;
  }
}

/* ============================================================
   Redesign reskin (2026-07-16) — course-editor outline + sidebar,
   restyled to the approved mockup. Structure/markup unchanged;
   hierarchy comes from layout + icons, NOT font weight/size tricks.
   ============================================================ */

/* --- Sidebar: clean, no boxed brand. Inset from the corner (mockup header
   padding), not flush against the top-left edge. --- */
.admin-sidebar-brand {
  min-height: 0;
  margin: 0 0 8px;
  padding: 22px 8px 14px;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
}
.admin-sidebar-brand:hover { background: var(--panel-tint); }
.admin-sidebar-brand img, .admin-brand-mark { width: 30px; height: 30px; border-radius: 8px; }
.admin-brand-mark { font-size: 15px; font-weight: 700; }
.admin-sidebar-brand strong { font-size: 15px; font-weight: 700; letter-spacing: -.2px; }
.admin-sidebar-brand small { font-weight: 600; letter-spacing: 0; text-transform: none; }

/* Tighter, continuous nav list (mockup reads as one clean column, not spaced boxes) */
.admin-sidebar-nav { gap: 4px; }
.admin-sidebar-section h2 { margin: 0; }

/* Group header = a mockup "nav-item": icon + label, NORMAL weight.
   Hierarchy comes from layout + icons, NOT bold category labels. */
.admin-sidebar-toggle {
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 9px;
  color: var(--ink-2, #464c55);
  font-size: 15px;
  font-weight: 500;
}
.admin-sidebar-toggle:hover { background: var(--panel-tint); color: var(--ink); }
.admin-sidebar-toggle:focus-visible { outline: 2px solid var(--sel-line, #d4e2ff); outline-offset: 1px; }
.admin-sidebar-toggle .admin-sidebar-icon { opacity: .8; }
.admin-sidebar-toggle::after { opacity: .55; }

.admin-sidebar-links a {
  border-radius: 9px;
  padding: 8px 10px;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-2, #464c55);
}
.admin-sidebar-links a:hover { background: var(--panel-tint); color: var(--ink); }
/* Active item = the mockup's subtle surface, NOT a heavy grey pill (no ring). */
.admin-sidebar-links a.active,
.admin-sidebar-links a[aria-current],
.admin-sidebar-links a.is-active {
  background: #eef0f2; color: var(--ink); font-weight: 600; box-shadow: none;
}

/* Quiet, neutral footer (was a green-tinted panel) */
.admin-sidebar-footer {
  border-color: var(--line);
  background: transparent;
  padding: 12px 10px 4px;
}
.admin-sidebar-footer span, .admin-sidebar-footer small { font-weight: 500; letter-spacing: 0; }
.admin-sidebar-footer .logout-form button { color: var(--ink-2, #464c55); font-weight: 600; }
.admin-sidebar-footer .logout-form button:hover { color: var(--ink); }

/* ---------------------------------------------------------------
   Admin dashboard (/admin/) — rebuilt to mockup fidelity.
   Calm, scannable, whitespace over chrome. Scoped to the dashboard
   shell so other admin screens are untouched.
   --------------------------------------------------------------- */
/* ONE vertical rhythm for every top-level section: a single flex-column
   gap, with ad-hoc per-section margins neutralized so nothing collides,
   touches, or overlaps. */
.admin-dashboard-shell { display: flex; flex-direction: column; gap: 22px; }
.admin-dashboard-shell > * { margin-top: 0; margin-bottom: 0; }
/* ONE larger page title (~24px), ink not black, calm weight. */
.admin-dashboard-shell .page-heading h1 {
  font-size: 24px; line-height: 1.2; font-weight: 680; letter-spacing: -.3px; color: var(--ink);
}
.admin-dashboard-shell .page-heading { margin-bottom: 0; }
.admin-dashboard-shell .page-heading > .kicker {
  margin-bottom: 6px; color: var(--muted); font-size: 12px; font-weight: 600; letter-spacing: .04em;
}
.admin-dashboard-shell .page-heading > p { margin-top: 6px; font-size: 14px; }

/* Cards: real content units on cool ground, pure-white surfaces, soft line. */
.admin-dashboard-shell .admin-card {
  border-color: var(--line); background: var(--panel);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(20,25,35,.05)); border-radius: 12px;
}
.admin-dashboard-shell .admin-card h2,
.admin-dashboard-shell .section-heading.compact h2 {
  font-size: 16px; font-weight: 600; letter-spacing: -.1px; color: var(--ink);
}
.admin-dashboard-shell .admin-card p,
.admin-dashboard-shell .section-heading.compact p { font-size: 13px; }

/* Quiet metrics strip — like the mockup's meta row, not a wall of cards. */
.admin-dashboard-shell .metrics { gap: 10px; }
.admin-dashboard-shell .metrics > div {
  border-color: var(--line); background: var(--panel); box-shadow: none; border-radius: 10px; padding: 12px 14px;
}
.admin-dashboard-shell .metrics span { font-size: 12px; font-weight: 500; }
.admin-dashboard-shell .metrics strong { font-size: 18px; font-weight: 650; }

/* Courses table now owns full width — columns are visible without cramming. */
.admin-dashboard-shell .admin-courses-card .table-scroll { overflow-x: auto; }
.admin-dashboard-shell .admin-courses-card table { width: 100%; }

/* --- Curriculum outline card --- */
.curriculum-outline-card {
  background: transparent; border: 0; box-shadow: none; padding: 0;
}
.curriculum-toolbar {
  display: flex; align-items: center; gap: 14px; margin-bottom: 16px;
  padding: 0; background: transparent; border: 0;
}

/* --- Module = card with a clean header row --- */
.module-block.course-outline-module {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  margin-bottom: 12px; box-shadow: var(--shadow-sm, 0 1px 2px rgba(20,25,35,.05)); overflow: visible; padding: 0;
}
.module-block.course-outline-module > summary {
  display: flex; align-items: center; gap: 12px; min-height: 54px; padding: 8px 14px;
  cursor: pointer; list-style: none; background: transparent; border-radius: 12px;
}
.module-block.course-outline-module[open] > summary { border-radius: 12px 12px 0 0; }
.module-block.course-outline-module .curriculum-lesson-order-row:last-child { border-radius: 0 0 12px 12px; }
.module-block.course-outline-module > summary::-webkit-details-marker { display: none; }
.module-block.course-outline-module > summary:hover { background: var(--panel-tint); }
.module-block.course-outline-module > summary h3 {
  margin: 0; font-size: 16px; font-weight: 550; letter-spacing: -.1px; color: var(--ink);
}
.module-block.course-outline-module > summary .muted { margin: 1px 0 0; font-size: 13px; }
.module-heading { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.module-summary-action { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }

/* --- Module action buttons row --- */
.module-actions-row { padding: 4px 14px 12px; gap: 8px; }

/* --- Lesson list + rows (consistent title size w/ module) --- */
.lesson-list.curriculum-lesson-order-list { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.curriculum-lesson-order-row {
  display: flex; align-items: center; gap: 12px; padding: 10px 14px 10px 16px;
  border-bottom: 1px solid var(--line-2, #eeeff2); background: transparent;
}
.curriculum-lesson-order-row:last-child { border-bottom: 0; }
.curriculum-lesson-order-row:hover { background: var(--panel-tint); }
.curriculum-lesson-order-row > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.curriculum-lesson-order-row .table-link {
  font-size: 16px; font-weight: 550; color: var(--ink); text-decoration: none; letter-spacing: -.1px;
}
.curriculum-lesson-order-row .table-link:hover { color: var(--primary); }
.curriculum-lesson-order-row > div > span { font-size: 13px; color: var(--muted); }
.lesson-row-actions { display: flex; align-items: center; gap: 8px; }

/* --- Lesson status text -> green "Published" pill look --- */
.lesson-row-actions em {
  font-style: normal; font-size: 13px; font-weight: 600; padding: 3px 10px; border-radius: 999px;
  background: #e8f5ed; color: #147b3d; border: 1px solid #cde8d6;
}

/* --- Drag handles / nudge: quiet until hover --- */
.module-drag-handle, .lesson-drag-handle, .order-nudge-actions { color: var(--muted); }

/* --- Curriculum toolbar: quiet summary + consolidated "Add Content" menu (2026-07-16) --- */
.curriculum-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.curriculum-toolbar-summary strong { font-size: 15px; font-weight: 600; color: var(--ink); }
.curriculum-toolbar-summary span { font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.curriculum-toolbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* light "ghost" utility buttons (collapse/expand) instead of heavy bordered ones */
.button.ghost { background: transparent; border: 1px solid transparent; color: var(--ink-2, #464c55); box-shadow: none; }
.button.ghost:hover { background: var(--panel-tint); color: var(--ink); }

/* Add Content dropdown — native <details> menu, no JS */
.cf-menu { position: relative; display: inline-block; }
.cf-menu > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; }
.cf-menu > summary::-webkit-details-marker { display: none; }
.cf-menu > summary::after { content: ""; width: 7px; height: 7px; margin-left: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .85; }
.cf-menu[open] > summary::after { transform: rotate(-135deg) translateY(2px); }
.cf-menu-panel { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; min-width: 210px; padding: 6px; display: flex; flex-direction: column; gap: 1px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 32px rgba(20,25,35,.14); }
.cf-menu-item { padding: 9px 12px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--ink); text-decoration: none; white-space: nowrap; }
.cf-menu-item:hover { background: var(--panel-tint); }

/* --- Staging environment ribbon (only renders when APP_NAME contains "Staging") --- */
.admin-env-ribbon {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 7px 16px;
  background: repeating-linear-gradient(135deg, #b45309 0 14px, #c2620f 14px 28px);
  color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  box-shadow: 0 1px 0 rgba(0,0,0,.12);
}

/* --- Course hero header: cover + title + status pill --- */
.build-workspace-topbar.has-cover {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center;
}
.course-hero-cover {
  width: 132px; height: 84px; flex: 0 0 auto; overflow: hidden;
  border-radius: 10px; border: 1px solid var(--line);
  background-color: var(--panel-tint); background-size: cover; background-position: center; background-repeat: no-repeat;
}
.build-workspace-topbar.has-cover .page-heading h1 {
  font-size: clamp(24px, 2.6vw, 32px); line-height: 1.14; margin: 6px 0 10px;
}
.course-hero-status {
  display: inline-flex; align-items: center; vertical-align: middle; margin-left: 10px;
  padding: 2px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase;
  color: var(--muted); background: var(--panel-tint); border: 1px solid var(--line);
}
.course-hero-status.is-published { color: #147b3d; background: #e8f5ed; border-color: #cde8d6; }

/* --- Workspace navs as clean underline tabs (design family, all admin sections) --- */
.build-workspace-nav,
.sales-workspace-nav,
.operations-workspace-nav,
.people-workspace-nav,
.community-workspace-nav,
.settings-workspace-nav,
.system-owner-workspace-nav {
  gap: 2px; margin: 10px 0 20px; padding: 0;
  border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent;
}
.build-workspace-nav a,
.sales-workspace-nav a,
.operations-workspace-nav a,
.people-workspace-nav a,
.community-workspace-nav a,
.settings-workspace-nav a,
.system-owner-workspace-nav a {
  min-height: 38px; padding: 0 12px 10px; margin-bottom: -1px;
  border-radius: 0; border-bottom: 2px solid transparent;
  font-size: 14px; font-weight: 500; color: var(--muted);
}
.build-workspace-nav a:hover,
.sales-workspace-nav a:hover,
.operations-workspace-nav a:hover,
.people-workspace-nav a:hover,
.community-workspace-nav a:hover,
.settings-workspace-nav a:hover,
.system-owner-workspace-nav a:hover { background: transparent; color: var(--ink); }
.build-workspace-nav a.active,
.sales-workspace-nav a.active,
.operations-workspace-nav a.active,
.people-workspace-nav a.active,
.community-workspace-nav a.active,
.settings-workspace-nav a.active,
.system-owner-workspace-nav a.active {
  color: var(--ink); background: transparent; border-bottom-color: var(--accent); box-shadow: none;
}

/* --- Collapsible admin card (native <details>, no JS) --- */
.cf-collapse-card { padding-top: 14px; padding-bottom: 14px; }
.cf-collapse-card > summary.cf-collapse-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  cursor: pointer; list-style: none;
}
.cf-collapse-card > summary.cf-collapse-summary::-webkit-details-marker { display: none; }
.cf-collapse-summary strong { display: block; font-size: 18px; font-weight: 650; color: var(--ink); letter-spacing: -.1px; }
.cf-collapse-summary .eyebrow { display: block; }
.cf-collapse-meta {
  display: inline-flex; align-items: center; gap: 8px; margin-left: auto;
  font-size: 12px; font-weight: 600; color: var(--muted); white-space: nowrap;
}
.cf-collapse-meta::after {
  content: ""; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted);
  transform: rotate(45deg) translateY(-2px); opacity: .7; transition: transform .15s ease;
}
.cf-collapse-card[open] > summary .cf-collapse-meta::after { transform: rotate(-135deg) translateY(2px); }
.cf-collapse-card[open] > summary.cf-collapse-summary {
  margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--line);
}

/* =====================================================================
   PUBLIC REDESIGN — mockup fidelity (2026-07-17)
   Opt-in shell: add `cf-public` to a public screen's <main> to bring it
   onto the approved mockup system — calm even type (13–15px, one ~26–32px
   title), flat white surfaces on cool ground, soft 1px lines, restrained
   blue accent, whitespace over chrome, hierarchy by layout not bold.
   Scoped so admin + learner screens stay untouched. Mirrors the locked
   .admin-dashboard-shell pattern; the legacy loud/gradient/gold public
   rules above are overridden here by ancestor specificity.
   ===================================================================== */
.cf-public { display: flex; flex-direction: column; gap: 22px; }
.cf-public > * { margin-top: 0; margin-bottom: 0; }

/* ONE calm title system — no 48–86px billboards. Hero title ~26–32px,
   ink not black, quiet weight; hierarchy from layout, not size/weight. */
.cf-public h1 {
  max-width: none; font-size: clamp(25px, 2.7vw, 32px); line-height: 1.16;
  font-weight: 680; letter-spacing: -.3px; color: var(--ink);
}
.cf-public .kicker {
  margin: 0 0 8px; color: var(--muted); font-size: 12px; font-weight: 600;
  letter-spacing: .04em; text-transform: uppercase;
}
.cf-public .lede,
.cf-public .public-info-hero > p,
.cf-public .library-hero > div > p,
.cf-public .library-detail-hero > div > p,
.cf-public .tenant-home-hero p,
.cf-public .offer-public-copy > p,
.cf-public .public-intake-card > p {
  max-width: 70ch; font-size: 15px; line-height: 1.6; color: var(--muted);
}

/* Section headings on the calm compact scale (matches admin dashboard). */
.cf-public .section-heading { align-items: baseline; }
.cf-public .section-heading h2 {
  font-size: 17px; font-weight: 600; letter-spacing: -.1px; color: var(--ink);
}
.cf-public .section-heading.compact h2 { font-size: 16px; }
.cf-public .section-heading p { font-size: 13px; color: var(--muted); }
.cf-public .section-heading > span {
  font-size: 13px; font-weight: 500; color: var(--muted); text-transform: none; letter-spacing: 0;
}

/* Real content units become flat white cards on cool ground: soft line,
   12px radius, whisper shadow — no gradients, no gold, no heavy borders. */
.cf-public .public-info-card,
.cf-public .course-card,
.cf-public .tenant-home-course-card,
.cf-public .tenant-home-offer-card,
.cf-public .library-course-card,
.cf-public .library-bundle-card,
.cf-public .offer-included-course-card,
.cf-public .offer-thanks-course-card,
.cf-public .tenant-home-section,
.cf-public .tenant-home-paths,
.cf-public .library-section,
.cf-public .library-section-card,
.cf-public .library-offer-panel,
.cf-public .offer-public-copy,
.cf-public .offer-checkout-card,
.cf-public .public-intake-card,
.cf-public .credential-verification .learner-panel {
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(20,25,35,.05));
}

/* Hero panels: calm carded head like the mockup course-head — flat white,
   no gradient billboard. */
.cf-public .library-hero,
.cf-public .library-detail-hero,
.cf-public .tenant-home-hero {
  padding: 28px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--panel); box-shadow: var(--shadow-sm, 0 1px 2px rgba(20,25,35,.05));
}
.cf-public .library-hero-panel,
.cf-public .tenant-home-hero-panel {
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel-tint); box-shadow: none;
}
.cf-public .library-hero-panel span,
.cf-public .tenant-home-hero-panel span {
  font-size: 11px; font-weight: 600; letter-spacing: .04em; color: var(--muted);
}
.cf-public .library-hero-panel strong,
.cf-public .tenant-home-hero-panel strong {
  font-size: 18px; font-weight: 650; color: var(--ink);
}
.cf-public .library-hero > div > h1,
.cf-public .library-detail-hero > div > h1,
.cf-public .tenant-home-hero h1,
.cf-public .offer-public-copy h1,
.cf-public .public-intake-card h1,
.cf-public .public-info-hero h1,
.cf-public .page-heading h1 { font-size: clamp(25px, 2.7vw, 32px); line-height: 1.16; }

/* Editorial hero for pages that lead with an open (un-carded) heading —
   catalog + public info. Calm subtitle, no billboard. */
.cf-public .catalog-hero,
.cf-public .public-info-hero { padding: 4px 0 2px; max-width: 820px; }
.cf-public .catalog-hero p,
.cf-public .public-info-hero > p { font-size: 15px; line-height: 1.6; color: var(--muted); }

/* Card interiors: calm titles + de-bolded links (hierarchy by layout). */
.cf-public .public-info-card h2,
.cf-public .tenant-home-offer-card h3,
.cf-public .offer-included-course-card h2 { font-size: 16px; font-weight: 600; color: var(--ink); }
.cf-public .course-card h2,
.cf-public .library-course-card h2,
.cf-public .tenant-home-course-card h2 { font-size: 16px; font-weight: 600; letter-spacing: -.1px; }
.cf-public .course-card,
.cf-public .public-info-card p,
.cf-public .course-card p { font-size: 14px; }
.cf-public .course-card a,
.cf-public .library-course-card h2 a,
.cf-public .tenant-home-course-card h2 a,
.cf-public .offer-included-course-card h2 a { font-weight: 600; }

/* Flat course cards (catalog): no gradient/gold, quiet hover. */
.cf-public .course-card {
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(20,25,35,.05));
  transition: border-color .15s ease, box-shadow .15s ease;
}
.cf-public .course-card:hover {
  border-color: #d4dae2; transform: none;
  box-shadow: 0 6px 18px rgba(23,33,38,.07);
}

.cf-public .course-card-meta { display: flex; flex-wrap: wrap; gap: 8px; }

/* Meta chips: quiet, even, de-bolded — restrained blue for library/accent. */
.cf-public .course-status,
.cf-public .course-category,
.cf-public .course-duration-pill {
  font-size: 12px; font-weight: 550; color: var(--muted);
  background: var(--panel-tint); border: 1px solid var(--line);
}
.cf-public .course-category.library,
.cf-public .course-status {
  color: var(--accent); background: var(--accent-soft); border-color: transparent;
}

/* Filter chips: calm pills; active = restrained blue, not solid ink. */
.cf-public .filter-chip {
  font-weight: 550; color: var(--muted); background: var(--panel);
  border: 1px solid var(--line);
}
.cf-public .filter-chip.active,
.cf-public .filter-chip:hover {
  color: var(--accent); background: var(--accent-soft); border-color: #d4e2ff;
}

/* Numbered "paths" strip: quiet accent markers, not heavy filled discs. */
.cf-public .tenant-home-paths span {
  color: var(--accent); background: var(--accent-soft); font-weight: 650; font-size: 14px;
}
.cf-public .tenant-home-paths article h2 { font-size: 16px; font-weight: 600; }

/* Offer list bullets: drop the gold left-border for a soft neutral line. */
.cf-public .tenant-home-offer-card li { border-left-color: var(--line); }
.cf-public .tenant-home-offer-heading span,
.cf-public .tenant-home-source-note {
  font-weight: 600; letter-spacing: .02em;
  color: var(--accent); background: var(--accent-soft);
}
.cf-public .tenant-home-offer-facts strong,
.cf-public .offer-thanks-course-facts dd { font-weight: 600; }

/* Metrics strip: quiet even tiles (mockup meta row, not a wall of cards). */
.cf-public .metrics > div {
  border: 1px solid var(--line); background: var(--panel); box-shadow: none; border-radius: 10px;
}
.cf-public .metrics span { font-size: 12px; font-weight: 500; }
.cf-public .metrics strong { font-size: 18px; font-weight: 650; }

/* Empty states: quiet, not loud. */
.cf-public .empty-state {
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(20,25,35,.05));
}
.cf-public .empty-state h2 { font-size: 17px; font-weight: 600; }