@media (max-width: 720px) {
  html,
  body,
  #app {
    height: auto;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
  }

  body {
    padding-bottom: env(safe-area-inset-bottom);
  }

  .app-shell {
    height: auto;
    min-height: 100vh;
    overflow-y: auto;
    touch-action: pan-y;
    padding-bottom: calc(env(safe-area-inset-bottom) + 180px);
  }

  .main-layout {
    flex-direction: column;
    height: auto;
    overflow: visible;
    gap: 12px;
  }

  .left-panel,
  .center-panel,
  .right-panel {
    width: 100%;
    height: auto;
    align-self: stretch;
    overflow: visible;
  }

  .center-panel {
    min-height: 280px;
  }

  .mnemonic-panel {
    height: auto;
    gap: 10px;
  }

  .mnemonic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 48px;
    gap: 8px;
    margin-bottom: 8px;
  }

  .scan-panel {
    overflow: visible;
    margin-top: 10px;
    margin-bottom: 12px;
  }

  .threat-list {
    max-height: none;
    overflow: visible;
  }

  .right-panel {
    padding-bottom: 140px;
  }

  .quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 20px;
  }
}