/* ============================================================
   GFX Forge — Noto Font Stack
   Silent preload via Google Fonts CDN
   All unicode ranges declared for correct font selection
   ============================================================ */

/* Noto Sans — primary UI font */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

/* Noto Sans Math — math operators, arrows, alphanumerics */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Math&display=swap');

/* Noto Sans Symbols — misc technical, dingbats, geometric */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Symbols&display=swap');

/* Noto Sans Symbols 2 — supplemental symbols */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Symbols+2&display=swap');

/* Noto Sans Mono — code, tables, alignment */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@400;500&display=swap');

/* Noto Serif — editorial / blockquote contexts */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,600;1,400&display=swap');

/* ============================================================
   Font family declarations — explicit unicode-range fallback
   Ensures correct glyph selection per character type
   ============================================================ */

:root {
  --font-ui:       'Noto Sans', system-ui, sans-serif;
  --font-serif:    'Noto Serif', Georgia, serif;
  --font-mono:     'Noto Sans Mono', 'Courier New', monospace;
  --font-math:     'Noto Sans Math', 'Noto Sans', sans-serif;
  --font-symbols:  'Noto Sans Symbols 2', 'Noto Sans Symbols', 'Noto Sans', sans-serif;

  /* Composite stack — browser picks the right font per codepoint */
  --font-full-stack:
    'Noto Sans Math',
    'Noto Sans Symbols 2',
    'Noto Sans Symbols',
    'Noto Sans',
    system-ui,
    sans-serif;
}

/* ============================================================
   Base application
   ============================================================ */

html, body {
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Math expressions — inline and block */
.math, .math-inline, [data-math],
mjx-container, .MathJax {
  font-family: var(--font-math) !important;
}

/* Code and monospace */
code, pre, kbd, samp,
.mono, .code-block {
  font-family: var(--font-mono);
}

/* Technical symbols, arrows, operators */
.symbol, .operator, .arrow,
.technical-term {
  font-family: var(--font-full-stack);
}

/* Headings — Noto Sans weighted */
h1, h2, h3, h4, h5, h6,
.heading, .title {
  font-family: var(--font-ui);
  font-weight: 600;
}

/* Editorial / principle quote */
blockquote, .quote, .principle-text {
  font-family: var(--font-serif);
  font-style: italic;
}

/* ============================================================
   Unicode range helpers — explicit font forcing per block
   Use these classes when you know the character type
   ============================================================ */

/* Greek letters (math use) U+0370–U+03FF */
.greek { font-family: var(--font-math); }

/* Mathematical operators U+2200–U+22FF */
.math-op { font-family: var(--font-math); }

/* Arrows U+2190–U+21FF */
.arrow { font-family: var(--font-math); }

/* Geometric shapes U+25A0–U+25FF */
.geometric { font-family: var(--font-symbols); }

/* Miscellaneous technical U+2300–U+23FF */
.technical { font-family: var(--font-symbols); }

/* Superscript / subscript rendering */
sup, sub {
  font-family: var(--font-math);
  font-size: 0.75em;
}