/* Generated by scripts/generate-brand-tokens.mjs from tokens.json.
   Formal marks retain supplied colors; UI roles separate display accents from readable controls. */
:root {
  --mal-terracotta: #B64539;
  --mal-charcoal: #22252E;
  --mal-natural: #EAE1D9;
  --mal-white: #FFFFFF;
  --mal-ink: var(--mal-charcoal);
  --mal-accent: var(--mal-terracotta);
  --mal-ground: var(--mal-natural);
}

:root {
  --ui-background: #EAE1D9;
  --ui-text: #22252E;
  --ui-panel: #F3EDE8;
  --ui-muted: #5D5A60;
  --ui-border: #B2A7A3;
  --ui-control-border: #7B6C70;
  --ui-accent-text: #963A32;
  --ui-accent-hover: #92362D;
  --ui-button: var(--mal-terracotta);
  --ui-button-hover: #92362D;
  --ui-on-button: var(--mal-white);
  --ui-focus: #963A32;
  --ui-display-accent: var(--mal-terracotta);
  --ui-header-ink: #22252E;
  --ui-accent: var(--mal-terracotta);
  --ui-soft: color-mix(in srgb, var(--ui-accent) 6%, var(--ui-background));
  --ui-hover: color-mix(in srgb, var(--ui-accent) 10%, var(--ui-background));
  color-scheme: light;
}

:root.dark {
  --ui-background: #22252E;
  --ui-text: #EAE1D9;
  --ui-panel: #2D3039;
  --ui-muted: #BEB7B4;
  --ui-border: #5D5962;
  --ui-control-border: #999098;
  --ui-accent-text: var(--mal-white);
  --ui-accent-hover: var(--mal-white);
  --ui-button: var(--mal-terracotta);
  --ui-button-hover: #92362D;
  --ui-on-button: var(--mal-white);
  --ui-focus: var(--mal-white);
  --ui-display-accent: var(--mal-terracotta);
  --ui-header-ink: var(--mal-white);
  --ui-accent: var(--mal-terracotta);
  --ui-soft: color-mix(in srgb, var(--ui-accent) 6%, var(--ui-background));
  --ui-hover: color-mix(in srgb, var(--ui-accent) 10%, var(--ui-background));
  color-scheme: dark;
}

:root {
  --primary-button-border: 0;
  --primary-button-radius: 7px;
  --primary-button-shadow: 0 4px 8px rgb(35 24 16 / 12%), 0 10px 24px rgb(35 24 16 / 14%);
  --primary-button-shadow-hover: 0 6px 12px rgb(35 24 16 / 16%), 0 14px 30px rgb(35 24 16 / 20%);
}
.mal-primary-button {
  background: var(--ui-button);
  color: var(--ui-on-button);
  border: var(--primary-button-border);
  border-radius: var(--primary-button-radius);
  box-shadow: var(--primary-button-shadow);
  transition: transform 250ms ease, background-color 250ms ease, box-shadow 250ms ease;
}
.mal-primary-button:hover {
  background: var(--ui-button-hover);
  transform: translateY(-3px);
  box-shadow: var(--primary-button-shadow-hover);
}
.mal-primary-button:focus-visible { outline: 2px solid var(--ui-focus); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .mal-primary-button { transition: none; }
  .mal-primary-button:hover { transform: none; }
}

/* Measured WCAG role contrasts; normal text >= 4.5:1, meaningful icons/focus >= 3:1.
   light: text on background: 11.86:1.
   light: muted on background: 5.25:1.
   light: muted on panel: 5.84:1.
   light: accent-text on background: 5.52:1.
   light: accent-text on panel: 6.14:1.
   light: accent-hover on background: 5.84:1.
   light: on-button on button: 5.39:1.
   light: on-button on button-hover: 7.53:1.
   light: focus on background: 5.52:1.
   light: control-border on panel: 4.29:1.
   dark: text on background: 11.86:1.
   dark: muted on background: 7.74:1.
   dark: muted on panel: 6.67:1.
   dark: accent-text on background: 15.31:1.
   dark: accent-text on panel: 13.18:1.
   dark: accent-hover on background: 15.31:1.
   dark: on-button on button: 5.39:1.
   dark: on-button on button-hover: 7.53:1.
   dark: focus on background: 15.31:1.
   dark: control-border on panel: 4.27:1.
   light: accent-text on soft (#E7D8CF): 5.13:1.
   light: accent-text on hover (#E5D1C9): 4.85:1.
   light: on-button on icon-panel (#B64539): 5.39:1.
   dark: accent-text on soft (#2B272F): 14.64:1.
   dark: accent-text on hover (#31282F): 14.24:1.
   dark: on-button on icon-panel (#B64539): 5.39:1.
   dark: header-ink on background: 15.31:1.
   Display light: 4.17:1; meets 3:1 large-text minimum.
   Display dark: 2.84:1; below 3:1 large-text minimum.
   Dark Terracotta display text is an explicit visual-review exception; functional text/icons use white.
*/