:root {
  color-scheme: light dark;
  --canvas:#f7f7fa; --surface:#ffffff; --surface-soft:#f0f1f5; --surface-strong:#e8e9ef;
  --ink:#333333; --ink-strong:#18181b; --ink-muted:#66666f; --border:#dddde5;
  /* Portada / fallback: azul noche solicitado. Las partes sobreescriben estos tokens. */
  --accent:#0f1c31; --accent-2:#314969; --teal:#087f6a; --amber:#b66a00; --coral:#c94a55;
  --accent-soft:color-mix(in srgb, var(--accent) 14%, transparent);
  --blue-soft:color-mix(in srgb, var(--accent-2) 14%, transparent);
  --teal-soft:color-mix(in srgb, var(--teal) 10%, transparent);
  --amber-soft:color-mix(in srgb, var(--amber) 10%, transparent);
  --coral-soft:color-mix(in srgb, var(--coral) 10%, transparent);
  --accent-gradient:linear-gradient(135deg,var(--accent),var(--accent-2));
  --accent-gradient-soft:linear-gradient(135deg,color-mix(in srgb,var(--accent) 24%,transparent),color-mix(in srgb,var(--accent-2) 15%,transparent));
  --shadow:0 18px 55px rgba(26,27,39,.10); --shadow-soft:0 8px 28px rgba(26,27,39,.07);
  --radius-sm:10px; --radius-md:18px; --radius-lg:28px; --radius-xl:40px;
  --topbar-h:72px; --sidebar-w:286px; --reading:780px; --shell:1540px;
  --text-base:clamp(18px,1rem + .28vw,20.8px);
  --motion-fast:160ms; --motion:320ms; --ease:cubic-bezier(.22,.61,.36,1);
}
[data-theme="dark"] {
  --canvas:#2f3034; --surface:#393b40; --surface-soft:#43454b; --surface-strong:#4b4e55;
  --ink:#ededf0; --ink-strong:#ffffff; --ink-muted:#c2c4ca; --border:#565962;
  --teal:#72d2bd; --amber:#f3bb70; --coral:#f18b9d;
  --shadow:0 18px 55px rgba(15,16,20,.22); --shadow-soft:0 8px 28px rgba(15,16,20,.16);
}

/* Producción v8 · colores base directos por parte.
   El color base es deliberadamente básico/saturado y cada gradiente usa
   una variación más clara del mismo color. */
body[data-active-view="home"]{--accent:#0f1c31;--accent-2:#355071}
body[data-active-view="part1"]{--accent:#ff0000;--accent-2:#ff6666}   /* rojo */
body[data-active-view="part2"]{--accent:#ff7a00;--accent-2:#ffad5c}   /* naranja */
body[data-active-view="part3"]{--accent:#ffd400;--accent-2:#ffe86a}   /* amarillo */
body[data-active-view="part4"]{--accent:#00b050;--accent-2:#58d68d}   /* verde */
body[data-active-view="part5"]{--accent:#00bcd4;--accent-2:#63dbe9}   /* cian */
body[data-active-view="part6"]{--accent:#0057ff;--accent-2:#5b92ff}   /* azul */
body[data-active-view="part7"]{--accent:#7a00ff;--accent-2:#ad62ff}   /* violeta */

/* En modo oscuro se preserva el color base; los fondos grises evitan negros puros. */
[data-theme="dark"] body[data-active-view="home"]{--accent:#9eb4d0;--accent-2:#c1cede}
[data-theme="dark"] body[data-active-view="part1"]{--accent:#ff4d4d;--accent-2:#ff8a8a}
[data-theme="dark"] body[data-active-view="part2"]{--accent:#ff9a40;--accent-2:#ffc078}
[data-theme="dark"] body[data-active-view="part3"]{--accent:#ffe04d;--accent-2:#ffef96}
[data-theme="dark"] body[data-active-view="part4"]{--accent:#39cf7b;--accent-2:#77e4a7}
[data-theme="dark"] body[data-active-view="part5"]{--accent:#42d5e8;--accent-2:#84e6f1}
[data-theme="dark"] body[data-active-view="part6"]{--accent:#5d91ff;--accent-2:#91b6ff}
[data-theme="dark"] body[data-active-view="part7"]{--accent:#ad65ff;--accent-2:#cf9cff}