/* ==========================================================================
   insideOut — capa mínima sobre ../styles.css
   Hermano de whoami: misma maquinaria, sesgo cálido + acento `ember`.
   El grueso del estilo vive en ../styles.css. Aquí: token nuevo + ajustes.
   ========================================================================== */

/* ---------- acento `ember` (rojo-naranja · BertBor) ----------
   Reservado al Movimiento V (manipulación = "cuidado").
   Se declara igual que gold/cyan/violet en ../styles.css. */
:root {
  --ember:      #ff6a3d;
  --ember-soft: #ffa17e;
}

/* mapeo de acento al contenedor de movimiento (como .movement[data-accent="gold"]) */
.movement[data-accent="ember"] {
  --accent: var(--ember);
  --accent-soft: var(--ember-soft);
}

/* mapeo a componentes que llevan su propio data-accent
   (las ill-cards de la rejilla, igual que .ill-card[data-accent="gold"]) */
.ill-card[data-accent="ember"] {
  --accent: var(--ember);
  --accent-soft: var(--ember-soft);
}

/* ---------- sesgo cálido del lienzo, scoped a body.io ----------
   Sutil: la viñeta y la trama tiran a ámbar/ascua, no al cian cósmico.
   No reestiliza componentes; solo el ambiente. */
body.io .vignette {
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(227,178,92,.05), transparent 55%),
    radial-gradient(130% 120% at 50% 115%, rgba(255,106,61,.04), transparent 60%),
    radial-gradient(100% 100% at 50% 50%, transparent 60%, rgba(4,5,9,.55) 100%);
}

/* el destello del switch, en clave cálida */
body.io .mode-flash {
  background:
    radial-gradient(120% 120% at 50% 50%, rgba(227,178,92,.10), transparent 60%),
    rgba(7,5,5,.55);
}

/* hilo de progreso con degradado cálido (gold→ember) */
body.io .scroll-bar {
  background: linear-gradient(90deg, var(--gold), var(--ember));
}

/* en Real, el lado "Real" del switch se tiñe de gold cálido en vez de cian */
body.io .switch[aria-checked="true"] .switch-real {
  color: var(--gold);
  text-shadow: 0 0 14px rgba(227,178,92,.4);
}
body.io .switch[aria-checked="true"] .switch-knob {
  background: var(--gold);
  box-shadow: 0 0 14px var(--gold);
}

/* el icono grande del hero hereda el acento del contenedor; cálido por defecto */
body.io .hero-illusion .ill-icon[data-accent="ember"] {
  --accent: var(--ember);
  --accent-soft: var(--ember-soft);
}