:root {
    /* Couleurs principales */
    --td-primary: #2563eb;
    --td-primary-hover: #1d4ed8;
    --td-primary-active: #1e40af;
    --td-primary-soft: #eff6ff;
    --td-success: #16a34a;
    --td-success-hover: #15803d;
    --td-success-soft: #f0fdf4;
    --td-warning: #d97706;
    --td-warning-hover: #b45309;
    --td-warning-soft: #fffbeb;
    --td-danger: #dc2626;
    --td-danger-hover: #b91c1c;
    --td-danger-soft: #fef2f2;
    /* Surfaces */
    --td-background: #f8fafc;
    --td-surface: #ffffff;
    --td-surface-secondary: #f1f5f9;
    --td-surface-hover: #f8fafc;
    /* Textes */
    --td-text: #0f172a;
    --td-text-secondary: #475569;
    --td-text-muted: #64748b;
    --td-text-disabled: #94a3b8;
    --td-text-on-primary: #ffffff;
    /* Bordures */
    --td-border: #e2e8f0;
    --td-border-strong: #cbd5e1;
    --td-focus-ring: rgba(37, 99, 235, 0.22);
    /* Ombres */
    --td-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --td-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.04);
    /* Rayons */
    --td-radius-sm: 6px;
    --td-radius-md: 10px;
    --td-radius-lg: 14px;
    --td-radius-xl: 18px;
    /* Espacements */
    --td-space-1: 4px;
    --td-space-2: 8px;
    --td-space-3: 12px;
    --td-space-4: 16px;
    --td-space-5: 20px;
    --td-space-6: 24px;
    --td-space-8: 32px;
    --td-space-10: 40px;
    --td-space-12: 48px;
    /* Typographie */
    --td-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --td-font-size-xs: 0.75rem;
    --td-font-size-sm: 0.875rem;
    --td-font-size-md: 1rem;
    --td-font-size-lg: 1.125rem;
    --td-font-size-xl: 1.25rem;
    --td-font-size-2xl: 1.5rem;
    --td-font-size-3xl: 1.875rem;
    /* Animations */
    --td-transition-fast: 120ms ease;
    --td-transition-normal: 180ms ease;
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    background: var(--td-background);
    color: var(--td-text);
    font-family: var(--td-font-family);
    font-size: var(--td-font-size-md);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: var(--td-primary);
}