/* 云契永承合规文档共用样式。
 *
 * 这些页面主要在 App 的 WebView 里打开，屏幕宽度不定。样式只做三件必要的事：
 * 限住正文宽度、放宽行距、让表格在窄屏下横向滚动。其余一律交给浏览器默认样式——
 * 协议正文要的是读得清楚，不是好看，样式越少越不会在某个机型上排版跑掉。
 */

:root {
  /* 固定浅色：正文里有靠颜色区分的待填标记，跟随系统深色会反成一片看不清 */
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

body {
  max-width: 44rem;
  margin: 0 auto;
  padding: 1.5rem 1rem 3rem;
  font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  line-height: 1.8;
  color: #222;
  background: #fff;
  word-break: break-word;
  -webkit-text-size-adjust: 100%;
}

h1 {
  font-size: 1.4rem;
  margin: 0 0 0.5rem;
}

h2 {
  font-size: 1.15rem;
  margin: 2rem 0 0.75rem;
}

h3 {
  font-size: 1rem;
  margin: 1.5rem 0 0.5rem;
}

a {
  color: #0e7a60;
}

.doc-head {
  border-bottom: 1px solid #eee;
  padding-bottom: 1rem;
}

.platform,
.meta,
.desc,
footer {
  color: #666;
  font-size: 0.875rem;
}

.platform {
  margin: 0 0 0.25rem;
}

.meta {
  margin: 0;
}

.meta span + span::before {
  content: "·";
  margin: 0 0.5em;
}

/* 需要格外留意的句子。长文里靠加粗停住视线就够了 */
.mark,
.doc-list .title {
  font-weight: 700;
}

.notice {
  border-left: 3px solid #ccc;
  padding-left: 0.75rem;
  margin: 1rem 0;
}

.notice.warn {
  border-left-color: #d93b32;
}

/* 上架前必须替换的主体信息，刷成红色让漏填在任何一次预览里都刺眼 */
.todo {
  color: #d93b32;
}

/* 清单类内容必须是结构化表格。窄屏放不下就整体横向滚动，
   不用换行硬挤——挤出来的表格比滚动更难读 */
.table-scroll {
  overflow-x: auto;
  margin: 1rem 0;
}

table {
  border-collapse: collapse;
  width: 100%;
  min-width: 30rem;
  font-size: 0.875rem;
  line-height: 1.65;
}

th,
td {
  border: 1px solid #ddd;
  padding: 0.5rem 0.625rem;
  text-align: left;
  vertical-align: top;
}

thead th {
  background: #f5f5f5;
}

.toc,
.doc-list {
  list-style: none;
  padding: 0;
}

.toc {
  counter-reset: toc;
}

.toc li::before {
  counter-increment: toc;
  content: counter(toc) ". ";
  color: #666;
}

.doc-list li {
  padding: 0.5rem 0;
}

.doc-list li + li {
  border-top: 1px solid #eee;
}

.doc-list a {
  color: inherit;
  text-decoration: none;
}

footer {
  margin-top: 2.5rem;
  border-top: 1px solid #eee;
  padding-top: 1rem;
  text-align: center;
}
