/* ============================================================
   Marker — modern bookmark manager
   Minimal & crisp · light + dark · teal accent (matches the logo)
   ============================================================ */

/* ---------- Tokens ---------- */
:root {
  --bg: oklch(1 0 0);
  --surface: oklch(0.985 0 0);
  --surface-2: oklch(0.965 0 0);
  --border: oklch(0.922 0 0);
  --border-strong: oklch(0.87 0 0);

  --ink: oklch(0.23 0.01 162);
  --muted: oklch(0.50 0.012 162);
  --faint: oklch(0.62 0.01 162);

  --accent: oklch(0.53 0.13 185);
  --accent-hover: oklch(0.48 0.135 185);
  --accent-fg: oklch(0.99 0 0);
  --accent-soft: oklch(0.95 0.035 185);
  --accent-text: oklch(0.46 0.12 185);

  --danger: oklch(0.58 0.19 25);
  --danger-soft: oklch(0.95 0.04 25);

  --warn: oklch(0.70 0.15 75);

  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06);
  --shadow-md: 0 4px 14px rgb(0 0 0 / 0.08);
  --shadow-pop: 0 12px 34px rgb(0 0 0 / 0.16);

  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-pill: 999px;

  --fs-xs: 0.6875rem;
  /* 11 */
  --fs-sm: 0.78125rem;
  /* 12.5 */
  --fs-base: 0.875rem;
  /* 14 */
  --fs-md: 0.9375rem;
  /* 15 */
  --fs-lg: 1.0625rem;
  /* 17 */
  --fs-xl: 1.25rem;
  /* 20 */

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.18s;

  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;

  --z-flyout: 40;
  --z-menu: 60;
  --z-modal-back: 80;
  --z-modal: 90;
  --z-toast: 100;

  color-scheme: light;
}

[data-theme="dark"] {
  --bg: oklch(0.175 0.004 162);
  --surface: oklch(0.205 0.005 162);
  --surface-2: oklch(0.245 0.006 162);
  --border: oklch(0.275 0.006 162);
  --border-strong: oklch(0.33 0.008 162);

  --ink: oklch(0.95 0.005 162);
  --muted: oklch(0.69 0.01 162);
  --faint: oklch(0.55 0.01 162);

  --accent: oklch(0.72 0.14 185);
  --accent-hover: oklch(0.78 0.145 185);
  --accent-fg: oklch(0.17 0.02 185);
  --accent-soft: oklch(0.30 0.05 185);
  --accent-text: oklch(0.80 0.13 185);

  --danger: oklch(0.66 0.18 25);
  --danger-soft: oklch(0.30 0.06 25);

  --warn: oklch(0.78 0.15 75);

  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.4);
  --shadow-md: 0 6px 18px rgb(0 0 0 / 0.45);
  --shadow-pop: 0 16px 40px rgb(0 0 0 / 0.6);

  color-scheme: dark;
}