/* ============================================================================
   mp.css —— 微信小程序（web-view 内 H5）的合规适配层样式
   ----------------------------------------------------------------------------
   只在 `?from=mp` 时由 mp.js 使用；类名统一 `cmm-` 前缀（全局唯一，
   避免与 style.css 里的既有类名冲突）。

   为什么独立文件而不是写进 style.css：
     ① style.css 是同事在频繁改的大文件，并行编辑会互相覆盖；
     ② 本文件只在 index.html 里排在 style.css **之后**加载，优先级可控；
     ③ 小程序适配随时可能要整体回滚，独立文件删掉即可。
   ============================================================================ */

.cmm-mask {
  position: fixed; inset: 0; z-index: 300;
  display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(45, 23, 8, .55);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
.cmm-card {
  width: min(90vw, 360px); background: #fff; border-radius: 20px;
  overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, .4);
}
.cmm-hd {
  position: relative; padding: 16px 46px; text-align: center;
  background: linear-gradient(135deg, #ff8a3d, #f95901);
  color: #fff; font-size: 16px; font-weight: 800;
}
.cmm-x {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px; border: none; border-radius: 50%;
  background: rgba(255, 255, 255, .22); color: #fff;
  font-size: 14px; line-height: 1; cursor: pointer;
}
.cmm-bd { padding: 20px 20px 22px; }
.cmm-tip {
  font-size: 13.5px; line-height: 1.75; text-align: center;
  color: var(--text2, #7a7a7a);
}
.cmm-urlrow {
  display: flex; align-items: center; gap: 10px; margin-top: 16px;
  padding: 11px 14px; border-radius: 12px;
  background: #fff7f2; border: 1px solid #ffe0cc;
}
.cmm-url {
  flex: 1; min-width: 0; font-size: 14.5px; font-weight: 700;
  color: #f95901; word-break: break-all;
}
.cmm-copy {
  flex: 0 0 auto; border: none; border-radius: 9px; padding: 7px 14px;
  background: #f95901; color: #fff; font-size: 13px; font-weight: 700;
  cursor: pointer;
}
.cmm-copy:active { transform: scale(.96); }
.cmm-btn {
  width: 100%; margin-top: 16px; padding: 13px; border: none;
  border-radius: 14px; cursor: pointer;
  background: linear-gradient(135deg, #ff8a3d, #f95901);
  color: #fff; font-size: 16px; font-weight: 800;
  box-shadow: 0 6px 16px rgba(249, 89, 1, .32);
}
.cmm-btn:active { transform: scale(.97); }
.cmm-btn-ghost {
  background: #fff; color: #f95901;
  border: 1.5px solid #ffd0b0; box-shadow: none;
}

/* 子页顶部的「未登录」非阻塞提示条（③ 登录规范用） */
.cmm-hint {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 14px; background: #fff7f2;
  border-bottom: 1px solid #ffe6d5;
  font-size: 12.5px; color: #a15a2c;
}
.cmm-hint-txt { flex: 1; min-width: 0; line-height: 1.5; }
.cmm-hint-go {
  flex: 0 0 auto; border: none; border-radius: 999px; padding: 5px 13px;
  background: #f95901; color: #fff; font-size: 12px; font-weight: 700;
  cursor: pointer;
}
.cmm-hint-go:active { transform: scale(.96); }

/* 复制成功后的临时提示（由 mp.js 动态插入/移除） */
.cmm-copied {
  margin-top: 10px; font-weight: 700; color: #f95901;
}

/* 内容安全提示浮条（② 内容安全：异步检测判违规时弹出）
   驳回原文要求「仅需提示用户所发布内容含违规信息」→ 只是告知，不带操作按钮，
   所以做成顶部浮条而不是弹窗：不打断用户当前操作，点不着也不会误触。 */
.cmm-sec-toast {
  position: fixed; left: 50%; top: 14px; z-index: 99998;
  transform: translateX(-50%);
  max-width: 88vw; padding: 11px 18px;
  background: rgba(29, 29, 31, .93); color: #fff;
  font-size: 13.5px; line-height: 1.5; text-align: center;
  border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
  animation: cmm-sec-in .22s ease-out;
  pointer-events: none;              /* 纯告知：绝不能挡住底下的按钮 */
  word-break: break-word;
}
.cmm-sec-toast-out { opacity: 0; transition: opacity .35s ease; }
@keyframes cmm-sec-in {
  from { opacity: 0; transform: translateX(-50%) translateY(-8px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}