/* Elevation. Shadows are quiet and cool-tinted; they signal layering, never
   decoration. Levels 0-2 for in-page surfaces, 3-5 for overlays only.
   In dark mode, elevation is carried mostly by surface lightness plus a
   tighter, deeper shadow. */
:root{
  --elevation-0:none;
  --elevation-1:0 1px 2px rgba(18,21,26,.06),0 0 0 1px rgba(18,21,26,.04);
  --elevation-2:0 2px 4px rgba(18,21,26,.07),0 1px 2px rgba(18,21,26,.05);
  --elevation-3:0 6px 12px -2px rgba(18,21,26,.10),0 2px 4px rgba(18,21,26,.06);
  --elevation-4:0 12px 24px -6px rgba(18,21,26,.14),0 4px 8px rgba(18,21,26,.06);
  --elevation-5:0 24px 48px -12px rgba(18,21,26,.20),0 8px 16px rgba(18,21,26,.08);

  --shadow-card:var(--elevation-1);
  --shadow-card-hover:var(--elevation-2);
  --shadow-menu:var(--elevation-3);
  --shadow-dialog:var(--elevation-5);
  --shadow-snackbar:var(--elevation-4);
  --shadow-inset-sunken:inset 0 1px 2px rgba(18,21,26,.05);
}
[data-theme="dark"]{
  --elevation-1:0 1px 2px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.04);
  --elevation-2:0 2px 6px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.05);
  --elevation-3:0 6px 14px -2px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.06);
  --elevation-4:0 12px 28px -6px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);
  --elevation-5:0 24px 56px -12px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.07);
  --shadow-inset-sunken:inset 0 1px 2px rgba(0,0,0,.4);
}