/* =========================================================================================
   EMBEDDED UI FONT
   =========================================================================================

   The UI was written against Tahoma with no fallback (`body { font-family: Tahoma; }`), which
   only exists on Windows and macOS. iPadOS has neither Tahoma nor most of the other named
   families, so Safari fell all the way back to its serif default and the whole site rendered in
   Times. The Roboto WOFF2 pack was already bundled for server-rendered map icons
   (MapIconFontProvider) — serving it to the browser too means every platform gets the same
   sans-serif without a Google Fonts round trip.

   `font-display: swap` so a cold cache paints in the fallback rather than showing nothing.
   Tahoma stays FIRST in the stacks below, so nothing changes on a Windows desktop; Roboto is what
   an iPad picks up.
   ========================================================================================= */

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-thin.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 100;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-thinitalic.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-light.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-lightitalic.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-italic.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-medium.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-mediumitalic.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-bold.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-bolditalic.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-black.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 900;
    font-display: swap;
    src: url('/content/fonts/roboto/roboto-blackitalic.woff2') format('woff2');
}

:root {
    /* base.css uses var(--MasterFont) in nine rules but the variable was never declared anywhere,
       so every one of them resolved to the initial value — the browser's serif default. Declaring
       it here fixes those rules on every platform, not just the iPad. */
    --MasterFont: Tahoma, Roboto, "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
}
