/* Generated from design-system.js. Run npm run theme; do not edit by hand. */
:root {
  --bg-hi: #fdf0eb;
  --bg: #f8e0da;
  --bg-lo: #efd3d4;
  --glass: #fdf0eba8;
  --glass-deep: #f8e0dabd;
  --card: #fffaf7;
  --card-glass: #fffaf7ed;
  --raised: #fffdfb;
  --line: #ecd8d2;
  --line-soft: #f4e8e4;
  --line-glass: #ecd8d2bf;
  --tint-lilac: #f3e6f2;
  --tint-peach: #fbeee9;
  --lilac: #c4a4d9;
  --lilac-hi: #ead2ea;
  --violet: #957bbd;
  --ink: #2e2636;
  --text-body: #4a3f4e;
  --muted: #5f4f5e;
  --accent: #634a7f;
  --accent-fill: #6a4f8f;
  --on-accent: #ffffff;
  --badge: #dccaf1;
  --badge-hi: #ece2f7;
  --badge-depth: inset 0 -1.5px 2px #957bbd33, 0 1px 2px rgba(98,66,104,.12);
  --sheen: #ffffffcc;
  --highlight: inset 0 1px 0 #ffffffd9;
  --shadow-ink: rgba(98,66,104,.14);
  --shadow-sm: 0 1px 2px rgba(98,66,104,.08), 0 3px 8px rgba(98,66,104,.08);
  --shadow-md: 0 2px 6px rgba(98,66,104,.07), 0 14px 34px rgba(98,66,104,.13);
  --shadow-lg: 0 4px 12px rgba(98,66,104,.08), 0 28px 70px rgba(98,66,104,.2);
  --scrim: rgba(98,66,104,.2);
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 22px;
  --type-title: 24px;
  --type-emphasis: 20px;
  --type-heading: 16px;
  --type-body: 14px;
  --type-caption: 12px;
}