/* optionnels/arene/arene.css — arène de survie (module optionnel, chargé par brancherArene)
   Extrait de styles.css à l'étape 8 du découpage. L'ordre de chargement (index.html) est celui
   de l'ancienne feuille : à spécificité égale, la dernière règle l'emporte (voir CARTE.md, CSS). */
 /* >>> ARÈNE DE SURVIE, CSS : début (inséré par outils/arene/migrate_arena.py) */
 /* ================= ARÈNE DE SURVIE (mini-jeu) =================
    Calque plein écran .arena-root ajouté à body par ArenaGame (section JS « MINI-JEU : ARÈNE
    DE SURVIE ») : un canevas posé sur la zone du tableau, une barre de jeu, des écrans
    (accueil, pause, améliorations, fin, meilleurs scores) et une bulle d'annonce.
    Tous les sélecteurs sont préfixés arena- ; seule exception, .card.arena-shake (la vraie
    carte du tableau tremble avant qu'une bestiole en jaillisse).
    Exception assumée aux conventions : dimensions en px fixes, sans --ui-scale-factor. Le jeu
    est un calque autonome, identique à 75 % et à 100 % ; ses couleurs sont celles de
    l'identité ColorKanva (logo, intro), indépendantes des thèmes. */
 .arena-root{position:fixed;inset:0;z-index:9000;display:none;user-select:none;-webkit-user-select:none;touch-action:none;
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;color:#e7e9ee;
  /* Accent du menu : dégradé « braise » (rouge → orange → or), remplace l'ancien arc-en-ciel. */
  --arena-accent:linear-gradient(90deg,#e4332f 0%,#ff5a2a 28%,#ff8a1f 55%,#ffb52e 78%,#ffd873 100%);}
 .arena-root.open{display:block;}
 /* Voile sur l'application ; plus sombre (dim) quand un écran est ouvert. */
 .arena-root::before{content:"";position:absolute;inset:0;background:rgba(7,8,12,.26);transition:background .35s ease;}
 .arena-root.dim::before{background:rgba(7,8,12,.62);}
 body.arena-on .shortcuts-hint,body.arena-on .brand-signature,body.arena-on .tech-signature{visibility:hidden;}
 /* Deux canevas superposés sur la zone du tableau : le sol (voile, ombres, taches ; repeint
    seulement quand une tache s'ajoute) et, au-dessus, le jeu (repeint à chaque image). */
 .arena-floor{position:absolute;pointer-events:none;background:rgba(7,8,12,.22);transition:filter .35s ease;}
 .arena-canvas{position:absolute;cursor:none;transition:filter .35s ease;}
 .arena-root.dim .arena-canvas,.arena-root.dim .arena-floor{filter:brightness(.5) saturate(.85);}
 /* Nid : la vraie carte du tableau tremble juste avant qu'une bestiole en jaillisse. */
 .card.arena-shake{animation:arenaShake .1s linear 6;}
 @keyframes arenaShake{25%{transform:translate(-2px,1px) rotate(-1deg);}75%{transform:translate(2px,-1px) rotate(1deg);}}

 /* Barre de jeu, style arcade : bandeau tout en haut de l'écran, d'un bord à l'autre, par-dessus
    la barre du haut de l'application (position et taille posées par layout() : HUD_H de haut).
    Il ne cache rien du terrain. Opaque, sans flou d'arrière-plan (il serait recalculé à chaque
    image au-dessus du canevas). Visible seulement pendant une partie. Police « affiche »
    (Bungee si elle est installée, sinon Arial Black) : aucune police distante (CSP). */
 .arena-hud{position:absolute;z-index:20;box-sizing:border-box;display:flex;align-items:center;gap:16px;
  padding:0 14px 4px;opacity:0;pointer-events:none;cursor:default;font-size:12px;color:#b9a3ad;white-space:nowrap;
  font-family:'Bungee','Arial Black',Impact,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.02em;
  background:linear-gradient(180deg,#1a1019,#120c14);box-shadow:0 6px 22px rgba(0,0,0,.45);transition:opacity .3s;}
 .arena-root.playing .arena-hud{opacity:1;pointer-events:auto;}
 /* Entre le bandeau et le haut du tableau, le reste de la barre de l'application est voilé (--gap posé par layout()). */
 .arena-hud::after{content:"";position:absolute;left:0;right:0;top:100%;height:var(--gap,0px);background:rgba(18,12,20,.9);pointer-events:none;}
 /* Expérience : le liseré jaune du bas se remplit jusqu'à la prochaine amélioration. */
 .arena-hud-xp{position:absolute;left:0;right:0;bottom:0;height:4px;background:#3a2a1a;}
 .arena-hud-xp i{display:block;height:100%;width:0;background:#ffd63d;box-shadow:0 0 8px rgba(255,214,61,.7);transition:width .2s ease;}
 .arena-hud-l{display:flex;align-items:center;gap:12px;min-width:150px;}
 .arena-hud-time{font-size:24px;font-weight:400;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 2px 0 #000;}
 .arena-hud-sub{display:flex;flex-direction:column;gap:1px;line-height:1.1;}
 .arena-hud-pts{font-size:13px;font-weight:400;color:#ffd63d;font-variant-numeric:tabular-nums;}
 .arena-hud-lvl{font-size:10px;color:#fff;}
 .arena-hud-xpt{font-size:9px;color:#b9a3ad;font-variant-numeric:tabular-nums;}
 /* Jauges épaisses, graduées, le nombre dedans : vie (ou blindage du véhicule), gilet, boss. */
 .arena-gauge{display:flex;align-items:center;gap:7px;flex:none;font-variant-numeric:tabular-nums;}
 .arena-gauge[hidden]{display:none;}
 .arena-gauge-track{position:relative;display:block;width:250px;height:22px;box-sizing:border-box;border:2px solid #fff;border-radius:4px;background:#2b1f2c;overflow:hidden;}
 .arena-gauge-track i{position:absolute;inset:0 auto 0 0;width:0;transition:width .2s ease;}
 .arena-gauge-track em{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 2px),rgba(0,0,0,.55) calc(10% - 2px) 10%);}
 .arena-gauge-track b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.35em;font-size:12px;font-weight:400;color:#fff;text-shadow:0 1px 0 #000,0 0 4px #000;}
 .arena-gauge-hp i{width:100%;background:linear-gradient(180deg,#ff6b8f,#d01848);}
 .arena-gauge-hp.tank i{background:linear-gradient(180deg,#c3d86a,#7d9a3a);}
 .arena-gauge-hp.low .arena-gauge-track{animation:arenaLow .6s ease-in-out infinite alternate;}
 @keyframes arenaLow{to{box-shadow:0 0 0 3px rgba(255,53,109,.6);}}
 .arena-gauge-vest .arena-gauge-track{width:150px;border-color:#8cc8ff;}
 .arena-gauge-vest i{background:linear-gradient(180deg,#8cc8ff,#2f6bff);}
 .arena-gauge-vest.hit .arena-gauge-track{box-shadow:0 0 0 3px rgba(140,200,255,.7),0 0 14px rgba(80,150,255,.9);}
 .arena-gauge-boss{--bc:#ff356d;}
 .arena-gauge-boss .arena-gauge-track{width:220px;border-color:var(--bc);}
 .arena-gauge-boss i{background:var(--bc);box-shadow:0 0 10px var(--bc);}
 .arena-gauge-boss b{max-width:100%;overflow:hidden;text-overflow:ellipsis;}
 /* Cadre de l'arme : icône, nom, crans de niveau (pleins = acquis). */
 .arena-hud-wp{display:flex;align-items:center;gap:10px;margin-left:auto;padding:4px 12px;box-sizing:border-box;height:30px;
  border:2px solid var(--wc,#ff356d);border-radius:8px;background:#2b1f2c;color:#fff;}
 .arena-hud-wp b{font-weight:400;font-size:13px;color:#fff;}
 .arena-hud-wpl{display:flex;gap:3px;}
 .arena-hud-wpl:empty{display:none;}
 .arena-hud-wpl i{width:10px;height:14px;background:#ffd63d;transform:skewX(-15deg);}
 .arena-hud-wpl i.off{background:#4a3a4c;}
 .arena-hud-stats{display:flex;align-items:center;gap:12px;font-size:11px;}
 .arena-stat b{color:#fff;font-weight:400;}
 .arena-hud-btns{display:flex;gap:5px;}
 /* Fenêtre étroite : on garde l'essentiel (temps, jauges, arme, boutons). */
 @media (max-width:1180px){.arena-hud-stats{display:none;}}
 @media (max-width:900px){.arena-hud-sub,.arena-hud-wp b{display:none;}.arena-hud{gap:10px;}.arena-gauge-track{width:170px;}}
 .arena-stat{font-variant-numeric:tabular-nums;}
 .arena-stat::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:.5px;}
 .arena-stat-pop::before{background:#3cde8f;box-shadow:0 0 8px #3cde8f;}
 .arena-stat-dash::before{background:#31adff;box-shadow:0 0 8px #31adff;}
 .arena-stat-dash.wait{opacity:.5;}
 .arena-stat-auto::before{background:#ffffff;box-shadow:0 0 8px #ffffff;}
 .arena-stat-auto[hidden]{display:none;}
 .arena-icon-btn{width:28px;height:28px;border-radius:6px;border:2px solid #4a3a4c;background:#2b1f2c;color:#fff;
  display:grid;place-items:center;font-size:16px;line-height:1;padding:0;cursor:pointer;transition:border-color .15s,background .15s;}
 .arena-icon-btn:hover{border-color:#ffd63d;background:#3a2a3c;}
 .arena-icon-btn:focus-visible{outline:2px solid #ffd63d;outline-offset:1px;}
 .arena-icon-btn svg{width:14px;height:14px;}
 /* Bulle d'annonce en bas de l'arène, au centre (position posée par layout()). */
 .arena-toast{position:absolute;z-index:20;transform:translate(-50%,-6px);opacity:0;pointer-events:none;white-space:nowrap;
  display:flex;align-items:center;gap:8px;padding:6px 14px 6px 10px;border-radius:999px;font-size:12px;color:#c9ced8;
  background:rgba(20,23,33,.95);border:1px solid rgba(255,255,255,.1);transition:opacity .25s,transform .25s;}
 .arena-toast.show{opacity:1;transform:translate(-50%,0);}
 .arena-toast b{color:#fff;font-weight:700;}
 /* Grande annonce au milieu de l'arène : arrivée d'un boss, série de combos. Ne bloque rien. */
 .arena-banner{position:absolute;z-index:21;transform:translate(-50%,0);pointer-events:none;text-align:center;opacity:0;white-space:nowrap;
  padding:14px 40px 16px;border-radius:24px;background:radial-gradient(closest-side,rgba(8,10,16,.82),rgba(8,10,16,.6) 65%,transparent);}
 .arena-banner.show{animation:arenaBanner var(--d,2.4s) cubic-bezier(.2,.9,.3,1) both;}
 .arena-banner small{display:block;font-size:12px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--bc,#ff8f36);
  text-shadow:0 2px 10px rgba(0,0,0,.6);}
 .arena-banner b{display:block;margin-top:2px;font-size:44px;font-weight:900;letter-spacing:-.03em;line-height:1.05;color:#fff;
  text-shadow:0 0 24px var(--bc,#ff8f36),0 4px 16px rgba(0,0,0,.7);}
 .arena-banner span{display:block;margin-top:6px;font-size:14px;font-weight:650;color:#e7e9ee;text-shadow:0 2px 8px rgba(0,0,0,.8);}
 .arena-banner.combo b{font-size:38px;}
 @keyframes arenaBanner{0%{opacity:0;transform:translate(-50%,10px) scale(.7);}12%{opacity:1;transform:translate(-50%,0) scale(1.06);}
  20%{transform:translate(-50%,0) scale(1);}80%{opacity:1;}100%{opacity:0;transform:translate(-50%,-8px) scale(.98);}}

 /* Écrans (accueil, pause, améliorations, fin, scores) : carte vitrée de l'intro, liseré
    multicolore en tête, défilement interne si la fenêtre est basse. */
 .arena-panel-wrap{position:absolute;inset:0;z-index:30;display:none;align-items:center;justify-content:center;padding:16px;}
 .arena-panel-wrap.show{display:flex;}
 .arena-panel{position:relative;box-sizing:border-box;width:min(620px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:34px 28px 22px;border-radius:18px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;
  background:linear-gradient(160deg,rgba(35,40,55,.97),rgba(17,21,34,.98));border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 90px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.07) inset;animation:arenaIn .42s cubic-bezier(.15,1.2,.3,1) both;}
 .arena-panel::before{content:"";position:absolute;left:18px;right:18px;top:14px;height:5px;border-radius:5px;background:var(--arena-accent);box-shadow:0 0 18px rgba(255,110,40,.35);}
 /* Défilement (seulement si la fenêtre est trop petite) : barre fine, arrondie, intégrée. */
 .arena-panel::-webkit-scrollbar{width:10px;}
 .arena-panel::-webkit-scrollbar-track{background:transparent;margin:18px 0;}
 .arena-panel::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border:3px solid transparent;border-radius:10px;background-clip:padding-box;}
 .arena-panel::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,.3);}
 /* Volume du jeu, dans la pause. */
 .arena-volume{display:flex;align-items:center;gap:12px;margin:14px 0 4px;color:#c9cfdb;font-size:14px;}
 .arena-volume input{flex:1;max-width:260px;accent-color:#ff8a1f;}
 .arena-volume output{min-width:3.5em;color:#e7e9ee;font-variant-numeric:tabular-nums;}
 /* Accueil au format large (16/9) : titre et mode sur une ligne, deux colonnes dessous. */
 .arena-panel.wide{width:min(1120px,100%);padding:30px 30px 18px;}
 .arena-head{display:flex;align-items:center;justify-content:space-between;gap:20px;}
 .arena-best{font-size:12.5px;color:#8891a3;white-space:nowrap;}
 .arena-best b{color:#e7e9ee;font-variant-numeric:tabular-nums;}
 .arena-cols{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;margin-top:12px;}
 .arena-cols h3{margin:0 0 7px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8891a3;}
 .arena-cols .arena-legend{grid-template-columns:repeat(2,minmax(0,1fr));margin:0;}
 .arena-cols .arena-crates{margin:0 0 12px;row-gap:4px;}
 .arena-cols .arena-keys{margin-top:10px;}
 .arena-chip-wide{grid-column:1/-1;}
 @media (max-width:900px){.arena-cols{grid-template-columns:1fr;}.arena-head{flex-wrap:wrap;}}
 @keyframes arenaIn{from{opacity:0;transform:translateY(14px) scale(.96);}to{opacity:1;transform:none;}}
 .arena-title{margin:6px 0 8px;font-weight:900;font-size:30px;line-height:1.05;letter-spacing:-.045em;
  background:var(--arena-accent);-webkit-background-clip:text;background-clip:text;color:transparent;}
 .arena-panel p{margin:0 0 4px;font-size:13.5px;line-height:1.55;color:#aeb5c4;}
 .arena-hint{margin-top:12px;text-align:center;font-size:11.5px;color:#5c6376;}
 .arena-link{padding:0;border:0;background:none;color:#e7e9ee;font:inherit;font-weight:650;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
 .arena-link:hover{color:#ffd63d;}
 .arena-actions{display:flex;gap:10px;margin-top:20px;}
 .arena-btn{flex:1;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);
  color:#e7e9ee;font:inherit;font-size:13.5px;font-weight:650;cursor:pointer;transition:transform .12s,background .15s,box-shadow .15s;}
 .arena-btn:hover{background:rgba(255,255,255,.1);}
 .arena-btn:active{transform:scale(.97);}
 .arena-btn:focus-visible{outline:2px solid #31adff;outline-offset:2px;}
 .arena-btn.primary{border:none;color:#fff;background:linear-gradient(100deg,#e4332f,#ff7a24 58%,#ffb52e);
  box-shadow:0 8px 24px rgba(255,100,40,.32);text-shadow:0 1px 2px rgba(0,0,0,.25);}
 .arena-btn.primary:hover{box-shadow:0 10px 30px rgba(255,100,40,.45);}

 /* Accueil : légende des bestioles, caisses, touches. */
 .arena-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 14px;margin:16px 0;padding:14px;border-radius:12px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);}
 .arena-chip{display:flex;align-items:center;gap:10px;min-width:0;}
 .arena-chip span:last-child{min-width:0;}
 .arena-chip b{display:block;font-size:12.5px;font-weight:650;color:#e7e9ee;}
 .arena-chip small{display:block;font-size:11.5px;color:#8891a3;}
 .arena-mini{flex:none;width:16px;height:16px;border-radius:50% 50% 46% 46%;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.66) 0 11%,transparent 40%),var(--c);
  box-shadow:0 0 10px color-mix(in srgb,var(--c) 55%,transparent);}
 .arena-mini-fusion{background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.66) 0 11%,transparent 40%),linear-gradient(90deg,#29d4d0 45%,#31adff 55%);box-shadow:0 0 10px rgba(49,173,255,.5);}
 .arena-mini-big{width:20px;height:20px;}
 .arena-cols .arena-legend-boss{gap:8px 14px;padding:12px 14px;border-color:rgba(255,120,60,.18);background:rgba(255,120,60,.04);}
 .arena-cols .arena-h3-boss{margin-top:12px;}
 .arena-boss-pic{flex:none;width:40px;height:40px;margin:-6px -2px;}
 .arena-crates{display:flex;flex-wrap:wrap;gap:6px 14px;margin:6px 0 12px;padding:8px 10px;border-radius:12px;font-size:12px;color:#c9ced8;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);}
 .arena-crates span{display:inline-flex;align-items:center;gap:6px;}
 /* Petits dessins des armes et des bonus (images générées par le jeu, voir iconImg). */
 .arena-ico{flex:none;width:33px;height:22px;object-fit:contain;}
 .arena-toast .arena-ico{width:24px;height:16px;}
 .arena-keys{display:flex;flex-wrap:wrap;gap:7px 14px;margin:14px 0 2px;font-size:11.5px;color:#8891a3;}
 .arena-keys span{display:inline-flex;align-items:center;gap:5px;}
 .arena-keys kbd{display:inline-block;min-width:18px;padding:1px 5px;border-radius:5px;text-align:center;font:700 10.5px system-ui,sans-serif;
  color:#e7e9ee;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-bottom-width:2px;}
 @media (max-width:700px){.arena-legend{grid-template-columns:1fr 1fr;}}

 /* Cartes d'amélioration (toutes les 100 éclatées), à la manière des cartes du tableau. */
 .arena-ups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 6px;}
 .arena-up{position:relative;display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;min-height:132px;padding:14px 12px 12px 16px;border-radius:12px;cursor:pointer;
  color:#e7e9ee;font:inherit;background:#1b2130;border:1px solid rgba(255,255,255,.08);box-shadow:0 8px 22px rgba(0,0,0,.3);transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;overflow:hidden;}
 .arena-up::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c);}
 .arena-up:hover,.arena-up:focus-visible{transform:translateY(-3px);border-color:var(--c);box-shadow:0 12px 28px rgba(0,0,0,.4),0 0 18px color-mix(in srgb,var(--c) 35%,transparent);outline:none;}
 .arena-up b{font-size:14px;color:var(--c);}
 .arena-up small{font-size:12px;line-height:1.35;color:#c9ced8;}
 .arena-up span{margin-top:auto;font-size:10.5px;color:#8891a3;text-transform:uppercase;letter-spacing:.04em;}
 .arena-up kbd{position:absolute;top:8px;right:9px;min-width:18px;padding:1px 5px;border-radius:5px;font:700 10px system-ui,sans-serif;color:#aeb5c4;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);}
 @media (max-width:600px){.arena-ups{grid-template-columns:1fr;}.arena-up{min-height:0;}}
 /* Choix du héros (à chaque ouverture) : 12 vignettes animées, 6 par ligne. */
 .arena-heroes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:14px 0 4px;}
 .arena-hero{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 6px 9px;border-radius:12px;cursor:pointer;font:inherit;color:#e7e9ee;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);transition:transform .12s,border-color .15s,background .15s,box-shadow .15s;}
 .arena-hero canvas{width:100%;max-width:132px;aspect-ratio:132/96;}
 .arena-hero b{font-size:12.5px;font-weight:650;}
 .arena-hero small{font-size:10.5px;line-height:1.3;color:#8891a3;text-align:center;}
 .arena-hero:hover,.arena-hero:focus-visible{transform:translateY(-2px);border-color:rgba(255,255,255,.28);outline:none;}
 .arena-hero.on{border-color:#ffb52e;background:rgba(255,181,46,.1);box-shadow:0 0 0 1px #ffb52e,0 10px 26px rgba(255,140,40,.25);}
 .arena-hero.on b{color:#ffd63d;}
 @media (max-width:900px){.arena-heroes{grid-template-columns:repeat(4,minmax(0,1fr));}}
 @media (max-width:600px){.arena-heroes{grid-template-columns:repeat(3,minmax(0,1fr));}}

 /* Fin de partie : petit titre, score géant en dégradé, message, statistiques. */
 /* Petit titre « Partie terminée », sobre, dans l'esprit des en-têtes de ColorKanva. */
 .arena-over{margin:10px 0 2px;text-align:center;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#8891a3;}
 .arena-score{display:flex;align-items:baseline;justify-content:center;gap:8px;margin:6px 0 0;}
 /* Chiffres en dégradé : marge intérieure à droite et en bas, sinon le dernier chiffre (et le
    bas des chiffres) était rogné par la découpe du fond sur le texte. */
 .arena-num{padding:0 .12em .08em .04em;font-weight:900;font-size:92px;line-height:1.05;letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  background:var(--arena-accent);background-size:180% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.45));}
 .arena-of{font-weight:700;font-size:22px;color:#5c6376;}
 .arena-panel .arena-msg{margin:6px 0 18px;font-size:15px;font-weight:650;color:#e7e9ee;text-align:center;}
 .arena-record{display:inline-block;margin-left:8px;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:700;color:#10121a;
  background:var(--arena-accent);vertical-align:3px;}
 .arena-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
 .arena-stats div{padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);}
 .arena-stats b{display:block;font-size:19px;font-weight:800;font-variant-numeric:tabular-nums;color:#e7e9ee;}
 .arena-stats b small{font-size:12px;font-weight:600;color:#aeb5c4;}
 .arena-stats span{font-size:11.5px;color:#8891a3;}
 @media (max-width:600px){.arena-num{font-size:72px;}.arena-stats{grid-template-columns:repeat(2,1fr);}}

 /* Tableau d'honneur : 10 meilleurs scores par mode, saisie du nom (14 caractères au plus). */
 .arena-scores{list-style:none;margin:10px 0 4px;padding:6px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);}
 .arena-scores li{display:grid;grid-template-columns:26px minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:6px 8px;border-radius:8px;font-size:13px;}
 .arena-scores li:nth-child(odd){background:rgba(255,255,255,.025);}
 .arena-scores li.me{background:color-mix(in srgb,#ffd63d 16%,transparent);box-shadow:inset 0 0 0 1px rgba(255,214,61,.45);}
 .arena-rank{font-weight:800;color:#8891a3;text-align:center;}
 .arena-scores li:nth-child(1) .arena-rank{color:#ffd63d;}
 .arena-scores li:nth-child(2) .arena-rank{color:#c9cfdb;}
 .arena-scores li:nth-child(3) .arena-rank{color:#ff8f36;}
 .arena-sname{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
 .arena-sval{font-weight:800;font-variant-numeric:tabular-nums;}
 .arena-sval small{font-weight:500;color:#8891a3;}
 .arena-sdate{font-size:11px;color:#8891a3;font-variant-numeric:tabular-nums;}
 .arena-empty{margin:12px 0;color:#8891a3;text-align:center;}
 .arena-name{margin:12px 0 4px;padding:12px;border-radius:12px;background:rgba(255,214,61,.07);border:1px solid rgba(255,214,61,.25);}
 .arena-name label{display:block;margin-bottom:8px;font-size:12.5px;font-weight:650;color:#ffd63d;}
 .arena-name div{display:flex;gap:8px;}
 .arena-name input{flex:1;min-width:0;height:38px;padding:0 12px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:#10131b;color:#e7e9ee;font:inherit;font-size:14px;font-weight:650;}
 .arena-name input:focus{outline:2px solid #31adff;outline-offset:1px;}
 .arena-name .arena-btn{flex:none;}
 @media (max-width:600px){.arena-sdate{display:none;}.arena-scores li{grid-template-columns:22px minmax(0,1fr) auto;}}
 /* <<< ARÈNE DE SURVIE, CSS : fin */