/* ============================================================
   ELEVATION — the two themes handle depth differently.
   DARK: depth comes from surface lightening + a faint accent glow,
         shadows stay near-invisible (light doesn't fall on black).
   LIGHT: soft, warm-grey ambient shadows in the eco tradition.
   ============================================================ */
:root {
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.55);
  --shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.6);

  /* accent glow — used sparingly on the live status dot & focus */
  --glow-accent: 0 0 18px rgba(84, 179, 196, 0.28);

  /* hairline top-light on hero cards (dark only) */
  --edge-light: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

[data-theme="light"] {
  --shadow-sm: 0 1px 2px rgba(52, 48, 38, 0.06);
  --shadow-md: 0 6px 20px rgba(52, 48, 38, 0.08);
  --shadow-lg: 0 18px 48px rgba(52, 48, 38, 0.12);
  --shadow-pop: 0 10px 32px rgba(52, 48, 38, 0.14);
  --glow-accent: 0 0 16px rgba(0, 113, 154, 0.25);
  --edge-light: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}