/* Hallmark · tokens · app-shell: modern-minimal · tone: utilitarian-warm · accent: teal-600
 * pre-emit critique: P5 H5 E5 S4 R5 V4
 *
 * The list view is mobile-first: the record card is the base layout and the
 * wide table is layered on at 60rem. The rest of the shell predates that and
 * is still desktop-first — converting it wholesale is a separate job.
 */

/* ── Tokens ── */
:root {
  --color-paper:       oklch(98.5% 0.004 90);
  --color-paper-2:     oklch(96% 0.004 90);
  --color-paper-3:     oklch(93.5% 0.005 90);
  --color-ink:         oklch(18% 0.01 260);
  --color-ink-2:       oklch(38% 0.01 260);
  /* 52%, not 58%: at 58% this cleared only 4.10:1 on paper, and it carries
   * small text (field labels, counts, table captions) that needs 4.5:1. */
  --color-ink-3:       oklch(52% 0.01 260);
  --color-ink-4:       oklch(74% 0.008 260);
  --color-accent:      oklch(52% 0.1 230);
  --color-accent-hover:oklch(45% 0.1 230);
  --color-accent-subtle:oklch(95% 0.025 230);
  --color-border:      oklch(91% 0.004 260);
  --color-border-strong:oklch(83% 0.008 260);
  --color-error:       oklch(55% 0.19 25);
  --color-error-bg:    oklch(95% 0.03 25);
  --color-success:     oklch(55% 0.14 155);
  --color-warning:     oklch(70% 0.14 80);
  --color-focus:       oklch(60% 0.18 250);
  --color-sire:        oklch(96.5% 0.018 235);
  --color-dam:         oklch(96.5% 0.018 340);
  --color-subject:     oklch(96.5% 0.025 155);
  /* Readable counterparts to the pale lineage fills above, for tag text. */
  --color-sire-ink:    oklch(50% 0.09 235);
  --color-dam-ink:     oklch(50% 0.09 340);
  --color-stub-bg:     oklch(95% 0.05 80);
  --color-stub-ink:    oklch(45% 0.11 70);

  --font-display: 'Inter', 'Noto Sans TC', system-ui, sans-serif;
  --font-body:    'Inter', 'Noto Sans TC', system-ui, sans-serif;
  --font-mono:    'SF Mono', 'Noto Sans TC', ui-monospace, monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.8125rem;
  --text-base: 0.9375rem;
  --text-lg:   1.0625rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;

  --space-1: 0.25rem;  --space-2: 0.5rem;   --space-3: 0.75rem;
  --space-4: 1rem;     --space-5: 1.25rem;   --space-6: 1.5rem;
  --space-8: 2rem;     --space-10: 2.5rem;   --space-12: 3rem;

  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-full: 9999px;

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    120ms;
  --dur-normal:  200ms;

  --shadow-sm: 0 1px 2px oklch(0% 0 0 / 0.04);
  --shadow-md: 0 2px 8px oklch(0% 0 0 / 0.06), 0 0 0 1px oklch(0% 0 0 / 0.03);
  --shadow-lg: 0 8px 24px oklch(0% 0 0 / 0.08);
  /* Cast to the right of the frozen ring column so rows read as scrolled under it. */
  --shadow-sticky: 6px 0 8px -6px oklch(0% 0 0 / 0.14);

  --color-surface: oklch(100% 0 0);
  --color-surface-blur: oklch(100% 0 0 / 0.92);

  /* Apple HIG / Material both land on ~44px as the smallest reliable touch target. */
  --tap-target: 44px;
  /* Below 16px iOS Safari zooms the page on focus; this is the floor, not a preference. */
  --text-input-touch: 1rem;
}