/* Agent Desk tokens. One visual language shared with the Ridley personal desk:
   Bot Doctor's restrained terminal feel, IBM Plex type, thin rules.
   Appearance is a per-user setting (Settings > Appearance: Light, Dark or System). It is saved on the
   signed-in account and resolved to html[data-theme="light"|"dark"] before paint (theme-boot.js, shell.js).
   It changes only that person's view. Both sets use the same token names; components only read tokens.
   Fonts are self-hosted IBM Plex (OFL, see assets/fonts). */
@font-face { font-family: "Plex Sans"; src: url("assets/fonts/plex-sans-400.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Plex Sans"; src: url("assets/fonts/plex-sans-500.ttf") format("truetype"); font-weight: 500 700; font-display: swap; }
@font-face { font-family: "Plex Mono"; src: url("assets/fonts/plex-mono-400.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Plex Mono"; src: url("assets/fonts/plex-mono-500.ttf") format("truetype"); font-weight: 500 700; font-display: swap; }

/* ── Light: warm white (the default and the System fallback) ── */
:root, :root[data-theme="light"] {
  --bg: #faf9f6; --panel: #ffffff; --surface: #f0efea; --hover: #efeee9;
  --line: #dcd8cd; --line-strong: #c3beb2; --panel-line: #dcd8cd;
  --text: #24231f; --muted: #5c5a51; --soft: #6c695f;
  --sidebar: #f5f4ef; --sidebar-text: #24231f; --sidebar-muted: #5c5a51; --sidebar-hover: #ebe7dc; --sidebar-active: #e3dfd3; --sidebar-line: #dcd8cd;
  --primary: #292823; --primary-ink: #faf8f1; --primary-hover: #444138;
  --accent: #292823; --accent-soft: #e8e4d9; --focus: #5c5a51; --field-line: #8f8a7e;
  --ok: #2f6b45; --warn: #7a5200; --bad: #9c3528;
  --mark-ink: #c2412c; --brand-cross: #1e3a6e;
  --shadow: 0 12px 32px rgba(36, 35, 31, .14);
  --sans: "Plex Sans", "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Plex Mono", "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --display: var(--sans); --label-font: var(--sans); --num-font: var(--sans);
  --heading-weight: 500; --heading-track: -.03em; --h1: 1.75rem;
  --radius: 8px; --radius-lg: 12px; --btn-radius: 8px; --mark-radius: 8px;
  --oc-accent: var(--desk-accent, #1e3a6e); --oc-accent-fill: var(--desk-accent, #1e3a6e); --oc-accent-ink: #ffffff;
  --oc-accent-soft: color-mix(in srgb, var(--oc-accent) 10%, var(--bg));
  color-scheme: light;
}

/* ── Dark: neutral graphite. Derived from the Ridley desk's live dark palette (round 3 values). ──
   The desk accent is split for contrast: --oc-accent (dots, links, glyphs) is lifted toward white so it reads
   on #111 (BotDoctor #1e3a6e alone is 1.7:1); --oc-accent-fill keeps the brand hue for filled shapes with white ink. */
:root[data-theme="dark"] {
  --bg: #111111; --panel: #191919; --surface: #1f1f1e; --hover: #232322;
  --line: #2a2a29; --line-strong: #3d3d3d; --panel-line: #2a2a29;
  --text: #e8e6e1; --muted: #aaa8a2; --soft: #8a8882;
  --sidebar: #141414; --sidebar-text: #e8e6e1; --sidebar-muted: #aaa8a2; --sidebar-hover: #1f1f1e; --sidebar-active: #292929; --sidebar-line: #2a2a29;
  --primary: #e5e2d9; --primary-ink: #151515; --primary-hover: #f4f2eb;
  --accent: #e5e2d9; --accent-soft: #292929; --focus: #aaa8a2; --field-line: #6a6862;
  --ok: #7cc39a; --warn: #e0b86f; --bad: #ffb4a5;
  --mark-ink: #ff8a73; --brand-cross: #7d9bd3;
  --shadow: 0 12px 32px rgba(0, 0, 0, .5);
  --oc-accent: color-mix(in srgb, var(--desk-accent, #1e3a6e) 45%, #ffffff); --oc-accent-fill: var(--desk-accent, #2a4a85); --oc-accent-ink: #ffffff;
  --oc-accent-soft: color-mix(in srgb, var(--desk-accent, #1e3a6e) 30%, var(--bg));
  color-scheme: dark;
}
/* A saved desk color is set inline as light-theme tints; in Dark the soft and line tints are recomputed against the dark page. */
:root[data-theme="dark"] .desk-accented {
  --desk-accent-soft: color-mix(in srgb, var(--desk-accent) 26%, #111111) !important;
  --desk-accent-line: color-mix(in srgb, var(--desk-accent) 55%, #ffffff) !important;
  --accent: color-mix(in srgb, var(--desk-accent) 45%, #ffffff); --focus: color-mix(in srgb, var(--desk-accent) 45%, #ffffff);
}
