/* Sophia: the agreed BuildHub composition in neutral blacks and brand blue. */
@font-face { font-family: Sora; src: url("../assets/fonts/sora-regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: Sora; src: url("../assets/fonts/sora-medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: Sora; src: url("../assets/fonts/sora-semibold.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: Sora; src: url("../assets/fonts/sora-bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
:root {
  color-scheme: dark;
  --bg: #030303;
  --panel: #111111;
  --ink: #f5f7fa;
  --muted: #a3a3ad;
  --brand-blue: #0075d5;
  --blue-light: #75c7ff;
  --line: rgb(var(--contrast-rgb) / 8%);
  --contrast-rgb: 255 255 255;
  --canvas: #080808;
  --menu: #171717;
  --composer: #070707;
  --chip: #1b1b1b;
  --suggestion: #080808;
  --suggestion-ink: #d4d4db;
  --user-message: #181818;
  --code: #161616;
  --table-line: #363636;
  --placeholder: #909097;
  --scrollbar: #353535;
  --brand-hover: #0989ec;
  --orb-core: #030b12;
  --accent-rgb: 117 199 255;
  --font-body: Sora, "Segoe UI", system-ui, sans-serif;
  --bs-body-font-family: var(--font-body);
  --bs-body-color: var(--ink);
  --bs-body-bg: var(--bg);
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #ffffff;
  --panel: #f1f4f8;
  --ink: #172536;
  --muted: #526174;
  --brand-blue: #006ac2;
  --blue-light: #005a9e;
  --contrast-rgb: 23 37 54;
  --line: rgb(var(--contrast-rgb) / 18%);
  --canvas: #e8edf3;
  --menu: #ffffff;
  --composer: #ffffff;
  --chip: #e9eff6;
  --suggestion: #ffffff;
  --suggestion-ink: #25374a;
  --user-message: #e8f1fb;
  --code: #edf2f7;
  --table-line: #a4b1c1;
  --placeholder: #596779;
  --scrollbar: #8393a7;
  --brand-hover: #005ca8;
  --orb-core: #e6f3ff;
  --accent-rgb: 0 90 158;
}
*, *::before, *::after { box-sizing: border-box; }
html { height: 100%; -webkit-text-size-adjust: 100%; }
body { display: flow-root; margin: 0; min-width: 320px; height: 100%; background: var(--canvas); color: var(--ink); font: 400 14px/1.65 var(--font-body); overflow: hidden; }
button, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
button:not(:disabled), summary { cursor: pointer; }
button:disabled { cursor: default; }
[hidden] { display: none !important; }
img, svg { max-width: 100%; }
svg { width: 20px; height: 20px; flex-shrink: 0; }
:focus-visible { outline: 2px solid var(--blue-light); outline-offset: 4px; }
.skip-link { position: fixed; z-index: 100; top: 8px; left: 16px; transform: translateY(-160%); padding: 10px 14px; border-radius: 8px; background: var(--ink); color: var(--bg); }
.skip-link:focus { transform: none; }
.app { width: min(1600px, calc(100% - 32px)); height: calc(100dvh - 32px); margin: 16px auto; }
@media (max-width: 700px) {
  body { background: var(--bg); }
  .app { width: 100%; height: var(--viewport-height, 100dvh); margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}