/* Baromètre des artistes visuels : charte « galerie » de latwal.co (arts-visuels,
   src/themes/galerie/theme.css), sur la feuille du baromètre Boudoum (../barometre.css) dont seuls
   les jetons changent : polices système, titres en --display, filets en --ink-3 (contraste des
   champs, WCAG 1.4.11). Phase 2026-11-barometre-latwal, lot 1. Ni ombre ni arrondi. */
:root{
  --bg:#fafaf7; --bg2:#efeee9; --line:#55524c; --ink:#161513; --ink-2:#33312d; --ink-3:#55524c;
  --mute:#d6d4cc; --on-ink:#fafaf7; --accent:#8a3a14; --on-accent:#ffffff; --field-bg:#ffffff;
  --body:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --display:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;
  --w-cond:100%; --w-semi:100%;
  --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px;
  --t-h1:clamp(28px,6vw,44px); --t-body:17px; --t-small:15px; --t-label:13px;
  --measure:40rem; --pad-m:16px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--t-body)/1.5 var(--body);min-height:100svh;display:flex;flex-direction:column}
main{flex:1;width:100%;max-width:var(--measure);margin:0 auto;padding:var(--s5) var(--pad-m) var(--s7)}
a{color:inherit;text-underline-offset:.18em}
a:hover{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.bandeau{margin:0;padding:var(--s2) var(--pad-m);background:var(--ink);color:var(--on-ink);font-size:var(--t-small);text-align:center}
.tete{display:flex;gap:var(--s3);align-items:baseline;justify-content:space-between;padding:var(--s3) var(--pad-m);border-bottom:2px solid var(--line)}
.marque{font-weight:900;font-stretch:var(--w-cond);font-size:22px;letter-spacing:.01em;text-transform:uppercase}
.titre{font-size:var(--t-label);color:var(--ink-3);text-align:right}
.pied{padding:var(--s4) var(--pad-m);border-top:1px solid var(--mute);font-size:var(--t-label);color:var(--ink-3);text-align:center}

.ecran{animation:entree .18s ease-out}
@keyframes entree{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@view-transition{navigation:auto}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
.barre-progression{display:block;width:100%;height:6px;margin:0 0 var(--s4);border:0;border-radius:3px;background:var(--bg2);color:var(--ink);appearance:none;-webkit-appearance:none}
.barre-progression::-webkit-progress-bar{background:var(--bg2);border-radius:3px}
.barre-progression::-webkit-progress-value{background:var(--ink);border-radius:3px}
.barre-progression::-moz-progress-bar{background:var(--ink);border-radius:3px}
.progression{margin:0 0 var(--s2);font-size:var(--t-label);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
h1{margin:0 0 var(--s5);font-size:var(--t-h1);line-height:1.08;font-weight:800;font-stretch:var(--w-semi)}
h1 label{display:block}
p{margin:0 0 var(--s4)}
ul{margin:0 0 var(--s4);padding-left:1.2em}
li{margin-bottom:var(--s2)}
.aide,.note{color:var(--ink-3);font-size:var(--t-small)}
.capture{margin:0 0 var(--s5)}
.capture a{display:block;border:1px solid var(--line)}
.capture a:hover{border-color:var(--accent);outline:1px solid var(--accent)}
.capture img{display:block;width:100%;height:auto}
.capture figcaption{margin-top:var(--s2);color:var(--ink-3);font-size:var(--t-small)}
.notice{padding:var(--s3) var(--s4);border-left:4px solid var(--accent);background:var(--bg2)}

fieldset{margin:0;padding:0;border:0;min-width:0}
legend{padding:0;width:100%}
.choix{display:grid;gap:var(--s2)}
.option,.consentement{display:flex;gap:var(--s3);align-items:flex-start;padding:var(--s3) var(--s4);min-height:48px;border:2px solid var(--line);background:var(--field-bg);cursor:pointer}
.option:has(input:checked){background:var(--ink);color:var(--on-ink)}
.option input,.consentement input{margin:.2em 0 0;width:20px;height:20px;flex:none;accent-color:var(--accent)}
.autre input{width:100%;margin-top:calc(-1 * var(--s2))}

.echelle{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s2)}
.note-echelle{position:relative;display:flex;align-items:center;justify-content:center;min-height:56px;border:2px solid var(--line);background:var(--field-bg);font-weight:800;font-size:22px;cursor:pointer}
.note-echelle input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.note-echelle:has(input:checked){background:var(--ink);color:var(--on-ink)}
.note-echelle:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:2px}
.bornes{display:flex;justify-content:space-between;gap:var(--s4);margin-top:var(--s2);font-size:var(--t-small);color:var(--ink-2)}

input[type=text],input[type=email],input[type=tel],textarea{width:100%;padding:var(--s3);border:2px solid var(--line);background:var(--field-bg);color:var(--ink);font:inherit;border-radius:0}
.montant{display:flex;gap:var(--s3);align-items:center}
.montant input{max-width:10ch;font-size:24px;font-weight:700}
.champ{margin-bottom:var(--s5)}
.champ>label{display:block;margin-bottom:var(--s2);font-weight:700}
.champ>label.consentement{display:flex;margin-bottom:0;font-weight:400}
.champ fieldset legend{font-weight:700;margin-bottom:var(--s2)}
.champ fieldset .option{margin-bottom:var(--s2)}
.requis{font-weight:400;color:var(--ink-3)}
.champ .indication{margin:0 0 var(--s2)}
.champ .consentement+.indication{margin:var(--s2) 0 0}
.erreur{margin:var(--s2) 0;color:var(--accent);font-weight:700}
.en-erreur input{border-color:var(--accent)}
.erreurs{margin-bottom:var(--s5);padding:var(--s3) var(--s4);border:2px solid var(--accent);color:var(--accent);font-weight:700}
.erreurs p{margin:0}

.actions{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s6)}
.bouton{display:inline-block;width:100%;padding:var(--s4) var(--s5);min-height:52px;border:2px solid var(--ink);background:var(--ink);color:var(--on-ink);font:800 18px/1.2 var(--body);text-align:center;text-decoration:none;cursor:pointer}
.bouton:hover{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.retour{align-self:flex-start;padding:var(--s2) 0;border:0;background:none;color:var(--ink-2);font:600 var(--t-small) var(--body);text-decoration:underline;text-underline-offset:.18em;cursor:pointer}
.reprise{padding:var(--s3) var(--s4);border:2px solid var(--accent);background:var(--field-bg)}
.legal h2{margin:var(--s6) 0 var(--s3);font-size:22px;font-weight:800;font-stretch:var(--w-semi)}
.legal li{margin-bottom:var(--s3)}
.fin-lien{margin-top:var(--s6)}
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.champ-altcha{margin-bottom:var(--s4)}
.champ-altcha altcha-widget{display:block;min-height:51px;--altcha-max-width:100%;--altcha-border-radius:0;--altcha-border-width:2px;--altcha-border-color:var(--line);--altcha-color-base:var(--field-bg);--altcha-color-base-content:var(--ink);--altcha-color-primary:var(--ink);--altcha-color-primary-content:var(--field-bg)}
.champ-altcha altcha-widget:not(:defined){visibility:hidden}
@media (scripting:none){.champ-altcha{display:none}}

@media (min-width:560px){
  main{padding-top:var(--s7)}
  .actions{flex-direction:row;align-items:center;justify-content:space-between}
  .actions .bouton{width:auto;order:2}
  .retour{order:1}
}
@media (prefers-reduced-motion:reduce){.ecran{animation:none}}

/* Admin (Oliver, sur ordinateur d'abord ; tableaux défilants sur mobile) */
.admin main.large{max-width:72rem}
.admin h1{font-size:clamp(26px,4vw,36px)}
.admin h2{margin:0 0 var(--s4);font-size:22px;font-weight:800}
.admin h3{margin:var(--s5) 0 var(--s2);font-size:17px;font-weight:800}
.admin .marque{text-decoration:none;font-size:18px}
.bloc-admin{margin:var(--s6) 0;padding-top:var(--s5);border-top:2px solid var(--line)}
.etat{font-weight:400;color:var(--ink-3);font-size:var(--t-small)}
.chiffres{display:grid;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr));gap:var(--s3);margin:0}
.chiffres div{padding:var(--s3);border:2px solid var(--line);background:var(--field-bg)}
.chiffres dt{font-size:var(--t-label);color:var(--ink-3)}
.chiffres dd{margin:0;font-size:26px;font-weight:800}
.defile{overflow-x:auto}
.tableau{width:100%;border-collapse:collapse;font-size:var(--t-small)}
.tableau th,.tableau td{padding:var(--s2) var(--s3);border-bottom:1px solid var(--mute);text-align:left;vertical-align:top}
.tableau th{font-size:var(--t-label);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
.nombre{text-align:right;white-space:nowrap}
.barre-col{width:30%;min-width:6rem}
.barre{display:block;height:12px;background:var(--ink)}
.etiquette{display:inline-block;padding:0 var(--s2);border:1px solid var(--ink-3);font-size:var(--t-label);white-space:nowrap}
.niveau{font-weight:800;white-space:nowrap}
.niveau-chaud{color:var(--accent)}
.suspect td{color:var(--ink-3)}
.retard{color:var(--accent);font-weight:800}
.filtres,.en-ligne{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:flex-end;margin-bottom:var(--s5)}
.filtres label,.en-ligne label{display:flex;flex-direction:column;gap:var(--s2);font-size:var(--t-small);font-weight:700}
select{padding:var(--s2);border:2px solid var(--line);background:var(--field-bg);font:inherit;border-radius:0}
.en-ligne input{width:6ch}
.bouton.petit{width:auto;min-height:0;padding:var(--s2) var(--s4);font-size:var(--t-small)}
.suivi{display:grid;gap:var(--s2);max-width:32rem}
.suivi label{font-weight:700;margin-top:var(--s2)}
.suivi .bouton{justify-self:start;margin-top:var(--s3)}
.reponses div{padding:var(--s2) 0;border-bottom:1px solid var(--mute)}
.reponses dt{color:var(--ink-3);font-size:var(--t-small)}
.reponses dd{margin:0;font-weight:700}
.danger{padding:var(--s3);border:2px dashed var(--accent)}
.alerte-envoi{margin-bottom:var(--s5);padding:var(--s3) var(--s4);border:3px solid var(--accent);background:var(--field-bg)}
.alerte-envoi p{margin:0 0 var(--s2)}
.alerte-envoi strong{color:var(--accent)}
.alerte-envoi code{overflow-wrap:anywhere}
.danger .consentement{border:0;background:none;padding:0}
.choix-questionnaire{list-style:none;margin:var(--s6) 0 0;padding:0;display:grid;gap:var(--s5)}
.choix-questionnaire li{display:grid;gap:var(--s2);margin:0}

/* Bloc « Partager » (accueil, écran d'accueil, fin) : repris de src/components/Partage.astro. */
.partage{margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--mute)}
.partage h2{margin:0 0 var(--s2);font-size:22px;font-weight:800;font-stretch:var(--w-semi)}
.partage-liste{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:var(--s4) 0 0;padding:0}
.partage-liste a,.partage-liste button{display:inline-flex;align-items:center;gap:10px;min-height:44px;min-width:44px;padding:0 var(--s4);border:1px solid var(--ink);background:transparent;color:var(--ink);font:600 15px/1.2 var(--body);text-decoration:none;cursor:pointer}
.partage-liste a:hover,.partage-liste button:hover{background:var(--ink);color:var(--on-ink)}
.partage-liste svg{width:18px;height:18px;flex:none;fill:currentColor}
.partage [hidden]{display:none}
.partage-statut{margin:var(--s3) 0 0;color:var(--ink-2);font-size:var(--t-small)}
.partage-statut:empty{margin:0}
/* Téléphone : « Partager… » en bouton principal, « Partager en story » juste dessous, pleine largeur. */
@media (pointer:coarse){
  .partage-liste li:has([data-partage="native"]),.partage-liste li:has([data-partage="story"]){flex:1 0 100%}
  .partage-liste [data-partage="native"],.partage-liste [data-partage="story"]{width:100%;justify-content:center;min-height:52px;font-size:17px;font-weight:800}
  .partage-liste [data-partage="native"]{border:2px solid var(--ink);background:var(--ink);color:var(--on-ink)}
  .partage-liste [data-partage="native"]:hover{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
  .partage-liste [data-partage="story"]{border-width:2px}
}
@media print{.partage{display:none}}

/* Titres de la charte galerie : caractères à empattements, graisse 600. */
.marque,h1,.legal h2,.partage h2{font-family:var(--display);font-weight:600;text-transform:none;letter-spacing:0}