body[data-area="neutral"] {
  --area-primary: #245f8f;
  --area-primary-action: #1c4f78;
  --area-primary-light: #3d7da8;
  --area-secondary: #d99b20;
  --area-accent: #123f66;
  --area-highlight: #d99b20;
  --area-nature: #167352;
  --area-strong: #17212b;
  --area-primary-soft: #eaf2f8;
  --area-secondary-soft: #fff4d9;
  --area-accent-soft: #e8eef5;
  --area-highlight-soft: #fff4d9;
  --area-on-primary: #ffffff;
  --area-on-secondary: #16181d;
  --area-on-accent: #ffffff;
  --area-on-highlight: #16181d;
}

body[data-area="desbravadores"] {
  --area-primary: #ed1b24;
  --area-primary-action: #c9151d;
  --area-primary-light: #ed1b24;
  --area-secondary: #fef200;
  --area-accent: #2e3192;
  --area-highlight: #fef200;
  --area-nature: #2e3192;
  --area-strong: #16181d;
  --area-primary-soft: #fde8e9;
  --area-secondary-soft: #fffbd1;
  --area-accent-soft: #e8e9f7;
  --area-highlight-soft: #fffbd1;
  --area-on-primary: #ffffff;
  --area-on-secondary: #16181d;
  --area-on-accent: #ffffff;
  --area-on-highlight: #16181d;
}

body[data-area="aventureiros"] {
  --area-primary: #72293a;
  --area-primary-action: #72293a;
  --area-primary-light: #8d4052;
  --area-secondary: #ddddc5;
  --area-accent: #1e5da6;
  --area-highlight: #03edfb;
  --area-nature: #63a354;
  --area-strong: #1e080c;
  --area-primary-soft: #f4e9ec;
  --area-secondary-soft: #f3f3e8;
  --area-accent-soft: #e8f0fa;
  --area-highlight-soft: #ddfbfd;
  --area-on-primary: #ffffff;
  --area-on-secondary: #1e080c;
  --area-on-accent: #ffffff;
  --area-on-highlight: #16181d;
}

body[data-area="jovens"] {
  --area-primary: #1e6ea9;
  --area-primary-action: #1e6ea9;
  --area-primary-light: #2e84c5;
  --area-secondary: #f7fb4c;
  --area-accent: #fecc0d;
  --area-highlight: #f7fb4c;
  --area-nature: #1e6ea9;
  --area-strong: #030304;
  --area-primary-soft: #e6f0f7;
  --area-secondary-soft: #fcfdcb;
  --area-accent-soft: #fff4c7;
  --area-highlight-soft: #fcfdcb;
  --area-on-primary: #ffffff;
  --area-on-secondary: #030304;
  --area-on-accent: #030304;
  --area-on-highlight: #030304;
}

body[data-area] {
  --area-primary-dark: var(--area-primary-action);
  --area-soft: var(--area-primary-soft);
  --theme-action-background: var(--area-primary-action);
  --theme-action-hover: color-mix(in srgb, var(--area-primary-action) 84%, black);
  --theme-action-text: var(--area-on-primary);
  --theme-link: var(--area-primary-action);
  --theme-focus-ring: var(--area-primary-action);
  --theme-selected-background: var(--area-primary-soft);
  --theme-selected-text: var(--area-primary-action);
  --theme-navigation-marker: var(--area-accent);
  --theme-card-border: color-mix(in srgb, var(--area-accent) 16%, var(--color-border));
  --theme-info-background: var(--area-accent-soft);
  --theme-info-text: var(--area-strong);
  transition: background-color var(--transition-base), color var(--transition-base);
}