/* ============================================================
   base.css · reset、字体、通用控件、热区、滚动容器
   色值一律来自 tokens.css（本文件零十六进制）
   ============================================================ */

*,
*::before,
*::after { box-sizing:border-box; }

html,
body {
  height:100%;
  margin:0;
  padding:0;
}

/* 满屏无滚动：滚动发生在各层容器内部（架构文档 §5.2） */
html { -webkit-text-size-adjust:100%; }

body {
  background:var(--bg-gradient);
  background-attachment:fixed;
  color:var(--ink);
  font-family:-apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue",
              "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
  overflow:hidden;
  overscroll-behavior:none;
  user-select:none;
}

/* 文章正文允许选中复制（留言是要被反复读的话） */
.cmm-selectable { user-select:text; -webkit-user-select:text; }

img { max-width:100%; display:block; }

button,
input,
textarea,
select {
  font:inherit;
  color:inherit;
}

button {
  border:none;
  background:none;
  padding:0;
  cursor:pointer;
}

/* ── 通用按钮 ── */
.cmm-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--sp-2);
  min-height:var(--hit);
  min-width:96px;
  padding:0 var(--sp-4);
  border-radius:var(--r-pill);
  font-size:15px;
  font-weight:500;
  transition:transform var(--d-fast) var(--ease-out), opacity var(--d-fast) var(--ease-out);
}
.cmm-btn:active { transform:scale(.97); }
.cmm-btn:disabled { opacity:.45; cursor:not-allowed; transform:none; }

.cmm-btn--primary { background:var(--blue-600); color:var(--white); }

.cmm-btn--ghost {
  background:var(--white-glass);
  color:var(--ink);
  box-shadow:inset 0 0 0 1px var(--blue-200);
}

.cmm-btn--danger { background:var(--pink); color:var(--ink); }

.cmm-btn--block { width:100%; }

/* ── 图标按钮（热区 ≥44px，图标本身小一点没关系） ── */
.cmm-icon-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:var(--hit);
  height:var(--hit);
  color:var(--ink-soft);
  border-radius:var(--r-pill);
  transition:color var(--d-fast) var(--ease-out), background var(--d-fast) var(--ease-out);
}
.cmm-icon-btn:active { background:var(--blue-100); color:var(--ink); }

.cmm-icon-btn svg { width:22px; height:22px; display:block; }

.cmm-icon-btn--sm svg { width:18px; height:18px; }

/* ── 图标尺寸类 ── */
.cmm-ic { display:inline-flex; }
.cmm-ic svg { display:block; }
.cmm-ic--18 svg { width:18px; height:18px; }
.cmm-ic--22 svg { width:22px; height:22px; }
.cmm-ic--28 svg { width:28px; height:28px; }

/* ── 输入框 ── */
.cmm-input,
.cmm-textarea {
  width:100%;
  min-height:var(--hit);
  padding:var(--sp-3) var(--sp-4);
  border:none;
  border-radius:var(--r-chip);
  background:var(--white-glass);
  box-shadow:inset 0 0 0 1px var(--blue-200);
  color:var(--ink);
  outline:none;
  transition:box-shadow var(--d-fast) var(--ease-out);
}
.cmm-input:focus,
.cmm-textarea:focus { box-shadow:inset 0 0 0 2px var(--blue-500); }

.cmm-input::placeholder,
.cmm-textarea::placeholder { color:var(--ink-soft); }

.cmm-textarea {
  min-height:120px;
  resize:vertical;
  line-height:1.7;
}

/* ── 滚动容器（iOS 惯性滚动 + 隐藏滚动条） ── */
.cmm-scroll {
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-width:none;
}
.cmm-scroll::-webkit-scrollbar { display:none; }

/* ── 视觉隐藏（供屏幕阅读器） ── */
.cmm-sr {
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

/* ── 通用卡片底（毛玻璃按 WECHAT-CONSTRAINTS R3 三层写法降级：
      先兜底实色（不透明度 ≥0.90），再 @supports 内启用毛玻璃并调淡底色；
      -webkit- 前缀必须写在标准属性之前） ── */
.cmm-glass {
  background:rgba(255,255,255,.94);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .cmm-glass {
    background:var(--white-glass);
    -webkit-backdrop-filter:var(--blur-glass);
    backdrop-filter:var(--blur-glass);
  }
}