@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url("/polices/barlow-condensed-600-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url("/polices/barlow-condensed-600-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("/polices/barlow-condensed-700-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("/polices/barlow-condensed-700-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/polices/ibm-plex-mono-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/polices/ibm-plex-mono-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/polices/ibm-plex-mono-500-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/polices/ibm-plex-mono-500-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400;font-display:swap;src:url("/polices/source-serif-4-400-italique-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400;font-display:swap;src:url("/polices/source-serif-4-400-italique-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 600;font-display:swap;src:url("/polices/source-serif-4-variable-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 600;font-display:swap;src:url("/polices/source-serif-4-variable-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Biobâtir — l'atelier du charpentier : papier kraft, encre d'écorce, craie rouge du cordeau.
   Identité approuvée par David le 2026-09-14 (maquette « bois et écologie », Williams : contraste,
   répétition, alignement, proximité). LA CRAIE EST LE SEUL ACCENT, comme les cotes des feuilles. */
:root{--kraft:#f2ecdf;--kraft-2:#e7dcc8;--aubier:#fbf8f1;--encre:#1d2621;--encre-2:#4a544d;
--ecorce:#5b3a24;--ecorce-2:#44291a;--bouton:#b23a26;--bouton-2:#8c2c1c;--craie:#b23a26;--mousse:#4f6b45;
--titre:"Barlow Condensed","Arial Narrow","Roboto Condensed",sans-serif;
--texte:"Source Serif 4","Iowan Old Style","Palatino Linotype",Georgia,serif;
--mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
/* Les anciens noms, repris par la fiche du modèle et le concepteur : ils pointent sur la palette. */
--gris:var(--encre-2);--papier:var(--kraft);--trait:var(--kraft-2);--rouge:var(--craie);--bois:#e7dcc4;
--largeur:44rem;--gouttiere:clamp(1rem,4vw,2rem)}
*{box-sizing:border-box}
html{background:var(--kraft)}
body{margin:0;background:var(--kraft);color:var(--encre);font:400 1.0625rem/1.62 var(--texte);
-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto}
a{color:var(--encre);text-decoration:none;border-bottom:2px solid var(--craie)}
a:hover{color:var(--craie)}
:focus-visible{outline:3px solid var(--craie);outline-offset:2px}
.cadre{width:min(72rem,100% - 2*var(--gouttiere));margin-inline:auto}
/* --- En-tête : logo et menu sur la même grille que le contenu --- */
header{border-bottom:1px solid var(--kraft-2)}
.entete{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:5.5rem;
flex-wrap:wrap;padding-block:.5rem}
.marque{display:flex;align-items:center;gap:1rem;line-height:0;border:0;color:var(--encre)}
.marque:hover{color:var(--encre)}
.slogan{font:600 1.15rem/1.15 var(--titre);letter-spacing:.06em;text-transform:uppercase;color:var(--encre-2);
max-width:15rem;padding-left:1rem;border-left:2px solid var(--craie)}
@media (max-width:40rem){.slogan{font-size:.95rem;max-width:11rem}}
/* Les projets de l'accueil : une carte par projet, son bouton en bas ; « Bientôt » est inerte. */
.projets .cadre{padding-block:3.6rem 4rem}
.projets h2{margin-top:0}
.carte.projet{display:flex;flex-direction:column}
.carte.projet .projet-bouton{margin:auto 0 0;padding-top:1.1rem}
.carte.a-venir{border-top-color:var(--encre-2)}
.carte.a-venir:hover{border-top-color:var(--encre-2)}
.bouton.inerte{background:transparent;color:var(--encre-2);box-shadow:inset 0 0 0 2px var(--kraft-2);cursor:default}
.bouton.inerte:hover{background:transparent;color:var(--encre-2)}
.infolettre .cadre{max-width:40rem;padding-block:1rem 3rem}
.logo{display:block;height:120px;width:auto}
nav{display:flex;gap:1.6rem;align-items:center;flex-wrap:wrap}
nav a{font:600 1rem/1 var(--titre);letter-spacing:.08em;text-transform:uppercase;border:0;color:var(--encre)}
nav a:hover{color:var(--craie)}
nav .langue{border:1.5px solid var(--encre);padding:.35rem .55rem;border-radius:3px}
/* --- Le contenu : une colonne de lecture ; `.plein` court d'un bord à l'autre --- */
main{padding-block:2.6rem 4rem}
main > :not(.plein){width:min(var(--largeur),100% - 2*var(--gouttiere));margin-inline:auto}
main:has(> .heros){padding-block:0}
h1,h2,h3{font-family:var(--titre);font-weight:700;letter-spacing:.005em;text-wrap:balance}
h1{font-size:clamp(2.3rem,1.2rem + 3.6vw,3.5rem);line-height:.98;margin:.2rem 0 1.4rem}
/* LE CORDEAU : un trait de craie claqué sous chaque grand titre. */
h1::after{content:"";display:block;width:min(100%,26rem);height:14px;margin-top:1rem;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 14' preserveAspectRatio='none'%3E%3Cpath d='M0,7.4 L120,6.9 L260,7.6 L400,6.8 L600,7.3' stroke='%23b23a26' stroke-width='2.6' fill='none' stroke-linecap='round'/%3E%3Cg fill='%23b23a26' opacity='.45'%3E%3Ccircle cx='38' cy='3' r='.9'/%3E%3Ccircle cx='170' cy='2.5' r='1'/%3E%3Ccircle cx='318' cy='3.2' r='.7'/%3E%3Ccircle cx='451' cy='11' r='.8'/%3E%3C/g%3E%3C/svg%3E") no-repeat left center/100% 14px}
h2{font-size:clamp(1.55rem,1.2rem + 1vw,2.1rem);line-height:1.05;margin:2.4rem 0 .7rem}
h3{font-size:1.3rem;line-height:1.1;margin:0 0 .4rem}
p{margin:0 0 1rem}
.chapeau{font-size:1.18rem;color:var(--encre-2);line-height:1.55}
.source{font-size:.88rem;color:var(--encre-2);border-top:1px solid var(--kraft-2);padding-top:.7rem}
.fine{font-size:.9rem;color:var(--encre-2)}
.etiquette{font:600 .85rem/1.2 var(--titre);letter-spacing:.12em;text-transform:uppercase;color:var(--encre-2);margin:0 0 .7rem}
/* --- L'estampille de scierie, la liste vérifiée --- */
.timbre{display:inline-flex;flex-wrap:wrap;gap:.2rem .6rem;align-items:center;border:2px solid var(--encre);
border-radius:6px;padding:.3rem .8rem;margin:0 0 1.2rem;font:600 .82rem/1.2 var(--titre);letter-spacing:.14em;
text-transform:uppercase;transform:rotate(-1.2deg)}
.timbre b{color:var(--craie)}
.exemple-entrees{margin:0 0 1.8rem;border:1px solid var(--kraft-2);border-radius:6px;background:var(--aubier);padding:.8rem 1rem}
.exemple-entrees dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.55rem .9rem;margin:0 0 .6rem}
.exemple-entrees dt{font:600 .8rem/1.2 var(--titre);letter-spacing:.02em;color:var(--encre-2)}
.exemple-entrees dd{margin:.2rem 0 0;padding:.3rem .5rem;border:1px solid var(--kraft-2);border-radius:4px;background:#fff;font:500 .95rem/1.2 var(--mono);color:var(--encre)}
.exemple-entrees .fine{margin:0}
.verifie{list-style:none;padding:0;margin:0 0 1.8rem;display:grid;gap:.45rem}
.verifie li{display:flex;gap:.65rem;align-items:baseline}
.verifie li::before{content:"";flex:0 0 14px;height:14px;border:2px solid var(--mousse);border-radius:50%;
background:radial-gradient(circle,var(--mousse) 0 3px,transparent 3.5px);transform:translateY(2px)}
/* --- Le héros de l'accueil --- */
.heros{position:relative;overflow:hidden}
.cernes{position:absolute;right:-13rem;top:-16rem;width:47rem;height:47rem;color:#d9cbb1;opacity:.6;pointer-events:none}
.heros-grille{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
gap:clamp(2rem,4vw,3.5rem);align-items:center;padding-block:3.4rem 4rem}
.heros h1{margin-top:0;font-size:clamp(2.3rem,1.2rem + 3vw,3.2rem)}
.heros .optin{margin:0;max-width:36rem}
/* Trois boutons sur une rangée sous le héros : gauche, centre (rouge), droite ; même hauteur (étirés), mêmes marges. */
.heros-boutons{grid-column:1/-1;display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:stretch;margin:0}
.heros-boutons .bouton{display:flex;align-items:center;justify-content:center;text-align:center;box-sizing:border-box}
.heros-boutons .bouton:first-child{justify-self:start}.heros-boutons .bouton:last-child{justify-self:end}
/* --- La feuille posée sur l'établi : le cadre coté, la feuille d'exemple --- */
.feuille{position:relative;display:block;background:#fff;border:1px solid var(--kraft-2);padding:.85rem;
box-shadow:0 1px 0 var(--kraft-2),0 18px 40px -24px rgba(29,38,33,.45);transform:rotate(.6deg)}
.feuille::after{content:"";position:absolute;right:-1px;bottom:-1px;width:3.6rem;height:3.6rem;
background:repeating-linear-gradient(45deg,var(--craie) 0 1.5px,transparent 1.5px 7px);opacity:.5;
clip-path:polygon(100% 0,100% 100%,0 100%)}
.feuille img{display:block;width:100%;height:auto}
.feuille:hover{transform:rotate(0)}
.exemple-cadre,.exemple-feuille{margin:0}
.exemple-feuille{margin:2rem 0}
.exemple-cadre figcaption,.exemple-feuille figcaption{font-size:.95rem;color:var(--encre-2);margin-top:1rem;line-height:1.55}
.vignette-feuille{width:100%;max-width:26rem;height:auto;border:1px solid var(--kraft-2);background:#fff}
/* --- Le formulaire : aubier, bordure d'écorce --- */
.optin{background:var(--aubier);border:1px solid var(--kraft-2);border-left:6px solid var(--ecorce);
border-radius:4px;padding:1.3rem 1.4rem;margin:2rem 0}
.optin h2{margin:0 0 .8rem;font-size:1.05rem;letter-spacing:.07em;text-transform:uppercase;line-height:1.2}
.capture{display:flex;flex-direction:column;gap:.75rem}
input[type=email],input[type=number],input[type=text],select,textarea{font:400 1.02rem/1.3 var(--texte);
padding:.72rem .8rem;border:1.5px solid #c9b99d;border-radius:3px;background:#fff;color:var(--encre);width:100%}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--craie);outline-offset:1px}
.consentement{display:flex;gap:.55rem;align-items:flex-start;font-size:.92rem;color:var(--encre-2);line-height:1.45}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--ecorce)}
button{font:700 1.02rem/1 var(--titre);letter-spacing:.08em;text-transform:uppercase;padding:.8rem 1.2rem;
border:0;border-radius:3px;background:var(--bouton);color:#fff;cursor:pointer;box-shadow:inset 0 -3px 0 var(--bouton-2)}
button:hover{background:var(--bouton-2)}
button:disabled{opacity:.7;cursor:progress}
/* LE BOUTON D'ENTRÉE porte une section de bille : on ouvre le concepteur comme on attaque une bille. */
.capture button{position:relative;align-self:flex-start;padding:.95rem 1.4rem .95rem 3.1rem;font-size:1.08rem}
.capture button::before{content:"";position:absolute;left:1rem;top:50%;width:1.35rem;height:1.35rem;
margin-top:-.675rem;border-radius:50%;background:radial-gradient(circle,#f2e2c4 0 16%,transparent 19% 34%,
#f2e2c4 37% 47%,transparent 50% 64%,#f2e2c4 67% 77%,transparent 80%);box-shadow:0 0 0 1.5px #f2e2c4}
.capture button:active{transform:translateY(1px);box-shadow:none}
.bouton{display:inline-block;font:700 1.02rem/1 var(--titre);letter-spacing:.08em;text-transform:uppercase;
padding:.85rem 1.25rem;border:0;border-radius:3px;background:var(--bouton);color:#fff;box-shadow:inset 0 -3px 0 var(--bouton-2)}
.bouton:hover{background:var(--bouton-2);color:#fff}
/* `.bouton` pose display:inline-block, qui ÉCRASE l'attribut hidden : un bouton caché s'affichait. */
.bouton[hidden]{display:none}
.bouton.contour{background:transparent;color:var(--encre);box-shadow:inset 0 0 0 2px var(--encre)}
.bouton.contour:hover{background:var(--encre);color:#fff}
.pro-boutons{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.6rem 0}
.piste{margin:0}
.piste-courriel{transform:rotate(.6deg)}
.piste-sujet{font:600 .95rem/1.3 var(--texte);margin:0 0 .6rem;padding-bottom:.6rem;border-bottom:1px solid var(--kraft-2)}
.piste pre{margin:0;white-space:pre-wrap;font:400 .8rem/1.5 var(--mono);color:var(--encre)}
.piste figcaption{font-size:.95rem;color:var(--encre-2);margin-top:1rem;line-height:1.55}
.pro-etapes{padding-left:1.3rem}
.pro-heros{position:relative;padding-block:3.4rem 4rem}
.pro-choix{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1.2rem;margin-top:2rem}
.choix{background:var(--aubier);border:1px solid var(--kraft-2);border-top:6px solid var(--ecorce);border-radius:4px;padding:1.3rem 1.4rem .6rem}
#choix-contracteur{border-top-color:var(--encre)}
.choix .etiquette{margin-bottom:.3rem}
.choix-prix{font:700 2.4rem/1 var(--titre);margin:0 0 1.1rem}
.choix-prix span{font:400 1rem/1 var(--texte);color:var(--encre-2)}
.choix .pro-boutons{margin:1.2rem 0 .8rem}
.pro-piste{max-width:44rem;margin:2.4rem 0 0}
.pro-etapes li{margin-bottom:.5rem}
/* --- Les sujets : bande kraft à fin veinage, cartes à bordure d'encre --- */
.bande{background-color:var(--kraft-2);background-image:repeating-linear-gradient(90deg,rgba(91,58,36,.05) 0 1px,transparent 1px 9px)}
.sujets .cadre{padding-block:3.6rem 4rem}
.sujets h2{margin-top:0}
.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.1rem;margin-top:2rem}
.carte{display:block;background:var(--aubier);border:0;border-top:5px solid var(--encre);padding:1.2rem 1.15rem 1.35rem;color:inherit}
.carte:hover{border-top-color:var(--craie);color:inherit}
.carte .formule{display:block;font:500 .82rem/1 var(--mono);color:var(--craie);letter-spacing:.03em;margin-bottom:.7rem}
.carte h3{margin:0 0 .55rem}
.carte p{margin:0;color:var(--encre-2);font-size:.97rem}
.courriel{border-top:1px solid var(--kraft-2);padding-top:1.2rem;margin-top:1.6rem}
.courriel .meta{font:600 .8rem/1.2 var(--titre);color:var(--encre-2);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.2rem}
/* --- Le pied : encre, la mention ingénieur à filet de craie --- */
footer{background:var(--encre);color:#e9e3d6;font-size:.93rem}
.pied{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:2rem 3rem;padding-block:2.6rem 3rem}
.pied p{margin:0}
footer a{color:#fff;border-bottom-color:var(--craie)}
footer a:hover{color:#fff}
.identite-pied{font:600 1rem/1.5 var(--titre);letter-spacing:.06em}
.reserve{border-left:4px solid var(--craie);padding-left:1rem;color:#cfc8b8;line-height:1.55}
.reserve strong{display:block;font:700 .95rem/1.3 var(--titre);letter-spacing:.07em;color:#fff;margin-bottom:.35rem}
main .reserve{color:var(--encre-2)}
.remerciement ul{padding-left:1.1rem}
.remerciement li{margin-bottom:.5rem}
.erreur{color:var(--craie);font-size:.92rem;margin:.6rem 0 0}
/* --- Le concepteur : pleine largeur, un plan se regarde en grand --- */
main > .generateur{width:min(74rem,100% - 2*var(--gouttiere))}
main > .planche{width:min(60rem,100% - 2*var(--gouttiere))}
.parametres{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.9rem;
align-items:start;background:var(--aubier);border:1px solid var(--kraft-2);border-top:5px solid var(--encre);padding:1.2rem}
.parametres label{display:flex;flex-direction:column;gap:.3rem;font:600 .98rem/1.2 var(--titre);letter-spacing:.02em;color:var(--encre)}
/* LES CASES ALIGNÉES (David, 2026-09-16) : le titre du champ réserve deux lignes et se cale en bas ;
   l'aide sous la pente pend en dessous sans pousser les voisins. */
.parametres > label:not(.case){display:grid;grid-template-rows:minmax(2.4em,auto);align-content:start;align-items:end}
.parametres .fine{font-family:var(--texte);font-weight:400;letter-spacing:0}
.parametres .choix-cadre{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:.8rem;border:0;border-top:1px solid var(--kraft-2);margin:0;padding:.9rem 0 0}
.choix-cadre legend{font:700 1.1rem/1.2 var(--titre);padding:0 .4rem 0 0}
.parametres label[hidden],.parametres span[hidden]{display:none}
.parametres label.case > span:first-child{display:flex;gap:.45rem;align-items:center;color:var(--encre)}
.parametres button{grid-column:1/-1;justify-self:start}
.choix-cadre ul{margin:.2rem 0 0;padding-left:1rem;line-height:1.35}
.site{background:var(--aubier);border:1px solid var(--kraft-2);border-top:5px solid var(--encre);padding:1.2rem;margin-bottom:1rem}
.site h2{margin-top:0}
.site .ligne{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.9rem}
.site label{display:flex;flex-direction:column;gap:.3rem;font:600 .98rem/1.2 var(--titre);letter-spacing:.02em;color:var(--encre)}
.site label .fine{font-family:var(--texte);font-weight:400;letter-spacing:0}
.eclate{margin:1.2rem 0}
.planche{margin:2rem 0}
.croquis svg{width:100%;height:auto;border:1px solid var(--kraft-2);background:#fff}
.legende{columns:2 22rem;column-gap:2rem;padding-left:1.4rem}
.legende li{break-inside:avoid;margin-bottom:.6rem}
.notions dl{margin:0}
.notions dt{font-weight:700;margin-top:.6rem}
.notions dd{margin:.2rem 0 0}
.notions div:target{background:var(--aubier);outline:2px solid var(--craie);outline-offset:.4rem}
.legende li::marker{color:var(--craie);font-weight:700}
.vue{display:flex;gap:.7rem;align-items:center;justify-content:center;margin-top:1rem;flex-wrap:wrap}
.vue button{font-size:1.2rem;line-height:1;padding:.5rem .85rem}
.vue[hidden]{display:none}
.eclate svg{width:100%;height:auto;max-height:76vh;border:1px solid var(--kraft-2);background:#fff}
/* Les blocs de résultat n'existent pas tant qu'il n'y a pas de résultat. */
.bloc:empty,.eclate:empty{display:none}
.verdict{padding:.85rem 1rem;border-radius:3px;margin-top:1rem;font-weight:600}
.verdict.oui{background:#e9efe4;border-left:5px solid var(--mousse);color:#2f4229}
.verdict.non{background:#f6e7e2;border-left:5px solid var(--craie);color:var(--craie)}
.colonnes{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:1rem}
.bloc{background:var(--aubier);border:1px solid var(--kraft-2);padding:1rem;font-size:.93rem}
.bloc table{width:100%;border-collapse:collapse}
.bloc td{padding:.25rem 0;border-bottom:1px solid var(--kraft-2)}
.bloc td:last-child{text-align:right;color:var(--encre-2);white-space:nowrap;font-variant-numeric:tabular-nums}
#debit td:last-child{font:400 .86rem/1.4 var(--mono)}
.reserves{margin-top:1rem;border-left:4px solid var(--craie)}
.reserves li{margin-bottom:.45rem}
.achat{background:var(--aubier);border:1px solid var(--kraft-2);border-left:6px solid var(--ecorce);padding:1.3rem;margin-top:1.4rem}
.prix{font:700 1.5rem/1.1 var(--titre);margin:.4rem 0 .8rem}
.mentions{width:100%;border-collapse:collapse;margin-top:1rem}
.mentions th{text-align:left;vertical-align:top;width:12rem;padding:.7rem .9rem .7rem 0;
border-top:1px solid var(--kraft-2);font:700 1.02rem/1.2 var(--titre);letter-spacing:.02em}
.mentions th span{display:block;font:400 .78rem/1.4 var(--mono);color:var(--encre-2);margin-top:.2rem}
.mentions td{vertical-align:top;padding:.7rem 0;border-top:1px solid var(--kraft-2)}
.mentions tr.trou td{color:var(--craie);font-weight:600}
@media print{header,footer,nav{display:none}body,html{background:#fff}.feuille{transform:none;box-shadow:none}}
/* Le concepteur dans le cadre des mini maisons (`nu`) : la page autour est la sienne, le gabarit se fait discret. */
body.integre{background:transparent}
body.integre main{padding-block:.6rem 1.2rem}
body.integre .pied{padding-block:.8rem}
body.nu footer{display:none}
/* Dans la page des mini maisons, la boîte « Montre-moi ton cadre » est retirée (David, 2026-10-06, nuit) : le bouton
   « Parler de mon projet » de la page la remplace. Elle reste sur /structure. */
body.nu #achat{display:none!important}
body.nu main{padding-block:0 .6rem}
/* La démonstration pour les entrepreneurs : un site fictif dans une fenêtre de navigateur. */
.demo-avis{border-left:4px solid var(--craie);padding:.6rem .9rem;background:var(--kraft-2)}
.demo-fenetre{border:1px solid #b9b3a8;border-radius:10px;overflow:hidden;background:#fff;margin-block:1.4rem 2.4rem;box-shadow:0 6px 24px rgba(0,0,0,.08)}
.demo-barre{display:flex;gap:.4rem;align-items:center;padding:.5rem .8rem;background:#e9e6e0;font:400 .8rem/1 var(--mono);color:#555}
.demo-barre i{width:.7rem;height:.7rem;border-radius:50%;background:#c9c3b8}
.demo-barre span{margin-left:.8rem;background:#fff;padding:.3rem .7rem;border-radius:4px;flex:1;max-width:28rem}
.demo-site{padding:1rem clamp(.8rem,3vw,2rem) 1.5rem;color:#22303a;font-family:system-ui,sans-serif}
.demo-entete{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;align-items:center;border-bottom:3px solid #2f5d50;padding-bottom:.6rem}
.demo-entete strong{font-size:1.25rem;color:#2f5d50}
.demo-entete nav{display:flex;flex-wrap:wrap;gap:1rem;font-size:.9rem}
.demo-slogan{color:#6a7780;font-size:.9rem}
.demo-site h2{color:#2f5d50;font-family:system-ui,sans-serif;text-transform:none;letter-spacing:0}
.demo-fourni{font-size:.8rem;color:#6a7780}
.demo-code{overflow-x:auto;background:#1f2326;color:#e8e4dc;padding:1rem;border-radius:6px;font:400 .8rem/1.5 var(--mono);white-space:pre}
/* --- L'avis après l'essai du concepteur, et les avis publiés sur l'accueil (2026-09-17) --- */
.etoiles-lues{color:#c9892a;font-size:2rem;letter-spacing:.08em;line-height:1;margin:0 0 .5rem}
.avis-publics .cadre{padding-block:3.2rem 3.4rem}
.avis-publics h2{margin-top:0}
.avis{margin:0;background:var(--aubier);border-top:5px solid var(--ecorce);padding:1.1rem 1.15rem 1.2rem}
.avis .etoiles-lues{font-size:1.25rem;margin-bottom:.6rem}
.avis blockquote{margin:0 0 .8rem;font-size:1rem;line-height:1.55}
.avis figcaption{font:600 .95rem/1.3 var(--titre);letter-spacing:.04em;color:var(--encre-2)}
.achat-verifie{color:var(--mousse);white-space:nowrap}
.achat-verifie::before{content:"✓ "}
/* --- Le sondage et les commentaires de la squeeze (2026-09-20) --- */
.retours .cadre{padding-block:3.2rem 3.4rem}
.retours h2{margin-top:0}
.retours-grille{display:grid;gap:2.6rem}
@media(min-width:56rem){.retours-grille{grid-template-columns:1fr 1fr;gap:3rem}
.retours-grille.retours-seule{grid-template-columns:minmax(0,34rem)}}
.sondage-q{border:0;padding:0;margin:0 0 1.3rem;display:grid;gap:.4rem}
.sondage-q legend{font:600 1rem/1.3 var(--titre);letter-spacing:.03em;margin-bottom:.45rem}
.sondage-q label{display:flex;gap:.55rem;align-items:baseline;font-size:.97rem;line-height:1.4;cursor:pointer}
.sondage-merci{background:var(--aubier);border-left:6px solid var(--mousse);padding:.8rem .95rem;font-weight:600}
.retours-publics{margin-top:3rem;border-top:1px solid var(--kraft-2);padding-top:2.2rem}
.commentaire{margin:0;background:var(--aubier);border-top:5px solid var(--ecorce);padding:1.1rem 1.15rem 1.2rem}
.commentaire blockquote{margin:0 0 .8rem;font-size:1rem;line-height:1.55}
.commentaire figcaption{font:600 .95rem/1.3 var(--titre);letter-spacing:.04em;color:var(--encre-2)}
/* --- L'offre d'ouverture (2026-09-17) : la craie, seul accent, pour le rabais --- */
.ouverture-fenetre{width:min(30rem,100% - 2rem);border:1px solid var(--kraft-2);border-top:6px solid var(--craie);border-radius:6px;
background:var(--aubier);color:var(--encre);padding:1.4rem 1.5rem 1rem;text-align:center}
.ouverture-fenetre::backdrop{background:rgba(29,38,33,.55)}
.ouverture-fenetre [hidden]{display:none!important}
.ouverture-fenetre .etiquette{color:var(--craie);margin-bottom:.4rem}
.ouverture-fenetre h2{margin:0 0 .7rem;font-size:clamp(1.8rem,1.4rem + 1.4vw,2.4rem)}
.ouverture-prix{font:700 1.5rem/1.2 var(--titre);margin:0 0 .3rem}
.ouverture-prix s{color:var(--encre-2);font-weight:500;margin-left:.4rem}
.ouverture-code{display:flex;justify-content:center;align-items:center;gap:.6rem;flex-wrap:wrap;margin:1rem 0 .4rem}
.ouverture-code b{font:600 1.35rem/1 var(--mono);letter-spacing:.12em;border:2px dashed var(--craie);border-radius:4px;padding:.55rem .9rem;color:var(--craie)}
.ouverture-jauge{height:10px;background:var(--kraft-2);border-radius:99px;overflow:hidden;margin:1rem 0 .4rem}
.ouverture-jauge i{display:block;height:100%;background:var(--craie);width:0}
.ouverture-restants{font:600 1rem/1.3 var(--titre);letter-spacing:.04em;margin:0 0 .3rem}
.ouverture-fenetre .fine{margin:0 0 .9rem}
.ouverture-bandeau{margin:0 0 1rem;border:1px solid var(--kraft-2);border-left:6px solid var(--craie);background:var(--aubier);padding:.7rem .9rem;border-radius:4px}
.ouverture-bandeau p{margin:0}
.ouverture-bandeau .ouverture-jauge{margin:.6rem 0 .5rem}
.ouverture-boutons{justify-content:center}
.ouverture-boni{text-align:left;margin:.8rem 0}
.vente-suspendue{background:var(--aubier);border:1px solid var(--kraft-2);border-left:6px solid var(--craie);padding:.7rem .9rem;border-radius:4px;font-weight:600}
.limite{border-left:4px solid var(--ecorce);padding-left:.8rem;color:var(--encre-2);font-size:.95rem}
.garantie{background:var(--aubier);border:1px solid var(--kraft-2);border-left:6px solid var(--mousse);padding:.7rem .9rem;border-radius:4px}
.contracteur-nudge{border-top:1px solid var(--kraft-2);padding-top:.6rem}
.echantillon{margin:1.4rem 0}
.echantillon-feuille{background:#fff;border:1px solid var(--kraft-2);overflow:auto;max-height:80vh}
.echantillon-feuille svg{display:block;width:100%;height:auto}
.compteur{font:600 1rem/1.3 var(--titre);letter-spacing:.04em;color:var(--mousse);margin:-.6rem 0 1rem}
.raison{margin:-.3rem 0 .7rem}
.questions-achat form{display:grid;gap:.8rem;max-width:36rem}
.questions-achat label:not(.consentement){display:grid;gap:.3rem;font:600 .95rem/1.2 var(--titre)}
.questions-achat fieldset{border:0;padding:0;margin:0;display:grid;gap:.3rem}
.questions-achat legend{font:600 .95rem/1.2 var(--titre);margin-bottom:.3rem}
.recommande{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.recommande code{font:500 .9rem/1.3 var(--mono);background:var(--aubier);border:1px solid var(--kraft-2);padding:.4rem .6rem;word-break:break-all}
button.petit{padding:.5rem .8rem;font-size:.9rem}
.code-promo{margin:0 0 1rem}
.code-promo summary{cursor:pointer;font:600 .95rem/1.4 var(--titre);letter-spacing:.03em;color:var(--encre-2)}
.code-promo label{display:grid;gap:.3rem;max-width:18rem;margin-top:.5rem;font:600 .9rem/1.2 var(--titre)}
.code-promo input{text-transform:uppercase;font-family:var(--mono);letter-spacing:.08em}
.code-promo .fine{margin:.4rem 0 0;color:var(--mousse)}
/* Squeeze page : une seule chose à faire, et rien pour en sortir. */
body.squeeze .entete{min-height:4.8rem;width:min(var(--largeur),100% - 2*var(--gouttiere))}
body.squeeze .logo{height:104px}
body.squeeze .optin{border-color:var(--kraft-2);border-left-color:var(--ecorce)}
@media (max-width:54rem){
  .heros-grille{grid-template-columns:1fr;padding-block:2.2rem 3rem}
  .heros-boutons{grid-template-columns:1fr}.heros-boutons .bouton{justify-self:stretch!important}
  .cernes{width:32rem;height:32rem;right:-15rem;top:-12rem}
  .pied{grid-template-columns:1fr}
}
@media (max-width:36rem){
  .logo{height:84px}
  .entete{min-height:4.4rem}
  nav{gap:1rem}
  nav a:not(.langue){font-size:.92rem}
  main{padding-block:1.8rem 3rem}
  .capture button{align-self:stretch}
  .mentions th{width:auto;display:block;border-top:1px solid var(--kraft-2);padding-bottom:0}
  .mentions td{display:block;border-top:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.feuille,.timbre{transform:none}}

/* La neige de la ville choisie, grisée (2026-09-13). */
input.grise,input[readonly]{background:#ece9e1;color:var(--gris);cursor:not-allowed}
/* La simulation jusqu'à la rupture (2026-09-13). */
.eclate.tourne{cursor:grabbing}
.eclate svg{cursor:grab}
.simulation{background:#fff;border:1px solid var(--trait);border-radius:5px;padding:1.1rem;margin:1.2rem 0}
.simulation h2{margin-top:0}
.sim-image svg{width:100%;height:auto;max-height:70vh;display:block;border:1px solid var(--trait);border-radius:4px}
.sim-commandes{display:flex;gap:.8rem;align-items:center;margin:.7rem 0}
.sim-commandes input[type=range]{flex:1;accent-color:var(--rouge)}
.sim-commandes button{min-width:3rem}
.sim-lecture{font-weight:600;margin:.2rem 0 .6rem}
.sim-journal{padding-left:1.2rem;margin:.4rem 0 .8rem;color:var(--gris)}
.sim-journal li{margin-bottom:.3rem}
.sim-journal li.passe{color:var(--encre)}
.sim-journal li.passe.rupture,.sim-journal li.passe.effondrement{color:var(--rouge);font-weight:600}
.sim-avertissement{border-left:2px solid var(--rouge);padding-left:.7rem}

/* LA FICHE DU MODÈLE (2026-09-13) — pleine largeur : le texte suit l'écran, les dessins plafonnent
   pour rester lisibles. Préfixe fm- : aucune collision avec les classes du concepteur. */
main > .fiche-modele{width:min(110rem,100% - 2*var(--gouttiere))}
.fiche-modele{--coupe:#c4a676;--cle:#8c5a2b;--acier:#2a5f9e;--papier-dessin:#fbf8ef;
display:grid;gap:3rem;max-width:110rem;margin:0 auto}
.fm-tete{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,21rem);gap:2rem;align-items:end;
border-bottom:2px solid var(--encre);padding-bottom:1.5rem}
.fm-surtitre{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gris);margin:0 0 .4rem}
.fiche-modele h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;margin:0 0 .3rem}
.fm-sous-titre{font-size:1.25rem;margin:0 0 .9rem}
.fm-chapeau{margin:0}
.fm-definition{margin:0 0 1rem;padding:.55rem .8rem;border-left:3px solid var(--craie);background:var(--aubier);font-size:.97rem;max-width:62ch}
.fm-definition a{white-space:nowrap}
.fm-chapeau em{font-style:normal;font-weight:700}
.fm-cartouche{display:grid;grid-template-columns:auto 1fr;margin:0;border:1.5px solid var(--encre);
background:#fff;font-size:.88rem}
.fm-cartouche dt,.fm-cartouche dd{margin:0;padding:.42rem .65rem;border-bottom:1px solid var(--trait)}
.fm-cartouche dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gris);
border-right:1px solid var(--trait);line-height:1.9}
.fm-cartouche .fm-statut{grid-column:1/-1;border-bottom:0;background:var(--rouge);color:#fff;font-weight:700}
.fm-section{display:grid;gap:1.1rem}
.fm-section h2{font-size:1.7rem;margin:0}
.fm-section h3{font-size:1.1rem;margin:0;display:flex;gap:.6rem;align-items:baseline;flex-wrap:wrap}
.fm-intro,.fm-note{color:var(--gris);margin:0}
.fm-note{font-size:.88rem}
.fiche-modele figure{margin:0;display:grid;gap:.6rem}
.fiche-modele figcaption{font-size:.92rem;color:var(--gris)}
.fiche-modele figcaption b{color:var(--encre)}
.fm-plate{background:var(--papier-dessin);border:1px solid var(--trait);border-radius:5px;overflow-x:auto}
.fm-dwg{display:block;width:100%;height:auto;margin:0 auto}
.fm-large .fm-dwg{min-width:720px;max-width:78rem}
.fm-moyen .fm-dwg{min-width:560px;max-width:78rem}
.fm-paire{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
.fm-paire .fm-dwg{min-width:400px;max-width:48rem}
.fm-etiquette{font-size:.7rem;text-transform:uppercase;letter-spacing:.07em;padding:.15rem .4rem;
border:1px solid currentColor;border-radius:3px;font-weight:600}
.fm-non{color:var(--rouge)}
.fm-oui{color:var(--acier)}
.fm-dwg text{font-family:"Arial Narrow","Roboto Condensed","Helvetica Neue",Arial,sans-serif}
.fm-lbl{fill:var(--encre);font-size:13.5px}
.fm-tiny{fill:var(--gris);font-size:12px}
.fm-flbl{fill:var(--rouge);font-size:13.5px;font-weight:700}
.fm-dim{fill:var(--gris);font-size:12px}
.fm-con{fill:#fff;font-size:13px;font-weight:700}
.fm-wood{fill:var(--bois);stroke:var(--encre);stroke-width:1.2;stroke-linejoin:round}
.fm-sect{fill:var(--coupe);stroke:var(--encre);stroke-width:1.2}
.fm-cle{fill:var(--cle);stroke:var(--encre);stroke-width:1}
.fm-coin{stroke:#f3e6cc;stroke-width:1.2}
.fm-tige{stroke:var(--acier);stroke-width:3;stroke-dasharray:7 4}
.fm-appui{stroke:var(--encre);stroke-width:2.6}
.fm-acier{fill:var(--acier)}
.fm-cheville{stroke:var(--cle);stroke-width:2.4;stroke-dasharray:6 3}
.fm-hid{fill:none;stroke:var(--encre);stroke-width:.9;stroke-dasharray:3 2.5}
.fm-hidl{stroke:var(--gris);stroke-width:1.2;stroke-dasharray:8 5}
.fm-opt{fill:none;stroke:var(--gris);stroke-width:1.1;stroke-dasharray:7 5}
.fm-peg{fill:#fff;stroke:var(--encre);stroke-width:1}
.fm-paille{fill:url(#fm-h-paille);stroke:var(--gris);stroke-width:.8}
.fm-beton{fill:url(#fm-h-beton);stroke:var(--gris);stroke-width:.8}
.fm-ground{stroke:var(--encre);stroke-width:1.6}
.fm-plat{fill:var(--bois);stroke:var(--encre);stroke-width:.7}
.fm-pan{fill:#fff;stroke:var(--encre);stroke-width:.7}
.fm-steel{stroke:var(--acier);stroke-width:2.2;fill:none}
.fm-force{stroke:var(--rouge);stroke-width:2;fill:none}
.fm-fa{fill:var(--rouge)}
.fm-fail{fill:none;stroke:var(--rouge);stroke-width:1.6;stroke-dasharray:5 3}
.fm-shear{fill:url(#fm-h-force);stroke:none}
.fm-leader{stroke:var(--gris);stroke-width:.9}
.fm-dot,.fm-co{fill:var(--encre)}
.fm-slope{fill:none;stroke:var(--gris);stroke-width:1}
.fm-dimline{stroke:var(--gris);stroke-width:1}
.fm-ext{stroke:var(--gris);stroke-width:.6;stroke-dasharray:2 3}
.fm-joint{fill:none;stroke:var(--encre);stroke-width:1.4}
.fm-plank{stroke:var(--coupe);stroke-width:1}
.fm-panel{fill:#fff;fill-opacity:.88;stroke:var(--gris);stroke-width:1}
.fm-ghost{fill:none;stroke:var(--trait);stroke-width:1}
.fm-legende{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;list-style:none;margin:0;padding:0;font-size:.85rem;color:var(--gris)}
.fm-legende li{display:flex;align-items:center;gap:.45rem}
.fm-sw{display:inline-block;width:1.4rem;height:.75rem;border:1px solid var(--encre)}
.fm-sw-bois{background:var(--bois)}
.fm-sw-coupe{background:var(--coupe)}
.fm-sw-cle{background:var(--cle)}
.fm-sw-cache{border-style:dashed;background:transparent}
.fm-sw-force{background:var(--rouge);border-color:var(--rouge);height:3px}
.fm-tableau{overflow-x:auto;background:#fff;border:1px solid var(--trait);border-radius:5px}
.fiche-modele table{border-collapse:collapse;width:100%;font-size:.92rem}
.fiche-modele th,.fiche-modele td{text-align:left;vertical-align:top;padding:.6rem .75rem;border-bottom:1px solid var(--trait)}
.fiche-modele thead th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gris);border-bottom:1.5px solid var(--encre)}
.fiche-modele tbody tr:last-child>*{border-bottom:0}
.fiche-modele tbody th{white-space:nowrap}
.fm-noeuds{min-width:760px}
.fm-n{width:2.6rem;padding-right:0}
.fm-pourquoi{color:var(--gris);width:30%}
.fm-pastille{display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;
background:var(--encre);color:#fff;font-size:.75rem;font-weight:700}
.fm-lecteur{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.fm-duo{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:2rem;align-items:start}
.fm-colonne{display:grid;gap:.7rem}
.fm-talon td,.fm-talon th{text-align:right;font-variant-numeric:tabular-nums}
.fm-talon th:first-child{text-align:left}
.fm-levee{list-style:none;margin:0;padding:0;counter-reset:l;border-top:1.5px solid var(--encre)}
.fm-levee li{counter-increment:l;display:grid;grid-template-columns:3rem minmax(0,1fr);padding:.75rem 0;
border-bottom:1px solid var(--trait)}
.fm-levee li::before{content:counter(l);font-size:1.6rem;font-weight:700;line-height:1;color:var(--gris)}
.fm-reserves{border-left:3px solid var(--rouge);background:#fff;padding:1rem 1.2rem;display:grid;gap:.5rem}
.fm-reserves p{margin:0}
.fm-reserves strong{color:var(--rouge)}
@media (max-width:52rem){.fm-tete,.fm-paire,.fm-duo{grid-template-columns:1fr}}

.boite-contact{border:2px solid var(--encre,#1d2621);border-radius:4px;background:#fbf8f1;color:#1d2621;padding:1.2rem 1.4rem;max-width:26rem;width:calc(100% - 2rem)}
.boite-contact::backdrop{background:rgba(29,38,33,.55)}
.boite-contact label{display:block;margin:.6rem 0}
.boite-contact input[type=text],.boite-contact input[type=tel]{display:block;width:100%;box-sizing:border-box;font:inherit;padding:.5rem;margin-top:.2rem}
.boite-contact fieldset.questions{border:1px solid #d9ccb3;padding:.4rem .8rem .6rem;margin:.6rem 0}
.boite-contact fieldset.questions legend{font-weight:700;padding:0 .3rem}
.boite-contact select{display:block;width:100%;box-sizing:border-box;font:inherit;padding:.4rem;margin-top:.2rem}
.boite-contact{max-height:calc(100vh - 2rem);overflow-y:auto}
.boite-contact .piege{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.boite-contact .actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:0}

/* Le relevé visuel (2026-09-15) : une page de téléphone, un geste à la fois. */
main > .releve{width:min(46rem,100% - 2*var(--gouttiere))}
.releve-piece label{display:block;margin-block:.6rem}
.releve-piece select,.releve-piece input{width:100%}
.releve-entete{font:600 .95rem/1.4 var(--mono)}
.releve-prochaine{border-left:4px solid var(--craie)}
.releve-quoi{font:700 1.25rem/1.25 var(--titre);margin:0 0 .3rem}
.releve-bouton{display:inline-block;margin-top:.6rem;padding:1rem 1.4rem;background:var(--bouton);color:#fff;
  font:700 1.05rem/1 var(--titre);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;border-radius:2px}
.releve-verdict{margin-top:.8rem}
.releve-verdict .bonne{color:var(--mousse,#3f6b3a);font-weight:700}
.releve-verdict .refaire{color:var(--craie);font-weight:700}
.releve-grille{margin-block:1.2rem}
.releve-grille .rangee{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;margin-block:.35rem}
.releve-grille .rangee b{width:4.2rem;font-size:.85rem}
.releve-grille button{min-width:3rem;padding:.35rem .4rem;font:500 .78rem/1 var(--mono);border:1px solid var(--kraft-2);
  background:var(--papier,#faf8f4);color:var(--encre);box-shadow:none;text-transform:none;letter-spacing:0}
.releve-grille button.bonne{background:#dfe9d8;border-color:#7da36f}
.releve-grille button.a_refaire{background:#f3d9d2;border-color:var(--craie)}
.releve-grille button.courante{outline:3px solid var(--encre);outline-offset:1px}
.releve-faces figure{margin:1rem 0;overflow-x:auto}
.releve-faces img{max-width:none;height:14rem;display:block}
.releve-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2rem}
.releve-actions .discret{background:transparent;color:var(--craie);border:1px solid var(--craie);box-shadow:none}
.releve-validation .discret{background:transparent;color:var(--craie);border:1px solid var(--craie);box-shadow:none}
.val-outils,.val-boutons{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;margin-block:.5rem}
.val-outils button,.val-boutons button{padding:.55rem .8rem;font-size:.9rem}
.val-cadre{overflow-x:auto;overflow-y:hidden;background:#555;border:1px solid var(--kraft-2);touch-action:pan-x}
.val-cadre svg{display:block}
.val-cadre .noeud{fill:transparent;stroke-width:3;vector-effect:non-scaling-stroke;cursor:pointer}
.val-cadre .noeud.a_valider{stroke:#ffcc00}
.val-cadre .noeud.confirme{stroke:#39d353}
.val-cadre .noeud.rejete{stroke:#bbb;stroke-dasharray:6 4}
.val-cadre .noeud.choisi{stroke-width:6}
.val-cadre .arete{stroke:#ff4d4d;stroke-width:2;stroke-dasharray:10 6;vector-effect:non-scaling-stroke}
.val-cadre.ajout{outline:3px solid #39d353}
.val-quoi{font-weight:600}
.val-compte{font:600 .9rem/1.4 var(--mono)}
.val-resume table{width:100%;border-collapse:collapse;font-size:.85rem}
.val-resume td,.val-resume th{border-top:1px solid var(--kraft-2);padding:.3rem .2rem;text-align:left}

/* Le son du bois (2026-10-14) : la même page de téléphone que le relevé. */
.son .bloc{border:1px solid var(--kraft-2,#d9ccb4);border-radius:6px;padding:.8rem;margin:.8rem 0;background:#fff}
.son label{display:block;margin:.5rem 0}
.son select,.son input[type=text],.son input[type=number]{width:100%;font:inherit;padding:.45rem}
.son .gros{font:700 1.1rem/1.2 inherit;padding:.9rem 1rem;width:100%}
.son .niveau{height:14px;border-radius:7px;background:#e7dcc4;overflow:hidden;margin:.6rem 0}
.son .niveau i{display:block;height:100%;width:0;background:#3b2f22;transition:width .05s}
.son .compte{font:700 1.4rem/1 inherit;margin:.3rem 0}
.son .liste-mesure{border-top:1px solid #e7dcc4;padding:.6rem 0}
.son .liste-mesure .valeurs{font:.9rem/1.3 ui-monospace,monospace}
.son .constats button{margin:.2rem .2rem 0 0}
.son .bonne{color:#2d6a2d}.son .refaire-dit{color:#a33a24}
.son table.etal{width:100%;border-collapse:collapse;font-size:.9rem}
.son table.etal td,.son table.etal th{border-bottom:1px solid #e7dcc4;padding:.3rem;text-align:left}