@font-face { font-family: "KMR Melange Grotesk"; src: url("./fonts/melange-grotesk-400.woff2") format("woff2"); font-weight: 400; font-style: normal; }
@font-face { font-family: "KMR Melange Grotesk"; src: url("./fonts/melange-grotesk-600.otf") format("opentype"); font-weight: 600; font-style: normal; }
@font-face { font-family: "Aime"; src: url("./fonts/aime-400.woff2") format("woff2"); font-weight: 400; font-style: normal; }
:root {
    --ds-page: #fbfaf9;
    --ds-raised: #f4efec;
    --ds-white: #ffffff;
    --ds-ink: #251f21;
    --ds-ink-2: #585254;
    --ds-ink-3: #969394;
    --ds-ink-4: #c0bebf;
    --ds-hairline: #eae9ea;
    --ds-teal: #73a89a;
    --ds-red: #ed313e;
    --ds-red-border: rgb(245 170 174);
    --ds-hover: color-mix(in srgb, #251f21 5%, transparent);
    --ds-hover-strong: color-mix(in srgb, #251f21 10%, transparent);
    --ds-hover-red: color-mix(in srgb, #ed313e 5%, transparent);
    --ds-scrim: rgb(46 39 41 / 0.45);
    --ds-shadow-control: 0 1px 2px color-mix(in srgb, #251f21 5%, transparent);
    --ds-shadow-modal: 0 30px 70px rgb(46 39 41 / 0.28);
    --ds-elevation-0: 0 0 1px color-mix(in srgb, #251f21 10%, transparent), 0 1px 2px color-mix(in srgb, #251f21 8%, transparent);
    --ds-elevation-1: 0 1px 2px color-mix(in srgb, #251f21 12%, transparent), 0 4px 12px color-mix(in srgb, #251f21 14%, transparent);
    --ds-elevation-2: 0 1px 3px color-mix(in srgb, #251f21 8%, transparent), 0 8px 24px color-mix(in srgb, #251f21 16%, transparent);
    --ds-font-display: "Aime", Georgia, serif;
    --ds-font-text: "KMR Melange Grotesk", -apple-system, "Helvetica Neue", Arial, sans-serif;
}