@layer components {
  /* A word on a signed-out page that waits on a decision not yet made, such as a price. Drawn so
     no one mistakes it for a finished word: a dashed pill that names what is missing. */
  .site-unset {
    display: inline-flex;
    align-items: center;
    min-block-size: var(--tap-min);
    padding-inline: var(--space-7);
    border: var(--border-width-strong) dashed var(--color-border-strong);
    border-radius: var(--radius-pill);
    font: var(--type-button);
    color: var(--color-ink-muted);
  }
}