/* our save file · temas.css

   Las variables de los temas, y nada más. Es la única hoja compartida del sitio
   (decidido con Abde el 22-oct: con cuatro temas, copiar cada juego de colores
   a mano en cada módulo era multiplicar por cuatro el «espejo» de neutros). La
   maquetación, los componentes y el arte siguen siendo de cada módulo.

   Cómo manda:
   - El tema de SIEMPRE (night, y dawn de día) es el predeterminado y uno más
     de la lista (decidido con Abde el 22-oct). Sus valores siguen en cada
     módulo (el :root y el [data-theme="light"] de cada uno) y aquí no se
     repiten: así quitar esta hoja deja el sitio exactamente como estaba.
   - Los otros temas se escriben como :root[data-tema="…"], que pesa (0,2,0) y
     gana al :root (0,1,0) de cada módulo sea cual sea el orden de carga. Son
     temas de noche: con ellos data-theme es siempre "dark" (lo pone temas.js),
     así que el bloque claro de los módulos no entra en juego.
   - Las variables NUEVAS (forma, capa, acento…) llevan aquí su valor para el
     tema de siempre en un :root propio: son nombres que ningún módulo define,
     no pisan nada, y con ese valor no cambian el aspecto de hoy.

   Los acentos --ember y --jaca siguen siendo PERSONAS (Bee y Dora) en todos
   los temas: cada tema los ajusta a su luz, nunca los usa para otra cosa. Lo
   que en un tema es «color del sistema» va en --acento. */

:root{
  /* acento del sistema: lo seleccionado, el foco, lo que no es de nadie. En
     el tema de siempre es la propia tinta, que es lo que esas cosas usan hoy:
     así un módulo puede pasar a --acento sin que cambie nada de lo de siempre. */
  --acento: var(--ink);
  --acento-tinta: var(--bg0);         /* texto sobre --acento */
  /* multiplica los radios de cada módulo: las esquinas cortadas de neón y
     edgerunner piden cajas cuadradas (radio × 0) */
  --redondeo: 1;
  /* letra de los títulos: Fraunces va en cursiva; Anton, no */
  --display-estilo: italic;
  /* forma de paneles y botones: la de cada módulo (redondeada) */
  --forma-panel: none;
  --forma-boton: none;
  /* una capa por encima del fondo: líneas de barrido, lluvia, trama */
  --capa-fondo: none;
  --capa-opacidad: 0;
  /* el título grande: neón lo «rompe» en dos colores */
  --titulo-sombra: none;
}

/* ══════════ crepúsculo (dusk) · la maqueta con los detalles de la captura ══════════
   Primo cercano del de siempre: noche más honda, cristal, y rosa como color
   del sistema para que el ámbar y el jacarandá sigan siendo solo vuestros. */
:root[data-tema="crepusculo"]{
  --bg0:#0d0a1c; --bg1:#1b1036;
  --ink:#f6edda;
  --ink0:#08061a;
  --panelA:#181033; --panelB:rgba(24,16,51,.5);
  --sheet:#150e2e; --deep:#0b0820;
  --navfade:rgba(27,16,54,.94);
  --onacc:#1b1036;
  --p1:#ff9e64; --p2:#b28dff;
  --chip:rgba(255,255,255,.05);
  --input:rgba(0,0,0,.26);
  --veil:rgba(0,0,0,.45);
  --dim:#cdc3dc;
  --faint:#a79db8;
  --hair:rgba(255,255,255,.08);
  --line:rgba(255,255,255,.12);
  --sheen:rgba(255,255,255,.10);
  --grain:.05;
  --ember:#ff9e64; --ember2:#ff7d54;
  --jaca:#b28dff;  --jaca2:#8f6bff;
  --starcol:#f6edda;
  --glowo:.12;
  --k-series:#6f9cff; --k-anime:#34d6b8; --k-film:#8ee39a; --k-game:#62d0ff;

  --acento:#e98aa8;
  --acento-tinta:#1b1036;
  --titulo-sombra: 0 0 24px rgba(233,138,168,.22);
}

/* ══════════ neón · cyberpunk de visor ══════════ */
:root[data-tema="neon"]{
  --bg0:#06060b; --bg1:#0b0f1e;
  --ink:#e6f7ff;
  /* las de superficie que solo usa Checkpoint (y --chip, que es también de
     Memory Card): si no se ponen, sus paneles se quedan del morado de siempre */
  --ink0:#030308;
  --panelA:#101830; --panelB:rgba(16,24,48,.55);
  --sheet:#0c1224; --deep:#05070f;
  --navfade:rgba(6,8,18,.94);
  --onacc:#12081e;
  --p1:#ffad33; --p2:#b26bff;
  --chip:rgba(0,229,255,.06);
  --input:rgba(0,0,0,.35);
  --veil:rgba(0,0,0,.55);
  --dim:#a3adc2;
  --faint:#8f9ab0;
  --hair:rgba(0,229,255,.08);
  --line:rgba(0,229,255,.22);
  --sheen:rgba(125,243,255,.18);
  --grain:.04;
  --ember:#ffad33; --ember2:#ff9500;
  --jaca:#b26bff;  --jaca2:#9a4dff;
  --starcol:#7df3ff;
  --glowo:.18;
  --display:"Chakra Petch", system-ui, sans-serif;
  --body:"Chakra Petch", system-ui, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, monospace;
  --k-series:#5b94ff; --k-anime:#00e5ff; --k-film:#d6e6ff; --k-game:#c6ff00;

  --acento:#00e5ff;
  --acento-tinta:#001418;
  --redondeo: 0;
  --display-estilo: normal;
  --forma-panel: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
  --forma-boton: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
  --capa-fondo: repeating-linear-gradient(0deg, rgba(0,229,255,.06) 0 1px, transparent 1px 3px);
  --capa-opacidad: 1;
  --titulo-sombra: -2px 0 rgba(0,229,255,.75), 2px 0 rgba(230,247,255,.45), 0 0 18px rgba(0,229,255,.35);
}

/* ══════════ lo-fi · anime de noche, lluvia en la ventana ══════════ */
:root[data-tema="lofi"]{
  --bg0:#0f1428; --bg1:#212a55;
  --ink:#eef2ff;
  --ink0:#0a0e1e;
  --panelA:#1b2246; --panelB:rgba(27,34,70,.55);
  --sheet:#161c3a; --deep:#0c1022;
  --navfade:rgba(18,22,46,.94);
  --onacc:#1a1430;
  --p1:#ff9472; --p2:#b49cff;
  --chip:rgba(207,217,255,.06);
  --input:rgba(0,0,0,.28);
  --veil:rgba(4,6,16,.5);
  --dim:#b7c3ee;
  --faint:#9aa8dc;
  --hair:rgba(207,217,255,.07);
  --line:rgba(207,217,255,.14);
  --sheen:rgba(207,217,255,.16);
  --grain:.08;
  --ember:#ff9472; --ember2:#ff7a55;
  --jaca:#b49cff;  --jaca2:#9a7dff;
  --starcol:#cfd9ff;
  --glowo:.14;
  --display:"DM Serif Display", Georgia, serif;
  --body:"M PLUS Rounded 1c", system-ui, sans-serif;
  --mono:"Space Mono", ui-monospace, monospace;
  --k-series:#7ba7ec; --k-anime:#7bd5b1; --k-film:#c1c9e0; --k-game:#8a8fe6;

  --acento:#7fe0ff;
  --acento-tinta:#0a1a24;
  --display-estilo: italic;
  --capa-fondo: repeating-linear-gradient(104deg, rgba(207,217,255,.05) 0 1px, transparent 1px 11px);
  --capa-opacidad: 1;
  --titulo-sombra: 0 0 22px rgba(255,227,163,.28);
}

/* ══════════ edgerunner · 2077 y Edgerunners ══════════ */
:root[data-tema="edgerunner"]{
  --bg0:#09070f; --bg1:#15101f;
  --ink:#f2eef8;
  --ink0:#050309;
  --panelA:#1a1426; --panelB:rgba(26,20,38,.6);
  --sheet:#140f1e; --deep:#07050c;
  --navfade:rgba(9,7,15,.95);
  --onacc:#0a0a0a;
  --p1:#ff8c1a; --p2:#d042ff;
  --chip:rgba(252,238,10,.06);
  --input:rgba(0,0,0,.4);
  --veil:rgba(0,0,0,.6);
  --dim:#b3adc6;
  --faint:#9993b0;
  --hair:rgba(252,238,10,.08);
  --line:rgba(255,61,87,.38);
  --sheen:rgba(252,238,10,.14);
  --grain:.06;
  --ember:#ff8c1a; --ember2:#ff7300;
  --jaca:#d042ff;  --jaca2:#b52be6;
  --starcol:#25e8f0;
  --glowo:.16;
  --display:"Anton", Impact, sans-serif;
  --body:"Rajdhani", system-ui, sans-serif;
  --mono:"Share Tech Mono", ui-monospace, monospace;
  --k-series:#4aa8ff; --k-anime:#ff52b4; --k-film:#a6ff4d; --k-game:#2dffa6;

  --acento:#fcee0a;
  --acento-tinta:#0a0a0a;
  --redondeo: 0;
  --display-estilo: normal;
  --forma-panel: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%);
  --forma-boton: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
  --capa-fondo: radial-gradient(rgba(252,238,10,.07) 1px, transparent 1.4px) 0 0 / 6px 6px;
  --capa-opacidad: 1;
  --titulo-sombra: 3px 0 #ff3d57, -3px 0 #25e8f0;
}
