/* Shared UI tokens. Branding values supplied by /theme.css remain authoritative. */
:where(:root) {
  color-scheme: light;
  --color-primary: #1e40af; --color-secondary: #172b4d; --color-accent: #bfdbfe;
  --color-background: #f5f7fc; --color-surface: #fff; --color-text: #172b4d;
  --color-muted: #526581; --color-links: #1d4ed8; --color-buttons: #1e40af;
  --color-header: #fff; --color-footer: #071b36;
  --on-primary: #fff; --on-buttons: #fff; --on-header: #172b4d; --on-footer: #eef4ff;
  --color-primary-hover: #17358f; --color-primary-light: #e8efff;
  --color-text-muted: var(--color-muted); --color-border: #cbd6e6;
  --color-background-secondary: #edf2fa; --color-success: #146c43;
  --color-warning: #815500; --color-danger: #b42318; --color-info: #175a91;
  --radius-sm: .5rem; --radius-md: .75rem; --radius-lg: 1rem;
  --shadow-sm: 0 2px 8px #172b4d08; --shadow-md: 0 8px 24px #172b4d0d;
  --shadow-lg: 0 20px 60px #172b4d26;
  --space-1: .25rem; --space-2: .5rem; --space-3: 1rem; --space-4: 1.5rem; --space-5: 2rem;
}
html[data-theme=dark] {
  color-scheme: dark;
  --color-background: #0d1626; --color-surface: #152238; --color-text: #edf3ff;
  --color-muted: #b7c7de; --color-links: #a6c8ff; --color-header: #111d30;
  --on-header: #edf3ff; --color-footer: #0a1220; --on-footer: #d6e4fa;
  --color-border: #40536e; --color-background-secondary: #1d304a;
  --color-primary-light: #243c63; --color-success: #86e0b0; --color-warning: #f3cd80;
  --color-danger: #ffaba5; --color-info: #a6d6ff;
}
body { background: var(--color-background); color: var(--color-text); line-height: 1.6; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; }
[hidden] { display: none!important; }
main { overflow-wrap: anywhere; }
main .row>*,.d-flex>*,fieldset { min-width: 0; }
h1 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); line-height: 1.18; }
h2,h3 { line-height: 1.3; }
h1,h2,h3 { text-wrap: balance; letter-spacing: -.025em; }
.page-heading { padding-bottom: 1.5rem; border-bottom: 1px solid var(--color-border); margin-bottom: 2rem; }
.page-heading h1 { margin-bottom: .35rem; }
.eyebrow { margin-bottom: .6rem; }
a { color: var(--color-links); text-decoration-thickness: .08em; }
a:hover { color: var(--color-links); text-decoration: underline; }
:focus-visible { outline: 3px solid var(--color-links)!important; outline-offset: 4px; }
.skip-link { background: var(--color-surface); color: var(--color-links); }
.site-header { background: var(--color-header); border-color: var(--color-border); box-shadow: var(--shadow-sm); }
.site-header .brand,.site-header .nav-links>a:not(.btn) { color: var(--on-header); }
.nav-shell { flex-wrap: wrap; }
.nav-links { flex-wrap: wrap; gap: .65rem; }
.nav-links>a { padding: .65rem .75rem; border-radius: var(--radius-sm); transition: background-color .18s; }
.nav-links>a:not(.btn):hover { background: color-mix(in srgb,var(--on-header) 7%,transparent); text-decoration: none; }
.nav-links a[aria-current] { background: color-mix(in srgb,var(--on-header) 9%,transparent); box-shadow: inset 0 -3px currentColor; font-weight: 750; }
.nav-actions { display: flex; align-items: center; gap: .5rem; margin-left: auto; }
.nav-toggle { display: none; }
.theme-toggle { font-size: .8rem; }
.btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; white-space: normal; border-radius: var(--radius-sm); transition: background-color .18s, box-shadow .18s, transform .18s; }
.btn:hover { text-decoration: none; }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn:disabled,.btn.disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { --bs-btn-bg: var(--color-buttons); --bs-btn-border-color: var(--color-buttons); --bs-btn-color: var(--on-buttons); box-shadow: 0 3px 7px color-mix(in srgb,var(--color-buttons) 16%,transparent); }
.btn-ghost { color: var(--color-links); border-color: transparent; }
.btn-ghost:hover { background: var(--color-background-secondary); }
.btn-icon { width: 44px; padding: .5rem; }
.btn-success { --bs-btn-bg: #146c43; --bs-btn-border-color: #146c43; --bs-btn-hover-bg: #0f5132; --bs-btn-hover-border-color: #0f5132; --bs-btn-active-bg: #0f5132; }
.btn-outline-secondary { --bs-btn-color: var(--color-muted); --bs-btn-border-color: var(--color-border); }
.btn-outline-primary { --bs-btn-color: var(--color-links); --bs-btn-border-color: var(--color-links); }
.btn-outline-danger { --bs-btn-color: var(--color-danger); --bs-btn-border-color: var(--color-danger); }
form[aria-busy=true] button[type=submit],form[aria-busy=true] button:not([type]) { cursor: progress; }
form[aria-busy=true] button:not([type=button]):after { content: ''; width: 1rem; height: 1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ui-spin .8s linear infinite; }
@keyframes ui-spin { to { transform: rotate(360deg); } }
.card,.experience-card,.catalog-coming,.designer-panel,.builder-question,.exam-question,.exam-toolbar,dialog { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); box-shadow: var(--shadow-sm); }
.card { border-radius: var(--radius-lg); }
.card>.course-cover-img:first-child { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.card:has(>.course-cover-img)>.card-body { display: flex; flex-direction: column; align-items: stretch; }
.card:has(>.course-cover-img)>.card-body>a.btn:last-child { margin-top: auto; align-self: flex-start; }
.card-body { padding: clamp(1rem, 2.5vw, 1.75rem); }
.course-card { transition: box-shadow .2s, transform .2s; }
.course-cover-img { border-radius: 0; aspect-ratio: 16/9; object-fit: cover; }
.course-card .card-body>div:last-child { gap: 1rem; flex-wrap: wrap; }
.course-card h3 a { color: var(--color-text); }
.text-secondary,.text-muted,.form-text { color: var(--color-muted)!important; }
.eyebrow { color: var(--color-muted); }
.form-control,.form-select { background-color: var(--color-surface); color: var(--color-text); border-color: var(--color-border); border-radius: var(--radius-sm); min-height: 46px; max-width: 100%; }
.form-control::placeholder { color: var(--color-muted); opacity: 1; }
.form-control:focus,.form-select:focus { color: var(--color-text); background-color: var(--color-surface); border-color: var(--color-links); box-shadow: 0 0 0 .2rem color-mix(in srgb,var(--color-links) 18%,transparent); }
.form-control:disabled,.form-select:disabled,.form-control[readonly] { background: var(--color-background-secondary); color: var(--color-muted); }
.form-control::file-selector-button { background: var(--color-background-secondary); color: var(--color-text); }
input[type=checkbox],input[type=radio] { accent-color: var(--color-links); width: 1.2rem; height: 1.2rem; vertical-align: middle; }
.form-label,label { font-weight: 600; }
.form-label { font-size: .9rem; margin-bottom: .45rem; }
.form-text { font-size: .82rem; line-height: 1.55; }
textarea.form-control { min-height: 8rem; }
.form-control,.form-select { transition: border-color .18s, box-shadow .18s; }
.invalid-feedback,.text-danger { color: var(--color-danger)!important; }
.auth-card { margin-block: clamp(0rem,3vw,2rem); border-top: 4px solid var(--color-primary); }
.auth-card h1 { margin-bottom: 1.5rem; }
.auth-shell { max-width: 36rem; }
.list-group-item { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
html[data-theme=dark] .text-bg-light { background: var(--color-background-secondary)!important; color: var(--color-text)!important; }
html[data-theme=dark] .alert-info { background: #17324b; color: #cae8ff; border-color: #46789c; }
html[data-theme=dark] .alert-success { background: #173a2d; color: #b9f2d3; border-color: #3b8060; }
html[data-theme=dark] .alert-warning { background: #3e331c; color: #ffe3a5; border-color: #8b713a; }
html[data-theme=dark] .alert-danger { background: #48272b; color: #ffd2cc; border-color: #a05b5b; }
.table { --bs-table-bg: var(--color-surface); --bs-table-color: var(--color-text); --bs-table-border-color: var(--color-border); background: var(--color-surface); margin-bottom: 0; }
.table thead { background: var(--color-background-secondary); }
.table th { font-size: .78rem; font-weight: 750; letter-spacing: .035em; }
.table tbody tr { transition: background-color .15s; }
.table tbody tr:nth-child(even) { background: color-mix(in srgb,var(--color-background-secondary) 40%,var(--color-surface)); }
.table tbody tr:focus-within { background: var(--color-background-secondary); }
.table tbody tr:last-child td { border-bottom: 0; }
.table td { font-size: .92rem; }
.table td,.table th { background: transparent; padding: 1rem; }
.table-responsive { overflow-x: auto; max-width: 100%; border: 1px solid var(--color-border); border-radius: var(--radius-md); margin-bottom: 1rem; }
.table-responsive:focus-visible { outline-offset: -3px; }
.table td .btn,.table td form { margin: .2rem; }
.badge { border-radius: 2rem; padding: .4rem .65rem; line-height: 1.3; }
.badge:not([class*="text-bg-"]) { background: var(--color-primary-light); color: var(--color-links); }
.text-success { color: var(--color-success)!important; }
.text-bg-success { background-color: #146c43!important; color: #fff!important; }
.alert-success { background: #edf8f1; color: #14532d; border-color: #9ccfb0; }
.btn-outline-success { --bs-btn-color: var(--color-success); --bs-btn-border-color: var(--color-success); --bs-btn-hover-bg: #146c43; --bs-btn-hover-border-color: #146c43; --bs-btn-active-bg: #0f5132; --bs-btn-active-border-color: #0f5132; }
.alert { border-radius: var(--radius-md); border-left-width: 4px; }
.alert a { color: inherit; font-weight: 650; }
.empty-state { padding: 2rem; border: 1px dashed var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
details { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 1rem; margin-block: .75rem; background: var(--color-surface); }
summary { cursor: pointer; font-weight: 650; padding: .4rem; }
dialog { max-width: calc(100vw - 1.5rem); max-height: calc(100dvh - 2rem); overflow: auto; border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: clamp(1rem,3vw,2rem); box-shadow: var(--shadow-lg); }
dialog::backdrop { background: #08142699; }
.confirm-dialog { width: min(30rem,calc(100vw - 1.5rem)); }
.confirm-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.lesson-material,.lesson-active,.upload-zone,.home-search { background: var(--color-background-secondary); color: var(--color-text); border-color: var(--color-border); }
.lesson-active { border-left-color: var(--color-links); }
.lesson-side-panel>.builder-heading { background: var(--color-surface); }
.exam-option { border-color: var(--color-border); }
.exam-option:has(input:checked),.layer-button.selected { background: var(--color-primary-light); color: var(--color-text); border-color: var(--color-links); }
.layer-button { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
.designer-layout>* { min-width: 0; }
.designer-viewport { background: var(--color-background-secondary); }
html .designer-panel,html .builder-question,html .exam-question,html .exam-toolbar,html .builder-dialog,html .lesson-side-panel { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
html .lesson-side-panel>.builder-heading { background: var(--color-surface); }
html .designer-viewport,html .upload-zone { background: var(--color-background-secondary); }
html .layer-button { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
html .layer-button.selected,html .exam-option:has(input:checked) { background: var(--color-primary-light); color: var(--color-text); }
html .content-selector a:hover { background: var(--color-primary-light); }
html .builder-status-error { color: var(--color-danger); }
html .exam-option,html .content-selector a,html .content-row { border-color: var(--color-border); }
.progress-native { accent-color: var(--color-links); display: block; height: .6rem; border: 0; border-radius: 1rem; overflow: hidden; background: var(--color-background-secondary); }
.progress-native::-webkit-progress-bar { background: var(--color-background-secondary); border-radius: inherit; }
.progress-native::-webkit-progress-value { background: var(--color-links); border-radius: inherit; }
.progress-native::-moz-progress-bar { background: var(--color-links); border-radius: inherit; }
.site-footer { background: var(--color-footer); color: var(--on-footer); }
.site-footer a,.site-footer p { color: var(--on-footer); }
.error-page { display: grid; place-items: center; min-height: 100vh; padding: 1rem; }
.error-page main { min-height: 0; max-width: 38rem; width: 100%; }
.error-page h1 { font-size: clamp(3rem,10vw,6rem); color: var(--color-links); }
/* Home uses the same surfaces as the application, including custom branding. */
body .academy-home,body .academy-home .academy-hero { background: var(--color-background); color: var(--color-text); }
body .academy-home .academy-hero:before,body .academy-home .academy-hero:after { display: none; }
body .academy-home h1,body .academy-home h2,body .academy-home h3,body .academy-home .lead,body .academy-home .hero-secondary { color: var(--color-text); }
body .academy-home .home-cta h2,body .academy-home .home-cta p { color: var(--on-secondary, #eef4ff); }
body .academy-home .academy-hero h1>span { background: none; -webkit-text-fill-color: currentColor; color: var(--color-links); }
body .academy-home .experience-card,body .academy-home .catalog-coming { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
body .academy-home .experience-card p,body .academy-home .hero-notes,body .academy-home .home-motion-bar { color: var(--color-muted); }
body .academy-home .hero-kicker,body .academy-home .experience-number { background: var(--color-primary-light); color: var(--color-links); border-color: var(--color-border); }
html[data-theme=light] body.custom-theme .academy-home .hero-kicker { color: #172b4d; }
body .academy-home .home-search input { color: var(--color-text); }
html[data-theme=dark] .bg-light,html[data-theme=dark] .bg-white { background-color: var(--color-background-secondary)!important; color: var(--color-text)!important; }
@media(hover:hover) { .course-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); } .table tbody tr:hover { background: var(--color-background-secondary); } }
@media(min-width:992px) { .nav-links { justify-content: flex-end; flex: 1 1 auto; order: 2; } .nav-actions { order: 3; } }
@media(min-width:992px) { .nav-toggle.btn { display: none; } }
@media(max-width:991px) { .nav-toggle.btn { display: inline-flex; } .nav-links { background: var(--color-header); border-top: 1px solid var(--color-border); } .brand { max-width: calc(100% - 9rem); } .nav-links form .btn { width: 100%; } html:not([data-theme]) .nav-links { display: flex; } html:not([data-theme]) .nav-toggle { display: none; } }
@media(max-width:575px) {
  .container { padding-inline: 1rem; }
  .row.g-5 { --bs-gutter-x: 2rem; }
  .brand { font-size: 1rem; gap: .4rem; }.brand-logo { max-width: 48px; height: 36px; }
  .nav-actions { gap: .25rem; }.nav-actions .btn { padding-inline: .6rem; }
  main .d-flex { flex-wrap: wrap; }
  .academy-home .academy-hero h1 { font-size: clamp(2rem,9vw,2.85rem); }
  .table td,.table th { padding: .75rem; min-width: 6rem; }
  .content-row { flex-wrap: wrap; }.content-selector { grid-template-columns: minmax(0,1fr); }
  .auth-card .card-body { padding: 1.25rem!important; }
  .footer-navigation a { display: inline-flex; align-items: center; min-height: 44px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation: none!important; transition: none!important; scroll-behavior: auto!important; } }

/* Dashboard hierarchy: metrics first, management tools second. */
.metric-card { position: relative; border-top: 3px solid var(--color-links); }
.metric-card h2 { margin-bottom: .75rem; font-size: .85rem; letter-spacing: 0; }
.stat-value { font-size: clamp(2rem,3vw,2.65rem); font-weight: 750; line-height: 1.2; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.section-heading { margin: .5rem 0 1.25rem; }
.section-heading h2 { margin-bottom: .4rem; }
.section-heading p { font-size: .9rem; margin-bottom: 0; }
.management-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; }
.management-link { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.15rem 1.25rem; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); transition: border-color .18s, box-shadow .18s; }
.management-link { text-decoration: none; }
.management-link strong { display: block; font-size: .95rem; }
.management-link small { display: block; color: var(--color-muted); margin-top: .25rem; line-height: 1.45; }
.management-arrow { color: var(--color-links); font-size: 1.25rem; flex-shrink: 0; }
.management-link:hover { color: var(--color-text); text-decoration: none; border-color: var(--color-links); box-shadow: var(--shadow-sm); }
.setup-card { background: var(--color-background-secondary); box-shadow: none; }
.setup-steps { list-style: none; counter-reset: setup; padding: 0; margin: 1rem 0 0; }
.setup-steps li { counter-increment: setup; display: flex; align-items: flex-start; gap: .75rem; padding-block: .9rem; border-top: 1px solid var(--color-border); font-size: .9rem; }
.setup-steps li::before { content: counter(setup); display: grid; place-items: center; flex: 0 0 1.6rem; height: 1.6rem; background: var(--color-surface); color: var(--color-links); border-radius: 50%; font-size: .75rem; font-weight: 700; }
@media(max-width:575px) { .management-grid { grid-template-columns: minmax(0,1fr); } .page-heading { gap: 1.25rem; } }

/* Course discovery, learning and completion share the platform tokens. */
.presentation-player { display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:var(--radius-md); background:#101827; margin-top:1rem; }
.rating-stars { color:var(--color-text); letter-spacing:.08em; }
.rating-picker { display:flex; gap:.25rem; flex-wrap:wrap; }
.rating-picker label { position:relative; display:grid; place-items:center; width:48px; min-height:48px; border:1px solid var(--color-border); border-radius:var(--radius-sm); cursor:pointer; }
.rating-picker input { position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.rating-picker span[aria-hidden] { font-size:1.9rem; color:var(--color-muted); pointer-events:none; }
.rating-picker label.is-filled { background:var(--color-background-secondary); border-color:var(--color-primary); }
.rating-picker label.is-filled span[aria-hidden] { color:var(--color-text); }
.rating-picker label:has(input:checked) { box-shadow:inset 0 -3px var(--color-primary); }
.rating-picker label:focus-within { outline:3px solid var(--color-primary); outline-offset:3px; }
.rating-distribution { display:grid; grid-template-columns:auto minmax(40px,1fr) auto; align-items:center; gap:.5rem; max-width:30rem; }
.rating-distribution progress { width:100%; accent-color:var(--color-primary); }
.review-entry { border-top:1px solid var(--color-border); padding:1rem 0; overflow-wrap:anywhere; }
.course-finish { border-inline-start:4px solid var(--color-success); }
.lesson-outline summary { font-weight:700; padding:.75rem 0; cursor:pointer; }
/* Presentation comes first in source order, followed by details and enrollment. */
.course-detail { width: 100%; max-width: 1320px; padding: 1rem; margin-inline: auto; }
.course-intro { display: grid; grid-template-columns: minmax(0,1fr); gap: 1.25rem; align-items: start; }
.course-intro > *, .course-detail-body { min-width: 0; }
.course-intro-media .presentation-player,
.course-intro-media .course-cover-img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; margin: 0; border-radius: var(--radius-lg); }
.course-intro-media .presentation-player { object-fit: contain; }
.course-intro-info { display: flex; flex-direction: column; gap: .85rem; overflow-wrap: anywhere; }
.course-intro-info > * { margin: 0; }
.course-intro-info > .badge { align-self: flex-start; }
.course-intro-title { font-size: clamp(1.5rem,2.4vw,2rem); font-weight: 750; }
.course-intro-description { color: var(--color-muted); }
.course-intro-info .progress-native { width: 100%; }
.course-intro-info a[href="#reviews"] { display: inline-block; padding-block: .35rem; }
.course-enrollment { border-top: 1px solid var(--color-border); padding-top: 1rem; scroll-margin-top: 6rem; }
.course-enrollment-body { display: grid; gap: .75rem; }
.course-enrollment-body > * { margin: 0; }
.course-enrollment .btn { min-height: 48px; }
.course-detail-body { margin-top: clamp(1.5rem,3vw,2.5rem); padding-top: clamp(1.5rem,3vw,2rem); border-top: 1px solid var(--color-border); }
@media(min-width:577px) { .course-detail { padding: 1.5rem; } .course-intro { gap: 1.5rem; } }
@media(min-width:992px) { .course-detail { padding-block: 2rem; } .course-intro { grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 2rem; } }