/* =====================================================================================
   BENDO JAM — vitrine (une seule feuille pour l'accueil)
   Police : Saira (fonts.css). Titres : étroits, gras, italiques. Textes : Saira normale.
   Palette : nuit bleue, cyan, bleu, rose en accent (pas de violet). Toutes les tailles sont fluides (clamp).
   ===================================================================================== */
:root{
  color-scheme:dark;
  --bg:#080c24;--bg-2:#0b1236;--bg-3:#0f1840;--panel:#111a46;--panel-2:#15205a;
  --line:#22305f;--line-2:#33508f;
  --ink:#f3f5ff;--ink-2:#d6daf0;--muted:#a9b0cf;--faint:#7c83a8;
  --cyan:#21e5ed;--cyan-2:#8cfaff;--pink:#ff58a6;--violet:#123a86;--blue:#1687ff;
  --c:#21e5ed;
  --wrap:1320px;--gutter:clamp(16px,4.2vw,56px);
  --header-h:72px;
  --fs-display:clamp(2.75rem,1.55rem + 5.3vw,6.25rem);
  --fs-h2:clamp(2.5rem,1.6rem + 3.9vw,5.25rem);
  --fs-display-sm:clamp(2rem,1.5rem + 2.2vw,3.25rem);
  --fs-title:clamp(1.375rem,1.15rem + .9vw,2rem);
  --fs-lead:clamp(1rem,.94rem + .3vw,1.1875rem);
  --fs-body:clamp(.9375rem,.91rem + .12vw,1rem);
  --fs-small:.875rem;--fs-xs:.75rem;
  --space-section:clamp(72px,6rem + 4vw,152px);
  --cut:14px;
  --ease:cubic-bezier(.2,.75,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 12px);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:var(--fs-body);line-height:1.65;font-stretch:100%;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
[hidden]{display:none!important}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
h1,h2,h3,p,ol,ul,dl,dd,figure,blockquote{margin:0}
ol,ul{padding:0;list-style:none}
strong{color:var(--ink);font-weight:700}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
svg{width:1.15em;height:1.15em;flex:0 0 auto}
.skip{position:fixed;left:16px;top:-80px;z-index:200;background:var(--cyan);color:#05101a;padding:12px 18px;font-weight:700}
.skip:focus{top:12px}
.wrap{width:100%;max-width:calc(var(--wrap) + 2*var(--gutter));margin-inline:auto;padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right))}

/* ---------- Typographie ---------- */
.display,.display-sm,.fighter-name,.passage-num,.codex-num,.place-caption strong,.hero-tag strong,.ticker{font-family:var(--font);font-style:italic;font-weight:800;font-stretch:72%;text-transform:uppercase;letter-spacing:-.005em}
.display{font-size:var(--fs-h2);line-height:.9}
h1.display{font-size:var(--fs-display)}
.display-sm{font-size:var(--fs-display-sm);line-height:.95}
.display em,.display-sm em{font-style:italic;color:var(--cyan);text-shadow:0 0 28px #21e5ed38}
.title{font-family:var(--font);font-weight:700;font-stretch:82%;font-size:var(--fs-title);line-height:1.08;text-transform:uppercase;letter-spacing:.01em}
.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:.6em;font-size:var(--fs-xs);font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);line-height:1.5}
.eyebrow .num{font-style:italic;font-weight:800;font-stretch:75%;font-size:1.35em;letter-spacing:.04em;color:var(--pink)}
.eyebrow .num::after{content:'';display:inline-block;width:28px;height:2px;background:currentColor;margin-left:.6em;vertical-align:middle;opacity:.8}
.lead,.section-lead{font-size:var(--fs-lead);color:var(--ink-2);line-height:1.6;max-width:34em}
.small-note{font-size:var(--fs-small);color:var(--faint)}
[data-site-lang=zh] .display,[data-site-lang=zh] .display-sm,[data-site-lang=zh] .fighter-name,[data-site-lang=zh] .title,[data-site-lang=zh] .btn{font-style:normal;letter-spacing:0;font-weight:800}
[data-site-lang=zh] .display{line-height:1.08}
[data-site-lang=zh] .eyebrow{letter-spacing:.08em}

/* ---------- Boutons et liens ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.7em;min-height:52px;padding:.7em 1.5em;font-style:italic;font-weight:700;font-stretch:85%;font-size:1rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;text-align:center;transition:background .2s,color .2s,border-color .2s,transform .2s var(--ease)}
.btn svg{width:18px;height:18px}
.btn-primary{background:var(--cyan);color:#06122a;box-shadow:0 10px 28px #21e5ed2e;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}
.btn-primary:hover{background:var(--cyan-2);transform:translate(-1px,-1px)}
.btn-ghost{border:1px solid #4f74c4;background:#0b123699;color:var(--ink)}
.btn-ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.btn-block{width:100%}
.link{display:inline-flex;align-items:center;gap:.55em;min-height:44px;font-weight:700;font-stretch:90%;font-size:var(--fs-small);letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}
.link svg{width:16px;height:16px;transition:transform .2s var(--ease)}
.link:hover svg{transform:translateX(3px)}
.icon-button{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--line-2);color:var(--muted);transition:color .2s,border-color .2s}
.icon-button:hover{color:var(--cyan);border-color:var(--cyan)}
.icon-button svg{width:20px;height:20px}
#motion[aria-pressed=true]{color:var(--cyan);border-color:var(--cyan)}

/* ---------- En-tête ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:50;height:var(--header-h);display:flex;align-items:center;gap:clamp(12px,2vw,32px);padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right));background:linear-gradient(#080c24e6,#080c2400);transition:background .3s,box-shadow .3s}
.site-header.is-scrolled{background:#0a1133f0;box-shadow:0 1px 0 var(--line),0 10px 30px #04051466;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.brand{flex:0 0 auto;display:block;width:clamp(124px,11vw,158px)}
.brand img{width:100%;filter:drop-shadow(0 4px 14px #00b7ef44)}
.nav-panel{display:flex;align-items:center;gap:clamp(12px,2vw,28px);margin-left:auto}
.nav-panel nav{display:flex;gap:clamp(10px,1.6vw,26px)}
.nav-panel nav a{position:relative;display:flex;align-items:center;min-height:44px;font-size:.8125rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap;transition:color .2s}
.nav-panel nav a::after{content:'';position:absolute;left:0;right:0;bottom:8px;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav-panel nav a:hover,.nav-panel nav a.is-active{color:var(--ink)}
.nav-panel nav a:hover::after,.nav-panel nav a.is-active::after{transform:scaleX(1)}
.lang-switch{display:flex;border:1px solid var(--line-2)}
.lang-switch button{display:flex;align-items:center;gap:6px;min-height:40px;padding:0 10px;font-size:.75rem;font-weight:700;letter-spacing:.06em;color:var(--muted);transition:background .2s,color .2s}
.lang-switch button+button{border-left:1px solid var(--line-2)}
.lang-switch button img{width:18px;height:12px;object-fit:cover;opacity:.85}
.lang-switch button[aria-pressed=true]{background:#21e5ed1f;color:var(--ink)}
.lang-switch button[aria-pressed=true] img{opacity:1}
.lang-switch button:hover{color:var(--ink)}
.header-actions{display:flex;align-items:center;gap:10px}
.btn-play{min-height:44px;padding:0 1.1em;font-size:.875rem;background:var(--cyan);color:#06122a;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.btn-play:hover{background:var(--cyan-2)}
.btn-play svg{width:16px;height:16px}
.menu-toggle{display:none}
.scroll-progress{position:absolute;left:0;right:0;bottom:0;height:2px;overflow:hidden;pointer-events:none}
.scroll-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--pink));transform-origin:left;transform:scaleX(0)}

/* ---------- Accueil ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:max(640px,100svh);display:flex;align-items:center;padding:calc(var(--header-h) + clamp(24px,5vh,60px)) 0 clamp(48px,8vh,96px);border-bottom:3px solid var(--cyan)}
.hero-bg{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,#080d28 0%,#0a1030f2 30%,#102c6a8c 62%,#0a3a7a55 100%),
  linear-gradient(0deg,#080c24 0%,transparent 45%),
  url('assets/bendo-city.webp') center/cover}
.hero-bg::before{content:'';position:absolute;inset:0;background:linear-gradient(128deg,transparent 56%,#1687ff40 56%,#1687ff14 78%,transparent 78%),repeating-linear-gradient(125deg,transparent 0 180px,#35d8ff1f 181px,transparent 184px)}
.hero-bg::after{content:'';position:absolute;right:0;top:12%;bottom:0;width:46%;background:linear-gradient(145deg,#31dbfa1c,transparent 50%,#1687ff30);clip-path:polygon(48% 0,100% 0,100% 100%,0 100%)}
.hero-inner{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(16px,3vw,48px)}
.hero-copy{position:relative;z-index:2}
.hero-copy .eyebrow{color:var(--ink-2);gap:.7em}
.hero-copy .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
.hero-copy .eyebrow .sep{color:var(--cyan)}
.hero-logo{width:clamp(220px,32vw,460px);margin:clamp(18px,3vh,30px) 0 clamp(14px,2.4vh,24px);filter:drop-shadow(0 10px 26px #00b7ef55)}
.hero h1{margin-bottom:clamp(16px,2.6vh,26px)}
.hero h1 em{display:inline-block}
.hero .lead{max-width:30em}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:clamp(22px,3.4vh,34px)}
.hero-facts{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:clamp(22px,3.6vh,36px);font-size:var(--fs-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.hero-facts li{display:flex;align-items:center;gap:10px}
.hero-facts li::before{content:'';width:6px;height:6px;background:var(--pink);transform:rotate(45deg)}
.hero-art{position:relative;align-self:stretch;min-height:clamp(420px,62vh,720px)}
.hero-ring{position:absolute;width:min(92%,560px);aspect-ratio:1;left:50%;top:50%;translate:-50% -52%;border:1px solid #38c7ff55;border-radius:50%;box-shadow:0 0 90px #1579f62e,inset 0 0 70px #1b84b31f;transform:rotate(-22deg) scaleX(.84)}
.hero-ring::after{content:'';position:absolute;inset:34px;border:1px dashed #52dff33a;border-radius:50%}
.hero-fighter{position:absolute;bottom:calc(-1 * clamp(48px,8vh,96px));left:50%;translate:-50% 0;height:calc(100% + clamp(48px,8vh,96px));width:auto;max-width:none;filter:drop-shadow(-14px 8px 0 #1ebaf126) drop-shadow(0 22px 38px #05081d99);-webkit-mask-image:linear-gradient(#000 86%,transparent);mask-image:linear-gradient(#000 86%,transparent)}
.hero-tag{position:absolute;right:0;bottom:12%;padding:12px 20px 14px;background:#0f1846f0;border:1px solid #4f74c488;border-left:4px solid var(--cyan);min-width:190px}
.hero-tag span{display:block;font-size:.6875rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan)}
.hero-tag strong{display:block;font-size:2.5rem;line-height:1;margin:4px 0 2px}
.hero-tag small{font-size:.8125rem;color:var(--ink-2);font-style:italic}

/* ---------- Bandeau défilant ---------- */
.ticker{overflow:hidden;background:#101a4d;border-block:1px solid #2f5fbf88;font-size:clamp(1rem,.9rem + .5vw,1.35rem);line-height:clamp(44px,4vw,54px);letter-spacing:.06em}
.ticker>div{display:flex;width:max-content;gap:clamp(20px,3vw,40px);white-space:nowrap;animation:ticker 46s linear infinite}
.ticker b{color:var(--pink);font-weight:400;font-style:normal}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ---------- Sections ---------- */
.section{position:relative;padding-block:var(--space-section)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(20px,4vw,64px);margin-bottom:clamp(36px,5vw,64px)}
.section-head .eyebrow{margin-bottom:clamp(14px,1.6vw,22px)}
.section-head .section-lead{max-width:27em;color:var(--muted)}

/* ---------- Bande-annonce ---------- */
.trailer{background:radial-gradient(ellipse at 8% 18%,#1d3f9a55,transparent 58%),radial-gradient(ellipse at 95% 95%,#1687ff22,transparent 55%),linear-gradient(135deg,#0d1434,#0b1030)}
.trailer-frame{position:relative;aspect-ratio:16/9;background:#05071a;border:1px solid #6ae6ef55;box-shadow:0 30px 90px #02071599;clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px))}
.trailer-frame::before{content:'';position:absolute;left:10%;right:10%;top:0;height:3px;z-index:3;background:linear-gradient(90deg,transparent,var(--cyan),var(--pink),transparent)}
.trailer-cover{position:absolute;inset:0;display:grid;place-items:center}
.trailer-cover>#trailer-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72)}
.trailer-cover::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 30%,#05071acc)}
.trailer-logo{position:absolute;z-index:1;top:clamp(16px,6%,40px);left:50%;translate:-50% 0;width:clamp(120px,22%,300px);filter:drop-shadow(0 8px 20px #000a)}
.trailer-play{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:14px;font-style:italic;font-weight:700;font-stretch:85%;font-size:clamp(.875rem,.8rem + .4vw,1.125rem);letter-spacing:.1em;text-transform:uppercase}
.trailer-play-icon{display:grid;place-items:center;width:clamp(64px,9vw,104px);height:clamp(64px,9vw,104px);flex:0 0 auto;border-radius:50%;background:var(--cyan);color:#06122a;box-shadow:0 0 0 10px #21e5ed2e,0 0 60px #21e5ed80;transition:transform .25s var(--ease),box-shadow .25s}
.trailer-play-icon svg{width:38%;height:38%;margin-left:6%}
.trailer-play:hover .trailer-play-icon{transform:scale(1.07);box-shadow:0 0 0 14px #21e5ed33,0 0 80px #21e5eda0}
.trailer-badge{position:absolute;z-index:2;bottom:clamp(12px,4%,28px);left:clamp(12px,3%,28px);padding:6px 12px;background:#0a1133e6;border-left:3px solid var(--pink);font-size:var(--fs-xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
#trailer-video{position:absolute;inset:0;width:100%;height:100%;background:#000}
.trailer-caption{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 20px;margin-top:16px}
.trailer-caption p{font-size:var(--fs-small);color:var(--muted)}
.trailer-caption p:empty{display:none}
.trailer-caption .link{margin-left:auto}

/* ---------- 01 L'univers ---------- */
.universe{background:linear-gradient(180deg,#080c24,#0b1236 60%,#080c24)}
.passage{position:relative;display:grid;gap:clamp(48px,7vw,104px);counter-reset:step}
.passage::before{content:'';position:absolute;left:clamp(22px,2.4vw,34px);top:12px;bottom:12px;width:2px;background:linear-gradient(var(--cyan),var(--blue) 55%,#21e5ed22)}
.passage-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:center;gap:clamp(28px,5vw,80px)}
.passage-step:nth-child(even) .passage-text{order:2}
.passage-step:nth-child(even) .manga-panel{order:1;rotate:1.5deg}
.passage-text{position:relative;padding-left:clamp(70px,7vw,110px)}
.passage-num{position:absolute;left:0;top:-.08em;display:grid;place-items:center;width:clamp(46px,5vw,70px);aspect-ratio:1;background:var(--bg);border:2px solid var(--cyan);color:var(--cyan);font-size:clamp(1.25rem,1rem + 1vw,1.875rem);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.passage-text .title{font-size:clamp(1.75rem,1.3rem + 1.9vw,2.875rem);font-style:italic;font-weight:800;font-stretch:74%;margin-bottom:14px}
.passage-text p{font-size:var(--fs-lead);color:var(--ink-2);max-width:32em}
.manga-panel{position:relative;display:block;justify-self:center;width:min(100%,400px);rotate:-1.5deg;border:5px solid #f3f0e8;box-shadow:10px 10px 0 #123a86,0 30px 60px #0008;transition:rotate .35s var(--ease),transform .35s var(--ease)}
.manga-panel img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top}
.manga-panel:hover{rotate:0deg;transform:translateY(-4px)}
.manga-panel-cta{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:8px;padding:8px 12px;background:#0a1133f0;color:var(--cyan);font-size:var(--fs-xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.manga-panel-cta svg{width:14px;height:14px}
.parody-note{display:flex;align-items:flex-start;gap:clamp(14px,2vw,24px);margin-top:clamp(56px,7vw,96px);padding:clamp(18px,2.4vw,28px);background:linear-gradient(100deg,#15205a,#14123a);border:1px solid var(--line-2);border-left:4px solid var(--pink)}
.parody-badge{flex:0 0 auto;padding:5px 10px;background:var(--pink);color:#1a0612;font-size:var(--fs-xs);font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.parody-note p{color:var(--ink-2);max-width:60em}

/* ---------- 02 Règles ---------- */
.codex{overflow:hidden;isolation:isolate;border-block:1px solid var(--line)}
.codex-bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.codex-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.codex-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#080c24 0%,#0a1133e6 30%,#0a1133f2 100%)}
.codex-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.codex-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2.2vw,30px);background:linear-gradient(160deg,#15205af2,#0e1640f2);border:1px solid var(--line-2);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%);transition:border-color .25s,transform .3s var(--ease)}
.codex-card::before{content:'';position:absolute;left:0;top:0;width:40%;height:3px;background:linear-gradient(90deg,var(--cyan),transparent)}
.codex-card:hover{border-color:#21e5ed88;transform:translateY(-4px)}
.codex-num{font-size:clamp(2.5rem,2rem + 2vw,3.75rem);line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--cyan)}
.codex-card p{color:var(--muted);font-size:var(--fs-body)}
.codex-quote{margin-top:auto;padding-top:8px;color:var(--ink)!important;font-style:italic;font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips li{padding:6px 12px;border:1px solid #4f74c4;font-size:var(--fs-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);background:#0b1236}
.chips-rank li{min-width:40px;text-align:center}
.chip-elite{border-color:var(--cyan)!important;color:var(--cyan)!important}
.chip-nation{border-color:#ffd36c!important;color:#ffd36c!important}
.chip-under{border-color:var(--pink)!important;color:var(--pink)!important}

/* ---------- 03 Jameurs ---------- */
.roster{background:linear-gradient(130deg,#0e1338,#121a4a 55%,#0d2654);overflow:hidden}
.fighter{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(16px,4vw,64px);min-height:clamp(440px,48vw,600px)}
.fighter::before{content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse 34% 46% at 26% 58%,color-mix(in srgb,var(--c) 20%,transparent),transparent 100%);transition:background .5s}
.fighter-word{position:absolute;z-index:-1;left:-.04em;top:50%;translate:0 -50%;font-family:var(--font);font-style:italic;font-weight:900;font-stretch:65%;font-size:clamp(7rem,4rem + 14vw,17rem);line-height:.8;color:transparent;-webkit-text-stroke:1px #c9d2ff1f;white-space:nowrap;pointer-events:none;text-transform:uppercase}
.fighter-portrait{align-self:stretch;display:flex;align-items:flex-end;justify-content:center;min-height:inherit}
.fighter-portrait img{height:clamp(420px,48vw,620px);width:auto;max-width:100%;object-fit:contain;object-position:bottom;-webkit-mask-image:linear-gradient(#000 84%,transparent);mask-image:linear-gradient(#000 84%,transparent);filter:drop-shadow(0 18px 30px #05081daa);transition:opacity .25s,transform .35s var(--ease)}
.fighter-portrait img.is-swapping{opacity:0;transform:translateX(-14px)}
.fighter-index{display:flex;align-items:center;gap:14px;font-size:var(--fs-xs);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.fighter-index i{width:32px;height:2px;background:var(--c)}
.fighter-name{font-size:clamp(3rem,2rem + 4.4vw,6rem);line-height:.88;margin:14px 0 10px;color:var(--ink);text-shadow:0 0 30px color-mix(in srgb,var(--c) 28%,transparent)}
.fighter-tag{font-size:clamp(1.125rem,1rem + .5vw,1.375rem);font-style:italic;font-weight:600;color:var(--c);margin-bottom:14px}
.fighter-bio{color:var(--ink-2);max-width:32em}
.fighter-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:clamp(20px,2.6vw,30px);background:var(--line-2);border:1px solid var(--line-2)}
.fighter-stats>div{padding:12px 14px;background:#0e1642}
.fighter-stats dt{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.fighter-stats dd{margin-top:4px;font-weight:700;font-stretch:88%;font-size:clamp(.9375rem,.88rem + .3vw,1.0625rem);line-height:1.25;color:var(--ink)}
.fighter-stats>div:last-child dd{color:var(--c)}
.fighter-nav{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:clamp(18px,2.4vw,28px)}
.fighter-nav .link{margin-left:8px}
.fighter-picker{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,1.2vw,14px);margin-top:clamp(20px,3vw,36px)}
.pick{position:relative;overflow:hidden;height:clamp(92px,10vw,132px);background:#121c4c;border:1px solid var(--line-2);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));transition:border-color .2s,background .2s}
.pick img{width:100%;height:150%;object-fit:cover;object-position:50% 6%;filter:grayscale(.65) brightness(.65);transition:filter .25s,transform .3s var(--ease)}
.pick span{position:absolute;left:0;right:0;bottom:0;padding:18px 6px 8px;background:linear-gradient(transparent,#060b22f2 60%);font-style:italic;font-weight:800;font-stretch:78%;font-size:clamp(.8125rem,.75rem + .35vw,1.0625rem);letter-spacing:.06em;text-transform:uppercase;text-align:center}
.pick:hover img,.pick[aria-pressed=true] img{filter:none;transform:scale(1.04)}
.pick[aria-pressed=true]{border-color:var(--c);box-shadow:inset 0 -3px 0 var(--c);background:color-mix(in srgb,var(--c) 18%,#121c4c)}

/* ---------- 04 Lieux ---------- */
.places{background:var(--bg)}
.place-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.place{position:relative;overflow:hidden;display:block;width:100%;aspect-ratio:16/9;text-align:left;background:#111430;border:1px solid var(--line-2)}
.place img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.8);transition:transform .7s var(--ease),filter .5s}
.place::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 38%,#080a20f0)}
.place:hover img{transform:scale(1.04);filter:brightness(1)}
.place-caption{position:absolute;z-index:1;left:clamp(16px,2vw,28px);bottom:clamp(14px,2vw,26px);right:70px}
.place-caption small{display:block;font-size:var(--fs-xs);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan)}
.place-caption strong{display:block;font-size:clamp(1.75rem,1.3rem + 1.8vw,3rem);line-height:1;margin-top:4px}
.place-open{position:absolute;z-index:1;right:clamp(16px,2vw,26px);bottom:clamp(16px,2vw,28px);width:26px;height:26px;color:var(--cyan);transition:transform .25s var(--ease)}
.place:hover .place-open{transform:translate(3px,-3px)}

/* ---------- 05 Jeu ---------- */
.game{background:radial-gradient(ellipse at 85% 20%,#1687ff22,transparent 55%),linear-gradient(160deg,#0b1236,#0c1640)}
.game-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(36px,5vw,80px);align-items:start}
.game-copy .eyebrow{margin-bottom:clamp(14px,1.6vw,22px)}
.game-copy .section-lead{margin-top:clamp(16px,2vw,24px);color:var(--muted)}
.game-points{display:grid;gap:clamp(18px,2.2vw,28px);margin-top:clamp(28px,3.6vw,44px);padding-top:clamp(24px,3vw,36px);border-top:1px solid var(--line)}
.game-points li{display:grid;grid-template-columns:auto 1fr;gap:18px}
.game-points li>span{font-style:italic;font-weight:800;font-stretch:72%;font-size:1.5rem;line-height:1.1;color:var(--pink)}
.game-points p{color:var(--muted);margin-top:6px}
.game-side{position:relative;display:grid}
.game-art{position:relative;border:1px solid #4776af;clip-path:polygon(24px 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%,0 24px)}
.game-art img{width:100%;aspect-ratio:16/9;object-fit:cover}
.game-art::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 55%,#0b1236cc)}
.access-card{position:relative;z-index:1;width:min(100% - 24px,500px);margin:-56px 0 0 auto;padding:clamp(20px,2.4vw,30px);background:linear-gradient(160deg,#15205a,#0f1845);border:1px solid var(--line-2);border-top:3px solid var(--cyan);box-shadow:0 24px 60px #03041299}
.access-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.access-icon{display:grid;place-items:center;width:46px;height:46px;flex:0 0 auto;background:#21e5ed1f;color:var(--cyan);border:1px solid #21e5ed66}
.access-icon svg{width:22px;height:22px}
.access-head .eyebrow{margin-bottom:2px}
.access-head .title{font-size:clamp(1.125rem,1rem + .5vw,1.375rem)}
.access-card>p{color:var(--muted);margin-bottom:18px}
.access-facts{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px;font-size:var(--fs-xs);font-weight:600;letter-spacing:.06em;color:var(--muted)}
.access-facts li{display:flex;align-items:center;gap:8px}
.access-facts li::before{content:'';width:8px;height:8px;border:2px solid var(--cyan);transform:rotate(45deg)}

/* ---------- 06 Manga & série ---------- */
.story{background:linear-gradient(120deg,#11244f,#152060 60%,#101845)}
.manga-block{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,96px);align-items:center;padding:clamp(24px,4vw,56px);background:#0a11338c;border:1px solid #3f63a866}
.cover-stack{position:relative;display:block;width:min(100%,380px);aspect-ratio:4/5;justify-self:center;margin:12px 24px 24px 0}
.cover-stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:4px solid #f3f0e8;box-shadow:0 18px 40px #0009;transition:transform .45s var(--ease)}
.cover-stack img:nth-child(1){transform:rotate(7deg) translate(14%,2%)}
.cover-stack img:nth-child(2){transform:rotate(3deg) translate(7%,1%)}
.cover-stack img:nth-child(3){transform:rotate(-2deg)}
.cover-stack:hover img:nth-child(1){transform:rotate(10deg) translate(20%,3%)}
.cover-stack:hover img:nth-child(2){transform:rotate(5deg) translate(10%,1%)}
.cover-stack:hover img:nth-child(3){transform:rotate(-3deg) translateY(-6px)}
.manga-copy .eyebrow{margin-bottom:12px}
.manga-copy blockquote{margin:clamp(14px,2vw,22px) 0 10px;font-style:italic;font-weight:600;font-size:clamp(1.25rem,1.1rem + .7vw,1.625rem);color:var(--cyan)}
.manga-copy>p:not(.eyebrow):not(.small-note){color:var(--ink-2);max-width:32em}
.manga-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.manga-facts li{padding:5px 12px;border:1px solid #6f93dcaa;font-size:var(--fs-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.manga-copy .small-note{margin-top:16px}
.series-block{margin-top:clamp(48px,6vw,88px)}
.series-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:18px 32px;margin-bottom:clamp(20px,2.6vw,30px)}
.series-head .eyebrow{margin-bottom:12px}
.series-format{margin-top:10px;color:var(--muted);font-size:var(--fs-small)}
.tabs{display:flex;border:1px solid var(--line-2);background:#0a1133}
.tabs button{min-height:44px;padding:0 clamp(14px,1.6vw,22px);font-weight:700;font-size:var(--fs-small);letter-spacing:.06em;color:var(--muted);transition:background .2s,color .2s}
.tabs button+button{border-left:1px solid var(--line-2)}
.tabs button[aria-pressed=true]{background:var(--cyan);color:#06122a}
.tabs button:not([aria-pressed=true]):hover{color:var(--ink)}
.series-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.4vw,18px)}
.series-grid.long-format{grid-template-columns:repeat(2,minmax(0,1fr))}
.series-card{display:flex;flex-direction:column;background:#0d1640;border:1px solid var(--line-2);overflow:hidden;transition:border-color .2s,transform .3s var(--ease)}
.series-card:hover{border-color:#21e5ed88;transform:translateY(-3px)}
.series-art{position:relative;aspect-ratio:16/10;background:#080b19}
.series-art img{width:100%;height:100%;object-fit:cover}
.series-number{position:absolute;left:10px;bottom:10px;padding:4px 9px;background:#0a1133f0;border-left:3px solid var(--cyan);font-size:.6875rem;font-weight:700;letter-spacing:.14em}
.series-copy{display:flex;flex-direction:column;flex:1;padding:14px 14px 12px}
.series-copy h3{font-weight:700;font-stretch:84%;font-size:clamp(1rem,.95rem + .3vw,1.1875rem);line-height:1.2;text-transform:uppercase;margin-bottom:8px}
.series-range{font-size:var(--fs-xs);color:var(--muted);margin-bottom:8px}
.series-pending{margin-top:auto;font-size:var(--fs-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}
.series-watch{margin-top:auto;display:flex;align-items:center;min-height:40px;font-size:var(--fs-small);font-weight:700;color:var(--cyan)}

/* ---------- Appel final ---------- */
.finale{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(64px,8vw,120px);background:linear-gradient(120deg,#0e1338,#14245c);border-top:1px solid var(--line-2)}
.finale::before{content:'';position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(120deg,transparent 0 130px,#80d9e00d 131px,transparent 133px)}
.finale-logo{position:absolute;z-index:-1;right:-6%;top:50%;translate:0 -50%;width:min(70vw,820px);opacity:.06;rotate:-10deg}
.finale-inner{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:28px 48px}
.finale .eyebrow{margin-bottom:16px}
.finale-actions{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- Pied de page ---------- */
.site-footer{padding-block:clamp(36px,4vw,56px) max(28px,env(safe-area-inset-bottom));background:#060a1f;border-top:1px solid var(--line)}
.footer-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px 40px}
.footer-brand{display:flex;align-items:center;gap:18px}
.footer-brand img{width:132px}
.footer-brand span{font-size:var(--fs-xs);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.footer-links,.footer-legal{display:flex;flex-wrap:wrap;gap:4px 24px}
.footer-links a,.footer-legal a{display:inline-flex;align-items:center;min-height:44px;font-size:var(--fs-small);color:var(--ink-2)}
.footer-links a:hover,.footer-legal a:hover{color:var(--cyan)}
.footer-parody{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);font-size:var(--fs-small);color:var(--muted);max-width:70em}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 24px;margin-top:12px;color:var(--faint);font-size:var(--fs-xs)}

/* ---------- Fenêtres ---------- */
.dialog{padding:0;color:var(--ink);background:#0d1640;border:1px solid var(--line-2);max-height:min(92svh,900px);overflow:auto;box-shadow:0 30px 100px #000a}
.dialog::backdrop{background:#03040fe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
body.modal-open{overflow:hidden}
.dialog-close{position:absolute;right:12px;top:12px;z-index:5;display:grid;place-items:center;width:44px;height:44px;background:#0a1133e6;border:1px solid var(--line-2);color:var(--ink)}
.dialog-close:hover{border-color:var(--cyan);color:var(--cyan)}
.dialog-close svg{width:20px;height:20px}
.access-dialog{width:min(520px,calc(100% - 32px));padding:clamp(28px,4vw,44px);text-align:center;border-top:3px solid var(--cyan)}
.access-dialog>img{width:min(220px,60%);margin:0 auto 20px}
.access-dialog .eyebrow{justify-content:center}
.access-dialog h2{font-size:clamp(2.25rem,1.8rem + 2vw,3.25rem);margin:14px 0}
.access-dialog>p:not(.eyebrow){color:var(--muted);margin-bottom:22px}
.access-dialog .btn{margin-top:4px}
.access-dialog .btn+.btn{margin-top:12px}
.dialog-state{margin:18px 0 6px;font-size:var(--fs-xs)!important;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan)!important}
.place-dialog{width:min(1120px,calc(100% - 32px))}
.place-dialog>img{width:100%;max-height:64svh;object-fit:cover;background:#05071a}
.place-dialog-copy{padding:clamp(18px,2.4vw,30px)}
.place-dialog-copy .eyebrow{margin-bottom:6px}
.place-dialog-copy p:last-child{color:var(--muted);margin-top:10px;max-width:46em}

/* ---------- Apparitions ---------- */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
.js .passage-step.reveal{transition-delay:.05s}
.js .codex-card.reveal:nth-child(2),.js .game-points li:nth-child(2){transition-delay:.08s}
.js .codex-card.reveal:nth-child(3),.js .game-points li:nth-child(3){transition-delay:.16s}
.js .codex-card.reveal:nth-child(4){transition-delay:.24s}
body[data-reduced=true] *,body[data-reduced=true] *::before,body[data-reduced=true] *::after{animation:none!important;transition:none!important}
body[data-reduced=true] .reveal{opacity:1!important;transform:none!important}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker>div{animation:none}.js .reveal{opacity:1;transform:none;transition:none}}

/* =====================================================================================
   Responsive
   ===================================================================================== */
@media (min-width:1600px){.hero-art{min-height:min(76vh,820px)}}

/* Tablette et petit portable : menu repliable */
@media (max-width:1180px){
  :root{--header-h:64px}
  .menu-toggle{display:grid;place-items:center;width:44px;height:44px;order:3;border:1px solid var(--line-2)}
  .menu-toggle svg{width:22px;height:22px}
  .header-actions{margin-left:auto}
  .nav-panel{position:fixed;inset:var(--header-h) 0 0;z-index:-1;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:28px;margin:0;padding:28px max(var(--gutter),env(safe-area-inset-left)) max(32px,env(safe-area-inset-bottom));background:#0a1133fa;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow-y:auto;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .25s,transform .25s var(--ease),visibility 0s .25s}
  .menu-open .nav-panel{visibility:visible;opacity:1;transform:none;transition:opacity .25s,transform .25s var(--ease)}
  .menu-open{overflow:hidden}
  .site-header,.site-header.is-scrolled{-webkit-backdrop-filter:none;backdrop-filter:none}
  .site-header.is-scrolled{background:#0a1133f7}
  .menu-open .site-header{background:#0a1133}
  .nav-panel nav{flex-direction:column;gap:0}
  .nav-panel nav a{min-height:60px;font-style:italic;font-weight:800;font-stretch:74%;font-size:clamp(1.75rem,1.4rem + 2vw,2.5rem);letter-spacing:.01em;border-bottom:1px solid var(--line)}
  .nav-panel nav a::after{display:none}
  .nav-panel nav a.is-active{color:var(--cyan)}
  .lang-switch{align-self:flex-start;flex-wrap:wrap}
  .lang-switch button{min-height:48px;padding:0 14px;font-size:.875rem}
  .hero-inner{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .codex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .series-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .game-layout{grid-template-columns:1fr}
  .game-side{max-width:760px}
}

/* Tablette portrait */
@media (max-width:860px){
  .section-head{flex-direction:column;align-items:flex-start}
  .hero{min-height:auto;padding-bottom:0}
  .hero-inner{grid-template-columns:1fr}
  .hero-art{min-height:0;height:clamp(380px,92vw,600px);margin-top:8px}
  .hero-bg{background:linear-gradient(90deg,#080d28 0%,#0a1030f2 30%,#102c6a8c 62%,#0a3a7a55 100%),linear-gradient(0deg,#080c24 0%,transparent 45%),url('assets/bendo-city-800.webp') center/cover}
  .hero-fighter{bottom:0;height:100%}
  .hero-ring{width:min(86vw,460px)}
  .hero-tag{right:0;bottom:16%}
  .passage::before{left:22px}
  .passage-step,.passage-step:nth-child(even){grid-template-columns:1fr}
  .passage-step:nth-child(even) .passage-text{order:0}
  .passage-step:nth-child(even) .manga-panel{order:0}
  .passage-text{padding-left:70px}
  .manga-panel{margin-left:70px;justify-self:start;width:min(100% - 70px,420px)}
  .fighter{grid-template-columns:1fr;min-height:0;gap:8px}
  .fighter-word{top:22%}
  .fighter-portrait{min-height:0;height:clamp(320px,74vw,520px)}
  .fighter-portrait img{height:100%}
  .manga-block{grid-template-columns:1fr;text-align:left}
  .cover-stack{width:min(70%,320px);margin:8px auto 28px}
}

/* Téléphone */
@media (max-width:640px){
  .header-actions .icon-button{display:none}
  .brand{width:118px}
  .btn{width:100%}
  .cta-row{flex-direction:column;align-items:stretch}
  .cta-row .link{justify-content:center}
  .hero{padding-top:calc(var(--header-h) + 22px)}
  .hero-copy .eyebrow{font-size:.6875rem;letter-spacing:.14em}
  .hero-facts{gap:6px 16px;letter-spacing:.12em}
  .hero-art{height:clamp(340px,104vw,460px)}
  .hero-tag{bottom:10%;min-width:0;padding:10px 14px}
  .hero-tag strong{font-size:2rem}
  .trailer-frame{clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px));margin-inline:calc(-1 * var(--gutter) + 6px)}
  .trailer-badge{font-size:.625rem;padding:4px 8px}
  .trailer-play>span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .trailer-caption .link{margin-left:0}
  .passage::before{left:19px}
  .passage-text{padding-left:58px}
  .passage-num{width:40px}
  .manga-panel{margin-left:58px;width:calc(100% - 58px)}
  .parody-note{flex-direction:column;gap:10px}
  .codex-grid{grid-template-columns:1fr}
  .fighter-stats{grid-template-columns:1fr 1fr}
  .fighter-stats>div:last-child{grid-column:1/-1}
  .fighter-nav .link{margin-left:0;flex-basis:100%}
  .pick span{font-size:.75rem;letter-spacing:.02em;padding-inline:3px}
  .place-grid{grid-template-columns:1fr}
  .place{aspect-ratio:16/10}
  .access-card{width:100%;margin:14px 0 0}
  .game-points li{gap:14px}
  .tabs{width:100%}
  .tabs button{flex:1;padding:0 6px}
  .series-grid,.series-grid.long-format{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1 * var(--gutter));padding:0 var(--gutter) 10px;scroll-padding-inline:var(--gutter);scrollbar-width:thin}
  .series-card{flex:0 0 78%;scroll-snap-align:start}
  .series-grid.long-format .series-card{flex-basis:86%}
  .finale-actions{width:100%;flex-direction:column}
  .footer-top{flex-direction:column;align-items:flex-start}
  .footer-links{gap:0 20px}
}
@media (max-width:360px){
  .lang-switch button{padding:0 10px}
  .pick{height:84px}
  .fighter-stats{grid-template-columns:1fr}
}
@media (max-height:520px) and (orientation:landscape){
  .hero{min-height:auto}
  .hero-art{min-height:360px}
}
@media print{.site-header,.ticker,.trailer,.finale{display:none}.hero{min-height:auto}}
[data-site-lang=zh] em,[data-site-lang=zh] .hero-tag small,[data-site-lang=zh] blockquote,[data-site-lang=zh] .fighter-tag{font-style:normal}
[data-site-lang=zh] *{font-style:normal!important}

/* Jameurs à débloquer */
.more-jameurs{display:flex;align-items:center;gap:clamp(18px,3vw,40px);margin-top:clamp(16px,2vw,24px);padding:clamp(16px,2vw,24px);background:#0b1238cc;border:1px dashed #3f6fc7aa}
.locked-row{display:grid;grid-template-columns:repeat(6,clamp(38px,4.4vw,58px));gap:8px;flex:0 0 auto}
.locked-row li{display:grid;place-items:center;aspect-ratio:2/3;background:linear-gradient(160deg,#16205a,#0a1030);border:1px solid #2f4f9a;font-style:italic;font-weight:800;font-stretch:72%;font-size:clamp(1.1rem,.9rem + 1vw,1.6rem);color:#21e5ed99;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px))}
.locked-row li:nth-child(even){color:#ff58a699}
.more-copy .title{font-size:clamp(1.125rem,1rem + .6vw,1.5rem)}
.more-copy p{color:var(--muted);margin-top:4px;max-width:38em}
@media (max-width:640px){.more-jameurs{flex-direction:column;align-items:flex-start}.locked-row{grid-template-columns:repeat(6,minmax(0,1fr));width:100%}}

/* ---------- Bendou, le chat malicieux ---------- */
.cat{position:relative;margin:0;pointer-events:none}
.cat img{width:100%;height:auto;filter:drop-shadow(0 0 12px #21e5ed59) drop-shadow(0 10px 18px #0009)}
.bubble{position:absolute;background:#f3f6ff;color:#0a1133;font-size:var(--fs-small);font-weight:600;font-style:italic;line-height:1.35;padding:10px 14px;border-radius:14px;box-shadow:0 10px 24px #0008}
.bubble::after{content:'';position:absolute;width:14px;height:14px;background:#f3f6ff;transform:rotate(45deg)}
.cat-home{flex:0 0 auto;display:flex;flex-direction:column-reverse;align-items:flex-end;margin-left:auto;align-self:flex-end;margin-bottom:-6px}
.cat-home img{width:130px}
.cat-home .bubble{position:relative;width:200px;margin-bottom:10px}
.cat-home .bubble::after{right:44px;bottom:-6px}
.more-copy{flex:1 1 auto;min-width:0}
.js .cat-home img{animation:cat-float 4.5s ease-in-out infinite}
@keyframes cat-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-6px) rotate(1deg)}}
.more-jameurs{position:relative}
.more-copy .link{margin-top:6px}

/* ---------- Wiki ---------- */
.wiki-hero{position:relative;isolation:isolate;overflow:hidden;padding:calc(var(--header-h) + clamp(40px,7vw,96px)) 0 clamp(48px,6vw,88px);border-bottom:3px solid var(--cyan)}
.wiki-hero-bg{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080d28 0%,#0a1030f0 45%,#0d2a6aa0 100%),linear-gradient(0deg,#080c24,transparent 50%),url('assets/arena-underground-800.webp') center/cover}
.wiki-hero-inner{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center;gap:clamp(24px,4vw,64px)}
.wiki-hero .eyebrow{color:var(--ink-2);margin-bottom:clamp(14px,2vw,22px)}
.wiki-hero .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
.wiki-hero .lead{margin-top:clamp(14px,2vw,22px)}
.wiki-toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(22px,3vw,32px)}
.wiki-toc a{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border:1px solid var(--line-2);background:#0a1133cc;font-weight:700;font-size:var(--fs-small);letter-spacing:.06em;text-transform:uppercase;transition:border-color .2s,color .2s}
.wiki-toc a span:first-child{font-style:italic;font-weight:800;font-stretch:72%;color:var(--pink)}
.wiki-toc a:hover{border-color:var(--cyan);color:var(--cyan)}
.cat-wiki{width:min(100%,340px);justify-self:center}
.cat-wiki .bubble{left:-18%;top:-12%;width:min(240px,80%)}
.cat-wiki .bubble::after{left:28px;bottom:-6px}
.js .cat-wiki img{animation:cat-float 5s ease-in-out infinite}

.ranking{display:grid;gap:10px;counter-reset:none}
.rank-row{display:grid;grid-template-columns:clamp(48px,5vw,72px) clamp(52px,5vw,64px) minmax(0,1fr) auto;align-items:center;gap:clamp(12px,1.8vw,24px);padding:10px clamp(12px,1.6vw,22px) 10px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--c) 14%,#0f1845),#0d1640 60%);border:1px solid var(--line-2);border-left:4px solid var(--c);clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%)}
.rank-pos{text-align:center;font-style:italic;font-weight:800;font-stretch:70%;font-size:clamp(1.75rem,1.3rem + 1.6vw,2.75rem);line-height:1;color:var(--ink)}
.rank-row.is-top .rank-pos{color:var(--cyan)}
.rank-avatar{display:grid;place-items:center;width:100%;aspect-ratio:3/4;overflow:hidden;background:#0a1133;border:1px solid var(--line-2)}
.rank-avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 8%}
.rank-q{font-style:italic;font-weight:800;font-stretch:72%;font-size:1.6rem;color:#21e5ed80}
.rank-who{min-width:0}
.rank-name{display:block;font-style:italic;font-weight:800;font-stretch:74%;font-size:clamp(1.25rem,1rem + 1vw,1.875rem);line-height:1.05;text-transform:uppercase}
.rank-sub{display:block;color:var(--muted);font-size:var(--fs-small);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-row.is-hidden .rank-name{color:var(--faint)}
.rank-row.is-hidden{background:repeating-linear-gradient(135deg,#0d1640 0 14px,#0f1a4a 14px 28px)}
.rank-meta{display:flex;gap:clamp(12px,2vw,28px)}
.rank-col{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:64px}
.rank-col small{font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.rank-col b{font-weight:700;font-stretch:88%}
.rank-badge{display:inline-grid;place-items:center;min-width:40px;height:30px;padding:0 8px;border:1px solid #4f74c4;font-style:italic;font-weight:800;font-stretch:78%;font-size:1rem}
.rank-badge[data-rank=S],.rank-badge[data-rank=A]{border-color:var(--cyan);color:var(--cyan)}
.rank-badge[data-rank=Nation]{border-color:#ffd36c;color:#ffd36c}
.rank-badge[data-rank="?"]{color:var(--faint)}
.ranking-note{margin-top:12px}
.unranked{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px 32px;margin-top:clamp(24px,3vw,36px);padding:clamp(18px,2.4vw,28px);border:1px solid #ff58a666;background:linear-gradient(100deg,#1a0f3a00,#0d1640),#0b1238;border-left:4px solid var(--pink)}
.chip-under-badge{display:inline-block;padding:4px 10px;border:1px solid var(--pink);color:var(--pink);font-size:var(--fs-xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.unranked-copy p{color:var(--muted);margin-top:6px}
.unranked-list{display:flex;gap:12px}
.unranked-item{display:flex;flex-direction:column;align-items:center;gap:6px;width:clamp(72px,8vw,96px)}
.unranked-item img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 8%;border:1px solid var(--c)}
.unranked-item span{font-style:italic;font-weight:800;font-stretch:76%;text-transform:uppercase}

.file-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.file-card{display:flex;flex-direction:column;background:#0d1640;border:1px solid var(--line-2);border-top:3px solid var(--c,#33508f);overflow:hidden}
.file-art{position:relative;aspect-ratio:4/5;display:grid;place-items:end center;background:radial-gradient(ellipse at 50% 60%,color-mix(in srgb,var(--c,#33508f) 22%,transparent),transparent 70%),#0a1133}
.file-art img{height:96%;width:auto;max-width:100%;object-fit:contain;object-position:bottom;-webkit-mask-image:linear-gradient(#000 85%,transparent);mask-image:linear-gradient(#000 85%,transparent)}
.file-q{align-self:center;font-style:italic;font-weight:800;font-stretch:72%;font-size:clamp(3rem,2rem + 3vw,5rem);color:#21e5ed40}
.file-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.file-name{font-style:italic;font-weight:800;font-stretch:74%;font-size:clamp(1.375rem,1.1rem + .8vw,1.75rem);line-height:1;text-transform:uppercase}
.file-tag{color:var(--c,var(--muted));font-style:italic;font-weight:600;font-size:var(--fs-small)}
.file-bio{color:var(--muted);font-size:var(--fs-small)}
.file-stats{display:grid;grid-template-columns:1fr;gap:6px;margin-top:auto;padding-top:10px;border-top:1px solid var(--line)}
.file-stats>div{display:flex;justify-content:space-between;gap:10px}
.file-stats dt{font-size:.6875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.file-stats dd{margin:0;font-weight:700;font-size:var(--fs-small);text-align:right}
.file-card.is-locked .file-art{aspect-ratio:16/9}
.file-card.is-locked{border-top-color:#33508f;background:repeating-linear-gradient(135deg,#0d1640 0 14px,#0f1a4a 14px 28px)}
.file-card.is-locked .file-name{color:var(--faint)}
.file-card.is-locked .file-tag{color:var(--pink)}

.ranks-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(20px,3vw,40px);align-items:start}
.ladder-block,.classes-block{padding:clamp(18px,2.4vw,30px);background:#0d1640;border:1px solid var(--line-2)}
.ladder-block .title,.classes-block .title{margin-bottom:16px}
.ladder{display:grid;gap:8px}
.ladder li{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:14px;padding:10px 12px;background:#0a1133;border:1px solid var(--line)}
.ladder b{display:grid;place-items:center;height:44px;border:1px solid #4f74c4;font-style:italic;font-weight:800;font-stretch:74%;font-size:1.375rem}
.ladder strong{font-weight:800;font-stretch:80%;text-transform:uppercase;margin-right:10px}
.ladder p{color:var(--muted);font-size:var(--fs-small);margin-top:2px}
.tag-elite{display:inline-block;padding:2px 8px;font-size:.6875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border:1px solid currentColor;color:var(--cyan);vertical-align:middle}
.lv-a b,.lv-s b{border-color:var(--cyan);color:var(--cyan)}
.lv-nation b,.lv-nation .tag-elite{border-color:#ffd36c;color:#ffd36c}
.lv-under b,.lv-under .tag-elite{border-color:var(--pink);color:var(--pink)}
.class-list{display:grid;gap:10px;margin-bottom:12px}
.class-list li{padding:12px 14px;background:#0a1133;border:1px solid var(--line);border-left:3px solid var(--cyan)}
.class-list strong{font-weight:800;font-stretch:80%;text-transform:uppercase}
.class-list p{color:var(--muted);font-size:var(--fs-small);margin-top:2px}

.wplace-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.wplace{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);background:#0d1640;border:1px solid var(--line-2);overflow:hidden}
.wplace img{width:100%;height:100%;object-fit:cover;min-height:180px}
.wplace>div{padding:clamp(14px,1.8vw,22px)}
.wplace small{display:block;font-size:var(--fs-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin-bottom:4px}
.wplace p{color:var(--muted);font-size:var(--fs-small);margin-top:8px}

.lexicon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.lexicon>div{position:relative;padding:clamp(16px,2vw,24px);background:#0d1640;border:1px solid var(--line-2);border-left:3px solid var(--cyan)}
.lexicon dt{font-style:italic;font-weight:800;font-stretch:74%;font-size:clamp(1.25rem,1rem + .8vw,1.625rem);text-transform:uppercase;margin-bottom:6px}
.lexicon dd{margin:0;color:var(--muted)}
.lex-cat{padding-right:clamp(110px,12vw,150px)!important;border-left-color:var(--pink)!important}
.lex-cat img{position:absolute;right:8px;bottom:6px;width:clamp(96px,10vw,130px);filter:drop-shadow(0 0 10px #21e5ed4d)}

@media (max-width:1080px){.file-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ranks-layout{grid-template-columns:1fr}.wplace-grid{grid-template-columns:1fr}}
@media (max-width:860px){.wiki-hero-inner{grid-template-columns:1fr}.cat-wiki{width:min(60%,240px);margin-top:96px}.cat-wiki .bubble{left:50%;right:auto;top:auto;bottom:calc(100% + 12px);translate:-50% 0;width:min(280px,calc(100vw - 48px));text-align:center}.cat-wiki .bubble::after{left:calc(50% - 7px);bottom:-6px}.lexicon{grid-template-columns:1fr}.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .cat-home{margin:12px 0 0 auto}
  .cat-home img{width:112px}
  .rank-row{grid-template-columns:44px 46px minmax(0,1fr);row-gap:8px;padding-right:12px}
  .rank-meta{grid-column:2/-1;justify-content:flex-start;gap:16px}
  .rank-col{flex-direction:row;gap:8px;min-width:0}
  .rank-sub{white-space:normal}
  .unranked{flex-direction:column;align-items:flex-start}
  .wplace{grid-template-columns:1fr}
  .wplace img{min-height:0;aspect-ratio:16/9}
  .file-body{padding:12px}
  .file-bio{display:none}
  .file-stats>div{flex-direction:column;gap:0}
  .file-stats dd{text-align:left}
}
@media (max-width:380px){.file-grid{grid-template-columns:1fr 1fr}.wiki-toc a{flex:1 1 calc(50% - 4px)}}

/* Classements : onglets et tableaux */
.rank-tabs{width:max-content;max-width:100%;margin-bottom:16px}
.tabs button[aria-selected=true]{background:var(--cyan);color:#06122a}
.tabs button[aria-selected=false]:hover{color:var(--ink)}
.board-lead{color:var(--muted);margin-bottom:14px;max-width:46em}
.rank-logo{background:#0a1133}
.rank-logo img{object-fit:contain!important;padding:18%}
.rank-row.is-company.is-known .rank-name{color:var(--cyan)}
.rank-boards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,20px);align-items:start}
.rank-board{padding:clamp(14px,1.6vw,20px);background:#0b1238;border:1px solid var(--line-2);border-top:3px solid var(--cyan)}
.rank-board[data-rank=Nation]{border-top-color:#ffd36c}
.rank-board-title{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-style:italic;font-weight:800;font-stretch:74%;font-size:1.375rem;text-transform:uppercase}
.ranking-compact .rank-row{grid-template-columns:40px 40px minmax(0,1fr);gap:10px;padding:6px 10px 6px 0}
.ranking-compact .rank-pos{font-size:1.5rem}
.ranking-compact .rank-name{font-size:1.125rem}
.ranking-compact .rank-sub{font-size:var(--fs-xs)}
.ranking-compact .rank-q{font-size:1.1rem}
@media (max-width:1080px){.rank-boards{grid-template-columns:1fr}}
@media (max-width:640px){.rank-tabs{width:100%}.ranking-compact .rank-row{grid-template-columns:36px 38px minmax(0,1fr)}}

.new-badge{display:inline-block;vertical-align:middle;margin-left:6px;padding:2px 7px;background:var(--pink);color:#1a0612;font-style:normal;font-size:.625rem;font-weight:800;letter-spacing:.12em;line-height:1.4}
@media (max-width:640px){.fighter-picker{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.pick span{font-size:.625rem}}
.file-grid{grid-auto-flow:row dense}
.partner-note{margin-top:14px;font-size:var(--fs-small);color:var(--muted)}
.partner-note strong{color:var(--ink-2)}
.partner-note .link{min-height:32px;margin-left:6px}
.partner-code{display:inline-block;margin-left:8px;padding:2px 8px;border:1px dashed #4f74c4;color:var(--ink-2);font-weight:700;letter-spacing:.06em}
.partner-ad{display:block;margin-top:4px;font-size:var(--fs-xs);color:var(--faint)}

/* Pages légales */
.legal{max-width:calc(820px + 2*var(--gutter));padding-top:calc(var(--header-h) + clamp(40px,6vw,80px));padding-bottom:var(--space-section)}
.legal h1{margin:12px 0 14px}
.legal .lead{color:var(--muted);margin-bottom:12px}
.legal-lang{font-size:var(--fs-small);color:var(--faint)}
.legal-lang:empty{display:none}
[data-site-lang=fr] .legal-lang{display:none}
.legal-draft{margin:24px 0;padding:14px 18px;border:1px solid #ffd36c;border-left:4px solid #ffd36c;background:#ffd36c14;color:#ffe7a8;font-size:var(--fs-small);font-weight:600}
.legal h2{font-style:italic;font-weight:800;font-stretch:74%;font-size:clamp(1.375rem,1.1rem + .9vw,1.875rem);text-transform:uppercase;margin:36px 0 10px;line-height:1.05}
.legal p,.legal li{color:var(--ink-2);max-width:68ch}
.legal p+p{margin-top:10px}
.legal ul{list-style:disc;padding-left:22px;display:grid;gap:6px}
.legal table{width:100%;border-collapse:collapse;margin:12px 0;font-size:var(--fs-small)}
.legal th,.legal td{border:1px solid var(--line-2);padding:10px;text-align:left;vertical-align:top;color:var(--ink-2)}
.legal th{background:#0d1640;color:var(--ink);font-weight:700}
.legal-date{margin-top:32px!important;font-size:var(--fs-small);color:var(--faint)!important}
mark.todo{background:#ffd36c33;color:#ffe7a8;padding:0 4px;border-radius:2px}
@media (max-width:640px){.legal table,.legal thead,.legal tbody,.legal tr,.legal th,.legal td{display:block}.legal thead{display:none}.legal tr{border:1px solid var(--line-2);margin-bottom:10px}.legal td{border:0;border-bottom:1px solid var(--line)}}
@media (max-width:640px){.legal td::before{display:block;font-size:.6875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:2px}.legal td:nth-child(1)::before{content:'Données'}.legal td:nth-child(2)::before{content:'Pourquoi'}.legal td:nth-child(3)::before{content:'Base légale'}.legal td:nth-child(4)::before{content:'Durée'}}