/**
 * Design tokens, transcribed from the handoff's token table.
 *
 * Every value here is fixed by the design. The prototype carried them as inline
 * styles on each element; they live here once so a screen never invents one.
 *
 * On the ink scale: ink and ink-2 and ink-3 clear 4.5:1 on white. ink-4, ink-5
 * and ink-6 do not -- see "Known design conflicts" in README.md. They are
 * reproduced as designed and the fix is a change to these three lines.
 */

:root {
  /* Surfaces */
  --canvas: #e7e0d5;
  --surface: #fbf8f3;
  --surface-raised: #f5f0e8;
  --surface-sunken: #efe9df;
  --card: #ffffff;
  --card-alt: #fdfbf8;
  --card-inset: #faf7f2;
  --chip-track: #f1ebe1;

  /* Ink */
  --ink: #241f1a;
  --ink-2: #3d3630;
  --ink-3: #6b6259;
  --ink-4: #8a7f72;
  --ink-5: #9a8f81;
  --ink-6: #b0a698;

  /* Lines. The design uses four near-identical hairlines inside cards; they
   * are kept distinct because the mock distinguishes them by context. */
  --line: #e2dad0;
  --line-2: #e6ded4;
  --line-hair: #efe8de;
  --line-hair-header: #eee7dd;
  --line-hair-legend: #f0eae1;
  --line-hair-row: #f2ece3;
  --line-strong: #ddd4c8;

  --control: #cfc5b8;
  --control-2: #c9bfb1;

  /* One accent. It marks now, and primary action, and nothing else. */
  --accent: #5b4bc4;
  --accent-hover: #4a3bb0;
  --accent-soft: #eeebfb;
  --accent-border: #d8d2f5;

  /* Item kinds. Drives the left bar colour and nothing else. */
  --bar-event: #8a7f72;
  --bar-focus: #5b4bc4;
  --bar-task: #c9bfb1;
  --bar-personal: #a8b39a;

  /* Type */
  --font: Figtree, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Radii */
  --r-badge: 5px;
  --r-seg: 7px;
  --r-btn-sm: 8px;
  --r-btn: 9px;
  --r-input: 10px;
  --r-row: 11px;
  --r-card: 13px;
  --r-card-lg: 14px;
  --r-frame: 16px;
  --r-onboarding: 18px;

  /* Shadows. Nothing else on the page casts one. */
  --shadow-frame: 0 18px 44px rgba(60, 48, 32, .13);
  --shadow-card: 0 10px 30px rgba(60, 48, 32, .07);
  --shadow-knob: 0 1px 3px rgba(0, 0, 0, .2);

  /* Layout */
  --sidebar-w: 216px;

  /* The mock has no transitions by design. Where one exists it is capped at
   * 120ms and touches colour and border only -- nothing slides or fades. */
  --t: 120ms;
}