/**
 * CM Design Tokens — fuente única de marca para static-html / portada / editorial.
 * Brand canónica del producto: Material Blue #1565C0 (home + fichas).
 */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
	/* Marca */
	--cm-brand: #1565c0;
	--cm-brand-600: #0d47a1;
	--cm-brand-500: #1e88e5;
	--cm-brand-50: #e3f2fd;
	--cm-brand-100: #bbdefb;

	/* Alias compat (portada / tema) */
	--cm-accent: var(--cm-brand);
	--cm-accent-contrast: #ffffff;
	--primary-blue: var(--cm-brand);
	--secondary-blue: var(--cm-brand-500);

	/* Superficie */
	--cm-ink: #0f172a;
	--cm-ink-2: #1e293b;
	--cm-muted: #64748b;
	--cm-bg: #f4f7fb;
	--cm-page: #f8fafc;
	--cm-surface: #ffffff;
	--cm-line: #e2e8f0;
	--cm-footer: #37474f;

	/* Estado */
	--cm-ok: #059669;
	--cm-ok-bg: #ecfdf5;
	--cm-warn: #d97706;
	--cm-danger: #dc2626;
	--cm-info: var(--cm-brand);
	--cm-info-bg: var(--cm-brand-50);

	/* Tipografía */
	--cm-font: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
	--cm-font-legacy: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;

	/* Forma */
	--cm-radius: 1rem;
	--cm-radius-sm: 0.65rem;
	--cm-radius-pill: 999px;
	--cm-shadow: 0 12px 40px rgba(15, 23, 42, 0.08);
	--cm-shadow-sm: 0 4px 14px rgba(15, 23, 42, 0.08);
	--cm-max: 1140px;
	--cm-space: clamp(1rem, 3vw, 1.75rem);
	--cm-focus: 2px solid var(--cm-brand);

	/* Loterías (existentes) */
	--color-nacional: #4caf50;
	--color-leidsa: #ffc107;
	--color-real: #0d47a1;
	--color-loteka: #8ed1fc;
	--color-primera: #f80000;
	--color-suerte: #2196f3;
	--color-lotedom: #0009cd;
	--color-anguila: #ff6a00;
	--color-king: #795548;
	--color-americanas: #607d8b;
}

/* Focus visible coherente */
:focus-visible {
	outline: var(--cm-focus);
	outline-offset: 2px;
}

a:focus:not(:focus-visible) {
	outline: none;
}