/**
 * tools.arcreels.com 全站移动端兼容（≤900px）
 * - 弹层近全屏
 * - 分集轨横向滚动
 * - 分镜/后期工作台纵向堆叠
 * - 宽表可横滑
 */
html {
  -webkit-text-size-adjust: 100%;
}

@media (max-width: 900px) {
  body {
    overflow-x: clip;
  }

  /* —— 通用 80vw/80vh 弹层 → 近全屏 —— */
  [class*="w-[80vw]"],
  [class*="w-[80%]"] {
    width: calc(100vw - 0.75rem) !important;
    max-width: calc(100vw - 0.75rem) !important;
  }
  [class*="h-[80vh]"],
  [class*="max-h-[80vh]"] {
    height: calc(100dvh - 0.75rem) !important;
    max-height: calc(100dvh - 0.75rem) !important;
  }
  [class*="max-w-[80vw]"] {
    max-width: calc(100vw - 0.75rem) !important;
  }

  /* —— 场景分镜工作台：整页滚动，禁止 overflow 裁切 —— */
  .shot-sb-workbench-pin {
    position: relative !important;
    top: auto !important;
    z-index: 10;
    padding-bottom: 0;
    align-self: stretch !important;
  }
  .shot-sb-workbench-shell {
    height: auto !important;
    max-height: none !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    align-items: stretch !important;
  }
  .shot-sb-episode-rail,
  #shot-storyboard-episode-rail,
  #post-production-episode-rail,
  aside[aria-label="分集切换"] {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    gap: 0.375rem !important;
    padding-bottom: 0.25rem;
  }
  .shot-sb-episode-rail > a,
  .shot-sb-episode-rail > .shot-sb-episode-rail-item,
  #post-production-episode-rail > a,
  aside[aria-label="分集切换"] > a {
    flex: 0 0 auto !important;
  }
  #shot-storyboard-modal.shot-sb-workbench-modal,
  #shot-storyboard-modal {
    flex: 1 1 auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  #shot-storyboard-modal-body.shot-sb-workbench-cols {
    flex: none !important;
    flex-direction: column !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    min-height: 0 !important;
  }
  .shot-sb-workbench-col-thumbs,
  .shot-sb-workbench-col-detail,
  .shot-sb-workbench-col-history {
    flex: none !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    border-right: none !important;
    border-left: none !important;
  }
  .shot-sb-workbench-col-thumbs {
    border-bottom: 1px solid #e5e7eb !important;
  }
  .shot-sb-workbench-col-history {
    border-top: 1px solid #e5e7eb !important;
  }
  #shot-storyboard-thumbs,
  #shot-sb-image-history,
  #shot-sb-video-history,
  #shot-storyboard-detail {
    max-height: none !important;
    overflow: visible !important;
    height: auto !important;
    flex: none !important;
  }
  #shot-storyboard-thumbs > .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  /* 场景音乐 / 简易剧本 Tab：必须压过缩略图列的 display:!important */
  #shot-storyboard-modal-body.shot-sb-workbench-cols--scene-music #shot-sb-thumbs-col,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--scene-music #shot-storyboard-detail,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--scene-music #shot-sb-image-history,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--scene-music #shot-sb-video-history,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--script #shot-sb-thumbs-col,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--script #shot-storyboard-detail,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--script #shot-sb-image-history,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--script #shot-sb-video-history {
    display: none !important;
  }
  #shot-storyboard-modal-body.shot-sb-workbench-cols--scene-music #shot-sb-scene-music-wrap,
  #shot-storyboard-modal-body.shot-sb-workbench-cols--script #shot-sb-script-wrap {
    display: block !important;
    flex: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 12rem !important;
    overflow: visible !important;
  }
  .shot-sb-scene-music-table,
  .shot-sb-script-table {
    min-width: 0 !important;
    width: 100% !important;
  }
  .shot-sb-scene-music-table thead,
  .shot-sb-script-table thead,
  .shot-sb-scene-music-table colgroup,
  .shot-sb-script-table colgroup {
    display: none !important;
  }
  .shot-sb-scene-music-table,
  .shot-sb-scene-music-table tbody,
  .shot-sb-script-table,
  .shot-sb-script-table tbody {
    display: block !important;
    width: 100% !important;
  }
  .shot-sb-scene-music-table tbody tr,
  .shot-sb-script-table tbody tr {
    display: block !important;
    margin-bottom: 0.75rem;
    padding: 0.875rem 1rem;
    border: 1px solid #e5e7eb !important;
    border-radius: 0.75rem;
    background: #fff;
  }
  .shot-sb-script-table tbody tr.shot-sb-script-scene-sep {
    border: none !important;
    background: #f3f4f6 !important;
    box-shadow: none;
    padding: 0.65rem 0.875rem;
  }
  .shot-sb-scene-music-table tbody td,
  .shot-sb-script-table tbody td {
    display: block !important;
    width: 100% !important;
    padding: 0.4rem 0 !important;
    border: none !important;
    text-align: left !important;
    white-space: normal !important;
  }
  .shot-sb-scene-music-table tbody td[data-label]::before,
  .shot-sb-script-table tbody td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #9ca3af;
    margin-bottom: 0.15rem;
  }
  .shot-sb-scene-music-table tbody td.shot-sb-sm-td-audio audio {
    width: 100% !important;
    max-width: 100% !important;
  }
  #shot-sb-header-actions {
    width: 100%;
    justify-content: flex-start !important;
  }
  .shot-sb-main-tab {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    font-size: 0.8125rem !important;
    white-space: nowrap;
  }
  .shot-sb-workbench-tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* —— 主体/场景资产详情弹层：三栏改纵向 —— */
  #subject-assets-modal-body,
  #scene-assets-modal-body,
  #subject-assets-modal-right,
  #scene-assets-modal-right {
    flex-direction: column !important;
  }
  #subject-assets-modal-body > *,
  #scene-assets-modal-body > *,
  #subject-assets-modal-right > *,
  #scene-assets-modal-right > * {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
  }

  /* —— 策划案封面弹层 —— */
  #planning-cover-modal .grid.grid-cols-2 {
    grid-template-columns: 1fr !important;
    overflow-y: auto !important;
  }
  #planning-cover-history-list.grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* —— 宽表：保证可横滑、触控惯性 —— */
  .overflow-x-auto,
  .overflow-x-scroll {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  /* —— 成片页工具条 —— */
  #fv-batch-download-btn,
  #fv-batch-download-enhanced-btn,
  #fv-batch-enhance-btn,
  #fv-view-script-info-btn {
    flex: 1 1 auto;
    justify-content: center;
  }
  #fv-view-script-info-btn {
    margin-left: 0 !important;
    width: 100%;
  }

  /* —— Seedance 预览面板 —— */
  .seedance-preview-panel {
    width: calc(100vw - 1rem) !important;
    max-width: calc(100vw - 1rem) !important;
    max-height: calc(100dvh - 1rem) !important;
  }
  .seedance-preview-media--video,
  .seedance-preview-body .seedance-result-video {
    width: 100% !important;
    max-height: min(55vh, 55dvh) !important;
  }

  /* —— Footer 收紧 —— */
  footer.bg-gray-800 {
    margin-top: 2.5rem !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }

}

/* 分集剧本 / 后期：外层 flex-row 在小屏改列（用父级 class 辅助） */
@media (max-width: 900px) {
  .tools-episode-layout {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .tools-episode-layout > aside[aria-label="分集切换"],
  .tools-episode-layout > .shot-sb-episode-rail {
    width: 100% !important;
  }
}