/* ═══════════════════════════════════════════════════════════════
   DECORACIÓN ESTACIONAL — estilos del renderizador (OVDecoracion)
   L2: vista previa en /master · L3: las 6 páginas autenticadas.
   Solo transform/opacity (composición GPU, sin layout/paint).
   pointer-events:none en capa Y partículas es requisito DURO.
   ═══════════════════════════════════════════════════════════════ */

.ov-deco-capa {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 9999;
}

.ov-deco-p {
  position: absolute;
  pointer-events: none;
  width: var(--t);
  height: var(--t);
  left: var(--x);
  top: -70px;
  background: center / contain no-repeat;
  background-image: var(--img);
  will-change: transform, opacity;
}
.ov-deco-ascenso .ov-deco-p { top: auto; bottom: -70px; }
.ov-deco-brillo  .ov-deco-p { top: var(--y); opacity: .15; }
/* Partícula-emoji (L2.1): texto en vez de imagen; --t pasa a ser font-size */
.ov-deco-p.ov-deco-emoji { background: none; font-size: var(--t); line-height: 1; }

.ov-deco-caida .ov-deco-p {
  animation: ov-deco-caida var(--dur) linear var(--delay) infinite;
}
@keyframes ov-deco-caida {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(var(--deriva), calc(100vh + 140px), 0); }
}

.ov-deco-ascenso .ov-deco-p {
  animation: ov-deco-ascenso var(--dur) linear var(--delay) infinite;
}
@keyframes ov-deco-ascenso {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(var(--deriva), calc(-100vh - 140px), 0); }
}

.ov-deco-brillo .ov-deco-p {
  animation: ov-deco-brillo var(--dur) ease-in-out var(--delay) infinite;
}
@keyframes ov-deco-brillo {
  0%, 100% { opacity: .12; transform: scale(.7); }
  50%      { opacity: .95; transform: scale(1.1); }
}

/* Ráfaga: una sola pasada por carga; el JS retira cada partícula en su
   animationend y la capa entera cuando queda vacía. */
.ov-deco-rafaga .ov-deco-p {
  animation: ov-deco-rafaga var(--dur) ease-in var(--delay) 1 forwards;
}
@keyframes ov-deco-rafaga {
  from { transform: translate3d(0, 0, 0) rotate(0deg); opacity: 1; }
  to   { transform: translate3d(var(--deriva), calc(100vh + 140px), 0) rotate(540deg); opacity: .85; }
}

/* Pestaña oculta: respaldo por si el navegador no congela solo. */
.ov-deco-capa.ov-deco-pausada .ov-deco-p { animation-play-state: paused; }

/* reduced-motion: el JS no pinta caída/ascenso/ráfaga; el brillo queda
   pintado pero estático. */
@media (prefers-reduced-motion: reduce) {
  .ov-deco-capa .ov-deco-p { animation: none; }
  .ov-deco-brillo .ov-deco-p { opacity: .55; }
}

/* ── Banner (slot #ov-deco-banner: dashboard en L3; vista previa en /master).
   Imagen única 1600×220; en móvil se recorta con object-fit. ── */
.ov-deco-banner {
  display: none;
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  margin-bottom: 18px;
}
.ov-deco-banner.visible { display: block; }
.ov-deco-banner img {
  display: block;
  width: 100%;
  height: auto;
}
.ov-deco-banner-msg {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  text-align: center;
  color: #fff;
  font-family: var(--font-display, Georgia, 'Times New Roman', serif);
  font-size: clamp(17px, 2.6vw, 30px);
  text-shadow: 0 1px 10px rgba(0, 0, 0, .6);
  background: linear-gradient(rgba(0, 0, 0, .10), rgba(0, 0, 0, .28));
}
@media (max-width: 700px) {
  .ov-deco-banner img { height: 120px; object-fit: cover; }
  .ov-deco-banner-msg { font-size: 16px; }
}