/* Lead Desk tokens as CSS variables, written from ds/leaddesk/tokens.json (the system serves no tokens.css) */
:root, [data-theme="light"] {
  --surface-000: #fffdf8; --surface-100: #fef5e7; --surface-200: #ebe6d5; --surface-300: #e1decd;
  --ink: #2a2622; --ink-muted: #6b6258; --line: #e1decd; --line-strong: #8c8275;
  --brand: #bf503d; --brand-hover: #9a3e2e; --brand-text: #9a3e2e; --brand-tint: #f8e3dd; --on-brand: #ffffff;
  --panepal: #1b4281; --panepal-tint: #e3eaf5; --hlc: #38512f; --hlc-tint: #e4ebdd; --bulb: #fbdb65;
  --info: #1f6f78; --info-tint: #ddeef0; --warning: #8a5a00; --warning-tint: #fcefc2;
  --success: #2e6b3a; --success-tint: #e2eedc; --danger: #b42318; --danger-tint: #fbe4e1; --neutral-tint: #ebe6d5;
  --shadow-1: 0 1px 2px rgba(42,38,34,0.08); --shadow-2: 0 4px 12px rgba(42,38,34,0.12);
}
[data-theme="dark"] {
  --surface-000: #24201b; --surface-100: #1a1714; --surface-200: #2e2923; --surface-300: #3a342d;
  --ink: #f3ece3; --ink-muted: #b5aa9c; --line: #3a342d; --line-strong: #7a7064;
  --brand: #bf503d; --brand-hover: #a84535; --brand-text: #ee8b76; --brand-tint: #3b231d; --on-brand: #ffffff;
  --panepal: #8fb3e8; --panepal-tint: #1e2a40; --hlc: #9cc08a; --hlc-tint: #22301d; --bulb: #fbdb65;
  --info: #7fc8cf; --info-tint: #173236; --warning: #f2c94c; --warning-tint: #3a2f12;
  --success: #7cc48a; --success-tint: #1f3324; --danger: #f08a7e; --danger-tint: #3d1d1a; --neutral-tint: #2e2923;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.4); --shadow-2: 0 4px 12px rgba(0,0,0,0.5);
}
:root {
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px; --space-8: 32px;
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px; --radius-pill: 999px;
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Space Mono", ui-monospace, Menlo, monospace;
}

/* Shared app shell for the three screens */
.app { display: flex; flex-wrap: wrap; align-items: stretch; min-height: 100vh; background: var(--surface-100); color: var(--ink); font-family: var(--font-sans); font-size: 14px; line-height: 20px; }
.side { flex: 1 1 220px; display: flex; flex-direction: column; gap: var(--space-6); padding: var(--space-6) var(--space-4); background: var(--surface-200); box-sizing: border-box; }
.main { flex: 999 1 560px; min-width: 0; box-sizing: border-box; }
.nav-link { display: flex; align-items: center; gap: var(--space-3); min-height: 44px; padding: 0 var(--space-3); border-radius: var(--radius-md); color: var(--ink); text-decoration: none; font-weight: 600; }
.nav-link:hover { background: var(--surface-300); }
.nav-link[aria-current="page"] { background: var(--brand-tint); color: var(--brand-text); }
.nav-link svg { width: 20px; height: 20px; flex: none; }
.nav-count { margin-left: auto; min-width: 24px; padding: 0 var(--space-2); border-radius: var(--radius-pill); background: var(--brand); color: var(--on-brand); font-size: 12px; line-height: 20px; text-align: center; }
.eyebrow { margin: 0; font: 700 11px/16px var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
.chip { min-height: 36px; padding: 0 var(--space-3); border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: var(--surface-000); color: var(--ink); font: 600 13px/20px var(--font-sans); cursor: pointer; }
.chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--surface-100); }
.card { background: var(--surface-000); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-1); }
.field { width: 100%; box-sizing: border-box; min-height: 44px; padding: var(--space-2) var(--space-3); border: 1px solid var(--line-strong); border-radius: var(--radius-md); background: var(--surface-000); color: var(--ink); font: 400 14px/20px var(--font-sans); }
.link { color: var(--brand-text); font-weight: 600; }
.chip:focus-visible, .nav-link:focus-visible, .field:focus-visible, .link:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }