.catalogue h1{font:400 clamp(30px,4vw,44px)/1.2 Georgia,serif}.catalogue-filter{display:flex;flex-wrap:wrap;align-items:end;gap:16px;padding:20px;background:#e9dfc5;margin:25px 0}.catalogue-filter label{display:grid;gap:7px;font-size:15px}.catalogue-filter input[type=search]{font:16px/1.4 'Trebuchet MS',sans-serif;max-width:100%;width:340px;padding:11px;border:1px solid #a79772;background:#fffaf0}.catalogue-filter .toggle{display:flex;align-items:center;padding-bottom:12px;gap:9px}.catalogue-filter button{font:600 16px 'Trebuchet MS',sans-serif;background:#344c35;color:#fff5da;padding:13px 20px;border:0;cursor:pointer}.catalogue-filter a{padding:10px}.catalogue-status{font-size:14px;color:#5b624b}.catalogue-version{background:#f7f0de;border:1px solid #c8b68e;margin:12px 0;scroll-margin:20px}.catalogue-version>summary{display:grid;grid-template-columns:1fr 1.4fr 1.4fr;align-items:center;gap:15px;padding:20px;cursor:pointer}.catalogue-version>summary strong:before{content:'＋';margin-right:12px;color:#7b693f}.catalogue-version[open]>summary strong:before{content:'−'}.catalogue-version>summary span,.catalogue-version>summary small{font-size:14px}.catalogue-version>summary small{color:#52613b}.version-columns{display:grid;grid-template-columns:1.25fr 1fr;border-top:1px solid #c8b68e}.version-columns>section{min-width:0;padding:25px}.version-columns h2{font-size:25px}.version-columns li{margin:10px 0}.try-version{background:#e9e5d3;border-left:1px solid #c8b68e}.meta{font-size:14px;color:#62654e}.lines{white-space:pre-wrap;overflow-wrap:anywhere}.hash{display:block;overflow-wrap:anywhere;font-size:13px;margin:12px 0}.client+.client{border-top:1px solid #b8ad91;margin-top:25px;padding-top:20px}.client details{margin-top:16px}.client details summary,.catalogue-documents>summary{cursor:pointer;padding:12px 0}.catalogue-documents{margin-top:40px}.catalogue-documents>summary{font:24px Georgia,serif}.catalogue-empty{padding:25px;border:1px solid #c8b68e}.test-footer{max-width:1104px;margin:auto;padding:25px;font-size:14px}.catalogue :focus-visible{outline:3px solid #8d7038;outline-offset:3px}@media(max-width:750px){.catalogue-version>summary{grid-template-columns:1fr;gap:7px;padding:16px}.version-columns{grid-template-columns:1fr}.try-version{border-left:0;border-top:1px solid #c8b68e}.version-columns>section{padding:20px}.catalogue-filter{padding:16px}.catalogue-filter label,.catalogue-filter input[type=search]{width:100%}}

/* Une entree sans client publie n a plus de seconde colonne : le resume de
   l entree dit deja « Documentation · test non disponible », et l avertissement
   de tete dit une fois pour toutes ce que chaque carte repetait. */
.version-columns.seule{grid-template-columns:minmax(0,1fr)}

/* ------------------------------------------------------------------
   Le texte d'epoque, recopie tel quel.
   L'encadre doit se lire comme une citation et non comme la prose du
   site : fond plus clair, filet a gauche, et une legende qui dit d'ou
   vient le texte. `blockquote` porte `cite` : le lien de la legende
   mene a la meme page archivee.
   ------------------------------------------------------------------ */
.epoque{margin:22px 0 0;padding:0}
.epoque blockquote{margin:0;padding:16px 18px;background:#fffaee;border:1px solid #d6c69e;border-left:4px solid #8d7038;font-size:15px;line-height:1.55}
.epoque blockquote>p{margin:0 0 10px}
.epoque blockquote>p:last-child{margin-bottom:0}
.epoque-titre{font:600 17px/1.35 Georgia,serif;color:#4b3a1c}
.epoque-inter{font-weight:700;margin-top:14px}
.epoque blockquote ul{margin:0 0 10px;padding-left:20px}
.epoque blockquote li{margin:6px 0}
.epoque-suite{color:#6b6349;font-style:italic}
.epoque blockquote ul+p{margin-top:-4px}
.epoque blockquote p+ul{margin-top:-2px}
.epoque figcaption{margin-top:9px;font-size:13.5px;line-height:1.5;color:#5b5340}
.epoque figcaption a{white-space:nowrap}

/* ------------------------------------------------------------------
   Une planche d'images tirees d'un client que nous possedons.
   La 17 est une pioche nue de 50x62 la ou les dix-sept autres font
   138x138 : on la met a part au lieu de la cadrer de force, et sa
   legende dit pourquoi. C'est ainsi dans le client de 2004.
   ------------------------------------------------------------------ */
.planche{margin:26px 0 0;padding:0}
.planche-titre{font:600 17px/1.35 Georgia,serif;color:#4b3a1c;margin-bottom:12px}
.planche-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:10px;margin:0;padding:0;list-style:none}
.planche-grille li{position:relative;display:grid;justify-items:center;gap:4px;padding:8px 4px;background:#fffaee;border:1px solid #d6c69e}
.planche-grille img{width:100%;max-width:64px;height:auto;image-rendering:auto}
.planche-grille b{font:600 12px 'Trebuchet MS',sans-serif;color:#7b693f}
.planche-grille .a-part{order:1;grid-column:1/-1;justify-items:start;grid-template-columns:auto auto 1fr;align-items:center;gap:10px;padding:10px 12px;background:#f2ead6}
.planche-grille .a-part img{width:auto;max-width:50px}
.planche-grille small{font-size:12.5px;line-height:1.45;color:#5b5340}
.planche-note{margin:12px 0 0;font-size:13.5px;line-height:1.55;color:#5b5340}
@media(max-width:420px){.planche-grille{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}.planche-grille .a-part{grid-template-columns:auto 1fr;row-gap:6px}.planche-grille .a-part small{grid-column:1/-1}}

/* Une planche « hautes » : des dessins plus hauts que larges (les drapeaux
   de defi font 51x115 la ou les icones de metier font 138x138). On les cadre
   par la hauteur, sinon la largeur commune les etirerait hors de la case. */
.planche-grille.hautes{grid-template-columns:repeat(auto-fill,minmax(94px,1fr))}
.planche-grille.hautes li{align-content:end}
.planche-grille.hautes img{width:auto;max-width:100%;max-height:126px}
.planche-grille.hautes .a-part img{max-height:44px}

/* Le second registre : ce que nos notes de travail ont retenu quand la page
   d'epoque n'a pas ete retrouvee. Il ne doit surtout pas ressembler a la
   citation : pas de filet de blockquote, pas de fond de parchemin, un titre
   qui dit ce que c'est. La difference entre « Ankama l'a ecrit ici » et
   « nous l'avons releve la » doit se voir avant d'etre lue. */
.note-travail{margin:22px 0 0;padding:14px 16px;border:1px dashed #b3a483;background:#f4efe1}
.note-travail h3{margin:0 0 8px;font:600 14px/1.4 'Trebuchet MS',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#6b5a2f}
.note-travail p{margin:0 0 10px;font-size:14px;line-height:1.55;color:#4f4936}
.note-travail ul{margin:0 0 10px;padding-left:20px}
.note-travail li{margin:7px 0;font-size:14.5px;line-height:1.55}
.note-source{margin:0;font-size:13px;color:#6b6349;font-style:italic}
/* Le cadrage pose avant une citation qui ne parle pas de sa propre version. */
.epoque-propos{margin:0 0 8px;font-size:14px;line-height:1.55;color:#5b5340}