/*  Material Symbols Outlined — self-hosted, full variable font. No CDN.

    WHY LOCAL AT ALL. This was loaded from fonts.googleapis.com. That host is
    intermittently unreachable from at least one network this app runs on (2026-09-06:
    google.com and login.microsoftonline.com answered in under 250ms while
    fonts.googleapis.com timed out repeatedly). Two distinct failures came out of it:

      1. A stylesheet <link> is RENDER-BLOCKING, so the app painted nothing while the
         browser waited on a host answering nothing. The server had finished; the page
         just hung.
      2. Loading it non-blocking (media="print") fixed the paint but left the request
         pending, so the tab kept its loading spinner until the browser timed out.

    Both are the same root cause: a third party on the critical path for something that
    is not optional. Icons ARE the affordances here — when the font is missing, the
    spans render their LIGATURE NAMES as literal text ("add_column_left", "graphic_eq"),
    which are far wider than the glyphs and overlap the UI around them.

    WHY THE FULL 3.9 MB FILE AND NOT A SUBSET. pyftsubset would cut this to a few tens
    of KB against the ~155 ligatures that appear in markup. It is not safe: icon names
    are DATA, not just code — WorkOrderTypeRegistry.IconName and the artifact configs
    store them per tenant, so an admin can pick any icon in the set. Subsetting to
    today's source would break tomorrow's config, and it would break it by printing the
    ligature name across the page. Cached once, forever; correctness wins.

    WHY THE VARIABLE FILE. canvas.css drives the axes in three places — 'FILL' 1 for
    filled icons, 'wght' 350/500. A static weight-400 face renders those wrong.

    font-display: BLOCK, not swap. On an icon font, swap shows the fallback — which is
    the ligature name — for the swap period. Block renders nothing until the face is
    ready, so the failure is a brief gap rather than words strewn across the layout.

    Served from wwwroot, so CSP font-src 'self' already covers it with no allowlist
    entry to maintain.
*/
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 100 700;
  font-display: block;
  src: url(./material-symbols-outlined.woff2) format('woff2');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  /* 'liga' is what turns the text "graphic_eq" into a glyph. Without it the name
     shows through even once the font has loaded. */
  font-feature-settings: 'liga';
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
