:root {
  /* ── Rampa de superficies (modo oscuro) ───────────────────────────────
     El fondo de página (--bg) se mantiene profundo; las superficies
     (--bg2 tarjetas/tablas, --bg3 hover/anidado, --bg4 controles/activos)
     se elevan en pasos tonales claramente perceptibles para que cada
     tarjeta y tabla "flote" sobre el fondo sin depender de sombras. El
     salto --bg → --bg2 da un contraste ≈1.26 (antes ≈1.10, demasiado
     plano). La profundidad se expresa por tono, no por sombra. */
  --bg: #0c1017;
  --bg2: #1c2634;
  --bg3: #2a3646;
  --bg4: #3b4a5e;
  /* Superficie blanca fija (igual en los dos temas) y su texto. */
  --surface-white: #ffffff;
  --on-surface-white: #172033;
  /* Campos de los portales públicos (Solicitudes, Intake Data): siguen el tema. */
  --campo-publico-bg: var(--bg2);
  --campo-publico-texto: var(--text);
  /* Bordes reforzados: son el trazo que delimita cada superficie sobre el
     fondo y las divisiones internas de tabla. A opacidades más altas los
     bordes de tarjeta y las líneas de fila se leen sin endurecer la UI. */
  --border: rgba(211,222,240,0.14);
  --border2: rgba(211,222,240,0.26);
  /* Tarjetas dentro de tarjetas (estándar, cards.css): tonos muy sutiles para separar niveles */
  --tarjeta-contenedora-cab-bg: color-mix(in srgb, var(--accent) 7%, var(--bg2));
  --tarjeta-contenedora-bg: color-mix(in srgb, var(--accent) 3%, var(--bg));
  --subtarjeta-cab-bg: color-mix(in srgb, var(--accent) 11%, var(--bg2));
  --text: #f1f4f8;
  --text2: #b0bac9;
  --text3: #95a0b1;
  --text-total: #d3dae4;  /* filas «Total»: gris (no el texto más intenso) */
  --accent: #5B8AF0;
  --accent2: #4f80e8;
  --accent-soft: rgba(91,138,240,0.12);
  --green: #35b779;
  --green-soft: rgba(53,183,121,0.13);
  --amber: #d39224;
  --amber-soft: rgba(211,146,36,0.14);
  --red: #d96d6d;
  --red-soft: rgba(212,90,90,0.13);
  /* Botón «Editar» de un pedido sin presupuesto (Hub Presupuestario): fondo rojo, texto y borde granate. */
  --btn-alerta-bg: #e57373;
  --btn-alerta-ink: #6e1414;
  --pink: #8b6ee6;
  --pink-soft: rgba(139,110,230,0.13);
  --teal: #2c9bae;
  --teal-soft: rgba(44,155,174,0.13);
  --granate: #821a29;
  --granate-hover: #962031;
  --granate-border: #6a1421;
  --granate-border-hover: #7b1927;
  --granate-light-text: #ff8c9b;
  --granate-light-hover: #ffa4b1;
  /* Aviso (semáforo ámbar, notas de calidad, nivel/criticidad media, datos
     pendientes): tono propio, amarillo, para que el ámbar quede reservado a
     costes. Se distingue del ámbar por luminosidad (más claro en oscuro, más
     oscuro en claro) y va siempre con texto o icono, nunca solo color.
     --warning-ink es la tinta legible sobre --warning. */
  --warning: #e0bb3c;
  --warning-soft: rgba(224,187,60,0.15);
  --warning-ink: #1b2330;
  /* Texto e iconos sobre superficies de color (botón primario, badges
     rellenos, cabeceras de columna Kanban…). En oscuro, tinta oscura: el blanco
     sobre --accent daba 3,3:1; la tinta da 5,75:1 (claro: blanco, abajo). */
  --on-accent: #0c1017;
  /* Anillo de foco / selección suave derivado del acento del tema. */
  --accent-ring: color-mix(in srgb, var(--accent) 35%, transparent);
  /* Tinta de sombras y velos (backdrop de modales). */
  --shadow-color: #000000;
  --semantic-delivery: var(--accent);
  --semantic-value: var(--green);
  --semantic-cost: var(--amber);
  --semantic-risk: var(--red);
  --semantic-knowledge: var(--pink);
  --semantic-compliance: var(--teal);
  /* Neutro para categorías de gráfico sin color semántico propio (p. ej. la
     6ª+ categoría de la dona de costes). Se redefine en tema claro. */
  --chart-neutral: #a4a3ad;
  --capex: #f28c28;
  --capex-soft: rgba(242,140,40,0.14);
  /* OPEX: magenta propio (antes compartía el violeta de «conocimiento»). */
  --opex: #d06aae;
  --opex-soft: rgba(208,106,174,0.14);
  /* Series de ejecución presupuestaria (Hub Presupuestario): pasos de ámbar
     (comprometido = coste) y verde (recepcionado = valor) elegidos por tema y
     validados sobre --bg2 (banda de luminosidad, croma y separación para
     daltonismo ΔE ≥ 8). El presupuesto se dibuja como barra hueca en --text2. */
  --chart-comprometido: #bd8320;
  --chart-recepcionado: #2fa46c;
  /* Un color por dato en todos los gráficos del Hub Presupuestario (SSOT de los
     estilos: HP_SERIES en apps/hub-presupuestario/js/ui/charts.js), agrupados
     por familia: PRESUPUESTO en azules (presupuesto actualizado = azul de marca,
     previsto/reparto mensual = azul cielo y su acumulado más intenso, fuera de
     presupuesto = lavanda), PEDIDOS en ámbar (Importe Pedidos = --chart-comprometido,
     acumulado = --chart-pedido-3, pendiente de recepción = ámbar claro),
     RECEPCIÓN en verde (--chart-recepcionado) y DESVIACIÓN en rojo (riesgo). */
  --chart-presupuesto: #5b8af0;
  --chart-previsto: #4fb3d9;
  --chart-previsto-acumulado: #8fd0ec;
  --chart-fuera: #9b87f5;
  --chart-comprometido-acumulado: #d99a3c;
  --chart-pendiente: #e8b468;
  --chart-desviacion: #e06666;
  /* Disponible actual (presupuesto − recepcionado): familia presupuesto, índigo. */
  --chart-disponible: #8c9cf8;
  /* Tramos de pedido de la distribución mensual (ficha de presupuesto del Hub
     Presupuestario): escala de naranjas alrededor de --chart-comprometido para
     distinguir los pedidos de un mismo mes, apilados en la misma barra. */
  --chart-pedido-1: #bd8320;
  --chart-pedido-2: #e0a24e;
  --chart-pedido-3: #9a5f12;
  --chart-pedido-4: #efc07e;
  --chart-pedido-5: #7a4a0c;
  /* Estrella de favorito: amarillo dorado, semántica propia (no reutiliza ámbar
     de costes). Igual en ambos temas — una estrella se lee dorada siempre. */
  --favorite: #f0b400;
  --favorite-soft: rgba(240,180,0,0.16);
  /* Cabecera de las tablas: OPACA (si no, las filas que pasan por debajo se transparentan al
     desplazar y al pasar el ratón). Un poco más oscura que las filas. */
  --table-head-bg: color-mix(in srgb, var(--bg3) 40%, var(--bg2));
  /* Paleta de 12 pasteles para las VISTAS personalizadas de iniciativas
     (etiquetas elegidas por el usuario, sin carga semántica: son marcadores
     decorativos de vistas, no estados/badges). Tonos suaves legibles sobre las
     superficies oscuras; se redefinen algo más saturados en tema claro. */
  --view-1: #e88ea0;  --view-2: #eaa47f;  --view-3: #e6c877;  --view-4: #bcd97e;
  --view-5: #8fd6a4;  --view-6: #7fd3cb;  --view-7: #84c2e8;  --view-8: #8ea6e8;
  --view-9: #b199e6;  --view-10: #d193dd; --view-11: #e690bd; --view-12: #aab4c2;
  --view-13: #d4b88f; --view-14: #8fbfd0;
  /* Acciones de gobierno del flujo (Anular, Guardar, Devolver) en IA Act y Seguridad: violeta pastel. */
  --ms-logo-rojo: #f25022; --ms-logo-verde: #7fba00; --ms-logo-azul: #00a4ef; --ms-logo-amarillo: #ffb900;
  --accion-gobierno: var(--view-9); --accion-guardar: var(--green); --accion-devolver: var(--view-2);
  /* Variables {clave} de los textos del editor de correos (shared/css/components/texto-variables.css):
     ámbar tostado, distinto del ámbar de costes, del verde azulado y del violeta. */
  --dc-variable: #e0a96d; --dc-variable-soft: rgba(224,169,109,0.22);
  /* Hub Presupuestario: tono pastel fijo por empresa (--empresa-N) y por año
     académico (--ano-N), como CAPEX/OPEX. Salen de la paleta de pasteles y se
     redeclaran en tema claro para tomar su variante. Evitan los tonos con
     significado (capex, opex, rojo riesgo, ámbar coste). */
  --empresa-1: var(--view-7);  --empresa-2: var(--view-12); --empresa-3: var(--view-5);  --empresa-4: var(--view-6);
  --empresa-5: var(--view-1);  --empresa-6: var(--view-4);  --empresa-7: var(--view-10); --empresa-8: var(--view-8);
  --ano-1: var(--view-6);  --ano-2: var(--view-11); --ano-3: var(--view-9);
  --ano-4: var(--view-3);  --ano-5: var(--view-2);  --ano-6: var(--view-4);
  /* Etiquetas decorativas sin significado semántico (salen de los pasteles):
     ámbito de un impacto, área del grupo en el dashboard y apartados del Intake. */
  --scope-estudiante: var(--view-5); --scope-docente: var(--view-7);
  --scope-operaciones: var(--view-2); --scope-empleado: var(--view-9);
  /* Área (Portfolio IA y Portfolio Data): UN degradado de azul, del más OSCURO (la primera) al más
     claro (la última), repartido por orden alfabético del catálogo común DC_AREAS
     (shared/js/core/catalogos.js; tono = posición, areaTono en shared/js/ui/badges.js).
     Pocos colores distintos a propósito: las áreas se reconocen por su texto. */
  --area-1: #3655cd;  --area-2: #3f5ed0;  --area-3: #4868d3;  --area-4: #5171d7;
  --area-5: #5a7ada;  --area-6: #6383dd;  --area-7: #6c8de0;  --area-8: #7596e3;
  --area-9: #7d9fe7;  --area-10: #86a8ea; --area-11: #8fb2ed; --area-12: #98bbf0;
  --area-13: #a1c4f3; --area-14: #aacdf7; --area-15: #b3d7fa; --area-16: #bce0fd;
  /* Tarjeta «Total iniciativas» del Dashboard de Portfolio IA: naranja pastel
     decorativo (el ámbar significa coste y el amarillo, aviso). */
  --kpi-total: var(--view-2);
  /* Frecuencia de pago de una línea de coste (Evaluación): pastel decorativo, una por tipo. */
  --frec-unico: var(--view-2); --frec-recurrente: var(--view-6); --frec-horas: var(--view-9);
  /* Tipo de documento (icono de archivo común, file-upload.css). */
  --doc-pdf: var(--view-1); --doc-word: var(--view-8); --doc-excel: var(--view-5); --doc-powerpoint: var(--view-2);
  --doc-imagen: var(--view-10); --doc-texto: var(--view-12); --doc-comprimido: var(--view-13); --doc-multimedia: var(--view-9);
  --doc-correo: var(--view-14); --doc-generico: var(--view-12);
  /* Portfolio Data: los 7 estados oficiales del ciclo de vida (badges,
     columnas Kanban, barras del cronograma y gráficos). Salen de la paleta de
     pasteles y se redeclaran en tema claro para tomar su variante; la tinta
     --pd-estado-ink se lee sobre cualquiera de ellos en ambos temas. */
  --pd-estado-1: var(--view-12); --pd-estado-2: var(--view-7); --pd-estado-3: var(--view-9);
  --pd-estado-4: var(--view-3);  --pd-estado-5: var(--view-10); --pd-estado-6: var(--view-1);
  --pd-estado-7: var(--view-5);
  --pd-estado-ink: #1b2330;
  /* Fila cabecera de grupo en tablas agrupadas: azul pastel muy sutil. */
  --group-row-bg: color-mix(in srgb, var(--accent) 12%, var(--bg2));
  /* Indicador de entorno de datos Test (Cosmos): tinte de la barra superior.
     Semántica propia (no reutiliza el ámbar de costes). Dark: naranja cálido
     profundo (texto claro legible). Light se redefine más abajo en pastel. */
  --cosmos-test-bar: #6b431d;
  /* Modo mantenimiento de una app (Hub › Gestión de mantenimiento): rojo pastel en la
     tarjeta del Hub y en la barra superior del Administrador. Dark: granate suave. */
  --mantenimiento-bar: #4a2326;
  --logo-gradient-start: #5B8AF0;
  --logo-gradient-end: #8b5cf6;
  /* Degradado del favicon (cian → azul profundo). Reservado para el CTA
     principal "Crear iniciativa", que hereda la identidad del icono de la app.
     El extremo claro arranca en un cian nítido (no casi-blanco) para que el
     botón mantenga bordes definidos sobre el fondo claro del menú. Constante
     en ambos temas, igual que el favicon. */
  --favicon-c1: #22C4F0; --favicon-c2: #0A78DC; --favicon-c3: #0A50A6;
  --core-campo-bg: color-mix(in srgb, var(--favicon-c2) 6%, var(--bg2));
  --favicon-gradient: linear-gradient(140deg, #22C4F0 0%, #0A78DC 55%, #0A50A6 100%);
  --favicon-gradient-hover: linear-gradient(140deg, #3AD1F7 0%, #1388EC 55%, #0A5DC0 100%);
  /* Core+ (asistente en modo Administrador): mismo papel que el degradado de Core, en rojo. Constante en ambos temas. */
  /* Azul de Core fijado en :root (dentro de Core+ los tokens --favicon-* pasan a rojo): el agua de vuelta a Core. */
  --core-azul-gradient: var(--favicon-gradient);
  /* Texto del perfil de la conversación: azul oscuro (Core) y granate oscuro (Core+). */
  --core-azul-oscuro: #0A3F86; --core-plus-granate: #7A0F24;
  --core-plus-c1: #FF7A59; --core-plus-c2: #E5243B; --core-plus-c3: #A50F2D;
  --core-plus-gradient: linear-gradient(140deg, #FF7A59 0%, #E5243B 55%, #A50F2D 100%);
  --core-plus-gradient-hover: linear-gradient(140deg, #FF8C6E 0%, #F0364C 55%, #B81636 100%);
  /* Resplandor del CTA con el degradado del favicon. */
  --favicon-glow: rgba(2,133,233,0.32);
  /* Pantalla de carga (esfera de marca): fondo nocturno y aro teal propios de
     la identidad de Digital Core, iguales en los dos temas. */
  --intro-bg-1: #15203f;
  --intro-bg-2: #0b1020;
  --intro-bg-3: #05070f;
  --intro-teal: #00c4a7;
  /* Tareas (Portfolio IA y Portfolio Data): estado de la tarjeta/fila
     (--task-st-* relleno, *-ink tinta), bloques de columnas de la lista, tinte
     de cabecera del modal por tipo y degradados de progreso. */
  --task-st-pend: #a8b2c1;  --task-st-pend-ink: #243040;
  --task-st-prog: #6ea1ee;  --task-st-prog-ink: #0e2c53;
  --task-st-done: #4ac088;  --task-st-done-ink: #0b3a24;
  --task-st-block: #df8585; --task-st-block-ink: #5a1c1c;
  --task-group-info: #5a6478;  --task-group-people: #57706e;
  --task-group-dates: #726a5a; --task-group-effort: #6a5c72;
  --task-tint-epic: #3b2168; --task-tint-tarea: #1c3a63; --task-tint-hito: #6b4610;
  --task-epic: var(--pink); --task-tarea: var(--accent); --task-hito: var(--amber); --task-clave: var(--accent);
  --progress-full-gradient: linear-gradient(140deg, #3fd08e 0%, #22a86b 55%, #178a55 100%);
  --progress-full-gradient-h: linear-gradient(90deg, #3fd08e 0%, #22a86b 55%, #178a55 100%);
  --favicon-gradient-h: linear-gradient(90deg, #22C4F0 0%, #0A78DC 55%, #0A50A6 100%);
  /* Diagrama del modelo de datos (Portfolio IA): tipo de tabla y tipo de
     columna (clave primaria, lookup, calculada). dataModel.js los lee por
     getComputedStyle para pintar el SVG. */
  --dm-hechos: #f59e0b; --dm-relacional: #6366f1; --dm-catalogo: #10b981; --dm-operacional: #3b82f6;
  --dm-pk: #f59e0b; --dm-lk: #818cf8; --dm-calc: #34d399;
  --dm-pk-text: #fbbf24; --dm-lk-text: #a5b4fc; --dm-calc-text: #6ee7b7; --dm-col-text: #f3f4f6;
  --dm-type-base: #9ca3af; --dm-body: #131722; --dm-separator: #1e2340; --dm-shadow: rgba(0,0,0,0.40);
  --dm-header-text: #ffffff;
  /* Portfolio IA · estados del ciclo de vida (ESTADO_COLOR en config.js). */
  --ia-estado-1: #98979f; --ia-estado-2: #f0eff2; --ia-estado-3: #8fb4ff; --ia-estado-4: #5b8af0;
  --ia-estado-5: #8b6ee6; --ia-estado-6: #ffd24a; --ia-estado-7: #35b779; --ia-estado-8: #d45a5a;
  --ia-estado-9: #e47777;
  /* Tinta legible sobre un color de estado claro u oscuro (stepper). */
  --ink-on-light: #07130d; --ink-on-dark: #f7f4ff;
  /* Mapa de prioridad del dashboard (criticidad|complejidad): relleno y borde. */
  --prio-bb: rgba(134,211,170,0.72); --prio-bb-border: rgba(75,166,119,0.95);
  --prio-bm: rgba(129,204,205,0.70); --prio-bm-border: rgba(73,154,162,0.95);
  --prio-ba: rgba(147,177,238,0.68); --prio-ba-border: rgba(96,130,211,0.95);
  --prio-mb: rgba(188,214,126,0.72); --prio-mb-border: rgba(139,169,72,0.95);
  --prio-mm: rgba(237,196,115,0.72); --prio-mm-border: rgba(196,145,55,0.95);
  --prio-ma: rgba(238,171,130,0.72); --prio-ma-border: rgba(204,116,68,0.95);
  --prio-ab: rgba(236,166,150,0.72); --prio-ab-border: rgba(202,103,86,0.95);
  --prio-am: rgba(232,145,145,0.72); --prio-am-border: rgba(196,84,88,0.95);
  --prio-aa: rgba(214,124,150,0.74); --prio-aa-border: rgba(171,67,101,0.95);
  --chart-shadow: rgba(0,0,0,0.22);
  /* Color identificativo de cada iniciativa en las vistas de tareas y línea
     de separación de iniciativa en el Excel de cronograma. */
  --ini-1: #6366f1; --ini-2: #0d9488; --ini-3: #d97706; --ini-4: #db2777;
  --ini-5: #0ea5e9; --ini-6: #65a30d; --ini-7: #9333ea; --ini-8: #0891b2;
  --task-line: #3c4658;
  /* Identidad del asistente Core: dos azules de la escala de Áreas (nunca violeta).
     Fin oscuro = fondo de la burbuja y del botón enviar, con texto blanco AA;
     inicio claro = trazo del icono sobre el cristal. */
  --core-grad-start: var(--area-6);
  --core-grad-end: var(--area-2);
  --core-ink: #ffffff; /* texto sobre el azul de Core, fijo en ambos temas (on-accent es oscuro en dark) */
  /* Shadow vocabulary (see DESIGN.md §4). Recurring resting/response shadows
     live here so the same elevation reads identically everywhere. */
  --shadow-pop: 0 8px 24px rgba(0,0,0,0.18);          /* dropdowns, popovers, menus */
  --shadow-card-hover: 0 4px 16px rgba(0,0,0,0.2);    /* clickable card hover lift */
  --shadow-card-active: 0 10px 24px rgba(0,0,0,0.12); /* active card drop (paired with semantic ring) */
  /* Una única curva para superficies y controles. Las formas circulares y
     cápsulas se reservan para avatares, iconos y etiquetas compactas. */
  --radius: 12px;
  --radius-lg: 12px;
  --radius-sm: 12px;
  /* Escala de radios para controles pequeños y cápsulas. */
  --radius-xs: 6px;
  --radius-pill: 999px;
  /* Escala de espaciado (base 4 px) y alturas de control comunes: todos los
     botones, selects, buscadores y botones de icono miden una de estas. */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-7: 32px; --space-8: 40px;
  --control-h-sm: 28px;
  --control-h: 32px;
  --control-h-lg: 40px;
  /* Altura única de los campos de formulario de Digital Core (input, select y su
     desplegable común .dd-form, fecha, número…). Textareas aparte (redimensionables).
     En móvil (≤ 520 px) el texto pasa a 16 px y el campo a 42 px (modals.css). */
  --field-h: 38px;
  /* Un solo tamaño de letra para todo campo (texto, número, fecha, select y desplegable común). */
  --field-fs: 13px;
  --icon-size: 16px;
  --font-display: 'Syne', sans-serif;
  --font-body: 'DM Sans', sans-serif;
  --font-mono: 'DM Mono', monospace;
  --sidebar-w: 220px;
  --header-h: 60px;
  --ease-out: cubic-bezier(0.22,1,0.36,1);
  --ease-in-out: cubic-bezier(0.65,0,0.35,1);
  --transition-fast: 120ms var(--ease-out);
  --transition: 180ms var(--ease-out);
}

:root[data-theme="light"],
body[data-theme="light"] {
  --campo-publico-bg: var(--surface-white);
  --dc-variable: #8a5521; --dc-variable-soft: rgba(166,104,40,0.17);
  --campo-publico-texto: var(--on-surface-white);
  --bg: #f5f7fb;
  --bg2: #fcfdff;
  --bg3: #f0f3f8;
  --bg4: #e5eaf2;
  --table-head-bg: color-mix(in srgb, var(--bg4) 55%, var(--bg2));   /* cabecera de tabla: algo más oscura que las filas */
  --border: rgba(28,38,55,0.10);
  --border2: rgba(28,38,55,0.18);
  /* Tarjetas dentro de tarjetas (estándar, cards.css): tonos muy sutiles para separar niveles */
  --tarjeta-contenedora-cab-bg: var(--bg2);
  --tarjeta-contenedora-bg: var(--bg3); /* mismo gris que los campos de formulario */
  --subtarjeta-cab-bg: var(--bg2);
  --text: #172033;
  --text2: #4d5a6e;
  --on-accent: #ffffff;
  --text3: #616f81;
  --text-total: #3a4559;  /* filas «Total»: gris oscuro, no negro */
  --accent: #3769da;
  --accent2: #2854b9;
  --green: #1d7b50;
  --amber: #ad7118;
  --red: #bb4646;
  --pink: #7058c7;
  --teal: #1f8294;
  --capex: #c76f17;
  --opex: #a8488a;
  --chart-comprometido: #c0801c;
  --chart-recepcionado: #1d7a50;
  --chart-presupuesto: #3769da;
  --chart-previsto: #2b93c4;
  --chart-previsto-acumulado: #17698f;
  --chart-fuera: #7a62e0;
  --chart-comprometido-acumulado: #94570f;
  --chart-pendiente: #dd9f45;
  --chart-desviacion: #bd4a4a;
  --chart-disponible: #4f5fc8;
  --chart-pedido-1: #c0801c;
  --chart-pedido-2: #dd9f45;
  --chart-pedido-3: #94570f;
  --chart-pedido-4: #ecbd78;
  --chart-pedido-5: #6e4209;
  --capex-soft: rgba(199,111,23,0.14);
  --opex-soft: rgba(168,72,138,0.13);
  --accent-soft: rgba(55,105,218,0.11);
  --green-soft: rgba(33,138,90,0.12);
  --amber-soft: rgba(173,113,24,0.14);
  --red-soft: rgba(189,74,74,0.12);
  --pink-soft: rgba(112,88,199,0.13);
  --teal-soft: rgba(31,130,148,0.12);
  --warning: #765d00;
  --warning-soft: rgba(176,140,0,0.14);
  --warning-ink: #ffffff;
  --chart-neutral: #64748b;
  --shadow-pop: 0 8px 24px rgba(20,35,60,0.16);
  --shadow-card-hover: 0 4px 16px rgba(20,35,60,0.16);
  --shadow-card-active: 0 10px 24px rgba(20,35,60,0.10);
  /* Light: naranja pastel para la barra en entorno Test (texto oscuro). */
  --cosmos-test-bar: #ffdcb0;
  /* Light: rojo pastel para el modo mantenimiento (texto oscuro). */
  --mantenimiento-bar: #fff1f0;
  /* Asistente Core: se redeclara aquí para que tome la escala --area-* clara. */
  --core-grad-start: var(--area-6);
  --core-grad-end: var(--area-2);
  /* Pasteles de vistas: algo más saturados para leerse sobre fondo claro. */
  --view-1: #e07b90;  --view-2: #e0925f;  --view-3: #d6ab4b;  --view-4: #9cc457;
  --view-5: #5fc088;  --view-6: #3fb8ad;  --view-7: #5aa9dc;  --view-8: #6a86dc;
  --view-9: #8f74d6;  --view-10: #b45db6; --view-11: #d96aa0; --view-12: #8593a5;
  --view-13: #b8955a; --view-14: #4f9bb5;
  /* Hub Presupuestario: tono pastel fijo por empresa (--empresa-N) y por año
     académico (--ano-N), como CAPEX/OPEX. Salen de la paleta de pasteles y se
     redeclaran en tema claro para tomar su variante. Evitan los tonos con
     significado (capex, opex, rojo riesgo, ámbar coste). */
  --empresa-1: var(--view-7);  --empresa-2: var(--view-12); --empresa-3: var(--view-5);  --empresa-4: var(--view-6);
  --empresa-5: var(--view-1);  --empresa-6: var(--view-4);  --empresa-7: var(--view-10); --empresa-8: var(--view-8);
  --ano-1: var(--view-6);  --ano-2: var(--view-11); --ano-3: var(--view-9);
  --ano-4: var(--view-3);  --ano-5: var(--view-2);  --ano-6: var(--view-4);
  /* Área: el mismo degradado de azul en su variante clara (más saturado) y «Total iniciativas». */
  --area-1: #1a2c94;  --area-2: #22369a;  --area-3: #2a409f;  --area-4: #324aa5;
  --area-5: #3a55ab;  --area-6: #425fb1;  --area-7: #4a69b6;  --area-8: #5273bc;
  --area-9: #5b7dc2;  --area-10: #6387c8; --area-11: #6b91cd; --area-12: #739bd3;
  --area-13: #7ba6d9; --area-14: #83b0df; --area-15: #8bbae4; --area-16: #93c4ea;
  --kpi-total: var(--view-2);
  /* Frecuencia de pago de una línea de coste (Evaluación): pastel decorativo, una por tipo. */
  --frec-unico: var(--view-2); --frec-recurrente: var(--view-6); --frec-horas: var(--view-9);
  /* Tipo de documento (icono de archivo común, file-upload.css). */
  --doc-pdf: var(--view-1); --doc-word: var(--view-8); --doc-excel: var(--view-5); --doc-powerpoint: var(--view-2);
  --doc-imagen: var(--view-10); --doc-texto: var(--view-12); --doc-comprimido: var(--view-13); --doc-multimedia: var(--view-9);
  --doc-correo: var(--view-14); --doc-generico: var(--view-12);
  /* Portfolio Data: estados con la variante clara de los pasteles. */
  --pd-estado-1: var(--view-12); --pd-estado-2: var(--view-7); --pd-estado-3: var(--view-9);
  --pd-estado-4: var(--view-3);  --pd-estado-5: var(--view-10); --pd-estado-6: var(--view-1);
  --pd-estado-7: var(--view-5);
  /* Fila cabecera de grupo en tablas agrupadas: azul pastel muy sutil. */
  --group-row-bg: color-mix(in srgb, var(--accent) 8%, var(--bg2));
  --dm-hechos: #d97706; --dm-relacional: #4f46e5; --dm-catalogo: #059669; --dm-operacional: #2563eb;
  --dm-pk: #b45309; --dm-lk: #4338ca; --dm-calc: #047857;
  --dm-pk-text: #92400e; --dm-lk-text: #3730a3; --dm-calc-text: #065f46; --dm-col-text: #1e293b;
  --dm-type-base: #64748b; --dm-body: #ffffff; --dm-separator: rgba(15,23,42,0.06); --dm-shadow: rgba(15,23,42,0.08);
  --dm-header-text: #ffffff;
  --ia-estado-1: #718098; --ia-estado-2: #172033; --ia-estado-3: #5b8af0; --ia-estado-4: #2f5ccf;
  --ia-estado-5: #7058c7; --ia-estado-6: #bf9000; --ia-estado-7: #218a5a; --ia-estado-8: #bd4a4a;
  --ia-estado-9: #8b1a1a;
}

:root[data-theme="light"] { color-scheme: light; }

/* Móvil y táctil: campos a 16 px (iOS no hace zoom al tocarlos) y controles de
   al menos 44 px de área de toque. */
@media (max-width: 768px), (pointer: coarse) {
  :root {
    --field-fs: 16px;
    --control-h-sm: 44px;
    --control-h: 44px;
    --control-h-lg: 48px;
  }
}
:root[data-theme="dark"]  { color-scheme: dark; }