@media (max-width: 52rem) {
  .screen-grid {
    grid-template-columns: 1fr;
  }

  .detail-panel {
    position: static;
  }

  .choice-grid--three {
    grid-template-columns: 1fr;
  }

  .preparation-grid {
    grid-template-columns: 1fr;
  }

  .dungeon-layout {
    grid-template-columns: 1fr;
  }

  .battle-layout {
    grid-template-columns: 1fr;
  }

  .result-grid {
    grid-template-columns: 1fr;
  }

  .axis-result-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .game-sidebar {
    position: static;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-row: 1;
  }
}

@media (max-width: 40rem) {
  .site-header {
    min-height: 4rem;
  }

  .brand span:last-child {
    font-size: 0.9rem;
  }

  .header-progress {
    font-size: 0.75rem;
  }

  .main-content {
    width: min(100% - 1rem, var(--content-width));
    padding: 1rem 0 1.5rem;
    align-items: flex-start;
  }

  .hero {
    min-height: calc(100vh - 7rem);
    padding: 1.25rem;
  }

  .choice-grid {
    grid-template-columns: 1fr;
  }

  .selection-card {
    min-height: auto;
  }

  .game-sidebar {
    grid-template-columns: 1fr;
  }

  .dungeon-choices {
    grid-template-columns: 1fr;
  }

  .enemy-grid,
  .skill-grid {
    grid-template-columns: 1fr;
  }

  .battle-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .battle-actions .button {
    width: 100%;
  }

  .story-panel {
    min-height: 10rem;
  }

  .axis-result-grid {
    grid-template-columns: 1fr;
  }

  .action-row,
  .action-row--between {
    display: grid;
    grid-template-columns: 1fr;
  }

  .button {
    width: 100%;
  }

  .site-footer {
    width: min(100% - 1rem, var(--content-width));
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}