/*
* MetricSign Design System — Shared Tokens
* Version 1.1 · April 2026
*
* Source of truth: docs/design/lineage-uplift/DESIGN_SYSTEM.md
* Reference implementation: website/metricsign-onepager-v2.html
*
* Include as the FIRST in on every static HTML page:
*
*
* This file contains ONLY: font imports, @property registrations,
* and :root token definitions. No components, no layout, no resets.
*/
/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600&family=Geist+Mono:wght@400;500&family=JetBrains+Mono:wght@400;500&display=swap');
/* ── @property registrations (must precede first use) ── */
@property --shimmer-angle {
syntax: '';
inherits: false;
initial-value: 0deg;
}
/* ============================================================
Design System Tokens
============================================================ */
:root {
/* Accent — logo color is accent-400 (locked 2026-04-24, see docs/design/lineage-uplift/DESIGN_SYSTEM.md §2.5) */
--accent-400: #1FDDA3;
--accent-500: #00C890;
--accent-600: #00A077;
--accent-700: #007A5B;
--accent-900: #003D2E;
/* Surfaces (dark) */
--surface-0: #0A0B0D;
--surface-1: #111316;
--surface-2: #1A1D22;
--surface-3: #23272E;
/* Borders */
--border-subtle: rgba(255,255,255,0.06);
--border-default: rgba(255,255,255,0.10);
--border-strong: rgba(255,255,255,0.16);
/* Text */
--text-primary: #F5F7FA;
--text-secondary: #B4BCC8;
--text-tertiary: #6B7280;
--text-disabled: #3F4651;
/* Status */
--success-500: #22C55E;
--warning-500: #F59E0B;
--error-500: #EF4444;
/* Fonts */
--font-sans: "Geist", "Inter", ui-sans-serif, system-ui, sans-serif;
--font-mono: "Geist Mono", "JetBrains Mono", ui-monospace, monospace;
/* Radius */
--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 12px;
--radius-xl: 16px;
--radius-full: 9999px;
/* Motion */
--dur-fast: 120ms;
--dur-base: 200ms;
--dur-slow: 400ms;
--ease-std: cubic-bezier(0.2,0.8,0.2,1);
--ease-em: cubic-bezier(0.16,1,0.3,1);
/* Spacing (4px grid) */
--sp-1: 4px;
--sp-2: 8px;
--sp-3: 12px;
--sp-4: 16px;
--sp-5: 20px;
--sp-6: 24px;
--sp-8: 32px;
--sp-10: 40px;
--sp-12: 48px;
--sp-16: 64px;
--sp-20: 80px;
--sp-24: 96px;
}