:root {
  color-scheme: light;
  --color-ivory: oklch(97% 0.018 87);
  --color-ivory-deep: oklch(93% 0.03 86);
  --color-cocoa: oklch(24% 0.036 48);
  --color-cocoa-soft: oklch(40% 0.036 48);
  --color-mustard: oklch(76% 0.135 88);
  --color-mustard-deep: oklch(62% 0.12 80);
  --color-success: oklch(55% 0.12 145);
  --color-error: oklch(58% 0.18 28);
  --color-focus: oklch(50% 0.12 250);
  --color-cocoa-18: oklch(24% 0.036 48 / 0.18);
  --color-cocoa-35: oklch(24% 0.036 48 / 0.35);
  --color-ivory-34: oklch(97% 0.018 87 / 0.34);
  --font-sans: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-button: 600;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.25rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 2.5rem;
  --space-3xl: 3rem;
  --space-4xl: 4rem;
  --space-5xl: 6rem;
  --page-gutter: clamp(1rem, 4vw, 3rem);
  --shadow-soft: 0 1.25rem 3.5rem oklch(24% 0.036 48 / 0.14);
  --shadow-fallback: 0 1rem 3rem oklch(24% 0.036 48 / 0.12);
  --shadow-petal-drop: 0 0.8rem 1.2rem var(--color-cocoa-18);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 160ms;
  --duration-medium: 420ms;
  --duration-slow: 720ms;
}