@layer utilities {
  .sr-only:not(:focus):not(:focus-within) {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }

  .skip-link {
    position: absolute;
    inset-block-start: var(--space-xs);
    inset-inline-start: var(--space-xs);
    z-index: var(--z-toast);
    background: var(--color-ink);
    color: var(--color-cream);
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-sm);
    translate: 0 -300%;
  }
  .skip-link:focus { translate: 0 0; }

  .muted { color: var(--color-text-muted); }
  .flow > * + * { margin-block-start: var(--space-md); }
}