:root {
  --color-primary-700: #0B6F5C;
  --color-primary-600: #0F856D;
  --color-primary-500: #16A085;
  --color-primary-100: #E7F6F1;
  --color-primary-50: #F4FAF8;

  --color-text-900: #1C2925;
  --color-text-700: #44544F;
  --color-text-500: #71817C;
  --color-border: #DCE8E4;
  --color-surface: #FFFFFF;
  --color-page: #F5F8F7;

  --color-success: #16856B;
  --color-warning: #D98B20;
  --color-danger: #D84C4C;
  --color-disabled: #A8B2AE;

  --font-family-base: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", Arial, sans-serif;
  --font-size-body: 14px;
  --font-size-small: 12px;
  --font-size-brand: 20px;

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

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --radius-pill: 999px;

  --shadow-sm: 0 4px 14px rgba(13, 63, 53, 0.06);
  --shadow-md: 0 12px 32px rgba(13, 63, 53, 0.08);
  --shadow-lg: 0 22px 60px rgba(13, 63, 53, 0.14);

  --header-height: 72px;
  --logo-size: 48px;
  --button-height: 40px;
  --form-control-height: 44px;
  --tag-height: 26px;
  --modal-standard-width: 600px;
  --modal-standard-height: 640px;
  --modal-title-size: 22px;
  --modal-item-title-size: 15px;
  --modal-item-text-size: 13px;
  --container-wide: 1480px;
  --container-default: 1280px;
  --container-reading: 900px;
  --page-gutter: 24px;
}