@media (max-width: 800px) {
  .shell { grid-template-columns: 1fr; padding-top: 0; }

  .rail { position: static; padding: 1rem 1.1rem; box-shadow: none; }
  .rail ol { display: flex; flex-direction: column; gap: 0; }
  .step-li { display: none; }
  .step-li.active { display: flex; }
  .step-li.active .rail-step { background: none; padding-left: 0; }
  .step-li.active .rail-step::before { display: none; }
}

@media (max-width: 560px) {
  .row2 { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .panel { padding: 1.5rem 1.1rem 1.3rem; border-radius: 0; border-left: none; border-right: none; }
  .panel::before, .panel .p-corner { display: none; }
  .shell { padding-left: 0; padding-right: 0; }
}

@media (max-width: 480px) {
  .single-preview-image-wrap img, .single-preview-image-wrap .preview-file-icon { width: 150px; height: 150px; }
}