:root {
    --color-ink: #181d26;
    --color-ink-active: #0d1218;
    --color-body: #333840;
    --color-muted: #667085;
    --color-canvas: #ffffff;
    --color-surface-soft: #f8fafc;
    --color-hairline: #dddddd;
    --color-focus: #458fff;
    --color-success: #166534;
    --color-warning: #b45309;
    --color-danger: #b42318;
    --color-info: #1d4ed8;
    --color-success-border: #9fd8ad;
    --color-warning-border: #f2c4b8;
    --color-danger-border: #f2b8b5;
    --color-success-bg: #e8f7ec;
    --color-warning-bg: #fff4dd;
    --color-danger-bg: #fff5f5;
    --color-success-progress: rgba(46, 160, 67, 0.16);
    --color-danger-progress: rgba(217, 45, 32, 0.16);
    --color-danger-focus: rgba(217, 45, 32, 0.2);
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 12px;
    --control-height-sm: 2rem;
    --control-height-md: 2.5rem;
    --button-label-size: 0.74rem;
    --button-label-weight: 700;
    --button-icon-size: 14px;
    --button-fa-size: 12px;
    --button-compact-icon-size: 12px;
    --shadow-modal: 0 20px 42px rgba(0, 0, 0, 0.16);
    --primary: var(--color-ink);
    --primary-active: var(--color-ink-active);
    --canvas: var(--color-canvas);
    --body: var(--color-body);
    --hairline: var(--color-hairline);
    --surface-soft: var(--color-surface-soft);
    --signature-coral: #aa2d00;
    --on-dark: #ffffff;
    --section: 96px;
}