#histoire{--sv-num:var(--green);--sv-bg:var(--green);--sv-fg:#fff}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) #histoire{--sv-num:var(--lime);--sv-bg:var(--lime);--sv-fg:var(--limeink)}}
:root[data-theme=dark] #histoire{--sv-num:var(--lime);--sv-bg:var(--lime);--sv-fg:var(--limeink)}
.sv-bar{margin:0 0 1.2rem;text-align:center}
.sv-group{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:.4rem;padding:.3rem;border:1px solid var(--line);border-radius:.8rem;background:var(--bg);max-width:100%}
.sv-group button{font:600 .98rem var(--b);color:var(--ink);background:transparent;border:0;border-radius:.55rem;padding:.65rem 1rem;min-height:44px;cursor:pointer;transition:background .2s,color .2s}
.sv-group button[aria-pressed=true]{background:var(--green);color:#fff}
.sv-group button:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.sv-prev{margin:.8rem auto 0;text-align:center;max-width:44rem}.sv-prev summary{cursor:pointer;font:600 .95rem var(--b);color:var(--muted);min-height:44px;display:flex;align-items:center;justify-content:center}.sv-prev .sv-group{margin-bottom:.4rem}
.sv-note{margin:.7rem auto 0;font-size:.92rem;color:var(--muted)}
.stats[data-sv]>div{transition:background-color .35s,border-color .35s,box-shadow .35s}
#histoire .stats[data-sv]>div{opacity:1;transform:none}
.stats[data-sv]>div strong{transition:color .35s}
.stats[data-sv]:not([data-sv=actuel])>div strong{color:var(--sv-num);-webkit-text-stroke:0;background:none;-webkit-background-clip:border-box;background-clip:border-box;animation:none!important;opacity:1;transform:none;filter:none}
.stats[data-sv]:not([data-sv=actuel])>div strong+span{animation:none!important;opacity:1;transform:none}
#histoire .w.sp-on .stats[data-sv=cartes],#histoire .w.sp-on .stats[data-sv=panneaux]{align-items:stretch}
.stats[data-sv=cartes]>div,.stats[data-sv=panneaux]>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:2rem 1.2rem;border-radius:1rem;height:100%}
.stats[data-sv=cartes]>div{border:2px solid var(--green);background:var(--card);box-shadow:0 6px 0 -2px var(--lime)}
.stats[data-sv=panneaux]>div{border:1px solid color-mix(in srgb,var(--green) 35%,transparent);background:color-mix(in srgb,var(--lime) 16%,var(--card))}
.stats[data-sv=panneaux]>div strong{color:var(--sv-num)}
.stats[data-sv=ouvert]{gap:0!important;border-block:1px solid var(--line);padding:1.2rem 0}
.stats[data-sv=ouvert]>div{padding:.5rem 1rem}
.stats[data-sv=ouvert]>div+div{border-left:1px solid var(--line)}
@media(max-width:540px){.stats[data-sv=ouvert]>div+div{border-left:0;border-top:1px solid var(--line);margin-top:1rem;padding-top:1.5rem}}
@media(prefers-reduced-motion:reduce){.sv-group button,.stats[data-sv]>div,.stats[data-sv]>div strong{transition:none}}
#histoire .w.sp-on>.sv-bar{grid-column:1/-1;margin:1rem 0 0;scroll-margin-top:6rem}
@media(min-width:820px){
#histoire .w.sp-on[data-mode=portrait].sv-preview{grid-template-areas:"bar bar" "fm h" "fm p1" "fm p2" "sv sv" "st st" "re re"}
#histoire .w.sp-on[data-mode=portrait].sv-preview>.sv-bar{grid-area:sv}
}

#histoire .w.sp-on.sv-preview .stats[data-sv=compact]{display:grid;grid-template-columns:minmax(0,1fr);gap:0;max-width:34rem;margin-inline:auto}
.stats[data-sv=compact]>div{display:flex;align-items:center;justify-content:center;gap:.9rem;padding:.9rem .5rem;border-bottom:1px solid var(--line);text-align:left}
.stats[data-sv=compact]>div strong{min-width:3.4rem;text-align:right}
.stats[data-sv=compact]>div span{margin:0!important;max-width:26ch}
#histoire .w.sp-on.sv-preview .stats[data-sv=pastilles]{gap:1.5rem 2rem;align-items:flex-start}
.stats[data-sv=pastilles]>div{display:flex;flex-direction:column;align-items:center;gap:.7rem}
#histoire .stats[data-sv=pastilles]>div strong{display:grid;place-items:center;width:5rem;height:5rem;border-radius:50%;background:var(--sv-bg);color:var(--sv-fg);font-size:1.75rem}
.stats[data-sv=pastilles]>div span{margin:0;max-width:24ch}
#histoire .w.sp-on.sv-preview .stats[data-sv=epure]{gap:1.5rem 2.5rem}
.stats[data-sv=epure]>div{display:flex;flex-direction:column;align-items:center}
.stats[data-sv=epure]>div::after{content:"";width:2.5rem;height:3px;border-radius:2px;background:var(--lime);margin-top:.8rem}
.stats[data-sv=epure]>div span{margin-top:.5rem}
@media(max-width:540px){.stats[data-sv=compact]>div{flex-wrap:wrap}#histoire .stats[data-sv=pastilles]>div strong{width:4.25rem;height:4.25rem}}

/* Contraste */
#histoire .w.sp-on.sv-preview .stats[data-sv=contraste]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:stretch;max-width:46rem;margin-inline:auto}
#histoire .stats[data-sv=contraste]>div{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.4rem;height:100%;padding:1.3rem 1.2rem;border-radius:.9rem;background:#14291C;border:1px solid #2F5A3C;box-shadow:0 3px 0 #8DC63F}
#histoire .stats[data-sv=contraste]>div strong,#histoire .stats[data-sv=bandeau]>div strong{color:#A6D84F;-webkit-text-fill-color:#A6D84F;background:none}
#histoire .stats[data-sv=contraste]>div span,#histoire .stats[data-sv=bandeau]>div span{color:#EEF3E8;margin:0 auto;max-width:26ch}
@media(max-width:540px){#histoire .w.sp-on.sv-preview .stats[data-sv=contraste]{grid-template-columns:minmax(0,1fr)}}
/* Bandeau */
#histoire .w.sp-on.sv-preview .stats[data-sv=bandeau]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;max-width:46rem;margin-inline:auto;background:#14291C;border-radius:1rem;border:1px solid #2F5A3C;padding:1.4rem 0}
#histoire .stats[data-sv=bandeau]>div{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem;padding:.3rem 1.3rem}
#histoire .stats[data-sv=bandeau]>div+div{border-left:1px solid #8DC63F}
@media(max-width:540px){#histoire .w.sp-on.sv-preview .stats[data-sv=bandeau]{grid-template-columns:minmax(0,1fr)}#histoire .stats[data-sv=bandeau]>div+div{border-left:0;border-top:1px solid #8DC63F;margin-top:1rem;padding-top:1.2rem}}

/* Repere: editorial horizontal rows, accent rule on hairline */
#histoire .w.sp-on.sv-preview .stats[data-sv=repere]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem 3rem;max-width:48rem;margin-inline:auto;text-align:left}
#histoire .stats[data-sv=repere]>div{position:relative;display:flex;align-items:center;gap:1.1rem;padding:1.3rem 0 0;border-top:1px solid var(--line)}
#histoire .stats[data-sv=repere]>div::before{content:"";position:absolute;top:-2px;left:0;width:3rem;height:3px;background:var(--sv-bg)}
#histoire .stats[data-sv=repere]>div strong{flex:none;min-width:3.6rem;text-align:left}
#histoire .stats[data-sv=repere]>div span{margin:0;max-width:22ch;text-align:left;border-left:1px solid var(--line);padding-left:1.1rem}
/* Cadre: open outlined frame with two corner brackets */
#histoire .w.sp-on.sv-preview .stats[data-sv=cadre]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;align-items:stretch;max-width:46rem;margin-inline:auto}
#histoire .stats[data-sv=cadre]>div{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem;height:100%;padding:1.7rem 1.4rem;border:1px solid var(--line)}
#histoire .stats[data-sv=cadre]>div::before,#histoire .stats[data-sv=cadre]>div::after{content:"";position:absolute;width:1.2rem;height:1.2rem;border:0 solid var(--sv-bg)}
#histoire .stats[data-sv=cadre]>div::before{top:-1px;left:-1px;border-top-width:3px;border-left-width:3px}
#histoire .stats[data-sv=cadre]>div::after{bottom:-1px;right:-1px;border-bottom-width:3px;border-right-width:3px}
#histoire .stats[data-sv=cadre]>div span{margin:0 auto;max-width:26ch}
/* Galet: light sculpted neutral tiles, asymmetric corner, single dot accent */
#histoire .w.sp-on.sv-preview .stats[data-sv=galet]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;align-items:stretch;max-width:46rem;margin-inline:auto}
#histoire .stats[data-sv=galet]>div{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem;height:100%;padding:1.8rem 1.4rem 1.5rem;border-radius:1.8rem 1.8rem 1.8rem .4rem;background:color-mix(in srgb,var(--ink) 5%,var(--bg));box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 55%,transparent),0 14px 24px -18px color-mix(in srgb,var(--ink) 55%,transparent)}
#histoire .stats[data-sv=galet]>div::before{content:"";position:absolute;top:1rem;left:1.2rem;width:.55rem;height:.55rem;border-radius:50%;background:var(--sv-bg)}
#histoire .stats[data-sv=galet]>div span{margin:0 auto;max-width:26ch}
@media(max-width:540px){#histoire .w.sp-on.sv-preview .stats[data-sv=repere],#histoire .w.sp-on.sv-preview .stats[data-sv=cadre],#histoire .w.sp-on.sv-preview .stats[data-sv=galet]{grid-template-columns:minmax(0,1fr)}}