/* Self-hosted so the interface does not inherit whatever Arabic face the
   device happens to ship. See assets/fonts/README.md. */
/* Arabic inside code (a folder name in a path) fell through to the system
   monospace font, which draws Arabic letters unjoined. This alias covers only
   the Arabic range and reuses the file already loaded for the interface, so
   Latin code keeps its monospace face and Arabic stays readable. */
@font-face {
  font-family: "Sadeed Code Arabic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-400-arabic.woff2?v=6010e7fd0dce5d52") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFF, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EEFF;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-400-arabic.woff2?v=6010e7fd0dce5d52") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFF, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EEFF;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-400-latin.woff2?v=9ed8dcb02e6c7246") 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 Arabic";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-500-arabic.woff2?v=90aef64fea9794f2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFF, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EEFF;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-500-latin.woff2?v=be6a3b2e37f3ad67") 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 Arabic";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-600-arabic.woff2?v=16734a5adb27b0f3") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFF, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EEFF;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-600-latin.woff2?v=63f4757271e403f7") 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 Arabic";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-700-arabic.woff2?v=04c730b4292731cc") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFF, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EEFF;
}
@font-face {
  font-family: "IBM Plex Sans Arabic";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/ibm-plex-sans-arabic-700-latin.woff2?v=ae2d59f91ecf9f7e") 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: "Reem Kufi";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/reem-kufi-700-arabic.woff2?v=9eccd028ae6abe71") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+FB50-FDFF, U+FE70-FEFF, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EEFF;
}
@font-face {
  font-family: "Reem Kufi";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/reem-kufi-700-latin.woff2?v=99554d5210754377") 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;
}

:root {
  color-scheme: dark;
  --font-ui: "IBM Plex Sans Arabic", "Noto Sans Arabic", sans-serif;
  --font-mono: "IBM Plex Mono", "Sadeed Code Arabic", ui-monospace, monospace;
  /* Display face: the one deliberately Arabic gesture in a technical interface. */
  --font-display: "Reem Kufi", "IBM Plex Sans Arabic", sans-serif;
  --mineral-1000: #061517;
  /* A code block sits a step below the page so it reads as a quoted surface.
     It has to be a token: a literal dark value stayed dark in the light
     appearance and punched a black hole through every answer with code. */
  --code-surface: #041012;
  --mineral-950: #081b1e;
  --mineral-900: #0b2023;
  --mineral-850: #0f292d;
  --mineral-800: #123237;
  --mineral-750: #1a303a;
  --mineral-700: #243d46;
  --mineral-600: #36535b;
  --mineral-400: #8fa4a6;
  --mineral-300: #9eb0b2;
  --limestone-100: #f2f7f6;
  --limestone-200: #dce9e6;
  --limestone-300: #b7b4ab;
  --emerald-300: #96e4cb;
  --emerald-400: #67d5b4;
  --emerald-500: #18ad82;
  --emerald-600: #0e7d62;
  --emerald-900: #0d3f32;
  --emerald-wash: rgb(53 214 163 / 11%);
  --emerald-glow: rgb(53 214 163 / 26%);
  --gold-300: #e6cf91;
  --gold-400: #c9aa63;
  --gold-wash: rgb(201 170 99 / 10%);
  --gold-border: rgb(201 170 99 / 30%);
  --cyan-400: #65cbd7;
  --green-400: #70d795;
  --amber-400: #e5b665;
  --amber-wash: rgb(229 182 101 / 10%);
  --amber-border: rgb(229 182 101 / 28%);
  --red-400: #ff6673;
  --red-wash: rgb(225 113 118 / 15%);
  --surface-glass-strong: rgb(10 23 32 / 82%);
  --surface-glass-soft: rgb(10 23 32 / 74%);
  --mask-ink: rgb(0 0 0 / 35%);
  --highlight-soft: rgb(255 255 255 / 30%);
  --seal-border: rgb(4 11 16 / 36%);
  --border-soft: rgb(217 213 202 / 7%);
  --border-mid: rgb(217 213 202 / 12%);
  --border-strong: rgb(217 213 202 / 19%);
  --overlay: rgb(2 7 10 / 78%);
  --touch-target: 2.75rem;
  --native-title-size: 1.125rem;
  --native-body-line-height: 1.625;
  --native-composer-radius: 1.375rem;
  --input-text-min: 16px;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --text-xs: 0.8125rem;
  --text-sm: 0.88rem;
  --text-md: 1rem;
  --text-lg: 1.16rem;
  --text-xl: 1.52rem;
  --text-2xl: clamp(2rem, 3.6vw, 3.4rem);
  --radius-sm: 0.55rem;
  --radius-md: 0.85rem;
  --radius-lg: 1.15rem;
  --radius-xl: 1.6rem;
  --radius-pill: 999px;
  --shadow-panel: 0 18px 50px rgb(0 0 0 / 24%);
  --shadow-float: 0 30px 80px rgb(0 0 0 / 48%);
  --shadow-soft: 0 16px 34px rgb(0 0 0 / 22%);
  --shadow-inset: inset 0 1px 0 rgb(255 255 255 / 4%), inset 0 -1px 0 rgb(255 255 255 / 2%);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 160ms;
  --duration-base: 200ms;
  --content-width: 54rem;
  --message-width: 47rem;
  --header-height: 5rem;
  --nav-height: 3.25rem;
  --icon-size: 1.25rem;
  --z-backdrop: 30;
  --z-panel: 32;
  --z-toast: 50;
  --conversation-user-surface: color-mix(in srgb, var(--emerald-wash), var(--mineral-900));
  --conversation-user-border: color-mix(in srgb, var(--emerald-600) 45%, var(--border-mid));
  --conversation-code-surface: var(--code-surface);
  --conversation-line-height: 1.9;
  --conversation-turn-gap: var(--space-4);
  --conversation-status-size: 0.6rem;
  --conversation-status-duration: 1.8s;
  --conversation-shadow: 0 8px 28px rgb(0 0 0 / 12%);
  --conversation-notice-width: 29rem;
  --conversation-detail-height: 9rem;
}

:root[data-theme="light"] {
  --conversation-shadow: 0 8px 28px rgb(21 45 35 / 7%);
}