:root {
  /* Colors */
  --color-bg-primary:     #071019;
  --color-bg-secondary:   #0D1823;
  --color-bg-card:        #101E2C;
  --color-border:         rgba(132, 179, 214, 0.18);
  --color-border-light:   rgba(132, 179, 214, 0.34);

  --color-accent:         #53D0FF;
  --color-accent-deep:    #2E9CFF;
  --color-accent-glow:    rgba(83, 208, 255, 0.18);
  --color-accent-subtle:  rgba(83, 208, 255, 0.08);

  --color-highlight:      #FF9D7E;
  --color-highlight-glow: rgba(255, 157, 126, 0.14);

  --color-text-primary:   #F4F8FD;
  --color-text-secondary: #D1DCE9;
  --color-text-muted:     #8FA6BB;
  --color-text-faint:     #5D7186;

  /* Typography */
  --font-display: 'Source Han Sans SC', 'Source Han Sans CN', 'Noto Sans CJK SC', 'Noto Sans SC', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --font-body: 'Source Han Sans SC', 'Source Han Sans CN', 'Noto Sans CJK SC', 'Noto Sans SC', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;

  /* Type scale */
  --text-hero:    clamp(3.5rem, 9vw, 8rem);
  --text-display: clamp(2rem, 5vw, 3.5rem);
  --text-title:   clamp(1.25rem, 3vw, 1.75rem);
  --text-body:    1rem;
  --text-small:   0.875rem;
  --text-micro:   0.75rem;

  /* Line heights */
  --leading-tight:   1.1;
  --leading-snug:    1.35;
  --leading-normal:  1.6;
  --leading-relaxed: 1.85;

  /* Spacing */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  48px;
  --space-2xl: 80px;
  --space-3xl: 120px;

  /* Layout */
  --max-width:     1200px;
  --content-width: 860px;
  --section-pad-x: clamp(20px, 5vw, 80px);
  --section-pad-y: clamp(64px, 10vw, 120px);

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 32px;

  /* Shadows */
  --shadow-card:  0 4px 24px rgba(0, 0, 0, 0.4), 0 1px 4px rgba(0, 0, 0, 0.3);
  --shadow-float: 0 12px 48px rgba(0, 0, 0, 0.5), 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-glow:  0 0 40px var(--color-accent-glow);

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   500ms ease;
  --transition-spring: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
