@scope (.admin-page) {
  :scope {
    padding-block: var(--space-6);
  }

  section {
    padding: var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-default);
  }

  form.stack {
    max-width: 50rem;
  }

  h1, h2, p {
    margin: 0;
  }

  input, select, button {
    min-width: 0;
    font: inherit;
    color: var(--color-text);
    background: var(--color-bg);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-control);
  }

  button {
    cursor: pointer;
    font-weight: 700;
    background: var(--color-primary);
    color: var(--color-on-primary);
  }

  button:disabled {
    cursor: default;
    opacity: 0.6;
  }

  input:focus-visible, select:focus-visible, button:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
  }

  label {
    display: block;
  }

  label > select, label > input:not([type="radio"]):not([type="checkbox"]) {
    margin-inline-start: var(--space-2);
    max-width: 100%;
  }

  fieldset {
    min-width: 0;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-control);
  }

  fieldset p {
    margin-block-start: var(--space-2);
  }

  input, select, button {
    padding: var(--space-2);
    margin-inline-end: var(--space-2);
  }

  li {
    margin-block: var(--space-3);
  }

  dl {
    display: grid;
    grid-template-columns: minmax(10rem, 1fr) 1fr;
    gap: var(--space-2);
    max-width: 30rem;
  }

  dt {
    font-weight: 700;
  }

  dd {
    margin: 0;
  }

  fieldset label {
    margin-block: var(--space-3);
  }
}