/* Polices auto-hébergées : aucune requête vers Google (OPSEC) */
@font-face{font-family:"Michroma";src:url(../fonts/michroma.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(../fonts/source-sans-3.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(../fonts/ibm-plex-mono.woff2) format("woff2");font-weight:400 500;font-display:swap}
@font-face{font-family:"Courier Prime";src:url(../fonts/courier-prime.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Courier Prime";src:url(../fonts/courier-prime-bold.woff2) format("woff2");font-weight:700;font-display:swap}
/* Si tu lis le CSS, tu mérites un café. Le blaireau, lui, préfère les vers de terre. */
/* Palette: DGSE — bleu marine profond, panneaux ardoise, accent sable doré; red only for stamps.
   Layout: a surveillance screen at night. Dark ops HUD for the shell, paper dossiers (fiches, note de renseignement) pinned on top of it. */
:root{
  --void:#04103A;       /* bleu marine DGSE */
  --deep:#0A1A4A;       /* panels */
  --panel:#1B2A57;      /* cartes ardoise DGSE */
  --blue:#8E8574;       /* accent sable doré DGSE */
  --blue-soft:#7A7264;  /* sable sourd: labels */
  --france:#000091;     /* Bleu France */
  --ink:#F4F3EE;        /* blanc */
  --muted:#A6AFC8;      /* secondary text */
  --line:rgba(255,255,255,.12);
  --red:#E1000F;        /* Rouge Marianne */
  --stamp:#D3122A;      /* rubber stamp red */
  --paper:#E8DDC4;      /* beau papier beige */
  --paper-ink:#1F1A14;  /* encre machine à écrire */
  --gold:#D9B45A;       /* aviator frames */
  --term:#C9D7FF;      /* terminal (intro kept) */
  --f-display:"Michroma","Eurostile","Bank Gothic","Arial Black",sans-serif;
  --f-body:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif;
  --f-hud:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --f-type:"Courier Prime","Courier New",Courier,monospace;
  color-scheme:dark;
}
[hidden]{display:none!important}
@property --hole{syntax:'<length>';inherits:false;initial-value:0px}
html{scroll-behavior:smooth;background:var(--void)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--void);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;overflow-x:hidden}
html[lang=fr] .en, html[lang=en] .fr{display:none!important}
a{color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3,h4{font-family:var(--f-display);text-wrap:balance;margin:0;line-height:1;font-weight:600;letter-spacing:.02em;text-transform:uppercase}
p{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hud{font-family:var(--f-hud);letter-spacing:.12em;text-transform:uppercase}

/* ambient: binary rain + scanlines + vignette */
#rain{position:fixed;inset:0;width:100%;height:100%;z-index:0;opacity:.16;pointer-events:none}
body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;background:
  repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px),
  radial-gradient(ellipse at 50% 40%,transparent 55%,rgba(0,0,0,.55) 100%)}
.page{position:relative;z-index:2}

/* ---------- INTRO ---------- */
#intro{position:fixed;inset:0;z-index:100;background:var(--void);display:grid;place-items:center;padding:24px max(16px,env(safe-area-inset-left,0px));
  -webkit-mask:radial-gradient(circle at 50% 50%,transparent var(--hole),#000 calc(var(--hole) + 1px));
          mask:radial-gradient(circle at 50% 50%,transparent var(--hole),#000 calc(var(--hole) + 1px));
  transition:--hole 1.5s cubic-bezier(.75,0,.25,1)}
#intro.enter{--hole:150vmax}
.term-box{width:min(720px,100%);border:1px solid var(--line);border-radius:10px;background:#00001F;box-shadow:0 0 0 1px rgba(47,107,255,.35),0 30px 80px rgba(0,0,0,.6),0 0 140px rgba(47,107,255,.22);overflow:hidden;transition:opacity .4s,transform .6s}
#intro.tunnel .term-box{opacity:0;transform:scale(.9)}
.term-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line);font-family:var(--f-hud);font-size:12px;color:var(--muted);letter-spacing:.06em}
.term-bar i{width:11px;height:11px;border-radius:50%;display:block}
.term-bar i:nth-child(1){background:#2F4BFF}.term-bar i:nth-child(2){background:#F5F5FE}.term-bar i:nth-child(3){background:var(--red)}
.term-bar span{margin-left:auto}
#intro-out{margin:0;padding:18px 18px 22px;min-height:380px;max-height:calc(100vh - 120px);overflow:hidden;font-family:var(--f-hud);font-size:13px;line-height:1.5;color:var(--term);white-space:pre-wrap;word-break:break-word}
#intro-out .ok{color:#7CE0A3}#intro-out .gold{color:var(--gold);font-weight:600}#intro-out .dim{color:var(--muted)}#intro-out .w{color:var(--ink)}#intro-out .red{color:#FF4D5E}
.art .mono{color:#DDE4FF}
.art{display:block;line-height:1.08;font-size:10.5px;white-space:pre;margin:6px 0 10px;font-family:"DejaVu Sans Mono",Menlo,Consolas,monospace;letter-spacing:0}
.art .fur{color:#3A4A80}.art .wh{color:#F5F7FF}.art .gd{color:var(--gold)}.art .ln{color:#0B1440}.art .hl{color:#6F9BFF}.art .ns{color:#05070F}.art .st{color:#0C2A8A}.art .ti{color:#3A5BD9}
@media (max-width:520px){.art{font-size:7px}}
.cursor{display:inline-block;width:.6em;height:1.1em;background:var(--term);vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
#intro{transition:--hole 1.5s cubic-bezier(.75,0,.25,1),background-color .5s}
#burrow{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .5s}
#intro.tunnel #burrow{opacity:1}
.entering{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:10px;opacity:0;transition:opacity .4s .3s;pointer-events:none;text-align:center}
#intro.tunnel .entering{opacity:1}
#intro.enter .entering{opacity:0;transition-delay:0s}
.entering b{font-family:var(--f-hud);font-weight:500;font-size:clamp(18px,3vw,30px);letter-spacing:.42em;color:#F2E6CF;text-shadow:0 0 18px rgba(0,0,0,.9),0 0 2px #000;padding-left:.42em}
.entering span{font-family:var(--f-hud);font-size:13px;letter-spacing:.2em;color:#8E8574;text-shadow:0 0 8px #000}
.entering i{display:block;width:220px;height:2px;background:rgba(242,230,207,.15)}
.entering em{display:block;height:100%;width:0;background:#8E8574}
#skip{position:absolute;right:max(16px,calc(env(safe-area-inset-right,0px) + 16px));bottom:calc(env(safe-area-inset-bottom,0px) + 18px);font-family:var(--f-hud);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:3px;padding:8px 12px;cursor:pointer}
#skip:hover{color:var(--ink);border-color:var(--muted)}

/* ---------- HEADER ---------- */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:#000}
header.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(4,16,58,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.classif{background:#0A0004;border-bottom:1px solid rgba(225,0,15,.45);text-align:center;font-family:var(--f-hud);font-size:11px;letter-spacing:.24em;color:#FF4D5E;padding:5px 12px;text-transform:uppercase}
.nav-in{display:flex;align-items:center;gap:22px;height:60px;position:relative}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--f-display);font-weight:700;font-size:20px;letter-spacing:.12em}
.brand img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid rgba(142,133,116,.5);box-shadow:none}
.nav-links{display:flex;gap:24px;margin-left:auto;font-family:var(--f-hud);font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.nav-links a{text-decoration:none;color:var(--muted)}
.nav-links a:hover{color:var(--ink)}
.lang{display:flex;border:1px solid var(--line);border-radius:3px;overflow:hidden;font-family:var(--f-hud);font-size:12px}
.lang button{background:transparent;color:var(--muted);border:0;padding:6px 9px;cursor:pointer;font:inherit;letter-spacing:.08em}
html[lang=fr] .lang [data-l=fr],html[lang=en] .lang [data-l=en]{background:var(--france);color:#fff}
#menu-btn{display:none;background:transparent;border:1px solid var(--line);color:var(--ink);border-radius:3px;padding:6px 10px;font-family:var(--f-hud);font-size:12px;letter-spacing:.1em;cursor:pointer}
@media (max-width:860px){
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--void);border-bottom:1px solid var(--line);padding:6px max(16px,env(safe-area-inset-right,0px)) 12px max(16px,env(safe-area-inset-left,0px))}
  .nav-links.open{display:flex}
  .nav-links a{padding:11px 0;border-bottom:1px solid var(--line)}
  #menu-btn{display:block;margin-left:auto}
}

/* ---------- DEPTH GAUGE ---------- */
.gauge{position:fixed;right:max(14px,calc(env(safe-area-inset-right,0px) + 14px));top:50%;transform:translateY(-50%);z-index:15;display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--f-hud);font-size:11px;color:var(--muted);letter-spacing:.1em}
.gauge .track{width:2px;height:170px;background:var(--line);position:relative}
.gauge .fill{position:absolute;inset:0 0 auto;height:0;background:var(--blue);box-shadow:none}
.gauge strong{color:var(--ink);font-weight:400;font-variant-numeric:tabular-nums}
@media (max-width:1180px){.gauge{display:none}}

/* ---------- SHARED ---------- */
section{position:relative;padding-block:100px}
.sec-head{display:grid;gap:14px;margin-bottom:46px;max-width:780px}
.file-tab{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font-family:var(--f-hud);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-soft)}
.file-tab .no{color:#fff;background:var(--france);padding:3px 8px;border:0}
.file-tab .dp{color:var(--muted)}
.sec-head h2{font-size:clamp(38px,6vw,76px);font-weight:700;letter-spacing:.01em;line-height:1.02}
.sec-head h2 em{font-style:normal;color:var(--blue)}
.sec-head h2::after{content:"";display:block;width:84px;height:3px;background:var(--blue);margin-top:22px}
.sec-head p{color:var(--muted);max-width:62ch}
.redact{background:var(--ink);color:transparent;padding:0 .3em;cursor:help;transition:background .3s,color .3s;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.redact:hover,.redact:focus-visible{background:transparent;color:var(--blue-soft);outline:none}
.paper .redact{background:var(--paper-ink)}
.paper .redact:hover,.paper .redact:focus-visible{background:transparent;color:var(--stamp)}
.stamp{display:inline-block;font-family:var(--f-body);font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--stamp);border:3px double var(--stamp);padding:3px 10px;border-radius:4px;transform:rotate(-8deg);opacity:.88;line-height:1.1}
.brackets{position:relative}
.brackets::before,.brackets::after{display:none;content:"";position:absolute;width:22px;height:22px;border:1px solid var(--blue);pointer-events:none}
.brackets::before{top:-8px;left:-8px;border-right:0;border-bottom:0}
.brackets::after{bottom:-8px;right:-8px;border-left:0;border-top:0}
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:2px;text-decoration:none;font-family:var(--f-body);font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;border:2px solid var(--ink);background:rgba(27,42,87,.6);color:var(--ink);cursor:pointer}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#04103A}
.btn.primary:hover{background:#A39A88}
.btn:hover{border-color:var(--blue-soft)}

/* ---------- HERO ---------- */
.hero{padding-block:44px 90px}
.monitor{position:relative;border:1px solid rgba(142,133,116,.3);background:#000;box-shadow:0 0 0 6px rgba(27,42,87,.9),0 0 0 7px var(--line),0 40px 120px rgba(0,0,0,.7),0 0 0 transparent}
.monitor img{display:block;width:100%;height:auto;aspect-ratio:1600/712}
.monitor .hudl{position:absolute;font-family:var(--f-hud);font-size:12px;letter-spacing:.14em;color:rgba(242,245,255,.85);text-shadow:0 1px 4px #000;text-transform:uppercase}
.monitor .tl{top:12px;left:14px}.monitor .tr{top:12px;right:14px;color:#FF4D5E}
.monitor .bl{bottom:10px;left:14px;color:var(--blue-soft)}.monitor .br{bottom:10px;right:14px}
.rec::before{content:"●";margin-right:6px;animation:blink 1.2s steps(1) infinite}
.monitor .corner{position:absolute;width:28px;height:28px;border:2px solid rgba(242,245,255,.75)}
.c1{top:30px;left:30px;border-right:0;border-bottom:0}.c2{top:30px;right:30px;border-left:0;border-bottom:0}.c3{bottom:30px;left:30px;border-right:0;border-top:0}.c4{bottom:30px;right:30px;border-left:0;border-top:0}
@media (max-width:640px){.monitor .corner{display:none}.monitor .hudl{font-size:9px;letter-spacing:.08em}.monitor .bl,.monitor .br{display:none}}
.brief{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;margin-top:46px;align-items:start}
.brief>*{min-width:0}
.motto{font-family:var(--f-display);font-size:clamp(28px,3.4vw,44px);font-weight:700;line-height:1.15;letter-spacing:.02em;text-transform:uppercase}
.motto b{font-weight:600;color:var(--blue)}
.lede{color:var(--muted);margin:16px 0 26px;max-width:52ch}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.dossier{font-family:var(--f-type);font-size:14px;background:var(--paper);color:var(--paper-ink);padding:22px 24px 20px;position:relative;box-shadow:0 20px 50px rgba(0,0,0,.55);transform:rotate(.6deg)}
.dossier .hd{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;border-bottom:2px solid var(--paper-ink);padding-bottom:8px;margin-bottom:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px}
.dossier .hd .c{color:var(--stamp)}
.dossier dl{display:grid;grid-template-columns:auto 1fr;gap:5px 16px;margin:0}
.dossier dt{font-weight:700;text-transform:uppercase}
.dossier dd{margin:0;min-width:0}
.dossier .stamp{position:absolute;right:16px;bottom:14px;font-size:20px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:54px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat{padding:20px 18px;border-left:1px solid var(--line);display:grid;gap:4px}
.stat:first-child{border-left:0;padding-left:0}
.stat .k{font-family:var(--f-hud);font-size:11px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase}
.stat strong{font-family:var(--f-display);font-size:50px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.stat.hot strong{color:var(--blue)}
@media (max-width:900px){.brief{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.stat:nth-child(3){border-left:0;padding-left:0}.stat:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:480px){.stat strong{font-size:38px}.stat{padding:16px 12px}}

/* ---------- MEUTE : fiches signalétiques ---------- */
.pack{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.fiche{background:var(--paper);color:var(--paper-ink);padding:14px 14px 16px;position:relative;box-shadow:0 18px 40px rgba(0,0,0,.55);transform:rotate(var(--r,0deg));transition:transform .25s;font-family:var(--f-type);font-size:13px;min-width:0;display:flex;flex-direction:column;gap:10px}
.fiche:hover{transform:rotate(0) translateY(-4px)}
.fiche .top{display:flex;justify-content:space-between;font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--paper-ink);padding-bottom:6px}
.fiche .top .c{color:var(--stamp)}
.fiche .ph{position:relative;aspect-ratio:1;overflow:hidden;background:#0a1030;border:1px solid var(--paper-ink)}
.fiche .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(.95)}
.fiche .ph::after{content:"";position:absolute;inset:0;background:rgba(0,0,145,.3);mix-blend-mode:screen}
.fiche .clip{position:absolute;top:-10px;left:18px;width:14px;height:44px;border:3px solid #9aa0ad;border-radius:8px;z-index:2}
.fiche .call{font-family:var(--f-display);font-weight:700;font-size:19px;text-transform:uppercase;line-height:1;letter-spacing:.02em}
.fiche dl{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0;font-size:12px}
.fiche dt{font-weight:700;text-transform:uppercase}
.fiche dd{margin:0;min-width:0;overflow-wrap:anywhere}
.fiche .handle{margin-top:auto;border-top:1px dashed var(--paper-ink);padding-top:8px;font-size:12px;color:var(--france);text-decoration:none;font-weight:700;overflow-wrap:anywhere}
.fiche a.handle:hover{text-decoration:underline}
.fiche .stamp{position:absolute;right:10px;top:46%;font-size:15px;background:rgba(228,226,220,.55)}
.bench{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.bench>div{border:0;border-bottom:4px solid var(--blue);background:var(--panel);padding:20px 22px;min-width:0}
.bench h3{font-size:19px;color:var(--blue);font-weight:600;letter-spacing:.08em;margin-bottom:4px}
.bench p{font-size:14px;color:var(--muted);margin-bottom:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{font-family:var(--f-hud);font-size:13px;padding:5px 10px;border:1px solid var(--line);background:rgba(142,133,116,.06);letter-spacing:.04em}
@media (max-width:1060px){.pack{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.pack{grid-template-columns:1fr 1fr}.bench{grid-template-columns:1fr}}
@media (max-width:480px){.pack{grid-template-columns:1fr}.fiche{display:grid;grid-template-columns:120px 1fr;gap:10px 14px;align-items:start}.fiche .top{grid-column:1/-1}.fiche .ph{grid-row:span 3}.fiche .handle{grid-column:2}.fiche .stamp{top:auto;bottom:12px;left:20px;right:auto}}

/* ---------- PALMARES : registre des opérations ---------- */
.ledger{border:0;border-bottom:4px solid var(--blue);background:var(--panel)}
.ledger .lh,.ledger .row{display:grid;grid-template-columns:118px 64px minmax(0,1.6fr) minmax(0,1fr) 120px;gap:16px;align-items:center;padding:14px 20px}
.ledger .lh{font-family:var(--f-hud);font-size:11px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase;border-bottom:1px solid var(--line);background:rgba(0,0,145,.25)}
.ledger .yr{padding:10px 20px;font-family:var(--f-display);font-size:24px;font-weight:600;letter-spacing:.1em;color:var(--blue);border-top:1px solid var(--line);background:rgba(0,0,0,.25)}
.ledger .row{border-top:1px solid rgba(142,133,116,.08);position:relative}
.ledger .row>*{min-width:0}
.ledger .op{font-family:var(--f-hud);font-size:12px;color:var(--muted);letter-spacing:.08em}
.ledger .rk{font-family:var(--f-display);font-size:32px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.ledger .rk sup{font-size:.42em;margin-left:2px;font-family:var(--f-body);font-weight:600}
.ledger h4{font-size:16px;font-weight:700;letter-spacing:.03em}
.ledger .org{font-size:14px;color:var(--muted)}
.ledger .note{display:block;font-size:13px;color:var(--muted);margin-top:3px;font-family:var(--f-body);text-transform:none;letter-spacing:0;font-weight:400}
.ledger .fx{font-family:var(--f-hud);font-size:12px;color:var(--muted);text-align:right;letter-spacing:.06em}
.ledger .row.win .rk{color:var(--blue)}
.ledger .row.win{background:linear-gradient(90deg,rgba(142,133,116,.08),transparent 70%)}
.ledger .row.win .ttl::after{content:"MISSION ACCOMPLIE";margin-left:12px;font-family:var(--f-body);font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--stamp);border:2px solid var(--stamp);padding:1px 6px;border-radius:3px;display:inline-block;transform:rotate(-4deg);vertical-align:3px}
html[lang=en] .ledger .row.win .ttl::after{content:"MISSION ACCOMPLISHED"}
.ledger .row.pod .rk{color:var(--ink)}
.ledger .row .rk{color:var(--muted)}
@media (max-width:820px){
  .ledger .lh{display:none}
  .ledger .row{grid-template-columns:58px minmax(0,1fr);gap:4px 14px;padding:14px 16px}
  .ledger .rk{grid-row:span 4;font-size:30px}
  .ledger .op,.ledger .org,.ledger .fx{grid-column:2;text-align:left}
  .ledger .op{grid-row:1}
  .ledger .row.win .ttl::after{display:table;margin:6px 0 2px}
}

/* ---------- MISSIONS : note de renseignement ---------- */
.note-doc{background:var(--paper);color:var(--paper-ink);font-family:var(--f-type);max-width:900px;margin:0 auto;padding:36px clamp(20px,5vw,56px) 44px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.note-doc .classtop{text-align:center;color:var(--stamp);font-weight:700;letter-spacing:.3em;font-size:14px}
.note-doc .tlp{position:absolute;top:18px;right:20px;font-family:var(--f-hud);font-size:11px;background:#000;color:#fff;padding:3px 8px;letter-spacing:.1em}
.note-doc h3{font-family:var(--f-type);text-transform:uppercase;font-size:20px;letter-spacing:.06em;text-align:center;margin:18px 0 22px;line-height:1.3;font-weight:700}
.note-doc dl.memo{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;margin:0 0 24px;padding:14px 0;border-top:2px solid var(--paper-ink);border-bottom:2px solid var(--paper-ink);font-size:15px}
.note-doc dl.memo dt{font-weight:700;text-transform:uppercase}
.note-doc dl.memo dd{margin:0;min-width:0}
.note-doc ol{margin:0;padding-left:1.6em;display:grid;gap:14px;font-size:16px;line-height:1.55}
.note-doc ol li::marker{font-weight:700}
.note-doc ol b{text-transform:uppercase}
.note-doc .sign{margin-top:28px;display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;font-size:14px}
.note-doc .stamp{font-size:24px}
.note-doc .foot{margin-top:24px;text-align:center;color:var(--stamp);font-weight:700;letter-spacing:.3em;font-size:12px}
@media (max-width:520px){.note-doc .tlp{position:static;display:inline-block;margin-bottom:12px}}

/* ---------- CONSOLE ---------- */
.console{border:1px solid rgba(142,133,116,.25);border-radius:8px;background:#00001F;overflow:hidden}
#con-out{height:340px;overflow-y:auto;padding:16px 18px;font-family:var(--f-hud);font-size:14px;line-height:1.55;color:var(--term);white-space:pre-wrap;word-break:break-word}
#con-out .w{color:var(--ink)}#con-out .g{color:var(--blue-soft)}#con-out .d{color:var(--muted)}#con-out .r{color:#FF6B78}
#con-out .art{font-size:10px}
@media (max-width:520px){#con-out .art{font-size:6.5px}}
.con-in{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding:10px 18px;font-family:var(--f-hud);font-size:14px}
.con-in label{color:#7CE0A3;white-space:nowrap}
#con-cmd{flex:1;min-width:0;background:transparent;border:0;color:var(--ink);font:inherit;outline:none;caret-color:var(--term)}
.hints{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.hints button{font-family:var(--f-hud);font-size:12px;background:transparent;color:var(--muted);border:1px solid var(--line);border-radius:2px;padding:6px 10px;cursor:pointer;letter-spacing:.06em}
.hints button:hover{color:var(--ink);border-color:var(--blue-soft)}
code{font-family:var(--f-hud);color:var(--blue-soft)}

/* ---------- GALERIE : pièces à conviction ---------- */
.board{display:grid;grid-template-columns:.82fr 1fr;gap:34px;padding:38px;background:
  radial-gradient(circle at 30% 20%,rgba(142,133,116,.07),transparent 60%),
  repeating-linear-gradient(0deg,rgba(142,133,116,.05) 0 1px,transparent 1px 32px),
  repeating-linear-gradient(90deg,rgba(142,133,116,.05) 0 1px,transparent 1px 32px),#0A1A4A;border:1px solid var(--line)}
.shot{background:#F4F4F1;padding:9px 9px 12px;box-shadow:0 14px 30px rgba(0,0,0,.6);transform:rotate(var(--r,0deg));transition:transform .25s;position:relative;margin:0;min-width:0}
.shot:hover{transform:rotate(0) scale(1.03);z-index:2}
.shot::before{content:"";position:absolute;top:-8px;left:50%;width:14px;height:14px;border-radius:50%;transform:translateX(-50%);background:var(--red);box-shadow:0 2px 4px rgba(0,0,0,.6);z-index:1}
.shot.tall{grid-row:span 2;display:flex;flex-direction:column}
.shot .ph{display:block;width:100%;padding:0;border:0;cursor:zoom-in;background:#000;aspect-ratio:4/3;overflow:hidden}
.shot.tall .ph{aspect-ratio:auto;flex:1;min-height:0}
.shot .ph img{display:block;width:100%;height:100%;object-fit:cover}
.shot figcaption{font-family:var(--f-type);font-size:12px;color:var(--paper-ink);margin-top:9px;line-height:1.4;display:grid;gap:1px}
.shot figcaption .pc{font-weight:700;color:var(--stamp);letter-spacing:.08em;text-transform:uppercase}
.shot figcaption b{font-size:13px}
@media (max-width:760px){.board{grid-template-columns:1fr;padding:20px;gap:28px}.shot.tall{grid-row:auto}.shot.tall .ph{aspect-ratio:3/4}}
#lightbox{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.92);display:grid;place-items:center;padding:calc(env(safe-area-inset-top,0px) + 24px) max(16px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 24px) max(16px,env(safe-area-inset-left,0px));cursor:zoom-out}
#lightbox img{max-width:100%;max-height:100%;object-fit:contain;border:6px solid #F4F4F1}
#lb-close{position:absolute;top:calc(env(safe-area-inset-top,0px) + 14px);right:max(16px,calc(env(safe-area-inset-right,0px) + 16px));background:var(--blue);color:#fff;border:0;border-radius:2px;width:40px;height:40px;font-size:18px;cursor:pointer}

/* ---------- ALLIÉS / CONTACT ---------- */
.partners{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.partner .lg{height:118px;display:flex;align-items:center;justify-content:center;background:#fff;padding:14px;margin:4px 0 8px}
.partner .lg img{max-height:90px;max-width:100%;object-fit:contain}
.partner{border:0;border-bottom:4px solid var(--blue);padding:24px 22px;text-decoration:none;display:grid;gap:6px;background:var(--panel);min-width:0}
.partner:hover{background:#24356A}
.partner .hud{font-size:11px;color:var(--blue-soft)}
.partner strong{font-family:var(--f-display);font-size:19px;font-weight:600;text-transform:uppercase;line-height:1;letter-spacing:.04em}
.partner .d{font-size:14px;color:var(--muted)}
@media (max-width:980px){.partners{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.partners{grid-template-columns:1fr}}
.contact-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:20px}
.contact-grid>*{min-width:0}
.card{border:0;border-bottom:4px solid var(--blue);padding:28px;background:var(--panel);display:grid;gap:16px;align-content:start;position:relative}
.card h3{font-size:24px;font-weight:600;letter-spacing:.03em}
.card .hud{font-size:12px;color:var(--blue-soft)}
.card p{color:var(--muted);font-size:16px}
.mail{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.mail code{font-size:16px;color:var(--ink);background:#04103A;border:1px solid rgba(142,133,116,.3);padding:11px 13px;user-select:all;overflow-wrap:anywhere;letter-spacing:.02em}
.closed .stamp{position:absolute;right:22px;top:22px;font-size:20px}
.closed .hud{color:#FF6B78}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr}}

footer{position:relative;z-index:2;border-top:1px solid var(--line);padding-block:0 calc(40px + env(safe-area-inset-bottom,0px));background:rgba(4,16,58,.9)}
.tricolore{height:4px;background:linear-gradient(90deg,var(--france) 0 33.33%,#F5F5FE 33.33% 66.66%,var(--red) 66.66%);margin-bottom:34px}
.foot{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between}
.foot p{font-size:13px;color:var(--muted)}
.foot .m{font-family:var(--f-display);font-size:18px;letter-spacing:.04em;color:var(--blue)}
.foot .legal{flex-basis:100%;font-family:var(--f-hud);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.linkbtn{background:none;border:0;color:var(--muted);font-family:var(--f-hud);font-size:12px;cursor:pointer;text-decoration:underline;padding:0;letter-spacing:.06em}
.linkbtn:hover{color:var(--ink)}
.fiche .top{padding-left:24px;font-size:10px;letter-spacing:.05em;gap:6px}
.fiche .top>span{white-space:nowrap}
@media (max-width:600px){.dossier{padding-bottom:64px}}

/* ================= ANIMATIONS ================= */
@keyframes slam{0%{opacity:0;transform:rotate(-8deg) scale(2.6)}60%{opacity:1;transform:rotate(-8deg) scale(.92)}100%{opacity:.88;transform:rotate(-8deg) scale(1)}}
@keyframes slam4{0%{opacity:0;transform:rotate(-4deg) scale(2.4)}60%{opacity:1;transform:rotate(-4deg) scale(.94)}100%{opacity:1;transform:rotate(-4deg) scale(1)}}
/* hero: scan + face lock */
.monitor .scan{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--blue) 20%,var(--blue) 80%,transparent);box-shadow:0 0 14px 2px rgba(142,133,116,.55);opacity:0;pointer-events:none}
.monitor.live .scan{animation:scan 2.6s cubic-bezier(.6,0,.4,1) .2s both}
@keyframes scan{0%{top:0;opacity:0}8%{opacity:1}92%{opacity:1}100%{top:100%;opacity:0}}
.lock{position:absolute;opacity:0;pointer-events:none}
.l1{left:51.6%;top:3%;width:18.4%;height:41%}
.l2{left:75.2%;top:5%;width:18.4%;height:41%}
.lock .f{position:absolute;inset:0;--c:var(--blue);background:
 linear-gradient(var(--c),var(--c)) 0 0/22px 2px,linear-gradient(var(--c),var(--c)) 0 0/2px 22px,
 linear-gradient(var(--c),var(--c)) 100% 0/22px 2px,linear-gradient(var(--c),var(--c)) 100% 0/2px 22px,
 linear-gradient(var(--c),var(--c)) 0 100%/22px 2px,linear-gradient(var(--c),var(--c)) 0 100%/2px 22px,
 linear-gradient(var(--c),var(--c)) 100% 100%/22px 2px,linear-gradient(var(--c),var(--c)) 100% 100%/2px 22px;background-repeat:no-repeat}
.lock .tag{position:absolute;left:0;top:100%;margin-top:6px;font-family:var(--f-hud);font-size:11px;letter-spacing:.08em;background:rgba(4,16,58,.88);color:var(--blue);padding:3px 7px;white-space:nowrap;min-height:1.6em}
.l2 .tag{left:auto;right:0}
.monitor.live .lock{animation:lockon .8s cubic-bezier(.2,.8,.2,1) 1.6s both}
.monitor.live .l2{animation-delay:2.2s}
@keyframes lockon{0%{opacity:0;transform:scale(1.9)}50%{opacity:1}70%{transform:scale(.96)}100%{opacity:1;transform:scale(1)}}
@media (max-width:640px){.lock .tag{display:none}.lock .f{--c:var(--blue);background-size:12px 2px,2px 12px,12px 2px,2px 12px,12px 2px,2px 12px,12px 2px,2px 12px}}
/* hero: typed unit file */
.dossier .tx{font-family:var(--f-hud);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#4b5266;margin:-6px 0 10px;min-height:1.2em}
.dossier.typing{animation:feed .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes feed{from{clip-path:inset(0 0 100% 0);transform:rotate(.6deg) translateY(-18px)}to{clip-path:inset(0 0 0 0);transform:rotate(.6deg)}}
.dossier.typing .stamp,.note-doc.locked .sign .stamp{opacity:0}
.dossier.stamped .stamp{animation:slam .45s cubic-bezier(.3,1.4,.5,1) both}
.tcaret{display:inline-block;width:.55em;height:1em;background:var(--paper-ink);vertical-align:-2px;animation:blink .7s steps(1) infinite}
/* stats */
.stat strong{transition:color .3s}
/* fiches: dealt on the table, then stamped */
.pack.pre .fiche{opacity:0}
.pack.go .fiche{animation:deal .7s cubic-bezier(.2,.8,.25,1) both;animation-delay:calc(var(--i)*130ms)}
@keyframes deal{0%{opacity:0;transform:translate(40px,-90px) rotate(calc(var(--r) + 14deg)) scale(1.06)}100%{opacity:1;transform:rotate(var(--r))}}
.pack.pre .fiche .stamp{opacity:0}
.pack.go .fiche .stamp{animation:slam .42s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--i)*130ms + .75s)}
/* ledger: rows logged one by one, stamps applied */
.ledger.pre .row,.ledger.pre .yr{opacity:0}
.ledger.go .row,.ledger.go .yr{animation:logrow .45s ease-out both;animation-delay:calc(var(--i)*70ms)}
@keyframes logrow{from{opacity:0;transform:translateX(-24px);background-color:rgba(142,133,116,.25)}to{opacity:1;transform:none}}
.ledger.pre .row.win .ttl::after{opacity:0}
.ledger.go .row.win .ttl::after{animation:slam4 .4s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--i)*70ms + .45s)}
/* mission orders: sealed dispatch, wax seal, decryption */
.pli{position:relative;max-width:900px;margin:0 auto;perspective:1400px}
.env{position:absolute;inset:0;display:none;z-index:3;transform-style:preserve-3d}
.pli.sealed .env{display:block}
.pli.sealed .note-doc{visibility:hidden}
.pli.opening .note-doc{visibility:visible}
.env-back{position:absolute;inset:0;background:linear-gradient(160deg,#C9C2AC,#B5AD95);box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 0 0 1px rgba(0,0,0,.15)}
.env-back::before,.env-back::after{content:"";position:absolute;bottom:0;width:50%;height:62%;background:#BDB59C}
.env-back::before{left:0;clip-path:polygon(0 0,100% 100%,0 100%)}
.env-back::after{right:0;clip-path:polygon(100% 0,100% 100%,0 100%)}
.env-flap{position:absolute;left:0;right:0;top:0;height:46%;background:linear-gradient(#C3BBA3,#ADA48A);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .7s cubic-bezier(.5,0,.3,1);z-index:2}
.env-label{position:absolute;left:50%;bottom:16%;transform:translateX(-50%) rotate(-1.5deg);background:#EFEBE1;padding:16px 24px;font-family:var(--f-type);color:var(--paper-ink);display:grid;gap:4px;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.25);width:min(80%,420px);z-index:1}
.env-label b{color:var(--stamp);letter-spacing:.25em;text-transform:uppercase;font-size:16px}
.env-label span{font-size:13px}
.seal{position:absolute;left:50%;top:46%;width:104px;height:104px;transform:translate(-50%,-50%);z-index:4;display:grid;place-items:center}
.seal .h1,.seal .h2{position:absolute;inset:0;border-radius:47% 53% 50% 50%/52% 48% 52% 48%;background:radial-gradient(circle at 34% 30%,#E0464F,#A3101D 52%,#6B0611 100%);box-shadow:0 4px 10px rgba(0,0,0,.45),inset 0 0 0 7px rgba(0,0,0,.12)}
.seal .h1{clip-path:polygon(0 0,58% 0,44% 38%,60% 62%,46% 100%,0 100%)}
.seal .h2{clip-path:polygon(58% 0,100% 0,100% 100%,46% 100%,60% 62%,44% 38%)}
.seal b{position:relative;font-family:var(--f-display);font-size:24px;letter-spacing:.06em;color:#5C0610;text-shadow:0 1px 0 rgba(255,255,255,.25),0 -1px 0 rgba(0,0,0,.35);transition:opacity .2s}
.pli.cracking .seal b{opacity:0}
.pli.cracking .seal .h1{animation:crackL .7s cubic-bezier(.4,0,.6,1) forwards}
.pli.cracking .seal .h2{animation:crackR .7s cubic-bezier(.4,0,.6,1) forwards}
@keyframes crackL{20%{transform:translate(-3px,0) rotate(-4deg)}100%{transform:translate(-70px,90px) rotate(-50deg);opacity:0}}
@keyframes crackR{20%{transform:translate(3px,0) rotate(4deg)}100%{transform:translate(70px,110px) rotate(45deg);opacity:0}}
.pli.flap .env-flap{transform:rotateX(178deg)}
.pli.opening .env{animation:envout .9s cubic-bezier(.6,0,.4,1) forwards}
@keyframes envout{to{transform:translateY(55%) rotate(3deg);opacity:0}}
.pli.drop .env{animation:envin .6s cubic-bezier(.2,.9,.3,1.1) both}
@keyframes envin{from{transform:translateY(-60px) rotate(-3deg);opacity:0}to{transform:none;opacity:1}}
.decode{display:none;align-items:center;gap:12px;font-family:var(--f-hud);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#4b5266;margin-bottom:14px}
.note-doc.locked .decode,.note-doc.done .decode{display:flex}
.decode .bar{flex:1;height:4px;background:rgba(0,0,0,.12)}
.decode .bar i{display:block;height:100%;width:0;background:var(--stamp)}
.note-doc.done .decode .bar i{background:#2E7D4F}
.note-doc.done .decode{color:#2E7D4F}
.note-doc.stamped .sign .stamp{animation:slam .45s cubic-bezier(.3,1.4,.5,1) both}
@media (prefers-reduced-motion:reduce){.monitor .scan,.lock{display:none}}

/* ---- Michroma: police unique (400), très large : tailles recalibrées ---- */
h1,h2,h3,h4,.motto,.motto b,.stat strong,.fiche .call,.brand,.seal b,.ledger .rk,.ledger .yr,.partner strong,.card h3,.bench h3{font-weight:400!important;font-synthesis:none}
.sec-head h2{font-size:clamp(28px,4.4vw,56px);letter-spacing:.02em;line-height:1.12}
.motto{font-size:clamp(20px,2.5vw,32px);line-height:1.3;letter-spacing:.02em}
.stat strong{font-size:40px}
.fiche .call{font-size:14px;line-height:1.25;letter-spacing:.02em}
.ledger h4{font-size:13.5px;letter-spacing:.02em;line-height:1.4}
.ledger .rk{font-size:26px}
.ledger .yr{font-size:20px}
.partner strong{font-size:15px;line-height:1.3}
.card h3{font-size:17px;line-height:1.35}
.bench h3{font-size:15px}
.brand{font-size:17px}
.foot .m{font-size:14px}
.seal b{font-size:18px}
@media (max-width:480px){.stat strong{font-size:28px}.sec-head h2{font-size:26px}}

/* Kali desktop behind the intro terminal */
#intro{background:radial-gradient(ellipse at 70% 30%,#16233f 0,#0b1224 45%,#05080f 100%)}
.kali{position:absolute;inset:0;pointer-events:none;transition:opacity .4s;overflow:hidden}
.kali::before{content:"";position:absolute;inset:0;background:
 linear-gradient(118deg,transparent 0 58%,rgba(54,123,240,.10) 58% 58.3%,transparent 58.3%),
 linear-gradient(118deg,transparent 0 63%,rgba(54,123,240,.07) 63% 63.2%,transparent 63.2%),
 linear-gradient(62deg,transparent 0 30%,rgba(54,123,240,.06) 30% 30.2%,transparent 30.2%),
 radial-gradient(circle at 82% 78%,rgba(54,123,240,.16),transparent 40%)}
#intro.tunnel .kali{opacity:0}
.kpanel{position:absolute;left:0;right:0;top:0;height:30px;background:#1a1d24;border-bottom:1px solid #2a2f3a;display:flex;align-items:center;gap:14px;padding:0 max(10px,env(safe-area-inset-right,0px)) 0 max(10px,env(safe-area-inset-left,0px));font-family:"Cantarell","Source Sans 3",sans-serif;font-size:12.5px;color:#d5d9e2}
.kmenu{width:22px;height:22px;display:grid;place-items:center;color:#5DA9FF}.kmenu svg{width:14px}
.kws{display:flex;gap:3px}.kws b,.kws i{font-style:normal;font-weight:600;width:20px;height:18px;display:grid;place-items:center;font-size:11px;background:#262b35;color:#8b93a3}
.kws b{background:#367BF0;color:#fff}
.ktask{background:#2a303c;padding:3px 10px;border-radius:2px}
.kright{margin-left:auto;display:flex;gap:14px;color:#c4cad6;font-variant-numeric:tabular-nums}
.kicons{position:absolute;left:max(18px,env(safe-area-inset-left,0px));top:52px;display:grid;gap:22px;font-family:"Source Sans 3",sans-serif;font-size:12px;color:#e8ecf3;text-shadow:0 1px 2px #000}
.kicons span{display:grid;justify-items:center;gap:4px;width:76px;text-align:center}.kicons svg{width:42px;height:42px}
.kwm{position:absolute;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(env(safe-area-inset-bottom,0px) + 64px);font-family:var(--f-hud);font-size:11px;letter-spacing:.2em;color:rgba(200,214,240,.25);text-transform:uppercase}
.term-box{position:relative;z-index:2}
#intro-out .kf{color:#3B8EEA}#intro-out .ku{color:#5DA9FF;font-weight:600}#intro-out .kp{color:#fff;font-weight:600}#intro-out .kd{color:#3B8EEA;font-weight:600}
@media (max-width:700px){.kicons,.kwm{display:none}.ktask,.kright span:not(#kclock){display:none}}

/* ledger medals */
.ledger .lh,.ledger .row{grid-template-columns:118px 96px minmax(0,1.6fr) minmax(0,1fr) 120px}
.ledger .rk{display:flex;align-items:center;gap:8px}
.ledger .mdl{font-size:24px;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
.ledger.go .row .mdl{animation:pop .5s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--i)*70ms + .3s)}
@keyframes pop{from{transform:scale(0) rotate(-30deg);opacity:0}to{transform:none;opacity:1}}
@media (max-width:820px){.ledger .row{grid-template-columns:84px minmax(0,1fr)}.ledger .mdl{font-size:20px}}
.classif s{text-decoration-thickness:2px;opacity:.7}
/* fiche → character card */
.fiche{cursor:pointer}
.fiche:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.fiche .open-hint{font-family:var(--f-hud);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--france);opacity:.0;transition:opacity .2s;position:absolute;right:12px;bottom:10px}
.fiche:hover .open-hint,.fiche:focus-visible .open-hint{opacity:1}
@media (hover:none){.fiche .open-hint{opacity:1}}
#agent{position:fixed;inset:0;z-index:95;background:rgba(2,6,22,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:calc(env(safe-area-inset-top,0px) + 20px) max(16px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 20px) max(16px,env(safe-area-inset-left,0px));overflow-y:auto}
.ag-wrap{position:relative;width:min(440px,100%);perspective:1600px;animation:agin .5s cubic-bezier(.2,.9,.3,1.1) both}
@keyframes agin{from{transform:translateY(40px) scale(.92);opacity:0}to{transform:none;opacity:1}}
.ag-card{position:relative;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.4,.1,.2,1);display:grid}
.ag-card.flipped{transform:rotateY(180deg)}
.ag-face{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:linear-gradient(170deg,#1B2A57,#0A1A4A 70%);border:1px solid rgba(142,133,116,.55);box-shadow:0 0 0 6px #04103A,0 0 0 7px rgba(142,133,116,.35),0 40px 100px rgba(0,0,0,.7);padding:22px 22px 20px;display:flex;flex-direction:column;gap:16px}
.ag-back{transform:rotateY(180deg)}
.ag-top{display:flex;justify-content:space-between;font-family:var(--f-hud);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-soft);border-bottom:1px solid var(--line);padding-bottom:10px}
.ag-lvl{color:var(--blue)}
.ag-head{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:center}
.ag-head img{width:96px;height:96px;object-fit:cover;border:1px solid rgba(142,133,116,.6);filter:grayscale(1) contrast(1.1)}
.ag-head h3{font-size:17px;line-height:1.3;color:var(--ink)}
#ag-name{font-family:var(--f-hud);font-size:13px;color:var(--blue);margin-top:6px;letter-spacing:.06em}
#ag-role{font-size:14px;color:var(--muted)}
.ag-stats{display:grid;gap:11px}
.ag-stat{display:grid;grid-template-columns:1fr auto;gap:5px 10px;font-family:var(--f-hud);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.ag-stat b{font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}
.ag-bar{grid-column:1/-1;height:9px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 calc(10% - 2px),transparent calc(10% - 2px) 10%)}
.ag-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,var(--blue) 0 calc(10% - 2px),transparent calc(10% - 2px) 10%);background-size:var(--bs,100%) 100%;transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.ag-stat.max i{background-image:repeating-linear-gradient(90deg,#D9CBA6 0 calc(10% - 2px),transparent calc(10% - 2px) 10%)}
.ag-traits{margin:0;padding:12px 0 0;border-top:1px solid var(--line);list-style:none;display:grid;gap:6px;font-size:14px;color:var(--muted)}
.ag-traits li::before{content:"▸ ";color:var(--blue)}
.ag-flip{align-self:center;font-family:var(--f-hud);font-size:12px;letter-spacing:.14em;text-transform:uppercase;background:transparent;color:var(--ink);border:1px solid rgba(142,133,116,.6);padding:9px 16px;cursor:pointer}
.ag-flip:hover{background:rgba(142,133,116,.15)}
.ag-photo{aspect-ratio:3/4;background:#020615;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}
.ag-photo img{width:100%;height:100%;object-fit:cover}
.ag-photo .ph-wait{display:grid;justify-items:center;gap:12px;font-family:var(--f-hud);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:center;padding:20px}
.ag-photo .ph-wait svg{width:110px;opacity:.35}
.ag-cap{font-family:var(--f-hud);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-soft);text-align:center}
.ag-close{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;background:var(--blue);color:#04103A;border:0;font-size:16px;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.5)}
@media (max-width:480px){.ag-close{top:-10px;right:-6px}.ag-head{grid-template-columns:72px 1fr}.ag-head img{width:72px;height:72px}}
@media (prefers-reduced-motion:reduce){.ag-card{transition:none}.ag-wrap{animation:none}.ag-bar i{transition:none}}

/* beau papier beige : grain, fibres, bords légèrement patinés */
.paper,.legal-doc,.env-label{background-color:var(--paper);background-image:
  url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .34  0 0 0 0 .2  0 0 0 .14 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),
  radial-gradient(ellipse at 18% 12%,rgba(255,250,235,.55),transparent 45%),
  radial-gradient(ellipse at 88% 92%,rgba(140,105,60,.16),transparent 50%),
  radial-gradient(ellipse at 50% 50%,transparent 62%,rgba(120,90,50,.14) 100%);
  background-size:220px 220px,100% 100%,100% 100%,100% 100%}
.shot{background:#EFE6D2}
.fiche .ph{border-color:rgba(31,26,20,.6)}
.ag-photo:has(img){aspect-ratio:auto}
.ag-photo:has(img) img{height:auto;max-height:60vh;object-fit:contain}
.fiche{padding-bottom:30px}
.fiche .open-hint{bottom:9px;right:14px}

/* partnership offer */
.offer{position:relative;margin-top:28px;background:var(--panel);border-bottom:4px solid var(--blue);padding:30px clamp(20px,4vw,40px);display:grid;grid-template-columns:1fr 1.4fr;gap:28px 40px}
.offer>*{min-width:0}
.offer-head{display:grid;gap:12px;align-content:start}
.offer .hud{font-size:11px;color:var(--blue-soft)}
.offer h3{font-size:clamp(20px,2.4vw,28px);line-height:1.2}
.offer-head p{color:var(--muted)}
.offer-list{margin:0;padding:0;list-style:none;counter-reset:o;display:grid;gap:16px}
.offer-list li{counter-increment:o;display:grid;grid-template-columns:auto 1fr;gap:2px 14px}
.offer-list li::before{content:counter(o,decimal-leading-zero);grid-row:span 2;font-family:var(--f-hud);font-size:13px;color:var(--blue);border:1px solid rgba(142,133,116,.5);padding:3px 7px;align-self:start}
.offer-list b{font-family:var(--f-display);font-weight:400;font-size:14px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink)}
.offer-list li>span{color:var(--muted);font-size:15px}
.offer-cta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;border-top:1px solid var(--line);padding-top:20px}
.mail-txt{font-family:var(--f-hud);font-size:15px;color:var(--ink);background:#04103A;border:1px solid rgba(142,133,116,.4);padding:10px 12px;user-select:all;overflow-wrap:anywhere}
.offer .stamp{position:absolute;right:30px;bottom:26px;font-size:18px}
.card .mail{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
@media (max-width:860px){.offer{grid-template-columns:1fr}.offer .stamp{display:none}}