:root{color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#09090b;color:#e4e4e7;font:16px/1.7 "IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
a{color:#f59e0b;text-underline-offset:3px}
a:hover{color:#fbbf24}
:focus-visible{outline:3px solid #f59e0b;outline-offset:2px}
.skip{position:absolute;left:8px;top:-80px;z-index:10;padding:12px 16px;background:#f59e0b;color:#09090b;font-weight:700;text-decoration:none}
.skip:focus{top:8px}
header{max-width:920px;margin:0 auto;padding:20px 24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;border-bottom:2px solid #27272a}
.brand{font:400 14px/1.4 "Press Start 2P",ui-monospace,monospace;color:#fafafa;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.brand span{color:#f59e0b}
nav{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px}
nav a{min-height:44px;display:inline-flex;align-items:center;color:#d4d4d8;text-decoration:none;border-bottom:2px solid transparent}
nav a:hover{color:#fafafa;border-color:#52525b}
nav a[aria-current=page]{color:#fafafa;border-color:#f59e0b}
nav span{display:contents}
.langs{display:flex;border:2px solid #fafafa}
.langs button{min-width:44px;min-height:44px;border:0;background:#09090b;color:#fafafa;font:600 12px monospace;cursor:pointer}
.langs button[aria-pressed=true]{background:#f59e0b;color:#09090b}
main{max-width:760px;margin:0 auto;padding:32px 24px 64px;outline:none}
h1{margin:0 0 8px;font:400 clamp(18px,3vw,26px)/1.5 "Press Start 2P",ui-monospace,monospace;color:#fafafa}
h2{margin:36px 0 8px;font-size:18px;color:#fafafa}
p,li{color:#d4d4d8}
li{margin:6px 0}
.meta{color:#a1a1aa;font-size:14px;margin:0 0 24px}
.todo{background:#f59e0b;color:#09090b;padding:0 6px;font-weight:700;border-radius:2px;white-space:normal}
footer{max-width:920px;margin:0 auto;padding:24px;border-top:2px solid #27272a;color:#a1a1aa;font-size:14px}
[lang=fr] [lang=en],[lang=en] [lang=fr]{display:none}
html[lang=fr] article[lang=en],html[lang=fr] nav span[lang=en]{display:none}
html[lang=en] article[lang=fr],html[lang=en] nav span[lang=fr]{display:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{body{background:#fff;color:#000}a{color:#000}.langs,.skip,nav{display:none}.todo{background:none;color:#000;border:1px solid #000}}