/* ============================================================
   v99-polish-pass.css  (claude-polishpass-1)  [2026-06-30]
   PASSE POLISH UI #1 — cohérence visuelle (issu de l'audit fluidité/polish).
   100% additif, chargé EN DERNIER → gagne la spécificité. Aucune logique JS.
   Items sûrs & visibles : underline doré sous les titres de section, cartes
   d'inventaire/marché plus lisibles, bouton soin avec hover, anti-débordement
   mobile des barres de nav. (Items à risque — boutons combat, onglets actifs
   dynamiques — laissés pour une passe ciblée.)
   ============================================================ */

/* ── 1. Trait doré→violet sous les titres de section (finition « premium ») ── */
.section-luxe-title { position: relative; }
.section-luxe-title::after {
  content: '';
  display: block;
  width: 64px; height: 2px;
  margin: 9px auto 0;
  background: linear-gradient(90deg, transparent, #ffd700 30%, #c97cff 70%, transparent);
  border-radius: 2px;
  opacity: 0.9;
}

/* ── 2. Cartes d'inventaire : bordure un peu plus présente (raretés faibles ~invisibles avant) ── */
#inventory-grid .invp-card { border-width: 1.5px !important; }

/* ── 3. Cartes du Marché (équip/familiers/sorts/gemmes) : bordure + ombre cohérentes + hover ── */
#market-screen .grid-3 > div {
  border: 1.5px solid rgba(201,180,255,0.18) !important;
  box-shadow: 0 5px 16px rgba(0,0,0,0.42) !important;
  border-radius: 14px !important;
  transition: transform .15s ease, box-shadow .2s, border-color .2s !important;
}
@media (hover: hover) {
  #market-screen .grid-3 > div:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 26px rgba(0,0,0,0.55) !important;
    border-color: rgba(255,215,0,0.35) !important;
  }
}

/* ── 4. Bouton « Se soigner » (style inline, sans hover avant) ── */
#heal-screen button[onclick*="fullHealWithDialogue"] {
  border: 2px solid rgba(255,85,119,0.45) !important;
  border-radius: 12px !important;
  transition: transform .14s ease, box-shadow .2s, filter .2s !important;
}
@media (hover: hover) {
  #heal-screen button[onclick*="fullHealWithDialogue"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(255,85,119,0.4) !important;
    filter: brightness(1.08);
  }
}
#heal-screen button[onclick*="fullHealWithDialogue"]:active { transform: translateY(0) scale(0.98); }

/* ── 5. Anti-débordement des barres de boutons de nav sur petit écran ── */
@media (max-width: 380px) {
  .nav-btn { padding: 8px 10px !important; font-size: 0.82em !important; }
}