/* ══════════════════════════════════════════════════════════════════════════
   SELF-HOSTED WEBFONTS
   The app is deployed on LAN / intranet servers that cannot reach Google
   Fonts. Loading the fonts from the network made the UI look broken there:
   every Material Symbols ligature (e.g. "settings", "dashboard") fell back to
   plain text and Plus Jakarta Sans was replaced by a default font.

   Everything below is served from /assets/fonts, so the UI renders identically
   with or without internet access.

   The icon font is a SUBSET that only carries the icons this project uses.
   If an icon is missing from the subset it silently falls back to its own
   name as text (e.g. the word "key" printed on top of an input) — which looks
   exactly like a broken stylesheet. So when you add a new icon:

     1. Add its name to the list at the bottom of this comment.
        Remember icons set from JavaScript as well (dark_mode, menu_open, keep).

     2. Request the subset (comma separated names, NO spaces) and save the
        returned woff2 over public/assets/fonts/material-symbols-outlined.woff2:
        https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&icon_names=<names>&display=block

        The CSS response contains one @font-face whose src points at
        https://fonts.gstatic.com/l/font?kit=... — download that URL.

     3. Reload a page and check that no icon renders as words. Quick check:
        any .material-symbols-outlined wider than ~1.8x its font-size is text,
        not a glyph.

   Skipping the subset step makes Google serve a ~4 MB font file, far too heavy
   for a small community portal (this subset is ~94 KB).

   Current subset (keep in sync with the request URL above):
     account_balance, account_box, account_circle, add, admin_panel_settings,
     animation, arrow_back, arrow_forward, auto_awesome, badge, balance,
     campaign, cake, card_membership, check, check_circle, chevron_left,
     chevron_right, circle, dark_mode, dashboard, dataset, edit, expand_more,
     favorite, filter_alt, fit_screen, gavel, group, groups, handshake, home,
     home_pin, image, keep, keep_off, key, keyboard, keyboard_arrow_down,
     language, light_mode, location_on, lock_open, login, logout, menu,
     menu_open, mic, military_tech, open_in_new, palette, pending, person,
     person_add, phone, recent_actors, refresh, save, school, search, settings, share,
     shield_person, subtitles, swap_horiz, thumb_down, thumb_up, tune,
     verified, verified_user, vertical_align_top, visibility, visibility_off,
     volunteer_activism, warning, workspace_premium
   ══════════════════════════════════════════════════════════════════════════ */

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 100 700;
    font-display: block; /* never flash ligature names as text */
    src: url('../fonts/material-symbols-outlined.woff2?v=5') format('woff2');
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-italic-latin.woff2') format('woff2');
}