/* ============================================================
   CrazyViki — arène de duel (PC, scène 1920×1080). Toutes les dimensions sont en px de scène.
   Les couleurs de l'habillage passent par des variables --ar-* que themes.css redéfinit pour les styles A, B, C.
   ============================================================ */
.arene{
  --ar-tapis-bg:rgba(10,16,36,.62); --ar-tapis-bord:#e0b045; --ar-tapis-ombre:rgba(0,0,0,.45);
  --ar-plaque-bg:rgba(12,18,40,.78); --ar-plaque-fg:#fff; --ar-plaque-bord:#e0b045; --ar-plaque-sec:#cfd8f0;
  --ar-voile:linear-gradient(180deg,rgba(8,14,8,.35),rgba(8,14,10,.62)); --ar-or:#f7d774;
  --ar-bouton-bg:rgba(255,255,255,.1); --ar-bouton-fg:#fff;
  --ar-gagne:#7dffb2; --ar-perd:#ff9a9a; --ar-egal:#ffe08a;
  position:absolute;inset:0;z-index:40;overflow:hidden;color:#fff;font-family:var(--body,system-ui);user-select:none;-webkit-user-select:none;
  background:#10150f;animation:arene-entree .5s ease-out both}
@keyframes arene-entree{from{opacity:0}to{opacity:1}}
.arene *{box-sizing:border-box}
.arene-fond{position:absolute;inset:0;background:var(--ar-image) center/cover no-repeat;filter:blur(2px) saturate(1.1);transform:scale(1.04)}
.arene-fond::after{content:"";position:absolute;inset:0;background:var(--ar-voile),radial-gradient(ellipse at 50% 50%,transparent 45%,rgba(0,0,0,.55) 100%)}

/* ---------- en-tête ---------- */
.arene-haut{position:absolute;left:0;right:0;top:0;height:68px;display:flex;align-items:center;gap:16px;padding:0 36px;z-index:6;
  background:linear-gradient(rgba(0,0,0,.55),transparent)}
.arene-haut .espace{flex:1}
.arene-titre{font-family:var(--display,inherit);font-weight:700;font-size:30px;text-shadow:0 2px 6px rgba(0,0,0,.6);display:flex;gap:10px;align-items:center}
.arene-titre .pli-compteur{font-size:24px;font-weight:600;opacity:.85}
.arene-btn{font-family:var(--display,inherit);font-weight:600;font-size:22px;color:var(--ar-bouton-fg);background:var(--ar-bouton-bg);border:2px solid var(--ar-plaque-bord);
  border-radius:999px;padding:10px 26px;cursor:pointer;backdrop-filter:blur(4px)}
.arene-btn:hover{filter:brightness(1.2)}
.arene-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.arene-btn.primaire{background:linear-gradient(#ffa04a,#ff6a00);color:#fff;border-color:#ffd67a;box-shadow:0 5px 0 #a84300}

/* ---------- colonne gauche : identités + plis ---------- */
.arene-gauche{position:absolute;left:30px;top:84px;bottom:36px;width:324px;z-index:3}
.plaque{position:absolute;left:0;right:0;height:116px;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:20px;
  background:var(--ar-plaque-bg);color:var(--ar-plaque-fg);border:3px solid var(--ar-plaque-bord);box-shadow:0 10px 24px var(--ar-tapis-ombre);backdrop-filter:blur(5px)}
.plaque.ordi{top:0}.plaque.joueur{bottom:0}
.plaque .av{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;font-size:44px;background:rgba(255,255,255,.14);border:2px solid var(--ar-plaque-bord);flex:none;overflow:hidden}
.plaque .av .av-fond{width:100%;height:100%;border-radius:50%}
.plaque .av .av-img{width:48px;height:48px}
.plaque>div:nth-child(2){flex:1 1 0;min-width:0}
.plaque .nom{white-space:normal;text-overflow:clip;font-family:var(--display,inherit);font-weight:700;font-size:23px;line-height:1.05;max-height:70px;overflow:hidden;overflow-wrap:break-word;hyphens:manual}
.plaque .lib{font-size:16px;color:var(--ar-plaque-sec)}
.plaque .score{flex:none;margin-left:auto;text-align:center;line-height:1}
.plaque .score b{display:block;font-family:var(--display-carte,var(--display));font-size:44px;font-weight:900;color:var(--ar-or)}
.plaque .score i{font-style:normal;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--ar-plaque-sec)}
.score b.maj{animation:score-maj .6s ease-out}
@keyframes score-maj{0%{transform:scale(1)}35%{transform:scale(1.5);color:#fff}100%{transform:scale(1)}}
.plis{position:absolute;left:0;right:0;height:250px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;padding-bottom:6px}
.plis.ordi{top:150px}.plis.joueur{bottom:150px}
.plis .pile{position:relative;width:128px;height:179px;flex:none}
.plis .lib{order:-1;font-family:var(--display,inherit);font-weight:600;font-size:20px;text-shadow:0 2px 4px #000}
.plis .cpt{font-size:19px;font-weight:800;text-shadow:0 2px 4px #000;color:var(--ar-cpt,var(--ar-or))}

/* piles de cartes (dos empilés) */
.pile{position:relative}
.pile .couche{position:absolute;inset:0}
.pile.vide{border:3px dashed rgba(255,255,255,.35);border-radius:10px}
.dos-carte{width:100%;aspect-ratio:63/88;container-type:inline-size;border-radius:6.5% / 4.65%;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.5)}
.dos-carte svg{width:100%;height:100%;display:block}

/* ---------- centre ---------- */
.arene-centre{position:absolute;inset:0;z-index:2;pointer-events:none}
.arene-centre>*{pointer-events:auto}
.tapis{position:absolute;left:372px;width:1176px;top:128px;height:640px;border-radius:40px;background:var(--ar-tapis-bg);border:4px solid var(--ar-tapis-bord);
  box-shadow:inset 0 0 60px rgba(0,0,0,.35),0 16px 40px var(--ar-tapis-ombre);backdrop-filter:blur(3px);pointer-events:none}
.main-ordi{position:absolute;left:360px;width:1200px;top:-52px;height:170px;display:flex;justify-content:center;gap:10px;pointer-events:none}
.dos-main{width:116px;flex:none;transform-origin:50% 120%;transition:transform .3s}
.emp{position:absolute;left:872px;width:176px;height:246px;border:3px dashed rgba(255,255,255,.28);border-radius:14px}
.emp-ordi{top:172px}.emp-joueur{top:464px}
.vs{position:absolute;left:872px;width:176px;top:420px;height:44px;text-align:center;font-family:var(--display-carte,serif);font-weight:900;font-size:34px;letter-spacing:.2em;
  color:#fff2b8;text-shadow:0 0 16px #ffd65a,0 2px 0 #000;pointer-events:none;line-height:44px}
.vol{position:absolute;z-index:5;transform-origin:0 0;perspective:1400px}
.flip{position:relative;width:100%;aspect-ratio:63/88;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.3,.7,.2,1)}
.flip.dos{transform:rotateY(180deg)}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.face.verso{transform:rotateY(180deg)}
.vol.perdante{opacity:.55;transition:opacity .5s;filter:grayscale(.5)}

/* verdict à droite des cartes */
.verdict{position:absolute;left:1090px;top:172px;width:440px;height:538px;opacity:0;transition:opacity .4s;pointer-events:none}
.verdict.on{opacity:1}
.verdict .v-ordi,.verdict .v-joueur{position:absolute;left:0;width:100%;display:flex;flex-direction:column;gap:0;line-height:1.05}
.verdict .v-ordi{top:92px}.verdict .v-joueur{top:384px}
.verdict .who{font-family:var(--display,inherit);font-weight:600;font-size:22px;color:var(--ar-plaque-sec);text-shadow:0 2px 4px #000}
.verdict b{font-family:var(--display-carte,var(--display));font-weight:900;font-size:56px;text-shadow:0 3px 8px #000}
.verdict i{font-style:normal;font-size:20px;color:var(--ar-plaque-sec);text-shadow:0 2px 4px #000}
.verdict .v-res{position:absolute;left:0;top:222px;width:100%;font-family:var(--display,inherit);font-weight:700;font-size:34px;line-height:1.1;text-shadow:0 3px 8px #000}
.verdict .v-res small{display:block;font-size:20px;font-weight:600;margin-top:6px;opacity:.95}
.verdict.gagne .v-res{color:var(--ar-gagne)}
.verdict.perd .v-res{color:var(--ar-perd)}
.verdict.egal .v-res{color:var(--ar-egal)}
.verdict.gagne .v-joueur b,.verdict.perd .v-ordi b{color:var(--ar-gagne)}

.pot{position:absolute;left:392px;top:328px;width:150px;display:flex;flex-direction:column;align-items:center;gap:8px}
.pot[hidden]{display:none}
.pot .pile{width:96px;height:134px}
.pot .lib{font-family:var(--display,inherit);font-weight:600;font-size:18px;text-align:center;color:var(--ar-egal);text-shadow:0 2px 4px #000}
.invite{position:absolute;left:360px;width:1200px;top:722px;text-align:center;font-family:var(--display,inherit);font-weight:600;font-size:26px;text-shadow:0 2px 6px #000;pointer-events:none;height:36px}

/* ta main */
.main-joueur{position:absolute;left:360px;width:1200px;top:758px;height:300px;display:flex;justify-content:center;align-items:flex-end;gap:18px;pointer-events:none}
.carte-main{width:190px;flex:none;border:0;background:none;padding:0;cursor:pointer;pointer-events:auto;transform-origin:50% 100%;transition:transform .18s ease-out,filter .18s;position:relative;font:inherit;color:inherit;text-align:left}
.carte-main:hover,.carte-main:focus-visible{transform:translateY(-56px) scale(1.55);z-index:20;outline:none}
.carte-main::after{content:attr(data-num);position:absolute;left:50%;bottom:-26px;transform:translateX(-50%);font-family:var(--display);font-weight:600;font-size:18px;color:#fff;opacity:.55;text-shadow:0 2px 4px #000}
.carte-main:hover::after{opacity:0}

/* ---------- colonne droite : pioches ---------- */
.arene-droite{position:absolute;right:36px;top:84px;bottom:36px;width:230px;z-index:3}
.pioche{position:absolute;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:10px}
.pioche.ordi{top:40px}.pioche.joueur{bottom:40px;flex-direction:column-reverse}
.pioche .pile{width:150px;height:210px}
.pioche .lib{font-family:var(--display,inherit);font-weight:600;font-size:21px;text-shadow:0 2px 4px #000}

/* ---------- fin de partie / confirmation ---------- */
.fin,.confirmation{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:rgba(5,8,20,.72);backdrop-filter:blur(4px);animation:arene-entree .4s ease-out both}
.fin-boite{width:760px;padding:40px 48px;border-radius:30px;background:var(--ar-plaque-bg);color:var(--ar-plaque-fg);border:4px solid var(--ar-plaque-bord);text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.fin-boite h2{font-family:var(--display,inherit);font-size:62px;margin:0 0 6px;text-shadow:0 3px 10px rgba(0,0,0,.4)}
.fin.victoire h2{color:var(--ar-gagne)}.fin.defaite h2{color:var(--ar-perd)}.fin.nul h2{color:var(--ar-egal)}
.fin-sous{font-size:26px;margin:0 0 20px;color:var(--ar-plaque-sec)}
.fin-score{display:flex;justify-content:center;align-items:center;gap:40px;margin:10px 0 24px}
.fin-score>div{display:flex;flex-direction:column;align-items:center;gap:2px}
.fin-score span{font-family:var(--display,inherit);font-size:24px;color:var(--ar-plaque-sec)}
.fin-score b{font-family:var(--display-carte,var(--display));font-size:92px;line-height:1;color:var(--ar-or);font-weight:900}
.fin-score i{font-style:normal;font-size:20px;color:var(--ar-plaque-sec)}
.fin-score .tiret{font-size:60px;opacity:.5}
.fin-note{font-size:18px;color:var(--ar-plaque-sec);margin:0 0 18px}
.fin-actions{display:flex;gap:18px;justify-content:center}
.fin-actions .arene-btn{font-size:26px;padding:14px 34px}

@media (prefers-reduced-motion:reduce){.arene,.fin,.confirmation{animation:none}.score b.maj{animation:none}.flip{transition-duration:.15s}}

/* ---------- onglet « Duel » (hors arène) ---------- */
.duel-accueil{display:flex;flex-direction:column;gap:8px}
.duel-accueil>h2{margin:0}
.duel-regles{margin:0;padding-left:22px;display:block;columns:2;column-gap:36px;font-size:.95rem}.duel-regles li{break-inside:avoid;margin-bottom:2px}
.duel-deck{display:grid;grid-template-columns:repeat(10,92px);justify-content:space-between;gap:6px}
.duel-deck .mini{width:100%}
.duel-compo{display:flex;flex-wrap:wrap;gap:8px}
.duel-actions{display:flex;gap:14px;flex-wrap:wrap}
.duel-ambiance{display:flex;align-items:center;gap:12px;border-radius:14px;overflow:hidden;min-height:60px;position:relative;color:#fff;padding:6px 18px;background:#10150f center/cover}
.duel-ambiance::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.7),rgba(0,0,0,.15))}
.duel-ambiance>*{position:relative}
.duel-ambiance h3{font-size:1.4rem;margin:0}.duel-ambiance p{margin:0}

/* ---------- auras des cartes (comme à l'ouverture des boosters : couleur de la rareté ; Crazy = grosse aura ; Super = arcs noirs) ---------- */
.az,.vol{--aura:#d7dde8}
.az[data-rarete="inhabituel"],.vol[data-rarete="inhabituel"]{--aura:#2fe08a}
.az[data-rarete="rare"],.vol[data-rarete="rare"]{--aura:#3d9bff}
.az[data-rarete="epique"],.vol[data-rarete="epique"]{--aura:#c454ff}
.az[data-rarete="legendaire"],.vol[data-rarete="legendaire"]{--aura:#ff9a1f}
.az[data-rarete="mythique"],.vol[data-rarete="mythique"]{--aura:#ff2d3d}
.az{position:relative;isolation:isolate;display:block}
.aura-d{position:absolute;inset:0;border-radius:6.5% / 4.65%;pointer-events:none;z-index:-1;font-style:normal;opacity:.75;transition:opacity .3s;
  box-shadow:0 0 7px 2px var(--aura),0 0 20px 6px color-mix(in srgb,var(--aura) 55%,transparent),0 0 40px 12px color-mix(in srgb,var(--aura) 20%,transparent);animation:aura-respire 2.6s ease-in-out infinite}
.az[data-rarete="mythique"] .aura-d,.vol[data-rarete="mythique"] .aura-d{box-shadow:0 0 9px 3px var(--aura),0 0 28px 9px color-mix(in srgb,var(--aura) 60%,transparent),0 0 60px 20px color-mix(in srgb,var(--aura) 24%,transparent)}
.az.crazy .aura-d,.vol.crazy .aura-d{border-radius:7.5% / 5.37%;box-shadow:0 0 12px 5px #fff,0 0 50px 20px var(--aura),0 0 110px 44px color-mix(in srgb,var(--aura) 70%,transparent)}
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.az.super .aura-d::before,.vol.super .aura-d::before{content:"";position:absolute;inset:-12px;padding:12px;box-sizing:border-box;border-radius:calc(6.5% + 11px) / calc(4.653% + 11.5px);z-index:1;pointer-events:none;
  background:conic-gradient(from var(--ang),transparent 0deg,rgba(0,0,0,.9) 30deg,#000 60deg,#000 100deg,rgba(0,0,0,.9) 130deg,transparent 170deg,transparent 190deg,rgba(0,0,0,.9) 220deg,#000 250deg,#000 290deg,rgba(0,0,0,.9) 320deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  filter:blur(3px);animation:aura-orbite 3.4s linear infinite}
.az.super.crazy .aura-d::before,.vol.super.crazy .aura-d::before{border-radius:calc(7.5% + 10.5px) / calc(5.369% + 11px)}
@keyframes aura-orbite{to{--ang:360deg}}
@keyframes aura-respire{0%,100%{opacity:.6}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.aura-d,.az.super .aura-d::before,.vol.super .aura-d::before{animation:none}}
/* sur le tapis : l'aura n'existe qu'une fois la carte posée et retournée */
.vol .aura-d{opacity:0;animation:none}
.vol.revele .aura-d{opacity:.85;animation:aura-respire 2.6s ease-in-out infinite}
.vol.crazy .aura-d,.vol.super .aura-d{box-shadow:0 0 12px 5px #fff,0 0 50px 20px var(--aura),0 0 110px 44px color-mix(in srgb,var(--aura) 70%,transparent)}
.vol.super:not(.crazy) .aura-d{box-shadow:0 0 7px 2px var(--aura),0 0 20px 6px color-mix(in srgb,var(--aura) 55%,transparent),0 0 40px 12px color-mix(in srgb,var(--aura) 20%,transparent)}
/* la carte gagnante : SA propre aura (rareté / Crazy / Super), amplifiée */
.vol.gagnante{transition:opacity .4s}
.vol.gagnante .flip{transform:scale(1.07);transition:transform .5s cubic-bezier(.3,.7,.2,1)}
.vol.gagnante .aura-d{opacity:1;animation:aura-victoire 1.1s ease-in-out infinite;
  box-shadow:0 0 16px 8px var(--aura),0 0 48px 22px color-mix(in srgb,var(--aura) 80%,transparent),0 0 110px 50px color-mix(in srgb,var(--aura) 42%,transparent)}
.vol.gagnante.crazy .aura-d{box-shadow:0 0 22px 10px #fff,0 0 90px 40px var(--aura),0 0 190px 90px color-mix(in srgb,var(--aura) 75%,transparent)}
.vol.gagnante.super:not(.crazy) .aura-d{box-shadow:0 0 16px 8px var(--aura),0 0 48px 22px color-mix(in srgb,var(--aura) 80%,transparent),0 0 110px 50px color-mix(in srgb,var(--aura) 42%,transparent)}
@keyframes aura-victoire{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.06);opacity:1}}
.vol.perdante .aura-d{opacity:.25;animation:none}
/* main de dos (version « bataille ») : cartes non retournées, sans aura */
.carte-main.de-dos{transition:transform .18s ease-out}
.carte-main.de-dos:hover,.carte-main.de-dos:focus-visible{transform:translateY(-30px) scale(1.08)}
.carte-main.de-dos .dos-carte{box-shadow:0 6px 14px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.5)}
.carte-main.de-dos:hover .dos-carte{box-shadow:0 10px 22px rgba(0,0,0,.6),0 0 0 2px rgba(255,255,255,.55)}
/* choix de la version dans l'onglet Duel */
.duel-version{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.duel-version .puce{padding:10px 16px;font-size:1rem}

/* CrazyDuel : annonce du changement de face de la main */
.annonce-crazy{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);z-index:15;padding:16px 34px;border-radius:999px;pointer-events:none;
  font-family:var(--display,inherit);font-weight:700;font-size:30px;color:#fff;background:linear-gradient(90deg,#8a2be2,#ff5a1f);border:3px solid #ffd67a;
  box-shadow:0 0 30px rgba(180,80,255,.7),0 10px 30px rgba(0,0,0,.5);animation:annonce-crazy 2.6s ease-out both;white-space:nowrap}
.annonce-crazy.dos{background:linear-gradient(90deg,#5a1fd0,#c4167a)}
@keyframes annonce-crazy{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}12%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}20%{transform:translate(-50%,-50%) scale(1)}85%{opacity:1}100%{opacity:0}}
.arene[data-mode="crazyduel"] .arene-titre{color:#ffd1ff}

/* aperçu du dernier pli remporté (survol des piles de plis) */
.plis{cursor:help;outline:none}
.plis .pile{transition:transform .2s}
.plis:hover .pile,.plis:focus-visible .pile{transform:translateY(-4px) scale(1.04)}
.dernier-pli{position:absolute;left:386px;z-index:12;pointer-events:none;padding:14px 20px 12px;border-radius:22px;background:var(--ar-plaque-bg);color:var(--ar-plaque-fg);
  border:3px solid var(--ar-plaque-bord);box-shadow:0 14px 40px rgba(0,0,0,.55);backdrop-filter:blur(6px);animation:dp-entree .22s ease-out both}
.dernier-pli.cote-o{top:132px}.dernier-pli.cote-j{top:388px}
.dernier-pli.vide{padding:14px 22px}
.dp-titre{font-family:var(--display,inherit);font-weight:700;font-size:22px;margin-bottom:10px;text-align:center}
.dp-cartes{display:flex;gap:30px;justify-content:center}
.dp-col{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:.78}
.dp-col.gagne{opacity:1}
.dp-who{font-family:var(--display,inherit);font-weight:600;font-size:19px;color:var(--ar-plaque-sec)}
.dp-carte{width:150px}
.dp-col b{font-family:var(--display-carte,var(--display));font-size:28px;font-weight:900;color:var(--ar-or);line-height:1}
.dp-col b i{font-style:normal;font-size:15px;font-weight:600;color:var(--ar-plaque-sec)}
.dp-bas{margin-top:12px;text-align:center;font-weight:700;font-size:20px;color:var(--ar-or)}
@keyframes dp-entree{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}

/* étiquette BETA (modes en test) */
.beta{display:inline-block;vertical-align:middle;margin:0 2px;padding:2px 9px;border-radius:8px;font-family:var(--display,inherit);font-size:.55em;font-weight:800;letter-spacing:.12em;color:#2a0a40;background:linear-gradient(#ffe27a,#ffb300);border:2px solid #fff3b8;box-shadow:0 0 10px rgba(255,200,60,.6);transform:translateY(-2px)}

/* ============================================================ DUEL EN LIGNE (25/10/2026) ============================================================ */
/* onglet Duel : deux blocs (en ligne / ordinateur) */
.duel-bloc{display:flex;flex-direction:column;gap:6px;padding:10px 16px;border-radius:14px;background:rgba(128,128,128,.07);border:1px solid rgba(128,128,128,.2)}
.duel-bloc>h3{margin:0;font-size:1.25rem}
.duel-bloc .duel-sous{font-size:1.05rem;margin-top:2px}
.duel-bloc p{margin:0}
.duel-ligne{border-color:rgba(61,155,255,.5);background:linear-gradient(90deg,rgba(61,155,255,.12),rgba(61,155,255,.03));display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:18px;align-items:center}
.duel-ligne>h3{grid-column:1}.duel-ligne>p{grid-column:1}
.duel-ligne>.duel-actions{grid-column:2;grid-row:1/3;flex-wrap:nowrap}
/* adversaire : indicateur d'état sous son nom */
.plaque .etat{font-size:15px;color:var(--ar-plaque-sec);display:flex;align-items:center;gap:6px;margin-top:2px}
.plaque .etat[hidden]{display:none}
.plaque .etat .pt{width:9px;height:9px;border-radius:50%;background:#7dffb2;box-shadow:0 0 8px #7dffb2;display:inline-block;flex:none}
.plaque .etat .pt.attend{background:#ffe08a;box-shadow:0 0 8px #ffe08a;animation:pt-cligne 1s ease-in-out infinite}
.plaque .etat .pt.hors{background:#ff9a9a;box-shadow:0 0 8px #ff9a9a}
@keyframes pt-cligne{50%{opacity:.35}}
/* le joueur qui joue EN PREMIER ce pli : aura de SA couleur de profil autour de sa plaque (alterne à chaque pli) */
.plaque{transition:box-shadow .5s,border-color .5s}
.plaque.premier{border-color:var(--jc,#fff);box-shadow:0 0 0 2px color-mix(in srgb,var(--jc,#fff) 70%,transparent),0 0 26px 6px color-mix(in srgb,var(--jc,#fff) 75%,transparent),0 0 70px 18px color-mix(in srgb,var(--jc,#fff) 35%,transparent),0 10px 24px var(--ar-tapis-ombre);
  animation:plaque-premier 2.6s ease-in-out infinite}
@keyframes plaque-premier{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18)}}
.plaque .premier-tag{position:absolute;right:14px;top:-15px;font:700 14px var(--display,inherit);letter-spacing:.08em;text-transform:uppercase;color:#231700;background:var(--jc,#fff);border-radius:999px;padding:3px 12px;box-shadow:0 3px 10px rgba(0,0,0,.5)}
.plaque:not(.premier) .premier-tag{display:none}
/* chrono du pli (en-tête, en ligne seulement) */
.chrono{display:flex;align-items:center;gap:10px;font-family:var(--display,inherit);font-weight:700;font-size:26px;text-shadow:0 2px 6px rgba(0,0,0,.6)}
.chrono[hidden]{display:none}
.chrono .anneau{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:20px;position:relative;
  background:conic-gradient(var(--ar-or) calc(var(--p,1)*360deg),rgba(255,255,255,.15) 0)}
.chrono .anneau::before{content:"";position:absolute;inset:5px;border-radius:50%;background:rgba(12,18,40,.92)}
.chrono .anneau b{position:relative;font-family:var(--display,inherit)}
.chrono.urgent .anneau{background:conic-gradient(#ff5a5a calc(var(--p,1)*360deg),rgba(255,255,255,.15) 0);animation:pt-cligne .6s ease-in-out infinite}
/* attente de l'adversaire (centre, sous la carte posée) */
.attente-adv{position:absolute;left:360px;width:1200px;top:722px;text-align:center;font-family:var(--display,inherit);font-weight:600;font-size:26px;text-shadow:0 2px 6px #000;pointer-events:none;height:36px;color:#ffe08a}
.attente-adv i{display:inline-block;width:10px;height:10px;border-radius:50%;background:#ffe08a;margin:0 3px;animation:pt-saut 1.2s ease-in-out infinite}
.attente-adv i:nth-child(2){animation-delay:.2s}.attente-adv i:nth-child(3){animation-delay:.4s}
@keyframes pt-saut{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-8px);opacity:1}}
/* bandeau « adversaire déconnecté » */
.deco{position:absolute;left:50%;top:94px;transform:translateX(-50%);z-index:16;display:flex;align-items:center;gap:16px;padding:14px 30px;border-radius:999px;white-space:nowrap;
  font-family:var(--display,inherit);font-weight:700;font-size:26px;color:#fff;background:linear-gradient(90deg,#8a1e1e,#c0392b);border:3px solid #ffb3a7;box-shadow:0 0 30px rgba(255,80,80,.6),0 10px 30px rgba(0,0,0,.5);animation:dp-entree .3s ease-out both}
.deco b{font-size:34px;color:#ffe08a;min-width:70px;text-align:center}
.deco small{display:block;font-size:17px;font-weight:600;opacity:.9}
/* ---------- écran de recherche d'un adversaire ---------- */
.recherche{position:absolute;inset:0;z-index:40;display:grid;place-items:center;color:#fff;background:#10150f;overflow:hidden;font-family:var(--body,system-ui);animation:arene-entree .4s ease-out both}
.recherche *{box-sizing:border-box}
.recherche .fond{position:absolute;inset:0;background:var(--ar-image) center/cover no-repeat;filter:blur(6px) brightness(.45) saturate(1.1);transform:scale(1.05)}
.recherche .boite{position:relative;width:860px;padding:40px 48px 36px;border-radius:32px;background:rgba(12,18,40,.78);border:4px solid #e0b045;
  box-shadow:0 24px 60px rgba(0,0,0,.6);backdrop-filter:blur(8px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.recherche h2{font-family:var(--display,inherit);font-size:46px;margin:0;text-shadow:0 3px 10px rgba(0,0,0,.5)}
.radar{position:relative;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(125,255,178,.08),rgba(0,0,0,.2) 70%);border:3px solid rgba(125,255,178,.55);box-shadow:0 0 40px rgba(125,255,178,.25),inset 0 0 40px rgba(0,0,0,.4)}
.radar::before,.radar::after{content:"";position:absolute;border-radius:50%;border:2px solid rgba(125,255,178,.35)}
.radar::before{inset:38px}.radar::after{inset:80px}
.radar .balayage{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(125,255,178,0) 0deg,rgba(125,255,178,.55) 40deg,transparent 60deg);animation:radar 2.4s linear infinite}
@keyframes radar{to{transform:rotate(360deg)}}
.radar .moi{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px;border-radius:50%;display:grid;place-items:center;font-size:48px;background:rgba(255,255,255,.14);border:3px solid #e0b045;box-shadow:0 0 24px var(--jc,#fff);overflow:hidden}
.radar .moi .av-fond{width:100%;height:100%}
.radar .moi .av-img{width:48px;height:48px}
.radar .ping{position:absolute;width:14px;height:14px;border-radius:50%;background:#7dffb2;box-shadow:0 0 14px #7dffb2;animation:ping 2.4s ease-out infinite}
.radar .ping.p1{left:56px;top:64px;animation-delay:.4s}.radar .ping.p2{left:166px;top:140px;animation-delay:1.5s}
@keyframes ping{0%,70%{opacity:0;transform:scale(.4)}78%{opacity:1;transform:scale(1.2)}100%{opacity:0;transform:scale(1)}}
.recherche .rch-texte{font-family:var(--display,inherit);font-weight:600;font-size:30px;color:#cfd8f0}
.recherche.trouve .rch-texte{color:#7dffb2}
.recherche .temps{font-family:var(--display-carte,var(--display));font-weight:900;font-size:60px;line-height:1;color:#f7d774;text-shadow:0 3px 8px #000}
.recherche .deck{display:flex;align-items:center;gap:12px;font-size:20px;color:#cfd8f0}
.recherche .deck b{color:#fff}
.recherche .mini-deck{display:flex}
.recherche .mini-deck .dos-carte{width:46px;margin-left:-14px;box-shadow:0 4px 10px rgba(0,0,0,.6)}
.recherche .mini-deck .dos-carte:first-child{margin-left:0}
.recherche .actions{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}
.recherche .actions .arene-btn{font-size:24px;padding:12px 30px}
.recherche .actions [hidden]{display:none}
.recherche .long{font-size:21px;color:#ffe08a;margin:0;font-weight:700}
.recherche .long[hidden],.recherche .erreur[hidden]{display:none}
.recherche .erreur{font-size:20px;color:#ff9a9a;margin:0;font-weight:700;max-width:720px}
@media (prefers-reduced-motion:reduce){.radar .balayage,.radar .ping,.plaque.premier,.attente-adv i,.chrono.urgent .anneau{animation:none}}
