:root {
  --color-page-bg: #f8f9fa;
  --color-surface: #ffffff;
  --color-surface-soft: #f3f4f6;
  --color-surface-muted: #f7f7f8;
  --color-surface-hover: #f8fafc;

  --color-text-main: #1f2937;
  --color-text-strong: #111827;
  --color-text-muted: #6b7280;
  --color-text-secondary: #4b5563;
  --color-text-subtle: #374151;
  --color-text-placeholder: #9ca3af;
  --color-text-inverse: #ffffff;

  --color-accent: #750e0e;
  --color-accent-hover: #5c0a0a;
  --color-accent-soft: rgba(117, 14, 14, 0.08);
  --color-accent-soft-strong: rgba(117, 14, 14, 0.12);

  --color-border: rgba(17, 24, 39, 0.08);
  --color-border-soft: rgba(17, 24, 39, 0.06);
  --color-border-strong: rgba(17, 24, 39, 0.12);
  --color-border-input: #d1d5db;
  --color-border-input-strong: #d7dbe3;
  --color-border-checkbox: #b8bec9;
  --color-border-dashed: #d1d5db;

  --color-header-bg: #ffffff;
  --color-header-text: #1f2937;
  --color-map-bg: #eef2f7;
  --color-quote-bg: #f3f4f6;
  --color-badge-bg: #f3f4f6;
  --color-modal-backdrop: rgba(0, 0, 0, 0.45);

  --shadow-card: 0 8px 30px rgba(17, 24, 39, 0.08);
  --shadow-soft: 0 2px 14px rgba(17, 24, 39, 0.06);
  --shadow-modal: 0 24px 60px rgba(17, 24, 39, 0.18);

  --radius-sm: 1rem;
  --radius-md: 1.25rem;
  --radius-lg: 1.5rem;

  --button-primary-bg: var(--color-accent);
  --button-primary-hover: var(--color-accent-hover);
  --button-primary-text: var(--color-text-inverse);

  --button-outline-bg: var(--color-surface);
  --button-outline-text: var(--color-accent);
  --button-outline-border: var(--color-accent);
  --button-outline-hover-bg: #fff5f5;
  --button-outline-hover-text: var(--color-accent-hover);
  --button-outline-hover-border: var(--color-accent-hover);

  --hero-overlay: rgba(0, 0, 0, 0.45);
  --page-banner-overlay: rgba(0, 0, 0, 0.42);
}