/* Visualisation de carte 3D animée — panneau cinématique plein écran, thématisé.
   z-index 3990 : au-dessus des volets (deck/collection 3000, plein écran 3300, forge 3400,
   maintenance 3850, modaux 3950) mais sous le menu de thème (4000) et les dialogues (4100). */
#card3d-overlay{
  position:fixed; inset:0; z-index:3990; display:none;
  align-items:center; justify-content:center;
  background:#000;                       /* fond NOIR UNIFORME */
  opacity:0; transition:opacity .45s ease;
}
#card3d-overlay.on{ display:flex; opacity:1; }
#card3d-overlay.closing{ opacity:0; }

/* Le canvas WebGL remplit le panneau (dimensionné en JS via le devicePixelRatio). */
#card3d-canvas{ display:block; width:100%; height:100%; }

/* PLEIN ÉCRAN : la scène occupe toute la fenêtre. */
#card3d-stage{ position:relative; width:100vw; height:100vh; background:#000; }

/* Légende (nom de la carte) qui apparaît avec la révélation. */
#card3d-caption{
  position:absolute; left:0; right:0; bottom:4%; text-align:center; pointer-events:none;
  font-weight:700; font-size:clamp(16px,2.4vw,26px); letter-spacing:.02em;
  color:var(--txt); text-shadow:0 2px 14px rgba(0,0,0,.8);
  opacity:0; transition:opacity .8s ease; padding:0 16px;
}
#card3d-caption.show{ opacity:1; }

/* Bouton de fermeture (secours : le panneau se referme seul après l'animation). */
#card3d-close{
  position:absolute; top:14px; right:16px; z-index:2;
  background:rgba(0,0,0,.35); border:1px solid var(--line); color:var(--txt);
  width:38px; height:38px; border-radius:50%; font-size:22px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .15s ease, border-color .15s ease;
}
#card3d-close:hover{ background:var(--acc); color:var(--on-acc); border-color:var(--acc); }

/* Voile de secours si WebGL indisponible (message centré). */
#card3d-fallback{
  position:absolute; inset:0; display:none; align-items:center; justify-content:center;
  text-align:center; color:var(--mut); font-size:14px; padding:24px;
}
#card3d-overlay.no-webgl #card3d-fallback{ display:flex; }
#card3d-overlay.no-webgl #card3d-canvas{ display:none; }