:root {
    /* TYPOGRAPHY */
    --font-stack: 'Inter', system-ui, -apple-system, sans-serif;
    --font-mono: 'Courier New', monospace;

    /* PALETTE - NEO BRUTALISM */
    --bg-color: #f4f3ef;       /* Warm Off-white */
    --box-bg: #ffffff;         /* Pure White */
    --box-text: #000000;
    
    /* ACCENTS */
    --main-accent: #8B5CF6;    /* Violet */
    --secondary-accent: #F472B6; /* Pink */
    --success-color: #34D399;  /* Emerald */
    --error-color: #F87171;    /* Red */
    --text-color: #18181b;     /* Near Black */

    /* DIMENSIONS */
    --border-width: 3px;
    --shadow-offset: 5px;
    --radius: 0px;             /* Hard edges */
    --nav-height: 70px;
}

[data-theme="dark"] {
    --bg-color: #18181b;
    --box-bg: #27272a;
    --box-text: #f4f4f5;
    --main-accent: #A78BFA;
    --secondary-accent: #FBCFE8;
    --text-color: #f4f4f5;
    --success-color: #10B981;
    --error-color: #EF4444;
}

/* GLOBAL RESET */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: var(--font-stack);
    margin: 0;
    padding: 0;
    height: 100vh;
    width: 100vw;
    overflow-x: hidden;
    transition: background-color 0.2s ease;
}