:root {
  --ds-color-primary: #b71c1c;
  --ds-color-primary-dark: #8b0000;
  --ds-color-primary-light: #e53935;
  --ds-color-neutral-900: #1a1a1a;
  --ds-color-neutral-700: #424242;
  --ds-color-neutral-500: #757575;
  --ds-color-neutral-300: #bdbdbd;
  --ds-color-neutral-100: #f5f5f5;
  --ds-color-white: #ffffff;
  --ds-color-success: #2e7d32;
  --ds-color-warning: #ed6c02;
  --ds-color-secure: #1b5e20;

  --ds-font-sans: "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
  --ds-font-mono: "Consolas", "Monaco", monospace;
  --ds-text-base: 16px;
  --ds-text-sm: 14px;
  --ds-text-xs: 12px;
  --ds-text-lg: 18px;
  --ds-line-tight: 1.35;
  --ds-line-normal: 1.5;

  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 24px;
  --ds-space-6: 32px;
  --ds-radius: 6px;
  --ds-radius-lg: 10px;
  --ds-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  --ds-shadow-lg: 0 4px 20px rgba(0, 0, 0, 0.12);
}

.ds-root,
.ds-root body {
  font-family: var(--ds-font-sans);
  font-size: var(--ds-text-base);
  line-height: var(--ds-line-normal);
  color: var(--ds-color-neutral-900);
  background-color: var(--ds-color-white);
  -webkit-font-smoothing: antialiased;
}

.ds-root input,
.ds-root button,
.ds-root select,
.ds-root textarea {
  font-family: inherit;
  font-size: inherit;
}

.ds-root a {
  color: var(--ds-color-primary);
  text-decoration: none;
}

.ds-root a:hover {
  text-decoration: underline;
}

.ds-root *,
.ds-root *::before,
.ds-root *::after {
  box-sizing: border-box;
}