/* ============================================================
 * ui-polish.css — 全站 UI 比例与质感优化（2026-10-20）
 * ① 灵动岛按钮行手机端收紧，不再两头溢出被切
 * ② muse hero 压缩高度 + 统计三格并排（原来 2+1 掉行）
 * ③ 首页 door 卡描边+内高光，黑卡在黑底上也有轮廓
 * ④ 手机端输入框 16px，防 iOS 聚焦自动放大
 * ⑤ 卡片统一柔和阴影
 * ============================================================ */

* { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
img { max-width: 100%; }

/* ⑤ 卡片质感：柔和投影 + 顶部一道微高光 */
.svc-card {
  box-shadow: 0 6px 20px rgba(2, 6, 18, .28), inset 0 1px 0 rgba(255, 255, 255, .05);
}

/* ③ 首页 door 大卡：描边 + 内高光 + 落影，轮廓立起来 */
.home-door-card {
  border: 1px solid rgba(255, 255, 255, .10) !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .09) !important;
}

@media (max-width: 640px) {
  /* ① 灵动岛：按钮行整体收紧，一行放下，不再溢出屏幕 */
  #dynamicIsland.island { padding-left: 10px !important; padding-right: 10px !important; }
  .island-actions {
    align-self: stretch;
    flex-wrap: nowrap !important;
    gap: 5px !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -webkit-mask-image: linear-gradient(90deg, #000 94%, transparent 100%);
    mask-image: linear-gradient(90deg, #000 94%, transparent 100%);
  }
  .island-actions::-webkit-scrollbar { display: none; }
  .island-actions > button, .island-actions .lang-toggle { flex-shrink: 0; }
  .island-actions > button,
  .island-actions .btn-island,
  .island .lang-btn {
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 12px !important;
    min-height: 38px !important;
    height: 38px !important;
    border-radius: 9px !important;
    white-space: nowrap;
  }
  .island .lang-btn { min-width: 0 !important; }
  .island .lang-toggle {
    padding: 2px !important;
    min-height: 38px !important;
    height: 38px !important;
    flex-shrink: 0;
  }
  /* 分段导航右缘渐隐，提示还能往右滑 */
  .island-segs {
    -webkit-mask-image: linear-gradient(90deg, #000 93%, transparent 100%);
    mask-image: linear-gradient(90deg, #000 93%, transparent 100%);
  }

  /* ② muse hero：高度压缩，统计改三格并排 */
  .muse-hero { padding: 30px 18px !important; margin-bottom: 18px !important; }
  .muse-hero > div > div:last-child {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px !important;
    flex-wrap: nowrap !important;
    margin-top: 18px !important;
  }
  .muse-hero > div > div:last-child > div {
    min-width: 0 !important;
    padding: 12px 4px !important;
    border-radius: 12px !important;
  }
  .muse-hero > div > div:last-child > div > div:first-child { font-size: 21px !important; }
  .muse-hero > div > div:last-child > div > div:last-child { font-size: 11px !important; }

  /* ④ 输入框 16px：iOS 点聚焦不再自动放大页面 */
  input, select, textarea { font-size: 16px !important; }
}

/* ---------- 第二轮手机巡检修复（428 宽实测） ---------- */
@media (max-width: 960px) {
  /* 页头小标题在手机上整个被灵动岛盖住，副标题换两行时还会透出一截"鬼影"：
     隐形但保留占位，布局高度不变 */
  .page-context { visibility: hidden; }
}
@media (max-width: 640px) {
  /* 聊天焚烧时间下拉加宽，文字不被箭头挤住 */
  .chat-ttl { min-width: 106px !important; font-size: 13px !important; }

  /* 表格通用：手机上字号与内距收紧，尽量一屏放下 */
  main table th, main table td { padding: 10px 8px !important; font-size: 13px !important; }
  /* 桌面规则给表格设了 min-width:560px，手机上把短表格也硬撑出屏幕，一律解除 */
  .table-wrap table { min-width: 0 !important; }

  /* 免税州生成结果改堆叠排版：标签一行、地址一行（可换行）、复制钮在地址右侧 */
  #tfOut .table-wrap { overflow-x: visible !important; }
  #tfOut table { width: 100% !important; min-width: 0 !important; }
  #tfOut tr { display: flex; flex-wrap: wrap; align-items: center; row-gap: 2px; }
  #tfOut td { display: block; border: none !important; }
  #tfOut td.sym { flex: 1 1 100%; white-space: normal !important; font-size: 12px !important; }
  #tfOut td:nth-child(2) { flex: 1 1 auto; min-width: 0; }
  #tfOut td:nth-child(2) strong { word-break: break-all; }
  #tfOut td:last-child { width: auto !important; flex: 0 0 auto; }
}

/* ---------- 第三轮：多设备适配（ui5，12 机型实测） ---------- */
/* 安卓 Chrome 横屏字号自动放大防护 + 点按灰闪/延迟消除 */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
a, button { -webkit-tap-highlight-color: transparent; }
@media (pointer: coarse) {
  a, button, input, select, textarea, .nav-btn { touch-action: manipulation; }
}

/* ① 平板/窄桌面（≥961）：灵动岛是 max-content 定宽，内容超宽时动作按钮被挤出屏幕。
   让分段导航与动作区都可横向滑动、允许收缩，按钮本
   身不缩——1024 宽 iPad 横屏起全部按钮可达 */
@media (min-width: 961px) {
  #dynamicIsland.island { justify-content: flex-start; }
  #dynamicIsland .island-segs {
    flex: 1 1 auto; min-width: 0;
    overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  #dynamicIsland .island-segs::-webkit-scrollbar { display: none; }
  #dynamicIsland .island-actions {
    flex: 0 1 auto; min-width: 0;
    overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  #dynamicIsland .island-actions::-webkit-scrollbar { display: none; }
  #dynamicIsland .island-seg, #dynamicIsland .island-actions .btn-island { flex-shrink: 0; }
  #dynamicIsland .island-brand, #dynamicIsland .login-btn { flex-shrink: 0; }
}

/* ② 触控目标放大（仅触屏，桌面密度不变）：卡片外链 19px→32px 高，点了不费劲 */
@media (pointer: coarse) {
  .ext-link { display: inline-flex; align-items: center; min-height: 32px; padding: 3px 1px; }
  .apple-hero .cta a { display: inline-flex; align-items: center; min-height: 40px; }
  #dynamicIsland .island-actions .btn-island { min-height: 36px; }
}

/* ③ 矮屏手机（iPhone SE/小安卓，高度 ≤720）：灵动岛压缩，把竖向空间还给内容 */
@media (max-width: 960px) and (max-height: 720px) {
  .island#dynamicIsland { gap: 6px !important; padding-top: 5px !important; padding-bottom: 5px !important; }
  .island .nav-btn.island-seg { min-height: 34px !important; height: 34px !important; }
  #dynamicIsland .island-actions .btn-island { padding-top: 5px !important; padding-bottom: 5px !important; }
}

/* ④ 首页大标题副标题断行平衡，避免末行落单字 */
.apple-hero h1, .apple-hero p { text-wrap: balance; }

/* ⑤ 横屏刘海机：灵动岛左右让出安全区 */
@media (orientation: landscape) and (pointer: coarse) {
  .island#dynamicIsland {
    width: min(720px, calc(100vw - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))) !important;
  }
}
@media (orientation: landscape) and (pointer: coarse) and (min-width: 961px) {
  .island#dynamicIsland { width: max-content !important; max-width: calc(100vw - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) !important; }
}