/* ─────────────────────────────────────────────────────────────────────────
   GAIKA — blanco y negro, y un solo color: el rastro.

   Nace del vídeo de RSU (06/10/2026). Su LUT se llama RSU_BN_rojo y es
   exactamente eso: el mundo en blanco y negro —hormigón, niebla, fluorescentes—
   y lo único que conserva el color es el rojo, la línea que deja el capital al
   moverse. El nombre viene de GAIKA – GKZ, la pista del Acto V, «Los hackers
   del flujo», cuando la cámara de seguridad encuentra al hombre de la capucha.
   La paleta, las fuentes y las proporciones salen de la landing del vídeo.

   LA REGLA DEL TEMA: el rojo NO es el acento. En la terminal el acento quiere
   decir «fuerte» (un RS ≥ 70 o un score alto se pintan con él), y un rojo ahí
   se leería como una caída. Así que el acento es el blanco hueso encendido, y
   el rojo se reserva para dos cosas: lo que BAJA o alerta, y la identidad (las
   marcas de los títulos, la entrada activa, el REC, la línea de la barra
   superior). Las subidas, en un verde frío y apagado, decidido con el usuario:
   rompe un poco la pureza del blanco y negro, pero mantiene la lectura
   verde/rojo que cualquier trader hace sin pensar.

   CONTRASTE MEDIDO contra el fondo (#0a0a0a) y las dos superficies:
     texto hueso 13,7 · acento 17,3 · gris secundario 5,2-5,9 · sube 8,3-9,4
     baja 5,0-5,6 · aviso 8,8-10,1 · acero 7,8-8,9
   El gris de la landing (#7c7a76) se quedaba en 4,06 sobre las tarjetas: se
   subió a #8f8c86. El rojo puro del vídeo (#e01e1e, 3,6-4,1) y el rojo sangre
   (#7e2020) NUNCA van como texto, solo como marca, línea o fondo.
   ───────────────────────────────────────────────────────────────────────── */

[data-theme="gaika"] {
  --color-bg:        #0a0a0a;
  --color-surface:   #121110;
  --color-surface2:  #1b1a19;
  --color-border:    rgba(217, 214, 208, 0.11);

  --color-text:      #d9d6d0;   /* blanco hueso de la landing */
  --color-muted:     #8f8c86;
  --color-accent:    #f2efe9;   /* hueso encendido: «fuerte», no «rojo» */
  --color-secondary: #8fb3c4;   /* acero frío, para la información neutra */
  --color-danger:    #ff3d3d;
  --color-warning:   #d9b46a;
  --color-success:   #79c29b;

  /* La identidad: el rojo del rastro y el de la sangre seca de la landing. */
  --gk-rastro:  #e01e1e;
  --gk-sangre:  #7e2020;
  --gk-sangre-viva: #a8302c;

  --font-mono:  'IBM Plex Mono', monospace;
  --font-ui:    'IBM Plex Mono', monospace;
  --gk-titulo:  'Big Shoulders Display', 'Impact', sans-serif;
  --font-size:  13.5px;

  /* Esquinas casi rectas: hormigón, no plástico. */
  --radius:     2px;
  --radius-lg:  2px;

  /* LA LENTE. Lo que base.css pinta encima de todo con `body::after`. Tres
     capas, las tres al mínimo para que nadie lea peor una cifra:
       · viñeta de cámara de vigilancia, solo en las esquinas;
       · líneas de barrido de 3 px casi invisibles;
       · grano de película QUIETO (una animación de grano a pantalla completa
         cansa a los diez minutos y obliga a repintar todo).
     El grano es ruido fractal en SVG, en línea: cero peticiones. */
  --scanlines:
    radial-gradient(ellipse 120% 95% at 50% 45%, transparent 62%, rgba(0, 0, 0, 0.42) 100%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0px, rgba(255, 255, 255, 0.012) 1px, transparent 1px, transparent 3px),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.05 0'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
  --glow-accent: none;
  /* El logo de RSU brilla así en el vídeo: un halo blanco suave, no neón. */
  --glow-text:   0 0 12px rgba(242, 239, 233, 0.18);
}

[data-theme="gaika"] body {
  letter-spacing: 0.005em;
}

[data-theme="gaika"] ::selection {
  background: var(--gk-sangre);
  color: #fff;
}

/* ── TÍTULOS DE PÁGINA: la tipografía del cartel ─────────────────────────
   Big Shoulders Display, como «HA COMENZADO» en la landing. Las páginas los
   pintan a 18 y 24 px con `letter-spacing`; una condensada a ese tamaño se
   queda pequeña, así que sube de cuerpo. Delante, el cuadrado rojo de la
   landing («● RSU // MANIFIESTO»): la única mancha de color del título. */
[data-theme="gaika"] [style*="font-size:18px"][style*="letter-spacing"],
[data-theme="gaika"] [style*="font-size:24px"][style*="letter-spacing"],
[data-theme="gaika"] [style*="font-size: 20px"][style*="letter-spacing"] {
  font-family: var(--gk-titulo) !important;
  font-weight: 800;
  font-size: 30px !important;
  line-height: 1.05;
  letter-spacing: 0.035em !important;
  text-transform: uppercase;
  color: var(--color-accent) !important;
  text-shadow: none !important;
}
[data-theme="gaika"] [style*="font-size:18px"][style*="letter-spacing"]::before,
[data-theme="gaika"] [style*="font-size:24px"][style*="letter-spacing"]::before {
  content: "";
  display: inline-block;
  width: 0.24em;
  height: 0.24em;
  margin: 0 0.32em 0.16em 0;
  background: var(--gk-rastro);
  vertical-align: middle;
}

/* ── TÍTULOS DE SECCIÓN ───────────────────────────────────────────────────
   Son 131 repartidos por las páginas, y comparten forma: color de acento más
   `letter-spacing` (el mismo selector que usa OCTÖGON). Aquí no cambian de
   tamaño ni de fuente —en un panel de datos la mono se lee mejor— pero llevan
   una marca roja a la izquierda, como los rótulos de la cámara. */
[data-theme="gaika"] [style*="color:var(--color-accent)"][style*="letter-spacing"],
[data-theme="gaika"] [style*="color: var(--color-accent)"][style*="letter-spacing"] {
  text-transform: uppercase;
  text-shadow: none !important;
  border-left: 2px solid var(--gk-rastro);
  padding-left: 8px;
}

/* ── GLITCH, una vez cada once segundos ───────────────────────────────────
   Como la intro del vídeo: separación de canales de un píxel, rojo y blanco,
   durante unas centésimas. Solo en los títulos de página (con los 131 a la
   vez el navegador repintaría media pantalla sin ganar nada). Quien pide
   menos movimiento no lo recibe: lo apaga base.css y, además, aquí. */
@keyframes gk-glitch {
  0%, 97%, 100% { transform: none; text-shadow: none; }
  97.4% { transform: translate(-1px, 0); text-shadow: 2px 0 var(--gk-rastro), -1px 0 rgba(242, 239, 233, 0.6); }
  98.0% { transform: translate(1px, 0);  text-shadow: -2px 0 var(--gk-rastro), 1px 0 rgba(242, 239, 233, 0.6); }
  98.6% { transform: none; text-shadow: none; }
}
[data-theme="gaika"] [style*="font-size:18px"][style*="letter-spacing"],
[data-theme="gaika"] [style*="font-size:24px"][style*="letter-spacing"] {
  animation: gk-glitch 11s steps(1, end) infinite;
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="gaika"] [style*="font-size:18px"][style*="letter-spacing"],
  [data-theme="gaika"] [style*="font-size:24px"][style*="letter-spacing"] {
    animation: none;
  }
}

/* ── LA BARRA LATERAL: el pozo ────────────────────────────────────────────
   Detrás del menú, la escena del pozo infinito del Acto VI —un pasillo de
   hormigón con una línea roja en el fondo—, casi tapada. Es el único sitio
   de la terminal de trabajo con fotografía, y es a propósito: aquí no hay
   ningún número que leer. */
[data-theme="gaika"] #sidebar {
  background:
    linear-gradient(180deg, rgba(10, 10, 10, 0.80) 0%, rgba(10, 10, 10, 0.93) 38%, rgba(10, 10, 10, 0.97) 100%),
    url("/assets/gaika/sidebar-pozo.jpg") center 30% / cover no-repeat,
    var(--color-bg);
  border-right: 1px solid rgba(217, 214, 208, 0.08);
}

/* La cabecera del menú lleva el piloto de la cámara: «● REC». El punto
   parpadea despacio; con «reducir movimiento» se queda encendido. */
[data-theme="gaika"] #sidebar > div:first-child {
  position: relative;
}
/* El nombre junto al logo, en la condensada del cartel. En Plex Mono no cabe
   al lado del logo y se partía en dos líneas (medido: 48 px de alto). Hueco
   medido: 123 px; a 23 px pedía 138, a 20 px cabe con margen. */
[data-theme="gaika"] #sidebar > div:first-child [style*="letter-spacing:0.12em"] {
  font-family: var(--gk-titulo);
  font-weight: 800;
  font-size: 20px !important;
  line-height: 1;
  white-space: nowrap;
  letter-spacing: 0.04em !important;
  border-left: none;
  padding-left: 0;
}
[data-theme="gaika"] #sidebar > div:first-child::after {
  content: "● REC";
  position: absolute;
  bottom: 9px;
  right: 12px;
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.22em;
  color: var(--color-muted);
}
@keyframes gk-rec {
  0%, 55%   { opacity: 1; }
  56%, 100% { opacity: 0.25; }
}
[data-theme="gaika"] #sidebar > div:first-child::before {
  content: "●";
  position: absolute;
  bottom: 9px;
  right: 46px;
  font-size: 9px;
  line-height: inherit;
  color: var(--gk-rastro);
  z-index: 1;
  animation: gk-rec 1.6s steps(1, end) infinite;
}

/* El logo es el de RSU: blanco, con el halo suave del vídeo, sin el pulso
   de neón de los otros temas. */
[data-theme="gaika"] .rsu-logo {
  animation: none !important;
  filter: drop-shadow(0 0 6px rgba(242, 239, 233, 0.35));
}

/* La entrada activa: la marca roja a la izquierda y un velo rojo muy leve.
   Es lo que dice «estás aquí», no un cambio de color del texto. */
[data-theme="gaika"] .nav-item.active {
  background: linear-gradient(90deg, rgba(224, 30, 30, 0.14), rgba(224, 30, 30, 0) 85%) !important;
  border-left-color: var(--gk-rastro) !important;
  color: var(--color-accent) !important;
}
[data-theme="gaika"] .nav-item:hover {
  background: rgba(217, 214, 208, 0.04);
}

/* ── LA BARRA SUPERIOR: la línea roja ─────────────────────────────────────
   Una línea fina por debajo, del rojo sangre al transparente: la misma que
   corta el titular de la landing. */
[data-theme="gaika"] #topbar {
  background: rgba(10, 10, 10, 0.96);
  border-bottom: 1px solid rgba(217, 214, 208, 0.07);
  box-shadow: 0 1px 0 0 rgba(168, 48, 44, 0.55);
}

/* ── CAJAS ────────────────────────────────────────────────────────────────
   Sin sombras de colores ni brillos: tarjeta plana, perfil fino. Al pasar
   por encima el perfil se calienta un poco hacia el rojo, lo justo para
   saber dónde está el ratón. */
[data-theme="gaika"] [style*="border-radius:var(--radius)"][style*="background:var(--color-surface)"]:hover,
[data-theme="gaika"] [style*="border-radius: var(--radius)"][style*="background: var(--color-surface)"]:hover {
  border-color: rgba(168, 48, 44, 0.45) !important;
}

/* Los botones sobre fondo de acento: blanco hueso con tinta negra. El código
   ya pone texto oscuro encima del acento en casi todos; se asegura aquí. */
[data-theme="gaika"] [style*="background:var(--color-accent)"],
[data-theme="gaika"] [style*="background: var(--color-accent)"] {
  color: #0a0a0a !important;
  text-shadow: none !important;
}

/* ── LAS CIFRAS DE COLOR ──────────────────────────────────────────────────
   La terminal lleva colores clavados en el código, pensados para el verde
   neón de CRT: rojo #f23645, ámbar #ffb800, naranja #ff9800, verde #00ffad…
   Aquí se traducen a la paleta del vídeo sin cambiar lo que SIGNIFICAN —el
   rojo sigue bajando, el verde subiendo, el ámbar avisando— y siempre por
   encima de 4,5:1. Mismo selector que OCTÖGON: solo el color de TEXTO, para
   no teñir ningún `background-color`. */
[data-theme="gaika"] [style^="color:#f23645"], [data-theme="gaika"] [style*=";color:#f23645"], [data-theme="gaika"] [style*="; color:#f23645"],
[data-theme="gaika"] [style^="color:#e05d5d"], [data-theme="gaika"] [style*=";color:#e05d5d"],
[data-theme="gaika"] [style^="color:#ff6b6b"], [data-theme="gaika"] [style*=";color:#ff6b6b"],
[data-theme="gaika"] [style^="color:#ff4d4d"], [data-theme="gaika"] [style*=";color:#ff4d4d"] { color: #ff3d3d !important; }

[data-theme="gaika"] [style^="color:#00ffad"], [data-theme="gaika"] [style*=";color:#00ffad"], [data-theme="gaika"] [style*="; color:#00ffad"],
[data-theme="gaika"] [style^="color:#3ecf8e"], [data-theme="gaika"] [style*=";color:#3ecf8e"],
[data-theme="gaika"] [style^="color:#90ee90"], [data-theme="gaika"] [style*=";color:#90ee90"] { color: #79c29b !important; }

[data-theme="gaika"] [style^="color:#ffb800"], [data-theme="gaika"] [style*=";color:#ffb800"], [data-theme="gaika"] [style*="; color:#ffb800"],
[data-theme="gaika"] [style^="color:#e0b13e"], [data-theme="gaika"] [style*=";color:#e0b13e"],
[data-theme="gaika"] [style^="color:#ffb74d"], [data-theme="gaika"] [style*=";color:#ffb74d"] { color: #d9b46a !important; }

[data-theme="gaika"] [style^="color:#ff9800"], [data-theme="gaika"] [style*=";color:#ff9800"], [data-theme="gaika"] [style*="; color:#ff9800"] { color: #d4884a !important; }

[data-theme="gaika"] [style^="color:#00d9ff"], [data-theme="gaika"] [style*=";color:#00d9ff"], [data-theme="gaika"] [style*="; color:#00d9ff"],
[data-theme="gaika"] [style^="color:#4a9eff"], [data-theme="gaika"] [style*=";color:#4a9eff"] { color: #8fb3c4 !important; }

[data-theme="gaika"] [style^="color:#ffd700"], [data-theme="gaika"] [style*=";color:#ffd700"] { color: #e6cf7a !important; }

[data-theme="gaika"] [style^="color:#c77dff"], [data-theme="gaika"] [style*=";color:#c77dff"],
[data-theme="gaika"] [style^="color:#a855f7"], [data-theme="gaika"] [style*=";color:#a855f7"] { color: #b49ad6 !important; }

/* ── EL ACCESO: la línea roja que sube ────────────────────────────────────
   En el login, a pantalla completa, la escena del Acto VI: un gráfico rojo
   que asciende entre la niebla en un mundo gris. Es RSU en una imagen. Se
   identifica la página por su campo de email (`:has`), sin tocar el JS. La
   tarjeta del formulario se vuelve un cristal oscuro para que se lea encima. */
[data-theme="gaika"] #main:has(#email-input) {
  background:
    radial-gradient(ellipse 70% 60% at 50% 50%, rgba(10, 10, 10, 0.55), rgba(10, 10, 10, 0.86) 100%),
    url("/assets/gaika/login-linea-roja.jpg") center / cover no-repeat;
}
[data-theme="gaika"] #main:has(#email-input) [style*="max-width: 380px"] {
  background: rgba(10, 10, 10, 0.80) !important;
  backdrop-filter: blur(3px);
  border-color: rgba(168, 48, 44, 0.55) !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

/* ── DETALLES ─────────────────────────────────────────────────────────────*/
[data-theme="gaika"] ::-webkit-scrollbar-thumb {
  background: #2a2827;
  border-radius: 0;
}
[data-theme="gaika"] ::-webkit-scrollbar-thumb:hover {
  background: var(--gk-sangre);
}
[data-theme="gaika"] .ticker-link:hover {
  opacity: 1;
  text-decoration-color: var(--gk-rastro);
  text-underline-offset: 3px;
}
[data-theme="gaika"] input:focus,
[data-theme="gaika"] select:focus,
[data-theme="gaika"] textarea:focus {
  border-color: rgba(168, 48, 44, 0.8) !important;
}

/* ═════════════════════════════════════════════════════════════════════════
   GAIKA · CINE — las páginas con poco dato abren como la landing del vídeo.
   La monta components/gaika_cine.js; aquí solo va su aspecto. Las páginas de
   trabajo (Scanner, Market, Cartera…) no la llevan: se acordó así con el
   usuario, porque ahí lo primero es leer una cifra.
   ═════════════════════════════════════════════════════════════════════════ */

/* La cabecera propia de la página queda oculta mientras está la escena; al
   cambiar de tema vuelve tal cual. */
.gk-cine-oculto { display: none !important; }

[data-theme="gaika"] .gk-cine {
  --gk-pad-x: 1.5rem;
  --gk-pad-y: 1.5rem;
  position: relative;
  /* De borde a borde, como la landing: se come el margen interior de #main. */
  margin: calc(-1 * var(--gk-pad-y)) calc(-1 * var(--gk-pad-x)) 2.2rem;
  min-height: min(78vh, 760px);
  overflow: hidden;
  border-bottom: 1px solid rgba(217, 214, 208, 0.08);
  /* Dos velos, igual que la landing: uno de izquierda a derecha para que el
     titular se lea, y otro de arriba abajo que funde con la página. */
  background:
    linear-gradient(90deg, rgba(10, 10, 10, 0.88), rgba(10, 10, 10, 0.32) 72%),
    linear-gradient(180deg, rgba(10, 10, 10, 0.55), rgba(10, 10, 10, 0.25) 42%, #0a0a0a 98%),
    var(--gk-foto) center / cover no-repeat,
    #0a0a0a;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
[data-theme="gaika"] .gk-cine--corta {
  min-height: min(52vh, 480px);
}
[data-theme="gaika"] .gk-cine__vineta {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, 0.7));
  pointer-events: none;
}
/* Las dos rayas de señal rota de la landing, encima del titular. */
[data-theme="gaika"] .gk-cine__fallo {
  position: absolute;
  height: 3px;
  top: 34%;
  left: 30%;
  right: 38%;
  background: rgba(217, 214, 208, 0.12);
}
[data-theme="gaika"] .gk-cine__fallo--rojo {
  top: calc(34% + 8px);
  left: 34%;
  right: 30%;
  background: rgba(126, 32, 32, 0.45);
}
[data-theme="gaika"] .gk-cine__dentro {
  position: relative;
  padding: 0 3.5rem 5.5rem;
}
[data-theme="gaika"] .gk-cine__ante {
  font-size: 11px;
  letter-spacing: 0.35em;
  color: var(--color-muted);
  margin-bottom: 2.6rem;
  text-transform: uppercase;
}
[data-theme="gaika"] .gk-cine__rec {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gk-sangre-viva);
  box-shadow: 0 0 10px var(--gk-sangre);
  margin-right: 12px;
  vertical-align: 1px;
  animation: gk-rec 1.6s steps(1, end) infinite;
}
/* EL TITULAR. Big Shoulders a tamaño de cartel: 200 px en la landing, aquí
   se adapta al ancho para no partir palabras en una pantalla pequeña. La
   primera línea es hueca, con el perfil rojo; la segunda, maciza en hueso. */
[data-theme="gaika"] .gk-cine__titular {
  font-family: var(--gk-titulo);
  font-weight: 800;
  font-size: clamp(54px, 9.5vw, 176px);
  line-height: 0.86;
  letter-spacing: -0.005em;
  text-transform: uppercase;
  margin: 0;
}
[data-theme="gaika"] .gk-cine--corta .gk-cine__titular {
  font-size: clamp(48px, 7.4vw, 132px);
}
[data-theme="gaika"] .gk-cine__hueco {
  display: block;
  color: transparent;
  -webkit-text-stroke: 2.5px var(--gk-sangre-viva);
  text-shadow: 0 0 50px rgba(126, 32, 32, 0.45);
}
[data-theme="gaika"] .gk-cine__macizo {
  display: block;
  color: var(--color-text);
}
/* Sin soporte de perfil de texto, la línea hueca sale en rojo macizo en vez
   de desaparecer. */
@supports not (-webkit-text-stroke: 1px red) {
  [data-theme="gaika"] .gk-cine__hueco { color: var(--gk-sangre-viva); }
}
[data-theme="gaika"] .gk-cine__linea {
  margin-top: 1.9rem;
  max-width: 640px;
  font-size: clamp(14px, 1.35vw, 19px);
  line-height: 1.6;
  color: var(--color-text);
  min-height: 3.2em;
}
@keyframes gk-cursor {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}
[data-theme="gaika"] .gk-cine__cursor {
  display: inline-block;
  width: 0.55em;
  height: 1.1em;
  margin-left: 4px;
  vertical-align: -0.2em;
  background: var(--gk-sangre-viva);
  animation: gk-cursor 1.05s steps(1, end) infinite;
}
[data-theme="gaika"] .gk-cine__hud {
  position: absolute;
  left: 3.5rem;
  right: 3.5rem;
  bottom: 1.7rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 10.5px;
  letter-spacing: 0.2em;
  color: var(--color-muted);
  font-variant-numeric: tabular-nums;
}
@media (max-width: 768px) {
  [data-theme="gaika"] .gk-cine { --gk-pad-x: 0.75rem; --gk-pad-y: 1rem; min-height: 64vh; }
  [data-theme="gaika"] .gk-cine--corta { min-height: 46vh; }
  [data-theme="gaika"] .gk-cine__dentro { padding: 0 1.25rem 4.5rem; }
  [data-theme="gaika"] .gk-cine__hud { left: 1.25rem; right: 1.25rem; font-size: 9px; letter-spacing: 0.12em; }
  [data-theme="gaika"] .gk-cine__geo { display: none; }
  [data-theme="gaika"] .gk-cine__ante { letter-spacing: 0.2em; margin-bottom: 1.6rem; }
  [data-theme="gaika"] .gk-cine__fallo { display: none; }
  [data-theme="gaika"] .gk-cine__hueco { -webkit-text-stroke-width: 1.5px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="gaika"] .gk-cine__cursor,
  [data-theme="gaika"] .gk-cine__rec { animation: none; }
}

/* ── EL MANIFIESTO, maquetado como el «documento» de la landing ───────────
   Párrafos más grandes, con su filete y su número de línea a la izquierda;
   las frases sueltas a tamaño de cartel; los tres principios con el número
   hueco en rojo; el cierre en gigante. Todo por selector sobre el marcado
   que ya pinta pages/manifest.js: la página no cambia en ningún otro tema. */
[data-theme="gaika"] [data-gk="manifiesto"] > div[style*="max-width:760px"] {
  max-width: 820px !important;
  counter-reset: gk-linea;
  border-left: 1px solid rgba(217, 214, 208, 0.10);
  padding-left: 46px;
}
[data-theme="gaika"] [data-gk="manifiesto"] p[style*="font-size:14px"] {
  position: relative;
  font-size: 17px !important;
  line-height: 1.95 !important;
  font-weight: 300;
}
[data-theme="gaika"] [data-gk="manifiesto"] p[style*="font-size:14px"]::before {
  counter-increment: gk-linea;
  content: counter(gk-linea, decimal-leading-zero);
  position: absolute;
  left: -46px;
  top: 0.55em;
  font-size: 10.5px;
  letter-spacing: 0.1em;
  color: var(--color-muted);
}
/* Las frases sueltas («RSU nace para dejar de perder.»): carteles. */
[data-theme="gaika"] [data-gk="manifiesto"] p[style*="font-weight:600"] {
  font-family: var(--gk-titulo) !important;
  font-weight: 800 !important;
  font-size: clamp(30px, 3.6vw, 48px) !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
  text-transform: uppercase;
  text-align: left !important;
  color: var(--color-text) !important;
  text-shadow: none !important;
  margin: 2.6rem 0 !important;
}
/* Las que el texto marca como énfasis, huecas en rojo, como «EL EXPLOIT». */
[data-theme="gaika"] [data-gk="manifiesto"] p[style*="font-weight:600"][style*="color:var(--color-accent)"] {
  font-size: clamp(38px, 4.8vw, 66px) !important;
  color: transparent !important;
  -webkit-text-stroke: 1.6px var(--gk-sangre-viva);
  border-left: none;
  padding-left: 0;
}
/* Las citas: la de Buffett y la del cierre, como pieza aparte. */
[data-theme="gaika"] [data-gk="manifiesto"] [style*="padding:1.25rem 1.5rem"] {
  background: transparent !important;
  border: none !important;
  border-top: 2px solid var(--gk-sangre) !important;
  border-bottom: 1px solid rgba(217, 214, 208, 0.10) !important;
  padding: 2rem 0 !important;
  text-align: left !important;
}
[data-theme="gaika"] [data-gk="manifiesto"] [style*="padding:1.25rem 1.5rem"] > div {
  font-family: var(--gk-titulo) !important;
  font-weight: 700;
  font-size: clamp(26px, 3vw, 40px) !important;
  line-height: 1.12 !important;
  color: var(--color-text) !important;
  border-left: none !important;
  padding-left: 0 !important;
  text-transform: none;
}
/* Los tres principios: el número, hueco y enorme, como en la landing. */
[data-theme="gaika"] [data-gk="manifiesto"] [style*="flex-shrink:0;padding-top:2px;opacity:0.6"] {
  font-family: var(--gk-titulo) !important;
  font-weight: 800;
  font-size: 84px !important;
  line-height: 0.9;
  opacity: 1 !important;
  color: transparent !important;
  -webkit-text-stroke: 1.6px var(--gk-sangre-viva);
  border-left: none !important;
  padding: 0 !important;
  /* Ancho FIJO: «01», «02» y «03» no miden lo mismo, y con un mínimo los
     tres títulos empezaban cada uno en un sitio (medido: 321 y 325 px). */
  width: 1.3em;
  flex-shrink: 0;
}
[data-theme="gaika"] [data-gk="manifiesto"] [style*="display:flex;gap:1rem;margin-bottom:1.5rem"] {
  gap: 1.6rem !important;
  border-top: 2px solid var(--gk-sangre);
  padding-top: 1.4rem;
  margin-bottom: 2.4rem !important;
}
[data-theme="gaika"] [data-gk="manifiesto"] [style*="font-size:15px;letter-spacing:0.05em;margin-bottom:0.4rem"] {
  font-family: var(--gk-titulo) !important;
  font-weight: 800;
  font-size: 32px !important;
  text-transform: uppercase;
  border-left: none !important;
  padding-left: 0 !important;
}
[data-theme="gaika"] [data-gk="manifiesto"] [style*="font-size:13px;line-height:1.8"] {
  font-size: 15px !important;
  color: var(--color-muted) !important;
}
/* «No queremos Lamborghinis»: las cuatro líneas, grandes y a la izquierda. */
[data-theme="gaika"] [data-gk="manifiesto"] [style*="font-size:15px;line-height:2.1"] {
  font-family: var(--gk-titulo);
  font-weight: 700;
  font-size: clamp(24px, 2.6vw, 34px) !important;
  line-height: 1.35 !important;
  text-align: left;
}
[data-theme="gaika"] [data-gk="manifiesto"] [style*="text-align:center;margin:1.75rem 0"] {
  text-align: left !important;
}
/* Los separadores: del verde de la terminal al rojo sangre. */
[data-theme="gaika"] [data-gk="manifiesto"] [style*="height:1px;background:linear-gradient"] {
  background: linear-gradient(90deg, var(--gk-sangre), rgba(126, 32, 32, 0)) !important;
  margin: 3rem 0 !important;
}
/* El cierre: «BIENVENIDOS A RSU» a tamaño de cartel. */
[data-theme="gaika"] [data-gk="manifiesto"] [style*="font-size:26px;letter-spacing:0.15em"] {
  font-family: var(--gk-titulo) !important;
  font-weight: 800;
  font-size: clamp(52px, 8vw, 128px) !important;
  line-height: 0.9;
  letter-spacing: 0 !important;
  color: var(--color-text) !important;
  text-shadow: none !important;
  border-left: none !important;
  padding-left: 0 !important;
}
[data-theme="gaika"] [data-gk="manifiesto"] .manifest-cursor {
  background: var(--gk-sangre-viva);
  width: 0.55em;
  height: 1.05em;
}
@media (max-width: 768px) {
  [data-theme="gaika"] [data-gk="manifiesto"] > div[style*="max-width:760px"] { padding-left: 18px; }
  [data-theme="gaika"] [data-gk="manifiesto"] p[style*="font-size:14px"]::before { display: none; }
  [data-theme="gaika"] [data-gk="manifiesto"] [style*="flex-shrink:0;padding-top:2px;opacity:0.6"] { font-size: 56px !important; }
}


/* ── LA FRANJA de las páginas de trabajo ──────────────────────────────────
   La escena en pequeño: foto, antetítulo y titular en una sola línea. No
   tapa nada ni sustituye nada: va ENCIMA de la cabecera de la página, que
   sigue entera debajo con su «?» y sus botones. Baja (~170 px) a propósito:
   en Market o en el Scanner lo que importa empieza justo debajo. */
[data-theme="gaika"] .gk-franja {
  --gk-pad-x: 1.5rem;
  --gk-pad-y: 1.5rem;
  position: relative;
  margin: calc(-1 * var(--gk-pad-y)) calc(-1 * var(--gk-pad-x)) 1.5rem;
  height: 172px;
  overflow: hidden;
  border-bottom: 1px solid rgba(168, 48, 44, 0.45);
  background:
    /* Más ligero que la escena grande: algunas fotos (la sala de trading de
       Market) ya son muy oscuras, y con el velo de la escena desaparecían. El
       titular se sigue leyendo porque el velo es más denso a la izquierda. */
    linear-gradient(90deg, rgba(10, 10, 10, 0.84) 0%, rgba(10, 10, 10, 0.40) 46%, rgba(10, 10, 10, 0.12) 100%),
    linear-gradient(180deg, rgba(10, 10, 10, 0.05), rgba(10, 10, 10, 0.55) 100%),
    var(--gk-foto) center / cover no-repeat,
    #0a0a0a;
  display: flex;
  align-items: flex-end;
}
[data-theme="gaika"] .gk-franja__dentro {
  position: relative;
  padding: 0 3.5rem 1.6rem;
}
[data-theme="gaika"] .gk-franja .gk-cine__ante {
  margin-bottom: 0.9rem;
}
[data-theme="gaika"] .gk-franja__titular {
  font-family: var(--gk-titulo);
  font-weight: 800;
  font-size: clamp(34px, 4.4vw, 64px);
  line-height: 0.92;
  text-transform: uppercase;
  white-space: nowrap;
}
[data-theme="gaika"] .gk-franja .gk-cine__hueco,
[data-theme="gaika"] .gk-franja .gk-cine__macizo {
  display: inline;
}
[data-theme="gaika"] .gk-franja .gk-cine__hueco {
  -webkit-text-stroke-width: 1.6px;
}
[data-theme="gaika"] .gk-franja__hud {
  position: absolute;
  top: 1.1rem;
  right: 1.5rem;
  display: flex;
  gap: 1.6rem;
  font-size: 10px;
  letter-spacing: 0.2em;
  color: var(--color-muted);
  font-variant-numeric: tabular-nums;
}
@media (max-width: 768px) {
  [data-theme="gaika"] .gk-franja { --gk-pad-x: 0.75rem; --gk-pad-y: 1rem; height: 124px; }
  [data-theme="gaika"] .gk-franja__dentro { padding: 0 1.25rem 1.1rem; }
  [data-theme="gaika"] .gk-franja__titular { font-size: clamp(26px, 8.4vw, 40px); white-space: normal; }
  [data-theme="gaika"] .gk-franja__hud { display: none; }
  [data-theme="gaika"] .gk-franja .gk-cine__ante { margin-bottom: 0.5rem; letter-spacing: 0.2em; }
}