/*
 * Design tokens — must load before theme-app.css.
 * Tailwind lib build omits these :root rules; without them utilities like
 * bg-background and container-site resolve to invalid var() chains.
 */
@import url("../src/styles/tokens.css");

:root {
  --background: var(--cream);
  --foreground: var(--olive);
  --card: var(--brand-ivory);
  --card-foreground: var(--foreground);
  --popover: var(--brand-ivory-soft);
  --popover-foreground: var(--foreground);
  --primary: var(--olive);
  --primary-foreground: var(--cream);
  --secondary: var(--sage-soft);
  --secondary-foreground: var(--olive);
  --muted: var(--brand-sand);
  --muted-foreground: var(--brand-plum-muted);
  --accent: var(--sage-soft);
  --accent-foreground: var(--olive);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.985 0 0);
  --border: var(--brand-line);
  --input: var(--brand-line);
  --ring: var(--sage);

  --shadow-elegant: 0 30px 80px -40px oklch(0.333 0.042 125.3 / 0.4);
  --gradient-grace: linear-gradient(135deg, var(--olive-deep), var(--sage));
}

#tmt-app {
  min-height: 100dvh;
}