:root{--top-bg:#fbf8f0;--ink:#172f43;--paper:#fbf8f0;--muted:#596875;--accent:#7c5cff;--accent-ink:#6844e8;--tint:#eeebfc;--line:#dddcd8;--reading-size:19px;color-scheme:light;scroll-behavior:auto;scroll-padding-top:94px}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}body[data-age="4"]{--accent:#FF9F1C;--accent-ink:#c46800;--tint:#fff4e5;--brand-accent:#FF9F1C}body[data-age="7"]{--accent:#00D4AA;--accent-ink:#008f72;--tint:#e5faf5;--brand-accent:#00D4AA}body[data-age="12"]{--accent:#7C5CFF;--accent-ink:#6844e8;--tint:#eeebfc;--brand-accent:#7C5CFF}body[data-age="16"]{--accent:#c9a86a;--accent-ink:#8a682e;--tint:#f1e9d8;--brand-accent:#c9a86a}body[data-large="true"]{--reading-size:22px}a{color:inherit;text-underline-offset:4px}button,summary,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button,summary{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{border:0;background:none}.skip{position:fixed;top:-100px;left:15px;background:var(--paper);z-index:20;padding:12px}.skip:focus{top:10px}
.topbar{position:sticky;top:0;z-index:10;background:var(--top-bg,#fbf8f0);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.top-inner{max-width:1060px;margin:auto;min-height:70px;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:8px;align-items:center;text-decoration:none;font-size:12px;letter-spacing:.1em;font-weight:800;cursor:pointer}.brand img{width:30px;height:38px;object-fit:contain}.nav-actions{display:flex;align-items:center;gap:12px}.age-switch{display:flex;gap:3px;background:#eeece6;border-radius:50px;padding:3px}.age-switch a{font-size:13px;min-width:43px;min-height:34px;display:grid;place-items:center;border-radius:50px;text-decoration:none;color:#52616b;font-weight:750}.age-switch a[aria-current="page"]{background:var(--ink);color:#fff}.menu-btn{display:flex;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:0 6px;font-size:13px;font-weight:650}.menu-btn svg{width:23px;height:23px}.progress{height:3px;background:transparent}.progress span{display:block;width:0;height:100%;background:var(--accent);transition:width .1s linear}
main{max-width:740px;margin:auto;padding:0 30px}.intro{padding-top:48px}.eyebrow{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:750;letter-spacing:.14em;text-transform:uppercase}.eyebrow::before{content:"";height:7px;width:7px;background:var(--accent);border-radius:50%}.intro h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(40px,8vw,66px);line-height:1.08;letter-spacing:-.045em;margin:17px 0 18px}.intro .subhead{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:26px;line-height:1.35;max-width:530px;margin:0}.meta{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 20px;margin:24px 0 0}.intro .start-link{font-size:13px;font-weight:650;display:inline-flex;align-items:center;gap:8px;margin-top:22px;text-decoration:none}.intro .start-link span{color:var(--accent);font-size:20px}
.chapter{padding:48px 0 4px;scroll-margin-top:90px}.chapter:not(.first){margin-top:40px;border-top:1px solid var(--line)}.chapter-marker{display:flex;align-items:center;gap:13px;margin-bottom:20px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.chapter-marker .number{font-family:Georgia,serif;font-size:35px;letter-spacing:-.05em;font-weight:400;color:var(--accent-ink)}h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(28px,5.5vw,38px);line-height:1.2;letter-spacing:-.027em;margin:0 0 26px;font-weight:700}.scene{width:100%;aspect-ratio:auto;margin:0 0 30px;overflow:hidden;position:relative;background:#e8e0d3;border-radius:3px}.scene img{position:static;width:100%;height:auto;max-width:100%;object-fit:contain;transform:none;display:block}.chapter.first .scene{margin-bottom:31px}.copy{font-size:var(--reading-size);line-height:1.75;overflow-wrap:break-word}.copy p{margin:0 0 23px}.copy p:last-child{margin-bottom:0}.copy b{font-weight:700}.callout{padding:23px 24px;margin-top:28px;background:var(--tint);border-left:3px solid var(--accent);border-radius:0 5px 5px 0}.callout h3{font-size:13px;text-transform:uppercase;letter-spacing:.06em;line-height:1.45;margin:0 0 10px}.callout .copy{font-size:calc(var(--reading-size) - 2px);line-height:1.7}.section-sign{display:flex;justify-content:flex-end;margin-top:23px;opacity:.8}.section-sign img{width:24px;height:31px;object-fit:contain}.diagram{margin:0 0 28px;border-radius:6px;background:#f1eee5;padding:22px 17px}.diagram-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.diagram-item h3{font-size:14px;text-align:center;margin:0 0 13px}.diagram-item svg{display:block;width:100%;height:auto}.diagram-item p{font-size:13px;line-height:1.55;margin:10px 0 0}.diagram-note{font-size:12px;line-height:1.6;color:var(--muted);margin:16px 0 0}
.answers{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--tint);margin-top:28px;border-radius:4px}.answers summary{padding:20px;font-weight:750;font-size:15px;line-height:1.4;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px}.answers summary::-webkit-details-marker{display:none}.answers summary::after{content:"+";font-size:24px;font-weight:400;color:var(--accent-ink)}.answers[open] summary::after{content:"−"}.answers .answer-text{padding:0 20px 22px;font-size:calc(var(--reading-size) - 1px);line-height:1.8}.answers h3{font-size:14px;margin:0 0 9px}.source-list{list-style:none;padding:0;margin:28px 0 0}.source-list li{border-bottom:1px solid var(--line)}.source-list a{padding:16px 24px 16px 0;display:block;font-size:14px;line-height:1.65;position:relative;text-decoration:none}.source-list a::after{content:"↗";position:absolute;right:1px;top:17px;color:var(--accent);font-size:18px}.source-list a:hover{text-decoration:underline}.sources .copy{font-size:calc(var(--reading-size) - 2px)}.end{padding:36px 0 64px;margin-top:40px;border-top:1px solid var(--line)}.end-main{display:flex;align-items:center;justify-content:space-between;gap:20px}.end strong{font-family:Georgia,serif;font-size:26px}.end img{width:46px;height:58px;object-fit:contain}.end p{font-size:13px;line-height:1.6;color:var(--muted)}.end a{font-size:14px;display:inline-block;padding:12px 0}.reading-end{display:flex;justify-content:space-between;align-items:center;gap:12px}.reconstitution{font-size:12px;line-height:1.6;color:var(--muted);margin-top:28px}
dialog{border:0;border-radius:12px;width:min(540px,calc(100% - 24px));max-height:85dvh;background:var(--paper);color:var(--ink);padding:24px;box-shadow:0 24px 100px #172f4330;display:flex;flex-direction:column;overflow:hidden}dialog::backdrop{background:#172f4370;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;gap:15px;align-items:center}.dialog-head h2{font-size:28px;margin:0}.close{font-size:26px;width:44px;height:44px}.reader-options{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:17px 0;border-block:1px solid var(--line);padding:15px 0;font-size:13px}.font-button{min-height:44px;border:1px solid var(--line);border-radius:50px;padding:8px 16px;font-weight:750}.font-button[aria-pressed="true"]{background:var(--ink);color:white}.toc{display:grid;gap:0;overflow:auto;flex:1;min-height:0;-webkit-overflow-scrolling:touch}.toc a{display:flex;align-items:flex-start;gap:14px;text-decoration:none;padding:13px 0;font-size:15px;line-height:1.45}.toc a span{color:var(--accent-ink);font-size:12px;letter-spacing:.05em;min-width:22px;padding-top:2px}.toc a:hover,.toc a[data-active="true"]{font-weight:750}.dialog-foot{margin:15px 0 0;font-size:11px;color:var(--muted)}
@media(min-width:1000px){main{padding-top:20px}.intro{padding-top:50px}.chapter{padding-top:54px}.chapter:not(.first){margin-top:56px}.scene{border-radius:4px}}@media(max-width:480px){html,body{overflow-x:hidden}.top-inner{padding:8px 17px;gap:8px;min-height:65px}.brand{font-size:10px;letter-spacing:.07em;gap:5px}.brand img{width:25px;height:33px}.nav-actions{gap:6px}.menu-btn span{display:none}.age-switch a{min-width:38px;font-size:12px}.menu-btn{padding:0 5px}main{padding:0 22px}.intro{padding-top:34px}.intro .subhead{font-size:23px}.intro h1{font-size:44px}.eyebrow{font-size:10px;letter-spacing:.1em}.meta{font-size:11px;gap:8px 14px}.chapter{padding-top:34px}.chapter-marker{margin-bottom:15px}.chapter:not(.first){margin-top:35px}.scene{width:calc(100% + 12px);margin-left:-6px;aspect-ratio:1.5}.callout{padding:20px 19px}.copy{line-height:1.72}.diagram{padding:19px 12px}.diagram-grid{gap:12px}.diagram-item h3{font-size:13px}.diagram-item p{font-size:12px}.end{padding-bottom:35px}dialog{padding:20px}.reader-options{font-size:12px}}@media(max-width:355px){.brand span{display:none}.intro h1{font-size:39px}main{padding-inline:19px}:root{--reading-size:18px}.chapter-marker{font-size:10px}.callout{padding:18px}.diagram-item p{font-size:11px}.reading-end{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.progress span{transition:none}}@media print{.topbar,.start-link,dialog,.reading-end{display:none}main{max-width:100%;padding:0}.chapter{break-inside:avoid}.answers .answer-text{display:block}.scene{max-height:300px}body{background:#fff}}
.intro h1 span{display:block;font-size:.63em;letter-spacing:-.02em;margin-bottom:7px}.science-panel{margin-top:28px}.science-panel>h3{font-family:Georgia,serif;font-size:22px;line-height:1.35;margin:0 0 20px}.science-panel svg{max-width:200px;margin:auto}.force-rule{font-size:15px;line-height:1.7;border-top:1px solid var(--line);padding-top:16px;margin-bottom:0}.chronology{list-style:none;margin:0 0 32px;padding:0 0 0 20px;border-left:1px solid var(--accent)}.chronology li{position:relative;padding:0 0 25px 10px}.chronology li:last-child{padding-bottom:0}.chronology li:before{content:'';position:absolute;width:9px;height:9px;border-radius:50%;background:var(--accent);left:-25px;top:5px}.chronology .date{display:block;color:var(--accent-ink);font-size:12px;font-weight:750;letter-spacing:.07em;text-transform:uppercase;margin-bottom:8px}.chronology strong{display:block;font-family:Georgia,serif;font-size:23px}.chronology p{font-size:15px;line-height:1.6;margin:6px 0 0}.calculation{background:var(--tint);padding:24px;margin-top:28px;border-radius:5px}.calculation>span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}.calculation>div{font-family:Georgia,serif;font-size:25px;line-height:1.5;margin:20px 0}.calculation small{font-family:system-ui,sans-serif;font-size:12px;display:block;color:var(--muted)}.calculation>p:not(.diagram-note){font-family:Georgia,serif;font-size:27px}.calculation>p b{color:var(--accent-ink)}
.calculation>p b{display:block;white-space:nowrap;font-size:1.3em;margin-top:6px}
.route .sea{background:#c8e3ea;padding:17px 15px;font-size:16px;font-weight:750;border-radius:3px}.route-land{display:grid;grid-template-columns:1fr 32px 1fr;gap:16px;min-height:210px}.route-land>span{align-self:center;font-size:14px;font-weight:750;text-transform:uppercase}.waterway{background:#c8e3ea}.places{display:flex;flex-direction:column;justify-content:space-between;padding:16px 0;font-size:13px;line-height:1.6}.places>span{font-size:12px}.benefits{border-block:1px solid var(--line);margin-bottom:28px;padding:0 0 7px}.benefits>div{position:relative;padding:21px 0 8px 38px}.benefits>div>span{position:absolute;top:24px;left:0;color:var(--accent-ink);font-size:11px;font-weight:700}.benefits h3{font:700 23px Georgia,serif;line-height:1.3;margin:0 0 9px}.benefits p{font-size:15px;line-height:1.7;margin:0 0 8px}
/* A compact introduction and full-width scenes for the mobile reading edition. */
.source-disclosure .source-list{margin-top:0}.source-disclosure .answer-text{padding-top:0}.source-disclosure .source-list a{font-size:14px}
@media(max-width:480px){.intro{padding-top:25px}.intro h1{font-size:40px;margin:13px 0}.intro .subhead{font-size:22px}.meta{margin-top:16px}.intro .start-link{margin-top:14px}.chapter.first{padding-top:24px}.scene{width:calc(100% + 44px);margin-left:-22px;border-radius:0}.chapter:not(.first){margin-top:28px}.copy p{margin-bottom:18px}.callout{margin-top:22px}}
@media(max-width:355px){.scene{width:calc(100% + 38px);margin-left:-19px}.intro h1{font-size:37px}}

/* ===== Mode sombre (partagé site + lecteurs) ===== */
html{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"]{
  --ink:#f3efe6;
  --paper:#121212;
  --muted:#a9b2bb;
  --line:#2c2c2c;
  --accent:#7c5cff;
  --accent-ink:#b9a6ff;
  --tint:#241f3a;
  --top-bg:#121212;
  --card:#1c1c1c;
  --age-switch-bg:#1e1e1e;
  color-scheme:dark;
}
html[data-theme="dark"] body[data-age="4"]{--accent:#FF9F1C;--accent-ink:#FFC46B;--tint:#2a1f12}
html[data-theme="dark"] body[data-age="7"]{--accent:#00D4AA;--accent-ink:#5EE0C0;--tint:#0f2a24}
html[data-theme="dark"] body[data-age="12"]{--accent:#7C5CFF;--accent-ink:#b9a6ff;--tint:#241f3a}
html[data-theme="dark"] body[data-age="16"]{--accent:#C9A86A;--accent-ink:#E0C48A;--tint:#2a2418}
html[data-theme="dark"] .topbar{background:var(--top-bg)}
html[data-theme="dark"] .age-switch{background:var(--age-switch-bg)}
html[data-theme="dark"] .age-switch a{color:var(--muted)}
html[data-theme="dark"] .age-switch a[aria-current="page"]{background:var(--ink);color:#121212}
html[data-theme="dark"] .scene{background:#1a1a1a}
html[data-theme="dark"] .diagram{background:#1a1a1a}
html[data-theme="dark"] .route .sea,html[data-theme="dark"] .waterway{background:#1a3540;color:var(--ink)}
html[data-theme="dark"] dialog{background:var(--paper);color:var(--ink);box-shadow:0 24px 100px #00000080}
html[data-theme="dark"] dialog::backdrop{background:#000000a0}
html[data-theme="dark"] .font-button[aria-pressed="true"]{background:var(--ink);color:#121212}
html[data-theme="dark"] .habitat-tag{background:rgba(243,239,230,.08);color:var(--muted)}
html[data-theme="dark"] .skip{background:var(--paper)}
/* Theme + Version PC/mobile: inside ☰ sommaire (.reader-options), not floating */
.reader-options{flex-wrap:wrap;gap:10px}
.sav-pc-btn{/* inherits .font-button */}
.sav-theme-btn{
  /* inherits .font-button; keep compact label */
  white-space:nowrap;
}
html[data-theme="dark"] .sav-theme-btn{
  /* same as other font-button in dark */
}

/* ===== Écouter — bouton rond play/pause sous le sous-titre ===== */
.intro .listen-controls{display:flex;align-items:center;gap:8px;margin-top:22px;flex-wrap:wrap}
.listen-controls{display:flex;align-items:center;gap:8px}
.listen-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;min-width:44px;min-height:44px;padding:0;
  border-radius:50%;
  border:1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
  background:color-mix(in srgb, var(--accent) 12%, transparent);
  color:var(--accent-ink, var(--ink));font-size:16px;font-weight:700;line-height:1;
  cursor:pointer;box-sizing:border-box;
}
.listen-btn span{display:block;transform:translateX(1px)} /* optical center for ▶ */
.listen-btn[aria-pressed="true"]{
  background:var(--accent);color:#fff;border-color:var(--accent);
}
.listen-btn[aria-pressed="true"] span{transform:none}
.listen-btn:hover{filter:brightness(0.97)}
html[data-theme="dark"] .listen-btn{
  background:color-mix(in srgb, var(--accent) 18%, transparent);
  border-color:color-mix(in srgb, var(--accent) 45%, var(--line));
}
html[data-theme="dark"] .listen-btn[aria-pressed="true"]{color:#121212}
/* Ne plus afficher l’ancien lien / meta */
.intro .meta,.intro .start-link,.intro .intro-actions,.intro .intro-links{display:none!important}
@media(max-width:480px){
  .intro .listen-controls{margin-top:16px}
  .listen-btn{width:40px;height:40px;min-width:40px;min-height:40px;font-size:15px}
}
@media print{.listen-controls{display:none}}

/* ===== Fiches liées ===== */
.related-fiches{margin:28px 0 18px;padding:18px 0 0;border-top:1px solid var(--line)}
.related-title{font:700 15px/1.3 system-ui,-apple-system,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.related-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.related-list a{
  display:block;padding:10px 14px;border-radius:12px;
  border:1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  background:color-mix(in srgb, var(--accent) 8%, transparent);
  color:var(--accent-ink, var(--ink));font-weight:700;font-size:15px;
  text-decoration:none;
}
.related-list a:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}
html[data-theme="dark"] .related-list a{color:var(--ink)}
@media print{.related-fiches{display:none}}

/* Lieu / dates under subtitle */
.intro .kicker{font-size:13px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#6b645a);margin:10px 0 0;max-width:560px}