/*
 * GENERATED FILE. Do not edit by hand.
 *   python3 pipelines/design/build_site_theme_css.py
 *
 * The marketing site's three themes, from brand/theme/able-tokens.json v1.18.0.
 * Change a value THERE and regenerate. `--check` fails on drift.
 *
 * Precedence: an explicit data-theme always wins (site.js sets one on every page,
 * resolving "Match my system" itself). With no script, the operating system decides,
 * and prefers-contrast beats prefers-color-scheme.
 */

:root,
[data-theme="light"] {
  --background: #f5efe6;
  --surface: #ffffff;
  --surfaceAlt: #fbf7f0;
  --border: #e8dfd0;
  --borderStrong: #d9cdb8;
  --divider: #f0ebe0;
  --textPrimary: #241f27;
  --textSecondary: #6e6555;
  --textAccent: #4c6b57;
  --primaryAction: #241f27;
  --primaryActionHover: #322b36;
  --onPrimaryAction: #ffffff;
  --positive: #4c6b57;
  --onPositive: #ffffff;
  --positiveTint: #e9efe3;
  --accentClay: #d9724c;
  --onClay: #241f27;
  --clayTint: #f6e7df;
  --sky: #9fc0c4;
  --skyTint: #e7eeef;
  --sand: #e4d8c6;
  --focusRing: #2f6b73;
  --selectedTint: #e9efe3;
  --hoverTint: #efe8db;
  --disabledSurface: #ece4d6;
  --disabledText: #6e6555;
  --error: #b5473d;
  --errorText: #a23a31;
  --errorTint: #f7e7e4;
  --warningText: #7a5316;
  --warningTint: #f6ecd6;
  --infoText: #275860;
  --infoTint: #e4eeef;
  --successText: #3c5646;
  --successTint: #e9efe3;
  --recess: #efe8db;
  --wellness: #4c6b57;
  --markClay: #d9724c;
  --askBetaFill: #4c6b57;
  --askBetaText: #ffffff;
  --askMark: #d9724c;
  --hair: 1px;
  --strong: 1.5px;
  --fillEdge: transparent;
  --shadow1: 0 2px 8px rgba(36, 31, 39, 0.05);
  --shadow2: 0 8px 24px -12px rgba(36, 31, 39, 0.12);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --background: #1a161c;
    --surface: #241f27;
    --surfaceAlt: #2e2229;
    --border: #3a333e;
    --borderStrong: #4a414e;
    --divider: #332c38;
    --textPrimary: #f5efe6;
    --textSecondary: #b7ada0;
    --textAccent: #7fb0b4;
    --primaryAction: #f5efe6;
    --primaryActionHover: #ffffff;
    --onPrimaryAction: #241f27;
    --positive: #5e9c7c;
    --onPositive: #241f27;
    --positiveTint: #26332c;
    --accentClay: #e89a6e;
    --onClay: #241f27;
    --clayTint: #3a2a24;
    --sky: #7fb0b4;
    --skyTint: #233033;
    --sand: #3a342c;
    --focusRing: #9fc0c4;
    --selectedTint: #2a3a31;
    --hoverTint: #2e2229;
    --disabledSurface: #2a2530;
    --disabledText: #9c9185;
    --error: #e08379;
    --errorText: #f0a79e;
    --errorTint: #3a2320;
    --warningText: #f0c888;
    --warningTint: #332a18;
    --infoText: #a2d4d6;
    --infoTint: #1f3033;
    --successText: #9bcbb1;
    --successTint: #22332b;
    --recess: #2e2229;
    --wellness: #9fc0c4;
    --markClay: #e89a6e;
    --askBetaFill: #5e9c7c;
    --askBetaText: #1a161c;
    --askMark: #e89a6e;
    --hair: 1px;
    --strong: 1.5px;
    --fillEdge: transparent;
    --shadow1: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow2: 0 10px 28px -14px rgba(0, 0, 0, 0.45);
    color-scheme: dark;
  }
}

@media (prefers-contrast: more) {
  :root:not([data-theme]) {
    --background: #ffffff;
    --surface: #ffffff;
    --surfaceAlt: #ffffff;
    --border: #000000;
    --borderStrong: #000000;
    --divider: #000000;
    --textPrimary: #000000;
    --textSecondary: #1f1f1f;
    --textAccent: #1f1f1f;
    --primaryAction: #000000;
    --primaryActionHover: #1f1f1f;
    --onPrimaryAction: #ffffff;
    --positive: #2f4a38;
    --onPositive: #ffffff;
    --positiveTint: #e3ebe5;
    --accentClay: #8e3818;
    --onClay: #ffffff;
    --clayTint: #f5e6e0;
    --sky: #9fc0c4;
    --skyTint: #e4edee;
    --sand: #e4d8c6;
    --focusRing: #000000;
    --selectedTint: #e3ebe5;
    --hoverTint: #f2f2f2;
    --disabledSurface: #f2f2f2;
    --disabledText: #4a4a4a;
    --error: #7a1214;
    --errorText: #5c0d0f;
    --errorTint: #f5e4e4;
    --warningText: #3f2b00;
    --warningTint: #f0eadf;
    --infoText: #0d2e45;
    --infoTint: #e1eaf0;
    --successText: #1f3527;
    --successTint: #e3ebe5;
    --recess: #ffffff;
    --wellness: #1f1f1f;
    --markClay: #d9724c;
    --askBetaFill: #000000;
    --askBetaText: #ffffff;
    --askMark: #8e3818;
    --hair: 1.5px;
    --strong: 2px;
    --fillEdge: #000000;
    --shadow1: none;
    --shadow2: none;
    color-scheme: light;
  }
}

[data-theme="dark"] {
  --background: #1a161c;
  --surface: #241f27;
  --surfaceAlt: #2e2229;
  --border: #3a333e;
  --borderStrong: #4a414e;
  --divider: #332c38;
  --textPrimary: #f5efe6;
  --textSecondary: #b7ada0;
  --textAccent: #7fb0b4;
  --primaryAction: #f5efe6;
  --primaryActionHover: #ffffff;
  --onPrimaryAction: #241f27;
  --positive: #5e9c7c;
  --onPositive: #241f27;
  --positiveTint: #26332c;
  --accentClay: #e89a6e;
  --onClay: #241f27;
  --clayTint: #3a2a24;
  --sky: #7fb0b4;
  --skyTint: #233033;
  --sand: #3a342c;
  --focusRing: #9fc0c4;
  --selectedTint: #2a3a31;
  --hoverTint: #2e2229;
  --disabledSurface: #2a2530;
  --disabledText: #9c9185;
  --error: #e08379;
  --errorText: #f0a79e;
  --errorTint: #3a2320;
  --warningText: #f0c888;
  --warningTint: #332a18;
  --infoText: #a2d4d6;
  --infoTint: #1f3033;
  --successText: #9bcbb1;
  --successTint: #22332b;
  --recess: #2e2229;
  --wellness: #9fc0c4;
  --markClay: #e89a6e;
  --askBetaFill: #5e9c7c;
  --askBetaText: #1a161c;
  --askMark: #e89a6e;
  --hair: 1px;
  --strong: 1.5px;
  --fillEdge: transparent;
  --shadow1: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow2: 0 10px 28px -14px rgba(0, 0, 0, 0.45);
  color-scheme: dark;
}

[data-theme="highContrast"] {
  --background: #ffffff;
  --surface: #ffffff;
  --surfaceAlt: #ffffff;
  --border: #000000;
  --borderStrong: #000000;
  --divider: #000000;
  --textPrimary: #000000;
  --textSecondary: #1f1f1f;
  --textAccent: #1f1f1f;
  --primaryAction: #000000;
  --primaryActionHover: #1f1f1f;
  --onPrimaryAction: #ffffff;
  --positive: #2f4a38;
  --onPositive: #ffffff;
  --positiveTint: #e3ebe5;
  --accentClay: #8e3818;
  --onClay: #ffffff;
  --clayTint: #f5e6e0;
  --sky: #9fc0c4;
  --skyTint: #e4edee;
  --sand: #e4d8c6;
  --focusRing: #000000;
  --selectedTint: #e3ebe5;
  --hoverTint: #f2f2f2;
  --disabledSurface: #f2f2f2;
  --disabledText: #4a4a4a;
  --error: #7a1214;
  --errorText: #5c0d0f;
  --errorTint: #f5e4e4;
  --warningText: #3f2b00;
  --warningTint: #f0eadf;
  --infoText: #0d2e45;
  --infoTint: #e1eaf0;
  --successText: #1f3527;
  --successTint: #e3ebe5;
  --recess: #ffffff;
  --wellness: #1f1f1f;
  --markClay: #d9724c;
  --askBetaFill: #000000;
  --askBetaText: #ffffff;
  --askMark: #8e3818;
  --hair: 1.5px;
  --strong: 2px;
  --fillEdge: #000000;
  --shadow1: none;
  --shadow2: none;
  color-scheme: light;
}