:root {
    --dtl-navy: #081426;
    --dtl-navy-soft: #10233d;
    --dtl-blue: #3b82f6;
    --dtl-cyan: #22d3ee;
    --dtl-white: #ffffff;
    --dtl-property: #16c79a;

    --dt-color-primary: #16b889;
    --dt-color-primary-strong: #087c64;
    --dt-color-primary-soft: #e9f9f4;
    --dt-color-brand: #3b82f6;
    --dt-color-accent: #7dd3fc;
    --dt-color-ink: #102033;
    --dt-color-ink-strong: #071525;
    --dt-color-muted: #66758a;
    --dt-color-subtle: #96a2b2;
    --dt-color-border: #e2e8f0;
    --dt-color-border-strong: #d2dbe7;
    --dt-color-surface: #ffffff;
    --dt-color-surface-muted: #f8fafc;
    --dt-color-canvas: #f4f7fb;
    --dt-color-success: #10b981;
    --dt-color-warning: #f59e0b;
    --dt-color-danger: #ef4444;
    --dt-color-info: #3b82f6;

    --dt-radius-xs: 7px;
    --dt-radius-sm: 10px;
    --dt-radius-md: 14px;
    --dt-radius-lg: 20px;
    --dt-radius-xl: 26px;
    --dt-radius-pill: 999px;

    --dt-shadow-xs: 0 1px 2px rgba(15, 23, 42, .04);
    --dt-shadow-sm: 0 8px 24px rgba(15, 23, 42, .06);
    --dt-shadow-md: 0 18px 50px rgba(15, 23, 42, .09);
    --dt-shadow-lg: 0 28px 80px rgba(8, 20, 38, .14);

    --dt-space-1: 4px;
    --dt-space-2: 8px;
    --dt-space-3: 12px;
    --dt-space-4: 16px;
    --dt-space-5: 20px;
    --dt-space-6: 24px;
    --dt-space-8: 32px;
    --dt-space-10: 40px;
    --dt-space-12: 48px;

    --dt-content-max: 1480px;
    --dt-sidebar-width: 268px;
    --dt-transition-fast: 150ms ease;
    --dt-transition-base: 220ms ease;
}