/*
 * Original-site motion enhancement
 * Visual layout, typography, colors, spacing, and content stay owned by site.css
 * and museum.css. This file only adds a fine-pointer micro-interaction.
 */

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.xl-motion-enabled .ui-btn,
  html.xl-motion-enabled .ui-matrix-card {
    transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  html.xl-motion-enabled .ui-btn:hover,
  html.xl-motion-enabled .ui-matrix-card:hover {
    transform: translateY(-2px);
  }

  html.xl-motion-enabled .ui-btn:active,
  html.xl-motion-enabled .ui-matrix-card:active {
    transform: translateY(0);
  }
}

/* The cards are informational, so the decorative navigation arrows are removed. */
.ui-credentials-page .ui-data-card {
  grid-template-columns: 76px minmax(0, 1fr);
}

@media (max-width: 640px) {
  .ui-credentials-page .ui-data-card {
    grid-template-columns: 96px minmax(0, 1fr);
  }
}

/*
 * The museum keeps its functional series filters, while the redundant heading
 * and decorative navigation rail are removed at the user's request.
 */
.museum-page .museum-explore-head,
.museum-page .museum-browser {
  grid-template-columns: minmax(0, 1fr);
}

.museum-page .museum-toolbar {
  padding-top: 14px;
}

@media (min-width: 1181px) {
  .museum-page .museum-explore {
    grid-template-columns: minmax(0, 1fr);
  }

  .museum-page .museum-toolbar {
    grid-column: 1;
    grid-row: 1;
    padding-top: 16px;
  }

  .museum-page .museum-results {
    grid-column: 1;
    grid-row: 2;
  }
}