:root {
  --bg-base: #071510;
  --bg-surface: #0d1f19;
  --bg-soft: #0f2318;
  --bg-tint: #0c1f1a;
  --bg-warm: #0e2019;
  --bg-card: rgba(255, 255, 255, 0.06);
  --line-subtle: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.14);
  --shadow-soft: 0 24px 80px rgba(0, 0, 0, 0.45);
  --shadow-card: 0 18px 40px rgba(0, 0, 0, 0.35);
  --text-strong: #ffffff;
  --text-body: rgba(255, 255, 255, 0.75);
  --text-reading: rgba(255, 255, 255, 0.70);
  --text-muted: rgba(255, 255, 255, 0.50);
  --text-soft: rgba(255, 255, 255, 0.35);
  --accent-blue: #2aac76;
  --accent-teal: #38c793;
  --accent-violet: #9d86f5;
  --accent-gold: #e2b96a;
  /* Semantic aliases used in app shell */
  --accent-1: #1f8f5f;
  --accent-2: #38c793;
  --text-primary: #ffffff;
  --text-secondary: rgba(255, 255, 255, 0.72);
  --border-subtle: rgba(255, 255, 255, 0.09);
  --bg-elevated: #0f2318;
  --grad-brand: linear-gradient(135deg, #2aac76 0%, #38c793 52%, #9d86f5 100%);
  --grad-soft: linear-gradient(135deg, rgba(31, 143, 95, 0.15) 0%, rgba(56, 199, 147, 0.10) 48%, rgba(111, 83, 217, 0.15) 100%);
  --nav-h: 76px;
  --r-xs: 12px;
  --r-sm: 18px;
  --r-md: 24px;
  --r-lg: 32px;
  --content-max: 1240px;
  --content-narrow: 760px;
  --t-fast: .18s ease;
  --t-base: .28s ease;
  --t-slow: .48s ease;

  /* ── Spacing scale ────────────────────────────────────────────────── */
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  20px;
  --space-lg:  28px;
  --space-xl:  40px;

  /* ── Typography scale ─────────────────────────────────────────────── */
  --fs-xs:   0.72rem;
  --fs-sm:   0.82rem;
  --fs-base: 0.9rem;
  --fs-md:   1rem;
  --fs-lg:   1.2rem;
  --fs-xl:   1.5rem;
  --fw-regular: 400;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   900;

  /* ── Accent tint palette ───────────────────────────────────────────── */
  --accent-tint-xs: rgba(31,143,95,0.06);
  --accent-tint-sm: rgba(31,143,95,0.10);
  --accent-tint-md: rgba(31,143,95,0.16);
  --accent-tint-lg: rgba(31,143,95,0.24);

  /* ── Focus ring ────────────────────────────────────────────────────── */
  --focus-ring:   0 0 0 3px rgba(31,143,95,0.20);
  --focus-border: rgba(31,143,95,0.50);

  color-scheme: dark;
}

/* ── App shell overrides — restore light theme inside .app-root ─────────────
   The :root block above sets the dark public-site theme.
   The app shell (home.html, feed, dispensaries, etc.) uses .app-root and
   must stay light. All color tokens are overridden here.
   ─────────────────────────────────────────────────────────────────────────── */

/* ── Admin overrides — light theme inside .admin-root ───────────────────────
   Admin pages use .admin-root and are always light. Overrides same as app-root.
   ─────────────────────────────────────────────────────────────────────────── */
.admin-root {
  --bg-base: #f7f3ec;
  --bg-surface: #ffffff;
  --bg-soft: #f1ece4;
  --bg-tint: #eef4ff;
  --bg-warm: #fcf7ef;
  --bg-card: rgba(255, 255, 255, 0.92);
  --line-subtle: rgba(25, 31, 42, 0.08);
  --line-strong: rgba(25, 31, 42, 0.16);
  --shadow-soft: 0 24px 80px rgba(24, 31, 41, 0.08);
  --shadow-card: 0 18px 40px rgba(24, 31, 41, 0.08);
  --text-strong: #1a1f27;
  --text-body: #48505d;
  --text-reading: #3f4652;
  --text-muted: #6b7482;
  --text-soft: #8e97a6;
  --accent-blue: #1f8f5f;
  --accent-teal: #38c793;
  --accent-violet: #6f53d9;
  --accent-gold: #c69a52;
  --accent-1: #1f8f5f;
  --accent-2: #38c793;
  --text-primary: #1a1f27;
  --text-secondary: #48505d;
  --border-subtle: rgba(25, 31, 42, 0.10);
  --bg-elevated: #f1ece4;
  --grad-brand: linear-gradient(135deg, #1f8f5f 0%, #38c793 52%, #6f53d9 100%);
  --grad-soft: linear-gradient(135deg, rgba(31, 143, 95, 0.12) 0%, rgba(56, 199, 147, 0.08) 48%, rgba(111, 83, 217, 0.12) 100%);
  --accent-tint-xs: rgba(31,143,95,0.05);
  --accent-tint-sm: rgba(31,143,95,0.08);
  --accent-tint-md: rgba(31,143,95,0.12);
  --accent-tint-lg: rgba(31,143,95,0.20);
  --focus-ring:   0 0 0 3px rgba(31,143,95,0.12);
  --focus-border: rgba(31,143,95,0.40);
  /* Admin shell background is dark-green sidebar + light main — use a neutral base */
  background: #071510;
  color-scheme: light;
  color: var(--text-primary);
}

.app-root {
  --bg-base: #f7f3ec;
  --bg-surface: #ffffff;
  --bg-soft: #f1ece4;
  --bg-tint: #eef4ff;
  --bg-warm: #fcf7ef;
  --bg-card: rgba(255, 255, 255, 0.92);
  --line-subtle: rgba(25, 31, 42, 0.08);
  --line-strong: rgba(25, 31, 42, 0.16);
  --shadow-soft: 0 24px 80px rgba(24, 31, 41, 0.08);
  --shadow-card: 0 18px 40px rgba(24, 31, 41, 0.08);
  --text-strong: #1a1f27;
  --text-body: #48505d;
  --text-reading: #3f4652;
  --text-muted: #6b7482;
  --text-soft: #8e97a6;
  --accent-blue: #1f8f5f;
  --accent-teal: #38c793;
  --accent-violet: #6f53d9;
  --accent-gold: #c69a52;
  --accent-1: #1f8f5f;
  --accent-2: #38c793;
  --text-primary: #1a1f27;
  --text-secondary: #48505d;
  --border-subtle: rgba(25, 31, 42, 0.10);
  --bg-elevated: #f1ece4;
  --grad-brand: linear-gradient(135deg, #1f8f5f 0%, #38c793 52%, #6f53d9 100%);
  --grad-soft: linear-gradient(135deg, rgba(31, 143, 95, 0.12) 0%, rgba(56, 199, 147, 0.08) 48%, rgba(111, 83, 217, 0.12) 100%);
  --accent-tint-xs: rgba(31,143,95,0.05);
  --accent-tint-sm: rgba(31,143,95,0.08);
  --accent-tint-md: rgba(31,143,95,0.12);
  --accent-tint-lg: rgba(31,143,95,0.20);
  --focus-ring:   0 0 0 3px rgba(31,143,95,0.12);
  --focus-border: rgba(31,143,95,0.40);
  color-scheme: light;
  /* Anchor inherited color so elements without explicit color get dark text */
  color: var(--text-primary);
}
