@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/Inter-Variable.woff2") format("woff2");
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/JetBrainsMono-Variable.woff2") format("woff2");
}

:root {
  --paper: #ffffff;
  --wash: #f7f7f8;
  --sunk: #fbfbfc;
  --ink: #131318;
  --body: #4e4e57;
  --muted: #8b8b95;
  --line: rgba(18, 18, 23, .10);
  --line2: rgba(18, 18, 23, .16);
  --accent: #d97757;
  --accent-ink: #b0522f;
  --accent-wash: rgba(217, 119, 87, .11);
  --live: #1e845a;
  --live-wash: rgba(30, 132, 90, .10);
  --open: #4b54c6;
  --open-wash: rgba(75, 84, 198, .10);
  --stale: #946115;
  --stale-wash: rgba(148, 97, 21, .11);
  --error: #c2382c;
  --error-wash: rgba(194, 56, 44, .10);
  --idle-wash: rgba(18, 18, 23, .05);
  --shadow: 0 30px 70px -34px rgba(18, 18, 23, .40), 0 1px 3px rgba(18, 18, 23, .08);
  --card-shadow: 0 1px 2px rgba(18, 18, 23, .05);
  --ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", "SF Mono", ui-monospace, Menlo, monospace;
  --ag-claude: #c2603c; --ag-claude-bg: rgba(217, 119, 87, .14);
  --ag-codex: #0e8f6e; --ag-codex-bg: rgba(14, 143, 110, .13);
  --ag-vscode: #4b54c6; --ag-vscode-bg: rgba(75, 84, 198, .12);
  --ag-shell: #6b6b76; --ag-shell-bg: rgba(107, 107, 118, .12);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #15151a;
    --wash: #101014;
    --sunk: #191920;
    --ink: #f0f0f3;
    --body: #a9a9b4;
    --muted: #75757f;
    --line: rgba(255, 255, 255, .09);
    --line2: rgba(255, 255, 255, .16);
    --accent-ink: #f0a480;
    --accent-wash: rgba(217, 119, 87, .16);
    --live: #5fd39b;
    --live-wash: rgba(95, 211, 155, .13);
    --open: #9aa2f5;
    --open-wash: rgba(154, 162, 245, .13);
    --stale: #e0b464;
    --stale-wash: rgba(224, 180, 100, .13);
    --error: #f08b80;
    --error-wash: rgba(240, 139, 128, .13);
    --idle-wash: rgba(255, 255, 255, .06);
    --shadow: 0 30px 70px -34px rgba(0, 0, 0, .85), 0 1px 3px rgba(0, 0, 0, .5);
    --card-shadow: 0 1px 2px rgba(0, 0, 0, .30);
    --ag-claude: #e8926e; --ag-claude-bg: rgba(217, 119, 87, .18);
    --ag-codex: #5fd39b; --ag-codex-bg: rgba(95, 211, 155, .15);
    --ag-vscode: #a3aaf7; --ag-vscode-bg: rgba(154, 162, 245, .16);
    --ag-shell: #c3c3cd; --ag-shell-bg: rgba(255, 255, 255, .09);
  }
}

:root[data-theme="dark"] {
  --paper: #15151a;
  --wash: #101014;
  --sunk: #191920;
  --ink: #f0f0f3;
  --body: #a9a9b4;
  --muted: #75757f;
  --line: rgba(255, 255, 255, .09);
  --line2: rgba(255, 255, 255, .16);
  --accent-ink: #f0a480;
  --accent-wash: rgba(217, 119, 87, .16);
  --live: #5fd39b;
  --live-wash: rgba(95, 211, 155, .13);
  --open: #9aa2f5;
  --open-wash: rgba(154, 162, 245, .13);
  --stale: #e0b464;
  --stale-wash: rgba(224, 180, 100, .13);
  --error: #f08b80;
  --error-wash: rgba(240, 139, 128, .13);
  --idle-wash: rgba(255, 255, 255, .06);
  --shadow: 0 30px 70px -34px rgba(0, 0, 0, .85), 0 1px 3px rgba(0, 0, 0, .5);
  --card-shadow: 0 1px 2px rgba(0, 0, 0, .30);
  --ag-claude: #e8926e; --ag-claude-bg: rgba(217, 119, 87, .18);
  --ag-codex: #5fd39b; --ag-codex-bg: rgba(95, 211, 155, .15);
  --ag-vscode: #a3aaf7; --ag-vscode-bg: rgba(154, 162, 245, .16);
  --ag-shell: #c3c3cd; --ag-shell-bg: rgba(255, 255, 255, .09);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--wash);
  color: var(--ink);
  font: 400 14px/1.5 var(--ui);
  -webkit-font-smoothing: antialiased;
}