html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; color-scheme: light; }

@media (max-width: 1200px) {
  html, body { max-width: 100%; }
  .app {
    padding: 10px 10px calc(24px + env(safe-area-inset-bottom, 0px));
    padding-left: max(10px, env(safe-area-inset-left, 0px));
    padding-right: max(10px, env(safe-area-inset-right, 0px));
  }
  .header { align-items: stretch; flex-direction: column; }
  .header > div:last-child { width: 100%; display: flex !important; flex-wrap: wrap; align-items: center; gap: 10px; }
  .brand { font-size: clamp(22px, 7vw, 32px); }
  .nav-tabs { width: 100%; flex-wrap: wrap; }
  .nav-tabs a { flex: 1 1 auto; text-align: center; min-height: 44px; display: flex; align-items: center; justify-content: center; }
  .card { padding: 16px 14px; }
  .card-head-row { flex-direction: column; align-items: stretch; }
  .card-head-row h2 { width: 100%; white-space: nowrap; writing-mode: horizontal-tb; overflow: hidden; text-overflow: ellipsis; }
  .card-head-actions { width: 100%; flex-wrap: wrap; }
  .card-head-actions .btn, .filter-actions .btn, .btn, .btn-page, .btn-copy { min-height: 44px; }
  .tv-result-panel .btn, .map-workspace-panel .btn { min-height: 34px; }
  .filter-field, .filter-field.grow { flex: 1 1 100%; min-width: 0; width: 100%; }
  .filter-field input, .filter-field select { font-size: 16px; max-width: 100%; }
  .filter-actions { width: 100%; display: flex; gap: 8px; }
  .filter-actions .btn { flex: 1; }
  .summary-total { width: 100%; min-width: 0; }
  .pagination { flex-wrap: wrap; row-gap: 8px; }
  .card-books .table-wrap, #table-container, .table-wrap, .map-table-wrap, .rel-roster-wrap {
    overflow-x: auto !important; -webkit-overflow-scrolling: touch; max-width: 100%;
  }
  .card-books table.books-table { table-layout: auto !important; width: max-content !important; min-width: 1180px !important; }
  .upload-grid { grid-template-columns: 1fr; }
  .blacklist-text { min-height: min(52vh, 420px); font-size: 16px; }

  body.tv-standalone-page, body.mw-standalone-page { height: 100dvh !important; overflow: hidden; }
  body.tv-standalone-page .tv-result-panel,
  body.mw-standalone-page .map-workspace-panel {
    width: 100%; max-width: 100%; border-radius: 0;
    height: 100dvh !important; max-height: 100dvh !important;
    display: flex; flex-direction: column; overflow: hidden;
  }
  .tv-result-header, .map-workspace-header { padding: calc(6px + env(safe-area-inset-top, 0px)) 10px 8px; flex-wrap: wrap; gap: 8px; }
  .tv-kicker { font-size: 12px; margin: 0; }
  .tv-meta { font-size: 12px; max-height: 3.2em; overflow: auto; margin: 4px 0 0; }
  .tv-result-header h2, .map-workspace-header h2 { font-size: 16px; line-height: 1.3; white-space: normal; word-break: break-word; }
  .tv-actions, .map-workspace-tools { width: 100%; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 6px; }
  .tv-actions .btn, .map-workspace-tools .btn { flex: 0 0 auto; min-height: 34px; padding: 6px 10px; font-size: 13px; }
  .tv-chapter-bar { gap: 6px; padding: 6px 8px; }
  .tv-chapter-bar .btn, .tv-chapter-indicator { min-width: 0; flex: 1; min-height: 34px; font-size: 13px; }
  .tv-result-header { order: 1; }
  .tv-chapter-bar:not(.tv-chapter-bar-bottom) { order: 2; }
  .tv-result-content {
    order: 3; margin: 0; border-radius: 0; padding: 10px 12px 16px;
    flex: 1 1 auto !important; min-height: 52vh !important; overflow: auto !important;
  }
  .map-workspace-body {
    margin: 0; border-radius: 0; padding: 10px 12px 16px;
    flex: 1 1 auto !important; min-height: 52vh !important; overflow: auto !important;
  }
  .tv-inline-progress, .tv-zh-quality-box, .tv-mapping-box, .tv-verify-box {
    order: 4; margin: 6px 10px; padding: 8px 10px; max-height: 48px; font-size: 13px; line-height: 1.4;
  }
  .tv-chapter-bar-bottom { order: 5; display: none !important; }
  .tv-zh-quality-box h4, .tv-verify-box h4, .tv-mapping-box h4 { font-size: 14px; margin: 0 0 4px; }

  .map-table.map-table-multi, .map-table.map-table-single { width: max-content !important; table-layout: auto !important; }
  .map-table.map-table-multi { min-width: 1680px !important; }
  .map-table.map-table-single { min-width: 720px !important; }
  .map-table th, .map-table td { white-space: nowrap; writing-mode: horizontal-tb; word-break: keep-all; }
  .map-table select, .map-table input { max-width: none !important; min-width: 7em; width: auto; }

  .modal-mask { padding: 12px 10px calc(12px + env(safe-area-inset-bottom, 0px)); align-items: flex-end; }
  .modal-panel, .modal-panel-wide { width: 100%; max-height: min(92dvh, 94vh); overflow: auto; }
  .translate-genre-list, .back-en-genre-list { grid-template-columns: 1fr; }
  .login-page { padding: 16px 12px calc(16px + env(safe-area-inset-bottom, 0px)); align-items: stretch; }
  .login-shell { grid-template-columns: 1fr; width: 100%; }
  .captcha-row { grid-template-columns: 1fr min(120px, 34vw); }
  .reader-app { padding: 16px 12px calc(28px + env(safe-area-inset-bottom, 0px)); }
  .reader-header { flex-direction: column; align-items: stretch; }
  .reader-actions, .reader-nav { width: 100%; align-items: stretch; }
  .btn-page, .btn-copy { flex: 1; text-align: center; }
  .reader-layout { grid-template-columns: 1fr; }
  .reader-toc { position: static; max-height: 200px; }
  .reader-page { padding: 20px 14px 28px; }
}

@media (max-width: 720px) {
  .tv-novel-compare .tv-novel-colhead, .tv-novel-pair { grid-template-columns: 1fr; gap: 4px 0; }
  .tv-novel-pair p.en { padding-bottom: 4px; border-bottom: 1px dashed #e5e7eb; }
}
