/*
 * Racerverse Shared Design Tokens
 * Imported by both the viewer (anatomy.html, etc.) and the website (via CDN).
 * Single source of truth for colors, fonts, and spacing.
 */

:root {
    /* ── Background ── */
    --rv-bg-primary: #0a0a0a;
    --rv-bg-secondary: #0d0d0d;
    --rv-bg-panel: #1a1a2e;

    /* ── Accent colors ── */
    --rv-teal: #4ECDC4;
    --rv-teal-rgb: 78, 205, 196;
    --rv-coral: #FF6B6B;
    --rv-coral-rgb: 255, 107, 107;
    --rv-gold: #ffd700;
    --rv-orange: #ff8c00;

    /* ── Category colors ── */
    --rv-cat-racer: #FFFFFF;
    --rv-cat-vehicle: #FF6B6B;
    --rv-cat-driver: #4ECDC4;
    --rv-cat-tires: #FFE66D;
    --rv-cat-goggles: #A78BFA;
    --rv-cat-hat: #F97316;
    --rv-cat-attachment: #34D399;

    /* ── Text ── */
    --rv-text-primary: #ffffff;
    --rv-text-secondary: rgba(255, 255, 255, 0.7);
    --rv-text-muted: rgba(255, 255, 255, 0.5);
    --rv-text-faint: rgba(255, 255, 255, 0.35);

    /* ── Borders & surfaces ── */
    --rv-border-subtle: rgba(255, 255, 255, 0.06);
    --rv-border-light: rgba(255, 255, 255, 0.08);
    --rv-border-hover: rgba(255, 255, 255, 0.1);
    --rv-surface-hover: rgba(255, 255, 255, 0.05);
    --rv-surface-active: rgba(255, 255, 255, 0.06);
    --rv-surface-faint: rgba(255, 255, 255, 0.02);

    /* ── Typography ── */
    --rv-font-display: Moreganic, sans-serif;
    --rv-font-body: Lato, sans-serif;
    --rv-font-viewer: 'Nunito', sans-serif;

    /* ── Spacing ── */
    --rv-radius-sm: 10px;
    --rv-radius-md: 12px;
    --rv-radius-lg: 16px;
}