:root{
  --accent:#7c2d12;--accent-2:#c2410c;--accent-soft:#fff7ed;--accent-line:#fdba74;
  --ink:#1c1917;--ink-2:#57534e;--ink-3:#a8a29e;--bg:#fffdfa;--bg-2:#f5f0ea;--line:#e7e0d8;
  --ok:#15803d;--ok-soft:#dcfce7;--ko:#b91c1c;--ko-soft:#fee2e2;--info:#1d4ed8;--info-soft:#dbeafe;
  --sig:#0e7490;--eps:#15803d;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:Georgia,"Times New Roman",serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --accent:#fdba74;--accent-2:#fb923c;--accent-soft:#2a1a10;--accent-line:#7c2d12;
  --ink:#f5f0ea;--ink-2:#c9c0b6;--ink-3:#8a8178;--bg:#171412;--bg-2:#211c18;--line:#3a322c;
  --ok:#4ade80;--ok-soft:#14321f;--ko:#f87171;--ko-soft:#3a1616;--info:#93c5fd;--info-soft:#172554;
  --sig:#67e8f9;--eps:#86efac;}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.55;font-size:16px}
a{color:var(--accent-2);text-decoration:none}a:hover{text-decoration:underline}
header.top{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:8px 16px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink)}
.brand .badge{background:var(--accent);color:#fff;font-weight:700;font-size:13px;letter-spacing:.5px;padding:4px 7px;border-radius:6px}
.brand b{font-size:15px}.brand small{display:block;color:var(--ink-2);font-size:12px;font-weight:400}
nav.links{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
nav.links a{padding:6px 10px;border:1px solid var(--line);border-radius:8px;font-size:14px;color:var(--ink)}
nav.links a.on,nav.links a:hover{background:var(--accent-soft);border-color:var(--accent-line);text-decoration:none}
main{max-width:860px;margin:0 auto;padding:16px 16px 80px}
h1{font-family:var(--serif);font-weight:600;font-size:2rem;line-height:1.15;margin:.6em 0 .2em}
h2{font-family:var(--serif);font-weight:600;font-size:1.55rem;margin:2.2em 0 .5em;padding-top:.6em;border-top:2px solid var(--accent-line)}
h3{font-size:1.12rem;margin:1.6em 0 .4em;color:var(--accent)}
h4{font-size:1rem;margin:1.1em 0 .3em}
p{margin:.55em 0}
.lead{color:var(--ink-2);font-size:1.05rem}
.toc{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:16px 0}
.toc ol{margin:6px 0 0;padding-left:1.3em}.toc li{margin:3px 0}
.toc summary{cursor:pointer;font-weight:600}
.box{border:1px solid var(--line);border-left:4px solid var(--accent);background:var(--bg-2);border-radius:10px;padding:10px 14px;margin:14px 0}
.box.key{border-left-color:var(--ok)}.box.warn{border-left-color:var(--ko)}.box.bridge{border-left-color:var(--info)}
.box b.t{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.6px;color:var(--ink-2);margin-bottom:4px}
.formula{text-align:center;margin:10px 0;padding:8px 6px;background:var(--bg-2);border-radius:8px;overflow-x:auto}
.formula .ref{display:block;font-size:.8rem;color:var(--ink-3);margin-top:4px}
figure{margin:16px 0}figure svg{width:100%;height:auto;display:block}
figcaption{font-size:.88rem;color:var(--ink-2);font-style:italic;margin-top:6px}
.tw{overflow-x:auto;margin:10px 0;max-width:100%}
table{border-collapse:collapse;width:100%;font-size:.92rem;margin:0}
th,td{border:1px solid var(--line);padding:5px 8px;text-align:left;vertical-align:top}th{background:var(--bg-2)}
/* calculators */
.calc{border:1px solid var(--line);border-radius:12px;background:var(--bg-2);padding:12px 14px;margin:18px 0}
.calc .ct{font-weight:600;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.calc .ct::before{content:"⚙";color:var(--accent-2)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 12px}
.grid label{display:block;font-size:.82rem;color:var(--ink-2)}
.grid input,.grid select{display:block;margin-top:2px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--ink);font:inherit;font-size:.95rem;width:100%}
.grid input:focus{outline:2px solid var(--accent-line)}
.out{margin-top:10px;padding:10px;border-radius:8px;background:var(--bg);border:1px dashed var(--line);font-size:.95rem}
.out .r{display:flex;justify-content:space-between;gap:8px;padding:3px 0;border-bottom:1px solid var(--line)}
.out .r:last-child{border:0}.out .r b{font-family:var(--mono);font-weight:600;text-align:right;max-width:62%}
.out .ok{color:var(--ok)}.out .ko{color:var(--ko)}
.mat{font-family:var(--mono);font-size:.9rem;display:inline-block;border-left:2px solid var(--ink-3);border-right:2px solid var(--ink-3);padding:2px 8px;margin:4px 0;line-height:1.4}
canvas{max-width:100%;display:block;margin:8px auto;background:var(--bg);border:1px solid var(--line);border-radius:10px;touch-action:none}
input[type=range]{width:100%;accent-color:var(--accent-2)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
button,.btn{font:inherit;font-size:.92rem;padding:7px 12px;border-radius:8px;border:1px solid var(--accent-line);background:var(--accent-soft);color:var(--ink);cursor:pointer}
button.primary,.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
button:hover{filter:brightness(1.05)}
.chip{display:inline-block;font-size:.78rem;padding:2px 8px;border-radius:999px;background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--ink-2)}
.lab{border:1px solid var(--accent-line);border-radius:12px;padding:12px 14px;margin:18px 0;background:linear-gradient(180deg,var(--accent-soft),var(--bg))}
.lab .lt{font-weight:700;margin:0 0 4px}.lab .lt::before{content:"▶ ";color:var(--accent-2)}
.lab p{font-size:.92rem;color:var(--ink-2);margin:4px 0 8px}
.exo{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:14px 0;background:var(--bg)}
.exo .et{font-weight:600;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.exo .et .chip{margin-left:auto}
.exo .sol{display:none;margin-top:10px;padding:10px;background:var(--bg-2);border-radius:8px;font-size:.93rem}
.exo .sol.open{display:block}
.ans{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin:10px 0}
.ans label{display:block;font-size:.82rem;color:var(--ink-2)}
.ans input{display:block;width:100%;margin-top:2px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--ink);font:inherit}
.ans input.ok{border-color:var(--ok);background:var(--ok-soft)}.ans input.ko{border-color:var(--ko);background:var(--ko-soft)}
.score{font-size:.9rem;color:var(--ink-2)}
.chap-links{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 0}
.hero{text-align:center;padding:40px 0 20px}
.hero .badge{font-size:28px;padding:10px 16px;border-radius:12px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:20px 0}
.card{border:1px solid var(--line);border-radius:14px;padding:16px;background:var(--bg-2);color:var(--ink)}
.card:hover{border-color:var(--accent-line);text-decoration:none}
.card b{display:block;font-size:1.1rem;margin-bottom:4px}.card span{color:var(--ink-2);font-size:.92rem}
footer{max-width:860px;margin:0 auto;padding:20px 16px;color:var(--ink-3);font-size:.85rem;border-top:1px solid var(--line)}
.katex{font-size:1.02em}.katex-display{margin:.4em 0;overflow-x:auto;overflow-y:hidden}
.muted{color:var(--ink-3);font-size:.85rem}
.sig{color:var(--sig)}.eps{color:var(--eps)}
@media (max-width:600px){h1{font-size:1.6rem}h2{font-size:1.3rem}.brand small{display:none}nav.links a{padding:5px 8px;font-size:13px}}

p,li,td{overflow-wrap:break-word}
/* couches pédagogiques */
.box.plain{border-left-color:var(--ink-3)}.box.read{border-left-color:var(--sig)}
.box.plain dl,.box.read dl{margin:4px 0}.box dt{font-weight:600;margin-top:6px}.box dd{margin:0 0 0 0;color:var(--ink-2)}
details.why{border:1px solid var(--line);border-radius:10px;margin:12px 0;background:var(--bg-2)}
details.why summary{cursor:pointer;padding:8px 14px;font-weight:600;color:var(--accent);list-style:none}
details.why summary::before{content:"▸ ";}details.why[open] summary::before{content:"▾ "}
details.why summary::-webkit-details-marker{display:none}
details.why > div{padding:0 14px 10px;border-top:1px solid var(--line)}
.steps{counter-reset:s;margin:8px 0;padding:0;list-style:none}
.steps li{counter-increment:s;position:relative;padding:6px 0 6px 34px;border-bottom:1px dashed var(--line)}
.steps li:last-child{border:0}
.steps li::before{content:counter(s);position:absolute;left:0;top:6px;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:.8rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.steps li b{font-family:var(--mono);font-weight:600}
.check{list-style:none;padding:0;margin:6px 0}.check li{padding:3px 0 3px 26px;position:relative}.check li::before{content:"☐";position:absolute;left:4px;color:var(--accent-2)}