
:root{--club:#004aad;--yellow:#ffe615;--ink:#071426;--common:#b8c0c8;--rare:#52b8ff;--super:#b85cff;--legend:#ffd21c}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at top,#26374b,#090d12 65%);color:white;font-family:Arial,sans-serif;min-height:100vh}
header{text-align:center;padding:20px 12px 8px} .brand{width:min(340px,75vw);max-height:130px;object-fit:contain}
.wrap{max-width:1120px;margin:auto;padding:10px 18px 50px} nav{display:flex;gap:8px;justify-content:center;margin:12px 0 22px}
button{border:0;border-radius:12px;padding:12px 18px;font-weight:900;cursor:pointer;background:#273342;color:white}
button.active,button.primary{background:var(--yellow);color:#111}
.stats{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:18px} .pill{background:#18212d;border:1px solid #405064;padding:9px 14px;border-radius:99px}
.hero{text-align:center;background:#111923;border:1px solid #34485f;border-radius:22px;padding:24px}
.pack{width:215px;height:300px;margin:0 auto 18px;border:5px solid var(--yellow);border-radius:20px;background:linear-gradient(145deg,#0b5bb2,#003777);display:flex;align-items:center;justify-content:center;padding:20px;box-shadow:0 18px 38px #0009}
.pack img{width:100%} .booster{font-size:18px;padding:15px 25px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px} .hidden{display:none}

.tc{--type:#004aad;--rar:#b8c0c8;position:relative;background:var(--type);border:5px solid var(--rar);border-radius:20px;overflow:hidden;aspect-ratio:2.5/3.5;box-shadow:0 12px 28px #0008;color:white}
.tc::after{content:"";position:absolute;width:72%;height:72%;right:-22%;bottom:-16%;background:url("../images/313ac22dae1e597a.png") center/contain no-repeat;opacity:.075;pointer-events:none}
.type-Joueur,.type-Joueuse{--type:#004aad} .type-Objet{--type:#5d397d} .type-Action{--type:#b44823} .type-Évènement{--type:#16765c} .type-Lieu{--type:#73522f}
.rar-Commune{--rar:#b8c0c8} .rar-Rare{--rar:#52b8ff} .rar-Super-Rare{--rar:#b85cff} .rar-Légendaire{--rar:#ffd21c}
.photo{height:47%;margin:13px 13px 0;border:3px solid rgba(255,255,255,.72);border-radius:10px;overflow:hidden;background:#ccd4dc;position:relative}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.type-Joueur .photo,.type-Joueuse .photo{height:50%;margin:0;border:0;border-radius:0}
.type-Joueur .photo img,.type-Joueuse .photo img{object-position:center 24%}
.ribbon{position:absolute;z-index:3;left:0;top:14px;background:var(--rar);color:#102033;padding:7px 22px 7px 16px;font-size:11px;font-weight:1000;text-transform:uppercase;clip-path:polygon(0 0,100% 0,88% 50%,100% 100%,0 100%,8% 50%)}
.rar-Super-Rare .ribbon,.rar-Légendaire .ribbon{color:#111}
.info{padding:12px 15px 14px;position:relative;z-index:2;height:53%;display:flex;flex-direction:column}
.type-Joueur .info,.type-Joueuse .info{height:50%}
.name{font-size:25px;line-height:.95;font-weight:1000;text-transform:uppercase;margin:2px 0 5px;letter-spacing:.2px}
.kind{font-size:12px;font-weight:900;text-transform:uppercase;opacity:.9;border-bottom:2px solid rgba(255,255,255,.55);padding-bottom:6px;width:max-content;min-width:72px}
.desc{font-size:12px;line-height:1.25;margin:9px 0 7px;flex:1}
.statrow{display:flex;justify-content:space-between;gap:14px;align-items:flex-end}
.stat{width:65px;height:65px;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;font-weight:1000;border:2px solid #ffffff99;box-shadow:inset 0 0 15px #fff3}
.atk{background:linear-gradient(135deg,#ff3030,#ff9a3c)} .def{background:linear-gradient(135deg,#bff6d3,#72a9ff);color:#071426}
.stat small{font-size:10px} .stat b{font-size:17px;margin-top:2px} .nostat{opacity:.22}
.count{text-align:center;color:#bbc6d2;font-size:12px;margin-top:6px}

.reveal{position:fixed;inset:0;background:#000e;z-index:10;display:none;align-items:center;justify-content:center;padding:16px}
.revealbox{width:min(520px,100%);background:#101821;border:1px solid #41546b;border-radius:24px;padding:18px;text-align:center;overflow:hidden}
.stack{height:470px;display:flex;align-items:center;justify-content:center;perspective:1200px;position:relative}
.flip{width:285px;aspect-ratio:2.5/3.5;position:absolute;transform-style:preserve-3d;transition:transform .72s cubic-bezier(.2,.75,.2,1),opacity .45s,translate .45s}
.flip.flipped{transform:rotateY(180deg)} .face{position:absolute;inset:0;backface-visibility:hidden;border-radius:20px;overflow:hidden}
.back{background:linear-gradient(145deg,#0b5bb2,#003777);border:5px solid var(--yellow);display:flex;align-items:center;justify-content:center;padding:22px}
.back img{width:100%} .front{transform:rotateY(180deg)} .front.direct{transform:none}.direct-card{transform:none!important}.direct-card .front{transform:none!important}
.slide-away{translate:135% 18px;transform:rotate(9deg)!important;opacity:0}
.progress{color:#aeb9c5;font-size:13px;margin-bottom:4px} .controls{height:48px}
.footer{text-align:center;color:#718093;font-size:12px;margin-top:30px}
@media(max-width:500px){.stack{height:420px}.flip{width:250px}}

/* V7 — cartes Joueur/Joueuse basées sur les PNG détourés fournis */
.player-card{
  background:
    radial-gradient(circle at 72% 24%,rgba(25,124,231,.72),transparent 34%),
    linear-gradient(150deg,#0873d2 0%,#004aad 42%,#00317d 100%);
  isolation:isolate;
}
.player-card::after{display:none}
.player-card .ribbon{z-index:9}
.player-card .crown{font-size:17px;margin-left:5px}
.player-bg-logo{
  position:absolute;z-index:0;right:-13%;top:8%;width:80%;
  color:rgba(255,255,255,.11);font-weight:1000;font-style:italic;
  font-size:33px;line-height:.78;text-align:center;transform:rotate(-8deg);
  border:8px solid rgba(255,255,255,.07);border-radius:50%;padding:27px 4px;
}
.player-bg-logo small{display:block;font-size:13px;line-height:1.1;margin-top:9px}
.player-splash{position:absolute;z-index:1;background:#ffe615;opacity:.98;pointer-events:none}
.splash-a{width:135%;height:42px;left:-18%;top:50%;transform:rotate(-10deg);clip-path:polygon(0 35%,12% 20%,23% 43%,38% 5%,49% 50%,63% 19%,74% 48%,88% 12%,100% 38%,100% 68%,85% 51%,71% 84%,57% 55%,43% 91%,29% 55%,14% 82%,0 62%)}
.splash-b{width:76%;height:25px;right:-12%;top:59%;transform:rotate(-17deg);clip-path:polygon(0 42%,16% 18%,28% 51%,44% 7%,57% 55%,73% 23%,100% 48%,100% 69%,77% 55%,61% 86%,45% 60%,29% 91%,12% 62%,0 73%)}
.player-photo{position:absolute;z-index:3;inset:20px 0 auto 0;height:66%;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.player-photo img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 5px 5px rgba(0,0,0,.25))}
.player-bottom{
  position:absolute;z-index:5;left:0;right:0;bottom:0;height:47%;
  padding:15% 15px 12px;
  background:linear-gradient(to bottom,transparent 0%,rgba(0,37,103,.72) 24%,#00327d 46%,#00245e 100%);
  display:flex;flex-direction:column;
}
.player-name{
  align-self:flex-start;max-width:94%;font-weight:1000;text-transform:uppercase;
  font-size:clamp(23px,8.8cqw,38px);line-height:.92;letter-spacing:.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  padding:3px 22px 4px 5px;margin:0 0 1px;
  background:linear-gradient(105deg,#001b50 0 78%,transparent 79%);
  text-shadow:0 2px 3px #0008;
}
.player-kind{color:#ffe615;font-size:12px;font-weight:1000;text-transform:uppercase;padding-left:6px}
.player-desc{
  margin:4px 6px 2px;font-size:10.5px;line-height:1.16;height:25px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.player-stats{margin-top:auto;display:flex;justify-content:space-between;padding:0 20px 0}
.player-stat{
  width:68px;height:68px;border-radius:50%;display:flex;flex-direction:column;
  justify-content:center;align-items:center;font-weight:1000;
  border:3px solid rgba(255,255,255,.9);
  outline:3px solid rgba(255,230,21,.23);
  box-shadow:0 0 0 5px rgba(0,20,65,.28),inset 0 0 14px rgba(255,255,255,.28),0 4px 10px #0006;
}
.player-stat.atk{background:linear-gradient(135deg,#ef2020,#ff783e);transform:rotate(-3deg)}
.player-stat.def{background:linear-gradient(135deg,#c9fbef,#60c8ff);color:#061b3c;transform:rotate(3deg)}
.player-stat small{font-size:10px}.player-stat b{font-size:24px;line-height:1;margin-top:1px}


.confetti{position:fixed;z-index:9999;top:-20px;width:9px;height:16px;background:#ffd21c;pointer-events:none;animation:goldfall 1.8s linear forwards}
@keyframes goldfall{to{transform:translate(var(--drift),105vh) rotate(760deg);opacity:.15}}

/* ===== V8 layout safeguards ===== */

/* Non-player cards: reserve the bottom for the stats no matter how long the text is. */
.tc:not(.player-card) .info{
  height:46% !important;
  padding:13px 13px 10px !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) 66px !important;
  align-content:stretch !important;
  overflow:hidden !important;
}
.tc:not(.player-card) .name{
  font-size:clamp(17px,6.2cqw,27px) !important;
  line-height:.94 !important;
  max-height:2.82em !important;
  overflow:hidden !important;
  overflow-wrap:anywhere !important;
}
.tc:not(.player-card) .kind{
  font-size:clamp(9px,3.3cqw,12px) !important;
  line-height:1.05 !important;
}
.tc:not(.player-card) .desc{
  font-size:clamp(8px,3.0cqw,11px) !important;
  line-height:1.12 !important;
  margin:4px 0 2px !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:4 !important;
}
.tc:not(.player-card) .statrow{
  position:static !important;
  margin:0 !important;
  align-self:end !important;
  height:64px !important;
  min-height:64px !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
}
.tc:not(.player-card) .stat{
  width:58px !important;height:58px !important;min-width:58px !important;
}

/* Player / Joueuse card — rebuilt to follow the Fabrice reference */
.player-card{
  container-type:inline-size;
  background:
    radial-gradient(ellipse at 78% 17%,rgba(57,145,255,.46),transparent 37%),
    linear-gradient(145deg,#0875d9 0%,#0458b7 42%,#00337f 100%) !important;
  overflow:hidden;
}
.player-card.rar-legendaire{
  border-color:#ffd42a !important;
  box-shadow:0 0 0 3px #ffea70 inset,0 0 0 6px #d79700 inset,0 8px 22px #0007 !important;
}
.player-card.rar-epique{border-color:#b76cff !important}
.player-card.rar-rare{border-color:#41c7ff !important}
.player-card.rar-commune{border-color:#cbd4db !important}

.player-card .ribbon{
  top:10px !important;left:0 !important;
  padding:8px 24px 8px 16px !important;
  font-size:clamp(10px,3.8cqw,14px) !important;
  clip-path:polygon(0 0,100% 0,87% 50%,100% 100%,0 100%,8% 50%) !important;
}
.player-card.rar-legendaire .ribbon{
  background:linear-gradient(90deg,#ffdf38,#fff08b,#e4a800) !important;
  color:#101010 !important;
}
.player-bg-logo{
  right:-9% !important;top:5% !important;width:87% !important;
  font-size:clamp(27px,10cqw,42px) !important;
  opacity:.95;
  color:rgba(255,255,255,.105) !important;
  border-color:rgba(255,255,255,.075) !important;
}
.player-photo{
  z-index:3 !important;
  inset:34px -2% auto -2% !important;
  height:67% !important;
}
.player-photo img{
  width:104% !important;height:100% !important;
  object-fit:contain !important;object-position:center bottom !important;
  filter:drop-shadow(0 5px 5px rgba(0,0,0,.30)) !important;
}
.player-splash.splash-a{
  top:50% !important;height:49px !important;background:#ffe615 !important;
}
.player-splash.splash-b{
  top:59% !important;height:30px !important;background:#ffd600 !important;
}
.player-bottom{
  height:48% !important;
  padding:15% 14px 10px !important;
  background:linear-gradient(to bottom,transparent 0%,rgba(0,37,103,.72) 19%,#00347f 41%,#00245d 100%) !important;
}
.player-name{
  font-size:clamp(22px,9.4cqw,38px) !important;
  padding:2px 28px 3px 5px !important;
  max-width:97% !important;
  overflow:visible !important;text-overflow:clip !important;
}
.player-kind{font-size:clamp(10px,3.5cqw,13px) !important}
.player-desc{
  font-size:clamp(8.5px,3.15cqw,11.5px) !important;
  line-height:1.12 !important;height:27px !important;
  -webkit-line-clamp:2 !important;
}
.player-stats{
  min-height:72px !important;
  margin-top:auto !important;
  padding:0 20px 1px !important;
}
.player-stat{
  width:67px !important;height:67px !important;
  border:3px solid rgba(255,255,255,.93) !important;
  outline:none !important;
  box-shadow:
    0 0 0 3px rgba(255,230,21,.32),
    0 0 0 5px rgba(0,25,75,.30),
    inset 0 0 16px rgba(255,255,255,.34),
    0 4px 10px #0007 !important;
  position:relative;
}
.player-stat::after{
  content:"";position:absolute;inset:-8px;border:2px solid currentColor;
  border-radius:47% 53% 44% 56% / 55% 43% 57% 45%;
  opacity:.45;transform:rotate(13deg);
}
.player-stat.atk{background:radial-gradient(circle at 35% 25%,#ff7253,#f02020 60%,#b40000) !important;color:white !important}
.player-stat.def{background:radial-gradient(circle at 35% 25%,#a9fff3,#25d4e8 50%,#075bc8) !important;color:white !important}
.player-stat small{font-size:10px !important}
.player-stat b{font-size:25px !important}


/* ===== V9 ===== */

/* Other card types: name must stay on ONE line and shrink rather than wrap. */
.tc:not(.player-card) .name{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  font-size:clamp(11px,4.8cqw,20px) !important;
  line-height:1 !important;
  max-height:none !important;
}
.tc:not(.player-card) .desc{
  font-size:clamp(7.4px,2.75cqw,10.3px) !important;
  line-height:1.08 !important;
  -webkit-line-clamp:5 !important;
}

/* Real Intouchables logo behind every player. */
.player-bg-logo{
  position:absolute !important;
  z-index:0 !important;
  right:-11% !important;
  top:4% !important;
  width:94% !important;
  height:43% !important;
  border:0 !important;
  padding:0 !important;
  transform:rotate(-7deg) !important;
  opacity:.15 !important;
}
.player-bg-logo img{
  width:100% !important;height:100% !important;
  object-fit:contain !important;
}

/* Make cut-out players much larger and more card-filling. */
.player-photo{
  inset:24px -16% auto -16% !important;
  height:72% !important;
  overflow:visible !important;
}
.player-photo img{
  width:132% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  transform:scale(1.22) !important;
  transform-origin:center bottom !important;
}

/* Push the graphic treatment closer to the reference card. */
.player-card:before{
  content:"";position:absolute;z-index:2;left:-8%;right:-8%;top:48%;height:17%;
  background:#ffe615;
  clip-path:polygon(0 45%,10% 29%,19% 40%,30% 12%,39% 44%,49% 20%,58% 49%,70% 10%,79% 39%,90% 17%,100% 31%,100% 58%,91% 47%,80% 70%,70% 49%,60% 78%,49% 55%,38% 84%,28% 57%,17% 79%,8% 61%,0 72%);
  transform:rotate(-7deg);
}
.player-card .player-bottom{z-index:5 !important}
.player-card .player-photo{z-index:3 !important}

/* Collection cards are explicitly interactive. */
.collection-card-wrap{cursor:pointer}
.collection-card-wrap:hover .tc{transform:translateY(-4px);filter:brightness(1.06)}
.collection-card-wrap .tc{transition:.18s ease}

/* Large card viewer */
#cardViewer{
  display:none;position:fixed;inset:0;z-index:12000;
  background:rgba(2,10,22,.88);backdrop-filter:blur(6px);
  align-items:center;justify-content:center;padding:24px;
}
#cardViewer.open{display:flex}
#cardViewer .viewer-inner{position:relative;width:min(430px,88vw)}
#cardViewer .viewer-card{width:100%}
#cardViewer .viewer-card .tc{
  width:100% !important;height:auto !important;aspect-ratio:63/88;
  container-type:inline-size;
}
#cardViewer .viewer-close{
  position:absolute;right:-13px;top:-13px;z-index:20;
  width:38px;height:38px;border-radius:50%;border:2px solid #fff;
  background:#101d2d;color:#fff;font-size:23px;font-weight:900;cursor:pointer;
}

/* ===== V10 ===== */

/* Non-player cards: compact typography so name + description remain readable in collection. */
.tc:not(.player-card) .name{
  white-space:nowrap !important;
  font-size:clamp(9px,4.15cqw,17px) !important;
  letter-spacing:-.15px !important;
  line-height:1 !important;
  overflow:hidden !important;
  text-overflow:clip !important;
}
.tc:not(.player-card) .desc{
  font-size:clamp(7px,2.55cqw,9.6px) !important;
  line-height:1.05 !important;
  display:block !important;
  overflow:hidden !important;
  max-height:5.25em !important;
}

/* Premium player template, based on the Fabrice reference. */
.player-card{
  background:
    radial-gradient(circle at 72% 18%,rgba(65,151,255,.42),transparent 35%),
    linear-gradient(150deg,#0b70d2 0%,#0755b3 42%,#00317b 100%) !important;
}
.player-card::after{
  content:"" !important;display:block !important;position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(165deg,transparent 0 26%,rgba(255,255,255,.055) 26.4% 27.2%,transparent 27.6%),
    linear-gradient(12deg,transparent 0 64%,rgba(0,15,70,.18) 64.4% 65.4%,transparent 65.8%);
  pointer-events:none;
}
.player-bg-logo{
  top:5% !important;right:-8% !important;width:94% !important;height:39% !important;
  opacity:.18 !important;transform:rotate(-7deg) !important;
}
.player-photo{
  inset:35px -10% auto -10% !important;
  height:65% !important;overflow:visible !important;z-index:3 !important;
}
.player-photo img{
  width:120% !important;height:100% !important;
  object-fit:contain !important;object-position:center bottom !important;
  transform:scale(1.08) !important;transform-origin:center bottom !important;
}
.player-card:before{
  content:"";position:absolute;z-index:2;left:-12%;right:-12%;top:47%;height:20%;
  background:#ffe615;
  clip-path:polygon(0 48%,8% 29%,18% 42%,29% 9%,39% 46%,49% 18%,59% 51%,70% 8%,80% 42%,91% 16%,100% 34%,100% 57%,91% 48%,81% 73%,71% 50%,60% 81%,50% 56%,39% 88%,28% 58%,17% 82%,7% 62%,0 73%);
  transform:rotate(-8deg);
}
.player-bottom{
  height:49% !important;padding:15% 15px 10px !important;
  background:linear-gradient(to bottom,transparent 0%,rgba(0,31,92,.73) 20%,#00337e 40%,#00245d 100%) !important;
}
.player-name{
  font-size:clamp(23px,9.7cqw,39px) !important;
  text-shadow:0 3px 3px #0008 !important;
}
.player-kind{color:#ffe615 !important;font-weight:1000 !important}
.player-stat{
  width:69px !important;height:69px !important;
  border:3px solid #fff !important;
  box-shadow:0 0 0 3px rgba(255,230,21,.35),0 0 0 6px rgba(0,20,65,.35),inset 0 0 16px #fff5,0 5px 11px #0007 !important;
}
.player-stat.atk{background:radial-gradient(circle at 32% 24%,#ff8b52,#f12b20 55%,#b50000) !important}
.player-stat.def{background:radial-gradient(circle at 32% 24%,#a9fff5,#25cfe5 50%,#0756c8) !important}

/* Modal card viewer */
#cardViewer{display:none !important}
#cardViewer.open{
  display:flex !important;
  position:fixed !important;inset:0 !important;z-index:999999 !important;
  background:rgba(2,9,20,.91) !important;
  align-items:center !important;justify-content:center !important;
  padding:28px !important;
}
#cardViewer .viewer-inner{width:min(430px,86vw) !important;position:relative !important}
#cardViewer .viewer-card{width:100% !important}
#cardViewer .viewer-card .tc{
  width:100% !important;height:auto !important;aspect-ratio:63/88 !important;
  container-type:inline-size !important;
}
#cardViewer .viewer-close{
  position:absolute !important;right:-14px !important;top:-14px !important;z-index:30 !important;
  width:40px !important;height:40px !important;border-radius:50% !important;
  border:2px solid white !important;background:#101d2d !important;color:white !important;
  font-size:24px !important;cursor:pointer !important;display:flex !important;align-items:center !important;justify-content:center !important;padding:0 !important;line-height:1 !important;
}
.collection-card-wrap{cursor:pointer !important}


/* ===== V11 : joueurs, direction artistique type Fabrice ===== */
.player-card{
 isolation:isolate;
 background:
 radial-gradient(ellipse at 78% 13%,rgba(73,166,255,.68),rgba(29,112,226,.22) 32%,transparent 55%),
 radial-gradient(ellipse at 12% 42%,rgba(0,112,225,.60),transparent 48%),
 linear-gradient(145deg,#087be0 0%,#075fc2 25%,#064aa5 48%,#023781 72%,#001e58 100%) !important;
}
.player-card::after{
 content:"" !important;display:block !important;position:absolute !important;inset:0 !important;z-index:1 !important;pointer-events:none !important;
 background:
 linear-gradient(168deg,transparent 0 9%,rgba(0,30,100,.28) 9.3% 11%,transparent 11.3% 16%,rgba(69,161,255,.22) 16.3% 17.2%,transparent 17.5% 31%,rgba(0,27,88,.22) 31.4% 34%,transparent 34.4%),
 linear-gradient(12deg,transparent 0 62%,rgba(0,16,70,.28) 62.4% 64.3%,transparent 64.7% 73%,rgba(74,170,255,.16) 73.4% 74.7%,transparent 75%);
 mix-blend-mode:soft-light;
}
.player-bg-logo{top:3% !important;right:-11% !important;width:103% !important;height:43% !important;opacity:.22 !important;transform:rotate(-7deg) !important;filter:saturate(.25) brightness(1.9) !important}
.player-card:before{
 content:"" !important;position:absolute !important;z-index:2 !important;left:-11% !important;right:-11% !important;top:43.5% !important;height:23% !important;
 background:linear-gradient(176deg,transparent 0 28%,#ffe615 29% 43%,transparent 44%),linear-gradient(185deg,transparent 0 47%,#ffd900 48% 58%,transparent 59%),linear-gradient(169deg,transparent 0 65%,rgba(255,230,21,.88) 66% 72%,transparent 73%);
 clip-path:polygon(0 27%,5% 32%,10% 19%,16% 29%,22% 10%,29% 31%,35% 17%,41% 34%,47% 11%,54% 30%,61% 15%,67% 35%,74% 8%,81% 29%,87% 14%,94% 32%,100% 20%,100% 73%,94% 67%,88% 82%,81% 65%,74% 88%,67% 69%,60% 84%,53% 67%,46% 91%,39% 72%,32% 86%,25% 68%,18% 91%,11% 73%,5% 85%,0 78%);
 transform:rotate(-4deg) skewX(-8deg) !important;filter:drop-shadow(0 3px 0 rgba(0,28,90,.22));
}
.player-photo{inset:31px -14% auto -14% !important;height:68% !important;z-index:3 !important;overflow:visible !important}
.player-photo img{width:128% !important;height:100% !important;max-width:none !important;object-fit:contain !important;object-position:center bottom !important;transform:scale(1.10) !important;transform-origin:center bottom !important;filter:drop-shadow(0 8px 8px rgba(0,20,60,.24))}
.player-card[data-player="Youssef"] .player-photo img,.player-card[data-player="Stéphane"] .player-photo img{transform:scale(1.55) translateY(7%) !important}
.player-card[data-player="Youssef"] .player-photo img{object-position:51% 24% !important}
.player-card[data-player="Stéphane"] .player-photo img{object-position:50% 20% !important}
.player-bottom{z-index:5 !important;height:48.5% !important;padding:14.5% 15px 10px !important;background:linear-gradient(174deg,transparent 0 10%,rgba(0,46,126,.70) 10.5% 18%,#063e91 18.5% 44%,#032e73 68%,#001e52 100%) !important}
.player-bottom::before{
 content:"";position:absolute;left:-8%;right:-4%;top:7%;height:15%;z-index:-1;background:#ffe615;opacity:.96;
 clip-path:polygon(0 42%,9% 34%,15% 48%,23% 26%,31% 45%,38% 32%,46% 51%,54% 25%,62% 44%,69% 29%,77% 48%,85% 23%,92% 41%,100% 31%,100% 45%,91% 51%,84% 43%,76% 59%,68% 47%,60% 61%,52% 45%,44% 63%,36% 49%,28% 62%,20% 48%,12% 60%,5% 51%,0 57%);transform:rotate(-7deg)
}
.player-name{font-size:clamp(22px,9.4cqw,38px) !important;line-height:.91 !important;letter-spacing:-.6px !important;text-shadow:0 3px 0 #00173f,2px 2px 5px #0009 !important}
.player-kind{color:#ffe615 !important;letter-spacing:.4px !important}
.player-desc{font-size:clamp(7.4px,2.7cqw,10.2px) !important;line-height:1.08 !important}
.player-stat{width:70px !important;height:70px !important;border:3px solid #fff !important;outline:2px solid rgba(255,230,21,.58) !important;box-shadow:0 0 0 5px rgba(1,35,91,.58),0 5px 0 rgba(0,18,60,.62),inset 0 0 13px rgba(255,255,255,.45) !important}
.player-stat.atk{background:radial-gradient(circle at 30% 22%,#ff9d64,#ff4c35 27%,#ec1c1c 60%,#9d0011) !important}
.player-stat.def{background:radial-gradient(circle at 30% 22%,#b7fff8,#4de8eb 28%,#16b9e1 56%,#0754bd) !important}


/* ===== V12 ===== */
.player-bg-logo{top:1% !important;left:50% !important;right:auto !important;width:126% !important;transform:translateX(-50%) rotate(-4deg) !important;opacity:.21 !important}
.player-bg-logo img{width:100%;height:auto;display:block}
/* Spray yellow: jagged strokes + droplets around the strokes */
.player-splash{background-color:#ffe615 !important;background-image:radial-gradient(circle at 4% 25%,#ffe615 0 1px,transparent 1.6px),radial-gradient(circle at 12% 75%,#ffe615 0 1.4px,transparent 2px),radial-gradient(circle at 25% 15%,#ffe615 0 .9px,transparent 1.5px),radial-gradient(circle at 41% 82%,#ffe615 0 1.2px,transparent 1.8px),radial-gradient(circle at 57% 18%,#ffe615 0 1.3px,transparent 2px),radial-gradient(circle at 73% 76%,#ffe615 0 1px,transparent 1.7px),radial-gradient(circle at 91% 28%,#ffe615 0 1.5px,transparent 2.1px) !important;background-size:29px 25px,37px 31px,41px 33px,31px 27px,43px 35px,35px 29px,39px 33px !important;box-shadow:0 -7px 18px rgba(255,230,21,.12),0 7px 16px rgba(255,230,21,.11)}
.player-bottom{height:49% !important;padding:11.8% 15px 10px !important}
.player-name{margin-bottom:0 !important}
.player-kind{padding-left:6px !important;margin-top:0 !important}
.player-desc{margin:2px 6px 1px !important;font-size:clamp(9.5px,3.35cqw,12.5px) !important;line-height:1.12 !important;height:30px !important;-webkit-line-clamp:2 !important}
.player-stats{padding-bottom:1px !important}
/* Bust crop corrections: move the actual source upward inside its enlarged box */
.player-card[data-player="Youssef"] .player-photo img{transform:scale(1.48) translateY(2%) !important;transform-origin:50% 36% !important;object-position:50% 28% !important}
.player-card[data-player="Stéphane"] .player-photo img{transform:scale(1.46) translateY(1%) !important;transform-origin:50% 35% !important;object-position:50% 27% !important}
.collection-type-section{grid-column:1/-1;margin:22px 0 0}.collection-type-title{display:flex;align-items:center;gap:10px;color:#fff;font-size:22px;font-weight:900}.collection-type-title:after{content:"";height:2px;flex:1;background:linear-gradient(90deg,#ffe615aa,#ffffff10)}.collection-type-sub{color:#91a8ba;font-size:12px;margin-top:3px}


/* ===== V13 : rareté diagonale + bloc texte remonté ===== */

/* Sur les cartes joueurs : bandeau rareté compact en diagonale dans l'angle */
.player-card .rarity-ribbon,
.player-card .rarity-banner,
.player-card .rarity-label,
.player-card .ribbon{
  position:absolute !important;
  top:13px !important;
  left:-37px !important;
  width:145px !important;
  height:auto !important;
  min-height:25px !important;
  padding:5px 8px !important;
  transform:rotate(-38deg) !important;
  transform-origin:center !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  z-index:12 !important;
  font-size:9px !important;
  line-height:1 !important;
  text-align:center !important;
  clip-path:none !important;
  border-radius:0 !important;
  box-shadow:0 2px 5px rgba(0,0,0,.28) !important;
}

/* Si le bandeau est construit directement comme premier enfant texte */
.player-card > .rarity{
  top:13px !important;
  left:-37px !important;
  width:145px !important;
  padding:5px 8px !important;
  transform:rotate(-38deg) !important;
  transform-origin:center !important;
  justify-content:center !important;
  text-align:center !important;
  z-index:12 !important;
  clip-path:none !important;
}

/* On libère davantage le visage en haut */
.player-photo{
  top:20px !important;
  height:70% !important;
}

/* Bloc informations encore remonté */
.player-bottom{
  height:53% !important;
  padding:9% 15px 9px !important;
  background:linear-gradient(174deg,transparent 0 9%,rgba(0,46,126,.72) 9.5% 17%,#063e91 17.5% 43%,#032e73 67%,#001e52 100%) !important;
}
.player-name{
  margin-top:-7px !important;
}
.player-kind{
  margin-top:0 !important;
  margin-bottom:2px !important;
}
.player-desc{
  font-size:clamp(10px,3.65cqw,13.5px) !important;
  line-height:1.14 !important;
  max-width:98% !important;
  margin-top:1px !important;
}

/* Les stats restent bien dans la partie basse malgré la remontée du texte */
.player-stats{
  margin-top:auto !important;
  transform:translateY(2px) !important;
}


/* V14 team background */
body{position:relative!important;background:#071522!important;background-image:linear-gradient(rgba(5,18,31,.72),rgba(5,18,31,.86)),url("../images/73132c91fd6b2e39.jpg ")!important;background-size:cover!important;background-position:center!important;background-attachment:fixed!important;background-repeat:no-repeat!important;}


/* ===== V16 — catalogue Excel + cartes Bonus ===== */
.bonus-card .info{
  height:50% !important;
  padding:11px 13px 11px !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(34px,1fr) auto !important;
  gap:2px !important;
  overflow:hidden !important;
}
.bonus-card .name{
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  max-height:none !important;
  line-height:1 !important;
  letter-spacing:-.15px !important;
}
.bonus-card .kind{
  font-size:10px !important;
  line-height:1 !important;
  margin-top:1px !important;
}
.bonus-card .desc{
  font-size:11.5px !important;
  line-height:1.15 !important;
  margin:4px 0 4px !important;
  -webkit-line-clamp:4 !important;
}
.bonus-card .function-box{
  min-height:58px;
  border:2px solid rgba(255,255,255,.8);
  border-radius:11px;
  padding:6px 8px;
  background:linear-gradient(135deg,rgba(0,25,72,.88),rgba(0,72,145,.88));
  box-shadow:inset 0 0 12px rgba(255,255,255,.08),0 3px 8px rgba(0,0,0,.28);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.bonus-card .function-box span{
  color:#ffe615;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.8px;
  line-height:1;
  margin-bottom:3px;
}
.bonus-card .function-box strong{
  color:white;
  font-size:10.5px;
  line-height:1.12;
  font-weight:900;
}
.bonus-card .photo{height:50% !important}
.bonus-card .photo img{width:100%;height:100%;object-fit:cover;object-position:center 38%}

/* Mascot placeholders also look intentional rather than like broken images. */
.tc img{user-select:none}

/* Ratings are now 0–10, so give the digits a little more breathing room. */
.player-stat b{font-size:27px !important}


/* ===== V17 : paquet booster sur l'accueil ===== */
.pack{
 border-radius:12px!important;
 background:
 linear-gradient(120deg,transparent 0 20%,rgba(255,255,255,.20) 27%,transparent 35%),
 linear-gradient(155deg,#0750a5,#0879d6 43%,#05347f 73%,#021c4c)!important;
 border:0!important;
 box-shadow:0 18px 40px rgba(0,0,0,.5),inset 0 0 32px rgba(255,255,255,.15)!important;
 clip-path:polygon(0% 0%,4.16667% 2.2%,8.33333% 0%,12.5% 2.2%,16.6667% 0%,20.8333% 2.2%,25% 0%,29.1667% 2.2%,33.3333% 0%,37.5% 2.2%,41.6667% 0%,45.8333% 2.2%,50% 0%,54.1667% 2.2%,58.3333% 0%,62.5% 2.2%,66.6667% 0%,70.8333% 2.2%,75% 0%,79.1667% 2.2%,83.3333% 0%,87.5% 2.2%,91.6667% 0%,95.8333% 2.2%,100% 0%,100% 100%,100% 100%,95.8333% 97.8%,91.6667% 100%,87.5% 97.8%,83.3333% 100%,79.1667% 97.8%,75% 100%,70.8333% 97.8%,66.6667% 100%,62.5% 97.8%,58.3333% 100%,54.1667% 97.8%,50% 100%,45.8333% 97.8%,41.6667% 100%,37.5% 97.8%,33.3333% 100%,29.1667% 97.8%,25% 100%,20.8333% 97.8%,16.6667% 100%,12.5% 97.8%,8.33333% 100%,4.16667% 97.8%,0% 100%,0% 0%)!important;
 position:relative;overflow:hidden;
}
.pack:before,.pack:after{content:"";position:absolute;left:0;right:0;height:17px;z-index:5;background:repeating-linear-gradient(90deg,#d59d00 0 9px,#ffe615 9px 19px,#e9bd19 19px 28px)}
.pack:before{top:0}.pack:after{bottom:0}
.pack img{position:relative;z-index:3;filter:drop-shadow(0 5px 8px rgba(0,0,0,.45))}

.new-card-badge{position:absolute;top:42px;right:8px;z-index:20;background:#ffe615;color:#04265e;border:2px solid #fff;border-radius:999px;padding:5px 9px;font-size:9px;font-weight:1000;box-shadow:0 4px 12px #0006;transform:rotate(4deg)}
.collection-tools{max-width:1120px;margin:0 auto 20px;padding:13px 15px;background:#031942d9;border:1px solid #ffffff29;border-radius:14px;display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}
.collection-counter{font-size:18px;font-weight:1000;color:#ffe615}.collection-filters{display:flex;gap:8px;flex-wrap:wrap}.collection-filters select,.reset-filters{background:#fff;color:#05275e;border:0;border-radius:9px;padding:9px 11px;font-weight:800;font-size:12px;cursor:pointer}.reset-filters{background:#ffe615}

/* Badge nouvelle carte — correctif V19.1 */
.new-card-badge{
 position:absolute!important;
 top:34px!important;
 right:7px!important;
 z-index:999!important;
 display:block!important;
 visibility:visible!important;
 opacity:1!important;
 background:#ffe615!important;
 color:#05275e!important;
 border:2px solid #fff!important;
 border-radius:999px!important;
 padding:6px 10px!important;
 font-size:10px!important;
 line-height:1!important;
 font-weight:1000!important;
 letter-spacing:.45px!important;
 box-shadow:0 4px 12px rgba(0,0,0,.4)!important;
 transform:rotate(4deg)!important;
 pointer-events:none!important;
}


/* ===== V20 : MON PROFIL ===== */
#profilePage{display:none;min-height:70vh;padding:26px 18px 70px;background:radial-gradient(circle at 20% 0%,rgba(255,230,21,.13),transparent 32%),linear-gradient(145deg,#071b36,#0a2e5b 58%,#07182e);color:#fff}
.profile-wrap{max-width:1050px;margin:auto}.profile-head{text-align:center;margin-bottom:22px}.profile-head h1{margin:0;color:#ffe615;font-size:clamp(32px,5vw,54px);text-transform:uppercase}.profile-head p{opacity:.82}
.profile-card{background:rgba(4,18,39,.88);border:2px solid rgba(255,230,21,.55);border-radius:26px;padding:24px;box-shadow:0 20px 55px rgba(0,0,0,.28)}
.profile-identity{display:flex;gap:24px;align-items:center;justify-content:center;flex-wrap:wrap}.avatar-main{width:180px;height:180px;border-radius:50%;background:linear-gradient(145deg,#fff,#dbe9ff);border:5px solid #ffe615;overflow:hidden;display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 6px rgba(25,113,193,.45)}
.avatar-main img{width:100%;height:100%;object-fit:contain;padding:8px}.profile-namebox{min-width:min(420px,100%);text-align:left}.profile-namebox label{display:block;font-weight:900;color:#ffe615;margin-bottom:7px}.profile-name-row{display:flex;gap:9px;flex-wrap:wrap}.profile-name-row input{flex:1;min-width:180px;padding:12px 14px;border-radius:12px;border:1px solid #5377a3;background:#071a35;color:#fff;font-size:18px;font-weight:800}.profile-btn{border:0;border-radius:12px;padding:12px 16px;background:#ffe615;color:#07182e;font-weight:1000;cursor:pointer}.profile-sub{margin-top:8px;opacity:.7;font-size:13px}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:24px}.statbox{background:linear-gradient(160deg,rgba(21,74,129,.88),rgba(7,27,54,.95));border:1px solid rgba(255,255,255,.13);border-radius:18px;padding:17px;text-align:center}.statbox b{display:block;font-size:27px;color:#ffe615;margin-bottom:4px}.statbox span{font-size:13px;font-weight:800;text-transform:uppercase;opacity:.88}
.rarity-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:12px}.rarity-stat{border-radius:13px;padding:11px 5px;text-align:center;background:rgba(0,0,0,.22)}.rarity-stat b{display:block;font-size:20px}.rarity-stat small{opacity:.78}
.avatar-modal{position:fixed;inset:0;background:rgba(0,0,0,.76);z-index:99999;display:none;align-items:center;justify-content:center;padding:18px}.avatar-modal.open{display:flex}.avatar-panel{width:min(900px,96vw);max-height:90vh;overflow:auto;background:#081d3a;border:2px solid #ffe615;border-radius:24px;padding:22px}.avatar-panel h2{text-align:center;color:#ffe615;margin:0 0 16px}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:12px}.avatar-choice{height:160px;border-radius:18px;background:#fff;border:3px solid transparent;cursor:pointer;overflow:hidden;position:relative}.avatar-choice.selected{border-color:#ffe615;box-shadow:0 0 0 3px #1971c1}.avatar-choice img{width:100%;height:100%;object-fit:contain;padding:5px}.avatar-choice span{position:absolute;bottom:0;left:0;right:0;background:rgba(5,22,45,.86);color:#fff;font-size:11px;font-weight:900;padding:5px;text-align:center}.avatar-close{display:block;margin:17px auto 0}
.profile-back{margin:0 0 18px;background:#1971c1;color:white}
@media(max-width:600px){.rarity-stats{grid-template-columns:repeat(2,1fr)}.avatar-main{width:145px;height:145px}.profile-namebox{text-align:center}}

/* ===== V22 : MON EQUIPE ===== */
#teamPage{display:none;min-height:75vh;padding:24px 18px 70px;color:#fff}
.team-wrap{max-width:1280px;margin:auto}.team-title{display:flex;justify-content:space-between;gap:18px;align-items:center;flex-wrap:wrap;background:rgba(5,21,42,.92);border:1px solid #365c80;border-radius:22px 22px 0 0;padding:20px}
.team-title h1{margin:0;background:#ffe615;color:#07182e;padding:5px 18px;transform:rotate(-1deg);font-size:34px}.team-title p{margin:7px 0 0;opacity:.9}
.team-totals{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}.team-total{min-width:130px;background:#071a35;border:1px solid #315a83;border-radius:16px;padding:11px 18px;text-align:center}.team-total b{display:block;color:#ffe615;font-size:27px}
.team-save{border:0;border-radius:16px;padding:13px 18px;background:#ffe615;color:#07182e;font-weight:1000;cursor:pointer}.team-save:disabled{opacity:.45;cursor:not-allowed}.team-msg{width:100%;font-weight:900;text-align:right;min-height:20px}
.pitch{background:linear-gradient(rgba(7,55,35,.83),rgba(7,55,35,.83)),repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 2px,transparent 2px 90px);border:1px solid #376c55;border-top:0;border-radius:0 0 22px 22px;padding:25px 20px;position:relative;overflow:hidden}.pitch:before{content:"";position:absolute;inset:50% 0 auto;border-top:2px solid rgba(255,255,255,.16)}
.team-slots{position:relative;display:grid;grid-template-columns:repeat(5,minmax(120px,1fr)) 18px repeat(2,minmax(120px,1fr));gap:12px;align-items:center}.slot-divider{height:230px;border-left:2px solid rgba(255,230,21,.65)}
.team-slot{height:230px;border:2px dashed rgba(255,255,255,.72);border-radius:16px;background:rgba(4,18,39,.48);display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;overflow:hidden;position:relative}.team-slot.bonus{border-color:#55c7ff}.team-slot img{width:100%;height:100%;object-fit:cover}.team-slot .empty{font-weight:900;padding:10px}.team-slot .remove{position:absolute;right:6px;top:6px;width:28px;height:28px;border:0;border-radius:50%;background:#e64040;color:#fff;font-weight:1000;cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;font-size:18px}.team-slot .slot-label{position:absolute;left:5px;right:5px;bottom:5px;background:rgba(4,18,39,.9);padding:6px;border-radius:8px;font-size:12px;font-weight:900}.selected-bonus-effect{display:block;margin-top:4px;color:#ffe615;font-size:10px;line-height:1.18;font-weight:900}
.available{margin-top:22px;background:rgba(5,21,42,.94);border:1px solid #365c80;border-radius:22px;padding:20px}.available h2{margin:0 0 14px;color:#ffe615}.team-filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:15px}.team-filters button{border:1px solid #42698f;border-radius:999px;padding:8px 12px;background:#123d70;color:#fff;font-weight:900;cursor:pointer}.team-filters button.active{background:#ffe615;color:#07182e}
.team-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:12px}.team-pick{min-height:205px;background:#0a274b;border:2px solid #315e8d;border-radius:15px;overflow:hidden;cursor:pointer;position:relative;transition:.15s}.team-pick:hover{transform:translateY(-3px)}.team-pick.disabled{opacity:.38;cursor:not-allowed;transform:none}.team-pick img{width:100%;height:132px;object-fit:cover;background:#07182e}.team-pick .tp-body{padding:8px}.team-pick b{display:block}.team-pick small{opacity:.82}.team-effect{display:block;margin-top:6px;color:#ffe615;line-height:1.25;font-size:11px}.team-pick .qty{position:absolute;right:5px;top:5px;background:#07182e;border-radius:999px;padding:4px 7px;font-weight:900}
@media(max-width:900px){.team-slots{grid-template-columns:repeat(2,minmax(130px,1fr))}.slot-divider{display:none}.team-slot{height:210px}.team-title h1{font-size:27px}}

/* ===== V23 : MATCH TEST ===== */
#matchPage{display:none;min-height:75vh;padding:24px 18px 70px;color:#fff}
.match-wrap{max-width:1180px;margin:auto}.match-hero{background:linear-gradient(135deg,#07182e,#0b3565);border:1px solid #365c80;border-radius:24px;padding:22px;box-shadow:0 20px 55px rgba(0,0,0,.25)}
.match-hero h1{margin:0;color:#ffe615;font-size:clamp(32px,5vw,52px);text-transform:uppercase}.match-hero p{margin:7px 0 0;opacity:.86}
.match-stage{margin-top:18px;background:rgba(5,21,42,.94);border:1px solid #365c80;border-radius:22px;padding:20px}
.match-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center}.match-side{background:#0a274b;border:1px solid #315e8d;border-radius:18px;padding:16px}.match-side.enemy{text-align:right}.match-vsmark{font-size:34px;font-weight:1000;color:#ffe615}
.match-side h3{margin:0 0 7px;color:#ffe615}.match-stats{font-weight:1000;font-size:19px}.match-bonusline{margin-top:9px;font-size:12px;opacity:.88}.match-bonusline b{color:#ffe615}.match-roster{margin-top:9px;font-size:12px;line-height:1.55;opacity:.94}.match-side.enemy .match-roster{text-align:right}.log-row.bonus,.log-row.bonus-me,.log-row.bonus-opp{color:#fff}
.match-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}.match-btn{border:0;border-radius:14px;padding:12px 18px;font-weight:1000;cursor:pointer;background:#ffe615;color:#07182e}.match-btn.secondary{background:#1971c1;color:#fff}.match-btn:disabled{opacity:.4;cursor:not-allowed}
.scoreboard{display:flex;justify-content:center;align-items:center;gap:18px;margin:4px 0 18px;font-weight:1000}.score-team{min-width:150px;text-align:center}.score-num{font-size:46px;color:#ffe615}.score-sep{font-size:28px;opacity:.7}
.match-log{max-width:760px;margin:0 auto;background:#06182f;border-radius:18px;padding:16px;max-height:470px;overflow:auto;border:1px solid #294e75}.log-title{text-align:center;color:#ffe615;font-weight:1000;font-size:19px;margin:6px 0 12px}.log-row{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.08);line-height:1.35}.log-row.attack-me{color:#ffe615;border-left:4px solid #ffe615}.log-row.attack-opp{color:#6ec8ff;border-left:4px solid #6ec8ff}.log-row.try{font-weight:1000}.log-row.bonus{color:#7fd5ff}.log-row.break{margin:8px 0;background:#123d70;border-radius:10px;text-align:center;font-weight:1000}
.half-panel{max-width:850px;margin:18px auto 0;background:#0a274b;border:1px solid #315e8d;border-radius:18px;padding:18px}.half-panel h2{margin-top:0;color:#ffe615}.sub-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sub-box{background:#071a35;border-radius:14px;padding:12px}.sub-box label{display:block;font-size:12px;font-weight:900;color:#ffe615;margin:6px 0}.sub-box select{width:100%;padding:10px;border-radius:9px;background:#102f55;color:#fff;border:1px solid #42698f}
.preteam-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.preteam-pill{background:#071a35;border:1px solid #315e8d;border-radius:999px;padding:6px 9px;font-size:12px}.match-note{text-align:center;opacity:.75;font-size:13px;margin-top:12px}.final-banner{text-align:center;padding:20px;border-radius:18px;background:linear-gradient(135deg,#123d70,#07182e);border:2px solid #ffe615;margin-top:18px}.final-banner h2{color:#ffe615;font-size:32px;margin:0 0 7px}
@media(max-width:700px){.match-vs{grid-template-columns:1fr}.match-vsmark{text-align:center}.match-side.enemy{text-align:left}.sub-grid{grid-template-columns:1fr}.score-team{min-width:90px}.score-num{font-size:38px}}


/* V23.5 — lisibilité du fil de match : hors possessions = blanc */
.log-row.bonus, .log-row.bonus-me, .log-row.bonus-opp { color:#fff !important; border-left-color:transparent !important; }
 .score-team{width:205px;min-width:0}.score-identity{display:flex;align-items:center;justify-content:center;gap:9px;min-height:42px;white-space:nowrap}.score-identity .match-name{overflow:hidden;text-overflow:ellipsis}.scoreboard{align-items:start}.match-avatar{width:39px;height:39px;border-radius:50%;object-fit:cover;border:2px solid #ffe615;background:#173b65}.sudden-note{color:#ffe615;font-weight:800;text-align:center} 
/* V23.10 cinematic match moments */
#matchCinema{position:fixed;inset:0;z-index:99999;background:rgba(2,13,30,.93);display:none;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;color:#fff;text-align:center;pointer-events:none}
#matchCinema.active{display:flex;animation:cinemaFade .22s ease-out}
#matchCinema .cinema-title{font-size:clamp(36px,8vw,90px);font-weight:1000;color:#ffe615;text-shadow:0 8px 30px #000;z-index:2;animation:cinemaPop .55s ease-out}
#matchCinema .cinema-score{font-size:clamp(24px,4vw,46px);font-weight:900;z-index:2}
#matchCinema .cinema-foot{width:clamp(130px,27vw,300px);position:absolute;left:-32%;bottom:19%;animation:kickFoot 1.6s ease-in-out forwards;z-index:3}
#matchCinema .cinema-foot svg{display:block;width:100%;filter:drop-shadow(0 12px 12px #0009)}
#matchCinema .cinema-ball{font-size:clamp(55px,10vw,115px);position:absolute;left:48%;bottom:22%;animation:kickBall 1.6s ease-in forwards}
@keyframes cinemaFade{from{opacity:0}to{opacity:1}}@keyframes cinemaPop{from{transform:scale(.65);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes kickFoot{0%{left:-32%;transform:rotate(-12deg)}42%{left:calc(48% - clamp(125px,25vw,280px));transform:rotate(5deg)}60%,100%{left:calc(48% - clamp(125px,25vw,280px));transform:rotate(13deg)}}
@keyframes kickBall{0%,42%{left:48%;transform:rotate(0deg) scale(1)}100%{left:120%;transform:rotate(690deg) scale(.6)}}
@media(prefers-reduced-motion:reduce){#matchCinema *,#matchCinema{animation:none!important}}
