:root {
    --color-ink: #202124; /* Main headings and dark copy. */
    --color-text: #41464b; /* Default body text. */
    --color-muted: #6f747b; /* Secondary copy and hints. */
    --color-soft: #f6f6f4; /* Site background wash. */
    --color-paper: #ffffff; /* Primary white surfaces. */
    --color-white: #fff; /* Short white alias. */
    --color-black: #000; /* Mask and fade anchors. */
    --color-line: #e3e2de; /* Borders and dividers. */
    --color-accent: #5f2922; /* Primary Beaver brand brown. */
    --color-accent-dark: #43201b; /* Dark brand hover and emphasis. */
    --color-accent-soft: #fff3e6; /* Soft amber hover fills. */
    --color-accent-press: #fdbd7a; /* Pressed button amber. */
    --color-steel: #687078; /* Kicker labels and UI metadata. */
    --color-charcoal: #24272c; /* Dark section backgrounds. */
    --color-tint: #f1f1ef; /* Alternate light sections. */
    --color-footer: #17191d; /* Footer background. */
    --color-inverse: #ffffff; /* Text on dark surfaces. */
    --color-disabled-text: #85878a; /* Disabled button text. */
    --color-disabled-line: #deddda; /* Disabled button border. */
    --color-valid: #557386; /* Valid field outline. */
    --color-invalid: #8f3429; /* Invalid field outline. */
    --color-validation: #fdbd70; /* Validation copy on dark surfaces. */
    --color-checkout-link: #ffd9a7; /* Checkout consent links. */
    --color-checkout-error-text: #ffe8d0; /* Checkout error text. */
    --color-error-surface: #5f2922; /* Blazor error boundary. */
    --color-error-ui: lightyellow; /* Blazor error bar. */
    --color-release-blue: #4979b8; /* Workflow check legend start. */
    --color-release-ice: #e6ecef; /* Workflow check legend cool midpoint. */
    --color-release-gold: #f0d789; /* Workflow check legend warm midpoint. */
    --color-release-critical: #000; /* Workflow check legend critical end. */
    --color-transparent: transparent; /* Transparent fills and stops. */

    --color-ink-045: rgba(31, 34, 38, 0.045); /* Nav hover fill. */
    --color-ink-052: rgba(31, 34, 38, 0.052); /* Hero grid lines. */
    --color-ink-055: rgba(31, 34, 38, 0.055); /* Nav hover inset line. */
    --color-ink-06: rgba(31, 34, 38, 0.06); /* Soft dark gradient stop. */
    --color-ink-08: rgba(31, 34, 38, 0.08); /* Light separators. */
    --color-ink-09: rgba(31, 34, 38, 0.09); /* Card shadows. */
    --color-ink-10: rgba(31, 34, 38, 0.1); /* Subtle dark borders. */
    --color-ink-12: rgba(31, 34, 38, 0.12); /* Standard dark borders. */
    --color-ink-14: rgba(31, 34, 38, 0.14); /* Floating panel shadow. */
    --color-ink-20: rgba(31, 34, 38, 0.20); /* Outline dark borders. */
    --color-ink-22: rgba(31, 34, 38, 0.22); /* Fact divider gradients. */

    --color-paper-08: rgba(255, 255, 255, 0.08); /* Dark surface panels. */
    --color-paper-10: rgba(255, 255, 255, 0.1); /* Dark nav hover fill. */
    --color-paper-12: rgba(255, 255, 255, 0.12); /* Dark surface borders. */
    --color-paper-16: rgba(255, 255, 255, 0.16); /* Workflow step dividers. */
    --color-paper-18: rgba(255, 255, 255, 0.18); /* Support note border. */
    --color-paper-20: rgba(255, 255, 255, 0.2); /* Dark media border. */
    --color-paper-22: rgba(255, 255, 255, 0.22); /* Active badge surface. */
    --color-paper-48: rgba(255, 255, 255, 0.48); /* Dark menu numbering. */
    --color-paper-66: rgba(255, 255, 255, 0.66); /* Support note label. */
    --color-paper-72: rgba(255, 255, 255, 0.72); /* Light outline buttons. */
    --color-paper-76: rgba(255, 255, 255, 0.76); /* Dark section body copy. */
    --color-paper-88: rgba(255, 255, 255, 0.88); /* Release rail glass. */
    --color-paper-90: rgba(255, 255, 255, 0.9); /* Dark menu links. */
    --color-paper-94: rgba(255, 255, 255, 0.94); /* Light menu glass. */
    --color-paper-96: rgba(255, 255, 255, 0.96); /* Feature media gradient. */

    --color-accent-00: rgba(95, 41, 34, 0); /* Brand gradient fade end. */
    --color-accent-05: rgba(253, 189, 112, 0.14); /* Amber feature glow. */
    --color-accent-055: rgba(253, 189, 112, 0.16); /* Hero proof glow. */
    --color-accent-08: rgba(253, 189, 112, 0.18); /* Pricing hover fill. */
    --color-accent-10: rgba(253, 189, 112, 0.22); /* Pricing badge fill. */
    --color-accent-12: rgba(95, 41, 34, 0.12); /* Checkout error surface. */
    --color-accent-14: rgba(95, 41, 34, 0.18); /* Primary button shadow. */
    --color-accent-18: rgba(95, 41, 34, 0.22); /* Active pricing shadow. */
    --color-accent-24: rgba(253, 189, 112, 0.42); /* Focus ring. */
    --color-accent-28: rgba(95, 41, 34, 0.28); /* Video play shadow. */
    --color-accent-30: rgba(253, 189, 112, 0.38); /* Project hover border. */
    --color-accent-dark-18: rgba(67, 32, 27, 0.22); /* Primary hover shadow. */

    --color-feature-surface: rgba(248, 248, 246, 0.98); /* Feature media base. */
    --color-checkout-error-line: rgba(253, 189, 112, 0.44); /* Checkout error border. */
    --color-dark-panel-92: rgba(23, 25, 29, 0.92); /* Dark navigation panel. */
    --color-mask-20: rgba(0, 0, 0, 0.2); /* Error UI shadow. */
    --color-mask-24: rgba(0, 0, 0, 0.24); /* Workflow media shadow. */
    --color-mask-28: rgba(0, 0, 0, 0.28); /* Dark panel shadow. */
    --color-mask-42: rgba(0, 0, 0, 0.42); /* Hero mask fade. */
    --color-mask-92: rgba(0, 0, 0, 0.92); /* Hero mask body. */
    --color-video-ink-08: rgba(32, 33, 36, 0.08); /* YouTube overlay top. */
    --color-video-ink-18: rgba(32, 33, 36, 0.18); /* YouTube poster tint. */
    --color-video-ink-42: rgba(32, 33, 36, 0.42); /* YouTube overlay bottom. */
    --color-video-ink-54: rgba(32, 33, 36, 0.54); /* YouTube poster bottom tint. */

    --shadow-soft: 0 18px 48px var(--color-ink-09); /* Soft card shadow. */
}