/* Learning surface tokens; intentionally scoped to the student quiz only. */
body[data-learning-theme]{
 --learn-bg:#edf4fc;--learn-glow:#c4ddff;--learn-star:#6095cf;
 --learn-surface:#ffffff;--learn-raised:#f4f8fe;--learn-field:#ffffff;
 --learn-text:#183859;--learn-muted:#526d8c;--learn-line:#cfdeef;
 --learn-accent:#086bdb;--learn-on-accent:#ffffff;--learn-selected:#e5f1ff;
 --learn-focus:#0979df;--learn-shadow:0 16px 48px #16385d0d;
 --learn-side:#102d50;--learn-side-end:#184570;--learn-side-text:#e3efff;
 --learn-warning-bg:#fff5d9;--learn-warning-text:#755310;
 --learn-success-bg:#e8f7ef;--learn-success-text:#116644;
 --learn-error-bg:#fff0f2;--learn-error-text:#af2941;
 --learn-selection:#b4d9ff;--learn-selection-text:#102e50;
 --learn-paper:#ffffff;--learn-orbit:#5598e12b;
 color-scheme:light;background:var(--learn-bg);color:var(--learn-text);
}
body[data-learning-theme="dark"]{
 --learn-bg:#080f20;--learn-glow:#15315e;--learn-star:#90bff6;
 --learn-surface:#101d32;--learn-raised:#17273f;--learn-field:#0e1a2e;
 --learn-text:#e3edfc;--learn-muted:#a7bad4;--learn-line:#344c6a;
 --learn-accent:#80b8ff;--learn-on-accent:#08182e;--learn-selected:#203e65;
 --learn-focus:#96d4ff;--learn-shadow:0 18px 52px #00000036;
 --learn-side:#09172a;--learn-side-end:#102a49;--learn-side-text:#dceaff;
 --learn-warning-bg:#332d1d;--learn-warning-text:#f0d590;
 --learn-success-bg:#153c34;--learn-success-text:#a0e6c4;
 --learn-error-bg:#432433;--learn-error-text:#ffc0ca;
 --learn-selection:#386cb0;--learn-selection-text:#ffffff;--learn-orbit:#79b7ff25;
 color-scheme:dark;
}
body[data-learning-theme] .shell .main{
 background:radial-gradient(ellipse at 87% -10%,var(--learn-glow),transparent 55%),var(--learn-bg);
 isolation:isolate;position:relative;min-height:100vh;
}
body[data-learning-theme] .main::before{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:radial-gradient(circle at 90% 40px,var(--learn-star) 1px,transparent 2px),radial-gradient(circle at 35% 100px,var(--learn-star) 1px,transparent 2px),radial-gradient(circle at 72% 65px,var(--learn-star) 1px,transparent 2px);opacity:.45;
}
body[data-learning-theme] .main::after{
 content:"";position:absolute;right:3%;top:10px;width:min(40%,460px);height:150px;border:1px solid var(--learn-orbit);border-radius:50%;transform:rotate(-16deg);z-index:-1;pointer-events:none;
}
body[data-learning-theme] .shell .side{background:linear-gradient(165deg,var(--learn-side),var(--learn-side-end));color:var(--learn-side-text)}
body[data-learning-theme] .topbar{flex-wrap:wrap;gap:12px;color:var(--learn-text)}
body[data-learning-theme] .topbar .tb-l{margin-right:auto;min-width:0}
body[data-learning-theme] .topbar h1,body[data-learning-theme] .quiz-head b{color:var(--learn-text)}
body[data-learning-theme] .crumb,body[data-learning-theme] .product-muted,body[data-learning-theme] .muted{color:var(--learn-muted)}
body[data-learning-theme] .quiz-main,body[data-learning-theme] .quiz-ai,body[data-learning-theme] #content>.product-card{background:var(--learn-surface);color:var(--learn-text);border-color:var(--learn-line);box-shadow:var(--learn-shadow)}
body[data-learning-theme] .quiz-head,body[data-learning-theme] .quiz-actions,body[data-learning-theme] .quiz-ai h3{border-color:var(--learn-line)}
body[data-learning-theme] .quiz-stem,body[data-learning-theme] .analysis{color:var(--learn-text)}
body[data-learning-theme] .opt{background:var(--learn-field);border-color:var(--learn-line);color:var(--learn-text)}
body[data-learning-theme] .opt .mk{background:var(--learn-raised);color:var(--learn-muted)}
body[data-learning-theme] .quiz-answer .opt:hover:not(:disabled),body[data-learning-theme] .quiz-answer .opt.sel{background:var(--learn-selected);border-color:var(--learn-accent);box-shadow:none}
body[data-learning-theme] .opt.sel .mk{background:var(--learn-accent);color:var(--learn-on-accent)}
body[data-learning-theme] .quiz-answer .opt:disabled{opacity:1;color:var(--learn-text)}
body[data-learning-theme] .btn{background:var(--learn-accent);color:var(--learn-on-accent);border-color:var(--learn-accent)}
body[data-learning-theme] .btn.line{background:var(--learn-surface);color:var(--learn-text);border-color:var(--learn-line)}
body[data-learning-theme] button:disabled{opacity:.6}
body[data-learning-theme] input,body[data-learning-theme] textarea,body[data-learning-theme] select{background:var(--learn-field);color:var(--learn-text);border-color:var(--learn-line)}
body[data-learning-theme] ::placeholder{color:var(--learn-muted);opacity:1}
body[data-learning-theme] .quiz-result,body[data-learning-theme] .ai-message{background:var(--learn-raised);border-color:var(--learn-line);color:var(--learn-text)}
body[data-learning-theme] .ai-message.user,body[data-learning-theme] .quote-chip{background:var(--learn-selected);color:var(--learn-text)}
body[data-learning-theme] .readonly-note{background:var(--learn-warning-bg);color:var(--learn-warning-text)}
body[data-learning-theme] .product-success{background:var(--learn-success-bg);color:var(--learn-success-text)}
body[data-learning-theme] .product-error{background:var(--learn-error-bg);color:var(--learn-error-text)}
/* Real diagrams and handwriting keep a white paper surface in either theme. */
body[data-learning-theme] .quiz-image,body[data-learning-theme] .draw-pad,body[data-learning-theme] .answer-images img{background:var(--learn-paper);border-color:var(--learn-line);color-scheme:light}
body[data-learning-theme] #modal{background:var(--learn-surface);color:var(--learn-text);border-color:var(--learn-line)}
body[data-learning-theme] .product-form label{color:var(--learn-muted)}
body[data-learning-theme] .product-form .actions{background:var(--learn-surface)}
body[data-learning-theme] ::selection{background:var(--learn-selection);color:var(--learn-selection-text)}
body[data-learning-theme] :focus-visible{outline-color:var(--learn-focus)}
.learning-theme-switch{display:inline-flex;align-items:center;gap:3px;padding:4px;background:var(--learn-raised);border:1px solid var(--learn-line);border-radius:28px;flex:none}
.learning-theme-switch button{min-height:44px;padding:8px 15px;border:1px solid transparent;border-radius:24px;background:transparent;color:var(--learn-muted);font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}
.learning-theme-switch button[aria-pressed="true"]{background:var(--learn-surface);color:var(--learn-accent);border-color:var(--learn-line);box-shadow:var(--learn-shadow)}
.learning-theme-switch button span{font-size:19px;vertical-align:-1px;margin-right:4px}
@media(max-width:1000px){body[data-learning-theme] .topbar .tb-l{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){body[data-learning-theme] *,body[data-learning-theme] *::before,body[data-learning-theme] *::after{transition:none!important}}
/* Avoid a light-background/dark-text mismatch mid theme transition. */
body[data-learning-theme] .quiz-answer .opt{transition:none}
/* Reuse the existing compact navigation for tablet portrait, without new routes. */
@media (min-width:761px) and (max-width:1000px){
 body[data-learning-theme] .shell .side{display:none}
 body[data-learning-theme] .shell .main{margin-left:0;width:100%;padding:24px 24px 100px}
 body[data-learning-theme] .mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:95;padding:10px;gap:4px;overflow-x:auto}
 body[data-learning-theme] .mobile-nav button{border:0;padding:12px;white-space:nowrap;min-height:44px}
}
body[data-learning-theme] .mobile-nav{background:var(--learn-side)}
body[data-learning-theme] .mobile-nav button{background:transparent;color:var(--learn-side-text)}
body[data-learning-theme] .mobile-nav button.on{background:var(--learn-selected);color:var(--learn-text)}