/* Remmebr — premium black/white design tokens (iPad-first) */
:root {
  --font: "Inter", "SF Pro Text", system-ui, -apple-system, sans-serif;
  --font-display: "Inter", "SF Pro Display", system-ui, -apple-system, sans-serif;
  --mono: "SF Mono", "Fira Code", ui-monospace, Consolas, monospace;

  --r: 10px;
  --r2: 14px;
  --r3: 18px;

  /* Space scale (8px grid) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* Type scale */
  --fs-meta: 12px;
  --fs-body: 15px;
  --fs-title: 20px;
  --fs-display: 28px;
  --lh-tight: 1.25;
  --lh-body: 1.55;

  /* Accent = ink (not blue chrome) */
  --ac: #111111;

  /* Single source of truth for the sidebar gutter. Anything docked or pinned
     against the sidebar must offset by this, never a hard-coded px value. */
  --side-w: 220px;
  --side-w-collapsed: 48px;
}

@media (min-width: 768px) {
  :root {
    --side-w: 232px;
  }
}

[data-theme="light"] {
  --bg: #fbfbfa;
  --bg2: #f3f3f1;
  --cd: #ffffff;
  --sf: #ffffff;
  --si: #f6f6f4;
  --ch: #f0f0ee;
  --bd: rgba(0, 0, 0, 0.08);
  --bm: rgba(0, 0, 0, 0.12);
  --bs: rgba(0, 0, 0, 0.16);
  --tx: #111111;
  --t2: #3d3d3d;
  /* Every tint here clears 4.5:1 on both --bg and white, so the quiet end of
     the scale is still readable at 12px. */
  --t3: #5c5c5c;
  --t4: #757575;
  /* Clears 4.5:1 at 11.5px on the paper background, which #2d8659 did not. */
  --ok: #27754e;
  --wn: #806400;
  --ng: #b42318;
  --ib: #f5f5f3;
  --ol: rgba(0, 0, 0, 0.28);
  --sb: rgba(0, 0, 0, 0.14);
  --sh: rgba(0, 0, 0, 0.035);
  --sa: rgba(0, 0, 0, 0.06);
  --tg: #efefed;
  --tt: #6b6b6b;
  --cb: #1a1a1a;
  --ct: #d4d4d4;
  --tp: #111;
  --tc: #fff;
  --as: rgba(0, 0, 0, 0.06);
  --he: #ebebe9;
  --shadow: none;
  --shadow2: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow3: 0 8px 28px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] {
  --bg: #0e0e0e;
  --bg2: #161616;
  --cd: #161616;
  --sf: #161616;
  --si: #121212;
  --ch: #1e1e1e;
  --bd: rgba(255, 255, 255, 0.08);
  --bm: rgba(255, 255, 255, 0.12);
  --bs: rgba(255, 255, 255, 0.16);
  --tx: #f2f2f2;
  --t2: #b8b8b8;
  --t3: #949494;
  --t4: #7d7d7d;
  --ok: #4caf7d;
  --wn: #d4a53a;
  --ng: #e05a4f;
  --ib: #1a1a1a;
  --ol: rgba(0, 0, 0, 0.55);
  --sb: rgba(255, 255, 255, 0.14);
  --sh: rgba(255, 255, 255, 0.04);
  --sa: rgba(255, 255, 255, 0.06);
  --tg: #222;
  --tt: #888;
  --cb: #0a0a0a;
  --ct: #d4d4d4;
  --tp: #eee;
  --tc: #111;
  --as: rgba(255, 255, 255, 0.08);
  --he: #222;
  --shadow: none;
  --shadow2: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow3: 0 10px 32px rgba(0, 0, 0, 0.45);
  --ac: #f2f2f2;
}