/* Self-hosted SUBSET of Material Symbols Outlined — only the icons this app
 * uses (~300KB vs the 3.8MB full font, which left fresh browsers showing raw
 * ligature names like "cloud_done" for seconds). Class rules mirror
 * node_modules/material-symbols/outlined.css.
 *
 * Lives in public/ (not app/) because the Monogatari preview IFRAME loads it
 * too — it's same-origin, so it can <link> this path directly instead of
 * pulling the full font from Google.
 *
 * Regenerate after adding icons:  node scripts/subset-material-symbols.mjs
 * (rewrites material-symbols-subset.{woff2,txt} beside this file — commit
 * both). A brand-new icon renders as its text name until you do. */

@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 100 700;
  font-display: block;
  src: url("./material-symbols-subset.woff2?v=bbd2f0c7") format("woff2");
}
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  /* The editor's Lexend rule (globals.css) sets an inherited
     font-size-adjust: 0.545; on an icon font it shrank every glyph to ~77%. */
  font-size-adjust: none;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}

/* Default size, LAYERED so Tailwind's text-[Npx] / leading-* utilities (in the
 * later `utilities` layer) win. Unlayered, this 24px beat every utility and
 * every icon rendered at 24px whatever its class said. */
@layer base {
  .material-symbols-outlined {
    font-size: 24px;
    line-height: 1;
  }
}