/* Original remains the default. These palettes change colour, never font or geometry. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.course-filters,.catalog-filters{align-items:end}.course-filters input,.course-filters select,.course-filters button,.catalog-filters input,.catalog-filters select,.catalog-filters button{height:48px;min-height:48px;box-sizing:border-box;margin-bottom:0}.course-filters label,.catalog-filters label{display:block;margin-bottom:8px}.course-filters select,.catalog-filters select{width:100%;padding:10px 14px}
.login-art .brand img{filter:brightness(0) invert(1);mix-blend-mode:normal;opacity:1}
.course-row .ring{display:grid!important;flex-shrink:0}.ring{background:conic-gradient(var(--action,#263acb) calc(var(--progress)*1%),var(--line,#dce2f0) 0)}.ring span{color:var(--ink);background:var(--surface,#fff);font-variant-numeric:tabular-nums}
html[data-theme=midnight]{color-scheme:dark;--ink:#eef0fa;--muted:#b0b9d0;--bg:#0d1018;--surface:#171c29;--soft:#232b3d;--line:#343e54;--action:#aab8ff;--action-hover:#c4ceff;--purple:#b5c2ff;--purple-dark:#d3dbff;--green:#9bdac5}
html[data-theme=forest]{color-scheme:dark;--ink:#edf6f1;--muted:#b2c9bf;--bg:#0c1915;--surface:#152a22;--soft:#203e32;--line:#35574a;--action:#b4e2c7;--action-hover:#d0f0dc;--purple:#b4e2c7;--purple-dark:#d0f0dc;--green:#a5dbc0}
html[data-theme]:not([data-theme=original]) body{background:var(--bg);color:var(--ink)}
html[data-theme]:not([data-theme=original]) :is(.site-header,.rail,.topbar,.login-side,.login-box,.panel,.catalog-card,.course-row,.question,.account-panel,.editor-lesson,.table-wrap,.calendar-board,.stat-link,.enrollment-card,.next-course,.next-course-info,.course-search,.course-filters,.catalog-filters,.filter-bar,.filter-form,.site-footer,.faq-list details,.curriculum details,dialog,.modal,.modal-body){background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:none}
html[data-theme]:not([data-theme=original]) :is(h1,h2,h3,h4,.brand,.brand small,.site-brand,.site-brand strong,.stat-link strong,.breadcrumb b,.field-label,label,.nav a,.site-nav a,.course-meta,.stat-link small,.stat-link .stat-hint,.text-btn,.row-bottom a,.quiet-link,.login-links a,.course-finale p){color:var(--ink)}
html[data-theme]:not([data-theme=original]) :is(p,.muted,.small.muted,.lead,.eyebrow,.course-info,.next-course-info>span,.login-box>p,.form-help,.result-count,.page-heading p,.site-brand small,.course-description){color:var(--muted)}
html[data-theme]:not([data-theme=original]) :is(input,textarea)::placeholder{color:var(--muted);opacity:.85}
html[data-theme]:not([data-theme=original]) :is(.btn,.button,.login-box .btn.full){background:var(--action);color:var(--bg);border-color:var(--action);box-shadow:none}
html[data-theme]:not([data-theme=original]) :is(.btn,.button):hover{background:var(--action-hover);color:var(--bg)}
html[data-theme]:not([data-theme=original]) :is(.btn.secondary,.button.secondary,.button.ghost,.badge,.notice,.policy-notice,.rail-note,.avatar,.tabs button.active,.nav a.active,.nav a:hover,.lesson-row.available,.answer:has(input:checked),.motion-toggle,.nav-toggle,.icon-btn){background:var(--soft);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=original]) :is(th,.table-wrap thead th){background:var(--soft);color:var(--ink)}
html[data-theme]:not([data-theme=original]) :is(tbody tr:hover,.table-wrap tbody tr:hover){background:var(--soft)}
html[data-theme]:not([data-theme=original]) .login-art{background:linear-gradient(140deg,var(--soft),var(--bg))}
html[data-theme]:not([data-theme=original]) :is(.brand img,.site-brand img){filter:brightness(0) invert(1);mix-blend-mode:normal}
html[data-theme]:not([data-theme=original]) .error{background:#39222b;color:#ffd7df;border-color:#704352}
html[data-theme]:not([data-theme=original]) .ring span{background:var(--surface);color:var(--ink)}
html[data-theme]:not([data-theme=original]) :focus-visible{outline:3px solid var(--action);outline-offset:3px}
/* Public-page accents and navigation use the selected palette too. */
html[data-theme]:not([data-theme=original]){--paper:var(--bg);--blue:var(--action)}
html[data-theme]:not([data-theme=original]) .brand-logo{filter:brightness(0) invert(1);mix-blend-mode:normal;opacity:1}
html[data-theme]:not([data-theme=original]) :is(.wordmark,.wordmark small,.site-header nav a,.site-footer nav a,em,.card-link,.text-action){color:var(--ink)}
html[data-theme]:not([data-theme=original]) :is(.motion-control,.discovery-card,.course-card,.brand-ribbon,.hello-output,.studio-label,.code-sticker,.value-card,.empty-state){background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:none}
html[data-theme]:not([data-theme=original]) :is(.hero-description,.hero-caption,.intro-label,.studio-content p,.studio-content label,.studio-footnote,.idea-note,.card-description,.card-meta){color:var(--muted)}
html[data-theme]:not([data-theme=original]) :is(.course-visual-tag,.art-label){background:var(--surface);color:var(--ink)}
html[data-theme]:not([data-theme=original]) .site-header nav{background:var(--surface)}
.catalog-filters label{margin-bottom:0}
/* The supplied logo has a white canvas: invert that canvas to black, then blend it away. */
html[data-theme]:not([data-theme=original]) :is(.brand-logo,.brand img,.site-brand img),.login-art .brand img{filter:grayscale(1) invert(1) brightness(2);mix-blend-mode:screen;opacity:1}

html[data-theme]:not([data-theme=original]) .spark-hero{background:radial-gradient(ellipse at 85% 34%,#5465a51c,transparent 49%)}

/* Complete the dark palettes across sections whose original backgrounds are light. */
html[data-theme]:not([data-theme=original]) :is(.rhythm-section,.spark-closing,.skill-ribbon,.studio-illustration,.scene-tag,.floating-note,.mini-player){background:var(--soft);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=original]) :is(.rhythm-intro h2,.rhythm-intro em,.rhythm-intro .text-action,.calendar-top strong,.calendar-description strong,.spark-closing h2,.spark-closing em,.prose strong,.prose li,.path-grid h3){color:var(--ink)}
html[data-theme]:not([data-theme=original]) :is(.rhythm-intro p,.calendar-top p,.calendar-description p,.calendar-note,.spark-closing>p,.prose p,.prose li,.path-grid p,.subtle-note,.site-footer p,.site-footer small,.footer-bottom){color:var(--muted)}
html[data-theme]:not([data-theme=original]) :is(.calendar-day,.calendar-day.is-past){background:var(--soft);color:var(--ink);border-color:var(--line);box-shadow:none}
html[data-theme]:not([data-theme=original]) .calendar-day.is-today{background:var(--action);color:var(--bg);border-color:var(--action);box-shadow:none}
html[data-theme]:not([data-theme=original]) :is(.calendar-description,.path-grid article,.closing-orbit,.closing-orbit:after,.policy-nav,.time-chip){border-color:var(--line)}
html[data-theme]:not([data-theme=original]) .time-chip{color:var(--muted)}
html[data-theme]:not([data-theme=original]) .calendar-icon{background:var(--soft);color:var(--action)}
html[data-theme]:not([data-theme=original]) :is(.hello-control button,.mini-play){background:var(--action);color:var(--bg)}
html[data-theme]:not([data-theme=original]) :is(.hello-output output,.brand-ribbon strong,.skill-ribbon>b,.policy-nav a,.prose a){color:var(--action)}
html[data-theme]:not([data-theme=original]) :is(.visual-purple,.visual-violet,.visual-blue,.visual-green,.visual-orange){background:var(--soft)}
html[data-theme]:not([data-theme=original]) :is(.visual-glyph,.brand-ribbon,.scene-footnote,.mini-meta,.mini-label,.studio-label,.hello-output span){color:var(--muted)}
html[data-theme]:not([data-theme=original]) .course-visual-tag{background:var(--surface);color:var(--ink)}
html[data-theme]:not([data-theme=original]) .next-course-info>div{color:var(--muted);border-color:var(--line)}
html[data-theme]:not([data-theme=original]) :is(.contact-form,.contact-card,.login-art){background-color:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=original]) :is(.login-art .login-foot,.login-art h1 span){color:var(--muted)}


/* Keep the portal mark centred beside the complete name/tagline lockup. */
.brand:has(.brand-copy){display:inline-flex;align-items:center;gap:12px;padding-bottom:0;line-height:1.2;max-width:100%}
.brand .brand-copy{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.brand .brand-name{display:block;line-height:1.2}
.brand .brand-copy small{position:static;margin:0;line-height:1.4;letter-spacing:0;white-space:nowrap;font-size:9px}
.brand:has(.brand-copy) img{width:38px;height:48px;flex:0 0 38px;object-fit:contain;border-radius:0;background:transparent;box-shadow:none}
.login-appearance{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:24px 0 0;padding-top:18px;border-top:1px solid var(--line)}
.appearance-caption{font-size:12px;font-weight:600;color:var(--muted)}
.login-links{align-items:center;gap:16px;flex-wrap:wrap;margin:10px 0 18px}
.login-links>a{display:inline-flex;align-items:center;min-height:44px}
.login-box .password-toggle{color:var(--muted)}
html[data-theme]:not([data-theme=original]) .login-box>.badge{background:transparent;color:var(--muted)}
html[data-theme=original] .calendar-day:not(.is-today):not(.is-past){color:#626a83}
html[data-theme=original] .calendar-note{color:#596384}
html[data-theme=original] .spark-closing>p:not(.eyebrow){color:#545f80}
html[data-theme=original] .login-art{background-color:#18215a}
html[data-theme=original] .login-box>.badge{background:#f0e9fa;color:#5a3b87}
/* Icon-only native selector keeps keyboard and touch selection accessible. */
.learning-icon{display:none;width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7}
.site-header{max-width:none;width:100%;margin-inline:0;box-sizing:border-box;height:auto}
.site-header .wordmark{flex-shrink:0;white-space:nowrap}.site-header .header-actions{flex-wrap:nowrap}
@media(max-width:1100px){.site-header{display:flex;position:relative;align-items:center;justify-content:space-between;flex-wrap:nowrap;height:auto;min-height:72px;padding:12px 20px;gap:10px}.site-header .wordmark{font-size:22px;min-width:0;letter-spacing:-.7px}.site-header .brand-logo{width:30px;height:38px}.site-header .header-actions{display:flex;grid-row:auto;grid-column:auto;margin:0;gap:6px;flex-shrink:0}.site-header .nav-toggle{display:inline-flex;min-width:44px;width:44px;padding:0!important}.site-header #public-nav{position:absolute;top:100%;left:12px;right:12px;width:auto;z-index:30;grid-row:auto;grid-column:auto;margin:0;padding:12px;box-shadow:0 12px 25px #0002;border-radius:12px;background:var(--surface,#fff);flex-wrap:wrap;gap:8px;justify-content:flex-start}.site-header #public-nav:not(.is-open){display:none}.site-header #public-nav.is-open{display:flex}.site-header #public-nav a{padding:10px;min-height:44px}.site-header .wordmark small{display:none}}
@media(max-width:600px){.site-header{padding:10px 12px;gap:8px}.site-header .wordmark{font-size:20px;line-height:1.2;gap:6px}.site-header .brand-logo{width:26px;height:34px}.site-header .header-actions{gap:4px}.site-header .header-actions .button.compact{width:44px;min-width:44px;height:44px;padding:0;display:inline-flex;align-items:center;justify-content:center}.site-header .learning-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.site-header .learning-icon{display:block}}
@media(max-width:360px){.site-header{padding-inline:8px;gap:4px}.site-header .wordmark{font-size:17px;letter-spacing:-.6px;gap:4px}.site-header .brand-logo{width:22px;height:30px}.site-header .header-actions{gap:2px}}
/* Whole-page semantic surfaces: themed text must never sit on the original pale canvas. */
html[data-theme] .registration-wrap{background:var(--bg,#f7f8ff);color:var(--ink,#172147)}
html[data-theme] .registration-wrap :is(h1,h2,.registration-steps li,.brand){color:var(--ink,#172147)}
html[data-theme] .registration-wrap :is(.eyebrow,.registration-grid>section>p,.registration-steps small,.form-help){color:var(--muted,#596384)}
html[data-theme] .registration-wrap :is(h1 em,a:not(.btn)){color:var(--action,#263acb)}
html[data-theme] .registration-steps b{color:var(--action,#263acb);background:var(--soft,#e1e8ff);border-radius:8px;padding:3px 6px;align-self:flex-start}
html[data-theme]:not([data-theme=original]) :is(.login-layout,.shell,.content,.code-output,.course-finale,.final-intro,.registration-wrap){background:var(--bg);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=original]) :is(.registration-steps li,.final-facts b,.attempt-row,.account-panel dd,.code-output pre,.studio-prompt pre,.final-intro li,.final-facts span,.registration-grid small){color:var(--ink)}
html[data-theme]:not([data-theme=original]) :is(.studio-prompt pre,.code-editor,.code-editor-bar,.code-output,.final-facts,.attempt-row,.receipt-card,.earned-certificate){background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme]:not([data-theme=original]) :is(.code-editor textarea,.code-editor-bar b,.code-editor-bar small,.line-numbers,.studio-prompt p,.final-intro p,.earned-certificate p){color:var(--muted)}
html[data-theme]:not([data-theme=original]) .login-layout .login-art{background:linear-gradient(145deg,var(--soft),var(--bg));color:var(--ink)}
html[data-theme]:not([data-theme=original]) .login-art :is(h1,.brand,.brand small,.login-copy h1 span){color:var(--ink)}
html[data-theme]:not([data-theme=original]) .login-art :is(.eyebrow,p,.login-foot){color:var(--muted)}
.registration-header{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1150px;margin:auto;flex-wrap:wrap}
.registration-appearance{display:flex;align-items:center;gap:10px}
.theme-picker{position:relative;display:inline-flex;flex:none;align-items:center;color:var(--ink,#172147)}
.theme-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;border:1px solid var(--line,#cbd3ed);border-radius:999px;background:var(--surface,#fff);color:var(--ink,#172147);font:600 13px/20px Manrope,sans-serif;cursor:pointer;white-space:nowrap}
.theme-trigger svg{width:19px;height:19px;flex:none}
.theme-trigger:focus-visible,.theme-option:focus-visible{outline:3px solid var(--action,#263acb);outline-offset:3px}
.theme-popover{position:absolute;right:0;top:calc(100% + 10px);z-index:1000;width:272px;max-width:calc(100vw - 32px);background:var(--surface,#fff);color:var(--ink,#172147);border:1px solid var(--line,#cbd3ed);border-radius:18px;padding:16px;box-shadow:0 12px 36px #0003;text-align:left}
.theme-popover[hidden]{display:none}
.theme-popover strong{display:block;font-size:15px;margin:0 0 4px;color:var(--ink,#172147)}
.theme-popover>p{font-size:12px;line-height:19px;margin:0 0 12px;color:var(--muted,#596384)}
.theme-option{display:flex;gap:10px;align-items:center;width:100%;min-height:48px;padding:10px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink,#172147);font:500 13px/20px Manrope,sans-serif;text-align:left;cursor:pointer}
.theme-option[aria-checked=true]{background:var(--soft,#eef1fc);border-color:var(--line,#cbd3ed)}
.theme-option .theme-swatch{width:28px;height:28px;border-radius:9px;flex:none;border:1px solid #78819870;background:var(--swatch)}
.theme-option .theme-check{margin-left:auto;font-weight:800;color:var(--action,#263acb)}
@media(max-width:600px){.header-actions .theme-trigger,.top-right .theme-trigger{padding:10px;gap:5px}.header-actions .theme-current,.top-right .theme-current{display:none}.theme-popover{position:fixed;right:16px;top:84px}.registration-header .theme-popover,.login-appearance .theme-popover{position:absolute;top:calc(100% + 10px);right:0}}
/* Component colours use the same roles in every palette, including Light. */
html[data-theme=original]{--ink:#171b45;--muted:#59617d;--bg:#f7f8ff;--surface:#fff;--soft:#eef1fc;--line:#cbd3ed;--action:#263acb;--action-hover:#1e2eac;--purple:#263acb;--on-action:#fff}
html[data-theme=midnight],html[data-theme=forest]{--on-action:var(--bg)}
html[data-theme] :is(.skip,.skip-link,.date,.empty,.curriculum summary){background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-theme] :is(.page-heading p,.nav-label,.session-label,.footer-note,.notes,.studio-prompt p,.code-output>span,.final-facts span,.final-intro p,.final-intro li,.tabs button){color:var(--muted)}
html[data-theme] .curriculum summary :is(span,small){color:var(--ink)}
html[data-theme] .lesson-row .lesson-number{background:var(--soft);color:var(--muted)}
html[data-theme] .weekdays .day:not(.today){background:var(--soft);color:var(--muted);border-color:var(--line)}
html[data-theme] .weekdays .day b{background:transparent;color:var(--muted)}
html[data-theme] .weekdays .day.today{background:var(--action);color:var(--on-action);border-color:var(--action)}
html[data-theme] .weekdays .day.today b{background:transparent;color:var(--on-action);box-shadow:none}
html[data-theme] .code-editor-bar small{color:#c7d0eb}
html[data-theme]:not([data-theme=original]) .code-editor-bar small{color:var(--muted)}
html[data-theme] :is(input,textarea,select){background:var(--bg);color:var(--ink);border-color:var(--line)}
html[data-theme] :is(input,textarea)::placeholder{color:var(--muted);opacity:1}
html[data-theme] :is(input,textarea):-webkit-autofill{-webkit-text-fill-color:var(--ink);box-shadow:0 0 0 1000px var(--bg) inset}
.registration-header .brand{gap:12px;align-items:center;line-height:1.2}
.registration-header .brand-copy{display:flex;flex-direction:column;gap:5px}
.registration-header .brand small{position:static;white-space:nowrap;font-size:10px;line-height:15px;letter-spacing:0;color:var(--muted)}
.registration-header .brand img{height:44px;width:34px;object-fit:contain;flex-shrink:0}
@media(max-width:420px){.registration-header{gap:12px}.registration-header .brand-name{font-size:19px}.registration-header .brand img{width:28px;height:38px}}