@media (max-width: 900px) {
  .app-shell {
    width: min(100% - 2rem, var(--content-width));
  }

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

@media (max-width: 680px) {
  .app-header {
    position: relative;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    padding: 0.75rem 1rem;
  }

  .header-project {
    flex: 1 1 auto;
    text-align: right;
  }

  .header-actions {
    width: 100%;
    justify-content: flex-start;
    gap: 0.4rem;
  }

  .header-actions button,
  .header-actions .button {
    min-height: 2.25rem;
    padding-inline: 0.65rem;
    font-size: 0.78rem;
  }

  .app-shell {
    width: min(100% - 1.5rem, var(--content-width));
    padding-block: var(--space-4) var(--space-6);
  }

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

  .file-browser-controls {
    grid-template-columns: 1fr;
  }

  .context-heading,
  .question-heading,
  .set-heading,
  .architecture-heading,
  .manifest-heading,
  .generation-heading,
  .publication-heading,
  .app-summary-heading,
  .uat-readiness-heading,
  .generated-files-heading,
  .history-heading {
    flex-direction: column;
  }

  .context-panel,
  .context-component,
  .question-card,
  .question-history,
  .file-browser,
  .architecture-panel,
  .manifest-panel,
  .generation-panel,
  .publication-panel,
  .review-panel,
  .app-summary,
  .uat-readiness,
  .generated-files-panel,
  .history-panel,
  .history-detail {
    padding: 1rem;
  }

  .manifest-table th,
  .manifest-table td,
  .history-table th,
  .history-table td {
    padding: 0.58rem;
  }

  .history-toolbar {
    align-items: stretch;
  }

  .history-toolbar label,
  .history-toolbar input,
  .history-toolbar select {
    width: 100%;
  }

  .launchpad {
    padding: 1.4rem 1.1rem;
  }

  .launchpad textarea {
    min-height: 10rem;
  }
}

@media (max-width: 480px) {
  .header-actions {
    flex-wrap: wrap;
  }

  .launchpad {
    padding: 1.2rem 1rem;
  }

  .transition-controls,
  .manifest-actions,
  .generation-actions,
  .publication-actions,
  .review-actions,
  .app-phase-actions,
  .dialog-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .transition-controls button,
  .manifest-actions button,
  .generation-actions button,
  .publication-actions button,
  .review-actions button,
  .app-phase-actions button,
  .dialog-actions button {
    width: 100%;
  }

  .validation-measurements,
  .generated-file-meta,
  .publication-meta {
    flex-direction: column;
    gap: 0.25rem;
  }
}

@media (max-width: 380px) {
  .app-shell {
    width: calc(100% - 1.25rem);
  }

  .header-actions button,
  .header-actions .button {
    padding-inline: 0.55rem;
    font-size: 0.74rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}