:root{
--ink:oklch(22% 0.02 250);--ink2:oklch(45% 0.02 250);--bg:oklch(99% 0.003 250);--surf:oklch(96.5% 0.006 250);
--rule:oklch(88% 0.01 250);--acc:oklch(45% 0.11 230);--sun:oklch(86% 0.16 95);--warn:oklch(55% 0.15 60);
--serif:Charter,"Bitstream Charter","Sitka Text",Cambria,Georgia,serif;
--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--r1:2px;--r2:6px;--w:42rem}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.6 var(--serif)}
a{color:var(--acc);text-underline-offset:.15em}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
h1,h2,h3,.ui,table,label,button,input,select,nav,footer,.meta{font-family:var(--sans)}
h1{font-size:2.25rem;line-height:1.15;margin:.2em 0 .4em;letter-spacing:-.01em}
h2{font-size:1.55rem;line-height:1.25;margin:2.2em 0 .5em}
h3{font-size:1.2rem;margin:1.6em 0 .4em}
p,ul,ol{margin:0 0 1em}
.wrap{max-width:var(--w);margin:0 auto;padding:0 1.1rem}
.wide{max-width:60rem;margin:0 auto;padding:0 1.1rem}
header.site{border-bottom:1px solid var(--rule)}
header.site .hd{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;align-items:baseline;padding-top:.9rem;padding-bottom:.9rem}
.logo{font:700 1.05rem var(--sans);color:var(--ink);text-decoration:none;letter-spacing:.01em}
.logo span{background:linear-gradient(transparent 60%,var(--sun) 60%)}
nav{display:flex;flex-wrap:wrap;gap:0 1rem}
nav a{display:inline-flex;align-items:center;min-height:44px;font-size:.95rem;color:var(--ink2);text-decoration:none}
.skip{position:absolute;left:1rem;top:0;transform:translateY(-150%);background:var(--bg);padding:.5rem 1rem;z-index:10}
.skip:focus{transform:translateY(0)}
.guides{margin:1rem 0 2rem}
.guides dt{font:600 1.1rem/1.4 var(--sans);margin-top:1rem}
.guides dd{margin:.3rem 0 1rem;color:var(--ink2)}
nav a:hover{color:var(--acc);text-decoration:underline}
main{padding:1.5rem 0 3rem}
.chapo{font-size:1.15rem;color:var(--ink2)}
.meta{font-size:.85rem;color:var(--ink2);margin-bottom:1.5rem}
.reponse{border-left:4px solid var(--sun);background:var(--surf);padding:1rem 1.2rem;border-radius:0 var(--r2) var(--r2) 0;margin:1.5rem 0}
.reponse p:last-child{margin:0}
table{border-collapse:collapse;width:100%;font-size:.92rem;font-variant-numeric:tabular-nums;margin:1rem 0 .5rem}
th,td{padding:.45rem .5rem;border-bottom:1px solid var(--rule);text-align:right}
th:first-child,td:first-child{text-align:left}
thead th{font-weight:600;border-bottom:2px solid var(--ink);vertical-align:bottom}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tablewrap:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.legende{font:.85rem/1.5 var(--sans);color:var(--ink2)}
.calc{border:1px solid var(--rule);border-radius:var(--r2);padding:1.2rem;margin:1.5rem 0;font-family:var(--sans);font-size:1rem}
.calc h3{margin-top:0}
.calc .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.9rem}
.calc label{display:block;font-size:.88rem;color:var(--ink2);margin-bottom:.25rem}
.calc input,.calc select{width:100%;font:inherit;padding:.55rem .6rem;border:1px solid var(--ink2);border-radius:var(--r1);background:#fff;color:var(--ink);min-height:44px}
.calc output{display:block;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--rule)}
.calc .big{font-size:1.9rem;font-weight:700;font-variant-numeric:tabular-nums}
.calc .err{color:var(--warn)}
.calc details{margin:1rem 0}
.calc summary{cursor:pointer;min-height:44px;padding:.5rem 0;font-weight:600}
.calc summary:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.calc button[type=submit]{background:var(--acc);color:var(--bg);border-color:var(--acc)}
.calc output p:last-child{margin-bottom:0}
.calc button{font:inherit;min-height:44px;padding:.4rem .9rem;border:1px solid var(--ink2);background:var(--surf);border-radius:var(--r1);cursor:pointer}
.appareil{display:grid;grid-template-columns:1fr 7rem 6rem 2.8rem;gap:.5rem;align-items:end;margin-bottom:.5rem}
.attention{border:1px solid var(--warn);border-radius:var(--r2);padding:.8rem 1rem;font-size:.95rem}
.bars{font-family:var(--sans);font-size:.9rem;margin:1.2rem 0}
.bar{display:grid;grid-template-columns:8.5rem 1fr 3.5rem;gap:.6rem;align-items:center;margin:.35rem 0;line-height:1.15}
.bar i{display:block;height:.9rem;background:var(--acc);border-radius:1px}
.bar i.b{background:var(--sun)}
.bar b{font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.sources{font-size:.9rem}
.sources li{margin-bottom:.4em}
.partenaire{font:.8rem var(--sans);color:var(--ink2)}
footer.site{border-top:1px solid var(--rule);padding:1.5rem 0 2.5rem;font-size:.88rem;color:var(--ink2)}
footer.site a{color:var(--ink2);margin-right:1rem}
@media (max-width:30rem){body{font-size:17px}h1{font-size:1.8rem}.appareil{grid-template-columns:1fr 1fr}.bar{grid-template-columns:6.5rem 1fr 3rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
