/* Thème « Pop » : néo-brutaliste, couleurs franches, bordures épaisses et ombres pleines décalées */
:root {
  --fond: #fff6e0; --encre: #111; --blanc: #fff;
  --jaune: #ffd23f; --rose: #ff9fb6; --bleu: #8fd0ff; --vert: #a8e77a; --violet: #c9b3ff;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fond); color: var(--encre); font: 17px/1.6 var(--sans); }
a { color: var(--encre); }
main, .entete, .pied { max-width: 720px; margin: 0 auto; padding: 0 20px; }

.entete { padding-top: 44px; padding-bottom: 26px; }
.logo { display: inline-block; font-weight: 900; font-size: 2.3rem; line-height: 1.05; letter-spacing: -.02em; color: var(--encre); text-decoration: none;
  background: var(--jaune); border: 3px solid var(--encre); box-shadow: 6px 6px 0 var(--encre); padding: 8px 16px; transform: rotate(-1.5deg); }
.baseline { font-weight: 700; margin: 22px 0 16px; }
.entete nav { display: flex; flex-wrap: wrap; gap: 10px; }

/* Style commun des « boutons » */
.entete nav a, .recherche button, .categories a, .pagination a, .voisines a {
  border: 3px solid var(--encre); background: var(--blanc); color: var(--encre); text-decoration: none; font-weight: 800;
  padding: 5px 14px; box-shadow: 3px 3px 0 var(--encre); transition: transform .1s, box-shadow .1s; }
.entete nav a:hover, .recherche button:hover, .categories a:hover, .pagination a:hover, .voisines a:hover {
  transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--encre); }

.recherche { display: flex; gap: 10px; margin-bottom: 18px; }
.recherche input { flex: 1; min-width: 0; border: 3px solid var(--encre); padding: 10px 14px; font: 600 16px var(--sans); background: var(--blanc); box-shadow: 3px 3px 0 var(--encre); outline: none; }
.recherche input:focus { background: #fffbe8; }
.recherche button { background: var(--rose); font-size: 15px; cursor: pointer; }

.categories { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 32px; font-size: 14px; }
.categories a { padding: 2px 12px; }
.categories a.actif { background: var(--encre); color: var(--blanc); }
.resultat { font-weight: 700; }

.anecdote { border: 3px solid var(--encre); box-shadow: 8px 8px 0 var(--encre); background: var(--blanc); padding: 24px 26px; margin-bottom: 32px; }
main > article.anecdote:nth-of-type(4n+1) { background: var(--bleu); }
main > article.anecdote:nth-of-type(4n+2) { background: var(--rose); }
main > article.anecdote:nth-of-type(4n+3) { background: var(--vert); }
main > article.anecdote:nth-of-type(4n+4) { background: var(--violet); }
.anecdote h1, .anecdote h2 { margin: 0; font-weight: 900; line-height: 1.15; letter-spacing: -.02em; }
.anecdote h1 { font-size: 2.3rem; }
.anecdote h2 { font-size: 1.55rem; }
.anecdote h1 a, .anecdote h2 a { color: var(--encre); text-decoration: none; }
.anecdote h2 a:hover { text-decoration: underline; text-decoration-thickness: 3px; }
.meta { display: flex; gap: 8px; align-items: center; margin: 10px 0 14px; font-size: 13px; font-weight: 800; }
.num { background: var(--encre); color: var(--blanc); padding: 1px 8px; }
.cat { border: 2px solid var(--encre); background: var(--blanc); color: var(--encre); padding: 0 8px; text-decoration: none; }
.texte p { margin: 0 0 .8em; }
.texte p:last-child { margin: 0; }
.texte strong { background: var(--jaune); padding: 0 3px; }

.pagination, .voisines { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 10px 0 48px; font-weight: 800; }
.voisines a { max-width: 48%; }
.vide { text-align: center; padding: 48px 0; font-weight: 700; }
.pied { border-top: 3px solid var(--encre); margin-top: 40px; padding-top: 18px; padding-bottom: 48px; font-size: 14px; font-weight: 700; text-align: center; }
.apercu-bandeau { background: var(--encre); color: var(--jaune); text-align: center; padding: 8px; font-weight: 900; }
@media (prefers-reduced-motion: reduce) { .entete nav a, .recherche button, .categories a, .pagination a, .voisines a { transition: none; } }

/* Variables du back-office (admin-base.css) */
:root {
  --a-carte: #fff; --a-texte: var(--encre); --a-doux: #444; --a-ligne: var(--encre); --a-bordure: var(--encre);
  --a-accent: var(--rose); --a-accent-texte: var(--encre); --a-accent-lien: var(--encre); --a-champ: #fff;
  --a-btn-bg: var(--jaune); --a-btn-texte: var(--encre); --a-btn-bord: var(--encre);
  --a-police: var(--sans); --a-rayon: 0; --a-rayon-carte: 0; --a-rayon-pastille: 0; --a-bord: 3px;
  --a-ombre: 8px 8px 0 var(--encre); --a-ombre-petite: 3px 3px 0 var(--encre);
  --a-ok-bg: var(--vert); --a-ok: var(--encre); --a-ko-bg: #ffe0e7; --a-ko: #b00020; --a-neutre-bg: #eee;
}
body.admin .statut { border: 2px solid var(--encre); font-weight: 800; }
body.admin .liste td a { font-weight: 700; }
body.admin .liste tbody tr:hover td { background: #fffbe8; }
body.admin .entete nav a { font-size: 14px; }