/* tokens.css - Shared design tokens for Mac Studio and Playground */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Cormorant+Garamond:wght@500;600;700&family=IBM+Plex+Mono:wght@400;600&display=swap');

:root {
    /* Surfaces */
    --bg: #1a1918;
    --surface: #211f1d;
    --surface-hover: #292724;
    --surface-active: #332f2c;
    --surface-active-strong: #3d3935;

    /* Ink */
    --ink: #e8e0d4;
    --ink-muted: rgba(232, 224, 212, 0.5);
    --ink-faint: rgba(232, 224, 212, 0.25);

    /* Accents */
    --accent: #c44b2b;
    --accent-hover: #d4593a;
    --accent-soft: rgba(196, 75, 43, 0.15);
    --teal: #3aaa8a;
    --teal-hover: #4dbfa0;
    --gold: #c8992a;
    --green: #98c379;
    --red: #c44b2b;

    /* Structure */
    --divider: rgba(232, 224, 212, 0.1);
    --divider-strong: rgba(232, 224, 212, 0.18);
    --shadow: rgba(0, 0, 0, 0.3);
    --radius: 10px;
    --radius-sm: 6px;

    /* Typography */
    --font-display: 'Bricolage Grotesque', system-ui, sans-serif;
    --font-serif: 'Cormorant Garamond', Georgia, serif;
    --font-mono: 'IBM Plex Mono', 'Fira Code', monospace;
}
