:root{
  --sh-none:none; /* @kind shadow */
  --sh-hairline:0 0 0 1px var(--color-border-subtle);
  --sh-1:0 1px 2px rgba(7,27,43,.05),0 1px 1px rgba(7,27,43,.04);
  --sh-2:0 4px 14px -4px rgba(7,27,43,.10),0 1px 3px rgba(7,27,43,.05);
  --sh-3:0 14px 40px -12px rgba(7,27,43,.16),0 2px 6px rgba(7,27,43,.05);
  --sh-4:0 30px 70px -24px rgba(7,27,43,.24),0 4px 12px rgba(7,27,43,.06);
  /* Focus: opaque 2px ring separated from the control's own border by a 2px offset
     in the page colour, so the indicator clears 3:1 against every adjacent colour. */
  --sh-focus:0 0 0 2px var(--color-focus-ring-offset),0 0 0 4px var(--color-focus-ring);
  --blur-glass:saturate(140%) blur(14px); /* @kind other */
}
[data-theme="dark"]{
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 4px 16px -4px rgba(0,0,0,.5);
  --sh-3:0 16px 44px -14px rgba(0,0,0,.6);
  --sh-4:0 32px 76px -26px rgba(0,0,0,.7);
}