/* The Bridge AI look, for boldbridge.ai and the admin view: the app's own fonts (Geist and
   JetBrains Mono, OFL, shipped here as in the app, never fetched from Google), its color tokens in
   light and dark (src/styles.css in the public repo), its corners and shadows. Change them with the
   app's so the three stay one product. Pages served from /, with these files at /brand/. */
@font-face { font-family: 'Geist Variable'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/brand/fonts/geist-latin-wght-normal.woff2) format('woff2-variations'); 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: 'Geist Variable'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(/brand/fonts/geist-latin-ext-wght-normal.woff2) format('woff2-variations'); 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: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/brand/fonts/jetbrains-mono-latin-wght-normal.woff2) format('woff2-variations'); }

:root {
  --bg: #eef0f3;
  --pane: #ffffff;
  --pane-2: #f6f7f9;
  --pane-3: #eceef2;
  --line: rgba(16, 24, 40, .08);
  --line-2: rgba(16, 24, 40, .14);
  --ink: #12151b;
  --ink-2: #4a5263;
  --ink-3: #8a92a3;
  --accent: #2f6fe0;
  --accent-soft: rgba(47, 111, 224, .1);
  --on-accent: #ffffff;
  --working: #7c5fe6;
  --good: #1f9d55;
  --warning: #c98500;
  --critical: #d64550;
  --term-bg: #1b1e24;
  --term-fg: #e2e5eb;
  --shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .04);
  --shadow-lg: 0 12px 32px rgba(16, 24, 40, .12);
  --r: 14px;
  --r-sm: 9px;
  --font: "Geist Variable", Geist, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono Variable", "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  /* The window frame (top bar, sidebar): the page's own color unless a theme tints it. */
  --chrome: var(--bg); --chrome-ink: var(--ink); --chrome-ink-2: var(--ink-2); --chrome-line: var(--line); --chrome-hover: rgba(16, 24, 40, .06);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1115; --pane: #16191f; --pane-2: #1c2027; --pane-3: #242932;
    --line: rgba(255, 255, 255, .065); --line-2: rgba(255, 255, 255, .12);
    --ink: #e9ebf0; --ink-2: #a9b0bf; --ink-3: #6f7788;
    --accent: #4e82ef; --accent-soft: rgba(78, 130, 239, .14);
    --working: #a78bfa; --good: #3fb950; --warning: #e3b341; --critical: #f0616d;
    --term-bg: #121418;
    --shadow: none; --shadow-lg: 0 16px 40px rgba(0, 0, 0, .5);
    --chrome-hover: rgba(255, 255, 255, .06);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0f1115; --pane: #16191f; --pane-2: #1c2027; --pane-3: #242932;
  --line: rgba(255, 255, 255, .065); --line-2: rgba(255, 255, 255, .12);
  --ink: #e9ebf0; --ink-2: #a9b0bf; --ink-3: #6f7788;
  --accent: #4e82ef; --accent-soft: rgba(78, 130, 239, .14);
  --working: #a78bfa; --good: #3fb950; --warning: #e3b341; --critical: #f0616d;
  --term-bg: #121418;
  --shadow: none; --shadow-lg: 0 16px 40px rgba(0, 0, 0, .5);
  --chrome-hover: rgba(255, 255, 255, .06);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 14px/1.5 var(--font); letter-spacing: -.003em; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
code, pre, kbd, .mono { font-family: var(--font-mono); }
code { font-size: .92em; }
kbd { font: 11px var(--font-mono); padding: 1px 5px; border-radius: 4px; background: var(--pane-3); border: 1px solid var(--line-2); color: var(--ink-2); }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }

/* Buttons, as the app's. */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 34px; padding: 0 14px; border-radius: var(--r-sm); border: 1px solid var(--line-2); background: var(--pane); color: var(--ink); font: 550 13.5px var(--font); cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn:hover { background: var(--pane-2); text-decoration: none; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn.primary:hover { filter: brightness(1.06); background: var(--accent); }
.btn.big { height: 44px; padding: 0 20px; font-size: 15px; border-radius: 11px; }
.btn:disabled { opacity: .55; cursor: default; }
.ghost-btn { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--line-2); background: transparent; color: var(--ink-2); font: 500 12.5px var(--font); cursor: pointer; }
.ghost-btn:hover { background: var(--chrome-hover); color: var(--ink); }
.pane { background: var(--pane); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
.muted { color: var(--ink-3); }
.icon { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }