/* ============================================================
   OBSERVATOIRE DU COMPLOTISME
   Direction : instrument d'observation. Fond encre-aubergine,
   didone de la fin du XVIIIe s. (l'époque de Barruel), et trois
   couleurs sémantiques qui encodent la seule distinction qui
   compte : documenté / fabriqué / persécutoire.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;0,6..96,700;0,6..96,900;1,6..96,400;1,6..96,700&family=Spectral:ital,wght@0,300;0,400;0,500;0,600;1,400&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  --ink:        #15111f;
  --ink-2:      #1d1829;
  --surface:    #241e33;
  --surface-2:  #2c2540;
  --line:       #3a3150;
  --line-soft:  #2e2742;

  --bone:       #ece5da;
  --bone-dim:   #b6adc0;
  --muted:      #9d94ae;
  --muted-2:    #746b86;

  --sulphur:    #e8c547;   /* accent principal — signal */
  --verdigris:  #57b39b;   /* DOCUMENTÉ */
  --crimson:    #e05263;   /* FABRIQUÉ */
  --amber:      #d98e33;   /* PERSÉCUTOIRE */
  --violet:     #9d7fd4;   /* CONTESTÉ */

  --maxw: 1240px;
  --measure: 68ch;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:96px}

body{
  margin:0;
  background:var(--ink);
  color:var(--bone);
  font-family:'Spectral',Georgia,serif;
  font-size:17.5px;
  line-height:1.72;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* subtle field of measurement lines behind everything */
body::before{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(to right, rgba(232,197,71,.045) 1px, transparent 1px);
  background-size:88px 100%;
  mask-image:linear-gradient(to bottom, transparent, black 30%, black 70%, transparent);
}
main,header,footer{position:relative; z-index:1}

/* ---------- typography ---------- */
h1,h2,h3,h4{
  font-family:'Bodoni Moda',Didot,'Bodoni MT',serif;
  font-weight:500;
  line-height:1.04;
  letter-spacing:-.005em;
  margin:0 0 .45em;
  color:#fbf7f0;
}
h1{font-size:clamp(2.6rem,5vw,4.5rem); font-weight:500}
h2{font-size:clamp(1.9rem,3.4vw,3rem)}
h3{font-size:clamp(1.15rem,1.7vw,1.45rem); font-weight:700; letter-spacing:0}
h4{font-size:1.05rem; font-weight:700}

p{margin:0 0 1.15em; max-width:var(--measure)}
.wide p{max-width:none}
strong{font-weight:600; color:#fdfaf4}
em{font-style:italic}

a{color:var(--sulphur); text-decoration:none; border-bottom:1px solid rgba(232,197,71,.32); transition:border-color .18s, color .18s}
a:hover{color:#fff; border-bottom-color:var(--sulphur)}

::selection{background:var(--sulphur); color:var(--ink)}

.mono{font-family:'JetBrains Mono',ui-monospace,monospace}

.eyebrow{
  font-family:'JetBrains Mono',monospace;
  font-size:.66rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--sulphur); display:flex; align-items:center; gap:.85em;
  margin:0 0 1.4em; font-weight:500;
}
.eyebrow::after{content:""; flex:1; height:1px; background:linear-gradient(to right,rgba(232,197,71,.5),transparent); max-width:180px}

.lede{font-size:clamp(1.1rem,1.6vw,1.32rem); color:#d8d0c4; font-weight:300; line-height:1.6; max-width:56ch}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,4vw,44px)}
.narrow{max-width:820px}

/* ---------- header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(21,17,31,.86);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line-soft);
}
.hdr{display:flex; align-items:center; flex-wrap:wrap; gap:14px; max-width:var(--maxw); margin:0 auto; padding:11px clamp(20px,4vw,44px)}
.brand{display:flex; align-items:center; gap:11px; border:none; flex:0 0 auto}
.brand:hover{border:none}
.brand svg{flex:0 0 auto}
.brand b{font-family:'Bodoni Moda',serif; font-weight:700; font-size:.9rem; color:#fbf7f0; letter-spacing:.01em; display:block; line-height:1.15}
.brand span{font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); display:block}

nav.nav{display:flex; gap:1px; order:3; flex:1 0 100%; margin:6px -6px -4px; padding-top:7px; border-top:1px solid var(--line-soft); overflow-x:auto; scrollbar-width:none}
nav.nav::-webkit-scrollbar{display:none}
nav.nav a{flex:0 0 auto}
nav.nav a{
  font-family:'JetBrains Mono',monospace; font-size:.575rem; letter-spacing:.015em; text-transform:uppercase;
  color:var(--muted); padding:6px 6px; border:none; border-radius:3px; white-space:nowrap;
}
nav.nav a:hover{color:var(--bone); background:var(--surface)}
nav.nav a.active{color:var(--ink); background:var(--sulphur); font-weight:700}

@media(max-width:1080px){
  .hdr{flex-wrap:wrap; gap:10px}
  nav.nav{width:100%; margin-left:0; overflow-x:auto; flex-wrap:nowrap; padding-bottom:3px; scrollbar-width:none}
  nav.nav::-webkit-scrollbar{display:none}
  nav.nav a{flex:0 0 auto}
}

/* ---------- hero ---------- */
.hero{padding:clamp(52px,7vw,92px) 0 clamp(38px,5vw,64px); border-bottom:1px solid var(--line-soft); position:relative}
.hero h1{margin-bottom:.3em; text-wrap:balance}
.hero-grid{display:grid; grid-template-columns:1.55fr .95fr; gap:clamp(28px,5vw,72px); align-items:end}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}

.hero-figure{border-left:1px solid var(--line); padding-left:26px}
.hero-figure p{font-size:.94rem; color:var(--muted); max-width:none}

.hero-index{border-top:1px solid var(--line-soft); margin-top:clamp(36px,6vw,64px); padding-top:22px; display:flex; gap:30px; flex-wrap:wrap}
.hero-index span{font-family:'JetBrains Mono',monospace; font-size:.63rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted-2)}

/* ---------- page head (interior pages) ---------- */
.pagehead{padding:clamp(46px,7vw,88px) 0 clamp(30px,4vw,52px); border-bottom:1px solid var(--line-soft)}
.pagehead h1{font-size:clamp(2.3rem,5vw,4.1rem)}
.chapter-no{
  font-family:'JetBrains Mono',monospace; font-size:.66rem; letter-spacing:.22em;
  color:var(--sulphur); text-transform:uppercase; margin-bottom:1.2em; display:block;
}

/* ---------- sections ---------- */
.section{padding:clamp(48px,7vw,84px) 0; border-bottom:1px solid var(--line-soft)}
.section:last-of-type{border-bottom:none}
.section-head{margin-bottom:clamp(28px,4vw,44px)}
.section-head h2{text-wrap:balance}
.section-head p{color:#cdc4b8}

/* ---------- classification chips (signature) ---------- */
.chip{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:'JetBrains Mono',monospace; font-weight:700;
  font-size:.6rem; letter-spacing:.13em; text-transform:uppercase;
  padding:4px 10px 4px 8px; border-radius:2px;
  border:1px solid currentColor; white-space:nowrap;
}
.chip::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:0 0 auto}
.c-doc{color:var(--verdigris); background:rgba(87,179,155,.09)}
.c-fab{color:var(--crimson); background:rgba(224,82,99,.09)}
.c-per{color:var(--amber); background:rgba(217,142,51,.09)}
.c-con{color:var(--violet); background:rgba(157,127,212,.09)}
.c-neu{color:var(--muted); background:rgba(157,148,174,.08)}

/* ---------- cards ---------- */
.grid{display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

.cell{background:var(--ink-2); padding:clamp(22px,2.6vw,30px); position:relative}
.cell p{font-size:.95rem; color:#c8bfb4; max-width:none; margin-bottom:.8em}
.cell p:last-child{margin-bottom:0}
.cell .k{font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); display:block; margin-bottom:1em}
.cell h3{margin-bottom:.6em}

/* nav cards */
a.cell{border:none; display:block; transition:background .2s}
a.cell:hover{background:var(--surface); border:none}
a.cell:hover h3{color:var(--sulphur)}
a.cell .go{font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sulphur); margin-top:1.1em; display:block}

/* ---------- stats ---------- */
.figs{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1px; background:var(--line-soft); border-block:1px solid var(--line-soft)}
.fig{background:var(--ink); padding:26px clamp(18px,2vw,26px)}
.fig .n{font-family:'Bodoni Moda',serif; font-size:clamp(2.3rem,4vw,3.3rem); font-weight:500; color:var(--sulphur); line-height:.95; letter-spacing:-.02em}
.fig .n small{font-size:.42em; font-weight:400; letter-spacing:0}
.fig .l{font-size:.88rem; color:#c3bab0; margin-top:.75em; line-height:1.42; max-width:30ch}
.fig .s{font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.08em; color:var(--muted-2); margin-top:.9em; display:block; text-transform:uppercase}

/* ---------- prose blocks ---------- */
.prose{max-width:var(--measure)}
.prose h3{margin-top:2.2em}
.prose h3:first-child{margin-top:0}
.prose ul,.prose ol{padding-left:1.15em; margin:0 0 1.3em; color:#cdc4b8}
.prose li{margin-bottom:.6em}
.prose li::marker{color:var(--sulphur)}

/* ---------- dossier ---------- */
.dossier{border:1px solid var(--line-soft); background:var(--ink-2); margin-bottom:20px}
.dossier > summary{
  list-style:none; cursor:pointer; padding:20px clamp(18px,2.4vw,28px);
  display:flex; gap:18px; align-items:flex-start; justify-content:space-between; flex-wrap:wrap;
  transition:background .18s;
}
.dossier > summary::-webkit-details-marker{display:none}
.dossier > summary:hover{background:var(--surface)}
.dossier[open] > summary{border-bottom:1px solid var(--line-soft); background:var(--surface)}
.d-id{font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.14em; color:var(--muted-2); display:block; margin-bottom:.5em}
.d-title{flex:1 1 320px}
.d-title h3{margin:0 0 .25em; font-size:1.2rem}
.d-title .sub{font-family:'JetBrains Mono',monospace; font-size:.66rem; letter-spacing:.06em; color:var(--muted)}
.d-right{display:flex; align-items:center; gap:14px}
.d-caret{font-family:'JetBrains Mono',monospace; color:var(--sulphur); font-size:.9rem; transition:transform .2s}
.dossier[open] .d-caret{transform:rotate(90deg)}
.d-body{padding:clamp(20px,2.6vw,28px)}
.d-body p{font-size:.97rem; color:#cbc2b7}
.d-body p:last-child{margin-bottom:0}
.d-body .verdict{
  border-left:2px solid var(--sulphur); padding:2px 0 2px 16px; margin-top:1.4em;
  font-size:.9rem; color:#ddd4c8;
}
.d-body .verdict b{font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sulphur); display:block; margin-bottom:.35em}

/* ---------- timeline ---------- */
.era-bar{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:36px}
.era-bar button{
  font-family:'JetBrains Mono',monospace; font-size:.63rem; letter-spacing:.11em; text-transform:uppercase;
  background:transparent; border:1px solid var(--line); color:var(--muted);
  padding:7px 13px; cursor:pointer; border-radius:2px; transition:all .18s;
}
.era-bar button:hover{color:var(--bone); border-color:var(--muted)}
.era-bar button.active{background:var(--sulphur); color:var(--ink); border-color:var(--sulphur); font-weight:700}

.tl{position:relative; padding-left:clamp(22px,3vw,38px); border-left:1px solid var(--line)}
.ev{position:relative; padding-bottom:38px}
.ev:last-child{padding-bottom:0}
.ev::before{
  content:""; position:absolute; top:9px; width:9px; height:9px; border-radius:50%;
  background:var(--ink); border:2px solid var(--sulphur);
  left:calc(-1 * clamp(22px,3vw,38px) - 5px);
}
.ev .date{font-family:'JetBrains Mono',monospace; font-size:.68rem; letter-spacing:.13em; color:var(--sulphur); text-transform:uppercase}
.ev h4{font-family:'Bodoni Moda',serif; font-size:1.35rem; font-weight:500; margin:.3em 0 .55em}
.ev p{font-size:.95rem; color:#c6bdb2; margin-bottom:0}
.ev .chip{margin-bottom:.9em}
.ev.hide{display:none}

/* ---------- table ---------- */
.tbl-wrap{overflow-x:auto; border:1px solid var(--line-soft)}
table{width:100%; border-collapse:collapse; font-size:.9rem; min-width:560px}
th,td{text-align:left; padding:13px 16px; border-bottom:1px solid var(--line-soft); vertical-align:top; color:#c8bfb4}
thead th{
  font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--sulphur); background:var(--ink-2); font-weight:500; white-space:nowrap;
}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover td{background:var(--ink-2)}
td strong{color:#f5efe6}

/* ---------- quote ---------- */
blockquote{
  margin:clamp(28px,4vw,48px) 0; padding:0 0 0 clamp(20px,3vw,34px);
  border-left:2px solid var(--sulphur);
  font-family:'Bodoni Moda',serif; font-size:clamp(1.3rem,2.4vw,1.85rem);
  font-weight:400; line-height:1.32; color:#f6f0e6;
}
blockquote p{max-width:30ch; margin-bottom:.5em; font-family:inherit; font-size:inherit; line-height:inherit}
blockquote cite{
  display:block; font-family:'JetBrains Mono',monospace; font-style:normal;
  font-size:.63rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); margin-top:1.2em;
}

/* ---------- chart / viz ---------- */
.viz{border:1px solid var(--line-soft); background:var(--ink-2); padding:clamp(20px,3vw,32px)}
.viz-title{font-family:'JetBrains Mono',monospace; font-size:.63rem; letter-spacing:.16em; text-transform:uppercase; color:var(--sulphur); margin-bottom:1.6em}
.viz figcaption{font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.05em; color:var(--muted-2); margin-top:1.4em; line-height:1.6}

/* horizontal bars */
.bars{display:flex; flex-direction:column; gap:14px}
.bar-row{display:grid; grid-template-columns:1fr 54px; gap:14px; align-items:center}
.bar-label{font-size:.88rem; color:#c8bfb4; line-height:1.35}
.bar-track{grid-column:1/-1; height:7px; background:var(--surface); border-radius:1px; overflow:hidden; margin-top:-4px}
.bar-fill{height:100%; background:linear-gradient(to right,var(--sulphur),#f0d878); width:0; transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.bar-val{font-family:'JetBrains Mono',monospace; font-size:.85rem; color:var(--sulphur); text-align:right; font-weight:500}

/* ---------- quiz ---------- */
.quiz{border:1px solid var(--line); background:var(--ink-2); padding:clamp(24px,3.4vw,38px)}
.quiz-meta{font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); margin-bottom:1.5em; display:flex; justify-content:space-between; gap:16px}
.quiz-q{font-family:'Bodoni Moda',serif; font-size:clamp(1.15rem,2vw,1.5rem); line-height:1.34; color:#f6f0e6; margin-bottom:1.5em; max-width:52ch}
.quiz-opts{display:flex; gap:9px; flex-wrap:wrap; margin-bottom:20px}
.quiz-opts button{
  font-family:'JetBrains Mono',monospace; font-size:.68rem; letter-spacing:.09em; text-transform:uppercase;
  padding:11px 17px; border:1px solid var(--line); background:transparent; color:var(--bone);
  cursor:pointer; border-radius:2px; transition:all .16s;
}
.quiz-opts button:hover:not(:disabled){border-color:var(--sulphur); color:var(--sulphur)}
.quiz-opts button:disabled{opacity:.42; cursor:default}
.quiz-opts button.right{border-color:var(--verdigris); color:var(--verdigris); opacity:1; background:rgba(87,179,155,.1)}
.quiz-opts button.wrong{border-color:var(--crimson); color:var(--crimson); opacity:1; background:rgba(224,82,99,.1)}
.quiz-fb{font-size:.94rem; color:#cbc2b7; border-left:2px solid var(--verdigris); padding-left:16px; margin-bottom:20px}
.quiz-fb.no{border-left-color:var(--crimson)}
.quiz-fb b{display:block; font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:.4em; color:var(--verdigris)}
.quiz-fb.no b{color:var(--crimson)}

.btn{
  font-family:'JetBrains Mono',monospace; font-size:.66rem; letter-spacing:.13em; text-transform:uppercase; font-weight:500;
  padding:11px 20px; border:1px solid var(--sulphur); background:var(--sulphur); color:var(--ink);
  cursor:pointer; border-radius:2px; display:inline-block; transition:all .16s;
}
.btn:hover{background:transparent; color:var(--sulphur); border-color:var(--sulphur)}
.btn.ghost{background:transparent; color:var(--sulphur)}
.btn.ghost:hover{background:var(--sulphur); color:var(--ink)}

/* ---------- rules decoder ---------- */
.rules{display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft)}
.rule{background:var(--ink-2); padding:22px clamp(18px,2.4vw,28px); display:grid; grid-template-columns:52px 1fr; gap:20px; align-items:start}
.rule .no{font-family:'Bodoni Moda',serif; font-size:2rem; color:var(--sulphur); line-height:1; opacity:.55}
.rule h4{margin-bottom:.4em; font-family:'Bodoni Moda',serif; font-weight:500; font-size:1.2rem}
.rule p{font-size:.93rem; color:#c3bab0; margin:0; max-width:62ch}

/* ---------- glossary ---------- */
.gloss{display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft)}
.gterm{background:var(--ink-2); padding:22px clamp(18px,2.4vw,26px)}
.gterm dt{font-family:'Bodoni Moda',serif; font-size:1.18rem; font-weight:500; color:#f6f0e6; margin-bottom:.35em}
.gterm dd{margin:0; font-size:.93rem; color:#c3bab0; line-height:1.6}
.gterm .orig{font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.06em; color:var(--muted-2); display:block; margin-bottom:.5em}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line); padding:clamp(40px,6vw,64px) 0 clamp(48px,7vw,80px); background:var(--ink-2)}
.foot{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:clamp(24px,4vw,56px)}
@media(max-width:820px){.foot{grid-template-columns:1fr}}
.foot p{font-size:.86rem; color:var(--muted); max-width:52ch}
.foot h4{font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--sulphur); margin-bottom:1.2em; font-weight:500}
.foot a{display:block; font-size:.87rem; margin-bottom:.55em; color:var(--bone); border:none}
.foot a:hover{color:var(--sulphur)}
.colophon{margin-top:clamp(32px,4vw,48px); padding-top:22px; border-top:1px solid var(--line-soft); font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.06em; color:var(--muted-2); line-height:1.8}

/* ---------- utilities ---------- */
.hr{height:1px; background:var(--line-soft); border:none; margin:clamp(32px,5vw,56px) 0}
.chips{display:flex; gap:8px; flex-wrap:wrap; margin:1.4em 0}
.note{font-family:'JetBrains Mono',monospace; font-size:.66rem; letter-spacing:.04em; color:var(--muted-2); line-height:1.75; max-width:70ch}
.skip{position:absolute; left:-9999px}
.skip:focus{left:16px; top:16px; z-index:200; background:var(--sulphur); color:var(--ink); padding:10px 16px; border-radius:2px}
:focus-visible{outline:2px solid var(--sulphur); outline-offset:3px}

.cols2{columns:2; column-gap:clamp(28px,4vw,52px)}
@media(max-width:760px){.cols2{columns:1}}
.cols2 p{break-inside:avoid; max-width:none}

@media(prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
}

/* timeline : gouttière de dates sur écrans larges */
@media(min-width:1000px){
  .ev{display:grid; grid-template-columns:190px minmax(0,1fr); column-gap:40px; align-items:start}
  .ev .date{grid-column:1; grid-row:1 / span 3; padding-top:4px; text-align:right; line-height:1.5}
  .ev h4{grid-column:2; grid-row:1; margin-top:0}
  .ev .chip{grid-column:2; grid-row:2; justify-self:start}
  .ev p{grid-column:2; grid-row:3; max-width:66ch}
}

/* ==================== barre de progression ==================== */
.progress{position:fixed; top:0; left:0; right:0; height:2px; z-index:120; background:transparent; pointer-events:none}
.progress span{display:block; height:100%; width:0; background:var(--sulphur); box-shadow:0 0 10px rgba(232,197,71,.5)}

/* ==================== bouton + modale de recherche ==================== */
.searchbtn{
  margin-left:auto;
  display:inline-flex; align-items:center; gap:7px; flex:0 0 auto;
  font-family:'JetBrains Mono',monospace; font-size:.6rem; letter-spacing:.05em;
  background:transparent; color:var(--muted); border:1px solid var(--line);
  padding:6px 9px; border-radius:3px; cursor:pointer; transition:all .16s;
}
.searchbtn:hover{color:var(--sulphur); border-color:var(--sulphur)}
.searchbtn kbd{
  font-family:inherit; font-size:.86em; border:1px solid var(--line);
  border-radius:2px; padding:0 4px; color:var(--muted-2);
}


.searchmodal{position:fixed; inset:0; z-index:200; background:rgba(11,8,18,.78); backdrop-filter:blur(6px); padding:12vh 20px 20px; overflow-y:auto}
.searchmodal[hidden]{display:none}
.searchbox{max-width:720px; margin:0 auto; background:var(--ink-2); border:1px solid var(--line); box-shadow:0 30px 80px -30px #000}
.searchbox input{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--line);
  color:var(--bone); font-family:'Spectral',serif; font-size:1.15rem; padding:20px 24px; outline:none;
}
.searchbox input::placeholder{color:var(--muted-2)}
.searchbox input::-webkit-search-cancel-button{-webkit-appearance:none; height:14px; width:14px; cursor:pointer;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2 2l10 10M12 2L2 12' stroke='%239d94ae' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.searchresults{max-height:52vh; overflow-y:auto}
.searchempty{padding:26px 24px; font-family:'JetBrains Mono',monospace; font-size:.68rem; color:var(--muted-2); line-height:1.8}
a.sres{display:block; padding:15px 24px; border-bottom:1px solid var(--line-soft); border-left:2px solid transparent; text-decoration:none}
a.sres:hover,a.sres.on{background:var(--surface); border-left-color:var(--sulphur)}
a.sres .spage{display:block; font-family:'JetBrains Mono',monospace; font-size:.57rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sulphur); margin-bottom:.35em}
a.sres .stitle{display:block; font-family:'Bodoni Moda',serif; font-size:1.06rem; color:#f6f0e6; margin-bottom:.3em; line-height:1.25}
a.sres .sbody{display:block; font-size:.86rem; color:var(--muted); line-height:1.55}
a.sres mark{background:rgba(232,197,71,.24); color:var(--sulphur); padding:0 1px; border-radius:1px}
.searchhint{padding:12px 24px; font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.06em; color:var(--muted-2); border-top:1px solid var(--line-soft)}
.searchhint kbd{border:1px solid var(--line); border-radius:2px; padding:1px 5px; margin-right:2px}

/* ==================== grille d'évaluation ==================== */
.tool{border:1px solid var(--line); background:var(--ink-2)}
.tool-head{display:flex; justify-content:space-between; gap:16px; padding:18px clamp(18px,2.6vw,28px); font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2)}
.tool-score{color:var(--sulphur); font-weight:700; font-size:.9rem; letter-spacing:.04em}
.tool-score i{font-style:normal; color:var(--muted-2); font-weight:400; font-size:.75em}
.tool-meter{height:3px; background:var(--surface); margin:0 clamp(18px,2.6vw,28px) 4px}
.tool-meter span{display:block; height:100%; background:linear-gradient(to right,var(--verdigris),var(--sulphur),var(--crimson)); transition:width .35s ease}
.tool-group{font-family:'JetBrains Mono',monospace; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:var(--sulphur); padding:26px clamp(18px,2.6vw,28px) 6px; border-top:1px solid var(--line-soft); margin-top:8px}
.tool-q{padding:14px clamp(18px,2.6vw,28px) 18px; display:grid; grid-template-columns:1fr auto; gap:14px 24px; align-items:start}
.tool-q .tq{margin:0; font-size:1rem; color:#e6dfd4; max-width:62ch}
.tool-q.answered .tq{color:var(--muted)}
.tool-btns{display:flex; gap:6px}
.tool-btns button{
  font-family:'JetBrains Mono',monospace; font-size:.62rem; letter-spacing:.09em; text-transform:uppercase;
  padding:7px 14px; border:1px solid var(--line); background:transparent; color:var(--muted); cursor:pointer; border-radius:2px; transition:all .15s;
}
.tool-btns button:hover{color:var(--bone); border-color:var(--muted)}
.tool-btns button.yes{background:rgba(224,82,99,.14); border-color:var(--crimson); color:var(--crimson); font-weight:700}
.tool-btns button.no{background:rgba(87,179,155,.14); border-color:var(--verdigris); color:var(--verdigris); font-weight:700}
.tool-q .th{grid-column:1/-1; margin:0; font-size:.86rem; color:var(--muted-2); border-left:2px solid var(--line); padding-left:14px; max-width:70ch}
.tool-verdict{padding:26px clamp(18px,2.6vw,28px) 28px; border-top:1px solid var(--line); background:var(--surface)}
.tool-verdict p{margin:1em 0 1.4em; font-size:.97rem; color:#cbc2b7; max-width:66ch}

/* ==================== impression ==================== */
@media print{
  body{background:#fff; color:#111; font-size:11pt}
  body::before, .site-header, .searchmodal, .progress, .era-bar, .tool-btns, .btn, .site-footer .foot{display:none !important}
  h1,h2,h3,h4,blockquote{color:#000}
  .cell,.dossier,.viz,.quiz,.tool{background:#fff; border:1px solid #bbb; box-shadow:none}
  a{color:#000; border:none; text-decoration:underline}
  .dossier .d-body{display:block !important}
  .ev.hide{display:block !important}
  .section{page-break-inside:auto; border-color:#ccc}
  .grid{background:#fff; border-color:#bbb}
  th,td{color:#111; border-color:#ccc}
  p,.cell p,.d-body p{color:#222; max-width:none}
}