/* Restrained elevation. Borders and spacing do most of the work;
   shadow appears only when something genuinely floats. */
:root{
  --shadow-none:none;
  --shadow-subtle:0 1px 2px rgba(11,11,12,.06);
  --shadow-medium:0 2px 8px rgba(11,11,12,.08);
  --shadow-elevated:0 8px 24px rgba(11,11,12,.10);
  --shadow-modal:0 24px 64px rgba(11,11,12,.22);
  --shadow-sticky-bar:0 -2px 12px rgba(11,11,12,.08);
  --focus-ring:0 0 0 2px var(--color-bg),0 0 0 4px var(--color-focus);
  --focus-ring-inverse:0 0 0 2px var(--ink-1000),0 0 0 4px var(--color-focus-on-dark);
  --border-hairline:1px solid var(--color-border);
  --border-strong:1px solid var(--color-border-strong);
  --border-ink:1.5px solid var(--ink-1000);
}