/* Techne Design Tokens Canonical --techne-* custom properties. :root provides light defaults; the theme manager applies per-theme overrides inline on . No body-level dark fallback here — body declarations for custom props would shadow the inline html styles for body's own subtree (custom-prop cascade is per-element), so every dark-class theme would lose to a generic dark default. Each theme in themes.js owns its tokens fully. */ :root { /* Surfaces */ --techne-bg: #ffffff; --techne-surface: #fafafa; --techne-surface-elevated: #ffffff; /* Text */ --techne-text: #0a0a0a; --techne-text-muted: rgba(10, 10, 10, 0.55); --techne-text-inverted: #ffffff; /* Accent */ --techne-accent: #E63946; --techne-accent-hover: #c1121f; --techne-accent-active: #a30f19; /* Borders */ --techne-border: rgba(10, 10, 10, 0.22); --techne-border-subtle: rgba(10, 10, 10, 0.10); /* Semantic */ --techne-success: #2d6a4f; --techne-warning: #e09f3e; --techne-error: #d00000; /* Glass */ --techne-glass-bg: rgba(255, 255, 255, 0.85); --techne-glass-border: rgba(255, 255, 255, 0.18); }