/**
 * OrthoBOARD live design patch — audit-driven UI fixes (2026-06-13)
 * Touch targets, button consistency, focus rings, dead-link prevention
 */

/* Theme / header icon buttons — min 44px touch target (WCAG 2.5.5) */
button[aria-label="Change appearance"],
button[aria-label="Search content"],
button[aria-label="Keyboard shortcuts"],
button[aria-label="Messages"],
button[aria-label="Notifications"],
header button.icon-btn,
header button[class*="rounded-full"] {
  min-height: 44px !important;
  min-width: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Streak / level pills and admin edit chip in header */
header a[href*="/analytics"],
header a[href*="/profile"],
header button[class*="min-h-"] {
  min-height: 44px !important;
}

/* Primary CTAs — touch sizing only; hover/active stay on server .btn-primary rules */
button[type="submit"],
a[class*="btn-primary"],
button[class*="btn-primary"] {
  min-height: 44px !important;
  border-radius: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

/* Secondary / ghost buttons — match WCAG 2.5.5 */
button[class*="btn-secondary"],
button[class*="btn-ghost"],
button.border-white\/10 {
  min-height: 44px !important;
  min-width: 44px !important;
  border-radius: 0.625rem !important;
}

/* Focus visibility for keyboard users */
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid rgb(185 28 28 / 0.85) !important;
  outline-offset: 2px !important;
}

/* Shared modal / dialog entrance (complements framer route motion) */
[role="dialog"][aria-modal="true"] {
  animation: ob-modal-in 0.18s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes ob-modal-in {
  from {
    opacity: 0;
    transform: translateY(6px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  [role="dialog"][aria-modal="true"] {
    animation: none;
  }
}

/* Nav links — clearer active/hover states */
nav a[aria-current="page"],
aside a[aria-current="page"] {
  font-weight: 600;
}

nav a:hover,
aside a:hover {
  color: #b91c1c !important;
}

/* Card action links on home dashboard */
a[class*="group"][href*="/practice"],
a[class*="group"][href*="/exam"],
a[class*="group"][href*="/flashcards"] {
  min-height: 48px;
}

/* Error / alert banners — readable contrast */
[role="alert"],
.alert,
[class*="alert-"] {
  border-radius: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.45;
}

/* Filter / tag / session-type chips (bookmarks, history, error-log, reference, search) */
[role="tab"],
button[class*="rounded-full"]:not(header button):not([aria-label]),
[class*="filter"] button,
[class*="chip"] button,
button.search-filter-chip,
.search-filter-chip,
main[class*="senior"] button[class*="rounded-full"],
main button[class*="domain-filter"],
[class*="senior"] [class*="filter"] button,
/* Topic Map sort chips (Status scale row, TopicMapPage) */
section.panel-shell button.rounded-xl.border {
  min-height: 44px !important;
  min-width: 44px !important;
  padding-top: 0.625rem !important;
  padding-bottom: 0.625rem !important;
}

/* Home section toggles + sidebar controls */
aside button,
aside a.sidebar-link,
.home-surface-card button {
  min-height: 44px !important;
  min-width: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Empty-state recovery actions */
.empty-panel button,
.empty-panel a,
a[class*="clear"],
button[class*="clear"] {
  min-height: 44px !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

/* Practice / viva session toolbar + mnemonics icon grid */
main button[class*="icon"],
[class*="mnemonic"] button,
[class*="session"] button {
  min-height: 44px !important;
  min-width: 44px !important;
}

/* Practice question toolbar: one shared 44px footprint for End & Mark / Pause / Dismiss */
main .practice-question-toolbar button,
main .practice-question-toolbar [role="button"] {
  width: 2.75rem !important;
  height: 2.75rem !important;
  min-width: 2.75rem !important;
  min-height: 2.75rem !important;
  max-width: 2.75rem !important;
  max-height: 2.75rem !important;
  padding: 0 !important;
  box-sizing: border-box;
}

/* Notifications inbox row icon actions */
main[class*="notification"] button,
[class*="Notifications"] button,
main button[aria-label*="read" i],
main button[aria-label*="delete" i],
main button[aria-label*="notification" i] {
  min-height: 44px !important;
  min-width: 44px !important;
}

/* Viva history row actions (Reset / Delete / Untested) */
main table button,
main ol button,
main ul li button {
  min-height: 44px !important;
  min-width: 44px !important;
}

/* Collections row actions (rename, delete) */
[class*="collection"] button,
.completed-sessions button {
  min-height: 44px !important;
  min-width: 44px !important;
}

/* Light-mode secure reader — fix unreadable gray-on-white prose */
[data-appearance="light"] .secure-reader-html-body {
  color: #334155 !important;
}
[data-appearance="light"] .secure-reader-html-body h1,
[data-appearance="light"] .secure-reader-html-body h2,
[data-appearance="light"] .secure-reader-html-body h3,
[data-appearance="light"] .secure-reader-html-body h4,
[data-appearance="light"] .secure-reader-html-body h5 {
  color: #0f172a !important;
}
[data-appearance="light"] .secure-reader-html-body strong,
[data-appearance="light"] .secure-reader-html-body b {
  color: #1e293b !important;
}

/* Mobile page-wrap-wide parity with platform-compatibility (page-wrap only had p-3) */
@media (max-width: 640px) {
  .page-wrap-wide {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* Prevent Viva session double horizontal padding when nested px-* utilities exist */
.page-wrap-wide[class*="px-"],
.page-wrap-wide .page-wrap-wide {
  padding-left: var(--space-page-x, 1rem) !important;
  padding-right: var(--space-page-x, 1rem) !important;
}

/* Mobile bottom nav touch targets */
@media (max-width: 768px) {
  nav a,
  [role="navigation"] a,
  [role="navigation"] button {
    min-height: 44px !important;
    padding-top: 0.5rem !important;
    padding-bottom: calc(0.5rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Public page back buttons (pricing, contact, register) */
main a[class*="btn"],
main button[class*="btn"],
a[class*="btn-primary"],
a[class*="btn-secondary"] {
  min-height: 44px !important;
  min-width: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0.75rem !important;
  font-weight: 600 !important;
  padding: 0.625rem 1.25rem !important;
}

/* Reference accordion / card expanders (outcomes, mnemonics, etc.) */
main [class*="cursor-pointer"],
main .space-y-2 > div[class*="cursor-pointer"] {
  min-height: 44px !important;
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

/* Prevent invisible dead anchors from capturing clicks */
a[href="#"]:not([role]),
a:not([href]) {
  pointer-events: none;
  opacity: 0.5;
}

/* ── Light / white appearance — readable contrast on panels (audit 2026-06-14) ── */

[data-appearance="light"],
:root.light {
  color-scheme: light;
}

[data-appearance="light"] body,
:root.light body {
  background-color: #f8fafc !important;
  color: #0f172a !important;
}

/* Core panel typography */
[data-appearance="light"] :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"]),
:root.light :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"]) {
  color: #334155;
}

[data-appearance="light"] :is(.panel-copy, .panel-kicker, .content-title, .content-title-strong, .page-title, .page-title-compact, .section-title, .surface-title, .metric-label),
:root.light :is(.panel-copy, .panel-kicker, .content-title, .content-title-strong, .page-title, .page-title-compact, .section-title, .surface-title, .metric-label) {
  color: #0f172a !important;
}

[data-appearance="light"] .home-surface-badge,
:root.light .home-surface-badge {
  color: #475569 !important;
  background-color: #e2e8f0 !important;
  border-color: #cbd5e1 !important;
}

/* Dark-theme slate utilities on light surfaces */
[data-appearance="light"] :is(.card, .panel-shell, .page-hero-shell, .home-surface-card, main) :is(
  .text-dark-100,
  .text-dark-200,
  .text-dark-300,
  .text-dark-400,
  .text-dark-500,
  [class*="text-dark-100"],
  [class*="text-dark-200"],
  [class*="text-dark-300"],
  [class*="text-dark-400"],
  [class*="text-dark-500"]
),
:root.light :is(.card, .panel-shell, .page-hero-shell, .home-surface-card, main) :is(
  .text-dark-100,
  .text-dark-200,
  .text-dark-300,
  .text-dark-400,
  .text-dark-500,
  [class*="text-dark-100"],
  [class*="text-dark-200"],
  [class*="text-dark-300"],
  [class*="text-dark-400"],
  [class*="text-dark-500"]
) {
  color: #334155 !important;
}

[data-appearance="light"] .badge-ghost,
:root.light .badge-ghost {
  color: #475569 !important;
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
}

[data-appearance="light"] :is(.text-red-500, [class*="text-red-500"]),
:root.light :is(.text-red-500, [class*="text-red-500"]) {
  color: #b91c1c !important;
}

/* text-white and pale accent utilities left over from dark layouts */
[data-appearance="light"] :is(.card, .panel-shell, .page-hero-shell, .home-surface-card, .panel) :is(
  .text-white,
  [class*="text-white"]
),
:root.light :is(.card, .panel-shell, .page-hero-shell, .home-surface-card, .panel) :is(
  .text-white,
  [class*="text-white"]
) {
  color: #0f172a !important;
}

/* Icon boxes and frosted chips (Reference Hub section cards, metrics, etc.) */
[data-appearance="light"] :is(.card, .panel-shell, .page-hero-shell) .icon-box,
:root.light :is(.card, .panel-shell, .page-hero-shell) .icon-box {
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #475569 !important;
}

[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-red"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-red"] {
  color: #b91c1c !important;
  background-color: #fef2f2 !important;
  border-color: #fecaca !important;
}

[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-emerald"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-emerald"] {
  color: #b45309 !important;
  background-color: #fff7ed !important;
  border-color: #fed7aa !important;
}

[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-blue"],
[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-sky"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-blue"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-sky"] {
  color: #b91c1c !important;
  background-color: #fef2f2 !important;
  border-color: #fecaca !important;
}

[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-amber"],
[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-yellow"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-amber"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-yellow"] {
  color: #b45309 !important;
  background-color: #fffbeb !important;
  border-color: #fde68a !important;
}

[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-fuchsia"],
[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-pink"],
[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-purple"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-fuchsia"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-pink"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-purple"] {
  color: #991b1b !important;
  background-color: #fef2f2 !important;
  border-color: #fecaca !important;
}

[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-lime"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-lime"] {
  color: #4d7c0f !important;
  background-color: #f7fee7 !important;
  border-color: #d9f99d !important;
}

[data-appearance="light"] :is(.card, .panel-shell) :is(
  [class*="border-white/10"][class*="bg-white/10"],
  [class*="border-white\\/10"][class*="bg-white\\/10"]
),
:root.light :is(.card, .panel-shell) :is(
  [class*="border-white/10"][class*="bg-white/10"],
  [class*="border-white\\/10"][class*="bg-white\\/10"]
) {
  color: #475569 !important;
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
}

/* Tailwind *-300 accent text on white panels */
[data-appearance="light"] :is(.card, .panel-shell, .page-hero-shell) :is(
  [class*="text-red-300"],
  [class*="text-orange-300"],
  [class*="text-amber-300"],
  [class*="text-yellow-300"],
  [class*="text-lime-300"],
  [class*="text-emerald-300"],
  [class*="text-sky-300"],
  [class*="text-blue-300"],
  [class*="text-fuchsia-300"],
  [class*="text-pink-300"]
),
:root.light :is(.card, .panel-shell, .page-hero-shell) :is(
  [class*="text-red-300"],
  [class*="text-orange-300"],
  [class*="text-amber-300"],
  [class*="text-yellow-300"],
  [class*="text-lime-300"],
  [class*="text-emerald-300"],
  [class*="text-sky-300"],
  [class*="text-blue-300"],
  [class*="text-fuchsia-300"],
  [class*="text-pink-300"]
) {
  color: #334155 !important;
}

/* Header / sidebar nav on light */
[data-appearance="light"] header,
[data-appearance="light"] aside,
:root.light header,
:root.light aside {
  color: #0f172a;
}

[data-appearance="light"] :is(header, aside) :is(.content-title, .sidebar-link, nav a),
:root.light :is(header, aside) :is(.content-title, .sidebar-link, nav a) {
  color: #0f172a !important;
}

/* Tables and lists inside panels */
[data-appearance="light"] :is(.panel-shell, .card, main) :is(table, tbody, tr, td, th, li, p, label, span:not([class*="badge"])),
:root.light :is(.panel-shell, .card, main) :is(table, tbody, tr, td, th, li, p, label, span:not([class*="badge"])) {
  color: inherit;
}

[data-appearance="light"] :is(.panel-shell, .card) th,
:root.light :is(.panel-shell, .card) th {
  color: #0f172a !important;
}

/* Inactive / ghost buttons on white hero panels */
[data-appearance="light"] .page-hero-shell :is(button, a).inline-flex[class*="rounded-2xl"],
:root.light .page-hero-shell :is(button, a).inline-flex[class*="rounded-2xl"] {
  color: #334155 !important;
  border-color: #cbd5e1 !important;
  background-color: #fff !important;
}

[data-appearance="light"] .page-hero-shell :is(button, a)[class*="border-white"],
:root.light .page-hero-shell :is(button, a)[class*="border-white"] {
  border-color: #cbd5e1 !important;
  color: #334155 !important;
}

/* Form fields stay readable */
[data-appearance="light"] :is(input, textarea, select),
:root.light :is(input, textarea, select) {
  color: #0f172a !important;
  background-color: #fff !important;
  border-color: #cbd5e1 !important;
}

[data-appearance="light"] :is(input, textarea, select)::placeholder,
:root.light :is(input, textarea, select)::placeholder {
  color: #64748b !important;
}

[data-appearance="light"] a.surface-card-soft p[class*="text-dark"],
:root.light a.surface-card-soft p[class*="text-dark"] {
  color: #1e293b !important;
}

[data-appearance="light"] .surface-card-soft :is(.text-dark-400, [class*="text-dark-400"], p, span),
:root.light .surface-card-soft :is(.text-dark-400, [class*="text-dark-400"], p, span) {
  color: #334155 !important;
}

[data-appearance="light"] :is(.card, .panel-shell, main, button) :is(
  .text-dark-500,
  [class*="text-dark-500"]
),
:root.light :is(.card, .panel-shell, main, button) :is(
  .text-dark-500,
  [class*="text-dark-500"]
) {
  color: #475569 !important;
}

/* Senior Surgeon + Reference Hub prose on white */
[data-appearance="light"] :is(.senior-surgeon-page, .reference-hub-page, .reference-page) :is(
  main, .panel-shell, .card, .secure-reader-html-body, [class*="prose"]
),
:root.light :is(.senior-surgeon-page, .reference-hub-page, .reference-page) :is(
  main, .panel-shell, .card, .secure-reader-html-body, [class*="prose"]
) {
  color: #334155 !important;
}

[data-appearance="light"] :is(.senior-surgeon-page, .reference-hub-page) :is(h1, h2, h3, h4, h5, h6, strong, b),
:root.light :is(.senior-surgeon-page, .reference-hub-page) :is(h1, h2, h3, h4, h5, h6, strong, b) {
  color: #0f172a !important;
}

[data-appearance="light"] .senior-surgeon-page li.card[class*="border-dark"],
:root.light .senior-surgeon-page li.card[class*="border-dark"] {
  background-color: #fff !important;
  border-color: #cbd5e1 !important;
  color: #334155 !important;
}

[data-appearance="light"] .senior-surgeon-page :is(
  [class*="text-primary-100"],
  [class*="text-primary-200"],
  [class*="text-primary-300"],
  [class*="text-cyan-200"],
  [class*="text-cyan-300"]
),
:root.light .senior-surgeon-page :is(
  [class*="text-primary-100"],
  [class*="text-primary-200"],
  [class*="text-primary-300"],
  [class*="text-cyan-200"],
  [class*="text-cyan-300"]
) {
  color: #b91c1c !important;
}

/* Quick-access / home dashboard cards */
[data-appearance="light"] a.home-surface-card,
[data-appearance="light"] a.metric-card-hover,
:root.light a.home-surface-card,
:root.light a.metric-card-hover {
  color: #0f172a !important;
}

[data-appearance="light"] .home-surface-card :is(h2, h3, h4, p, span, a),
:root.light .home-surface-card :is(h2, h3, h4, p, span, a) {
  color: #0f172a !important;
}

[data-appearance="light"] .metric-card-hover :is(h2, h3, h4, p, span, a, div),
:root.light .metric-card-hover :is(h2, h3, h4, p, span, a, div) {
  color: #0f172a !important;
}

[data-appearance="light"] .home-surface-card .panel-copy,
:root.light .home-surface-card .panel-copy {
  color: #475569 !important;
}

/* All buttons on light surfaces — minimum readable label */
[data-appearance="light"] :is(.card, .panel-shell, .page-hero-shell, main) :is(
  button, [role="button"], [role="tab"]
):not([class*="btn-primary"]):not([disabled]),
:root.light :is(.card, .panel-shell, .page-hero-shell, main) :is(
  button, [role="button"], [role="tab"]
):not([class*="btn-primary"]):not([disabled]) {
  color: #334155;
}

[data-appearance="light"] .btn-secondary,
[data-appearance="light"] .btn-ghost,
:root.light .btn-secondary,
:root.light .btn-ghost {
  color: inherit;
}

[data-appearance="light"] .btn-ghost,
:root.light .btn-ghost {
  color: #334155 !important;
  border-color: #cbd5e1 !important;
}

[data-appearance="light"] .app-tab-button,
[data-appearance="light"] .app-tab-card,
:root.light .app-tab-button,
:root.light .app-tab-card {
  color: #334155 !important;
}

[data-appearance="light"] .app-tab-card-active,
:root.light .app-tab-card-active {
  color: #0f172a !important;
}

[data-appearance="light"] aside a.sidebar-link,
:root.light aside a.sidebar-link {
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
}

[data-appearance="light"] aside a.sidebar-link:not(.sidebar-link-active) .sidebar-link-summary,
:root.light aside a.sidebar-link:not(.sidebar-link-active) .sidebar-link-summary {
  color: #475569 !important;
  -webkit-text-fill-color: #475569 !important;
}

[data-appearance="light"] aside a.sidebar-link.sidebar-link-active,
:root.light aside a.sidebar-link.sidebar-link-active {
  color: #991b1b !important;
  -webkit-text-fill-color: #991b1b !important;
}

[data-appearance="default"] aside a.sidebar-link:not(.sidebar-link-active),
[data-appearance="dark"] aside a.sidebar-link:not(.sidebar-link-active),
[data-appearance="black"] aside a.sidebar-link:not(.sidebar-link-active),
[data-appearance="system"] aside a.sidebar-link:not(.sidebar-link-active),
:root:not(.light) aside a.sidebar-link:not(.sidebar-link-active) {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

[data-appearance="default"] aside a.sidebar-link.sidebar-link-active,
[data-appearance="dark"] aside a.sidebar-link.sidebar-link-active,
[data-appearance="black"] aside a.sidebar-link.sidebar-link-active,
[data-appearance="system"] aside a.sidebar-link.sidebar-link-active,
:root:not(.light) aside a.sidebar-link.sidebar-link-active {
  color: #fecaca !important;
  -webkit-text-fill-color: #fecaca !important;
}

[data-appearance="light"] .search-filter-chip,
:root.light .search-filter-chip {
  color: #475569 !important;
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
}

[data-appearance="light"] .search-filter-chip[aria-pressed="true"],
:root.light .search-filter-chip[aria-pressed="true"] {
  color: #0f172a !important;
  background-color: #fef2f2 !important;
  border-color: #fecaca !important;
}

/* Public legal pages — footer microcopy on dark surfaces */
footer :is(.text-dark-600, [class*="text-dark-600"]),
main :is(.text-dark-600, [class*="text-dark-600"]).text-xs {
  color: #94a3b8 !important;
}

[data-appearance="black"] footer :is(.text-dark-600, [class*="text-dark-600"]),
[data-appearance="black"] main :is(.text-dark-600, [class*="text-dark-600"]).text-xs {
  color: #a1a1aa !important;
}

/* ── Dark appearances — badge/chip contrast on tinted & accent surfaces ── */

:root:not(.light) :is(
  [class*="text-primary-100"],
  [class*="text-primary-200"],
  [class*="text-primary-300"],
  [class*="text-primary-400"]
) {
  color: #fecaca !important;
}

:root:not(.light) :is(
  [class*="text-cyan-200"],
  [class*="text-cyan-300"],
  [class*="text-cyan-400"]
) {
  color: #fecaca !important;
}

:root:not(.light) :is(
  [class*="bg-red-500/10"],
  [class*="bg-red-500/15"],
  [class*="border-red-500/20"],
  [class*="border-red-500/25"]
) :is([class*="text-red-300"], [class*="text-red-400"]),
:root:not(.light) :is(
  .badge,
  [class*="rounded-full"]
)[class*="text-red-300"],
:root:not(.light) :is(
  .badge,
  [class*="rounded-full"]
)[class*="text-red-400"] {
  color: #fff !important;
  background-color: rgb(185 28 28 / 0.92) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

:root:not(.light) :is(
  [class*="bg-amber-500/10"],
  [class*="bg-amber-500/15"],
  [class*="border-amber-500/20"]
) :is([class*="text-amber-300"], [class*="text-amber-400"], [class*="text-yellow-300"]) {
  color: #fde68a !important;
}

:root:not(.light) :is(
  [class*="bg-emerald-500/10"],
  [class*="bg-emerald-500/15"],
  [class*="border-emerald-500/20"]
) :is([class*="text-emerald-300"], [class*="text-emerald-400"]) {
  color: #fed7aa !important;
}

/* Labels on sky/cyan hero or info strips */
:root:not(.light) :is(
  [class*="from-sky"],
  [class*="from-cyan"],
  [class*="bg-sky-500"],
  [class*="bg-cyan-500"],
  [class*="to-sky"]
) :is(
  .text-dark-400,
  .text-dark-500,
  [class*="text-dark-400"],
  [class*="text-dark-500"],
  .section-label
) {
  color: #f8fafc !important;
}

/* Topic map / heatmap — saturated cell labels */
:root:not(.light) [class*="bg-red-5"] :is([class*="text-red-3"], [class*="text-red-4"]),
:root:not(.light) [class*="bg-red-6"] :is([class*="text-red-3"], [class*="text-red-4"]) {
  color: #fff !important;
}

:root:not(.light) [class*="bg-emerald-5"] :is([class*="text-emerald-3"], [class*="text-emerald-4"]),
:root:not(.light) [class*="bg-emerald-6"] :is([class*="text-emerald-3"], [class*="text-emerald-4"]) {
  color: #fff !important;
}

:root:not(.light) [class*="bg-amber-5"] :is([class*="text-amber-3"], [class*="text-amber-4"]),
:root:not(.light) [class*="bg-yellow-5"] :is([class*="text-yellow-3"], [class*="text-yellow-4"]) {
  color: #fff !important;
}

/* Exam session cap strip */
:root:not(.light) :is([class*="bg-sky-500"], [class*="bg-cyan-600"]) :is(
  .section-label,
  [class*="text-dark-400"],
  [class*="text-dark-500"]
) {
  color: #f8fafc !important;
}

/* ── Light mode — card links must pass button-contrast on the <a> itself ── */

html.light a.home-surface-card,
html.light a.metric-card-hover,
html[data-appearance="light"] a.home-surface-card,
html[data-appearance="light"] a.metric-card-hover,
:root.light a.home-surface-card,
:root.light a.metric-card-hover,
[data-appearance="light"] a.home-surface-card,
[data-appearance="light"] a.metric-card-hover {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html.light a.home-surface-card :is(*, ::before, ::after),
html.light a.metric-card-hover :is(*, ::before, ::after),
html[data-appearance="light"] a.home-surface-card :is(*, ::before, ::after),
html[data-appearance="light"] a.metric-card-hover :is(*, ::before, ::after) {
  color: inherit;
}

html.light a.home-surface-card :is(.text-dark-100, .text-dark-200, .text-dark-300, .text-dark-400, .text-dark-500, [class*="text-dark-"], [class*="text-primary-1"], [class*="text-primary-2"], [class*="text-slate-1"]),
html.light a.metric-card-hover :is(.text-dark-100, .text-dark-200, .text-dark-300, .text-dark-400, .text-dark-500, [class*="text-dark-"], [class*="text-primary-1"], [class*="text-primary-2"], [class*="text-slate-1"]),
html[data-appearance="light"] a.home-surface-card :is(.text-dark-100, .text-dark-200, .text-dark-300, .text-dark-400, .text-dark-500, [class*="text-dark-"], [class*="text-primary-1"], [class*="text-primary-2"], [class*="text-slate-1"]),
html[data-appearance="light"] a.metric-card-hover :is(.text-dark-100, .text-dark-200, .text-dark-300, .text-dark-400, .text-dark-500, [class*="text-dark-"], [class*="text-primary-1"], [class*="text-primary-2"], [class*="text-slate-1"]) {
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
}

html.light a.home-surface-card :is(h1, h2, h3, h4, .content-title, .content-title-strong, .surface-title, .metric-value, strong, b),
html.light a.metric-card-hover :is(h1, h2, h3, h4, .content-title, .content-title-strong, .surface-title, .metric-value, strong, b),
html[data-appearance="light"] a.home-surface-card :is(h1, h2, h3, h4, .content-title, .content-title-strong, .surface-title, .metric-value, strong, b),
html[data-appearance="light"] a.metric-card-hover :is(h1, h2, h3, h4, .content-title, .content-title-strong, .surface-title, .metric-value, strong, b) {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

/* ── Dark appearances — global muted label lift ── */

:root:not(.light) :is(.text-dark-600, [class*="text-dark-600"]),
:root:not(.light) :is(.text-dark-500, [class*="text-dark-500"]) {
  color: #94a3b8 !important;
}

:root:not(.light) :is(.support-label, .auth-stat-desc, .section-label) {
  color: #cbd5e1 !important;
}

[data-appearance="black"] :is(.text-dark-600, [class*="text-dark-600"], .text-dark-500, [class*="text-dark-500"]),
html.black :is(.text-dark-600, [class*="text-dark-600"], .text-dark-500, [class*="text-dark-500"]) {
  color: #a1a1aa !important;
}

[data-appearance="black"] :is(.support-label, .auth-stat-desc, .section-label),
html.black :is(.support-label, .auth-stat-desc, .section-label) {
  color: #d4d4d8 !important;
}

/* ── Dark appearances — badges & chips on saturated fills ── */

:root:not(.light) :is(.badge-red, [class*="badge-red"]) {
  color: #fff !important;
  background-color: rgb(185 28 28 / 0.95) !important;
  border-color: rgb(248 113 113 / 0.5) !important;
}

:root:not(.light) :is(.badge-blue, [class*="badge-blue"]) {
  color: #fff !important;
  background-color: rgb(153 27 27 / 0.95) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

:root:not(.light) :is(
  .badge,
  [class*="rounded-full"],
  [class*="rounded-xl"]
)[class*="bg-red-5"]:is([class*="text-red-2"], [class*="text-red-3"], [class*="text-red-4"]),
:root:not(.light) :is(
  .badge,
  [class*="rounded-full"],
  [class*="rounded-xl"]
)[class*="border-red-5"]:is([class*="text-red-2"], [class*="text-red-3"], [class*="text-red-4"]) {
  color: #fff !important;
  background-color: rgb(185 28 28 / 0.92) !important;
}

:root:not(.light) :is(
  .badge,
  [class*="rounded-full"]
)[class*="bg-red-500/15"],
:root:not(.light) :is(
  .badge,
  [class*="rounded-full"]
)[class*="bg-red-500/10"] {
  color: #fecaca !important;
  background-color: rgb(127 29 29 / 0.88) !important;
  border-color: rgb(248 113 113 / 0.4) !important;
}

:root:not(.light) :is(
  [class*="border-primary-500"],
  [class*="border-cyan-500"],
  [class*="border-sky-500"]
)[class*="bg-primary-6"],
:root:not(.light) :is(
  [class*="border-primary-500"],
  [class*="border-cyan-500"],
  [class*="border-sky-500"]
)[class*="bg-cyan-6"],
:root:not(.light) :is(
  [class*="border-primary-500"],
  [class*="border-cyan-500"],
  [class*="border-sky-500"]
)[class*="bg-sky-6"],
:root:not(.light) :is(
  [class*="rounded-full"],
  .badge
)[class*="border-primary-5"][class*="bg-primary-6"],
:root:not(.light) :is(
  [class*="rounded-full"],
  .badge
)[class*="border-cyan-5"][class*="bg-cyan-6"] {
  color: #fff !important;
}

:root:not(.light) :is(
  [class*="bg-primary-600"],
  [class*="bg-cyan-600"],
  [class*="bg-sky-600"],
  [class*="bg-primary-500"],
  [class*="bg-cyan-500"]
) :is(
  [class*="text-primary-"],
  [class*="text-cyan-"],
  [class*="text-sky-"],
  .text-white
) {
  color: #f8fafc !important;
}

/* Topic map / analytics heat labels */
:root:not(.light) :is(
  [class*="bg-red-5"],
  [class*="bg-red-6"],
  [class*="bg-rose-5"],
  [class*="bg-rose-6"]
) :is([class*="text-red-"], .text-white),
:root:not(.light) [class*="text-red-300"][class*="bg-red-"],
:root:not(.light) [class*="text-red-400"][class*="bg-red-"] {
  color: #fff !important;
}

:root:not(.light) .content-title.tabular-nums[class*="text-primary-2"] {
  color: #fecaca !important;
}

/* Decision aids / control-center domain chips */
:root:not(.light) main :is(
  [class*="inline-flex"][class*="rounded-full"][class*="border"]
)[class*="text-primary-3"],
:root:not(.light) main :is(
  [class*="inline-flex"][class*="rounded-full"][class*="border"]
)[class*="text-cyan-3"] {
  color: #fecaca !important;
  background-color: rgb(154 52 18 / 0.55) !important;
}

/* Icon boxes with pastel glyph utilities on saturated tiles */
:root:not(.light) .icon-box {
  color: #f8fafc !important;
}

:root:not(.light) .icon-box[class*="text-rose"],
:root:not(.light) .icon-box[class*="text-red"] {
  background-color: rgb(190 18 60 / 0.92) !important;
  border-color: rgb(251 113 133 / 0.45) !important;
}

:root:not(.light) .icon-box[class*="text-purple"],
:root:not(.light) .icon-box[class*="text-violet"] {
  background-color: rgb(153 27 27 / 0.92) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

:root:not(.light) .icon-box[class*="text-amber"],
:root:not(.light) .icon-box[class*="text-yellow"] {
  background-color: rgb(180 83 9 / 0.92) !important;
  border-color: rgb(251 191 36 / 0.45) !important;
}

:root:not(.light) .icon-box[class*="text-emerald"],
:root:not(.light) .icon-box[class*="text-green"] {
  background-color: rgb(154 52 18 / 0.92) !important;
  border-color: rgb(251 146 60 / 0.45) !important;
}

:root:not(.light) .icon-box[class*="text-sky"],
:root:not(.light) .icon-box[class*="text-cyan"],
:root:not(.light) .icon-box[class*="text-blue"] {
  background-color: rgb(153 27 27 / 0.92) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

:root:not(.light) :is(.support-label, .auth-stat-desc) :is(*, ::before, ::after) {
  color: inherit !important;
}

:root:not(.light) [class*="border-primary-500/"][class*="text-sm"],
:root:not(.light) [class*="border-l-2"][class*="text-primary-"] {
  color: #e2e8f0 !important;
}

:root:not(.light) .text-primary-400 {
  color: #fca5a5 !important;
}

/* Topic map red percent chips — force solid badge treatment */
:root:not(.light) :is(.badge-red, [class*="badge-red"], [class*="text-red-300"]) {
  color: #fff !important;
}

/* Home / control-center exam board tiles (surface-card-soft on saturated fills) */
:root:not(.light) :is(
  .surface-card-soft,
  [class*="surface-card-soft"],
  [class*="surface-card"]
) :is(
  .support-label,
  .icon-box,
  [class*="text-rose-3"],
  [class*="text-purple-3"],
  [class*="text-violet-3"],
  [class*="text-sky-3"],
  [class*="text-cyan-3"],
  [class*="text-fuchsia-3"],
  [class*="opacity-60"]
) {
  color: #fff !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) :is(
  [class*="bg-rose-5"],
  [class*="bg-rose-6"],
  [class*="bg-purple-5"],
  [class*="bg-purple-6"],
  [class*="bg-violet-5"],
  [class*="bg-violet-6"],
  [class*="bg-fuchsia-5"],
  [class*="bg-fuchsia-6"],
  [class*="bg-sky-5"],
  [class*="bg-sky-6"],
  [class*="bg-cyan-5"],
  [class*="bg-cyan-6"]
) :is(
  .support-label,
  .icon-box,
  [class*="text-rose-"],
  [class*="text-purple-"],
  [class*="text-violet-"],
  [class*="text-sky-"],
  [class*="text-cyan-"],
  [class*="text-fuchsia-"],
  .text-white,
  [class*="text-white"]
) {
  color: #fff !important;
  opacity: 1 !important;
}

:root:not(.light) [class*="bg-sky-500/15"],
:root:not(.light) [class*="bg-sky-500/10"],
:root:not(.light) [class*="bg-cyan-500/15"] {
  color: #fecaca !important;
}

:root:not(.light) [class*="bg-sky-500/15"] :is(*, .text-xs, .font-semibold),
:root:not(.light) [class*="bg-cyan-500/15"] :is(*, .text-xs, .font-semibold) {
  color: #fecaca !important;
}

:root:not(.light) .badge[class*="bg-red-500/15"][class*="text-red-300"],
:root:not(.light) .badge[class*="bg-red-500/10"][class*="text-red-300"] {
  color: #fff !important;
  background-color: rgb(185 28 28 / 0.95) !important;
}

[data-appearance="black"] :is(
  .text-dark-600,
  [class*="text-dark-600"],
  .text-dark-500,
  [class*="text-dark-500"],
  [class*="text-zinc-5"]
),
html.black :is(
  .text-dark-600,
  [class*="text-dark-600"],
  .text-dark-500,
  [class*="text-dark-500"],
  [class*="text-zinc-5"]
) {
  color: #e4e4e7 !important;
}

:root:not(.light) :is(
  [class*="border-primary-500/30"],
  [class*="border-cyan-500/30"]
)[class*="text-sm"] {
  color: #f8fafc !important;
}

/* Senior surgeon light — expandable row links */
html.light main[class*="senior"] a[class*="flex"][class*="justify-between"],
html[data-appearance="light"] main[class*="senior"] a[class*="flex"][class*="justify-between"],
:root.light .senior-surgeon-page a[class*="flex"][class*="justify-between"] {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html.light .senior-surgeon-page a[class*="flex"] :is(h2, h3, h4, p, span, strong),
html[data-appearance="light"] .senior-surgeon-page a[class*="flex"] :is(h2, h3, h4, p, span, strong) {
  color: #0f172a !important;
}

/* ── Round 4 — direct utility overrides on exam tiles & heat chips ── */

:root:not(.light) :is(
  .support-label,
  .auth-section-kicker
)[class*="text-rose-"],
:root:not(.light) :is(
  .support-label,
  .auth-section-kicker
)[class*="text-purple-"],
:root:not(.light) :is(
  .support-label,
  .auth-section-kicker
)[class*="text-violet-"],
:root:not(.light) :is(
  .support-label,
  .auth-section-kicker
)[class*="text-fuchsia-"],
:root:not(.light) :is(
  .support-label,
  .auth-section-kicker
)[class*="text-sky-"],
:root:not(.light) :is(
  .support-label,
  .auth-section-kicker
)[class*="text-cyan-"] {
  color: #fff !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) .icon-box[class*="text-rose-"],
:root:not(.light) .icon-box[class*="text-purple-"],
:root:not(.light) .icon-box[class*="text-violet-"],
:root:not(.light) .icon-box[class*="text-fuchsia-"],
:root:not(.light) .icon-box[class*="text-sky-"],
:root:not(.light) .icon-box[class*="text-cyan-"] {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) [class*="opacity-60"][class*="text-rose-"],
:root:not(.light) [class*="opacity-60"][class*="text-purple-"],
:root:not(.light) [class*="opacity-60"][class*="text-violet-"],
:root:not(.light) [class*="opacity-60"][class*="text-fuchsia-"],
:root:not(.light) [class*="opacity-60"][class*="text-sky-"],
:root:not(.light) [class*="opacity-60"][class*="text-cyan-"] {
  color: #fff !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) :is(
  .badge,
  span.badge
)[class*="text-red-300"],
:root:not(.light) :is(
  .badge,
  span.badge
)[class*="bg-red-500/15"] {
  color: #fff !important;
  background-color: rgb(185 28 28 / 0.95) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

:root:not(.light) .rounded-full[class*="bg-sky-500/15"],
:root:not(.light) .rounded-full[class*="bg-sky-500/10"],
:root:not(.light) .rounded-full[class*="bg-cyan-500/15"],
:root:not(.light) [class*="rounded-full"][class*="bg-sky-500/15"],
:root:not(.light) [class*="rounded-full"][class*="bg-cyan-500/15"] {
  color: #fecaca !important;
  background-color: rgb(154 52 18 / 0.55) !important;
}

:root:not(.light) :is(
  .surface-card-soft,
  [class*="surface-card-soft"]
) {
  color: #f8fafc !important;
}

:root:not(.light) :is(
  .surface-card-soft,
  [class*="surface-card-soft"]
) :is(
  .support-label,
  .icon-box,
  span,
  p,
  [class*="text-rose-"],
  [class*="text-purple-"],
  [class*="text-violet-"],
  [class*="text-fuchsia-"],
  [class*="text-sky-"],
  [class*="text-cyan-"]
) {
  color: #fff !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) .auth-section-kicker {
  color: #cbd5e1 !important;
}

:root:not(.light) [class*="uppercase"][class*="text-dark-600"] {
  color: #cbd5e1 !important;
}

/* ── Round 5 — sky/cyan exam tiles just under 3:1 threshold ── */

:root:not(.light) :is(
  [class*="text-sky-300"],
  [class*="text-sky-400"],
  [class*="text-cyan-300"],
  [class*="text-cyan-400"]
) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) .surface-card-soft:is(
  [class*="border-sky"],
  [class*="border-cyan"],
  [class*="sky-5"],
  [class*="cyan-5"],
  [class*="sky-6"],
  [class*="cyan-6"]
),
:root:not(.light) .surface-card-soft[class*="from-sky"],
:root:not(.light) .surface-card-soft[class*="from-cyan"] {
  color: #fff !important;
  background-color: rgb(153 27 27 / 0.88) !important;
}

:root:not(.light) .surface-card-soft:is(
  [class*="border-sky"],
  [class*="border-cyan"],
  [class*="sky-"],
  [class*="cyan-"]
) :is(*, .support-label, span, p) {
  color: #fff !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #fff !important;
}

:root:not(.light) :is(
  [class*="bg-cyan-5"],
  [class*="bg-cyan-6"],
  [class*="bg-sky-5"],
  [class*="bg-sky-6"],
  [class*="from-cyan"],
  [class*="from-sky"]
) :is(
  .text-primary-400,
  [class*="text-primary-400"],
  [class*="text-dark-"],
  .text-dark-400,
  .text-dark-500
) {
  color: #fff !important;
}

:root:not(.light) [class*="border-primary-500/30"][class*="text-dark-"],
:root:not(.light) [class*="border-cyan-500/30"][class*="text-dark-"] {
  color: #fff !important;
}

/* ── Round 6 — darken cyan/sky tiles so white text ≥ 3:1 ── */

:root:not(.light) :is(
  .surface-card-soft,
  [class*="surface-card-soft"]
):is(
  [class*="sky"],
  [class*="cyan"],
  [class*="border-sky"],
  [class*="border-cyan"]
) {
  background-color: rgb(153 27 27) !important;
  border-color: rgb(248 113 113 / 0.35) !important;
  color: #fff !important;
}

:root:not(.light) main :is(
  [class*="bg-cyan-500"],
  [class*="bg-sky-500"],
  [class*="bg-cyan-600"]
):not([class*="bg-cyan-500/10"]):not([class*="bg-cyan-500/15"]) {
  background-color: rgb(153 27 27) !important;
}

:root:not(.light) :is(
  [class*="from-cyan-5"],
  [class*="to-cyan-5"],
  [class*="from-sky-5"],
  [class*="to-sky-5"]
) {
  background-color: rgb(153 27 27) !important;
}

/* Auth marketing pages — stat copy on near-black */
:root:not(.light) :is(
  .auth-stat-desc,
  .auth-section-kicker
) {
  color: #e2e8f0 !important;
}

:root:not(.light) :is(
  .auth-stat-desc,
  .auth-section-kicker
)[class*="text-dark-"] {
  color: #e2e8f0 !important;
}

/* Profile / danger zone */
:root:not(.light) :is(.btn-danger, [class*="btn-danger"]) {
  color: #fff !important;
  background-color: rgb(185 28 28 / 0.95) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

[data-appearance="black"] :is(.btn-danger, [class*="btn-danger"]) :is(*, span),
html.black :is(.btn-danger, [class*="btn-danger"]) :is(*, span) {
  color: #fff !important;
}

[data-appearance="black"] :is(footer, main) :is(
  [class*="text-dark-400"],
  [class*="text-dark-500"],
  [class*="text-dark-600"],
  [class*="text-zinc-"]
),
html.black :is(footer, main) :is(
  [class*="text-dark-400"],
  [class*="text-dark-500"],
  [class*="text-dark-600"],
  [class*="text-zinc-"]
) {
  color: #d4d4d8 !important;
}

:root:not(.light) .icon-box[class*="text-orange"],
:root:not(.light) .icon-box[class*="text-amber"] {
  background-color: rgb(194 65 12 / 0.95) !important;
  color: #fff !important;
}

:root:not(.light) [class*="opacity-60"][class*="text-orange-"] {
  color: #fff !important;
  opacity: 1 !important;
}

:root:not(.light) [class*="border-rose-500/40"][class*="bg-rose-500/15"] {
  color: #fecaca !important;
  background-color: rgb(127 29 29 / 0.85) !important;
}

/* ── Round 7 — orange tiles, black profile, home widget labels ── */

:root:not(.light) :is(
  .surface-card-soft,
  [class*="surface-card-soft"]
):is(
  [class*="orange"],
  [class*="border-orange"],
  [class*="amber-5"]
) {
  background-color: rgb(154 52 18) !important;
  border-color: rgb(251 146 60 / 0.4) !important;
  color: #fff !important;
}

:root:not(.light) :is(
  .surface-card-soft,
  [class*="surface-card-soft"]
)[class*="orange"] :is(*, .support-label, span, p) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html[data-appearance="dark"] :is([class*="text-dark-600"], [class*="text-dark-500"]),
html.dark :is([class*="text-dark-600"], [class*="text-dark-500"]),
html[data-appearance="default"] :is([class*="text-dark-600"], [class*="text-dark-500"]),
html[data-appearance="system"] :is([class*="text-dark-600"], [class*="text-dark-500"]) {
  color: #cbd5e1 !important;
}

[data-appearance="black"] :is(
  [class*="text-dark-600"],
  [class*="text-dark-500"],
  [class*="text-dark-400"],
  [class*="line-clamp"]
),
html.black :is(
  [class*="text-dark-600"],
  [class*="text-dark-500"],
  [class*="text-dark-400"],
  [class*="line-clamp"]
) {
  color: #d4d4d8 !important;
}

:root:not(.light) :is(
  main,
  section,
  .card,
  .panel-shell
) :is(
  [class*="bg-cyan-500"],
  [class*="bg-sky-500"]
):not([class*="bg-cyan-500/1"]):not([class*="bg-sky-500/1"]) {
  background-color: rgb(153 27 27) !important;
}

:root:not(.light) :is(.badge-blue, [class*="badge-blue"]) {
  color: #fff !important;
  background-color: rgb(153 27 27 / 0.95) !important;
}

:root:not(.light) span.badge[class*="bg-red-500/15"] {
  color: #fff !important;
  background-color: rgb(185 28 28) !important;
}

/* ── Round 8 — reference-hub, decision-aid, profile danger, chips ── */

:root:not(.light) main :is(
  [class*="text-dark-400"],
  [class*="text-dark-500"]
):is(
  .truncate,
  .text-xs,
  [class*="line-clamp"],
  [class*="text-\\[11px\\]"]
) {
  color: #e2e8f0 !important;
}

:root:not(.light) main :is(
  a,
  button,
  [role="button"],
  [role="tab"]
) :is(
  [class*="text-dark-400"],
  [class*="text-dark-500"]
) {
  color: #e2e8f0 !important;
}

:root:not(.light) :is(
  .rounded-xl.border,
  [class*="rounded-xl"][class*="border"]
)[class*="text-sm"] {
  color: #f8fafc !important;
}

:root:not(.light) :is(
  [class*="bg-red-500"],
  [class*="bg-red-600"],
  [class*="border-red-500"],
  [class*="bg-rose-500"]
) :is(
  .text-dark-400,
  [class*="text-dark-400"],
  .text-sm,
  p,
  span
) {
  color: #fff !important;
}

:root:not(.light) [class*="bg-fuchsia-500/15"],
:root:not(.light) [class*="bg-fuchsia-500/10"] {
  color: #fecaca !important;
  background-color: rgb(153 27 27 / 0.55) !important;
}

:root:not(.light) .content-title[class*="text-primary-2"],
:root:not(.light) .content-title.transition-colors[class*="text-primary"] {
  color: #fecaca !important;
}

:root:not(.light) :is(
  [class*="inline-flex"][class*="flex-wrap"]
) :is(
  [class*="text-dark-400"],
  [class*="text-dark-500"],
  [class*="text-primary-3"]
) {
  color: #e2e8f0 !important;
}

/* ── Round 9 — accent palette remap: red important / orange mid (2026-06-15) ── */

/* Light — profile achievement badges + primary metric chips */
[data-appearance="light"] :is(.profile-page, main[class*="profile"]) :is(
  [class*="text-primary-300"],
  [class*="text-primary-400"],
  [class*="text-cyan-300"],
  [class*="text-cyan-400"],
  [class*="text-sky-300"],
  [class*="text-sky-400"],
  [class*="text-purple-300"],
  [class*="text-fuchsia-300"]
),
:root.light :is(.profile-page, main[class*="profile"]) :is(
  [class*="text-primary-300"],
  [class*="text-primary-400"],
  [class*="text-cyan-300"],
  [class*="text-cyan-400"],
  [class*="text-sky-300"],
  [class*="text-sky-400"],
  [class*="text-purple-300"],
  [class*="text-fuchsia-300"]
) {
  color: #b91c1c !important;
}

[data-appearance="light"] :is(.profile-page, main[class*="profile"]) :is(
  [class*="text-emerald-300"],
  [class*="text-emerald-400"],
  [class*="text-teal-300"]
),
:root.light :is(.profile-page, main[class*="profile"]) :is(
  [class*="text-emerald-300"],
  [class*="text-emerald-400"],
  [class*="text-teal-300"]
) {
  color: #b45309 !important;
}

[data-appearance="light"] :is(.profile-page, main[class*="profile"]) :is(
  [class*="bg-primary-500/15"],
  [class*="bg-cyan-500/15"],
  [class*="bg-sky-500/15"],
  [class*="bg-purple-500/15"],
  [class*="bg-fuchsia-500/15"]
),
:root.light :is(.profile-page, main[class*="profile"]) :is(
  [class*="bg-primary-500/15"],
  [class*="bg-cyan-500/15"],
  [class*="bg-sky-500/15"],
  [class*="bg-purple-500/15"],
  [class*="bg-fuchsia-500/15"]
) {
  color: #991b1b !important;
  background-color: #fef2f2 !important;
  border-color: #fecaca !important;
}

[data-appearance="light"] :is(.profile-page, main[class*="profile"]) :is(
  [class*="bg-emerald-500/15"],
  [class*="bg-teal-500/15"]
),
:root.light :is(.profile-page, main[class*="profile"]) :is(
  [class*="bg-emerald-500/15"],
  [class*="bg-teal-500/15"]
) {
  color: #9a3412 !important;
  background-color: #fff7ed !important;
  border-color: #fed7aa !important;
}

/* Dark — profile achievement tiles: light text, no white fills */
:root:not(.light) :is(.profile-page, main[class*="profile"]) :is(
  [class*="text-primary-300"],
  [class*="text-primary-400"],
  [class*="text-cyan-300"],
  [class*="text-cyan-400"],
  [class*="text-sky-300"],
  [class*="text-purple-300"],
  [class*="text-fuchsia-300"]
) {
  color: #fecaca !important;
}

:root:not(.light) :is(.profile-page, main[class*="profile"]) :is(
  [class*="text-emerald-300"],
  [class*="text-emerald-400"],
  [class*="text-teal-300"]
) {
  color: #fed7aa !important;
}

:root:not(.light) :is(.profile-page, main[class*="profile"]) :is(
  [class*="bg-primary-500/15"],
  [class*="bg-cyan-500/15"],
  [class*="bg-sky-500/15"],
  [class*="bg-emerald-500/15"],
  [class*="bg-purple-500/15"],
  [class*="bg-fuchsia-500/15"]
) {
  color: #f8fafc !important;
  background-color: rgb(153 27 27 / 0.55) !important;
  border-color: rgb(248 113 113 / 0.4) !important;
}

:root:not(.light) :is(.profile-page, main[class*="profile"]) [class*="bg-emerald-500/15"] {
  background-color: rgb(154 52 18 / 0.55) !important;
  border-color: rgb(251 146 60 / 0.4) !important;
}

/* Light — no black panel backgrounds */
[data-appearance="light"] :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-black"],
[data-appearance="light"] :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-zinc-9"],
[data-appearance="light"] :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-neutral-9"],
:root.light :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-black"],
:root.light :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-zinc-9"],
:root.light :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-neutral-9"] {
  background-color: #f8fafc !important;
  color: #0f172a !important;
}

/* Dark — no white panel backgrounds */
:root:not(.light) :is(.panel-shell, .panel, .card, .page-frame, .home-surface-card, .page-hero-shell, .surface-card, .metric-card, .empty-panel, [role="dialog"])[class*="bg-white"]:not([class*="bg-white/"]) {
  background-color: rgb(15 23 42 / 0.92) !important;
  color: #f8fafc !important;
}

/* Senior surgeon — remap remaining cyan/primary accents on light */
[data-appearance="light"] .senior-surgeon-page :is(
  [class*="text-primary-100"],
  [class*="text-primary-200"],
  [class*="text-primary-300"],
  [class*="text-cyan-200"],
  [class*="text-cyan-300"],
  [class*="text-sky-300"],
  [class*="text-teal-300"]
),
:root.light .senior-surgeon-page :is(
  [class*="text-primary-100"],
  [class*="text-primary-200"],
  [class*="text-primary-300"],
  [class*="text-cyan-200"],
  [class*="text-cyan-300"],
  [class*="text-sky-300"],
  [class*="text-teal-300"]
) {
  color: #b91c1c !important;
}

[data-appearance="light"] .senior-surgeon-page :is(
  [class*="text-emerald-300"],
  [class*="text-teal-400"]
),
:root.light .senior-surgeon-page :is(
  [class*="text-emerald-300"],
  [class*="text-teal-400"]
) {
  color: #b45309 !important;
}

/* Dark badge-blue → dark-red */
:root:not(.light) :is(.badge-blue, [class*="badge-blue"]) {
  color: #fff !important;
  background-color: rgb(153 27 27 / 0.95) !important;
  border-color: rgb(248 113 113 / 0.45) !important;
}

/* Dark sky/cyan/emerald/purple/fuchsia utility text → remapped accents */
:root:not(.light) :is(
  [class*="text-sky-300"],
  [class*="text-sky-400"],
  [class*="text-cyan-300"],
  [class*="text-cyan-400"],
  [class*="text-purple-300"],
  [class*="text-fuchsia-300"]
) {
  color: #fecaca !important;
  -webkit-text-fill-color: #fecaca !important;
}

:root:not(.light) :is(
  [class*="text-emerald-300"],
  [class*="text-emerald-400"],
  [class*="text-teal-300"]
) {
  color: #fed7aa !important;
  -webkit-text-fill-color: #fed7aa !important;
}

/* Light icon-box teal remap */
[data-appearance="light"] :is(.card, .panel-shell) .icon-box[class*="text-teal"],
:root.light :is(.card, .panel-shell) .icon-box[class*="text-teal"] {
  color: #b45309 !important;
  background-color: #fff7ed !important;
  border-color: #fed7aa !important;
}

/* Dark icon-box teal → dark-orange */
:root:not(.light) .icon-box[class*="text-teal"] {
  background-color: rgb(154 52 18 / 0.92) !important;
  border-color: rgb(251 146 60 / 0.45) !important;
  color: #fff !important;
}

/* ── 2026-06-17 — auth/login/forgot-password + analytics + home quick-access ── */

:root:not(.light) .auth-shell-brand :is(.auth-section-kicker, .auth-stat-desc),
[data-appearance="default"] .auth-shell-brand :is(.auth-section-kicker, .auth-stat-desc),
[data-appearance="dark"] .auth-shell-brand :is(.auth-section-kicker, .auth-stat-desc),
[data-appearance="black"] .auth-shell-brand :is(.auth-section-kicker, .auth-stat-desc),
[data-appearance="system"] .auth-shell-brand :is(.auth-section-kicker, .auth-stat-desc) {
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #e2e8f0 !important;
}

:root:not(.light) .auth-shell-brand .auth-brand-accent,
[data-appearance="default"] .auth-shell-brand .auth-brand-accent,
[data-appearance="dark"] .auth-shell-brand .auth-brand-accent,
[data-appearance="black"] .auth-shell-brand .auth-brand-accent,
[data-appearance="system"] .auth-shell-brand .auth-brand-accent {
  color: #67e8f9 !important;
  -webkit-text-fill-color: #67e8f9 !important;
  background: none !important;
  background-image: none !important;
  filter: none !important;
}

:root:not(.light) :is(.auth-shell-form, .auth-card) .auth-link,
[data-appearance="default"] :is(.auth-shell-form, .auth-card) .auth-link,
[data-appearance="dark"] :is(.auth-shell-form, .auth-card) .auth-link,
[data-appearance="black"] :is(.auth-shell-form, .auth-card) .auth-link,
[data-appearance="system"] :is(.auth-shell-form, .auth-card) .auth-link {
  color: #67e8f9 !important;
  -webkit-text-fill-color: #67e8f9 !important;
}

:root:not(.light) .analytics-page span.rounded-full[class*="border-primary-500/"][class*="bg-primary-600/10"],
:root:not(.light) .analytics-page span.rounded-full[class*="border-primary-500/20"][class*="bg-primary-600/10"],
[data-appearance="default"] .analytics-page span.rounded-full[class*="border-primary-500/"][class*="bg-primary-600/10"],
[data-appearance="dark"] .analytics-page span.rounded-full[class*="border-primary-500/"][class*="bg-primary-600/10"],
[data-appearance="black"] .analytics-page span.rounded-full[class*="border-primary-500/"][class*="bg-primary-600/10"] {
  background-color: rgb(15 118 110 / 0.96) !important;
  border-color: rgb(45 212 191 / 0.45) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

:root:not(.light) .analytics-page :is(p, span).text-\[11px\].text-dark-600,
[data-appearance="default"] .analytics-page :is(p, span).text-\[11px\].text-dark-600,
[data-appearance="dark"] .analytics-page :is(p, span).text-\[11px\].text-dark-600,
[data-appearance="black"] .analytics-page :is(p, span).text-\[11px\].text-dark-600 {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

[data-appearance="light"] .home-page a[class*="border-white/10"][class*="bg-white/"],
:root.light .home-page a[class*="border-white/10"][class*="bg-white/"],
html.light .home-page a.rounded-xl.border[class*="bg-white/[0.03]"] {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

[data-appearance="light"] .home-page a[class*="border-white/10"][class*="bg-white/"] :is(*, ::before, ::after),
:root.light .home-page a[class*="border-white/10"][class*="bg-white/"] :is(*, ::before, ::after) {
  color: inherit;
}

[data-appearance="light"] .home-page a[class*="border-white/10"][class*="bg-white/"] :is(.metric-meta, .support-label-muted, p, span),
:root.light .home-page a[class*="border-white/10"][class*="bg-white/"] :is(.metric-meta, .support-label-muted, p, span) {
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
}

/* Hide sample-MCQ carousel pagination dots on login/register screens (2026-07-15) */
.auth-mcq-dots {
  display: none !important;
}

/* Tighten sample-MCQ viewport reserved height now that pagination dots are hidden (2026-07-15) */
.auth-mcq-viewport {
  min-height: 218px !important;
}

/* Tighten gap between Sample MCQ card and Exam banks row specifically (2026-07-15) */
.auth-shell-brand .auth-enter-3 {
  margin-top: -14px !important;
}