@media (max-width: 720px) {
  .assessment-start,
  .assessment-flow {
    padding: 24px 0;
  }

  .assessment-intro-card,
  .assessment-form,
  .assessment-side,
  .assessment-summary {
    padding: 16px;
  }

  .assessment-intro-card h1,
  .assessment-step-header h2,
  .result-heading h1 {
    font-size: 1.85rem;
    line-height: 1.12;
  }

  .assessment-question,
  .result-empty,
  .result-card,
  .score-panel,
  .result-section,
  .recommendation-panel {
    padding: 12px;
  }

  .assessment-actions-row {
    flex-direction: column;
  }

  .assessment-actions-row .button {
    width: 100%;
  }

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

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

  .score-panel {
    grid-template-columns: 1fr;
  }

  .score-ring {
    width: 96px;
  }

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

@media (max-width: 980px) {
  .assessment-start-grid,
  .assessment-layout {
    grid-template-columns: 1fr;
  }

  .assessment-fields {
    grid-template-columns: 1fr;
  }

  .assessment-side,
  .assessment-summary {
    position: static;
  }

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

  .assessment-phase-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

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

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

@media (max-width: 720px) {
  .result-summary-grid,
  .result-score-grid,
  .assessment-options,
  .assessment-scale {
    grid-template-columns: 1fr;
  }

  .assessment-scale label,
  .assessment-options label {
    min-width: 0;
  }

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