/* QQSDrama clone · mobile adaptation layer (≤560px)
   桌面端零影响：所有规则都在媒体查询内。
   修的四个真问题：
   1) 顶栏「语言下拉 + 下载按钮」组宽 290px，320–390 视口下把页面撑出 33–88px 横向滚动
   2) 语言下拉 36px、FAQ 行 28px，低于 44px 触控目标
   3) 对比表三列在 320px 下挤成 13px 正文
   4) 剧集卡元信息 11px 偏小 */

@media (max-width: 560px) {
  html, body { overflow-x: clip; }
  body {
    padding-bottom: calc(84px + env(safe-area-inset-bottom)) !important;
    -webkit-tap-highlight-color: rgba(225, 29, 72, .18);
  }

  /* 1. 顶栏 */
  header > div {
    padding-inline: 12px !important;
    gap: 8px !important;
    flex-wrap: nowrap;
  }
  header > div > div:first-child { min-width: 0; }
  header > div > div:first-child > span {
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  header > div > div:last-child { min-width: 0; gap: 6px !important; }

  #landing-lang {
    max-width: 44vw;
    width: auto;
    min-height: 44px;
    padding-inline: 10px 24px;
    font-size: 12.5px;
    text-overflow: ellipsis;
  }

  /* 顶栏下载按钮让位给底部固定条，避免把品牌挤没 */
  header > div > div:last-child > a { display: none !important; }

  /* 2. 触控目标 */
  details > summary {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding-block: 8px;
  }
  div.fixed a[href] { min-height: 48px; }

  /* 3. 对比表 → 逐行卡片 */
  div.overflow-hidden.rounded-2xl > table { display: block; width: 100%; }
  table > thead { display: none; }
  table > tbody { display: grid; gap: 10px; }
  table > tbody > tr {
    display: block;
    background: rgba(255, 255, 255, .035);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 14px;
    padding: 2px 14px;
  }
  table > tbody > tr > * {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .07);
    font-size: 13.5px;
    text-align: start;
  }
  table > tbody > tr > *:first-child {
    border-top: 0;
    display: block;
    padding-bottom: 6px !important;
    font-size: 13px;
    font-weight: 650;
    color: rgba(255, 255, 255, .95);
  }
  table > tbody > tr > td[data-label]:not([data-label=""])::before {
    content: attr(data-label);
    color: rgba(255, 255, 255, .5);
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    margin-inline-end: auto;
  }
  table > tbody > tr > td[data-label]:not([data-label=""]) {
    justify-content: space-between;
  }
  table > tbody > tr > td:last-child { color: #ffd0d9; font-weight: 650; }
  table > tbody > tr > td:last-child::after {
    content: "✓";
    color: #5ee0a0;
    margin-inline-start: 8px;
    flex: 0 0 auto;
  }

  /* 4. 小字与间距 */
  .text-\[11px\] { font-size: 12px !important; line-height: 1.5; }
  .text-\[10px\] { font-size: 11px !important; }
  section { scroll-margin-top: 68px; }
  main section { padding-inline: 16px; }
}