/* Shared editorial roles. The site owns the fonts, colors and base scale. */
:is(.nf-guide-ui, .podoshop-journal, .podoshop-single, .pjf-journal) {
  --nf-ui-font: var(--wd-text-font, sans-serif);
  --nf-ui-heading-font: var(--wd-title-font, var(--nf-ui-font));
  --nf-ui-button-font: var(--btn-font-family, var(--nf-ui-font));
  --nf-ui-text: var(--wd-text-color, CanvasText);
  --nf-ui-heading: var(--wd-title-color, CanvasText);
  --nf-ui-accent: var(--wd-alternative-color, LinkText);
  --nf-ui-surface: var(--wd-main-bgcolor, Canvas);
  --nf-ui-soft: color-mix(in srgb, var(--nf-ui-accent) 5%, var(--nf-ui-surface));
  --nf-ui-tint: color-mix(in srgb, var(--nf-ui-accent) 11%, var(--nf-ui-surface));
  --nf-ui-border: color-mix(in srgb, var(--nf-ui-text) 20%, var(--nf-ui-surface));
  --nf-ui-weight: var(--wd-text-font-weight, 400);
  --nf-ui-heading-weight: var(--wd-title-font-weight, 700);
  --nf-ui-control-weight: var(--wd-entities-title-font-weight, 600);
  --nf-ui-size: var(--wd-text-font-size, 1rem);
  --nf-ui-small-size: calc(var(--nf-ui-size) * .857143);
  --nf-ui-reading-size: calc(var(--nf-ui-size) * 1.285714);
  --nf-ui-lead-size: calc(var(--nf-ui-size) * 1.428571);
  --nf-ui-title-size: clamp(calc(var(--nf-ui-size) * 2.714286), 4.2vw, calc(var(--nf-ui-size) * 4.285714));
  --nf-ui-section-size: calc(var(--nf-ui-size) * 1.571429);
  --nf-ui-h2-size: clamp(calc(var(--nf-ui-size) * 1.714286), 2.3vw, calc(var(--nf-ui-size) * 2.142857));
  --nf-ui-h3-size: calc(var(--nf-ui-size) * 1.642857);
  --nf-ui-body-leading: 1.8;
  --nf-ui-heading-leading: 1.25;
  --nf-ui-space: var(--wd-block-spacing, 1.25rem);
  --nf-ui-radius: var(--wd-brd-radius, 1rem);
  --nf-ui-field-radius: var(--wd-form-brd-radius, var(--nf-ui-radius));
  --nf-ui-button-radius: var(--btn-default-brd-radius, var(--nf-ui-radius));
  --nf-ui-button-bg: var(--wd-primary-color, CanvasText);
  --nf-ui-button-text: var(--wd-main-bgcolor, Canvas);
  --nf-ui-container: min(var(--wd-container-w, 100%), calc(var(--nf-ui-size) * 100));
  --nf-ui-reading-width: calc(var(--nf-ui-size) * 55.714286);
  --nf-ui-media-width: calc(var(--nf-ui-size) * 45.714286);
  --nf-ui-sticky-top: calc(var(--wd-header-sticky-h, 0px) + var(--wp-admin--admin-bar--height, 0px) + var(--nf-ui-space));
}
@media (max-width: 767px) {
  :is(.nf-guide-ui, .podoshop-journal, .podoshop-single, .pjf-journal) {
    --nf-ui-reading-size: calc(var(--nf-ui-size) * 1.214286);
    --nf-ui-lead-size: calc(var(--nf-ui-size) * 1.142857);
  }
}
