:root {
  /* core */
  --cw-ink: #171322;
  --cw-amethyst: #6D4BC3;
  --cw-gold: #B48A46;
  --cw-paper: #F6F3ED;
  --cw-lavender: #C8B6F4;
  --cw-white: #FFFFFF;
  /* neutral scale */
  --cw-n50: #F6F3ED;
  --cw-n100: #DAD7D4;
  --cw-n200: #BEBBBB;
  --cw-n300: #A3A0A3;
  --cw-n400: #89868C;
  --cw-n500: #706D75;
  --cw-n600: #58545F;
  --cw-n700: #413D4A;
  --cw-n800: #2B2735;
  --cw-n900: #171322;
  /* semantic */
  --cw-text: #171322;
  --cw-text-muted: #58545F;
  --cw-canvas: #F6F3ED;
  --cw-surface: #FFFFFF;
  --cw-border: #706D75;
  --cw-border-subtle: #BEBBBB;
  --cw-action: #6D4BC3;
  --cw-action-hover: #58389F;
  --cw-action-active: #47298A;
  --cw-on-action: #FFFFFF;
  --cw-link: #6D4BC3;
  --cw-link-hover: #58389F;
  --cw-focus: #171322;
  --cw-focus-on-dark: #C8B6F4;
  --cw-error: #A12F2F;
  --cw-warning: #7A5200;
  --cw-success: #1F6B4E;
  --cw-info: #2A5A8C;
  --cw-disabled-text: #58545F;
  --cw-disabled-fill: #DAD7D4;
  --cw-inverse-canvas: #171322;
  --cw-inverse-text: #F6F3ED;
  --cw-accent-gold: #B48A46;
  --cw-gold-text: #765920;
  --cw-accent-lavender: #C8B6F4;
  /* character art only (additive, color.character in design-tokens.json) */
  --cw-char-skin: #F4B379;
  --cw-char-hair-brown: #573C2C;
  --cw-char-cream: #FDF7EE;
  --cw-char-gold: #C29245;
  --cw-char-ink: #1A1722;
  --cw-char-lining: #6E4ABE;
  --cw-char-ink-deep: #131018;
  --cw-char-ink-soft: #221E2D;
  --cw-char-lining-shade: #6646B0;
  --cw-char-lining-light: #7555B6;
  --cw-char-gold-light: #E7C169;
  --cw-char-tablet: #414252;
  --cw-char-skin-crease: #A05527;
  --cw-char-skin-shade: #CA7D49;
  --cw-char-nose: #864324;
  --cw-char-crease: #352827;
  --cw-char-scrap: #C2BFC8;
  /* font families */
  --cw-font-display: "Barlow Semi Condensed", "Franklin Gothic Medium", Bahnschrift, sans-serif;
  --cw-font-body: "Source Serif 4", Georgia, "Times New Roman", serif;
  --cw-font-label: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  /* space (8 px scale) */
  --cw-space-0: 0px;
  --cw-space-4: 4px;
  --cw-space-8: 8px;
  --cw-space-16: 16px;
  --cw-space-24: 24px;
  --cw-space-32: 32px;
  --cw-space-48: 48px;
  --cw-space-64: 64px;
  --cw-space-96: 96px;
  --cw-space-128: 128px;
  --cw-radius: 2px;
  --cw-border-hairline: 1px;
  --cw-border-strong: 2px;
  --cw-focus-width: 3px;
  --cw-focus-offset: 2px;
  /* motion */
  --cw-duration-micro: 120ms;
  --cw-duration-state: 200ms;
  --cw-duration-reveal: 320ms;
  --cw-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --cw-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  /* character motion (gestures only; interface motion is above) */
  --cw-char-duration-micro: 120ms;
  --cw-char-duration-gesture: 400ms;
  --cw-char-duration-big: 800ms;
  --cw-char-ease-overshoot: cubic-bezier(0.34, 1.56, 0.64, 1);
  --cw-char-squash-max: 0.15;
  /* layout, mobile first (375) */
  --cw-gutter: 24px;
  --cw-measure: 62ch;
  --cw-measure-max: 72ch;
  --cw-margin: 16px;
  --cw-container: 343px;
  --cw-display-size: 36px;
  --cw-display-lh: 1.08;
  --cw-h2-size: 28px;
  --cw-h2-lh: 1.12;
  --cw-h3-size: 22px;
  --cw-h3-lh: 1.2;
  --cw-h4-size: 18px;
  --cw-h4-lh: 1.25;
  --cw-body-large-size: 18px;
  --cw-body-large-lh: 1.55;
  --cw-body-size: 17px;
  --cw-body-lh: 1.6;
  --cw-small-size: 15px;
  --cw-small-lh: 1.5;
  --cw-label-size: 12px;
  --cw-label-lh: 1.4;
}
@media (min-width: 768px) {
  :root {
    --cw-margin: 32px;
    --cw-container: 704px;
    --cw-display-size: 48px;
    --cw-h2-size: 34px;
    --cw-h3-size: 24px;
    --cw-h4-size: 20px;
    --cw-body-large-size: 19px;
    --cw-body-size: 17px;
    --cw-small-size: 15px;
    --cw-label-size: 12px;
  }
}
@media (min-width: 1280px) {
  :root {
    --cw-margin: 48px;
    --cw-container: 1120px;
    --cw-display-size: 64px;
    --cw-h2-size: 40px;
    --cw-h3-size: 26px;
    --cw-h4-size: 20px;
    --cw-body-large-size: 20px;
    --cw-body-size: 18px;
    --cw-small-size: 15px;
    --cw-label-size: 13px;
  }
}
@media (min-width: 1920px) {
  :root {
    --cw-margin: 48px;
    --cw-container: 1280px;
    --cw-display-size: 72px;
    --cw-h2-size: 44px;
    --cw-h3-size: 28px;
    --cw-h4-size: 22px;
    --cw-body-large-size: 20px;
    --cw-body-size: 18px;
    --cw-small-size: 16px;
    --cw-label-size: 13px;
  }
}
@media (prefers-reduced-motion: reduce) {
  :root { --cw-duration-micro: 0ms; --cw-duration-state: 0ms; --cw-duration-reveal: 0ms; --cw-char-duration-micro: 0ms; --cw-char-duration-gesture: 0ms; --cw-char-duration-big: 0ms; }
}
