/* 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 ---------- */
.home-hero .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:center}
.home-hero{background:var(--brand)}
.home-hero h1{font:400 clamp(36px,6.2vw,72px)/.98 var(--f-brand);margin-top:10px;max-width:13ch}
.home-hero p{font-size:17px;max-width:46ch;margin:16px 0 22px}
.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}}
.hero-ctas{display:flex;flex-wrap:wrap;gap:10px 14px}
.btn-ghost{background:var(--paper);color:var(--night)}
.btn-ghost:hover{background:var(--night);color:var(--brand)}
.feat{justify-self:end;width:min(420px,100%);display:flex;flex-direction:column;gap:6px;background:var(--night);color:var(--on-ink);text-decoration:none;padding:0 0 18px;transform:rotate(1.5deg);box-shadow:10px 12px 0 rgba(20,20,20,.35);clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.feat img{display:block;width:100%;height:auto;aspect-ratio:460/215;object-fit:cover;border-bottom:4px solid var(--brand);margin-bottom:8px}
.feat>span,.feat>b{padding-inline:18px}
.feat-label{font:500 12px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-soft);display:flex;flex-wrap:wrap;gap:4px 10px}
.feat-label em{font-style:normal;background:var(--brand);color:var(--night);padding:0 6px}
.feat b{font:400 clamp(22px,2.6vw,30px)/1.08 var(--f-brand)}
.feat-meta{font-size:14px;color:var(--on-ink-muted)}
.feat:hover b{color:var(--brand)}
@media (max-width:820px){.feat{justify-self:stretch;transform:none;width:100%}}

@media (max-width:820px){.home-hero .wrap{grid-template-columns:1fr}}
.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(460px,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 22px 34px;display:flex;flex-direction:column;gap:18px;position:relative}
.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:62ch;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}
@media (min-width:1440px){
  .app:has(#panel article){grid-template-columns:200px minmax(0,1fr) 440px}
  .app .panel{position:sticky;top:64px;height:calc(100vh - 80px);width:auto;box-shadow:none;z-index:1;clip-path:polygon(0 0,100% 0,100% 100%,22px 100%,0 calc(100% - 22px))}
  body:has(#panel article) .scrim{display:none}
}
@media (max-width:640px){.panel{top:auto;height:86%;width:100%}}

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{position:static;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-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{position:sticky;top:76px;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:8px 56px;max-width:1120px}
.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-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}
.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:120px;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-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}
.home-rel{display:grid;gap:8px}
.home-rel a{display:grid;grid-template-columns:112px 92px minmax(0,1fr) auto;gap:12px;align-items:center;text-decoration:none;color:var(--ink);padding:10px 0;border-bottom:1px solid var(--line)}
.home-rel img,.home-rel .ph{width:112px;height:auto;aspect-ratio:460/215;object-fit:cover;border:2px solid var(--night);background:var(--line);display:block}
.home-rel time{font:500 12.5px var(--f-mono);color:var(--brand)}
.home-rel b{font:400 17px var(--f-brand)}
.home-rel small{color:var(--muted);font-size:12.5px}
@media (max-width:640px){.home-rel a{grid-template-columns:104px minmax(0,1fr);gap:2px 12px;align-items:start}.home-rel a>img,.home-rel a>.ph{grid-row:1/4;width:104px}}