/* Tema «noche» para las pantallas que no son minijuegos (Pokédex, tienda, cuenta).
   Mismo estilo retro de consola (tipografía pixel, bordes gruesos, botones con relieve),
   pero con fondo azul marino/morado, paneles oscuros y acentos de color. Se activa con body.night. */
body.night {
  --n-bg: #0a0820;
  --n-panel: #14143a;
  --n-panel-2: #0b0c2b;
  --n-edge: #2c2f78;
  --n-text: #e6e8ff;
  --n-soft: #8f95c9;
  --n-line: #262a66;
  --n-black: #05041a;
  color: var(--n-text);
  background: transparent;
}
/* El fondo vive en una capa fija propia: con «background-attachment: fixed» el navegador lo repinta en cada scroll/movimiento */
body.night::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; transform: translateZ(0);
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 4px),
    radial-gradient(900px 520px at 15% -5%, rgba(96, 52, 190, 0.5), transparent 62%),
    radial-gradient(800px 520px at 95% 105%, rgba(255, 96, 40, 0.2), transparent 60%),
    linear-gradient(#0a0820, #1a0b3a);
}
.night .muted { color: var(--n-soft); }

/* Cabecera y pie */
.night .topbar {
  background: linear-gradient(#1c1848, #0d0b24);
  border-bottom-color: var(--n-black);
  box-shadow: inset 0 -4px 0 var(--red), 0 4px 0 rgba(0, 0, 0, 0.4);
}
.night .footer { background: rgba(13, 11, 36, 0.92); color: var(--n-soft); border-color: var(--n-edge); }
.night .footer a { color: #aab2ff; }

/* Título: degradado amarillo → naranja → rosa */
.night .hero h1 {
  color: transparent; -webkit-text-stroke: 0; text-shadow: none;
  background: linear-gradient(90deg, #ffd23f, #ff8a3d 55%, #ff4f81); -webkit-background-clip: text; background-clip: text;
  filter: drop-shadow(0 4px 0 #000);
}

/* Paneles y cuadros de diálogo */
.night .dialog, .night .card, .night .panel, .night .modal {
  background: var(--n-panel); color: var(--n-text); border-color: var(--n-black);
  box-shadow: inset 0 0 0 3px var(--n-edge), inset 0 0 0 5px var(--n-panel), 0 6px 0 rgba(0, 0, 0, 0.5);
}
.night .modal h2 { color: #ff8a8f; }
.night .overlay { background: rgba(5, 4, 26, 0.8); }
.night .loading { color: var(--n-text); }

/* Botones */
.night .btn { border-color: var(--n-black); box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.45), 0 5px 0 var(--yellow-d), 0 5px 0 4px var(--n-black); }
.night .btn.ghost {
  background: #1f2260; color: #cfd4ff;
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.12), 0 5px 0 #0c0d33, 0 5px 0 4px var(--n-black);
}
.night .btn.ghost:active:not(:disabled) { box-shadow: 0 1px 0 #0c0d33, 0 1px 0 4px var(--n-black); }
.night .btn.red {
  background: linear-gradient(90deg, #e4202a, #ff9d1c); color: #fff;
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.3), 0 5px 0 #8a1d10, 0 5px 0 4px var(--n-black);
}
.night .tabs .btn:not(.ghost) {
  background: #2f6df0; color: #fff; text-shadow: 1px 1px 0 var(--n-black);
  box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.3), 0 5px 0 #1a3f9e, 0 5px 0 4px var(--n-black);
}

/* Cuenta */
.night .acc-card label { color: #cfd4ff; }
.night .acc-input {
  background: var(--n-panel-2); color: #fff; border-color: var(--n-edge); box-shadow: inset 0 3px 0 rgba(0, 0, 0, 0.35);
}
.night .acc-input:focus-visible { outline-color: #5b8dff; }
.night .acc-error { color: #ff7a85; }
.night .acc-status.ok { color: #5be37d; }
.night .acc-status.offline { color: #ffd23f; }

/* Pokédex */
.night .dex-bar { background: var(--n-panel-2); border-color: var(--n-black); }
.night .dex-entry { background: var(--n-panel); border-color: var(--n-black); box-shadow: inset 0 0 0 2px var(--n-edge); color: var(--n-text); }
.night .dex-entry .no { color: var(--n-soft); }
.night .dex-entry.owned:hover { border-color: #ff9d1c; }
.night .dex-entry.unseen { background: var(--n-panel-2); }
.night .dex-entry.unseen img { filter: brightness(0) invert(1) opacity(0.12); }
.night .statbar { background: var(--n-panel-2); border-color: var(--n-black); }

/* Tienda */
.night .pack-odds { background: var(--n-panel-2); color: #cfd4ff; border-color: var(--n-edge); }
.night .poke-card img { background: radial-gradient(circle, #2a2d6e 0 62%, transparent 64%); }

/* Texto informativo bajo la pantalla */
.night .seo-about { background: rgba(20, 20, 58, 0.92); border-color: var(--n-black); box-shadow: inset 0 0 0 2px var(--n-edge); color: var(--n-text); }
.night .seo-about h2 { color: #ff8a8f; }
.night .about-links a { color: #aab2ff; }

/* Portada: tarjetas de minijuegos */
.night .game-card { color: var(--n-text); }
.night .game-card .gc-top { border-bottom-color: var(--n-black); }
.night .game-card:focus-visible { box-shadow: 0 0 0 4px #ff9d1c, 0 0 0 8px var(--n-black); }
.night .best { color: #ffb3b8; }

/* Páginas de SEO (juegos y tabla de tipos) */
.night .lp .lead, .night .crumbs { color: var(--n-text); text-shadow: 0 2px 0 #000; }
.night .crumbs a { color: #aab2ff; }
.night .lp h2 { color: #ff8a8f; }
.night .lp a { color: #aab2ff; }
.night .lp .btn, .night .lp .btn:visited { color: var(--ink); }
.night .lp .btn.ghost, .night .lp .btn.ghost:visited { color: #cfd4ff; }
.night .lp .btn.red, .night .lp .btn.red:visited, .night .lp .discord-join { color: #fff; }
.night .faq dd { color: var(--n-soft); }
.night .table-wrap { border-color: var(--n-black); }
.night .typechart th, .night .typechart td { border-color: var(--n-line); }
.night .typechart .corner { background: var(--n-panel-2); color: var(--n-text); }
.night .typechart td { background: var(--n-panel); }
.night .typechart td.x2 { background: #1d6b3a; color: #d9ffe5; }
.night .typechart td.x05 { background: #6b1d2a; color: #ffd9de; }
.night .typechart td.x0 { background: #000; color: #fff; }

/* Que el fondo oscuro cubra también el rebote de scroll y las páginas largas */
html:has(body.night) { background: #0a0820; color-scheme: dark; }