:root {

    --primary: #343873;
    --primary-dark: #252660;
    --primary-light: #ecedf6;
    --primary-mid: #6567a8;

    --secondary: #dd4040;
    --secondary-dark: #b83030;
    --secondary-light:#fde8e8;

    --success: #16a34a;
    --danger: #dc2626;
    --warning: #d97706;
    --info: #0284c7;

    --surface: #ffffff;
    --surface-2: #f9fafb;
    --surface-3: #f3f4f6;

    --border: #e5e7eb;

    --text-1: #111827;
    --text-2: #374151;
    --text-3: #6b7280;
    --text-4: #9ca3af;

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;

    --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
    --shadow-md: 0 4px 16px rgba(0,0,0,.08);

    --transition: all .2s cubic-bezier(.4,0,.2,1);
}

body {

    font-family: 'DM Sans', sans-serif;
    background: var(--surface-2);
    color: var(--text-2);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'DM Sans', sans-serif;
    letter-spacing: -0.02em;
}

p, span, label, input, select, button, table {
    font-family: 'DM Sans', sans-serif;
}