/*
 * Scrum Poker: interfaccia sobria e precisa, l'unico oggetto "artigianale" è il mazzo.
 * Questo file è copiato identico in public/css/tokens.css per landing e guide.
 */
:root {
	color-scheme: light;

	/* Superfici */
	--bg: #f7f6f3;
	--bg-2: #efede8;
	--surface: #ffffff;
	--surface-2: #fbfaf8;
	--line: #e4e2dc;
	--line-strong: #cfccc4;

	/* Testo */
	--ink: #17181a;
	--ink-2: #4a4c50;
	--ink-3: #6f7176;

	/* Accento: verde panno, usato con parsimonia */
	--accent: #1f5c4a;
	--accent-hover: #184a3c;
	--accent-soft: #e6efeb;
	--on-accent: #ffffff;

	/* Carte */
	--card: #fffdf8;
	--card-line: #e2ddd0;
	--card-back: #1f5c4a;
	--card-back-2: #2b7560;

	/* Stati */
	--danger: #b42318;
	--danger-soft: #fdecea;
	--warn: #b54708;
	--warn-soft: #fef4e6;
	--ok: #1f7a4d;
	--focus: #2563eb;

	/* Colori dei partecipanti (avatar), smorzati */
	--p0: #2f6f5e;
	--p1: #3b5b92;
	--p2: #9a5b2e;
	--p3: #7a4f8f;
	--p4: #a33f4f;
	--p5: #3d7d8a;
	--p6: #6b6f2a;
	--p7: #5a5f6b;

	/* Grafici admin (validati con scripts/validate_palette.js della skill dataviz) */
	--chart-1: #0078bf;
	--chart-2: #e8590c;

	--font: "Hanken Grotesk Variable", "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;

	--t-xs: 0.75rem;
	--t-sm: 0.8125rem;
	--t-base: 0.9375rem;
	--t-md: 1.0625rem;
	--t-lg: 1.25rem;
	--t-xl: 1.625rem;
	--t-2xl: clamp(1.75rem, 3vw, 2.25rem);
	--t-3xl: clamp(2.25rem, 5vw, 3.5rem);
	--t-4xl: clamp(2.75rem, 6.5vw, 4.75rem);

	--s-1: 4px;
	--s-2: 8px;
	--s-3: 12px;
	--s-4: 16px;
	--s-5: 24px;
	--s-6: 32px;
	--s-7: 48px;
	--s-8: 72px;
	--s-9: 112px;

	--r-sm: 8px;
	--r: 12px;
	--r-lg: 18px;
	--r-card: 10px;

	--shadow-1: 0 1px 2px rgba(23, 24, 26, 0.06), 0 1px 1px rgba(23, 24, 26, 0.04);
	--shadow-2: 0 2px 4px rgba(23, 24, 26, 0.05), 0 8px 24px rgba(23, 24, 26, 0.08);
	--shadow-3: 0 12px 40px rgba(23, 24, 26, 0.16);

	--ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--fast: 140ms;
	--flip: 360ms;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		color-scheme: dark;
		--bg: #121314;
		--bg-2: #1a1b1d;
		--surface: #1c1d20;
		--surface-2: #222326;
		--line: #2c2e32;
		--line-strong: #3b3e43;
		--ink: #ededeb;
		--ink-2: #b9bab8;
		--ink-3: #8b8d8f;
		--accent: #5fb394;
		--accent-hover: #74c4a6;
		--accent-soft: #1d2e28;
		--on-accent: #0f1a16;
		--card: #f4f1e8;
		--card-line: #d8d2c3;
		--card-back: #23634f;
		--card-back-2: #2f7a63;
		--danger: #f97066;
		--danger-soft: #3a1d1b;
		--warn: #f5a524;
		--warn-soft: #33260f;
		--ok: #5fb394;
		--focus: #7aa2ff;
		--p0: #5fb394;
		--p1: #7d9ee0;
		--p2: #d79a63;
		--p3: #b590cc;
		--p4: #e07d8c;
		--p5: #6bb8c4;
		--p6: #b5b85c;
		--p7: #9ba1ad;
		--chart-1: #2b8fe0;
		--shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
		--shadow-2: 0 2px 4px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
		--shadow-3: 0 12px 40px rgba(0, 0, 0, 0.5);
	}
}
:root[data-theme="dark"] {
	color-scheme: dark;
	--bg: #121314;
	--bg-2: #1a1b1d;
	--surface: #1c1d20;
	--surface-2: #222326;
	--line: #2c2e32;
	--line-strong: #3b3e43;
	--ink: #ededeb;
	--ink-2: #b9bab8;
	--ink-3: #8b8d8f;
	--accent: #5fb394;
	--accent-hover: #74c4a6;
	--accent-soft: #1d2e28;
	--on-accent: #0f1a16;
	--card: #f4f1e8;
	--card-line: #d8d2c3;
	--card-back: #23634f;
	--card-back-2: #2f7a63;
	--danger: #f97066;
	--danger-soft: #3a1d1b;
	--warn: #f5a524;
	--warn-soft: #33260f;
	--ok: #5fb394;
	--focus: #7aa2ff;
	--p0: #5fb394;
	--p1: #7d9ee0;
	--p2: #d79a63;
	--p3: #b590cc;
	--p4: #e07d8c;
	--p5: #6bb8c4;
	--p6: #b5b85c;
	--p7: #9ba1ad;
	--chart-1: #2b8fe0;
	--shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
	--shadow-2: 0 2px 4px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);
	--shadow-3: 0 12px 40px rgba(0, 0, 0, 0.5);
}