/*
 * One face per alphabet, for every weight at once.
 *
 * Rubik here is a variable font (wght 300-900 in one file). The 400, 500 and
 * 600 files were byte-for-byte the same file under three names; then three
 * rules on one url, so it was fetched once - but each rule was still a face
 * of its own, and the browser "loaded" the 500 and the 600 face separately,
 * the first time text of that weight was laid out. Until then that text was
 * drawn in the stand-in below and swapped a moment later: a name, a heading,
 * a bold word in a chat that had just opened changed its letters on screen
 * (SUBPIXEL-STILL-1002). One rule with a weight range is one face, preloaded
 * with the page, and serves 400, 500 and 600 exactly as the three did: the
 * same file, the same wght, the same matching for weights outside the range.
 */
@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/fonts/rubik/rubik-cyrillic-ext-400.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/fonts/rubik/rubik-cyrillic-400.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/fonts/rubik/rubik-latin-ext-400.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/fonts/rubik/rubik-latin-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
 * What text is drawn in before Rubik arrives, shaped like Rubik.
 *
 * Until the file lands the browser draws with the next font in the list, and
 * that font's lines are taller: Segoe UI takes 1.33 of the font size to
 * Rubik's 1.185. When Rubik then arrives every line gets shorter at once, and
 * in the chat that is every message on the screen moving - 43px on a stand
 * with twenty bubbles. The overrides below give the stand-in Rubik's ascent,
 * descent and width, so the swap changes the letters and nothing else.
 *
 * Only for the characters Rubik itself covers; anything outside that goes on
 * to the system fonts exactly as before. Browsers without these descriptors
 * (Safari) simply do not use the tuning.
 */
@font-face {
  font-family: "Rubik Fallback";
  src: local("Segoe UI");
  size-adjust: 104.16%;
  ascent-override: 89.77%;
  descent-override: 24%;
  line-gap-override: 0%;
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F, U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116, U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Rubik Fallback Roboto";
  src: local("Roboto"), local("Roboto-Regular");
  ascent-override: 93.5%;
  descent-override: 25%;
  line-gap-override: 0%;
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F, U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116, U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*
 * EMOJI-WIDTH-1018. Stand-in for the emoji faces until they land.
 *
 * SlasherEmoji is linked late (boot.js, on idle) and comes in pieces, so the
 * first look at a chat often draws its emoji in the system face and swaps a
 * moment later. Segoe UI Emoji is 9.4% wider than ours: the swap re-wrapped
 * every line with an emoji in it and the whole chat jumped. This is the same
 * system face shrunk to our width (measured 0.91396 over fourteen common
 * faces), so the swap no longer moves a line.
 */
@font-face {
  font-family: "SlasherEmoji Fallback";
  src: local("Segoe UI Emoji"), local("SegoeUIEmoji");
  size-adjust: 91.396%;
  unicode-range: U+A9, U+AE, U+200D, U+203C-3299, U+FE0F, U+1F000-1FAFF, U+E0020-E007F;
}

/*
 * BOLD-TEXT-1020: «Жирный шрифт» в настройках, как на iPhone.
 *
 * Корень: обычный текст 600. Ось wght - потому что Rubik объявлен 400-600 и
 * толще не рисует; подробно - у плагина bold-text в vite.config.ts, он же
 * делает толще всё, у чего толщина задана явно. Кнопки и поля браузер сам
 * ставит обычными - им наследовать. Ник рисуется толщиной, которую выбрал
 * хозяин имени, ось ему не навязываем.
 */
:root[data-bold-text="on"] {
  font-weight: 600;
  font-variation-settings: "wght" 600;
}

:where(:root[data-bold-text="on"]) :where(input, textarea, select, button) {
  font-weight: inherit;
  font-variation-settings: inherit;
}

:where(:root[data-bold-text="on"]) .nick,
:where(:root[data-bold-text="on"]) .profile-username {
  font-variation-settings: normal;
}
