:root {

    /* Colors */

    --primary: #111111;
    --secondary: #ffffff;

    --accent: #2563eb;
    --success: #16a34a;
    --danger: #dc2626;
    --warning: #f59e0b;

    --text-primary: #222222;
    --text-secondary: #666666;

    --border: #e5e7eb;
    --background: #f7f7f7;
    --card-bg: #ffffff;

    /* Fonts */

    --font-family:
        "Inter",
        "Segoe UI",
        sans-serif;

    /* Radius */

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;

    /* Shadows */

    --shadow-sm:
        0 2px 6px rgba(0,0,0,.08);

    --shadow-md:
        0 6px 16px rgba(0,0,0,.12);

    /* Transition */

    --transition:
        .25s ease;

}