/* =============================================================
   EXTERNAL X — CYBER HALLOWEEN (Cyber-Gothic / Tech Dark)
   Capa visual compartida: landing, Panel Admin y Portal Revendedores.
   Paleta: void #050505 · panel #0B0B0E · neón #39FF14
           fuego #FF5500 · abisal #4A0E4E · hueso #E8E3D8
   ============================================================= */

:root {
  --cyb-void: #050505;
  --cyb-panel: #0b0b0e;
  --cyb-panel-2: #12101a;
  --cyb-neon: #39ff14;
  --cyb-fire: #ff5500;
  --cyb-fire-soft: #ff8a3d;
  --cyb-abyss: #4a0e4e;
  --cyb-bone: #e8e3d8;
  --cyb-steel: #8a93a6;

  --cyb-edge: rgba(57, 255, 20, 0.28);
  --cyb-edge-soft: rgba(232, 227, 216, 0.10);
  --cyb-glass: linear-gradient(160deg, rgba(20, 16, 26, 0.92) 0%, rgba(8, 7, 10, 0.97) 55%, rgba(5, 5, 5, 0.98) 100%);
  --cyb-accent-grad: linear-gradient(120deg, #ff5500 0%, #ff8a3d 42%, #39ff14 100%);
  --cyb-edge-grad: linear-gradient(120deg, rgba(255, 85, 0, 0.55), rgba(74, 14, 78, 0.7), rgba(57, 255, 20, 0.4));
  --cyb-glow-fire: 0 0 26px rgba(255, 85, 0, 0.28);
  --cyb-glow-neon: 0 0 22px rgba(57, 255, 20, 0.22);

  --bg-dark: #050505;
  --bg-card: rgba(11, 11, 14, 0.86);
  --border-card: rgba(57, 255, 20, 0.16);
  --glow-color: rgba(255, 85, 0, 0.35);

  --cyb-skull-uri: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill-rule='evenodd' d='M32 4C18 4 9 13.5 9 26c0 6 2.4 11 6.5 14.3V47c0 4 2.8 7 6.8 7h1.2l.7 4.3c.2 1.2 1.2 2.2 2.4 2.2h6.4c1.2 0 2.2-1 2.4-2.2l.7-4.3h1.2c4 0 6.8-3 6.8-7v-6.7C52.6 37 55 32 55 26 55 13.5 46 4 32 4ZM22 15.5a5.5 5.5 0 1 1 0 11 5.5 5.5 0 0 1 0-11Zm20 0a5.5 5.5 0 1 1 0 11 5.5 5.5 0 0 1 0-11ZM32 31l3.4 6.5h-6.8L32 31Zm-4 13h1.8v10H28V44Zm6.2 0H36v10h-1.8V44Z'/%3E%3C/svg%3E");
}

/* ---------- base ---------- */

html {
  background-color: var(--cyb-void);
}

body {
  background-color: var(--cyb-void) !important;
  color: var(--cyb-bone);
  -webkit-font-smoothing: antialiased;
}

/* Rejilla técnica + halos de neón, fija bajo todo el contenido. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(57, 255, 20, 0.045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(57, 255, 20, 0.045) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, #000 10%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 0%, #000 10%, transparent 75%);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(600px 380px at 8% -6%, rgba(74, 14, 78, 0.55), transparent 70%),
    radial-gradient(520px 420px at 96% 104%, rgba(255, 85, 0, 0.18), transparent 72%);
}

/* El contenido debe quedar sobre las texturas. */
body > * {
  position: relative;
  z-index: 1;
}

::selection {
  background: rgba(255, 85, 0, 0.45);
  color: #fff;
}

::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}
::-webkit-scrollbar-track {
  background: #060608;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(255, 85, 0, 0.6), rgba(74, 14, 78, 0.8));
  border-radius: 9999px;
  border: 2px solid #060608;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--cyb-neon);
}

/* ---------- utilidades ---------- */

.cy-mono {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace !important;
  letter-spacing: 0.06em;
}

.cy-skull {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: none;
  background-color: currentColor;
  -webkit-mask: var(--cyb-skull-uri) center / contain no-repeat;
  mask: var(--cyb-skull-uri) center / contain no-repeat;
  filter: drop-shadow(0 0 6px rgba(255, 85, 0, 0.55));
  vertical-align: -0.12em;
}

/* Loader cyber: anillo cónico de 3 acentos + núcleo vacío. */
.cy-spin {
  display: inline-block;
  width: 1em;
  height: 1em;
  border-radius: 9999px;
  background: conic-gradient(from 90deg,
      transparent 0 18%,
      var(--cyb-fire) 30%,
      var(--cyb-fire-soft) 48%,
      var(--cyb-neon) 66%,
      transparent 82% 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2.4px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2.4px));
  animation: cy-spin 0.95s linear infinite;
  vertical-align: -0.14em;
  filter: drop-shadow(0 0 6px rgba(57, 255, 20, 0.5));
}

@keyframes cy-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Barrido de brillo sobre tarjetas y botones. */
.cy-sheen {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none;
}
.cy-sheen::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 42%;
  left: -60%;
  background: linear-gradient(100deg, transparent, rgba(57, 255, 20, 0.16), rgba(255, 85, 0, 0.2), transparent);
  transform: skewX(-14deg);
  animation: cy-sheen 4.6s ease-in-out infinite;
}
@keyframes cy-sheen {
  0% {
    left: -60%;
  }
  60%,
  100% {
    left: 120%;
  }
}

/* ---------- banner de edición ---------- */

.cy-banner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 62px;
  padding: 10px 16px;
  border-radius: 16px;
  overflow: hidden;
  background:
    linear-gradient(120deg, rgba(26, 16, 41, 0.95), rgba(11, 11, 14, 0.96) 55%, rgba(18, 12, 26, 0.92));
  box-shadow: var(--cyb-glow-fire), inset 0 0 0 1px rgba(255, 255, 255, 0.04);
  isolation: isolate;
}
.cy-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: var(--cyb-edge-grad);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.cy-banner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--cyb-accent-grad);
  opacity: 0.8;
}

.cy-banner__glyph {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  color: var(--cyb-bone);
  font-size: 24px;
  background: rgba(74, 14, 78, 0.42);
  box-shadow: inset 0 0 0 1px rgba(57, 255, 20, 0.35), var(--cyb-glow-neon);
}
.cy-banner__title {
  margin: 0;
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.18em;
  color: var(--cyb-bone);
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cy-banner__sub {
  margin: 2px 0 0;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--cyb-neon);
  opacity: 0.88;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cy-banner__spacer {
  flex: 1 1 auto;
  min-width: 8px;
}
.cy-banner__dots {
  display: none;
  gap: 6px;
  align-items: center;
}
@media (min-width: 900px) {
  .cy-banner__dots {
    display: flex;
  }
}
.cy-banner__dots i {
  width: 7px;
  height: 7px;
  border-radius: 9999px;
  background: var(--cyb-fire);
  box-shadow: 0 0 10px var(--cyb-fire);
  animation: cy-blink 2.4s ease-in-out infinite;
}
.cy-banner__dots i:nth-child(2) {
  background: var(--cyb-neon);
  box-shadow: 0 0 10px var(--cyb-neon);
  animation-delay: 0.5s;
}
.cy-banner__dots i:nth-child(3) {
  background: #a855f7;
  box-shadow: 0 0 10px #a855f7;
  animation-delay: 1s;
}
@keyframes cy-blink {
  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.85);
  }
  50% {
    opacity: 1;
    transform: scale(1.15);
  }
}

/* ---------- cristal esmerilado profundo ---------- */

.glass-card,
.bg-card {
  position: relative;
  background: var(--cyb-glass) !important;
  background-color: var(--cyb-panel) !important;
  border: 1px solid var(--cyb-edge-soft) !important;
  box-shadow: 0 18px 46px -18px rgba(0, 0, 0, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
  backdrop-filter: blur(26px) saturate(150%);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  transition: box-shadow 0.28s ease, border-color 0.28s ease;
}
/* Hairline superior de neón + borde interior abisal. */
.glass-card::before,
.bg-card::before {
  content: "";
  position: absolute;
  left: 10%;
  right: 10%;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 85, 0, 0.75), rgba(57, 255, 20, 0.55), transparent);
  opacity: 0.75;
  pointer-events: none;
}
.glass-card:hover,
.bg-card:hover {
  border-color: var(--cyb-edge) !important;
  box-shadow: 0 22px 54px -20px rgba(0, 0, 0, 0.95), var(--cyb-glow-fire) !important;
}
/* Los cartones con style="background-color:#0d0d10" ganan sobre la hoja; se anula. */
.glass-card[style],
.bg-card[style] {
  background-color: var(--cyb-panel) !important;
}

/* ---------- botones ---------- */

.btn-greed-primary,
.btn-greed-secondary {
  position: relative;
  overflow: hidden;
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
  letter-spacing: 0.08em;
}
.btn-greed-primary {
  background: var(--cyb-accent-grad) !important;
  border: 1px solid rgba(255, 138, 61, 0.75) !important;
  color: #0a0a0a !important;
  box-shadow: 0 10px 32px -10px rgba(255, 85, 0, 0.75), var(--cyb-glow-neon) !important;
}
.btn-greed-primary:hover {
  background: linear-gradient(120deg, #ff8a3d, #ffb066 45%, #6bff4f) !important;
  box-shadow: 0 14px 40px -12px rgba(255, 85, 0, 0.9), 0 0 30px rgba(57, 255, 20, 0.35) !important;
  transform: translateY(-2px);
}
.btn-greed-secondary {
  background: rgba(11, 11, 14, 0.92) !important;
  border: 1px solid var(--cyb-edge) !important;
  color: var(--cyb-bone) !important;
}
.btn-greed-secondary:hover {
  border-color: rgba(57, 255, 20, 0.6) !important;
  box-shadow: var(--cyb-glow-neon) !important;
  transform: translateY(-2px);
}

/* CTA primarios del panel (Tailwind bg-white + texto negro) → fuego con brillo. */
button[class~="bg-white"],
a[class~="bg-white"] {
  background-image: var(--cyb-accent-grad) !important;
  background-color: var(--cyb-fire) !important;
  color: #0a0a0a !important;
  border-color: rgba(255, 138, 61, 0.7) !important;
  box-shadow: 0 8px 26px -10px rgba(255, 85, 0, 0.8) !important;
  transition: box-shadow 0.2s ease, filter 0.2s ease, transform 0.2s ease;
}
button[class~="bg-white"]:hover,
a[class~="bg-white"]:hover {
  filter: brightness(1.08);
  box-shadow: 0 10px 34px -10px rgba(255, 85, 0, 0.95), 0 0 22px rgba(57, 255, 20, 0.3) !important;
}
button[class~="bg-white"]:disabled,
a[class~="bg-white"]:disabled {
  filter: grayscale(0.5) brightness(0.7);
  box-shadow: none !important;
}

/* Secundarios: vidrio con borde neón tenue. */
button[class~="bg-zinc-900"],
button[class~="bg-zinc-950"] {
  background-color: rgba(14, 12, 20, 0.92) !important;
  border-color: rgba(138, 147, 166, 0.26) !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
button[class~="bg-zinc-900"]:hover,
button[class~="bg-zinc-950"]:hover {
  border-color: var(--cyb-edge) !important;
  color: #fff !important;
  box-shadow: var(--cyb-glow-neon) !important;
}

button:disabled {
  cursor: not-allowed;
}

/* ---------- tablas ---------- */

table {
  border-collapse: separate;
  border-spacing: 0;
}

thead tr,
thead {
  background: linear-gradient(180deg, rgba(18, 12, 26, 0.98), rgba(8, 8, 11, 0.96)) !important;
}

th {
  color: var(--cyb-neon) !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--cyb-edge) !important;
  background: transparent;
}

tbody tr {
  border-color: rgba(138, 147, 166, 0.1) !important;
  transition: background-color 0.16s ease, box-shadow 0.16s ease;
}
tbody tr:hover {
  background-color: rgba(74, 14, 78, 0.18) !important;
  box-shadow: inset 3px 0 0 var(--cyb-fire);
}
tbody td {
  color: var(--cyb-bone);
}

/* Columna pegajosa del Panel: el fondo duro debe seguir al panel. */
#keys-table-scroll th:last-child,
#keys-table-scroll td:last-child {
  background-color: #0a0910 !important;
  border-left: 1px solid rgba(57, 255, 20, 0.14);
}

.divide-zinc-800 > *,
.divide-y[class*="zinc"] > * {
  border-color: rgba(138, 147, 166, 0.12) !important;
}

/* ---------- formularios ---------- */

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
select,
textarea {
  color-scheme: dark !important;
  background-color: rgba(8, 7, 11, 0.95) !important;
  color: #ffffff !important;
  border: 1px solid rgba(138, 147, 166, 0.24) !important;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.4) !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
input:focus:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select:focus,
textarea:focus {
  outline: none !important;
  border-color: rgba(255, 85, 0, 0.7) !important;
  box-shadow: 0 0 0 3px rgba(255, 85, 0, 0.16), var(--cyb-glow-neon) !important;
}
select,
select option,
optgroup {
  background-color: #0b0b10 !important;
  color: #ffffff !important;
}
input::placeholder,
textarea::placeholder {
  color: rgba(138, 147, 166, 0.65) !important;
}
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--cyb-fire) !important;
}
input[type="file"] {
  color: var(--cyb-bone);
}
input[type="file"]::file-selector-button {
  background: var(--cyb-accent-grad);
  color: #0a0a0a;
  border: 0;
  border-radius: 10px;
  padding: 6px 12px;
  font-weight: 700;
  margin-right: 10px;
}

/* ---------- panel admin: sidebar, header, tiles ---------- */

#admin-sidebar {
  background: linear-gradient(180deg, #0a0a10 0%, #07060b 60%, #0b0714 100%) !important;
  border-right: 1px solid rgba(57, 255, 20, 0.16) !important;
  box-shadow: inset -1px 0 0 rgba(255, 85, 0, 0.18);
}

#view-admin header,
#view-dashboard header {
  background: linear-gradient(180deg, rgba(11, 11, 14, 0.96), rgba(5, 5, 5, 0.9)) !important;
  border-bottom: 1px solid var(--cyb-edge) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/* Elemento de navegación activo (switchTab reescribe className). */
.nav-item[class*="bg-zinc-800"] {
  background-image: linear-gradient(90deg, rgba(255, 85, 0, 0.22), rgba(74, 14, 78, 0.28)) !important;
  background-color: rgba(18, 12, 26, 0.9) !important;
  border-color: rgba(255, 85, 0, 0.45) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 var(--cyb-fire), var(--cyb-glow-fire);
}
.nav-item:not([class*="bg-zinc-800"]):hover {
  color: var(--cyb-neon) !important;
}

/* Chips/tiles oscuros usados como mini-métricas. */
[class~="bg-black/50"],
[class~="bg-black/40"],
[class~="bg-zinc-950/60"],
[class~="bg-zinc-950/80"] {
  background-color: rgba(9, 8, 13, 0.88) !important;
  border-color: rgba(138, 147, 166, 0.2) !important;
}

/* Números de métricas en mono neón. */
[id^="stat-"],
#stat-total,
#stat-active {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace !important;
  color: var(--cyb-bone) !important;
  text-shadow: 0 0 18px rgba(255, 85, 0, 0.45);
  letter-spacing: -0.01em;
}

/* Barra de filtros. */
.filter-btn[class~="bg-white"],
.product-filter-btn[class~="bg-white"],
[class*="filter"][class~="bg-white"] {
  background-image: var(--cyb-accent-grad) !important;
  color: #0a0a0a !important;
}

/* Modos de overlay/modal. */
[class*="backdrop-blur"] {
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
}

/* Toasts: borde neón. */
#toast-container > div,
#toast {
  background: linear-gradient(160deg, rgba(18, 16, 26, 0.96), rgba(6, 6, 9, 0.98)) !important;
  border: 1px solid var(--cyb-edge) !important;
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.95), var(--cyb-glow-neon) !important;
  color: var(--cyb-bone) !important;
}

/* ---------- landing ---------- */

.nav-pill {
  background: rgba(8, 7, 11, 0.92) !important;
  border: 1px solid var(--cyb-edge) !important;
  box-shadow: 0 14px 40px -14px rgba(0, 0, 0, 0.95), var(--cyb-glow-neon) !important;
}
.nav-link-btn {
  color: var(--cyb-steel) !important;
}
.nav-link-btn:hover {
  color: var(--cyb-neon) !important;
  background: rgba(57, 255, 20, 0.08) !important;
}
.nav-link-btn.active {
  color: #fff !important;
  background: rgba(255, 85, 0, 0.16) !important;
  border: 1px solid rgba(255, 85, 0, 0.45) !important;
  box-shadow: var(--cyb-glow-fire) !important;
}

.hero-glow-text {
  color: var(--cyb-bone) !important;
  text-shadow: 0 0 22px rgba(255, 85, 0, 0.55), 0 0 60px rgba(74, 14, 78, 0.8) !important;
}
.hero-glow-gradient {
  background: linear-gradient(180deg, #ffffff 30%, #ff8a3d 72%, #39ff14 100%) !important;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

#waveCanvas {
  opacity: 0.35 !important;
  filter: hue-rotate(96deg) saturate(1.6);
}

/* Botones descargables con fondo duro inline → fuego cyber. */
a[style*="background:#ffffff"],
a[style*="background: #ffffff"] {
  background: var(--cyb-accent-grad) !important;
  color: #0a0a0a !important;
  box-shadow: 0 12px 34px -12px rgba(255, 85, 0, 0.85), var(--cyb-glow-neon) !important;
  border-radius: 14px;
}

.marquee-content {
  gap: 2.6rem;
}

/* Desplazamiento suave de las tarjetas del marquee. */
[class~="border-zinc-800"],
[class~="border-zinc-900"] {
  border-color: rgba(138, 147, 166, 0.16) !important;
}

/* Chips de estado vectoriales (sin emojis). */
.cy-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  vertical-align: middle;
}
.cy-dot--live {
  background: var(--cyb-neon);
  box-shadow: 0 0 10px var(--cyb-neon);
}
.cy-dot--fire {
  background: var(--cyb-fire);
  box-shadow: 0 0 10px var(--cyb-fire);
}
.cy-dot--danger {
  background: #ff2d55;
  box-shadow: 0 0 10px rgba(255, 45, 85, 0.75);
}
.cy-dot--wait {
  background: #a855f7;
  box-shadow: 0 0 9px rgba(168, 85, 247, 0.65);
}
.cy-dot--muted {
  background: var(--cyb-steel);
}

/* Iconos giratorios del sistema → anillo cyber. */
.animate-spin {
  color: var(--cyb-fire) !important;
  filter: drop-shadow(0 0 6px rgba(255, 85, 0, 0.55));
}

/* ---------- arranque: loader cyber ---------- */

.cy-boot {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  gap: 18px;
  background: var(--cyb-void);
  pointer-events: none;
  animation: cy-boot-out 0.7s ease 0.55s forwards;
}
.cy-boot__ring {
  position: relative;
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  color: var(--cyb-bone);
  font-size: 44px;
}
.cy-boot__ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background: conic-gradient(from 0deg,
      transparent 0 12%,
      var(--cyb-fire) 26%,
      var(--cyb-fire-soft) 44%,
      var(--cyb-neon) 62%,
      transparent 76% 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.9px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.9px));
  animation: cy-spin 1.05s linear infinite;
  filter: drop-shadow(0 0 12px rgba(255, 85, 0, 0.55));
}
.cy-boot__label {
  font-family: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.32em;
  color: var(--cyb-neon);
  text-transform: uppercase;
}
@keyframes cy-boot-out {
  to {
    opacity: 0;
    visibility: hidden;
  }
}

/* ---------- banner de edición (siempre visible) ---------- */

#halloween-banner {
  display: flex !important;
  width: calc(100% - 32px);
  max-width: 1440px;
  margin: 16px auto 0;
}
#halloween-banner .cy-on {
  display: none;
}
#halloween-banner .cy-off {
  display: inline;
}
body.halloween-on #halloween-banner .cy-on {
  display: inline;
}
body.halloween-on #halloween-banner .cy-off {
  display: none;
}
body.halloween-on .cy-banner {
  box-shadow: var(--cyb-glow-fire), 0 0 44px rgba(57, 255, 20, 0.18),
    inset 0 0 0 1px rgba(255, 138, 61, 0.25);
}
body.halloween-on .cy-banner__glyph {
  color: var(--cyb-neon);
}

/* ---------- accesibilidad de movimiento ---------- */

@media (prefers-reduced-motion: reduce) {
  .cy-spin,
  .cy-sheen::after,
  .cy-boot__ring::before,
  .cy-banner__dots i {
    animation: none !important;
  }
  .cy-boot {
    display: none;
  }
  .cy-sheen::after {
    display: none;
  }
  .glass-card,
  .bg-card,
  .btn-greed-primary,
  .btn-greed-secondary {
    transition: none !important;
  }
  body::before {
    mask-image: none;
    -webkit-mask-image: none;
  }
}