/* attestscope.ai : feuille de style unique (remplace assay.css). Norme publiée : bande sombre, papier, laiton, or.
   EB Garamond pour les titres, IBM Plex Sans pour le texte, IBM Plex Mono pour le code et les champs.
   Relief v1 : rythme par bandes (papier, blanc, brun profond), brun et or en surface, planches, schémas et trace présentés
   comme des spécimens (cadre, fond, ombre unique), mises en avant par la taille, la couleur et le serif. */

:root {
  --ink: #1C1B19; --band: #211D17; --band2: #2E2820; --paper: #F6F4EF; --white: #FFFFFF; --cream: #EFE9DA; --text: #4A4740; --muted: #6E6A60;
  --rule: #DDD8CC; --rule2: #E9E5DB; --brass: #9C7A2E; --brassd: #7A5C1E; --gold: #E9A83A;
  --onband: #F4EFE4; --onband2: #BDB5A3; --onrule: rgba(244,239,228,.22); --code: #121210;
  --shadow: 0 18px 40px -18px rgba(33,29,23,.4), 0 2px 6px rgba(33,29,23,.08);
  --gutter: clamp(16px, 5vw, 72px); --max: 1120px; --measure: 34em;
  --sans: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif; --serif: "EB Garamond", Garamond, Georgia, serif; --mono: "IBM Plex Mono", Menlo, Consolas, monospace;
}
html { color-scheme: light; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--text); font-family: var(--sans); font-size: 16px; line-height: 1.6; overflow-x: hidden; overflow-wrap: anywhere; }
p, ul, ol, dl, dd, figure, blockquote, h1, h2, h3, h4, pre { margin: 0; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; color: var(--ink); overflow-wrap: normal; }
h1 { font-size: clamp(34px, 4.4vw, 46px); line-height: 1.1; font-weight: 500; letter-spacing: -.005em; }
h2 { font-size: clamp(26px, 3vw, 32px); line-height: 1.18; font-weight: 500; }
h3 { font-size: 22px; line-height: 1.25; font-weight: 500; }
h4 { font-size: 18px; line-height: 1.3; font-weight: 500; }
a { color: var(--brassd); text-decoration: none; text-underline-offset: .15em; }
a:hover { color: var(--ink); text-decoration: underline; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }
img, svg { max-width: 100%; height: auto; }
strong, b { font-weight: inherit; color: inherit; }
[hidden] { display: none !important; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: #fff; padding: 8px 12px; z-index: 20; }
.skip:focus { left: 8px; color: #fff; text-decoration: none; }
ul, ol { padding-left: 1.2em; }
p + p, li + li { margin-top: .7em; }
/* longueur de ligne : 60 à 75 caractères pour tout texte courant (tableaux, figures et grilles non concernés) */
main p, main li, main dd, main dt, main blockquote, main figcaption { max-width: var(--measure); }
.files li, .toc li, .ex-rows dd, .ex-rows dt { max-width: none; }
/* liens visibles dans le texte courant */
main p a:not(.btn), main li a:not(.btn), main dd a, main td a { text-decoration: underline; text-decoration-color: rgba(122,92,30,.45); text-decoration-thickness: 1px; }
main p a:not(.btn):hover, main li a:not(.btn):hover { text-decoration-color: currentColor; }
table { border-collapse: collapse; width: 100%; }
code, pre, .mono { font-family: var(--mono); }
code { font-size: .92em; }
pre { white-space: pre-wrap; background: var(--white); border: 1px solid var(--rule); padding: 16px 18px; line-height: 1.55; color: var(--ink); font-size: 13.5px; overflow-x: auto; }
.fine, .sub, .note, .lbl { font-size: 14px; line-height: 1.55; color: var(--muted); }
.lbl { display: block; margin-bottom: 6px; }
.lbl.mono { font-size: 12.5px; letter-spacing: .02em; color: var(--brassd); }
.lead { font-size: 19px; line-height: 1.5; color: var(--text); max-width: var(--measure); }
.kicker { font-family: var(--sans); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--brassd); margin-bottom: 14px; }
.sec-head { margin-bottom: 32px; max-width: 800px; }
.sec-head .lead, .sec-head .sub { margin-top: 10px; }
/* filet or au-dessus des titres de section */
.sec-head > h2::before, .band > .wrap > h2::before, .sec-head > .lbl::before, .band > .wrap > .lbl::before, .s-reason .two .lbl::before { content: ""; display: block; width: 56px; height: 4px; background: var(--gold); margin-bottom: 18px; }
.sec-head > .lbl + h2::before, .band > .wrap > .lbl + h2::before { display: none; }
.page-head { max-width: 800px; }
.page-head .lead { margin-top: 22px; font-size: 20px; }
.page-head .note { margin-top: 14px; }
.page-head .fine.mono { margin-top: 16px; font-size: 12.5px; letter-spacing: .04em; }
.page-head .meta { margin-top: 18px; font-size: 13px; color: var(--muted); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 56px; align-items: start; }
.cols3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.cols4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
/* cartes de notions : blanches à filet brun ou or sur fond clair */
.list-cols, .parts, .keeping, .examples, .licences { list-style: none; padding: 0; margin: 0; }
.list-cols li, .parts li, .keeping li, .examples li, .licences li { margin: 0; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--band); padding: 22px 24px 26px; }
.band.warm .list-cols li, .band.warm .parts li, .band.warm .keeping li, .band.warm .examples li, .band.warm .licences li { background: var(--paper); }
.list-cols li:nth-child(2), .parts li:nth-child(2), .keeping li:nth-child(2), .licences li:nth-child(2) { border-top-color: var(--gold); }
.list-cols li:nth-child(3), .parts li:nth-child(3), .keeping li:nth-child(3), .licences li:nth-child(3) { border-top-color: var(--brass); }
.list-cols h3, .parts h3, .keeping h3, .examples h3, .licences h3 { margin-bottom: 10px; font-size: 23px; }
.list-cols p, .parts p, .keeping p, .licences p { font-size: 15px; }
.prose { max-width: var(--measure); }

/* layout : trois fonds (papier, blanc, brun profond) */
.band { padding-inline: var(--gutter); padding-block: clamp(48px, 7vw, 84px); border-top: 1px solid var(--rule2); background: var(--paper); }
.band.warm { background: var(--white); border-top-color: var(--rule); }
.band.dark { background: var(--band); color: var(--onband); border-top: 0; }
.band.dark h1, .band.dark h2, .band.dark h3, .band.dark strong, .band.dark b, .band.dark dt { color: #FFFFFF; }
.band.dark p, .band.dark li, .band.dark dd { color: var(--onband); }
.band.dark a:not(.btn) { color: #FFFFFF; text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); }
.band.dark a:not(.btn):hover { text-decoration-color: var(--gold); }
.band.dark .kicker, .band.dark .lbl { color: var(--gold); }
.band.dark .fine, .band.dark .sub { color: var(--onband2); }
.band.dark a:focus-visible, .band.dark button:focus-visible { outline-color: var(--gold); }
.band.dark + .band.dark { border-top: 1px solid var(--onrule); }
.wrap { max-width: var(--max); margin-inline: auto; }

/* header */
.site-head { padding-inline: var(--gutter); background: var(--band); color: var(--onband); border-bottom: 1px solid #3A342A; overflow-x: clip; }
.site-head .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; padding-block: 16px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--onband); white-space: nowrap; }
.brand svg { flex: 0 0 auto; }
.brand:hover { text-decoration: none; color: #FFFFFF; }
.brand svg { width: 30px; height: 30px; }
.brand .name { font-family: var(--serif); font-size: 23px; font-weight: 500; line-height: 1; }
.brand .tag { font-family: var(--mono); font-size: 10.5px; color: var(--gold); border: 1px solid #6B5A33; padding: 2px 7px; }
.nav-d { display: flex; align-items: center; gap: 20px; }
.nav-d ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px 16px; }
.nav-d li, .nav-m-panel li, .foot li { margin: 0; }
.nav-main a { color: var(--onband); font-size: 14px; padding: 6px 0; box-shadow: inset 0 -2px 0 transparent; white-space: nowrap; }
.nav-main a:hover { color: #FFFFFF; text-decoration: none; box-shadow: inset 0 -2px 0 rgba(233,168,58,.55); }
.nav-main a[aria-current="page"] { color: #FFFFFF; box-shadow: inset 0 -2px 0 var(--gold); }
.nav-fam { border-left: 1px solid rgba(237,232,220,.28); padding-left: 16px; gap: 4px 14px; }
.nav-fam a { color: var(--onband); font-size: 14px; font-weight: 500; white-space: nowrap; }
.site-head .lang { flex: none; font-family: var(--mono); font-size: 12.5px; line-height: 1.6; color: var(--onband); border: 1px solid #6B5A33; padding: 5px 10px; letter-spacing: .04em; white-space: nowrap; }
.site-head .lang:hover { color: var(--gold); text-decoration: none; }
.nav-m { display: none; }
.nav-m summary { list-style: none; cursor: pointer; font-size: 14.5px; color: var(--onband); border: 1px solid #6B5A33; padding: 7px 12px; }
.nav-m summary::-webkit-details-marker { display: none; }
.nav-m-panel { position: absolute; left: 0; right: 0; background: var(--band); border-bottom: 1px solid #3A342A; padding: 8px var(--gutter) 20px; z-index: 15; }
.nav-m-panel ul { list-style: none; margin: 0; padding: 0; }
.nav-m-panel li { margin: 0; }
.nav-m-panel a { display: block; padding: 11px 0; border-bottom: 1px solid #3A342A; color: var(--onband); font-size: 16px; }
.nav-m-panel a[aria-current="page"] { color: var(--gold); }
.nm-fam { margin-top: 10px; }
.nm-fam a { color: var(--onband); font-weight: 500; }
@media (max-width: 1100px) { .nav-d { display: none; } .nav-m { display: block; } .site-head { position: relative; } }
@media (max-width: 1299px) { .brand .tag { display: none; } }

/* buttons : plein brun sur fond clair, plein or sur fond profond, contour pour le secondaire */
.btn { display: inline-block; background: var(--band); color: #FFFFFF; border: 1px solid var(--band); padding: 13px 24px; font: inherit; font-size: 15px; line-height: 1.2; cursor: pointer; text-decoration: none; }
.btn:hover, .btn:focus-visible { background: var(--brassd); border-color: var(--brassd); color: #FFFFFF; text-decoration: none; }
.btn.ghost { background: transparent; color: var(--ink); }
.btn.ghost:hover, .btn.ghost:focus-visible { background: var(--ink); color: #FFFFFF; }
.btn.gold { background: var(--gold); border-color: var(--gold); color: var(--ink); }
.band.dark .btn { background: var(--gold); border-color: var(--gold); color: var(--ink); text-decoration: none; }
.band.dark .btn:hover, .band.dark .btn:focus-visible { background: #FFFFFF; border-color: #FFFFFF; color: var(--ink); }
.band.dark .btn.ghost { background: transparent; color: #FFFFFF; border-color: rgba(244,239,228,.6); }
.band.dark .btn.ghost:hover, .band.dark .btn.ghost:focus-visible { background: #FFFFFF; color: var(--ink); border-color: #FFFFFF; }

/* bandeau Position : brun profond, filet or épais, structure commune aux trois sites */
.stance { border-bottom: 6px solid var(--gold); }
.stance-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px 72px; align-items: start; }
.stance .lbl { color: var(--gold); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 18px; }
.stance-title { font-size: clamp(34px, 4.4vw, 52px); line-height: 1.08; font-weight: 500; font-family: var(--serif); color: #FFFFFF; }
.stance-sub { font-family: var(--serif); font-size: 23px; line-height: 1.35; font-style: italic; margin-top: 18px; max-width: 520px; }
.stance-named { font-family: var(--serif); font-size: 18px; line-height: 1.45; margin-top: 16px; max-width: 520px; }
.stance-body { padding-top: 6px; max-width: var(--measure); border-left: 1px solid var(--onrule); padding-left: 32px; }
.stance-body p { font-size: 15.5px; line-height: 1.65; }
.stance-body .close { margin-top: 22px; padding-top: 16px; border-top: 3px solid var(--gold); color: #FFFFFF; font-family: var(--serif); font-size: 20px; line-height: 1.35; }

/* home */
.s-who h2, .s-tools h2, .s-files h2, .s-words h2 { margin-bottom: 28px; }
.hero { max-width: 820px; }
.hero h1 { font-size: clamp(40px, 5.6vw, 66px); line-height: 1.04; }
.hero .slogan { font-family: var(--serif); font-size: 23px; line-height: 1.35; font-style: italic; color: var(--brassd); margin-top: 16px; }
/* sous-titre 1 du titre de l’accueil : la catégorie (décision de l’auteur, 20/10, 21 h 54) */
.hero .har-sub { font-family: var(--serif); font-size: clamp(26px, 3.2vw, 34px); line-height: 1.2; color: var(--ink); margin-top: 18px; letter-spacing: .005em; }
.hero .har-sub + .slogan { margin-top: 6px; }
.hero .lead { margin-top: 24px; font-size: 19px; }
.hero .byline { margin-top: 20px; }
.s-name h2 { font-size: clamp(26px, 3vw, 34px); max-width: 26em; }
.terms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 32px 0; }
.terms > div { background: var(--band); color: var(--onband); padding: 22px 24px 26px; border-top: 4px solid var(--gold); }
.terms dt { font-family: var(--mono); font-size: 13px; color: var(--gold); margin-bottom: 10px; }
.terms dd { font-size: 15.5px; color: var(--onband); max-width: none; }
.s-name .two p { font-size: 15.5px; }
.principles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.principles > div { background: var(--band2); border: 1px solid var(--onrule); border-top: 4px solid var(--gold); padding: 22px 22px 26px; }
.principles dt { font-family: var(--serif); font-size: 23px; line-height: 1.25; margin-bottom: 10px; }
.principles dd { font-size: 14.5px; max-width: none; }
.tool-name { font-family: var(--serif); font-size: 26px; color: var(--ink); margin-bottom: 8px; }
.s-tools .list-cols .lbl { margin-top: 12px; color: var(--brassd); }
.s-reason h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.2; color: var(--ink); }
.s-reason .two > .prose p { font-size: 16px; }

/* the format */
.words { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 24px; margin-top: 32px; }
.words > div { padding: 16px 18px; background: var(--white); border: 1px solid var(--rule); border-left: 4px solid var(--gold); }
.words dt { font-family: var(--mono); font-size: 13.5px; color: var(--ink); margin-bottom: 4px; }
.words dd { font-size: 14px; color: var(--muted); max-width: none; }
.parts li .mono.fine { margin-top: 12px; font-size: 12.5px; }
/* schémas et planches : spécimens cadrés sur fond blanc, ombre unique */
.fig { margin: 0; background: var(--white); padding: 20px 22px; border: 1px solid var(--rule); border-top: 4px solid var(--band); box-shadow: var(--shadow); }
.band.warm .fig { background: var(--paper); box-shadow: none; }
.scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.fig svg, .fig .diagram { display: block; width: 100%; height: auto; }
.fig .diagram-v { display: none; }
.notes { margin-top: 28px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 24px; }
.notes p { font-size: 15px; border-top: 3px solid var(--gold); padding-top: 12px; margin: 0; max-width: none; }
.notes.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } /* deux notes (21/10/2026 : la troisième doublait une carte) */
.schema { margin-top: 40px; }
.schema h3 { margin-bottom: 16px; font-size: 26px; color: var(--brassd); }
.schema h3 .lbl, .schema .lbl.mono { margin-top: 4px; }
.schema .two, .schema > p { margin-top: 20px; }
.schema .two p, .schema > p { font-size: 15px; }
.legend { margin-top: 14px; font-size: 13.5px; }
.key { display: inline-block; margin-right: 16px; padding-left: 16px; position: relative; }
.key::before { content: ""; position: absolute; left: 0; top: .4em; width: 9px; height: 9px; }
.k-rv.key::before { background: var(--muted); } .k-as.key::before { background: var(--gold); }
pre.json { background: var(--code); color: #E8E3D6; border: 1px solid #4A4740; font-size: 12.5px; line-height: 1.7; padding: 24px 26px; white-space: pre; box-shadow: var(--shadow); }
pre.json .k-as { color: var(--gold); } pre.json .k-rv { color: #CFC9BB; }
.band.dark pre.json { border-color: var(--onrule); }
.band.dark .legend { color: var(--onband2); }
.band.dark .k-rv.key::before { background: var(--onband2); }
.s-anatomy > .wrap > .fine { margin-top: 10px; }
.keeping .status { margin-top: 12px; font-size: 13px; color: var(--brassd); }
.steps { margin-top: 16px; padding-left: 0; max-width: var(--measure); list-style: none; counter-reset: step; }
.steps li { font-size: 15.5px; display: grid; grid-template-columns: 2.4em minmax(0, 1fr); gap: 0 12px; counter-increment: step; padding: 12px 0; border-top: 1px solid var(--rule); margin: 0; }
.steps li::before { content: counter(step); font-family: var(--serif); font-size: 32px; line-height: 1; color: var(--brassd); }
.s-dev .btn { margin-top: 24px; }
.s-dev h2 { font-size: clamp(26px, 3vw, 34px); }
.qa > div { border-top: 1px solid var(--rule); padding: 14px 0; }
.qa dt { font-family: var(--serif); font-size: 20px; color: var(--ink); margin-bottom: 6px; }
.qa dd { font-size: 15px; }

/* examples */
.examples li h3, .examples li h2 { font-size: 21px; }
.ex-rows > div { display: flex; justify-content: space-between; gap: 16px; padding: 7px 0; border-bottom: 1px solid var(--rule2); font-size: 14px; }
.ex-rows dt { color: var(--muted); } .ex-rows dd { color: var(--ink); text-align: right; }
.s-examples > .wrap > .fine { margin-top: 24px; }
.record-card { max-width: 720px; background: var(--white); border: 0; box-shadow: var(--shadow); }
.rc-head { display: flex; justify-content: space-between; gap: 16px; padding: 16px 22px; background: var(--band); color: var(--onband); border-bottom: 4px solid var(--gold); font-size: 12px; }
.rc-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rc-stats > div { padding: 18px 22px; border-right: 1px solid var(--rule); }
.rc-stats > div:last-child { border-right: 0; }
.rc-stats dt { font-size: 11px; letter-spacing: .1em; color: var(--muted); margin-bottom: 6px; }
.rc-stats .big { display: block; font-family: var(--serif); font-size: 40px; line-height: 1; color: var(--brassd); }
.rc-stats .fine { display: block; margin-top: 6px; font-size: 12.5px; }
.rc-q, .rc-follow { padding: 16px 22px; border-top: 1px solid var(--rule); }
.rc-q { background: var(--cream); border-left: 4px solid var(--gold); }
.rc-q .lbl { color: var(--text); }
.rc-q .q { font-family: var(--serif); font-size: 23px; line-height: 1.3; color: var(--ink); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-block; border: 1px solid var(--rule); padding: 3px 10px; font-size: 12.5px; color: var(--ink); }
.chip:first-child { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.rc-foot { padding: 14px 22px; border-top: 1px solid var(--ink); background: #FBFAF6; font-size: 11.5px; color: var(--text); line-height: 1.7; }
.files { list-style: none; padding: 0; margin: 20px 0 0; border-top: 2px solid var(--band); max-width: 560px; }
.files li { margin: 0; padding: 12px 0; border-bottom: 1px solid var(--rule); font-size: 16px; }

/* governance */
.s-licence .page-head { margin-bottom: 36px; }
.s-comments h2 { color: #FFFFFF; }
.s-comments .actions a { display: inline-block; border: 1px solid var(--ink); color: var(--ink); padding: 12px 22px; font-size: 15px; }
.s-comments .actions a:hover { background: var(--ink); color: #fff; text-decoration: none; }
.band.dark.s-comments .actions a { background: var(--gold); border-color: var(--gold); color: var(--ink); text-decoration: none; }
.band.dark.s-comments .actions a:hover { background: #FFFFFF; border-color: #FFFFFF; }
.licences li h3, .licences li h2 { font-size: 21px; }
.s-comments .actions { margin-top: 20px; }

/* documents: spec, guide, glossary, legal, privacy */
.docgrid { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 40px 56px; align-items: start; margin-top: 40px; }
.toc { position: sticky; top: 24px; font-size: 14px; background: var(--band); color: var(--onband); border-top: 5px solid var(--gold); padding: 14px 18px 16px; }
.toc ol { list-style: none; padding: 0; margin: 0; }
.toc li { margin: 0; padding: 8px 0; border-bottom: 1px solid var(--onrule); }
.toc li:last-child { border-bottom: 0; }
.toc a { color: var(--onband); }
.toc a:hover { color: var(--gold); text-decoration: none; }
.toc a:focus-visible { outline-color: var(--gold); }
.doc { max-width: 820px; background: var(--white); padding: clamp(24px, 4vw, 56px); border-top: 5px solid var(--band); box-shadow: var(--shadow); }
.doc h2 { margin-top: 52px; margin-bottom: 14px; font-size: 30px; }
.doc h2 .num { font-family: var(--serif); font-size: 30px; color: var(--brassd); margin-right: 14px; vertical-align: baseline; }
.doc > h2:first-child, .doc > div > h2:first-child { margin-top: 0; }
.doc h3 { margin-top: 30px; margin-bottom: 8px; font-size: 22px; color: var(--brassd); }
.doc.plain h2 { margin-top: 30px; margin-bottom: 8px; font-size: 22px; }
.doc h4 { margin-top: 20px; margin-bottom: 6px; }
.doc p { font-size: 15.5px; }
.doc p + p { margin-top: 12px; }
.doc ul, .doc ol { margin: 10px 0; }
.doc li { font-size: 15.5px; }
.doc pre { margin: 14px 0; background: var(--paper); }
.doc .tablewrap { overflow-x: auto; margin: 14px 0 20px; }
.doc td, .doc th { overflow-wrap: normal; }
@media (max-width: 640px) {
  .doc .tablewrap { background: linear-gradient(to left, rgba(28,27,25,.14), rgba(28,27,25,0) 28px) right / 28px 100% no-repeat; background-attachment: local; border-right: 1px solid var(--rule); }
  .doc .tablewrap::after { content: "Faire glisser pour voir la suite"; display: block; font-size: 12.5px; color: var(--muted); padding: 8px 0 0; font-family: var(--sans); }
  html[lang="en"] .doc .tablewrap::after { content: "Swipe to see the rest"; }
}
.doc table { min-width: 520px; font-size: 14.5px; }
.doc th { text-align: left; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: normal; padding: 8px 12px 8px 0; border-bottom: 2px solid var(--band); vertical-align: bottom; }
.doc td { padding: 9px 12px 9px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.doc .note, .doc .fine { margin-top: 10px; }
.doc .meta { font-size: 13px; color: var(--muted); }
.doc dl dt { font-family: var(--mono); font-size: 13.5px; color: var(--ink); margin-top: 14px; }
.doc dl dd { font-size: 15px; }

/* next, footer */
.next { padding-block: 32px; background: var(--white); border-top: 1px solid var(--rule); }
.next p { font-size: 15px; }
.next-k { color: var(--muted); margin-right: 10px; }
.next a { font-family: var(--serif); font-size: 24px; color: var(--brassd); }
.next a:hover { color: var(--ink); }
.foot { padding-inline: var(--gutter); padding-block: 52px 36px; background: var(--band); color: var(--onband); border-top: 6px solid var(--gold); }
.fcols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 48px; }
.foot .ft-h { font-family: var(--serif); font-size: 20px; color: var(--gold); margin-bottom: 12px; }
.foot p { font-size: 14.5px; margin-bottom: 12px; }
.foot ul { list-style: none; padding: 0; margin: 0; }
.foot li { margin: 0; padding: 4px 0; font-size: 14.5px; }
.foot a { color: var(--onband); }
.foot a:hover { color: var(--gold); text-decoration: none; }
.foot a:focus-visible { outline-color: var(--gold); }
.foot li.fam { display: grid; gap: 2px; padding: 6px 0; }
.foot li.fam span { font-size: 13px; color: var(--onband2); }
.foot .bottom { margin-top: 36px; padding-top: 16px; border-top: 1px solid #3A342A; font-size: 13px; color: var(--onband2); display: flex; flex-direction: column; gap: 6px; }

/* responsive */
@media (max-width: 920px) {
  .stance-grid, .two, .docgrid { grid-template-columns: minmax(0, 1fr); }
  .stance-body { border-left: 0; padding-left: 0; border-top: 1px solid var(--onrule); padding-top: 24px; }
  .toc { position: static; }
  .cols4, .principles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cols3, .terms, .words, .rc-stats, .notes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .band { padding-block: 44px; }
  .cols3, .cols4, .terms, .words, .principles, .fcols, .rc-stats, .notes { grid-template-columns: minmax(0, 1fr); }
  .notes.n2 { grid-template-columns: minmax(0, 1fr); }
  .rc-stats > div { border-right: 0; border-bottom: 1px solid var(--rule); }
  .site-head .wrap { padding-block: 12px; }
  .brand .tag { display: none; }
  .fig { padding: 12px; }
  .fig .diagram { display: none; }
  .fig .diagram-v { display: block; max-width: 420px; margin-inline: auto; }
  .doc { padding: 20px 16px; }
  .rc-head { flex-wrap: wrap; }
}

.s-words .page-head { margin-bottom: 36px; }

/* ===== planches intégrées (20/10/2026) : parcours d'Elena, qui fait quoi, ce qui le distingue, conserver et vérifier,
   anatomie, schéma technique, sécurité. Couleurs d'état (vert, rouge, ardoise) réservées aux résultats de vérification. */
:root { --ok: #2F6B3A; --okbg: #EAF3EC; --okrule: #BFD9C5; --bad: #9B2C2C; --badbg: #F8ECEA; --badrule: #E4BDBD; --slate: #5B6470; --slatebg: #EEF0F2; --slaterule: #CCD2DA; --em: #7A5C1E; --embg: #F7F1E3; --sg: #E9A83A; --sgbg: #FBF3E2; }

/* mention commune en fin de section : source et téléchargement de la planche */
.plate-foot { margin-top: 32px; padding-top: 14px; border-top: 1px solid var(--rule); font-size: 13.5px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 6px 24px; justify-content: space-between; max-width: none; }
.plate-foot p { max-width: none; margin: 0; }
.band.dark .plate-foot { border-top-color: var(--onrule); color: var(--onband2); }
.plate-foot a { white-space: nowrap; }
.note-ex { font-size: 13.5px; color: var(--muted); max-width: 60em; margin-top: 24px; }

/* légende des acteurs : émetteur (laiton), personne qui signe (or), prévu (pointillé) */
.k-em.key::before { background: var(--em); } .k-sg.key::before { background: var(--sg); } .k-pl.key::before { background: transparent; border: 1px dashed var(--muted); box-sizing: border-box; }
.band.dark .k-pl.key::before { border-color: var(--onband2); }

/* ----- accueil : le parcours d'Elena ----- */
.s-path { padding-block: clamp(48px, 7vw, 84px); }
.s-path .sec-head { max-width: 860px; }
.jr-time { margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 14px 18px; background: var(--white); border: 1px solid var(--rule); font-size: 14px; color: var(--text); }
.jr-time .t { font-family: var(--mono); font-size: 13.5px; color: var(--ink); }
.jr-time .t.em { color: var(--em); } .jr-time .t.sg { color: var(--brassd); }
.jr-time .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; vertical-align: -1px; }
.jr-time .dot.em { background: var(--em); } .jr-time .dot.sg { background: var(--sg); }
.jr-time .sep { flex: 1 1 24px; height: 0; border-top: 2px solid var(--rule); min-width: 24px; }
.jr-time .fine { margin: 0; }
.jr-steps { list-style: none; padding: 0; margin: 40px 0 0; counter-reset: none; }
.jr-step { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px 48px; padding: 36px 0; border-top: 1px solid var(--rule); align-items: start; margin: 0; }
.jr-step:first-child { border-top: 0; padding-top: 8px; }
.jr-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.jr-num { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 24px; font-weight: 500; line-height: 1; background: var(--ink); color: #FFFFFF; }
.jr-num.em { background: var(--em); color: #FFFFFF; } .jr-num.sg { background: var(--sg); color: var(--ink); }
.jr-actor { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.jr-actor.em { color: var(--em); } .jr-actor.sg { color: var(--brassd); }
.jr-step h3 { font-size: 26px; margin-bottom: 10px; }
.jr-text > p { font-size: 16px; }
.jr-out { margin-top: 22px; padding: 14px 16px; border: 1px solid var(--rule); border-left: 4px solid var(--band); background: var(--white); max-width: var(--measure); }
.jr-out .lbl { margin-bottom: 4px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--brassd); }
.jr-out p { font-size: 14.5px; max-width: none; }
.jr-out.em { border-left-color: var(--em); background: var(--embg); } .jr-out.sg { border-left-color: var(--sg); background: var(--sgbg); }
.jr-out code { font-size: 13px; }

/* écrans d'Elena : fenêtres reproduites en HTML, ombre douce */
.screen { background: var(--white); border: 1px solid var(--rule); box-shadow: var(--shadow); font-size: 14.5px; color: var(--text); }
.screen.em { border-color: #D9C9A6; } .screen.sg { border-color: #EACB8D; }
.scr-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--rule); font-size: 13.5px; color: var(--ink); background: var(--paper); }
.scr-bar .who { font-family: var(--mono); font-size: 13px; color: var(--ink); }
.screen.em .scr-bar .who { color: var(--em); }
.scr-bar .tag { display: inline-block; padding: 2px 8px; border: 1px solid var(--okrule); background: var(--okbg); color: var(--ok); font-size: 12.5px; }
.scr-body { padding: 16px 18px 18px; }
.scr-body > * + * { margin-top: 12px; }
.scr-body p { max-width: none; }
.scr-label { display: block; font-size: 13px; color: var(--ink); margin-bottom: 4px; }
.scr-field { display: block; padding: 8px 10px; background: var(--paper); border: 1px solid var(--rule); font-size: 14px; color: var(--ink); line-height: 1.5; min-height: 2.4em; }
.scr-field.sg { background: var(--sgbg); border-color: #EACB8D; color: var(--brassd); }
.scr-field.empty { min-height: 2.3em; }
.scr-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.scr-row .scr-field { min-height: 0; }
.scr-btn { display: block; width: 100%; text-align: center; padding: 11px 14px; background: var(--em); color: #FFFFFF; font-size: 15px; }
.scr-btn.sg { background: var(--brassd); }
.scr-note { font-size: 13.5px; color: var(--muted); }
.scr-quote { padding: 12px 14px; background: var(--paper); border-left: 3px solid var(--rule); font-size: 15px; color: var(--ink); }
.scr-radio { list-style: none; padding: 10px 12px; margin: 0; border: 1px solid var(--rule); background: var(--white); }
.scr-radio li { margin: 0; padding: 3px 0 3px 26px; position: relative; font-size: 14.5px; max-width: none; }
.scr-radio li::before { content: ""; position: absolute; left: 2px; top: .45em; width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--muted); background: var(--white); box-sizing: border-box; }
.scr-radio li.on { color: var(--brassd); }
.scr-radio li.on::before { border: 4px solid var(--brassd); }
.scr-sig { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 1px solid var(--rule); background: var(--white); }
.scr-sig svg { width: 150px; height: 44px; flex: 0 0 auto; }
.scr-sig span { font-size: 13.5px; color: var(--muted); }
.scr-check { list-style: disc; padding: 0 0 0 1.2em; margin: 0; }
.scr-check li { margin: 0; padding: 3px 0; font-size: 14.5px; max-width: none; }
.scr-check li + li { margin-top: 0; }
/* rapport affiché à l'étape 2 */
.rep-reg { padding: 12px 14px; background: var(--paper); border: 1px solid var(--rule); font-size: 13.5px; line-height: 1.55; color: var(--ink); }
.rep-reg p { margin: 0; max-width: none; }
.rep-reg p + p { margin-top: 2px; }
.rep-reg .h { color: var(--ink); font-family: var(--serif); font-size: 17px; margin-bottom: 4px; }
.rep-toc { list-style: none; padding: 0; margin: 0; font-size: 14px; color: var(--ink); }
.rep-toc li { margin: 0; max-width: none; }
.rep-toc li + li { margin-top: 2px; }
.rep-toc ul { list-style: none; padding-left: 16px; margin: 2px 0 0; color: var(--text); font-size: 13.5px; }
.rep-find { padding: 12px 14px; border: 1px solid var(--rule); font-size: 13.5px; line-height: 1.55; }
.rep-find p { max-width: none; margin: 0; } .rep-find p + p { margin-top: 4px; }
.rep-find .h { color: var(--ink); font-family: var(--serif); font-size: 17px; }
.rep-find .k { color: var(--ink); }
.rep-verdict { font-family: var(--serif); font-size: 19px; color: var(--em); }
/* sceaux */
.seal { border-top: 1px dashed var(--rule); padding-top: 14px; }
.seal-h { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.seal-mark { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; border: 2px solid var(--em); display: inline-flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: 12.5px; color: var(--em); position: relative; }
.seal-mark::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; border: 1px dashed currentColor; }
.seal-mark.sg { border-color: var(--brassd); color: var(--brassd); }
.seal-h .t { font-family: var(--serif); font-size: 19px; color: var(--em); line-height: 1.2; }
.seal-h .t.sg { color: var(--brassd); }
.seal-h .d { display: block; font-family: var(--mono); font-size: 13px; color: var(--text); margin-top: 2px; }
.kv { list-style: none; padding: 0; margin: 0; font-family: var(--mono); font-size: 13px; line-height: 1.6; color: var(--ink); }
.kv li { margin: 0; max-width: none; overflow-wrap: anywhere; }
.kv li + li { margin-top: 2px; }
.kv .k { color: var(--muted); margin-right: 6px; }
/* étape 3 : deux issues, puis boucle */
.jr-fork { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.jr-fork > div { padding: 16px 18px; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--ok); box-shadow: var(--shadow); }
.jr-fork > div.no { border-top-color: var(--brassd); }
.jr-fork .h { font-family: var(--serif); font-size: 21px; color: var(--ok); margin-bottom: 6px; }
.jr-fork .no .h { color: var(--brassd); }
.jr-fork p { font-size: 14.5px; max-width: none; }
.jr-loop { margin-top: 16px; padding: 14px 18px; border: 1px dashed var(--brassd); background: var(--sgbg); font-size: 14.5px; }
.jr-loop p { max-width: none; }
.jr-loop .h { font-family: var(--serif); font-size: 18px; color: var(--brassd); }
/* étape 5 : le fichier */
.file-card { background: var(--white); border: 1px solid var(--ink); box-shadow: var(--shadow); padding: 18px 20px; max-width: 420px; }
.file-card .name { font-family: var(--mono); font-size: 13.5px; color: var(--ink); overflow-wrap: anywhere; }
.file-card .kind { font-size: 13px; color: var(--muted); margin-top: 4px; }
.file-card .scr-check { margin-top: 12px; }
.file-card .scr-note { margin-top: 12px; padding: 10px 12px; background: var(--paper); }
.file-card .more { margin-top: 12px; font-size: 14.5px; }

/* ----- accueil : qui fait quoi, l'enveloppe ----- */
.s-roles .sec-head { max-width: 860px; }
.roles { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.roles li { margin: 0; background: var(--paper); border: 1px solid var(--rule); border-top: 4px solid var(--em); padding: 22px 24px 24px; }
.roles li:nth-child(2) { border-top-color: var(--sg); } .roles li:nth-child(3) { border-top-color: var(--band); }
.roles .lbl { margin-bottom: 8px; }
.roles h3 { font-size: 24px; margin-bottom: 10px; }
.roles p { font-size: 15px; max-width: none; }
.roles .quote { margin-top: 12px; font-family: var(--serif); font-size: 17px; color: var(--brassd); }
.env { margin-top: 48px; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px 56px; align-items: start; }
.env .fig { padding: 20px 22px 8px; }
.env figcaption { margin-top: 10px; padding: 0 0 12px; font-size: 13.5px; color: var(--muted); max-width: none; }
.env-in { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.env-in li { margin: 0; padding: 14px 16px; background: var(--white); border: 1px solid var(--rule); border-top: 3px solid var(--rule); }
.env-in li:nth-child(3) { border-top-color: var(--em); } .env-in li:nth-child(4) { border-top-color: var(--sg); }
.env-in .mono { font-size: 12.5px; color: var(--brassd); }
.env-in .h { font-family: var(--serif); font-size: 20px; color: var(--ink); margin: 2px 0 4px; }
.env-in p { font-size: 14px; max-width: none; }
.env-quote { margin-top: 24px; font-family: var(--serif); font-size: 22px; line-height: 1.4; color: var(--ink); max-width: 30em; }
.env-quote + p { margin-top: 10px; font-size: 15px; color: var(--muted); }
.cat-rule { margin-top: 20px; padding: 12px 16px; border: 1px solid var(--rule); background: var(--paper); font-size: 14.5px; color: var(--ink); max-width: none; }

/* ----- le format : ce qui le distingue ----- */
.dist { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.dist li { margin: 0; display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--band); padding: 20px 22px 22px; }
.dist li:nth-child(4n+2) { border-top-color: var(--gold); } .dist li:nth-child(4n+3) { border-top-color: var(--brass); } .dist li:nth-child(4n+4) { border-top-color: var(--rule); }
.dist .n { font-family: var(--serif); font-size: 40px; line-height: 1; color: var(--brassd); margin-bottom: 12px; }
.dist h3 { font-size: 21px; margin-bottom: 8px; }
.dist p { font-size: 14.5px; max-width: none; }
.dist .mono.fine { margin-top: auto; padding-top: 14px; font-size: 12.5px; color: var(--brassd); overflow-wrap: anywhere; }

/* ----- le format : conserver et vérifier ----- */
.s-keep .sec-head { max-width: 860px; }
.kp-part { margin-top: 56px; }
.kp-part:first-of-type { margin-top: 0; }
.kp-part > h3 { font-size: clamp(22px, 2.6vw, 28px); margin-bottom: 20px; }
.kp-part > h3 .lbl.mono { margin-bottom: 6px; }
.where { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.where li { margin: 0; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--band); padding: 20px 22px 22px; }
.where li:nth-child(2) { border-top-color: var(--brass); }
.where li.pl { border: 1px dashed var(--muted); border-top: 4px dashed var(--muted); background: var(--paper); }
.where .state { display: inline-block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ok); border: 1px solid var(--okrule); background: var(--okbg); padding: 2px 8px; margin-bottom: 12px; }
.where li.pl .state { color: var(--slate); border-color: var(--slaterule); background: var(--slatebg); border-style: dashed; }
.where h4 { font-size: 20px; margin-bottom: 8px; }
.where p { font-size: 14.5px; max-width: none; }
.where .path { margin-top: 12px; font-family: var(--mono); font-size: 12.5px; color: var(--ink); padding: 8px 10px; background: var(--paper); border: 1px solid var(--rule); overflow-wrap: anywhere; }
.where li.pl .path { border-style: dashed; background: var(--white); }
.kp-notes { margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
.kp-notes p { max-width: none; font-size: 15px; padding: 14px 16px; background: var(--white); border: 1px solid var(--rule); border-left: 4px solid var(--gold); }
/* logigramme des trois contrôles */
.flow-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px 32px; align-items: start; }
.flow { list-style: none; padding: 0; margin: 0; }
.flow > li { margin: 0; position: relative; padding-left: 0; }
.flow > li + li { margin-top: 0; padding-top: 28px; }
.flow > li + li::before { content: ""; position: absolute; left: 36px; top: 0; height: 28px; border-left: 2px solid var(--muted); }
.flow > li + li::after { content: ""; position: absolute; left: 31px; top: 18px; border: 6px solid transparent; border-top: 8px solid var(--muted); border-bottom: 0; }
.flow-node { padding: 14px 18px; background: var(--white); border: 1px solid var(--ink); font-size: 15px; color: var(--ink); max-width: 360px; }
.flow-node .h { font-family: var(--serif); font-size: 20px; }
.flow-node .s { display: block; font-size: 14px; color: var(--muted); }
.flow-step { padding: 16px 20px; background: var(--white); border: 1px solid var(--rule); border-left: 5px solid var(--em); box-shadow: var(--shadow); }
.flow-step .h { font-family: var(--serif); font-size: 22px; color: var(--ink); }
.flow-step .s { display: block; font-size: 14.5px; color: var(--text); margin-top: 2px; }
.flow-step .q { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--rule); font-size: 15px; color: var(--em); }
.flow-step.sg { border-left-color: var(--sg); }
.flow-step.sg .q { color: var(--brassd); }
.flow-out { list-style: none; padding: 0; margin: 12px 0 0 56px; position: relative; }
.flow-out::before { content: ""; position: absolute; left: -20px; top: -12px; bottom: -28px; border-left: 2px solid var(--muted); }
.flow-out li { margin: 0; position: relative; display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 4px 12px; align-items: start; padding: 5px 0; }
.flow-out li::before { content: ""; position: absolute; left: -20px; top: 20px; width: 14px; border-top: 2px solid var(--muted); }
.flow-out .br { font-family: var(--mono); font-size: 12.5px; color: var(--muted); padding: 10px 0 0 2px; }
.flow > li:last-child .flow-out::before { bottom: 0; }
.out { flex: 1; padding: 12px 14px; border: 1px solid var(--slaterule); background: var(--slatebg); font-size: 14px; color: var(--text); }
.out .h { font-family: var(--serif); font-size: 19px; line-height: 1.2; color: var(--slate); margin-bottom: 4px; }
.out.bad { border-color: var(--badrule); background: var(--badbg); } .out.bad .h { color: var(--bad); }
.out.ok { border-color: var(--okrule); background: var(--okbg); } .out.ok .h { color: var(--ok); }
.out.next { border-color: var(--rule); background: var(--white); } .out.next .h { color: var(--ink); }
.out p { max-width: none; margin: 0; }
.flow-side > div { padding: 16px 18px; background: var(--white); border: 1px solid var(--rule); font-size: 14.5px; }
.flow-side > .api-box { background: var(--band); border-color: var(--band); border-top: 4px solid var(--gold); }
.flow-side > div + div { margin-top: 16px; }
.flow-side .h { font-family: var(--serif); font-size: 20px; color: var(--ink); margin-bottom: 6px; }
.flow-side p { max-width: none; } .flow-side p + p { margin-top: 8px; }
.flow-side .rd { color: var(--bad); } .flow-side .gr { color: var(--ok); } .flow-side .sl { color: var(--slate); }
.api-box { background: var(--band); color: var(--onband); padding: 18px 20px; border-top: 4px solid var(--gold); }
.api-box .lbl { color: var(--gold); margin-top: 14px; }
.api-box .lbl:first-child { margin-top: 0; }
.api-box ul { list-style: none; padding: 0; margin: 0; }
.api-box li { margin: 0; padding: 3px 0 3px 20px; position: relative; font-size: 14px; color: var(--onband); max-width: none; }
.api-box li::before { content: ""; position: absolute; left: 1px; top: .55em; width: 8px; height: 5px; border-left: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(-45deg); }
.api-box ul.never li::before { width: 9px; height: 9px; border: 0; top: .5em; background: linear-gradient(45deg, transparent 42%, var(--onband2) 42%, var(--onband2) 58%, transparent 58%), linear-gradient(-45deg, transparent 42%, var(--onband2) 42%, var(--onband2) 58%, transparent 58%); transform: none; }
.api-box pre { background: var(--code); color: #E8E3D6; border: 1px solid #4A4740; font-size: 12.5px; line-height: 1.6; padding: 12px 14px; margin: 6px 0 0; white-space: pre-wrap; }
.api-box p { font-size: 13.5px; color: var(--onband2); max-width: none; margin-top: 12px; }
/* six mois plus tard */
.audit { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.audit > div { background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--ok); padding: 20px 22px 22px; }
.audit > div.bad { border-top-color: var(--bad); }
.audit .tag { display: inline-block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; padding: 2px 8px; border: 1px solid var(--okrule); background: var(--okbg); color: var(--ok); margin-right: 8px; }
.audit .bad .tag { border-color: var(--badrule); background: var(--badbg); color: var(--bad); }
.audit .tagline { font-size: 13.5px; color: var(--muted); margin-bottom: 12px; max-width: none; }
.audit h4 { font-size: 24px; margin-bottom: 10px; }
.audit p { font-size: 15px; max-width: none; }
.vpage { margin-top: 14px; border: 1px solid var(--rule); box-shadow: var(--shadow); background: var(--white); font-size: 14px; }
.vpage .bar { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 8px 14px; background: var(--paper); border-bottom: 1px solid var(--rule); font-family: var(--mono); font-size: 12.5px; color: var(--muted); }
.vpage .in { padding: 12px 14px; }
.vpage .okline { padding: 8px 12px 8px 30px; position: relative; border: 1px solid var(--okrule); background: var(--okbg); color: var(--ink); font-size: 14px; }
.vpage .okline + .okline { margin-top: 8px; }
.vpage .okline::before { content: ""; position: absolute; left: 11px; top: .95em; width: 9px; height: 5px; border-left: 2px solid var(--ok); border-bottom: 2px solid var(--ok); transform: rotate(-45deg); }
.vpage .okline .h { color: var(--ok); }
.vrows { margin-top: 12px; }
.vrows > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 4px 12px; padding: 7px 0; border-top: 1px solid var(--rule2); font-size: 14px; }
.vrows dt { color: var(--muted); max-width: none; } .vrows dd { color: var(--brassd); max-width: none; }
.vrows dd.plain { color: var(--ink); }
.vpage .in > .fine { margin-top: 12px; }
.audit .vpage + .fine { margin-top: 16px; }
.cmp { margin-top: 14px; border: 1px solid var(--rule); background: var(--white); font-size: 14px; }
.cmp .cap { padding: 7px 12px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ok); background: var(--okbg); border-bottom: 1px solid var(--okrule); }
.cmp.bad .cap { color: var(--bad); background: var(--badbg); border-bottom-color: var(--badrule); }
.cmp .vrows { margin: 0; padding: 4px 12px 8px; }
.cmp .vrows > div:first-child { border-top: 0; }
.cmp .vrows dd { color: var(--ink); }
.cmp.bad .vrows dd.chg { color: var(--bad); }
.cmp.bad .vrows dd.del { color: var(--bad); text-decoration: line-through; }
.cmp-notes { margin-top: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cmp-notes div { padding: 12px 14px; background: var(--paper); border: 1px solid var(--rule); font-size: 14px; }
.cmp-notes .h { color: var(--ink); display: block; margin-bottom: 4px; }
/* la portée de la preuve */
.scope { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.scope > div { padding: 20px 22px 22px; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--ok); }
.scope > div.mid { border-top-color: var(--slate); border-color: var(--slaterule); background: var(--slatebg); }
.scope > div.today { border-top-color: var(--band); }
.scope h4 { font-size: 21px; margin-bottom: 10px; }
.scope .mid h4 { color: var(--slate); }
.scope ul { list-style: none; padding: 0; margin: 0; }
.scope li { margin: 0; padding: 4px 0 4px 22px; position: relative; font-size: 14.5px; max-width: none; }
.scope li::before { content: ""; position: absolute; left: 2px; top: .6em; width: 8px; height: 5px; border-left: 2px solid var(--ok); border-bottom: 2px solid var(--ok); transform: rotate(-45deg); }
.scope .mid li::before { width: 10px; height: 0; border: 0; border-top: 2px solid var(--slate); top: .85em; transform: none; }
.scope p { font-size: 14.5px; max-width: none; }
.scope .state { display: inline-block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ok); border: 1px solid var(--okrule); background: var(--okbg); padding: 2px 8px; margin-bottom: 12px; }
.scope .today .fine { margin-top: 10px; }

/* ----- spécification : anatomie d'une trace (lecture guidée) ----- */
.an-key { font-size: 13.5px; color: var(--muted); margin: 12px 0 18px; }
.an-key .chip-f { margin-right: 10px; }
.chip-f { display: inline-block; font-family: var(--mono); font-size: 12.5px; padding: 2px 8px; border: 1px solid var(--em); color: var(--em); background: var(--embg); margin: 0 6px 6px 0; }
.chip-f.out { border-style: dashed; border-color: var(--muted); color: var(--muted); background: transparent; }
.chip-f.sg { border-color: var(--brassd); color: var(--brassd); background: var(--sgbg); }
.an-layers { list-style: none; padding: 0; margin: 0; }
.an-layers > li { margin: 0; padding: 16px 18px; border: 1px solid var(--rule); border-left: 5px solid var(--em); background: var(--paper); }
.an-layers > li + li { margin-top: 12px; }
.an-layers > li.sg { border-left-color: var(--sg); }
.an-layers > li.pf { border-left-color: var(--ink); }
.an-h { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.an-n { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 18px; background: var(--em); color: #FFFFFF; }
.sg .an-n { background: var(--sg); color: var(--ink); }
.pf .an-n { background: var(--ink); }
.an-h h3, .planche .an-h h3 { margin: 0; font-size: 21px; color: var(--ink); }
.an-h .fine { margin: 0; }
.planche .an-layers p { font-size: 14.5px; }
.an-pf { font-family: var(--mono); font-size: 12.5px; line-height: 1.7; color: var(--ink); overflow-wrap: anywhere; }
.an-pf .k { color: var(--muted); margin-right: 6px; }
.an-formula { margin-top: 10px; padding: 8px 12px; background: var(--white); border: 1px solid var(--rule); font-family: var(--mono); font-size: 12.5px; color: var(--ink); overflow-wrap: anywhere; }
.an-side { margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.an-side > div { padding: 14px 16px; border: 1px solid var(--rule); background: var(--white); border-top: 4px solid var(--em); font-size: 14px; }
.an-side > div.sg { border-top-color: var(--sg); }
.an-side .h { color: var(--em); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 6px; display: block; }
.an-side .sg .h { color: var(--brassd); }
.an-side .fields { font-family: var(--mono); font-size: 12.5px; line-height: 1.7; color: var(--ink); }
.planche .an-side p { font-size: 14px; margin-top: 6px; }
.planche .an-json { margin: 20px 0 0; background: var(--code); color: #E8E3D6; border: 1px solid #4A4740; font-size: 12.5px; line-height: 1.7; padding: 18px 18px 18px 46px; white-space: pre-wrap; box-shadow: var(--shadow); }
.an-json-h { margin-top: 24px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: baseline; }
.an-json-h .name { font-family: var(--mono); font-size: 14px; color: var(--ink); overflow-wrap: anywhere; }
.an-l { display: block; position: relative; padding-left: 12px; border-left: 3px solid #4A4740; }
.an-l::before { content: attr(data-n); position: absolute; left: -36px; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: var(--em); color: #FFFFFF; font-family: var(--serif); font-size: 14px; line-height: 22px; text-align: center; }
.an-l.l1, .an-l.l2, .an-l.l3, .an-l.l4 { border-left-color: var(--em); }
.an-l.l5, .an-l.l6 { border-left-color: var(--sg); }
.an-l.l5::before, .an-l.l6::before { background: var(--sg); color: var(--ink); }
.an-l.l6 { margin-left: 24px; }
.an-l.l6::before { left: -60px; }
.an-json .kf { color: var(--gold); }
.an-json .kf.sg { color: #F0C97A; }
.an-pl { margin-top: 20px; padding: 16px 18px; border: 1px dashed var(--muted); display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 12px 24px; align-items: start; }
.an-pl .lbl.mono { margin-bottom: 4px; }
.an-pl h3, .planche .an-pl h3 { margin: 0 0 6px; font-size: 20px; color: var(--ink); }
.planche .an-pl p { font-size: 14.5px; }
.planche .an-pl pre { margin: 0; background: var(--white); border: 1px dashed var(--muted); font-size: 12.5px; }
.an-boxes { margin-top: 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.an-boxes > div { padding: 16px 18px; border: 1px solid var(--rule); border-top: 4px solid var(--band); background: var(--white); }
.an-boxes > div:nth-child(2) { border-top-color: var(--gold); } .an-boxes > div:nth-child(3) { border-top-color: var(--brass); }
.an-boxes h3, .planche .an-boxes h3 { margin: 0 0 8px; font-size: 20px; color: var(--ink); }
.planche .an-boxes p, .planche .an-boxes li { font-size: 14.5px; }
.planche .an-boxes p + p { margin-top: 8px; }
.an-boxes .seal-pair { display: flex; gap: 8px; margin-bottom: 10px; }
.an-boxes .seal-mark { width: 34px; height: 34px; font-size: 11px; }
.an-boxes .rep-reg, .an-boxes .rep-toc { margin-top: 8px; }
.an-boxes .rep-verdict { margin-top: 10px; font-size: 17px; }
.planche .an-boxes ul.scr-check { margin: 0 0 10px; }
.hash-ex { margin-top: 10px; }
.hash-ex .s { font-size: 13.5px; color: var(--muted); display: block; margin-bottom: 3px; }
.hash-ex .v { display: block; font-family: var(--mono); font-size: 12.5px; line-height: 1.6; padding: 8px 10px; border: 1px solid var(--okrule); background: var(--okbg); color: var(--ink); overflow-wrap: anywhere; }
.hash-ex.bad .v { border-color: var(--badrule); background: var(--badbg); }
.hash-ex + .hash-ex { margin-top: 10px; }

/* ----- guide : schéma technique ----- */
.planche .seq-fig { margin: 16px 0 0; }
.planche .seq-fig figcaption { margin-top: 8px; font-size: 13.5px; color: var(--muted); max-width: none; }
.planche .fig .diagram-v { max-width: 460px; }
.reg-card { margin-top: 20px; padding: 16px 18px; border: 1px solid var(--rule); border-top: 4px solid var(--gold); background: var(--paper); }
.reg-card h3, .planche .reg-card h3 { margin: 0 0 8px; font-size: 21px; color: var(--ink); }
.reg-card .state { display: inline-block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ok); border: 1px solid var(--okrule); background: var(--okbg); padding: 2px 8px; margin-bottom: 10px; margin-right: 8px; }
.reg-card .state + .lbl.mono { display: inline; }
.reg-steps { list-style: none; padding: 0; margin: 12px 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.reg-steps li { margin: 0; padding: 10px 12px; border: 1px solid var(--rule); background: var(--white); font-size: 13.5px; max-width: none; }
.reg-steps li:nth-child(1) { border-top: 3px solid var(--sg); } .reg-steps li:nth-child(2) { border-top: 3px solid var(--rule); } .reg-steps li:nth-child(3) { border-top: 3px solid var(--em); }
.reg-steps .h { display: block; color: var(--ink); margin-bottom: 4px; }
.reg-steps code { font-size: 12px; display: block; white-space: pre-wrap; }
.api-list { list-style: none; padding: 0; margin: 12px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.api-list li { margin: 0; padding: 12px 14px; background: var(--band); color: var(--onband); border-top: 3px solid var(--gold); max-width: none; }
.api-list .h { display: block; font-family: var(--mono); font-size: 13.5px; color: var(--gold); margin-bottom: 6px; }
.api-list code { display: block; font-size: 12.5px; line-height: 1.6; color: #E8E3D6; white-space: pre-wrap; }
.api-list p, .planche .api-list p { font-size: 13.5px; color: var(--onband2); margin-top: 8px; }
.rules { margin-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.rules > div { padding: 16px 18px; border: 1px solid var(--rule); background: var(--paper); border-top: 4px solid var(--band); }
.rules > div:nth-child(2) { border-top-color: var(--gold); } .rules > div:nth-child(3) { border-top-color: var(--brass); } .rules > div:nth-child(4) { border-top-color: var(--rule); }
.rules h4, .planche .rules h4 { margin: 0 0 10px; font-size: 19px; color: var(--ink); }
.planche .rules p, .planche .rules li { font-size: 14px; }
.planche .rules ul { margin: 8px 0 0; padding-left: 1.1em; }
.planche .rules li + li { margin-top: 4px; }
.idparts { display: flex; flex-wrap: wrap; gap: 6px 4px; align-items: flex-start; margin-bottom: 10px; }
.idparts > span { display: inline-flex; flex-direction: column; align-items: center; }
.idparts .v { font-family: var(--mono); font-size: 13.5px; color: var(--ink); padding: 4px 8px; border: 1px solid var(--rule); background: var(--white); }
.idparts .l { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.idparts .dash { align-self: flex-start; padding: 4px 2px; font-family: var(--mono); color: var(--muted); }
.rules .mono.small, .planche .rules .mono.small { font-size: 12px; overflow-wrap: anywhere; color: var(--ink); display: block; margin-top: 8px; }
.labels { list-style: none; padding: 0; margin: 10px 0 0; }
.planche .labels li { margin: 0; padding: 5px 0; border-top: 1px solid var(--rule2); font-size: 13.5px; display: grid; grid-template-columns: minmax(0, 170px) minmax(0, 1fr); gap: 8px; }
.labels code { font-size: 12.5px; }
.rules .prof { margin-top: 8px; }
.rules .prof + .prof { margin-top: 10px; }
.rules .prof code { font-size: 12.5px; color: var(--em); }
.rules .prof span { display: block; font-size: 13.5px; color: var(--text); }
.never { list-style: none; padding: 0; margin: 8px 0 0; }
.planche .never li, .never li { margin: 0; padding: 3px 0 3px 22px; position: relative; font-size: 14px; max-width: none; }
.never li::before { content: ""; position: absolute; left: 2px; top: .6em; width: 8px; height: 5px; border-left: 2px solid var(--ok); border-bottom: 2px solid var(--ok); transform: rotate(-45deg); }
.rules .sub { margin-top: 14px; padding: 10px 12px; background: var(--white); border: 1px solid var(--rule); }
.rules .sub .h { display: block; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--brassd); margin-bottom: 4px; }
.next-fmt { margin-top: 12px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.next-fmt > div { padding: 16px 18px; border: 1px dashed var(--muted); background: var(--white); }
.next-fmt > div.rule { border-style: solid; border-color: var(--rule); background: var(--paper); }
.next-fmt .lbl.mono { display: flex; justify-content: space-between; gap: 8px; }
.next-fmt .state { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--slate); border: 1px dashed var(--slaterule); padding: 1px 6px; }
.next-fmt h4, .planche .next-fmt h4 { margin: 0 0 8px; font-size: 19px; color: var(--ink); }
.planche .next-fmt ul { margin: 0; padding-left: 1.1em; }
.planche .next-fmt li { font-size: 14px; }
.planche .next-fmt li + li { margin-top: 4px; }

/* ----- gouvernance : sécurité et vie privée ----- */
.s-sec .sec-head { max-width: 860px; }
.sec-part { margin-top: 48px; }
.sec-part > h3 { font-size: clamp(22px, 2.6vw, 28px); margin-bottom: 8px; }
.sec-part > .sub { margin-bottom: 18px; }
.th-key { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0 0 16px; font-size: 14px; color: var(--text); }
.th-key .key::before { border-radius: 50%; width: 11px; height: 11px; top: .35em; }
.th-key .key { margin-right: 0; padding-left: 18px; }
.th-key .k-ok::before { background: var(--ok); } .th-key .k-w::before { background: var(--gold); } .th-key .k-o::before { background: var(--slate); }
.th-key .n { font-family: var(--serif); font-size: 20px; color: var(--ink); margin-right: 4px; }
.tablewrap { overflow-x: auto; }
.threats { min-width: 720px; font-size: 14.5px; }
.threats th { text-align: left; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: normal; padding: 8px 14px 8px 0; border-bottom: 2px solid var(--band); vertical-align: bottom; }
.threats td { padding: 11px 14px 11px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.threats td:first-child, .threats th:first-child { width: 28px; padding-right: 10px; }
.threats td:nth-child(2) { color: var(--ink); min-width: 170px; }
.threats code { font-size: 13px; }
.th-s { display: inline-block; width: 12px; height: 12px; border-radius: 50%; vertical-align: -1px; }
.th-s.ok { background: var(--ok); } .th-s.w { background: var(--gold); } .th-s.o { background: var(--slate); }
@media (max-width: 640px) {
  .s-sec .tablewrap { background: linear-gradient(to left, rgba(28,27,25,.14), rgba(28,27,25,0) 28px) right / 28px 100% no-repeat; background-attachment: local; border-right: 1px solid var(--rule); }
  .s-sec .tablewrap::after { content: "Faire glisser pour voir la suite"; display: block; font-size: 12.5px; color: var(--muted); padding: 8px 0 0; }
  html[lang="en"] .s-sec .tablewrap::after { content: "Swipe to see the rest"; }
}
.limits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.limits > div { padding: 20px 22px 22px; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--band); }
.limits > div:nth-child(2) { border-top-color: var(--gold); }
.limits > div.pl { border: 1px dashed var(--muted); border-top: 4px dashed var(--muted); background: var(--paper); }
.limits h4 { font-size: 21px; margin-bottom: 8px; }
.limits .state { display: inline-block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--slate); border: 1px dashed var(--slaterule); padding: 1px 6px; margin-left: 8px; vertical-align: middle; }
.limits p { font-size: 14.5px; max-width: none; }
/* vie privée : ce que reçoit chaque point, ce qui est gardé */
.priv-in { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.priv-in li { margin: 0; padding: 16px 18px 20px; background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--em); position: relative; max-width: none; }
.priv-in li:nth-child(1) { border-top-color: var(--band); }
.priv-in li::after { content: ""; position: absolute; left: 50%; bottom: -28px; height: 28px; border-left: 2px solid var(--em); }
.priv-in li:nth-child(4)::after { border-left-color: var(--slate); }
.priv-in .h { display: block; font-family: var(--mono); font-size: 13.5px; color: var(--em); margin-bottom: 6px; }
.priv-in li:nth-child(1) .h { font-family: var(--sans); font-size: 15px; color: var(--ink); }
.priv-in .what { font-size: 14.5px; color: var(--ink); }
.priv-in .never-p { font-size: 13.5px; color: var(--muted); margin-top: 4px; }
.priv-srv { margin-top: 28px; padding: 14px 18px; text-align: center; border: 1px solid var(--em); background: var(--embg); font-size: 15px; color: var(--ink); }
.priv-srv .h { color: var(--em); }
.priv-out { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; margin-top: 0; }
.priv-out > div { padding: 18px 20px; position: relative; margin-top: 44px; }
.priv-out > div::before { content: ""; position: absolute; left: 44px; top: -44px; height: 44px; border-left: 2px solid var(--em); }
.priv-out > div.pv::before { border-left-style: dashed; border-left-color: var(--slate); }
.priv-out .arrow-l { position: absolute; left: 54px; top: -32px; font-size: 12.5px; color: var(--em); }
.priv-out .pv .arrow-l { color: var(--slate); }
.priv-out .keeps { background: var(--band); color: var(--onband); border-top: 4px solid var(--gold); }
.priv-out .keeps .h { color: #FFFFFF; }
.priv-out .keeps p { color: var(--onband); }
.priv-out .keeps .fine { color: var(--onband2); }
.priv-out .pv { background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--slate); }
.priv-out .h { display: block; font-family: var(--serif); font-size: 20px; margin-bottom: 4px; color: var(--ink); }
.priv-out p { font-size: 14.5px; max-width: none; }
.priv-out .fine { margin-top: 4px; }
.bignums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.bignums > div { padding: 24px 26px 26px; background: var(--band); color: var(--onband); border-top: 5px solid var(--gold); }
.bignums .lbl { color: var(--gold); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.bignums .big { display: block; font-family: var(--serif); font-size: clamp(44px, 4.6vw, 60px); line-height: 1; color: #FFFFFF; margin: 6px 0 8px; }
.bignums .big.s { font-size: clamp(30px, 3vw, 40px); line-height: 1.1; }
.bignums .sub { color: var(--onband); font-size: 15px; margin-bottom: 12px; }
.bignums ul { padding-left: 1.1em; margin: 0; }
.bignums li { font-size: 14px; color: var(--onband); max-width: none; }
.bignums sup { font-size: 11px; line-height: 0; }
.bignums li + li { margin-top: 5px; }
.band.dark .bignums > div { background: var(--band2); border: 1px solid var(--onrule); border-top: 5px solid var(--gold); }

/* responsive des planches */
@media (max-width: 1100px) {
  .dist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .priv-in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .priv-in li::after { display: none; }
  .priv-srv { margin-top: 20px; }
}
@media (max-width: 920px) {
  .jr-step { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .env, .flow-grid, .audit, .scope, .roles, .where, .limits, .an-pl, .rules, .next-fmt, .reg-steps, .api-list, .bignums, .kp-notes, .priv-out { grid-template-columns: minmax(0, 1fr); }
  .env .fig { order: 0; }
  .threats { min-width: 640px; }
}
@media (max-width: 640px) {
  .dist, .env-in, .jr-fork, .cmp-notes, .an-side, .an-boxes, .priv-in, .scr-row { grid-template-columns: minmax(0, 1fr); }
  .jr-step { padding: 28px 0; }
  .jr-step h3 { font-size: 23px; }
  .scr-body { padding: 14px 14px 16px; }
  .flow-grid { gap: 20px; }
  .flow-out { margin-left: 36px; }
  .flow-out li { grid-template-columns: minmax(0, 1fr); }
  .flow-out .br { padding-top: 6px; }
  .flow-out li::before { top: 14px; }
  .flow > li + li::before { left: 16px; }
  .flow > li + li::after { left: 11px; }
  .flow-br { left: 30px; }
  .vrows > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .vrows dt { font-size: 12.5px; }
  .an-json, .planche .an-json { padding-left: 40px; font-size: 12.5px; }
  .an-l.l6 { margin-left: 12px; } .an-l.l6::before { left: -48px; }
  .plate-foot { flex-direction: column; }
  .priv-out > div { margin-top: 28px; }
  .priv-out > div::before { height: 28px; top: -28px; }
  .priv-out .arrow-l { top: -22px; }
  .bignums .big { font-size: 44px; }
}
/* compléments */
.jr-steps li, .roles li, .dist li, .where li, .flow > li, .flow-out li, .an-layers > li, .labels li, .reg-steps li, .api-list li, .priv-in li, .env-in li, .scr-radio li, .scr-check li, .kv li, .never li, .scope li, .api-box li, .bignums li, .rep-toc li { max-width: none; }
.env-seals { margin-top: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
.env-seals > div { padding: 12px 14px; border: 1px solid var(--rule); border-left: 4px solid var(--em); background: var(--white); }
.env-seals > div.sg { border-left-color: var(--sg); }
.env-seals dt { font-family: var(--serif); font-size: 19px; color: var(--em); max-width: none; }
.env-seals .sg dt { color: var(--brassd); }
.env-seals dd { font-size: 14px; max-width: none; margin-top: 4px; }
.env-seals dd.mono { font-size: 12.5px; color: var(--ink); }
.flow > li { position: relative; }
.flow-br { position: absolute; left: 50px; top: 4px; font-family: var(--mono); font-size: 12.5px; color: var(--muted); }
.an-sec .wrap > h2:first-of-type { margin-top: 0; }
.an-sec .wrap > .lbl.mono { margin-bottom: 8px; }
.an-sec .wrap h3 { margin-top: 28px; }
.an-sec .wrap .an-layers h3, .planche .an-boxes h3, .planche .an-pl h3 { margin-top: 0; }
.seq-sec .wrap > h2:first-child { margin-top: 0; }
.seq-sec .wrap > h3 { margin-top: 36px; }
.seq-sec .wrap > h3 + .lbl.mono { margin-top: -4px; margin-bottom: 10px; }
.planche .reg-card h3, .planche .rules h4, .planche .next-fmt h4 { margin-top: 0; }
.planche .rules p + p { margin-top: 8px; }
.an-sec .wrap p + p, .seq-sec .wrap p + p { margin-top: 10px; }
.an-sec .wrap .legend, .seq-sec .wrap .legend { margin-top: 12px; }
.planche .an-layers p + p { margin-top: 6px; }
.planche .an-pf { margin-top: 0; }
.planche .an-formula { margin-top: 8px; }
.an-key .chip-f { margin-bottom: 0; }
.an-layers li p:not(.an-pf):not(.an-formula) { max-width: none; }
.band.dark .dist li { background: var(--band2); border-color: var(--onrule); }
.band.dark .dist h3 { color: #FFFFFF; } .band.dark .dist .n { color: var(--gold); } .band.dark .dist .mono.fine { color: var(--gold); }
.sec-part .sub { max-width: 60em; }
.sec-part .sub a { text-decoration: underline; text-decoration-color: rgba(122,92,30,.45); }
.limits h4 .state { font-family: var(--sans); }
.kp-part h3 .lbl.mono { display: block; }
.s-path .sec-head .legend, .s-keep .sec-head .legend, .s-sec .sec-head .legend { margin-top: 14px; }
.screen p + p, .screen div + div, .screen p + div, .screen div + p, .screen ul + p, .screen p + ul, .screen div + ul { margin-top: 12px; }
.screen .scr-row div + div { margin-top: 0; }
.screen .scr-label + p, .screen p.scr-note + .scr-label { margin-top: 6px; }
.jr-screen .screen .seal { margin-top: 14px; }
.file-card p + p { margin-top: 0; }
.priv { margin: 0; }
.priv figcaption { margin-top: 20px; max-width: none; }
.jr-time, .screen p, .jr-screen p, .flow-side p, .flow-step p, .out p, .api-box p, .priv-srv, .th-key, .an-key, .an-json-h p, .idparts, .rules .prof, .reg-card > p, .next-fmt .lbl.mono, .kp-part h3, .jr-head { max-width: none; }
.screen .rep-reg p + p { margin-top: 2px; }
.screen .rep-find p + p { margin-top: 4px; }
.scr-sub { font-size: 14px; color: var(--brassd); }
.planche .an-json code, .api-list code, .reg-steps code { font-size: inherit; }

/* ===== couleurs des planches (20/10/2026, 19 h 25) : les sept sections intégrées reprennent le système visuel des planches
   (papier gris-bleu à points, cartes blanches, bleu pour l'émetteur, ocre pour la personne qui signe, vert / rouge / ardoise
   pour le résultat, pointillés pour le prévu, panneaux marine). Typographie et tailles du site inchangées.
   Les quatre schémas de Le format prennent le même code couleur des acteurs. */
:root {
  --pl-em: #1D4ED8; --pl-em-bg: #EAF0FD; --pl-em-ink: #1E3A8A; --pl-em-rule: #B7C8F5;
  --pl-sg: #A14F06; --pl-sg-bg: #FBF1E6; --pl-sg-ink: #7A3B04; --pl-sg-rule: #E7C29A;
  --pl-ok: #0F6B4A; --pl-ok-bg: #E7F4EE; --pl-ok-rule: #A6D5BF;
  --pl-bad: #B42318; --pl-bad-bg: #FCEBEA; --pl-bad-rule: #F1B5AF;
  --pl-slate: #5B6779; --pl-slate-bg: #EEF1F5; --pl-dash: #98A2B3;
  --pl-title: #0B1626; --pl-text: #1F2A3A; --pl-sec: #475467;
  --pl-rule: #D5DCE5; --pl-rule-soft: #E4E9F0;
  --pl-bg: #F3F5F8; --pl-dot: #D5DCE5; --pl-surface: #FFFFFF; --pl-soft: #F7F8FA;
  --pl-navy: #0B1626; --pl-navy2: #121F33; --pl-navy-rule: #26344A; --pl-on-navy: #E8EDF5; --pl-on-navy2: #AEB9C9; --pl-on-navy-code: #C9D3E0;
  --pl-on-navy-blue: #9DBBFF; --pl-on-navy-ocre: #F2B35B;
  --pl-shadow: 0 1px 2px rgba(11,22,38,.06), 0 8px 24px rgba(11,22,38,.06);
  --pl-radius: 10px;
}
/* les jetons du site prennent, dans une planche, les valeurs des planches */
.planche {
  --ink: var(--pl-title); --text: var(--pl-text); --muted: var(--pl-sec); --rule: var(--pl-rule); --rule2: var(--pl-rule-soft);
  --paper: var(--pl-soft); --white: var(--pl-surface); --cream: var(--pl-soft);
  --band: var(--pl-navy); --band2: var(--pl-navy2); --onband: var(--pl-on-navy); --onband2: var(--pl-on-navy2); --onrule: var(--pl-navy-rule); --code: var(--pl-navy2);
  --brass: var(--pl-dash); --brassd: var(--pl-sg); --gold: var(--pl-sg);
  --em: var(--pl-em); --embg: var(--pl-em-bg); --sg: var(--pl-sg); --sgbg: var(--pl-sg-bg);
  --ok: var(--pl-ok); --okbg: var(--pl-ok-bg); --okrule: var(--pl-ok-rule);
  --bad: var(--pl-bad); --badbg: var(--pl-bad-bg); --badrule: var(--pl-bad-rule);
  --slate: var(--pl-slate); --slatebg: var(--pl-slate-bg); --slaterule: var(--pl-dash);
  --shadow: var(--pl-shadow);
  color: var(--pl-text);
}
/* le fond de planche : une bande pleine largeur dans les pages, une bande bord à bord dans l'article des documents */
.band.planche { background-color: var(--pl-bg); background-image: radial-gradient(var(--pl-dot) 1px, transparent 1.2px); background-size: 24px 24px; }
.band.planche { border-top: 1px solid var(--pl-rule); }
.planche .sec-head > h2::before { background: var(--pl-title); }
.planche .lbl.mono { color: var(--pl-sec); }
.planche a:not(.btn) { color: var(--pl-em-ink); text-decoration-color: rgba(30,58,138,.4); }
.planche a:not(.btn):hover { color: var(--pl-title); text-decoration-color: currentColor; }
.planche .k-pl.key::before { border-color: var(--pl-dash); }
.planche .kp-notes p + p { margin-top: 0; }

/* cartes blanches à filet, coins arrondis (les filets décoratifs de couleur du site disparaissent) */
.planche :is(.jr-time, .jr-out, .roles li, .env-in li, .dist li, .where li, .kp-notes p, .flow-side > div, .audit > div, .scope > div,
  .an-layers > li, .an-boxes > div, .reg-card, .rules > div, .limits > div, .priv-in li) { background: var(--pl-surface); border: 1px solid var(--pl-rule); border-radius: var(--pl-radius); }
.planche :is(.screen, .file-card, .vpage, .flow-step, .roles li, .an-json, .fig, .tablewrap) { box-shadow: var(--pl-shadow); }
.planche .fig { background: var(--pl-surface); border: 1px solid var(--pl-rule); border-radius: var(--pl-radius); }
.planche :is(.where .state, .scope .state, .reg-card .state, .audit .tag, .limits .state, .next-fmt .state, .scr-bar .tag, .chip-f) { border-radius: 4px; }
.planche :is(.scr-field, .where .path, .an-formula, .idparts .v, .hash-ex .v, .vpage .okline) { border-radius: 6px; }
.planche :is(.scr-btn, .scr-quote, .scr-radio, .scr-sig, .rep-reg, .rep-find, .out, .flow-node, .cmp, .cmp-notes div, .file-card .scr-note, .reg-steps li, .rules .sub) { border-radius: 8px; }
.planche :is(.vpage, .cmp) { overflow: hidden; }

/* accueil · parcours d'Elena */
.planche .jr-step { border-top-color: var(--pl-rule); }
.planche .jr-time .t.em { color: var(--pl-em-ink); } .planche .jr-time .t.sg { color: var(--pl-sg); }
.planche .jr-num.sg { color: #FFFFFF; }
.planche .jr-out .lbl { color: var(--pl-sec); }
.planche .jr-out.em { background: var(--pl-em-bg); border-color: var(--pl-em-rule); }
.planche .jr-out.sg { background: var(--pl-sg-bg); border-color: var(--pl-sg-rule); }
.planche .screen { border-radius: var(--pl-radius); overflow: hidden; }
.planche .screen.em { border-color: var(--pl-em-rule); } .planche .screen.sg { border-color: var(--pl-sg-rule); }
.planche .screen.em .scr-bar .who { color: var(--pl-em); }
.planche .scr-field.sg { border-color: var(--pl-sg-rule); }
.planche .scr-btn { background: var(--pl-em); } .planche .scr-btn.sg { background: var(--pl-sg); }
.planche .scr-quote { background: var(--pl-bg); border-left: 0; }
.planche .rep-verdict { color: var(--pl-em-ink); }
.planche .seal { border-top-color: var(--pl-em-rule); }
.planche .screen.sg .seal { border-top-color: var(--pl-sg-rule); }
.planche .seal-mark { background: var(--pl-em-bg); }
.planche .seal-mark.sg { background: var(--pl-sg-bg); border-color: var(--pl-sg); color: var(--pl-sg); }
.planche .seal-h .d { color: var(--pl-em-ink); } .planche .seal-h .t.sg .d { color: var(--pl-sg-ink); }
.planche .jr-fork > div { border: 1px solid var(--pl-sg-rule); border-radius: var(--pl-radius); box-shadow: none; }
.planche .jr-fork > div.no { border: 1px dashed var(--pl-sg); }
.planche .jr-fork .h { color: var(--pl-sg); }
.planche .jr-loop { border: 1px dashed var(--pl-sg); background: var(--pl-sg-bg); border-radius: var(--pl-radius); }
.planche .file-card { border: 1.5px solid var(--pl-title); border-radius: var(--pl-radius); }
.planche .file-card .scr-note { background: var(--pl-soft); }
.planche .file-card .more { padding: 8px 12px; background: var(--pl-em-bg); border: 1px solid var(--pl-em-rule); border-radius: 8px; }

/* accueil · qui fait quoi, l'enveloppe */
.planche .roles li:nth-child(1) .lbl { color: var(--pl-em); } .planche .roles li:nth-child(2) .lbl { color: var(--pl-sg); } .planche .roles li:nth-child(3) .lbl { color: var(--pl-title); }
.planche .roles li:nth-child(1) .quote { color: var(--pl-em-ink); } .planche .roles li:nth-child(2) .quote { color: var(--pl-sg); } .planche .roles li:nth-child(3) .quote { color: var(--pl-title); }
.planche .env-seals > div { background: var(--pl-em-bg); border: 1px solid var(--pl-em-rule); border-radius: var(--pl-radius); }
.planche .env-seals > div.sg { background: var(--pl-sg-bg); border-color: var(--pl-sg-rule); }
.planche .env-seals dt { color: var(--pl-em); } .planche .env-seals .sg dt { color: var(--pl-sg); }
.planche .env-seals dd { color: var(--pl-text); }
.planche .env-seals dd.mono { color: var(--pl-em-ink); } .planche .env-seals .sg dd.mono { color: var(--pl-sg-ink); }
.planche .env-in .mono { color: var(--pl-sec); }
.planche .env-in li:nth-child(3) { border-color: var(--pl-em-rule); } .planche .env-in li:nth-child(3) .mono { color: var(--pl-em); }
.planche .env-in li:nth-child(4) { border-color: var(--pl-sg-rule); } .planche .env-in li:nth-child(4) .mono { color: var(--pl-sg); }
.planche .env-quote + p { color: var(--pl-sec); }

/* le format · ce qui le distingue */
.planche .dist .n { color: var(--pl-title); }
.planche .dist li > p:nth-last-child(2) { padding-bottom: 14px; }
.planche .dist .mono.fine { color: var(--pl-sec); border-top: 1px solid var(--pl-rule); padding-top: 12px; }

/* le format · conserver et vérifier */
.planche .where li.pl, .planche .limits > div.pl { background: var(--pl-soft); border: 1px dashed var(--pl-dash); }
.planche .where li.pl .path { background: var(--pl-surface); border: 1px dashed var(--pl-dash); }
.planche .flow > li + li::before { border-left-color: var(--pl-slate); }
.planche .flow > li + li::after { border-top-color: var(--pl-slate); }
.planche .flow-out::before { border-left-color: var(--pl-slate); }
.planche .flow-out li::before { border-top-color: var(--pl-slate); }
.planche .flow-node { border: 1.5px solid var(--pl-title); }
.planche .flow-step { border: 1px solid var(--pl-rule); border-radius: 8px; }
.planche .flow-step .q { border-top: 0; padding: 6px 10px; border-radius: 6px; background: var(--pl-em-bg); color: var(--pl-em-ink); }
.planche .flow > li:nth-child(2) .flow-step .q { background: var(--pl-slate-bg); color: var(--pl-text); }
.planche .flow-step.sg { border-color: var(--pl-sg-rule); }
.planche .flow-step.sg .h { color: var(--pl-sg); }
.planche .flow-step.sg .q { background: var(--pl-sg-bg); color: var(--pl-sg-ink); }
.planche .out { border: 1.5px solid var(--pl-slate); background: var(--pl-slate-bg); color: var(--pl-text); }
.planche .out.bad { border-color: var(--pl-bad); background: var(--pl-bad-bg); }
.planche .out.ok { border-color: var(--pl-ok); background: var(--pl-ok-bg); }
.planche .flow-out li:has(.out.bad) .br { color: var(--pl-bad); }
.planche .flow-out li:has(.out.ok) .br { color: var(--pl-ok); }
.planche .flow-side > .api-box, .planche .api-box { background: var(--pl-navy); border: 0; border-radius: var(--pl-radius); color: var(--pl-on-navy); box-shadow: var(--pl-shadow); }
.planche .api-box .lbl { color: var(--pl-on-navy-blue); }
.planche .api-box ul:not(.never) + .lbl { color: var(--pl-on-navy-ocre); }
.planche .api-box li { color: var(--pl-on-navy); }
.planche .api-box li::before { border-color: var(--pl-on-navy-blue); }
.planche .api-box ul.never li::before { background: linear-gradient(45deg, transparent 42%, var(--pl-on-navy-ocre) 42%, var(--pl-on-navy-ocre) 58%, transparent 58%), linear-gradient(-45deg, transparent 42%, var(--pl-on-navy-ocre) 42%, var(--pl-on-navy-ocre) 58%, transparent 58%); }
.planche .api-box pre { background: var(--pl-navy2); border: 1px solid var(--pl-navy-rule); color: var(--pl-on-navy); border-radius: 8px; }
.planche .api-box p { color: var(--pl-on-navy2); }
.planche .vpage .bar { background: var(--pl-soft); }
.planche .scope > div:first-child h4 { color: var(--pl-ok); }
.planche .scope > div.mid { background: var(--pl-slate-bg); border-color: var(--pl-dash); }

/* spécification · anatomie d'une trace */
.planche .an-layers > li.pf { border: 1.5px solid var(--pl-em); }
.planche .an-layers > li.sg.pf { border-color: var(--pl-sg); }
.planche .sg .an-n, .planche .sg.pf .an-n { background: var(--pl-sg); color: #FFFFFF; }
.planche .pf .an-n { background: var(--pl-em); }
.planche .an-layers > li.pf .an-h .fine { color: var(--pl-em-ink); }
.planche .an-layers > li.sg .an-h .fine { color: var(--pl-sg); }
.planche .an-formula { background: var(--pl-em-bg); border: 0; color: var(--pl-em-ink); }
.planche .sg .an-formula { background: var(--pl-sg-bg); color: var(--pl-sg-ink); }
.planche .an-side > div { background: var(--pl-em-bg); border: 1px solid var(--pl-em-rule); border-radius: var(--pl-radius); }
.planche .an-side > div.sg { background: var(--pl-sg-bg); border-color: var(--pl-sg-rule); }
.planche .an-side .h, .planche .an-side .fields { color: var(--pl-em-ink); }
.planche .an-side .sg .h, .planche .an-side .sg .fields { color: var(--pl-sg-ink); }
.planche .an-json { background: var(--pl-navy); color: var(--pl-on-navy-code); border: 0; border-radius: var(--pl-radius); }
.planche .an-l { border-left-color: var(--pl-navy-rule); }
.planche .an-l.l1, .planche .an-l.l2, .planche .an-l.l3, .planche .an-l.l4 { border-left-color: var(--pl-on-navy-blue); }
.planche .an-l.l5, .planche .an-l.l6 { border-left-color: var(--pl-on-navy-ocre); }
.planche .an-l::before { background: var(--pl-on-navy-blue); color: var(--pl-navy); }
.planche .an-l.l5::before, .planche .an-l.l6::before { background: var(--pl-on-navy-ocre); color: var(--pl-navy); }
.planche .an-json .kf { color: var(--pl-on-navy-blue); }
.planche .an-json .kf.sg { color: var(--pl-on-navy-ocre); }
.planche .an-pl { background: var(--pl-soft); border: 1px dashed var(--pl-dash); border-radius: var(--pl-radius); }
.planche .an-pl .lbl.mono { color: var(--pl-slate); }
.planche .an-pl pre { background: var(--pl-surface); border: 1px dashed var(--pl-dash); border-radius: 8px; color: var(--pl-title); }
.planche .hash-ex .v { border-color: var(--pl-em-rule); background: var(--pl-em-bg); color: var(--pl-em-ink); }
.planche .hash-ex.bad .v { border-color: var(--pl-bad-rule); background: var(--pl-bad-bg); color: var(--pl-bad); }

/* guide · schéma technique */
.planche .reg-steps li { background: var(--pl-surface); border: 1px solid var(--pl-rule); }
.planche .reg-steps li:nth-child(1) { background: var(--pl-sg-bg); border: 1px solid var(--pl-sg-rule); }
.planche .reg-steps li:nth-child(2) { border: 1px solid var(--pl-rule); }
.planche .reg-steps li:nth-child(3) { background: var(--pl-em-bg); border: 1px solid var(--pl-em-rule); }
.planche .reg-steps li:nth-child(1) .h { color: var(--pl-sg-ink); } .planche .reg-steps li:nth-child(3) .h { color: var(--pl-em-ink); }
.planche .api-list li { background: var(--pl-navy); border: 0; border-radius: var(--pl-radius); color: var(--pl-on-navy); }
.planche .api-list .h { color: var(--pl-on-navy-blue); }
.planche .api-list li:nth-child(3) .h { color: var(--pl-on-navy-ocre); }
.planche .api-list code { color: var(--pl-on-navy); }
.planche .api-list p { color: var(--pl-on-navy2); }
.planche .idparts > span:first-child .v { border-color: var(--pl-em); background: var(--pl-em-bg); color: var(--pl-em-ink); }
.planche .rules .prof:nth-of-type(3) code { color: var(--pl-sg); }
.planche .labels code { color: var(--pl-em); } .planche .labels li:nth-child(3) code { color: var(--pl-sg); }
.planche .rules .sub { background: var(--pl-em-bg); border: 1px solid var(--pl-em-rule); }
.planche .rules .sub .h { color: var(--pl-em-ink); }
.planche .next-fmt > div { background: var(--pl-soft); border: 1px dashed var(--pl-dash); border-radius: var(--pl-radius); }
.planche .next-fmt > div.rule { background: var(--pl-surface); border: 1px solid var(--pl-rule); }
.planche .next-fmt .state { white-space: nowrap; align-self: flex-start; }

/* gouvernance · sécurité et vie privée */
.planche .th-key .key::before { top: 50%; transform: translateY(-50%); }
.planche .tablewrap { background: var(--pl-surface); border: 1px solid var(--pl-rule); border-radius: var(--pl-radius); }
.planche .threats th { background: var(--pl-navy); color: var(--pl-on-navy); border-bottom: 0; padding: 10px 14px; }
.planche .threats td { padding: 11px 14px; border-bottom-color: var(--pl-rule); }
.planche .threats td:first-child, .planche .threats th:first-child { padding-right: 2px; }
.planche .threats tr:last-child td { border-bottom: 0; }
@media (max-width: 640px) {
  .planche.s-sec .tablewrap { background: linear-gradient(to left, rgba(11,22,38,.14), rgba(11,22,38,0) 28px) right / 28px 100% no-repeat, var(--pl-surface); background-attachment: local, scroll; border-right: 1px solid var(--pl-rule); }
  .planche.s-sec .tablewrap::after { padding: 8px 14px 10px; }
}
.planche .priv-in .h, .planche .priv-in li:nth-child(1) .h { color: var(--pl-title); }
.planche .priv-in li::after { border-left-color: var(--pl-sg); }
.planche .priv-in li:nth-child(4)::after { border-left-color: var(--pl-slate); }
.planche .priv-srv { background: var(--pl-em-bg); border: 1px solid var(--pl-em); border-radius: var(--pl-radius); }
.planche .priv-srv .h { color: var(--pl-em-ink); }
.planche .priv-out > div { border-radius: var(--pl-radius); }
.planche .priv-out .keeps { background: var(--pl-navy); border: 0; color: var(--pl-on-navy); }
.planche .priv-out .keeps .h { color: #FFFFFF; } .planche .priv-out .keeps p { color: var(--pl-on-navy); } .planche .priv-out .keeps .fine { color: var(--pl-on-navy2); }
.planche .priv-out .keeps::before { border-left-color: var(--pl-slate); }
.planche .priv-out .keeps .arrow-l { color: var(--pl-slate); }
.planche .priv-out .pv { background: var(--pl-surface); border: 1px solid var(--pl-rule); }
.planche .priv-out > div.pv::before { border-left: 2px dashed var(--pl-em); }
.planche .priv-out .pv .arrow-l { color: var(--pl-em); }
.planche .bignums > div { background: var(--pl-surface); color: var(--pl-text); border: 1px solid var(--pl-rule); border-radius: var(--pl-radius); box-shadow: var(--pl-shadow); }
.planche .bignums .lbl { color: var(--pl-sec); }
.planche .bignums .big { color: var(--pl-em); }
.planche .bignums .sub, .planche .bignums li { color: var(--pl-text); }

/* les quatre schémas de Le format : même cadre que les planches */
.band.s-how .fig, .band.s-technical .fig { background: var(--pl-surface); border: 1px solid var(--pl-rule); border-radius: var(--pl-radius); box-shadow: var(--pl-shadow); }

/* ===== largeur (20/10/2026, 20 h 10) : « Anatomie d’une trace » (Spécification) et « Schéma technique » (Guide) sortent de la colonne
   du document : bandes de planche pleine largeur entre le titre de la page et le document, lien vers le texte en tête de bande. */
.s-doc-head { padding-bottom: clamp(36px, 5vw, 56px); }
.s-doc-text .docgrid { margin-top: 0; }
.planche .sec-head > .lbl::before { background: var(--pl-title); }
.to-text { margin-top: 12px; font-size: 15px; }
.an-sec .sec-head, .seq-sec .sec-head { margin-bottom: 36px; }
/* anatomie : la vue éclatée à gauche, le fichier en face, comme sur la planche 4 */
.an-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px 40px; align-items: start; }
.an-left > h3:first-child { margin-top: 0; }
.an-sec .wrap .an-left > h3:first-child { margin-top: 0; }
.an-right > .an-json-h { margin-top: 24px; }
.planche .an-json { margin-top: 12px; }
.an-right > .fine { margin-top: 12px; }
.an-sec .an-boxes { margin-top: 36px; }
@media (min-width: 1100px) {
  .an-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
  .an-right > .an-json-h { margin-top: 0; }
}
@media (min-width: 1280px) { .an-right > .an-json-h .name { font-family: var(--serif); font-size: 22px; } }
@media (min-width: 1200px) { .an-sec .an-boxes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* schéma technique : le diagramme et, à côté, l’enregistrement d’un rapport fait ailleurs et les points d’accès, comme sur la planche 5 */
.seq-top { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
.planche .seq-fig { margin: 0; }
.planche .seq-fig figcaption { margin-top: 8px; font-size: 13.5px; color: var(--muted); max-width: none; }
.seq-fig .diagram-v { max-width: 460px; margin-inline: auto; }
@media (max-width: 839px) { .seq-fig .diagram { display: none; } .seq-fig .diagram-v { display: block; } }
@media (min-width: 840px) and (max-width: 1239px) { .seq-fig { max-width: 780px; } }
@media (min-width: 1240px) {
  .seq-top { grid-template-columns: minmax(0, 1fr) 320px; }
  .seq-aside .reg-steps, .seq-aside .api-list { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 1200px) {
  .seq-sec .rules { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .planche.seq-sec .labels li { grid-template-columns: minmax(0, 1fr); gap: 0; }
}
.planche .seq-aside .reg-card { margin-top: 0; }
.seq-aside .reg-card > p:first-child { display: flex; flex-wrap: wrap; align-items: baseline; row-gap: 6px; margin-bottom: 10px; }
.seq-aside .reg-card > p:first-child .state { margin-bottom: 0; }
.seq-aside > h3 { margin-top: 32px; margin-bottom: 4px; }
.seq-aside > h3 + .lbl.mono { margin-bottom: 10px; }
.seq-aside > p { font-size: 15px; }
.seq-aside > p + p { margin-top: 10px; }
.seq-aside .api-list + p { margin-top: 14px; }
.seq-sec .wrap > h3 { margin-bottom: 8px; }
.planche .api-list li { font-size: 14px; }
.planche.seq-sec .wrap > .lbl::before { display: none; }
.an-sec .wrap .rep-reg p + p { margin-top: 2px; }
.an-layers .chip-f { text-wrap: balance; }
/* ===== contrôle v3 (20/10/2026) : un seul code des acteurs ; les quatre schémas de Le format lisibles à toutes les largeurs */
/* Trois parties : structure (relecture, second lecteur) en ardoise, suivi (personne qui signe) en ocre, preuve (émetteur) en bleu : filet et numéro */
.s-parts .parts li:nth-child(1) { border-top-color: var(--pl-slate); }
.s-parts .parts li:nth-child(2) { border-top-color: var(--pl-sg); }
.s-parts .parts li:nth-child(3) { border-top-color: var(--pl-em); }
.s-parts .parts li:nth-child(1) .lbl.mono { color: var(--pl-slate); }
.s-parts .parts li:nth-child(2) .lbl.mono { color: var(--pl-sg); }
.s-parts .parts li:nth-child(3) .lbl.mono { color: var(--pl-em); }
/* schémas de Le format : version horizontale dès 1 140 px (texte rendu ≥ 13 px), version verticale en dessous, plafonnée */
@media (max-width: 1139px) {
  .s-how .fig .diagram, .s-technical .fig .diagram { display: none; }
  .s-how .fig .diagram-v, .s-technical .fig .diagram-v { display: block; max-width: 380px; margin-inline: auto; }
}
@media (min-width: 641px) and (max-width: 1139px) { .s-how .fig, .s-technical .fig { max-width: 440px; } }
/* Guide, « Ne quitte jamais l'appareil » : puces simples, comme dans la Spécification (les coches vertes ne portaient pas de sens) */
.planche .rules ul.never { list-style: disc; padding-left: 1.2em; }
.planche .rules ul.never li { padding-left: 0; }
.planche .rules ul.never li::before { content: none; }

/* téléphone et tablette (≤ 800 px) : aucun texte des sections intégrées sous 14 px */
@media (max-width: 800px) {
  .jr-time, .jr-time .t, .jr-actor, .jr-out .lbl, .jr-out p, .jr-out code, .screen, .scr-bar, .scr-bar .who, .scr-bar .tag, .scr-label, .scr-field, .scr-note, .scr-radio li, .scr-sig span, .scr-check li,
  .rep-reg, .rep-toc, .rep-toc ul, .rep-find, .seal-h .d, .seal-mark, .kv, .jr-fork p, .jr-loop, .file-card .name, .file-card .kind, .file-card .more,
  .roles p, .env figcaption, .env-in .mono, .env-in p, .env-quote + p, .cat-rule,
  .dist p, .dist .mono.fine, .where .state, .where p, .where .path, .kp-notes p, .flow-node .s, .flow-step .s, .flow-out .br, .out, .flow-side > div, .api-box li, .api-box pre, .api-box p,
  .audit .tag, .audit .tagline, .audit p, .vpage, .vpage .bar, .vpage .okline, .vrows > div, .vrows dt, .cmp, .cmp .cap, .cmp-notes div, .scope li, .scope p, .scope .state,
  .an-key, .chip-f, .planche .an-layers p, .an-h .fine, .an-pf, .an-formula, .an-side > div, .an-side .h, .an-side .fields, .planche .an-side p, .planche .an-json, .an-l::before, .an-json-h .name, .planche .an-pl p, .planche .an-pl pre, .planche .an-boxes p, .planche .an-boxes li, .hash-ex .s, .hash-ex .v,
  .planche .seq-fig figcaption, .reg-card .state, .reg-steps li, .reg-steps code, .api-list .h, .api-list code, .planche .api-list p, .planche .rules p, .planche .rules li, .idparts .v, .idparts .l, .rules .mono.small, .planche .rules .mono.small, .planche .labels li, .labels code, .rules .prof code, .rules .prof span, .planche .never li, .never li, .rules .sub .h, .next-fmt .state, .planche .next-fmt li,
  .th-key, .threats, .threats th, .threats code, .limits .state, .limits p, .priv-in .h, .priv-in .what, .priv-in .never-p, .priv-srv, .priv-out .arrow-l, .priv-out p, .bignums .lbl, .bignums li, .plate-foot, .note-ex,
  .s-path .key, .s-roles .key, .s-keep .key, .an-sec .key, .seq-sec .key, .s-sec .key, .s-path .legend, .s-keep .legend, .an-sec .legend, .seq-sec .legend, .s-sec .legend, .flow-br, .env-seals dd, .env-seals dd.mono, .seal-mark, .an-boxes .seal-mark, .bignums sup, .s-roles .quote, .s-dist .fine,
  .s-path code, .s-roles code, .s-dist code, .s-keep code, .an-sec code, .seq-sec code, .s-sec code, .s-path .lbl.mono, .s-keep .lbl.mono, .an-sec .lbl.mono, .seq-sec .lbl.mono, .s-sec .lbl.mono, .s-roles .lbl, .s-roles .fine, .s-path .fine, .s-keep .fine, .s-dist .fine, .s-sec .fine, .an-sec .fine, .seq-sec .fine { font-size: 14px; }
}
/* 23/10/2026 : le menu du haut et les deux autres sites.
   17 h 30 (demande de l'auteur) : les deux autres sites se distinguent des pages du site : filet vertical et espace, pastille carrée
   à la couleur de marque du site visé (une pastille = une couleur), flèche de lien externe après le nom ; sur téléphone, filet et
   légende « Les trois sites ». En-tête sombre : un liseré clair neutre autour de chaque pastille, pour qu'elle reste visible sur le brun.
   19 h 45 (décision de l'auteur, variante A) : les deux autres sites à la taille des liens du menu, graisse 500, couleur pleine du
   texte, pastille de 9 px ; au survol et au focus clavier, le nom prend la couleur de marque du site visé. Le lien de langue sort du
   groupe : sur ordinateur, à l'extrême droite de l'en-tête, après son propre espace ; sur téléphone, à côté du bouton « Menu »,
   visible sans ouvrir le menu (il n'est plus dans le panneau).
   Couleurs de marque : un seul endroit, les variables --fam-… (pastilles ; AttestScope : le laiton) et --fam-…-t (texte au survol
   et au focus : sur le brun profond, une nuance claire de la même couleur, contraste d'au moins 4,5:1). */
.site-head { --fam-hf: #2F6B4F; --fam-rv: #33506E; --fam-as: #9C7A2E; --fam-hf-t: #87CAAB; --fam-rv-t: #89A8C8; --fam-as-t: #E9A83A; }
.site-head .wrap { column-gap: 24px; }
.nav-d { margin-left: auto; }
.site-head .wrap > .lang { margin-left: 4px; }
.nav-d .nav-fam { border-left: 1px solid rgba(237,232,220,.28); padding-left: 22px; gap: 4px 18px; }
.nav-fam a { display: inline-flex; align-items: center; gap: 7px; }
.nm-fam a { display: flex; align-items: center; gap: 10px; }
.nav-fam a::before, .nm-fam a::before { content: ""; flex: none; width: 9px; height: 9px; background: var(--fam-c, var(--onband2)); box-shadow: 0 0 0 1px rgba(244,239,228,.55); }
/* la flèche de lien externe (↗), dessinée en CSS : les polices des sites n'ont pas ce caractère */
.nav-fam a::after, .nm-fam a::after { content: ""; flex: none; width: .66em; height: .66em; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 7.8 7.6 2.4M3.4 2.4h4.2v4.2' fill='none' stroke='%23000' stroke-width='1.25'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 7.8 7.6 2.4M3.4 2.4h4.2v4.2' fill='none' stroke='%23000' stroke-width='1.25'/%3E%3C/svg%3E") center / contain no-repeat; }
:is(.nav-fam, .nm-fam) a[href*="humanfrontier.ai"] { --fam-c: var(--fam-hf); --fam-t: var(--fam-hf-t); }
:is(.nav-fam, .nm-fam) a[href*="riftveil.ai"] { --fam-c: var(--fam-rv); --fam-t: var(--fam-rv-t); }
:is(.nav-fam, .nm-fam) a[href*="attestscope.ai"] { --fam-c: var(--fam-as); --fam-t: var(--fam-as-t); }
:is(.nav-fam, .nm-fam) a:is(:hover, :focus-visible) { color: var(--fam-t, var(--gold)); text-decoration: none; }
.nav-m-panel .nm-main li:last-child a, .nav-m-panel .nm-fam li:last-child a { border-bottom: 0; }
.nav-m-panel .nm-fam { margin-top: 6px; padding-top: 14px; border-top: 1px solid rgba(237,232,220,.28); }
.nm-fam::before { content: "Les trois sites"; content: "Les trois sites" / ""; display: block; font-size: 11.5px; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase; color: var(--onband2); padding-bottom: 2px; }
html[lang="en"] .nm-fam::before { content: "The three sites"; content: "The three sites" / ""; }
/* téléphone et tablette : le lien de langue à côté du bouton « Menu », à la même hauteur que lui */
@media (max-width: 1100px) {
  .site-head .wrap { column-gap: 10px; }
  .site-head .wrap > .lang { margin-left: auto; align-self: stretch; display: inline-flex; align-items: center; }
  .nav-m { flex: none; }
  .nav-m summary { white-space: nowrap; }
}

/* impression : fonds clairs, texte encre, sans ombre, en-tête masqué */
@media print {
  main *, footer *, .site-head * { color: #000 !important; background: transparent !important; box-shadow: none !important; }
  body, .band, .foot, .site-head { background: #fff !important; color: #000 !important; }
  .site-head, .nav-d, .nav-m, .skip, .actions { display: none !important; }
  .band { border-top: 1px solid #999; padding-block: 24px; }
  .terms > div, .principles > div, .list-cols li, .parts li, .keeping li, .licences li, .words > div, .fig, .record-card, .doc, pre.json, .toc, .brand .tag { border: 1px solid #999 !important; }
  .rc-head { border-top: 1px solid #999 !important; }
  .terms > div, .principles > div, .list-cols li, .parts li, .keeping li, .licences li, .words > div, .fig, .record-card, .qa > div, .steps li { break-inside: avoid; }
  a { text-decoration: underline; }
  .screen, .file-card, .jr-fork > div, .jr-loop, .jr-out, .out, .flow-step, .flow-node, .roles li, .dist li, .where li, .audit > div, .scope > div, .an-layers > li, .an-side > div, .an-boxes > div, .an-pl, .reg-card, .rules > div, .next-fmt > div, .limits > div, .bignums > div, .api-box, .api-list li, .priv-in li, .priv-out > div, .priv-srv, .env-in li, .env-seals > div, .vpage, .cmp, .an-json { border: 1px solid #999 !important; break-inside: avoid; }
  .jr-step, .sec-part, .kp-part { break-inside: auto; }
  .jr-fork > div { border-top-width: 4px !important; }
  .jr-fork > div.no { border-style: dashed !important; }
  .threats { min-width: 0; }
  .where li.pl, .limits > div.pl, .next-fmt > div:not(.rule), .an-pl, .jr-loop { border-style: dashed !important; }
  .threats th { border-bottom: 2px solid #000 !important; }
  .an-layers > li.pf, .out, .flow-node, .file-card { border-width: 2px !important; }
  .out:not(.bad):not(.ok):not(.next) { border-style: dashed !important; }
  .planche h3, .planche .wrap > .lbl.mono, .planche .an-json-h { break-after: avoid; }
  .s-how .fig .diagram, .s-technical .fig .diagram { display: block !important; }
  .s-how .fig .diagram-v, .s-technical .fig .diagram-v { display: none !important; }
  .s-how .fig, .s-technical .fig { max-width: none !important; }
  .s-technical h3 { break-after: avoid; }
}