/* Shared reading surfaces. Video pixels and player overlays retain their own contrast. */
:root{--surface:#fff;--surface-raised:#fff;--page:#f6f8fc;--text:#17243a;--secondary:#475569;--edge:#d7e0eb;--accent:#087565;--selected:#e7f5f1;--subtle:#edf2f8;--learning-font:'Inter','Mukta',system-ui,-apple-system,'Segoe UI',sans-serif}
:root[data-theme=dark]{--surface:#151a22;--surface-raised:#1b222d;--page:#0f131a;--text:#f5f7fb;--secondary:#c3cedd;--edge:#354152;--accent:#5de0c5;--selected:#12372f;--subtle:#232d3b;--iv0:#151a22;--iv50:#0f131a;--iv100:#202936;--iv200:#2b3544;--iv300:#43536a;--ink:#f5f7fb;--ink2:#d2dbe8;--mut:#b9c6d8;--line:#354152;--f50:#263448;--f100:#2c405a;--ok50:#113327;--bad50:#3e1d25}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;border:1px solid var(--edge);border-radius:50%;background:var(--surface);color:var(--text);cursor:pointer}
.theme-toggle:hover{background:var(--subtle)}.theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.theme-toggle:focus-visible{outline:3px solid #d99a23;outline-offset:3px}
header.site{background:var(--surface)}.brand-wordmark{color:var(--text)}
:root[data-theme=dark] :is(h1,h2,h3,h4){color:var(--text)}
:root[data-theme=dark] :is(.linkish,.eyebrow,.crumbs a,.section-heading>a,.results-heading a){color:#bdd6fa}
:root[data-theme=dark] .btn.pri{background:#315d91;color:#fff}:root[data-theme=dark] .btn.gho{color:var(--text);border-color:var(--edge)}
:root[data-theme=dark] :is(.tabs a[aria-current],.mob a[aria-current]){background:#354028;color:#fff0c0}
:root[data-theme=dark] .footer-brand{background:var(--surface)}:root[data-theme=dark] footer{background:#101f33;color:#d0d9e8}:root[data-theme=dark] footer :is(a,h2){color:#f5f7fb}
:root[data-theme=dark] :is(.journey-tags span,.future-school,.future-lab,.launch){background:var(--surface);color:var(--text)}
:root[data-theme=dark] :is(.chapter-num,.journey-lead em,.lab-copy em,.future-school em){color:#a8bad2}
.school-page,.learning-workspace,body[data-page=learn]{background:var(--page);color:var(--text)}
.school-page{font-weight:500}.school-page :is(h1,h2,h3){font-weight:750}
.school-page :is(.course-tile,.course-preview,.class-browser button,.subject-browser button,.course-faq,.course-includes,.detail-facts>div,.course-chapter){background:var(--surface);border-color:var(--edge);color:var(--text)}
.school-page :is(.tile-body h3,.tile-body a,.preview-info h2,.course-includes h3,.detail-facts strong,.course-chapter strong,.section-heading h2,.results-heading h2){color:var(--text);font-weight:750}
.school-page :is(.section-heading p,.results-heading p,.class-browser span,.class-browser small,.subject-browser small,.tile-body p,.tile-meta,.preview-info p,.preview-info [role=status],.preview-info li a,.detail-facts span,.overview-grid p,.course-chapter summary small,.course-chapter li small){color:var(--secondary);font-weight:550}
.school-page :is(.course-chapter li a,.course-faq summary,.outcome-list,.course-includes li){color:var(--text);font-weight:600}
.school-page :is(.class-browser button[aria-pressed=true],.subject-browser button[aria-pressed=true]){background:var(--selected);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.school-page :is(.course-tabs,.preview-info li a,.course-chapter li a,.course-includes p){border-color:var(--edge)}
.school-page .course-tabs button{color:var(--secondary)}.school-page .course-tabs button[aria-selected=true]{color:var(--accent);border-color:var(--accent)}
.school-page .chapter-completion,.school-callout{background:var(--subtle);color:var(--text)}
.catalogue-hero p:not(.eyebrow),.detail-intro>p,.detail-access span,.detail-access p,.detail-badges span{color:#edf3ff;font-weight:600}
:root[data-theme=light] :is(.catalogue-hero,.course-detail-hero){background:#e9eff8;color:#17243a}
:root[data-theme=light] :is(.catalogue-hero h1,.detail-intro h1,.detail-access strong){color:#17243a}
:root[data-theme=light] :is(.catalogue-hero p:not(.eyebrow),.detail-intro>p,.detail-access span,.detail-access p,.detail-badges span,.detail-intro .crumbs a){color:#354b68}
:root[data-theme=light] :is(.detail-access,.detail-badges span){background:#ffffff88;border-color:#c9d5e5}
:root[data-theme=light] .catalogue-hero .eyebrow{color:#855900}
.learning-workspace{--sans:var(--learning-font);font-family:var(--learning-font);font-weight:500;color-scheme:inherit}
.learning-workspace :is(h1,h2,h3,button,input,select){font-family:var(--learning-font)}
.learning-header,.learning-sidebar,.sidebar-heading,.learning-resources>div{background:var(--surface);border-color:var(--edge)}
.learning-header .learning-heading strong{font-size:15px;font-weight:750;color:var(--text)}.learning-heading span{font-size:12px;font-weight:500;color:var(--secondary)}
.learning-workspace :is(.back-course,.learning-top-progress,.learning-description .crumbs,.learning-description .crumbs a,.learning-description .eyebrow,.local-progress-note,.learning-resources p,.sidebar-heading span,.topic-count){color:var(--secondary)}
.learning-workspace :is(.learning-description,.learning-sidebar,.learning-resources>div,.back-course){border-color:var(--edge)}
.learning-description h1{font-size:clamp(24px,2.1vw,32px);font-weight:750;color:var(--text);line-height:1.3;letter-spacing:-.025em}
.learning-resources h2,.sidebar-heading h2{color:var(--text);font-size:17px;font-weight:700}.learning-resources h3{color:var(--text);font-size:21px;font-weight:700;line-height:1.4}
.learning-resources p{font-size:15px;line-height:1.8;font-weight:500}.local-progress-note{font-size:12px;font-weight:500}.learning-description .eyebrow{font-size:11px;font-weight:650}
.learning-workspace .btn.gho{background:var(--surface);color:var(--text);border-color:var(--edge)}.learning-workspace .btn.gho:hover{background:var(--subtle)}
.learning-workspace .complete-btn{color:var(--accent);border-color:var(--accent);font-weight:650}.learning-workspace .complete-btn[aria-pressed=true]{background:var(--selected);color:var(--accent)}
.learning-sidebar .course-chapter{background:var(--surface);border-color:var(--edge)}
.learning-sidebar .chapter-completion{background:conic-gradient(var(--accent) var(--chapter-progress,0%),var(--edge) 0);color:var(--text)}.learning-sidebar .chapter-completion>span{background:var(--surface);font-size:12px;font-weight:700}
.learning-sidebar .course-chapter strong{font-size:15px;line-height:1.5;font-weight:700;color:var(--text);white-space:normal}
.learning-sidebar .course-chapter summary small,.learning-sidebar .course-chapter summary small:last-child{color:var(--secondary);font-size:12px;font-weight:600;letter-spacing:0}
.learning-sidebar .course-chapter li a{background:var(--surface-raised);border-color:var(--edge);color:var(--text);font-size:14px;font-weight:650}
.learning-sidebar .course-chapter li a:hover{background:var(--subtle);border-color:var(--secondary)}
.learning-sidebar .course-chapter li a[aria-current=page]{background:var(--selected);border-color:var(--accent);color:var(--text);box-shadow:none}
.learning-sidebar .course-chapter li small,.learning-sidebar .course-chapter li a[aria-current=page] small{color:var(--secondary);font-size:12px;font-weight:550}
.learning-sidebar .lesson-state{background:var(--subtle);color:var(--secondary)}.learning-sidebar .course-chapter li a[aria-current=page] .lesson-state{background:var(--selected);color:var(--accent)}
.learning-sidebar .sidebar-heading .in{background:var(--page);border-color:var(--edge);color:var(--text);font-size:14px}.learning-sidebar .in::placeholder{color:var(--secondary);opacity:1}
.learning-screen{background:var(--surface)}.learning-screen .player-toolbar{background:var(--surface);color:var(--secondary)}.version-picker{color:var(--secondary);font-size:12px}.version-picker select{background:var(--surface-raised);border-color:var(--edge);color:var(--text);font-size:12px;font-weight:600;color-scheme:inherit}.player-toolbar .linkish{color:var(--secondary);font-size:12px;font-weight:600}
/* The actual playback surface remains black in either theme. */
.school-player .plyr{color-scheme:dark;color:#fff}.learning-workspace .plyr__time{font-weight:600}
@media(max-width:600px){.hd{gap:8px}.hd .brand-wordmark{font-size:21px}.hd .brand-symbol{width:34px;height:34px}.hd>.btn{font-size:11px;padding:7px 9px}.theme-toggle{width:36px;height:36px}.learning-header{gap:8px;padding-inline:12px}.learning-header .back-course{padding-right:10px}.learning-header .learning-heading strong{font-size:13px}.learning-heading span{font-size:11px;max-width:145px}.learning-header .theme-toggle{width:34px;height:34px}.learning-sidebar .course-chapter summary{padding:16px 14px;gap:12px}.learning-sidebar .course-chapter strong{font-size:14px}.learning-description h1{font-size:25px}.version-picker select{font-size:12px;max-width:240px}.lesson-actions .btn{font-size:12px}}
.school-page :is(.tile-subject,.tile-language,.tile-bottom small,.course-progress,.catalogue-footnote){color:var(--secondary);font-weight:550}.school-page .tile-bottom{border-color:var(--edge)}
:root[data-theme=dark] .school-page .catalogue-controls select{background:var(--surface);color:var(--text);border-color:var(--edge)}
:root[data-theme=dark] .school-shell a:not(.btn),:root[data-theme=dark] .page-h a:not(.btn){color:#c2d9ff}

/* Course actions keep explicit foregrounds; title links must not recolour buttons. */
.school-page .tile-body a.btn.pri{background:#214f86;color:#fff;border-color:#214f86;font-weight:700}
.school-page .tile-body a.btn.pri:hover{background:#163b68;border-color:#163b68;color:#fff}
.school-page .tile-body a.btn.gho{color:var(--text);border-color:var(--edge)}
.class-selection{display:contents}
.class-browser{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;position:sticky;top:var(--hd);z-index:15;background:var(--page);padding:12px 0;margin:0 0 24px;scrollbar-width:thin;border-bottom:1px solid var(--edge)}
.class-browser button{flex:0 0 auto;white-space:nowrap;padding:11px 18px;border-radius:999px;min-height:44px}
.class-browser button strong{font-size:14px;font-weight:700}
#browse-subject,#results-heading{scroll-margin-top:0}
.subject-browser{grid-template-columns:repeat(4,minmax(0,1fr))}.subject-browser button[hidden]{display:none}
@media(max-width:600px){.class-browser{margin-bottom:20px;padding-block:10px}.class-browser button{padding:9px 15px}.subject-browser{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.subject-browser button{padding:14px}.catalogue-results{margin-top:24px}}
.auth-tabs{display:flex;gap:10px;margin:24px 0}.auth-form{max-width:540px;margin-inline:auto}.auth-form form>.btn{margin-top:18px}.auth-form [hidden]{display:none!important}.auth-form [data-status]:not(:empty){padding:12px;border:1px solid var(--edge);border-radius:10px;margin-block:16px}.otp-input{font-size:24px;letter-spacing:.3em}.admin-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-block:24px}.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-block:20px}.admin-stats strong{display:block;font-size:30px}.admin-table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse}.admin-table th,.admin-table td{padding:12px;text-align:left;border-bottom:1px solid var(--edge);vertical-align:top}.admin-table small{display:block;color:var(--secondary)}.admin-toolbar{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}.admin-toolbar .in{flex:1;min-width:180px}.admin-course{display:grid;gap:12px}.admin-course input{width:100%}.admin-content{min-height:220px}.admin-panel [role=alert]{color:var(--text);border:1px solid var(--edge);padding:12px}@media(max-width:600px){.admin-stats{grid-template-columns:1fr}.admin-tabs .btn{padding:10px 12px}}
.auth-form [data-auth]>.btn,.auth-form [data-otp]>.btn{display:block;width:100%}.auth-form [data-reset]{display:block;margin:16px auto}.auth-form [data-delivery-note]{margin-block:16px}.auth-form>p:last-child{margin-top:18px}

/* Keep the lesson context and actions directly beneath a comfortably sized player. */
.learning-description{padding:20px 24px 24px}.learning-description .eyebrow{margin:12px 0 6px}.learning-description h1{margin:0 0 10px;max-width:none}.lesson-meta{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--secondary);font-size:13px;font-weight:600;margin-bottom:20px}.lesson-actions{display:grid;grid-template-columns:auto auto auto;justify-content:start;gap:10px}.lesson-actions .btn{min-height:44px;font-size:13px;padding:10px 16px}.learning-description .player-toolbar{padding:18px 0 0;margin-top:18px;border-top:1px solid var(--edge);flex-wrap:wrap}.learning-description .version-picker{flex-wrap:wrap}.learning-resources .lesson-practice-empty{padding:20px}.lesson-practice-empty h3{font-size:16px;margin:0 0 8px}.lesson-practice-empty p{margin:0;max-width:55ch}
@media(min-width:901px){.learning-main{scroll-padding-top:16px}}
@media(max-width:600px){.learning-description{padding:18px 16px}.lesson-actions{grid-template-columns:1fr 1.15fr 1fr;width:100%;gap:6px}.lesson-actions .btn{padding:10px 6px;font-size:12px;text-align:center}.lesson-meta{font-size:12px;margin-bottom:16px}.learning-description .player-toolbar{gap:12px}.learning-description .version-picker select{max-width:100%}}
/* Settings own their interaction time; menus remain above transparent seek targets. */
.school-player .plyr__menu__container{max-height:min(320px,45dvh);overflow-y:auto;overscroll-behavior:contain}.school-player .plyr__menu__container [role=menuitemradio]{min-height:40px}.player-stage:has([aria-expanded=true]) .seek-zone{pointer-events:none}
@media(max-width:600px){.school-player .plyr__menu__container{max-height:max(100px,calc(56.25vw - 78px))}.school-player .plyr__menu__container [role=menuitemradio]{min-height:36px}}
.learning-screen .player-stage:fullscreen,.learning-screen .player-stage.player-expanded{height:100dvh;max-height:none;width:100%;aspect-ratio:auto}
/* Quiz content is reading text, not the older resource metadata labels. */
.learning-resources .quiz-card h2{font-size:22px;line-height:1.45;text-transform:none;letter-spacing:-.015em;margin:8px 0 22px}
.learning-resources .quiz-option span{font-size:16px;line-height:1.5;color:var(--text);letter-spacing:0}
.learning-resources .quiz-option .option-letter{font-size:12px;color:var(--secondary)}
.learning-resources .quiz-topline span{font-size:13px;letter-spacing:0;color:var(--secondary)}
.learning-resources .quiz-card .btn{font-size:14px;min-height:44px}.learning-resources .quiz-result h2{text-transform:none;letter-spacing:0;font-size:22px}.learning-resources .quiz-intro .quiz-best{color:var(--text);font-size:12px;letter-spacing:0}
.learning-resources .quiz-feedback p{margin:8px 0 0}.learning-resources .quiz-card{scroll-margin-top:16px}
@media(max-width:900px){.learning-resources .quiz-card{scroll-margin-top:calc(min(56.25vw,42dvh) + 16px)}.learning-resources .quiz-card h2{font-size:20px}}

/* Quiz questions and every result stay within the same player viewport. */
.player-stage.quiz-active{aspect-ratio:16/9;min-height:420px;height:min(66dvh,680px);max-height:none;width:100%;max-width:none}
.player-stage.quiz-active>:not(.lesson-quiz-viewport){visibility:hidden;pointer-events:none}
.lesson-quiz-viewport{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;background:var(--surface,#171e2a);color:var(--text,#edf2fa);text-align:left}
.quiz-viewport-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;border-bottom:1px solid var(--line);flex:none}
.quiz-viewport-header .btn{font-size:12px;min-height:38px}
.quiz-viewport-content.learning-resources{overflow:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:20px;margin:0;scroll-behavior:auto}
.quiz-viewport-content .quiz-card,.quiz-viewport-content .quiz-result{max-width:850px;margin:0 auto;border:0;padding:0;background:transparent}
.quiz-viewport-content .quiz-review{max-width:850px;margin:20px auto}.quiz-viewport-content .quiz-option{padding:12px}.quiz-viewport-content .quiz-score{font-size:48px}
.player-stage.quiz-active:fullscreen,.player-stage.quiz-active.player-expanded{height:100dvh;min-height:0;max-height:none}
@media(max-width:900px){.player-stage.quiz-active,.player-stage.quiz-active:has(.portrait){height:calc(100dvh - 150px);min-height:280px;max-height:720px;aspect-ratio:auto;width:100%;max-width:none}.quiz-viewport-content.learning-resources{padding:16px}.quiz-viewport-header{padding:10px 16px}.quiz-viewport-content .quiz-card h2{font-size:18px}.quiz-viewport-content .quiz-option{font-size:16px}}

.video-access-gate{max-width:520px;color:#edf2fa}.video-access-gate>span{font-size:32px}.video-access-gate h2{color:inherit;font-size:clamp(18px,2vw,26px);margin:12px 0}.video-access-gate p{line-height:1.6;font-size:14px}.video-access-gate .row{justify-content:center;margin:18px 0}.video-access-gate small{color:#b8c6d9}@media(max-width:600px){.player-stage:has(.video-access-gate){aspect-ratio:auto;min-height:330px}.video-access-gate .btn{padding:12px;font-size:12px}}

/* Compact lesson details; navigation remains comfortable to tap. */
.learning-description{padding:12px 20px}
.learning-description .crumbs{font-size:11px;margin:0;gap:6px}
.learning-description .eyebrow{margin:6px 0 3px;font-size:10px}
.learning-description h1{font-size:clamp(19px,1.6vw,24px);line-height:1.25;margin:0 0 6px}
.learning-description .lesson-meta{font-size:12px;margin-bottom:8px;gap:6px 12px}
.learning-description .lesson-actions{gap:8px}
.learning-description .lesson-actions .btn{padding:8px 12px;min-height:44px}
.learning-description .completion-hint{margin:6px 0 0;font-size:11px;line-height:1.4}
.lesson-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.lesson-footer .local-progress-note{margin:0;font-size:11px;line-height:1.4}
.lesson-footer .linkish{min-height:44px;font-size:11px;padding:8px 0}
@media(max-width:600px){.learning-description{padding:10px 14px}.learning-description .lesson-actions{gap:5px}.learning-description .lesson-actions .btn{padding:8px 5px;font-size:12px}.learning-description h1{font-size:20px}}

.lesson-footer .lesson-reload{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:8px 12px;font-size:12px;line-height:1.2;border:1px solid var(--edge);border-radius:10px;background:var(--surface-raised);color:var(--text);text-decoration:none;white-space:nowrap;flex-shrink:0}
.lesson-footer .lesson-reload:hover{border-color:var(--accent);background:var(--selected)}
.lesson-footer .lesson-reload:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.lesson-footer .lesson-reload:disabled{opacity:.5;cursor:not-allowed}
.lesson-footer .lesson-reload svg{flex:none}

/* Site footer: warm learning invitation followed by clear, compact navigation. */
footer.site-footer,:root[data-theme=dark] footer.site-footer{background:radial-gradient(ellipse at 5% 5%,#224876 0,transparent 55%),#0b1b34;color:#bdcce2;padding:36px 0 24px;border-top:4px solid #efbd55}
.site-footer .footer-start{display:grid;grid-template-columns:1.15fr 1fr;border:1px solid #ffffff20;border-radius:22px;overflow:hidden;background:#142e50;margin-bottom:40px}
.footer-start-copy{padding:32px 36px}
.site-footer .footer-eyebrow{font-size:11px;font-weight:800;letter-spacing:.12em;color:#f6cf7b;margin:0 0 14px}
.site-footer .footer-start h2{font-size:clamp(27px,3vw,38px);line-height:1.15;letter-spacing:-.04em;color:#fff;margin:0 0 14px;font-weight:800}
.footer-start-copy>.np{color:#d1ddef;font-size:17px;margin:0 0 22px}
.site-footer .footer-start-link{display:inline-flex;align-items:center;gap:28px;background:#f5c65b;color:#102744;padding:13px 20px;min-height:48px;box-sizing:border-box;border-radius:10px;font-weight:800;text-decoration:none}
.site-footer .footer-start-link:hover{background:#ffdc87}
.footer-art{position:relative;min-height:260px;overflow:hidden;background:#6042b3}
.footer-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center}
.footer-art:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#211047b8)}
.footer-art>span{position:absolute;z-index:1;left:28px;bottom:24px;color:white;font-size:25px;font-weight:800;letter-spacing:-.03em}
.site-footer .fgrid{grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.site-footer .footer-brand,:root[data-theme=dark] .site-footer .footer-brand{background:#fff;padding:8px 12px}
.site-footer .footer-description{margin:18px 0 16px;line-height:1.85;color:#bdcce2;font-size:14px}
.footer-tags{display:flex;flex-wrap:wrap;gap:8px}
.footer-tags span{border:1px solid #ffffff25;border-radius:20px;padding:6px 11px;font-size:11px;color:#dbe8fb}
.site-footer nav h2{font-size:15px;color:#f6cf7b;margin:8px 0 16px;font-weight:800}
.site-footer nav ul{gap:2px}
.site-footer nav a{display:inline-flex;align-items:center;min-height:40px;text-decoration:none;color:#e4ecf8;font-size:14px}
.site-footer nav a:hover{text-decoration:underline;color:#ffdc87}
.site-footer a:focus-visible{outline:3px solid #f5c65b;outline-offset:4px;border-radius:4px}
.site-footer .legal{margin-top:32px;padding-top:22px;font-size:11px;line-height:1.8;color:#a8bbd5;border-color:#ffffff20}
@media(max-width:700px){.site-footer .footer-start{grid-template-columns:1fr}.footer-start-copy{padding:26px}.footer-art{min-height:180px;grid-row:1}.footer-art img{object-position:center}.site-footer .fgrid{grid-template-columns:1fr 1fr;gap:28px 18px}.site-footer .fgrid>div:first-child{grid-column:1/-1}.site-footer .footer-brand .brand-wordmark{font-size:25px}.site-footer .footer-start{margin-bottom:28px}.site-footer nav a{min-height:44px;font-size:13px}.site-footer .legal{margin-top:24px}}
:root[data-theme=dark] .site-footer .brand-wordmark{color:#102c54}
:root[data-theme=dark] .site-footer .footer-start-link{color:#102744}
:root[data-theme=dark] .site-footer nav h2{color:#f6cf7b}
