/* Drazonia — corrections responsive ADDITIVES (chargees en dernier).
   Ne reecrit pas les media queries existantes ; complete-les.
   Cibles : zero debordement horizontal, texte lisible, cibles tactiles >=44px,
   coupe hover/effets lourds au tactile. */

/* ── Garde-fou global anti-debordement ── */
html, body { max-width: 100%; }
img, canvas, svg, video { max-width: 100%; }

/* ════════ TABLETTE / PETIT ECRAN (<= 760px) ════════ */
@media (max-width: 760px) {
  /* Lecteur audio : ne pas chevaucher le bord, place sous le pouce */
  .aplayer {
    right: 12px;
    left: 12px;
    width: auto;
    max-width: none;
    bottom: 84px;
  }
  .apl-toggle { bottom: 18px; right: 18px; }

  /* Barre live Twitch : titre tronque proprement */
  .tl-title { max-width: 150px; }
}

/* ════════ TELEPHONE (<= 600px) ════════ */
@media (max-width: 600px) {
  /* Corps lisible */
  body { font-size: 16px; }

  /* Padding de page allege */
  .wrap { padding: 0 18px; }
  .ap, .mc, .rs, .hero { padding-left: 18px; padding-right: 18px; }

  /* Titres qui ne cassent pas */
  .hero-title { word-break: normal; overflow-wrap: anywhere; line-height: 1.05; }
  .stitle { overflow-wrap: anywhere; }

  /* Stats hero : aerer et centrer */
  .hero-stats { gap: 22px 28px; margin-top: 44px; }

  /* Cibles tactiles >= 44px sur la nav repliee */
  .nav.open .nav-btn { min-height: 46px; display: flex; align-items: center; }
  .nav-ham { width: 44px; height: 44px; }
  .nav-logo { padding: 9px 12px; }

  /* Spills / tags : pleine largeur de la rangee, pas de debordement */
  .p-socials .spill { min-height: 40px; }

  /* Planning : 7 colonnes serrees -> pastilles + petites, gap reduit, jamais de debordement */
  .sched { gap: 4px; }
  .dd { width: 26px; height: 26px; }
  .dn { font-size: 8px; letter-spacing: .04em; }

  /* Grille jeux : 1 colonne propre */
  .gg { grid-template-columns: 1fr; }
  .gico { width: 60px; height: 60px; }

  /* Reseaux : 1 colonne, cartes plus tactiles */
  .rs-grid { grid-template-columns: 1fr; }
  .rs-grid .sc { min-height: 44px; }

  /* Bloc IP Minecraft : empile pour ne pas deborder a 360px */
  .ip-box { flex-wrap: wrap; max-width: none; }
  .ip-lbl { width: 100%; border-right: none; border-bottom: 1px solid rgba(6,214,160,.14); }
  .ip-val { min-width: 0; word-break: break-all; }
  .ip-copy { min-height: 44px; }

  /* Boutons CTA : confort tactile */
  .btn-p, .btn-g { padding: 14px 24px; }

  /* Con-Fig : empile cle/valeur pour ne jamais deborder a 360px */
  .config-list li { flex-wrap: wrap; }
  .config-key { min-width: 0; flex-basis: 100%; }

  /* Footer : ne touche pas le lecteur flottant */
  .foot { padding-bottom: 96px; }

  /* Mini-grille de blocs Minecraft : ne deborde pas */
  .mc-blks { grid-template-columns: repeat(8, 1fr); }
  .mc-vis { width: 100%; }
}

/* ════════ TRES PETIT (<= 380px) ════════ */
@media (max-width: 380px) {
  .nav-logo { font-size: 13px; }
  .sched { gap: 3px; }
  .dd { width: 24px; height: 24px; }
  .hero-stats { gap: 18px 22px; }
}

/* ════════ TACTILE : coupe hover-only / effets lourds ════════ */
@media (hover: none), (pointer: coarse) {
  /* Neutralise les transforms/box-shadows declenches au survol (inutiles, parfois debordants) */
  .card:hover,
  .btn-p:hover,
  .btn-g:hover,
  .spill:hover,
  .blk:hover,
  .gchip:hover .gico,
  .apl-play:hover,
  .apl-toggle:hover,
  .nav-btn:hover,
  .sc:hover {
    transform: none;
  }

  /* Cibles tactiles minimales partout ou ca compte */
  .nav-btn, .spill, .ptag, .ip-copy, .apl-play, .apl-mute, .apl-close,
  .apl-toggle, .ft-navlink, .nav-logo {
    min-height: 44px;
  }
  .nav-btn, .spill, .ip-copy, .ft-navlink {
    display: inline-flex;
    align-items: center;
  }

  /* Allege les particules d'ambiance (perf batterie sur mobile) */
  #ptcl { opacity: .55; }
}