/* Mobile Square — Elevation & shadow tokens */
:root {
  /* Soft, diffuse elevation (default resting shadows) */
  --shadow-xs: 0 1px 2px rgba(11, 11, 13, 0.06);
  --shadow-sm: 0 1px 2px rgba(11, 11, 13, 0.06), 0 2px 6px rgba(11, 11, 13, 0.06);
  --shadow-md: 0 2px 6px rgba(11, 11, 13, 0.06), 0 8px 20px rgba(11, 11, 13, 0.09);
  --shadow-lg: 0 6px 16px rgba(11, 11, 13, 0.08), 0 18px 44px rgba(11, 11, 13, 0.12);
  --shadow-xl: 0 12px 28px rgba(11, 11, 13, 0.10), 0 32px 72px rgba(11, 11, 13, 0.16);

  /* Signature "pop" — hard offset block shadow for key CTAs & playful cards.
     Pairs with a 2px ink border for a crisp, confident, engineered look. */
  --shadow-pop:        4px 4px 0 var(--ms-ink-900);
  --shadow-pop-lg:     6px 6px 0 var(--ms-ink-900);
  --shadow-pop-yellow: 5px 5px 0 var(--ms-yellow-400);

  /* Yellow glow — for focus / active accents on dark surfaces */
  --glow-accent: 0 0 0 1px rgba(242,237,0,0.4), 0 8px 30px rgba(242,237,0,0.25);
}