/* ==========================================================================
   Gruvbox Design Tokens & Variables
   ========================================================================== */

:root {
    /* Gruvbox Dark Palette */
    --bg-hard: #1d2021;
    --bg: #282828;
    --bg-soft: #32302f;
    --bg-card: #3c3836;
    --bg-hover: #504945;

    --fg-0: #fbf1c7;
    --fg-1: #ebdbb2;
    --fg-4: #d5c4a1; /* Gruvbox fg2 - WCAG AAA compliant (>7.5:1 contrast on #282828, >5.5:1 on #3c3836) */
    --gray: #bdae93; /* Gruvbox fg3 - WCAG AA compliant (>6.0:1 contrast on #282828, >4.7:1 on #3c3836) */

    --red: #fb4934;
    --green: #b8bb26;
    --yellow: #fabd2f;
    --blue: #83a598;
    --purple: #d3869b;
    --aqua: #8ec07c;
    --orange: #fe8019;

    --font-mono: 'JetBrains Mono', 'Fira Code', 'FiraCode Nerd Font', 'Cascadia Code', monospace;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Contrast Modes */
body[data-contrast="hard"] { --bg: var(--bg-hard); }
body[data-contrast="soft"] { --bg: var(--bg-soft); }

/* Animation Keyframes */
@keyframes cursor-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

@keyframes floatUp {
    0% {
        opacity: 1;
        transform: translate(0, 0) scale(1);
    }
    100% {
        opacity: 0;
        transform: translate(var(--tx, 0px), var(--ty, -100px)) scale(0.5) rotate(45deg);
    }
}