/* The Admin page: one topic at a time, picked from a menu that is a column beside the topic on a wide screen
   and a block of wrapped chips above it on a phone. Also the dividers between the adoption listing sites. */
.admin-layout { display: grid; gap: 8px 24px; }
.admin-menu { margin-bottom: 4px; }
@media (min-width: 1100px) {
  .admin-layout { grid-template-columns: 210px minmax(0, 1fr); align-items: start; }
  .admin-menu { flex-direction: column; flex-wrap: nowrap; gap: 2px; position: sticky; top: 76px; padding: 8px; margin: 0;
    background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); }
  .admin-menu .chip { border: 0; border-radius: 10px; padding: 10px 12px; background: transparent; white-space: normal; }
  .admin-menu .chip:not(.on):hover { background: var(--brand-soft); }
  .admin-menu .chip.on { background: var(--brand); color: var(--on-brand); }
}
.admin-head { margin: 4px 2px 14px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.admin-head h2 { margin: 0 0 2px; }
.admin-head p { margin: 0; }
.admin-body .grid { margin-bottom: 14px; }
.admin-body .grid > .card { margin-bottom: 0; }
.listing-site { border-top: 1px solid var(--line); padding-top: 12px; margin-top: 16px; }