/* Marca del cliente: oculta la página hasta que marca.js resuelve /api/marca y traduce el acento del cliente a los tokens de cada tema.
   Las variables --m-* las calcula marca.js (con setProperty, compatible con la CSP); sin ellas, o con el índigo de siempre, valen los tokens de tokens.css.
   Va después de tokens.css: los selectores con [data-marca] son más específicos que los de los tres bloques de colores. */

/* Si el script nunca responde, a los 1,5 s la página se muestra igual (marca.js la muestra antes: tope de espera de 1,5 s al pedir la marca). */
html.marca-pendiente body { visibility: hidden; animation: marca-mostrar 0s linear 1.5s forwards; }
@keyframes marca-mostrar { to { visibility: visible; } }

:root[data-marca] {
  --brand: var(--m-brand-l); --on-brand: var(--m-on-brand-l); --brand-soft: var(--m-soft-l);
  --brand-soft-ink: var(--m-ink-l); --focus: var(--m-focus-l); --ring: var(--m-ring-l);
}
:root[data-marca][data-theme='dark'] {
  --brand: var(--m-brand-d); --on-brand: var(--m-on-brand-d); --brand-soft: var(--m-soft-d);
  --brand-soft-ink: var(--m-ink-d); --focus: var(--m-focus-d); --ring: var(--m-ring-d);
}
@media (prefers-color-scheme: dark) {
  :root[data-marca]:not([data-theme='light']) {
    --brand: var(--m-brand-d); --on-brand: var(--m-on-brand-d); --brand-soft: var(--m-soft-d);
    --brand-soft-ink: var(--m-ink-d); --focus: var(--m-focus-d); --ring: var(--m-ring-d);
  }
}

/* El logo del cliente en el lugar de la inicial: sin el fondo del acento, entero y sin deformarse. */
.mark.con-logo { background: transparent; }
.mark.con-logo img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: inherit; }