/* GENERATED from brand/tokens.json by web/tools/build-helmfold-theme.py. Do not edit. */
/* Loaded after the Helmfold theme (CUSTOM_CSS), so these :root[data-theme] rules win. */
@font-face {
  font-family: "Chakra Petch";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/chakra-petch-600.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 100 499;
  font-display: swap;
  src: url("../fonts/ibm-plex-sans-400.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500 900;
  font-display: swap;
  src: url("../fonts/ibm-plex-sans-500.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/jetbrains-mono-400.woff2") format("woff2");
}
:root[data-theme*="light"] {
  --color-body: #eef2f7;
  --color-box-body: #ffffff;
  --color-box-header: #e2e8f0;
  --color-box-body-highlight: #f0f4f8;
  --color-card: #ffffff;
  --color-menu: #ffffff;
  --color-nav-bg: #e2e8f0;
  --color-input-background: #d6dee8;
  --color-code-bg: #d6dee8;
  --color-button: #d6dee8;
  --color-input-toggle-background: #bec6d0;
  --color-text: #0b1220;
  --color-text-dark: #0b1220;
  --color-text-light: #232d3c;
  --color-text-light-1: #3b4858;
  --color-text-light-2: #3b4858;
  --color-text-light-3: #7a8699;
  --color-hover: #0069781a;
  --color-active: #00697829;
  --color-hover-opaque: #d6e4ea;
  --color-markup-code-block: #0b122012;
  --color-markup-code-inline: #0b122024;
  --color-markup-table-row: #0b12200d;
  --color-label-bg: #3b48584c;
  --color-label-hover-bg: #3b48589e;
  --color-label-active-bg: #3b4858ff;
  --color-secondary: #d8d9db;
  --color-secondary-dark-1: #cccdd0;
  --color-secondary-dark-2: #bfc1c5;
  --color-secondary-dark-3: #afb1b6;
  --color-secondary-dark-4: #96999f;
  --color-secondary-dark-5: #555a63;
  --color-secondary-dark-6: #484e58;
  --color-secondary-dark-7: #3c424d;
  --color-secondary-dark-8: #303642;
  --color-secondary-dark-9: #282e3a;
  --color-secondary-dark-10: #202633;
  --color-secondary-dark-11: #19202d;
  --color-secondary-dark-12: #131a27;
  --color-secondary-dark-13: #0f1624;
  --color-secondary-light-1: #dedfe0;
  --color-secondary-light-2: #e4e4e6;
  --color-secondary-light-3: #eaeaeb;
  --color-secondary-light-4: #eff0f1;
  --color-secondary-alpha-10: #d8d9db1a;
  --color-secondary-alpha-20: #d8d9db33;
  --color-secondary-alpha-30: #d8d9db4c;
  --color-secondary-alpha-40: #d8d9db66;
  --color-secondary-alpha-50: #d8d9db80;
  --color-secondary-alpha-60: #d8d9db99;
  --color-secondary-alpha-70: #d8d9dbb2;
  --color-secondary-alpha-80: #d8d9dbcc;
  --color-secondary-alpha-90: #d8d9dbe6;
}
:root[data-theme*="light"]:not([data-theme*="opia"]) {
  --color-primary: #006978;
  --color-primary-dark-1: #016271;
  --color-primary-dark-2: #025b6a;
  --color-primary-dark-3: #035463;
  --color-primary-dark-4: #044d5c;
  --color-primary-dark-5: #054250;
  --color-primary-dark-6: #082c3a;
  --color-primary-dark-7: #0a1927;
  --color-primary-light-1: #1a7886;
  --color-primary-light-2: #338793;
  --color-primary-light-3: #4c96a0;
  --color-primary-light-4: #66a5ae;
  --color-primary-light-5: #99c3c9;
  --color-primary-light-6: #cce1e4;
  --color-primary-light-7: #f2f8f8;
  --color-primary-alpha-10: #0069781a;
  --color-primary-alpha-20: #00697833;
  --color-primary-alpha-30: #0069784c;
  --color-primary-alpha-40: #00697866;
  --color-primary-alpha-50: #00697880;
  --color-primary-alpha-60: #00697899;
  --color-primary-alpha-70: #006978b2;
  --color-primary-alpha-80: #006978cc;
  --color-primary-alpha-90: #006978e6;
  --color-primary-contrast: #ffffff;
  --color-red: #d62a48;
  --color-red-light: #da3f5a;
  --color-red-dark-1: #c12641;
  --color-red-dark-2: #ab223a;
  --color-orange: #b07700;
  --color-orange-light: #b8851a;
  --color-orange-dark-1: #9e6b00;
  --color-orange-dark-2: #8d5f00;
  --color-yellow: #b07700;
  --color-yellow-light: #b8851a;
  --color-yellow-dark-1: #9e6b00;
  --color-yellow-dark-2: #8d5f00;
  --color-green: #00a86b;
  --color-green-light: #1ab17a;
  --color-green-dark-1: #009760;
  --color-green-dark-2: #008656;
  --color-teal: #006978;
  --color-teal-light: #1a7886;
  --color-teal-dark-1: #005e6c;
  --color-teal-dark-2: #005460;
  --color-blue: #006978;
  --color-blue-light: #1a7886;
  --color-blue-dark-1: #005e6c;
  --color-blue-dark-2: #005460;
  --color-violet: #6c5ce7;
  --color-violet-light: #7b6ce9;
  --color-violet-dark-1: #6153d0;
  --color-violet-dark-2: #564ab9;
  --color-purple: #6c5ce7;
  --color-purple-light: #7b6ce9;
  --color-purple-dark-1: #6153d0;
  --color-purple-dark-2: #564ab9;
  --color-pink: #c41e74;
  --color-pink-light: #ca3482;
  --color-pink-dark-1: #b01b68;
  --color-pink-dark-2: #9d185d;
  --color-error-border: #ed9fad;
  --color-error-bg: #fae5e9;
  --color-error-text: #c62845;
  --color-success-border: #8cd8bc;
  --color-success-bg: #e0f5ed;
  --color-success-text: #037b54;
  --color-warning-border: #dbc28c;
  --color-warning-bg: #f6efe0;
  --color-warning-text: #8f6306;
  --color-info-border: #8cbcc2;
  --color-info-bg: #e0edef;
  --color-info-text: #006978;
  --color-priority-border: #bdb6f4;
  --color-priority-bg: #edebfc;
  --color-priority-text: #6456d7;
  --color-error-bg-active: #f6d0d7;
  --color-error-bg-hover: #f8dbe0;
}
:root[data-theme*="dark"] {
  --color-body: #070a10;
  --color-box-body: #0d131c;
  --color-box-header: #141c2a;
  --color-box-body-highlight: #101823;
  --color-card: #1a2334;
  --color-menu: #1a2334;
  --color-nav-bg: #141c2a;
  --color-input-background: #0a0e15;
  --color-code-bg: #0a0e15;
  --color-button: #0a0e15;
  --color-input-toggle-background: #242930;
  --color-text: #e4ecf5;
  --color-text-dark: #e4ecf5;
  --color-text-light: #b7c2d1;
  --color-text-light-1: #8a99ad;
  --color-text-light-2: #8a99ad;
  --color-text-light-3: #586575;
  --color-hover: #00e5ff1a;
  --color-active: #00e5ff29;
  --color-hover-opaque: #062028;
  --color-markup-code-block: #e4ecf512;
  --color-markup-code-inline: #e4ecf524;
  --color-markup-table-row: #e4ecf50d;
  --color-label-bg: #8a99ad4c;
  --color-label-hover-bg: #8a99ad9e;
  --color-label-active-bg: #8a99adff;
  --color-secondary: #0a414e;
  --color-secondary-dark-1: #174b58;
  --color-secondary-dark-2: #245662;
  --color-secondary-dark-3: #36636f;
  --color-secondary-dark-4: #507883;
  --color-secondary-dark-5: #96aeb9;
  --color-secondary-dark-6: #a3b9c3;
  --color-secondary-dark-7: #b0c3cd;
  --color-secondary-dark-8: #bdcdd7;
  --color-secondary-dark-9: #c5d4de;
  --color-secondary-dark-10: #cedbe4;
  --color-secondary-dark-11: #d5e0e9;
  --color-secondary-dark-12: #dbe5ee;
  --color-secondary-dark-13: #e0e9f2;
  --color-secondary-light-1: #083742;
  --color-secondary-light-2: #072e37;
  --color-secondary-light-3: #06242b;
  --color-secondary-light-4: #041a1f;
  --color-secondary-alpha-10: #0a414e1a;
  --color-secondary-alpha-20: #0a414e33;
  --color-secondary-alpha-30: #0a414e4c;
  --color-secondary-alpha-40: #0a414e66;
  --color-secondary-alpha-50: #0a414e80;
  --color-secondary-alpha-60: #0a414e99;
  --color-secondary-alpha-70: #0a414eb2;
  --color-secondary-alpha-80: #0a414ecc;
  --color-secondary-alpha-90: #0a414ee6;
}
:root[data-theme*="dark"]:not([data-theme*="opia"]) {
  --color-primary: #00e5ff;
  --color-primary-dark-1: #12e6fe;
  --color-primary-dark-2: #24e6fd;
  --color-primary-dark-3: #37e7fd;
  --color-primary-dark-4: #49e7fc;
  --color-primary-dark-5: #67e8fa;
  --color-primary-dark-6: #a0eaf8;
  --color-primary-dark-7: #d2ebf6;
  --color-primary-light-1: #00cee6;
  --color-primary-light-2: #00b7cc;
  --color-primary-light-3: #00a0b2;
  --color-primary-light-4: #008999;
  --color-primary-light-5: #005c66;
  --color-primary-light-6: #002e33;
  --color-primary-light-7: #000b0d;
  --color-primary-alpha-10: #00e5ff1a;
  --color-primary-alpha-20: #00e5ff33;
  --color-primary-alpha-30: #00e5ff4c;
  --color-primary-alpha-40: #00e5ff66;
  --color-primary-alpha-50: #00e5ff80;
  --color-primary-alpha-60: #00e5ff99;
  --color-primary-alpha-70: #00e5ffb2;
  --color-primary-alpha-80: #00e5ffcc;
  --color-primary-alpha-90: #00e5ffe6;
  --color-primary-contrast: #070a10;
  --color-red: #ff3b5c;
  --color-red-light: #ff4f6c;
  --color-red-dark-1: #e63553;
  --color-red-dark-2: #cc2f4a;
  --color-orange: #ffb000;
  --color-orange-light: #ffb81a;
  --color-orange-dark-1: #e69e00;
  --color-orange-dark-2: #cc8d00;
  --color-yellow: #ffb000;
  --color-yellow-light: #ffb81a;
  --color-yellow-dark-1: #e69e00;
  --color-yellow-dark-2: #cc8d00;
  --color-green: #00ffa3;
  --color-green-light: #1affac;
  --color-green-dark-1: #00e693;
  --color-green-dark-2: #00cc82;
  --color-teal: #00e5ff;
  --color-teal-light: #1ae8ff;
  --color-teal-dark-1: #00cee6;
  --color-teal-dark-2: #00b7cc;
  --color-blue: #00e5ff;
  --color-blue-light: #1ae8ff;
  --color-blue-dark-1: #00cee6;
  --color-blue-dark-2: #00b7cc;
  --color-violet: #6c5ce7;
  --color-violet-light: #7b6ce9;
  --color-violet-dark-1: #6153d0;
  --color-violet-dark-2: #564ab9;
  --color-purple: #6c5ce7;
  --color-purple-light: #7b6ce9;
  --color-purple-dark-1: #6153d0;
  --color-purple-dark-2: #564ab9;
  --color-pink: #ff2e88;
  --color-pink-light: #ff4394;
  --color-pink-dark-1: #e6297a;
  --color-pink-dark-2: #cc256d;
  --color-error-border: #7a2539;
  --color-error-bg: #2a1824;
  --color-error-text: #ff3b5c;
  --color-success-border: #077d59;
  --color-success-bg: #0b2f2c;
  --color-success-text: #00ffa3;
  --color-warning-border: #7a5a0f;
  --color-warning-bg: #2a2619;
  --color-warning-text: #ffb000;
  --color-info-border: #077282;
  --color-info-bg: #0b2c37;
  --color-info-text: #00e5ff;
  --color-priority-border: #383477;
  --color-priority-bg: #181c34;
  --color-priority-text: #8276ea;
  --color-error-bg-active: #421c2a;
  --color-error-bg-hover: #361a27;
}
@media (prefers-color-scheme: light) {
  :root[data-theme*="auto"] {
    --color-body: #eef2f7;
    --color-box-body: #ffffff;
    --color-box-header: #e2e8f0;
    --color-box-body-highlight: #f0f4f8;
    --color-card: #ffffff;
    --color-menu: #ffffff;
    --color-nav-bg: #e2e8f0;
    --color-input-background: #d6dee8;
    --color-code-bg: #d6dee8;
    --color-button: #d6dee8;
    --color-input-toggle-background: #bec6d0;
    --color-text: #0b1220;
    --color-text-dark: #0b1220;
    --color-text-light: #232d3c;
    --color-text-light-1: #3b4858;
    --color-text-light-2: #3b4858;
    --color-text-light-3: #7a8699;
    --color-hover: #0069781a;
    --color-active: #00697829;
    --color-hover-opaque: #d6e4ea;
    --color-markup-code-block: #0b122012;
    --color-markup-code-inline: #0b122024;
    --color-markup-table-row: #0b12200d;
    --color-label-bg: #3b48584c;
    --color-label-hover-bg: #3b48589e;
    --color-label-active-bg: #3b4858ff;
    --color-secondary: #d8d9db;
    --color-secondary-dark-1: #cccdd0;
    --color-secondary-dark-2: #bfc1c5;
    --color-secondary-dark-3: #afb1b6;
    --color-secondary-dark-4: #96999f;
    --color-secondary-dark-5: #555a63;
    --color-secondary-dark-6: #484e58;
    --color-secondary-dark-7: #3c424d;
    --color-secondary-dark-8: #303642;
    --color-secondary-dark-9: #282e3a;
    --color-secondary-dark-10: #202633;
    --color-secondary-dark-11: #19202d;
    --color-secondary-dark-12: #131a27;
    --color-secondary-dark-13: #0f1624;
    --color-secondary-light-1: #dedfe0;
    --color-secondary-light-2: #e4e4e6;
    --color-secondary-light-3: #eaeaeb;
    --color-secondary-light-4: #eff0f1;
    --color-secondary-alpha-10: #d8d9db1a;
    --color-secondary-alpha-20: #d8d9db33;
    --color-secondary-alpha-30: #d8d9db4c;
    --color-secondary-alpha-40: #d8d9db66;
    --color-secondary-alpha-50: #d8d9db80;
    --color-secondary-alpha-60: #d8d9db99;
    --color-secondary-alpha-70: #d8d9dbb2;
    --color-secondary-alpha-80: #d8d9dbcc;
    --color-secondary-alpha-90: #d8d9dbe6;
  }
  :root[data-theme*="auto"]:not([data-theme*="opia"]) {
    --color-primary: #006978;
    --color-primary-dark-1: #016271;
    --color-primary-dark-2: #025b6a;
    --color-primary-dark-3: #035463;
    --color-primary-dark-4: #044d5c;
    --color-primary-dark-5: #054250;
    --color-primary-dark-6: #082c3a;
    --color-primary-dark-7: #0a1927;
    --color-primary-light-1: #1a7886;
    --color-primary-light-2: #338793;
    --color-primary-light-3: #4c96a0;
    --color-primary-light-4: #66a5ae;
    --color-primary-light-5: #99c3c9;
    --color-primary-light-6: #cce1e4;
    --color-primary-light-7: #f2f8f8;
    --color-primary-alpha-10: #0069781a;
    --color-primary-alpha-20: #00697833;
    --color-primary-alpha-30: #0069784c;
    --color-primary-alpha-40: #00697866;
    --color-primary-alpha-50: #00697880;
    --color-primary-alpha-60: #00697899;
    --color-primary-alpha-70: #006978b2;
    --color-primary-alpha-80: #006978cc;
    --color-primary-alpha-90: #006978e6;
    --color-primary-contrast: #ffffff;
    --color-red: #d62a48;
    --color-red-light: #da3f5a;
    --color-red-dark-1: #c12641;
    --color-red-dark-2: #ab223a;
    --color-orange: #b07700;
    --color-orange-light: #b8851a;
    --color-orange-dark-1: #9e6b00;
    --color-orange-dark-2: #8d5f00;
    --color-yellow: #b07700;
    --color-yellow-light: #b8851a;
    --color-yellow-dark-1: #9e6b00;
    --color-yellow-dark-2: #8d5f00;
    --color-green: #00a86b;
    --color-green-light: #1ab17a;
    --color-green-dark-1: #009760;
    --color-green-dark-2: #008656;
    --color-teal: #006978;
    --color-teal-light: #1a7886;
    --color-teal-dark-1: #005e6c;
    --color-teal-dark-2: #005460;
    --color-blue: #006978;
    --color-blue-light: #1a7886;
    --color-blue-dark-1: #005e6c;
    --color-blue-dark-2: #005460;
    --color-violet: #6c5ce7;
    --color-violet-light: #7b6ce9;
    --color-violet-dark-1: #6153d0;
    --color-violet-dark-2: #564ab9;
    --color-purple: #6c5ce7;
    --color-purple-light: #7b6ce9;
    --color-purple-dark-1: #6153d0;
    --color-purple-dark-2: #564ab9;
    --color-pink: #c41e74;
    --color-pink-light: #ca3482;
    --color-pink-dark-1: #b01b68;
    --color-pink-dark-2: #9d185d;
    --color-error-border: #ed9fad;
    --color-error-bg: #fae5e9;
    --color-error-text: #c62845;
    --color-success-border: #8cd8bc;
    --color-success-bg: #e0f5ed;
    --color-success-text: #037b54;
    --color-warning-border: #dbc28c;
    --color-warning-bg: #f6efe0;
    --color-warning-text: #8f6306;
    --color-info-border: #8cbcc2;
    --color-info-bg: #e0edef;
    --color-info-text: #006978;
    --color-priority-border: #bdb6f4;
    --color-priority-bg: #edebfc;
    --color-priority-text: #6456d7;
    --color-error-bg-active: #f6d0d7;
    --color-error-bg-hover: #f8dbe0;
  }
}
@media (prefers-color-scheme: dark) {
  :root[data-theme*="auto"] {
    --color-body: #070a10;
    --color-box-body: #0d131c;
    --color-box-header: #141c2a;
    --color-box-body-highlight: #101823;
    --color-card: #1a2334;
    --color-menu: #1a2334;
    --color-nav-bg: #141c2a;
    --color-input-background: #0a0e15;
    --color-code-bg: #0a0e15;
    --color-button: #0a0e15;
    --color-input-toggle-background: #242930;
    --color-text: #e4ecf5;
    --color-text-dark: #e4ecf5;
    --color-text-light: #b7c2d1;
    --color-text-light-1: #8a99ad;
    --color-text-light-2: #8a99ad;
    --color-text-light-3: #586575;
    --color-hover: #00e5ff1a;
    --color-active: #00e5ff29;
    --color-hover-opaque: #062028;
    --color-markup-code-block: #e4ecf512;
    --color-markup-code-inline: #e4ecf524;
    --color-markup-table-row: #e4ecf50d;
    --color-label-bg: #8a99ad4c;
    --color-label-hover-bg: #8a99ad9e;
    --color-label-active-bg: #8a99adff;
    --color-secondary: #0a414e;
    --color-secondary-dark-1: #174b58;
    --color-secondary-dark-2: #245662;
    --color-secondary-dark-3: #36636f;
    --color-secondary-dark-4: #507883;
    --color-secondary-dark-5: #96aeb9;
    --color-secondary-dark-6: #a3b9c3;
    --color-secondary-dark-7: #b0c3cd;
    --color-secondary-dark-8: #bdcdd7;
    --color-secondary-dark-9: #c5d4de;
    --color-secondary-dark-10: #cedbe4;
    --color-secondary-dark-11: #d5e0e9;
    --color-secondary-dark-12: #dbe5ee;
    --color-secondary-dark-13: #e0e9f2;
    --color-secondary-light-1: #083742;
    --color-secondary-light-2: #072e37;
    --color-secondary-light-3: #06242b;
    --color-secondary-light-4: #041a1f;
    --color-secondary-alpha-10: #0a414e1a;
    --color-secondary-alpha-20: #0a414e33;
    --color-secondary-alpha-30: #0a414e4c;
    --color-secondary-alpha-40: #0a414e66;
    --color-secondary-alpha-50: #0a414e80;
    --color-secondary-alpha-60: #0a414e99;
    --color-secondary-alpha-70: #0a414eb2;
    --color-secondary-alpha-80: #0a414ecc;
    --color-secondary-alpha-90: #0a414ee6;
  }
  :root[data-theme*="auto"]:not([data-theme*="opia"]) {
    --color-primary: #00e5ff;
    --color-primary-dark-1: #12e6fe;
    --color-primary-dark-2: #24e6fd;
    --color-primary-dark-3: #37e7fd;
    --color-primary-dark-4: #49e7fc;
    --color-primary-dark-5: #67e8fa;
    --color-primary-dark-6: #a0eaf8;
    --color-primary-dark-7: #d2ebf6;
    --color-primary-light-1: #00cee6;
    --color-primary-light-2: #00b7cc;
    --color-primary-light-3: #00a0b2;
    --color-primary-light-4: #008999;
    --color-primary-light-5: #005c66;
    --color-primary-light-6: #002e33;
    --color-primary-light-7: #000b0d;
    --color-primary-alpha-10: #00e5ff1a;
    --color-primary-alpha-20: #00e5ff33;
    --color-primary-alpha-30: #00e5ff4c;
    --color-primary-alpha-40: #00e5ff66;
    --color-primary-alpha-50: #00e5ff80;
    --color-primary-alpha-60: #00e5ff99;
    --color-primary-alpha-70: #00e5ffb2;
    --color-primary-alpha-80: #00e5ffcc;
    --color-primary-alpha-90: #00e5ffe6;
    --color-primary-contrast: #070a10;
    --color-red: #ff3b5c;
    --color-red-light: #ff4f6c;
    --color-red-dark-1: #e63553;
    --color-red-dark-2: #cc2f4a;
    --color-orange: #ffb000;
    --color-orange-light: #ffb81a;
    --color-orange-dark-1: #e69e00;
    --color-orange-dark-2: #cc8d00;
    --color-yellow: #ffb000;
    --color-yellow-light: #ffb81a;
    --color-yellow-dark-1: #e69e00;
    --color-yellow-dark-2: #cc8d00;
    --color-green: #00ffa3;
    --color-green-light: #1affac;
    --color-green-dark-1: #00e693;
    --color-green-dark-2: #00cc82;
    --color-teal: #00e5ff;
    --color-teal-light: #1ae8ff;
    --color-teal-dark-1: #00cee6;
    --color-teal-dark-2: #00b7cc;
    --color-blue: #00e5ff;
    --color-blue-light: #1ae8ff;
    --color-blue-dark-1: #00cee6;
    --color-blue-dark-2: #00b7cc;
    --color-violet: #6c5ce7;
    --color-violet-light: #7b6ce9;
    --color-violet-dark-1: #6153d0;
    --color-violet-dark-2: #564ab9;
    --color-purple: #6c5ce7;
    --color-purple-light: #7b6ce9;
    --color-purple-dark-1: #6153d0;
    --color-purple-dark-2: #564ab9;
    --color-pink: #ff2e88;
    --color-pink-light: #ff4394;
    --color-pink-dark-1: #e6297a;
    --color-pink-dark-2: #cc256d;
    --color-error-border: #7a2539;
    --color-error-bg: #2a1824;
    --color-error-text: #ff3b5c;
    --color-success-border: #077d59;
    --color-success-bg: #0b2f2c;
    --color-success-text: #00ffa3;
    --color-warning-border: #7a5a0f;
    --color-warning-bg: #2a2619;
    --color-warning-text: #ffb000;
    --color-info-border: #077282;
    --color-info-bg: #0b2c37;
    --color-info-text: #00e5ff;
    --color-priority-border: #383477;
    --color-priority-bg: #181c34;
    --color-priority-text: #8276ea;
    --color-error-bg-active: #421c2a;
    --color-error-bg-hover: #361a27;
  }
}
:root {
  --fonts-override: "IBM Plex Sans";
  --fonts-monospace: "JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;
  --brand-font-display: "Chakra Petch", Rajdhani, sans-serif;
  --brand-tracking-ui: 0.10em;
  --brand-tracking-button: 0.08em;
  --border-radius: 2px;
  --border-radius-medium: 4px;
  --brand-ease: cubic-bezier(0.2,0.8,0.2,1);
  --brand-duration: 140ms;
}
/* Hand-written rules for web/tools/build-helmfold-theme.py. Colours come from the Helmfold theme variables the generator
   sets, so every scheme and theme name stays covered. */
html { font-variant-numeric: tabular-nums; }

h1, h2, h3, h4, h5, h6, .ui.header, .ui.menu .item, .ui.button, .ui.label, .ui.attached.header, .page-content .header {
  font-family: var(--brand-font-display), sans-serif;
}
.ui.button { text-transform: uppercase; letter-spacing: var(--brand-tracking-button); }
.ui.attached.header { text-transform: uppercase; letter-spacing: var(--brand-tracking-ui); font-weight: 600; }

/* Flat console panels: 1px hairline, no raised look. */
.ui.segment, .ui.attached.segment, .ui.card, .ui.cards > .card { box-shadow: none; }

:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 1px; }
.ui.input input:focus, .ui.form textarea:focus, .ui.form input:focus { border-color: var(--color-primary); }

@media (prefers-reduced-motion: no-preference) {
  .ui.button, .ui.menu .item, a { transition: background-color var(--brand-duration) var(--brand-ease),
    border-color var(--brand-duration) var(--brand-ease), color var(--brand-duration) var(--brand-ease); }
}

/* Signed-out landing fragment (CUSTOM_HOME_HTML). */
.ph-home { display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 4rem 1rem; text-align: center; }
.ph-home-logo { max-width: 100%; height: auto; }
.ph-home-title { margin: 0; text-transform: uppercase; letter-spacing: var(--brand-tracking-ui); }
.ph-home-lede { margin: 0 0 .5rem; max-width: 36rem; color: var(--color-text-light-1); }