/* css/ana.css — thème « comme ana.sh » (2026-09-13), chargé par head.php sur toutes les pages.
   Jetons clair/sombre (palette gray / iron d'ana.sh), Manrope (substitut de PP Mori), cartes à double cadre,
   libellés en petites capitales grises, boutons pilule, liens violets. Le mode suit le réglage enregistré (data-theme)
   sinon les préférences du système. */
:root{
  --bg:#f9fafb;--fg:#000;--card:#fff;--card-in:#fcfcfd;--line:#eaecf0;--line-2:#d0d5dd;
  --g50:#f9fafb;--g100:#f2f4f7;--g200:#eaecf0;--g300:#d0d5dd;--g400:#98a2b3;--g500:#667085;--g600:#475467;--g700:#344054;--g800:#1d2939;--g900:#101828;
  --eyebrow:#98a2b3;--muted:#667085;--strong:#344054;--chev:#d0d5dd;
  --brand:#6938ef;--brand-400:#9b8afb;--brand-500:#7a5af8;--brand-700:#5925dc;--brand-200:#d9d6fe;
  --ok:#12b76a;--danger:#f04438;--glow:rgba(166,255,0,.55);
  --font:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
  --r:10px;--r-in:6px;--shadow:0 1px 2px rgba(0,0,0,.05);
  color-scheme:light;
  /* alias des anciens jetons « forêt » pour les feuilles annexes */
  --card-2:var(--card);--moss:var(--brand);--fern:var(--muted);--lichen:var(--strong);--stream:var(--g400);--ground:var(--bg);--body:var(--font);--ink:var(--fg);
}
html[data-theme="dark"]{
  --bg:#131316;--fg:#fff;--card:#1a1a1e;--card-in:rgba(31,31,36,.5);--line:#27272a;--line-2:#3f3f46;
  --g50:#1a1a1e;--g100:#27272a;--g200:#27272a;--g300:#3f3f46;--g400:#70707b;--g500:#a0a0ab;--g600:#a0a0ab;--g700:#d1d1d6;--g800:#e4e4e7;--g900:#f4f4f5;
  --eyebrow:#70707b;--muted:#a0a0ab;--strong:#d1d1d6;--chev:#51525c;--brand:#9b8afb;--brand-200:#3e1c96;--shadow:0 1px 2px rgba(0,0,0,.3);
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]){
    --bg:#131316;--fg:#fff;--card:#1a1a1e;--card-in:rgba(31,31,36,.5);--line:#27272a;--line-2:#3f3f46;
    --g50:#1a1a1e;--g100:#27272a;--g200:#27272a;--g300:#3f3f46;--g400:#70707b;--g500:#a0a0ab;--g600:#a0a0ab;--g700:#d1d1d6;--g800:#e4e4e7;--g900:#f4f4f5;
    --eyebrow:#70707b;--muted:#a0a0ab;--strong:#d1d1d6;--chev:#51525c;--brand:#9b8afb;--brand-200:#3e1c96;--shadow:0 1px 2px rgba(0,0,0,.3);
    color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--font);font-size:16px;line-height:1.5;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}
a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-700)}
html[data-theme="dark"] a:hover{color:#bdb4fe}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit;color:inherit}
::selection{background:var(--brand-200);color:var(--fg)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

/* libellé de carte : petites capitales grises + icône */
.eb,.hd{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:-.02em;text-transform:uppercase;color:var(--eyebrow)}
.eb svg,.hd svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hd b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd .end{margin-left:auto;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--eyebrow);white-space:nowrap}

/* cartes : blanc à bord gris, intérieur gris-25 */
.card-base{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:4px;box-shadow:var(--shadow)}
.card-inner{background:var(--card-in);border:1px solid var(--line);border-radius:var(--r-in);padding:16px;height:100%;display:flex;flex-direction:column;justify-content:space-between}

/* textes */
.muted,.sub{color:var(--muted);font-size:14px;line-height:1.5}
.strong{color:var(--strong)}
.big{font-size:20px;font-weight:500;color:var(--strong);line-height:1.3;letter-spacing:-.02em}

/* boutons */
.pill-btn,.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:9999px;border:1px solid var(--line);background:var(--card);color:var(--fg);font-size:14px;font-weight:500;cursor:pointer;box-shadow:var(--shadow);text-decoration:none;transition:border-color .2s,background .2s}
.pill-btn:hover,.btn:hover{border-color:var(--line-2);color:var(--fg)}
.pill-btn span,.pill-btn .chev{color:var(--chev);font-size:16px;line-height:1}
.btn.ghost{box-shadow:none;background:transparent}
.go{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:500;color:var(--brand);background:none;border:0;padding:0;cursor:pointer}
.go:hover{color:var(--brand-700)}

/* page simple (blog / portfolio d'ana.sh) : colonne centrée */
.page-wrap{max-width:768px;margin:0 auto;padding:96px 24px 120px}
.page-wrap.narrow{max-width:672px}
.page-title{font-size:24px;font-weight:600;letter-spacing:-.02em;color:var(--fg);margin-bottom:24px}
.page-sub{color:var(--muted);font-size:16px;line-height:1.6;max-width:60ch}
.year{font-size:18px;font-weight:500;color:var(--g400);margin:28px 0 8px}
.post-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:6px 0;font-size:16px}
.post-row a{color:var(--strong);text-decoration:underline;text-decoration-color:var(--g300);text-underline-offset:3px}
.post-row a:hover{color:var(--fg);text-decoration-color:var(--g400)}
.post-row time{color:var(--g400);font-size:16px;white-space:nowrap}
.prose{color:var(--strong);font-size:16px;line-height:1.75}
.prose p+p{margin-top:1em}
.prose.verse{white-space:pre-line}
.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--g400);font-size:14px;font-weight:500;margin-bottom:28px}
.back-link:hover{color:var(--muted)}

/* bascule clair / sombre flottante (sous-pages) et interrupteur de l'accueil */
.theme-btn{position:fixed;right:24px;bottom:24px;z-index:60;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow);display:grid;place-items:center;cursor:pointer;color:var(--g400);transition:color .2s,border-color .2s}
.theme-btn:hover{color:var(--strong);border-color:var(--line-2)}
.theme-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.theme-btn .moon{display:none}
html[data-theme="dark"] .theme-btn .sun{display:none}
html[data-theme="dark"] .theme-btn .moon{display:block}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .theme-btn .sun{display:none}html:not([data-theme="light"]) .theme-btn .moon{display:block}}

/* transition de page */
.pg-tr{position:fixed;inset:0;z-index:70;background:var(--bg);opacity:0;pointer-events:none;transition:opacity .28s ease}
.pg-tr.out{opacity:1;pointer-events:auto}

/* pied de page */
footer{padding:32px 24px 40px;text-align:center;font-size:12px;color:var(--g400)}
footer .roots{display:none}
footer .brand{display:block;color:var(--strong);font-weight:600;font-size:14px;margin-bottom:4px}

/* porte d'entrée (musique) de l'accueil */
.gate{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:24px;background:rgba(16,24,40,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:1;transition:opacity .4s}
.gate.hide{opacity:0;pointer-events:none}
.gate-box{width:min(380px,100%);text-align:center;padding:32px 28px 24px;border:1px solid var(--line);border-radius:12px;background:var(--card);box-shadow:0 20px 60px -20px rgba(0,0,0,.35)}
.gate-box .leaf{font-size:28px;line-height:1;margin-bottom:12px}
.gate-box h2{font-size:20px;font-weight:600;letter-spacing:-.02em;color:var(--fg);line-height:1.3;margin-bottom:6px}
.gate-box p{font-size:14px;color:var(--muted);margin-bottom:20px}
.gate-box .btn{width:100%;justify-content:center;background:var(--fg);color:var(--bg);border-color:var(--fg);padding:11px}
.gate-box .btn:hover{opacity:.9;color:var(--bg)}
.gate-box .skip{display:block;margin:12px auto 0;background:none;border:0;color:var(--g400);font-size:13px;cursor:pointer}
.gate-box .skip:hover{color:var(--muted)}
@media(prefers-reduced-motion:reduce){.pg-tr,.gate{transition:none}}