/* Magic Math Lab · premium.css v27
   Ivory parchment, deep forest ink, champagne and copper detail.
   Visual layer only. workspace.css (loaded last) owns the course-map grid,
   calculator panes and mobile tabs; it reads --brand --paper --line --ink --muted --wash. */

/* 1. Tokens ---------------------------------------------------------------- */
:root{
  color-scheme:light;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
  --sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --bg:#f5efe2;--paper:#fffcf5;--wash:#f1e9d7;--ink:#1a2b24;--muted:#565b51;
  --brand:#1f4a3a;--brand-deep:#153428;--accent-ink:#fffcf5;--copper:#8f4f22;--gold:#b08d4f;--gold-soft:#dccaa0;
  --line:#ddd1b8;--line-strong:#c2ae8c;--focus:#a3501a;--danger:#9b2c1c;
  --grid:#1f4a3a0b;--grid-strong:#1f4a3a17;--glow:#fffaf0;--shade-1:#2b24141a;--shade-2:#2b241440;
  --radius:6px;
}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){
  color-scheme:dark;
  --bg:#0e1c17;--paper:#152620;--wash:#1c3129;--ink:#efe6d2;--muted:#bdb39d;
  --brand:#d8bc84;--brand-deep:#e6cf9f;--accent-ink:#11221b;--copper:#e3a678;--gold:#c4a468;--gold-soft:#5e5236;
  --line:#2e443a;--line-strong:#465c50;--focus:#f2c879;--danger:#f2a08c;
  --grid:#d8bc840a;--grid-strong:#d8bc8418;--glow:#1b3329;--shade-1:#0000004d;--shade-2:#00000099}}
:root[data-theme=dark]{
  color-scheme:dark;
  --bg:#0e1c17;--paper:#152620;--wash:#1c3129;--ink:#efe6d2;--muted:#bdb39d;
  --brand:#d8bc84;--brand-deep:#e6cf9f;--accent-ink:#11221b;--copper:#e3a678;--gold:#c4a468;--gold-soft:#5e5236;
  --line:#2e443a;--line-strong:#465c50;--focus:#f2c879;--danger:#f2a08c;
  --grid:#d8bc840a;--grid-strong:#d8bc8418;--glow:#1b3329;--shade-1:#0000004d;--shade-2:#00000099}
/* Legacy aliases. The :not() raises specificity so earlier theme blocks in styles.css cannot split the palette. */
:root:not([data-theme=_]){
  --shadow:0 1px 2px var(--shade-1),0 18px 40px -26px var(--shade-2);
  --bg-a:var(--bg);--bg-b:var(--bg);--surface:var(--paper);--surface-2:var(--wash);--text:var(--ink);--text-muted:var(--muted);
  --border:var(--line);--accent:var(--brand);--accent-soft:var(--wash);--soft-shadow:var(--shadow);--hero-ink:var(--ink);
  --glass:var(--paper);--glass-panel:var(--paper);--glass-edge:var(--line);--glass-rim:var(--line);--glass-depth:var(--shade-2);
}

/* 2. Page, type, links, focus ---------------------------------------------- */
body{min-height:100dvh;color:var(--ink);font-family:var(--sans);background-color:var(--bg);
  background-image:radial-gradient(ellipse 90% 55% at 50% -12%,var(--glow),transparent 70%),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:100% 100%,32px 32px,32px 32px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--gold-soft);color:var(--ink)}
h1,h2,h3,.brand-name,.nav-title,.chart-name{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
h1{font-weight:500;line-height:1.08;letter-spacing:-.02em}
h1 em,h2 em{font-style:italic;color:var(--copper)}
.eyebrow,.unit-label,.course-code,.key-label,.group-heading small{font:600 .72rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--copper)}
.lede{color:var(--muted);font-size:1.1rem;line-height:1.65;max-width:62ch}
.fineprint,.small,.nav-meta,.save-status{color:var(--muted)}
a{color:var(--brand);text-decoration-thickness:1px;text-underline-offset:.22em}
main a:not([class]):hover{text-decoration-thickness:2px}
.error{color:var(--danger)}
.notice:not(:empty){padding:.6rem .9rem;background:var(--wash);border-left:3px solid var(--gold);border-radius:0 4px 4px 0}
.code-word{font-family:var(--mono);font-size:.92em;padding:.05em .4em;background:var(--wash);border:1px solid var(--line);border-radius:3px;color:var(--brand)}
progress,input[type=radio],input[type=checkbox]{accent-color:var(--brand)}
:is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* 3. Buttons and fields (scoped: calculator keys keep their own sizing) ----- */
.btn,.button,a.primary,button.primary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.6rem 1.15rem;
  border:1px solid var(--line-strong);border-radius:4px;background:var(--paper);color:var(--ink);font:600 .94rem/1.2 var(--sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;touch-action:manipulation}
.btn[hidden],.button[hidden],a.primary[hidden],button.primary[hidden]{display:none}
.btn:hover,.button:hover{border-color:var(--brand);color:var(--ink)}
.btn-primary,a.primary,button.primary,.button.primary{background:var(--brand);border-color:var(--brand);color:var(--accent-ink);box-shadow:inset 0 -2px 0 #00000022}
.btn-primary:hover,a.primary:hover,button.primary:hover,.button.primary:hover{background:var(--brand-deep);border-color:var(--brand-deep);color:var(--accent-ink)}
.btn-ghost{background:transparent;border-color:transparent}
.btn-ghost:hover{background:var(--wash);border-color:var(--line)}
.btn-danger{background:#8a2c1f;border-color:#8a2c1f;color:#fff}
.btn-small{padding:.45rem .85rem;font-size:.85rem}
.btn-wide{width:100%}
.btn:active,.button:active,a.primary:active,button.primary:active{transform:translateY(1px)}
.btn:disabled,.button[aria-disabled=true]{opacity:.55;cursor:not-allowed}
:is(#access-code,#tutor-input,.voice-speed,#guide-topic,.search-row input,.search-input-row input){min-height:48px;padding:.6rem .85rem;
  border:1px solid var(--line-strong);border-radius:4px;background:var(--paper);color:var(--ink);font:inherit;font-size:1rem}
:is(#access-code,#tutor-input,.voice-speed,#guide-topic,.search-row input,.search-input-row input):focus-visible{border-color:var(--brand)}
#tutor-input{min-height:6rem}

/* 4. Headers ---------------------------------------------------------------- */
.site-header,.learning-header{position:relative;z-index:6;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1.5rem;
  max-width:1320px;margin:0 auto 1.75rem;padding:.9rem clamp(1rem,3vw,2rem);background:transparent;border:0;border-bottom:3px double var(--line-strong);border-radius:0;box-shadow:none}
.learning-header .brand{display:inline-flex;flex-direction:column;justify-content:center;min-height:44px;font-family:var(--serif);font-size:1.4rem;font-weight:600;line-height:1.05;letter-spacing:-.01em;color:var(--ink);text-decoration:none}
.learning-header .brand span,.brand-sub{margin:.2rem 0 0;font:600 .64rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--copper)}
.site-header .brand{display:flex;align-items:center;gap:.8rem}
.brand-name{margin:0;font-size:1.35rem;line-height:1.1}
.mark-bg{fill:var(--brand)}
.mark-circle,.mark-triangle{fill:none;stroke:var(--accent-ink);stroke-width:2.5}
.mark-square{fill:var(--accent-ink);opacity:.35}
.mark-line{stroke:var(--accent-ink);stroke-width:2}
.header-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.learner-label{color:var(--muted);font-size:.85rem}
.learning-header nav{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;min-width:0;padding:0}
.learning-header nav>a,.learning-header summary{display:inline-flex;align-items:center;min-height:44px;padding:.35rem .8rem;border-radius:3px;
  color:var(--ink);font-size:.92rem;font-weight:550;text-decoration:none;cursor:pointer}
.learning-header nav>a:hover,.learning-header summary:hover{background:var(--wash)}
.learning-header nav>a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--copper)}
.tools-menu>summary{list-style:none}
.tools-menu>summary::-webkit-details-marker{display:none}
.tools-menu>summary::after{content:"▾";content:"▾"/"";margin-left:.35rem;font-size:.75em;color:var(--copper)}
.tools-menu>div{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.calc-toggle{min-height:44px;padding:.35rem .9rem;border:1px solid var(--brand);border-radius:3px;background:transparent;color:var(--brand);font:600 .9rem/1.2 var(--sans);cursor:pointer;touch-action:manipulation}
.calc-toggle[aria-expanded=true]{background:var(--brand);color:var(--accent-ink)}
body>footer,.site-footer{border-top:1px solid var(--line);color:var(--muted);font-size:.85rem}

/* 5. Surfaces --------------------------------------------------------------- */
.card,.reading{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.reading{padding:clamp(1.1rem,3vw,2.2rem);margin-bottom:1.5rem}
.reading section:first-child h2{margin-top:0}
details.card>summary{min-height:44px;padding:.5rem 0;font-family:var(--serif);font-size:1.15rem;font-weight:600;cursor:pointer}
.summary-sub{font-family:var(--sans);font-weight:400;color:var(--muted)}
.next-step{background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--copper);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.4rem 1.6rem}
.breadcrumbs,.breadcrumbs a{color:var(--muted);font-size:.86rem}
.status-tag{font:600 .68rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--copper);border:1px solid currentColor;border-radius:2px;padding:.3rem .5rem}
.score,.summary-counts,.lesson-position,.activity-number{font-variant-numeric:lining-nums tabular-nums}

/* 6. Entry and library hero -------------------------------------------------- */
body:has(#screen-login:not([hidden]))>main,body:has(#screen-library:not([hidden]))>main{max-width:1160px}
.screen-entry:not([hidden]){display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:1.25rem 4rem;align-items:start;padding-top:1rem}
.welcome-copy{grid-column:1;grid-row:1;padding:1rem 0 0}
.library-intro h1,.welcome-copy h1{font-size:clamp(2.7rem,5.2vw,4.6rem);line-height:1.02;letter-spacing:-.025em;margin:.9rem 0 1.1rem;max-width:none;color:var(--ink)}
.hero-facts{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin:1.25rem 0;font:600 .72rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.hero-facts span+span::before{content:"·";margin-right:1rem;color:var(--copper)}
.screen-entry .entry-form{grid-column:2;grid-row:1/span 2;align-self:center;width:100%;max-width:none;margin:1rem 0;padding:clamp(1.3rem,3vw,2.1rem);
  background:var(--paper);border:1px solid var(--line);border-top:3px double var(--gold);border-radius:var(--radius);box-shadow:var(--shadow)}
.entry-form h2{font-size:1.65rem;margin:.3rem 0}
.entry-form .lede{font-size:1rem;margin:.6rem 0}
#login-form label{display:block;margin-top:1rem;font:600 .72rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
#access-code{letter-spacing:.04em}
.entry-form #login-submit{flex-direction:row;gap:.75rem;margin-top:.5rem}
.entry-form .fineprint{font-size:.76rem;line-height:1.55}
.screen-entry .entry-stage{grid-column:1;grid-row:2;position:relative;width:100%;max-width:460px;margin:0;padding:0;border:0;background:none;text-align:right}
.entry-art{background:transparent;text-align:left}
.screen-entry #entry-skip{position:static;margin-top:.6rem;font-size:.78rem}
.library-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:1.5rem 3rem;padding:2rem 0 3rem;margin-bottom:2rem;border-bottom:1px solid var(--line)}
.library-intro .lede{max-width:40ch}
.hero-start{padding:.85rem 1.4rem;margin:.5rem .8rem .5rem 0;font-size:1rem}
.hero-secondary{display:inline-flex;align-items:center;min-height:44px;font-size:.92rem}
.learning-entry{overflow:hidden;border-top:3px double var(--gold)}
.learning-entry h2{font-size:clamp(1.8rem,3.4vw,2.4rem);font-weight:500;letter-spacing:-.02em}
.learning-entry>p{max-width:52ch}
.learning-entry .btn{margin:.35rem .25rem .35rem 0}
.returning-art{float:right;width:42%;margin:0 0 1rem 2rem}

/* 7. The diagram: a framed plate showing 2, 4, 6 around their mean ----------- */
.glass-scene{position:relative;isolation:isolate;width:100%;height:340px;overflow:hidden;pointer-events:none;color:var(--ink);background:var(--paper);
  border:1px solid var(--line-strong);border-radius:2px;box-shadow:inset 0 0 0 7px var(--paper),inset 0 0 0 8px var(--gold-soft),var(--shadow)}
.library-intro .glass-scene{height:360px}
.screen-entry .glass-scene,.returning-art .glass-scene{height:300px}
.scene-halo{position:absolute;inset:8px;background-image:linear-gradient(var(--grid-strong) 1px,transparent 1px),linear-gradient(90deg,var(--grid-strong) 1px,transparent 1px);
  background-size:22px 22px;background-position:center;-webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000 35%,transparent 85%);mask-image:radial-gradient(ellipse at 50% 50%,#000 35%,transparent 85%)}
.glass-orbit{position:absolute;z-index:1}
.orbit-back{left:16%;right:16%;top:12%;height:28%;border:1.5px solid var(--copper);border-bottom:0;border-radius:50% 50% 0 0/100% 100% 0 0;opacity:.35}
.orbit-front{left:50%;top:9%;width:0;height:33%;border-left:1px dashed var(--gold)}
.glass-sample{position:absolute;z-index:2;top:10%;left:8%;right:8%;padding:.9rem 1rem 0}
.scene-kicker{display:block;font:650 .6rem/1.4 var(--sans);letter-spacing:.16em;color:var(--copper)}
.sample-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));text-align:center;margin:.4rem 0 .25rem;font-family:var(--serif);
  font-size:clamp(2.4rem,4.4vw,3.3rem);font-weight:500;line-height:1.1;font-variant-numeric:lining-nums tabular-nums}
.sample-axis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-items:center;border-top:1px solid var(--ink)}
.sample-axis i{width:7px;height:7px;margin-top:-4px;border-radius:50%;background:var(--copper);box-shadow:0 0 0 3px var(--paper)}
.glass-result{position:absolute;z-index:3;right:6%;bottom:8%;max-width:min(64%,300px);padding:.75rem 1.1rem .8rem;background:var(--paper);
  border:1px solid var(--line);border-top:2px solid var(--copper);box-shadow:var(--shadow)}
.glass-result>span{display:block;font:600 .6rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.glass-result strong{display:block;font-family:var(--serif);font-size:2.4rem;font-weight:500;line-height:1.1;color:var(--brand);font-variant-numeric:lining-nums}
.glass-result strong span{font:400 .85rem var(--sans);letter-spacing:0;color:var(--muted)}
.glass-result .result-caption{margin-top:.15rem;font:italic 400 .82rem/1.3 var(--serif);letter-spacing:0;text-transform:none;color:var(--copper)}
.glass-symbol{position:absolute;z-index:3;font-family:var(--serif);font-size:1.45rem;line-height:1;color:var(--gold)}
.symbol-sum{top:16px;right:20px;font-style:italic}
.symbol-root{left:20px;bottom:14px}

/* 8. Library, search, sidebar ----------------------------------------------- */
.search-row{padding:1.1rem 1.4rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.search-row p{font-size:.82rem;color:var(--muted)}
.group-heading{padding-top:2rem}
.group-heading>span{display:grid;place-items:center;flex:0 0 44px;height:44px;padding:0;font-family:var(--serif);font-weight:600;color:var(--copper);
  background:var(--paper);border:1px solid var(--gold);border-radius:50%;box-shadow:inset 0 0 0 3px var(--paper),inset 0 0 0 4px var(--gold-soft)}
.group-jumps a{display:inline-flex;align-items:center;min-height:44px;padding:.4rem .95rem;border:1px solid var(--line);border-radius:3px;background:var(--paper);color:var(--ink);text-decoration:none;font-size:.88rem}
.group-jumps a:hover{border-color:var(--copper)}
.topic-card{border-top:3px double var(--gold)}
.skill-tags li{border:1px solid var(--line);border-radius:2px;background:var(--wash);font-size:.78rem;letter-spacing:.02em}
.activity-map{box-shadow:none}
.activity-map li a{text-underline-offset:4px}
.activity-number{display:inline-grid;place-items:center;min-width:2rem;height:2rem;font-family:var(--serif);color:var(--copper);border:1px solid var(--gold);border-radius:50%;background:var(--paper)}
.lesson-nav{background:transparent;border-right-color:var(--line)}
.nav-title{font-size:1.1rem}
.path a{min-height:44px;border-radius:3px;color:var(--ink);text-decoration:none}
.path a:hover{background:var(--wash)}
.path a[aria-current=page]{background:var(--paper);font-weight:600;box-shadow:inset 3px 0 0 var(--copper),0 0 0 1px var(--line)}
.steps-nav{gap:.3rem;padding:.3rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius)}
.steps-nav a{flex:1 1 auto;justify-content:center;min-height:44px;border:1px solid transparent;border-radius:4px;color:var(--ink);text-decoration:none;white-space:nowrap}
.steps-nav a:hover{background:var(--wash)}
.steps-nav a[aria-current=page]{background:var(--brand);border-color:var(--brand);color:var(--accent-ink)}

/* 9. Questions, answer key, guides, quizzes ---------------------------------- */
.question-card{border-top:3px solid var(--brand)}
.prompt,.walk-question{font-family:var(--serif);font-size:1.22rem;line-height:1.55;font-variant-numeric:lining-nums}
.choice{min-height:44px;border:1px solid var(--line);border-radius:4px;background:var(--paper)}
.choice:has(input:checked){border-color:var(--brand);background:var(--wash);box-shadow:inset 3px 0 0 var(--brand)}
.data-table,.question-data table{border-collapse:collapse;font-variant-numeric:tabular-nums}
.data-table th{font:600 .7rem/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--copper);border-bottom:1px solid var(--gold)}
.data-table td{border-bottom:1px solid var(--line)}
.answer-key{background:var(--wash);border-left:3px solid var(--copper)}
.key-answer{font-family:var(--serif);font-size:1.35rem;font-weight:600;color:var(--brand);font-variant-numeric:lining-nums}
.key-sequence{font-family:var(--mono);font-size:.9rem;overflow-wrap:anywhere}
.key-sequence kbd,.walk-step kbd,.guide-steps kbd{display:inline-block;padding:.05rem .4rem;font:600 .82rem/1.5 var(--mono);color:var(--ink);background:var(--paper);border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:3px}
.worked,.guide-example{padding:.9rem 1.1rem;background:var(--wash);border-left:3px solid var(--gold);border-radius:0 4px 4px 0}
.hint,.recall-cue{border-left:2px solid var(--gold);padding-left:1rem;color:var(--muted)}
.formula-guide{padding:1rem 1.25rem;background:var(--paper);border:1px solid var(--line);border-top:3px double var(--gold);border-radius:var(--radius)}
.guide-finish{border-top:1px solid var(--line);padding-top:1rem}
:is(.guide-steps,.walk-steps,.method-steps,.quiz-how ol)>li::marker{font-family:var(--serif);font-weight:600;color:var(--copper)}
.question-nav,.quiz-nav,.walk-navigation{border-top:1px solid var(--line);padding-top:1rem}
.chart-figure figcaption{color:var(--muted);font-size:.85rem}
.quiz-hub h1{font-size:clamp(2.4rem,5vw,3.6rem)}
.quiz-how{border-top:3px double var(--gold)}
.score{font-family:var(--serif);font-size:2rem;color:var(--brand)}

/* 10. Calculator dock (colour only; workspace.css owns structure) ------------- */
.calc-dock{background:var(--paper);border-left:1px solid var(--line);border-radius:6px 0 0 6px;box-shadow:-16px 0 40px -28px var(--shade-2)}
.calc-head{position:sticky;top:-1rem;z-index:2;padding:.8rem 0;background:var(--paper);border-bottom:1px solid var(--line)}
.calc-head h2{max-width:20ch;font-size:1.2rem}
.calc-head button{min-width:70px;min-height:44px}
.calc-dock select{height:48px;min-width:0;max-width:100%}
.model-picker legend,.guide-label{font-weight:600}

/* 11. Motion ------------------------------------------------------------------ */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .btn,.button,a.primary,button.primary,.calc-toggle,.group-jumps a,.topic-card,.path a{transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}
  .topic-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px var(--shade-1),0 24px 44px -26px var(--shade-2)}
}
@media(prefers-reduced-motion:no-preference){
  .library-intro .glass-scene,.entry-art:not(.is-done) .glass-scene{animation:mml-arrive .6s cubic-bezier(.2,.7,.2,1) both}
  .library-intro .orbit-back,.entry-art:not(.is-done) .orbit-back{animation:mml-draw 1.1s .25s ease both}
  .library-intro .glass-result,.entry-art:not(.is-done) .glass-result{animation:mml-arrive .5s .55s both}
  @keyframes mml-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  @keyframes mml-draw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
}

/* 12. Small screens ------------------------------------------------------------ */
@media(max-width:1000px){.screen-entry:not([hidden]){gap:1rem 2rem}.library-intro{gap:1rem 2rem}}
@media(max-width:760px){
  .site-header,.learning-header{margin-bottom:1rem;padding:.7rem 1rem;gap:.25rem 1rem}
  .learning-header .brand{flex-direction:row;align-items:baseline;gap:.6rem;font-size:1.2rem}
  .learning-header nav{flex:1 1 100%;gap:.1rem;margin-left:-.5rem}
  .learning-header nav>a,.learning-header summary{padding:.3rem .55rem;font-size:.86rem}
  .calc-toggle{padding:.3rem .6rem;font-size:.86rem}
  .screen-entry:not([hidden]){display:flex;flex-direction:column;gap:0}
  .welcome-copy{order:0;padding:0}
  .welcome-copy h1{font-size:clamp(2.8rem,13vw,3.6rem);margin:.8rem 0}
  .screen-entry .entry-form{order:1;margin:.5rem 0 1.25rem;padding:1.2rem 1.25rem}
  .screen-entry .entry-stage{order:2;max-width:none}
  .library-intro{grid-template-columns:1fr;padding:1rem 0 1.75rem;gap:.5rem}
  .library-intro h1{font-size:clamp(2.5rem,11vw,3.4rem)}
  .glass-scene{max-width:460px;margin-inline:auto}
  .glass-scene,.library-intro .glass-scene,.screen-entry .glass-scene,.returning-art .glass-scene{height:290px}
  .returning-art{float:none;width:100%;margin:0 0 1rem}
  .glass-sample{left:6%;right:6%}
  .sample-values{font-size:2.5rem}
  .glass-result{right:5%;max-width:72%}
  .glass-result strong{font-size:1.9rem}
  .search-row,.next-step{padding:1.1rem}
  .steps-nav a{font-size:.85rem;padding:.55rem}
  .calc-dock{border-radius:0;padding-bottom:calc(2rem + env(safe-area-inset-bottom))}
}

/* 13. Accessibility preferences -------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .btn:active,.button:active,a.primary:active,button.primary:active{transform:none}
  .entry-stage #entry-skip{display:none!important}
}
@media(prefers-contrast:more){
  body{background-image:none}
  .card,.reading,.next-step,.search-row,.formula-guide,.glass-scene,.group-jumps a,.choice,.btn,.button{border-color:var(--muted)}
}
@media(forced-colors:active){
  body{background:Canvas}
  .glass-scene{display:none}
  .card,.reading,.next-step,.search-row,.steps-nav,.calc-dock,.formula-guide{border:1px solid CanvasText;box-shadow:none}
  .btn-primary,a.primary,button.primary,.calc-toggle[aria-expanded=true],.steps-nav a[aria-current=page]{border:2px solid ButtonText}
  [aria-current=page],[aria-pressed=true]{outline:2px solid Highlight}
  .library-intro,.screen-entry:not([hidden]){display:block}
}

/* Preserve the interactive standard-deviation lab, adapted to this palette. */
.lab-paper{background:var(--paper);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow)}
.lab-invite{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;padding:clamp(1.2rem,3vw,2rem);margin:1.5rem 0 2rem;border:1px solid var(--line);border-radius:6px;background:var(--paper);box-shadow:var(--soft-shadow);border-top:3px solid var(--brand)}.lab-invite h2{margin:.2rem 0}.lab-invite p{max-width:55ch}.lab-invite .eyebrow{color:var(--brand)}
.lab-mode-picker{display:flex;flex-wrap:wrap;gap:.4rem;padding:.45rem;background:var(--paper);border:1px solid var(--line);border-radius:6px;margin:1rem 0}.lab-mode-picker button{flex:1 1 auto;font-size:.9rem;border-color:transparent;background:transparent;font-weight:650}.lab-mode-picker button[aria-pressed=true]{background:var(--brand);color:var(--accent-ink);box-shadow:0 2px 6px #1233}.lab-paper{padding:clamp(1rem,3vw,2rem)}.lab-paper>h2{font-size:clamp(1.4rem,3vw,1.9rem);margin:.4rem 0 1rem;letter-spacing:-.025em}.lab-paper:focus{outline:none}
.method-grid,.practice-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.5rem 0}.method-paper{border:1px solid var(--line);border-radius:6px;padding:1.2rem;min-width:0;background:var(--paper)}.method-paper h3{margin:.5rem 0;font-size:1.2rem}.method-number{display:inline-grid;place-items:center;width:38px;height:38px;background:var(--wash);border:1px solid var(--line);border-radius:50%;color:var(--brand);font-size:.85rem;font-weight:750}.method-paper ol{padding-left:1.2rem}.method-paper li{margin-bottom:.6rem}.shared-total{padding:.08rem .35rem;background:var(--wash);border-radius:5px;color:var(--brand)}
.connection-note,.calculator-check{background:var(--wash);border-left:3px solid var(--brand);border-radius:4px;padding:1rem 1.2rem;margin:1.25rem 0}.connection-note h3,.calculator-check h3{margin-top:0}.connection-note p:last-child,.calculator-check p:last-child{margin-bottom:0}.lab-paper textarea{font:inherit;color:var(--ink);background:var(--paper);display:block;width:100%;border:1px solid var(--line);border-radius:4px;padding:.75rem;margin:.5rem 0;resize:vertical}.lab-paper label:not(.choice){font-weight:650}.lab-paper fieldset{border:0;padding:0;margin:1rem 0}.lab-paper legend{font-weight:650}.value-inputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin-top:.6rem}.value-inputs input{display:block;width:100%;min-height:48px;font:inherit;font-size:1.2rem;font-variant-numeric:tabular-nums;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:.65rem}.value-picker{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.value-picker [aria-pressed=true]{border:2px solid var(--brand);background:var(--wash);font-weight:750}.spread-figure{margin:1.5rem 0}.spread-figure svg{display:block;width:100%;max-width:600px;margin:auto;overflow:visible}.spread-figure svg text{fill:var(--ink);font:12px system-ui,sans-serif}.spread-figure svg circle{fill:var(--muted);stroke:var(--paper);stroke-width:2}.spread-figure .selected-point circle{fill:var(--brand);stroke:var(--ink);stroke-width:2}.spread-figure .number-axis{stroke:var(--ink);stroke-width:1.5}.spread-figure .mean-line{stroke:var(--brand);stroke-width:2;stroke-dasharray:4 4}.spread-figure .distance{stroke:var(--muted);stroke-width:2}.spread-figure .selected-point .distance{stroke:var(--brand);stroke-width:4}.spread-figure figcaption{font-size:.85rem;color:var(--muted)}.lab-table-wrap{overflow-x:auto}.lab-table-wrap table{font-variant-numeric:tabular-nums;margin:.5rem 0}.lab-table-wrap caption{text-align:left;font-size:.9rem;color:var(--muted);margin-bottom:.5rem}.selected-row{background:var(--wash);outline:2px solid var(--brand);outline-offset:-2px}.lab-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}.lab-results>div{padding:1rem;border:1px solid var(--line);border-radius:6px;min-width:0}.lab-results span{display:block;font-size:.8rem;color:var(--muted)}.lab-results strong{display:block;font-size:clamp(1.15rem,3vw,1.8rem);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.lab-results small{font-size:.8rem}.lab-results .result-selected{border:2px solid var(--brand);background:var(--wash)}.lab-paper .mistake-work{border:2px solid #bd823d;padding:1rem;border-radius:6px}.mistake-work legend{padding:0 .3rem}.mistake-work .choice{background:var(--paper)}#repair-feedback:not(:empty){border:1px solid var(--line);background:var(--wash);border-radius:4px;padding:1rem}#repair-feedback:focus{outline:3px solid var(--focus)}.practice-links a{color:var(--ink);text-decoration:none}.practice-links a>span:last-child{color:var(--brand);font-weight:700}.practice-links a:hover{border-color:var(--brand)}
.lab-paper select{height:48px;max-width:100%}.lab-mode-picker button{display:flex;align-items:center;justify-content:center;white-space:normal;line-height:1.35;height:auto;min-height:44px}
@media(max-width:760px){.lab-mode-picker{display:grid;grid-template-columns:1fr 1fr}.lab-mode-picker button{padding:.65rem .4rem;min-height:56px}.method-grid,.practice-links,.lab-results{grid-template-columns:1fr}.lab-invite{display:block}.lab-invite .button{width:100%}.lab-paper .actions>*{flex:1 1 auto}.value-inputs{gap:.4rem}.value-inputs label{font-size:.875rem}.lab-paper th,.lab-paper td{padding:.55rem .35rem}.spread-figure svg text{font-size:17px}}
@media(forced-colors:active){.lab-invite,.lab-mode-picker,.lab-paper,.method-paper{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-shadow:none}.selected-row,[aria-pressed=true]{outline:2px solid Highlight}.spread-figure svg circle,.spread-figure svg text{fill:CanvasText}.spread-figure svg line{stroke:CanvasText}}