/* ============================================================
   mobile.css — 手机端（竖屏 ≤700px）适配
   原则：
   · 所有内容全部竖向排列，上下滑动自由不受阻碍；
   · 电脑上"上下滑动 = 轮播左右滑动"的滚动驱动在手机上停用
     （方向卡改为竖向堆叠全部呈现，手动上下滑动浏览）；
   · 用户需要左右滑动的地方（日历）保留手动横向拖拽（touch-action: pan-y，
     纵向滚动仍归页面）；
   · 三大板块标题（顶栏导航按钮）在手机端展示（见 main.css）。
   ============================================================ */

/* ---------- 方向轮播：改竖向堆叠，停用滚动驱动 ---------- */
@media (max-width: 700px) {
  .dir-scroll-zone { height: auto; }
  .dir-sticky { position: static; height: auto; display: block; padding: 0; }
  .dir-viewport {
    width: 100%;
    margin-left: 0;
    cursor: default;
    padding: 0;
    touch-action: pan-y;
  }
  .dir-viewport.dragging { cursor: default; }
  .dir-strip {
    flex-direction: column;
    gap: 16px;
    padding: 4px 2px 10px;
    transform: none !important;
  }
  .dir-card {
    width: 100%;
    min-width: 0;
    max-width: 560px;
    margin: 0 auto;
  }
  .dir-card.is-active,
  .dir-card.is-side,
  .dir-card.is-far {
    transform: none;
    opacity: 1;
    box-shadow: none;
    z-index: auto;
  }
  .dir-card.is-active { border-color: rgba(255, 255, 255, .2); }
  .dir-sticky .dir-ctl { display: none; }
}

/* ---------- 日历：横向拖拽保留，纵向滚动放行 ---------- */
@media (max-width: 700px) {
  .cal-viewport { touch-action: pan-y; -webkit-mask-image: none; mask-image: none; }
  .cal-month { width: min(92vw, 420px); min-width: 0; }
  .cal-strip { padding: 8px 2px 14px; }
  .cal-hint { display: none; } /* 提示语留桌面，手机端直接拖动即可 */
  .cal-block .block-head { flex-wrap: wrap; }
}

/* ---------- 通用区块横向并列 → 竖向 ---------- */
@media (max-width: 700px) {
  /* IDE 工作台已由 ide.css 处理（1 列） */
  .section { padding: 40px 14px 24px; }
  .section-head { margin-bottom: 24px; }
  .section-title { font-size: 24px; }
  .section-note { font-size: 12px; }

  /* 四方向名片：1 列 */
  .dir-cards { grid-template-columns: 1fr; }
  .dir-cards-note { display: block; width: 100%; }

  /* 学习资源：1 列（860 断点已处理，这里收紧间距） */
  .res-layout { gap: 16px; }
  .res-big { font-size: 34px; }

  /* 关于我们：成员网格 1 列；三段/导师网格已由 about.css 处理 */
  .mag-member-grid { grid-template-columns: 1fr; }
  .mag-member {
    border-left: none !important;
    border-top: 1px solid var(--ink);
  }
  .mag-member:first-child { border-top: none; }
  .mag-member:nth-child(2) { border-top: 1px solid var(--ink); }
  .mag-member:nth-child(4n+1) { border-left: none !important; }

  /* 报名表：单列字段 */
  .af-section-grid { grid-template-columns: 1fr !important; }
  /* 任务游戏 iframe：手机端游戏容器可横向滚动（3D/机械臂游戏宽度大），高度自适应 */
  .game-frame { overflow-x: auto; }
  .game-iframe { min-width: 640px; height: 56vh !important; }
  /* 全屏时占满视口（覆盖上面的 min-width/56vh）—— 后者加载靠后同样 !important，用选择器权重胜出 */
  .game-frame:fullscreen .game-iframe,
  .game-frame.game-frame-fixed .game-iframe {
    min-width: 0 !important;
    height: 100vh !important;
  }
}

/* ---------- 手机端小块标题不换行 ---------- */
@media (max-width: 700px) {
  .block-title { font-size: 19px; }
  .block-head { gap: 10px; }
  .faq-q { gap: 8px; padding: 13px 14px; }
  .faq-a-inner { padding: 2px 16px 15px 38px; }
  .join-phases .join-phase { padding: 12px 14px; }
  .task-card { padding: 15px 15px; }
  .apply-wrap { grid-template-columns: 1fr; }
  .apply-qq { position: static; }
  .apply-submit-row { flex-direction: column; align-items: stretch; }
  .apply-submit-row .af-submit { width: 100%; }

  /* 胶片海报窗口（编辑排版）：撑满可用宽度 */
  .film-window { width: calc(100vw - 20px); max-height: 94vh; }
  .film-topbar { flex-wrap: wrap; gap: 8px; }
  .film-tools { width: 100%; justify-content: flex-end; }
}