/* ── M6 长按弹窗：找相似 + 商品反馈 ── */
/* 锚点白点 */
/* ═══【白点尺寸·14px 够明显】初心/效果/演变/根源/糊涂/禁止/严禁AI修改 ═══
   初心：长按卡片弹相似窗口的锚点白点要够大、够明显，用户一眼看到「长按的正是这张卡片」。
   效果：14px×14px + 白色 0.85 + 加强阴影，比原 10px 更醒目（长按/右键反馈清晰）。
   演变：曾 10px 太小、长按后看不清锚点在哪 → 调大到 14px。
   根源：10px 在手机高分辨率屏上视觉过小，锚点定位感弱。
   糊涂：曾只想到「白点要有」没考虑「白点要看清」，10px 几乎淹没在卡片图里。
   禁止：禁止白点改回 <14px（锚点必须醒目）；禁止白点加 pointer-events（须 pointer-events:none 不挡操作）。
   严禁AI修改：本规约是白点尺寸定稿，任何后续修改/续写/重排不得删除或精简上述七段，仅可追加。 */
.lp-dot {
  position: fixed;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: rgba(255,255,255,0.85);
  box-shadow: 0 0 4px rgba(0,0,0,0.3);
  z-index: 9998;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
/* 弹窗容器 */
.lp-overlay {
  position: fixed; inset: 0;
  z-index: 9997;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.3);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.lp-popup {
  background: #fff;
  border-radius: 14px;
  width: min(320px, 88vw);
  padding: 14px 16px;
  font-size: 13px;
  color: #333;
  /* 融合轮廓：filter drop-shadow 让「框+箭头」整体统一阴影（替代 box-shadow，否则箭头无阴影生硬断裂）；
     overflow 必须 visible（箭头旋转正方形完整露出、与框无缝融合），内容滚动交给 .lp-popup-body */
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.18));
  animation: lp-in 0.18s ease-out;
}
/* 内容滚动层：弹窗 overflow 保持 visible（箭头露出），内容滚动交内层，避免 overflow-y:auto 裁剪箭头 */
.lp-popup-body { max-height: 70vh; overflow-y: auto; }
@keyframes lp-in {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}
/* ═══【对话框箭头指向白点·绘本气泡】初心/效果/演变/根源/糊涂/禁止/严禁AI修改 ═══
   初心：相似弹窗要像绘本对话框，带三角形小尾巴指向白色锚点，让用户一眼看出「弹窗对应哪张卡片」。
   效果：lp-arrow-up 弹窗顶部朝上箭头、lp-arrow-down 弹窗底部朝下箭头；箭头用「旋转 45° 的白色圆角正方形」上半/下半露出成三角尾巴，
   与弹窗同色（白）无缝衔接、border-radius 3px 呼应弹窗圆角，轮廓柔和好看（非生硬 border 三角）；箭头水平 left 由 JS 设 --lp-arrow-left 对齐白点 x。
   演变：曾弹窗居中无箭头（白点孤悬、弹窗无指向）→ 加箭头指向白点。
   根源：无视觉连接，用户看不出弹窗与被长按卡片的对应关系。
   糊涂：曾只想到白点标记，没做弹窗→白点的指向箭头。
   禁止：禁止箭头加 pointer-events（须 none）；禁止箭头颜色非白（须与弹窗同色无缝）；禁止箭头冒弹窗圆角。
   严禁AI修改：本规约是对话框箭头定稿，任何后续修改/续写/重排不得删除或精简上述七段，仅可追加。 */
.lp-popup { position: relative; }
/* 气泡尾巴：旋转 45° 的白色圆角正方形，上半/下半露出成箭头，与弹窗同色无缝、圆角呼应（轮廓好看） */
.lp-popup.lp-arrow-up::before,
.lp-popup.lp-arrow-down::after {
  content: ''; position: absolute;
  left: var(--lp-arrow-left, 50%);
  width: 14px; height: 14px;
  background: #fff;
  transform: translateX(-50%) rotate(45deg);
  border-radius: 3px;
  pointer-events: none;
}
.lp-popup.lp-arrow-up::before { top: -7px; }
.lp-popup.lp-arrow-down::after { bottom: -7px; }
/* 顶部找相似栏 */
.lp-find-bar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 4px 0 10px;
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 10px;
}
.lp-find-bar .lp-find-label { font-weight: 600; font-size: 14px; }
.lp-find-bar .lp-find-more { font-size: 12px; color: #f60; text-decoration: none; }
/* 找相似商品 mini 列表 */
.lp-similar-list { display: flex; gap: 8px; overflow-x: auto; padding: 6px 0 10px; }
.lp-similar-item { flex: 0 0 72px; text-align: center; text-decoration: none; color: #333; }
.lp-similar-item img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; background: #f5f5f5; }
.lp-similar-item .lp-sim-price { font-size: 11px; color: #f60; font-weight: 600; margin-top: 2px; }
/* 按钮行 */
.lp-btn-row {
  display: flex; gap: 6px; flex-wrap: wrap;
  padding: 6px 0;
}
.lp-btn {
  flex: 1; min-width: 80px;
  padding: 7px 6px;
  border: 1px solid #e0e0e0; border-radius: 8px;
  background: #fafafa; color: #555;
  font-size: 12px; text-align: center;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: all 0.12s;
}
.lp-btn:active { background: #f0f0f0; transform: scale(0.97); }
/* 分割标题 */
.lp-section-title {
  font-size: 11px; color: #999;
  padding: 8px 0 4px;
  letter-spacing: 0.5px;
}
/* 卡片长按禁用选择 + 防 Firefox 长按预览 */
.waterfall-item { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: manipulation; }
.waterfall-item a { -webkit-touch-callout: none; touch-action: manipulation; }
.lp-find-more, .lp-similar-item { -webkit-touch-callout: none; touch-action: manipulation; }
/* ── 相似商品浮动窗口 ── */
.lp-sim-mask { position:fixed; top:52px; bottom:0; left:0; right:0; z-index:9990; background:rgba(0,0,0,0.4); }
.lp-sim-window { position:fixed; top:52px; bottom:0; left:0; right:0; z-index:9991; background:#FFFAF5; display:flex; flex-direction:column; max-width:1152px; margin:0 auto; border-radius:14px 14px 0 0; box-shadow:0 -4px 24px rgba(0,0,0,0.2); animation:lp-sim-up 0.25s ease-out; }
@keyframes lp-sim-up { from{transform:translateY(30%)} to{transform:translateY(0)} }
.lp-sim-header { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid #eee; flex-shrink:0; }
.lp-sim-header span { font-weight:600; font-size:16px; }
.lp-sim-close { border:0; background:none; font-size:22px; cursor:pointer; color:#999; line-height:1; }
.lp-sim-body { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; padding:8px; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.lp-sim-body .waterfall-grid { max-width:1152px; margin:0 auto; gap:12px; }
/* ═══ L3·卡片放大代替浮动窗（预览页雏形）🚫禁止 AI 删除 ═══
   初心：卡片自身 fixed 飞到全屏，替代 detailOverlay 浮动窗，无白屏、秒开、复用卡片已加载数据。
   效果：点卡片→飞满屏→图片撑满（信息区留底部）→点✕→飞回原位。
   机制：占位符 .card-zoom-placeholder 防 columns:2 reflow；JS 动态设 transition（避免覆盖 hover transform 动画）。 */
.card-zoom-full {
  left:0 !important; top:0 !important; width:100vw !important; height:100vh !important;
  border-radius:0 !important; z-index:999 !important; box-shadow:none !important;
  overflow-y:auto !important;
  padding-bottom: 80px; /* 🔒【M30005·给固定底部加购下单留空间】避免 foot 遮挡三份相册底部 */
  scrollbar-gutter:stable; /* 预留滚动条槽，点 MORE 详情飞入出现滚动条时内容不横跳（去抖动） */
}
/* P2·按压反馈：放大态 :active 保留 99% 极轻按压（几乎无感但不抖），:hover 禁用 translateY */
.waterfall-grid .waterfall-item.card-zoom-full:active { transform: scale(.99) !important; }
.waterfall-grid .waterfall-item.card-zoom-full:hover { transform: none !important; }
.card-zoom-full img { object-fit: cover; }
.card-zoom-full a.block img { max-height: calc(100vh - 150px) !important; width: 100%; object-fit: cover; } /* 🔒【M30008·首图满屏】52vh→calc(100vh-150px)：首图尽可能大，留 150px 给标题(图下)+footer(fixed bottom)按钮 */
.card-zoom-full a.block > div.bg-gray-100 { height: calc(100vh - 150px) !important; aspect-ratio: auto !important; } /* 🔒【M30006-V5C·白框修复】只给图片容器(bg-gray-100)设满屏高；原选择器 a.block > div 误伤标题区 wholesale-meta(MOQ行)撑成 694px 白框 */
.card-zoom-full .add-btn { display: none !important; } /* 🔒【M30008·加号去重】放大态 footer 已有加购按钮，隐藏卡片内加号按钮（重复） */
.card-zoom-close {
  position: fixed; top: 12px; right: 12px; width: 44px; height: 44px; border-radius: 50%;
  background: rgba(0,0,0,.45); color: #fff; font-size: 22px; line-height: 1;
  z-index: 1000; border: 0; cursor: pointer;
}
.card-zoom-placeholder { width: 100%; visibility: hidden; pointer-events: none; break-inside: avoid; }
/* L4-a·放大态型号条（4 缩略图） */
/* P1·SKU 田字格：首图下方第二视口（文档流，点 MORE 才加载），非 fixed bottom */
.card-zoom-sku-bar { position: relative; z-index: 10; margin: 8px 12px; }
.card-zoom-sku-row { display: flex; overflow-x: auto; gap: 8px; padding: 4px 0; -webkit-overflow-scrolling: touch; scrollbar-width: none; } /* 🔒【M30005·水平滚动缩略图条】对齐 V2 skuThumbRow，600px 田字格→单行滚动，手机一屏可看 */
.card-zoom-sku-thumb { width: 100%; aspect-ratio: 1; border-radius: 8px; object-fit: cover; background: #f3f4f6; border: 2px solid transparent; cursor: pointer; }
.card-zoom-sku-thumb.active { border-color: #e62929; }
/* P0·数量选择器 + 加购/下单按钮 */
.card-zoom-sku-foot { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1001; display: flex; gap: 8px; align-items: center; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #eee; } /* 🔒【M30005·加购下单固定底部】对齐 V2 safe-area 常驻，首屏可见 */
.cz-qty { display: flex; align-items: center; border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; flex-shrink: 0; }
.cz-qty-btn { width: 32px; height: 34px; border: none; background: #f9fafb; font-size: 16px; cursor: pointer; color: #333; }
.cz-qty-num { width: 40px; text-align: center; border: none; font-size: 14px; height: 34px; }
.cz-buy-btn { flex: 1; padding: 11px 0; border: none; border-radius: 10px; font-size: 14px; font-weight: 600; cursor: pointer; }
.cz-add { background: #fff3e0; color: #ff7a00; }
.cz-buy { background: #ff7a00; color: #fff; }
/* 两步展开·看描述入口（第二视口 SKU 下方 → 第三视口详情 TAB+描述像册） */
.card-zoom-specs { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 0; }
.card-zoom-specs-btn { padding: 6px 10px; border: 1px solid #ddd; border-radius: 8px; background: #fff; color: #333; font-size: 12px; cursor: pointer; }
/* 缩略图加载中：从点状(scale .1)旋转放大到正常(1.0)一次性入场 + 持续旋转；80 图加载完移除 sku-loading 后停止旋转、去模糊 */
.card-zoom-sku-thumb.sku-loading { filter: blur(3px); animation: sku-grow 0.5s ease-out backwards, sku-rotate 1.2s linear infinite; }
@keyframes sku-grow  { from { scale: 0; } to { scale: 1.0; } }
@keyframes sku-rotate { from { rotate: 0deg; } to { rotate: 360deg; } }
/* 型号条秒出灰框占位：从点状旋转放大入场（一次性 0.5s，非先显全尺寸）+ shimmer 流光 */
.card-zoom-sku-ph { width: 64px; height: 64px; border-radius: 8px; background: linear-gradient(90deg,#eee 25%,#f7f7f7 37%,#eee 63%); background-size: 400% 100%; animation: sku-ph-in 0.7s ease-out backwards, sku-shimmer 1.4s ease 0.7s infinite; flex-shrink: 0; }
@keyframes sku-ph-in { from { transform: scale(0) rotate(0deg); } to { transform: scale(1.0) rotate(360deg); } }
@keyframes sku-shimmer { 0%{background-position:100% 0} 100%{background-position:-100% 0} }
/* 🔒【M30006-V5·去扫光动画·0 等待】V5 内嵌态去掉型号条占位扫光 + 缩略图旋转模糊：小图秒开不需要扫光动画；zoom/overlay 基线不动 */
.card-zoom-v5 .card-zoom-sku-ph { animation: none !important; background: #f0f0f0; }
.card-zoom-v5 .card-zoom-sku-thumb.sku-loading { filter: none !important; animation: none !important; }
/* P2·MORE/登录解锁按钮 + 详情飞入容器（🚫禁止 AI 删除） */
.card-zoom-footer { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1001; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, rgba(255,255,255,0.9)); }
.card-zoom-more, .card-zoom-login { width: 100%; padding: 13px; border-radius: 12px; border: none; font-size: 15px; font-weight: 600; cursor: pointer; }
.card-zoom-more { background: #f3f4f6; color: #333; }
.card-zoom-login { background: #FF7A00; color: #fff; }
.card-zoom-detail { padding: 8px 0 70px; }
.card-zoom-detail-loading { text-align: center; padding: 24px; color: #999; font-size: 14px; }
/* P2·顶部导航：左箭头（关闭）+ 分享（老按钮，detail_overlay 同款） */
.card-zoom-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 1002; display: flex; align-items: center; justify-content: space-between; height: 48px; padding: env(safe-area-inset-top,0px) 16px 0; pointer-events: auto; }
.card-zoom-nav-btn { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; background: transparent; padding: 0; }
/* P2·详情增量要素（真实价 + 多图 + 描述，飞入后显示） */
.card-zoom-price { display: flex; align-items: baseline; gap: 8px; padding: 8px 0; }
.card-zoom-price-now { font-size: 22px; font-weight: 700; color: #e62929; }
.card-zoom-price-old { font-size: 13px; color: #999; text-decoration: line-through; }
/* P1·描述像册：16 格田字格（相册图 + 描述图合并），点格子阶梯浮现看大图 */
.card-zoom-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 4px 0; }
.card-zoom-gallery img { width: 100%; aspect-ratio: 1; border-radius: 6px; object-fit: cover; background: #f3f4f6; cursor: zoom-in; }
/* P1·描述像册大图列表（前 3 张默认显示 + 点过追加复用不销毁） */
.card-zoom-big-list { display: flex; flex-direction: column; gap: 8px; padding: 8px 0; }
.card-zoom-big-list .cz-big-img { width: 100%; border-radius: 6px; }
.card-zoom-desc { padding: 8px 0; }
.card-zoom-desc img { max-width: 100%; border-radius: 6px; }
/* P2·详情多图加载：只模糊→清晰（无缩放无旋转，避免「整个页面缩放」吓人） */
.card-zoom-gallery img.cz-img { filter: blur(8px); }
.card-zoom-gallery img.cz-img.zoomed { filter: none; transition: filter 0.4s ease-out; }
/* P2·翻译进度悬浮按钮（保留 detail-overlay FAB 进度条） */
.card-zoom-detail .cz-fab { position: fixed; right: 12px; bottom: 80px; z-index: 1003; background: rgba(0,0,0,0.72); color: #fff; border: none; border-radius: 20px; padding: 8px 14px; font-size: 13px; pointer-events: none; }
/* 🔒【战术3·翻译进度 FAB·BAK 完整】⟳ 旋转图标 + 秒数 + 进度条 X/Y */
.card-zoom-detail .cz-fab-spin { display: inline-block; animation: cz-spin 1s linear infinite; }
@keyframes cz-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* P2·详情 TAB（描述 | 规格参数） */
.cz-tabs { display: flex; border-bottom: 1px solid #eee; margin: 6px 0 10px; position: sticky; top: 0; background: #fff; z-index: 10; } /* 战术4·吸顶 TAB：滚动详情时 TAB 吸顶不跑 */
.cz-tab-btn { flex: 1; padding: 10px; background: none; border: none; font-size: 14px; color: #666; cursor: pointer; border-bottom: 2px solid transparent; }
.cz-tab-btn.active { color: #e62929; border-bottom-color: #e62929; font-weight: 600; }
.cz-attr-table { width: 100%; border-collapse: collapse; }
.cz-attr-table tr { border-bottom: 1px solid #f3f4f6; }
.cz-attr-table td { padding: 8px 6px; font-size: 13px; word-break: break-word; }
.cz-attr-k { color: #999; width: 40%; vertical-align: top; }
.cz-attr-v { color: #333; }
/* P2·嵌套瀑布推荐（0等待：复用首页已加载卡片数据，双列瀑布） */
.cz-nested-divider { margin-top: 32px; border-top: 8px solid #efefef; }
.cz-nested-header { padding: 20px 12px 12px; font-size: 15px; font-weight: 600; color: #333; }
.cz-nested-waterfall { padding: 0 12px; column-count: 2; column-gap: 10px; }
.cz-nested-card { break-inside: avoid; background: #fff; border-radius: 8px; overflow: hidden; margin-bottom: 10px; cursor: pointer; }
.cz-nested-card img { width: 100%; display: block; }
.cz-nested-info { padding: 10px; }
.cz-nested-title { font-size: 13px; color: #222; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cz-nested-price { margin-top: 4px; font-size: 15px; font-weight: 700; color: #e62929; }
/* P1·阶梯 opacity 浮现大图（代替主图轮播）：点田字格缩略图 → 全屏大图阶梯浮现，点大图重置 */
.card-zoom-overlay-big { position: fixed; inset: 0; z-index: 1005; width: 100%; height: 100%; object-fit: contain; background: #000; opacity: 0; pointer-events: none; }
.card-zoom-overlay-big.show { pointer-events: auto; cursor: zoom-out; }
/* P1·评价模块（保留，total>0 显示 Tab，无评价隐藏） */
.cz-review-list { padding: 8px 0; }
.cz-review-item { padding: 10px 0; border-bottom: 1px solid #f3f4f6; }
.cz-review-head { display: flex; justify-content: space-between; align-items: center; }
.cz-review-name { font-size: 13px; color: #666; }
.cz-review-star { color: #f5a623; font-size: 13px; }
.cz-review-content { margin-top: 4px; font-size: 13px; color: #333; line-height: 1.5; }
/* P1·相册多图 Load more 按钮（初始 3 张，点一次 +5 张） */
.cz-load-more { display: block; width: 100%; margin: 8px 0; padding: 10px; background: #f3f4f6; border: none; border-radius: 8px; font-size: 14px; color: #333; cursor: pointer; }
/* P1·SKU 田字格每格 = 图 + 型号文字 + 下单 EMOJI（主图田字格无） */
.card-zoom-sku-cell { position: relative; cursor: pointer; flex: 0 0 48px; } /* 🔒【M30005·水平条每格 48px】缩小避免 SKU 条过高被底部下单遮挡 */
.card-zoom-sku-cell.sold-out { opacity: 0.4; pointer-events: none; } /* 战术6·缺货置灰禁选 */
.card-zoom-sku-stock { font-size: 11px; color: #999; text-align: center; margin-top: 2px; }
.card-zoom-sku-cell .card-zoom-sku-thumb { display: block; }
.card-zoom-sku-name { font-size: 11px; color: #333; margin-top: 3px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3; }
.card-zoom-sku-emoji { position: absolute; top: 4px; right: 4px; font-size: 14px; }
/* P1·SKU 田字格每格价格 + 选中标记（✓ 勾选 + 红框 + 价格高亮） */
.card-zoom-sku-price { font-size: 12px; color: #e62929; font-weight: 600; text-align: center; margin-top: 2px; }
.card-zoom-sku-cell.active .card-zoom-sku-thumb { border-color: #e62929; }
.card-zoom-sku-cell.active .card-zoom-sku-name { color: #e62929; font-weight: 600; }
/* 🔒【M30006-V5C·MORE 晃动 + 选型条下滑】点 MORE 后 MORE 按钮晃动（loading 提示），选型条到位后下滑展开 */
@keyframes v5cShake {
  0%,100% { transform: translateX(0); }
  25% { transform: translateX(-3px); }
  50% { transform: translateX(3px); }
  75% { transform: translateX(-2px); }
}
.card-zoom-full .card-zoom-more.shaking {
  animation: v5cShake 0.4s ease-in-out infinite;
}
@keyframes v5cSlideIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.v5c-bar.v5c-slide-in {
  animation: v5cSlideIn 0.28s ease-out;
}
/* 🔒【M30006-V5C·sheet 弹窗层级】z-index 提升到 9999/10000，确保在 V2 弹窗(z-60)之上，点入口型号列表不被 V2 盖住 */
.v5c-mask { z-index: 9999 !important; }
.v5c-sheet { z-index: 10000 !important; }
.card-zoom-sku-cell.active::after { content: '✓'; position: absolute; top: 4px; left: 4px; width: 18px; height: 18px; background: #e62929; color: #fff; border-radius: 50%; font-size: 12px; line-height: 18px; text-align: center; }