:root{--bg:#FBFCFD;--surface:#FFFFFF;--ink:#172131;--muted:#5B6178;--line:#E4E8EE;--pine:#262F6B;--pine-soft:#E8EAF4;--accent:#1E73AB;--swiss:#D63B35;--todo:#FFF4D6;--todo-ink:#7A5A00;
--display:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;--body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:16px/1.65 var(--body);margin:0}
.wrap{max-width:820px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
header{background:var(--surface);border-bottom:1px solid var(--line)}
header .wrap{display:flex;justify-content:space-between;align-items:center;height:62px;gap:12px;max-width:1180px}
.logo{display:flex;align-items:center;gap:10px;font:800 1.08rem var(--display);text-decoration:none;color:var(--ink);white-space:nowrap}
.logo img{display:block;height:28px;width:auto}
.back{font-weight:600;font-size:.92rem;color:var(--pine);text-decoration:none;white-space:nowrap}
main{padding-block:48px 72px}
h1,h2,h3{font-family:var(--display);line-height:1.15;text-wrap:balance;margin:0}
h1{font-size:clamp(2rem,5vw,2.7rem);font-weight:800}
h2{font-size:1.3rem;font-weight:700;margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
h3{font-size:1.02rem;font-weight:700;margin-top:20px}
p,ul,dl{margin:12px 0 0}
ul{padding-left:1.2em}
li{margin-top:6px}
.meta{color:var(--muted);margin-top:10px;font-size:.92rem}
.intro{font-size:1.08rem;color:var(--muted)}
.todo{background:var(--todo);color:var(--todo-ink);padding:1px 6px;border-radius:4px;font-weight:600;font-size:.92em}
.box{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin-top:16px}
.box dl{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:8px 16px;margin:0}
.box dt{color:var(--muted)}
.box dd{margin:0;min-width:0}
@media (max-width:540px){.box dl{grid-template-columns:1fr;gap:2px}.box dd{margin-bottom:10px}}
.toc{margin-top:24px;columns:2;column-gap:28px;font-size:.92rem;padding-left:1.2em}
@media (max-width:540px){.toc{columns:1}}
.toc a,main a{color:var(--pine)}
footer{border-top:1px solid var(--line);padding-block:24px;color:var(--muted);font-size:.86rem}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;max-width:1180px}
footer a{color:inherit}
/* Choix de la langue : menu avec drapeaux (<details class="langs">), fermé au clic à côté par js/langues.js. */
.langs{position:relative}
.langs summary{list-style:none;display:inline-flex;align-items:center;gap:7px;padding:6px 10px 6px 8px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--pine);font:600 .85rem var(--body);cursor:pointer;user-select:none;transition:border-color .15s}
.langs summary::-webkit-details-marker{display:none}
.langs summary:hover{border-color:color-mix(in srgb,var(--pine) 35%,var(--line))}
.langs summary:focus-visible{outline:none;box-shadow:0 0 0 3px var(--pine-soft)}
.langs img{display:block;width:20px;height:14px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(23,33,49,.12)}
.langs .chev{color:var(--muted);transition:transform .15s}
.langs[open] .chev{transform:rotate(180deg)}
.langs ul{position:absolute;right:0;top:calc(100% + 8px);z-index:40;min-width:190px;margin:0;padding:6px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 44px -18px rgba(23,33,49,.35)}
.langs li{margin:0}
.langs a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;color:var(--ink);text-decoration:none;font:500 .92rem var(--body)}
.langs a:hover,.langs a:focus-visible{background:var(--pine-soft);outline:none}
.langs a[aria-current]{font-weight:600;color:var(--pine)}
.langs a span{flex:1}
.langs .coche{color:var(--pine)}
.entete-droite{display:flex;align-items:center;gap:14px}