/* Cotélier : planches d'atelier. Feuille de style unique, polices système uniquement, aucune ressource externe. */
:root {
  --papier: #f3eee2;
  --papier2: #e9e1cf;
  --carte: #fbf8f0;
  --encre: #1e2a33;
  --encre2: #46525d;
  --bleu: #17324a;
  --bleu2: #244b6b;
  --cuivre: #9a4519;
  --trait: #bfae8a;
  --grille: rgba(23, 50, 74, 0.09);
  --alerte-fond: #fde9e1;
  --alerte: #7a2a0d;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --c: #9a4519;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--papier); color: var(--encre); font: 1.0625rem/1.6 var(--sans); overflow-wrap: break-word; }
[hidden] { display: none !important; }
img, svg { max-width: 100%; }
a { color: var(--cuivre); text-underline-offset: 0.18em; }
a:hover { color: var(--bleu); }
:focus-visible { outline: 3px solid #1b63c4; outline-offset: 2px; }
.rail :focus-visible, .pied :focus-visible, .cote-main :focus-visible { outline-color: #f6c677; }
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 0.5rem; top: -4rem; z-index: 50; background: var(--bleu); color: #fff; padding: 0.7rem 1rem; font-weight: 700; }
.skip:focus { top: 0.5rem; }
h1, h2, h3 { font-family: var(--serif); line-height: 1.2; color: var(--encre); }
h1 { font-size: clamp(1.7rem, 4.6vw, 2.7rem); margin: 0.2rem 0 0.6rem; letter-spacing: -0.01em; }
h2 { font-size: clamp(1.3rem, 3vw, 1.65rem); margin: 2rem 0 0.6rem; padding-bottom: 0.3rem; border-bottom: 2px solid var(--encre); }
h3 { font-size: 1.15rem; margin: 1.4rem 0 0.4rem; }
p { margin: 0 0 0.9rem; }
.mono, .surtitre, .planche em, .etiq::before, .cote dd { font-family: var(--mono); }

/* ---------- Charpente : rail latéral et page ---------- */
.atelier { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100vh; }
.rail { background: var(--bleu); color: var(--papier); padding: 0.8rem 1rem 0.9rem; border-bottom: 4px solid var(--cuivre); }
.page { min-width: 0; display: flex; flex-direction: column; min-height: 100vh; }
.page > main { flex: 1 0 auto; width: 100%; max-width: 78rem; margin: 0 auto; padding: 0 1rem 2rem; min-width: 0; }
.marque { display: flex; align-items: center; gap: 0.25rem 0.7rem; flex-wrap: wrap; color: var(--papier); text-decoration: none; }
.marque img { flex: none; }
.marque-nom { font-family: var(--serif); font-size: 1.55rem; font-weight: 700; letter-spacing: 0.01em; }
.marque small { flex-basis: 100%; font-family: var(--mono); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.12em; color: #d6cdb6; }
.marque:hover { color: #fff; }
.rail-nav ul { list-style: none; margin: 0.7rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.15rem 1.1rem; }
.rail-nav li { min-width: 0; }
.rail-nav li:has(> details[open]) { flex-basis: 100%; }
.rail-nav a, .rail-nav summary { color: var(--papier); text-decoration: none; display: inline-block; padding: 0.55rem 0; min-height: 44px; font-weight: 600; cursor: pointer; }
.rail-nav a:hover, .rail-nav summary:hover { color: #f6c677; text-decoration: underline; }
.menu summary { list-style: none; }
.menu summary::-webkit-details-marker { display: none; }
.menu summary::after { content: " ▾"; }
.menu[open] summary::after { content: " ▴"; }
.menu-panel { padding-left: 0.9rem !important; margin: 0 0 0.4rem !important; border-left: 2px solid var(--cuivre); gap: 0 1rem; }
.rail-note { display: none; }

@media (min-width: 1000px) {
  .atelier { grid-template-columns: 17rem minmax(0, 1fr); }
  .rail { position: sticky; top: 0; align-self: start; height: 100vh; overflow-y: auto; padding: 1.4rem 1.2rem; border-bottom: 0; border-right: 4px solid var(--cuivre); display: flex; flex-direction: column; }
  .rail-nav ul { flex-direction: column; flex-wrap: nowrap; gap: 0; margin-top: 1.6rem; }
  .rail-nav li { border-bottom: 1px solid rgba(243, 238, 226, 0.18); }
  .rail-nav a, .rail-nav summary { display: block; width: 100%; padding: 0.65rem 0; }
  .menu-panel li { border-bottom: 0; }
  .rail-note { display: block; margin: auto 0 0; padding-top: 1.5rem; font-family: var(--mono); font-size: 0.78rem; color: #d6cdb6; }
  .page > main { padding: 0 2rem 3rem; }
}

/* ---------- Entêtes de planche ---------- */
.entete, .frontispice { position: relative; margin: 0 -1rem 1.6rem; padding: 1.2rem 1rem 1.3rem; background-color: var(--carte); background-image: linear-gradient(var(--grille) 1px, transparent 1px), linear-gradient(90deg, var(--grille) 1px, transparent 1px); background-size: 24px 24px; border-bottom: 3px double var(--encre); border-top: 8px solid var(--c); }
@media (min-width: 1000px) { .entete, .frontispice { margin: 0 -2rem 2rem; padding: 1.6rem 2rem 1.7rem; } }
.surtitre { margin: 0.3rem 0 0; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--encre2); }
.lead { font-size: 1.15rem; max-width: 46rem; color: var(--encre); }
.compte { font-family: var(--mono); margin: 0.2rem 0 0.8rem; }
.compte b { font-size: 1.4rem; color: var(--cuivre); }
.signature { display: flex; align-items: center; gap: 0.7rem; font-size: 0.9rem; color: var(--encre2); margin: 0.8rem 0 0; }
.signature .mono, .portrait { flex: none; display: inline-grid; place-items: center; width: 2.4rem; height: 2.4rem; background: var(--bleu); color: var(--papier); font-weight: 700; font-size: 0.9rem; border: 2px solid var(--encre); }
.portrait { width: 5.5rem; height: 5.5rem; font-size: 2rem; font-family: var(--serif); margin: 0.6rem 0; }
.fil ol { list-style: none; display: flex; flex-wrap: wrap; margin: 0 0 0.4rem; padding: 0; font-size: 0.9rem; }
.fil li + li::before { content: "/"; margin: 0 0.45rem; color: var(--encre2); }
.fil [aria-current] { color: var(--encre2); }

.frontispice { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; align-items: center; border-top-color: var(--cuivre); }
.frontispice > * { min-width: 0; }
.frontispice h1 { font-size: clamp(1.9rem, 5.5vw, 3.3rem); }
.frontispice-dessin { margin: 0; background: var(--carte); border: 2px solid var(--encre); padding: 0.6rem; box-shadow: 6px 6px 0 var(--cuivre); }
.frontispice-dessin figcaption { font-family: var(--mono); font-size: 0.78rem; color: var(--encre2); border-top: 1px solid var(--trait); padding-top: 0.4rem; margin-top: 0.3rem; }
.dessin-hero { display: block; width: 100%; height: auto; max-height: 21rem; color: var(--encre); }
.d-fond { fill: var(--carte); stroke: currentColor; stroke-width: 2; }
.d-bois { fill: #d9b98a; stroke: #1e2a33; stroke-width: 1.5; }
.d-verre { fill: #bfdbe6; stroke: #1e2a33; stroke-width: 1.2; }
.d-cote { stroke: var(--cuivre); stroke-width: 1.2; }
.d-cote text { fill: var(--cuivre); stroke: none; font: 600 13px var(--mono); }
@media (min-width: 760px) { .frontispice { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2rem; } }

.actions { display: flex; flex-wrap: wrap; gap: 0.7rem; margin: 1rem 0 0; }
.bouton { display: inline-block; background: var(--cuivre); color: #fff; font: 700 1rem var(--sans); padding: 0.7rem 1.15rem; border: 2px solid var(--cuivre); text-decoration: none; cursor: pointer; min-height: 44px; border-radius: 0; text-align: center; }
.bouton:hover { background: var(--bleu); border-color: var(--bleu); color: #fff; }
.bouton-clair, .bouton.clair { background: transparent; color: var(--cuivre); }
.bouton-clair:hover, .bouton.clair:hover { background: var(--bleu); color: #fff; }
.petit { padding: 0.45rem 0.85rem; font-size: 0.95rem; }
.linkbtn { background: none; border: 0; padding: 0.5rem 0.2rem; min-height: 44px; font: inherit; color: var(--cuivre); text-decoration: underline; cursor: pointer; }

.chiffres dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); margin: 0 0 2rem; border: 2px solid var(--encre); background: var(--carte); }
.chiffres dl > div { padding: 0.8rem 0.9rem; border-right: 1px solid var(--trait); border-bottom: 1px solid var(--trait); min-width: 0; }
.chiffres dt { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--encre2); }
.chiffres dd { margin: 0; font: 700 1.55rem var(--mono); color: var(--bleu); }

/* ---------- Blocs et cartes ---------- */
.bloc { margin: 0 0 2.2rem; }
.bloc > h2:first-child { margin-top: 0.4rem; }
.note { color: var(--encre2); font-size: 0.95rem; max-width: 52rem; }
.planches { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.9rem; }
.planches > li, .etiquettes > li { min-width: 0; }
@media (min-width: 560px) { .planches { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .planches { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.planche { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "i b" "i s"; gap: 0.1rem 0.8rem; align-content: start; height: 100%; padding: 0.9rem 0.9rem 0.9rem 0.9rem; background: var(--carte); border: 2px solid var(--encre); border-top: 8px solid var(--c); color: var(--encre); text-decoration: none; transition: transform 0.12s, box-shadow 0.12s; }
.planche:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--c); color: var(--encre); }
.planche i { grid-area: i; font-style: normal; font-size: 1.6rem; width: 2.8rem; height: 2.8rem; display: grid; place-items: center; background: var(--papier2); border: 1px solid var(--trait); }
.planche b { grid-area: b; font-family: var(--serif); font-size: 1.1rem; line-height: 1.25; padding-right: 3.6rem; overflow-wrap: break-word; }
.planche span { grid-area: s; font-size: 0.9rem; color: var(--encre2); overflow-wrap: break-word; }
.planche em { position: absolute; top: 0.4rem; right: 0.6rem; font-style: normal; font-size: 0.72rem; color: var(--encre2); text-transform: uppercase; letter-spacing: 0.06em; }

.etiquettes { list-style: none; margin: 0.8rem 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; counter-reset: ref; }
@media (min-width: 520px) { .etiquettes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .etiquettes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .etiquettes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.etiquettes > li { counter-increment: ref; position: relative; }
.etiq { position: relative; display: flex; flex-direction: column; gap: 0.1rem; height: 100%; min-height: 4.2rem; padding: 0.65rem 3rem 0.65rem 3.1rem; background: var(--carte); border: 1px solid var(--trait); border-left: 6px solid var(--c); color: var(--encre); text-decoration: none; }
.etiq::before { content: counter(ref, decimal-leading-zero); position: absolute; left: 0.5rem; top: 0.7rem; font-size: 0.78rem; color: var(--encre2); }
.etiq b { overflow-wrap: anywhere; line-height: 1.3; }
.etiq span { font-size: 0.82rem; color: var(--encre2); }
.etiq:hover { background: #fff; border-color: var(--encre); color: var(--encre); }
.fav { position: absolute; top: 0; right: 0; width: 44px; height: 44px; background: none; border: 0; font-size: 1.3rem; color: var(--cuivre); cursor: pointer; }
.fav[aria-pressed="true"] { color: var(--bleu); }

.cherche { margin: 0.6rem 0 0.4rem; padding: 0.9rem; background: var(--carte); border: 2px solid var(--encre); }
.cherche-ligne { position: relative; }
.cherche-ligne input { padding-right: 3rem; }
.cherche-effacer { position: absolute; right: 0; top: 0; width: 44px; height: 44px; background: none; border: 0; font-size: 1.1rem; cursor: pointer; color: var(--encre); }
.aide { font-size: 0.86rem; color: var(--encre2); margin: 0.35rem 0 0.6rem; }
.filtres { list-style: none; margin: 0.3rem 0 0.6rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.filtres button { font: 600 0.88rem var(--sans); min-height: 44px; padding: 0.35rem 0.75rem; background: var(--papier); color: var(--encre); border: 1px solid var(--encre); border-left: 6px solid var(--c, var(--encre)); cursor: pointer; border-radius: 0; text-align: left; }
.filtres button[aria-pressed="true"] { background: var(--bleu); color: #fff; }
.cherche-compte { font-family: var(--mono); font-size: 0.88rem; margin: 0; min-height: 1.4em; }
.favoris { margin: 0.8rem 0; padding: 0.9rem; border: 2px dashed var(--cuivre); background: var(--carte); }
.favoris-titre { margin: 0 0 0.4rem; font: 700 1.15rem var(--serif); }
.favoris-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin: 0.4rem 0; }
.vide { padding: 1.4rem; text-align: center; border: 2px dashed var(--trait); }

/* ---------- Outils : poste, saisie, bordereau ---------- */
.poste { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.4rem; margin: 0 0 2rem; align-items: start; }
.poste > * { min-width: 0; }
@media (min-width: 1240px) { .poste { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); } .poste .bordereau { position: sticky; top: 1rem; } }
.saisie { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.9rem 1rem; padding: 1.1rem; background: var(--carte); border: 2px solid var(--encre); border-left: 8px solid var(--c); }
.saisie > * { min-width: 0; }
@media (min-width: 560px) { .saisie { grid-template-columns: repeat(2, minmax(0, 1fr)); } .saisie .field:has(textarea), .saisie .inverser { grid-column: 1 / -1; } }
.field { min-width: 0; }
label { display: block; font-weight: 700; font-size: 0.9rem; margin-bottom: 0.25rem; }
input, select, textarea { display: block; width: 100%; max-width: 100%; min-height: 44px; padding: 0.5rem 0.6rem; font: inherit; color: var(--encre); background: #fff; border: 2px solid var(--encre); border-radius: 0; }
textarea { min-height: 7rem; resize: vertical; font-family: var(--mono); font-size: 0.92rem; line-height: 1.5; }
input[type="range"] { padding: 0; }
.inverser { justify-self: start; min-height: 44px; padding: 0.4rem 0.9rem; font: 700 0.95rem var(--sans); background: var(--papier2); color: var(--encre); border: 2px solid var(--encre); cursor: pointer; border-radius: 0; }
.bordereau { background: var(--carte); border: 2px solid var(--encre); padding: 0 1rem 1rem; }
.bordereau::before { content: "BORDEREAU DE COTES"; display: block; margin: 0 -1rem 0.9rem; padding: 0.4rem 1rem; background: var(--encre); color: var(--papier); font: 700 0.74rem var(--mono); letter-spacing: 0.14em; }
.bordereau > h2:not(.sr) { margin-top: 0; }
.result { min-width: 0; }
.cotes { margin: 0; }
.cote { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.1rem 1rem; padding: 0.55rem 0; border-bottom: 1px dotted var(--encre2); }
.cote dt { font-size: 0.93rem; color: var(--encre2); }
.cote dd { margin: 0; font-weight: 700; font-size: 1.02rem; overflow-wrap: break-word; }
@media (min-width: 480px) { .cote { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); } .cote dd { text-align: right; } }
.cote-main { background: var(--bleu); color: #fff; padding: 0.8rem 0.9rem; margin: 0 0 0.4rem; border: 0; }
.cote-main dt { color: #e4dcc8; }
.cote-main dd { font-size: 1.35rem; color: #fff; }
.conv-main { font: 700 1.3rem var(--mono); background: var(--bleu); color: #fff; padding: 0.8rem 0.9rem; margin: 0 0 0.5rem; overflow-wrap: anywhere; }
.rnote { font-size: 0.88rem; color: var(--encre2); margin: 0.8rem 0 0; }
.err { background: var(--alerte-fond); color: var(--alerte); border-left: 6px solid var(--alerte); padding: 0.7rem 0.9rem; font-weight: 600; margin: 0 0 0.6rem; }
.errlist { margin: 0 0 0.8rem; padding: 0.7rem 0.9rem 0.7rem 2rem; background: var(--alerte-fond); color: var(--alerte); border-left: 6px solid var(--alerte); font-size: 0.92rem; }
.statut { min-height: 1.4em; font-weight: 600; color: var(--bleu); }

/* ---------- Texte courant ---------- */
.texte { max-width: 52rem; margin: 0 0 2rem; }
.texte.large { max-width: none; }
.texte ul, .texte ol, .guide ul { padding-left: 1.3rem; }
.texte li { margin: 0.25rem 0; }
.pastilles, .plain { list-style: none; padding: 0 !important; margin: 0.5rem 0 1rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pastilles li { min-width: 0; }
.pastilles a { display: inline-block; padding: 0.4rem 0.8rem; background: var(--carte); border: 1px solid var(--encre); border-left: 5px solid var(--cuivre); text-decoration: none; color: var(--encre); }
.pastilles a:hover { background: var(--bleu); color: #fff; }
.plain { display: block; columns: 16rem; column-gap: 1.5rem; }
.plain li { break-inside: avoid; margin: 0.15rem 0; }
.integrer { padding: 1rem; background: var(--carte); border: 2px dashed var(--encre); }
.integrer textarea { min-height: 6.5rem; }
.exemple { padding: 1rem; background: var(--carte); border: 2px solid var(--encre); border-left: 8px solid var(--cuivre); }
.exemple ul { margin: 0 0 1rem; }
.faq details { border-bottom: 1px solid var(--trait); }
.faq details:first-of-type { border-top: 1px solid var(--trait); }
.faq summary { cursor: pointer; font-weight: 700; padding: 0.75rem 0.2rem; min-height: 44px; list-style: none; display: flex; gap: 0.6rem; }
.faq summary::before { content: "+"; font-family: var(--mono); color: var(--cuivre); flex: none; width: 1rem; }
.faq details[open] summary::before { content: "−"; }
.faq summary::-webkit-details-marker { display: none; }
.faq details p { padding: 0 0.2rem 0.8rem 1.8rem; margin: 0; }
.facts { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.1rem; margin: 0 0 1rem; border: 2px solid var(--encre); background: var(--carte); }
.facts dt { font-weight: 700; padding: 0.55rem 0.8rem 0; }
.facts dd { margin: 0; padding: 0 0.8rem 0.55rem; border-bottom: 1px dotted var(--trait); overflow-wrap: break-word; }
@media (min-width: 700px) { .facts { grid-template-columns: minmax(0, 16rem) minmax(0, 1fr); gap: 0; } .facts dt, .facts dd { padding: 0.55rem 0.8rem; border-bottom: 1px dotted var(--trait); } }
.liens { list-style: none; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
@media (min-width: 600px) { .liens { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.liens a { display: block; padding: 0.7rem 0.9rem; background: var(--carte); border: 2px solid var(--encre); text-decoration: none; color: var(--encre); overflow-wrap: anywhere; }
.liens b, .liens span { display: block; }
.liens span { font-size: 0.85rem; color: var(--encre2); }

/* ---------- Guides ---------- */
.guide { max-width: 46rem; margin: 0 0 2rem; }
.guide .chapeau { font: 1.25rem/1.55 var(--serif); padding-left: 1rem; border-left: 6px solid var(--cuivre); margin-bottom: 1.4rem; }
.guide h2 { border-bottom: 0; border-top: 2px solid var(--encre); padding: 0.5rem 0 0; }
.pointage ul { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: 0.35rem; }
.pointage li { position: relative; padding: 0.5rem 0.7rem 0.5rem 2.4rem; background: var(--carte); border: 1px solid var(--trait); }
.pointage li::before { content: ""; position: absolute; left: 0.7rem; top: 0.75rem; width: 1rem; height: 1rem; border: 2px solid var(--encre); background: #fff; }
.appel { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.8rem 1.2rem; margin: 1.6rem 0; padding: 1rem 1.1rem; background: var(--carte); border: 2px dashed var(--c); }
.appel p { margin: 0; font-weight: 600; flex: 1 1 14rem; }
.guide-nav { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.7rem; }
@media (min-width: 600px) { .guide-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.guide-nav a { display: block; padding: 0.8rem 1rem; background: var(--carte); border: 2px solid var(--encre); text-decoration: none; color: var(--encre); font-family: var(--serif); font-weight: 700; }
.guide-nav a span { display: block; font: 0.72rem var(--mono); text-transform: uppercase; letter-spacing: 0.1em; color: var(--encre2); }

/* ---------- Tableaux, calendrier ---------- */
.tablewrap { overflow-x: auto; max-width: 100%; position: relative; margin: 0.6rem 0 1rem; border: 2px solid var(--encre); background: var(--carte); }
.evlist { width: 100%; border-collapse: collapse; min-width: 30rem; font-size: 0.93rem; }
.evlist th, .evlist td { padding: 0.5rem 0.7rem; text-align: left; border-bottom: 1px solid var(--trait); vertical-align: top; }
.evlist thead th { background: var(--encre); color: var(--papier); font-family: var(--mono); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; }
.evlist tbody th { font-weight: 700; }
.controles { display: flex; flex-wrap: wrap; align-items: end; gap: 0.7rem 1rem; margin: 0.6rem 0 1rem; }
.controles select { width: auto; min-width: 8rem; }
.months { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12.5rem), 1fr)); gap: 0.8rem; margin: 0.6rem 0 1rem; }
.month { min-width: 0; overflow-x: auto; position: relative; background: var(--carte); border: 1px solid var(--encre); padding: 0.4rem; }
.month table { width: 100%; border-collapse: collapse; text-align: center; font-size: 0.82rem; }
.month caption { font: 700 0.85rem var(--mono); text-align: left; padding: 0.2rem 0.1rem; text-transform: capitalize; }
.month th { color: var(--encre2); font-weight: 600; }
.month td { padding: 0.2rem 0; }
.mk { color: #fff; font-weight: 700; }
.mk-ferie { background: var(--bleu); }
.mk-entretien { background: var(--cuivre); }

/* ---------- Dessins, étiquettes, fiches ---------- */
.dessin { margin: 0 0 1rem; overflow-x: auto; max-width: 100%; position: relative; border: 2px solid var(--encre); background: #fbf7ee; }
.dessin svg { display: block; height: auto; max-width: none; width: auto; }
@media (min-width: 700px) { .dessin svg { max-width: 100%; } }
.label-sheet { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 11.5rem), 1fr)); gap: 0.5rem; }
.label-card { padding: 0.5rem 0.6rem; border: 2px dashed var(--encre); background: #fff; min-width: 0; overflow-wrap: anywhere; }
.label-card b, .label-card span, .label-card small { display: block; }
.label-card small { color: var(--encre2); font-size: 0.72rem; }
.feuille { background: #fff; color: #111; border: 1px solid var(--trait); padding: 1.2rem; font: 1rem/1.5 Georgia, "Times New Roman", serif; box-shadow: 5px 5px 0 var(--papier2); overflow-wrap: break-word; }
.feuille p { margin: 0 0 0.25em; }
.actions-fichier { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.9rem 0 0; }

/* ---------- Matrice d'arbitrage ---------- */
.matrice { margin: 0 0 2rem; padding: 1.1rem; background: var(--carte); border: 2px solid var(--encre); border-left: 8px solid var(--c); }
.matrice-haut { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.8rem; }
.matrice-haut > * { min-width: 0; }
@media (min-width: 640px) { .matrice-haut { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fallback, .help { font-size: 0.93rem; color: var(--encre2); }
.names { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.7rem; margin: 0.6rem 0; }
.names > * { min-width: 0; }
@media (min-width: 640px) { .names { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.crit { margin: 0 0 0.9rem; padding: 0.8rem; border: 1px solid var(--encre); background: #fff; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; min-width: 0; }
.crit legend { font: 700 0.78rem var(--mono); text-transform: uppercase; letter-spacing: 0.08em; padding: 0 0.4rem; }
.crit > * { min-width: 0; }
@media (min-width: 640px) { .crit { grid-template-columns: repeat(2, minmax(0, 1fr)); } .crit .help, .crit .scores, .crit .linkbtn { grid-column: 1 / -1; } }
.scores { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
.scores > * { min-width: 0; }
@media (min-width: 640px) { .scores { grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); } }
.ranking { list-style: none; margin: 0.6rem 0; padding: 0; display: grid; gap: 0.5rem; }
.ranking li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.2rem 0.7rem; align-items: center; padding: 0.6rem 0.8rem; background: #fff; border: 1px solid var(--encre); }
.ranking .bar { grid-column: 1 / -1; display: block; height: 0.7rem; background: var(--papier2); border: 1px solid var(--trait); }
.ranking .bar i { display: block; height: 100%; background: var(--cuivre); }
.rk { font-family: var(--mono); font-weight: 700; color: var(--bleu); }
.sc { font-family: var(--mono); font-weight: 700; }
.verdict { font-weight: 700; padding: 0.7rem 0.9rem; background: var(--papier2); border-left: 6px solid var(--bleu); }

/* ---------- Pied de page ---------- */
.pied { background: var(--bleu); color: #e9e1cf; padding: 2rem 1rem 1.2rem; border-top: 6px solid var(--cuivre); }
.pied a { color: #f6c677; }
.pied a:hover { color: #fff; }
.pied-grille { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.6rem; max-width: 78rem; margin: 0 auto; }
.pied-grille > * { min-width: 0; }
@media (min-width: 640px) { .pied-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1240px) { .pied-grille { grid-template-columns: minmax(0, 1.5fr) repeat(4, minmax(0, 1fr)); } }
.pied-titre { font: 700 0.78rem var(--mono); text-transform: uppercase; letter-spacing: 0.14em; color: #fff; border-bottom: 1px solid rgba(243, 238, 226, 0.35); padding-bottom: 0.4rem; margin: 0 0 0.6rem; }
.pied ul { list-style: none; margin: 0; padding: 0; }
.pied li { margin: 0; }
.pied li a { display: inline-block; padding: 0.3rem 0; min-height: 32px; overflow-wrap: anywhere; }
.marque-pied { margin-bottom: 0.6rem; }
.pied-bas { max-width: 78rem; margin: 1.8rem auto 0; padding-top: 1rem; border-top: 1px solid rgba(243, 238, 226, 0.35); font-size: 0.82rem; color: #d6cdb6; }

/* ---------- Pages intégrables ---------- */
body.embed { display: block; background: var(--carte); }
.embed-wrap { max-width: 40rem; margin: 0 auto; padding: 1rem; }
.embed-wrap h1 { font-size: 1.4rem; }
.poste-embed { margin-bottom: 1rem; }
.poste-embed .saisie { grid-template-columns: minmax(0, 1fr); }
.embed-credit { font-size: 0.85rem; text-align: right; }

@media print {
  .rail, .pied, .fil, .skip, .saisie, .actions-fichier, .actions, .bouton, .cherche, .matrice, .signature { display: none !important; }
  body { background: #fff; }
  .atelier { display: block; }
  .entete, .frontispice { background: none; border: 0; padding: 0; margin: 0 0 1rem; }
  .bordereau, .feuille { border: 0; box-shadow: none; }
  .bordereau::before { display: none; }
  .poste { display: block; }
  body.modele .poste .bordereau h2 { display: none; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .planche { transition: none; } }

/* ---------- Variantes de blocs ---------- */
.planche-outil { border-top-width: 2px; border-left: 8px solid var(--c); }
.bloc-annuaire { padding: 1rem; background: var(--papier2); border: 1px solid var(--trait); }
.poste-etabli .saisie { align-content: start; }
.poste-fiche .feuille { min-height: 18rem; }
.crit-list { grid-template-columns: minmax(0, 1fr); }
.crit-list dt { font-family: var(--serif); background: var(--papier2); }
.pied-about p { max-width: 26rem; }
.frontispice-texte { min-width: 0; }
.has-fav .etiq b { padding-right: 0.2rem; }


/* ===== kit commun : export, filtre, outils liés, impression, grandes listes ===== */
.kit-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.9rem 0 0}
.kit-actions button{font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;padding:.45rem .85rem;min-height:44px;border:2px solid currentColor;border-radius:.6rem;background:transparent;color:inherit}
.kit-actions button:hover{text-decoration:underline}
.kit-status{font-size:.9rem;min-height:1.2em}
.kit-filter{margin:0 0 1.2rem}
.kit-filter label{display:block;font-weight:700;margin-bottom:.35rem}
.kit-filter input{font:inherit;width:100%;max-width:32rem;padding:.6rem .8rem;min-height:44px;border:2px solid #222;border-radius:.6rem;background:#fff;color:#111}
.kit-count{margin:.4rem 0 0;font-size:.92rem;min-height:1.2em}
.kit-related{margin:2.2rem 0 1rem;padding:1rem 1.2rem;border:2px solid currentColor;border-radius:.8rem}
.kit-related h2{font-size:1.15rem;margin:0 0 .7rem}
.kit-related ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:.4rem .8rem}
.kit-related li{min-width:0}
.kit-related a{display:block;padding:.35rem .1rem;overflow-wrap:break-word}
ul:has(> li:nth-child(40)) > li{content-visibility:auto;contain-intrinsic-size:auto 100px}
@media print{
  body.kit-printing *{visibility:hidden!important}
  body.kit-printing .kit-print-target,body.kit-printing .kit-print-target *{visibility:visible!important}
  body.kit-printing .kit-print-target{position:absolute!important;left:0;top:0;width:100%;color:#000!important;background:#fff!important;box-shadow:none!important}
}