/* Self-hosted fonts (@fontsource, OFL), written by scripts/build.mjs. Family names match the --font-* variables. */
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/source-serif-4-latin-300-normal.4643b116.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;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/source-serif-4-latin-400-normal.02194deb.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;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/source-serif-4-latin-600-normal.f2b7e1cf.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;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/source-serif-4-latin-ext-300-normal.dfb9da2f.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/source-serif-4-latin-ext-400-normal.78ff74ea.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/source-serif-4-latin-ext-600-normal.ba70bfd7.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/source-serif-4-cyrillic-300-normal.d5e88554.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/source-serif-4-cyrillic-400-normal.4899e714.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/source-serif-4-cyrillic-600-normal.881a5cd6.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/source-serif-4-cyrillic-ext-300-normal.ad87e61b.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: "Source Serif 4";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/source-serif-4-cyrillic-ext-400-normal.29b1be65.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: "Source Serif 4";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/source-serif-4-cyrillic-ext-600-normal.424aad3c.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: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-latin-400-normal.3b646991.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;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-latin-500-normal.0717336f.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;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-latin-600-normal.8960851d.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;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-latin-ext-400-normal.c93d2a12.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: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-latin-ext-500-normal.2846035d.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: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-latin-ext-600-normal.b25dfd4f.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: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-cyrillic-400-normal.69afad88.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-cyrillic-500-normal.200be3a2.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-cyrillic-600-normal.730becc6.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-cyrillic-ext-400-normal.e2580ad7.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: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-cyrillic-ext-500-normal.08578d90.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: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-cyrillic-ext-600-normal.d60d3d0b.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: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-latin-400-normal.08949f72.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;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-latin-500-normal.01d28544.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;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-latin-ext-400-normal.6bc0f226.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: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-latin-ext-500-normal.6bb06407.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: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-cyrillic-400-normal.7635422b.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-cyrillic-500-normal.1d89462e.woff2) format("woff2");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-cyrillic-ext-400-normal.f8c22ec1.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: "IBM Plex Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-cyrillic-ext-500-normal.3febe5c7.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: "IBM Plex Sans Hebrew";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-hebrew-hebrew-400-normal.08779339.woff2) format("woff2");
  unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F;
}
@font-face {
  font-family: "IBM Plex Sans Hebrew";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-hebrew-hebrew-500-normal.3f85b2d8.woff2) format("woff2");
  unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F;
}
@font-face {
  font-family: "IBM Plex Sans Hebrew";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-hebrew-hebrew-600-normal.2a0832e3.woff2) format("woff2");
  unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-arabic-arabic-400-normal.6010e7fd.woff2) format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-arabic-arabic-500-normal.90aef64f.woff2) format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/ibm-plex-sans-arabic-arabic-600-normal.16734a5a.woff2) format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Frank Ruhl Libre";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/frank-ruhl-libre-hebrew-300-normal.d6b62bfc.woff2) format("woff2");
  unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F;
}
@font-face {
  font-family: "Frank Ruhl Libre";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/frank-ruhl-libre-hebrew-500-normal.4a453ca7.woff2) format("woff2");
  unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F;
}
@font-face {
  font-family: "Frank Ruhl Libre";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/frank-ruhl-libre-hebrew-700-normal.51189306.woff2) format("woff2");
  unicode-range: U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F;
}
@font-face {
  font-family: "Noto Naskh Arabic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/noto-naskh-arabic-arabic-400-normal.9cc2d2e9.woff2) format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Noto Naskh Arabic";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/noto-naskh-arabic-arabic-500-normal.3427efdf.woff2) format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Noto Naskh Arabic";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/noto-naskh-arabic-arabic-700-normal.d2d8e6b1.woff2) format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Noto Sans Myanmar";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/noto-sans-myanmar-myanmar-300-normal.94441989.woff2) format("woff2");
  unicode-range: U+1000-109F,U+200C-200D,U+25CC,U+A92E,U+A9E0-A9FE,U+AA60-AA7F,U+116D0-116E3;
}
@font-face {
  font-family: "Noto Sans Myanmar";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/noto-sans-myanmar-myanmar-400-normal.da6f87b8.woff2) format("woff2");
  unicode-range: U+1000-109F,U+200C-200D,U+25CC,U+A92E,U+A9E0-A9FE,U+AA60-AA7F,U+116D0-116E3;
}
@font-face {
  font-family: "Noto Sans Myanmar";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/noto-sans-myanmar-myanmar-500-normal.13f94437.woff2) format("woff2");
  unicode-range: U+1000-109F,U+200C-200D,U+25CC,U+A92E,U+A9E0-A9FE,U+AA60-AA7F,U+116D0-116E3;
}
@font-face {
  font-family: "Noto Sans Myanmar";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/noto-sans-myanmar-myanmar-600-normal.7a8d9040.woff2) format("woff2");
  unicode-range: U+1000-109F,U+200C-200D,U+25CC,U+A92E,U+A9E0-A9FE,U+AA60-AA7F,U+116D0-116E3;
}
@font-face {
  font-family: "Noto Sans Ethiopic";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/fonts/noto-sans-ethiopic-ethiopic-300-normal.748e8a8e.woff2) format("woff2");
  unicode-range: U+030E,U+1200-1399,U+2D80-2DDE,U+AB01-AB2E,U+1E7E0-1E7E6,U+1E7E8-1E7EB,U+1E7ED-1E7EE,U+1E7F0-1E7FE;
}
@font-face {
  font-family: "Noto Sans Ethiopic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/noto-sans-ethiopic-ethiopic-400-normal.4989af5e.woff2) format("woff2");
  unicode-range: U+030E,U+1200-1399,U+2D80-2DDE,U+AB01-AB2E,U+1E7E0-1E7E6,U+1E7E8-1E7EB,U+1E7ED-1E7EE,U+1E7F0-1E7FE;
}
@font-face {
  font-family: "Noto Sans Ethiopic";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/noto-sans-ethiopic-ethiopic-500-normal.ee45437b.woff2) format("woff2");
  unicode-range: U+030E,U+1200-1399,U+2D80-2DDE,U+AB01-AB2E,U+1E7E0-1E7E6,U+1E7E8-1E7EB,U+1E7ED-1E7EE,U+1E7F0-1E7FE;
}
@font-face {
  font-family: "Noto Sans Ethiopic";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/noto-sans-ethiopic-ethiopic-600-normal.9bea9116.woff2) format("woff2");
  unicode-range: U+030E,U+1200-1399,U+2D80-2DDE,U+AB01-AB2E,U+1E7E0-1E7E6,U+1E7E8-1E7EB,U+1E7ED-1E7EE,U+1E7F0-1E7FE;
}

/* deathtoll.info. Mourning palette: near-black ground, cool off-white type, ash greys for
   data and one muted violet-grey (half-mourning) for links and focus. No colour belongs to
   any party. One theme only: black is the standard, whatever the system setting.
   Layout: a slim top bar, then the page at a bounded width. War pages show two panels with
   identical structure, rows aligned through subgrid; below them the chart at full width and
   the notes at reading width. Direction flips for Hebrew and Arabic; charts keep time running
   left to right. */
:root {
  --bg: #0b0b0d;
  --surface: #111114;
  --surface-2: #16161a;
  --rule: #24242a;
  --rule-strong: #33333b;
  --ink: #ececef;
  --ink-soft: #c8c8ce;
  --muted: #9d9da7;
  --accent: #bdb4d6;
  --accent-hover: #ddd7ee;
  --seg1: #e4e4e8;
  --seg2: #8e8e98;
  --seg3: #4d4d55;
  --seg4: #b9b4c9;
  --seg5: #3a3a42;
  --line-day: #4a4a53;
  --line-avg: #d8d2ea;
  --bar: #6c6c77;
  --bar-actief: #d8d2ea;
  --band: #18181c;
  --grid: #1e1e23;
  --axis: #5c5c66;
  --shadow: rgba(0, 0, 0, 0.6);
  /* Map: the only red on the site, for the circles of deaths (wish Marco 14-10-2026). */
  --rood: #d23a48;
  --rood-vul: rgba(226, 40, 58, 0.58);
  --rood-vul-actief: rgba(240, 64, 80, 0.85);
  --rood-rand: #ff5f6d;
  --rood-rand-actief: #ffb3ba;
  --font-display: "Source Serif 4", "Frank Ruhl Libre", "Noto Naskh Arabic", "Noto Sans Myanmar", "Noto Sans Ethiopic", Georgia, "Times New Roman", serif;
  --font-body: "IBM Plex Sans", "IBM Plex Sans Hebrew", "IBM Plex Sans Arabic", "Noto Sans Myanmar", "Noto Sans Ethiopic", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "IBM Plex Sans Hebrew", "IBM Plex Sans Arabic", "Noto Sans Myanmar", "Noto Sans Ethiopic", ui-monospace, Menlo, Consolas, monospace;
  --maxw: 72rem;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  background:
    radial-gradient(80rem 30rem at 50% -10rem, rgba(189, 180, 214, 0.11), transparent 72%),
    var(--bg);
  background-repeat: no-repeat;
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
a { color: var(--accent); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--accent-hover); }
a:focus-visible, summary:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 2px; }
bdi.num { unicode-bidi: isolate; direction: ltr; }
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }

/* Skip link: moved with transform (a far-off left value would widen RTL pages). */
.skip {
  position: absolute;
  top: 8px;
  inset-inline-start: 12px;
  z-index: 10;
  padding: 8px 12px;
  background: var(--ink);
  color: var(--bg);
  border-radius: 4px;
  transform: translateY(-200%);
}
.skip:focus { transform: none; color: var(--bg); }

/* ---------- Top bar ---------- */
.top { border-bottom: 1px solid var(--rule); }
.top-in {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 14px 24px;
  display: flex;
  align-items: center;
  gap: 10px 28px;
  flex-wrap: wrap;
}
.merk {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.06em;
  color: var(--ink);
  text-decoration: none;
  margin-inline-end: auto;
}
.merk span { color: var(--muted); }
.hoofdnav, .talen { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13.5px; }
.hoofdnav a, .talen a { color: var(--muted); text-decoration: none; padding-block: 4px; border-bottom: 1px solid transparent; }
.hoofdnav a:hover, .talen a:hover { color: var(--ink); }
.hoofdnav a[aria-current], .talen a[aria-current] { color: var(--ink); border-bottom-color: var(--accent); }
.talen { padding-inline-start: 18px; border-inline-start: 1px solid var(--rule); }
/* Uitklapmenu bij meer dan vijf talen: <details>, werkt zonder JavaScript. */
.talen-menu { position: relative; }
.talen-menu summary {
  display: flex; align-items: center; gap: 7px;
  color: var(--muted); cursor: pointer; list-style: none; padding-block: 4px;
}
.talen-menu summary::-webkit-details-marker { display: none; }
.talen-menu summary::after {
  content: ""; width: 6px; height: 6px; margin-inline-start: 2px;
  border-inline-end: 1px solid currentColor; border-bottom: 1px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}
.talen-menu details[open] summary::after { transform: translateY(1px) rotate(-135deg); }
.talen-menu summary:hover, .talen-menu details[open] summary { color: var(--ink); }
.talen-menu .wereld { flex: none; opacity: 0.8; }
.talen-menu ul {
  position: absolute; z-index: 20; top: calc(100% + 10px); inset-inline-end: 0;
  margin: 0; padding: 8px; list-style: none;
  display: grid; grid-template-columns: repeat(2, minmax(9.5rem, auto)); gap: 2px 6px;
  background: var(--surface-2); border: 1px solid var(--rule-strong); border-radius: 6px;
  box-shadow: 0 18px 40px -12px var(--shadow);
}
.talen-menu li a { display: block; padding: 7px 10px; border-radius: 4px; border-bottom: 0; text-align: start; }
.talen-menu li a:hover { background: var(--band); }
.talen-menu li a[aria-current] { color: var(--ink); background: var(--band); border-inline-start: 2px solid var(--accent); padding-inline-start: 8px; }

/* Notice after an automatic choice of language (src/taalkeuze.js, app.js). */
.auto-taal { border-bottom: 1px solid var(--rule); background: var(--surface); }
.auto-taal-in {
  max-width: var(--maxw); margin: 0 auto; padding: 10px 24px;
  font-size: 13.5px; color: var(--ink-soft);
  border-inline-start: 2px solid var(--accent);
}
.auto-taal-in a { white-space: nowrap; margin-inline-start: 6px; }
@media (max-width: 30rem) { .auto-taal-in { padding-inline: 14px 16px; } }

/* ---------- Page ---------- */
.wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 56px 24px 72px;
  display: grid;
  gap: 48px;
}
.mast { display: grid; gap: 14px; max-width: 50rem; }
.eyebrow {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
h1 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.3rem, 1.5rem + 3.4vw, 3.9rem);
  line-height: 1.06;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.lede { margin: 0; color: var(--ink-soft); font-size: 17px; line-height: 1.6; max-width: 44rem; }
.mast p { margin: 0; }

h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.25;
}
h3 {
  margin: 0 0 12px;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}

/* ---------- Type-of-source label ---------- */
/* Each type has its own small shape, so the labels differ without relying on colour. */
.type {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-soft);
  text-decoration: none;
  border: 1px solid var(--rule-strong);
  border-radius: 999px;
  padding: 2px 9px 2px 8px;
  white-space: nowrap;
  vertical-align: 1px;
}
a.type:hover { color: var(--ink); border-color: var(--accent); }
.type::before { content: ""; display: inline-block; width: 7px; height: 7px; background: var(--ink-soft); flex: none; }
.type-officieel::before { border-radius: 50%; }
.type-vn::before { transform: rotate(45deg) scale(0.85); }
.type-opnaam::before { border-radius: 1px; }
.type-monitor::before { width: 0; height: 0; background: none; border-inline: 4px solid transparent; border-bottom: 7px solid var(--ink-soft); }
.type-schatting::before { background: none; border: 1.5px solid var(--ink-soft); border-radius: 50%; }

/* ---------- Overview: counter of deaths today (estimate) ---------- */
.kop-overzicht { display: grid; gap: 40px; }
.teller { display: grid; gap: 10px; align-content: start; padding: 28px 0 0; border-top: 1px solid var(--rule-strong); }
@media (min-width: 64rem) {
  .kop-overzicht { grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); gap: 56px; align-items: end; }
  .teller { border-top: 0; border-inline-start: 1px solid var(--rule-strong); padding: 6px 0 4px; padding-inline-start: 44px; }
  .mast-overzicht h1 { font-size: clamp(2.8rem, 1.6rem + 3.6vw, 4.6rem); }
}
.teller-kop { margin: 0; font-family: var(--font-mono); font-weight: 500; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); line-height: 1.4; }
.teller-getal { display: grid; gap: 6px; }
.teller-n {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(4.4rem, 2rem + 7vw, 8rem);
  line-height: 0.95;
  letter-spacing: -0.035em;
  font-variant-numeric: tabular-nums lining-nums;
}
.teller-sub { margin: 0; font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.teller-uitleg { margin: 6px 0 0; max-width: 46rem; color: var(--ink-soft); font-size: 14px; line-height: 1.55; }
@media (prefers-reduced-motion: no-preference) {
  .teller-n .tik { animation: tik 1.6s ease-out; }
  @keyframes tik { from { color: var(--accent-hover); text-shadow: 0 0 24px rgba(221, 215, 238, 0.35); } to { color: var(--ink); text-shadow: none; } }
}

/* ---------- Overview: world map (Equal Earth, circles by deaths) ---------- */
.kaartblok { display: grid; gap: 14px; min-width: 0; }
.kaartblok-kop { display: grid; gap: 6px; max-width: 48rem; }
.kaartblok-titel { margin: 0; font-family: var(--font-mono); font-weight: 500; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); line-height: 1.4; }
.kaartblok-sub { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.55; }
.kaartblok-box { position: relative; min-width: 0; }
.kaart-svg { display: block; width: 100%; height: auto; overflow: hidden; }
.kaart-smal { display: none; }
@media (max-width: 39.99rem) {
  .kaart-breed { display: none; }
  .kaart-smal { display: block; }
  .kaartblok-box { margin-inline: -16px; }
}
.bollen circle { fill: var(--rood-vul); stroke: var(--rood-rand); stroke-width: 1; vector-effect: non-scaling-stroke; transition: fill 0.15s; }
@media (prefers-reduced-motion: no-preference) { .bollen circle { transition: fill 0.15s, r 0.35s ease; } }
/* No deaths in the chosen period: an open ring instead of a circle of size zero. */
.bollen a.nul circle { fill: none; stroke: var(--ink-soft); }
.kaart-periode { width: fit-content; margin-top: 8px; }
.bollen a { cursor: pointer; }
.bollen a:hover circle, .bollen a.actief circle { fill: var(--rood-vul-actief); stroke: var(--rood-rand-actief); }
.kaart-svg text { font-family: var(--font-body); font-size: var(--kaart-fs, 12px); fill: var(--muted); }
.legenda circle { fill: none; stroke: var(--axis); stroke-width: 1; vector-effect: non-scaling-stroke; }
.legenda polyline { fill: none; stroke: var(--axis); stroke-width: 1; stroke-dasharray: 2 2; vector-effect: non-scaling-stroke; }
.legenda text { font-variant-numeric: tabular-nums; }
.legenda .legenda-kop { fill: var(--ink-soft); }
.kaart-labels text { fill: var(--ink); paint-order: stroke; stroke: var(--bg); stroke-width: var(--kaart-halo, 3px); stroke-linejoin: round; pointer-events: none; }
.kaart-lijnen line { stroke: var(--ink-soft); stroke-width: 0.8; vector-effect: non-scaling-stroke; opacity: 0.7; }
.kaartblok-noot { margin: 0; color: var(--muted); font-size: 12.5px; max-width: 52rem; }
.kaartblok-tip {
  position: absolute; z-index: 5; pointer-events: none;
  background: var(--surface-2); border: 1px solid var(--rule-strong); border-radius: 3px;
  padding: 7px 10px; font-size: 12.5px; line-height: 1.45; box-shadow: 0 8px 24px var(--shadow);
  max-width: 16rem;
}
.kaartblok-tip b { display: block; font-weight: 600; color: var(--ink); }
.kaartblok-tip span { color: var(--ink-soft); font-variant-numeric: tabular-nums; }

/* ---------- Overview: an index, one row per war ---------- */
.mast-overzicht h1 { font-size: clamp(2.8rem, 1.6rem + 4.8vw, 5.4rem); }
.oorlogen { display: grid; border-top: 1px solid var(--rule-strong); }
.ok-rij { display: grid; gap: 16px 40px; padding-block: 26px 28px; border-bottom: 1px solid var(--rule); }
@media (min-width: 64rem) { .ok-rij { grid-template-columns: 15rem 1fr; } }
.ok-naam { display: grid; align-content: start; gap: 6px; }
.ok-naam h2 { font-size: 1.5rem; line-height: 1.2; }
.ok-naam h2 a { color: var(--ink); text-decoration: none; }
.ok-naam h2 a:hover { color: var(--accent-hover); text-decoration: underline; text-decoration-thickness: 1px; }
/* Non-breaking space: the arrow never ends up alone on a new line. */
.ok-naam h2 a::after { content: "\00a0\2192"; color: var(--muted); font-size: 0.8em; }
:root[dir="rtl"] .ok-naam h2 a::after { content: "\00a0\2190"; }
.ok-sinds { margin: 0; font-family: var(--font-mono); font-size: 11.5px; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
@media (min-width: 64rem) {
  .ok-sinds .sep { display: none; }
  .ok-sinds .dag { display: block; margin-top: 2px; }
}
.pagina-taal { margin: 0; color: var(--muted); font-size: 13px; }
.volgorde { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--rule); font-size: 13px; color: var(--muted); text-wrap: pretty; }
.ok-twaalf { margin: 6px 0 0; font-size: 13px; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.ok-cijfers { display: grid; gap: 14px; align-content: start; min-width: 0; }
.ok-bron { margin: 0; }
/* Sides next to each other; rows (side name, then each key figure) line up through subgrid. */
.ok-zijden { display: grid; grid-template-columns: 1fr; column-gap: 32px; row-gap: 0; }
@media (min-width: 40rem) {
  .ok-zijden.zijden-2 { grid-template-columns: 1fr 1fr; }
  .ok-zijden.zijden-3 { grid-template-columns: 1fr 1fr 1fr; }
}
.ok-zijde { display: grid; grid-template-rows: subgrid; row-gap: 12px; align-content: start; }
.rijen-1 .ok-zijde { grid-row: span 2; }
.rijen-2 .ok-zijde { grid-row: span 3; }
.rijen-3 .ok-zijde { grid-row: span 4; }
/* Phone: one war is one compact block. Two sides with one figure each stand side by side;
   otherwise the sides are stacked and the figures of a side stand two by two. */
@media (max-width: 39.99rem) {
  .ok-rij { gap: 14px; padding-block: 20px 22px; }
  .ok-naam { gap: 4px; }
  .ok-naam h2 { font-size: 1.32rem; }
  .ok-twaalf { margin-top: 4px; }
  .ok-zijden { row-gap: 18px; }
  .ok-zijden.zijden-2.rijen-1 { grid-template-columns: 1fr 1fr; column-gap: 20px; }
  .ok-zijden.zijden-2.rijen-1 .ok-zijde { grid-row: auto; grid-template-rows: none; align-content: start; }
  .ok-zijde.kern-2 { grid-template-rows: none; grid-row: auto; grid-template-columns: 1fr 1fr; column-gap: 20px; row-gap: 8px; }
  .ok-zijde.kern-2 h3 { grid-column: 1 / -1; }
  .ok-zijde h3 { padding-bottom: 6px; border-bottom: 1px solid var(--rule); }
  .ok-getal { font-size: 1.75rem; }
  .ok-label { font-size: 13px; margin-top: 3px !important; }
  .ok-cijfer .asof { margin-top: 5px; }
  .ok-cijfer .type { font-size: 10px; padding: 1px 7px 1px 6px; }
  .ok-cijfer .asof-d { font-size: 11px; line-height: 1.4; }
  .ok-cijfer .asof { gap: 4px 8px; }
}
/* One side with several figures (all groups of a UCDP war): the figures side by side. */
@media (min-width: 40rem) {
  .ok-zijden.zijden-1 .ok-zijde { grid-template-rows: none; grid-template-columns: 1fr 1fr; column-gap: 32px; grid-row: auto; }

}
.ok-zijde h3 { margin: 0; }
.ok-cijfer p { margin: 0; }
.ok-groep { font-size: 12.5px; color: var(--muted); margin-bottom: 2px !important; }
/* One size for every figure on the overview: the size of a number never ranks a war or a side. */
.ok-getal {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2rem, 1.5rem + 1.6vw, 2.6rem);
  line-height: 1.05;
  letter-spacing: -0.015em;
  font-variant-numeric: lining-nums;
}
.ok-label { margin-top: 6px !important; color: var(--ink-soft); font-size: 13.5px; line-height: 1.45; }
.ok-cijfer .asof { margin-top: 6px; font-size: 11.5px; }
.geen { font-family: var(--font-body); font-weight: 400; font-size: 1rem; letter-spacing: 0; color: var(--muted); }

.uitleg { display: grid; grid-template-columns: 1fr; gap: 36px 56px; }
@media (min-width: 56rem) { .uitleg { grid-template-columns: 5fr 7fr; } }
.uitleg-blok { display: grid; align-content: start; gap: 12px; }
.uitleg-blok h2 { font-size: 1.35rem; }
.uitleg-blok p { margin: 0; color: var(--ink-soft); }
.typen-lijst { margin: 6px 0 0; display: grid; gap: 14px; }
.typen-lijst div { display: grid; grid-template-columns: 11.5rem 1fr; gap: 4px 16px; align-items: baseline; }
.typen-lijst dt { margin: 0; }
.typen-lijst dd { margin: 0; color: var(--ink-soft); font-size: 14px; }
@media (max-width: 34rem) { .typen-lijst div { grid-template-columns: 1fr; } }

/* ---------- War page: panels ---------- */
.panels { display: grid; grid-template-columns: 1fr; column-gap: 24px; row-gap: 0; }
@media (min-width: 48rem) { .panels { grid-template-columns: 1fr 1fr; } }
/* Three panels (Iran, Israel, United States) side by side on wide screens. */
@media (min-width: 64rem) { .panels.drie { grid-template-columns: 1fr 1fr 1fr; column-gap: 18px; } .panels.drie .sec { padding-inline: 20px; } }
@media (min-width: 48rem) and (max-width: 63.99rem) { .panels.drie { grid-template-columns: 1fr; } .panels.drie .panel + .panel { margin-top: 24px; } }
/* One panel (UCDP wars: all groups together): full width. */
@media (min-width: 48rem) { .panels.enkel { grid-template-columns: 1fr; } }
.panel {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 7;
  row-gap: 0;
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: 3px;
}
.panel.rijen-8 { grid-row: span 8; }
.panel.rijen-9 { grid-row: span 9; }
@media (max-width: 47.99rem) { .panel + .panel { margin-top: 24px; } }
.sec { padding: 18px 24px; min-width: 0; }
.sec + .sec { border-top: 1px solid var(--rule); }
.p-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-block: 20px 12px; }
.p-head h2 { font-size: 1.55rem; }
.pill {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.05em;
  color: var(--muted);
  border: 1px solid var(--rule-strong);
  border-radius: 999px;
  padding: 2px 10px;
  white-space: nowrap;
}
.figure { border-top: none !important; padding-top: 4px; }
.big {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(3.4rem, 2.2rem + 5vw, 5.6rem);
  line-height: 1;
  letter-spacing: -0.025em;
  font-variant-numeric: lining-nums;
}
.big-label { margin: 12px 0 0; font-size: 15px; color: var(--ink-soft); }
.asof { margin: 10px 0 0; font-family: var(--font-mono); font-size: 12px; color: var(--muted); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.kern-rij p { margin: 0; }
.sec.kern-volg { border-top: none; padding-top: 4px; }
.kern-groep { font-size: 13px; color: var(--muted); margin-bottom: 4px !important; }
.kern-label { margin-top: 6px !important; color: var(--ink-soft); font-size: 14px; }
.sec p { margin: 0; }
.sec p + p { margin-top: 8px; }
.note { color: var(--muted); font-size: 13.5px; }

.mid {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: 2.7rem;
  line-height: 1;
  font-variant-numeric: lining-nums;
}
.mid-text { font-family: var(--font-display); font-weight: 400; font-size: 1.45rem; line-height: 1.3; color: var(--muted); }
.sec .mid-label { margin: 8px 0 12px; font-size: 14px; color: var(--muted); }
.sec .mid-label:last-child { margin-bottom: 0; }

.bar { display: flex; height: 8px; border-radius: 1px; overflow: hidden; gap: 2px; margin-bottom: 14px; }
.bar span { display: block; flex: 1 1 0; min-width: 3px; }
.legend { margin: 0 0 10px; display: grid; gap: 5px; }
.legend:last-child { margin-bottom: 0; }
.legend div { display: grid; grid-template-columns: 1fr auto auto; align-items: baseline; column-gap: 12px; }
.sw { display: inline-block; width: 9px; height: 9px; border-radius: 1px; margin-inline-end: 10px; vertical-align: 0; }
.c-seg1 { background: var(--seg1); }
.c-seg2 { background: var(--seg2); }
.c-seg3 { background: var(--seg3); }
.c-seg4 { background: var(--seg4); }
.c-seg5 { background: var(--seg5); }
/* Not assigned (UCDP): hatched, so it differs from every solid segment without relying on colour. */
.c-na { background: repeating-linear-gradient(135deg, var(--seg2) 0 1.5px, transparent 1.5px 4px); box-shadow: inset 0 0 0 1px var(--rule-strong); }
.legend dt { margin: 0; min-width: 0; }
.legend dd { margin: 0; font-variant-numeric: tabular-nums; text-align: end; }
.legend .pct { color: var(--muted); font-size: 13px; min-width: 3.2em; }
.legend .subrow dt { padding-inline-start: 19px; color: var(--muted); }
.legend .zero dt, .legend .zero dd { color: var(--muted); }

.tellingen { margin: 0; padding: 0; list-style: none; display: grid; gap: 16px; }
.tellingen p { margin: 0; }
.tel-kop { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.tel-getal { font-family: var(--font-display); font-size: 1.35rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tellingen .asof { margin-top: 4px; }
.tellingen .note { margin-top: 6px; }
.note.intro { margin: -2px 0 18px; max-width: 46rem; }
.tellingen > li + li { padding-top: 16px; border-top: 1px solid var(--rule); }

.deltas { margin: 0; display: grid; gap: 14px; }
.deltas div { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; row-gap: 2px; }
.deltas dt { margin: 0; font-weight: 500; }
.deltas .val { margin: 0; font-family: var(--font-display); font-size: 1.35rem; line-height: 1.2; font-variant-numeric: tabular-nums; text-align: end; }
.deltas .sub { margin: 0; grid-column: 1 / -1; color: var(--muted); font-size: 13.5px; }

.sources { margin: 0; padding: 0; list-style: none; display: grid; gap: 7px; font-size: 13.5px; }
.sources li { overflow-wrap: anywhere; }
.sources .role { color: var(--muted); }

/* ---------- Chart ---------- */
.chart-card {
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 22px 24px 24px;
  display: grid;
  gap: 14px;
  min-width: 0;
}
.chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px 24px; flex-wrap: wrap; }
.chart-head > div { min-width: 0; max-width: 42rem; }
.chart-head h2 { font-size: 1.4rem; }
.chart-sub { margin: 6px 0 0; color: var(--muted); font-size: 14px; }
.seg-ctl { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--rule-strong); border-radius: 4px; padding: 2px; gap: 2px; }
.seg-ctl button { font: 500 13px/1.2 var(--font-body); color: var(--muted); background: transparent; border: 0; border-radius: 3px; padding: 7px 11px; cursor: pointer; }
.seg-ctl button:hover { color: var(--ink); }
.seg-ctl button[aria-pressed="true"] { background: var(--surface-2); color: var(--ink); box-shadow: 0 0 0 1px var(--rule-strong); }
.legend-line { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13px; color: var(--muted); margin: 0; padding: 0; list-style: none; }
.key { display: inline-block; width: 16px; height: 0; vertical-align: middle; margin-inline-end: 8px; border-top: 2px solid var(--line-avg); border-radius: 2px; }
.key-day { border-top-color: var(--line-day); }
.key-band { width: 12px; height: 10px; border: 1px solid var(--rule-strong); background: var(--band); vertical-align: -1px; }
.key-bar { width: 10px; height: 10px; border: 0; background: var(--bar-actief); vertical-align: -1px; }
.chart-box { position: relative; min-width: 0; touch-action: pan-y; }
.chart-box:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 2px; }
#chart-svg { display: block; width: 100%; }
#chart-svg text { font-family: var(--font-mono); font-size: 11px; fill: var(--muted); }
#chart-svg .band-label { font-size: 10.5px; letter-spacing: 0.04em; }
#chart-svg .afgekapt { fill: var(--ink-soft); }
.chart-geenjs { margin: 0; color: var(--muted); font-size: 14px; }
.tip {
  position: absolute;
  top: 6px;
  pointer-events: none;
  background: var(--surface-2);
  border: 1px solid var(--rule-strong);
  border-radius: 3px;
  padding: 8px 10px;
  font-size: 12.5px;
  line-height: 1.45;
  box-shadow: 0 8px 24px var(--shadow);
  width: 14rem;
  max-width: calc(100% - 8px);
}
.tip-date { font-family: var(--font-mono); font-size: 11.5px; color: var(--muted); margin-bottom: 4px; }
.tip-row { display: flex; align-items: center; gap: 6px; }
.tip-row b { font-weight: 600; font-variant-numeric: tabular-nums; }
.tip-row span { color: var(--muted); }
.tip-parts { margin-top: 4px; color: var(--muted); }
.chart-note { margin: 0; color: var(--muted); font-size: 13.5px; max-width: 46rem; }
.chart-note:empty { display: none; }
.table-view summary { cursor: pointer; color: var(--accent); font-size: 13.5px; width: fit-content; }
.table-wrap { overflow: auto; margin-top: 10px; max-height: 26rem; border: 1px solid var(--rule); border-radius: 3px; }
.table-wrap:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
table { border-collapse: collapse; width: 100%; font-size: 13.5px; font-variant-numeric: tabular-nums; }
th, td { padding: 6px 12px; border-bottom: 1px solid var(--rule); text-align: end; white-space: nowrap; }
th:first-child, td:first-child { text-align: start; }
tbody th { font-weight: 400; }
thead th { position: sticky; top: 0; background: var(--surface); font-weight: 500; color: var(--muted); font-size: 12.5px; }
tbody tr:last-child td, tbody tr:last-child th { border-bottom: 0; }
td.na { color: var(--muted); }

/* ---------- Not counted, notes, reading text ---------- */
.niet-geteld { display: grid; gap: 12px; max-width: 46rem; }
.niet-geteld h2, .method h2 { font-size: 1.4rem; }
.niet-geteld ul { margin: 0; padding-inline-start: 1.1rem; display: grid; gap: 6px; color: var(--ink-soft); }
.niet-geteld li::marker { color: var(--muted); }
.method { display: grid; gap: 20px; max-width: 46rem; }
.method dl { margin: 0; display: grid; gap: 18px; }
.method dt { font-weight: 600; margin: 0 0 3px; }
.method dd { margin: 0; color: var(--ink-soft); }
.method dd p { margin: 0; }
.method dd p + p { margin-top: 6px; }
.leestekst { display: grid; gap: 40px; max-width: 46rem; }
.leestekst section { display: grid; gap: 12px; }
.leestekst p { margin: 0; color: var(--ink-soft); }
.regels { margin: 0; padding-inline-start: 1.4rem; display: grid; gap: 10px; color: var(--ink-soft); }
.regels li::marker { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
.leestekst .typen-lijst div { scroll-margin-top: 24px; }
.leestekst .typen-lijst div:target dd { color: var(--ink); }

/* ---------- Footer ---------- */
.voet { border-top: 1px solid var(--rule); }
.voet-in { max-width: var(--maxw); margin: 0 auto; padding: 22px 24px 40px; font-size: 13px; color: var(--muted); display: grid; gap: 6px; }
.voet-in p { margin: 0; max-width: 50rem; }
.voet .versie { margin-top: 8px; font-family: var(--font-mono); font-size: 12px; }

/* ---------- Hebrew and Arabic ---------- */
/* No letter-spacing (it breaks joined Arabic script), body face for small labels, more leading. */
:root[dir="rtl"] body { line-height: 1.75; }
:root[dir="rtl"] .eyebrow,
:root[dir="rtl"] h3,
:root[dir="rtl"] .pill,
:root[dir="rtl"] .asof,
:root[dir="rtl"] .ok-sinds,
:root[dir="rtl"] .type,
:root[dir="rtl"] .tip-date,
:root[dir="rtl"] #chart-svg .band-label { font-family: var(--font-body); letter-spacing: 0; }
:root[dir="rtl"] .eyebrow, :root[dir="rtl"] h3, :root[dir="rtl"] .ok-sinds { font-size: 12.5px; }
:root[dir="rtl"] .teller-kop, :root[dir="rtl"] .teller-sub, :root[dir="rtl"] .kaartblok-titel { font-family: var(--font-body); letter-spacing: 0; font-size: 13px; }
:root[dir="rtl"] .teller-n { letter-spacing: 0; }
:root[dir="rtl"] h1 { line-height: 1.22; letter-spacing: 0; }
:root[dir="rtl"] h2 { line-height: 1.45; }
:root[dir="rtl"] .big, :root[dir="rtl"] .mid, :root[dir="rtl"] .ok-getal { letter-spacing: 0; }

/* Birmaans en Amhaars: hogere regels (stapeltekens en fidel), geen spatiëring, kleine
   labels in de tekstletter in plaats van de mono. */
:lang(my) { line-height: 1.95; }
:lang(am) { line-height: 1.75; }
:lang(my) h1, :lang(am) h1 { line-height: 1.5; letter-spacing: 0; }
.mast-overzicht h1:lang(my) { font-size: clamp(2.2rem, 1.4rem + 2.6vw, 3.6rem); }
h1:lang(my) { font-size: clamp(2rem, 1.3rem + 2.2vw, 3.2rem); }
:lang(my) h2, :lang(am) h2 { line-height: 1.6; letter-spacing: 0; }
:lang(my) :is(.eyebrow, h3, .pill, .asof, .type, .ok-sinds, .teller-kop, .teller-sub, .kaartblok-titel),
:lang(am) :is(.eyebrow, h3, .pill, .asof, .type, .ok-sinds, .teller-kop, .teller-sub, .kaartblok-titel) {
  font-family: var(--font-body); letter-spacing: 0; text-transform: none;
}
:lang(my) :is(.big, .mid, .ok-getal, .teller-n), :lang(am) :is(.big, .mid, .ok-getal, .teller-n) { letter-spacing: 0; }
:lang(my) :is(.big, .mid, .ok-getal, .teller-n) { line-height: 1.25; }
.teller-n:lang(my) { font-size: clamp(3.4rem, 1.6rem + 5vw, 6rem); }

@media (max-width: 30rem) {
  /* Phone: panels and the chart run to the edge of the screen, so the figures and the
     text get the full width; only the top and bottom rules remain. */
  .panel, .chart-card { margin-inline: -16px; border-inline: 0; border-radius: 0; }
  .sec { padding-inline: 16px; }
  .p-head { padding-block: 18px 10px; }
  .big { font-size: clamp(3rem, 2.2rem + 5vw, 4rem); }
  .top-in { padding-inline: 16px; }
  .wrap { padding: 36px 16px 52px; gap: 40px; }
  .chart-card { padding-inline: 16px; }
  .voet-in { padding-inline: 16px; }
  .talen { padding-inline-start: 0; border-inline-start: 0; }
  .top-in { position: relative; }
  .talen-menu { position: static; }
  .talen-menu ul { grid-template-columns: repeat(2, minmax(0, 1fr)); top: calc(100% - 4px); inset-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
