/* Shared Aptos typography for standalone application and calculator documents. */
body,
body *:not(svg):not(svg *):not(i[class]):not([class*="icon"]):not([class*="Icon"]):not(.material-icons):not(.material-symbols-outlined):not(.fa):not([class^="fa-"]):not([class*=" fa-"]) {
  font-family: Aptos, "Segoe UI", Arial, sans-serif !important;
}

/* Global reading scale for standalone LowStyleLife pages and tools. */
body {
  font-size: 17px !important;
  line-height: 1.65 !important;
}

body h1,
body h2,
body h3,
body h4 {
  font-weight: 600 !important;
}

body h1 { font-size: 32px !important; line-height: 1.2 !important; }
body h2 { font-size: 26px !important; line-height: 1.25 !important; }
body h3 { font-size: 22px !important; line-height: 1.3 !important; }
body h4 { font-size: 19px !important; line-height: 1.35 !important; }

body p,
body li,
body dt,
body dd,
body blockquote {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

body button,
body [role="button"] {
  font-size: 15px !important;
}

body figcaption {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

body :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) :is(h2, h3) {
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}

body :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) p {
  font-size: 15px !important;
  line-height: 1.55 !important;
}

@media (min-width: 821px) and (max-width: 1100px) {
  body h1 { font-size: 30px !important; }
  body h2 { font-size: 24px !important; }
  body h3 { font-size: 21px !important; }
  body h4 { font-size: 18px !important; }
}

@media (max-width: 820px) {
  body { font-size: 16px !important; line-height: 1.6 !important; }
  body h1 { font-size: 27px !important; }
  body h2 { font-size: 23px !important; }
  body h3 { font-size: 20px !important; }
  body h4 { font-size: 18px !important; }

  body p,
  body li,
  body dt,
  body dd,
  body blockquote {
    font-size: 16px !important;
    line-height: 1.6 !important;
  }

  body button,
  body [role="button"] {
    font-size: 16px !important;
  }

  body :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) :is(h2, h3) {
    font-size: 18px !important;
  }

  body :is([class~="card"], [class*="-card"], [class*="Card"]):not([class*="recipe-sidebar-card"]) p {
    font-size: 15px !important;
  }
}
