/*
 * Orbiting design tokens — the "pastel-consumer" style (.taste-skill/direction.json),
 * from docs/superpowers/specs/2026-11-01-ux-redesign-design.md §Visual system.
 * This is the only file where raw hex lives; components reference these variables.
 * The @font-face rules for Manrope are injected by ui.ts, because only the server
 * knows the fonts' content-hashed URLs.
 */
:root {
  --ground: #f3f5f7; --surface: #ffffff; --raised: #f2f8fd;
  --border: #e6e6e6; --rule: #f4f4f4; --control: #d6d9dd;
  --text: #1b1d1f; --muted: #5c6064; --active: #e9ecef;
  --primary: #1b1d1f;              /* near-black filled Post button, white label */
  --accent: #1d5fd6; --accent-soft: #dcf1ff; --accent-ink: #0a3a80;
  --positive: #2f7a45; --negative: #c41c29; --warning: #92400e;
  --pill-neutral-bg: #eef1f4; --pill-neutral-ink: #3a3d40;
  --radius-card: 20px; --radius-control: 10px; --radius-chip: 8px;
  --gap: 24px; --pad: 24px; --control-height: 40px; --sidebar-width: 240px;
  --fs-title: 28px; --fs-section: 20px; --fs-body: 16px; --fs-small: 14px;
  --font: "Manrope", system-ui, sans-serif;
}

/* Base element styles for views built on the tokens. deck.css loads after this and
   still restyles body with its own legacy variables; later tasks move each view over. */
body {
  font-family: var(--font);
  background: var(--ground);
  color: var(--text);
  font-size: var(--fs-body);
}