*{box-sizing:border-box}[hidden]{display:none!important}:root{--bg:#112236;--card:#203b51;--cream:#fafaf5;--ink:#233a49;--gold:#ffcf72;--orange:#f29a5f;--blue:#7bbde8;--green:#86c5a0}body{margin:0;background:var(--bg);color:#eef4f7;font:16px/1.55 system-ui,-apple-system,sans-serif}.app{max-width:1350px;margin:auto;padding:24px}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ffcb68;outline-offset:4px}header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.back{display:inline-block;color:#c6d9e8;font-size:13px;text-decoration:none;margin-bottom:9px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.6px;color:#b2c6d5;margin:0}h1{font-size:clamp(27px,3.3vw,40px);line-height:1.2;margin:8px 0 0}h2{font-size:24px;line-height:1.3;margin:10px 0}h3{margin:0 0 8px}.score{display:flex;align-items:center;gap:12px;padding:12px 18px;border:1px solid #3d5368;background:var(--card);border-radius:15px;flex-shrink:0}.score strong{color:var(--gold);font-size:30px}.score span{font-size:12px;max-width:90px}.intro{display:flex;align-items:stretch;gap:20px;border:1px solid #41566b;border-left:4px solid var(--gold);border-radius:17px;background:var(--card);overflow:hidden;margin-bottom:23px}.intro>div{flex:1;padding:18px 22px}.intro h2{font-size:21px;color:var(--gold);margin:0 0 6px}.intro p{margin:6px 0}.intro ol{display:flex;gap:30px;flex-wrap:wrap;padding-left:20px;margin:12px 0;font-size:14px}.intro img{width:180px;object-fit:cover;object-position:center top;opacity:.95}.small{font-size:13px;color:#c9d9e5}.steps{display:flex;gap:10px;margin-bottom:24px;flex-wrap:wrap}.steps button{flex:1;min-width:130px;border:1px solid #455e73;border-radius:11px;background:#1b3247;color:#edf3f8;padding:13px 10px;font-size:14px;font-weight:750}.steps span{margin-right:6px;color:#a9c1d3;font-size:11px}.steps button[aria-current="step"]{background:var(--gold);color:#273a48;border-color:var(--gold)}.steps button[aria-current="step"] span{color:#6d5126}.layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:24px;align-items:start}.memo{background:#1b3348;border:1px solid #375269;border-radius:20px;overflow:hidden}.memo details>summary{list-style:none;cursor:pointer;font-weight:800;padding:17px 20px;border-bottom:1px solid #385168;font-size:18px}.memo summary span{display:block;font-size:11px;color:#b9cfdf;font-weight:500;margin-top:3px}.definition{padding:0 20px;font-size:13px;color:#d5e1eb}.theory-card{margin:14px;border-radius:13px;background:#223e54;border-left:4px solid var(--color);padding:15px;font-size:13px}.theory-card h3{font-size:17px;color:var(--color)}.theory-card p{margin:8px 0}.theory-card .examples{font-size:12px;color:#ccdae4}.independent{--color:var(--orange)}.integrated{--color:var(--blue)}.associated{--color:var(--green)}.remember{margin:14px;padding:16px;border-radius:12px;background:#112b41;border-top:2px solid var(--gold);font-size:12px}.remember h3{color:var(--gold);font-size:16px}.remember p{margin:8px 0}.panel{background:var(--cream);color:var(--ink);border-radius:20px;padding:28px;min-height:450px;box-shadow:0 8px 24px #0002}.tag{font-size:10px;letter-spacing:1.4px;font-weight:850;color:#79511f;background:#fce5ba;padding:7px 10px;border-radius:6px;display:inline-block}.instruction{font-size:16px;margin:12px 0 20px}.muted{font-size:13px;color:#637984}.welcome-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.form-card{border:1px solid #d5dfdf;border-top:4px solid var(--color);border-radius:13px;background:white;padding:15px;text-align:center}.form-card h3{font-size:15px;margin:12px 0 6px}.form-card p{font-size:12px;color:#657987;margin:0}.shop{width:64px;height:58px;margin:10px auto;background:#f3e8cd;border:2px solid #3c5768;border-radius:4px;position:relative}.shop:before{content:"";position:absolute;height:13px;top:-8px;left:-6px;right:-6px;border:2px solid #3c5768;background:repeating-linear-gradient(90deg,var(--color) 0 10px,#fff9eb 10px 20px);border-radius:4px}.shop:after{content:"";position:absolute;width:24px;height:28px;border:2px solid #3c5768;bottom:0;left:10px;background:#b8d9e1}.diagram{padding:18px;background:white;border:1px solid #dce4e5;border-radius:12px;margin:18px 0}.diagram strong{display:block;color:#3f687f;font-size:14px}.diagram p{font-size:14px;margin:7px 0}.progress-head{display:flex;justify-content:space-between;gap:15px;font-size:12px;color:#627784;margin:16px 0 8px}progress{appearance:none;width:100%;height:7px;border:0;border-radius:8px;overflow:hidden;background:#e3e9e9}progress::-webkit-progress-bar{background:#e3e9e9}progress::-webkit-progress-value{background:#42738b}progress::-moz-progress-bar{background:#42738b}.question{font-size:23px;line-height:1.45;background:#fff;border:1px solid #dce4e5;border-radius:14px;padding:23px;margin:20px 0}.choices{display:grid;gap:11px}.choice{display:flex;align-items:center;gap:13px;text-align:left;border:2px solid #d0dbdd;background:white;color:var(--ink);border-radius:12px;padding:16px;font-size:15px;font-weight:650;min-height:58px}.choice .letter{display:grid;place-items:center;border-radius:50%;width:28px;height:28px;background:#eef2f3;color:#577180;font-size:12px;flex-shrink:0}.choice.chosen{border-color:#3b7592;background:#e5f0f7}.choice.good{border-color:#37875d;background:#e5f4e9}.choice:disabled{color:var(--ink);opacity:.8}.choice.good:disabled{opacity:1}.actions{display:flex;gap:10px;margin:20px 0 0;flex-wrap:wrap}.primary{border:0;border-radius:11px;background:#1f485f;color:white;padding:14px 22px;font-weight:800;min-height:49px}.primary:disabled{opacity:.45}.secondary{border:1px solid #a9bcc7;border-radius:11px;padding:12px 18px;background:transparent;color:#3c6074;font-weight:600}.feedback{font-size:15px;border-radius:12px;line-height:1.7;margin-top:18px;padding:16px;background:#edf2f3}.feedback:empty{display:none}.feedback.retry{background:#fff0df;color:#80501f}.feedback.good{background:#e3f1e7;color:#285d43}.hint{margin:18px 0 0;background:#edf2f3;border-radius:10px;padding:12px 15px;font-size:14px}.hint summary{cursor:pointer;font-weight:700}.hint p{margin:8px 0 0}.result{font-size:50px;font-weight:850;color:#25556e;margin:20px 0 0}.result small{font-size:20px;color:#6d818b}.result-label{color:#637984;font-size:13px}.checks{padding-left:20px;line-height:1.9}.retry-list{display:grid;gap:12px;margin:20px 0}.retry-list article{border:1px solid #d8e1e4;background:white;border-radius:12px;padding:16px}.retry-list h3{font-size:15px}.retry-list p{font-size:14px;color:#496573}.module-count{background:#e8eff1;border-radius:10px;padding:12px;font-size:13px;margin:20px 0}footer{text-align:center;font-size:11px;color:#a5bdcf;line-height:1.7;margin:25px 0}footer a{color:#c6d9e8}footer p{margin:5px 0}@media(max-width:1000px){.layout{grid-template-columns:300px minmax(0,1fr)}.app{padding:18px}.panel{padding:22px}.welcome-grid{grid-template-columns:1fr}.form-card{display:flex;align-items:center;gap:15px;text-align:left}.shop{margin:8px;flex-shrink:0}.form-card h3{margin:0}}@media(max-width:720px){.app{padding:14px}.layout{grid-template-columns:1fr;gap:16px}header{gap:12px}.score{padding:8px 10px;gap:7px}.score strong{font-size:23px}.score span{font-size:10px;max-width:57px}h1{font-size:27px}.eyebrow{font-size:9px;letter-spacing:1px}.intro img{display:none}.intro>div{padding:17px}.intro ol{display:block;line-height:1.9}.steps{gap:7px;margin-bottom:16px}.steps button{min-width:100px;padding:10px 7px;font-size:12px}.panel{padding:20px;min-height:0}.question{font-size:20px;padding:18px}.memo details>summary:after{content:'Ouvrir / fermer le mémo';font-size:11px;font-weight:500;display:block;color:#b9cfdf;margin-top:5px}.choice{padding:14px;font-size:14px}.primary{flex:1}.back{font-size:12px}.actions{gap:8px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}@media print{body{background:white;color:black}.intro,.memo,.steps,.back,footer,.actions{display:none}header .score{display:none}.layout{display:block}.panel{box-shadow:none}.app{padding:0}}

.steps button:disabled{background:#152b3e;color:#94a9b9;border-color:#30485c;opacity:.7;cursor:not-allowed}.steps .lock{font-size:11px;margin:0 0 0 4px}

/* Compact memo: one main idea per colour, with optional source details. */
.memo .theory-card{background:var(--memo-bg);color:#243746;border-left:0;border-top:5px solid var(--memo-accent);padding:14px 16px;margin:12px;font-size:14px;line-height:1.45}
.memo .independent{--memo-bg:#fff0df;--memo-accent:#c35b17}
.memo .integrated{--memo-bg:#e5f2ff;--memo-accent:#226da5}
.memo .associated{--memo-bg:#e6f5e9;--memo-accent:#327549}
.memo .theory-card h3{color:var(--memo-accent);font-size:17px;margin:0 0 8px}
.memo .theory-card .key{font-size:17px;font-weight:800;margin:0 0 5px}
.memo .theory-card p{margin:5px 0}
.memo .theory-card .more{border-top:1px solid #24374625;margin-top:10px;padding-top:7px}
.memo .theory-card .more>summary{padding:3px 0;border:0;font-size:12px;font-weight:700;color:var(--memo-accent);list-style:disclosure-closed}
.memo .theory-card .more[open]>summary{list-style:disclosure-open}
.memo .theory-card .more>summary:after{content:none}
.memo .theory-card .more p{font-size:13px;line-height:1.55;margin:10px 0}
.memo .theory-card .examples{color:#243746}
.memo .remember{background:#fff3cd;color:#51431b;border:0;padding:13px 16px;margin:12px;font-size:13px;line-height:1.4}
.memo .remember h3{color:#795813;font-size:16px;margin-bottom:7px}
.memo .remember p{margin:5px 0;padding-left:12px;border-left:3px solid #dcaf3d}
.memo .definition{font-size:14px;margin:15px 20px;line-height:1.6}

/* Reading view: a single central task, with optional help nearby. */
:root{--reading-size:18px}
.app{max-width:1040px}
.layout{display:flex;flex-direction:column;gap:18px}
.layout>.panel,.layout>.memo{width:100%}
.panel{padding:30px 36px;min-height:0;font-size:var(--reading-size);line-height:1.65}
.intro{margin-bottom:16px}.intro>div{padding:14px 20px}.intro img{width:100px;max-height:125px}.intro h2{font-size:21px}.intro p{font-size:16px}
.reading-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#213b50;border-radius:12px;padding:12px 16px;margin-bottom:18px}
.reading-tools>span:first-child{font-size:14px;margin-right:auto}.reading-tools button{border:1px solid #b3c7d6;border-radius:9px;padding:8px 14px;background:#fafaf5;color:#233a49;font-size:16px;font-weight:700;min-height:44px}
.reading-tools button:disabled{opacity:.45}.reading-tools #reading-status{font-size:13px;flex-basis:100%;color:#d4e2ec}.reading-tools #reading-status:empty{display:none}
.steps{gap:8px;margin-bottom:16px}.steps button{font-size:13px;padding:10px 8px;min-width:110px}
.panel h2{font-size:1.35em}.panel .question{font-size:1.3em;line-height:1.6;padding:20px 24px;max-width:100%;margin:18px 0}
.simple-steps{display:flex;gap:32px;flex-wrap:wrap;padding-left:24px;font-size:1em;margin:16px 0;line-height:1.6}
.score-note{font-size:.85em;color:#4f6470;margin:0}
.choice{font-size:1em;font-weight:500;line-height:1.6;padding:16px 20px;min-height:64px}
.choice.chosen{border-color:#286587;background:#e5f0f7}.choice.chosen .letter{background:#286587;color:white}.letter{font-weight:800}
.actions .primary,.actions .secondary{font-size:1em}.feedback{font-size:1em;line-height:1.65}
.hint,.word-help{font-size:1em;line-height:1.65;border:1px solid #ccdadf;border-radius:12px;background:#edf3f5;padding:12px 18px;margin-top:16px}
.hint summary,.word-help summary{cursor:pointer;font-weight:700;min-height:28px}.word-help dl{margin:12px 0 0}.word-help dt{font-weight:700;margin-top:10px}.word-help dd{margin:2px 0 12px}
.memo{background:#213b50}.memo #theory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 16px}.memo .theory-card{margin:0;font-size:var(--reading-size)}
.memo .theory-card h3,.memo .theory-card .key{font-size:1em}.memo .theory-card .more>summary{font-size:.85em;line-height:1.6;padding:8px 0}.memo .theory-card .more p{font-size:1em}
.memo .definition{font-size:var(--reading-size)}.memo .remember{margin:16px;font-size:var(--reading-size)}.memo .remember h3{font-size:1em}
.memo #course>summary{font-size:20px}.memo #course>summary:after{content:'Ouvrir / fermer';display:inline-block;font-size:13px;font-weight:500;margin-left:16px;color:#c5d9e7}.memo summary span{font-size:13px}
.welcome-grid{gap:14px}.form-card{padding:18px}.form-card h3{font-size:1em}.form-card p{font-size:.9em;color:#405a69}.diagram p,.diagram strong{font-size:1em}.muted{font-size:.9em;color:#4f6470}
@media(max-width:720px){.panel{padding:22px 18px}.simple-steps{display:block;margin:14px 0}.simple-steps li+li{margin-top:6px}.memo #theory{grid-template-columns:1fr}.memo #course>summary:after{display:block;margin:5px 0 0}.question{padding:18px!important}.reading-tools{gap:8px}.reading-tools>span:first-child{flex-basis:100%}.steps button{min-width:95px}.intro img{display:none}}
@media print{.reading-tools{display:none}}

.reading-tools{position:sticky;top:8px;z-index:5;box-shadow:0 4px 16px #11223630;border:1px solid #466073}
#activity{scroll-margin-top:110px}.panel .question{max-width:65ch}.choice.independent{border-left:6px solid #c35b17}.choice.integrated{border-left:6px solid #226da5}.choice.associated{border-left:6px solid #327549}
@media(max-width:720px){#activity{scroll-margin-top:155px}.reading-tools{top:4px}.panel h2{font-size:1.2em}.choice{padding:14px;font-size:1em}.welcome-grid{grid-template-columns:1fr}}

/* Warm, quiet palette: colour guides the task without filling the screen. */
:root{--bg:#f6f1e7;--cream:#fffdf8;--ink:#34483f;--card:#edf2e9;--gold:#f1dcae;--orange:#d69a73;--blue:#9ab6c8;--green:#a1bea0}
body{color:var(--ink);background:var(--bg)}
h1,h2{color:#34483f}.back,.eyebrow{color:#55685c}.eyebrow{letter-spacing:1px}
.score{background:#edf2e9;border-color:#ccd7c9;color:#34483f}.score strong{color:#466650}
.intro{background:#edf2e9;border-color:#ccd7c9;border-left-color:#9db89b;border-radius:22px}.intro h2{color:#3f5d47}.intro img{border-radius:18px;margin:8px;opacity:.9}.small{color:#55685c}
.steps button{background:#fffdf8;color:#465b4e;border-color:#9aa89d;border-radius:14px}
.steps span{color:#52695a}.steps button[aria-current="step"]{background:#e1eddc;border-color:#6c866c;color:#344d38}.steps button[aria-current="step"] span{color:#466650}
.steps button:disabled{background:#eeeae2;color:#746f63;border-color:#d2cdc1;opacity:1}.steps button:disabled span{color:#746f63}
.reading-tools{background:#f0f3eb;color:#34483f;border-color:#c3cdbd;box-shadow:0 3px 12px #4c57450d;border-radius:18px}
.reading-tools button{color:#34483f;background:#fffdf8;border-color:#7c8b80;border-radius:12px}
.reading-tools #reading-status{color:#52695a}
.panel{border:1px solid #deded0;box-shadow:0 5px 18px #685c3e08;border-radius:24px}
.tag{background:#f4e6cc;color:#67512d;letter-spacing:.8px;border-radius:8px}
.question{background:#f8f6ef;border-color:#d7dace;border-radius:18px}
.choice{background:#fffdf8;color:#34483f;border-color:#7c8b80;border-radius:16px}
.choice .letter{background:#eef1e9;color:#52695a}
.choice.chosen{background:#edf3e8;border-color:#526f52}.choice.chosen .letter{background:#466650;color:#fffdf8}
.choice.independent{border-left-color:#b66b3d}.choice.integrated{border-left-color:#52778e}.choice.associated{border-left-color:#587b56}
.primary{background:#466650;color:#fffdf8;border-radius:14px}.secondary{color:#466650;border-color:#7c8b80;border-radius:14px}
progress,progress::-webkit-progress-bar{background:#e7ebe0}progress::-webkit-progress-value{background:#7d9877}progress::-moz-progress-bar{background:#7d9877}
.hint,.word-help{background:#f0f3eb;border-color:#c3cdbd;border-radius:16px}
.memo{background:#fffdf8;color:#34483f;border-color:#d4dbcd;border-radius:22px}
.memo details>summary{border-color:#d4dbcd}.memo #course>summary:after,.memo summary span{color:#55685c}.memo .definition{color:#34483f}
.memo .independent{--memo-bg:#f8ebdf;--memo-accent:#9b512b}.memo .integrated{--memo-bg:#eaf1f5;--memo-accent:#42667d}.memo .associated{--memo-bg:#eaf3e5;--memo-accent:#456941}
.form-card{background:#fffdf8;border-color:#d3d9cc;border-top-color:var(--color);border-radius:18px}.form-card p,.muted,.score-note{color:#526558}
.feedback.retry{background:#f8ecde;color:#72502d}.feedback.good{background:#e9f2e4;color:#3e5d39}.choice.good{background:#e9f2e4;border-color:#587b56}
.result{color:#466650}.result small,.result-label,.progress-head{color:#526558}.module-count{background:#edf2e9}.retry-list article{background:#fffdf8}.retry-list p{color:#526558}
footer,footer a{color:#5a695e}
button:focus-visible,a:focus-visible,summary:focus-visible{outline-color:#466650}

/* Accompanied reading: the spoken text stays visible and is highlighted. */
.memo.is-reading #theory{grid-template-columns:1fr;max-width:760px;margin:auto}
.memo.is-reading .theory-card>.key,.memo.is-reading .theory-card>.key+p{display:none}
.memo.is-reading .more>summary{display:none}
.memo [data-read]{scroll-margin-top:170px}
.memo .spoken-sentence{background:#f5e7ba!important;color:#34483f!important;border-radius:8px;outline:2px solid #8d7b45;outline-offset:4px}
.memo .spoken-word{background:#d9e6c8;box-shadow:0 0 0 2px #6c866c;border-radius:3px;color:#233b2a}
.memo.is-reading .definition,.memo.is-reading .remember{max-width:728px;margin:20px auto;padding:10px 16px}
@media(max-width:720px){.memo.is-reading .definition,.memo.is-reading .remember{margin:16px}}

.voice-choice{display:flex;align-items:center;gap:8px;font-size:14px;color:#34483f}.voice-choice select{font:inherit;font-size:15px;max-width:250px;min-height:44px;border:1px solid #7c8b80;border-radius:12px;padding:8px;background:#fffdf8;color:#34483f}.voice-choice select:focus-visible{outline:3px solid #466650;outline-offset:3px}
@media(max-width:720px){.voice-choice{flex-basis:100%}.voice-choice select{flex:1;max-width:none}#activity{scroll-margin-top:220px}.memo [data-read]{scroll-margin-top:230px}}
