/* ==========================================================================
   DRAKESCRAFT SEASONAL THEMES ENGINE
   Temas estacionales dinámicos:
   - Halloween (Octubre - Tártaro / Noche Perpetua)
   - Cumpleaños del Owner JackStar (Noviembre - Dorado Celestial / Star Sovereignty)
   - Navidad & Solsticio Hiemal (Diciembre - Enero - Corona de Bóreas / Frío Primordial)
   - San Valentín / Enamorados (Febrero - Afrodita / Rosa Carmesí & Alianzas)
   ========================================================================== */

/* ── 1. TEMA HALLOWEEN (Octubre) ────────────────────────────────── */
body.theme-halloween {
  --page-accent: #ff7700;
  --page-accent-soft: rgba(255, 119, 0, 0.22);
  --page-glow: rgba(255, 119, 0, 0.28);
  --store-accent-gold: #ff9900;
  --store-accent-purple: #c084fc;
  --store-card-border: rgba(255, 119, 0, 0.28);
  --store-card-hover: rgba(255, 119, 0, 0.55);
  background-color: #08040d !important;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(139, 92, 246, 0.16) 0%, transparent 45%),
    radial-gradient(circle at 85% 60%, rgba(255, 119, 0, 0.12) 0%, transparent 50%),
    radial-gradient(circle at 50% 90%, rgba(180, 20, 20, 0.10) 0%, transparent 40%) !important;
}

body.theme-halloween .seasonal-banner {
  background: linear-gradient(135deg, rgba(35, 10, 45, 0.95), rgba(75, 18, 20, 0.95));
  border: 2px solid #ff7700;
  box-shadow: 0 0 30px rgba(255, 119, 0, 0.25);
}

body.theme-halloween .seasonal-banner__btn {
  background: linear-gradient(135deg, #ff7700, #b30000);
  border: 1px solid #ffaa33;
  box-shadow: 0 4px 15px rgba(255, 119, 0, 0.4);
}

/* ── 2. TEMA CUMPLEAÑOS DEL OWNER / JACKSTAR (Noviembre) ───────── */
body.theme-birthday {
  --page-accent: #ffd700;
  --page-accent-soft: rgba(255, 215, 0, 0.24);
  --page-glow: rgba(255, 215, 0, 0.32);
  --gold: #ffd700;
  --store-accent-gold: #fbbf24;
  --store-accent-purple: #a855f7;
  --store-accent-cyan: #67e8f9;
  --store-card-border: rgba(255, 215, 0, 0.32);
  --store-card-hover: rgba(255, 215, 0, 0.65);
  background-color: #070612 !important;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255, 215, 0, 0.14) 0%, transparent 45%),
    radial-gradient(circle at 80% 50%, rgba(168, 85, 247, 0.14) 0%, transparent 50%),
    radial-gradient(circle at 50% 90%, rgba(245, 158, 11, 0.12) 0%, transparent 45%) !important;
}

body.theme-birthday .seasonal-banner {
  background: linear-gradient(135deg, rgba(28, 18, 5, 0.96), rgba(38, 15, 45, 0.96));
  border: 2px solid #ffd700;
  box-shadow: 0 0 35px rgba(255, 215, 0, 0.3);
}

body.theme-birthday .seasonal-banner__btn {
  background: linear-gradient(135deg, #ffd700, #b45309);
  color: #000 !important;
  font-weight: 800 !important;
  border: 1px solid #fef08a;
  box-shadow: 0 4px 20px rgba(255, 215, 0, 0.45);
}

/* ── 3. TEMA NAVIDAD & SOLSTICIO HIEMAL (Diciembre - Enero) ────── */
body.theme-christmas {
  --page-accent: #38bdf8;
  --page-accent-soft: rgba(56, 189, 248, 0.22);
  --page-glow: rgba(56, 189, 248, 0.35);
  --cyan: #38bdf8;
  --emerald: #34d399;
  --store-accent-cyan: #38bdf8;
  --store-accent-gold: #fef08a;
  --store-accent-purple: #818cf8;
  --store-card-border: rgba(56, 189, 248, 0.28);
  --store-card-hover: rgba(56, 189, 248, 0.6);
  background-color: #040814 !important;
  background-image:
    radial-gradient(circle at 15% 25%, rgba(56, 189, 248, 0.16) 0%, transparent 45%),
    radial-gradient(circle at 85% 65%, rgba(52, 211, 153, 0.12) 0%, transparent 50%),
    radial-gradient(circle at 50% 85%, rgba(129, 140, 248, 0.10) 0%, transparent 40%) !important;
}

body.theme-christmas .seasonal-banner {
  background: linear-gradient(135deg, rgba(8, 25, 45, 0.95), rgba(10, 38, 30, 0.95));
  border: 2px solid #38bdf8;
  box-shadow: 0 0 35px rgba(56, 189, 248, 0.28);
}

body.theme-christmas .seasonal-banner__btn {
  background: linear-gradient(135deg, #0284c7, #0f766e);
  color: #fff !important;
  border: 1px solid #7dd3fc;
  box-shadow: 0 4px 18px rgba(56, 189, 248, 0.4);
}

/* ── 4. TEMA SAN VALENTÍN / ENAMORADOS (Febrero) ───────────────── */
body.theme-valentines {
  --page-accent: #f43f5e;
  --page-accent-soft: rgba(244, 63, 94, 0.22);
  --page-glow: rgba(244, 63, 94, 0.3);
  --rose: #fb7185;
  --store-accent-purple: #f472b6;
  --store-accent-gold: #fbcfe8;
  --store-card-border: rgba(244, 63, 94, 0.28);
  --store-card-hover: rgba(244, 63, 94, 0.6);
  background-color: #0d040c !important;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(244, 63, 94, 0.15) 0%, transparent 45%),
    radial-gradient(circle at 85% 60%, rgba(217, 70, 239, 0.13) 0%, transparent 50%),
    radial-gradient(circle at 50% 90%, rgba(251, 113, 133, 0.09) 0%, transparent 40%) !important;
}

body.theme-valentines .seasonal-banner {
  background: linear-gradient(135deg, rgba(45, 10, 25, 0.96), rgba(35, 8, 38, 0.96));
  border: 2px solid #f43f5e;
  box-shadow: 0 0 35px rgba(244, 63, 94, 0.3);
}

body.theme-valentines .seasonal-banner__btn {
  background: linear-gradient(135deg, #e11d48, #9333ea);
  color: #fff !important;
  border: 1px solid #fda4af;
  box-shadow: 0 4px 18px rgba(244, 63, 94, 0.45);
}

/* ── ESTRUCTURA UNIVERSAL DEL BANNER ESTACIONAL ────────────────── */
.seasonal-banner {
  border-radius: 14px;
  padding: 22px 28px;
  margin-bottom: 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}

.seasonal-banner::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.05) 0%, transparent 60%);
  pointer-events: none;
}

.seasonal-banner__content {
  display: flex;
  align-items: center;
  gap: 18px;
  z-index: 1;
}

.seasonal-banner__icon {
  font-size: 2.8rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.seasonal-banner__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 6px;
}

.seasonal-banner__badge-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
}

.seasonal-banner__title {
  margin: 0;
  font-size: 1.45rem;
  color: #fff;
  font-family: 'Space Grotesk', var(--font-heading), sans-serif;
  letter-spacing: -0.01em;
}

.seasonal-banner__desc {
  margin: 4px 0 0;
  color: #d0c0d8;
  font-size: 0.92rem;
  max-width: 650px;
  line-height: 1.5;
}

.seasonal-banner__btn {
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 10px;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.2s, box-shadow 0.2s;
  z-index: 1;
}

.seasonal-banner__btn:hover {
  transform: translateY(-2px);
}

/* ── SELECTOR FLOTANTE / FOOTER DE TEMAS ESTACIONALES ─────────── */
.seasonal-theme-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 4px 10px;
  border-radius: 16px;
  font-size: 0.75rem;
  color: var(--muted);
  cursor: pointer;
  transition: all 0.2s;
}

.seasonal-theme-pill:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

/* ── ESTILOS ESPECÍFICOS PARA LA PÁGINA PRINCIPAL (HOME PAGE) ────── */
body.theme-halloween.home-page,
body.theme-halloween .home-page {
  --home-bg: #090410 !important;
  --home-gold: #ff7700 !important;
  --home-cream: #f5e6fb !important;
  --home-line: rgba(255, 119, 0, 0.18) !important;
}

body.theme-halloween .home-hero__veil {
  background:
    linear-gradient(90deg, rgba(16, 5, 24, 0.97) 0%, rgba(32, 8, 42, 0.88) 48%, rgba(45, 12, 18, 0.55) 85%),
    linear-gradient(0deg, #090410 0%, transparent 25%, rgba(0, 0, 0, 0.45) 100%) !important;
}

body.theme-halloween .home-tech-pill {
  background: rgba(255, 119, 0, 0.16) !important;
  border-color: rgba(255, 119, 0, 0.45) !important;
  color: #ffaa33 !important;
}

body.theme-halloween .live-dot-mini {
  background: #ff7700 !important;
  box-shadow: 0 0 10px #ff7700 !important;
}

body.theme-halloween .title-glow {
  color: #ff7700 !important;
  text-shadow: 0 0 28px rgba(255, 119, 0, 0.65) !important;
}

body.theme-halloween .home-cta-store {
  background: linear-gradient(135deg, rgba(255, 119, 0, 0.35) 0%, rgba(139, 92, 246, 0.35) 50%, rgba(35, 10, 45, 0.95) 100%) !important;
  border-color: #ff7700 !important;
  box-shadow: 0 0 28px rgba(255, 119, 0, 0.35), inset 0 0 16px rgba(255, 119, 0, 0.15) !important;
}

body.theme-halloween .home-cta-store:hover {
  box-shadow: 0 0 35px rgba(255, 119, 0, 0.6), inset 0 0 20px rgba(255, 119, 0, 0.25) !important;
  border-color: #ffaa33 !important;
}

body.theme-halloween .cta-store-tag {
  color: #ffaa33 !important;
}

body.theme-halloween .nav-store-btn {
  background: linear-gradient(135deg, #ff7700, #b30000) !important;
  border-color: #ffaa33 !important;
  box-shadow: 0 0 16px rgba(255, 119, 0, 0.45) !important;
}

body.theme-halloween .site-nav__links a.active {
  color: #ff7700 !important;
  border-bottom-color: #ff7700 !important;
}

/* Home overrides para Cumpleaños del Owner */
body.theme-birthday.home-page,
body.theme-birthday .home-page {
  --home-bg: #070612 !important;
  --home-gold: #ffd700 !important;
  --home-cream: #fefce8 !important;
}

body.theme-birthday .title-glow {
  color: #ffd700 !important;
  text-shadow: 0 0 30px rgba(255, 215, 0, 0.7) !important;
}

body.theme-birthday .home-cta-store {
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.35) 0%, rgba(168, 85, 247, 0.35) 50%, rgba(28, 18, 5, 0.95) 100%) !important;
  border-color: #ffd700 !important;
  box-shadow: 0 0 30px rgba(255, 215, 0, 0.35) !important;
}

/* Home overrides para Navidad / Solsticio Hiemal */
body.theme-christmas.home-page,
body.theme-christmas .home-page {
  --home-bg: #040814 !important;
  --home-gold: #38bdf8 !important;
  --home-cream: #f0f9ff !important;
}

body.theme-christmas .title-glow {
  color: #38bdf8 !important;
  text-shadow: 0 0 30px rgba(56, 189, 248, 0.7) !important;
}

body.theme-christmas .home-cta-store {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.35) 0%, rgba(52, 211, 153, 0.3) 50%, rgba(8, 25, 45, 0.95) 100%) !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.35) !important;
}

/* Home overrides para San Valentín */
body.theme-valentines.home-page,
body.theme-valentines .home-page {
  --home-bg: #0d040c !important;
  --home-gold: #f43f5e !important;
  --home-cream: #fff1f2 !important;
}

body.theme-valentines .title-glow {
  color: #f43f5e !important;
  text-shadow: 0 0 30px rgba(244, 63, 94, 0.7) !important;
}

body.theme-valentines .home-cta-store {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.35) 0%, rgba(217, 70, 239, 0.3) 50%, rgba(45, 10, 25, 0.95) 100%) !important;
  border-color: #f43f5e !important;
  box-shadow: 0 0 30px rgba(244, 63, 94, 0.35) !important;
}


/*  TELARANAS EN ESQUINAS SUPERIORES PARA TODAS LAS PAGINAS EN HALLOWEEN  */
body.theme-halloween::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 170px;
  height: 170px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='none' stroke='rgba(255,119,0,0.38)' stroke-width='1.2' d='M0,0 L100,0 M0,0 L0,100 M0,0 L85,85 M0,0 L45,95 M0,0 L95,45 M0,20 Q20,20 20,0 M0,40 Q40,40 40,0 M0,60 Q60,60 60,0 M0,80 Q80,80 80,0'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 99999;
  opacity: 0.85;
}

body.theme-halloween::after {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  width: 170px;
  height: 170px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='none' stroke='rgba(255,119,0,0.38)' stroke-width='1.2' d='M100,0 L0,0 M100,0 L100,100 M100,0 L15,85 M100,0 L55,95 M100,0 L5,45 M100,20 Q80,20 80,0 M100,40 Q60,40 60,0 M100,60 Q40,60 40,0 M100,80 Q20,80 20,0'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 99999;
  opacity: 0.85;
}

/*  ACENTOS Y TARJETAS EN TODAS LAS PAGINAS (GUIAS, COMANDOS, SLIMEFUN, TIENDA)  */
body.theme-halloween .guide-card,
body.theme-halloween .rank-card,
body.theme-halloween .metric-card,
body.theme-halloween .store-card,
body.theme-halloween .card,
body.theme-halloween .accordion__item {
  border-color: rgba(255, 119, 0, 0.28) !important;
}

body.theme-halloween .guide-card:hover,
body.theme-halloween .rank-card:hover,
body.theme-halloween .store-card:hover,
body.theme-halloween .card:hover {
  border-color: rgba(255, 119, 0, 0.65) !important;
  box-shadow: 0 8px 32px rgba(255, 119, 0, 0.2) !important;
}

body.theme-halloween .site-nav {
  border-bottom: 1px solid rgba(255, 119, 0, 0.25) !important;
}


/* ==========================================================================
   REGLAS MAESTRAS DE HALLOWEEN PARA TODAS LAS PAGINAS DEL SITIO
   (Tienda, Metricas, Guias, Comandos, Rangos, Slimefun, Apoya, Soporte)
   ========================================================================== */

/* 1. TIENDA (store.html) EN HALLOWEEN */
body.theme-halloween.store-theme,
body.theme-halloween[data-page="store"],
body.theme-halloween .store-theme {
  --store-bg: #08040d !important;
  --store-card-bg: rgba(24, 12, 32, 0.85) !important;
  --store-card-border: rgba(255, 119, 0, 0.32) !important;
  --store-card-hover: rgba(255, 119, 0, 0.65) !important;
  --store-accent-gold: #ffaa33 !important;
  --store-accent-purple: #c084fc !important;
  background-color: #08040d !important;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(139, 92, 246, 0.18) 0%, transparent 45%),
    radial-gradient(circle at 85% 60%, rgba(255, 119, 0, 0.16) 0%, transparent 50%),
    radial-gradient(circle at 50% 90%, rgba(180, 20, 20, 0.12) 0%, transparent 40%) !important;
}

body.theme-halloween .store-hero-modern {
  border-bottom: 1px solid rgba(255, 119, 0, 0.25) !important;
}

body.theme-halloween .store-hero-modern .badge-editorial,
body.theme-halloween .store-pill {
  background: rgba(255, 119, 0, 0.16) !important;
  border-color: rgba(255, 119, 0, 0.45) !important;
  color: #ffaa33 !important;
}

body.theme-halloween .store-pill.active {
  background: linear-gradient(135deg, #ff7700, #b30000) !important;
  color: #fff !important;
  border-color: #ffaa33 !important;
  box-shadow: 0 0 16px rgba(255, 119, 0, 0.5) !important;
}

body.theme-halloween .store-card {
  background: rgba(22, 10, 30, 0.8) !important;
  border: 1px solid rgba(255, 119, 0, 0.25) !important;
}

body.theme-halloween .store-card:hover {
  border-color: #ff7700 !important;
  box-shadow: 0 8px 30px rgba(255, 119, 0, 0.25), 0 0 15px rgba(255, 119, 0, 0.15) !important;
}

body.theme-halloween .store-card__btn {
  background: linear-gradient(135deg, #ff7700, #b30000) !important;
  border-color: #ffaa33 !important;
  box-shadow: 0 4px 15px rgba(255, 119, 0, 0.35) !important;
}

body.theme-halloween .store-price-tag,
body.theme-halloween .store-card__price {
  color: #ffaa33 !important;
}

/* 2. METRICAS (metricas.html) EN HALLOWEEN */
body.theme-halloween[data-section="metrics"],
body.theme-halloween .metricas-container {
  --page-accent: #ff7700 !important;
}

body.theme-halloween .metric-card,
body.theme-halloween .stat-card,
body.theme-halloween .node-card {
  background: rgba(22, 10, 30, 0.8) !important;
  border: 1px solid rgba(255, 119, 0, 0.25) !important;
}

body.theme-halloween .metric-card:hover,
body.theme-halloween .stat-card:hover,
body.theme-halloween .node-card:hover {
  border-color: #ff7700 !important;
  box-shadow: 0 0 25px rgba(255, 119, 0, 0.22) !important;
}

body.theme-halloween .metric-val,
body.theme-halloween .stat-number {
  color: #ffaa33 !important;
  text-shadow: 0 0 15px rgba(255, 119, 0, 0.4) !important;
}

/* 3. GUIAS Y ACORDEONES (guia.html, guia-comandos.html, guia-rangos.html, guia-slimefun.html) */
body.theme-halloween .guide-hero,
body.theme-halloween .guia-hero {
  border-bottom: 1px solid rgba(255, 119, 0, 0.2) !important;
}

body.theme-halloween .guide-hero h1,
body.theme-halloween .guia-hero h1,
body.theme-halloween .section-title {
  color: #f5e6fb !important;
  text-shadow: 0 0 25px rgba(255, 119, 0, 0.45) !important;
}

body.theme-halloween .accordion__header {
  border-color: rgba(255, 119, 0, 0.2) !important;
}

body.theme-halloween .accordion__item--open .accordion__header,
body.theme-halloween .accordion__header:hover {
  border-color: #ff7700 !important;
  background: rgba(255, 119, 0, 0.08) !important;
}

body.theme-halloween .search-input,
body.theme-halloween .filter-search input {
  border-color: rgba(255, 119, 0, 0.3) !important;
  background: rgba(20, 8, 28, 0.8) !important;
}

body.theme-halloween .search-input:focus,
body.theme-halloween .filter-search input:focus {
  border-color: #ff7700 !important;
  box-shadow: 0 0 15px rgba(255, 119, 0, 0.35) !important;
}

body.theme-halloween .btn-primary,
body.theme-halloween .guide-pill.active {
  background: linear-gradient(135deg, #ff7700, #b30000) !important;
  border-color: #ffaa33 !important;
  color: #fff !important;
  box-shadow: 0 4px 15px rgba(255, 119, 0, 0.35) !important;
}

/* 4. FOOTER & SCROLLBAR UNIVERSAL */
body.theme-halloween .site-footer {
  border-top: 1px solid rgba(255, 119, 0, 0.2) !important;
}

body.theme-halloween ::-webkit-scrollbar-thumb {
  background: rgba(255, 119, 0, 0.4) !important;
  border-radius: 4px;
}

body.theme-halloween ::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 119, 0, 0.7) !important;
}

/* ==========================================================================
   MEJORAS 2026-10-14 — Halloween mas atmosferico y Navidad con guirnalda
   Todo es decorativo (pointer-events: none), se apaga con prefers-reduced-motion y se aligera en movil.
   ========================================================================== */

/* ── Halloween: niebla del Tartaro, telaranas en las esquinas, titulo con parpadeo de vela ── */
body.theme-halloween::before {
  content: "";
  position: fixed;
  inset: auto 0 0 0;
  height: 38vh;
  pointer-events: none;
  z-index: 1;
  background:
    radial-gradient(ellipse 60% 100% at 20% 100%, rgba(150, 110, 220, .16), transparent 70%),
    radial-gradient(ellipse 55% 90% at 78% 100%, rgba(255, 119, 0, .10), transparent 70%);
  filter: blur(14px);
  animation: dk-fog-drift 22s ease-in-out infinite alternate;
}
@keyframes dk-fog-drift {
  from { transform: translateX(-3%); opacity: .75; }
  to   { transform: translateX(3%);  opacity: 1; }
}

body.theme-halloween::after {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  width: clamp(90px, 18vw, 190px);
  height: clamp(90px, 18vw, 190px);
  pointer-events: none;
  z-index: 3;
  opacity: .5;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120' fill='none' stroke='%23d8c9ff' stroke-width='.9'%3E%3Cpath d='M120 0 L0 0 M120 0 L120 120 M120 0 L22 98 M120 0 L60 60 M120 0 L95 105'/%3E%3Cpath d='M105 0 Q104 14 120 15 M82 0 Q82 26 120 30 M58 0 Q60 40 120 48 M34 0 Q40 56 120 68'/%3E%3C/svg%3E") no-repeat top right / contain;
}

body.theme-halloween .title-glow,
body.theme-halloween h1 em,
body.theme-halloween .home-hero h1 span {
  animation: dk-candle 4.2s ease-in-out infinite;
}
@keyframes dk-candle {
  0%, 100% { text-shadow: 0 0 14px rgba(255, 119, 0, .55), 0 0 34px rgba(255, 119, 0, .25); }
  46%      { text-shadow: 0 0 9px rgba(255, 119, 0, .35),  0 0 22px rgba(255, 119, 0, .15); }
  52%      { text-shadow: 0 0 18px rgba(255, 150, 40, .7), 0 0 40px rgba(255, 119, 0, .3); }
}

body.theme-halloween .panel,
body.theme-halloween .stage-card,
body.theme-halloween .home-card,
body.theme-halloween .store-card {
  transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}
body.theme-halloween .panel:hover,
body.theme-halloween .stage-card:hover,
body.theme-halloween .home-card:hover,
body.theme-halloween .store-card:hover {
  border-color: rgba(255, 140, 20, .65);
  box-shadow: 0 0 0 1px rgba(255, 140, 20, .35), 0 10px 34px rgba(255, 100, 0, .22);
}

/* ── Navidad: guirnalda de luces fijada arriba ── */
body.theme-christmas::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 10px;
  pointer-events: none;
  z-index: 4;
  background:
    radial-gradient(circle 4px at 12px 5px, #ff4d5a 0 70%, transparent 72%) 0 0 / 56px 10px repeat-x,
    radial-gradient(circle 4px at 40px 5px, #5bd6ff 0 70%, transparent 72%) 0 0 / 56px 10px repeat-x,
    radial-gradient(circle 4px at 26px 5px, #ffd75e 0 70%, transparent 72%) 0 0 / 56px 10px repeat-x;
  filter: drop-shadow(0 0 4px rgba(255, 255, 255, .45));
  animation: dk-lights 2.6s steps(2, jump-none) infinite;
}
@keyframes dk-lights {
  0%   { opacity: 1; }
  50%  { opacity: .55; }
  100% { opacity: 1; }
}

/* ── Movil y accesibilidad ── */
@media (max-width: 760px) {
  body.theme-halloween::before { height: 26vh; animation: none; }
  body.theme-halloween::after  { opacity: .35; }
  body.theme-halloween .title-glow,
  body.theme-halloween h1 em { animation: none; }
  /* el widget de calabaza/kit no debe tapar el banner de privacidad ni los botones */
  #drakes-floating-pumpkin, #drakes-christmas-widget { bottom: 88px !important; right: 12px !important; transform: scale(.85); transform-origin: bottom right; }
}
@media (prefers-reduced-motion: reduce) {
  body.theme-halloween::before, body.theme-halloween .title-glow, body.theme-halloween h1 em,
  body.theme-christmas::before { animation: none !important; }
  #drakes-halloween-canvas, #drakes-christmas-canvas { display: none !important; }
}