/* ============================================================
 * mobile31.css —— p139 手機版：窗口不溢出屏幕
 *
 * 用戶要求「不要在屏幕尺寸之外彈窗；盡量把應用壓縮至手機屏幕尺寸之內」。
 *
 * 三件事：
 *   ① `.win` 加 `max-width/max-height:100vw/100vh` —— 即使 JS 沒來得及跑，
 *      純 CSS 也不讓窗口畫到屏幕外。
 *   ② 標題欄與窗口內容 **禁止瀏覽器接管手勢**（`touch-action:none`）——
 *      這是「手機拖不動窗口」的**根因**：不設它，手指一動就被判成頁面滾動，
 *      瀏覽器發 `pointercancel`，wm.js 的拖拽立刻收尾 ⇒ 看上去完全拖不動。
 *      只對標題欄與縮放柄設 none；正文區仍允許滾動（不能整站鎖死）。
 *   ③ `body` 關掉橫向溢出與雙擊縮放，避免窗口被拖出邊界後整頁橫向滾動。
 *
 * ⚠️ 只在 `<html class="is-mobile">` 下生效 —— `js/mobile31.js` 依 UA 打這個記號。
 *    桌面瀏覽器不受任何影響（桌面版對像素極敏感，不能誤傷）。
 * ============================================================ */

html.is-mobile body {
  overflow: hidden !important;          /* 窗口一律在視口內，不需要整頁滾動 */
  overscroll-behavior: none;
  -webkit-text-size-adjust: 100%;
  touch-action: manipulation;
}

/* ① 窗口永不超出視口 */
html.is-mobile .win {
  max-width: 100vw !important;
  max-height: 100vh !important;
  box-sizing: border-box;
}

/* ② 標題欄：手指按住就能拖，不被判成頁面滾動 */
html.is-mobile .win .titlebar {
  touch-action: none !important;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
/* 標題欄上的按鈕同樣吃觸摸（不設 none 會被滾動手勢搶走） */
html.is-mobile .win .titlebar > .tb-btn,
html.is-mobile .win .titlebar > .tb-sys {
  touch-action: none !important;
}

/* 縮放柄（若窗口可縮放）：手機上允許拖，但不接管滾動 */
html.is-mobile .win .win-resize {
  touch-action: none !important;
}

/* ③ 客戶區仍可正常滾動 —— 不能被上面的規則波及 */
html.is-mobile .win .win-client {
  touch-action: pan-x pan-y;
  overscroll-behavior: contain;         /* 滾到底不要把整頁帶著彈 */
  -webkit-overflow-scrolling: touch;
}

/* 手機上把「桌面圖標」稍微放大，手指好點 */
html.is-mobile .icon-item {
  min-width: 68px;
}
html.is-mobile .icon-item .icon-img {
  transform: scale(1.12);
  transform-origin: center;
}

/* 開始功能表 / 各類彈層：別超出視口寬度 */
html.is-mobile .start-menu,
html.is-mobile .wd-dlg,
html.is-mobile .s31-pop,
html.is-mobile .menu-pop {
  max-width: calc(100vw - 8px) !important;
  max-height: calc(100vh - 8px) !important;
  overflow: auto;
  box-sizing: border-box;
}

/* ============================================================
 * 關於頁（p139）—— 正文 + 免責聲明彈層
 * 放在本文件而不是 v7.css：v7.css 是並發線的熱點，且這裡全是 p139 新增的類。
 * ============================================================ */

/* 關於頁正文：行距放鬆、跟隨主題字色 */
.ab31-intro {
  margin: 0 0 10px;
  line-height: 1.75;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.ab31-actions {
  margin-top: 12px;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.ab31-actions .btn31 { min-width: 76px; }

/* 免責聲明彈層：長文可滾，標題/正文分行，末行版權置中 */
.ab31-dl {
  overflow: auto;
  padding: 4px 2px 8px;
  line-height: 1.75;
}
.ab31-dl-title { margin: 2px 0 8px; font-size: 13px; }
.ab31-dl-intro { margin: 0 0 10px; }
.ab31-dl-h { margin: 12px 0 4px; }
.ab31-dl-p {
  margin: 0 0 6px;
  text-indent: 2em;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.ab31-dl-tail {
  margin: 14px 0 4px;
  padding-top: 8px;
  border-top: 1px solid #808080;
  color: #404040;
  text-align: center;
}

/* 手機：彈層字號略小一點，行距保留（法律文本要好讀） */
html.is-mobile .ab31-dl { font-size: 12px; }
html.is-mobile .ab31-intro { font-size: 12px; }
