/* ============================================================
   设计 token（抽取自公司官网 psychoreality v32）
   保持与官网一致的视觉语言：黑白灰、克制、编辑化
   ============================================================ */

:root {
  --color-white: #ffffff;
  --color-black: #050505;
  --color-text: #0b0b0b;
  --color-text-medium: rgba(11, 11, 11, .72);
  --color-text-muted: rgba(11, 11, 11, .62);
  --color-text-soft: rgba(17, 17, 17, .72);
  --color-text-faint: rgba(17, 17, 17, .56);
  --color-line: rgba(17, 17, 17, .14);
  --color-line-strong: rgba(17, 17, 17, .22);
  --color-light-line-soft: rgba(17, 17, 17, .08);
  --color-line-soft: rgba(17, 17, 17, .08);
  --color-line-hover: rgba(17, 17, 17, .18);
  --color-surface-soft: rgba(17, 17, 17, .035);
  --color-surface-hover-soft: rgba(17, 17, 17, .06);
  --color-indicator-muted: rgba(17, 17, 17, .12);
  --color-indicator-active: rgba(17, 17, 17, .58);
  --color-page-bg: #ffffff;
  --color-header-bg: rgba(255, 255, 255, .76);

  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC",
               "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;

  --text-xs: 12px;
  --text-sm: 14px;
  --text-md: 16px;
  --text-lg: 18px;
  --text-body-large: clamp(16px, 1.18vw, 18px);
  --text-xl: clamp(26px, 2.8vw, 40px);
  --text-section-title: clamp(28px, 3.25vw, 46px);
  --text-page-title: clamp(34px, 4.4vw, 64px);

  --leading-tight: 1.12;
  --leading-title: 1.24;
  --leading-body: 1.5;
  --leading-loose: 1.68;

  --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; --space-20: 80px; --space-24: 96px;
  --space-28: 112px; --space-32: 128px;

  --container-width: 1180px;
  --container-pad: clamp(24px, 4vw, 56px);
  --header-height: clamp(76px, 8vw, 96px);

  --radius-sm: 0px;
  --radius-md: 0px;
  --radius-lg: 0px;
  --radius-pill: 999px;

  --duration-fast: 160ms;
  --duration-base: 240ms;
  --duration-slow: 520ms;
  --ease-standard: cubic-bezier(.65, 0, .2, 1);
  --ease-carousel: cubic-bezier(.22, .61, .36, 1);

  --z-header: 1000;
  --z-drawer: 1100;
  --z-modal: 1200;
}