/* Warp Pipes — feuille de style unique.
   Marque : barre « nuit » + cartouche, étiquette et accent selon la section (body[data-sec]).
   DW3 : affiche de guerre. Layout: Ink brand bar (Warp Pipes) · imperial-yellow hero cut like a blade · roster · ink dispatch panel.
   Deliberately single bright theme: every color is set explicitly. */
:root{
  --ink:#16120E; --paper:#FFFDF6; --sheet:#FFFFFF; --line:#E6DFCF; --muted:#6A6152;
  --yellow:#FFC629; --yellow-soft:#FFE38A; --red:#E5371F; --ember:#FF8A1F;
  --wei:#1D5FD6; --shu:#169A50; --wu:#D8262E; --oth:#7C3FC7; --item:#8A5A00;
  --night:#141414; --brand:#FF6B1A; --brand-soft:#FFB27A; --accent:var(--brand);
  --f-brand:"Russo One","Arial Black",sans-serif;
  --on-ink:#FFFFFF; --on-ink-muted:#C9C0B0;
  --ok:#169A50; --fix:#B07A00; --todo:#E5371F;
  --f-display:"Dela Gothic One","Arial Black",Impact,sans-serif;
  --f-brush:"Ma Shan Zheng","STKaiti","KaiTi",serif;
  --f-body:"Zen Kaku Gothic New","Hiragino Sans","Segoe UI",system-ui,sans-serif;
  --f-mono:"DM Mono",ui-monospace,Menlo,monospace;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
body[data-sec="dw3"]{--accent:var(--yellow)}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 var(--f-body);-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
a{color:inherit}
:focus-visible{outline:3px solid var(--wei);outline-offset:2px}
h1,h2,h3,h4,h5{margin:0;font-weight:400;text-wrap:balance}
.wrap{max-width:1360px;margin:0 auto;padding-inline:16px}

/* ---------- global brand bar (Warp Pipes) ---------- */
.gh{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--night);color:var(--on-ink)}
.gh .wrap{display:flex;align-items:center;gap:18px;padding-block:9px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:9px;text-decoration:none}
.logo svg{width:32px;height:32px;flex:none}
.logo b{font:400 21px var(--f-brand);letter-spacing:.005em}
.logo b span{color:var(--accent)}
.gnav{display:flex;gap:16px;font-weight:700;font-size:14px}
.gnav a,.gnav>span{text-decoration:none;opacity:.8}
.gnav a[aria-current="page"],.gnav a:hover{opacity:1;color:var(--accent)}
.gnav .soon{font:500 10px var(--f-mono);color:var(--on-ink-muted);margin-left:4px}
.lang{margin-left:auto;display:inline-flex;border:2px solid var(--on-ink);transform:skewX(-12deg)}
.lang a{font:500 12px var(--f-mono);padding:5px 10px;color:var(--on-ink);text-decoration:none;display:inline-block}
.lang a[aria-current="true"]{background:var(--accent);color:var(--night)}
.lang a span{display:inline-block;transform:skewX(12deg)}

/* ---------- shared poster pieces ---------- */
.hero{position:relative;background:var(--yellow);overflow:hidden;clip-path:polygon(0 0,100% 0,100% calc(100% - 34px),0 100%)}
.hero .wrap{position:relative;padding-block:30px 58px}
.eyebrow{font:500 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.brush{font-family:var(--f-brush);font-weight:400;line-height:1}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--night);color:var(--brand);font:400 16px var(--f-brand);padding:11px 20px;text-decoration:none;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.btn:hover{background:var(--on-ink);color:var(--night)}

/* ---------- HOME ---------- */
.carts{position:relative;justify-self:end;width:min(380px,100%);aspect-ratio:1/0.9;max-width:100%}
.carts .c{position:absolute;width:56%;filter:drop-shadow(10px 12px 0 rgba(20,20,20,.9))}
.carts .c svg{width:100%;height:auto;display:block}
.carts .c1{left:0;top:10%;transform:rotate(-14deg)}
.carts .c2{right:0;top:4%;transform:rotate(12deg)}
.carts .c3{left:22%;top:18%;transform:rotate(-3deg);width:60%}
@media (max-width:820px){.carts{justify-self:start;width:240px}}

.sect{padding-block:40px 8px}
.sect-h{display:flex;align-items:baseline;gap:14px;margin-bottom:18px;border-bottom:4px solid var(--ink);padding-bottom:8px}
.sect-h h2{font:400 28px var(--f-brand)}
.sect-h span{font:500 13px var(--f-mono);color:var(--muted)}
.games{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:18px}
@media (max-width:820px){.games{grid-template-columns:1fr}}
.gcard{position:relative;display:block;text-decoration:none;background:var(--yellow);color:var(--ink);padding:24px 24px 22px;overflow:hidden;min-height:250px;clip-path:polygon(0 0,100% 0,100% calc(100% - 26px),calc(100% - 26px) 100%,0 100%)}
.gcard .brush{position:absolute;right:-6px;bottom:-30px;font-size:190px;color:var(--red);opacity:.95;transform:rotate(-5deg)}
.gcard .eyebrow{color:var(--ink)}
.gcard h3{font:400 clamp(26px,3.4vw,38px)/1.05 var(--f-display);color:var(--ink);margin:8px 0 10px;max-width:12ch;position:relative}
.gcard p{margin:0 0 18px;max-width:40ch;position:relative}
.gcard .stats{display:flex;gap:18px;flex-wrap:wrap;position:relative;margin-bottom:18px}
.gcard .stats b{display:block;font:400 26px var(--f-display);color:var(--red)}
.gcard .stats span{font-size:12.5px;font-weight:700}
.gcard .go{position:relative;display:inline-block;background:var(--ink);color:var(--yellow);font:400 15px var(--f-display);padding:9px 18px;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.gcard:hover .go{background:var(--red);color:var(--on-ink)}
.next{border:3px dashed var(--line);display:grid;align-content:center;gap:8px;padding:24px;color:var(--muted)}
.next b{font:400 22px var(--f-brand);color:var(--ink)}
.next svg{width:56px;height:56px;opacity:.5}

/* ---------- DW3 ---------- */
.crumbs{font:500 12.5px var(--f-mono);padding-block:10px 0;color:var(--muted)}
.crumbs a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.dw-hero .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;padding-block:22px 54px}
.dw-hero .brush{position:absolute;right:-10px;top:-40px;font-size:clamp(120px,19vw,240px);color:var(--red);transform:rotate(-6deg);pointer-events:none;opacity:.95}
.dw-hero h1{font:400 clamp(28px,4.6vw,50px)/1.02 var(--f-display);margin-top:6px;max-width:14ch;position:relative}
.dw-hero p{margin:10px 0 0;max-width:58ch;position:relative;font-weight:500}
.gauges{display:grid;grid-template-columns:repeat(4,minmax(0,170px));gap:16px 22px;position:relative}
.gauge b{font:400 24px var(--f-display);font-variant-numeric:tabular-nums}
.gauge b small{font-size:13px}
.gauge>span{display:block;font-size:12.5px;font-weight:700}
.gauge .bar{height:11px;background:var(--ink);margin-top:5px;padding:2px;transform:skewX(-20deg)}
.gauge .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--red),var(--ember) 70%,#FFF07A);transition:width .4s}
.gauge.full .bar i{box-shadow:0 0 10px var(--ember)}
@media (max-width:760px){.gauges{grid-template-columns:repeat(2,minmax(0,1fr))}.dw-hero .brush{opacity:.35}}
.searchbox{position:relative;max-width:680px}
.searchbox input{width:100%;font:500 16px var(--f-body);color:var(--ink);background:var(--sheet);border:3px solid var(--ink);padding:11px 46px 11px 14px}
.searchbox kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:500 12px var(--f-mono);border:2px solid var(--ink);padding:0 6px}

.tabs{display:flex;gap:8px;flex-wrap:wrap;padding-block:4px 16px}
.tabs a{text-decoration:none;color:var(--ink);display:inline-block;font:400 14.5px var(--f-display);padding:8px 16px;border:2px solid var(--ink);transform:skewX(-12deg);background:var(--sheet)}
.tabs a>span{display:inline-block;transform:skewX(12deg)}
.tabs a[aria-current="page"]{background:var(--ink);color:var(--yellow)}
.tabs .new{font:500 10px var(--f-mono);color:var(--red);margin-left:6px;letter-spacing:.06em;text-transform:uppercase}

.app{display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;padding-bottom:64px}
.rail{position:sticky;top:64px;align-self:start;display:flex;flex-direction:column;gap:18px}
.rail h4{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:13px;font-weight:700;border:2px solid var(--ink);background:var(--sheet);padding:3px 11px;transform:skewX(-12deg)}
.chip>span{display:inline-flex;align-items:center;gap:6px;transform:skewX(12deg)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--yellow)}
.chip .dot{width:9px;height:9px;background:var(--fc)}
.toggle{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;cursor:pointer}
.toggle input{accent-color:var(--red);width:17px;height:17px}
@media (max-width:900px){.app{grid-template-columns:1fr;gap:12px}.rail{position:static;flex-direction:row;flex-wrap:wrap;gap:12px 22px}.buy-rail{display:none}}
@media (min-width:901px){.buy-list{display:none}}
.faction{margin-bottom:30px}
.f-wei{--fc:var(--wei)} .f-shu{--fc:var(--shu)} .f-wu{--fc:var(--wu)} .f-oth{--fc:var(--oth)} .f-item{--fc:var(--item)} .f-ink{--fc:var(--ink)}
.fhead{display:flex;align-items:center;gap:12px;padding-bottom:4px}
.fhead .brush{font-size:58px;color:var(--fc);margin-top:-6px}
.fhead h2{font:400 26px var(--f-display)}
.cnt{margin-left:auto;font:500 13px var(--f-mono);font-variant-numeric:tabular-nums;background:var(--sheet);border:2px solid var(--ink);padding:1px 8px}
.cnt.full{background:var(--red);border-color:var(--red);color:var(--on-ink)}
.orow{display:grid;grid-template-columns:minmax(150px,200px) minmax(0,1fr);gap:8px 16px;padding:12px 2px;border-top:3px solid var(--ink);align-items:center}
.orow+.orow{border-top-width:1px;border-top-color:var(--line)}
.oname{color:var(--ink);text-decoration:none;text-align:left;display:flex;flex-direction:column;min-width:0}
.oname b{font:400 18px var(--f-display);line-height:1.15}
.oname small{font-size:12px;font-weight:700;color:var(--fc)}
.oname:hover b{color:var(--fc)}
.slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:640px){.orow{grid-template-columns:1fr}.slots{grid-template-columns:1fr}}
.slot{display:flex;align-items:center;gap:9px;min-width:0}
.slot.is-out{visibility:hidden}
.sib a.done b::before{content:"济 ";font-family:var(--f-brush);color:var(--red)}
.slot.empty{font-size:13px;color:var(--muted);padding-left:46px}
.slink{color:var(--ink);text-decoration:none;text-align:left;min-width:0;display:flex;flex-direction:column;line-height:1.28}
.slink .k{font:500 10.5px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:4px}
.slink .v{font-weight:700;overflow-wrap:anywhere}
.slink:hover .v{color:var(--red)}
.slot.done .v{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:2px}
.el{font:400 16px var(--f-brush);color:var(--red);letter-spacing:0}

/* the stamp: 济 brushed in a blade-cut frame */
.stamp{width:36px;height:36px;flex:none;border:2px solid var(--ink);background:var(--sheet);display:grid;place-items:center;font:400 22px var(--f-brush);color:transparent;transform:skewX(-10deg)}
.stamp:hover{background:var(--yellow-soft)}
.stamp[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:var(--on-ink)}
.stamp.fresh{animation:stamp .34s cubic-bezier(.2,1.6,.4,1)}
.stamp.fixed{cursor:default;background:var(--paper);border-color:var(--line);color:var(--muted);font:500 13px var(--f-mono)}
@keyframes stamp{0%{transform:scale(1.8) rotate(-14deg);opacity:0}100%{transform:skewX(-10deg);opacity:1}}
@media (prefers-reduced-motion:reduce){.stamp.fresh{animation:none}.gauge .bar i{transition:none}}

.row{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;padding:12px 2px;border-top:1px solid var(--line);align-items:start}
.row .main{min-width:0}
.row .ttl a{text-decoration:none;font:400 17px var(--f-display);text-align:left}
.row .ttl a:hover{color:var(--red)}
.row p{margin:2px 0 0;color:var(--muted);font-size:13.5px;max-width:72ch}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.tag{font-size:12px;font-weight:700;border:2px solid var(--line);padding:0 7px;white-space:nowrap}
.tag.strong{border-color:var(--ink)}
.tag.chaos{background:var(--red);border-color:var(--red);color:var(--on-ink)}
.srow{color:var(--ink);text-decoration:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding:14px 2px;border-top:1px solid var(--line);text-align:left;width:100%}
.srow:first-child{border-top:3px solid var(--ink)}
.srow h3{font:400 20px var(--f-display)}
.srow:hover h3{color:var(--red)}
.srow .tot{font:500 14px var(--f-mono);align-self:center}
.srow .tags{grid-column:1/-1;margin-top:0;display:flex;flex-wrap:wrap;gap:6px}

.plan-head{display:grid;gap:6px;padding:16px 18px;background:var(--ink);color:var(--on-ink);margin-bottom:12px;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}
.plan-head b{font:400 22px var(--f-display);color:var(--yellow)}
.plan-head p{margin:0;color:var(--on-ink-muted);font-size:13.5px;max-width:78ch}
.run{display:grid;grid-template-columns:52px minmax(0,1fr);gap:4px 14px;padding:16px 2px;border-top:1px solid var(--line)}
.run .no{font:400 34px var(--f-display);color:var(--red);line-height:1}
.run h3{font:400 20px var(--f-display)}
.run .gain{font:500 12px var(--f-mono);color:var(--red);letter-spacing:.04em}
.run ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.run li{display:flex;align-items:center;gap:10px;min-width:0}
.run li .stamp{width:30px;height:30px;font-size:17px}
.run li a.lk{text-decoration:none;color:var(--ink);text-align:left;min-width:0;font-weight:700}
.run li a.lk:hover{color:var(--red)}
.run li small{color:var(--muted)}
.empty-state{padding:48px 8px;text-align:center;color:var(--muted)}

/* ---------- dispatch panel (ink) : turbo-frame#panel, vide = masqué ---------- */
.panel{position:fixed;z-index:30;top:0;right:0;bottom:0;width:min(760px,100%);background:var(--ink);color:var(--on-ink);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);box-shadow:-24px 0 48px -24px rgba(22,18,14,.6)}
.panel:not(:has(article)){display:none}
.panel article{display:flex;flex-direction:column;min-height:0;flex:1}
.pbar{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.14);font:500 12px var(--f-mono);color:var(--on-ink-muted)}
.pbar span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pbar a{margin-left:auto;font-size:22px;line-height:1;padding:2px 9px;color:var(--on-ink);text-decoration:none}
.pbar a:hover{color:var(--yellow)}
.pbody{overflow-y:auto;padding:20px clamp(22px,4cqw,34px) 34px;display:flex;flex-direction:column;gap:18px;position:relative;container-type:inline-size}
.phead{position:relative;padding-right:70px}
.phead .tier{display:inline-block;background:var(--yellow);color:var(--ink);font:400 12px var(--f-display);padding:3px 10px;transform:skewX(-14deg)}
.phead .tier span{display:inline-block;transform:skewX(14deg)}
.phead h2{font:400 32px/1.05 var(--f-display);color:var(--yellow);margin-top:10px}
.phead .who{font-weight:700;color:var(--yellow-soft)}
.phead .who a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.phead .seal{position:absolute;right:0;top:0;width:60px;height:60px;border:3px solid var(--red);color:var(--red);display:grid;place-items:center;font:400 36px var(--f-brush);transform:rotate(-8deg)}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;margin:0}
.facts div{min-width:0;border-left:3px solid var(--yellow);padding-left:9px}
.facts dt{font:500 10.5px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--on-ink-muted)}
.facts dd{margin:2px 0 0;font-weight:700;overflow-wrap:anywhere}
.facts dd a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-align:left}
.facts dd a:hover{color:var(--yellow)}
.facts .chaos{color:#FF6B4F}
.block h3{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--yellow);margin-bottom:4px}
.block p{margin:0;max-width:70ch;color:#F1EBDD}
.verif{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--on-ink-muted);border-top:1px dashed rgba(255,255,255,.2);padding-top:12px}
.verif i{font:500 11px var(--f-mono);font-style:normal;padding:2px 8px;white-space:nowrap;color:var(--ink)}
.verif .v-confirmed,.verif .v-remaster-verified{background:#53D18B} .verif .v-corrected{background:var(--yellow)} .verif .v-unverified,.verif .v-disputed{background:#FF6B4F}
.mark{display:flex;align-items:center;gap:12px;padding:12px 14px;background:rgba(255,255,255,.07)}
.mark .stamp{width:42px;height:42px;font-size:24px}
.mark b{display:block}
.mark small{color:var(--on-ink-muted)}
.sib{display:grid}
.sib a{color:inherit;text-decoration:none;display:flex;gap:10px;align-items:baseline;text-align:left;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.sib a b{font-weight:700}
.sib a:hover b{color:var(--yellow)}
.sib small{color:var(--on-ink-muted);margin-left:auto;white-space:nowrap;font-size:12px}
.scrim{position:fixed;inset:0;z-index:25;background:rgba(22,18,14,.35);display:none}
body:has(#panel article) .scrim{display:block}
/* Fiche : volet par-dessus la liste à toutes les tailles ; plus large, la fiche s'étale (4 colonnes de caractéristiques) */
@container (min-width:620px){.facts{grid-template-columns:repeat(4,minmax(0,1fr))}.phead h2{font-size:40px}}

footer{background:var(--night);color:var(--on-ink-muted);font-size:12.5px;margin-top:24px}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 26px;padding-block:22px 34px}
footer b{color:var(--on-ink)}

/* ---------- utilitaires ---------- */
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;background:var(--yellow);color:var(--ink);padding:8px 14px;z-index:50}
.skip:focus{left:16px}
[hidden]{display:none!important}
.prose{max-width:68ch;padding-block:32px 48px}
.prose h1{font:400 clamp(28px,4vw,40px)/1.1 var(--f-brand);margin-bottom:16px}
.prose h2{font:700 20px var(--f-body);margin:28px 0 8px}
.prose p,.prose li{color:var(--ink)}
.todo{background:var(--yellow-soft);padding:0 4px}
.foot-links{display:flex;gap:16px}
.foot-links a{color:var(--on-ink-muted)}
.foot-links a:hover{color:var(--accent)}

/* ---------- encart d'achat (affiliation Instant Gaming) ---------- */
.buy{position:relative;overflow:hidden;background:var(--red);color:var(--on-ink);padding:18px 16px 14px;display:grid;gap:8px;clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.buy .brush{position:absolute;right:-6px;bottom:-22px;font-size:110px;color:var(--ink);opacity:.22;pointer-events:none}
.buy-eyebrow{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--yellow-soft);position:relative}
.buy h2{font:400 21px/1.05 var(--f-display);color:var(--yellow);position:relative}
.buy p{margin:0;font-size:13.5px;line-height:1.45;position:relative}
.buy-links{display:grid;gap:8px;margin-top:4px;position:relative}
.buy-links a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 10px;background:var(--yellow);color:var(--ink);text-decoration:none;padding:10px 12px;transform:skewX(-8deg);transition:background .15s,transform .15s}
.buy-links a b{font:400 15px/1.15 var(--f-display);transform:skewX(8deg)}
.buy-links a small{grid-row:2;font:500 11px var(--f-mono);transform:skewX(8deg)}
.buy-links a::after{content:"→";grid-row:1/3;grid-column:2;font-size:18px;font-weight:700;transform:skewX(8deg)}
.buy-links a:hover,.buy-links a:focus-visible{background:var(--on-ink);transform:skewX(-8deg) translateX(3px)}
.buy-note{font-size:11.5px;color:#FFD9CF;position:relative}
.buy-list{margin-top:28px}
.buy-list .buy-links{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
@media (prefers-reduced-motion:reduce){.buy-links a{transition:none}}

/* ---------- listes dédiées (4e / 5e armes, personnages) ---------- */
.quick{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline;margin:-6px 0 16px;font-size:13.5px}
.quick span{font:500 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.quick a{color:var(--ink);font-weight:700;text-underline-offset:3px;text-decoration-color:var(--red)}
.quick a[aria-current="page"]{color:var(--red);text-decoration:none}
.intro-block{max-width:78ch;margin-bottom:22px;padding:14px 16px;background:var(--sheet);border-left:4px solid var(--red)}
.intro-block p{margin:0}
.who-sm{font-size:13px;font-weight:700;color:var(--muted)}
.optout{background:var(--sheet);border:2px solid var(--ink);padding:12px 16px;margin:12px 0}
.optout p{margin:0 0 8px}

/* ---------- articles (marque Warp Pipes : nuit et orange) ---------- */
.art-wrap{max-width:1120px;margin:0 auto;padding-inline:16px}
.art-hero{background:var(--brand)}
.art-hero--dw3{background:var(--yellow)}
.art-head{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px 56px;align-items:center;padding-block:28px 64px}
@media (max-width:900px){.art-head{grid-template-columns:1fr}.art-art{display:none}}
.art-hero h1{font:400 clamp(30px,4.6vw,50px)/1.04 var(--f-brand);max-width:24ch;margin-top:8px}
.art-hero--dw3 h1{font-family:var(--f-display)}
.art-hero .art-lede{font-size:18px;font-weight:500;max-width:60ch;margin:14px 0 0}
.art-meta{display:block;margin-top:14px;font:500 12.5px var(--f-mono);letter-spacing:.04em}
.crumbs-light{font:500 12.5px var(--f-mono)}
.crumbs-light a{color:var(--night)}
.art-art{position:relative;height:240px}
.art-art .brush{position:absolute;right:-40px;top:6px;font-size:150px;white-space:nowrap;color:var(--red);transform:rotate(-6deg)}
.art-art .art-cart{position:absolute;left:20px;bottom:0;width:150px;height:150px;transform:rotate(-8deg);filter:drop-shadow(8px 10px 0 rgba(20,20,20,.9))}
.art-art .c{position:absolute;width:56%;filter:drop-shadow(8px 10px 0 rgba(20,20,20,.9))}
.art-art .c svg{width:100%;height:auto;display:block}
.art-art .c1{left:0;top:10%;transform:rotate(-14deg)}
.art-art .c2{right:0;top:2%;transform:rotate(12deg)}
.art-art .c3{left:20%;top:16%;transform:rotate(-3deg);width:60%}
.art-layout{display:grid;grid-template-columns:minmax(0,720px) 300px;justify-content:space-between;gap:56px;align-items:start}
@media (max-width:1100px){.art-layout{grid-template-columns:minmax(0,1fr) 260px;gap:36px}}
@media (max-width:900px){.art-layout{grid-template-columns:minmax(0,1fr)}.art-aside{order:-1}.toc{display:none}}
.art-body{font-size:18px;line-height:1.72;padding-block:32px 64px;max-width:none}
.art-body>p:first-child{font-size:20px;font-weight:500}
.art-body h2{font:400 27px/1.15 var(--f-brand);margin:44px 0 12px;scroll-margin-top:80px}
.art-body h3{font:700 20px var(--f-body);margin:28px 0 8px}
.art-body a{color:var(--ink);text-decoration-color:var(--brand);text-decoration-thickness:2px;text-underline-offset:3px}
.art-body table{width:100%;border-collapse:collapse;font-size:15px;margin:20px 0;display:block;overflow-x:auto}
.art-body th,.art-body td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
.art-body th{background:var(--night);color:var(--on-ink);font-weight:700}
.art-body tr:nth-child(even) td{background:var(--sheet)}
.art-body blockquote{margin:20px 0;padding:8px 18px;border-left:4px solid var(--brand);background:var(--sheet)}
.art-fig{margin:28px 0;border:3px solid var(--night);overflow:hidden;clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.art-fig svg{display:block;width:100%;height:auto}
.art-photo{margin:32px 0}
.art-photo img{display:block;width:100%;height:auto;border:3px solid var(--night)}
.art-photo figcaption{font-size:14px;color:var(--muted);margin-top:6px}
.art-sources{margin-top:48px;font-size:14px;border-top:3px solid var(--night)}
.art-sources h2{font-size:20px}
.art-sources ol{padding-left:20px;color:var(--muted)}
.art-sources a{color:var(--muted);overflow-wrap:anywhere}
.art-aside{padding-top:32px;display:grid;gap:22px}
.toc{border-top:4px solid var(--night);padding-top:10px}
.toc h2{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;counter-reset:toc}
.toc li{counter-increment:toc}
.toc a{display:grid;grid-template-columns:28px minmax(0,1fr);gap:6px;padding:6px 0;color:var(--ink);text-decoration:none;font-size:14.5px;line-height:1.35;border-bottom:1px solid var(--line)}
.toc a::before{content:counter(toc,decimal-leading-zero);font:500 12px var(--f-mono);color:var(--brand);padding-top:2px}
.toc a:hover{color:var(--brand)}
.art-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:22px}
.art-card{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--ink);background:var(--sheet);border:3px solid var(--night);padding:0 0 16px;overflow:hidden;clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.art-card>*:not(.art-cover){margin-inline:18px}
.art-cover{width:100%;height:auto;aspect-ratio:1200/630;display:block;border-bottom:3px solid var(--night);margin-bottom:6px}
.art-card h2{font:400 21px/1.15 var(--f-brand)}
.art-card p{margin:0;color:var(--muted);font-size:14.5px}
.art-card .art-meta{margin:0;color:var(--muted)}
.art-card .go{margin-top:auto;font:400 15px var(--f-brand);color:var(--brand)}
.art-card:hover{border-color:var(--brand)}
.art-card:hover .art-cover{border-color:var(--brand)}
.gcard-sm{min-height:0;padding:20px 18px 18px}
.gcard-sm .brush{font-size:84px;bottom:-12px;right:-4px;opacity:.3}
.gcard-sm h3{font-size:22px;max-width:none}
.sect-h a{margin-left:auto;font:400 15px var(--f-brand);color:var(--brand);text-decoration:none}

/* ---------- carte de stage (pilote) ---------- */
.stage-map{margin:0;background:#F6EEDB;color:var(--ink);border:3px solid var(--yellow);padding:10px;display:grid;gap:8px}
.stage-map svg{display:block;width:100%;height:auto}
.sm-tools{display:flex;flex-wrap:wrap;gap:6px;justify-content:space-between;align-items:center}
.sm-side{display:inline-flex;flex-wrap:wrap;gap:4px}
.sm-side button,.sm-zoom{font:700 12px var(--f-body);border:2px solid var(--ink);background:#fff;padding:3px 9px;color:var(--ink)}
.sm-side button[aria-pressed="true"]{background:var(--ink);color:var(--yellow)}
.sm-zoom{background:var(--yellow)}
.sm-ground{fill:#F6EEDB}
.sm-terrain path{fill:#2A2420;stroke:#2A2420;stroke-width:4;stroke-linejoin:round}
.sm-base{stroke:#fff;stroke-width:4}
.sm-coalition{fill:var(--wei)}
.sm-dong-zhuo{fill:var(--wu)}
.sm-gates rect{fill:#8A6516;stroke:#fff;stroke-width:4}
.sm-gates text{font:700 26px var(--f-body);fill:var(--ink);paint-order:stroke;stroke:#F6EEDB;stroke-width:8}
.sm-off circle{stroke:#fff;stroke-width:3}
.sm-off.sm-coalition circle{fill:var(--wei)} .sm-off.sm-dong-zhuo circle{fill:var(--wu)}
.sm-off text{display:none;font:700 24px var(--f-body);paint-order:stroke;stroke:#F6EEDB;stroke-width:7}
.sm-off.sm-coalition text{fill:var(--wei)} .sm-off.sm-dong-zhuo text{fill:var(--wu)}
.stage-map.is-wide .sm-off text{display:inline}
.stage-map[data-side="coalition"] [data-side="dong-zhuo"],.stage-map[data-side="dong-zhuo"] [data-side="coalition"]{opacity:.12}
.sm-seal{fill:#fff;stroke:var(--red);stroke-width:6;transform-box:fill-box;transform-origin:center;transform:rotate(-8deg)}
.sm-glyph{font:400 36px var(--f-brush);fill:var(--red)}
.map-marker.done .sm-seal{fill:var(--red)} .map-marker.done .sm-glyph{fill:#fff}
.sm-route-line{fill:none;stroke:var(--red);stroke-width:8;stroke-dasharray:22 14;stroke-linecap:round;stroke-linejoin:round}
.sm-route-start{fill:var(--red);stroke:#fff;stroke-width:4} .sm-route-end{fill:#fff;stroke:var(--red);stroke-width:6}
.map-marker.done .sm-route-line{stroke:#7A6F60}
.sm-label{font:400 28px var(--f-display);fill:var(--ink);paint-order:stroke;stroke:#F6EEDB;stroke-width:9}
.map-marker:hover .sm-label,.map-marker:focus .sm-label{fill:var(--red)}
.stage-map figcaption{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--ink)}
.stage-map figcaption em{flex-basis:100%;color:#8A3A10;font-style:normal;font-weight:700}
.sm-key{display:inline-block;width:12px;height:12px;margin-right:5px;vertical-align:-1px}
.sm-key-box{border:2px solid var(--red);background:#fff} .sm-key-route{border-top:3px dashed var(--red);height:0;width:16px;vertical-align:3px} .sm-key-base{background:var(--wei);transform:rotate(45deg)}
.sm-dialog{padding:0;border:0;background:transparent;width:min(1000px,96vw);max-height:96vh;overflow:auto}
.sm-dialog::backdrop{background:rgba(22,18,14,.7)}
.sm-dialog .stage-map{border-color:var(--ink)}
.stage-map.is-wide svg{max-height:calc(96vh - 120px);width:auto;max-width:100%;margin:0 auto}

/* ---------- calendrier des sorties (marque Warp Pipes) ---------- */
.rel-hero{background:var(--brand)}
.rel-hero .wrap{padding-block:28px 60px}
.rel-hero h1{font:400 clamp(30px,5vw,54px)/1.02 var(--f-brand);margin-top:8px;max-width:20ch}
.rel-hero h1::first-letter{text-transform:uppercase}
.rel-hero p{font-size:17px;max-width:62ch;margin:12px 0 0}
.rel-months{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:18px;font:400 15px var(--f-brand)}
.rel-months a{color:var(--night);text-decoration-thickness:2px;text-underline-offset:4px}
.rel-months a::first-letter{text-transform:uppercase}
.rel-months .rel-ics{background:var(--night);color:var(--brand);padding:6px 14px;text-decoration:none;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.rel-wrap{padding-block:0 56px}
.rel-filters{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 18px;position:sticky;top:56px;z-index:5;background:var(--paper);padding:10px 0}
.rel-sticky{position:sticky;top:50px;z-index:6;background:var(--paper);margin-bottom:18px;border-bottom:2px solid var(--line)}
.rel-sticky .rel-filters{position:static;margin:0;padding:6px 0 10px}
.rel-sticky .rel-strip{padding:12px 0 4px}
.rel-filters>span{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-right:6px}
.rel-filters .chip[aria-pressed="true"]{background:var(--night);color:var(--brand);border-color:var(--night)}
.rel-day{margin-bottom:28px;scroll-margin-top:190px}
.rel-day h2{font:400 22px var(--f-brand);border-bottom:4px solid var(--night);padding-bottom:6px;margin-bottom:12px}
.rel-day h2 em{font:500 12px var(--f-mono);font-style:normal;color:#fff;background:var(--brand);padding:2px 8px;vertical-align:middle;margin-left:8px;letter-spacing:.06em;text-transform:uppercase}
.rel-day.is-past{opacity:.72}
.rel-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:14px}
.rel-card{background:var(--sheet);border:3px solid var(--night);padding:14px 16px;display:flex;flex-direction:column;gap:8px;scroll-margin-top:190px;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}
.rel-cover{display:block;width:calc(100% + 32px);max-width:none;height:auto;aspect-ratio:460/215;object-fit:cover;margin:-14px -16px 2px;border-bottom:3px solid var(--night);background:var(--line)}
.rel-card:target{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand)}
.rel-head{display:flex;gap:8px;align-items:baseline;justify-content:space-between}
.rel-head h3{font:400 19px/1.15 var(--f-brand)}
.rel-kind{font:500 10.5px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;background:var(--night);color:var(--brand);padding:2px 7px;white-space:nowrap}
.rel-postponed{background:var(--red);color:#fff}
.rel-unofficial{background:var(--sheet);color:var(--red);border:2px dashed var(--red)}
.game-when .game-unofficial{color:var(--red);text-transform:none;letter-spacing:0;font:700 13px var(--f-body)}
.rel-postponed-note{font-size:13px;color:var(--muted);margin:-4px 0 8px}
.rel-card p{margin:0;font-size:14.5px;color:var(--ink)}
.rel-tags{display:flex;flex-wrap:wrap;gap:5px}
.rel-pf{font:700 11.5px var(--f-body);background:var(--night);color:#fff;padding:1px 7px}
.rel-pf-ps5,.rel-pf-ps4{background:#1F4FD6} .rel-pf-xbox-series,.rel-pf-xbox-one{background:#107C10} .rel-pf-switch2,.rel-pf-switch{background:#E4000F} .rel-pf-pc,.rel-pf-mac{background:#3A3F4A}
.rel-foot{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;margin-top:auto;font-size:12.5px;color:var(--muted)}
.rel-foot span{flex:1 1 100%}
.rel-foot a{color:var(--ink);font-weight:700;text-underline-offset:3px}
.rel-foot .rel-add{color:var(--brand)}
.rel-foot .rel-guide{background:var(--yellow);padding:1px 7px;text-decoration:none}
.rel-method{font-size:13px;color:var(--muted);max-width:78ch;border-top:1px solid var(--line);padding-top:12px}

/* ---------- Actu : fil, une, brèves ---------- */
.feed-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:500 12px var(--f-mono);color:var(--muted)}
.feed{display:grid;gap:18px}
.feed-item{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:20px;align-items:start;text-decoration:none;color:var(--ink);background:var(--sheet);border:3px solid var(--night);padding:12px;box-shadow:6px 6px 0 var(--night);transition:transform .15s,box-shadow .15s}
.feed-item:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--brand)}
.feed-item>img,.feed-item>.mosaic{width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;display:block;border:2px solid var(--night)}
.mosaic{display:grid !important;grid-template-columns:1fr 1fr;gap:2px;background:var(--night);overflow:hidden}
.mosaic img{width:100%;height:100%;object-fit:cover;display:block}
.feed-item h2,.feed-item h3{font:400 22px/1.15 var(--f-brand);margin:8px 0 6px}
.feed-item p{margin:0;color:var(--muted);font-size:15px}
.feed-item:hover h2,.feed-item:hover h3{color:var(--brand)}
.feed-item--breve{grid-template-columns:minmax(0,190px) minmax(0,1fr)}
.feed-item--breve h2,.feed-item--breve h3{font-size:19px}
.feed--compact{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.feed--compact .feed-item{grid-template-columns:1fr;gap:8px}
.feed--compact .feed-item p{display:none}
@media (max-width:640px){.feed-item,.feed-item--breve{grid-template-columns:1fr;gap:10px}}
.feed-filters{top:56px}
.feed-filters .chip small{font:500 11px var(--f-mono);opacity:.7}
.game-box{display:flex;flex-direction:column;gap:6px;background:var(--sheet);border:3px solid var(--night);padding:14px;margin-bottom:22px}
.game-box img{width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;border:2px solid var(--night)}
.game-buy{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;margin-top:6px}.game-buy .eyebrow{flex-basis:100%}.game-buy small{flex-basis:100%;font-size:12px;color:var(--muted)}
.aff-mark{font-size:.8em;color:var(--muted)}
.game-box b{font:400 19px/1.15 var(--f-brand)}
.game-box-meta{font-size:13.5px;color:var(--muted)}
.game-box a{font-weight:700;color:var(--ink);font-size:14px}
.game-box .rel-add{color:var(--brand)}
.art-gamecover{display:block;width:100%;max-width:420px;height:auto;aspect-ratio:460/215;object-fit:cover;border:3px solid var(--night);box-shadow:10px 12px 0 rgba(20,20,20,.35);transform:rotate(1.5deg)}
.art-related{padding-block:8px 56px}
.art-related h2{font:400 24px var(--f-brand);margin:0 0 14px}
.rel-news{display:block;font-size:13px;color:var(--ink);text-decoration:none;border-left:4px solid var(--brand);padding:2px 0 2px 8px}
.rel-news b{font:500 10.5px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--brand);margin-right:4px}
.rel-news:hover{text-decoration:underline}

/* ---------- Accueil : nuit / papier (maquette A2) ---------- */
.stk{display:inline-block;font:500 10.5px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;padding:2px 7px;border:2px solid var(--night);box-shadow:2px 2px 0 var(--night);transform:rotate(-2deg);background:var(--sheet);color:var(--night);white-space:nowrap}
.stk-y,.stk-dossier{background:var(--yellow)}
.stk-actu{background:var(--brand)}
.stk-breve{background:var(--sheet)}
.stk-digest{background:var(--yellow-soft)}
.digest-bar{display:flex;align-items:center;gap:14px;margin:0 0 18px;padding:10px 16px;color:var(--on-ink);text-decoration:none;border:2px solid var(--yellow);background:#1c1c1c;box-shadow:6px 6px 0 rgba(255,198,41,.25);transition:transform .15s,box-shadow .15s}
.digest-bar:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 rgba(255,198,41,.4)}
.digest-bar-t{display:grid;gap:2px;min-width:0}
.digest-bar-t b{font:400 18px/1.15 var(--f-brand)}
.digest-bar-t small{font-size:13px;color:var(--on-ink-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.digest-bar-go{margin-left:auto;font:400 22px var(--f-brand);color:var(--yellow)}
.digest-bar:hover .digest-bar-go{color:var(--brand)}
@media (max-width:600px){.digest-bar{flex-wrap:wrap}.digest-bar-t small{white-space:normal}.digest-bar-go{display:none}}
@media (prefers-reduced-motion:reduce){.digest-bar{transition:none}}
.home-top{color:var(--on-ink);background:var(--night);background-image:radial-gradient(900px 420px at 80% -20%,rgba(255,107,26,.3),transparent 60%);clip-path:polygon(0 0,100% 0,100% calc(100% - 46px),0 100%)}
.home-top .wrap{padding-block:20px 96px}
.home-head h1{font:400 clamp(26px,3vw,42px)/1.03 var(--f-brand);margin:0 0 6px;max-width:34ch}
.home-head p{margin:0 0 18px;color:var(--on-ink-muted);font:500 12.5px var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.home-head p b{color:var(--brand);font-weight:500}
.une-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:24px;align-items:stretch}
.une{position:relative;display:block;color:var(--on-ink);text-decoration:none;border:3px solid var(--brand);box-shadow:10px 10px 0 rgba(255,107,26,.35);transition:transform .15s,box-shadow .15s}
.une:hover{transform:translate(-3px,-3px);box-shadow:13px 13px 0 rgba(255,107,26,.5)}
.une img{display:block;width:100%;height:100%;min-height:360px;object-fit:cover}
.une-cap{position:absolute;inset:auto 0 0 0;padding:80px 22px 20px;background:linear-gradient(transparent,rgba(10,10,10,.95) 48%)}
.une-stk{position:absolute;top:14px;left:-10px;transform:rotate(-6deg);font-size:13px;padding:5px 12px;box-shadow:3px 3px 0 var(--night)}
.une h2{font:400 clamp(22px,2.5vw,34px)/1.08 var(--f-brand);margin:8px 0 6px;max-width:26ch}
.une p{margin:0;color:#ddd;font-size:15px}
.une .feed-meta,.fil .feed-meta{color:var(--on-ink-muted)}
.une time{color:var(--yellow)}
.fil{display:flex;flex-direction:column}
.fil ol{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.fil li a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;color:var(--on-ink);text-decoration:none;padding:7px 8px;border:2px solid #333;background:#1c1c1c;transition:border-color .15s,transform .15s}
.fil li a:hover{border-color:var(--brand);transform:translateX(4px)}
.fil img{width:96px;height:auto;aspect-ratio:460/215;object-fit:cover;border:2px solid var(--on-ink)}
.fil h3{font:400 15px/1.2 var(--f-brand);margin:5px 0 0}
.fil .stk{box-shadow:2px 2px 0 #000;border-color:#000}
.fil-all{display:inline-block;margin-top:12px;color:var(--brand);font-weight:700;font-size:14px}
.countdown{position:relative;z-index:3;display:flex;align-items:center;gap:18px;width:max-content;max-width:calc(100% - 32px);margin:-62px auto 0;background:var(--yellow);color:var(--night);border:3px solid var(--night);box-shadow:7px 7px 0 var(--night);padding:12px 24px;text-decoration:none;transform:rotate(-1.5deg);transition:transform .15s}
.countdown:hover{transform:rotate(0)}
.countdown-n{font:400 46px/1 var(--f-brand);color:var(--red);white-space:nowrap}
.countdown b{font:400 22px/1.1 var(--f-brand);display:block}
.countdown small{display:block;font:500 11px var(--f-mono);letter-spacing:.1em;text-transform:uppercase}
.paper{background-image:radial-gradient(var(--line) 1.2px,transparent 1.2px);background-size:18px 18px}
.paper .wrap{padding-block:30px 40px}
.paper-h{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:14px}
.paper-h h2{font:400 26px var(--f-brand);margin:0}
.paper-h a{margin-left:auto;font-weight:700;color:var(--ink)}
.week{display:flex;gap:18px;overflow-x:auto;padding:6px 8px 16px;scroll-snap-type:x proximity}
.week a{flex:0 0 172px;scroll-snap-align:start;color:var(--ink);text-decoration:none;background:var(--sheet);border:2px solid var(--night);box-shadow:4px 4px 0 var(--night);transition:transform .15s,box-shadow .15s}
.week a:nth-child(odd){transform:rotate(-1.4deg)}.week a:nth-child(even){transform:rotate(1.2deg)}
.week a:hover{transform:rotate(0) translateY(-4px);box-shadow:4px 4px 0 var(--brand)}
.week img,.week .ph{width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;display:block;border-bottom:2px solid var(--night);background:var(--line)}
.week span{display:block;padding:6px 8px 8px}
.week time{display:block;font:500 11.5px var(--f-mono);color:var(--red)}
.week b{display:block;font:400 13.5px/1.15 var(--f-brand)}
@media (max-width:900px){.une-grid{grid-template-columns:1fr}.une img{height:auto;min-height:0;aspect-ratio:16/8.4}}
@media (max-width:640px){.home-top .wrap{padding-bottom:84px}.une-cap{position:static;padding:14px 16px 16px;background:var(--night)}.countdown{gap:12px;padding:10px 16px}.countdown-n{font-size:34px}.countdown b{font-size:18px}}
@media (prefers-reduced-motion:reduce){.une,.fil li a,.week a,.countdown{transition:none}}

/* ---------- En-têtes du site général : nuit + halo orange (l'aplat orange fatiguait les yeux) ---------- */
.art-hero:not(.art-hero--dw3),.rel-hero{background:var(--night);color:var(--on-ink);background-image:radial-gradient(900px 420px at 85% -20%,rgba(255,107,26,.3),transparent 60%)}
.art-hero:not(.art-hero--dw3) .eyebrow,.rel-hero .eyebrow,.art-hero:not(.art-hero--dw3) .crumbs-light{color:var(--brand)}
.art-hero:not(.art-hero--dw3) .crumbs-light a,.rel-months a{color:var(--on-ink)}
.art-hero:not(.art-hero--dw3) .art-lede,.art-hero:not(.art-hero--dw3)>.wrap>p,.rel-hero p{color:#ddd}
.art-hero:not(.art-hero--dw3) .art-meta{color:var(--yellow)}
.rel-months .rel-ics{background:var(--brand);color:var(--night)}
.art-gamecover{border-color:var(--brand);box-shadow:10px 12px 0 rgba(255,107,26,.35)}
@media (max-width:900px){.article--breve .art-aside,.article--actu .art-aside{order:0}}
.preview-bar{position:sticky;top:0;z-index:30;margin:0;padding:8px 16px;background:var(--yellow);color:var(--night);font:500 13px var(--f-mono);text-align:center;border-bottom:3px solid var(--night)}

/* Rubrique Jeux : fiche d'un jeu */
.game-hero{background:var(--night);color:var(--on-ink);background-image:radial-gradient(900px 420px at 85% -20%,rgba(255,107,26,.3),transparent 60%)}
.game-hero .eyebrow,.game-hero .crumbs-light{color:var(--brand)}
.game-hero .crumbs-light a{color:var(--on-ink)}
.game-hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;align-items:center;padding-block:22px 64px}
.game-hero h1{font:400 clamp(30px,4.6vw,52px)/1.03 var(--f-brand);margin:8px 0 12px;max-width:22ch}
.game-hero .rel-tags{margin-bottom:12px}
.game-lede{font-size:17px;color:#ddd;max-width:60ch;margin:0}
.game-cover{width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;border:3px solid var(--brand);box-shadow:10px 10px 0 rgba(255,107,26,.35)}
@media (max-width:820px){.game-hero-grid{grid-template-columns:1fr}.game-cover{order:-1}}
.game-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start;padding-block:8px 56px;max-width:1180px}
.game-wrap:not(:has(.game-aside)){grid-template-columns:minmax(0,1fr)}
@media (max-width:900px){.game-wrap{grid-template-columns:1fr}.game-aside{order:-1}}
.game-when{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;background:var(--yellow);border:3px solid var(--night);box-shadow:6px 6px 0 var(--night);padding:16px 20px;margin:-34px 0 24px;position:relative;z-index:2}
.game-when.is-out{background:var(--sheet)}
.game-when b{font:400 22px/1.15 var(--f-brand);display:block}
.game-when small{display:block;font:500 12px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;margin-top:4px}
.game-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-left:auto;font-weight:700;font-size:14px}
.game-actions a{color:var(--ink);text-underline-offset:3px}
.game-actions .btn{color:var(--brand)}
.game-actions .rel-guide{background:var(--night);color:var(--yellow);padding:3px 9px;text-decoration:none}
.game-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px 22px;margin:0 0 28px;padding:14px 0;border-block:2px solid var(--line)}
.game-facts dt{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.game-facts dd{margin:2px 0 0;font-weight:700}
.game-articles .sect-h{margin-top:4px}
.game-aside .game-buy{margin:0}
@media (min-width:901px){.game-aside .game-buy{position:sticky;top:72px}}
.game-buy a{font-weight:700;color:var(--ink)}
.game-box-title{color:inherit;text-decoration:none}
.game-box-title:hover{color:var(--brand);text-decoration:underline}

/* Rubrique Jeux : liste (onglets à venir / sortis, mois, pagination) */
.games-all{padding-block:22px 56px}
.games-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:6px}
.games-tabs a{font:400 18px var(--f-brand);color:var(--ink);text-decoration:none;border:3px solid var(--night);background:var(--sheet);padding:7px 18px;box-shadow:4px 4px 0 var(--night)}
.games-tabs a small{font:500 12px var(--f-mono);color:var(--muted);margin-left:4px}
.games-tabs a[aria-current="page"]{background:var(--night);color:var(--brand)}
.games-tabs a[aria-current="page"] small{color:var(--on-ink-muted)}
.games-tabs a:not([aria-current]):hover{box-shadow:4px 4px 0 var(--brand)}
.games-tabs .games-clear{font:700 13px var(--f-body);border-width:2px;box-shadow:none;padding:4px 10px}
.rel-filters a.chip{color:var(--ink);text-decoration:none}
.games-month{margin-bottom:30px}
.games-month h2{display:flex;align-items:baseline;gap:14px;font:400 22px var(--f-brand);border-bottom:4px solid var(--night);padding-bottom:6px;margin-bottom:14px}
.games-month h2 a{margin-left:auto;font:700 13px var(--f-body);color:var(--ink)}
.gtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:16px}
.gtile{display:flex;flex-direction:column;color:var(--ink);text-decoration:none;background:var(--sheet);border:2px solid var(--night);box-shadow:4px 4px 0 var(--night);transition:transform .15s,box-shadow .15s}
.gtile:hover{transform:translateY(-3px);box-shadow:4px 4px 0 var(--brand)}
.gtile-img{position:relative;display:block}
.gtile img,.gtile .ph{width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;display:block;border-bottom:2px solid var(--night);background:var(--line)}
.gtile-new{position:absolute;top:8px;left:-6px;transform:rotate(-4deg)}
.gtile-body{display:grid;gap:5px;padding:8px 10px 10px}
.gtile time{font:500 11.5px var(--f-mono);color:var(--red)}
.gtile b{font:400 15px/1.15 var(--f-brand)}
.gtile:hover b{color:var(--brand)}
.pager{display:flex;justify-content:center;align-items:center;gap:22px;font-size:14px;color:var(--muted);padding-top:8px}
.pager a{font-weight:700;color:var(--ink)}
.game-about .prose{padding-block:0 8px}
.game-about-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:28px;align-items:start;margin-bottom:12px}
.game-about-row.is-tool-only{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.game-about-row.is-tool-only .game-guide{margin-bottom:28px}
.game-guide .gcard{min-height:0}
.game-guide .gcard .stats{gap:14px;margin-bottom:14px}
.game-guide .gcard .stats b{font-size:20px}
@media (max-width:820px){.game-about-row,.game-about-row.is-tool-only{grid-template-columns:1fr}}
@media (max-width:640px){.rel-sticky .rel-strip ol,.rel-sticky .rel-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.rel-sticky .rel-filters>span{display:none}.rel-sticky .chip{flex:none}}

/* Calendrier : bande des mois, recherche, liens vers les fiches */
.rel-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 32px;align-items:center}
.rel-featured{justify-self:end;align-self:end;max-width:100%}
.countdown--hero{margin:0;max-width:100%;transform:none;box-shadow:7px 7px 0 rgba(0,0,0,.55)}
.countdown--hero:hover{transform:translateY(-2px)}
.rel-hero-art{display:none}
.rel-hero .wrap{z-index:1}
@media (min-width:1100px){
  .rel-hero-art{display:block;position:absolute;top:0;right:0;bottom:0;width:58%;z-index:0;opacity:.85;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 45%);mask-image:linear-gradient(90deg,transparent,#000 45%)}
  .rel-hero-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
  .rel-featured{margin-bottom:6px}
}
@media (max-width:980px){.rel-hero-grid{grid-template-columns:1fr}.rel-featured{justify-self:start}}
.rel-search{display:flex;gap:8px;margin-top:18px;max-width:560px}
.rel-search input{border-color:var(--on-ink);padding-right:14px}
.rel-search button{font:400 15px var(--f-brand);background:var(--brand);color:var(--night);border:0;padding:0 18px;cursor:pointer;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.rel-strip{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.rel-strip ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.rel-strip li a{display:flex;align-items:baseline;gap:6px;white-space:nowrap;text-decoration:none;color:var(--ink);font-size:13.5px;border:2px solid var(--night);background:var(--sheet);padding:4px 12px;box-shadow:3px 3px 0 var(--night)}
.rel-strip li a:hover{box-shadow:3px 3px 0 var(--brand)}
.rel-strip li a b{font:400 15px var(--f-brand);text-transform:capitalize}
.rel-strip li a small{font:500 11px var(--f-mono);color:var(--muted)}
.rel-strip li a[aria-current="page"]{background:var(--night);color:var(--brand)}
.rel-strip li a[aria-current="page"] small{color:var(--on-ink-muted)}
.rel-today{margin-left:auto;font-weight:700;color:var(--brand)}
.rel-cover-link{display:block}
.rel-head h3 a{color:inherit;text-decoration:none}
.rel-head h3 a:hover{color:var(--brand);text-decoration:underline;text-underline-offset:3px}

/* Accueil : articles de fond, dernières brèves */
.fil-h{font:400 18px var(--f-brand);color:var(--on-ink);margin:0 0 10px}
.fil-links{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:auto;padding-top:4px}
.longreads{margin-top:32px}
.longreads-h{display:flex;align-items:baseline;gap:14px;border-bottom:3px solid var(--brand);padding-bottom:8px;margin-bottom:16px}
.longreads-h h2{font:400 24px var(--f-brand)}
.longreads-h span{font:500 12.5px var(--f-mono);color:var(--on-ink-muted)}
.longreads-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:18px}
.longreads-list a{display:grid;gap:8px;align-content:start;color:var(--on-ink);text-decoration:none;padding:10px;border:2px solid #333;background:#1c1c1c;transition:border-color .15s,transform .15s}
.longreads-list a:hover{border-color:var(--brand);transform:translateY(-3px)}
.longreads-list img{width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;border:2px solid var(--on-ink)}
.longreads-list .feed-meta{color:var(--on-ink-muted)}
.longreads-list .stk{box-shadow:2px 2px 0 #000;border-color:#000;color:var(--night)}
.longreads-list h3{font:400 18px/1.15 var(--f-brand)}
.longreads-list a:hover h3{color:var(--brand)}
.longreads-list p{margin:0;color:#bbb;font-size:14px}
@media (prefers-reduced-motion:reduce){.gtile,.longreads-list a{transition:none}}

/* ---------- Appli installable et notifications ---------- */
.gh-bell{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;color:var(--on-ink);border:2px solid transparent}
.gh-bell:hover,.gh-bell[aria-current="page"]{color:var(--brand);border-color:var(--brand)}
.gh-bell + .lang{margin-left:0}
.pwa-banner{position:fixed;z-index:30;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));max-width:560px;margin-inline:auto;display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--night);color:var(--on-ink);border:2px solid var(--brand);box-shadow:6px 6px 0 rgba(255,107,26,.35)}
.pwa-banner[hidden]{display:none}
.pwa-banner img{flex:none;border:2px solid var(--on-ink)}
.pwa-banner-t{display:grid;gap:2px;min-width:0;flex:1}
.pwa-banner-t b{font:400 16px/1.15 var(--f-brand)}
.pwa-banner-t small{font-size:12.5px;color:var(--on-ink-muted)}
.pwa-banner-x{flex:none;background:none;border:0;color:var(--on-ink-muted);font-size:18px;padding:4px 6px;cursor:pointer}
.pwa-banner-x:hover{color:var(--on-ink)}
.btn-primary,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:400 15px var(--f-brand);padding:9px 16px;border:2px solid var(--night);cursor:pointer;text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--brand);color:var(--night);box-shadow:3px 3px 0 var(--night)}
.btn-primary:hover{background:var(--yellow)}
.btn-ghost{background:var(--sheet);color:var(--ink)}
.btn-ghost:hover{border-color:var(--brand)}
.btn-primary[hidden],.btn-ghost[hidden]{display:none}
.btn-primary:disabled,.btn-ghost:disabled{opacity:.6;cursor:wait}
.pwa-banner .btn-primary{border-color:var(--brand);box-shadow:none}
.push-page{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px;align-items:start;padding-block:28px 64px}
.push-card{background:var(--sheet);border:3px solid var(--night);box-shadow:8px 8px 0 rgba(20,20,20,.18);padding:20px}
.push-card h2{font:400 22px var(--f-brand);margin:0 0 8px}
.push-states p{margin:0 0 14px}
.push-toggles{border:0;margin:0 0 16px;padding:0;display:grid;gap:10px}
.push-toggles legend{font:500 12px var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.push-toggle{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border:2px solid var(--line);cursor:pointer}
.push-toggle:has(input:checked){border-color:var(--night);background:var(--paper)}
.push-toggle input{width:20px;height:20px;margin-top:2px;accent-color:var(--brand);flex:none}
.push-toggle > span{display:grid;gap:4px}
.push-toggle small{color:var(--muted);font-size:13.5px}
.push-actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.push-note{font-size:13px;color:var(--muted);margin:10px 0 0}
.push-install .btn-primary{margin-top:6px}
.home-install{display:none}
@media (max-width:700px){
  .home-install:not([hidden]){display:inline-block;margin:0 0 10px;font:500 12.5px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--brand);text-decoration:underline;text-underline-offset:3px}
}
@media (max-width:860px){.push-page{grid-template-columns:1fr}}

/* DW3 : lien discret vers la fiche du jeu (actu, sorties, guides) */
.dw3-crumbs{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline}
.dw3-crumbs .dw3-news{margin-left:auto}
.dw3-news{font:500 12.5px var(--f-mono);color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.dw3-news:hover{color:var(--red)}
.dw3-news-panel{display:block;margin-top:22px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.18);color:var(--on-ink-muted)}
.dw3-news-panel:hover{color:var(--brand)}

/* Fiches DW3 : vignette « sur la carte » et vidéo de l'obtention */
.vignette svg{display:block;width:100%;max-width:440px;height:auto;border:3px solid var(--yellow);background:#34404F}
.vg-ground{fill:#3B4757}
.vg-water path{fill:#2D6E8E;stroke:#4FA3C7;stroke-width:2}
.vg-wall path{fill:#141A22;stroke:#5B6B80;stroke-width:3;stroke-linejoin:round}
.vg-gates line{stroke:#7FE3F0;stroke-width:16;stroke-linecap:round}
.vg-route{fill:none;stroke:var(--yellow);stroke-width:10;stroke-dasharray:4 20;stroke-linecap:round;stroke-linejoin:round}
.vg-start{fill:var(--yellow);stroke:#141A22;stroke-width:5}
.vg-pulse{fill:none;stroke:#FF6B4F;stroke-width:6;opacity:.85;transform-box:fill-box;transform-origin:center;animation:vg-pulse 1.8s ease-out infinite}
@keyframes vg-pulse{from{transform:scale(.55);opacity:1}to{transform:scale(1.25);opacity:0}}
@media (prefers-reduced-motion:reduce){.vg-pulse,.vg-route{animation:none}}
.vg-seal{fill:#fff;stroke:var(--red);stroke-width:7}
.vg-glyph{font:400 38px var(--f-brush);fill:var(--red)}
.vg-catch{stroke:#FF6B4F;stroke-width:9;stroke-linecap:round}
.vg-note,.vid-credit{font-size:13px;color:var(--on-ink-muted);margin:6px 0 0;max-width:62ch}
.vid-credit a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.vid-credit a:hover{color:var(--yellow)}
.vid-frame{position:relative;aspect-ratio:16/9;max-width:100%;background:#000;border:3px solid var(--yellow);display:grid;place-items:center}
.vid-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85}
.vid-frame .vid-play{position:relative;box-shadow:0 4px 18px rgba(0,0,0,.5)}
.vid-play{font:400 18px var(--f-display);color:var(--ink);background:var(--yellow);border:0;padding:12px 18px;cursor:pointer;transform:skewX(-8deg)}
.vid-play span{color:var(--red)}
.vid-play small{font:500 12px var(--f-mono);margin-left:6px}
.vid-play:hover,.vid-play:focus-visible{background:#fff}
.vid-moments-title{font:500 11px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-ink-muted);margin:10px 0 4px}
.vid-moments{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.vid-moments button{font:600 13px var(--f-body);color:#F1EBDD;background:transparent;border:1px solid rgba(255,255,255,.3);padding:4px 9px;cursor:pointer;text-align:left}
.vid-moments button b{font:500 12px var(--f-mono);color:var(--yellow);margin-right:4px}
.vid-moments button:hover{border-color:var(--yellow)}