/* ============================================================
   JoyPixels emoji font (v11) — mirrors ui/css/joypixels.css
   ------------------------------------------------------------
   Two faces:
     • JoyPixelsFallback — CBDT, broad legacy support
     • JoyPixels         — COLRv1 (modern Chrome/FF) + SBIX (Safari/iOS)
   The .jp-font class declares both font-families. Modern browsers
   that successfully load COLRv1/SBIX ignore the fallback; older
   ones fall back to CBDT. This matches the live app's behavior
   exactly — Unicode emoji on `.jp-font` text render as JoyPixels
   glyphs everywhere they appear (sidebar, emoji grid, action bar,
   in-app surfaces).
   ============================================================ */

@font-face {
    font-family: JoyPixelsFallback;
    src: url('./fonts/joypixels/v11/cbdt.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: JoyPixels;
    src:
        url('./fonts/joypixels/v11/colrv1.woff2') format('woff2') tech(color-colrv1),
        url('./fonts/joypixels/v11/sbix.woff2')   format('woff2');
    font-display: swap;
}

/* Apply fallback first, then JoyPixels — modern browsers ignore
   fallback if JoyPixels loads (color-emoji format support gates). */
.jp-font {
    font-family: JoyPixelsFallback;
}
.jp-font {
    font-family: JoyPixels;
}