/* ════════════════════════════════════════════════════════════════════
   Jumble Chess – accueil v2 et éléments interactifs
   ════════════════════════════════════════════════════════════════════ */
:root{
  --jx-l:#f0d9b5; --jx-d:#b58863;
  --jx-card:#ffffff; --jx-ink:#1a0e06;
  --jx-gold1:#e9c46a; --jx-gold2:#b07a1c;
  --jx-rainbow:linear-gradient(115deg,#ff5e9c,#ffaa44,#ffe83b,#6dd5ed,#b06ab3,#ff5e9c);
  /* variante lisible sur fond clair : part de jaune réduite, part de rouge ajoutée */
  --jx-rainbow-txt:linear-gradient(115deg,#d81f6a 0%,#d4241f 18%,#c07a0d 36%,#0f8fa6 56%,#7a3fc4 78%,#d81f6a 100%);
  --jx-ease:cubic-bezier(.22,.8,.26,1);
  --jx-stage:#e2d5ba;
}
[data-theme="dark"]{ --jx-l:#ebeced; --jx-d:#6b7a90; --jx-card:#201a10; --jx-ink:#f0e8d8; --jx-stage:#1b1509; }

.jx-home .section-title em{font-style:normal !important;color:inherit !important}
.jx-home .section{max-width:1160px}
.jx-lead{color:var(--muted);max-width:60ch;line-height:1.7;margin:-.4rem 0 2rem;font-size:.98rem}

/* ── Hero ─────────────────────────────────────────────────────────── */
.jx-hero{min-height:calc(100vh - 60px);display:flex;align-items:center;justify-content:center;padding:3rem 2rem 4rem}
.jx-hero .chess-deco{transition:opacity 1.6s ease,filter 1.6s ease;will-change:transform}
.jx-hero-grid{position:relative;z-index:1;width:100%;max-width:1180px;display:grid;grid-template-columns:1.05fr .95fr;gap:2.5rem;align-items:center}
.jx-hero-text{text-align:left}
.jx-hero .hero-title{margin-bottom:1.4rem}
.jx-hero .hero-title span{display:inline-block;transition:transform 1.1s var(--jx-ease),opacity 1.1s ease}
.jx-hero .hero-title .chess{display:block;transition-delay:.12s}
.jx-hero .hero-sub{margin:0 0 2rem;max-width:36ch;font-size:clamp(1rem,1.6vw,1.2rem)}
.jx-hero .hero-actions{justify-content:flex-start}
.jx-hero-text > *:not(.hero-title){transition:opacity .9s ease .45s,transform .9s var(--jx-ease) .45s}
html[lang="ar"] .jx-hero-text{text-align:right}
html[lang="ar"] .jx-hero .hero-actions{justify-content:flex-start}

.jx-hero-ks{margin-top:1.8rem;max-width:380px}
.jx-hero-ks-top{font-size:.88rem;color:var(--muted);margin-bottom:.5rem}
.jx-cells-sm .jx-cell{padding:.4rem .15rem;border-radius:6px}
.jx-cells-sm .jx-cell b{font-size:1.5rem}
.jx-hero-ks .jx-ks-link{display:inline-block;margin-top:.7rem}
.jx-ks-link{color:var(--gold);font-weight:600;font-size:.9rem;text-decoration:underline;text-underline-offset:3px}
.jx-hero-ks.live .jx-count-cells{font-weight:700;color:var(--gold)}
html[lang="ar"] .jx-hero-ks{margin-left:auto}
/* éventail de cartes */
.jx-fan{position:relative;height:clamp(360px,44vw,520px)}
.jx-fan-card{position:absolute;top:50%;left:50%;width:clamp(150px,19vw,230px);transform-origin:50% 120%;
  transform:translate(-50%,-50%) translateX(var(--x)) rotate(var(--r));transition:transform 1.1s var(--jx-ease),opacity .8s ease}
.jx-fan-card:nth-child(1){--x:-68%;--r:-13deg;z-index:1;transition-delay:.35s}
.jx-fan-card:nth-child(2){--x:0%;--r:-1deg;z-index:2;transition-delay:.5s;top:46%}
.jx-fan-card:nth-child(3){--x:68%;--r:12deg;z-index:3;transition-delay:.65s}
.jx-fan-card:hover{z-index:5;--lift:-16px}
.jx-fan .jx-fan-card > .jc-card{transform:translateY(var(--lift,0)) perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));box-shadow:0 30px 60px -22px rgba(60,30,8,.5)}
html:not(.jx-ready) .jx-home .chess-deco{opacity:0;filter:blur(8px)}
html:not(.jx-ready) .jx-hero .hero-title span{opacity:0;transform:translateY(45%)}
html:not(.jx-ready) .jx-hero-text > *:not(.hero-title){opacity:0;transform:translateY(14px)}
html:not(.jx-ready) .jx-fan-card{opacity:0;transform:translate(-50%,-10%) rotate(0deg)}

/* ── Carte (rendu « physique ») ───────────────────────────────────── */
.jx-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:.5rem;background:var(--jx-card);border-radius:14px;
  padding:1.1rem 1rem 1rem;aspect-ratio:63/88;overflow:hidden;border:1px solid rgba(110,63,20,.14);color:var(--jx-ink);text-align:center}
.jx-card img{width:70%;aspect-ratio:1;object-fit:contain;margin:.2rem 0;pointer-events:none;-webkit-user-drag:none}
[data-theme="dark"] .jx-card img{background:#fff;border-radius:10px;padding:6%}
.jx-card-name{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:clamp(.95rem,1.4vw,1.15rem);line-height:1.1;min-height:2.2em;display:flex;align-items:center}
.jx-card-desc{font-size:.72rem;line-height:1.45;color:var(--muted);text-align:left;overflow:hidden}
.jx-corner{position:absolute;width:26px;height:26px;border-color:currentColor;border-style:solid;opacity:.85}
.jx-corner.tl{top:9px;left:9px;border-width:2px 0 0 2px}
.jx-corner.br{bottom:9px;right:9px;border-width:0 2px 2px 0}
.jx-card.classic{color:var(--jx-ink)}
.jx-card.classic .jx-card-name{color:var(--jx-ink)}
.jx-card.dore{color:var(--jx-gold2)}
.jx-card.dore .jx-card-name{background:linear-gradient(90deg,var(--jx-gold2),#e0a82e,var(--jx-gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.jx-card.rayonnant .jx-corner{border-image:var(--jx-rainbow) 1}
.jx-card.rayonnant .jx-card-name{background:var(--jx-rainbow);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:jxSlide 6s linear infinite}
@keyframes jxSlide{to{background-position:200% 0}}
.jx-shine{position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .35s;
  background:radial-gradient(circle at var(--mx,50%) var(--my,30%),rgba(255,255,255,.55),transparent 42%)}
.jx-hover .jx-shine,.jx-fan-card:hover .jx-shine{opacity:1}
.jx-card.dore .jx-shine{background:radial-gradient(circle at var(--mx,50%) var(--my,30%),rgba(255,236,170,.75),transparent 40%),
  linear-gradient(115deg,transparent 30%,rgba(233,196,106,.35) 45%,transparent 60%);mix-blend-mode:screen}
.jx-card.rayonnant .jx-shine{background:radial-gradient(circle at var(--mx,50%) var(--my,30%),rgba(255,255,255,.6),transparent 38%),
  linear-gradient(calc(var(--ry,0deg) * 6 + 115deg),rgba(255,94,156,.28),rgba(255,232,59,.22),rgba(109,213,237,.28),rgba(176,106,179,.28));mix-blend-mode:soft-light}
.jx-card.rayonnant{box-shadow:0 0 0 1px rgba(176,106,179,.25)}

/* ── Comment jouer ───────────────────────────────────────────────── */
.jx-how-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;margin-top:1.5rem}
.jx-steps{list-style:none;position:relative;padding:0;margin:0}
.jx-steps::before{content:'';position:absolute;left:1.55rem;top:1.2rem;bottom:1.2rem;width:1px;background:repeating-linear-gradient(to bottom,var(--gold) 0 5px,transparent 5px 11px);opacity:.45}
.jx-step{position:relative;display:flex;gap:1.3rem;align-items:flex-start;padding:1rem 0}
.jx-step:nth-child(2){margin-left:2.2rem}
.jx-step:nth-child(3){margin-left:4.4rem}
.jx-step-n{flex:none;width:3.1rem;height:3.1rem;border-radius:50%;display:grid;place-items:center;background:var(--bg);border:1px solid var(--border);
  font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:700;color:var(--gold);position:relative;z-index:1}
.jx-step h3{font-family:'Cormorant Garamond',serif;font-size:1.35rem;margin:.35rem 0 .35rem;line-height:1.2}
.jx-step p{color:var(--muted);line-height:1.7;font-size:.93rem;max-width:46ch}
html[lang="ar"] .jx-step:nth-child(2){margin-left:0;margin-right:2.2rem}
html[lang="ar"] .jx-step:nth-child(3){margin-left:0;margin-right:4.4rem}
html[lang="ar"] .jx-steps::before{left:auto;right:1.55rem}
.jx-photo{position:relative;margin:0;transform:rotate(2.2deg);transition:transform .6s var(--jx-ease)}
.jx-photo:hover{transform:rotate(0) scale(1.01)}
.jx-photo img{width:100%;display:block;border-radius:6px;aspect-ratio:4/3;object-fit:cover;border:8px solid #fffcf7;box-shadow:0 24px 50px -18px rgba(60,30,8,.4)}
[data-theme="dark"] .jx-photo img{border-color:#2a2116}
.jx-photo figcaption{position:absolute;left:-1.2rem;bottom:1.4rem;transform:rotate(-4deg);background:var(--gold);color:#fffcf7;font-family:'Cormorant Garamond',serif;font-weight:700;
  font-size:1.05rem;padding:.35rem .9rem;border-radius:3px;box-shadow:0 8px 20px -8px rgba(60,30,8,.5)}
[data-theme="dark"] .jx-photo figcaption{color:#100d08}

/* ── Échiquier ───────────────────────────────────────────────────── */
.jx-board{position:relative;aspect-ratio:1;container-type:inline-size;direction:ltr;border-radius:4px;overflow:hidden;
  box-shadow:0 0 0 6px #6b4424,0 0 0 7px rgba(0,0,0,.25),0 18px 40px -14px rgba(0,0,0,.5);user-select:none}
.jx-board-sm{box-shadow:0 0 0 3px #6b4424;border-radius:3px}
.jx-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr)}
.jx-sq{position:relative}
.jx-sq.l{background:var(--jx-l)}.jx-sq.d{background:var(--jx-d)}
.jx-sq::after{content:'';position:absolute;inset:0;pointer-events:none;transition:background .25s,box-shadow .25s}
.jx-sq.hl-last::after{background:rgba(243,224,138,.55)}
.jx-sq.hl-zone::after{background:rgba(176,122,28,.22)}
.jx-sq.hl-sel::after{background:rgba(212,175,55,.6)}
.jx-sq.hl-move::after{background:radial-gradient(circle,rgba(40,90,20,.42) 0 17%,transparent 19%)}
.jx-sq.hl-cap::after{background:radial-gradient(circle,transparent 58%,rgba(200,50,40,.55) 60%)}
.jx-sq.hl-swap::after{box-shadow:inset 0 0 0 3px #d4a017;background:rgba(212,160,23,.18);animation:jxPulse 1.2s ease-in-out infinite}
.jx-sq.hl-check::after{background:radial-gradient(circle,rgba(220,40,30,.85) 0,rgba(220,40,30,.35) 45%,transparent 72%)}
.jx-sq.hl-bad::after{background:rgba(200,50,40,.3)}
.jx-sq.jx-x::before{content:'\2715';position:absolute;inset:0;display:grid;place-items:center;color:#c0281e;font-size:9cqw;font-weight:900;z-index:5;animation:jxPop .35s var(--jx-ease)}
.jx-co{position:absolute;font-size:2.1cqw;font-weight:700;opacity:.75;pointer-events:none;line-height:1}
.jx-sq.l .jx-co{color:var(--jx-d)}.jx-sq.d .jx-co{color:var(--jx-l)}
.jx-co-r{top:3%;left:4%}.jx-co-f{bottom:3%;right:5%}
.jx-layer{position:absolute;inset:0;pointer-events:none}
.jx-pc{position:absolute;top:0;left:0;width:12.5%;height:12.5%;display:grid;place-items:center;z-index:2;
  transition:transform .42s var(--jx-ease),opacity .3s ease;font-family:'Apple Symbols','Segoe UI Symbol','DejaVu Sans',serif;font-variant-emoji:text}
.jx-pc span{font-size:9.6cqw;line-height:1;transition:transform .3s,opacity .3s,filter .3s;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}
.jx-pc.w span{color:#fff;text-shadow:0 0 1px rgba(0,0,0,.9),0 1px 2px rgba(0,0,0,.4)}
.jx-pc.b span{color:#1a1a1a}
.jx-pc.jx-still{transition:none}
.jx-pc.jx-moving{z-index:4}
.jx-pc.jx-moving span{transform:scale(1.12)}
.jx-pc.jx-under{z-index:3}
.jx-pc.jx-under span{transform:scale(.88)}
.jx-pc.jx-captured{opacity:0}
.jx-pc.jx-captured span{transform:scale(.4) rotate(25deg)}
.jx-pc.jx-ghost span{opacity:.4;filter:blur(1px) drop-shadow(0 0 6px rgba(160,190,255,.9))}
.jx-pc.jx-vanish span{opacity:0;transform:scale(.2) rotate(-90deg);filter:drop-shadow(0 0 10px #e9c46a)}
.jx-pc.jx-appear span{animation:jxAppear .38s var(--jx-ease)}
.jx-pc.jx-pop span{animation:jxPromo .45s var(--jx-ease)}
@keyframes jxAppear{from{opacity:0;transform:scale(1.8);filter:drop-shadow(0 0 14px #e9c46a)}}
@keyframes jxPromo{50%{transform:scale(1.5);filter:drop-shadow(0 0 12px #ffe083)}}
@keyframes jxPulse{50%{box-shadow:inset 0 0 0 5px #e9b21f}}
@keyframes jxPop{from{transform:scale(2);opacity:0}}
.jx-arrows{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:5}
.jx-arrow{fill:none;stroke-width:.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:6;stroke-dashoffset:6;animation:jxDraw .7s ease forwards}
.jx-arrow.chk{stroke:rgba(214,40,30,.85)}
.jx-arrow.swp{stroke:rgba(212,160,23,.95)}
.jx-arrow.line{stroke:rgba(40,110,220,.85)}
.jx-arrow.jump{stroke:rgba(170,70,230,.9);stroke-dasharray:.18 .16;animation:none}
.jx-sq.hl-line::after{background:rgba(40,110,220,.38)}
.jx-sq.hl-jump::after{background:rgba(170,70,230,.38)}
@keyframes jxDraw{to{stroke-dashoffset:0}}
.jx-badge{position:absolute;top:4%;right:4%;z-index:6;background:#3b1f4a;color:#fff;border-radius:4px;padding:.15rem .55rem;font-size:.72rem;opacity:0;transform:scale(.8);transition:all .3s var(--jx-ease)}
.jx-badge.on{opacity:1;transform:none}
.jx-badge b{font-size:.9rem}
.jx-badge.bump{transform:scale(1.25)}
.jx-badge.win{background:linear-gradient(90deg,#ff5e9c,#b06ab3);box-shadow:0 0 16px rgba(255,94,156,.7)}

/* ── Modificateurs : cartes retournables ─────────────────────────── */
.jx-tiers{display:flex;flex-direction:column;gap:2.8rem;margin-top:1.5rem}
.jx-tier{display:grid;grid-template-columns:minmax(170px,230px) 1fr;gap:2.2rem;align-items:start}
.jx-tier-head{margin-bottom:.5rem}
.jx-tier-head h3{font-family:'Cormorant Garamond',serif;font-size:1.9rem;line-height:1}
.jx-tier.classic h3{color:var(--white)}.jx-tier.dore h3{color:#b8901f}
.jx-tier.rayonnant h3{background:var(--jx-rainbow-txt);-webkit-background-clip:text;background-clip:text;color:transparent}
.jx-tier-info p{color:var(--muted);font-size:.9rem;line-height:1.6}
.jx-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem}
.jx-flip{position:relative;perspective:1400px;cursor:pointer;border-radius:4%;outline:none}
.jx-flip:focus-visible{box-shadow:0 0 0 3px var(--gold)}
.jx-flip-inner{position:relative;transition:transform .8s var(--jx-ease);transform-style:preserve-3d}
.jx-flip.flipped .jx-flip-inner{transform:rotateY(180deg)}
.jx-face{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jx-front{position:relative}
.jx-hint{position:absolute;left:7%;bottom:4.5%;z-index:5;font-size:.74rem;font-weight:700;color:#8a5c20;display:inline-flex;align-items:center;gap:.35rem;
  font-family:'Manrope',Arial,sans-serif;pointer-events:none}
.jx-back-face{position:absolute;inset:0;transform:rotateY(180deg);container-type:inline-size;border-radius:5.3% / 3.79%;overflow:hidden}
.jx-back-face.t-classic{background:linear-gradient(160deg,#34343d 0%,#141419 45%,#2c2c34 100%)}
.jx-back-face.t-dore{background:#d4ae44}
.jx-back-face.t-rayonnant{background:linear-gradient(140deg,#a445ff 0%,#6a7dff 18%,#27c3d6 36%,#43c98d 48%,#f2a33a 62%,#ff6f8e 78%,#d24dff 100%)}
.jx-back-in{position:absolute;inset:1.55cqw;background:#fff;border-radius:3.9cqw;padding:8cqw 7cqw 6cqw;display:flex;flex-direction:column;gap:6cqw}
.jx-mini{width:100%}
.jx-cap{font-family:'Manrope',Arial,sans-serif;font-size:4.4cqw;line-height:1.45;color:#50505c;text-align:center;margin:0}
.jx-cap b{display:block;font-weight:800;font-size:5.6cqw;color:#16161c;margin-bottom:1.5cqw}
.jx-more{text-align:center;margin-top:2rem}

/* ── Démo ────────────────────────────────────────────────────────── */
.jx-stage{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:
  radial-gradient(ellipse at 30% 40%,rgba(233,196,106,.22),transparent 60%),
  radial-gradient(ellipse at 80% 90%,rgba(176,106,179,.10),transparent 55%),var(--jx-stage);
  box-shadow:0 24px 60px -34px rgba(40,20,5,.45);border:1px solid var(--border);direction:ltr;color:var(--white)}
.jx-stage-board{position:absolute;left:4%;top:6%;height:80%;width:auto;aspect-ratio:1}
.jx-hand{position:absolute;left:51%;right:1%;top:4%;height:64%}
.jx-hand-card{position:absolute;top:4%;width:33%;transition:transform .9s var(--jx-ease),left .9s var(--jx-ease),opacity .6s,filter .6s}
.jx-hand-card:nth-child(1){left:2%;transform:rotate(-9deg) scale(.86)}
.jx-hand-card:nth-child(2){left:33.5%;transform:rotate(0) scale(.86)}
.jx-hand-card:nth-child(3){left:65%;transform:rotate(9deg) scale(.86)}
.jx-hand.gather .jx-hand-card:nth-child(1){left:6%;transform:rotate(-5deg) scale(1.04)}
.jx-hand.gather .jx-hand-card:nth-child(2){left:33.5%;transform:translateY(-3%) scale(1.04)}
.jx-hand.gather .jx-hand-card:nth-child(3){left:61%;transform:rotate(5deg) scale(1.04)}
.jx-hand-card.focus{z-index:3;filter:drop-shadow(0 0 16px rgba(233,196,106,.65))}
.jx-hand.gather .jx-hand-card.focus{transform:translateY(-4%) scale(1.14) !important}
.jx-hand-card.dim{opacity:.4;filter:grayscale(.3)}
.jx-caption{position:absolute;left:52%;right:2%;top:72%;min-height:3.2em;font-size:clamp(.72rem,1.2vw,1rem);line-height:1.4;
  opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s var(--jx-ease);text-align:left}
.jx-caption.in{opacity:1;transform:none}
.jx-caption b{color:var(--gold);font-family:'Cormorant Garamond',serif;font-size:1.15em}
.jx-mate{position:absolute;left:4%;top:6%;height:80%;aspect-ratio:1;display:grid;place-items:center;pointer-events:none;z-index:4;
  font-family:'Cormorant Garamond',serif;font-weight:900;font-size:clamp(1.6rem,4.4vw,3.6rem);color:#fffdf8;text-shadow:0 3px 18px rgba(40,20,5,.85);
  opacity:0;transform:scale(1.6) rotate(-6deg);transition:all .6s var(--jx-ease)}
.jx-stage.done .jx-mate{opacity:1;transform:rotate(-6deg)}
.jx-stage-ui{position:absolute;left:0;right:0;bottom:0;height:13%;display:flex;align-items:center;gap:.55rem;padding:0 3%;z-index:6}
.jx-play{width:34px;height:34px;border-radius:6px;cursor:pointer;position:relative;flex:none}
.jx-play::before{content:'';position:absolute;inset:0;margin:auto;width:10px;height:12px;clip-path:polygon(0 0,100% 50%,0 100%)}
.jx-stage.playing:not(.paused) .jx-play::before{clip-path:polygon(0 0,35% 0,35% 100%,0 100%,0 0,65% 0,100% 0,100% 100%,65% 100%,65% 0)}
.jx-progress{flex:1;height:3px;background:rgba(26,14,6,.15);border-radius:3px;overflow:hidden}
.jx-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#e9c46a,#ff5e9c);transition:width .6s ease}
.jx-start{position:absolute;inset:0;display:grid;place-items:center;background:rgba(246,240,228,.45);backdrop-filter:blur(2px);z-index:7;transition:opacity .4s}
.jx-stage.playing .jx-start{opacity:0;pointer-events:none}

/* ── Pioche ──────────────────────────────────────────────────────── */
.jx-draw-sec{position:relative}
.jx-decks{display:flex;justify-content:center;gap:clamp(1.2rem,5vw,4rem);flex-wrap:wrap;margin-top:1rem}
.jx-deck{position:relative;width:128px;height:179px;border:0;background:none;cursor:pointer;padding:0;transition:transform .4s var(--jx-ease)}
.jx-deck .jx-back{position:absolute;inset:0;transition:transform .4s var(--jx-ease)}
.jx-deck .jx-back:nth-child(1){transform:translate(-8px,6px) rotate(-5deg)}
.jx-deck .jx-back:nth-child(2){transform:translate(-3px,3px) rotate(-2deg)}
.jx-deck:hover{transform:translateY(-8px)}
.jx-deck:hover .jx-back:nth-child(1){transform:translate(-14px,6px) rotate(-9deg)}
.jx-deck:hover .jx-back:nth-child(3){transform:translate(8px,-4px) rotate(4deg)}
.jx-deck.active{transform:translateY(-6px)}
.jx-deck.active .jx-back:nth-child(3) img{filter:drop-shadow(0 0 10px rgba(233,196,106,.9))}
.jx-deck-name{position:absolute;left:-30px;right:-30px;white-space:nowrap;bottom:-2.4rem;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:1.2rem;color:var(--white)}
.jx-deck.dore .jx-deck-name{color:var(--dore)}
.jx-deck.rayonnant .jx-deck-name{background:var(--jx-rainbow-txt);-webkit-background-clip:text;background-clip:text;color:transparent}
.jx-back{display:block}
.jx-back img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 6px 10px rgba(0,0,0,.3))}
.jx-draw-hint{text-align:center;color:var(--muted);margin:3.4rem 0 1.4rem;font-size:.92rem;min-height:1.5em}
.jx-link{background:none;border:0;padding:0;color:var(--gold);font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.jx-tray{display:grid;grid-template-columns:repeat(3,minmax(0,230px));justify-content:center;gap:clamp(.8rem,2.5vw,2rem);min-height:40px}
.jx-drawn{border:0;background:none;padding:0;cursor:pointer;perspective:1000px;opacity:0;transform:translateY(-120px) scale(.6) rotate(calc((var(--k) - 1) * 12deg));
  transition:transform .7s var(--jx-ease),opacity .5s ease}
.jx-drawn.dealt{opacity:1;transform:none}
.jx-drawn-in{position:relative;display:block;transform-style:preserve-3d;transition:transform .75s var(--jx-ease);transform:rotateY(180deg)}
.jx-drawn.shown .jx-drawn-in{transform:none}
.jx-drawn-front{display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jx-drawn-back{position:absolute;inset:0;transform:rotateY(180deg);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.jx-drawn-back img{width:100%;height:100%;object-fit:fill;display:block}
.jx-drawn.kept{transform:translateY(-12px) scale(1.04)}
.jx-drawn.kept .jc-card{box-shadow:0 0 0 3px #e9c46a,0 0 36px rgba(233,196,106,.6)}
.jx-drawn.returned{opacity:0;transform:translateY(-150px) scale(.5) rotate(calc((var(--k) - 1) * -10deg));transition-duration:.85s}

/* ── Puzzles ─────────────────────────────────────────────────────── */
.jx-tabs{display:inline-flex;gap:.3rem;padding:.3rem;border-radius:12px;background:var(--bg2);border:1px solid var(--border);margin-bottom:1.6rem;flex-wrap:wrap}
.jx-tab{border:0;background:none;border-radius:9px;padding:.5rem 1.1rem;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;color:var(--muted);font-family:inherit;transition:background .25s,color .25s}
.jx-tab span{font-weight:700;font-size:.92rem}
.jx-tab small{font-size:.7rem;opacity:.8}
.jx-tab.on{background:var(--bg3);color:var(--white);box-shadow:0 2px 8px -3px rgba(60,30,8,.3)}
.jx-puz-body{display:grid;grid-template-columns:minmax(0,470px) minmax(0,300px);gap:2.6rem;align-items:start}
.jx-puz-board .jx-sq{cursor:pointer}
.jx-puz-side{display:flex;flex-direction:column;gap:.9rem}
.jx-puz-card{width:min(210px,70%)}
.jx-puz-mod-label{font-size:.9rem;font-weight:600;color:var(--gold)}
.jx-card-wide{aspect-ratio:auto;flex-direction:row;flex-wrap:wrap;text-align:left;align-items:center;gap:.4rem .9rem}
.jx-card-wide img{width:72px;margin:0;order:-1}
.jx-card-wide .jx-card-name{flex:1;min-height:0;font-size:1.25rem}
.jx-card-wide .jx-card-desc{flex-basis:100%;font-size:.82rem}
.jx-puz-status{min-height:3em;font-size:.95rem;line-height:1.5;padding:.7rem .9rem;border-radius:8px;background:var(--bg2);border-left:3px solid var(--border);transition:background .3s,border-color .3s}
.jx-puz-status.bad{border-color:#c0281e;background:rgba(192,40,30,.08);animation:jxShake .4s}
.jx-puz-status.good{border-color:#3d8a2a;background:rgba(61,138,42,.1);font-weight:600}
@keyframes jxShake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.jx-puz-btns{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.jx-puz-btns .btn-secondary{padding:.6rem 1.2rem;font-size:.85rem}
.jx-puz.solved .jx-puz-board .jx-board{animation:jxWin 1.2s ease}
@keyframes jxWin{30%{box-shadow:0 0 0 6px #6b4424,0 0 0 10px rgba(233,196,106,.9),0 0 50px rgba(233,196,106,.7)}}

/* ── Deux façons de jouer ────────────────────────────────────────── */
.jx-ways{max-width:1160px;margin:0 auto;padding:4rem 2rem 5rem}
.jx-ways-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2.5rem;align-items:start;margin-top:1rem}
.jx-way h3{font-family:'Cormorant Garamond',serif;font-size:1.9rem;margin:1.2rem 0 .4rem}
.jx-way p{color:var(--muted);line-height:1.7;margin-bottom:1.2rem;font-size:.93rem}
.jx-screen{perspective:1400px}
.jx-screen img{width:100%;display:block;border-radius:10px;transform:rotateY(-9deg) rotateX(3deg);transition:transform .8s var(--jx-ease);box-shadow:24px 30px 60px -28px rgba(20,10,0,.6)}
.jx-screen:hover img{transform:none}
.jx-way-phys{margin-top:3.5rem}
.jx-photos{position:relative;height:230px}
.jx-photos img{position:absolute;width:62%;aspect-ratio:4/3;object-fit:cover;border:6px solid #fffcf7;border-radius:4px;box-shadow:0 16px 34px -14px rgba(60,30,8,.5);transition:transform .6s var(--jx-ease)}
[data-theme="dark"] .jx-photos img{border-color:#2a2116}
.jx-photos img:nth-child(1){left:0;top:10px;transform:rotate(-5deg)}
.jx-photos img:nth-child(2){right:0;top:40px;transform:rotate(4deg)}
.jx-photos:hover img:nth-child(1){transform:rotate(-8deg) translateX(-8px)}
.jx-photos:hover img:nth-child(2){transform:rotate(7deg) translateX(8px)}
.jx-count-big{margin:.4rem 0 1.3rem}
.jx-count-big > div:first-child{font-size:.92rem;font-weight:600;color:var(--gold);margin-bottom:.5rem}
.jx-count-cells{display:flex;gap:.5rem}
.jx-cell{flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:.5rem .2rem;text-align:center}
.jx-cell b{display:block;font-family:'Cormorant Garamond',serif;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}
.jx-cell b.flip{animation:jxFlip .45s var(--jx-ease)}
@keyframes jxFlip{from{transform:rotateX(90deg);opacity:.2}}
.jx-cell small{font-size:.68rem;color:var(--muted)}
.jx-ks-date{font-size:.8rem;color:var(--muted);margin-top:.45rem}
.jx-count-big.live .jx-count-cells{font-weight:700;color:var(--gold)}

/* ── Compteur de tours (Règles) ──────────────────────────────────── */
.jx-turns{display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:center;margin:1.4rem 0 .6rem;padding:1.3rem;border:1px solid var(--border);border-radius:12px;background:var(--bg3)}
.jx-turns-board{display:flex;gap:6px;width:min(260px,58vw)}
.jx-turns-edge{position:relative;display:grid;grid-template-rows:repeat(8,1fr);width:30px;direction:ltr}
.jx-edge-n{display:grid;place-items:center;font-size:.8rem;font-weight:700;color:var(--muted);border-radius:4px;transition:background .3s,color .3s}
.jx-edge-n.key{color:var(--gold)}
.jx-edge-n.on{background:rgba(233,196,106,.35);color:var(--white)}
.jx-marker{position:absolute;left:50%;width:30px;height:12.5%;display:grid;place-items:center;transform:translate(-50%,0);transition:top .6s var(--jx-ease);
  font-size:1.35rem;color:#1a1a1a;font-family:'Apple Symbols','Segoe UI Symbol','DejaVu Sans',serif;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35));pointer-events:none;top:87.5%}
.jx-marker.down{color:#6e3f14}
[data-theme="dark"] .jx-marker{color:#f0e8d8}
.jx-turns-grid{flex:1;aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);border-radius:3px;overflow:hidden;opacity:.55;box-shadow:0 0 0 3px #6b4424}
.jx-turns-grid i.l{background:var(--jx-l)}.jx-turns-grid i.d{background:var(--jx-d)}
.jx-turns-info{display:flex;flex-direction:column;gap:.9rem;min-width:0}
.jx-turn-count{display:flex;align-items:baseline;gap:.6rem}
.jx-turn-count small{font-size:1rem;font-weight:600;color:var(--gold)}
.jx-turn-count b{font-family:'Cormorant Garamond',serif;font-size:3.2rem;line-height:1;font-variant-numeric:tabular-nums;display:inline-block}
.jx-turn-count b.bump{animation:jxFlip .4s var(--jx-ease)}
.jx-turn-draw{display:flex;align-items:center;gap:.8rem;min-height:52px;opacity:0;transform:translateY(6px);transition:all .35s var(--jx-ease)}
.jx-turn-draw.on{opacity:1;transform:none}
.jx-turn-tag{font-weight:700;font-size:.8rem;padding:.25rem .6rem;border-radius:4px;background:var(--gold);color:#fffcf7}
[data-theme="dark"] .jx-turn-tag{color:#100d08}
.jx-turn-cards{display:flex}
.jx-turn-card{width:34px;height:41px;margin-right:-10px;transform-origin:50% 100%;animation:jxDeal .5s var(--jx-ease) both}
.jx-turn-card:nth-child(1){--r:-12deg}.jx-turn-card:nth-child(2){--r:0deg;animation-delay:.08s}.jx-turn-card:nth-child(3){--r:12deg;animation-delay:.16s}
.jx-turn-card{transform:rotate(var(--r))}
@keyframes jxDeal{from{transform:translateY(-20px) rotate(0);opacity:0}}
.jx-turn-tier{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:1.2rem;margin-left:.6rem}
.jx-turn-draw.dore .jx-turn-tier{color:var(--dore)}
.jx-turn-draw.rayonnant .jx-turn-tier{background:var(--jx-rainbow-txt);-webkit-background-clip:text;background-clip:text;color:transparent}
.jx-timeline{display:flex;gap:4px;align-items:center}
.jx-timeline i{flex:1;height:5px;border-radius:3px;background:var(--border);transition:background .3s}
.jx-timeline i.d{height:11px}
.jx-timeline i.past{background:rgba(110,63,20,.45)}
.jx-timeline i.now{background:var(--gold)}
.jx-timeline i.d.now.classic{background:#1a0e06}.jx-timeline i.d.now.dore{background:#d4a017}.jx-timeline i.d.now.rayonnant{background:var(--jx-rainbow)}
.jx-turns-cap{font-size:.84rem !important;line-height:1.6 !important}

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width:900px){
  .jx-hero-grid,.jx-how-grid,.jx-ways-grid,.jx-puz-body{grid-template-columns:1fr}
  .jx-hero-text{text-align:center}
  .jx-hero .hero-sub{margin:0 auto 1.8rem}
  .jx-hero .hero-actions{justify-content:center}
  .jx-fan{height:clamp(300px,80vw,420px)}
  .jx-fan-card{width:clamp(130px,34vw,200px)}
  .jx-way-phys{margin-top:0}
  .jx-puz-body{justify-items:center}
  .jx-puz-board{width:100%;max-width:470px}
  .jx-step:nth-child(2){margin-left:1rem}.jx-step:nth-child(3){margin-left:2rem}
  .jx-photo{max-width:520px;margin:0 auto}
}
@media (max-width:640px){
  .jx-stage{aspect-ratio:3/5}
  .jx-stage-board{left:6%;top:2%;height:auto;width:88%}
  .jx-mate{left:6%;top:2%;width:88%;height:auto}
  .jx-hand{left:4%;right:4%;top:58%;height:20%}
  .jx-hand-card{width:29%;top:0}
  .jx-caption{left:4%;right:4%;top:80%;bottom:auto;min-height:0;text-align:center;z-index:8}
  .jx-stage-ui{height:9%}
  .jx-tier{grid-template-columns:1fr;gap:1rem}
  .jx-cards{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:66%;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-inline:-2rem;padding:0 2rem .6rem;scroll-padding-inline:2rem;scrollbar-width:none}
  .jx-cards::-webkit-scrollbar{display:none}
  .jx-flip{scroll-snap-align:start}
  .jx-tray{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
  .jx-deck{width:90px;height:126px}
  .jx-turns{grid-template-columns:1fr;justify-items:center;text-align:center}
  .jx-turn-count,.jx-turn-draw{justify-content:center}
  .jx-hero-ks{margin-left:auto;margin-right:auto}
  .jx-fan{height:clamp(260px,72vw,340px)}
  .jx-fan-card{width:29vw}
  .jx-fan-card:nth-child(1){--x:-62%}
  .jx-fan-card:nth-child(3){--x:62%}
  .jx-photo figcaption{left:.5rem}
}
@media (prefers-reduced-motion:reduce){
  .jx-home *,.jx-turns *{transition-duration:.01ms !important;animation-duration:.01ms !important}
  html:not(.jx-ready) .jx-home .chess-deco,html:not(.jx-ready) .jx-hero .hero-title span,
  html:not(.jx-ready) .jx-hero-text > *,html:not(.jx-ready) .jx-fan-card{opacity:1;filter:none}
}

html[lang="ar"] .jx-caption{direction:rtl;text-align:right}
html[lang="ar"] .jx-card{direction:rtl}
html[lang="ar"] .jx-card-desc{text-align:right}

/* ════════════════ Cartes (rendu fidèle aux cartes physiques) ═══════════ */
.jc-card{position:relative;container-type:inline-size;aspect-ratio:1320/1845;border-radius:5.3% / 3.79%;width:100%;
  box-shadow:0 18px 36px -18px rgba(40,20,5,.45);direction:ltr;text-align:left;isolation:isolate;overflow:hidden}
.jc-card.t-classic{background:linear-gradient(160deg,#34343d 0%,#141419 45%,#2c2c34 100%)}
.jc-card.t-dore{background:#d4ae44}
.jc-card.t-rayonnant{background:linear-gradient(140deg,#a445ff 0%,#6a7dff 18%,#27c3d6 36%,#43c98d 48%,#f2a33a 62%,#ff6f8e 78%,#d24dff 100%)}
.jc-in{position:absolute;inset:1.55cqw;background:#fff;border-radius:3.9cqw;overflow:hidden}
.jc-tag{position:absolute;left:5.95cqw;top:4.1cqw;display:flex;align-items:center;gap:2.1cqw;font-family:'Archivo Black','Arial Black',sans-serif;
  font-size:2.7cqw;line-height:1;letter-spacing:.07em;text-transform:uppercase;color:#16161c;white-space:nowrap}
.jc-ico{display:block;width:2.75cqw;height:2.75cqw;border-radius:50%;background:#16161c;flex:none}
.t-dore .jc-tag{color:#d4ae44}
.t-dore .jc-ico{border-radius:.6cqw;background:#d4ae44}
.t-rayonnant .jc-tag span{background:linear-gradient(90deg,#4f7cff,#27c3a0 35%,#e8a93a 60%,#ff5fa2 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.t-rayonnant .jc-ico{border-radius:0;width:3cqw;height:3cqw;background:linear-gradient(135deg,#27c3d6,#4f7cff 45%,#f2a33a 70%,#ff5fa2);
  clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.jc-art{position:absolute;left:18.15cqw;right:18.15cqw;top:6.8cqw;height:56.1cqw;display:grid;place-items:center}
.jc-art img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;-webkit-user-drag:none}
.jc-name{position:absolute;left:4cqw;right:4cqw;top:63.2cqw;height:9.5cqw;display:flex;align-items:center;justify-content:center;
  font-family:'Manrope','Helvetica Neue',Arial,sans-serif;font-weight:800;font-size:calc(6.75cqw * var(--ns,1));line-height:1.05;
  color:#16161c;text-align:center;white-space:nowrap;letter-spacing:-.01em}
.jc-bar{position:absolute;left:50%;top:75.9cqw;width:10.4cqw;height:.46cqw;border-radius:.3cqw;transform:translateX(-50%);background:#16161c}
.t-dore .jc-bar{background:#d4ae44}
.t-rayonnant .jc-bar{background:linear-gradient(90deg,#8a5cff,#27c3d6,#f2a33a,#ff5fa2)}
.jc-card .jc-in p.jc-desc{position:absolute;left:6.85cqw;right:6.85cqw;top:79.3cqw;bottom:4cqw;margin:0;overflow:hidden;
  font-family:'Manrope','Helvetica Neue',Arial,sans-serif;font-weight:500;font-size:calc(4.05cqw * var(--fs,1));line-height:1.52;
  color:#50505c;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
html[lang="ar"] .jc-card .jc-in p.jc-desc,html[lang="ar"] .jc-name{direction:rtl}
html[lang="ar"] .jc-card .jc-in p.jc-desc{text-align:right}

/* reflet : couche « foil » + reflet lumineux, pilotés par la souris */
.jx-holo > .jc-card{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .45s var(--jx-ease)}
.jx-holo.jx-hover > .jc-card{transition:transform .1s linear}
.jc-card .jx-shine{position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .35s;
  background:linear-gradient(115deg,transparent 18%,rgba(190,200,215,.35) 38%,rgba(255,255,255,.1) 50%,rgba(170,185,205,.35) 62%,transparent 82%);
  background-size:260% 260%;background-position:var(--fx,50%) var(--fy,50%);mix-blend-mode:multiply}
.jc-card.t-dore .jx-shine{background-image:linear-gradient(115deg,transparent 15%,rgba(236,196,90,.45) 35%,rgba(255,244,200,.2) 50%,rgba(214,160,40,.45) 65%,transparent 85%)}
.jc-card.t-rayonnant .jx-shine{background-image:linear-gradient(115deg,transparent 10%,rgba(255,94,156,.38) 26%,rgba(255,214,70,.34) 38%,rgba(90,230,160,.34) 50%,rgba(90,190,255,.38) 62%,rgba(190,110,255,.38) 74%,transparent 90%)}
.jc-card .jx-shine::after{content:'';position:absolute;inset:0;border-radius:inherit;mix-blend-mode:screen;
  background:radial-gradient(circle at var(--mx,50%) var(--my,40%),rgba(255,255,255,.75),rgba(255,255,255,.18) 22%,transparent 46%)}
.jx-holo.jx-hover .jx-shine{opacity:1}
.jx-holo.jx-hover .jc-card.t-rayonnant .jx-shine{animation:jxFoil 5s linear infinite}
@keyframes jxFoil{50%{filter:hue-rotate(40deg)}}
.jx-front .jc-card .jc-in p.jc-desc{bottom:11cqw}

.jc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1rem}
@media(max-width:600px){.jc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.codex-filters .filter-btn{border-radius:6px}
.cards-grid .jc-wrap[hidden]{display:none}
.jx-deck-name{z-index:2}

/* Accueil : plateau aux tons clairs, même en thème sombre */
[data-theme="dark"] .jx-home{--jx-l:#f0d9b5;--jx-d:#b58863}

/* Fonds de sections très légèrement alternés */
.jx-home .jx-how,.jx-home .jx-draw-sec,.jx-home .jx-ways{background:var(--jx-alt);box-shadow:0 0 0 100vmax var(--jx-alt);clip-path:inset(0 -100vmax)}
:root{--jx-alt:#f2ebdb}
[data-theme="dark"]{--jx-alt:#151009}
.jx-home .section,.jx-home .jx-ways{position:relative}

/* Puzzles : texte et niveaux à gauche, plateau à droite */
.jx-puz-grid{display:grid;grid-template-columns:minmax(0,300px) minmax(0,470px) minmax(0,270px);gap:2.4rem;align-items:start}
.jx-puz-right{order:0}
.jx-puz-aside{min-width:0}
.jx-tabs{flex-direction:column;align-items:stretch;gap:.35rem}
.jx-tab{align-items:flex-start}
.jx-puz-right{max-width:520px}
.jx-puz-left .section-title{margin-bottom:.8rem}
.jx-puz-left .jx-lead{margin-bottom:1.4rem}
.jx-puz-card{width:min(260px,100%)}
.jx-puz-btns .jx-sol{padding:.6rem 1.2rem;font-size:.85rem}
.jx-puz-right.solved .jx-board{animation:jxWin 1.2s ease}
@media(max-width:1200px){.jx-puz-grid{grid-template-columns:minmax(0,200px) minmax(0,1fr) minmax(0,240px);gap:1.6rem}}
@media(max-width:1000px){.jx-puz-grid{grid-template-columns:minmax(0,200px) minmax(0,1fr)}.jx-puz-aside{grid-column:1 / -1;display:flex;gap:1.5rem;align-items:flex-start}.jx-puz-aside .jx-puz-side{flex-direction:row;flex-wrap:wrap;align-items:center;gap:1rem}}
@media(max-width:900px){.jx-puz-grid{grid-template-columns:1fr}.jx-puz-right{width:100%;max-width:470px;margin:0;justify-self:center}.jx-tabs{flex-direction:row}.jx-puz-aside .jx-puz-side{flex-direction:column}}

/* Commandes de la présentation */
.jx-nav{width:30px;height:30px;border-radius:6px;border:1px solid rgba(26,14,6,.25);background:rgba(255,255,255,.5);cursor:pointer;position:relative;flex:none;transition:opacity .2s}
.jx-nav:disabled{opacity:.3;cursor:default}
.jx-play{border:1px solid rgba(26,14,6,.25);background:rgba(255,255,255,.5)}
.jx-play::before{background:var(--white)}

/* Indice « retourner » : le texte disparaît une fois la carte retournée */
.jx-hint{transition:opacity .25s}
.jx-flip.flipped .jx-hint{opacity:0}
.jx-hint-ico{width:15px;height:15px;display:block;overflow:visible}
.jx-hint-ico path{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.jx-flip:hover .jx-hint-ico{transform:rotate(-40deg);transition:transform .5s}


.jx-nav .jx-curve{position:absolute;inset:0;margin:auto;width:16px;height:16px;overflow:visible}
.jx-nav .jx-curve path{fill:none;stroke:var(--white);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.jx-prev .jx-curve{transform:scaleX(-1)}
/* la flèche « retourner » disparaît avec le texte */
/* Codex : couleurs des filtres */
.codex-filters .filter-btn.classic{border-color:rgba(26,14,6,.45);color:var(--white)}
.codex-filters .filter-btn.classic.active{background:rgba(26,14,6,.1)}
[data-theme="dark"] .codex-filters .filter-btn.classic{border-color:rgba(240,232,216,.4);color:var(--white)}
.codex-filters .filter-btn.rayonnant{border-image:var(--jx-rainbow-txt) 1;border-radius:0}
.codex-filters .filter-btn.rayonnant span,.codex-filters .filter-btn.rayonnant{background:var(--jx-rainbow-txt);-webkit-background-clip:text;background-clip:text;color:transparent}
.codex-filters .filter-btn.rayonnant.active{background:var(--jx-rainbow-txt);-webkit-background-clip:text;background-clip:text;box-shadow:inset 0 0 0 999px rgba(122,32,106,.10)}
/* Compteur de tours : vrai échiquier */
.jx-turns-grid{opacity:1;box-shadow:none;display:block}
.jx-turns-grid .jx-board{box-shadow:0 0 0 3px #6b4424}

/* Puzzles : boutons côte à côte, niveaux centrés sous le titre */
.jx-puz-btns{flex-direction:row;gap:.7rem}
.jx-puz-btns .btn-secondary,.jx-puz-btns .jx-sol{padding:.55rem .9rem;font-size:.82rem;white-space:nowrap}
.jx-puz-left .jx-tabs{margin:2.2rem auto 0;align-self:center}
.jx-puz{display:flex;justify-content:center}
/* Barre de progression : vide au départ */
.jx-progress i{min-width:3px}

/* ── Codex : cartes retournables (même principe que l'accueil) ───── */
.cards-grid .jc-wrap{min-width:0}
.cards-grid .jx-flip{width:100%}
.jx-cap{overflow:hidden}
.jx-cap span{display:block}
/* pion transporté par une tour (carte « Tours de siège ») */
.jx-pc.jx-carry::after{content:'';position:absolute;right:3%;bottom:5%;width:34%;height:34%;border-radius:50%;
  background:#fff;box-shadow:0 0 0 1.4px #1a1a1a,0 1px 2px rgba(0,0,0,.4);z-index:3;animation:jxPop .35s var(--jx-ease)}
.jx-badge.win.green{background:linear-gradient(90deg,#43c98d,#1f9d55);box-shadow:0 0 16px rgba(67,201,141,.7)}

/* ── Codex : étiquettes de filtre ────────────────────────────────── */
.codex-filters .filter-btn.all{border-color:var(--gold);color:var(--gold)}
.codex-filters .filter-btn.all.active{background:rgba(110,63,20,.10)}
.codex-filters .filter-btn.dore{border-color:#9c6d06;color:#9c6d06}
.codex-filters .filter-btn.dore.active{background:rgba(156,109,6,.14)}
[data-theme="dark"] .codex-filters .filter-btn.all{border-color:var(--gold);color:var(--gold)}
[data-theme="dark"] .codex-filters .filter-btn.all.active{background:rgba(233,196,106,.12)}
[data-theme="dark"] .codex-filters .filter-btn.dore{border-color:#d7a323;color:#d7a323}
[data-theme="dark"] .codex-filters .filter-btn.dore.active{background:rgba(215,163,35,.14)}