:root {
    /* TEXT */
    --laf-color-text: #1f2937;
    --laf-color-text-soft: #6b7280;
    --laf-color-text-muted: #9ca3af;

    /* SURFACES */
    --laf-color-surface: #ffffff;
    --laf-color-surface-soft: #f8fafc;
    --laf-color-surface-muted: #f3f4f6;

    /* BORDER */
    --laf-color-border: rgba(15, 23, 42, 0.10);
    --laf-color-border-strong: rgba(15, 23, 42, 0.18);

    /* BRAND */
    --laf-color-brand: #ce1126;
    --laf-color-brand-soft: rgba(206, 17, 38, 0.08);
    --laf-color-brand-border: rgba(206, 17, 38, 0.28);

    /* RADIUS */
    --laf-radius-sm: 10px;
    --laf-radius-md: 14px;
    --laf-radius-lg: 18px;
    --laf-radius-pill: 999px;

    /* SHADOW */
    --laf-shadow-widget: 0 10px 30px rgba(15, 23, 42, 0.04);
    --laf-shadow-soft: 0 4px 14px rgba(15, 23, 42, 0.06);

    /* SPACING */
    --laf-space-1: 6px;
    --laf-space-2: 10px;
    --laf-space-3: 14px;
    --laf-space-4: 18px;
    --laf-space-5: 24px;
    --laf-space-6: 32px;

    /* TRANSITIONS */
    --laf-transition-fast: 0.18s ease;
    --laf-transition-base: 0.22s ease;
}