:root {
  --color-ink: #241c56;
  --color-ink-soft: #4b4473;
  --color-muted: #756f94;
  --color-faint: #aaa4bd;
  --color-brand: #7457d4;
  --color-brand-deep: #342278;
  --color-brand-soft: #cfc4f1;
  --color-canvas: #f9f7ff;
  --color-canvas-strong: #eeebfb;
  --color-surface: rgba(255, 255, 255, .68);
  --color-surface-strong: rgba(255, 255, 255, .84);
  --color-line: rgba(106, 83, 178, .16);
  --color-moon: #ead6a1;
  --font-display: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  --font-body: "Noto Sans TC", "Microsoft JhengHei", "PingFang TC", sans-serif;
  --desktop-canvas-width: 1920px;
  --desktop-canvas-height: 4320px;
  --desktop-main-height: 3885px;
  --desktop-content-width: 1440px;
  --desktop-hero-width: 1453px;
  --desktop-page-gutter: min(12.5vw, 240px);
  --desktop-card-radius: 37.131px;
  --desktop-preview-border: #d0c2ee;
  --desktop-nav-shadow: 0 19.224px 64.08px rgba(47, 31, 102, .09);
  --content-width: 90rem;
  --reading-width: 48rem;
  --space-1: .5rem;
  --space-2: .75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 7rem;
  --space-9: 9rem;
  --radius-sm: .75rem;
  --radius-md: 1.25rem;
  --radius-lg: 2rem;
  --radius-xl: 2.75rem;
  --shadow-soft: 0 1.5rem 4rem rgba(45, 29, 100, .12);
  --shadow-card: 0 1rem 2.5rem rgba(75, 57, 137, .1);
  --shadow-glow: 0 0 3.5rem rgba(112, 82, 210, .26);
  --motion-fast: 180ms;
  --motion-medium: 520ms;
  --motion-slow: 1100ms;
}