/* Carnet des goûteurs — un passeport de légumes : couverture, pages à guilloches, tampons. Polices système uniquement. */
:root{
  --couv:#15244b; --couv-2:#22356a; --or:#d9b24c;
  --page:#eef3f6; --page-2:#e2eaf0; --ligne:#c3d1dc; --texte:#1b2433; --gris:#566377;
  --violet:#5a3ea0; --rouge:#c42a3d; --vert:#16805a; --bleu:#1d5fb8; --orange:#b85f12; --ocre:#c99a3a;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--couv);color:var(--texte);
  font-family:"Franklin Gothic Book","Segoe UI",Arial,sans-serif;font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--bleu)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saut{position:absolute;left:-999px;top:0;background:#fff;color:var(--couv);padding:8px 12px;z-index:10}
.saut:focus{left:10px;top:10px}

/* couverture */
.couverture{text-align:center;color:var(--or);padding:30px 20px 24px;
  background:radial-gradient(circle at 50% 0,var(--couv-2),var(--couv) 70%)}
.couverture a{color:var(--or);text-decoration:none;display:inline-block}
.embleme{display:block;width:74px;height:74px;margin:0 auto 10px;border:3px solid var(--or);border-radius:50%;position:relative}
.embleme::before{content:"";position:absolute;left:50%;top:14px;width:16px;height:38px;margin-left:-8px;background:var(--or);border-radius:50% 50% 50% 50%/30% 30% 70% 70%;transform:rotate(18deg)}
.embleme::after{content:"";position:absolute;left:34px;top:6px;width:14px;height:12px;border:3px solid var(--or);border-bottom:none;border-radius:50% 50% 0 0;transform:rotate(18deg)}
.couverture .titre{display:block;font-family:"Franklin Gothic Medium","Arial Narrow",Arial,sans-serif;letter-spacing:.32em;font-size:1.7rem;text-transform:uppercase}
.couverture .sous{display:block;letter-spacing:.2em;font-size:.78rem;text-transform:uppercase;opacity:.85;margin-top:4px}

/* onglets */
nav.onglets{max-width:1180px;margin:0 auto;padding:0 20px}
nav.onglets ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
nav.onglets a{display:block;padding:7px 14px 9px;border-radius:8px 8px 0 0;color:#fff;text-decoration:none;font-size:.9rem;letter-spacing:.03em}
nav.onglets li:nth-child(1) a{background:var(--rouge)} nav.onglets li:nth-child(2) a{background:var(--vert)}
nav.onglets li:nth-child(3) a{background:var(--violet)} nav.onglets li:nth-child(4) a{background:var(--bleu)}
nav.onglets li:nth-child(5) a{background:var(--orange)}
nav.onglets a[aria-current]{box-shadow:inset 0 -4px 0 rgba(255,255,255,.75);text-decoration:underline;text-underline-offset:4px}

/* livre ouvert */
.livre{max-width:1180px;margin:0 auto 34px;padding:0 20px}
.double{display:grid;grid-template-columns:1fr 1fr;background:var(--page);border-radius:6px;box-shadow:0 14px 30px rgba(0,0,0,.35);position:relative;
  background-image:repeating-radial-gradient(circle at 30% 40%,transparent 0 9px,rgba(29,95,184,.05) 9px 10px),
                   repeating-radial-gradient(circle at 80% 70%,transparent 0 13px,rgba(90,62,160,.045) 13px 14px)}
.double::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:30px;margin-left:-15px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(0,0,0,.12) 45%,rgba(0,0,0,.18) 50%,rgba(0,0,0,.12) 55%,transparent)}
.double.seule{grid-template-columns:1fr}
.double.seule::before{display:none}
.feuille{padding:30px 40px 50px;position:relative;min-width:0}
.feuille .folio{position:absolute;bottom:14px;font-size:.78rem;color:var(--gris)}
.feuille:first-child .folio{left:40px} .feuille:last-child .folio{right:40px}
.double.seule .feuille .folio{left:auto;right:40px}
.entete-page{font-family:"Franklin Gothic Medium","Arial Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;color:var(--gris);
  border-bottom:1px solid var(--ligne);padding-bottom:6px;margin:0 0 16px}
h1,h2,h3{font-family:"Franklin Gothic Medium","Arial Narrow",Arial,sans-serif;font-weight:600;line-height:1.2}
h1{font-size:2.1rem;margin:0 0 14px}
h2{font-size:1.35rem;margin:26px 0 8px}
h2.tete{margin-top:0}
h3{font-size:1.1rem;margin:18px 0 6px}
p{margin:0 0 12px}
.chapo{font-size:1.06rem;margin-top:14px}
.feuille ul.liste,.feuille ol.liste{margin:0 0 12px;padding-left:22px}
.feuille ul.liste li,.feuille ol.liste li{margin-bottom:4px}

/* les 4 tampons (légende) */
.quatre{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}
.quatre div{border:2px solid currentColor;border-radius:8px;padding:8px 12px;font-size:.92rem;transform:rotate(-1deg)}
.quatre div:nth-child(2){transform:rotate(1.2deg)}
.quatre div:nth-child(3){transform:rotate(.8deg)}
.quatre b{display:block;font-family:Consolas,"Courier New",monospace;letter-spacing:.08em}

/* visas (accueil) */
.intro-visas{font-size:.95rem}
.visas{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.visa{position:relative;background:#fff;border:1px solid var(--ligne);padding:10px 10px 12px;text-decoration:none;color:var(--texte);display:block}
.visa:hover .nom,.visa:focus .nom{text-decoration:underline}
.visa .photo{display:block;aspect-ratio:35/45;overflow:hidden;background:#fff;border:1px solid #d6dde4;width:62%}
.visa .photo img{width:100%;height:100%;object-fit:cover}
.visa .nom{display:block;font-family:Consolas,"Courier New",monospace;font-size:.82rem;margin-top:6px;text-transform:uppercase;color:var(--bleu)}
.visa .etat{display:block;font-size:.78rem;color:var(--gris)}
.tampon{position:absolute;right:6px;top:18px;width:84px;height:84px;border:3px double currentColor;border-radius:50%;
  display:flex;align-items:center;justify-content:center;text-align:center;font-family:Consolas,"Courier New",monospace;font-size:.62rem;font-weight:700;
  line-height:1.15;text-transform:uppercase;transform:rotate(-14deg);opacity:.85;background:rgba(255,255,255,.35)}
.tampon.rect{border-radius:6px;height:54px;width:96px;transform:rotate(9deg)}
.tampon.ovale{border-radius:50%;width:104px;height:64px;transform:rotate(-6deg)}
.tampon.vide{border:2px dashed #8795a4;color:#6b7a8a;transform:none;opacity:1}
.c-rouge{color:var(--rouge)} .c-vert{color:var(--vert)} .c-violet{color:var(--violet)} .c-bleu{color:var(--bleu)} .c-orange{color:var(--orange)}

.regles{margin:0;padding:0;list-style:none;counter-reset:r}
.regles li{counter-increment:r;padding:8px 0 8px 44px;position:relative;border-bottom:1px dotted var(--ligne)}
.regles li::before{content:counter(r,decimal-leading-zero);position:absolute;left:0;top:8px;font-family:Consolas,monospace;font-weight:700;color:var(--violet);font-size:1.1rem}
.apres-regles{margin-top:14px}
.missions a{display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--texte);border:1px solid var(--ligne);background:#fff;padding:10px;margin-bottom:10px}
.missions a:hover b,.missions a:focus b{text-decoration:underline}
.missions img{width:110px;aspect-ratio:1;object-fit:cover;flex:none}
.missions b{display:block;color:var(--bleu)}
.missions span{font-size:.93rem}

/* bande lisible par machine */
.mrz{font-family:Consolas,"Courier New",monospace;font-size:.92rem;letter-spacing:.14em;color:#33405a;background:rgba(255,255,255,.55);
  padding:10px 14px;border-top:1px solid var(--ligne);word-break:break-all;margin:18px 0 0}
.mrz.bas{background:var(--page);margin:0;border-radius:0 0 6px 6px}

/* fiche d'identité */
.carte{background:#fff;border:1px solid var(--ligne);border-radius:10px;padding:16px;display:grid;grid-template-columns:150px 1fr;gap:16px 18px;position:relative;
  background-image:linear-gradient(135deg,rgba(29,95,184,.06),transparent 60%)}
.carte .photo{aspect-ratio:35/45;border:1px solid #d6dde4;overflow:hidden;align-self:start}
.carte .photo img{width:100%;height:100%;object-fit:cover}
.carte dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:.92rem;align-self:start}
.carte dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--gris);padding-top:3px}
.carte dd{margin:0;font-family:Consolas,"Courier New",monospace;min-width:0}
.carte .mrz{grid-column:1/-1;margin:0}
.mois{display:grid;grid-template-columns:repeat(12,1fr);gap:2px}
.carte .mois{grid-column:1/-1}
.mois span{font-size:.68rem;text-align:center;border:1px solid var(--ligne);padding:2px 0;color:var(--gris);font-family:Consolas,monospace;background:#fff}
.mois span.o{background:var(--vert);color:#fff;border-color:var(--vert)}
.mois span.g{background:var(--ocre);color:#1b2433;border-color:var(--ocre)}
.repere{font-size:.8rem;color:var(--gris);margin:6px 0 0}

.cases{display:grid;grid-template-columns:1fr;gap:12px;margin:12px 0 14px}
.case{background:#fff;border:1px solid var(--ligne);padding:12px 14px 12px 104px;position:relative;min-height:104px;font-size:.93rem}
.case .tampon{left:10px;right:auto;top:12px;width:80px;height:80px}
.case h3{font-size:1rem;margin:0 0 4px}
.case p{margin:0}

.trombone{position:relative;background:#fff;padding:8px;border:1px solid var(--ligne);margin:20px 0;transform:rotate(-1.5deg);box-shadow:0 3px 8px rgba(0,0,0,.12)}
.trombone.d{transform:rotate(1.8deg)}
.trombone::before{content:"";position:absolute;top:-14px;left:28px;width:16px;height:46px;border:3px solid #8a96a6;border-radius:9px;z-index:2}
.trombone figcaption{font-size:.8rem;color:var(--gris);padding-top:6px;font-family:Consolas,monospace}

.journal{margin:12px 0;padding:0;list-style:none}
.journal li{display:grid;grid-template-columns:110px 1fr;gap:14px;padding:12px 0;border-bottom:1px dotted var(--ligne);align-items:start}
.journal .jour{border:2px solid currentColor;border-radius:4px;text-align:center;font-family:Consolas,monospace;font-weight:700;padding:4px 2px;transform:rotate(-4deg);font-size:.9rem}
.journal li:nth-child(even) .jour{transform:rotate(3deg)}
.journal p{margin:0}
.materiel{background:#fff;border:1px dashed var(--gris);padding:12px 16px;margin:0 0 14px}
.materiel ul{margin:6px 0 0;padding-left:20px}

.crayon{border-left:4px solid var(--ocre);background:rgba(255,255,255,.7);padding:10px 14px;margin:14px 0;font-style:italic}
.crayon p:last-child{margin:0}
.tableau{overflow-x:auto;margin:0 0 14px}
.tableau table{border-collapse:collapse;width:100%;background:#fff;font-size:.9rem}
.tableau th,.tableau td{border:1px solid var(--ligne);padding:6px 8px;text-align:left;vertical-align:top}
.tableau th{background:var(--page-2)}

/* calendrier */
.calendrier{background:#fff;border:1px solid var(--ligne);padding:12px;margin:12px 0 14px}
.cal-rang{display:grid;grid-template-columns:minmax(78px,9rem) 1fr;gap:8px;align-items:center;padding:3px 0;border-bottom:1px dotted var(--ligne)}
.cal-tete{border-bottom:none}
.cal-tete .mois span{border:none;background:none;font-weight:700}
.cal-nom{font-size:.88rem;min-width:0;overflow-wrap:anywhere}
.cal-leg{font-size:.8rem;color:var(--gris);margin:8px 0 0}
.cal-leg i{display:inline-block;width:12px;height:12px;vertical-align:-1px;margin-left:6px}
.cal-leg i.o{background:var(--vert)} .cal-leg i.g{background:var(--ocre)}

.sources{font-size:.85rem;color:var(--gris);border-top:1px solid var(--ligne);padding-top:10px;margin-top:22px}
.sources h2{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;margin:0 0 4px}
.sources ul{margin:0;padding-left:18px}
.mot-fin{font-size:.85rem;color:var(--gris);font-style:italic;margin-top:14px}
.suite{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.suite a{border:1px solid var(--ligne);background:#fff;padding:6px 12px;border-radius:16px;text-decoration:none;font-size:.88rem}
.suite a:hover,.suite a:focus{text-decoration:underline}

/* pied */
.pied{max-width:1180px;margin:0 auto;color:#c4cde0;font-size:.88rem;padding:6px 20px 34px}
.pied a{color:var(--or)}
.sommaire{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;border-top:1px solid rgba(217,178,76,.35);padding-top:18px;margin-bottom:14px}
.sommaire h2{color:var(--or);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;margin:0 0 6px}
.sommaire ul{list-style:none;margin:0;padding:0}
.sommaire li{margin:0 0 3px}
.pied > p{text-align:center;margin:0}

@media (max-width:900px){
  .double{grid-template-columns:1fr}
  .double::before{display:none}
  .feuille:first-child{border-bottom:2px dashed var(--ligne)}
  .double.seule .feuille:first-child{border-bottom:none}
  .feuille .folio{left:auto!important;right:24px!important}
}
@media (max-width:560px){
  body{font-size:16px}
  .couverture{padding:22px 16px 18px}
  .couverture .titre{font-size:1.15rem;letter-spacing:.2em}
  nav.onglets{padding:0 10px}
  nav.onglets a{padding:6px 10px 8px;font-size:.84rem}
  .livre{padding:0 10px}
  .feuille{padding:22px 16px 42px}
  h1{font-size:1.65rem}
  .visas{grid-template-columns:1fr 1fr;gap:12px}
  .tampon{width:66px;height:66px;font-size:.52rem;top:12px}
  .tampon.rect{width:76px;height:46px}.tampon.ovale{width:80px;height:52px}
  .quatre,.cases{grid-template-columns:1fr}
  .carte{grid-template-columns:96px 1fr;gap:12px;padding:12px}
  .carte dl{grid-template-columns:1fr;gap:0}
  .carte dd{margin-bottom:4px}
  .journal li{grid-template-columns:86px 1fr;gap:10px}
  .missions img{width:80px}
  .mrz{font-size:.72rem;letter-spacing:.06em}
  .cal-rang{grid-template-columns:72px 1fr;gap:6px}
  .mois span{font-size:.6rem}
  .sommaire{grid-template-columns:1fr}
}