/* Shared foundations for Desk and Scribe. Component themes can override semantic values. */
:root {
  --desk-type-body: 13px;
  --desk-type-label: 12px;
  --desk-type-meta: 11px;
  --desk-type-heading: 26px;
  --desk-text-secondary: #b0b9b5;
  --desk-error: #edaa9c;
  --desk-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  --desk-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --desk-space-1: 4px;
  --desk-space-2: 8px;
  --desk-space-3: 12px;
  --desk-space-4: 16px;
  --desk-space-5: 20px;
  --desk-space-6: 24px;
  --desk-radius-xs: 4px;
  --desk-radius-control: 6px;
  --desk-radius-md: 8px;
  --desk-radius-panel: 12px;
  --desk-radius-card: 14px;
  --desk-radius-pill: 999px;
  --desk-focus-width: 2px;
  --desk-focus-offset: 2px;
  --desk-focus-inset: 3px;
  --desk-focus-ring: #b9e1d4;
  --desk-disabled-opacity: .5;
  --desk-duration-fast: .15s;
  --desk-duration-theme: .35s;
  --desk-surface: #0b0d0c;
  --desk-footer-surface: #101113;
  --desk-footer-border: #ffffff20;
  --desk-control-surface: #ffffff08;
  --desk-control-hover: #ffffff12;
  --desk-control-border: #ffffff30;
  --desk-control-text: #d5e3db;
  --desk-input-surface: #111a16;
  --desk-input-border: #ffffff38;
  --desk-input-text: #e4eee8;
  --scribe-paper: #f1ede4;
  --scribe-dim: #a59e8f;
  --scribe-faint: #6f695e;
  --scribe-line: #2a2620;
  --scribe-raised: #15130f;
  --scribe-background: #0d0c0a;
  --scribe-accent: #e7b866;
  --scribe-positive: #8fdc9d;
  --scribe-negative: #e39a86;
}

/* Recompute derived colors at each project hue boundary, not just at :root. */
:root, :where(.desk, .desk li, .card, .tab) {
  --desk-project-background: hsl(var(--hue, 168) 36% 7%);
  --desk-project-raised: hsl(var(--hue, 168) 30% 11%);
  --desk-project-accent: hsl(var(--hue, 168) 58% 71%);
  --desk-project-border: hsl(var(--hue, 168) 22% 22%);
  --desk-project-muted: hsl(var(--hue, 168) 10% 71%);
  --desk-project-muted-soft: hsl(var(--hue, 168) 10% 66%);
  --desk-project-muted-low: hsl(var(--hue, 168) 10% 60%);
  --desk-project-selection: hsl(var(--hue, 168) 30% 16%);
  --desk-project-hover: hsl(calc(var(--hue, 168) + 32) 35.3% 13.3%);
}
