/* @rudedog/ui — design tokens. THE canonical source of truth (values final,
   from the design handoff). An app may override a subset (e.g. Slates' gallery
   keeps its cool slate working palette) by re-declaring on :root in its own
   app.css, linked after this file. Keep oklch. */
:root {
  /* Type */
  --font: "Space Grotesk", "Helvetica Neue", Helvetica, -apple-system, Arial, sans-serif;
  --mono: "Space Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Brand palette (default surfaces: hub, account, store, sign-in) */
  --accent:        oklch(0.55 0.23 280);        /* indigo  ~#6E48E8 */
  --accent-hover:  oklch(0.5 0.23 280);
  --accent-tint:   oklch(0.55 0.23 280 / 0.14);
  --indigo-band:   oklch(0.46 0.17 282);        /* suite banner ~#5840B0 */
  --page:          oklch(0.952 0.004 90);       /* warm off-white ~#EDECE8 */
  --surface:       oklch(0.985 0.003 90);       /* cards, chips ~#FAF9F6 */
  --ink:           oklch(0.16 0.01 70);         /* headings ~#22201C */
  --ink-muted:     oklch(0.44 0.01 70);         /* body copy */
  --ink-faint:     oklch(0.54 0.01 70);         /* metadata, footer */
  --hair:          rgba(20, 18, 15, 0.12);      /* borders (cards .11 · buttons .16 · footer .10) */
  --owned:         oklch(0.6 0.14 152);         /* OWNED pill + live dot */
  --owned-ink:     oklch(0.45 0.12 152);
  --err:           oklch(0.55 0.2 25);

  /* On-indigo (text over the suite banner) */
  --on-indigo:        oklch(0.9 0.04 285);
  --on-indigo-eyebrow: oklch(0.88 0.07 285);
  --on-indigo-meta:   oklch(0.85 0.06 285);

  /* Scrollbars — slim by design: a 4px sliver at rest that thickens and
     brightens on approach. velvet.css re-points these for the dark ground. */
  --scrollbar-idle:  rgba(28, 35, 50, 0.10);   /* container not hovered */
  --scrollbar:       rgba(28, 35, 50, 0.20);   /* container hovered */
  --scrollbar-hover: rgba(28, 35, 50, 0.34);   /* thumb hovered/dragged */

  /* Radii / layout / motion */
  --r-card: 14px;  --r-btn: 10px;  --r-tile: 10px;  --r-pill: 100px;
  --maxw: 1180px;  --pad: 32px;
  --ease: 0.2s ease;
  --lift: translateY(-2px);
  --card-shadow: 0 18px 40px -28px rgba(20, 18, 15, 0.45);

  /* Per-tool accent — an app sets --accent + --tool-* to its own identity (see brand.ts) */
  --tool-tile-bg: var(--accent);
  --tool-tile-ink: #fff;
}