:root {
    /*
     * Materialized from the canonical DVM-SUITE Penpot source.
     * Source: DVM-SUITE.penpot
     * SHA256: b42adc5fa33b83d051889f8ef7ada7fd11a804c85bd0f6822deba8f470c3ee02
     * STEP211 blueprint: 01 — Dashboard + 00 — Design System + 99 — Components
     */

    --font-family-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --font-xs: 11px;
    --font-sm: 12px;
    --font-md: 14px;
    --font-lg: 18px;
    --font-xl: 24px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-7: 32px;

    --radius-xs: 8px;
    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 20px;
    --radius-pill: 999px;

    --color-bg: #f4f7fb;
    --color-surface: #ffffff;
    --color-surface-soft: #f8fbff;
    --color-primary: #102a4c;
    --color-primary-2: #1f4b82;
    --color-text: #143052;
    --color-muted: #5f7794;
    --color-border: #d6e1ef;
    --color-border-strong: #b6c7de;
    --color-accent: #3d7cff;

    --color-success: #247347;
    --color-success-bg: #e4f6ea;
    --color-warning: #85600f;
    --color-warning-bg: #fff4d8;
    --color-info: #275b98;
    --color-info-bg: #eaf4ff;
    --color-danger: #a03333;
    --color-danger-bg: #fde8e8;

    --shadow-soft:
        0 1px 2px rgba(18, 39, 67, 0.05),
        0 10px 28px rgba(18, 39, 67, 0.07);

    --shadow-panel:
        0 2px 8px rgba(18, 39, 67, 0.06),
        0 18px 42px rgba(18, 39, 67, 0.08);

    --shell-width: 1440px;
    --shell-gutter: 20px;
    --card-gap: 14px;

    --sidebar-width: 230px;
    --dashboard-left: 250px;
    --dashboard-header-height: 72px;
    --kpi-width: 270px;
    --kpi-height: 130px;
    --main-panel-width: 750px;
    --side-panel-width: 392px;

    --focus-ring: #3d7cff;
}