/* Original remains the default. These palettes change colour, never font or geometry. */
.theme-picker{display:inline-flex;align-items:center;flex-shrink:0}.theme-picker select{font:inherit;font-size:12px;font-weight:600;min-height:44px;max-width:114px;padding:8px 25px 8px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface,#fff);color:var(--ink)}
.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,select,.theme-picker select){background:var(--bg);color:var(--ink);border-color:var(--line)}
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}
@media(max-width:600px){.theme-picker select{max-width:94px;font-size:11px;padding-left:8px}.top-right{gap:7px}.top-right .muted{display:none}.course-row .ring{width:60px;height:60px;grid-column:2;justify-self:end}.course-row .ring span{font-size:13px}.header-actions{gap:6px}}
/* 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%)}
