/* ==========================================================================
   Arene AcademieCo - Multi-Game Educational Arena
   Pop Art / Modern / Fun style
   All styles scoped to #academy-game-root
   ========================================================================== */

/* --------------------------------------------------------------------------
   CSS Custom Properties
   -------------------------------------------------------------------------- */
#academy-game-root {
  --bdt-bg: #1a1a2e;
  --bdt-primary: #e94560;
  --bdt-secondary: #0f3460;
  --bdt-energy: #f5c518;
  --bdt-success: #00d2ff;
  --bdt-text: #ffffff;
  --bdt-heart: #ff4757;
  --bdt-heart-lost: #444466;
  --bdt-border: 3px solid rgba(233, 69, 96, 0.4);
  --bdt-radius: 14px;
  --bdt-radius-sm: 8px;
  --bdt-shadow-glow: 0 0 20px rgba(233, 69, 96, 0.3);
  /* Robust native stack — renders crisp heavy weights on every OS without
     needing to load a webfont. (Nunito is not loaded as a webfont here, so
     the old stack silently degraded to Segoe UI on Windows and to a generic
     sans on Mac/Linux — where weight 900 then looked flat or blurry.) */
  --bdt-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Segoe UI Variable', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --bdt-font-display: var(--bdt-font);
  --bdt-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  /* Tokens ACA epingles localement (meme logique que le bloc --aca-na-* plus
     bas dans ce fichier). Le fichier consomme deja var(--aca-pink, #ff2d87)
     et compagnie une trentaine de fois, mais ces NOMS sont definis ailleurs
     dans l ecosysteme avec d AUTRES valeurs :
       aca-shared-tokens.css (:root) : --aca-yellow #ffcc00,
                                       --aca-purple #af52de,
                                       --aca-green #34c759 (ni pink ni cyan)
       mon-academie.css (.ma-root) : --aca-pink #C32136, --aca-yellow #D8A953
       commerce/public.css (.mcf-root) : --aca-pink #e94560
     Sans epinglage, le rendu de l Arene depend des feuilles voisines chargees
     sur la page. On fige donc les valeurs voulues ici. */
  --aca-pink: #ff2d87;
  --aca-cyan: #00e5ff;
  --aca-yellow: #ffd400;
  --aca-purple: #a855f7;
  --aca-green: #2ecc71;
}

/* Meme epinglage pour les 4 overlays que le JS monte directement dans
   document.body : ils sont hors de #academy-game-root, donc hors de portee
   du bloc ci-dessus. Concretement, .bdt-course-countdown-num (le 3-2-1-GO de
   la Course) consomme --aca-pink et --aca-yellow pour son degrade et aurait
   garde une teinte differente du reste de l Arene. */
.bdt-help-modal-overlay,
.bdt-confirm-overlay,
.ttmc-prison-banner-overlay,
.bdt-course-countdown-overlay {
  --aca-pink: #ff2d87;
  --aca-cyan: #00e5ff;
  --aca-yellow: #ffd400;
  --aca-purple: #a855f7;
  --aca-green: #2ecc71;
}

/* --------------------------------------------------------------------------
   Base Container
   -------------------------------------------------------------------------- */
#academy-game-root {
  font-family: var(--bdt-font);
  background: var(--bdt-bg);
  color: var(--bdt-text);
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  user-select: none;
  -webkit-user-select: none;
  /* v3.39.2 — Full-bleed (Pat 2026-05-02) : casse le max-width du thème WP
     pour que l'arène s'étale sur toute la largeur du viewport. Technique
     "full bleed" : on prend 100vw et on tire l'élément hors de son parent
     via marges calc(50% - 50vw). No-op si le parent est déjà full-width. */
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Le full-bleed 100vw inclut parfois la largeur de la barre de défilement.
   On coupe uniquement ce débordement horizontal quand l'Arène est présente. */
html:has(#academy-game-root),
body:has(#academy-game-root) {
  overflow-x: clip;
}

#academy-game-root *,
#academy-game-root *::before,
#academy-game-root *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* --------------------------------------------------------------------------
   v3.91.0 — Bouton de sortie Arène (monté sur <body>, HORS #academy-game-root).
   Garantit une sortie visible depuis l'expérience plein écran "full-bleed" où
   le menu du site (BuddyBoss) n'est plus affiché. Miroir du FAB d'aide (?),
   placé en haut-gauche pour lire comme un "retour". Non scopé au root, comme
   le FAB d'aide, puisqu'il vit sur le body.
   -------------------------------------------------------------------------- */
.bdt-exit-fab {
  position: fixed;
  top: max(12px, env(safe-area-inset-top, 0px));
  left: max(12px, env(safe-area-inset-left, 0px));
  z-index: 2147483000;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(15, 15, 26, 0.92);
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.2px;
  text-decoration: none;
  border: 2px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.bdt-exit-fab:hover {
  background: #e94560;
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(233, 69, 96, 0.5);
}
.bdt-exit-fab:focus-visible {
  outline: 3px solid #00d2ff;
  outline-offset: 2px;
}
.bdt-exit-fab-arrow {
  font-size: 18px;
  line-height: 1;
  font-weight: 900;
}
@media (max-width: 480px) {
  .bdt-exit-fab {
    font-size: 14px;
    padding: 9px 14px;
  }
}

/* --------------------------------------------------------------------------
   Shared Components
   -------------------------------------------------------------------------- */

/* --- Player Card --- */
#academy-game-root .bdt-player {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 120px;
}

#academy-game-root .bdt-avatar-wrap {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--bdt-primary);
  box-shadow: 0 0 15px rgba(233, 69, 96, 0.4);
}

#academy-game-root .bdt-avatar-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Rarity glow overrides */
#academy-game-root .bdt-avatar-wrap.rarity-common {
  border-color: #b0b0b0;
  box-shadow: 0 0 12px rgba(176, 176, 176, 0.3);
}
#academy-game-root .bdt-avatar-wrap.rarity-rare {
  border-color: #4dabf7;
  box-shadow: 0 0 18px rgba(77, 171, 247, 0.5);
}
#academy-game-root .bdt-avatar-wrap.rarity-epic {
  border-color: #be4bdb;
  box-shadow: 0 0 22px rgba(190, 75, 219, 0.5);
}
#academy-game-root .bdt-avatar-wrap.rarity-legendary {
  border-color: var(--bdt-energy);
  box-shadow: 0 0 28px rgba(245, 197, 24, 0.6);
  animation: legendaryPulse 2s ease-in-out infinite;
}

#academy-game-root .bdt-player-name {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.3px;
  text-align: center;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#academy-game-root .bdt-player-title {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 3px 10px;
  border-radius: 20px;
  color: #fff;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 4px;
}

/* Rarity colors — matches BuddyBoss activity feed pills (v2.1.34) */
#academy-game-root .bdt-player-title.academy-rarity-common {
  background: #64748b;
  box-shadow: 0 2px 6px rgba(100, 116, 139, 0.4),
              0 0 12px rgba(100, 116, 139, 0.25);
}
#academy-game-root .bdt-player-title.academy-rarity-rare {
  background: #3b82f6;
  box-shadow: 0 2px 8px rgba(59, 130, 246, 0.5),
              0 0 16px rgba(59, 130, 246, 0.35);
}
#academy-game-root .bdt-player-title.academy-rarity-epic {
  background: #a855f7;
  box-shadow: 0 2px 8px rgba(168, 85, 247, 0.5),
              0 0 18px rgba(168, 85, 247, 0.4);
}
#academy-game-root .bdt-player-title.academy-rarity-legendary {
  background: linear-gradient(135deg, #f59e0b, #e88d00);
  box-shadow: 0 2px 10px rgba(245, 158, 11, 0.55),
              0 0 22px rgba(245, 158, 11, 0.45);
  animation: titleLegendaryPulse 2.5s ease-in-out infinite;
}
#academy-game-root .bdt-player-title.academy-rarity-secret {
  background: linear-gradient(135deg, #e94560, #9b2c6f);
  box-shadow: 0 2px 10px rgba(233, 69, 96, 0.55),
              0 0 22px rgba(155, 44, 111, 0.4);
}
@keyframes titleLegendaryPulse {
  0%, 100% { box-shadow: 0 2px 10px rgba(245, 158, 11, 0.55), 0 0 22px rgba(245, 158, 11, 0.45); }
  50%      { box-shadow: 0 2px 14px rgba(245, 158, 11, 0.75), 0 0 32px rgba(245, 158, 11, 0.7); }
}

#academy-game-root .bdt-player-level {
  font-size: 12px;
  font-weight: 700;
  color: var(--bdt-success);
}

/* --- Hearts --- */
#academy-game-root .bdt-hearts {
  display: flex;
  gap: 6px;
  font-size: 22px;
  line-height: 1;
}

#academy-game-root .bdt-heart {
  color: var(--bdt-heart);
  transition: all 0.3s ease;
  display: inline-block;
}

#academy-game-root .bdt-heart.lost {
  color: var(--bdt-heart-lost);
  /* Emoji fonts don't respect `color`, so visually fade the lost heart:
     desaturate + dim + shrink so it reads clearly as "gone". */
  filter: grayscale(1) brightness(0.45) opacity(0.35);
  transform: scale(0.8);
  animation: heartBreak 0.5s ease forwards;
}

/* --- Buttons --- */
#academy-game-root .bdt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--bdt-font);
  font-size: 16px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 14px 32px;
  border: 3px solid transparent;
  border-radius: 50px;
  cursor: pointer;
  transition: var(--bdt-transition);
  position: relative;
  overflow: hidden;
  outline: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

#academy-game-root .bdt-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.15), transparent);
  pointer-events: none;
}

#academy-game-root .bdt-btn:active {
  transform: scale(0.95);
}

#academy-game-root .bdt-btn-primary {
  background: linear-gradient(135deg, var(--bdt-primary), #d63851);
  color: var(--bdt-text);
  border-color: var(--bdt-primary);
  box-shadow: 0 4px 20px rgba(233, 69, 96, 0.4);
}

#academy-game-root .bdt-btn-primary:hover {
  box-shadow: 0 6px 30px rgba(233, 69, 96, 0.6);
  transform: translateY(-2px);
}

#academy-game-root .bdt-btn-secondary {
  background: transparent;
  color: var(--bdt-text);
  border-color: rgba(255, 255, 255, 0.3);
}

#academy-game-root .bdt-btn-secondary:hover {
  border-color: var(--bdt-success);
  color: var(--bdt-success);
}

#academy-game-root .bdt-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none !important;
}

/* --------------------------------------------------------------------------
   SCREEN 0: MENU
   -------------------------------------------------------------------------- */
#academy-game-root .aca-menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  max-width: 1120px;
  width: 100%;
  animation: fadeIn 0.5s ease;
  padding: 10px 0;
  position: relative;
}

#academy-game-root .aca-logo-big {
  width: 80px;
  height: 80px;
}

#academy-game-root .aca-menu-title {
  font-size: 30px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 3px;
  text-align: center;
  background: linear-gradient(135deg, var(--bdt-primary), var(--bdt-energy), var(--bdt-success));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-size: 200% 200%;
  animation: gradientShift 4s ease infinite;
}

@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

#academy-game-root .aca-menu-subtitle {
  font-size: 14px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.45);
  margin-top: -12px;
}

#academy-game-root .aca-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
}

#academy-game-root .aca-section-label {
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: rgba(255, 255, 255, 0.4);
}

/* Hint shown when no year picked yet (forces level-first selection) */
#academy-game-root .aca-mode-hint {
  padding: 18px 22px;
  border: 1.5px dashed rgba(245, 197, 24, 0.35);
  border-radius: 14px;
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  max-width: 440px;
  background: rgba(245, 197, 24, 0.06);
  letter-spacing: 0.3px;
}

/* --- Level buttons (legacy, toujours utilis\u00e9 par d'autres endroits) --- */
#academy-game-root .aca-levels {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

/* ============================================================
   Level picker v3.19.17 — Primaire/Secondaire toggle + roulette
   Compact, fits within 520px, ne chevauche plus le widget Nouveaut\u00e9s.
   ============================================================ */
#academy-game-root .aca-level-picker {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: 100%;
  max-width: 560px;
}
#academy-game-root .aca-level-group-tabs {
  display: inline-flex;
  padding: 4px;
  background: rgba(15, 52, 96, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  gap: 4px;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}
#academy-game-root .aca-level-group-btn {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 9px 22px;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
  transition: color 0.16s ease, background 0.2s ease, transform 0.16s ease;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
#academy-game-root .aca-level-group-btn:hover { color: #fff; }
#academy-game-root .aca-level-group-btn.active {
  background: linear-gradient(135deg, #f5c518 0%, #ffd700 50%, #f59e0b 100%);
  color: #1a1a2e;
  box-shadow: 0 2px 10px rgba(245, 197, 24, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transform: translateY(-1px);
}

/* Rang\u00e9e statique d'ann\u00e9es (v3.19.18) \u2014 tous les niveaux du groupe,
   sans scroll ni snap. 6 items max en primaire, 5 en secondaire. */
#academy-game-root .aca-level-year-row {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  max-width: 560px;
}
#academy-game-root .aca-level-year-btn {
  flex: 0 0 auto;
  min-width: 64px;
  padding: 12px 18px;
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;
  border: 2px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.45), rgba(26, 26, 46, 0.75));
  color: rgba(255, 255, 255, 0.55);
  border-radius: 14px;
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.22);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
#academy-game-root .aca-level-year-btn:hover {
  color: #fff;
  transform: translateY(-2px);
  border-color: rgba(0, 210, 255, 0.4);
}
#academy-game-root .aca-level-year-btn.active {
  color: #1a1a2e;
  background: linear-gradient(135deg, #f5c518 0%, #ffd700 45%, #f59e0b 100%);
  border-color: #ffd700;
  box-shadow: 0 0 22px rgba(245, 197, 24, 0.5), 0 4px 12px rgba(0, 0, 0, 0.3);
  transform: scale(1.08);
}

/* Ann\u00e9e verrouill\u00e9e (anti-farm 24h) */
#academy-game-root .aca-level-year-btn.locked {
  position: relative;
  opacity: 0.4;
  background: linear-gradient(145deg, rgba(60, 30, 50, 0.4), rgba(30, 20, 40, 0.6));
  border-color: rgba(233, 69, 96, 0.25);
  color: rgba(255, 200, 200, 0.6);
  cursor: not-allowed;
}
#academy-game-root .aca-level-year-btn.locked:hover {
  transform: none;
  opacity: 0.55;
}
#academy-game-root .aca-level-year-lock {
  position: absolute;
  top: -4px;
  right: -4px;
  font-size: 11px;
  line-height: 1;
  background: #e94560;
  color: #fff;
  padding: 2px 4px;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* Petit shake quand on clique sur un bouton verrouill\u00e9 */
@keyframes acaYearShakeNo {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-5px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(3px); }
}
#academy-game-root .aca-level-year-btn.shake-no {
  animation: acaYearShakeNo 0.35s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
  #academy-game-root .aca-level-year-btn,
  #academy-game-root .aca-level-group-btn { transition: none; }
}

#academy-game-root .aca-level-btn {
  font-family: var(--bdt-font);
  font-size: 13px;
  font-weight: 800;
  padding: 8px 16px;
  border-radius: 50px;
  border: 2px solid rgba(255, 255, 255, 0.12);
  background: rgba(15, 52, 96, 0.3);
  color: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  transition: var(--bdt-transition);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

#academy-game-root .aca-level-btn:hover {
  border-color: var(--bdt-success);
  color: var(--bdt-success);
}

#academy-game-root .aca-level-btn.active {
  border-color: var(--bdt-energy);
  color: var(--bdt-energy);
  background: rgba(245, 197, 24, 0.12);
  box-shadow: 0 0 14px rgba(245, 197, 24, 0.25);
}

/* --- Mode cards --- */
#academy-game-root .aca-modes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  width: 100%;
  max-width: 420px;
}

/* Desktop layout (>= 900px) — plus horizontal :
   - grille modes sur 3 colonnes (mode vedette couvre toute la largeur)
   - widget Nouveaut\u00e9s compact (tr\u00e8s petit) pin\u00e9 en haut \u00e0 gauche */
@media (min-width: 900px) {
  #academy-game-root .aca-menu {
    padding-top: 20px;
    /* Pas de padding-left : le contenu principal reste centr\u00e9. Le widget
       Nouveaut\u00e9s est pin\u00e9 en absolute \u00e0 gauche sans d\u00e9caler le reste. */
  }
  /* v3.42.0 — bumpé à 4 colonnes (Landing-2 ping : 4-5 cards visibles desktop) */
  #academy-game-root .aca-modes {
    grid-template-columns: repeat(4, 1fr);
    max-width: 880px;
    gap: 12px;
  }
  #academy-game-root .aca-mode-card.featured,
  #academy-game-root .aca-mode-card[data-mode="grande-revision"] {
    grid-column: span 4;
  }
  /* Nouveaut\u00e9s : widget mini fix\u00e9 en haut \u00e0 gauche, tr\u00e8s discret */
  #academy-game-root .aca-menu .aca-news-section {
    position: absolute;
    top: 12px;
    left: 0;
    width: 160px;
    max-width: 160px;
    margin: 0;
    align-items: stretch;
    opacity: 0.85;
    transition: opacity 0.2s;
  }
  #academy-game-root .aca-menu .aca-news-section:hover {
    opacity: 1;
  }
  #academy-game-root .aca-menu .aca-news-section .aca-section-label {
    font-size: 8px;
    letter-spacing: 1.5px;
    text-align: left;
    margin-bottom: 4px;
    opacity: 0.5;
  }
  #academy-game-root .aca-menu .aca-news-list {
    gap: 4px;
  }
  #academy-game-root .aca-menu .aca-news-card {
    padding: 5px 7px;
    gap: 7px;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  }
  #academy-game-root .aca-menu .aca-news-icon {
    width: 22px;
    height: 22px;
    font-size: 14px;
    border-radius: 6px;
  }
  #academy-game-root .aca-menu .aca-news-title {
    font-size: 10px;
    font-weight: 700;
  }
  #academy-game-root .aca-menu .aca-news-desc {
    font-size: 9px;
    line-height: 1.25;
    opacity: 0.7;
    /* Coupe \u00e0 2 lignes pour garder le widget compact */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  #academy-game-root .aca-menu .aca-news-badge {
    font-size: 7px;
    padding: 1px 4px;
    letter-spacing: 0.5px;
  }
  #academy-game-root .aca-menu .aca-news-title-row {
    gap: 4px;
    margin-bottom: 0;
  }
}

/* Desktop XL (>= 1200px) — 5 colonnes (Landing-2 ping v3.42.0) */
@media (min-width: 1200px) {
  #academy-game-root .aca-modes {
    grid-template-columns: repeat(5, 1fr);
    max-width: 1140px;
  }
  #academy-game-root .aca-mode-card.featured,
  #academy-game-root .aca-mode-card[data-mode="grande-revision"] {
    grid-column: span 5;
  }
}

#academy-game-root .aca-mode-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 18px 12px;
  border: 2px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--bdt-radius);
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.4), rgba(26, 26, 46, 0.7));
  cursor: pointer;
  transition: var(--bdt-transition);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

#academy-game-root .aca-mode-card:hover {
  border-color: rgba(0, 210, 255, 0.4);
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 210, 255, 0.15);
}

#academy-game-root .aca-mode-card.selected {
  border-color: var(--bdt-success);
  background: linear-gradient(145deg, rgba(0, 210, 255, 0.1), rgba(15, 52, 96, 0.5));
  box-shadow: 0 0 20px rgba(0, 210, 255, 0.25);
}

/* v3.36.0 — modes secondaires (tous sauf Grande Révision) : tuile réduite ~50%
   pour mettre la GR en tête de pelle. L'icône, le label et la description
   shrinkent proportionnellement. */
#academy-game-root .aca-mode-card.secondary {
  padding: 10px 8px;
  gap: 4px;
  transform: scale(0.85);
  transform-origin: top center;
  opacity: 0.92;
}
#academy-game-root .aca-mode-card.secondary .aca-mode-icon,
#academy-game-root .aca-mode-card.secondary .aca-mode-card-icon {
  font-size: 0.65em;
  transform: scale(0.7);
}
#academy-game-root .aca-mode-card.secondary .aca-mode-label,
#academy-game-root .aca-mode-card.secondary .aca-mode-card-label {
  font-size: 0.85em;
}
#academy-game-root .aca-mode-card.secondary .aca-mode-desc,
#academy-game-root .aca-mode-card.secondary .aca-mode-card-desc {
  font-size: 0.9em;
  opacity: 1;
}
#academy-game-root .aca-mode-card.secondary:hover {
  opacity: 1;
  transform: scale(0.88) translateY(-2px);
}

/* La Grande Révision — featured mode, visuellement distinct */
#academy-game-root .aca-mode-card.featured,
#academy-game-root .aca-mode-card[data-mode="grande-revision"] {
  background: linear-gradient(135deg, #00d2ff 0%, #3a7bd5 40%, #e94560 100%);
  border-color: #ffd700;
  box-shadow: 0 0 30px rgba(0, 210, 255, 0.4), 0 0 60px rgba(233, 69, 96, 0.25);
  grid-column: span 2;
  position: relative;
  overflow: hidden;
}
#academy-game-root .aca-mode-card.featured::before {
  content: '⭐ SPÉCIAL';
  position: absolute;
  top: 8px;
  right: 8px;
  background: #ffd700;
  color: #1a1a2e;
  font-size: 10px;
  font-weight: 900;
  padding: 3px 8px;
  border-radius: 20px;
  letter-spacing: 0.05em;
  z-index: 2;
}
#academy-game-root .aca-mode-card.featured .aca-mode-icon {
  font-size: 44px;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.3));
}
#academy-game-root .aca-mode-card.featured .aca-mode-label {
  font-size: 16px;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}
#academy-game-root .aca-mode-card.featured .aca-mode-desc {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 700;
}

/* Discipline badge — apparaît au-dessus de la question en mode Grande Révision */
#academy-game-root .bdt-discipline-badge {
  display: inline-block;
  background: linear-gradient(135deg, #00d2ff, #3a7bd5);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  padding: 5px 14px;
  border-radius: 20px;
  letter-spacing: 0.05em;
  margin-bottom: 12px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
  box-shadow: 0 2px 8px rgba(0, 210, 255, 0.3);
  animation: popIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#academy-game-root .aca-mode-icon {
  font-size: 32px;
  line-height: 1;
}

/* Image-based icon (featured modes with a branded PNG like grande-revision) */
#academy-game-root .aca-mode-icon-img {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 72px;
  line-height: 1;
}
#academy-game-root .aca-mode-icon-img img {
  max-width: 80px;
  max-height: 72px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.35))
          drop-shadow(0 0 18px rgba(255, 255, 255, 0.15));
  animation: featuredIconFloat 3s ease-in-out infinite;
}
@keyframes featuredIconFloat {
  0%, 100% { transform: translateY(0) rotate(-1.5deg); }
  50%      { transform: translateY(-3px) rotate(1.5deg); }
}
#academy-game-root .aca-mode-card.featured .aca-mode-icon-img {
  height: 84px;
}
#academy-game-root .aca-mode-card.featured .aca-mode-icon-img img {
  max-width: 92px;
  max-height: 84px;
}

#academy-game-root .aca-mode-label {
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  letter-spacing: 0.5px;
}

#academy-game-root .aca-mode-desc {
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
  text-align: center;
  line-height: 1.3;
}

/* --- Play button --- */
#academy-game-root .aca-play-btn {
  margin-top: 4px;
  font-size: 18px;
  padding: 16px 48px;
}

/* --------------------------------------------------------------------------
   SCREEN 1: Matchmaking — Street Fighter style versus screen
   -------------------------------------------------------------------------- */
#academy-game-root .bdt-matchmaking {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  max-width: 900px;
  width: 100%;
  padding: 20px;
  animation: fadeIn 0.5s ease;
  position: relative;
  overflow: hidden;
}

/* Animated flame/energy background */
#academy-game-root .bdt-matchmaking::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 10% 50%, rgba(0, 210, 255, 0.25) 0%, transparent 50%),
    radial-gradient(ellipse at 90% 50%, rgba(233, 69, 96, 0.25) 0%, transparent 50%),
    linear-gradient(90deg, transparent 48%, rgba(245, 197, 24, 0.1) 49%, rgba(245, 197, 24, 0.3) 50%, rgba(245, 197, 24, 0.1) 51%, transparent 52%);
  pointer-events: none;
  z-index: 0;
  animation: vsBackgroundPulse 3s ease-in-out infinite;
}
@keyframes vsBackgroundPulse {
  0%, 100% { opacity: 0.8; }
  50%      { opacity: 1; }
}
#academy-game-root .bdt-matchmaking > * {
  position: relative;
  z-index: 1;
}

/* --- Logo --- */
#academy-game-root .bdt-logo {
  width: 64px;
  height: 64px;
  filter: drop-shadow(0 0 18px rgba(0, 210, 255, 0.5)) drop-shadow(0 0 40px rgba(0, 210, 255, 0.2));
  animation: logoPulse 3s ease-in-out infinite;
}

#academy-game-root .bdt-logo svg {
  width: 100%;
  height: 100%;
}

#academy-game-root .bdt-logo svg path {
  fill: rgba(255, 255, 255, 0.9);
}

@keyframes logoPulse {
  0%, 100% {
    filter: drop-shadow(0 0 18px rgba(0, 210, 255, 0.5)) drop-shadow(0 0 40px rgba(0, 210, 255, 0.2));
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 28px rgba(0, 210, 255, 0.7)) drop-shadow(0 0 60px rgba(245, 197, 24, 0.3));
    transform: scale(1.04);
  }
}

#academy-game-root .bdt-matchmaking-title {
  font-size: 38px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 4px;
  text-align: center;
  background: linear-gradient(135deg, var(--bdt-primary), var(--bdt-energy), var(--bdt-success));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 30px rgba(245, 197, 24, 0.4);
  animation: sfTitleGlow 2s ease-in-out infinite;
}
@keyframes sfTitleGlow {
  0%, 100% { filter: drop-shadow(0 0 8px rgba(245, 197, 24, 0.4)); }
  50%      { filter: drop-shadow(0 0 16px rgba(245, 197, 24, 0.8)) drop-shadow(0 0 32px rgba(233, 69, 96, 0.4)); }
}

#academy-game-root .aca-level-badge {
  font-size: 13px;
  font-weight: 700;
  padding: 5px 16px;
  border-radius: 50px;
  background: rgba(0, 210, 255, 0.1);
  border: 1px solid rgba(0, 210, 255, 0.3);
  color: var(--bdt-success);
  letter-spacing: 1px;
  margin-top: -12px;
}

/* Versus row — Street Fighter style with diagonal split + big portraits */
#academy-game-root .bdt-versus-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 900px;
  position: relative;
  padding: 20px 10px;
}

/* Left player — softer teal team side (tilt reduced, saturation lower) */
#academy-game-root .bdt-versus-row .bdt-player:first-child {
  flex: 1;
  max-width: 280px;
  padding: 18px 14px;
  background: linear-gradient(135deg, rgba(91, 192, 235, 0.18), rgba(15, 52, 96, 0.45));
  border: 2px solid #5bc0eb;
  border-radius: 14px;
  box-shadow:
    0 0 18px rgba(91, 192, 235, 0.3),
    inset 0 0 20px rgba(91, 192, 235, 0.1),
    inset 0 2px 6px rgba(255, 255, 255, 0.1);
  position: relative;
  transform: perspective(800px) rotateY(4deg);
  transform-origin: right center;
  animation: sfSlideInLeft 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
#academy-game-root .bdt-versus-row .bdt-player:first-child::before {
  content: 'P1';
  position: absolute;
  top: -10px;
  left: 12px;
  background: #5bc0eb;
  color: #0a1a2e;
  padding: 3px 12px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.5px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(91, 192, 235, 0.4);
  font-family: var(--bdt-font);
}
@keyframes sfSlideInLeft {
  0%   { transform: translateX(-80%) perspective(800px) rotateY(15deg); opacity: 0; }
  100% { transform: translateX(0) perspective(800px) rotateY(4deg); opacity: 1; }
}

/* Right side — opponent / searching — warm coral team (softer than neon red) */
#academy-game-root .bdt-versus-row .bdt-player:last-child,
#academy-game-root .bdt-versus-row .bdt-searching {
  flex: 1;
  max-width: 280px;
  padding: 18px 14px;
  background: linear-gradient(-135deg, rgba(238, 90, 111, 0.2), rgba(80, 30, 50, 0.4));
  border: 2px solid #ee5a6f;
  border-radius: 14px;
  box-shadow:
    0 0 18px rgba(238, 90, 111, 0.3),
    inset 0 0 20px rgba(238, 90, 111, 0.1),
    inset 0 2px 6px rgba(255, 255, 255, 0.1);
  position: relative;
  transform: perspective(800px) rotateY(-4deg);
  transform-origin: left center;
}
#academy-game-root .bdt-versus-row .bdt-player:last-child {
  animation: sfSlideInRight 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
#academy-game-root .bdt-versus-row .bdt-player:last-child::before,
#academy-game-root .bdt-versus-row .bdt-searching::before {
  content: 'P2';
  position: absolute;
  top: -10px;
  right: 12px;
  background: #ee5a6f;
  color: #fff;
  padding: 3px 12px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 1.5px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(238, 90, 111, 0.4);
  font-family: var(--bdt-font);
}
@keyframes sfSlideInRight {
  0%   { transform: translateX(80%) perspective(800px) rotateY(-15deg); opacity: 0; }
  100% { transform: translateX(0) perspective(800px) rotateY(-4deg); opacity: 1; }
}

/* VS divider — big Street Fighter style */
#academy-game-root .bdt-vs-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 100px;
  position: relative;
}

#academy-game-root .bdt-vs-text {
  /* System font at 900 + tight letter-spacing gives the same impact feel as
     Impact/Arial-Black but renders crisply on every OS. No more Impact
     fallback surprises. */
  font-family: var(--bdt-font);
  font-size: 64px;
  font-weight: 900;
  letter-spacing: -3px;
  color: #f5c518;
  -webkit-text-stroke: 2px #1a1a2e;
  text-shadow: 0 0 14px rgba(245, 197, 24, 0.55),
               0 3px 0 rgba(0, 0, 0, 0.4);
  animation: sfVsZoom 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
  transform-origin: center;
  line-height: 1;
}
@keyframes sfVsZoom {
  0%   { transform: scale(0) rotate(-180deg); opacity: 0; }
  60%  { transform: scale(1.4) rotate(10deg); opacity: 1; }
  80%  { transform: scale(0.9) rotate(-5deg); }
  100% { transform: scale(1) rotate(0deg); }
}
@keyframes sfVsGradient {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* Player card enhancements inside the versus row */
#academy-game-root .bdt-versus-row .bdt-player .bdt-avatar-wrap {
  width: 90px;
  height: 90px;
  margin: 0 auto 8px;
  border: 3px solid rgba(255, 255, 255, 0.3);
}
#academy-game-root .bdt-versus-row .bdt-player:first-child .bdt-avatar-wrap {
  border-color: #5bc0eb;
  box-shadow: 0 0 16px rgba(91, 192, 235, 0.4);
}
#academy-game-root .bdt-versus-row .bdt-player:last-child .bdt-avatar-wrap {
  border-color: #ee5a6f;
  box-shadow: 0 0 16px rgba(238, 90, 111, 0.4);
}

#academy-game-root .bdt-versus-row .bdt-player .bdt-player-name {
  /* Readability-first: default UI font at heavy weight, no italic, no ALL-CAPS.
     Long whimsical bot names are much easier to parse this way than in
     Impact-italic. Slight dark shadow keeps it from drowning in the glow. */
  font-family: var(--bdt-font);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.2px;
  text-transform: none;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.75);
  max-width: 100%;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.15;
  word-break: break-word;
  hyphens: auto;
}
#academy-game-root .bdt-versus-row .bdt-player .bdt-player-title {
  max-width: 100%;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.15;
  padding: 4px 12px;
}

/* Hearts row — energy bars under portraits */
#academy-game-root .bdt-versus-row + .bdt-versus-row {
  max-width: 900px;
  padding: 0 30px;
}
#academy-game-root .bdt-versus-row + .bdt-versus-row .bdt-hearts {
  font-size: 20px;
  letter-spacing: 2px;
  padding: 6px 14px;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 20px;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.5);
}

/* Searching animation */
#academy-game-root .bdt-searching {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  flex: 1;
  max-width: 180px;
}

#academy-game-root .bdt-searching-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 4px dashed var(--bdt-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  animation: spin 3s linear infinite, bdtSearchPulse 1.5s ease-in-out infinite;
}

#academy-game-root .bdt-searching-text {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  animation: bdtSearchPulse 1.5s ease-in-out infinite;
}

/* Opponent found */
#academy-game-root .bdt-player.opponent-found {
  animation: slideInRight 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#academy-game-root .bdt-player.user-reveal {
  animation: slideInLeft 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Difficulty selector */
#academy-game-root .bdt-difficulty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
}

#academy-game-root .bdt-difficulty-label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.5);
}

#academy-game-root .bdt-difficulty-options {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}

#academy-game-root .bdt-diff-btn {
  font-family: var(--bdt-font);
  font-size: 13px;
  font-weight: 800;
  padding: 10px 20px;
  border-radius: 50px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  background: rgba(15, 52, 96, 0.4);
  color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  transition: var(--bdt-transition);
  text-transform: uppercase;
  letter-spacing: 1px;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

#academy-game-root .bdt-diff-btn:hover {
  border-color: var(--bdt-success);
  color: var(--bdt-success);
}

#academy-game-root .bdt-diff-btn.active {
  border-color: var(--bdt-energy);
  color: var(--bdt-energy);
  background: rgba(245, 197, 24, 0.1);
  box-shadow: 0 0 12px rgba(245, 197, 24, 0.2);
}

#academy-game-root .bdt-diff-detail {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.72);
  text-align: center;
}

/* Facile = zero-pressure practice mode — bubble + arrow signal no-timer */
#academy-game-root .bdt-diff-btn-easy {
  position: relative;
  overflow: visible;
}
#academy-game-root .bdt-easy-bubble {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.5px;
  color: #1a1a2e;
  background: linear-gradient(180deg, #ffe89c 0%, #f5c518 100%);
  border: 1.5px solid #c58a00;
  border-radius: 8px;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35), 0 0 12px rgba(245, 197, 24, 0.4);
  pointer-events: none;
  animation: bdtEasyBubbleFloat 2.2s ease-in-out infinite;
  z-index: 2;
  text-transform: none;
}
#academy-game-root .bdt-easy-bubble-arrow {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #c58a00;
}
#academy-game-root .bdt-easy-bubble-arrow::after {
  content: '';
  position: absolute;
  top: -8px;
  left: -5px;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #f5c518;
}
@keyframes bdtEasyBubbleFloat {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%      { transform: translateX(-50%) translateY(-3px); }
}

/* Timer bar in easy mode: hidden stripe instead of countdown */
#academy-game-root .bdt-timer-bar.bdt-timer-disabled {
  background: linear-gradient(90deg, rgba(78, 205, 196, 0.3), rgba(78, 205, 196, 0.6), rgba(78, 205, 196, 0.3));
  opacity: 0.35;
}

/* --------------------------------------------------------------------------
   SCREEN 2: Battle
   -------------------------------------------------------------------------- */
#academy-game-root .bdt-battle {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 100%;
  max-width: 560px;
  animation: fadeIn 0.4s ease;
}

/* Top bar */
#academy-game-root .bdt-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 12px;
}

#academy-game-root .bdt-topbar-player {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  position: relative; /* pour la progress bar .bdt-opp-progress */
}

#academy-game-root .bdt-topbar-player.right {
  flex-direction: row-reverse;
  text-align: right;
}

/* ============================================================
   Activit\u00e9 adversaire (v3.19.20) — thinking indicator +
   progress bar qui se remplit le temps qu'il "r\u00e9fl\u00e9chit"
   L'\u00e9l\u00e8ve voit qu'il y a quelqu'un en face au lieu d'un
   portrait statique qui ne fait rien.
   ============================================================ */
#academy-game-root .bdt-topbar-player.right.thinking .bdt-mini-avatar {
  border-color: #fde047;
  box-shadow: 0 0 0 3px rgba(253, 224, 71, 0.25), 0 0 14px rgba(253, 224, 71, 0.4);
  animation: oppThinkingPulse 1s ease-in-out infinite;
}
@keyframes oppThinkingPulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(253, 224, 71, 0.2), 0 0 12px rgba(253, 224, 71, 0.3); }
  50%      { box-shadow: 0 0 0 5px rgba(253, 224, 71, 0.35), 0 0 18px rgba(253, 224, 71, 0.5); }
}

#academy-game-root .bdt-topbar-player.right.thinking .bdt-topbar-name::after {
  content: ' ...';
  color: #fde047;
  font-weight: 900;
  display: inline-block;
  animation: oppThinkingDots 0.9s steps(3, end) infinite;
}
@keyframes oppThinkingDots {
  0%   { content: ' .'; }
  33%  { content: ' ..'; }
  66%  { content: ' ...'; }
}

/* Barre de progression sous le portrait adverse */
#academy-game-root .bdt-topbar-player.right .bdt-opp-progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 3px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  overflow: hidden;
  pointer-events: none;
}
#academy-game-root .bdt-topbar-player.right .bdt-opp-progress-fill {
  display: block;
  height: 100%;
  width: 100%;
  transform-origin: left center;
  transform: scaleX(0);
  background: linear-gradient(90deg, #fde047, #f59e0b, #e94560);
  box-shadow: 0 0 8px rgba(253, 224, 71, 0.4);
}

/* Flash au moment o\u00f9 l'adversaire "d\u00e9cide" */
#academy-game-root .bdt-topbar-player.right.decided .bdt-mini-avatar {
  border-color: #4ade80;
  animation: oppDecidedFlash 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes oppDecidedFlash {
  0%   { box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.6), 0 0 24px rgba(74, 222, 128, 0.7); transform: scale(1.08); }
  60%  { transform: scale(0.97); }
  100% { box-shadow: 0 0 0 2px rgba(74, 222, 128, 0.35), 0 0 12px rgba(74, 222, 128, 0.35); transform: scale(1); }
}
#academy-game-root .bdt-topbar-player.right.decided .bdt-topbar-name::after {
  /* 2026-07-24 : idem, ✓ est un echappement JS. L'enfant voyait « u2713 »
     colle au nom de l'adversaire au lieu de la coche « a repondu ». */
  content: ' ✓';
  color: #4ade80;
  font-weight: 900;
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  #academy-game-root .bdt-topbar-player.right.thinking .bdt-mini-avatar,
  #academy-game-root .bdt-topbar-player.right.decided .bdt-mini-avatar { animation: none; }
  #academy-game-root .bdt-opp-progress-fill { transition: none !important; }
  #academy-game-root .bdt-topbar-player.right.thinking .bdt-topbar-name::after {
    content: ' ...'; animation: none;
  }
}

#academy-game-root .bdt-topbar-player .bdt-mini-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid var(--bdt-primary);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bdt-secondary);
  font-weight: 900;
  font-size: 16px;
}

#academy-game-root .bdt-topbar-player .bdt-mini-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#academy-game-root .bdt-topbar-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

#academy-game-root .bdt-topbar-name {
  font-size: 13px;
  font-weight: 800;
  max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#academy-game-root .bdt-topbar-hearts {
  font-size: 16px;
  display: flex;
  gap: 3px;
}

#academy-game-root .bdt-topbar-player.right .bdt-topbar-hearts {
  justify-content: flex-end;
}

/* Round counter */
#academy-game-root .bdt-round-counter {
  font-size: 14px;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
  letter-spacing: 2px;
  text-align: center;
  flex-shrink: 0;
}

/* Timer bar */
#academy-game-root .bdt-timer-container {
  width: 100%;
  height: 8px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

#academy-game-root .bdt-timer-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--bdt-success), var(--bdt-energy));
  border-radius: 4px;
  width: 100%;
  transform-origin: right center;
  transition: background 0.3s ease;
}

#academy-game-root .bdt-timer-bar.warning {
  background: linear-gradient(90deg, var(--bdt-energy), #ff9500);
}

#academy-game-root .bdt-timer-bar.danger {
  background: linear-gradient(90deg, var(--bdt-primary), #ff4757);
  animation: timerPulse 0.5s ease-in-out infinite;
}

/* Question display */
#academy-game-root .bdt-equation-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  width: 100%;
  padding: 20px 0;
}

#academy-game-root .bdt-question-display {
  text-align: center;
  animation: popIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
}

/* Math equation display */
#academy-game-root .bdt-question-display .bdt-equation {
  font-size: 48px;
  font-weight: 900;
  letter-spacing: 3px;
  text-shadow: 0 0 30px rgba(233, 69, 96, 0.4);
  line-height: 1.3;
}

/* Text question display */
#academy-game-root .bdt-question-prompt {
  font-size: 18px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 12px;
  line-height: 1.4;
  padding: 0 8px;
}

/* v3.21.1 — Anti-copy : effet signal psychologique + léger ralentissement
   du copier-coller. La protection réelle vient de la Visibility API qui
   pénalise un tab-switch pendant qu'une question est ouverte. */
#academy-game-root .bdt-cheat-guarded .bdt-question-prompt,
#academy-game-root .bdt-cheat-guarded .bdt-question-word,
#academy-game-root .bdt-cheat-guarded .ttmc-q-text {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

/* Grammar abbreviation tooltip — shows full term on hover/focus/tap so kids
   meeting "CN" / "GN" / "GPrép" for the first time aren't left guessing. */
#academy-game-root .bdt-abbr {
  position: relative;
  display: inline-block;
  color: var(--bdt-energy);
  border-bottom: 1.5px dotted rgba(245, 197, 24, 0.55);
  cursor: help;
  outline: none;
  padding-bottom: 1px;
}
#academy-game-root .bdt-abbr:hover,
#academy-game-root .bdt-abbr:focus,
#academy-game-root .bdt-abbr:active {
  color: #fff;
  border-bottom-color: #fff;
}
#academy-game-root .bdt-abbr::after {
  content: attr(data-full);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(4px) scale(0.95);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 700;
  font-style: italic;
  color: #1a1a2e;
  background: linear-gradient(180deg, #ffe89c 0%, #f5c518 100%);
  border: 1.5px solid #c58a00;
  border-radius: 8px;
  white-space: nowrap;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.45), 0 0 14px rgba(245, 197, 24, 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.16s ease-out, transform 0.16s ease-out;
  z-index: 10;
  letter-spacing: 0;
  text-transform: none;
}
#academy-game-root .bdt-abbr::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 7px solid #c58a00;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.16s ease-out;
  z-index: 10;
}
#academy-game-root .bdt-abbr:hover::after,
#academy-game-root .bdt-abbr:focus::after,
#academy-game-root .bdt-abbr:active::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0) scale(1);
}
#academy-game-root .bdt-abbr:hover::before,
#academy-game-root .bdt-abbr:focus::before,
#academy-game-root .bdt-abbr:active::before {
  opacity: 1;
}

#academy-game-root .bdt-question-word {
  font-size: 36px;
  font-weight: 900;
  color: var(--bdt-energy);
  text-shadow: 0 0 20px rgba(245, 197, 24, 0.3);
  letter-spacing: 2px;
}

/* Answer grid */
#academy-game-root .bdt-answers {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  width: 100%;
  max-width: 400px;
  position: relative;
  z-index: 10;
}

#academy-game-root .bdt-answer-btn {
  font-family: var(--bdt-font);
  font-size: 22px;
  font-weight: 900;
  padding: 16px 12px;
  border: 3px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--bdt-radius);
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.5), rgba(26, 26, 46, 0.8));
  color: var(--bdt-text);
  cursor: pointer;
  transition: var(--bdt-transition);
  position: relative;
  overflow: hidden;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  text-transform: none; /* never force uppercase on answer buttons */
  min-width: 0;
}

/* Orthographe mode : always lowercase, better letter spacing for reading */
#academy-game-root .bdt-answer-btn.bdt-answer-ortho {
  text-transform: lowercase !important;
  letter-spacing: 0.5px;
  font-variant-caps: normal;
  text-align: center;
  white-space: nowrap;
  min-width: 0;
  line-height: 1.2;
}

#academy-game-root .bdt-answer-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.06), transparent);
  pointer-events: none;
}

#academy-game-root .bdt-answer-btn:hover:not(:disabled) {
  border-color: var(--bdt-success);
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 210, 255, 0.2);
}

#academy-game-root .bdt-answer-btn:active:not(:disabled) {
  transform: scale(0.95);
}

#academy-game-root .bdt-answer-btn.correct {
  border-color: var(--bdt-success);
  background: rgba(0, 210, 255, 0.2);
  animation: bounce 0.5s ease;
  box-shadow: 0 0 25px rgba(0, 210, 255, 0.4);
}

#academy-game-root .bdt-answer-btn.wrong {
  border-color: var(--bdt-heart);
  background: rgba(255, 71, 87, 0.2);
  animation: shake 0.5s ease;
  box-shadow: 0 0 25px rgba(255, 71, 87, 0.3);
}

#academy-game-root .bdt-answer-btn:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

#academy-game-root .bdt-answer-btn.bot-choice {
  border-color: #be4bdb;
  box-shadow: 0 0 18px rgba(190, 75, 219, 0.35);
  position: relative;
}

#academy-game-root .bdt-bot-tag {
  position: absolute;
  top: 4px;
  right: 6px;
  font-size: 14px;
  line-height: 1;
  opacity: 0.9;
  pointer-events: none;
}

/* A11Y : région live lue par le lecteur d'écran, invisible à l'oeil.
   Ne jamais remplacer par display:none (la région deviendrait muette). */
#academy-game-root .bdt-sr-live {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Battle feedback overlay */
#academy-game-root .bdt-feedback {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  pointer-events: none;
}

#academy-game-root .bdt-feedback-text {
  font-size: 48px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 4px;
  text-shadow: 0 0 30px currentColor;
  animation: popIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), fadeOut 0.8s 0.5s ease forwards;
}

#academy-game-root .bdt-feedback-text.hit { color: var(--bdt-success); }
#academy-game-root .bdt-feedback-text.slow { color: #f5c518; }
#academy-game-root .bdt-feedback-text.error { color: var(--bdt-heart); }
#academy-game-root .bdt-feedback-text.timeout { color: var(--bdt-energy); }

/* Hit flash overlay */
#academy-game-root .bdt-hit-flash {
  position: absolute;
  inset: 0;
  z-index: 15;
  pointer-events: none;
  animation: hitFlash 0.4s ease forwards;
}

#academy-game-root .bdt-hit-flash.user-hit { background: rgba(255, 71, 87, 0.3); }
#academy-game-root .bdt-hit-flash.opponent-hit { background: rgba(0, 210, 255, 0.2); }

/* --------------------------------------------------------------------------
   SCREEN 3: Results
   -------------------------------------------------------------------------- */
#academy-game-root .bdt-results {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  z-index: 100;
  background: rgba(26, 26, 46, 0.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: 20px 24px;
  animation: fadeIn 0.6s ease;
  overflow-y: auto;
}

#academy-game-root .bdt-results-title {
  font-size: 42px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 4px;
  text-align: center;
  line-height: 1.2;
}

#academy-game-root .bdt-results-title.victory {
  background: linear-gradient(135deg, var(--bdt-energy), var(--bdt-success));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: none;
}

#academy-game-root .bdt-results-title.defeat { color: rgba(255, 255, 255, 0.5); }
#academy-game-root .bdt-results-title.draw { color: var(--bdt-energy); }

#academy-game-root .bdt-results-subtitle {
  font-size: 16px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
  text-align: center;
}

#academy-game-root .bdt-results-avatar {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid var(--bdt-energy);
  box-shadow: 0 0 30px rgba(245, 197, 24, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bdt-secondary);
  font-size: 40px;
  font-weight: 900;
}

#academy-game-root .bdt-results-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#academy-game-root .bdt-rewards {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}

#academy-game-root .bdt-reward {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(15, 52, 96, 0.5);
  border: 2px solid rgba(255, 255, 255, 0.1);
  border-radius: 50px;
  padding: 8px 18px;
  font-size: 16px;
  font-weight: 800;
  animation: popIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
}

#academy-game-root .bdt-reward:nth-child(1) { animation-delay: 0.2s; }
#academy-game-root .bdt-reward:nth-child(2) { animation-delay: 0.35s; }

#academy-game-root .bdt-reward .xp { color: var(--bdt-success); }
#academy-game-root .bdt-reward .gems { color: var(--bdt-energy); }

#academy-game-root .bdt-badges {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}

#academy-game-root .bdt-badge {
  font-size: 13px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 50px;
  background: rgba(245, 197, 24, 0.1);
  border: 1px solid rgba(245, 197, 24, 0.3);
  color: var(--bdt-energy);
  animation: popIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
}

#academy-game-root .bdt-stats {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

#academy-game-root .bdt-stat {
  font-size: 14px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
}

#academy-game-root .bdt-stat strong { color: var(--bdt-text); }

/* ── Score section ── */
#academy-game-root .bdt-score-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

#academy-game-root .bdt-score-value {
  font-size: 40px;
  font-weight: 900;
  background: linear-gradient(135deg, var(--bdt-energy), #ff6b81);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: popIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#academy-game-root .bdt-stars {
  display: flex;
  gap: 6px;
  font-size: 32px;
}

#academy-game-root .bdt-star.filled {
  color: var(--bdt-energy);
  text-shadow: 0 0 12px rgba(245, 197, 24, 0.5);
  animation: popIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
}
#academy-game-root .bdt-star.filled:nth-child(1) { animation-delay: 0.1s; }
#academy-game-root .bdt-star.filled:nth-child(2) { animation-delay: 0.25s; }
#academy-game-root .bdt-star.filled:nth-child(3) { animation-delay: 0.4s; }
#academy-game-root .bdt-star.empty { color: rgba(255, 255, 255, 0.15); }

/* ── Stats grid ── */
#academy-game-root .bdt-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  width: 100%;
  max-width: 500px;
}

#academy-game-root .bdt-stat-box {
  text-align: center;
  background: rgba(15, 52, 96, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 10px 6px;
}

#academy-game-root .bdt-stat-number {
  font-size: 20px;
  font-weight: 900;
  color: var(--bdt-text);
}

#academy-game-root .bdt-stat-label {
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
  margin-top: 2px;
}

/* ── Round recap ── */
#academy-game-root .bdt-recap-section {
  width: 100%;
  max-width: 520px;
}

#academy-game-root .bdt-recap-title {
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 8px;
}

#academy-game-root .bdt-recap-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 180px;
  overflow-y: auto;
  padding-right: 4px;
}

#academy-game-root .bdt-recap-list::-webkit-scrollbar { width: 4px; }
#academy-game-root .bdt-recap-list::-webkit-scrollbar-track { background: transparent; }
#academy-game-root .bdt-recap-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 4px; }

#academy-game-root .bdt-recap-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(15, 52, 96, 0.3);
  font-size: 13px;
  font-weight: 600;
}

#academy-game-root .bdt-recap-row.wrong,
#academy-game-root .bdt-recap-row.timeout { background: rgba(233, 69, 96, 0.1); }
#academy-game-root .bdt-recap-row.hit { background: rgba(46, 213, 115, 0.1); }
#academy-game-root .bdt-recap-row.slow { background: rgba(245, 197, 24, 0.08); }
#academy-game-root .bdt-recap-row.both_wrong,
#academy-game-root .bdt-recap-row.both_timeout { background: rgba(190, 75, 219, 0.08); }

#academy-game-root .bdt-recap-num {
  color: rgba(255, 255, 255, 0.3);
  font-size: 11px;
  min-width: 16px;
}

#academy-game-root .bdt-recap-icon { font-size: 14px; flex-shrink: 0; }

#academy-game-root .bdt-recap-q {
  flex: 1;
  color: rgba(255, 255, 255, 0.7);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#academy-game-root .bdt-recap-time {
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
  min-width: 35px;
  text-align: right;
}

#academy-game-root .bdt-recap-pts {
  font-size: 12px;
  font-weight: 800;
  min-width: 45px;
  text-align: right;
  color: rgba(255, 255, 255, 0.3);
}

#academy-game-root .bdt-recap-pts.pos { color: var(--bdt-success); }

#academy-game-root .bdt-results-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 8px;
}

/* Results staggered entrance animations */
@keyframes slideUpFade {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* 2026-07-24 : @keyframes popIn en double a ete retire ici. Il etait MORT : une seconde definition du meme nom existe plus bas et, en CSS, la derniere gagne pour tout le document. Retrait sans aucun changement visuel. Voir le bug jumeau ttmcFinalePulse, lui bien visible, corrige le meme jour. */
@keyframes glowPulse {
  0%, 100% { filter: drop-shadow(0 0 8px rgba(255,215,0,0.3)); }
  50%      { filter: drop-shadow(0 0 20px rgba(255,215,0,0.7)) drop-shadow(0 0 40px rgba(255,215,0,0.2)); }
}

#academy-game-root .bdt-results-title {
  animation: popIn 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
#academy-game-root .bdt-results-title.victory {
  animation: popIn 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both, glowPulse 2s ease-in-out infinite 0.8s;
}
#academy-game-root .bdt-results-title.defeat {
  animation: slideUpFade 0.6s ease both 0.1s;
}
#academy-game-root .bdt-results-subtitle {
  animation: slideUpFade 0.5s ease both 0.2s;
}
#academy-game-root .bdt-score-section {
  animation: popIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both 0.3s;
}
#academy-game-root .bdt-stats-grid {
  animation: slideUpFade 0.5s ease both 0.5s;
}
#academy-game-root .bdt-recap-section {
  animation: slideUpFade 0.5s ease both 0.7s;
}
#academy-game-root .bdt-rewards {
  animation: popIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both 0.9s;
}
#academy-game-root .bdt-badges {
  animation: slideUpFade 0.4s ease both 1.1s;
}
#academy-game-root .bdt-results-buttons {
  animation: slideUpFade 0.4s ease both 1.3s;
}

/* Leaderboard row entrance */
@keyframes lbSlideIn {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}
#academy-game-root .aca-lb-row {
  animation: lbSlideIn 0.3s ease both;
}
#academy-game-root .aca-lb-row:nth-child(1)  { animation-delay: 0.05s; }
#academy-game-root .aca-lb-row:nth-child(2)  { animation-delay: 0.1s; }
#academy-game-root .aca-lb-row:nth-child(3)  { animation-delay: 0.15s; }
#academy-game-root .aca-lb-row:nth-child(4)  { animation-delay: 0.2s; }
#academy-game-root .aca-lb-row:nth-child(5)  { animation-delay: 0.25s; }
#academy-game-root .aca-lb-row:nth-child(6)  { animation-delay: 0.3s; }
#academy-game-root .aca-lb-row:nth-child(7)  { animation-delay: 0.35s; }
#academy-game-root .aca-lb-row:nth-child(8)  { animation-delay: 0.4s; }
#academy-game-root .aca-lb-row:nth-child(9)  { animation-delay: 0.45s; }
#academy-game-root .aca-lb-row:nth-child(10) { animation-delay: 0.5s; }

/* --------------------------------------------------------------------------
   Confetti
   -------------------------------------------------------------------------- */
#academy-game-root .bdt-confetti-container {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 110;
  overflow: hidden;
}

#academy-game-root .bdt-confetti-piece {
  position: absolute;
  width: 10px;
  height: 10px;
  top: -10px;
  animation: confettiFall linear forwards;
}

#academy-game-root .bdt-confetti-piece.square { border-radius: 2px; }
#academy-game-root .bdt-confetti-piece.circle { border-radius: 50%; }

/* Floating Text */
#academy-game-root .bdt-float-text {
  position: absolute;
  font-size: 20px;
  font-weight: 900;
  pointer-events: none;
  z-index: 30;
  animation: floatUp 1.2s ease forwards;
}

/* --------------------------------------------------------------------------
   Countdown overlay
   -------------------------------------------------------------------------- */
#academy-game-root .bdt-countdown-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
  background: rgba(26, 26, 46, 0.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

#academy-game-root .bdt-countdown-number {
  font-size: 120px;
  font-weight: 900;
  color: var(--bdt-energy);
  text-shadow: 0 0 40px rgba(245, 197, 24, 0.6);
  animation: countdownPop 0.8s ease forwards;
}

/* --------------------------------------------------------------------------
   Keyframe Animations
   -------------------------------------------------------------------------- */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } }

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  10% { transform: translateX(-8px) rotate(-1deg); }
  20% { transform: translateX(8px) rotate(1deg); }
  30% { transform: translateX(-6px) rotate(-0.5deg); }
  40% { transform: translateX(6px) rotate(0.5deg); }
  50% { transform: translateX(-4px); }
  60% { transform: translateX(4px); }
  70% { transform: translateX(-2px); }
  80% { transform: translateX(2px); }
}

@keyframes bounce {
  0% { transform: scale(1); }
  20% { transform: scale(1.15); }
  40% { transform: scale(0.95); }
  60% { transform: scale(1.05); }
  80% { transform: scale(0.98); }
  100% { transform: scale(1); }
}

@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-80px) scale(0.8); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes slideInRight {
  from { opacity: 0; transform: translateX(80px) scale(0.8); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}

/* 2026-07-24 : @keyframes pulse en double a ete retire ici. Il etait MORT : une seconde definition du meme nom existe plus bas et, en CSS, la derniere gagne pour tout le document. Retrait sans aucun changement visuel. Voir le bug jumeau ttmcFinalePulse, lui bien visible, corrige le meme jour. */

@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

@keyframes confettiFall {
  0% { transform: translateY(0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translateY(100vh) rotate(720deg) scale(0.3); opacity: 0; }
}

@keyframes timerPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }

@keyframes popIn {
  0% { opacity: 0; transform: scale(0.3); }
  100% { opacity: 1; transform: scale(1); }
}

/* 2026-07-25 (decision de Pat, deleguee) : NE PAS restaurer le rebond de l'ancien
   popIn qui a ete retire le 2026-07-24. Ses 13 utilisateurs demandent tous la
   courbe cubic-bezier(0.34, 1.56, ...) : le 1.56 est un DEPASSEMENT, donc le
   rebond existe deja, produit par la courbe et non par l'animation. Ajouter le
   palier a 110 % ferait rebondir 13 elements deux fois (score, etoiles, titre de
   resultats, question, recompenses, panneau de deblocage de titre). Si le pop
   parait un jour trop plat, regle la COURBE, pas ces keyframes. */

/* 2026-07-25 (decision de Pat, deleguee) : bdtFadeIn etait reference 4 fois et
   defini NULLE PART, donc le navigateur ignorait la demande en silence et 4
   ecrans de 1,2,3 Co! surgissaient d'un coup (plateau, resultats, Collection,
   overlay QFlash). Fondu d'opacite PUR, volontairement sans deplacement : ces 4
   selecteurs sont des ecrans entiers, et un translate provoquerait un reflow et
   un saut de scroll a chaque transition. Les durees (0.2s a 0.4s) etaient deja
   ecrites aux points d'appel, je ne les touche pas. */
@keyframes bdtFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes hitFlash { 0% { opacity: 0.7; } 100% { opacity: 0; } }

@keyframes heartBreak {
  0% { transform: scale(1); }
  25% { transform: scale(1.3) rotate(-10deg); }
  50% { transform: scale(0.6) rotate(5deg); }
  100% { transform: scale(0.85) rotate(0); }
}

@keyframes floatUp {
  0% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-80px) scale(1.3); }
}

@keyframes legendaryPulse {
  0%, 100% { box-shadow: 0 0 20px rgba(245, 197, 24, 0.4); }
  50% { box-shadow: 0 0 35px rgba(245, 197, 24, 0.7); }
}

@keyframes countdownPop {
  0% { opacity: 0; transform: scale(2.5); }
  50% { opacity: 1; transform: scale(0.9); }
  100% { opacity: 0; transform: scale(0.5); }
}

/* --------------------------------------------------------------------------
   Sound mute button
   -------------------------------------------------------------------------- */
#academy-game-root .bdt-mute-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 100;
  background: rgba(255, 255, 255, 0.08);
  border: 2px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  width: 38px;
  height: 38px;
  font-size: 18px;
  line-height: 34px;
  text-align: center;
  cursor: pointer;
  color: var(--bdt-text);
  transition: var(--bdt-transition);
  padding: 0;
}
#academy-game-root .bdt-mute-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: var(--bdt-success);
}
#academy-game-root .bdt-mute-battle {
  top: 6px;
  right: 6px;
  width: 32px;
  height: 32px;
  font-size: 14px;
  line-height: 28px;
}

/* --------------------------------------------------------------------------
   Match History
   -------------------------------------------------------------------------- */
/* ============================================================
   Historique — refresh visuel v3.19.12
   Hero stats + cartes match avec accent gradient win/loss/draw.
   ============================================================ */
.aca-history-title {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 28px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin: 8px 0 22px;
  text-align: center;
  background: linear-gradient(135deg, #e94560 0%, #ff6b81 50%, #ffd700 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 30px rgba(233, 69, 96, 0.2);
}
.aca-history-title::after {
  content: '';
  display: block;
  margin: 8px auto 0;
  width: 56px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, transparent, #e94560, transparent);
  opacity: 0.8;
}

.aca-history-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 22px;
}
.aca-history-stat-box {
  position: relative;
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.5), rgba(26, 26, 46, 0.8));
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 14px 8px 12px;
  text-align: center;
  overflow: hidden;
  transition: transform 0.18s, border-color 0.18s;
}
.aca-history-stat-box::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top, rgba(0, 210, 255, 0.1), transparent 60%);
  pointer-events: none;
}
.aca-history-stat-box:hover {
  transform: translateY(-2px);
  border-color: rgba(0, 210, 255, 0.25);
}
.aca-history-stat-value {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 24px;
  font-weight: 900;
  color: #00d2ff;
  text-shadow: 0 0 14px rgba(0, 210, 255, 0.35);
  position: relative;
  z-index: 1;
}
.aca-history-stat-label {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 10px;
  color: rgba(255, 255, 255, 0.55);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 4px;
  position: relative;
  z-index: 1;
}

.aca-history-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.aca-history-match {
  display: flex;
  align-items: center;
  gap: 14px;
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.32), rgba(26, 26, 46, 0.58));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  padding: 14px;
  position: relative;
  overflow: hidden;
  transition: transform 0.18s ease-out, border-color 0.18s;
}
.aca-history-match::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: rgba(255, 255, 255, 0.1);
}
.aca-history-match:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.15);
}
.aca-history-match.win::before  { background: linear-gradient(180deg, #72efdd, #00d2ff, #0086ae); box-shadow: 0 0 12px rgba(0, 210, 255, 0.4); }
.aca-history-match.loss::before { background: linear-gradient(180deg, #ff8da1, #e94560, #8b1a2e); box-shadow: 0 0 12px rgba(233, 69, 96, 0.4); }
.aca-history-match.draw::before { background: linear-gradient(180deg, #ffe89c, #f5c518, #c58a00); box-shadow: 0 0 12px rgba(245, 197, 24, 0.4); }

.aca-history-result-icon {
  font-size: 30px;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.04);
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}
.aca-history-match-info {
  flex: 1;
  min-width: 0;
}
.aca-history-match-top {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 6px;
}
.aca-history-match-result {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-weight: 900;
  font-size: 15px;
  color: #fff;
  letter-spacing: 0.3px;
}
.aca-history-match.win  .aca-history-match-result { color: #72efdd; }
.aca-history-match.loss .aca-history-match-result { color: #ff8da1; }
.aca-history-match.draw .aca-history-match-result { color: #ffe89c; }

.aca-history-match-score {
  font-family: 'Menlo', 'Consolas', monospace;
  font-weight: 700;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
  background: rgba(0, 0, 0, 0.25);
  padding: 2px 8px;
  border-radius: 6px;
  letter-spacing: 1px;
}
.aca-history-match-bottom {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.aca-history-match-mode,
.aca-history-match-diff,
.aca-history-match-accuracy {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: rgba(255, 255, 255, 0.6);
  padding: 3px 9px;
  border-radius: 999px;
  text-transform: uppercase;
}
.aca-history-match-mode {
  background: rgba(233, 69, 96, 0.18);
  color: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(233, 69, 96, 0.3);
}
.aca-history-match-diff {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.aca-history-match-accuracy {
  background: rgba(78, 205, 196, 0.12);
  color: #72efdd;
  border: 1px solid rgba(78, 205, 196, 0.25);
  text-transform: none;
  letter-spacing: 0;
}
.aca-history-match-right {
  text-align: right;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.aca-history-match-rewards {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 14px;
  font-weight: 900;
  color: #f5c518;
  text-shadow: 0 0 10px rgba(245, 197, 24, 0.35);
  letter-spacing: 0.3px;
}
.aca-history-match-time {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 10px;
  color: rgba(255, 255, 255, 0.35);
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.aca-history-empty {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  text-align: center;
  color: rgba(255, 255, 255, 0.5);
  padding: 56px 20px;
  font-size: 15px;
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.2), rgba(26, 26, 46, 0.4));
  border-radius: 14px;
  border: 1px dashed rgba(255, 255, 255, 0.1);
}
.aca-history-loading {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  text-align: center;
  color: rgba(255, 255, 255, 0.5);
  padding: 56px 20px;
  font-size: 14px;
  letter-spacing: 1px;
}
.aca-history-loading::after {
  content: '';
  display: inline-block;
  margin-left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #00d2ff;
  animation: historyLoadingPulse 1s ease-in-out infinite;
  vertical-align: middle;
}
@keyframes historyLoadingPulse {
  0%, 100% { opacity: 0.3; transform: scale(0.8); }
  50%      { opacity: 1;   transform: scale(1.1); }
}
.aca-history-pager {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
}
.aca-history-page-info {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 13px;
  color: rgba(255,255,255,0.5);
}

/* --------------------------------------------------------------------------
   Menu Bottom Row
   -------------------------------------------------------------------------- */
#academy-game-root .aca-menu-bottom-row {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: 8px;
}
#academy-game-root .aca-menu-bottom-row .bdt-btn {
  flex: 1;
  max-width: 200px;
  font-size: 14px;
  padding: 10px 16px;
}

/* --------------------------------------------------------------------------
   Leaderboard
   -------------------------------------------------------------------------- */
/* ============================================================
   Classement — refresh visuel v3.19.12
   Plus de profondeur, podium marqué, métriques lisibles.
   ============================================================ */
#academy-game-root .aca-lb-title {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 28px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 3px;
  text-align: center;
  background: linear-gradient(135deg, #ffd700 0%, #ffb347 40%, #e94560 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 30px rgba(245, 197, 24, 0.25);
  margin: 8px 0 22px;
}
#academy-game-root .aca-lb-title::after {
  content: '';
  display: block;
  margin: 8px auto 0;
  width: 56px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, transparent, #ffd700, transparent);
  opacity: 0.8;
}

#academy-game-root .aca-lb-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 18px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 6px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.07);
}
#academy-game-root .aca-lb-tab {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.5px;
  padding: 8px 16px;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  cursor: pointer;
  transition: color 0.16s, background 0.16s, transform 0.16s;
}
#academy-game-root .aca-lb-tab:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.07);
}
#academy-game-root .aca-lb-tab.active {
  background: linear-gradient(135deg, #ffd700, #f0a500);
  color: #1a1a2e;
  box-shadow: 0 2px 10px rgba(245, 197, 24, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transform: translateY(-1px);
}

#academy-game-root .aca-lb-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#academy-game-root .aca-lb-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.35), rgba(26, 26, 46, 0.55));
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  position: relative;
  overflow: hidden;
  transition: transform 0.18s ease-out, border-color 0.18s;
}
#academy-game-root .aca-lb-row::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: rgba(255, 255, 255, 0.1);
  transition: width 0.18s;
}
#academy-game-root .aca-lb-row:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, 0.15);
}
#academy-game-root .aca-lb-row:hover::before {
  width: 5px;
}

/* Top 3 — podium look with glow + gradient edge */
#academy-game-root .aca-lb-top1 {
  background: linear-gradient(145deg, rgba(255, 215, 0, 0.18), rgba(245, 197, 24, 0.05));
  border-color: rgba(255, 215, 0, 0.35);
  box-shadow: 0 2px 20px rgba(255, 215, 0, 0.18);
}
#academy-game-root .aca-lb-top1::before { background: linear-gradient(180deg, #ffe89c, #ffd700, #c58a00); width: 5px; }
#academy-game-root .aca-lb-top2 {
  background: linear-gradient(145deg, rgba(220, 220, 230, 0.14), rgba(180, 180, 200, 0.04));
  border-color: rgba(200, 200, 210, 0.28);
}
#academy-game-root .aca-lb-top2::before { background: linear-gradient(180deg, #f0f0f5, #c0c0c8, #808088); width: 5px; }
#academy-game-root .aca-lb-top3 {
  background: linear-gradient(145deg, rgba(205, 127, 50, 0.16), rgba(150, 80, 30, 0.04));
  border-color: rgba(205, 127, 50, 0.3);
}
#academy-game-root .aca-lb-top3::before { background: linear-gradient(180deg, #e8a56b, #cd7f32, #8b5a1f); width: 5px; }

#academy-game-root .aca-lb-rank {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 16px;
  font-weight: 900;
  min-width: 40px;
  text-align: center;
  color: rgba(255, 255, 255, 0.45);
  flex-shrink: 0;
}
#academy-game-root .aca-lb-top1 .aca-lb-rank,
#academy-game-root .aca-lb-top2 .aca-lb-rank,
#academy-game-root .aca-lb-top3 .aca-lb-rank {
  font-size: 28px;
  filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.4));
}
#academy-game-root .aca-lb-top1 .aca-lb-rank { animation: lbTop1Pulse 2.4s ease-in-out infinite; }
@keyframes lbTop1Pulse {
  0%, 100% { transform: scale(1) rotate(0deg); }
  50%      { transform: scale(1.08) rotate(-3deg); }
}

#academy-game-root .aca-lb-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.08);
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 16px;
  font-weight: 800;
  color: #fff;
  border: 2px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
#academy-game-root .aca-lb-top1 .aca-lb-avatar { border-color: #ffd700; box-shadow: 0 0 12px rgba(255, 215, 0, 0.4); }
#academy-game-root .aca-lb-top2 .aca-lb-avatar { border-color: #c0c0c0; box-shadow: 0 0 10px rgba(192, 192, 192, 0.3); }
#academy-game-root .aca-lb-top3 .aca-lb-avatar { border-color: #cd7f32; box-shadow: 0 0 10px rgba(205, 127, 50, 0.3); }
#academy-game-root .aca-lb-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#academy-game-root .aca-lb-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
#academy-game-root .aca-lb-name {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.2px;
}
#academy-game-root .aca-lb-sub {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 11px;
  color: rgba(255, 255, 255, 0.42);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.3px;
}

#academy-game-root .aca-lb-stats {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-weight: 800;
}
#academy-game-root .aca-lb-wins,
#academy-game-root .aca-lb-losses {
  font-size: 12px;
  padding: 3px 8px;
  border-radius: 8px;
}
#academy-game-root .aca-lb-wins {
  color: #4ecdc4;
  background: rgba(78, 205, 196, 0.12);
  border: 1px solid rgba(78, 205, 196, 0.2);
}
#academy-game-root .aca-lb-losses {
  color: #e74c3c;
  background: rgba(231, 76, 60, 0.12);
  border: 1px solid rgba(231, 76, 60, 0.2);
}
#academy-game-root .aca-lb-wr {
  color: #ffd700;
  font-size: 15px;
  font-weight: 900;
  min-width: 48px;
  text-align: right;
  text-shadow: 0 0 8px rgba(255, 215, 0, 0.35);
}

/* BuddyBoss wrapper for dark theme */
.academy-match-history-wrap {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 480px) {
  #academy-game-root { padding: 12px; }

  #academy-game-root .aca-menu-title { font-size: 22px; letter-spacing: 2px; }
  #academy-game-root .aca-logo-big { width: 60px; height: 60px; }
  #academy-game-root .aca-level-btn { font-size: 12px; padding: 7px 12px; }
  #academy-game-root .aca-mode-card { padding: 14px 8px; }
  #academy-game-root .aca-mode-icon { font-size: 26px; }
  #academy-game-root .aca-mode-label { font-size: 12px; }

  #academy-game-root .bdt-matchmaking-title { font-size: 20px; letter-spacing: 1px; }
  #academy-game-root .bdt-avatar-wrap { width: 60px; height: 60px; }
  #academy-game-root .bdt-player-name { font-size: 13px; }
  #academy-game-root .bdt-vs-text { font-size: 24px; }

  #academy-game-root .bdt-question-display .bdt-equation { font-size: 34px; }
  #academy-game-root .bdt-question-prompt { font-size: 15px; }
  #academy-game-root .bdt-question-word { font-size: 26px; }
  #academy-game-root .bdt-answer-btn { font-size: 18px; padding: 14px 10px; }

  #academy-game-root .bdt-results-title { font-size: 30px; letter-spacing: 2px; }
  #academy-game-root .bdt-score-value { font-size: 30px; }
  #academy-game-root .bdt-stars { font-size: 26px; }
  #academy-game-root .bdt-stats-grid { grid-template-columns: repeat(2, 1fr); }
  #academy-game-root .bdt-recap-q { max-width: 120px; }
  #academy-game-root .bdt-feedback-text { font-size: 32px; }
  #academy-game-root .bdt-topbar-name { font-size: 11px; max-width: 70px; }
  #academy-game-root .bdt-topbar-player .bdt-mini-avatar { width: 32px; height: 32px; }
  #academy-game-root .bdt-btn { font-size: 14px; padding: 12px 24px; }
  #academy-game-root .bdt-countdown-number { font-size: 80px; }
}

@media (max-width: 360px) {
  #academy-game-root .bdt-question-display .bdt-equation { font-size: 26px; }
  #academy-game-root .bdt-question-word { font-size: 22px; }
  #academy-game-root .bdt-answers { gap: 8px; }
  #academy-game-root .bdt-answer-btn { font-size: 16px; padding: 12px 8px; }
  #academy-game-root .aca-modes { gap: 8px; }
}

/* ==========================================================================
   Title Unlock Celebration (appears on Results screen when new titles unlocked)
   ========================================================================== */
#academy-game-root .aca-title-unlock-panel {
  width: 100%;
  max-width: 520px;
  margin: 16px auto 0;
  padding: 20px;
  background: linear-gradient(135deg, rgba(245, 197, 24, 0.15), rgba(233, 69, 96, 0.08), rgba(0, 210, 255, 0.12));
  border: 2px solid rgba(245, 197, 24, 0.4);
  border-radius: 14px;
  box-shadow: 0 0 40px rgba(245, 197, 24, 0.2);
  animation: popIn 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both 0.4s;
}
#academy-game-root .aca-title-unlock-header {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 18px;
  font-weight: 900;
  text-align: center;
  color: #ffd700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 14px;
  text-shadow: 0 2px 10px rgba(255, 215, 0, 0.4);
}
#academy-game-root .aca-title-unlock-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#academy-game-root .aca-title-unlock-card {
  padding: 12px 16px;
  background: rgba(0, 0, 0, 0.35);
  border-radius: 10px;
  border-left: 4px solid #999;
  animation: slideUpFade 0.5s ease both;
}
#academy-game-root .aca-title-unlock-card.rarity-common    { border-left-color: #d0d5e0; }
#academy-game-root .aca-title-unlock-card.rarity-rare      { border-left-color: #00d2ff; box-shadow: 0 0 15px rgba(0,210,255,0.2); }
#academy-game-root .aca-title-unlock-card.rarity-epic      { border-left-color: #cc88ff; box-shadow: 0 0 15px rgba(204,136,255,0.25); }
#academy-game-root .aca-title-unlock-card.rarity-legendary { border-left-color: #f5c518; box-shadow: 0 0 20px rgba(245,197,24,0.35); }
#academy-game-root .aca-title-unlock-card.rarity-secret    { border-left-color: #e94560; box-shadow: 0 0 15px rgba(233,69,96,0.3); background: linear-gradient(90deg, rgba(233,69,96,0.1), rgba(0,0,0,0.35)); }

#academy-game-root .aca-title-unlock-rarity {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 4px;
}
#academy-game-root .aca-title-unlock-card.rarity-common .aca-title-unlock-rarity    { color: #d0d5e0; }
#academy-game-root .aca-title-unlock-card.rarity-rare .aca-title-unlock-rarity      { color: #00d2ff; }
#academy-game-root .aca-title-unlock-card.rarity-epic .aca-title-unlock-rarity      { color: #cc88ff; }
#academy-game-root .aca-title-unlock-card.rarity-legendary .aca-title-unlock-rarity { color: #f5c518; }
#academy-game-root .aca-title-unlock-card.rarity-secret .aca-title-unlock-rarity    { color: #e94560; }

#academy-game-root .aca-title-unlock-label {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}

/* ==========================================================================
   Tivan Arena Integration (Snippet 4)
   ========================================================================== */
#academy-game-root .aca-tivan-arena {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100vh;
  align-items: center;
  /* BREAK OUT of WP theme's content width container.
     Negative margins push us to the viewport edges regardless of parent width. */
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
}

#academy-game-root .arene-tivan-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 560px;
  padding: 10px 16px;
  background: linear-gradient(135deg, rgba(0,0,0,0.5), rgba(0,0,0,0.3));
  border: 2px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  color: #fff;
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-weight: 800;
}
#academy-game-root .arene-tivan-header .arene-hearts {
  font-size: 16px;
  letter-spacing: 2px;
}
#academy-game-root .arene-tivan-header .arene-timer {
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  color: #ffd700;
  min-width: 60px;
  text-align: center;
}
#academy-game-root .arene-tivan-header .arene-timer.arene-timer-warning {
  color: #e94560;
  animation: pulse 0.5s ease infinite;
}
#academy-game-root .arene-tivan-header .arene-score {
  font-size: 18px;
  color: #4ecdc4;
  min-width: 80px;
  text-align: right;
}

/* Count-up timer for Tivan — increments 00:00 → ∞, drives survival bonus */
#academy-game-root .arene-tivan-header .arene-countup,
#academy-game-root .arene-tivan-header .arene-correct {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
#academy-game-root .arene-tivan-header .arene-countup .arene-label,
#academy-game-root .arene-tivan-header .arene-correct .arene-label,
#academy-game-root .arene-tivan-header .arene-score .arene-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.55);
  text-transform: uppercase;
}
#academy-game-root .arene-tivan-header .arene-countup .arene-value {
  font-size: 20px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: #ffd700;
}
#academy-game-root .arene-tivan-header .arene-correct .arene-value {
  font-size: 18px;
  font-weight: 900;
  color: #e8eefc;
}

/* Tivan survival summary (results screen) — shows duration + bonus breakdown */
#academy-game-root .aca-tivan-survival {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 16px auto 20px;
  padding: 14px 18px;
  max-width: 460px;
  background: linear-gradient(180deg, rgba(255, 215, 0, 0.08) 0%, rgba(78, 205, 196, 0.05) 100%);
  border: 1px solid rgba(255, 215, 0, 0.25);
  border-radius: 12px;
}
#academy-game-root .aca-tivan-survival-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.25), transparent);
  margin: 6px 0;
}
#academy-game-root .aca-tivan-survival-subtitle {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255, 215, 0, 0.7);
  text-align: center;
  padding: 2px 0 4px;
}
#academy-game-root .aca-tivan-survival-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 14px;
}
#academy-game-root .aca-tivan-survival-label {
  color: rgba(232, 238, 252, 0.75);
  font-weight: 600;
  letter-spacing: 0.3px;
}
#academy-game-root .aca-tivan-survival-value {
  color: #e8eefc;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
#academy-game-root .aca-tivan-survival-row.bonus .aca-tivan-survival-value {
  color: #ffd700;
  font-size: 16px;
}

#academy-game-root .aca-tivan-arena .tivan-wrapper {
  /* Take almost the entire viewport on desktop. */
  width: calc(100vw - 40px);
  max-width: 1800px;
  background: linear-gradient(180deg, #0d0d1a 0%, #161632 100%);
  border-radius: 14px;
  border: 3px solid #f5c518;
  box-shadow: 0 0 40px rgba(245, 197, 24, 0.25), 0 0 0 3px #1a1a2e inset;
  position: relative;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  outline: none;
  image-rendering: pixelated;
}
#academy-game-root .aca-tivan-arena .tivan-wrapper:focus {
  border-color: rgba(0, 210, 255, 0.6);
  box-shadow: 0 0 30px rgba(0, 210, 255, 0.25), inset 0 0 40px rgba(0, 0, 0, 0.3);
}

/* Inline equation header — HUGE banner so the player can't miss what to eat */
#academy-game-root .aca-tivan-arena .tivan-header.aca-tivan-header-inline {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 16px 20px;
  background: linear-gradient(135deg, rgba(233, 69, 96, 0.15), rgba(245, 197, 24, 0.1), rgba(0, 210, 255, 0.12));
  border-radius: 12px;
  border: 2px solid rgba(245, 197, 24, 0.35);
  box-shadow: 0 0 20px rgba(245, 197, 24, 0.15), inset 0 0 20px rgba(0, 0, 0, 0.3);
  position: relative;
}
#academy-game-root .aca-tivan-arena .aca-tivan-eq-label {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 12px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.55);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
#academy-game-root .aca-tivan-arena .tivan-equation {
  font-family: 'Courier New', 'Menlo', 'Consolas', monospace;
  font-size: clamp(36px, 8vw, 56px);
  font-weight: 900;
  color: #fde047;
  letter-spacing: 0.06em;
  text-shadow:
    0 0 6px rgba(253, 224, 71, 0.5),
    0 0 12px rgba(253, 224, 71, 0.3),
    2px 2px 0 #1a1a2e,
    -2px 2px 0 #1a1a2e,
    2px -2px 0 #1a1a2e,
    -2px -2px 0 #1a1a2e;
  line-height: 1.1;
  text-align: center;
  min-height: 1.1em;
  text-transform: uppercase;
}
#academy-game-root .aca-tivan-arena .tivan-scoreboard {
  font-family: var(--bdt-font, 'Nunito', sans-serif);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.55);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-top: 2px;
}
#academy-game-root .aca-tivan-arena .tivan-score {
  font-size: 18px;
  color: #00d2ff;
  font-weight: 900;
  margin-left: 6px;
  letter-spacing: 0;
}

/* Canvas stage — aspect-ratio locks height to width so the canvas fills the
   container with NO black bars. The rough "cave wall" border makes the edges
   feel dangerous. */
#academy-game-root .aca-tivan-arena .tivan-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  /* Keep equation banner + arena header visible above the stage : cap the
     stage height so it never pushes scoring/equation off-screen. Width is
     auto-reduced proportionally by aspect-ratio. */
  max-height: calc(100vh - 320px);
  margin: 0 auto;
  background: #0a0a14;
  border-radius: 10px;
  overflow: hidden;
  /* Rough double border — looks chipped/dangerous, inspired by retro arcade */
  border: 4px solid transparent;
  background-clip: padding-box;
  box-shadow:
    0 0 0 3px #1a1a2e,
    0 0 0 5px #e94560,
    0 0 0 8px #1a1a2e,
    inset 0 0 30px rgba(233, 69, 96, 0.25),
    inset 0 0 60px rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Decorative corner "spikes" that make the walls look pixelated/rough */
#academy-game-root .aca-tivan-arena .tivan-stage::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  background:
    /* top-left corner spike */
    linear-gradient(135deg, #e94560 0, #e94560 12px, transparent 12px) top left / 24px 24px no-repeat,
    /* top-right */
    linear-gradient(225deg, #e94560 0, #e94560 12px, transparent 12px) top right / 24px 24px no-repeat,
    /* bottom-left */
    linear-gradient(45deg, #e94560 0, #e94560 12px, transparent 12px) bottom left / 24px 24px no-repeat,
    /* bottom-right */
    linear-gradient(315deg, #e94560 0, #e94560 12px, transparent 12px) bottom right / 24px 24px no-repeat;
  opacity: 0.7;
}

#academy-game-root .aca-tivan-arena .tivan-stage canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

/* CRT scanline overlay — subtle retro effect over the canvas */
#academy-game-root .aca-tivan-arena .tivan-stage::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0,
    rgba(0, 0, 0, 0) 2px,
    rgba(0, 0, 0, 0.12) 2px,
    rgba(0, 0, 0, 0.12) 3px
  );
  mix-blend-mode: multiply;
  opacity: 0.6;
}


/* D-pad — mobile controls */
#academy-game-root .aca-tivan-arena .tivan-dpad {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
}
#academy-game-root .aca-tivan-arena .tivan-dpad .row {
  display: flex;
  gap: 40px;
}
#academy-game-root .aca-tivan-arena .tivan-dpad .dpad {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(233, 69, 96, 0.25), rgba(233, 69, 96, 0.1));
  border: 2px solid rgba(233, 69, 96, 0.5);
  color: #fff;
  font-size: 20px;
  font-weight: 900;
  cursor: pointer;
  transition: all 0.15s ease;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
#academy-game-root .aca-tivan-arena .tivan-dpad .dpad:hover {
  background: linear-gradient(135deg, rgba(233, 69, 96, 0.4), rgba(233, 69, 96, 0.2));
}
#academy-game-root .aca-tivan-arena .tivan-dpad .dpad:active {
  transform: scale(0.88);
  background: linear-gradient(135deg, #e94560, #d63851);
}

/* Show dpad only on touch/small screens */
@media (min-width: 768px) and (hover: hover) {
  #academy-game-root .aca-tivan-arena .tivan-dpad { display: none; }
}

#academy-game-root .aca-tivan-quit {
  font-size: 13px;
  padding: 8px 16px;
  margin-top: 8px;
}

/* Particle bursts when snake eats a correct answer */
#academy-game-root .aca-tivan-arena .tivan-particle {
  position: absolute;
  pointer-events: none;
  font-family: 'Courier New', monospace;
  font-size: 20px;
  font-weight: 900;
  color: #fde047;
  text-shadow: 2px 2px 0 #1a1a2e, -2px -2px 0 #1a1a2e, 2px -2px 0 #1a1a2e, -2px 2px 0 #1a1a2e;
  z-index: 10;
  animation: tivanParticle 1s ease-out forwards;
}

@keyframes tivanParticle {
  0%   { opacity: 1;   transform: translate(-50%, -50%) scale(0.5); }
  25%  { opacity: 1;   transform: translate(calc(-50% + var(--dx, 0) * 0.3), calc(-50% + var(--dy, 0) * 0.3)) scale(1.2); }
  100% { opacity: 0;   transform: translate(calc(-50% + var(--dx, 0)), calc(-50% + var(--dy, 0))) scale(0.8); }
}

/* Canvas shake when eating a BAD answer */
#academy-game-root .aca-tivan-arena .tivan-shake {
  animation: tivanShake 0.4s ease;
}
@keyframes tivanShake {
  0%, 100% { transform: translate(0, 0); }
  20%      { transform: translate(-4px, 2px); }
  40%      { transform: translate(4px, -2px); }
  60%      { transform: translate(-3px, -1px); }
  80%      { transform: translate(2px, 2px); }
}

/* Hide Tivan's internal overlays in arena mode (we have our own UX) */
#academy-game-root .tivan-arena-mode .tivan-start,
#academy-game-root .tivan-arena-mode .tivan-end,
#academy-game-root .tivan-arena-mode .tivan-pause,
#academy-game-root .tivan-arena-mode .tivan-footer {
  display: none !important;
}
/* DON'T hide .tivan-header in arena mode — we need the equation visible */

/* Hint for keyboard users */
#academy-game-root .aca-tivan-arena::after {
  /* 2026-07-24 : les echappements de type barre-oblique-u sont du JAVASCRIPT,
     pas du CSS. En CSS, une barre oblique suivie d'un caractere non hexadecimal
     vaut ce caractere en litteral, donc le « u » restait affiche et l'enfant
     lisait « Flu00e8ches ou WASD pour bouger u2022 Espace = pause ». On remet
     les vrais caracteres (le fichier est en UTF-8 et en contient deja ailleurs).
     Taille et opacite remontees au passage : consigne de jeu, donc a lire. */
  content: "⌨  Flèches ou WASD pour bouger  •  Espace = pause";
  display: block;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  font-size: 12px;
  margin-top: 8px;
  letter-spacing: 0.02em;
}
@media (hover: none) {
  #academy-game-root .aca-tivan-arena::after {
    content: "Glissez sur le canvas ou utilisez les boutons ci-dessous";
  }
}

@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.1); }
}

/* 2026-07-25 (decision de Pat, deleguee) : la respiration (variation d'opacite)
   de l'ancien pulse retire le 2026-07-24 est restauree ICI, sur la RECHERCHE
   D'ADVERSAIRE seulement (.bdt-searching-icon et .bdt-searching-text). Un pouls
   qui s'estompe dit « ca travaille » mieux qu'un zoom.
   Le chrono critique de Tivan (.arene-timer-warning) garde volontairement le
   `pulse` ci-dessus, zoom pur : un chrono qui clignote en fondu pendant que
   l'enfant joue contre la montre ajoute du stress au lieu d'informer.
   C'est pour ca que ce sont DEUX animations et non une seule. */
@keyframes bdtSearchPulse {
  0%, 100% { opacity: 1;   transform: scale(1); }
  50%      { opacity: 0.6; transform: scale(1.05); }
}

/* ==========================================================================
   Match-quality banner (shown above VS row once opponent is resolved)
   ========================================================================== */
#academy-game-root .bdt-match-banner {
  font-family: var(--bdt-font);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 6px 18px;
  border-radius: 50px;
  border: 2px solid rgba(255, 255, 255, 0.2);
  background: rgba(15, 52, 96, 0.6);
  color: rgba(255, 255, 255, 0.9);
  text-align: center;
  margin: 0 auto -6px;
  max-width: 90%;
  animation: bannerPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 0 14px rgba(0, 0, 0, 0.3);
}
#academy-game-root .bdt-match-banner-best {
  background: linear-gradient(135deg, #f5c518, #e94560);
  border-color: #fff4bf;
  color: #1a1a2e;
  text-shadow: 0 0 6px rgba(255, 244, 191, 0.8);
  box-shadow: 0 0 24px rgba(245, 197, 24, 0.55), 0 0 48px rgba(233, 69, 96, 0.25);
  animation: bannerPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), bannerBestGlow 1.6s ease-in-out infinite;
}
#academy-game-root .bdt-match-banner-good {
  background: linear-gradient(135deg, #0984e3, #00d2ff);
  border-color: #e6fbff;
  color: #0a1a2e;
  box-shadow: 0 0 18px rgba(0, 210, 255, 0.45);
}
#academy-game-root .bdt-match-banner-ok {
  background: rgba(30, 50, 90, 0.7);
  border-color: rgba(255, 255, 255, 0.25);
}
#academy-game-root .bdt-match-banner-bot {
  background: rgba(50, 50, 70, 0.7);
  border-color: rgba(255, 255, 255, 0.15);
  color: rgba(255, 255, 255, 0.7);
}
@keyframes bannerPop {
  0%   { transform: translateY(-8px) scale(0.8); opacity: 0; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}
@keyframes bannerBestGlow {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(245, 197, 24, 0.6)); }
  50%      { filter: drop-shadow(0 0 14px rgba(245, 197, 24, 1)) drop-shadow(0 0 24px rgba(233, 69, 96, 0.6)); }
}

/* ==========================================================================
   Street Fighter: arcade buttons + READY/FIGHT intro overlay
   ========================================================================== */

/* --- SF difficulty selector (arcade pill with chunky outline) --- */
#academy-game-root .bdt-matchmaking .bdt-difficulty-label {
  font-family: var(--bdt-font);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.85);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

#academy-game-root .bdt-matchmaking .bdt-diff-btn {
  font-family: var(--bdt-font);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1px;
  padding: 11px 22px;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, 0.25);
  background: linear-gradient(180deg, rgba(30, 30, 60, 0.85), rgba(10, 10, 26, 0.9));
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.15),
    inset 0 -3px 0 rgba(0, 0, 0, 0.4),
    0 3px 0 rgba(0, 0, 0, 0.6);
  transform: translateY(0);
  transition: transform 0.08s ease, box-shadow 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
#academy-game-root .bdt-matchmaking .bdt-diff-btn:hover {
  border-color: #00d2ff;
  color: #e6fbff;
}
#academy-game-root .bdt-matchmaking .bdt-diff-btn:active {
  transform: translateY(2px);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(0, 0, 0, 0.4),
    0 1px 0 rgba(0, 0, 0, 0.6);
}
#academy-game-root .bdt-matchmaking .bdt-diff-btn.active {
  border-color: #f5c518;
  color: #fff;
  background: linear-gradient(180deg, #e94560 0%, #8a1e34 100%);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.3),
    inset 0 -3px 0 rgba(0, 0, 0, 0.45),
    0 3px 0 #4a0a1a,
    0 0 20px rgba(233, 69, 96, 0.55);
}

/* --- Fight button ("COMBATTRE !") — softer, less aggressive --- */
#academy-game-root .bdt-matchmaking > .bdt-btn-primary {
  font-family: var(--bdt-font);
  font-size: 19px;
  font-weight: 900;
  letter-spacing: 1.5px;
  padding: 15px 40px;
  border-radius: 12px;
  border: 2px solid #f5c518;
  background: linear-gradient(180deg, #ee5a6f 0%, #c73e55 100%);
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.2),
    inset 0 -3px 0 rgba(0, 0, 0, 0.25),
    0 4px 0 rgba(70, 20, 30, 0.6),
    0 0 20px rgba(238, 90, 111, 0.35);
  animation: sfFightPulse 2s ease-in-out infinite;
}
#academy-game-root .bdt-matchmaking > .bdt-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.25),
    inset 0 -3px 0 rgba(0, 0, 0, 0.25),
    0 5px 0 rgba(70, 20, 30, 0.6),
    0 0 26px rgba(238, 90, 111, 0.5);
}
#academy-game-root .bdt-matchmaking > .bdt-btn-primary:active {
  transform: translateY(3px);
  box-shadow:
    inset 0 3px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(0, 0, 0, 0.35),
    0 2px 0 #4a0a1a,
    0 0 20px rgba(233, 69, 96, 0.55);
}
@keyframes sfFightPulse {
  0%, 100% { filter: brightness(1); }
  50%      { filter: brightness(1.15); }
}
@keyframes sfFightShake {
  0%, 100% { transform: translate(0, -1px); }
  25%      { transform: translate(-1px, -1px) rotate(-0.4deg); }
  50%      { transform: translate(1px, -2px) rotate(0.4deg); }
  75%      { transform: translate(-1px, 0px) rotate(-0.2deg); }
}

/* --- SF READY / FIGHT! intro overlay --- */
#academy-game-root .bdt-fight-intro {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(10, 10, 26, 0.55), rgba(10, 10, 26, 0.92) 70%);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  pointer-events: none;
  overflow: hidden;
  animation: sfIntroFadeIn 0.2s ease-out;
}
#academy-game-root .bdt-fight-intro::before,
#academy-game-root .bdt-fight-intro::after {
  content: '';
  position: absolute;
  top: 50%;
  left: -20%;
  width: 140%;
  height: 80px;
  background: linear-gradient(90deg, transparent, rgba(245, 197, 24, 0.35), rgba(233, 69, 96, 0.45), transparent);
  transform: translateY(-50%) rotate(-3deg);
  filter: blur(6px);
  animation: sfBannerSweep 1.2s ease-in-out infinite;
}
#academy-game-root .bdt-fight-intro::after {
  height: 20px;
  filter: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  animation: sfBannerSweep 1.2s ease-in-out infinite 0.3s;
}
#academy-game-root .bdt-fight-intro.bdt-fight-fadeout {
  animation: sfIntroFadeOut 0.26s ease-in forwards;
}
@keyframes sfIntroFadeIn  { from { opacity: 0; } to { opacity: 1; } }
@keyframes sfIntroFadeOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes sfBannerSweep {
  0%   { transform: translate(-60%, -50%) rotate(-3deg); opacity: 0.5; }
  50%  { opacity: 1; }
  100% { transform: translate(40%, -50%) rotate(-3deg); opacity: 0.5; }
}

#academy-game-root .bdt-fight-ready,
#academy-game-root .bdt-fight-go {
  position: relative;
  z-index: 1;
  /* System font at 900 — no more Impact. Readability > arcade authenticity. */
  font-family: var(--bdt-font);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -1.5px;
  text-align: center;
  white-space: nowrap;
  user-select: none;
  pointer-events: none;
}
#academy-game-root .bdt-fight-ready {
  font-size: clamp(38px, 9.5vw, 115px);
  letter-spacing: -1px;
  color: #fff4bf;
  background: linear-gradient(180deg, #fff4bf 0%, #f5c518 55%, #c58a00 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 3px 3px 0 #1a1a2e;
  filter: drop-shadow(0 0 14px rgba(245, 197, 24, 0.55));
  animation: sfReadyPop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
#academy-game-root .bdt-fight-go {
  font-size: clamp(42px, 11vw, 150px);
  letter-spacing: -1px;
  color: #fff;
  /* Solid fill (not gradient text) for sharpness — softer coral palette */
  background: linear-gradient(180deg, #ffd84a 0%, #ee5a6f 55%, #a83a4c 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 3px 3px 0 #1a1a2e;
  filter: drop-shadow(0 0 18px rgba(238, 90, 111, 0.55)) drop-shadow(0 0 40px rgba(245, 197, 24, 0.3));
  animation: sfFightPop 0.55s cubic-bezier(0.34, 1.8, 0.64, 1);
}
@keyframes sfReadyPop {
  0%   { transform: scale(0.2) rotate(-14deg); opacity: 0; }
  55%  { transform: scale(1.15) rotate(6deg); opacity: 1; }
  80%  { transform: scale(0.95) rotate(-2deg); }
  100% { transform: scale(1) rotate(0deg); }
}
@keyframes sfFightPop {
  0%   { transform: scale(0.1) rotate(-20deg) skewX(10deg); opacity: 0; }
  60%  { transform: scale(1.3) rotate(8deg) skewX(-6deg); opacity: 1; }
  80%  { transform: scale(0.9) rotate(-3deg) skewX(2deg); }
  100% { transform: scale(1) rotate(0deg) skewX(0); }
}
@keyframes sfFightRumble {
  0%, 100% { transform: translate(0, 0); }
  25%      { transform: translate(-3px, 1px); }
  50%      { transform: translate(2px, -2px); }
  75%      { transform: translate(-1px, 2px); }
}

/* --- Mobile: stack SF portraits vertically with VS between --- */
@media (max-width: 560px) {
  #academy-game-root .bdt-versus-row {
    flex-direction: column;
    gap: 8px;
    padding: 12px 4px;
    max-width: 100%;
  }
  #academy-game-root .bdt-versus-row .bdt-player:first-child,
  #academy-game-root .bdt-versus-row .bdt-player:last-child,
  #academy-game-root .bdt-versus-row .bdt-searching {
    max-width: 92%;
    width: 92%;
    transform: none;
    animation: sfSlideInMobile 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  #academy-game-root .bdt-versus-row .bdt-player:first-child::before,
  #academy-game-root .bdt-versus-row .bdt-player:last-child::before,
  #academy-game-root .bdt-versus-row .bdt-searching::before {
    top: -8px;
  }
  #academy-game-root .bdt-vs-divider { min-width: 0; }
  #academy-game-root .bdt-vs-text { font-size: 54px; letter-spacing: -2px; }
  #academy-game-root .bdt-versus-row + .bdt-versus-row {
    flex-direction: row;
    padding: 0 20px;
    gap: 20px;
  }
  #academy-game-root .bdt-matchmaking > .bdt-btn-primary {
    font-size: 18px;
    padding: 14px 32px;
    letter-spacing: 3px;
  }
  #academy-game-root .bdt-matchmaking .bdt-diff-btn {
    font-size: 12px;
    padding: 9px 16px;
    letter-spacing: 1.5px;
  }
}
@keyframes sfSlideInMobile {
  0%   { transform: translateY(20px) scale(0.9); opacity: 0; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}

/* ==========================================================================
   Nouveautés — showcase of recent arena additions on the menu screen
   ========================================================================== */
#academy-game-root .aca-news-section {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
}

#academy-game-root .aca-news-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

#academy-game-root .aca-news-card {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(30, 30, 60, 0.75), rgba(15, 52, 96, 0.55));
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25),
              inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  animation: newsCardFadeIn 0.5s ease;
}
#academy-game-root .aca-news-card-clickable {
  cursor: pointer;
}
#academy-game-root .aca-news-card-clickable:hover {
  transform: translateY(-2px);
  border-color: rgba(0, 210, 255, 0.5);
  box-shadow: 0 6px 20px rgba(0, 210, 255, 0.25),
              inset 0 1px 0 rgba(255, 255, 255, 0.15);
}
#academy-game-root .aca-news-card-clickable:active {
  transform: translateY(0);
}

#academy-game-root .aca-news-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  line-height: 1;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 12px;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
}

#academy-game-root .aca-news-text {
  flex: 1;
  min-width: 0; /* allow ellipsis inside flex child */
}

#academy-game-root .aca-news-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}

#academy-game-root .aca-news-title {
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.2px;
}

#academy-game-root .aca-news-badge {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  padding: 2px 8px;
  border-radius: 50px;
  background: linear-gradient(135deg, #f5c518, #e94560);
  color: #1a1a2e;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 10px rgba(245, 197, 24, 0.5);
  animation: newsBadgePulse 1.8s ease-in-out infinite;
  text-transform: uppercase;
}

#academy-game-root .aca-news-desc {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.35;
}

@keyframes newsCardFadeIn {
  0%   { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes newsBadgePulse {
  0%, 100% { filter: brightness(1)   drop-shadow(0 0 4px rgba(245, 197, 24, 0.4)); }
  50%      { filter: brightness(1.2) drop-shadow(0 0 10px rgba(245, 197, 24, 0.9)); }
}

@media (max-width: 480px) {
  #academy-game-root .aca-news-icon { width: 36px; height: 36px; font-size: 22px; }
  #academy-game-root .aca-news-title { font-size: 13px; }
  #academy-game-root .aca-news-desc  { font-size: 11px; }
}

/* ============================================================
   TTMC — Tu Te Mets Combien ? (v3.19.22)
   Plateau serpentin 5\u00d75, cartes 1-10, 4 joueurs avec pions color\u00e9s.
   ============================================================ */
#academy-game-root .ttmc-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  padding: 12px;
  animation: fadeIn 0.4s ease;
}
#academy-game-root .ttmc-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
#academy-game-root .ttmc-title {
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 1.5px;
  background: linear-gradient(135deg, #00d2ff, #f5c518, #e94560);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
#academy-game-root .ttmc-quit { font-size: 12px; padding: 6px 12px; }
#academy-game-root .ttmc-turn-counter {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
  padding: 6px 12px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}
#academy-game-root .ttmc-turn-counter b {
  color: #f5c518;
  font-size: 14px;
  margin-left: 4px;
}

/* Players list strip */
#academy-game-root .ttmc-players-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  width: 100%;
}
#academy-game-root .ttmc-plist-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.35), rgba(26, 26, 46, 0.55));
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 12px;
  font-weight: 700;
  transition: transform 0.2s, border-color 0.2s;
}
#academy-game-root .ttmc-plist-item.active {
  transform: translateY(-2px);
  border-color: rgba(245, 197, 24, 0.55);
  box-shadow: 0 0 14px rgba(245, 197, 24, 0.3);
}
#academy-game-root .ttmc-plist-item.winner {
  border-color: #4ade80;
  box-shadow: 0 0 20px rgba(74, 222, 128, 0.5);
}
#academy-game-root .ttmc-plist-dot {
  width: 14px; height: 14px; border-radius: 50%;
  box-shadow: 0 0 8px currentColor;
  flex-shrink: 0;
}
#academy-game-root .ttmc-plist-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
}
#academy-game-root .ttmc-plist-pos {
  color: rgba(255, 255, 255, 0.5);
  font-size: 10px;
}
#academy-game-root .ttmc-plist-score {
  color: #f5c518;
  font-size: 11px;
  font-weight: 900;
}

/* Board 5\u00d75 */
#academy-game-root .ttmc-board {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
  width: 100%;
  max-width: 600px;
  aspect-ratio: 5 / 5;
  padding: 6px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 14px;
  border: 1.5px solid rgba(255, 255, 255, 0.08);
}
#academy-game-root .ttmc-case {
  position: relative;
  background: linear-gradient(145deg, rgba(15, 52, 96, 0.4), rgba(26, 26, 46, 0.7));
  border: 1.5px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  transition: background 0.18s;
}
#academy-game-root .ttmc-case-num {
  font-size: 11px;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.5px;
}
#academy-game-root .ttmc-case-icon {
  font-size: 18px;
  margin-top: 2px;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5));
}
#academy-game-root .ttmc-case.special { border-color: rgba(245, 197, 24, 0.35); }
#academy-game-root .ttmc-case-prison { background: linear-gradient(145deg, rgba(60, 20, 30, 0.6), rgba(40, 15, 25, 0.8)); border-color: rgba(233, 69, 96, 0.4); }
#academy-game-root .ttmc-case-recul  { background: linear-gradient(145deg, rgba(60, 30, 20, 0.6), rgba(50, 25, 15, 0.8)); border-color: rgba(245, 158, 11, 0.4); }
#academy-game-root .ttmc-case-bonus  { background: linear-gradient(145deg, rgba(30, 60, 40, 0.6), rgba(20, 50, 30, 0.8)); border-color: rgba(74, 222, 128, 0.4); }
#academy-game-root .ttmc-case-finale {
  background: linear-gradient(135deg, #f5c518, #e94560, #00d2ff);
  border-color: #ffd700;
  box-shadow: 0 0 20px rgba(245, 197, 24, 0.5);
  animation: ttmcFinalePulse 2s ease-in-out infinite;
}
@keyframes ttmcFinalePulse {
  0%, 100% { box-shadow: 0 0 14px rgba(245, 197, 24, 0.4); }
  50%      { box-shadow: 0 0 24px rgba(245, 197, 24, 0.7), 0 0 40px rgba(233, 69, 96, 0.3); }
}
#academy-game-root .ttmc-case-finale .ttmc-case-num { color: #1a1a2e; }

#academy-game-root .ttmc-case-start {
  width: 100%;
  max-width: 600px;
  padding: 8px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.05);
  border: 1.5px dashed rgba(255, 255, 255, 0.2);
  text-align: center;
  font-weight: 900;
  letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.5);
  font-size: 11px;
}

/* Pions des joueurs */
#academy-game-root .ttmc-pion {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4), inset 0 1px 2px rgba(255, 255, 255, 0.3);
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
  z-index: 2;
}
/* Superposition de pions : l\u00e9ger d\u00e9calage pour qu'on voie plusieurs pions sur une case */
#academy-game-root .ttmc-pion[data-player="1"] { transform: translate(-85%, -50%); }
#academy-game-root .ttmc-pion[data-player="2"] { transform: translate(-15%, -50%); }
#academy-game-root .ttmc-pion[data-player="3"] { transform: translate(-50%, -15%); }
#academy-game-root .ttmc-pion[data-player="0"] { transform: translate(-50%, -85%); z-index: 3; }
#academy-game-root .ttmc-pion.current {
  animation: ttmcPionActive 0.8s ease-in-out infinite;
  z-index: 5;
}
@keyframes ttmcPionActive {
  0%, 100% { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4), 0 0 10px rgba(255, 255, 255, 0.4); }
  50%      { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4), 0 0 18px rgba(255, 255, 255, 0.7); }
}
#academy-game-root .ttmc-pion.winner {
  animation: ttmcPionWin 1.2s ease-in-out infinite;
  z-index: 10;
}
@keyframes ttmcPionWin {
  0%, 100% { transform: translate(-50%, -50%) scale(1) rotate(0deg); }
  50%      { transform: translate(-50%, -50%) scale(1.25) rotate(12deg); }
}

/* Zone de contr\u00f4le (carte / question / bot-playing) */
#academy-game-root .ttmc-control {
  width: 100%;
  max-width: 720px;
  min-height: 140px;
  padding: 16px;
  background: linear-gradient(180deg, rgba(15, 52, 96, 0.4) 0%, rgba(26, 26, 46, 0.7) 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
}
#academy-game-root .ttmc-subject {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 8px;
  text-align: center;
}
#academy-game-root .ttmc-subject b { color: #fff; }
#academy-game-root .ttmc-question-prompt {
  text-align: center;
  font-size: 18px;
  font-weight: 900;
  color: #f5c518;
  letter-spacing: 1px;
  margin-bottom: 12px;
}
#academy-game-root .ttmc-cards {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}
#academy-game-root .ttmc-card {
  padding: 14px 0;
  border: 2px solid rgba(255, 255, 255, 0.15);
  background: linear-gradient(180deg, rgba(15, 52, 96, 0.5), rgba(26, 26, 46, 0.8));
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  border-radius: 8px;
  cursor: pointer;
  transition: transform 0.18s, border-color 0.18s, background 0.18s;
}
#academy-game-root .ttmc-card:hover {
  transform: translateY(-3px);
  border-color: #f5c518;
  background: linear-gradient(180deg, rgba(245, 197, 24, 0.2), rgba(245, 158, 11, 0.3));
}
#academy-game-root .ttmc-card:nth-child(-n+3) { border-color: rgba(78, 205, 196, 0.4); }
#academy-game-root .ttmc-card:nth-child(n+8)  { border-color: rgba(233, 69, 96, 0.4); }
#academy-game-root .ttmc-hint {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.72);
  text-align: center;
  font-style: italic;
}

#academy-game-root .ttmc-q-text {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  padding: 10px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 10px;
  margin-bottom: 12px;
}
#academy-game-root .ttmc-answers-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
#academy-game-root .ttmc-answer {
  padding: 14px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  background: linear-gradient(180deg, rgba(15, 52, 96, 0.5), rgba(26, 26, 46, 0.8));
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  border-radius: 10px;
  cursor: pointer;
  transition: transform 0.18s, border-color 0.18s;
}
#academy-game-root .ttmc-answer:hover {
  transform: translateY(-2px);
  border-color: #00d2ff;
  background: linear-gradient(180deg, rgba(0, 210, 255, 0.15), rgba(15, 52, 96, 0.6));
}

#academy-game-root .ttmc-control-bot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 14px 0;
}
#academy-game-root .ttmc-bot-indicator {
  width: 40px; height: 40px; border-radius: 50%;
  box-shadow: 0 0 20px currentColor;
  animation: ttmcPionActive 0.8s ease-in-out infinite;
}
#academy-game-root .ttmc-bot-text { font-size: 15px; color: #fff; }
#academy-game-root .ttmc-bot-pick {
  font-size: 13px;
  color: #f5c518;
  font-weight: 700;
  background: rgba(245, 197, 24, 0.12);
  padding: 4px 12px;
  border-radius: 6px;
}

#academy-game-root .ttmc-control-reveal {
  text-align: center;
  font-size: 18px;
  color: rgba(255, 255, 255, 0.6);
  padding: 20px;
  animation: fadeIn 0.3s;
}

/* Log */
#academy-game-root .ttmc-log {
  width: 100%;
  max-width: 720px;
  max-height: 90px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
#academy-game-root .ttmc-log-line {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  padding: 4px 10px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 6px;
  animation: fadeIn 0.3s;
}

/* Results */
#academy-game-root .ttmc-ranking {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  max-width: 420px;
  margin: 0 auto 16px;
}
#academy-game-root .ttmc-ranking-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
#academy-game-root .ttmc-ranking-row.me {
  background: rgba(245, 197, 24, 0.12);
  border-color: rgba(245, 197, 24, 0.4);
}
#academy-game-root .ttmc-ranking-row:first-child {
  background: linear-gradient(145deg, rgba(255, 215, 0, 0.2), rgba(245, 158, 11, 0.1));
  border-color: #ffd700;
}
#academy-game-root .ttmc-ranking-rank {
  font-size: 18px; font-weight: 900; color: #ffd700; min-width: 24px;
}
#academy-game-root .ttmc-ranking-dot { width: 14px; height: 14px; border-radius: 50%; }
#academy-game-root .ttmc-ranking-name { flex: 1; font-weight: 700; color: #fff; }
#academy-game-root .ttmc-ranking-stats { display: flex; gap: 10px; font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.6); }
#academy-game-root .ttmc-ranking-stats span:last-child { color: #f5c518; }

@media (max-width: 560px) {
  #academy-game-root .ttmc-players-list { grid-template-columns: repeat(2, 1fr); }
  #academy-game-root .ttmc-board { max-width: 100%; }
  #academy-game-root .ttmc-cards { grid-template-columns: repeat(5, 1fr); }
  #academy-game-root .ttmc-q-text { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  #academy-game-root .ttmc-pion.current,
  #academy-game-root .ttmc-pion.winner,
  #academy-game-root .ttmc-bot-indicator,
  #academy-game-root .ttmc-case-finale { animation: none; }
}

/* v3.19.25 — Avatar unlock celebration dans l'écran résultats TTMC */
#academy-game-root .ttmc-avatar-unlock-panel {
  width: 100%;
  max-width: 520px;
  margin: 18px auto 22px;
  padding: 16px 18px;
  background: linear-gradient(135deg, rgba(245, 197, 24, 0.18), rgba(233, 69, 96, 0.15) 50%, rgba(0, 210, 255, 0.12));
  border: 1.5px solid rgba(245, 197, 24, 0.45);
  border-radius: 14px;
  box-shadow: 0 0 32px rgba(245, 197, 24, 0.35), 0 6px 18px rgba(0, 0, 0, 0.4);
  animation: ttmcUnlockGlow 2.2s ease-in-out infinite alternate;
}
@keyframes ttmcUnlockGlow {
  0%   { box-shadow: 0 0 26px rgba(245, 197, 24, 0.3), 0 6px 18px rgba(0, 0, 0, 0.4); }
  100% { box-shadow: 0 0 44px rgba(245, 197, 24, 0.55), 0 6px 18px rgba(0, 0, 0, 0.4); }
}
#academy-game-root .ttmc-avatar-unlock-header {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 1.5px;
  text-align: center;
  color: #ffd700;
  text-shadow: 0 0 14px rgba(255, 215, 0, 0.6);
  margin-bottom: 12px;
  text-transform: uppercase;
}
#academy-game-root .ttmc-avatar-unlock-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#academy-game-root .ttmc-avatar-unlock-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  animation: ttmcUnlockCardIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes ttmcUnlockCardIn {
  0%   { opacity: 0; transform: translateY(12px) scale(0.92); }
  100% { opacity: 1; transform: translateY(0)    scale(1); }
}
#academy-game-root .ttmc-avatar-unlock-card.rarity-rare      { border-color: rgba(0, 210, 255, 0.5); }
#academy-game-root .ttmc-avatar-unlock-card.rarity-epic      { border-color: rgba(190, 75, 219, 0.55); box-shadow: inset 0 0 18px rgba(190, 75, 219, 0.12); }
#academy-game-root .ttmc-avatar-unlock-card.rarity-legendary { border-color: #ffd700; box-shadow: inset 0 0 22px rgba(255, 215, 0, 0.2); }
#academy-game-root .ttmc-avatar-unlock-img {
  width: 64px; height: 64px;
  flex-shrink: 0;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.3);
  display: flex; align-items: center; justify-content: center;
}
#academy-game-root .ttmc-avatar-unlock-img img {
  width: 100%; height: 100%; object-fit: cover;
}
#academy-game-root .ttmc-avatar-unlock-info { flex: 1; min-width: 0; }
#academy-game-root .ttmc-avatar-unlock-name {
  font-size: 14px;
  font-weight: 900;
  color: #fff;
  margin-bottom: 3px;
}
#academy-game-root .ttmc-avatar-unlock-hint {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.3;
  font-style: italic;
}
@media (prefers-reduced-motion: reduce) {
  #academy-game-root .ttmc-avatar-unlock-panel,
  #academy-game-root .ttmc-avatar-unlock-card { animation: none; }
}

/* ─── Phase 4 H5P (v3.30.0) ───────────────────────────────────────── */
/* Section "Notions à revoir" dans modal results() */
#academy-game-root .bdt-h5p-recap {
  margin-top: 18px;
  padding: 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 215, 102, 0.08), rgba(255, 215, 102, 0.02));
  border: 1px solid rgba(255, 215, 102, 0.25);
}
#academy-game-root .bdt-h5p-recap .bdt-section-title {
  color: #ffd766;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 4px;
}
#academy-game-root .bdt-h5p-recap-subtitle {
  font-size: 12px;
  color: rgba(245, 247, 251, 0.7);
  margin-bottom: 12px;
}
#academy-game-root .bdt-h5p-recap-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#academy-game-root .bdt-h5p-recap-item {
  display: flex;
  align-items: center;
}
#academy-game-root .bdt-h5p-recap-link,
#academy-game-root .bdt-h5p-recap-item > .bdt-h5p-recap-icon ~ * {
  display: flex;
  align-items: center;
  gap: 8px;
}
#academy-game-root .bdt-h5p-recap-link {
  flex: 1;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  color: #f5f7fb;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}
#academy-game-root .bdt-h5p-recap-link:hover {
  background: rgba(255, 215, 102, 0.12);
  border-color: rgba(255, 215, 102, 0.4);
  transform: translateX(2px);
}
#academy-game-root .bdt-h5p-recap-icon { font-size: 18px; }
#academy-game-root .bdt-h5p-recap-title {
  flex: 1;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#academy-game-root .bdt-h5p-miss-count {
  font-size: 11px;
  font-weight: 700;
  color: #ff7676;
  background: rgba(255, 118, 118, 0.12);
  padding: 2px 6px;
  border-radius: 6px;
}
#academy-game-root .bdt-h5p-recap-arrow {
  color: #ffd766;
  font-size: 16px;
  font-weight: 700;
}

/* v3.36.0 — bouton cliquable (remplace l'ancien <a> link) qui ouvre le lightbox H5P */
#academy-game-root .bdt-h5p-recap-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  color: #f5f7fb;
  border: 1px solid rgba(255, 255, 255, 0.08);
  cursor: pointer;
  text-align: left;
  font: inherit;
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}
#academy-game-root .bdt-h5p-recap-btn:hover,
#academy-game-root .bdt-h5p-recap-btn:focus-visible {
  background: rgba(255, 215, 102, 0.14);
  border-color: rgba(255, 215, 102, 0.5);
  transform: translateX(3px);
  outline: none;
}
#academy-game-root .bdt-h5p-recap-btn:active {
  transform: translateX(1px) scale(0.99);
}
#academy-game-root .bdt-h5p-recap-btn .bdt-h5p-recap-arrow {
  margin-left: auto;
}
/* v3.42.0 — Cards visuelles enrichies pour modal recap H5P (#2 + #7).
   Layout 2-rows : icône à gauche, body (titre + miss count) au centre,
   CTA à droite. Animation stagger fade-in à l'apparition. */
#academy-game-root .bdt-h5p-recap-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(0, 210, 255, 0.08) 0%, rgba(168, 85, 247, 0.08) 100%);
  border: 2px solid rgba(0, 210, 255, 0.18);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  opacity: 0;
  transform: translateY(8px);
  animation: bdt-h5p-card-in 0.45s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
#academy-game-root .bdt-h5p-recap-card:hover {
  transform: translateY(-2px) scale(1.01);
  border-color: rgba(0, 210, 255, 0.5);
  box-shadow: 0 6px 20px rgba(0, 210, 255, 0.18);
}
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-icon {
  font-size: 28px;
  flex-shrink: 0;
  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.25));
}
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-title {
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-miss-count {
  font-size: 11px;
  font-weight: 700;
  color: rgba(255, 71, 87, 0.85);
  letter-spacing: 0.3px;
}
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-cta {
  font-size: 12px;
  font-weight: 800;
  color: #00d2ff;
  letter-spacing: 0.5px;
  background: rgba(0, 210, 255, 0.12);
  padding: 6px 10px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}

/* v3.42.0 — Card "Recommandation officielle" (Plugin Phase 3 server reco).
   Mise en avant visuelle : ruban or, glow étoilé. */
#academy-game-root .bdt-h5p-recap-card-official {
  background: linear-gradient(135deg, rgba(255, 212, 0, 0.18) 0%, rgba(0, 210, 255, 0.12) 100%);
  border-color: #ffd400;
  box-shadow: 0 0 24px rgba(255, 212, 0, 0.25);
  position: relative;
}
#academy-game-root .bdt-h5p-recap-card-official::before {
  content: '⭐ Officiel';
  position: absolute;
  top: -8px;
  left: 14px;
  background: linear-gradient(135deg, #ffd400 0%, #ff9f43 100%);
  color: #1a1a2e;
  font-size: 10px;
  font-weight: 900;
  padding: 2px 8px;
  border-radius: 12px;
  letter-spacing: 0.5px;
  z-index: 2;
}
#academy-game-root .bdt-h5p-recap-card-official .bdt-h5p-miss-count-official {
  color: #ffd400;
  font-weight: 800;
}
#academy-game-root .bdt-h5p-recap-card-official .bdt-h5p-recap-cta {
  color: #ffd400;
  background: rgba(255, 212, 0, 0.18);
}

@keyframes bdt-h5p-card-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* v3.36.0 — Mode Facile auto-50/50 (coup de pouce après 7s sans réponse) */
#academy-game-root .bdt-answer-btn.bdt-fifty-fifty-out {
  opacity: 0.25;
  text-decoration: line-through;
  pointer-events: none;
  filter: grayscale(0.7);
  transition: opacity 0.4s ease, filter 0.4s ease;
}
#academy-game-root .bdt-fifty-fifty-hint {
  position: fixed;
  bottom: 20%;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #ffd400 0%, #ff9f43 100%);
  color: #1a1a2e;
  padding: 10px 18px;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(255, 212, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.2);
  z-index: 9999;
  animation: bdt-fifty-fifty-pop 2.4s ease forwards;
  pointer-events: none;
}
@keyframes bdt-fifty-fifty-pop {
  0%   { opacity: 0; transform: translate(-50%, 16px) scale(0.8); }
  15%  { opacity: 1; transform: translate(-50%, 0) scale(1.05); }
  20%  { transform: translate(-50%, 0) scale(1); }
  85%  { opacity: 1; transform: translate(-50%, 0) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -10px) scale(0.95); }
}


/* v3.40.0 — Frontend gating H5P Co+ */
.bdt-h5p-gated {
	margin-top: 16px;
}
.bdt-h5p-gated-card {
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 18px;
	border-radius: 14px;
	background: linear-gradient(135deg, rgba(255,212,0,0.12), rgba(168,85,247,0.18));
	border: 1px solid rgba(255,212,0,0.30);
}
.bdt-h5p-gated-icon { font-size: 32px; line-height: 1; flex-shrink: 0; }
.bdt-h5p-gated-body h4 { margin: 0 0 4px; font-size: 16px; font-weight: 800; }
.bdt-h5p-gated-body p { margin: 0 0 10px; font-size: 14px; opacity: 0.85; }

/* ─────────────────────────────────────────────────────────────────────
   v3.58.0 — Mode "Réviser ce H5P" : bouton "🎯 Combattre" overlay sur
   chaque card recap + header spécial de fin de match.
   ───────────────────────────────────────────────────────────────────── */

/* Bouton "🎯 Combattre" en overlay top-right de la card recap H5P.
   Click déclenche Arene.startH5pReview() au lieu de la lightbox. */
#academy-game-root .bdt-h5p-recap-card {
  position: relative; /* pour ancrer le bouton combat absolute */
}
#academy-game-root .bdt-h5p-recap-combat {
  position: absolute;
  top: 6px;
  right: 8px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.4px;
  color: #fff;
  background: linear-gradient(135deg, var(--aca-pink, #ff2d87) 0%, var(--aca-purple, #a855f7) 100%);
  padding: 5px 10px;
  border-radius: 14px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(255, 45, 135, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  user-select: none;
  z-index: 3;
  white-space: nowrap;
}
#academy-game-root .bdt-h5p-recap-combat:hover {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 4px 14px rgba(255, 45, 135, 0.5);
}
#academy-game-root .bdt-h5p-recap-combat:active {
  transform: translateY(0) scale(0.98);
}

/* Header spécial fin de match en mode review (pas "VICTOIRE/Défaite"). */
#academy-game-root .bdt-review-mode-title {
  background: linear-gradient(135deg, var(--aca-pink, #ff2d87) 0%, var(--aca-cyan, #00e5ff) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 900;
}
#academy-game-root .bdt-review-mode-subtitle {
  font-style: italic;
  opacity: 0.9;
  margin-bottom: 8px;
}

/* ─────────────────────────────────────────────────────────────────────
   v3.61.0 — Polish TTMC : tier labels sur cartes 1-10 + banner À ton tour
   ───────────────────────────────────────────────────────────────────── */

/* Cartes 1-10 enrichies : numéro + stars + label (Facile/Moyen/Dur/Très dur) */
#academy-game-root .ttmc-cards { gap: 8px; }
#academy-game-root .ttmc-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 10px 4px;
  min-height: 78px;
  font-size: 14px;
  line-height: 1.1;
}
#academy-game-root .ttmc-card .ttmc-card-num {
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  margin-bottom: 2px;
}
#academy-game-root .ttmc-card .ttmc-card-stars {
  font-size: 10px;
  line-height: 1;
  opacity: 0.95;
  letter-spacing: -1px;
}
#academy-game-root .ttmc-card .ttmc-card-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
  opacity: 1;
  margin-top: 1px;
}

/* Tier-specific colors (override le :nth-child colorant générique) */
#academy-game-root .ttmc-card-tier-easy {
  border-color: rgba(78, 205, 196, 0.55) !important;
  background: linear-gradient(180deg, rgba(78, 205, 196, 0.12), rgba(26, 26, 46, 0.85));
}
#academy-game-root .ttmc-card-tier-easy:hover {
  border-color: #4ecdc4 !important;
  background: linear-gradient(180deg, rgba(78, 205, 196, 0.28), rgba(26, 26, 46, 0.9));
  box-shadow: 0 4px 14px rgba(78, 205, 196, 0.25);
}
#academy-game-root .ttmc-card-tier-medium {
  border-color: rgba(245, 197, 24, 0.55) !important;
  background: linear-gradient(180deg, rgba(245, 197, 24, 0.12), rgba(26, 26, 46, 0.85));
}
#academy-game-root .ttmc-card-tier-medium:hover {
  border-color: #f5c518 !important;
  background: linear-gradient(180deg, rgba(245, 197, 24, 0.28), rgba(26, 26, 46, 0.9));
  box-shadow: 0 4px 14px rgba(245, 197, 24, 0.25);
}
#academy-game-root .ttmc-card-tier-hard {
  border-color: rgba(255, 107, 53, 0.55) !important;
  background: linear-gradient(180deg, rgba(255, 107, 53, 0.12), rgba(26, 26, 46, 0.85));
}
#academy-game-root .ttmc-card-tier-hard:hover {
  border-color: #ff6b35 !important;
  background: linear-gradient(180deg, rgba(255, 107, 53, 0.28), rgba(26, 26, 46, 0.9));
  box-shadow: 0 4px 14px rgba(255, 107, 53, 0.3);
}
#academy-game-root .ttmc-card-tier-extreme {
  border-color: rgba(233, 69, 96, 0.65) !important;
  background: linear-gradient(180deg, rgba(233, 69, 96, 0.18), rgba(26, 26, 46, 0.9));
  position: relative;
}
#academy-game-root .ttmc-card-tier-extreme:hover {
  border-color: #e94560 !important;
  background: linear-gradient(180deg, rgba(233, 69, 96, 0.32), rgba(26, 26, 46, 0.95));
  box-shadow: 0 4px 18px rgba(233, 69, 96, 0.4);
  transform: translateY(-4px) scale(1.02);
}

/* Banner "🎯 À ton tour !" — apparait quand c'est le tour du joueur user */
#academy-game-root .ttmc-your-turn-banner {
  text-align: center;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 8px 16px;
  margin-bottom: 12px;
  background: linear-gradient(90deg, var(--aca-pink, #ff2d87) 0%, var(--aca-yellow, #ffd400) 50%, var(--aca-cyan, #00e5ff) 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: ttmcYourTurnSheen 2.4s linear infinite;
}
@keyframes ttmcYourTurnSheen {
  0%   { background-position:   0% 50%; }
  100% { background-position: 200% 50%; }
}

/* Responsive : sur très petit écran, les cartes prennent moins d'espace */
@media (max-width: 600px) {
  #academy-game-root .ttmc-card { min-height: 64px; padding: 8px 2px; }
  #academy-game-root .ttmc-card .ttmc-card-num { font-size: 18px; }
  #academy-game-root .ttmc-card .ttmc-card-stars { font-size: 10px; }
  #academy-game-root .ttmc-card .ttmc-card-label { font-size: 11px; }
}

/* ─────────────────────────────────────────────────────────────────────
   v3.63.0 — Polish UX général : animation transition entre écrans.
   Déclenchée par showScreen() qui retire/réajoute .bdt-screen-enter.
   Respect prefers-reduced-motion : pas d'animation pour les enfants
   ou parents sensibles au motion.
   ───────────────────────────────────────────────────────────────────── */
#academy-game-root.bdt-screen-enter {
  animation: bdtScreenEnter 320ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
@keyframes bdtScreenEnter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0);    }
}
@media (prefers-reduced-motion: reduce) {
  #academy-game-root.bdt-screen-enter { animation: none; }
}

/* ─────────────────────────────────────────────────────────────────────
   v3.68.0 — Polish UX v2 : taille font a11y + bouton aide flottant + modal
   ───────────────────────────────────────────────────────────────────── */

/* Scaling des fonts via classes posées sur #academy-game-root.
   Approche : font-size root + variables que tous les autres styles relatifs
   (em, rem) suivent. Si le code utilise des px hardcodés, on scale via zoom. */
#academy-game-root.bdt-font-size-large {
  font-size: 18px;
}
#academy-game-root.bdt-font-size-large .bdt-equation,
#academy-game-root.bdt-font-size-large .bdt-question-prompt {
  font-size: 1.25em;
}
#academy-game-root.bdt-font-size-xlarge {
  font-size: 22px;
}
#academy-game-root.bdt-font-size-xlarge .bdt-equation,
#academy-game-root.bdt-font-size-xlarge .bdt-question-prompt {
  font-size: 1.5em;
}

/* Bouton aide flottant — fixed bottom-right, persistant tous écrans */
.bdt-help-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ff2d87 0%, #a855f7 100%);
  color: #fff;
  font-size: 22px;
  font-weight: 900;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(255, 45, 135, 0.4);
  z-index: 9998;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bdt-help-fab:hover {
  transform: translateY(-2px) scale(1.06);
  box-shadow: 0 6px 20px rgba(255, 45, 135, 0.55);
}
.bdt-help-fab:active {
  transform: translateY(0) scale(0.96);
}
@media (max-width: 600px) {
  .bdt-help-fab { right: 12px; bottom: 12px; width: 42px; height: 42px; font-size: 19px; }
}

/* Overlay modal aide */
.bdt-help-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 15, 26, 0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
  animation: bdtHelpFadeIn 220ms ease-out;
}
@keyframes bdtHelpFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.bdt-help-modal-card {
  background: linear-gradient(180deg, #1f1f3a 0%, #14142b 100%);
  border: 2px solid rgba(255, 45, 135, 0.3);
  border-radius: 16px;
  padding: 24px 22px;
  max-width: 520px;
  width: 100%;
  max-height: 88vh;
  overflow-y: auto;
  color: #fff;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
  position: relative;
  animation: bdtHelpCardIn 280ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
@keyframes bdtHelpCardIn {
  from { opacity: 0; transform: translateY(12px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.bdt-help-modal-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.18s ease;
}
.bdt-help-modal-close:hover {
  background: rgba(255, 45, 135, 0.25);
  border-color: rgba(255, 45, 135, 0.5);
}

.bdt-help-modal-title {
  margin: 0 0 18px;
  font-size: 22px;
  font-weight: 900;
  background: linear-gradient(90deg, #ff2d87 0%, #ffd400 50%, #00e5ff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.bdt-help-section { margin-bottom: 20px; }
.bdt-help-section:last-child { margin-bottom: 0; }
.bdt-help-section h3 {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 800;
  color: #ffd400;
  letter-spacing: 0.3px;
}

.bdt-help-font-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.bdt-help-font-btn {
  flex: 1;
  min-width: 90px;
  padding: 10px 8px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  transition: all 0.18s ease;
}
.bdt-help-font-btn:hover {
  border-color: #00e5ff;
  background: rgba(0, 229, 255, 0.12);
}
.bdt-help-font-btn.active {
  border-color: #ff2d87;
  background: rgba(255, 45, 135, 0.22);
  box-shadow: 0 0 14px rgba(255, 45, 135, 0.3);
}
.bdt-help-font-btn[data-size="large"]  { font-size: 15px; }
.bdt-help-font-btn[data-size="xlarge"] { font-size: 18px; }

.bdt-help-sound-btn {
  width: 100%;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.18s ease;
}
.bdt-help-sound-btn:hover {
  border-color: #ffd400;
  background: rgba(255, 212, 0, 0.15);
}
.bdt-help-note {
  margin: 6px 0 0;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.55);
  font-style: italic;
}

.bdt-help-rules {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.85);
}
.bdt-help-rules li { margin-bottom: 6px; }
.bdt-help-rules b { color: #ffd400; }

.bdt-help-credits {
  text-align: center;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.4);
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.bdt-help-credits p { margin: 0; }

/* ─────────────────────────────────────────────────────────────────────
   v3.69.0 — Course Académique (backlog #1) : 4 mascottes en course,
   sans gambling. Vocabulaire champion/podium/médaille uniquement.
   ───────────────────────────────────────────────────────────────────── */

/* Écran 1/3 — Sélection champion */
#academy-game-root .bdt-course-champion {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 20px 12px 60px;
}
#academy-game-root .bdt-course-subtitle {
  text-align: center;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.75);
  max-width: 480px;
  margin: -8px 0 8px;
}
#academy-game-root .bdt-course-mascots-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  width: 100%;
  max-width: 520px;
}
@media (min-width: 720px) {
  #academy-game-root .bdt-course-mascots-grid { grid-template-columns: repeat(4, 1fr); }
}
#academy-game-root .bdt-course-mascot-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 10px;
  border-radius: 14px;
  border: 2px solid;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(0, 0, 0, 0.2));
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  color: #fff;
  gap: 8px;
}
#academy-game-root .bdt-course-mascot-card:hover {
  transform: translateY(-4px) scale(1.04);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}
#academy-game-root .bdt-course-mascot-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  color: #0f0f1a;
}
#academy-game-root .bdt-course-mascot-name {
  font-weight: 900;
  font-size: 14px;
  letter-spacing: 0.3px;
}
#academy-game-root .bdt-course-mascot-subject {
  font-size: 11px;
  opacity: 0.6;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Écran 2/3 — Course */
#academy-game-root .bdt-course-race {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 14px 10px;
}
#academy-game-root .bdt-course-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 14px;
  background: rgba(0, 0, 0, 0.35);
  border-radius: 10px;
  flex-wrap: wrap;
}
#academy-game-root .bdt-course-title {
  font-weight: 900;
  font-size: 16px;
  letter-spacing: 0.5px;
}
#academy-game-root .bdt-course-round-counter {
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
}
#academy-game-root .bdt-course-quit {
  padding: 6px 12px;
  font-size: 12px;
}

#academy-game-root .bdt-course-track {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 8px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(0, 0, 0, 0.18));
  border-radius: 12px;
}
#academy-game-root .bdt-course-lane {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#academy-game-root .bdt-course-lane-label {
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 6px;
}
#academy-game-root .bdt-course-champion-badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 900;
  padding: 2px 7px;
  border-radius: 9px;
  background: linear-gradient(90deg, #ffd400, #ff9f43);
  color: #1a1a2e;
  letter-spacing: 0.4px;
}
#academy-game-root .bdt-course-lane-bar {
  position: relative;
  width: 100%;
  height: 32px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px dashed rgba(255, 255, 255, 0.15);
  border-radius: 16px;
  overflow: visible;
}
/* Ligne d'arrivée à droite */
#academy-game-root .bdt-course-lane-bar::after {
  content: '🏁';
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  opacity: 0.75;
}
#academy-game-root .bdt-course-pion {
  position: absolute;
  top: 50%;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transform: translate(-50%, -50%);
  transition: left 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  color: #0f0f1a;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
#academy-game-root .bdt-course-pion.champion {
  box-shadow: 0 0 16px rgba(255, 212, 0, 0.6), 0 2px 6px rgba(0, 0, 0, 0.3);
  outline: 2px solid #ffd400;
  outline-offset: 1px;
}

/* Question prompt */
#academy-game-root .bdt-course-question-wrap {
  padding: 16px;
  background: linear-gradient(180deg, rgba(255, 45, 135, 0.08), rgba(0, 0, 0, 0.2));
  border-radius: 14px;
  border: 1px solid rgba(255, 45, 135, 0.2);
}
#academy-game-root .bdt-course-question-header {
  text-align: center;
  font-size: 13px;
  margin-bottom: 8px;
  font-weight: 700;
}
#academy-game-root .bdt-course-question-prompt {
  text-align: center;
  font-size: 22px;
  font-weight: 900;
  margin: 8px 0 14px;
  color: #fff;
}
#academy-game-root .bdt-course-answers-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
#academy-game-root .bdt-course-answer {
  padding: 14px;
  border-radius: 10px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  cursor: pointer;
  transition: all 0.18s ease;
}
#academy-game-root .bdt-course-answer:hover {
  border-color: #00d2ff;
  background: rgba(0, 210, 255, 0.12);
}
#academy-game-root .bdt-course-answer.correct {
  border-color: #2ed573;
  background: rgba(46, 213, 115, 0.25);
  color: #fff;
}
#academy-game-root .bdt-course-answer.wrong {
  border-color: #ff6b81;
  background: rgba(255, 107, 129, 0.25);
}

/* Écran 3/3 — Résultats podium */
#academy-game-root .bdt-course-podium {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 16px 0;
  padding: 12px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 12px;
}
#academy-game-root .bdt-course-podium-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  font-size: 14px;
}
#academy-game-root .bdt-course-podium-row.champion {
  background: linear-gradient(90deg, rgba(255, 212, 0, 0.15), rgba(255, 159, 67, 0.1));
  border: 1px solid rgba(255, 212, 0, 0.4);
}
#academy-game-root .bdt-course-podium-medal {
  font-size: 22px;
  width: 32px;
  text-align: center;
}
#academy-game-root .bdt-course-podium-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #0f0f1a;
}
#academy-game-root .bdt-course-podium-name {
  flex: 1;
  font-weight: 700;
}
#academy-game-root .bdt-course-podium-pos {
  font-size: 12px;
  opacity: 0.65;
}

/* ─────────────────────────────────────────────────────────────────────
   v3.70.0 — Course Académique V2 polish (validé via démo HTML standalone)
   ───────────────────────────────────────────────────────────────────── */

/* Countdown overlay 3-2-1-GO! */
.bdt-course-countdown-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 15, 26, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.bdt-course-countdown-num {
  font-size: 180px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--aca-pink, #ff2d87), var(--aca-yellow, #ffd400));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: bdtCountPulse 1s cubic-bezier(0.2, 0.7, 0.2, 1);
}
@keyframes bdtCountPulse {
  from { transform: scale(0.4) rotate(-12deg); opacity: 0; }
  50%  { transform: scale(1.15); opacity: 1; }
  to   { transform: scale(1); opacity: 1; }
}
@media (max-width: 600px) {
  .bdt-course-countdown-num { font-size: 120px; }
}

/* Pion qui sautille à chaque avancée */
#academy-game-root .bdt-course-pion.bouncing {
  animation: bdtPionBounce 0.5s ease-out;
}
@keyframes bdtPionBounce {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  40%      { transform: translate(-50%, -85%) scale(1.15); }
}

/* Défi personnel — section au-dessus du retour menu */
#academy-game-root .bdt-course-challenge-section {
  width: 100%;
  max-width: 520px;
  margin-top: 8px;
}
#academy-game-root .bdt-course-challenge-title {
  font-size: 12px;
  font-weight: 800;
  color: var(--aca-yellow, #ffd400);
  letter-spacing: 0.5px;
  margin-bottom: 10px;
  text-align: center;
  text-transform: uppercase;
}
#academy-game-root .bdt-course-challenge-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
/* 2026-08-24 — La carte est passee de <div> a <button> pour etre joignable au
   clavier. Le navigateur apporte alors sa propre police, son alignement centre
   et sa hauteur : on les remet a ce que la carte etait, sinon le passage se
   verrait. `text-align: left` et `font: inherit` sont les deux qui comptent. */
#academy-game-root button.bdt-course-challenge-card {
  display: block;
  width: 100%;
  margin: 0;
  min-height: 44px;   /* cible tactile : un doigt d'enfant n'est pas precis */
  font-family: inherit;
  text-align: left;
  appearance: none;
  -webkit-appearance: none;
}
#academy-game-root .bdt-course-challenge-card {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  transition: all 0.18s ease;
  color: #fff;
}
#academy-game-root .bdt-course-challenge-card:hover {
  border-color: var(--aca-cyan, #00e5ff);
  background: rgba(0, 229, 255, 0.10);
}
#academy-game-root .bdt-course-challenge-card.selected {
  border-color: var(--aca-yellow, #ffd400);
  background: rgba(255, 212, 0, 0.18);
  box-shadow: 0 0 14px rgba(255, 212, 0, 0.25);
}

/* Résultat défi (réussi ou raté) sur écran podium */
#academy-game-root .bdt-course-challenge-result {
  text-align: center;
  font-size: 14px;
  padding: 8px 14px;
  border-radius: 10px;
  margin: 6px auto;
  max-width: 480px;
  font-weight: 700;
}
#academy-game-root .bdt-course-challenge-result.ok {
  color: var(--aca-green, #2ed573);
  background: rgba(46, 213, 115, 0.12);
  border: 1px solid rgba(46, 213, 115, 0.4);
}
#academy-game-root .bdt-course-challenge-result.ko {
  color: #ff6b81;
  background: rgba(255, 107, 129, 0.10);
  border: 1px solid rgba(255, 107, 129, 0.3);
}

/* ─────────────────────────────────────────────────────────────────────
   v3.71.0 — Course Académique V3 multijoueur (bar joueurs + timer)
   ───────────────────────────────────────────────────────────────────── */

/* Bar du haut : 4 cartes joueurs avec status temps réel */
#academy-game-root .bdt-course-players-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 10px;
}
#academy-game-root .bdt-course-player-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 4px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 2px solid;
  transition: all 0.25s ease;
}
#academy-game-root .bdt-course-player-card.me { background: rgba(255, 212, 0, 0.12); }
#academy-game-root .bdt-course-player-card.answering { background: rgba(0, 229, 255, 0.18); }
#academy-game-root .bdt-course-player-card.answered.correct { background: rgba(46, 213, 115, 0.20); }
#academy-game-root .bdt-course-player-card.answered.wrong { background: rgba(255, 107, 129, 0.20); }

#academy-game-root .bdt-course-player-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #0f0f1a;
}
#academy-game-root .bdt-course-player-name {
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  line-height: 1.2;
  min-height: 24px;
  display: flex;
  align-items: center;
}
#academy-game-root .bdt-course-player-score {
  font-size: 11px;
  opacity: 0.8;
  font-weight: 700;
}
#academy-game-root .bdt-course-player-status {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 6px;
  margin-top: 2px;
  min-height: 16px;
}
#academy-game-root .bdt-course-player-status.thinking {
  background: rgba(0, 229, 255, 0.25);
  color: #00d2ff;
}
#academy-game-root .bdt-course-player-status.correct {
  background: rgba(46, 213, 115, 0.25);
  color: #2ed573;
}
#academy-game-root .bdt-course-player-status.wrong {
  background: rgba(255, 107, 129, 0.25);
  color: #ff6b81;
}
#academy-game-root .bdt-course-player-status.idle { opacity: 0.4; }

@media (max-width: 600px) {
  #academy-game-root .bdt-course-player-name { font-size: 9px; }
  #academy-game-root .bdt-course-player-avatar { width: 30px; height: 30px; font-size: 14px; }
}

/* Timer bar (gradient vert→jaune→rouge qui descend) */
#academy-game-root .bdt-course-timer-bar {
  height: 6px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 10px;
}
#academy-game-root .bdt-course-timer-fill {
  height: 100%;
  background: linear-gradient(90deg, #2ed573, #ffd400, #ff6b81);
  transition: width 100ms linear;
}

/* Answer button disabled state (après que user a répondu) */
#academy-game-root .bdt-course-answer:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ─────────────────────────────────────────────────────────────────────
   v3.72.0 — TTMC Polish v3 : compteur finale + banner prison + bonus bounce
   ───────────────────────────────────────────────────────────────────── */

/* Compteur "X cases avant finale" dans la topbar TTMC */
#academy-game-root .ttmc-finale-counter {
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
  padding: 4px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.25s ease;
}
#academy-game-root .ttmc-finale-counter.warning {
  color: #ffd400;
  background: rgba(255, 212, 0, 0.15);
  border-color: rgba(255, 212, 0, 0.4);
}
#academy-game-root .ttmc-finale-counter.critical {
  color: #ff6b81;
  background: rgba(255, 107, 129, 0.18);
  border-color: rgba(255, 107, 129, 0.5);
  /* 2026-07-24 : renomme. Cette animation portait le MEME nom que celle de la
     case finale du plateau (.ttmc-case-finale). En CSS la derniere definition
     gagne pour tout le document, donc la case 25 heritait de ce zoom rouge au
     lieu de son halo dore, et un scale sur une cellule de grille chevauche ses
     voisines. Bug anterieur a ce chantier, present depuis au moins la 3.100.0. */
  animation: ttmcCounterCritical 0.9s ease-in-out infinite;
}
@keyframes ttmcCounterCritical {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 rgba(255, 107, 129, 0); }
  50%      { transform: scale(1.06); box-shadow: 0 0 14px rgba(255, 107, 129, 0.5); }
}

/* Banner prison plein écran 1.8s — visible peu importe l'écran */
.ttmc-prison-banner-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 15, 26, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9997;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: ttmcPrisonFadeIn 250ms ease-out;
}
@keyframes ttmcPrisonFadeIn { from { opacity: 0; } to { opacity: 1; } }
.ttmc-prison-banner-card {
  background: linear-gradient(135deg, #1a1a2e, #0f0f1a);
  border: 3px solid #ff6b81;
  border-radius: 16px;
  padding: 28px 36px;
  text-align: center;
  box-shadow: 0 0 40px rgba(255, 107, 129, 0.5);
  animation: ttmcPrisonShake 0.5s ease-in-out;
}
@keyframes ttmcPrisonShake {
  0%, 100% { transform: rotate(0deg) scale(1); }
  20%      { transform: rotate(-3deg) scale(0.95); }
  40%      { transform: rotate(3deg) scale(1.05); }
  60%      { transform: rotate(-2deg) scale(1); }
  80%      { transform: rotate(2deg) scale(1); }
}
.ttmc-prison-banner-icon {
  font-size: 64px;
  line-height: 1;
  margin-bottom: 8px;
  animation: ttmcPrisonChain 1.2s ease-in-out infinite;
}
@keyframes ttmcPrisonChain {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}
.ttmc-prison-banner-title {
  font-size: 32px;
  font-weight: 900;
  letter-spacing: 2px;
  color: #ff6b81;
  margin-bottom: 6px;
  text-transform: uppercase;
}
.ttmc-prison-banner-sub {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
}

/* Animation pion qui rebondit sur la case bonus (3 rebonds) */
#academy-game-root .ttmc-pion.bonus-bounce {
  animation: ttmcBonusBounce 0.9s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes ttmcBonusBounce {
  0%, 100% { transform: translateY(0) scale(1); filter: brightness(1); }
  20%      { transform: translateY(-18px) scale(1.25); filter: brightness(1.5) drop-shadow(0 0 8px #ffd400); }
  40%      { transform: translateY(0) scale(0.95); }
  60%      { transform: translateY(-10px) scale(1.15); filter: brightness(1.3) drop-shadow(0 0 6px #ffd400); }
  80%      { transform: translateY(0) scale(1); }
}

/* ========================================================================
   v3.74.0 — Polish TTMC v4 : position delta float + subject breakdown +
   match stats + streaks
   ======================================================================== */

/* Delta flottant (+5 / -3) au-dessus du pion */
#academy-game-root .ttmc-delta-float {
  position: absolute;
  top: -28px; left: 50%;
  transform: translateX(-50%);
  font-size: 16px; font-weight: 900;
  pointer-events: none;
  animation: ttmcDeltaFloat 1.4s ease-out forwards;
  z-index: 100;
  text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
#academy-game-root .ttmc-delta-float.positive { color: #00d2ff; }
#academy-game-root .ttmc-delta-float.negative { color: #e94560; }
@keyframes ttmcDeltaFloat {
  0%   { opacity: 1; transform: translateX(-50%) translateY(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(-40px); }
}

/* Subject breakdown panel dans les résultats */
#academy-game-root .ttmc-subject-breakdown {
  margin: 16px 0;
  padding: 16px;
  background: rgba(255,255,255,0.05);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.1);
}
#academy-game-root .ttmc-breakdown-title {
  font-size: 15px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 1px; margin-bottom: 12px; color: #fff;
}
#academy-game-root .ttmc-breakdown-grid {
  display: flex; flex-direction: column; gap: 8px;
}
#academy-game-root .ttmc-breakdown-row {
  display: flex; align-items: center; gap: 10px;
}
#academy-game-root .ttmc-breakdown-subject {
  flex: 0 0 140px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.85);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#academy-game-root .ttmc-breakdown-bar-wrap {
  flex: 1; height: 10px; background: rgba(255,255,255,0.1);
  border-radius: 5px; overflow: hidden;
}
#academy-game-root .ttmc-breakdown-bar {
  height: 100%; background: linear-gradient(90deg, #00d2ff, #2ecc71);
  border-radius: 5px; transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  min-width: 2px;
}
#academy-game-root .ttmc-breakdown-pct {
  flex: 0 0 80px; font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.7);
  text-align: right;
}

/* Match stats grid (streak, bonnes réponses, carte max, tours) */
#academy-game-root .ttmc-match-stats {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 8px; margin: 16px 0;
}
#academy-game-root .ttmc-stat-item {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; background: rgba(255,255,255,0.05);
  border-radius: 10px; border: 1px solid rgba(255,255,255,0.08);
}
#academy-game-root .ttmc-stat-icon { font-size: 20px; }
#academy-game-root .ttmc-stat-label {
  flex: 1; font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.6);
  text-transform: uppercase; letter-spacing: 0.5px;
}
#academy-game-root .ttmc-stat-value {
  font-size: 18px; font-weight: 900; color: #fff;
}

/* ========================================================================
   v3.74.0 — Toggle Jeu Spécial : banner événement + badge mode
   ======================================================================== */

#academy-game-root .aca-special-event-banner {
  position: relative; overflow: hidden;
  margin: 12px 0;
  padding: 16px 20px;
  background: linear-gradient(135deg, rgba(233,69,96,0.15), rgba(245,197,24,0.15));
  border: 2px solid rgba(245,197,24,0.4);
  border-radius: 14px;
}
#academy-game-root .aca-event-glow {
  position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
  background: radial-gradient(circle, rgba(245,197,24,0.08) 0%, transparent 60%);
  animation: eventGlowPulse 3s ease-in-out infinite;
}
@keyframes eventGlowPulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50%      { opacity: 1; transform: scale(1.1); }
}
#academy-game-root .aca-event-content {
  position: relative; z-index: 1;
  display: flex; align-items: center; gap: 14px;
}
#academy-game-root .aca-event-badge {
  font-size: 32px; flex-shrink: 0;
  animation: eventBadgeBounce 2s ease-in-out infinite;
}
@keyframes eventBadgeBounce {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.15); }
}
#academy-game-root .aca-event-info { flex: 1; }
#academy-game-root .aca-event-title {
  font-size: 16px; font-weight: 900; text-transform: uppercase;
  letter-spacing: 1px; color: #f5c518;
}
#academy-game-root .aca-event-countdown {
  font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.7);
  margin-top: 2px;
}
#academy-game-root .aca-event-bonus {
  font-size: 13px; font-weight: 700; color: #00d2ff;
  margin-top: 4px;
}

/* Badge événement sur une carte mode ciblée */
#academy-game-root .aca-mode-event-badge {
  position: absolute; top: -6px; right: -6px;
  font-size: 20px; z-index: 5;
  animation: eventBadgeBounce 2s ease-in-out infinite;
  filter: drop-shadow(0 2px 6px rgba(245,197,24,0.6));
}
#academy-game-root .aca-mode-card { position: relative; }

/* ========================================================================
   v3.75.0 — SNAP ACADÉMIQUE
   ======================================================================== */

/* Board container */
#academy-game-root .snap-board {
  display: flex; flex-direction: column; gap: 12px;
  padding: 16px; max-width: 720px; margin: 0 auto;
  animation: bdtFadeIn 0.3s ease;
}

/* Topbar */
#academy-game-root .snap-topbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 16px; border-radius: 12px;
  background: rgba(255,255,255,0.06); backdrop-filter: blur(8px);
}
#academy-game-root .snap-turn-label {
  font-weight: 700; font-size: 16px; color: #fff;
}
#academy-game-root .snap-energy {
  font-size: 18px; font-weight: 800;
  background: linear-gradient(135deg, #ffd400, #ff9500);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Phase labels */
#academy-game-root .snap-phase-label {
  text-align: center; font-size: 14px; font-weight: 600;
  color: rgba(255,255,255,0.7); padding: 4px 0;
}
#academy-game-root .snap-phase-reveal {
  font-size: 18px; color: #00e5ff;
  animation: snapPulse 0.6s ease-in-out infinite alternate;
}

/* Lines container */
#academy-game-root .snap-lines {
  display: flex; flex-direction: column; gap: 10px;
}

/* Single line */
#academy-game-root .snap-line {
  border: 2px solid rgba(255,255,255,0.12); border-radius: 14px;
  padding: 12px; background: rgba(15,15,26,0.7);
  transition: border-color 0.2s, box-shadow 0.2s;
}
#academy-game-root .snap-line:hover {
  border-color: rgba(0,229,255,0.3);
}
#academy-game-root .snap-line-selected {
  border-color: #00e5ff !important;
  box-shadow: 0 0 16px rgba(0,229,255,0.25);
}

/* Line objective */
#academy-game-root .snap-line-objective {
  font-size: 13px; font-weight: 700; color: #ffd400;
  margin-bottom: 8px; text-align: center;
}

/* Power row */
#academy-game-root .snap-line-power-row {
  display: flex; justify-content: center; align-items: center; gap: 12px;
  margin-bottom: 8px;
}
#academy-game-root .snap-power {
  font-size: 16px; font-weight: 800; padding: 4px 10px;
  border-radius: 8px; background: rgba(255,255,255,0.06);
  transition: all 0.3s;
}
#academy-game-root .snap-power-vs {
  font-size: 12px; color: rgba(255,255,255,0.4); font-weight: 600;
}
#academy-game-root .snap-winning {
  color: #2ecc71; background: rgba(46,204,113,0.15);
  text-shadow: 0 0 8px rgba(46,204,113,0.3);
}
#academy-game-root .snap-losing {
  color: #e74c3c; background: rgba(231,76,60,0.1);
}

/* Card slots */
#academy-game-root .snap-card-slot {
  display: flex; gap: 6px; flex-wrap: wrap; min-height: 36px;
  padding: 6px; border-radius: 8px;
  background: rgba(255,255,255,0.03);
}
#academy-game-root .snap-slot-user { border-left: 3px solid #00e5ff; }
#academy-game-root .snap-slot-bot { border-left: 3px solid #ff2d87; }
#academy-game-root .snap-slot-empty {
  font-size: 12px; color: rgba(255,255,255,0.25); font-style: italic;
  display: flex; align-items: center; padding: 0 8px;
}

/* Placed card chips */
#academy-game-root .snap-placed-card {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 8px; border-radius: 8px; font-size: 13px; font-weight: 700;
  animation: snapCardDrop 0.3s ease;
}
#academy-game-root .snap-placed-user { background: rgba(0,229,255,0.12); color: #00e5ff; }
#academy-game-root .snap-placed-bot { background: rgba(255,45,135,0.12); color: #ff2d87; }
#academy-game-root .snap-placed-icon { font-size: 16px; }
#academy-game-root .snap-placed-pow { font-size: 14px; }

/* "1, 2, 3 Co !" snap button */
#academy-game-root .snap-co-btn {
  display: block; width: 100%; padding: 12px;
  background: linear-gradient(135deg, #ff2d87, #ffd400);
  border: none; border-radius: 12px; color: #fff;
  font-weight: 900; font-size: 15px; cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  text-shadow: 0 1px 3px rgba(0,0,0,0.3);
  animation: snapPulse 1.5s ease-in-out infinite alternate;
}
#academy-game-root .snap-co-btn:hover {
  transform: scale(1.04);
  box-shadow: 0 4px 20px rgba(255,45,135,0.4);
}

/* Stake badge */
#academy-game-root .snap-stake-badge {
  font-size: 14px; font-weight: 900; padding: 3px 10px; border-radius: 8px;
  background: linear-gradient(135deg, #ff2d87, #ffd400);
  color: #fff; animation: snapPulse 1s ease-in-out infinite alternate;
}

/* Bot snap alert */
#academy-game-root .snap-bot-snap-alert {
  text-align: center; padding: 8px 16px; border-radius: 10px;
  background: rgba(255,45,135,0.15); border: 1px solid rgba(255,45,135,0.4);
  color: #ff2d87; font-weight: 700; font-size: 13px;
  animation: snapCardDrop 0.5s ease;
}

/* Bottom row */
#academy-game-root .snap-bottom-row {
  display: flex; justify-content: space-between; margin-top: 8px;
}

/* Rarity card borders */
#academy-game-root .snap-rarity-common { border-color: rgba(255,255,255,0.12); }
#academy-game-root .snap-rarity-rare { border-color: rgba(0,229,255,0.4); }
#academy-game-root .snap-rarity-epic { border-color: rgba(168,85,247,0.5); }
#academy-game-root .snap-rarity-legendary { border-color: rgba(255,212,0,0.5); box-shadow: 0 0 12px rgba(255,212,0,0.15); }

/* Hand section */
#academy-game-root .snap-hand-section {
  margin-top: 4px;
}
#academy-game-root .snap-hand-label {
  font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.6);
  text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px;
}
#academy-game-root .snap-hand {
  display: flex; gap: 8px; overflow-x: auto;
  padding-bottom: 4px; -webkit-overflow-scrolling: touch;
}

/* Card in hand */
#academy-game-root .snap-card {
  flex: 0 0 120px; padding: 10px; border-radius: 12px;
  background: rgba(255,255,255,0.06); border: 2px solid rgba(255,255,255,0.1);
  cursor: pointer; transition: all 0.2s; text-align: center;
  position: relative;
}
#academy-game-root .snap-card:hover:not(.snap-card-disabled) {
  border-color: #00e5ff; transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,229,255,0.15);
}
#academy-game-root .snap-card-selected {
  border-color: #00e5ff !important; background: rgba(0,229,255,0.1) !important;
  transform: translateY(-6px);
  box-shadow: 0 8px 24px rgba(0,229,255,0.25) !important;
}
#academy-game-root .snap-card-disabled {
  opacity: 0.35; cursor: not-allowed;
}
#academy-game-root .snap-card-cost {
  position: absolute; top: 6px; right: 8px;
  font-size: 12px; font-weight: 800; color: #ffd400;
}
#academy-game-root .snap-card-icon {
  font-size: 28px; margin: 4px 0;
}
#academy-game-root .snap-card-name {
  font-size: 11px; font-weight: 700; color: #fff;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#academy-game-root .snap-card-power {
  font-size: 13px; font-weight: 800; color: #00e5ff; margin: 4px 0 2px;
}
#academy-game-root .snap-card-desc {
  font-size: 12px; color: rgba(255,255,255,0.72); line-height: 1.35;
}

/* Actions row */
#academy-game-root .snap-actions {
  display: flex; gap: 10px; margin-top: 4px;
}
#academy-game-root .snap-confirm-btn { flex: 2; }
#academy-game-root .snap-pass-btn { flex: 1; }

/* Reveal label */
#academy-game-root .snap-reveal-label {
  text-align: center; font-size: 20px; font-weight: 800;
  color: #ffd400; padding: 16px 0;
  animation: snapPulse 0.8s ease-in-out infinite alternate;
}

/* Back button */
#academy-game-root .snap-back-btn {
  margin-top: 8px; font-size: 13px;
}

/* ---- Snap Results ---- */
#academy-game-root .snap-results {
  display: flex; flex-direction: column; gap: 16px;
  padding: 24px 16px; max-width: 600px; margin: 0 auto;
  animation: bdtFadeIn 0.4s ease;
}
#academy-game-root .snap-result-header {
  text-align: center; font-size: 32px; font-weight: 900;
}
#academy-game-root .snap-result-win {
  background: linear-gradient(135deg, #ffd400, #2ecc71);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
#academy-game-root .snap-result-loss {
  color: #e74c3c;
}
#academy-game-root .snap-result-score {
  text-align: center; font-size: 15px; color: rgba(255,255,255,0.7);
}
#academy-game-root .snap-result-breakdown {
  display: flex; flex-direction: column; gap: 10px;
}
#academy-game-root .snap-result-line {
  padding: 12px; border-radius: 12px; border: 2px solid rgba(255,255,255,0.08);
  background: rgba(15,15,26,0.6);
}
#academy-game-root .snap-line-won { border-color: rgba(46,204,113,0.4); background: rgba(46,204,113,0.06); }
#academy-game-root .snap-line-lost { border-color: rgba(231,76,60,0.3); background: rgba(231,76,60,0.04); }
#academy-game-root .snap-line-tie { border-color: rgba(255,212,0,0.3); }

#academy-game-root .snap-result-line-label {
  font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 6px;
}
#academy-game-root .snap-result-pow-row {
  display: flex; align-items: center; gap: 10px; justify-content: center;
  margin-bottom: 8px;
}
#academy-game-root .snap-result-user-pow { font-weight: 800; color: #00e5ff; font-size: 18px; }
#academy-game-root .snap-result-vs { font-size: 12px; color: rgba(255,255,255,0.3); }
#academy-game-root .snap-result-bot-pow { font-weight: 800; color: #ff2d87; font-size: 18px; }

#academy-game-root .snap-result-cards-row {
  display: flex; justify-content: space-between; gap: 12px;
}
#academy-game-root .snap-result-cards-side {
  display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
}
#academy-game-root .snap-result-cards-bot { justify-content: flex-end; }
#academy-game-root .snap-result-cards-label {
  font-size: 11px; font-weight: 700; color: rgba(255,255,255,0.4);
  margin-right: 6px;
}
#academy-game-root .snap-result-mini-card {
  font-size: 12px; font-weight: 700; padding: 2px 6px;
  border-radius: 6px; background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.8);
}

/* CXP result */
#academy-game-root .snap-result-cxp {
  text-align: center; font-size: 16px; color: #ffd400;
}
#academy-game-root .snap-result-stake {
  text-align: center; font-size: 14px; font-weight: 800; color: #ff2d87;
}

/* New cards celebration */
#academy-game-root .snap-new-cards-section {
  padding: 12px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(255,212,0,0.08), rgba(168,85,247,0.08));
  border: 2px solid rgba(255,212,0,0.3);
}
#academy-game-root .snap-new-cards-title {
  text-align: center; font-size: 16px; font-weight: 900; color: #ffd400;
  margin-bottom: 10px; animation: snapPulse 1s ease-in-out infinite alternate;
}
#academy-game-root .snap-new-card {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-radius: 10px; background: rgba(255,255,255,0.06);
  margin-bottom: 6px; animation: snapCardDrop 0.5s ease;
}
#academy-game-root .snap-new-card-icon { font-size: 24px; }
#academy-game-root .snap-new-card-name { font-weight: 800; font-size: 14px; color: #fff; }
#academy-game-root .snap-new-card-desc { font-size: 12px; color: rgba(255,255,255,0.6); }

/* ---- Collection screen ---- */
#academy-game-root .snap-collection-screen {
  padding: 16px; max-width: 720px; margin: 0 auto;
  animation: bdtFadeIn 0.3s ease;
}
#academy-game-root .snap-collection-title {
  text-align: center; font-size: 24px; font-weight: 900;
  background: linear-gradient(135deg, #ffd400, #ff2d87, #00e5ff);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; margin-bottom: 12px;
}
#academy-game-root .snap-collection-stats {
  display: flex; justify-content: center; gap: 16px; flex-wrap: wrap;
  margin-bottom: 16px; font-size: 14px; color: rgba(255,255,255,0.7);
}
#academy-game-root .snap-collection-stats span { font-weight: 700; }
#academy-game-root .snap-cl-progress {
  margin-bottom: 16px; padding: 12px 16px;
  background: linear-gradient(135deg, rgba(255,212,0,0.06), rgba(168,85,247,0.06));
  border: 1px solid rgba(255,212,0,0.2); border-radius: 12px;
}
#academy-game-root .snap-cl-label {
  font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.6);
  margin-bottom: 6px; text-align: center;
}
#academy-game-root .snap-cl-bar {
  width: 100%; height: 8px; background: rgba(255,255,255,0.08);
  border-radius: 4px; overflow: hidden;
}
#academy-game-root .snap-cl-fill {
  height: 100%; border-radius: 4px;
  background: linear-gradient(90deg, #ffd400, #ff2d87, #a855f7);
  transition: width 0.5s ease;
}
#academy-game-root .snap-cl-next {
  font-size: 11px; color: rgba(255,255,255,0.45);
  text-align: center; margin-top: 4px;
}
#academy-game-root .snap-collection-section-label {
  font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.6);
  text-transform: uppercase; letter-spacing: 1px; margin: 12px 0 8px;
}

/* Deck builder row */
#academy-game-root .snap-collection-deck {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px;
  margin-bottom: 16px;
}
#academy-game-root .snap-deck-slot {
  padding: 8px 4px; border-radius: 10px; text-align: center;
  border: 2px dashed rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.02);
  cursor: pointer; transition: all 0.2s; min-height: 60px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
#academy-game-root .snap-deck-filled {
  border-style: solid; border-color: rgba(0,229,255,0.3);
  background: rgba(0,229,255,0.05);
}
#academy-game-root .snap-deck-filled:hover { border-color: #e74c3c; }
#academy-game-root .snap-deck-icon { font-size: 20px; }
#academy-game-root .snap-deck-name { font-size: 9px; font-weight: 700; color: rgba(255,255,255,0.7); margin-top: 2px; }
#academy-game-root .snap-deck-empty { font-size: 20px; color: rgba(255,255,255,0.15); }

/* Pool labels */
#academy-game-root .snap-collection-pool-label {
  font-size: 14px; font-weight: 800; color: #fff;
  margin: 16px 0 8px; padding: 6px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.04);
}
#academy-game-root .snap-pool-locked { color: rgba(255,255,255,0.35); }

/* Card grid */
#academy-game-root .snap-collection-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px;
  margin-bottom: 8px;
}
#academy-game-root .snap-collection-card {
  padding: 8px; border-radius: 10px; text-align: center;
  background: rgba(255,255,255,0.04); border: 2px solid rgba(255,255,255,0.1);
  cursor: pointer; transition: all 0.2s; position: relative;
}
#academy-game-root .snap-collection-card:hover:not(.snap-card-locked) {
  transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}
#academy-game-root .snap-card-locked {
  opacity: 0.3; cursor: default; filter: grayscale(1);
}
#academy-game-root .snap-card-in-deck { background: rgba(0,229,255,0.08); }
#academy-game-root .snap-card-in-deck-badge {
  font-size: 8px; font-weight: 900; color: #00e5ff;
  margin-top: 4px; text-transform: uppercase; letter-spacing: 0.5px;
}
#academy-game-root .snap-card-new { animation: snapCardDrop 0.6s ease; }
#academy-game-root .snap-card-new-badge {
  position: absolute; top: -4px; right: -4px;
  font-size: 9px; font-weight: 900; padding: 2px 6px;
  background: linear-gradient(135deg, #ffd400, #ff9500);
  color: #1a1a2e; border-radius: 6px;
  animation: snapPulse 1s ease-in-out infinite alternate;
}

/* Collection buttons */
#academy-game-root .snap-collection-btns {
  display: flex; flex-direction: column; gap: 8px; margin-top: 16px;
}
#academy-game-root .snap-collection-warning {
  text-align: center; font-size: 13px; color: rgba(255,255,255,0.5);
  font-style: italic; padding: 8px;
}

/* Snap animations */
@keyframes snapPulse {
  from { opacity: 0.7; transform: scale(0.98); }
  to { opacity: 1; transform: scale(1.02); }
}
@keyframes snapCardDrop {
  from { opacity: 0; transform: translateY(-12px) scale(0.8); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* ========================================================================
   v3.77.0 — Zones Mathématiques + Retreat
   ======================================================================== */

/* Zone header inside each snap-line */
#academy-game-root .snap-zone-header {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 8px; padding: 6px 10px;
  border-radius: 10px; background: rgba(255,255,255,0.04);
}
#academy-game-root .snap-zone-icon {
  font-size: 22px; flex-shrink: 0;
}
#academy-game-root .snap-zone-name {
  font-size: 14px; font-weight: 800; color: #fff;
  text-shadow: 0 0 8px rgba(255,212,0,0.2);
}
#academy-game-root .snap-zone-desc {
  font-size: 12px; color: rgba(255,255,255,0.75);
  margin-bottom: 6px; text-align: center; line-height: 1.4;
  font-style: italic;
}
#academy-game-root .snap-zone-wincond {
  font-size: 12px; font-weight: 700; color: #a855f7;
  text-align: center; margin-bottom: 6px;
}
#academy-game-root .snap-zone-limit {
  display: inline-block; font-size: 10px; font-weight: 700;
  color: #e74c3c; background: rgba(231,76,60,0.12);
  padding: 2px 8px; border-radius: 6px; margin-bottom: 6px;
}

/* Unrevealed zone (mystery) */
#academy-game-root .snap-line-hidden {
  opacity: 0.5; border-style: dashed;
  background: repeating-linear-gradient(
    -45deg,
    rgba(15,15,26,0.7),
    rgba(15,15,26,0.7) 8px,
    rgba(255,255,255,0.02) 8px,
    rgba(255,255,255,0.02) 16px
  );
}
#academy-game-root .snap-line-hidden .snap-zone-header {
  justify-content: center;
}

/* Zone just revealed — flash animation */
#academy-game-root .snap-line-just-revealed {
  animation: snapZoneReveal 0.8s ease-out;
}
@keyframes snapZoneReveal {
  0% { opacity: 0.4; transform: scale(0.95); border-color: rgba(255,212,0,0.8); box-shadow: 0 0 30px rgba(255,212,0,0.4); }
  50% { border-color: rgba(255,212,0,0.6); box-shadow: 0 0 20px rgba(255,212,0,0.2); }
  100% { opacity: 1; transform: scale(1); border-color: rgba(255,255,255,0.12); box-shadow: none; }
}

/* Zone at card limit */
#academy-game-root .snap-line-locked {
  border-color: rgba(231,76,60,0.3);
  background: rgba(231,76,60,0.04);
}
#academy-game-root .snap-line-locked::after {
  content: '🔒'; position: absolute; top: 8px; right: 10px; font-size: 14px;
  opacity: 0.5;
}

/* Action row (snap + retreat side by side) */
#academy-game-root .snap-action-row {
  display: flex; gap: 8px; margin-top: 6px;
}
#academy-game-root .snap-action-row .snap-co-btn {
  flex: 2;
}

/* Retreat button */
#academy-game-root .snap-retreat-btn {
  flex: 1; padding: 10px 12px;
  background: rgba(231,76,60,0.12);
  border: 2px solid rgba(231,76,60,0.35);
  border-radius: 12px; color: #e74c3c;
  font-weight: 700; font-size: 13px; cursor: pointer;
  transition: all 0.2s;
}
#academy-game-root .snap-retreat-btn:hover {
  background: rgba(231,76,60,0.2);
  border-color: #e74c3c;
  transform: scale(1.02);
}

/* Retreat result display */
#academy-game-root .snap-result-retreat {
  background: linear-gradient(135deg, rgba(231,76,60,0.1), rgba(255,255,255,0.02));
  border: 2px solid rgba(231,76,60,0.3);
  border-radius: 16px; padding: 24px; text-align: center;
}
#academy-game-root .snap-result-retreat .snap-result-header {
  color: #e74c3c;
}
#academy-game-root .snap-result-cxp-loss {
  font-size: 18px; font-weight: 900; color: #e74c3c;
  text-align: center; margin: 8px 0;
}

/* Zone color accents (applied dynamically via inline style) */
#academy-game-root .snap-zone-header[data-zone-color] {
  border-left: 3px solid var(--zone-clr, rgba(255,255,255,0.1));
}

/* ========================================================================
   v3.78.0 — Question Flash
   ======================================================================== */

/* QFlash toggle in topbar */
#academy-game-root .snap-qflash-toggle {
  font-size: 11px; font-weight: 700; padding: 4px 10px;
  border-radius: 8px; cursor: pointer;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.5); transition: all 0.2s;
}
#academy-game-root .snap-qflash-on {
  background: linear-gradient(135deg, rgba(255,212,0,0.2), rgba(255,45,135,0.2));
  border-color: rgba(255,212,0,0.5); color: #ffd400;
}

/* QFlash overlay */
#academy-game-root .snap-qflash-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.85); z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  animation: bdtFadeIn 0.2s ease;
}
#academy-game-root .snap-qflash-modal {
  background: linear-gradient(135deg, #1a1a2e, #0f0f1a);
  border: 2px solid rgba(255,212,0,0.4); border-radius: 20px;
  padding: 28px 24px; max-width: 400px; width: 90%;
  text-align: center; animation: snapCardDrop 0.3s ease;
}
#academy-game-root .snap-qflash-title {
  font-size: 22px; font-weight: 900; margin-bottom: 12px;
  background: linear-gradient(135deg, #ffd400, #ff2d87);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
#academy-game-root .snap-qflash-card-label {
  font-size: 14px; color: rgba(255,255,255,0.6); margin-bottom: 16px;
}
#academy-game-root .snap-qflash-question {
  font-size: 36px; font-weight: 900; color: #fff;
  margin-bottom: 16px; letter-spacing: 2px;
}
#academy-game-root .snap-qflash-timer-bar {
  width: 100%; height: 6px; border-radius: 3px;
  background: rgba(255,255,255,0.1); margin-bottom: 16px; overflow: hidden;
}
#academy-game-root .snap-qflash-timer-fill {
  height: 100%; width: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #2ecc71, #ffd400);
  transition: width 0.1s linear;
}
#academy-game-root .snap-qflash-input {
  width: 100%; padding: 14px 16px; font-size: 24px; font-weight: 800;
  text-align: center; border-radius: 12px;
  background: rgba(255,255,255,0.08); border: 2px solid rgba(0,229,255,0.4);
  color: #fff; outline: none; margin-bottom: 12px;
  font-family: inherit;
  -moz-appearance: textfield;
}
#academy-game-root .snap-qflash-input::-webkit-inner-spin-button,
#academy-game-root .snap-qflash-input::-webkit-outer-spin-button { -webkit-appearance: none; }
#academy-game-root .snap-qflash-input:focus {
  border-color: #00e5ff; box-shadow: 0 0 16px rgba(0,229,255,0.2);
}
#academy-game-root .snap-qflash-submit {
  width: 100%; margin-bottom: 12px;
}
#academy-game-root .snap-qflash-hint {
  font-size: 12px; color: rgba(255,255,255,0.65); line-height: 1.5;
}
#academy-game-root .snap-qflash-hint b { color: rgba(255,255,255,0.85); }

/* QFlash result */
#academy-game-root .snap-qflash-result {
  padding: 20px; border-radius: 14px;
  animation: snapCardDrop 0.3s ease;
}
#academy-game-root .snap-qflash-result-msg {
  font-size: 20px; font-weight: 900; margin-bottom: 8px;
}
#academy-game-root .snap-qflash-result-answer {
  font-size: 14px; color: rgba(255,255,255,0.5);
}
#academy-game-root .snap-qflash-result-fast { background: rgba(46,204,113,0.15); }
#academy-game-root .snap-qflash-result-fast .snap-qflash-result-msg { color: #2ecc71; }
#academy-game-root .snap-qflash-result-normal { background: rgba(0,229,255,0.1); }
#academy-game-root .snap-qflash-result-normal .snap-qflash-result-msg { color: #00e5ff; }
#academy-game-root .snap-qflash-result-slow { background: rgba(245,158,11,0.1); }
#academy-game-root .snap-qflash-result-slow .snap-qflash-result-msg { color: #f59e0b; }
#academy-game-root .snap-qflash-result-wrong { background: rgba(231,76,60,0.15); }
#academy-game-root .snap-qflash-result-wrong .snap-qflash-result-msg { color: #e74c3c; }
#academy-game-root .snap-qflash-result-timeout { background: rgba(255,255,255,0.05); }
#academy-game-root .snap-qflash-result-timeout .snap-qflash-result-msg { color: rgba(255,255,255,0.4); }

/* ========================================================================
   v3.78.0 — Factions ACA
   ======================================================================== */

/* Faction badge on cards */
#academy-game-root .snap-card-faction {
  position: absolute; top: 6px; left: 6px;
  font-size: 10px; width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; color: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

/* Faction-colored card borders (subtle glow based on faction) */
/* v3.80.0 — Faction glow + enhanced borders */
#academy-game-root .snap-card[data-faction="recrues"] {
  border-color: rgba(255,45,135,0.35);
  box-shadow: 0 0 12px rgba(255,45,135,0.1), inset 0 0 8px rgba(255,45,135,0.03);
}
#academy-game-root .snap-card[data-faction="donjon"] {
  border-color: rgba(139,92,246,0.35);
  box-shadow: 0 0 12px rgba(139,92,246,0.1), inset 0 0 8px rgba(139,92,246,0.03);
}
#academy-game-root .snap-card[data-faction="pixels"] {
  border-color: rgba(16,185,129,0.35);
  box-shadow: 0 0 12px rgba(16,185,129,0.1), inset 0 0 8px rgba(16,185,129,0.03);
}
#academy-game-root .snap-card[data-faction="cosmiques"] {
  border-color: rgba(245,158,11,0.35);
  box-shadow: 0 0 12px rgba(245,158,11,0.1), inset 0 0 8px rgba(245,158,11,0.03);
}
/* Hover amplifies glow */
#academy-game-root .snap-card[data-faction="recrues"]:hover:not(.snap-card-disabled) {
  box-shadow: 0 0 20px rgba(255,45,135,0.25), 0 8px 24px rgba(255,45,135,0.15);
}
#academy-game-root .snap-card[data-faction="donjon"]:hover:not(.snap-card-disabled) {
  box-shadow: 0 0 20px rgba(139,92,246,0.25), 0 8px 24px rgba(139,92,246,0.15);
}
#academy-game-root .snap-card[data-faction="pixels"]:hover:not(.snap-card-disabled) {
  box-shadow: 0 0 20px rgba(16,185,129,0.25), 0 8px 24px rgba(16,185,129,0.15);
}
#academy-game-root .snap-card[data-faction="cosmiques"]:hover:not(.snap-card-disabled) {
  box-shadow: 0 0 20px rgba(245,158,11,0.25), 0 8px 24px rgba(245,158,11,0.15);
}

/* Faction section labels in collection */
#academy-game-root .snap-faction-label {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700; padding: 2px 8px;
  border-radius: 6px; margin-left: 8px;
  color: rgba(255,255,255,0.8);
}

/* Legendary holographic shimmer */
#academy-game-root .snap-rarity-legendary {
  background: linear-gradient(135deg, rgba(255,212,0,0.06), rgba(168,85,247,0.06), rgba(255,45,135,0.06)) !important;
  animation: snapHoloShimmer 3s ease-in-out infinite;
}
@keyframes snapHoloShimmer {
  0%, 100% { border-color: rgba(255,212,0,0.5); box-shadow: 0 0 12px rgba(255,212,0,0.15); }
  33% { border-color: rgba(168,85,247,0.5); box-shadow: 0 0 12px rgba(168,85,247,0.15); }
  66% { border-color: rgba(255,45,135,0.5); box-shadow: 0 0 12px rgba(255,45,135,0.15); }
}

/* Epic glow */
#academy-game-root .snap-rarity-epic {
  animation: snapEpicGlow 2s ease-in-out infinite alternate;
}
@keyframes snapEpicGlow {
  from { box-shadow: 0 0 6px rgba(168,85,247,0.15); }
  to { box-shadow: 0 0 14px rgba(168,85,247,0.3); }
}

/* ========================================================================
   v3.78.0 — Starter Decks
   ======================================================================== */

#academy-game-root .snap-starter-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px; margin: 16px 0;
}
#academy-game-root .snap-starter-card {
  padding: 16px; border-radius: 14px;
  background: rgba(255,255,255,0.04);
  border: 2px solid rgba(255,255,255,0.15);
  transition: all 0.2s;
}
#academy-game-root .snap-starter-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
#academy-game-root .snap-starter-name {
  font-size: 18px; font-weight: 900; margin-bottom: 6px;
}
#academy-game-root .snap-starter-desc {
  font-size: 13px; color: rgba(255,255,255,0.6);
  margin-bottom: 10px; line-height: 1.4;
}
#academy-game-root .snap-starter-preview {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin-bottom: 12px;
}
#academy-game-root .snap-starter-chip {
  font-size: 11px; font-weight: 700; padding: 3px 8px;
  border-radius: 6px; background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.7);
}
#academy-game-root .snap-starter-use {
  width: 100%; font-size: 14px;
}

/* ========================================================================
   v3.78.0 — Card Evolution Levels
   ======================================================================== */

/* Level stars */
#academy-game-root .snap-card-level {
  font-size: 10px; color: #ffd400; text-align: center;
  letter-spacing: 1px; margin: 2px 0;
}
#academy-game-root .snap-card-lvl-bonus {
  font-size: 10px; color: #2ecc71; font-weight: 700;
}

/* XP progress bar */
#academy-game-root .snap-card-xp-bar {
  width: 100%; height: 3px; border-radius: 2px;
  background: rgba(255,255,255,0.08); margin: 3px 0; overflow: hidden;
}
#academy-game-root .snap-card-xp-fill {
  height: 100%; border-radius: 2px;
  background: linear-gradient(90deg, #00e5ff, #a855f7);
  transition: width 0.3s ease;
}
#academy-game-root .snap-card-xp-max .snap-card-xp-fill {
  background: linear-gradient(90deg, #ffd400, #ff2d87);
}

/* Level 2: shiny border */
#academy-game-root .snap-card-lv2 {
  border-color: rgba(0,229,255,0.4) !important;
  box-shadow: 0 0 8px rgba(0,229,255,0.12);
}

/* Level 3: idle animation */
#academy-game-root .snap-card-lv3 {
  border-color: rgba(168,85,247,0.5) !important;
  animation: snapCardLv3Pulse 2.5s ease-in-out infinite alternate;
}
@keyframes snapCardLv3Pulse {
  from { box-shadow: 0 0 6px rgba(168,85,247,0.15); }
  to { box-shadow: 0 0 14px rgba(168,85,247,0.35); }
}

/* Level 4: animated background */
#academy-game-root .snap-card-lv4 {
  border-color: rgba(255,212,0,0.5) !important;
  background: linear-gradient(135deg, rgba(255,212,0,0.06), rgba(168,85,247,0.06), rgba(0,229,255,0.06)) !important;
  animation: snapCardLv4BG 4s ease-in-out infinite;
}
@keyframes snapCardLv4BG {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* Level 5: holographic rainbow */
#academy-game-root .snap-card-lv5 {
  background: linear-gradient(135deg, rgba(255,212,0,0.08), rgba(255,45,135,0.08), rgba(0,229,255,0.08), rgba(168,85,247,0.08)) !important;
  background-size: 300% 300%;
  animation: snapCardLv5Holo 3s ease-in-out infinite;
}
@keyframes snapCardLv5Holo {
  0% { background-position: 0% 0%; border-color: rgba(255,212,0,0.6); box-shadow: 0 0 16px rgba(255,212,0,0.2); }
  33% { background-position: 100% 0%; border-color: rgba(255,45,135,0.6); box-shadow: 0 0 16px rgba(255,45,135,0.2); }
  66% { background-position: 50% 100%; border-color: rgba(0,229,255,0.6); box-shadow: 0 0 16px rgba(0,229,255,0.2); }
  100% { background-position: 0% 0%; border-color: rgba(255,212,0,0.6); box-shadow: 0 0 16px rgba(255,212,0,0.2); }
}

/* ========================================================================
   v3.74.0 — Responsive adjustments
   ======================================================================== */
@media (max-width: 480px) {
  #academy-game-root .ttmc-breakdown-subject { flex: 0 0 100px; font-size: 11px; }
  #academy-game-root .ttmc-match-stats { grid-template-columns: 1fr; }
  #academy-game-root .aca-event-badge { font-size: 24px; }
  #academy-game-root .aca-event-title { font-size: 14px; }
  /* Snap mobile */
  #academy-game-root .snap-card { flex: 0 0 100px; padding: 8px; }
  #academy-game-root .snap-card-icon { font-size: 22px; }
  #academy-game-root .snap-card-desc { display: none; }
  #academy-game-root .snap-result-header { font-size: 24px; }
  #academy-game-root .snap-hand { gap: 6px; }
  #academy-game-root .snap-collection-deck { grid-template-columns: repeat(4, 1fr); }
  #academy-game-root .snap-collection-grid { grid-template-columns: repeat(3, 1fr); }
  #academy-game-root .snap-collection-card .snap-card-desc { display: none; }
  /* Zone mobile */
  #academy-game-root .snap-zone-icon { font-size: 18px; }
  #academy-game-root .snap-zone-name { font-size: 12px; }
  #academy-game-root .snap-zone-desc { font-size: 12px; }
  #academy-game-root .snap-action-row { flex-direction: column; }
  #academy-game-root .snap-retreat-btn { font-size: 12px; padding: 8px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v3.80.0 — Conseil du Coach (Math Tips)
   ═══════════════════════════════════════════════════════════════════════════ */
#academy-game-root .bdt-tips-section { margin-top: 16px; }
#academy-game-root .bdt-tip-card {
  background: linear-gradient(135deg, rgba(0,229,255,0.06), rgba(46,204,113,0.08));
  border: 1px solid rgba(0,229,255,0.25);
  border-radius: 12px;
  padding: 14px 16px;
  margin-top: 10px;
  animation: bdt-tip-fadeIn 0.4s ease;
}
#academy-game-root .bdt-tip-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
#academy-game-root .bdt-tip-icon {
  font-size: 20px;
  line-height: 1;
}
#academy-game-root .bdt-tip-subject {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #00e5ff;
  background: rgba(0,229,255,0.1);
  padding: 2px 8px;
  border-radius: 4px;
}
#academy-game-root .bdt-tip-body {
  font-size: 14px;
  line-height: 1.5;
  color: rgba(255,255,255,0.88);
}
@keyframes bdt-tip-fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* ═══════════════════════════════════════════════════════════════════════════
   v3.80.0 — Polish Snap : animations cartes, zones, scores
   ═══════════════════════════════════════════════════════════════════════════ */

/* Card played → slide-in from below into zone */
#academy-game-root .snap-card-slot.snap-card-just-played {
  animation: snapCardSlideIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes snapCardSlideIn {
  0%   { opacity: 0; transform: translateY(30px) scale(0.8); }
  60%  { opacity: 1; transform: translateY(-4px) scale(1.02); }
  100% { transform: translateY(0) scale(1); }
}

/* Bot card played → slide-in from above */
#academy-game-root .snap-card-slot.snap-card-bot-played {
  animation: snapCardBotSlideIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes snapCardBotSlideIn {
  0%   { opacity: 0; transform: translateY(-30px) scale(0.8); }
  60%  { opacity: 1; transform: translateY(4px) scale(1.02); }
  100% { transform: translateY(0) scale(1); }
}

/* Zone reveal — flip animation (replaces basic fade) */
#academy-game-root .snap-line-just-revealed {
  animation: snapZoneFlip 0.8s ease !important;
}
@keyframes snapZoneFlip {
  0%   { opacity: 0; transform: perspective(600px) rotateY(90deg) scale(0.9); }
  50%  { opacity: 0.7; transform: perspective(600px) rotateY(-10deg) scale(1.02); }
  100% { opacity: 1; transform: perspective(600px) rotateY(0) scale(1); }
}

/* Power score pulse when it changes */
#academy-game-root .snap-power-updated {
  animation: snapPowerPulse 0.5s ease;
}
@keyframes snapPowerPulse {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.4); color: #ffd400; }
  100% { transform: scale(1); }
}

/* Zone won/lost flash at end of match */
#academy-game-root .snap-line-won-flash {
  animation: snapLineWonFlash 0.6s ease;
}
@keyframes snapLineWonFlash {
  0%   { box-shadow: 0 0 0 0 rgba(46,204,113,0.4); }
  50%  { box-shadow: 0 0 20px 4px rgba(46,204,113,0.3); }
  100% { box-shadow: 0 0 0 0 rgba(46,204,113,0); }
}
#academy-game-root .snap-line-lost-flash {
  animation: snapLineLostFlash 0.6s ease;
}
@keyframes snapLineLostFlash {
  0%   { box-shadow: 0 0 0 0 rgba(231,76,60,0.4); }
  50%  { box-shadow: 0 0 20px 4px rgba(231,76,60,0.3); }
  100% { box-shadow: 0 0 0 0 rgba(231,76,60,0); }
}

/* Snap button glow effect */
#academy-game-root .snap-co-btn {
  position: relative;
  overflow: hidden;
}
#academy-game-root .snap-co-btn::before {
  content: '';
  position: absolute; inset: -2px;
  background: linear-gradient(90deg, #ff2d87, #ffd400, #00e5ff, #a855f7, #ff2d87);
  background-size: 300% 100%;
  animation: snapBtnGlow 3s linear infinite;
  border-radius: inherit; z-index: -1;
  opacity: 0.4;
}
@keyframes snapBtnGlow {
  0%   { background-position: 0% 50%; }
  100% { background-position: 300% 50%; }
}

/* Energy refill animation between turns */
#academy-game-root .snap-energy-refill {
  animation: snapEnergyRefill 0.6s ease;
}
@keyframes snapEnergyRefill {
  0%   { opacity: 0.5; transform: scale(0.95); }
  50%  { color: #ffd400; transform: scale(1.15); }
  100% { opacity: 1; transform: scale(1); }
}

/* Turn indicator bounce */
#academy-game-root .snap-turn-label {
  transition: all 0.3s ease;
}
#academy-game-root .snap-turn-new {
  animation: snapTurnBounce 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes snapTurnBounce {
  0%   { transform: scale(0.8); opacity: 0; }
  60%  { transform: scale(1.1); }
  100% { transform: scale(1); opacity: 1; }
}

/* Rarity shimmer for epic/legendary cards */
#academy-game-root .snap-rarity-epic {
  background: linear-gradient(135deg, rgba(168,85,247,0.08), rgba(255,255,255,0.06), rgba(168,85,247,0.06)) !important;
}
#academy-game-root .snap-rarity-legendary {
  background: linear-gradient(135deg, rgba(245,158,11,0.1), rgba(255,255,255,0.06), rgba(245,158,11,0.08)) !important;
  position: relative;
}
#academy-game-root .snap-rarity-legendary::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, transparent 30%, rgba(255,212,0,0.08) 50%, transparent 70%);
  background-size: 200% 200%;
  animation: snapLegendaryShimmer 3s ease-in-out infinite;
  border-radius: inherit;
  pointer-events: none;
}
@keyframes snapLegendaryShimmer {
  0%   { background-position: 200% 200%; }
  100% { background-position: -200% -200%; }
}

/* Retreat button subtle danger pulse */
#academy-game-root .snap-retreat-btn {
  transition: all 0.3s ease;
}
#academy-game-root .snap-retreat-btn:hover {
  background: rgba(231,76,60,0.15) !important;
  border-color: rgba(231,76,60,0.4) !important;
  color: #e74c3c !important;
}

/* Card in hand entrance stagger */
#academy-game-root .snap-hand .snap-card {
  animation: snapHandCardIn 0.3s ease both;
}
#academy-game-root .snap-hand .snap-card:nth-child(1) { animation-delay: 0ms; }
#academy-game-root .snap-hand .snap-card:nth-child(2) { animation-delay: 50ms; }
#academy-game-root .snap-hand .snap-card:nth-child(3) { animation-delay: 100ms; }
#academy-game-root .snap-hand .snap-card:nth-child(4) { animation-delay: 150ms; }
#academy-game-root .snap-hand .snap-card:nth-child(5) { animation-delay: 200ms; }
#academy-game-root .snap-hand .snap-card:nth-child(6) { animation-delay: 250ms; }
@keyframes snapHandCardIn {
  0%   { opacity: 0; transform: translateY(20px) scale(0.9); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Toast in-game (apparaît 1× quand pas de H5P dispo) */
#academy-game-root .bdt-tip-toast {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: rgba(0,229,255,0.15);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(0,229,255,0.3);
  color: rgba(255,255,255,0.9);
  font-size: 13px;
  padding: 8px 16px;
  border-radius: 20px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 999;
  pointer-events: none;
}
#academy-game-root .bdt-tip-toast-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ==========================================================================
   v3.81.0 — Défi un ami (async, in-app). Tout scopé, gated par data-friend-challenges.
   ========================================================================== */

/* Bouton menu + badge de défis reçus */
#academy-game-root .aca-defi-menu-btn { position: relative; }
#academy-game-root .aca-defi-badge {
  position: absolute;
  top: -6px; right: -6px;
  min-width: 20px; height: 20px;
  padding: 0 5px;
  border-radius: 10px;
  background: var(--bdt-primary);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 20px;
  text-align: center;
  box-shadow: 0 0 10px rgba(233, 69, 96, 0.6);
}

/* Bouton "Défier un ami" sur l'écran résultats */
#academy-game-root .aca-defi-btn {
  border: 2px solid var(--bdt-success) !important;
}

/* Écran "Mes défis" */
#academy-game-root .bdt-ch-section { margin-top: 18px; text-align: left; }
#academy-game-root .bdt-ch-section-title {
  font-weight: 800;
  font-size: 16px;
  opacity: 0.9;
  margin-bottom: 8px;
}
#academy-game-root .bdt-ch-list { display: flex; flex-direction: column; gap: 10px; }
#academy-game-root .bdt-ch-empty {
  opacity: 0.65;
  font-size: 14px;
  padding: 10px 4px;
}
#academy-game-root .bdt-ch-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: var(--bdt-radius-sm);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(0, 210, 255, 0.25);
}
#academy-game-root .bdt-ch-card.done { border-color: rgba(245, 197, 24, 0.4); }
#academy-game-root .bdt-ch-card-main { flex: 1 1 220px; min-width: 0; }
#academy-game-root .bdt-ch-card-name { font-weight: 800; font-size: 15px; }
#academy-game-root .bdt-ch-card-meta { font-size: 13px; opacity: 0.8; margin-top: 3px; }
#academy-game-root .bdt-ch-card-actions { display: flex; gap: 8px; flex: 0 0 auto; }
#academy-game-root .bdt-ch-card-actions .bdt-btn { padding: 8px 14px; font-size: 14px; }

/* Modal "Défier un ami" */
#academy-game-root .bdt-modal-overlay.bdt-defi-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(10, 10, 22, 0.78);
  backdrop-filter: blur(3px);
}
#academy-game-root .bdt-defi-modal {
  width: 100%;
  max-width: 420px;
  max-height: 80vh;
  overflow-y: auto;
  padding: 22px;
  border-radius: var(--bdt-radius);
  background: var(--bdt-bg);
  border: 2px solid var(--bdt-primary);
  box-shadow: var(--bdt-shadow-glow);
  text-align: center;
}
#academy-game-root .bdt-defi-head { font-weight: 800; font-size: 20px; margin-bottom: 6px; }
#academy-game-root .bdt-defi-sub { font-size: 14px; opacity: 0.85; margin-bottom: 16px; }
#academy-game-root .bdt-defi-friends { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
#academy-game-root .bdt-defi-friend {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 12px 14px;
  border-radius: var(--bdt-radius-sm);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(0, 210, 255, 0.3);
  color: var(--bdt-text);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.12s ease, border-color 0.12s ease;
}
#academy-game-root .bdt-defi-friend:hover { transform: translateY(-1px); border-color: var(--bdt-success); }
#academy-game-root .bdt-defi-friend.sending { opacity: 0.55; cursor: default; }
#academy-game-root .bdt-defi-friend-lvl { font-size: 12px; opacity: 0.7; font-weight: 600; }
#academy-game-root .bdt-defi-empty { opacity: 0.7; font-size: 14px; padding: 8px; }
#academy-game-root .bdt-defi-sent {
  font-size: 15px;
  font-weight: 700;
  color: var(--bdt-success);
  padding: 10px;
}
#academy-game-root .bdt-defi-close { width: 100%; }

/* Bandeau comparaison sur l'écran résultats (défi relevé) */
#academy-game-root .bdt-challenge-compare {
  margin: 0 auto 16px;
  max-width: 360px;
  padding: 14px 16px;
  border-radius: var(--bdt-radius);
  background: linear-gradient(135deg, rgba(233, 69, 96, 0.18), rgba(0, 210, 255, 0.18));
  border: 1px solid rgba(0, 210, 255, 0.4);
  text-align: center;
}
#academy-game-root .bdt-cc-title { font-weight: 800; font-size: 15px; opacity: 0.9; margin-bottom: 8px; }
#academy-game-root .bdt-cc-scores {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 16px;
}
#academy-game-root .bdt-cc-scores b { font-size: 22px; }
#academy-game-root .bdt-cc-vs { opacity: 0.6; font-size: 13px; }
#academy-game-root .bdt-cc-me b { color: var(--bdt-success); }
#academy-game-root .bdt-cc-them b { color: var(--bdt-energy); }
#academy-game-root .bdt-cc-verdict { margin-top: 8px; font-weight: 800; font-size: 16px; }

/* Message limite d'envoi (anti-spam) */
#academy-game-root .bdt-defi-ratemsg {
  background: rgba(245, 197, 24, 0.15);
  border: 1px solid rgba(245, 197, 24, 0.5);
  color: var(--bdt-energy);
  border-radius: var(--bdt-radius-sm);
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 10px;
}

/* Invitation « façon Xbox » : carte qui glisse en haut à droite */
#academy-game-root .bdt-invite-pop {
  position: fixed;
  top: 16px; right: 16px;
  z-index: 1100;
  transform: translateX(calc(100% + 24px));
  transition: transform 0.32s cubic-bezier(0.34, 1.56, 0.64, 1);
  pointer-events: none;
}
#academy-game-root .bdt-invite-pop.show { transform: translateX(0); }
#academy-game-root .bdt-invite-card {
  pointer-events: auto;
  width: 320px;
  max-width: calc(100vw - 32px);
  padding: 16px;
  border-radius: var(--bdt-radius);
  background: linear-gradient(135deg, #16213e, #0f3460);
  border: 2px solid var(--bdt-success);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 210, 255, 0.3);
  color: var(--bdt-text);
}
#academy-game-root .bdt-invite-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.85;
  margin-bottom: 10px;
}
#academy-game-root .bdt-invite-dot {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--bdt-success);
  box-shadow: 0 0 8px var(--bdt-success);
  animation: bdtInviteBlink 1.4s infinite;
}
@keyframes bdtInviteBlink { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
#academy-game-root .bdt-invite-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
#academy-game-root .bdt-invite-avatar {
  flex: 0 0 auto;
  width: 44px; height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(0, 210, 255, 0.4);
}
#academy-game-root .bdt-invite-info { min-width: 0; }
#academy-game-root .bdt-invite-name { font-weight: 800; font-size: 15px; }
#academy-game-root .bdt-invite-sub { font-size: 12px; opacity: 0.78; margin-top: 2px; }
#academy-game-root .bdt-invite-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#academy-game-root .bdt-invite-btn {
  width: 100%;
  padding: 11px 14px;
  border-radius: var(--bdt-radius-sm);
  font-family: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  border: 2px solid transparent;
  transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}
#academy-game-root .bdt-invite-btn:active { transform: scale(0.97); }
#academy-game-root .bdt-invite-btn.go {
  background: linear-gradient(135deg, #00d2ff, #0f9bd1);
  color: #06222b;
  box-shadow: 0 4px 16px rgba(0, 210, 255, 0.4);
}
#academy-game-root .bdt-invite-btn.go:hover { box-shadow: 0 6px 22px rgba(0, 210, 255, 0.6); }
#academy-game-root .bdt-invite-btn.later {
  background: rgba(255, 255, 255, 0.06);
  color: var(--bdt-text);
  border-color: rgba(255, 255, 255, 0.25);
}
#academy-game-root .bdt-invite-btn.later:hover { border-color: var(--bdt-energy); color: var(--bdt-energy); }
#academy-game-root .bdt-invite-btn.no {
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  padding: 7px;
  font-size: 13px;
  font-weight: 700;
}
#academy-game-root .bdt-invite-btn.no:hover { color: var(--bdt-primary); }

/* ==========================================================================
   v3.81.2 — Habillage « NASApunk » (signature de marque ACA) sur le Défi un ami.
   La DA (375783add59181bd8244c8d071bda1c7) prescrit le pop-art DARK pour l'UI
   enfant/jeu ; on garde donc la base sombre immersive et on ajoute la SIGNATURE
   de marque : bande tricolore (rouge/orange/or) + navy (couleur produit Arène).
   Bloc d'override (les règles plus bas l'emportent) → réversible facilement.
   ========================================================================== */
#academy-game-root {
  --aca-na-red: #C32136;
  --aca-na-orange: #DF5F35;
  --aca-na-gold: #D8A953;
  --aca-na-navy: #314B7A;
}
/* Bande tricolore signature en haut des surfaces Défi */
#academy-game-root .bdt-defi-modal,
#academy-game-root .bdt-invite-card,
#academy-game-root .bdt-challenge-compare { position: relative; overflow: hidden; }
#academy-game-root .bdt-defi-modal::before,
#academy-game-root .bdt-invite-card::before,
#academy-game-root .bdt-challenge-compare::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg,
    var(--aca-na-red) 0 33.33%,
    var(--aca-na-orange) 33.33% 66.66%,
    var(--aca-na-gold) 66.66% 100%);
}
/* Navy structurel (couleur produit Arène) sur les surfaces Défi */
#academy-game-root .bdt-defi-modal { border-color: var(--aca-na-navy); }
#academy-game-root .bdt-invite-card {
  background: linear-gradient(135deg, #1b2a47, #243a5e);
  border-color: var(--aca-na-navy);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.55), 0 0 18px rgba(49, 75, 122, 0.5);
}
#academy-game-root .bdt-ch-card,
#academy-game-root .bdt-defi-friend { border-color: rgba(49, 75, 122, 0.55); }
#academy-game-root .bdt-defi-friend:hover { border-color: var(--aca-na-gold); }
#academy-game-root .bdt-ch-card.done { border-color: rgba(216, 169, 83, 0.6); }
/* Titres de section « façon manuel technique » : filet rouge à gauche */
#academy-game-root .bdt-ch-section-title { border-left: 3px solid var(--aca-na-red); padding-left: 10px; }
/* Actions primaires en rouge/orange brand (pop on-brand) */
#academy-game-root .bdt-invite-btn.go {
  background: linear-gradient(135deg, var(--aca-na-red), var(--aca-na-orange));
  color: #fff;
  box-shadow: 0 4px 16px rgba(195, 33, 54, 0.45);
}
#academy-game-root .bdt-invite-btn.go:hover { box-shadow: 0 6px 22px rgba(195, 33, 54, 0.65); }
#academy-game-root .bdt-invite-btn.later:hover { border-color: var(--aca-na-gold); color: var(--aca-na-gold); }
#academy-game-root .bdt-invite-avatar { border-color: rgba(216, 169, 83, 0.5); }
#academy-game-root .bdt-invite-dot { background: var(--aca-na-gold); box-shadow: 0 0 8px var(--aca-na-gold); }
#academy-game-root .aca-defi-btn { border-color: var(--aca-na-gold) !important; }
#academy-game-root .aca-defi-badge { background: var(--aca-na-red); box-shadow: 0 0 10px rgba(195, 33, 54, 0.6); }
/* Bandeau comparaison : accents navy / or / orange */
#academy-game-root .bdt-challenge-compare {
  background: linear-gradient(135deg, rgba(49, 75, 122, 0.28), rgba(195, 33, 54, 0.16));
  border-color: var(--aca-na-navy);
}
#academy-game-root .bdt-cc-me b { color: var(--aca-na-gold); }
#academy-game-root .bdt-cc-them b { color: var(--aca-na-orange); }

/* v3.9x (feedback Pat 2026-06-18) — Détail des rounds : ligne « exceptionnel »
   (réponse très rapide, roundResult 'perfect'). Look doré/cyan distinct du vert. */
#academy-game-root .bdt-recap-row.perfect {
  background: linear-gradient(90deg, rgba(0, 210, 255, 0.16), rgba(245, 197, 24, 0.14));
  border: 1px solid rgba(0, 210, 255, 0.45);
  box-shadow: 0 0 14px rgba(0, 210, 255, 0.18);
}
#academy-game-root .bdt-recap-row.perfect .bdt-recap-icon { filter: drop-shadow(0 0 6px rgba(245, 197, 24, 0.7)); }
#academy-game-root .bdt-recap-row.perfect .bdt-recap-pts.pos { color: var(--bdt-success); font-weight: 900; }

/* =========================================================================
   v3.93.0 — Vague 1 audit UX (quick wins) : focus visible, btn-ghost,
   modal de confirmation maison, flash pédagogique TTMC, Abandonner 1v1,
   Reprendre partie Snap. Audit : specs/audit-ux-2026-07-16-plan.md
   ========================================================================= */

/* (A2) Focus visible : anneau cyan sur navigation clavier, partout.
   L'outline:none du .bdt-btn reste pour la souris ; :focus-visible prime. */
#academy-game-root button:focus-visible,
#academy-game-root a:focus-visible,
#academy-game-root [tabindex]:focus-visible,
.bdt-confirm-overlay button:focus-visible,
.bdt-help-modal-overlay button:focus-visible,
#bdt-help-fab:focus-visible {
  outline: 3px solid #00d2ff !important;
  outline-offset: 2px;
}

/* (C4) .bdt-btn-ghost — appelée par le JS (Collection, Decks de départ),
   n'était définie nulle part : boutons sans affordance, texte flottant. */
#academy-game-root .bdt-btn-ghost {
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(255, 255, 255, 0.22);
}
#academy-game-root .bdt-btn-ghost:hover {
  border-color: rgba(0, 210, 255, 0.6);
  color: #00d2ff;
  background: rgba(0, 210, 255, 0.08);
}

/* (N7) Modal de confirmation maison — même langage visuel que le modal
   d'aide. Monté sur <body> (hors #academy-game-root, qui est vidé par
   showScreen) → styles autonomes, aucune dépendance au .bdt-btn scopé. */
.bdt-confirm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 15, 26, 0.78);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2147483001; /* au-dessus du FAB Sortir (2147483000) */
  padding: 20px;
  animation: bdtConfirmFadeIn 180ms ease-out;
}
@keyframes bdtConfirmFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.bdt-confirm-card {
  background: linear-gradient(180deg, #1f1f3a 0%, #14142b 100%);
  border: 2px solid rgba(255, 45, 135, 0.3);
  border-radius: 16px;
  padding: 26px 24px 22px;
  max-width: 420px;
  width: 100%;
  color: #fff;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
  animation: bdtConfirmCardIn 240ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
@keyframes bdtConfirmCardIn {
  from { opacity: 0; transform: translateY(12px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.bdt-confirm-title {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 900;
  font-family: inherit;
}
.bdt-confirm-text {
  margin: 0 0 20px;
  font-size: 15px;
  opacity: 0.85;
}
.bdt-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}
.bdt-confirm-overlay .bdt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 12px 22px;
  min-height: 44px; /* cible tactile */
  border: 3px solid transparent;
  border-radius: 50px;
  cursor: pointer;
  background: transparent;
  color: #fff;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
/* L'option SÛRE (Continuer à jouer) = le gros bouton évident. */
.bdt-confirm-overlay .bdt-btn-primary {
  background: linear-gradient(135deg, #ff2d87, #d63851);
  border-color: #ff2d87;
  box-shadow: 0 4px 20px rgba(255, 45, 135, 0.35);
}
.bdt-confirm-overlay .bdt-btn-secondary {
  border-color: rgba(255, 255, 255, 0.3);
}
/* L'action destructive reste discrète (ghost rougeâtre). */
.bdt-confirm-overlay .bdt-confirm-danger {
  border-color: rgba(233, 69, 96, 0.55);
  color: #ff97a8;
}
.bdt-confirm-overlay .bdt-confirm-danger:hover {
  background: rgba(233, 69, 96, 0.12);
}

/* (C2) TTMC flash pédagogique : bonne réponse en vert (--aca-green),
   choix erroné en rouge. Keyframes à noms UNIQUES (audit : 3 @keyframes
   étaient déjà dupliqués dans ce fichier — on n'en rajoute pas). */
#academy-game-root .ttmc-answer.ttmc-answer-correct {
  background: linear-gradient(135deg, #2ecc71, #27ae60) !important;
  border-color: #2ecc71 !important;
  color: #08130c !important;
  box-shadow: 0 0 18px rgba(46, 204, 113, 0.55);
  animation: bdtTtmcAnswerPop 0.35s ease;
}
#academy-game-root .ttmc-answer.ttmc-answer-wrong {
  background: rgba(233, 69, 96, 0.25) !important;
  border-color: #e94560 !important;
  color: #ff97a8 !important;
  animation: bdtTtmcAnswerShake 0.4s ease;
}
@keyframes bdtTtmcAnswerPop {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.06); }
  100% { transform: scale(1); }
}
@keyframes bdtTtmcAnswerShake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

/* (N5) Bouton Abandonner du 1v1 — coin haut-gauche, symétrique du mute. */
#academy-game-root .bdt-battle {
  position: relative;
}
#academy-game-root .bdt-battle-quit {
  position: absolute;
  top: 6px;
  left: 6px;
  font-size: 12px;
  padding: 8px 14px;
  min-height: 40px;
  z-index: 5;
}

/* (N6) Reprendre la partie en cours depuis la Collection. */
#academy-game-root .snap-resume-btn {
  display: flex;
  margin: 0 auto 16px;
}

/* Réduction de mouvement : le modal de confirmation reste utilisable. */
@media (prefers-reduced-motion: reduce) {
  .bdt-confirm-overlay,
  .bdt-confirm-card,
  #academy-game-root .ttmc-answer.ttmc-answer-correct,
  #academy-game-root .ttmc-answer.ttmc-answer-wrong {
    animation: none !important;
  }
}

/* =========================================================================
   v3.94.0 — Vague 2 audit UX : menu vivant + carottes.
   Bande héros, grille aperçu, Mode du jour, micro-stats, bouton parlant,
   récompenses visibles partout, carotte XP, classement « Toi ».
   ========================================================================= */

/* (A1) Les cartes de mode sont maintenant de vrais <button> : reset UA. */
#academy-game-root button.aca-mode-card {
  font: inherit;
  color: inherit;
  text-align: center;
  appearance: none;
  -webkit-appearance: none;
}

/* (M1) Bande héros */
#academy-game-root .aca-hero-band {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  max-width: 560px;
  margin: 4px auto 10px;
  padding: 14px 18px;
  border-radius: 16px;
  border: 2px solid rgba(255, 45, 135, 0.35);
  background: linear-gradient(135deg, rgba(255, 45, 135, 0.12), rgba(168, 85, 247, 0.10));
  flex-wrap: wrap;
}
#academy-game-root .aca-hero-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--aca-cyan, #00e5ff);
  flex-shrink: 0;
}
#academy-game-root .aca-hero-avatar-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  background: rgba(255, 255, 255, 0.08);
}
#academy-game-root .aca-hero-info { flex: 1; min-width: 180px; text-align: left; }
#academy-game-root .aca-hero-name {
  font-size: 18px;
  font-weight: 900;
  color: #fff;
}
#academy-game-root .aca-hero-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--aca-yellow, #ffd400);
  margin-top: 2px;
}
#academy-game-root .aca-hero-chips {
  display: flex;
  gap: 8px;
  margin-top: 6px;
  flex-wrap: wrap;
}
#academy-game-root .aca-hero-chip {
  font-size: 12px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
}
#academy-game-root .aca-hero-chip-level {
  background: rgba(0, 229, 255, 0.15);
  border-color: rgba(0, 229, 255, 0.45);
  color: var(--aca-cyan, #00e5ff);
}
#academy-game-root .aca-hero-xpbar { margin-top: 8px; }
#academy-game-root .aca-hero-xpbar-track,
#academy-game-root .bdt-xp-carrot-track {
  height: 8px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.10);
  overflow: hidden;
}
#academy-game-root .aca-hero-xpbar-fill,
#academy-game-root .bdt-xp-carrot-fill {
  height: 100%;
  border-radius: 6px;
  background: linear-gradient(90deg, var(--aca-cyan, #00e5ff), var(--aca-purple, #a855f7));
  transition: width 0.6s ease;
}
#academy-game-root .aca-hero-xpbar-label,
#academy-game-root .bdt-xp-carrot-label {
  font-size: 11.5px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.75);
  margin-top: 4px;
}
#academy-game-root .aca-hero-daily {
  width: 100%;
  font-size: 13px;
  font-weight: 800;
  color: var(--aca-yellow, #ffd400);
  padding-top: 6px;
}

/* (M5) Grille aperçu (année pas choisie) */
#academy-game-root .aca-mode-card.aca-mode-preview {
  opacity: 0.75;
  cursor: default;
}

/* (M2) Badges NOUVEAU + Mode du jour */
#academy-game-root .aca-mode-card { position: relative; }
#academy-game-root .aca-mode-new-badge,
#academy-game-root .aca-mode-day-badge {
  position: absolute;
  top: -8px;
  right: -6px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.5px;
  padding: 3px 8px;
  border-radius: 12px;
  z-index: 2;
}
#academy-game-root .aca-mode-new-badge {
  background: linear-gradient(135deg, var(--aca-pink, #ff2d87), var(--aca-purple, #a855f7));
  color: #fff;
}
#academy-game-root .aca-mode-day-badge {
  background: linear-gradient(135deg, var(--aca-yellow, #ffd400), #ff9f1a);
  color: #14142b;
}
#academy-game-root .aca-mode-card.aca-mode-of-day {
  border-color: rgba(255, 212, 0, 0.55);
  box-shadow: 0 0 14px rgba(255, 212, 0, 0.18);
}

/* (M7) Micro-chips + micro-stats des cartes */
#academy-game-root .aca-mode-meta {
  font-size: 12px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.72);
}
#academy-game-root .aca-mode-stats {
  font-size: 11px;
  font-weight: 800;
  color: var(--aca-cyan, #00e5ff);
  min-height: 14px;
}
#academy-game-root .aca-mode-stats-new { color: var(--aca-yellow, #ffd400); }

/* (M3) Bannière événement cliquable */
#academy-game-root .aca-special-event-banner.aca-event-clickable { cursor: pointer; }
#academy-game-root .aca-special-event-banner.aca-event-clickable:hover {
  filter: brightness(1.12);
}
#academy-game-root .aca-event-cta {
  display: inline-block;
  margin-left: 6px;
  font-weight: 900;
  color: var(--aca-cyan, #00e5ff);
}

/* (E2) Footer récompenses commun (TTMC, Course, Snap) */
#academy-game-root .bdt-rewards-footer {
  margin: 16px auto 4px;
  padding: 14px 16px;
  max-width: 460px;
  border-radius: 14px;
  border: 2px solid rgba(255, 212, 0, 0.35);
  background: rgba(255, 212, 0, 0.06);
  text-align: center;
}
#academy-game-root .bdt-rewards-footer-label {
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--aca-yellow, #ffd400);
  margin-bottom: 8px;
}
#academy-game-root .bdt-rewards-footer-chips {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
}
#academy-game-root .bdt-reward-chip {
  font-size: 13px;
  font-weight: 900;
  padding: 6px 12px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
}
#academy-game-root .bdt-reward-chip.xp   { color: var(--aca-yellow, #ffd400); border-color: rgba(255, 212, 0, 0.5); }
#academy-game-root .bdt-reward-chip.gems { color: var(--aca-cyan, #00e5ff);  border-color: rgba(0, 229, 255, 0.5); }
#academy-game-root .bdt-reward-chip.bonus { color: var(--aca-green, #2ecc71); border-color: rgba(46, 204, 113, 0.5); }

/* (E5) Carotte XP */
#academy-game-root .bdt-xp-carrot { margin-top: 12px; }

/* (E4) Classement : ta ligne */
#academy-game-root .aca-lb-row.aca-lb-you {
  border: 2px solid var(--aca-cyan, #00e5ff);
  background: rgba(0, 229, 255, 0.08);
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.15);
}
#academy-game-root .aca-lb-notyou {
  margin: 12px auto 0;
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.7);
}

/* =========================================================================
   v3.96.0 — Mode démo (data-demo) + fix encadré H5P + bloc « me » classement.
   ========================================================================= */

/* ---- Mode démo : ruban haut + CTA d'inscription ---- */
.bdt-demo-ribbon {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2147483002; /* au-dessus du FAB Sortir (…000) et des overlays */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  padding: 8px 16px;
  background: linear-gradient(135deg, #ff2d87 0%, #a855f7 100%);
  color: #fff;
  font-weight: 800;
  font-size: 13px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}
.bdt-demo-ribbon-label { letter-spacing: 0.2px; }
.bdt-demo-ribbon-cta {
  background: #fff;
  color: #a4145f;
  padding: 5px 14px;
  border-radius: 20px;
  text-decoration: none;
  font-weight: 900;
  white-space: nowrap;
  transition: transform 0.15s ease;
}
.bdt-demo-ribbon-cta:hover { transform: scale(1.05); }

/* Le ruban pousse le contenu vers le bas (le root est full-bleed). */
#academy-game-root.bdt-demo-mode { padding-top: 44px; }
/* Sur la démo, le FAB « Sortir » n'a pas de site où retourner : on le masque
   (le CTA d'inscription est la seule sortie voulue). */
#bdt-demo-ribbon ~ #bdt-exit-fab { display: none; }

/* CTA d'inscription dans le menu (remplace Classement/Historique). */
#academy-game-root .aca-demo-cta { text-decoration: none; }

/* CTA d'inscription sous les récompenses (écran résultats). */
#academy-game-root .bdt-rewards-demo-cta {
  margin-top: 12px;
  text-align: center;
}
#academy-game-root .bdt-rewards-demo-text {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 8px;
}
#academy-game-root .bdt-rewards-demo-cta .bdt-btn { text-decoration: none; }

/* ---- Fix encadré H5P « Notions à revoir » : colonne d'actions ---- */
/* Combattre + Réviser regroupés dans la 3e cellule du grid (fini l'overlay
   absolute qui chevauchait le titre et la pastille Réviser). */
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-actions {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
  flex-shrink: 0;
}
/* Le bouton Combattre redevient un élément de flux (plus d'absolute). */
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-combat {
  position: static;
  top: auto;
  right: auto;
  text-align: center;
  white-space: nowrap;
}
/* Réviser : centré dans la colonne, largeur alignée sur Combattre. */
#academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-actions .bdt-h5p-recap-cta {
  text-align: center;
}
/* Petits écrans : la carte passe en pile verticale, actions en ligne. */
@media (max-width: 480px) {
  #academy-game-root .bdt-h5p-recap-card {
    grid-template-columns: auto 1fr;
    grid-template-areas: "icon body" "actions actions";
    row-gap: 10px;
  }
  #academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-icon  { grid-area: icon; }
  #academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-body  { grid-area: body; }
  #academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-actions {
    grid-area: actions;
    flex-direction: row;
    justify-content: flex-end;
  }
  #academy-game-root .bdt-h5p-recap-card .bdt-h5p-recap-title { white-space: normal; }
}

/* ---- Classement : bloc « ⭐ Toi — #23 » (hors du top) ---- */
#academy-game-root .aca-lb-me-block {
  margin: 12px auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 2px solid var(--aca-cyan, #00e5ff);
  background: rgba(0, 229, 255, 0.10);
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.15);
}
#academy-game-root .aca-lb-me-rank {
  font-weight: 900;
  color: var(--aca-cyan, #00e5ff);
  font-size: 15px;
}
#academy-game-root .aca-lb-me-gap {
  font-weight: 700;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.8);
}

/* ============================================================================
   2026-08-10 — Menu phase 1 : hiérarchie fonctionnelle et action persistante.
   Les cartes existantes sont regroupées sans masquer de mode et sans ajouter
   de dépendance visuelle. L'habillage illustré viendra dans une autre phase.
   ============================================================================ */

#academy-game-root .aca-mode-groups {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  width: 100%;
  max-width: 1140px;
}

#academy-game-root .aca-daily-reward-reveal {
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(255, 209, 102, 0.5);
  border-left: 4px solid #ffd166;
  background:
    linear-gradient(115deg, rgba(255, 209, 102, 0.12), transparent 58%),
    #0c1525;
  box-shadow: 5px 5px 0 rgba(0, 0, 0, 0.22);
}
#academy-game-root .aca-daily-reward-kicker {
  margin-bottom: 8px;
  color: #ffd166;
  font-size: 9px;
  font-weight: 1000;
  letter-spacing: 1.5px;
}
#academy-game-root .aca-daily-reward-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 7px;
}
#academy-game-root .aca-daily-reward-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  padding: 6px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
}
#academy-game-root .aca-daily-reward-card img,
#academy-game-root .aca-daily-reward-symbol {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(0, 229, 255, 0.48);
  object-fit: cover;
}
#academy-game-root .aca-daily-reward-symbol {
  display: grid;
  place-items: center;
  background: #131f35;
  color: #00e5ff;
  font-size: 11px;
  font-weight: 1000;
}
#academy-game-root .aca-daily-reward-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding-left: 8px;
}
#academy-game-root .aca-daily-reward-copy small {
  color: #00e5ff;
  font-size: 7px;
  font-weight: 1000;
  letter-spacing: 0.9px;
}
#academy-game-root .aca-daily-reward-copy strong {
  margin-top: 3px;
  overflow: hidden;
  color: #fff;
  font-size: 11px;
  line-height: 1.15;
  text-overflow: ellipsis;
}

#academy-game-root .aca-mode-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

#academy-game-root .aca-mode-group-label {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 2px;
  color: rgba(255, 255, 255, 0.72);
}

#academy-game-root .aca-mode-group-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(0, 210, 255, 0.35), transparent);
}

#academy-game-root .aca-modes--spotlight {
  grid-template-columns: 1fr;
  max-width: 880px;
}

#academy-game-root .aca-modes--arcade {
  max-width: 880px;
}

#academy-game-root .aca-modes--practice {
  max-width: 1140px;
}

#academy-game-root .aca-mode-card.aca-mode-spotlight {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  grid-template-rows: auto auto auto auto;
  column-gap: 20px;
  row-gap: 5px;
  align-items: center;
  width: 100%;
  min-height: 142px;
  padding: 20px 24px;
  border-color: rgba(245, 197, 24, 0.62);
  background:
    radial-gradient(circle at 12% 50%, rgba(245, 197, 24, 0.15), transparent 34%),
    linear-gradient(135deg, rgba(15, 52, 96, 0.92), rgba(26, 26, 46, 0.94));
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28), 0 0 24px rgba(245, 197, 24, 0.12);
  text-align: left;
}

#academy-game-root .aca-mode-card.aca-mode-spotlight:hover {
  transform: translateY(-2px);
  border-color: var(--bdt-energy);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32), 0 0 28px rgba(245, 197, 24, 0.22);
}

#academy-game-root .aca-mode-spotlight .aca-mode-icon {
  grid-column: 1;
  grid-row: 1 / 5;
  align-self: center;
  justify-self: center;
  font-size: 52px;
}

#academy-game-root .aca-mode-spotlight .aca-mode-icon-img {
  width: 92px;
  height: 92px;
}

#academy-game-root .aca-mode-spotlight .aca-mode-label,
#academy-game-root .aca-mode-spotlight .aca-mode-desc,
#academy-game-root .aca-mode-spotlight .aca-mode-meta,
#academy-game-root .aca-mode-spotlight .aca-mode-stats {
  grid-column: 2;
  text-align: left;
}

#academy-game-root .aca-mode-spotlight .aca-mode-label {
  font-size: 22px;
  line-height: 1.15;
}

#academy-game-root .aca-mode-spotlight .aca-mode-desc {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.84);
}

#academy-game-root .aca-mode-card.aca-mode-arcade {
  min-height: 178px;
}

#academy-game-root .aca-mode-card.aca-mode-practice {
  min-height: 154px;
  padding: 14px 10px;
}

#academy-game-root .aca-mode-card.aca-mode-practice .aca-mode-icon-img {
  height: 58px;
}

#academy-game-root .aca-mode-card.aca-mode-practice .aca-mode-icon-img img {
  max-width: 64px;
  max-height: 58px;
}

#academy-game-root .aca-menu-play-dock {
  position: sticky;
  top: 10px;
  z-index: 30;
  width: min(100%, 720px);
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(20, 20, 43, 0.88);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

#academy-game-root .aca-menu-play-dock .aca-play-btn {
  width: 100%;
  margin: 0;
}

#academy-game-root:has(.aca-menu-play-dock) {
  overflow: clip;
}

#academy-game-root button.aca-hero-daily {
  appearance: none;
  -webkit-appearance: none;
  padding: 8px 10px;
  border: 0;
  border-radius: 10px;
  background: rgba(245, 197, 24, 0.08);
  text-align: left;
  font-family: inherit;
  cursor: pointer;
}

#academy-game-root button.aca-hero-daily:hover,
#academy-game-root button.aca-hero-daily:focus-visible {
  background: rgba(245, 197, 24, 0.16);
  outline: 2px solid rgba(245, 197, 24, 0.48);
  outline-offset: 2px;
}

@media (min-width: 900px) {
  #academy-game-root .aca-modes--spotlight { grid-template-columns: 1fr; }
  #academy-game-root .aca-modes--arcade { grid-template-columns: repeat(4, 1fr); }
  #academy-game-root .aca-modes--practice { grid-template-columns: repeat(4, 1fr); }
}

@media (min-width: 1200px) {
  #academy-game-root .aca-modes--spotlight { grid-template-columns: 1fr; }
  #academy-game-root .aca-modes--arcade { grid-template-columns: repeat(4, 1fr); }
  #academy-game-root .aca-modes--practice { grid-template-columns: repeat(5, 1fr); }
}

@media (max-width: 640px) {
  #academy-game-root .aca-mode-groups { gap: 18px; }
  #academy-game-root .aca-mode-group-label { font-size: 11px; letter-spacing: 1.3px; }
  #academy-game-root .aca-mode-card.aca-mode-spotlight {
    grid-template-columns: 62px minmax(0, 1fr);
    column-gap: 12px;
    min-height: 122px;
    padding: 16px 14px;
  }
  #academy-game-root .aca-mode-spotlight .aca-mode-icon { font-size: 42px; }
  #academy-game-root .aca-mode-spotlight .aca-mode-icon-img { width: 62px; height: 66px; }
  #academy-game-root .aca-mode-spotlight .aca-mode-icon-img img { max-width: 62px; max-height: 66px; }
  #academy-game-root .aca-mode-spotlight .aca-mode-label { font-size: 18px; }
  #academy-game-root .aca-mode-spotlight .aca-mode-desc { font-size: 12px; }
  #academy-game-root .aca-mode-card.aca-mode-arcade { min-height: 162px; }
  #academy-game-root .aca-mode-card.aca-mode-practice { min-height: 142px; }
  #academy-game-root .aca-menu-play-dock {
    top: 6px;
    bottom: auto;
    width: 100%;
    padding: 6px;
  }
  #academy-game-root .aca-menu-play-dock .aca-play-btn {
    padding: 13px 16px;
    font-size: 15px;
  }
}

/* ============================================================================
   v3.98.0 — Démo accueil : variante COMPACTE + Défi de la semaine public.
   Verrouillé sous [data-demo-compact] ou .aca-defisem-* : zéro impact sur
   l'Arène plein écran connectée.
   ============================================================================ */

/* (a) Casse plein écran + full-bleed : le root redevient une carte bornée */
#academy-game-root[data-demo-compact] {
  min-height: 0; height: clamp(460px, 68vh, 640px); max-height: 640px;
  width: 100%; max-width: 100%; margin-left: 0; margin-right: 0;
  overflow-y: auto; overflow-x: hidden;
  justify-content: flex-start; padding-top: 12px;
  border-radius: 20px; contain: layout paint; -webkit-overflow-scrolling: touch;
}
#academy-game-root[data-demo-compact] * { max-width: 100%; }

/* (b) Ruban démo intégré au bloc (rapatrié dans le root par le JS) */
#academy-game-root[data-demo-compact] .bdt-demo-ribbon {
  position: static; z-index: 1; border-radius: 20px 20px 0 0; margin: -12px -16px 8px;
}

/* (c) FAB aide masqué en compact (le JS le skippe déjà) */
body.aca-arene-compact .bdt-help-fab { display: none; }

/* (d) Overlays plein écran internes bornés au bloc (root est position:relative) */
#academy-game-root[data-demo-compact] .bdt-results,
#academy-game-root[data-demo-compact] .bdt-confetti-container,
#academy-game-root[data-demo-compact] .bdt-countdown-overlay,
#academy-game-root[data-demo-compact] .bdt-fight-intro,
#academy-game-root[data-demo-compact] .bdt-course-countdown-overlay,
#academy-game-root[data-demo-compact] .ttmc-prison-banner-overlay,
#academy-game-root[data-demo-compact] .snap-qflash-overlay {
  position: absolute;
}

/* (e) Menu densifié à l'entrée */
#academy-game-root[data-demo-compact] .aca-menu { gap: 12px; padding: 6px 0; }
#academy-game-root[data-demo-compact] .aca-logo-big { width: 44px; height: 44px; }
#academy-game-root[data-demo-compact] .aca-menu-title { font-size: 19px; letter-spacing: 2px; }
#academy-game-root[data-demo-compact] .aca-modes { grid-template-columns: 1fr 1fr; max-width: 420px; gap: 10px; }
#academy-game-root[data-demo-compact] .aca-modes--spotlight { grid-template-columns: 1fr; }
#academy-game-root[data-demo-compact] .aca-menu-play-dock {
  position: sticky;
  left: auto;
  top: auto;
  bottom: 6px;
  transform: none;
  width: 100%;
}

/* (f) Carte « Défi de la semaine » (menu). Scopé #academy-game-root pour BATTRE
   le reset conteneur `#academy-game-root * { margin:0;padding:0 }` (spécificité 1,0,0). */
#academy-game-root .aca-defisem-card {
  background: linear-gradient(135deg, rgba(255, 45, 135, 0.14), rgba(0, 229, 255, 0.12));
  border: 1px solid rgba(255, 45, 135, 0.5); border-radius: 16px;
  padding: 14px 16px; margin: 4px auto 8px; max-width: 420px; width: 100%;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
}
#academy-game-root .aca-defisem-badge { font-size: 12px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; color: var(--aca-pink, #ff2d87); }
#academy-game-root .aca-defisem-subject { font-size: 18px; font-weight: 800; margin-top: 2px; }
#academy-game-root .aca-defisem-goal { font-size: 15px; margin-top: 2px; }
#academy-game-root .aca-defisem-best { font-size: 13px; margin-top: 6px; color: var(--aca-yellow, #ffd400); font-weight: 700; }
#academy-game-root .aca-defisem-hint { font-size: 12px; margin-top: 6px; opacity: 0.75; }

/* (g) Barre d'issue post-partie (rewards footer). Scopé #academy-game-root (idem). */
#academy-game-root .aca-defisem-outcome { margin: 10px 0 6px; }
#academy-game-root .aca-defisem-outcome-label { font-size: 13px; font-weight: 800; margin-bottom: 4px; }
#academy-game-root .aca-defisem-progress { height: 10px; border-radius: 6px; background: rgba(255, 255, 255, 0.18); overflow: hidden; }
#academy-game-root .aca-defisem-progress-fill { height: 100%; width: 4%; border-radius: 6px; background: linear-gradient(90deg, var(--aca-pink, #ff2d87), var(--aca-cyan, #00e5ff)); transition: width 0.4s ease; }
#academy-game-root .aca-defisem-progress-label { font-size: 12px; margin-top: 4px; font-weight: 700; }

/* (h) Motion : anims non couvertes par les blocs existants */
@media (prefers-reduced-motion: reduce) {
  #academy-game-root[data-demo-compact] .aca-menu-title { animation: none; }
  #academy-game-root[data-demo-compact] .aca-menu { animation: none; }
  #academy-game-root .aca-defisem-progress-fill { transition: none; }
}

/* =========================================================================
   Vague 3 (lentille mouvement) : filet GLOBAL prefers-reduced-motion.

   Les blocs cibles plus haut ne couvrent qu une vingtaine de selecteurs sur
   pres de 100 @keyframes. Ici on neutralise tout le reste (halos qui pulsent
   en boucle, shimmers de cartes, sweeps d intro, confettis, transitions) pour
   les enfants sensibles au mouvement.

   Portee : #academy-game-root plus les 4 overlays que le JS monte directement
   dans document.body (aide, confirmation, banniere prison TTMC, compte a
   rebours de la Course), qui echappent donc au scope du root.

   Les animations PORTEUSES D INFORMATION sont re-autorisees plus bas. Elles
   sont montees puis demontees par un setTimeout JS : ramener leur duree a
   zero les rendrait invisibles et ferait perdre le message a l enfant
   (compte a rebours, revelation de zone, feedback de reponse, gain de points,
   bulle du coup de pouce). Elles sont re-declarees a l identique ; leur
   specificite (id + classe, ou 2 classes) passe devant le filet universel.
   ========================================================================= */
@media (prefers-reduced-motion: reduce) {

  /* 1) ANIMATIONS */
  #academy-game-root,
  #academy-game-root *,
  #academy-game-root *::before,
  #academy-game-root *::after,
  .bdt-exit-fab,
  .bdt-help-modal-overlay,
  .bdt-help-modal-overlay *,
  .bdt-confirm-overlay,
  .bdt-confirm-overlay *,
  .ttmc-prison-banner-overlay,
  .ttmc-prison-banner-overlay *,
  .bdt-course-countdown-overlay,
  .bdt-course-countdown-overlay * {
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }

  /* 2) TRANSITIONS, avec une exclusion : #bdt-timer-bar, la barre de temps
     de la Bataille des Tables. Sa duree n est PAS dans cette feuille, elle
     est posee en style inline par le JS a chaque question
     (bar.style.transition = 'transform ' + seconds + 's linear'). Un
     !important auteur battant un style inline non-important, la barre se
     viderait d un coup des l affichage de la question. Or c est le SEUL
     indicateur du temps restant : il n y a aucun compte a rebours chiffre a
     l ecran, l intervalle JS ne fait que poser les classes warning/danger.
     L enfant croirait son temps ecoule alors que le chrono tourne encore.
     Mouvement essentiel a la comprehension, donc conserve. */
  #academy-game-root,
  #academy-game-root *:not(#bdt-timer-bar),
  #academy-game-root *::before,
  #academy-game-root *::after,
  .bdt-exit-fab,
  .bdt-help-modal-overlay,
  .bdt-help-modal-overlay *,
  .bdt-confirm-overlay,
  .bdt-confirm-overlay *,
  .ttmc-prison-banner-overlay,
  .ttmc-prison-banner-overlay *,
  .bdt-course-countdown-overlay,
  .bdt-course-countdown-overlay * {
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }

  /* Exception : compte a rebours 3-2-1 de la Bataille des Tables.
     countdownPop finit a opacity 0 avec forwards ; a 0.01ms le chiffre
     n apparaitrait jamais. */
  #academy-game-root .bdt-countdown-number {
    animation: countdownPop 0.8s ease forwards !important;
  }

  /* Exception : compte a rebours 3-2-1-GO de la Course Academique. */
  .bdt-course-countdown-overlay .bdt-course-countdown-num {
    animation: bdtCountPulse 1s cubic-bezier(0.2, 0.7, 0.2, 1) !important;
  }

  /* Exception : feedback de reponse (BRAVO / RATE). L element reste monte,
     c est le fadeOut qui le fait disparaitre. */
  #academy-game-root .bdt-feedback-text {
    animation: popIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), fadeOut 0.8s 0.5s ease forwards !important;
  }

  /* Exception : points qui montent (+XP). */
  #academy-game-root .bdt-float-text {
    animation: floatUp 1.2s ease forwards !important;
  }

  /* Exception : delta de score TTMC. */
  #academy-game-root .ttmc-delta-float {
    animation: ttmcDeltaFloat 1.4s ease-out forwards !important;
  }

  /* Exception : bulle du coup de pouce (retiree par setTimeout 2400 ms). */
  #academy-game-root .bdt-fifty-fifty-hint {
    animation: bdt-fifty-fifty-pop 2.4s ease forwards !important;
  }

  /* Exception : revelation de zone dans 1,2,3 Co!. */
  #academy-game-root .snap-line-just-revealed {
    animation: snapZoneFlip 0.8s ease !important;
  }
}

/* ============================================================================
   2026-08-10 - Console de combat en une seule vue.
   Le menu historique reste disponible avec data-menu-layout="legacy".
   ============================================================================ */

#academy-game-root:has(.aca-command-menu) {
  --cmd-ink: #09111f;
  --cmd-panel: #111c30;
  --cmd-panel-2: #17243a;
  --cmd-line: #2c3d59;
  --cmd-red: #ff4d62;
  --cmd-cyan: #32d8ed;
  --cmd-gold: #ffd166;
  justify-content: center;
  overflow: hidden;
  padding: 12px;
  background:
    linear-gradient(rgba(50, 216, 237, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(50, 216, 237, 0.045) 1px, transparent 1px),
    #07101d;
  background-size: 34px 34px;
}

#academy-game-root .aca-command-menu {
  position: relative;
  display: grid;
  align-items: stretch;
  grid-template-rows: 68px minmax(0, 1fr) 46px;
  gap: 10px;
  width: min(1180px, 100%);
  height: min(760px, calc(100dvh - 24px));
  min-height: 590px;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0;
  overflow: visible;
  color: #f6f9ff;
  animation: none;
}

#academy-game-root .aca-command-topbar,
#academy-game-root .aca-command-nav {
  border: 1px solid var(--cmd-line);
  background: var(--cmd-ink);
}

#academy-game-root .aca-command-topbar {
  position: relative;
  z-index: 40;
  display: grid;
  grid-template-columns: minmax(190px, 1fr) auto minmax(190px, 1fr);
  align-items: center;
  min-width: 0;
  padding: 8px 10px 8px 14px;
  border-left: 4px solid var(--cmd-red);
  box-shadow: 7px 7px 0 rgba(0, 0, 0, 0.23);
}

#academy-game-root .aca-command-brand,
#academy-game-root .aca-command-identity,
#academy-game-root .aca-command-controls,
#academy-game-root .aca-command-nav,
#academy-game-root .aca-command-tabs,
#academy-game-root .aca-command-board-head {
  display: flex;
  align-items: center;
}

#academy-game-root .aca-command-brand { gap: 9px; }
#academy-game-root .aca-command-logo { width: 40px; height: 40px; flex: 0 0 auto; }
#academy-game-root .aca-command-logo svg { width: 100%; height: 100%; }
#academy-game-root .aca-command-brand-copy,
#academy-game-root .aca-command-identity-copy,
#academy-game-root .aca-command-board-title { display: flex; flex-direction: column; min-width: 0; }
#academy-game-root .aca-command-brand-copy strong { color: #fff; font-size: 18px; font-weight: 1000; line-height: 1; letter-spacing: 2px; }
#academy-game-root .aca-command-brand-copy span { margin-top: 4px; color: var(--cmd-cyan); font-size: 9px; font-weight: 900; letter-spacing: 1.7px; }

#academy-game-root .aca-command-identity { justify-self: center; gap: 9px; min-width: 0; max-width: 390px; }
#academy-game-root .aca-command-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 2px solid var(--cmd-gold);
  border-radius: 8px;
  background: var(--cmd-panel-2);
  color: var(--cmd-gold);
  font-size: 19px;
  font-weight: 1000;
  transform: skew(-4deg);
}
#academy-game-root .aca-command-avatar img { width: 100%; height: 100%; object-fit: cover; }
#academy-game-root .aca-command-identity-copy strong,
#academy-game-root .aca-command-identity-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#academy-game-root .aca-command-identity-copy strong { color: #fff; font-size: 14px; font-weight: 900; line-height: 1.1; }
#academy-game-root .aca-command-identity-copy span { margin-top: 4px; color: #aebbd0; font-size: 11px; font-weight: 700; }
#academy-game-root .aca-command-rank { padding: 4px 7px; border: 1px solid rgba(255, 209, 102, 0.55); color: var(--cmd-gold); font-size: 10px; font-weight: 1000; }

#academy-game-root .aca-command-controls { justify-self: end; gap: 7px; }
#academy-game-root button.aca-command-control {
  min-height: 42px;
  margin: 0;
  padding: 7px 11px;
  border: 1px solid var(--cmd-line);
  border-radius: 6px;
  background: var(--cmd-panel);
  box-shadow: none;
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transform: none;
}
#academy-game-root button.aca-command-control:hover,
#academy-game-root button.aca-command-control:focus-visible { border-color: var(--cmd-cyan); background: #1a2940; outline: 2px solid rgba(50, 216, 237, 0.35); outline-offset: 2px; transform: none; }
#academy-game-root .aca-command-level-control { display: flex; flex-direction: column; align-items: flex-start; }
#academy-game-root .aca-command-level-control small { margin-top: 5px; color: var(--cmd-cyan); font-size: 8px; font-weight: 900; letter-spacing: 0.8px; }
#academy-game-root button.aca-command-icon-control { width: 42px; padding: 0; font-size: 17px; }

#academy-game-root .aca-command-level-panel {
  position: absolute;
  z-index: 80;
  top: calc(100% + 8px);
  right: 0;
  width: min(520px, calc(100vw - 24px));
  padding: 14px;
  border: 1px solid var(--cmd-cyan);
  border-top: 4px solid var(--cmd-cyan);
  background: #0c1727;
  box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.32);
}
#academy-game-root .aca-command-level-panel[hidden] { display: none; }
#academy-game-root .aca-command-level-title { margin-bottom: 9px; color: #fff; font-size: 11px; font-weight: 1000; letter-spacing: 1.4px; }
#academy-game-root .aca-command-level-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
#academy-game-root button.aca-command-level-choice,
#academy-game-root button.aca-command-level-home {
  min-height: 38px;
  margin: 0;
  border: 1px solid var(--cmd-line);
  border-radius: 5px;
  background: var(--cmd-panel);
  box-shadow: none;
  color: #dfe8f7;
  font-family: inherit;
  font-weight: 900;
  cursor: pointer;
  transform: none;
}
#academy-game-root button.aca-command-level-choice:hover,
#academy-game-root button.aca-command-level-choice:focus-visible,
#academy-game-root button.aca-command-level-home:hover,
#academy-game-root button.aca-command-level-home:focus-visible { border-color: var(--cmd-cyan); outline: 2px solid rgba(50, 216, 237, 0.28); outline-offset: 1px; transform: none; }
#academy-game-root button.aca-command-level-choice.selected { border-color: var(--cmd-red); background: var(--cmd-red); color: #fff; }
#academy-game-root button.aca-command-level-choice.home:not(.selected) { color: var(--cmd-gold); }
#academy-game-root button.aca-command-level-choice.locked { opacity: 0.38; cursor: not-allowed; }
#academy-game-root button.aca-command-level-home { width: 100%; margin-top: 9px; color: var(--cmd-cyan); }

#academy-game-root .aca-command-main { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.72fr); gap: 10px; min-width: 0; min-height: 0; }
#academy-game-root .aca-command-stage { display: grid; grid-template-rows: minmax(168px, 0.88fr) minmax(250px, 1.12fr); gap: 10px; min-width: 0; min-height: 0; }

#academy-game-root .aca-command-selected {
  position: relative;
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) auto;
  grid-template-rows: 30px minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--cmd-line);
  border-left: 5px solid var(--cmd-red);
  background: var(--cmd-panel);
  box-shadow: 7px 7px 0 rgba(0, 0, 0, 0.22);
}
#academy-game-root .aca-command-selected::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 34%; background: var(--cmd-red); clip-path: polygon(0 0, 100% 0, 72% 100%, 0 100%); opacity: 0.93; }
#academy-game-root .aca-command-selected::after { content: 'VS'; position: absolute; top: 50%; left: 31%; color: rgba(255, 255, 255, 0.16); font-size: 68px; font-weight: 1000; font-style: italic; line-height: 1; transform: translate(-50%, -48%) rotate(-8deg); }
#academy-game-root .aca-command-selected-kicker { position: relative; z-index: 2; grid-column: 1 / -1; align-self: stretch; padding: 8px 12px 6px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: var(--cmd-gold); font-size: 9px; font-weight: 1000; letter-spacing: 1.4px; }
#academy-game-root .aca-command-selected-art { position: relative; z-index: 3; display: grid; grid-column: 1; grid-row: 2; place-items: center; width: 118px; height: 118px; justify-self: center; color: #fff; font-size: 62px; filter: drop-shadow(0 8px 0 rgba(0, 0, 0, 0.24)); }
#academy-game-root .aca-command-selected-art img { max-width: 100%; max-height: 100%; }
#academy-game-root .aca-command-selected-copy { position: relative; z-index: 3; grid-column: 2; grid-row: 2; min-width: 0; padding: 10px 18px 10px 8px; text-align: left; }
#academy-game-root .aca-command-selected-copy h1 { margin: 0; color: #fff; font-size: clamp(24px, 2.6vw, 38px); font-weight: 1000; line-height: 0.98; letter-spacing: -0.7px; text-transform: uppercase; }
#academy-game-root .aca-command-selected-copy p { display: -webkit-box; margin: 8px 0 0; overflow: hidden; color: #bdc9da; font-size: 12px; font-weight: 650; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#academy-game-root .aca-command-selected-meta { display: inline-block; margin-top: 8px; color: var(--cmd-cyan); font-size: 9px; font-weight: 1000; text-transform: uppercase; }
#academy-game-root button.aca-command-fight-btn {
  position: relative;
  z-index: 4;
  grid-column: 3;
  grid-row: 2;
  align-self: end;
  min-width: 145px;
  min-height: 48px;
  margin: 0 14px 14px 0;
  padding: 11px 15px;
  border: 0;
  border-radius: 4px;
  background: var(--cmd-gold);
  box-shadow: 5px 5px 0 #9c6422;
  color: #161006;
  font-family: inherit;
  font-size: 13px;
  font-weight: 1000;
  cursor: pointer;
  transform: skew(-5deg);
}
#academy-game-root button.aca-command-fight-btn:hover,
#academy-game-root button.aca-command-fight-btn:focus-visible { background: #ffe29a; outline: 3px solid rgba(255, 209, 102, 0.38); outline-offset: 2px; transform: skew(-5deg) translateY(-2px); }
#academy-game-root button.aca-command-fight-btn:disabled { opacity: 0.42; cursor: not-allowed; }

#academy-game-root .aca-command-roster,
#academy-game-root .aca-command-board { min-width: 0; min-height: 0; border: 1px solid var(--cmd-line); background: var(--cmd-panel); }
#academy-game-root .aca-command-roster { display: grid; grid-template-rows: 40px minmax(0, 1fr); padding: 9px; }
#academy-game-root .aca-command-roster-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
#academy-game-root .aca-command-section-title { color: #dfe8f7; font-size: 10px; font-weight: 1000; letter-spacing: 1.1px; white-space: nowrap; }
#academy-game-root .aca-command-tabs { gap: 4px; }
#academy-game-root button.aca-command-tab { min-height: 29px; margin: 0; padding: 5px 10px; border: 1px solid var(--cmd-line); border-radius: 4px; background: transparent; box-shadow: none; color: #8fa0b9; font-family: inherit; font-size: 9px; font-weight: 1000; cursor: pointer; transform: none; }
#academy-game-root button.aca-command-tab:hover,
#academy-game-root button.aca-command-tab:focus-visible { border-color: var(--cmd-cyan); color: #fff; transform: none; }
#academy-game-root button.aca-command-tab.active { border-color: var(--cmd-cyan); background: var(--cmd-cyan); color: #07101d; }

#academy-game-root .aca-command-roster-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(74px, 88px); align-content: start; gap: 7px; min-width: 0; min-height: 0; }
#academy-game-root button.aca-command-mode { position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; min-width: 0; min-height: 0; margin: 0; padding: 7px; overflow: hidden; border: 1px solid var(--cmd-line); border-radius: 6px; background: var(--cmd-panel-2); box-shadow: none; color: #f5f8ff; font-family: inherit; text-align: left; cursor: pointer; transform: none; }
#academy-game-root button.aca-command-mode:hover,
#academy-game-root button.aca-command-mode:focus-visible { border-color: var(--cmd-cyan); background: #1c2c46; outline: 2px solid rgba(50, 216, 237, 0.26); outline-offset: 1px; transform: none; }
#academy-game-root button.aca-command-mode.selected { border: 2px solid var(--cmd-gold); background: #222e3f; box-shadow: inset 4px 0 0 var(--cmd-red); }
#academy-game-root .aca-command-mode-art { display: grid; place-items: center; width: 38px; height: 38px; color: #fff; font-size: 25px; }
#academy-game-root .aca-command-mode-art img { max-width: 100%; max-height: 100%; }
#academy-game-root .aca-command-mode > span { display: -webkit-box; min-width: 0; overflow: hidden; font-size: 10px; font-weight: 900; line-height: 1.15; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#academy-game-root .aca-command-mode > b { position: absolute; top: 3px; right: 4px; color: var(--cmd-gold); font-size: 8px; font-weight: 1000; }

#academy-game-root .aca-command-board { display: grid; grid-template-rows: 68px minmax(0, 1fr) auto; padding: 10px; border-top: 4px solid var(--cmd-cyan); box-shadow: 7px 7px 0 rgba(0, 0, 0, 0.22); }
#academy-game-root .aca-command-board-head { justify-content: space-between; gap: 8px; }
#academy-game-root .aca-command-board-title small { color: var(--cmd-cyan); font-size: 9px; font-weight: 1000; letter-spacing: 1.6px; }
#academy-game-root .aca-command-board-title strong { margin-top: 6px; color: #fff; font-size: 15px; font-weight: 1000; line-height: 1.05; }
#academy-game-root .aca-command-bonus { padding: 5px 7px; border: 1px solid rgba(255, 209, 102, 0.62); color: var(--cmd-gold); font-size: 8px; font-weight: 1000; white-space: nowrap; }
#academy-game-root .aca-command-missions { display: grid; grid-template-rows: repeat(3, minmax(78px, 100px)); align-content: start; gap: 7px; min-height: 0; }
#academy-game-root button.aca-command-mission { display: grid; grid-template-columns: 34px minmax(0, 1fr) 42px 18px; align-items: center; min-width: 0; min-height: 0; margin: 0; padding: 7px; overflow: hidden; border: 1px solid var(--cmd-line); border-radius: 6px; background: #0d1727; box-shadow: none; color: #fff; font-family: inherit; text-align: left; cursor: pointer; transform: none; }
#academy-game-root button.aca-command-mission:hover,
#academy-game-root button.aca-command-mission:focus-visible { border-color: var(--cmd-gold); background: #16243a; outline: 2px solid rgba(255, 209, 102, 0.25); outline-offset: 1px; transform: none; }
#academy-game-root button.aca-command-mission.active { border-color: var(--cmd-red); }
#academy-game-root button.aca-command-mission.complete { border-color: #44d39c; }
#academy-game-root .aca-command-mission-index { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--cmd-line); background: var(--cmd-panel-2); color: var(--cmd-gold); font-size: 10px; font-weight: 1000; transform: skew(-5deg); }
#academy-game-root .aca-command-mission.complete .aca-command-mission-index { color: #44d39c; }
#academy-game-root .aca-command-mission-copy { display: flex; flex-direction: column; min-width: 0; }
#academy-game-root .aca-command-mission-copy small { color: var(--cmd-cyan); font-size: 8px; font-weight: 1000; letter-spacing: 0.9px; }
#academy-game-root .aca-command-mission-copy strong { display: -webkit-box; margin-top: 3px; overflow: hidden; color: #f7f9ff; font-size: 11px; font-weight: 900; line-height: 1.15; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#academy-game-root .aca-command-mission-copy em { overflow: hidden; margin-top: 3px; color: #8899b2; font-size: 8px; font-style: normal; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
#academy-game-root .aca-command-mission-reward { position: relative; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(0,229,255,.35); background: #131f35; overflow: visible; }
#academy-game-root .aca-command-mission-reward img { width: 100%; height: 100%; object-fit: cover; }
#academy-game-root .aca-command-mission-reward b { color: var(--cmd-gold); font-size: 9px; font-weight: 1000; letter-spacing: -.3px; }
#academy-game-root .aca-command-mission-reward i { position: absolute; right: -3px; bottom: -3px; padding: 1px 3px; background: var(--cmd-red); color: #fff; font-size: 5px; font-style: normal; font-weight: 1000; letter-spacing: .25px; }
#academy-game-root .aca-command-mission.complete .aca-command-mission-reward { border-color: #44d39c; filter: saturate(.7); }
#academy-game-root .aca-command-mission-go { color: var(--cmd-red); font-size: 21px; font-weight: 1000; text-align: right; }
#academy-game-root .aca-command-mission-progress { position: relative; display: block; height: 5px; margin-top: 5px; background: #25334a; }
#academy-game-root .aca-command-mission-progress i { display: block; height: 100%; background: var(--cmd-cyan); }
#academy-game-root .aca-command-mission-progress b { position: absolute; right: 0; bottom: 5px; color: #aebbd0; font-size: 7px; }
#academy-game-root .aca-command-board-note { padding-top: 8px; color: #71839d; font-size: 8px; font-weight: 700; text-align: center; }

#academy-game-root .aca-command-nav { justify-content: flex-start; gap: 6px; min-width: 0; padding: 6px; border-right: 4px solid var(--cmd-cyan); }
#academy-game-root button.aca-command-nav-btn { position: relative; min-height: 32px; margin: 0; padding: 5px 11px; border: 1px solid transparent; border-radius: 4px; background: transparent; box-shadow: none; color: #aebbd0; font-family: inherit; font-size: 10px; font-weight: 850; cursor: pointer; transform: none; }
#academy-game-root button.aca-command-nav-btn:hover,
#academy-game-root button.aca-command-nav-btn:focus-visible { border-color: var(--cmd-line); color: #fff; transform: none; }
#academy-game-root .aca-command-nav-count { position: absolute; top: -3px; right: -3px; display: grid; place-items: center; min-width: 16px; height: 16px; border-radius: 50%; background: var(--cmd-red); color: #fff; font-size: 8px; }
#academy-game-root .aca-command-nav-status { margin-left: auto; padding-right: 8px; color: #71839d; font-size: 9px; font-weight: 800; }
body:has(#academy-game-root .aca-command-menu) .bdt-help-fab { bottom: 66px; }

/* Le versus garde les avatars, titres et phrases au premier plan. */
#academy-game-root .bdt-fight-lobby .bdt-vs-row { position: relative; gap: 12px; width: min(900px, 100%); }
#academy-game-root .bdt-fight-lobby .bdt-vs-row::before { content: ''; position: absolute; inset: 8% 50%; width: 2px; background: var(--bdt-energy, #f5c518); transform: skew(-10deg); }
#academy-game-root .bdt-fighter-card { position: relative; flex: 1 1 0; min-width: 0; border: 2px solid rgba(255, 255, 255, 0.16); border-radius: 8px; background: #111c30; box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.28); }
#academy-game-root .bdt-fighter-card.is-user { border-left: 6px solid #32d8ed; }
#academy-game-root .bdt-fighter-card.is-opponent { border-right: 6px solid #ff4d62; }
#academy-game-root .bdt-fighter-side { align-self: flex-start; padding: 4px 8px; background: #32d8ed; color: #07101d; font-size: 9px; font-weight: 1000; letter-spacing: 1px; }
#academy-game-root .bdt-fighter-card.is-opponent .bdt-fighter-side { align-self: flex-end; background: #ff4d62; color: #fff; }
#academy-game-root .bdt-player-quote { max-width: 250px; margin: 7px auto 0; color: rgba(255, 255, 255, 0.78); font-size: 11px; font-style: italic; font-weight: 700; line-height: 1.25; }

@media (max-height: 720px) and (min-width: 701px) {
  #academy-game-root .aca-command-menu { grid-template-rows: 62px minmax(0, 1fr) 42px; gap: 7px; min-height: 0; }
  #academy-game-root .aca-command-main,
  #academy-game-root .aca-command-stage { gap: 7px; }
  #academy-game-root .aca-command-stage { grid-template-rows: minmax(150px, 0.78fr) minmax(225px, 1.22fr); }
  #academy-game-root .aca-command-selected-art { width: 96px; height: 96px; }
  #academy-game-root .aca-command-selected-copy h1 { font-size: clamp(22px, 2.3vw, 31px); }
  #academy-game-root .aca-command-roster-grid { grid-auto-rows: minmax(66px, 82px); }
  #academy-game-root .aca-command-board { grid-template-rows: 56px minmax(0, 1fr) auto; }
}

@media (max-width: 700px) {
  #academy-game-root:has(.aca-command-menu) { padding: 6px; }
  #academy-game-root .aca-command-menu { grid-template-rows: 56px minmax(0, 1fr) 40px; gap: 6px; width: 100%; height: min(760px, calc(100dvh - 12px)); min-height: 0; }
  #academy-game-root .aca-command-topbar { grid-template-columns: minmax(104px, 1fr) auto; padding: 5px 6px 5px 9px; border-left-width: 3px; box-shadow: none; }
  #academy-game-root .aca-command-logo { width: 30px; height: 30px; }
  #academy-game-root .aca-command-brand { gap: 6px; }
  #academy-game-root .aca-command-brand-copy strong { font-size: 13px; }
  #academy-game-root .aca-command-brand-copy span { font-size: 6px; letter-spacing: 0.8px; }
  #academy-game-root .aca-command-identity { display: none; }
  #academy-game-root button.aca-command-control { min-height: 38px; padding: 5px 8px; font-size: 11px; }
  #academy-game-root .aca-command-level-control small { font-size: 6px; }
  #academy-game-root button.aca-command-icon-control { width: 38px; font-size: 15px; }
  #academy-game-root .aca-command-level-panel { position: fixed; top: 66px; right: 6px; width: calc(100vw - 12px); }
  #academy-game-root .aca-command-level-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  #academy-game-root .aca-command-main { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1.55fr) minmax(185px, 1fr); gap: 6px; }
  #academy-game-root .aca-command-stage { grid-template-rows: minmax(118px, 1fr) minmax(150px, 174px); gap: 6px; }
  #academy-game-root .aca-command-selected { grid-template-columns: 80px minmax(0, 1fr) 105px; grid-template-rows: 23px minmax(0, 1fr); border-left-width: 3px; box-shadow: none; }
  #academy-game-root .aca-command-selected::after { left: 28%; font-size: 45px; }
  #academy-game-root .aca-command-selected-kicker { padding: 5px 8px; font-size: 7px; }
  #academy-game-root .aca-command-selected-art { width: 64px; height: 64px; font-size: 40px; }
  #academy-game-root .aca-command-selected-copy { padding: 6px; }
  #academy-game-root .aca-command-selected-copy h1 { font-size: clamp(16px, 5.3vw, 23px); }
  #academy-game-root .aca-command-selected-copy p { margin-top: 4px; font-size: 9px; -webkit-line-clamp: 2; }
  #academy-game-root .aca-command-selected-meta { display: none; }
  #academy-game-root button.aca-command-fight-btn { min-width: 0; min-height: 38px; margin: 0 8px 8px 0; padding: 7px 8px; box-shadow: 3px 3px 0 #9c6422; font-size: 9px; }
  #academy-game-root .aca-command-roster { grid-template-rows: 34px minmax(0, 1fr); padding: 6px; }
  #academy-game-root .aca-command-section-title { font-size: 8px; }
  #academy-game-root button.aca-command-tab { min-height: 25px; padding: 4px 7px; font-size: 7px; }
  /* 3 terrains par rangee au lieu de 4, ajoute le 2026-08-23. A 4 colonnes,
     un nom de matiere recevait 32px pour 39 a 50px requis, et l'enfant lisait
     « Problem », « Orthogr », « Conjuga ». Mesure a 375x812 : 5 textes tronques
     avant, ZERO apres, et la grille garde exactement la meme hauteur (2 rangees
     de 58px dans les deux cas), donc rien ne descend plus bas. */
  #academy-game-root .aca-command-roster-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; grid-auto-rows: minmax(52px, 58px); }
  #academy-game-root button.aca-command-mode { grid-template-columns: 28px minmax(0, 1fr); padding: 4px; border-radius: 4px; }
  #academy-game-root .aca-command-mode-art { width: 26px; height: 26px; font-size: 18px; }
  #academy-game-root .aca-command-mode > span { font-size: 7px; line-height: 1.05; }
  #academy-game-root .aca-command-mode > b { font-size: 6px; }
  #academy-game-root .aca-command-board { grid-template-rows: 34px minmax(0, 1fr); padding: 5px; border-top-width: 3px; box-shadow: none; }
  #academy-game-root .aca-command-board-title { flex-direction: row; align-items: baseline; gap: 7px; }
  #academy-game-root .aca-command-board-title small { font-size: 7px; }
  #academy-game-root .aca-command-board-title strong { margin: 0; font-size: 10px; }
  #academy-game-root .aca-command-bonus { padding: 3px 5px; font-size: 6px; }
  #academy-game-root .aca-command-missions { grid-template-columns: 1fr; grid-template-rows: repeat(3, minmax(48px, 54px)); align-content: start; gap: 4px; }
  #academy-game-root button.aca-command-mission { grid-template-columns: 24px minmax(0, 1fr) 30px 10px; padding: 4px 5px; }
  #academy-game-root .aca-command-mission-index { width: 20px; height: 20px; font-size: 7px; }
  #academy-game-root .aca-command-mission-reward { width: 28px; height: 28px; }
  #academy-game-root .aca-command-mission-reward i { right: -2px; bottom: -2px; font-size: 4px; }
  #academy-game-root .aca-command-mission-copy small { font-size: 6.5px; }
  #academy-game-root .aca-command-mission-copy strong { margin-top: 1px; font-size: 8.5px; line-height: 1.08; }
  #academy-game-root .aca-command-mission-copy em,
  #academy-game-root .aca-command-board-note { display: none; }
  #academy-game-root .aca-command-mission-go { display: block; font-size: 14px; }
  #academy-game-root .aca-command-mission-progress { display: block; height: 3px; margin-top: 3px; }
  #academy-game-root .aca-command-mission-progress b { bottom: 3px; font-size: 6px; }
  #academy-game-root .aca-command-nav { padding: 4px; border-right-width: 3px; }
  #academy-game-root button.aca-command-nav-btn { min-height: 29px; padding: 4px 7px; font-size: 8px; }
  #academy-game-root .aca-command-nav-status { display: none; }
  body:has(#academy-game-root .aca-command-menu) .bdt-help-fab { bottom: 52px; }
}

@media (max-width: 390px) {
  #academy-game-root .aca-command-brand-copy span { display: none; }
  #academy-game-root .aca-command-selected { grid-template-columns: 66px minmax(0, 1fr) 88px; }
  #academy-game-root .aca-command-selected-art { width: 52px; height: 52px; }
  #academy-game-root .aca-command-selected-copy p { -webkit-line-clamp: 1; }
  #academy-game-root button.aca-command-fight-btn { font-size: 8px; }
}

/* ==========================================================================
   Combat vivant: profils persistants, progression visuelle et format 1 ecran.
   Cette couche ne touche ni aux questions, ni aux points, ni aux recompenses.
   ========================================================================== */
#academy-game-root:has(.bdt-battle-live),
#academy-game-root:has(.bdt-fight-lobby) {
  padding: 8px;
  overflow: hidden;
}

#academy-game-root .bdt-battle-live {
  --battle-user: #32d8ed;
  --battle-opp: #ff4d62;
  isolation: isolate;
  position: relative;
  display: grid;
  grid-template-rows: 38px 96px 8px minmax(0, 1fr);
  gap: 9px;
  width: min(840px, 100%);
  height: min(690px, calc(100dvh - 16px));
  max-width: 840px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
  background:
    linear-gradient(115deg, rgba(50, 216, 237, 0.08), transparent 34%),
    linear-gradient(245deg, rgba(255, 77, 98, 0.08), transparent 34%),
    #091321;
  box-shadow: 0 18px 55px rgba(0, 0, 0, 0.42), inset 0 0 70px rgba(0, 0, 0, 0.22);
  transition: background 0.6s ease, border-color 0.6s ease;
}
#academy-game-root .bdt-battle-live > :not(.bdt-battle-atmosphere) { position: relative; z-index: 2; }
#academy-game-root .bdt-battle-atmosphere { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
#academy-game-root .bdt-battle-atmosphere::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.22;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 34px 34px;
  transform: perspective(240px) rotateX(55deg) scale(1.6) translateY(22%);
  transform-origin: bottom;
}
#academy-game-root .bdt-stage-beam { position: absolute; top: -18%; bottom: -18%; width: 44%; opacity: 0.18; filter: blur(22px); transition: opacity .35s ease, transform .35s ease; }
#academy-game-root .bdt-stage-beam.beam-left { left: -26%; background: var(--battle-user); transform: skewX(-14deg); }
#academy-game-root .bdt-stage-beam.beam-right { right: -26%; background: var(--battle-opp); transform: skewX(14deg); }
#academy-game-root .bdt-stage-burst { position: absolute; left: 50%; top: 48%; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 209, 102, .28), transparent 64%); transform: translate(-50%, -50%) scale(.65); opacity: .32; transition: transform .55s ease, opacity .55s ease; }
#academy-game-root .bdt-battle-live.bdt-stage-rising { border-color: rgba(255, 209, 102, .34); }
#academy-game-root .bdt-battle-live.bdt-stage-rising .bdt-stage-burst { transform: translate(-50%, -50%) scale(1); opacity: .46; }
#academy-game-root .bdt-battle-live.bdt-stage-climax { border-color: rgba(255, 77, 98, .52); background: linear-gradient(115deg, rgba(50,216,237,.14), transparent 37%), linear-gradient(245deg, rgba(255,77,98,.16), transparent 37%), #100f21; }
#academy-game-root .bdt-battle-live.bdt-stage-climax .bdt-stage-beam { opacity: .28; }
#academy-game-root .bdt-battle-live.bdt-stage-climax .bdt-stage-burst { transform: translate(-50%, -50%) scale(1.35); opacity: .62; animation: bdtLiveClimaxPulse 1.4s ease-in-out infinite; }

#academy-game-root .bdt-battle-toolbar { display: flex; align-items: center; justify-content: space-between; min-width: 0; padding-left: 6px; }
#academy-game-root .bdt-battle-mode { min-width: 0; overflow: hidden; color: #8da0bb; font-size: 9px; font-weight: 1000; letter-spacing: 1.2px; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
#academy-game-root .bdt-battle-tools { display: flex; align-items: center; gap: 6px; }
#academy-game-root .bdt-battle-live .bdt-battle-quit,
#academy-game-root .bdt-battle-live .bdt-mute-battle { position: static; inset: auto; z-index: auto; min-height: 32px; margin: 0; }
#academy-game-root .bdt-battle-live .bdt-battle-quit { padding: 6px 10px; border-radius: 4px; font-size: 10px; }
#academy-game-root .bdt-battle-live .bdt-mute-battle { display: grid; place-items: center; width: 34px; height: 32px; padding: 0; border-radius: 4px; font-size: 14px; }

#academy-game-root .bdt-battle-live .bdt-topbar { display: grid; grid-template-columns: minmax(0, 1fr) 132px minmax(0, 1fr); gap: 8px; min-width: 0; padding: 7px 9px; border: 1px solid rgba(255,255,255,.12); background: rgba(7, 15, 28, .82); box-shadow: 0 8px 24px rgba(0,0,0,.25); }
#academy-game-root .bdt-battle-live .bdt-topbar-player { min-width: 0; gap: 9px; padding: 5px 8px; border-left: 4px solid var(--battle-user); background: linear-gradient(90deg, rgba(50,216,237,.16), rgba(50,216,237,.02)); }
#academy-game-root .bdt-battle-live .bdt-topbar-player.right { border-right: 4px solid var(--battle-opp); border-left: 0; background: linear-gradient(270deg, rgba(255,77,98,.16), rgba(255,77,98,.02)); }
#academy-game-root .bdt-battle-live .bdt-topbar-player::before { content: 'P1'; position: absolute; top: -7px; left: 6px; padding: 2px 5px; background: var(--battle-user); color: #07101d; font-size: 7px; font-weight: 1000; letter-spacing: .8px; }
#academy-game-root .bdt-battle-live .bdt-topbar-player.right::before { content: 'P2'; right: 6px; left: auto; background: var(--battle-opp); color: white; }
#academy-game-root .bdt-battle-live .bdt-topbar-player .bdt-mini-avatar { width: 58px; height: 58px; border: 3px solid var(--battle-user); border-radius: 10px; background: #0d1d31; box-shadow: 0 0 18px rgba(50,216,237,.28); clip-path: polygon(12% 0, 100% 0, 100% 88%, 88% 100%, 0 100%, 0 12%); }
#academy-game-root .bdt-battle-live .bdt-topbar-player.right .bdt-mini-avatar { border-color: var(--battle-opp); box-shadow: 0 0 18px rgba(255,77,98,.28); }
#academy-game-root .bdt-battle-live .bdt-topbar-info { min-width: 0; gap: 3px; }
#academy-game-root .bdt-battle-live .bdt-topbar-name { display: -webkit-box; max-width: 190px; overflow: hidden; color: #fff; font-size: 13px; font-weight: 1000; letter-spacing: .2px; line-height: 1.05; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#academy-game-root .bdt-topbar-title { max-width: 180px; overflow: hidden; color: #8ea0ba; font-size: 9px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
#academy-game-root .bdt-battle-live .bdt-topbar-hearts { gap: 1px; font-size: 14px; }
#academy-game-root .bdt-battle-round { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; }
#academy-game-root .bdt-battle-live .bdt-round-counter { color: #dbe5f5; font-size: 11px; letter-spacing: 1.4px; }
#academy-game-root .bdt-battle-momentum { max-width: 100%; margin-top: 5px; padding: 4px 7px; overflow: hidden; border: 1px solid rgba(255,209,102,.45); background: rgba(255,209,102,.09); color: #ffd166; font-size: 8px; font-weight: 1000; letter-spacing: 1px; text-align: center; text-overflow: ellipsis; white-space: nowrap; transform: skew(-5deg); }
#academy-game-root .bdt-battle-live .bdt-topbar-player.is-danger { animation: bdtLiveDanger 1s ease-in-out infinite; }

#academy-game-root .bdt-battle-live .bdt-timer-container { height: 8px; border-radius: 0; background: rgba(255,255,255,.07); }
#academy-game-root .bdt-battle-live .bdt-equation-area { align-self: stretch; justify-content: center; gap: clamp(12px, 3vh, 24px); min-height: 0; padding: clamp(10px, 2.5vh, 22px) clamp(8px, 2vw, 18px); border: 1px solid rgba(255,255,255,.08); background: rgba(8, 17, 31, .66); }
#academy-game-root .bdt-battle-live .bdt-question-display .bdt-equation { text-shadow: 0 0 26px rgba(255,209,102,.3); }
#academy-game-root .bdt-battle-live .bdt-answers { width: min(650px, 100%); }

#academy-game-root .bdt-battle-live.bdt-event-user-hit .beam-left,
#academy-game-root .bdt-battle-live.bdt-event-opponent-hit .beam-right { opacity: .72; animation: bdtLiveSideHit .48s ease-out 2; }
#academy-game-root .bdt-battle-live.bdt-event-streak .bdt-stage-burst,
#academy-game-root .bdt-battle-live.bdt-event-correct .bdt-stage-burst { opacity: .88; animation: bdtLiveBurst .7s ease-out; }
#academy-game-root .bdt-battle-live.bdt-event-draw .bdt-battle-momentum { color: #dfe8f7; border-color: rgba(223,232,247,.35); background: rgba(223,232,247,.08); }
#academy-game-root:has(.bdt-battle-live) .bdt-feedback-text { max-width: calc(100vw - 32px); padding: 12px 18px; border-block: 2px solid currentColor; background: rgba(6,15,28,.92); box-shadow: 8px 8px 0 rgba(0,0,0,.35); font-size: clamp(28px, 5vw, 44px); line-height: 1.12; text-align: center; white-space: normal; animation: popIn .3s cubic-bezier(.34,1.56,.64,1), fadeOut 1.1s .6s ease forwards !important; }

/* Versus compact: both fighters and the launch controls remain visible together. */
#academy-game-root .bdt-fight-lobby { justify-content: center; gap: 7px; width: min(860px, 100%); height: min(700px, calc(100dvh - 16px)); padding: 8px 14px; }
#academy-game-root .bdt-fight-lobby .bdt-logo { width: 34px; height: 34px; }
#academy-game-root .bdt-fight-lobby .bdt-matchmaking-title { font-size: clamp(18px, 3vw, 26px); letter-spacing: 2px; line-height: 1; }
#academy-game-root .bdt-fight-lobby .aca-level-badge { margin-top: -2px; padding: 3px 12px; font-size: 10px; }
#academy-game-root .bdt-fight-lobby .bdt-vs-row { flex: 0 1 260px; min-height: 0; padding: 8px 4px; }
#academy-game-root .bdt-fight-lobby .bdt-fighter-card { align-self: stretch; display: flex; flex-direction: column; justify-content: center; max-width: 260px; padding: 9px 10px; }
#academy-game-root .bdt-fight-lobby .bdt-fighter-side { display: none; }
#academy-game-root .bdt-fight-lobby .bdt-avatar-wrap { width: 72px; height: 72px; margin-bottom: 5px; }
#academy-game-root .bdt-fight-lobby .bdt-player-name { font-size: 15px; line-height: 1.05; }
#academy-game-root .bdt-fight-lobby .bdt-player-title { padding: 3px 8px; font-size: 9px; }
#academy-game-root .bdt-fight-lobby .bdt-player-quote { display: -webkit-box; margin-top: 4px; overflow: hidden; font-size: 9px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#academy-game-root .bdt-fight-lobby .bdt-player-level { margin-top: 3px; font-size: 9px; }
#academy-game-root .bdt-fight-lobby .bdt-vs-text { font-size: 42px; }
#academy-game-root .bdt-fight-lobby .bdt-versus-row + .bdt-versus-row { flex: 0 0 32px; padding: 0 34px; }
#academy-game-root .bdt-fight-lobby .bdt-versus-row + .bdt-versus-row .bdt-hearts { padding: 3px 8px; font-size: 14px; }
#academy-game-root .bdt-fight-lobby .bdt-difficulty { gap: 5px; }
#academy-game-root .bdt-fight-lobby .bdt-difficulty-label { font-size: 9px; }
#academy-game-root .bdt-fight-lobby .bdt-difficulty-options { gap: 6px; }
#academy-game-root .bdt-fight-lobby .bdt-diff-btn { min-height: 34px; padding: 6px 14px; font-size: 10px; }
#academy-game-root .bdt-fight-lobby .bdt-diff-detail { font-size: 9px; }
#academy-game-root .bdt-fight-lobby > .bdt-btn { min-height: 38px; padding: 7px 24px; font-size: 12px; }

@keyframes bdtLiveClimaxPulse { 0%,100% { filter: blur(0); opacity: .45; } 50% { filter: blur(5px); opacity: .76; } }
@keyframes bdtLiveSideHit { 0% { transform: skewX(-14deg) scaleX(.8); } 45% { transform: skewX(-14deg) scaleX(1.45); } 100% { transform: skewX(-14deg) scaleX(1); } }
@keyframes bdtLiveBurst { 0% { transform: translate(-50%,-50%) scale(.55); } 45% { transform: translate(-50%,-50%) scale(1.65); } 100% { transform: translate(-50%,-50%) scale(1); } }
@keyframes bdtLiveDanger { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.35) drop-shadow(0 0 8px rgba(255,77,98,.6)); } }

@media (max-width: 560px) {
  #academy-game-root .bdt-fight-lobby { gap: 5px; padding: 6px; }
  #academy-game-root .bdt-fight-lobby .bdt-vs-row { flex: 0 1 245px; flex-direction: row; gap: 5px; width: 100%; padding: 7px 0; }
  #academy-game-root .bdt-fight-lobby .bdt-fighter-card { width: auto; max-width: none; padding: 7px 4px; transform: none; }
  #academy-game-root .bdt-fight-lobby .bdt-vs-divider { flex: 0 0 34px; }
  #academy-game-root .bdt-fight-lobby .bdt-vs-text { font-size: 27px; }
  #academy-game-root .bdt-fight-lobby .bdt-avatar-wrap { width: 54px; height: 54px; }
  #academy-game-root .bdt-fight-lobby .bdt-player-name { display: -webkit-box; overflow: hidden; font-size: 11px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  #academy-game-root .bdt-fight-lobby .bdt-player-title { max-width: 115px; margin-inline: auto; overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
  #academy-game-root .bdt-fight-lobby .bdt-player-quote { max-width: 120px; font-size: 7px; }
  #academy-game-root .bdt-fight-lobby .bdt-versus-row + .bdt-versus-row { flex-direction: row; padding: 0 12px; }
  #academy-game-root .bdt-fight-lobby .bdt-diff-btn { min-height: 32px; padding: 5px 10px; font-size: 9px; letter-spacing: .5px; }
  #academy-game-root .bdt-fight-lobby > .bdt-btn-primary { padding: 7px 22px; font-size: 12px; letter-spacing: 2px; }

  #academy-game-root .bdt-battle-live { grid-template-rows: 34px 90px 7px minmax(0, 1fr); gap: 6px; width: 100%; height: calc(100dvh - 16px); padding: 6px; border-radius: 5px; }
  #academy-game-root .bdt-battle-live .bdt-topbar { grid-template-columns: minmax(0, 1fr) 78px minmax(0, 1fr); gap: 3px; padding: 5px 3px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-player { gap: 4px; padding: 4px 3px; border-left-width: 3px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-player.right { border-right-width: 3px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-player .bdt-mini-avatar { width: 42px; height: 48px; border-width: 2px; border-radius: 6px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-name { max-width: 76px; font-size: 10px; }
  #academy-game-root .bdt-topbar-title { max-width: 76px; font-size: 6px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-hearts { font-size: 10px; }
  #academy-game-root .bdt-battle-live .bdt-round-counter { font-size: 8px; letter-spacing: .5px; }
  #academy-game-root .bdt-battle-momentum { margin-top: 3px; padding: 3px 2px; font-size: 6px; letter-spacing: .35px; }
  #academy-game-root .bdt-battle-mode { font-size: 7px; letter-spacing: .6px; }
  #academy-game-root .bdt-battle-live .bdt-battle-quit { min-height: 29px; padding: 4px 7px; font-size: 8px; }
  #academy-game-root .bdt-battle-live .bdt-mute-battle { width: 30px; height: 29px; min-height: 29px; }
  #academy-game-root .bdt-battle-live .bdt-equation-area { gap: 12px; padding: 9px 6px; }
  #academy-game-root:has(.bdt-battle-live) .bdt-feedback-text { max-width: calc(100vw - 22px); font-size: clamp(22px, 7.4vw, 29px); letter-spacing: 1.5px; }
}

@media (prefers-reduced-motion: reduce) {
  #academy-game-root .bdt-battle-live,
  #academy-game-root .bdt-battle-live *,
  #academy-game-root .bdt-fight-lobby,
  #academy-game-root .bdt-fight-lobby * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  #academy-game-root:has(.bdt-battle-live) .bdt-feedback-text { animation: none !important; }
}

/* ==========================================================================
   Terrains actifs: un clic lance, le versus cherche seul, chaque duel a son ADN.
   ========================================================================== */
#academy-game-root .aca-command-selected { grid-template-columns: 150px minmax(0, 1fr) 190px; }
#academy-game-root .aca-command-speed-picker { position: relative; z-index: 4; display: flex; grid-column: 3; grid-row: 2; flex-direction: column; align-self: center; gap: 7px; min-width: 0; padding: 10px 12px 10px 0; }
#academy-game-root .aca-command-speed-picker > small { color: var(--cmd-gold); font-size: 8px; font-weight: 1000; letter-spacing: 1.3px; }
#academy-game-root .aca-command-speed-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
#academy-game-root button.aca-command-speed-btn { min-width: 0; min-height: 32px; margin: 0; padding: 5px 3px; border: 1px solid var(--cmd-line); border-radius: 4px; background: #0b1626; box-shadow: none; color: #8fa0b9; font-family: inherit; font-size: 8px; font-weight: 1000; cursor: pointer; transform: none; }
#academy-game-root button.aca-command-speed-btn:hover,
#academy-game-root button.aca-command-speed-btn:focus-visible { border-color: var(--cmd-cyan); color: #fff; outline: 2px solid rgba(50,216,237,.28); outline-offset: 1px; transform: none; }
#academy-game-root button.aca-command-speed-btn.active { border-color: var(--cmd-gold); background: var(--cmd-gold); color: #161006; }
#academy-game-root .aca-command-auto-hint { color: #7f91aa; font-size: 7px; font-weight: 900; letter-spacing: .65px; line-height: 1.2; }
#academy-game-root button.aca-command-mode::after { content: '›'; position: absolute; right: 6px; bottom: 3px; color: var(--cmd-cyan); font-size: 16px; font-weight: 1000; opacity: 0; transform: translateX(-5px); transition: opacity .16s ease, transform .16s ease; }
#academy-game-root button.aca-command-mode:hover::after,
#academy-game-root button.aca-command-mode:focus-visible::after { opacity: 1; transform: translateX(0); }
#academy-game-root button.aca-command-mode.is-launching,
#academy-game-root button.aca-command-mission.is-launching { border-color: var(--cmd-gold); background: #25324a; animation: acaTerrainLaunch .22s ease-out both; }
#academy-game-root .aca-command-menu.is-launching button { pointer-events: none; }

#academy-game-root .bdt-auto-lobby { gap: 8px; }
#academy-game-root .bdt-auto-match-rule { padding: 6px 12px; border: 1px solid rgba(255,209,102,.45); background: rgba(255,209,102,.08); color: #ffd166; font-size: 9px; font-weight: 1000; letter-spacing: .8px; text-transform: uppercase; }
#academy-game-root .bdt-auto-lobby.is-searching .bdt-auto-match-rule { border-color: rgba(50,216,237,.55); color: #32d8ed; animation: bdtAutoRulePulse 1.1s ease-in-out infinite; }
#academy-game-root .bdt-auto-lobby > .bdt-btn-secondary { margin-top: 2px; }

#academy-game-root .bdt-battle-live {
  --mode-accent: #32d8ed;
  --mode-accent-2: #ffd166;
  grid-template-rows: 34px 118px 8px minmax(0, 1fr);
  background:
    radial-gradient(circle at 17% 76%, color-mix(in srgb, var(--mode-accent) 14%, transparent), transparent 35%),
    radial-gradient(circle at 83% 76%, color-mix(in srgb, var(--mode-accent-2) 13%, transparent), transparent 35%),
    #091321;
}
#academy-game-root .bdt-mode-watermark { position: absolute; left: 50%; top: 63%; color: var(--mode-accent); font-size: clamp(190px, 30vw, 360px); font-weight: 1000; line-height: 1; opacity: .035; filter: grayscale(.2); transform: translate(-50%,-50%) rotate(-7deg); }
#academy-game-root .bdt-battle-mode { display: grid; grid-template-columns: 27px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; column-gap: 7px; color: #fff; letter-spacing: .6px; text-overflow: clip; }
#academy-game-root .bdt-battle-mode-icon { display: grid; grid-row: 1 / 3; place-items: center; width: 27px; height: 27px; border: 1px solid var(--mode-accent); background: color-mix(in srgb, var(--mode-accent) 12%, #091321); color: var(--mode-accent); font-size: 15px; box-shadow: 3px 3px 0 rgba(0,0,0,.28); }
#academy-game-root .bdt-battle-mode strong { min-width: 0; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
#academy-game-root .bdt-battle-mode small { color: #7f91aa; font-size: 7px; font-weight: 900; letter-spacing: .7px; }
#academy-game-root .bdt-battle-live .bdt-topbar { border-top: 3px solid var(--mode-accent); }
#academy-game-root .bdt-battle-live .bdt-topbar-player { min-height: 88px; }
#academy-game-root .bdt-battle-live .bdt-topbar-player .bdt-mini-avatar { width: 72px; height: 76px; }
#academy-game-root .bdt-battle-live .bdt-topbar-info { justify-content: center; }
#academy-game-root .bdt-topbar-quote { max-width: 190px; overflow: hidden; color: color-mix(in srgb, var(--mode-accent) 68%, #fff); font-size: 8px; font-style: italic; font-weight: 750; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
#academy-game-root .bdt-topbar-player.right .bdt-topbar-quote { color: color-mix(in srgb, var(--mode-accent-2) 70%, #fff); }
#academy-game-root .bdt-battle-live .bdt-timer-bar { background: linear-gradient(90deg, var(--mode-accent), var(--mode-accent-2)); }
#academy-game-root .bdt-battle-live .bdt-equation-area { border-top: 3px solid color-mix(in srgb, var(--mode-accent) 65%, transparent); background-color: rgba(8,17,31,.7); }
#academy-game-root .bdt-battle-live .bdt-answer-btn:hover,
#academy-game-root .bdt-battle-live .bdt-answer-btn:focus-visible { border-color: var(--mode-accent); box-shadow: 0 0 18px color-mix(in srgb, var(--mode-accent) 24%, transparent); }

#academy-game-root .bdt-theme-calcul-mental { --mode-accent:#32d8ed; --mode-accent-2:#ffd166; }
#academy-game-root .bdt-theme-calcul-mental .bdt-equation-area { background-image: linear-gradient(rgba(50,216,237,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(50,216,237,.035) 1px,transparent 1px); background-size: 28px 28px; }
#academy-game-root .bdt-theme-problemes { --mode-accent:#ff9f43; --mode-accent-2:#32d8ed; }
#academy-game-root .bdt-theme-problemes .bdt-equation-area { background-image: radial-gradient(circle,rgba(255,159,67,.11) 1px,transparent 1.5px); background-size: 22px 22px; }
#academy-game-root .bdt-theme-orthographe { --mode-accent:#c77dff; --mode-accent-2:#ff6b9f; }
#academy-game-root .bdt-theme-orthographe .bdt-equation-area { background-image: repeating-linear-gradient(0deg,transparent 0 31px,rgba(199,125,255,.07) 32px 33px); }
#academy-game-root .bdt-theme-epellation { --mode-accent:#b8f34a; --mode-accent-2:#32d8ed; }
#academy-game-root .bdt-theme-epellation .bdt-equation-area { background-image: repeating-linear-gradient(112deg,transparent 0 34px,rgba(184,243,74,.065) 35px 37px); }
#academy-game-root .bdt-theme-conjugaison { --mode-accent:#ff6b6b; --mode-accent-2:#ffd166; }
#academy-game-root .bdt-theme-conjugaison .bdt-equation-area { background-image: linear-gradient(135deg,rgba(255,107,107,.045) 25%,transparent 25% 75%,rgba(255,107,107,.045) 75%); background-size: 34px 34px; }
#academy-game-root .bdt-theme-grammaire { --mode-accent:#44d39c; --mode-accent-2:#ffd166; }
#academy-game-root .bdt-theme-grammaire .bdt-equation-area { background-image: linear-gradient(90deg,rgba(68,211,156,.055) 1px,transparent 1px); background-size: 46px 100%; }
#academy-game-root .bdt-theme-litterature { --mode-accent:#e26d8f; --mode-accent-2:#e8c46a; }
#academy-game-root .bdt-theme-litterature .bdt-equation-area { background-image: radial-gradient(ellipse at center,rgba(226,109,143,.09),transparent 62%); }
#academy-game-root .bdt-theme-anagrammes { --mode-accent:#ff5ac8; --mode-accent-2:#32d8ed; }
#academy-game-root .bdt-theme-anagrammes .bdt-equation-area { background-image: linear-gradient(45deg,rgba(255,90,200,.045) 25%,transparent 25% 75%,rgba(50,216,237,.035) 75%); background-size: 42px 42px; }

@keyframes acaTerrainLaunch { 0%{transform:scale(1)} 55%{transform:scale(.96)} 100%{transform:scale(1.02)} }
@keyframes bdtAutoRulePulse { 0%,100%{box-shadow:0 0 0 rgba(50,216,237,0)} 50%{box-shadow:0 0 18px rgba(50,216,237,.28)} }

@media (max-width:700px) {
  #academy-game-root .aca-command-selected { grid-template-columns: 66px minmax(0,1fr) 116px; }
  #academy-game-root .aca-command-speed-picker { gap: 4px; padding: 5px 5px 5px 0; }
  #academy-game-root .aca-command-speed-picker > small { font-size: 6px; }
  #academy-game-root .aca-command-speed-options { gap: 2px; }
  #academy-game-root button.aca-command-speed-btn { min-height: 27px; padding: 3px 1px; font-size: 6px; }
  #academy-game-root .aca-command-auto-hint { font-size: 5.5px; letter-spacing: .3px; }
}

@media (max-width:560px) {
  #academy-game-root .bdt-auto-lobby .bdt-vs-row { flex-basis: 285px; }
  #academy-game-root .bdt-auto-match-rule { padding: 5px 8px; font-size: 7px; }
  #academy-game-root .bdt-battle-live { grid-template-rows: 32px 124px 7px minmax(0,1fr); }
  #academy-game-root .bdt-battle-live .bdt-topbar { grid-template-columns:minmax(0,1fr) 66px minmax(0,1fr); }
  #academy-game-root .bdt-battle-live .bdt-topbar-player { min-height: 108px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-player .bdt-mini-avatar { width: 40px; height: 58px; }
  #academy-game-root .bdt-battle-live .bdt-topbar-info { overflow: hidden; }
  #academy-game-root .bdt-battle-live .bdt-topbar-name { max-width: 86px; font-size: 9px; }
  #academy-game-root .bdt-topbar-title,
  #academy-game-root .bdt-topbar-quote { display: -webkit-box; max-width: 86px; overflow: hidden; font-size: 5.8px; line-height: 1.15; text-overflow: clip; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  #academy-game-root .bdt-battle-live .bdt-topbar-hearts { font-size: 9px; }
  #academy-game-root .bdt-battle-mode { grid-template-columns:23px minmax(0,1fr); column-gap:5px; }
  #academy-game-root .bdt-battle-mode-icon { width:23px; height:23px; font-size:12px; }
  #academy-game-root .bdt-battle-mode strong { font-size:7px; }
  #academy-game-root .bdt-battle-mode small { font-size:5px; }
}

/* --------------------------------------------------------------------------
   LA BANDE TABLETTE, 701px a 899px. Ajoutee le 2026-08-23.

   Sans elle, la regle sans media query plus haut
   (`.aca-command-selected { grid-template-columns: 150px minmax(0,1fr) 190px }`)
   s'applique des 701px. Ces 340px fixes, plus les 300px minimum du tableau du
   jour, ne laissent presque rien a la colonne du milieu : le titre du mode
   DEBORDE de sa boite et passe PAR-DESSUS le mot VITESSE, et tous les noms de
   matiere sont coupes.

   Mesure a 768x1024 AVANT : 8 textes tronques, dont « Calcul Mental » a qui on
   donnait 62px pour 95px requis, et « Calcule vite. Frappe juste. » 62px pour
   127px. Le titre finissait a 270px alors que VITESSE commencait a 255px.
   L'enfant lisait « Problem », « Orthogr », « Epellati », « Conjuga », « Gramma ».
   Mesure APRES, aux 5 tailles de la bande : ZERO texte tronque, zero chevauchement.

   La bande s'arrete a 899px parce qu'a 900px la mise en page d'origine est deja
   propre, mesuree : on ne touche pas a ce qui va bien.
   -------------------------------------------------------------------------- */
@media (min-width: 701px) and (max-width: 899px) {
  /* Rendre 44px au panneau de gauche, la ou vit le titre. */
  #academy-game-root .aca-command-main { grid-template-columns: minmax(0, 1fr) 256px; }
  /* Les colonnes fixes passent de 340px a 242px. Tout va au titre. */
  #academy-game-root .aca-command-selected { grid-template-columns: 96px minmax(0, 1fr) 146px; }
  #academy-game-root .aca-command-selected-art { width: 84px; height: 84px; font-size: 44px; }
  #academy-game-root .aca-command-speed-picker { padding: 8px 8px 8px 0; }
  /* 3 terrains par rangee au lieu de 4 : chaque nom de matiere tient en entier. */
  #academy-game-root .aca-command-roster-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* --------------------------------------------------------------------------
   CIBLES TACTILES SOUS 700px. Ajoute le 2026-08-24.

   Mesure a 375x812 AVANT : 9 boutons sur 29 etaient plus petits que 44x44 px.
   Facile / Moyen / Difficile faisaient 36x27, les onglets JEUX et MATIERES
   25 px de haut, CLASSEMENT et HISTORIQUE 29 px. Un doigt d'enfant de 9 ans
   n'est pas precis : a cette taille il manque sa cible.

   ⚠️ Ces boutons etaient RAPETISSES expres par la bande <=700px plus haut, pour
   faire tenir la console. On les remet a 44 px, la taille reconnue, et on rend
   24 px a la colonne de la vitesse pour que les trois boutons y tiennent aussi
   en largeur.

   Mesure APRES, a 320, 375, 390, 560 et 700 px : ZERO cible sous 44x44, ZERO
   texte tronque en plus, et la hauteur totale de la page est INCHANGEE
   (820 px a 375, avant comme apres).

   ⛔ Les selecteurs portent `button.` : les regles d'origine sont ecrites
   `#academy-game-root button.aca-command-tab`, donc une regle sans le nom de
   balise perd la specificite, et mon premier essai n'a rien fait du tout.
   -------------------------------------------------------------------------- */
@media (max-width: 700px) {
  #academy-game-root button.aca-command-speed-btn { min-height: 44px; }
  #academy-game-root button.aca-command-tab { min-height: 44px; padding: 4px 12px; }
  #academy-game-root button.aca-command-nav-btn { min-height: 44px; padding: 4px 12px; }
  #academy-game-root button.aca-command-control { min-height: 44px; }
  #academy-game-root button.aca-command-icon-control { min-width: 44px; }
  #academy-game-root .aca-command-selected { grid-template-columns: 66px minmax(0, 1fr) 148px; }
}

/* --------------------------------------------------------------------------
   CIBLES TACTILES DE LA TABLETTE, 701px a 1024px. Ajoute le 2026-08-24.

   ⚠️ La bande ci-dessus s'arrete a 700px, et j'avais donc laisse la TABLETTE
   avec ses 9 boutons sous 44x44. Or un iPad est justement l'ecran tactile le
   plus probable en ecole-maison : c'est la que ca comptait le plus.
   Mesure a 768 et a 1024 AVANT : 9 cibles sous 44x44. APRES : zero.

   ⛔ CETTE BANDE NE TOUCHE PAS A LA GRILLE, expres. Un premier essai elargissait
   la colonne de la vitesse jusqu'a 1024px : ca reglait bien les cibles, mais ca
   deplacait la mise en page a 900 et 1024px, ou RIEN n'etait casse, et ca
   coupait « Calcule vite. Frappe juste. » a 701px. On ne corrige pas ce qui va
   bien. Seules les tailles de boutons changent ici.

   La reprise de padding sur la vitesse est bornee a 899px : c'est la seule
   largeur ou les trois boutons manquaient de place. Au-dessus, la colonne fait
   deja 190px et personne n'a besoin d'aide.
   -------------------------------------------------------------------------- */
@media (min-width: 701px) and (max-width: 1024px) {
  #academy-game-root button.aca-command-speed-btn { min-height: 44px; }
  #academy-game-root button.aca-command-tab { min-height: 44px; padding: 4px 14px; }
  #academy-game-root button.aca-command-nav-btn { min-height: 44px; padding: 4px 14px; }
  #academy-game-root button.aca-command-control { min-height: 44px; }
  #academy-game-root button.aca-command-icon-control { min-width: 44px; }
}
@media (min-width: 701px) and (max-width: 899px) {
  #academy-game-root .aca-command-speed-picker { padding: 8px 4px 8px 0; }
}

@media (prefers-reduced-motion:reduce) {
  #academy-game-root button.aca-command-mode.is-launching,
  #academy-game-root button.aca-command-mission.is-launching,
  #academy-game-root .bdt-auto-lobby.is-searching .bdt-auto-match-rule { animation:none !important; }
}

/* ===========================================================================
   Passe consolidée: choix lisible, versus progressif et commandes de duel.
   Les règles de jeu, les scores et les récompenses restent inchangés.
   ========================================================================== */
#academy-game-root .aca-command-menu { --terrain-accent: var(--cmd-cyan); --terrain-accent-2: var(--cmd-gold); }
#academy-game-root[data-arena-mode="calcul-mental"] .aca-command-menu { --terrain-accent:#32d8ed; --terrain-accent-2:#ffd166; }
#academy-game-root[data-arena-mode="problemes"] .aca-command-menu { --terrain-accent:#ff9f43; --terrain-accent-2:#32d8ed; }
#academy-game-root[data-arena-mode="orthographe"] .aca-command-menu { --terrain-accent:#c77dff; --terrain-accent-2:#ff6b9f; }
#academy-game-root[data-arena-mode="epellation"] .aca-command-menu { --terrain-accent:#b8f34a; --terrain-accent-2:#32d8ed; }
#academy-game-root[data-arena-mode="conjugaison"] .aca-command-menu { --terrain-accent:#ff6b6b; --terrain-accent-2:#ffd166; }
#academy-game-root[data-arena-mode="grammaire"] .aca-command-menu { --terrain-accent:#44d39c; --terrain-accent-2:#ffd166; }
#academy-game-root[data-arena-mode="litterature"] .aca-command-menu { --terrain-accent:#e26d8f; --terrain-accent-2:#e8c46a; }
#academy-game-root[data-arena-mode="anagrammes"] .aca-command-menu { --terrain-accent:#ff5ac8; --terrain-accent-2:#32d8ed; }
#academy-game-root[data-arena-mode="tivan"] .aca-command-menu { --terrain-accent:#57df78; --terrain-accent-2:#ffd166; }
#academy-game-root[data-arena-mode="ttmc"] .aca-command-menu { --terrain-accent:#ffd166; --terrain-accent-2:#ff8c42; }
#academy-game-root[data-arena-mode="ttmc-solo"] .aca-command-menu { --terrain-accent:#ffd83d; --terrain-accent-2:#ff3ba7; }
#academy-game-root[data-arena-mode="course-academique"] .aca-command-menu { --terrain-accent:#ff8b38; --terrain-accent-2:#32d8ed; }
#academy-game-root[data-arena-mode="123-co"] .aca-command-menu { --terrain-accent:#ff5ac8; --terrain-accent-2:#9d7dff; }

#academy-game-root .aca-command-selected { border-left-color:var(--terrain-accent); }
#academy-game-root .aca-command-selected::before { background:linear-gradient(145deg,var(--terrain-accent),color-mix(in srgb,var(--terrain-accent) 58%,#111c30)); }
#academy-game-root .aca-command-selected-kicker { color:var(--terrain-accent-2); }
#academy-game-root .aca-command-selected-signature { display:block; margin-top:6px; overflow:hidden; color:color-mix(in srgb,var(--terrain-accent) 76%,#fff); font-size:9px; font-style:italic; font-weight:850; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
#academy-game-root .aca-command-selected-meta { margin-left:8px; color:var(--terrain-accent); }
#academy-game-root .aca-command-speed-detail { min-height:12px; overflow:hidden; color:#d9e3f2; font-size:7px; font-weight:800; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
#academy-game-root .aca-command-speed-picker.is-format { justify-content:center; padding-right:14px; }
#academy-game-root .aca-command-speed-picker.is-format .aca-command-speed-detail { padding:8px; border:1px solid color-mix(in srgb,var(--terrain-accent) 55%,var(--cmd-line)); background:color-mix(in srgb,var(--terrain-accent) 10%,#0b1626); color:#fff; font-size:8px; line-height:1.25; white-space:normal; }
#academy-game-root button.aca-command-speed-btn.active { border-color:var(--terrain-accent); background:var(--terrain-accent); }

#academy-game-root button.aca-command-mode { grid-template-columns:42px minmax(0,1fr); }
#academy-game-root .aca-command-mode-copy { display:flex; flex-direction:column; min-width:0; }
#academy-game-root .aca-command-mode-copy strong { display:-webkit-box; overflow:hidden; color:#f5f8ff; font-size:10px; font-weight:950; line-height:1.1; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#academy-game-root .aca-command-mode-copy small { margin-top:4px; overflow:hidden; color:#7f91aa; font-size:7px; font-weight:800; line-height:1.1; text-overflow:ellipsis; white-space:nowrap; }
#academy-game-root button.aca-command-mode.selected { border-color:var(--terrain-accent); box-shadow:inset 4px 0 0 var(--terrain-accent-2),0 0 18px color-mix(in srgb,var(--terrain-accent) 14%,transparent); }
#academy-game-root .aca-command-mode > b { top:4px; right:5px; padding:2px 4px; background:var(--terrain-accent); color:#07101d; font-size:6px; letter-spacing:.4px; }

#academy-game-root button.aca-command-mission.complete .aca-command-mission-go { color:#44d39c; font-size:6px; letter-spacing:.4px; }
#academy-game-root button.aca-command-mission.complete .aca-command-mission-progress i { background:#44d39c; }
#academy-game-root button.aca-command-mission.active { border-color:var(--terrain-accent); box-shadow:inset 3px 0 0 var(--terrain-accent); }
#academy-game-root .aca-command-mission-progress { border-radius:3px; }
#academy-game-root .aca-command-mission-progress i { border-radius:3px; transition:width .25s ease; }

#academy-game-root .aca-command-launch-overlay { position:absolute; z-index:120; inset:0; display:grid; grid-template-columns:72px auto; grid-template-rows:auto auto; place-content:center; align-items:center; column-gap:16px; overflow:hidden; background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--terrain-accent) 22%,transparent),transparent 42%),rgba(5,12,23,.96); animation:acaLaunchOverlay .42s ease both; }
#academy-game-root .aca-command-launch-overlay::before { content:''; position:absolute; inset:50% -10%; height:2px; background:linear-gradient(90deg,transparent,var(--terrain-accent),var(--terrain-accent-2),transparent); box-shadow:0 0 22px var(--terrain-accent); transform:rotate(-4deg); }
#academy-game-root .aca-command-launch-art { position:relative; z-index:2; display:grid; grid-row:1 / 3; place-items:center; width:72px; height:72px; color:#fff; font-size:44px; filter:drop-shadow(0 0 16px color-mix(in srgb,var(--terrain-accent) 55%,transparent)); }
#academy-game-root .aca-command-launch-art img { max-width:100%; max-height:100%; }
#academy-game-root .aca-command-launch-overlay strong,
#academy-game-root .aca-command-launch-overlay span { position:relative; z-index:2; }
#academy-game-root .aca-command-launch-overlay strong { color:#fff; font-size:clamp(22px,3vw,38px); font-weight:1000; line-height:1; text-transform:uppercase; }
#academy-game-root .aca-command-launch-overlay > span { margin-top:7px; color:var(--terrain-accent); font-size:9px; font-weight:1000; letter-spacing:1.4px; }

#academy-game-root :where(.bdt-auto-lobby) { --mode-accent:#32d8ed; --mode-accent-2:#ffd166; border:1px solid color-mix(in srgb,var(--mode-accent) 38%,transparent); background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--mode-accent) 10%,transparent),transparent 38%),#090f1f; }
#academy-game-root .bdt-match-flow { display:grid; grid-template-columns:repeat(3,minmax(70px,110px)); justify-content:center; gap:18px; width:min(420px,100%); }
#academy-game-root .bdt-match-step { position:relative; display:flex; align-items:center; gap:6px; color:#64748c; font-size:7px; font-weight:900; letter-spacing:.6px; text-transform:uppercase; }
#academy-game-root .bdt-match-step:not(:last-child)::after { content:''; position:absolute; left:calc(100% + 4px); top:50%; width:10px; height:1px; background:#30405a; }
#academy-game-root .bdt-match-step b { display:grid; place-items:center; width:19px; height:19px; border:1px solid #30405a; border-radius:50%; background:#0c1727; color:#7f91aa; font-size:7px; }
#academy-game-root .bdt-match-step.active { color:#fff; }
#academy-game-root .bdt-match-step.active b { border-color:var(--mode-accent); color:var(--mode-accent); box-shadow:0 0 12px color-mix(in srgb,var(--mode-accent) 35%,transparent); }
#academy-game-root .bdt-match-step.complete b { border-color:var(--mode-accent); background:var(--mode-accent); color:#07101d; }
#academy-game-root .bdt-match-status { min-height:14px; color:color-mix(in srgb,var(--mode-accent) 72%,#fff); font-size:8px; font-weight:850; letter-spacing:.5px; text-align:center; }
#academy-game-root .bdt-auto-lobby .bdt-searching-icon { border-color:var(--mode-accent); color:var(--mode-accent); animation:bdtRadarScan 1.05s ease-in-out infinite; }
#academy-game-root .bdt-auto-lobby.is-searching .bdt-vs-divider { animation:bdtVsCharge 1.1s ease-in-out infinite; }
#academy-game-root .bdt-auto-lobby.has-opponent .bdt-fighter-card.is-opponent { animation:bdtOpponentReveal .52s cubic-bezier(.18,.86,.28,1.35) both; }
#academy-game-root .bdt-auto-lobby.has-opponent .bdt-vs-text { color:var(--mode-accent-2); text-shadow:0 0 20px color-mix(in srgb,var(--mode-accent-2) 50%,transparent); }

#academy-game-root .bdt-battle-mode { grid-template-rows:auto auto auto; }
#academy-game-root .bdt-battle-mode em { min-width:0; overflow:hidden; color:var(--mode-accent); font-size:5px; font-style:normal; font-weight:950; letter-spacing:.6px; text-overflow:ellipsis; white-space:nowrap; }
#academy-game-root .bdt-round-progress { width:min(92px,90%); height:3px; margin-top:4px; overflow:hidden; background:rgba(255,255,255,.1); }
#academy-game-root .bdt-round-progress i { display:block; width:100%; height:100%; background:linear-gradient(90deg,var(--mode-accent),var(--mode-accent-2)); transform:scaleX(0); transform-origin:left center; transition:transform .3s ease; }
#academy-game-root .bdt-battle-live .bdt-topbar-title,
#academy-game-root .bdt-battle-live .bdt-topbar-quote { display:-webkit-box; overflow:hidden; text-overflow:clip; white-space:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#academy-game-root .bdt-battle-live .bdt-answer-btn { display:grid; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:9px; text-align:left; }
#academy-game-root .bdt-answer-key { position:relative; z-index:2; display:grid; place-items:center; width:25px; height:25px; border:1px solid color-mix(in srgb,var(--mode-accent) 55%,#44516a); background:rgba(5,12,23,.55); color:var(--mode-accent); font-size:9px; font-weight:1000; }
#academy-game-root .bdt-answer-text { position:relative; z-index:2; min-width:0; overflow:hidden; font-size:inherit; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
#academy-game-root .bdt-answer-btn:focus-visible { outline:3px solid var(--mode-accent); outline-offset:3px; }
#academy-game-root .bdt-answer-btn.correct .bdt-answer-key { border-color:#44d39c; background:#44d39c; color:#07101d; }
#academy-game-root .bdt-answer-btn.wrong .bdt-answer-key { border-color:#ff4d62; background:#ff4d62; color:#fff; }

@keyframes acaLaunchOverlay { from{opacity:0;transform:scale(1.035)} to{opacity:1;transform:scale(1)} }
@keyframes bdtRadarScan { 0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--mode-accent) 0%,transparent);transform:rotate(-4deg) scale(.96)} 50%{box-shadow:0 0 0 10px color-mix(in srgb,var(--mode-accent) 8%,transparent);transform:rotate(4deg) scale(1.04)} }
@keyframes bdtVsCharge { 0%,100%{filter:brightness(1);transform:scale(1)} 50%{filter:brightness(1.45);transform:scale(1.06)} }
@keyframes bdtOpponentReveal { from{opacity:0;filter:blur(8px);transform:translateX(26px) scale(.94)} to{opacity:1;filter:blur(0);transform:translateX(0) scale(1)} }

@media (max-width:700px) {
  #academy-game-root .aca-command-selected-signature { display:none; }
  #academy-game-root .aca-command-speed-detail { font-size:5.4px; }
  #academy-game-root .aca-command-speed-picker.is-format .aca-command-speed-detail { padding:5px; font-size:6px; }
  #academy-game-root .aca-command-mode-copy strong { font-size:7px; }
  #academy-game-root .aca-command-mode-copy small { display:none; }
  #academy-game-root .aca-command-mode > b { font-size:4.8px; }
  #academy-game-root .aca-command-launch-overlay { grid-template-columns:54px auto; column-gap:10px; }
  #academy-game-root .aca-command-launch-art { width:54px; height:54px; font-size:34px; }
  #academy-game-root .aca-command-launch-overlay strong { font-size:clamp(18px,6vw,26px); }
  #academy-game-root .aca-command-launch-overlay > span { font-size:6px; }
}

@media (max-width:560px) {
  #academy-game-root .bdt-match-flow { gap:10px; }
  #academy-game-root .bdt-match-step { font-size:5.5px; }
  #academy-game-root .bdt-match-step b { width:16px; height:16px; font-size:6px; }
  #academy-game-root .bdt-match-status { font-size:6.5px; }
  #academy-game-root .bdt-battle-mode em { display:none; }
  #academy-game-root .bdt-round-progress { width:50px; height:2px; }
  #academy-game-root .bdt-battle-live .bdt-answer-btn { grid-template-columns:22px minmax(0,1fr); gap:5px; padding-inline:7px; }
  #academy-game-root .bdt-answer-key { width:20px; height:20px; font-size:7px; }
}

@media (prefers-reduced-motion:reduce) {
  #academy-game-root .aca-command-launch-overlay,
  #academy-game-root .bdt-auto-lobby .bdt-searching-icon,
  #academy-game-root .bdt-auto-lobby.is-searching .bdt-vs-divider,
  #academy-game-root .bdt-auto-lobby.has-opponent .bdt-fighter-card.is-opponent { animation:none !important; }
  #academy-game-root .bdt-round-progress i { transition:none; }
}

/* ===========================================================================
   Tu te mets combien, defi solo.
   Cette surface remplace le choix multijoueur dans le menu sans supprimer
   l'ancien moteur, conserve pour les historiques et les liens deja emis.
   ========================================================================== */
#academy-game-root .ttmc-solo-wrap {
  --ttmc-ink:#16102a;
  --ttmc-purple:#7600e8;
  --ttmc-violet:#b86aff;
  --ttmc-cyan:#08c3d7;
  --ttmc-pink:#ff3ba7;
  --ttmc-yellow:#ffd83d;
  --ttmc-mint:#96f2d0;
  min-height:100%;
  padding:clamp(14px,2vw,24px);
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 8% 18%,rgba(255,59,167,.23),transparent 25%),
    radial-gradient(circle at 91% 86%,rgba(8,195,215,.2),transparent 28%),
    linear-gradient(145deg,#100925 0%,#1a0e35 52%,#071c31 100%);
}
#academy-game-root .ttmc-solo-wrap::before {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.15;
  background-image:radial-gradient(circle,#fff 1px,transparent 1px);
  background-size:18px 18px;
  mask-image:linear-gradient(135deg,#000,transparent 64%);
}
#academy-game-root .ttmc-solo-topbar,
#academy-game-root .ttmc-solo-hud,
#academy-game-root .ttmc-solo-layout { position:relative; z-index:1; }
#academy-game-root .ttmc-solo-topbar { display:flex; align-items:center; gap:18px; }
#academy-game-root .ttmc-solo-brand { display:flex; align-items:center; gap:10px; min-width:210px; }
#academy-game-root .ttmc-solo-brand > span { display:grid; place-items:center; width:48px; height:48px; border:2px solid var(--ttmc-yellow); border-radius:15px 5px 15px 5px; background:var(--ttmc-purple); font-size:25px; box-shadow:5px 5px 0 var(--ttmc-pink); transform:rotate(-2deg); }
#academy-game-root .ttmc-solo-brand b,
#academy-game-root .ttmc-solo-brand small { display:block; }
#academy-game-root .ttmc-solo-brand b { font-size:clamp(17px,2vw,24px); font-weight:1000; letter-spacing:-.5px; }
#academy-game-root .ttmc-solo-brand small { margin-top:2px; color:var(--ttmc-mint); font-size:11px; font-weight:950; letter-spacing:1.3px; text-transform:uppercase; }
#academy-game-root .ttmc-solo-rule { flex:1; color:#d8d1ef; font-size:13px; font-weight:800; text-align:center; }
#academy-game-root button.ttmc-solo-quit { min-height:44px; white-space:nowrap; }

#academy-game-root .ttmc-solo-hud { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:18px 0 14px; }
#academy-game-root .ttmc-solo-start-rule,
#academy-game-root .ttmc-solo-score,
#academy-game-root .ttmc-solo-category-chip,
#academy-game-root .ttmc-solo-misses { min-height:64px; border:1px solid rgba(255,255,255,.14); background:rgba(8,5,24,.66); box-shadow:0 12px 28px rgba(0,0,0,.2); }
#academy-game-root .ttmc-solo-start-rule { display:flex; align-items:center; justify-content:center; gap:10px; padding:10px; }
#academy-game-root .ttmc-solo-start-rule b { color:var(--ttmc-yellow); font-size:28px; font-weight:1000; }
#academy-game-root .ttmc-solo-start-rule span { color:#e8e3f7; font-size:12px; font-weight:850; line-height:1.15; }
#academy-game-root .ttmc-solo-score,
#academy-game-root .ttmc-solo-misses { display:flex; align-items:center; justify-content:center; gap:12px; padding:8px 14px; }
#academy-game-root .ttmc-solo-score span,
#academy-game-root .ttmc-solo-misses > span { color:#bdb5d8; font-size:10px; font-weight:950; letter-spacing:1px; text-transform:uppercase; }
#academy-game-root .ttmc-solo-score b { color:var(--ttmc-yellow); font-size:34px; font-weight:1000; text-shadow:3px 3px 0 var(--ttmc-purple); }
#academy-game-root .ttmc-solo-category-chip { display:grid; place-items:center; padding:10px 16px; color:var(--ttmc-ink); background:linear-gradient(135deg,var(--ttmc-mint),var(--ttmc-cyan)); font-size:15px; font-weight:1000; text-align:center; transform:skew(-3deg); }
#academy-game-root .ttmc-solo-misses div { display:flex; gap:5px; font-size:20px; }
#academy-game-root .ttmc-solo-misses .is-lost { filter:grayscale(1); opacity:.3; }

#academy-game-root .ttmc-solo-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,27%); gap:14px; min-height:430px; }
#academy-game-root .ttmc-solo-stage,
#academy-game-root .ttmc-solo-leaderboard { border:1px solid rgba(255,255,255,.14); background:rgba(11,6,31,.78); box-shadow:0 18px 45px rgba(0,0,0,.28); }
#academy-game-root .ttmc-solo-stage { display:grid; align-content:center; padding:clamp(22px,4vw,46px); overflow:auto; }
#academy-game-root .ttmc-solo-leaderboard { padding:20px; }
#academy-game-root .ttmc-solo-category-head { max-width:740px; margin:0 auto 24px; text-align:center; }
#academy-game-root .ttmc-solo-category-head > span,
#academy-game-root .ttmc-solo-turn-head > span,
#academy-game-root .ttmc-solo-results-kicker { color:var(--ttmc-yellow); font-size:11px; font-weight:1000; letter-spacing:1.7px; text-transform:uppercase; }
#academy-game-root .ttmc-solo-category-head h1,
#academy-game-root .ttmc-solo-turn-head h1 { margin:7px 0; color:#fff; font-size:clamp(27px,4vw,48px); font-weight:1000; line-height:.98; letter-spacing:-1.2px; }
#academy-game-root .ttmc-solo-category-head p,
#academy-game-root .ttmc-solo-turn-head p { margin:0; color:#cfc8e3; font-size:14px; font-weight:750; }
#academy-game-root .ttmc-solo-categories { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
#academy-game-root button.ttmc-solo-category { min-height:88px; padding:15px; border:2px solid rgba(255,255,255,.16); background:#211440; color:#fff; font-size:15px; font-weight:1000; text-align:left; box-shadow:6px 6px 0 rgba(8,195,215,.34); transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
#academy-game-root button.ttmc-solo-category span,
#academy-game-root button.ttmc-solo-category small { display:block; }
#academy-game-root button.ttmc-solo-category small { margin-top:5px; color:#d9d2eb; font-size:10px; font-weight:800; line-height:1.25; }
#academy-game-root button.ttmc-solo-category::after { content:'CHOISIR'; display:block; margin-top:8px; color:var(--ttmc-mint); font-size:9px; letter-spacing:1px; }
#academy-game-root button.ttmc-solo-category.is-passion { background:linear-gradient(145deg,#2b1758,#17143a); border-color:rgba(255,59,167,.55); box-shadow:6px 6px 0 rgba(255,59,167,.28); }
#academy-game-root button.ttmc-solo-category.is-passion small { color:#f3c8e2; }
#academy-game-root button.ttmc-solo-category:hover,
#academy-game-root button.ttmc-solo-category:focus-visible { border-color:var(--ttmc-yellow); box-shadow:8px 8px 0 var(--ttmc-pink); transform:translate(-2px,-2px) rotate(-.5deg); }
#academy-game-root .ttmc-solo-edition-status { margin:16px auto 0; color:#d8d2e9; font-size:12px; font-weight:850; text-align:center; }
#academy-game-root .ttmc-solo-edition-status.is-error { color:#ffb7ca; }

#academy-game-root .ttmc-solo-turn-head { margin-bottom:24px; text-align:center; }
#academy-game-root .ttmc-solo-wagers { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
#academy-game-root button.ttmc-solo-wager { min-height:102px; padding:12px 8px; border:2px solid rgba(255,255,255,.16); background:#211440; color:#fff; text-align:center; box-shadow:4px 4px 0 rgba(0,0,0,.25); transition:transform .14s ease,box-shadow .14s ease,background .14s ease; }
#academy-game-root button.ttmc-solo-wager b,
#academy-game-root button.ttmc-solo-wager span,
#academy-game-root button.ttmc-solo-wager small { display:block; }
#academy-game-root button.ttmc-solo-wager b { color:var(--ttmc-yellow); font-size:32px; font-weight:1000; line-height:1; }
#academy-game-root button.ttmc-solo-wager span { margin-top:7px; font-size:10px; font-weight:1000; letter-spacing:.7px; text-transform:uppercase; }
#academy-game-root button.ttmc-solo-wager small { margin-top:5px; color:#bcb4d8; font-size:9px; font-weight:850; }
#academy-game-root button.ttmc-solo-wager.tier-2 { border-color:rgba(8,195,215,.58); }
#academy-game-root button.ttmc-solo-wager.tier-3 { border-color:rgba(255,216,61,.7); }
#academy-game-root button.ttmc-solo-wager.tier-4 { border-color:rgba(255,59,167,.72); }
#academy-game-root button.ttmc-solo-wager:hover,
#academy-game-root button.ttmc-solo-wager:focus-visible { background:var(--ttmc-purple); box-shadow:6px 6px 0 var(--ttmc-pink); transform:translate(-2px,-2px); }

#academy-game-root .ttmc-solo-question-meta { display:flex; justify-content:center; gap:8px; margin-bottom:18px; }
#academy-game-root .ttmc-solo-question-meta span { padding:7px 10px; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.05); color:#d8d2e9; font-size:11px; font-weight:900; }
#academy-game-root .ttmc-solo-question { margin-bottom:22px; color:#fff; font-size:clamp(27px,4vw,48px); font-weight:1000; line-height:1.1; text-align:center; }
#academy-game-root .ttmc-solo-answers { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; max-width:720px; width:100%; margin:auto; }
#academy-game-root button.ttmc-solo-answer { min-height:62px; border:2px solid rgba(8,195,215,.55); background:#181132; color:#fff; font-size:17px; font-weight:950; box-shadow:5px 5px 0 rgba(8,195,215,.22); }
#academy-game-root button.ttmc-solo-answer:hover,
#academy-game-root button.ttmc-solo-answer:focus-visible { border-color:var(--ttmc-yellow); background:#2b1855; box-shadow:7px 7px 0 var(--ttmc-pink); }
#academy-game-root .ttmc-solo-reveal { display:grid; place-items:center; min-height:260px; padding:34px; border:3px solid currentColor; text-align:center; box-shadow:10px 10px 0 rgba(0,0,0,.24); animation:ttmcSoloReveal .28s cubic-bezier(.2,.8,.2,1) both; }
#academy-game-root .ttmc-solo-reveal.is-correct { color:var(--ttmc-mint); background:rgba(4,91,72,.28); }
#academy-game-root .ttmc-solo-reveal.is-wrong { color:#ff759b; background:rgba(113,10,55,.26); }
#academy-game-root .ttmc-solo-reveal b { font-size:clamp(28px,5vw,58px); font-weight:1000; line-height:1; }
#academy-game-root .ttmc-solo-reveal span { margin-top:12px; color:#fff; font-size:17px; font-weight:900; }

#academy-game-root .ttmc-solo-leaderboard h2 { margin:0; color:#fff; font-size:20px; font-weight:1000; }
#academy-game-root .ttmc-solo-board-category { margin:4px 0 15px; color:var(--ttmc-cyan); font-size:11px; font-weight:950; text-transform:uppercase; }
#academy-game-root .ttmc-solo-leaderboard ol { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
#academy-game-root .ttmc-solo-leaderboard li { display:grid; grid-template-columns:28px minmax(0,1fr) auto; align-items:center; gap:8px; min-height:38px; padding:7px 9px; border:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.045); }
#academy-game-root .ttmc-solo-rank { display:grid; place-items:center; width:24px; height:24px; background:var(--ttmc-purple); color:#fff; font-size:10px; font-weight:1000; transform:rotate(-3deg); }
#academy-game-root .ttmc-solo-pseudonym { overflow:hidden; color:#f4f0ff; font-size:12px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
#academy-game-root .ttmc-solo-leaderboard li > b { color:var(--ttmc-yellow); font-size:16px; font-weight:1000; }
#academy-game-root .ttmc-solo-personal-best { margin-top:13px; padding:10px; background:linear-gradient(135deg,var(--ttmc-yellow),#ff9f43); color:var(--ttmc-ink); font-size:12px; font-weight:900; text-align:center; }
#academy-game-root .ttmc-solo-empty { color:#bcb4d8; font-size:12px; font-weight:750; line-height:1.45; }

#academy-game-root .ttmc-solo-results { position:relative; max-width:920px; border:2px solid rgba(255,216,61,.5); background:linear-gradient(145deg,#160d2e,#0b1b32); box-shadow:12px 12px 0 rgba(255,59,167,.25); }
#academy-game-root .ttmc-solo-results-copy { color:#d7d0e9; font-size:15px; font-weight:750; }
#academy-game-root .ttmc-solo-results-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:20px 0; }
#academy-game-root .ttmc-solo-results-summary > div { padding:15px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); }
#academy-game-root .ttmc-solo-results-summary span { display:block; color:#bcb4d8; font-size:10px; font-weight:950; text-transform:uppercase; }
#academy-game-root .ttmc-solo-results-summary b { display:block; margin-top:4px; color:var(--ttmc-yellow); font-size:27px; font-weight:1000; }
#academy-game-root .ttmc-solo-record-callout,
#academy-game-root .ttmc-solo-learning-summary,
#academy-game-root .ttmc-solo-save-state { margin:12px 0; padding:12px 14px; border-left:4px solid var(--ttmc-cyan); background:rgba(8,195,215,.09); color:#eefcff; font-size:13px; font-weight:850; }
#academy-game-root .ttmc-solo-learning-summary b,
#academy-game-root .ttmc-solo-learning-summary span { display:block; }
#academy-game-root .ttmc-solo-learning-summary small { display:block; margin-top:6px; color:#cec6e3; font-size:11px; font-weight:800; line-height:1.35; }
#academy-game-root .ttmc-solo-learning-summary span { margin-top:4px; color:#cdeef2; font-size:12px; }
#academy-game-root .ttmc-solo-record-callout.is-record { border-left-color:var(--ttmc-yellow); background:rgba(255,216,61,.11); }
#academy-game-root .ttmc-solo-results-leaderboard { margin:14px 0; }

@keyframes ttmcSoloReveal { from{opacity:0;transform:scale(.94) rotate(-1deg)} to{opacity:1;transform:scale(1) rotate(0)} }

@media (max-width:900px) {
  #academy-game-root .ttmc-solo-layout { grid-template-columns:1fr; }
  #academy-game-root .ttmc-solo-leaderboard { min-height:0; }
  #academy-game-root .ttmc-solo-leaderboard ol { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  #academy-game-root .ttmc-solo-wrap { padding:10px; overflow:auto; }
  #academy-game-root .ttmc-solo-topbar { flex-wrap:wrap; gap:10px; }
  #academy-game-root .ttmc-solo-brand { min-width:0; flex:1; }
  #academy-game-root .ttmc-solo-brand > span { width:42px; height:42px; font-size:22px; }
  #academy-game-root .ttmc-solo-brand b { font-size:15px; line-height:1.05; }
  #academy-game-root .ttmc-solo-rule { order:3; flex-basis:100%; padding:7px; background:rgba(255,255,255,.05); }
  #academy-game-root .ttmc-solo-hud { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  #academy-game-root .ttmc-solo-start-rule { display:grid; align-content:center; min-height:58px; padding:6px 3px; text-align:center; }
  #academy-game-root .ttmc-solo-start-rule b { font-size:22px; }
  #academy-game-root .ttmc-solo-start-rule span { font-size:8px; }
  #academy-game-root .ttmc-solo-score,
  #academy-game-root .ttmc-solo-category-chip,
  #academy-game-root .ttmc-solo-misses { min-height:58px; padding:6px; }
  #academy-game-root .ttmc-solo-score { gap:6px; }
  #academy-game-root .ttmc-solo-score b { font-size:25px; }
  #academy-game-root .ttmc-solo-category-chip { font-size:10px; }
  #academy-game-root .ttmc-solo-misses { display:grid; gap:3px; text-align:center; }
  #academy-game-root .ttmc-solo-misses div { justify-content:center; font-size:15px; }
  #academy-game-root .ttmc-solo-layout { min-height:0; }
  #academy-game-root .ttmc-solo-stage { padding:22px 14px; overflow:visible; }
  #academy-game-root .ttmc-solo-wrap[data-ttmc-phase="category"] .ttmc-solo-leaderboard { display:none; }
  #academy-game-root .ttmc-solo-categories { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #academy-game-root .ttmc-solo-wagers { grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; }
  #academy-game-root button.ttmc-solo-wager { min-height:76px; padding:7px 2px; }
  #academy-game-root button.ttmc-solo-wager b { font-size:24px; }
  #academy-game-root button.ttmc-solo-wager span { font-size:6.5px; letter-spacing:0; }
  #academy-game-root button.ttmc-solo-wager small { display:none; }
  #academy-game-root .ttmc-solo-question-meta { flex-wrap:wrap; }
  #academy-game-root .ttmc-solo-answers { grid-template-columns:1fr; }
  #academy-game-root .ttmc-solo-leaderboard ol { grid-template-columns:1fr; }
  #academy-game-root .ttmc-solo-results-summary { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  #academy-game-root button.ttmc-solo-category,
  #academy-game-root button.ttmc-solo-wager { transition:none; }
  #academy-game-root .ttmc-solo-reveal { animation:none; }
}


/* ⚠️ CE BLOC EST VOLONTAIREMENT LE DERNIER DU FICHIER.
   Place plus haut, il perdait : des regles de MEME specificite le
   redeclaraient plus bas (lignes ~8709 et ~8717), et en CSS, a
   specificite egale, c'est la DERNIERE qui gagne. Deux de mes tailles
   restaient donc a 7px en silence, et seule une mesure dans la page l'a
   montre : le fichier ne se lit pas de haut en bas. */
/* ==========================================================================
   LE MENU SE LIT ENFIN. Ajoute le 2026-08-24, sur une question de Pat.

   ⛔ MESURE AVANT, a 1440x900 : sur 66 textes visibles, 54 faisaient MOINS DE
   12px, 37 moins de 10px, et le plus petit 5px. Sur telephone c'etait pire :
   le nom d'une matiere faisait 7px, les boutons de vitesse 6px, et la SEULE
   phrase qui dit a l'enfant comment jouer, « CLIQUE UN TERRAIN POUR
   COMMENCER », faisait 5,5px.
   Pendant ce temps, des que la partie demarre, tout est a 17-18px.
   Le menu etait un tableau de bord d'adulte, le jeu est fait pour un enfant,
   et l'enfant traversait les deux.

   ⛔ CE QUE J'AI REFUSE DE FAIRE, ET POURQUOI. Remonter tout le fichier d'un
   cran cassait la console : mesure, le nom des matieres se tronquait des 10px
   sur telephone, et passer les tuiles a 2 colonnes pour gagner de la place
   faisait SORTIR les deux dernieres de leur cadre. La console a une hauteur
   fixe : on ne peut pas grossir sans rendre de la place ailleurs.
   ➡️ On remonte donc ce qu'un enfant DOIT lire, jusqu'a la limite que chaque
   largeur peut porter, et pas un pixel de plus. Chaque bande a ete trouvee en
   essayant des valeurs dans la page et en comptant les troncatures, jamais a
   l'oeil.

   MESURE APRES, textes sous 9px, et hauteur de page :
     375px   36 -> 15   plus petit 4px -> 7px    hauteur 820px, inchangee
     768px   27 ->  6   plus petit 5px -> 8px    hauteur 1032px, inchangee
     1440px  27 ->  3   plus petit 5px -> 8px    hauteur 908px, inchangee
   ZERO texte tronque en plus, a toutes les largeurs, avant comme apres.
   ========================================================================== */
#academy-game-root .aca-command-auto-hint { font-size: 12px; letter-spacing: .2px; }
#academy-game-root .aca-command-mode-copy strong { font-size: 12px; }
#academy-game-root .aca-command-mode-copy small { font-size: 9px; }
#academy-game-root button.aca-command-speed-btn { font-size: 10px; }
#academy-game-root .aca-command-speed-picker > small { font-size: 9px; }
#academy-game-root .aca-command-speed-detail { font-size: 9px; }
#academy-game-root button.aca-command-tab { font-size: 11px; }
#academy-game-root .aca-command-section-title { font-size: 11px; }
#academy-game-root .aca-command-mission-copy strong { font-size: 12px; }
#academy-game-root .aca-command-mission-copy small { font-size: 9px; }
#academy-game-root .aca-command-mission-copy em { font-size: 9px; }
#academy-game-root .aca-command-mission-progress b { font-size: 9px; }
#academy-game-root .aca-command-mission-reward i { font-size: 8px; }
#academy-game-root button.aca-command-mode > b { font-size: 8px; }
#academy-game-root .aca-command-control small { font-size: 9px; }
#academy-game-root .aca-command-bonus { font-size: 9px; }
#academy-game-root .aca-command-board-note { font-size: 9px; }

/* Tablette : le panneau du haut doit rendre de la place a la vitesse, sinon
   « Difficile » se coupe. La vignette du mode retrecit un peu pour payer.
   Le libelle de recompense reste a 8px : le tableau du jour fait 256px ici. */
@media (min-width: 701px) and (max-width: 899px) {
  #academy-game-root .aca-command-selected { grid-template-columns: 88px minmax(0, 1fr) 172px; }
  #academy-game-root .aca-command-selected-art { width: 78px; height: 78px; font-size: 40px; }
  #academy-game-root .aca-command-mission-copy em { font-size: 8px; }
}

/* Telephone : la tuile ne peut PAS porter 12px. Mesure a 375px sur 3 colonnes,
   le nom tient jusqu'a 9px et se coupe a 10px. On s'arrete donc a 9px, ce qui
   reste 29% de plus qu'avant. La phrase qui explique comment jouer, elle,
   passe de 5,5px a 11px : c'est celle qui compte le plus. */
@media (max-width: 700px) {
  #academy-game-root .aca-command-auto-hint { font-size: 11px; letter-spacing: .2px; }
  #academy-game-root .aca-command-mode-copy strong { font-size: 9px; }
  #academy-game-root .aca-command-mode-copy small { font-size: 8px; }
  #academy-game-root button.aca-command-speed-btn { font-size: 9px; }
  #academy-game-root .aca-command-speed-picker > small { font-size: 8px; }
  #academy-game-root .aca-command-speed-detail { font-size: 7px; }
  #academy-game-root button.aca-command-tab { font-size: 10px; }
  #academy-game-root .aca-command-section-title { font-size: 10px; }
  #academy-game-root .aca-command-mission-copy strong { font-size: 11px; }
  #academy-game-root .aca-command-mission-copy small { font-size: 8px; }
  #academy-game-root .aca-command-mission-copy em { font-size: 8px; }
}

/* Tres petits telephones. Le nom d'une matiere ne rentre pas a 9px sous 375px :
   mesure, « Orthographe » et « Conjugaison » se coupent des 360px, et a 320px
   il faut redescendre a 7px, soit la taille d'origine. On ne gagne rien la, mais
   ON NE PERD RIEN NON PLUS : a 320px le compte de textes coupes est exactement
   celui d'avant, 2, et pas un de plus. */
@media (max-width: 374px) {
  #academy-game-root .aca-command-mode-copy strong { font-size: 8px; }
}
@media (max-width: 340px) {
  #academy-game-root .aca-command-mode-copy strong { font-size: 7px; }
}

/* --------------------------------------------------------------------------
   RYTHME : COMPETITIF ou REGULIER. Ajoute le 2026-08-24, demande de Pat.

   Les deux boutons reprennent le style de la vitesse (`aca-command-speed-btn`)
   pour que l'enfant lise les deux rangees comme une seule famille de reglages.
   Seule la grille change : 2 colonnes au lieu de 3, sinon les deux boutons
   occuperaient deux tiers de la largeur et le troisieme tiers resterait un
   trou que personne ne sait expliquer.
   -------------------------------------------------------------------------- */
#academy-game-root .aca-command-rythme-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 4px;
}
#academy-game-root .aca-command-rythme-options[hidden] { display: none; }
