/* Material 3 tokens. Colors: SchemeTonalSpot from seed #006A60, generated with
   @material/material-color-utilities 0.3.0 (same algorithm as Material Theme Builder). */

@font-face {
  font-family: 'Roboto Flex';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('../fonts/roboto-flex-latin.woff2?v=ff47215b') format('woff2');
}
@font-face {
  font-family: 'Material Symbols Rounded';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('../fonts/material-symbols-rounded.woff2?v=ff47215b') format('woff2');
}

:root {
  color-scheme: light;
  --md-primary: #006a60;
  --md-on-primary: #ffffff;
  --md-primary-container: #9ef2e4;
  --md-on-primary-container: #005048;
  --md-secondary: #4a635f;
  --md-on-secondary: #ffffff;
  --md-secondary-container: #cce8e2;
  --md-on-secondary-container: #334b47;
  --md-tertiary: #466179;
  --md-on-tertiary: #ffffff;
  --md-tertiary-container: #cce5ff;
  --md-on-tertiary-container: #2d4961;
  --md-error: #ba1a1a;
  --md-on-error: #ffffff;
  --md-error-container: #ffdad6;
  --md-on-error-container: #93000a;
  --md-surface: #f4fbf8;
  --md-on-surface: #161d1c;
  --md-on-surface-variant: #3f4947;
  --md-surface-container-lowest: #ffffff;
  --md-surface-container-low: #eff5f2;
  --md-surface-container: #e9efed;
  --md-surface-container-high: #e3eae7;
  --md-surface-container-highest: #dde4e1;
  --md-inverse-surface: #2b3230;
  --md-inverse-on-surface: #ecf2ef;
  --md-inverse-primary: #82d5c8;
  --md-scrim: rgb(0 0 0 / 0.32);

  /* Breakdown segments (one tonal color each, see NOTES 4.1) */
  --part-bmr: var(--md-primary);
  --part-neat: var(--md-secondary);
  --part-steps: var(--md-tertiary);
  --part-exercise: #4fb3a5;
  --part-tef: #9cb9d6;

  /* Type: body ≥ 18px (owner preference) */
  --font: 'Roboto Flex', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --display-l: 400 57px/64px var(--font);
  --headline-s: 500 24px/32px var(--font);
  --title-l: 500 22px/28px var(--font);
  --title-m: 600 18px/26px var(--font);
  --body-l: 400 18px/27px var(--font);
  --label-l: 500 16px/22px var(--font);

  /* Shape */
  --r-xl: 28px;
  --r-l: 20px;
  --r-m: 16px;
  --r-full: 999px;

  /* Motion */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur: 400ms;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
    --md-primary: #82d5c8;
    --md-on-primary: #003732;
    --md-primary-container: #005048;
    --md-on-primary-container: #9ef2e4;
    --md-secondary: #b1ccc6;
    --md-on-secondary: #1c3531;
    --md-secondary-container: #334b47;
    --md-on-secondary-container: #cce8e2;
    --md-tertiary: #adcae6;
    --md-on-tertiary: #153349;
    --md-tertiary-container: #2d4961;
    --md-on-tertiary-container: #cce5ff;
    --md-error: #ffb4ab;
    --md-on-error: #690005;
    --md-error-container: #93000a;
    --md-on-error-container: #ffdad6;
    --md-surface: #0e1513;
    --md-on-surface: #dde4e1;
    --md-on-surface-variant: #bec9c6;
    --md-surface-container-lowest: #090f0e;
    --md-surface-container-low: #161d1c;
    --md-surface-container: #1a2120;
    --md-surface-container-high: #252b2a;
    --md-surface-container-highest: #303635;
    --md-inverse-surface: #dde4e1;
    --md-inverse-on-surface: #2b3230;
    --md-inverse-primary: #006a60;
    --part-exercise: #2e8f82;
    --part-tef: #4f6f8c;
  }
}
:root[data-theme='dark'] {
  color-scheme: dark;
  --md-primary: #82d5c8;
  --md-on-primary: #003732;
  --md-primary-container: #005048;
  --md-on-primary-container: #9ef2e4;
  --md-secondary: #b1ccc6;
  --md-on-secondary: #1c3531;
  --md-secondary-container: #334b47;
  --md-on-secondary-container: #cce8e2;
  --md-tertiary: #adcae6;
  --md-on-tertiary: #153349;
  --md-tertiary-container: #2d4961;
  --md-on-tertiary-container: #cce5ff;
  --md-error: #ffb4ab;
  --md-on-error: #690005;
  --md-error-container: #93000a;
  --md-on-error-container: #ffdad6;
  --md-surface: #0e1513;
  --md-on-surface: #dde4e1;
  --md-on-surface-variant: #bec9c6;
  --md-surface-container-lowest: #090f0e;
  --md-surface-container-low: #161d1c;
  --md-surface-container: #1a2120;
  --md-surface-container-high: #252b2a;
  --md-surface-container-highest: #303635;
  --md-inverse-surface: #dde4e1;
  --md-inverse-on-surface: #2b3230;
  --md-inverse-primary: #006a60;
  --part-exercise: #2e8f82;
  --part-tef: #4f6f8c;
}