/* dsc-design tokens (0.1.0). Values from the product app (frontend/src/styles/dsc.css) and the quality plan, section 3.
   Declared on :root so they cost nothing while the layer is off: nothing reads them outside body.dsd. */
:root {
	/* colour */
	--dsc-bg: #0b0e14;
	--dsc-surface: #12171f;
	--dsc-raised: #1a2230;
	--dsc-line: #243044;          /* decorative dividers only (1.4:1) */
	--dsc-line-strong: #5a6a86;   /* control borders (3:1) */
	--dsc-text: #e8eef8;
	--dsc-muted: #8b95a8;         /* meta text only */
	--dsc-muted-long: #b6bfd4;    /* long-form body copy (10.1:1) */
	--dsc-accent: #26c6da;        /* brand accent, eyebrows, focus ring, primary button fill */
	--dsc-accent-hover: #4fd6e6;
	--dsc-link: #4f9dff;
	--dsc-ok: #66bb6a;            /* live / OK dots and pills only */
	--dsc-warn: #ffb74d;
	--dsc-bad: #ef5350;
	--dsc-violet: #a78bfa;
	--dsc-on-accent: #0b0e14;     /* text on a teal fill (9.4:1); white on teal is 2.1:1, never use it */

	/* type */
	--dsc-font: "Fira Sans", "IBM Plex Sans", system-ui, sans-serif;
	--dsc-mono: "Fira Mono", "IBM Plex Mono", ui-monospace, monospace;
	--dsc-h1: clamp(34px, 4.6vw, 56px);
	--dsc-h2: clamp(26px, 3vw, 36px);
	--dsc-h3: 21px;

	/* shape */
	--dsc-r-card: 14px;
	--dsc-r-btn: 10px;
	--dsc-r-chip: 4px;
	--dsc-btn-h: 44px;

	/* spacing scale */
	--dsc-s1: 4px; --dsc-s2: 8px; --dsc-s3: 12px; --dsc-s4: 16px; --dsc-s5: 24px;
	--dsc-s6: 32px; --dsc-s7: 48px; --dsc-s8: 72px; --dsc-s9: 96px;

	/* elevation */
	--dsc-elev-1: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 2px 8px rgba(0, 0, 0, 0.45);
	--dsc-elev-2: 0 1px 0 rgba(255, 255, 255, 0.05) inset, 0 10px 28px rgba(0, 0, 0, 0.42), 0 2px 6px rgba(0, 0, 0, 0.35);

	/* motion */
	--dsc-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--dsc-dur-1: 120ms; --dsc-dur-2: 220ms; --dsc-dur-3: 360ms;

	/* atmosphere: the app's grid wash */
	--dsc-grid-line: rgba(38, 198, 218, 0.03);
	--dsc-grid-size: 32px;
}