/* rules 页私有样式：一律写在 #pg-rules 下面。版式学苹果隐私页：大字、留白有节奏、一条一屏。 */

/* ---------- 首屏 ---------- */
#pg-rules .ru-hero { padding: 56px 0 72px; }
#pg-rules .ru-head { display: flex; flex-direction: column; align-items: center; text-align: center; }
#pg-rules .ru-badge { width: 72px; height: 72px; border-radius: 50%; background: var(--bg-2); color: var(--ink); display: flex; align-items: center; justify-content: center; }
#pg-rules .ru-head .h1 { font-size: var(--t72); line-height: 1.06; }
/* 三栏不用灰卡：一条细线压顶，栏与栏之间一根竖线（学苹果隐私页的三根柱子）。用 subgrid 让三栏的后果行、链接行对齐。 */
#pg-rules .ru-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto auto auto; margin-top: 48px; border-top: 1px solid var(--line); }
#pg-rules .ru-pillar { position: relative; display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; align-content: start; padding: 28px 40px 4px; text-align: left; }
#pg-rules .ru-pillar:first-child { padding-left: 0; }
#pg-rules .ru-pillar:last-child { padding-right: 0; }
#pg-rules .ru-pillar + .ru-pillar { border-left: 1px solid var(--line-2); }
#pg-rules .ru-n { font-size: var(--t56); font-weight: 300; line-height: 1; font-variant-numeric: tabular-nums; }   /* 序号类大数字全站统一 300 细体（跟工具页「怎么用」1 2 3 一样） */
#pg-rules .ru-pt { font-size: var(--t28); font-weight: 700; line-height: 1.36; margin-top: 20px; text-wrap: balance; }
/* 只在标点处断行，免得把「联系方式」拆成两行 */
#pg-rules .ru-pt, #pg-rules .ru-txt .h2 { word-break: keep-all; overflow-wrap: break-word; }
#pg-rules .ru-pc { font-size: var(--t21); font-weight: 400; line-height: 1.45; color: var(--ink); margin-top: 10px; }
/* 「看这一条」是文字链接（点了跳到下面那一条），v7.2 苹果蓝；整栏可点，鼠标放在栏上就出下划线 */
#pg-rules .ru-more { display: inline-flex; align-items: center; gap: 6px; justify-self: start; align-self: end; margin-top: 24px; font-size: var(--t15); color: var(--accent);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: transparent; transition: color var(--dur) var(--ease), text-decoration-color var(--dur) var(--ease); }
#pg-rules .ru-more svg { transform: rotate(90deg); transition: transform var(--dur) var(--ease); }
#pg-rules .ru-more::after { content: ""; position: absolute; inset: 0; }      /* 整栏可点 */
#pg-rules .ru-pillar:hover .ru-more, #pg-rules .ru-more:focus-visible { text-decoration-color: currentColor; }
#pg-rules .ru-pillar:hover .ru-more svg { transform: rotate(90deg) translateX(2px); }
#pg-rules .ru-more:focus-visible { outline: none; }
#pg-rules .ru-more:focus-visible::after { border-radius: var(--r-sm); box-shadow: var(--focus); }

/* ---------- 每条一屏 ---------- */
#pg-rules .ru-item { padding: 120px 0; }
#pg-rules .ru-split { gap: 96px; }
#pg-rules .ru-big { display: block; font-size: var(--t80); font-weight: 300; line-height: 1; color: var(--ink); }   /* 原来 500 中灰像按不动的灰态；改细黑，跟全站序号一档。「第 1 条」只留给读屏器（.vh），大数字已经说明了 */
#pg-rules .ru-why { padding-left: 20px; border-left: 2px solid var(--ink); }
#pg-rules .ru-why-k { font-size: var(--t13); color: var(--ink-2); }
#pg-rules .ru-why p { font-size: var(--t21); line-height: 1.5; font-weight: 500; margin-top: 4px; }
#pg-rules .ru-stage { min-height: 480px; padding: 56px; }
#pg-rules .ru-dev { max-width: 560px; }

/* 第 1 条：仅限受邀学员访问 */
#pg-rules .ru-page { position: relative; contain: paint; }
#pg-rules .ru-pg-t { position: relative; font-size: var(--t21); font-weight: 700; }
#pg-rules .ru-pg-s { position: relative; font-size: var(--t13); color: var(--device-soft); margin-top: 2px; }
#pg-rules .ru-pg-d { position: relative; margin: 20px 0 8px; }
#pg-rules .ru-facts { flex-direction: column; align-items: flex-start; gap: 6px; }
#pg-rules .ru-facts span { display: inline-flex; align-items: center; gap: 8px; color: var(--device-ink); }

/* 第 2 条：删一遍 */
#pg-rules .ru-row { gap: 16px; min-height: 48px; }
#pg-rules .ru-row .d-chip { min-width: 128px; height: 28px; justify-content: flex-start; padding: 0 12px; font-size: var(--t13); }
#pg-rules .ru-arr { display: inline-flex; color: var(--device-soft); }
#pg-rules .ru-out { margin-top: 20px; padding: 16px 18px; border-radius: 12px; background: var(--cell-alt); box-shadow: inset 0 0 0 1px var(--device-line); }
#pg-rules .ru-out-k { font-size: var(--t14); color: var(--ink-2); margin-bottom: 4px; }
#pg-rules .ru-out p { font-size: var(--t15); line-height: 1.7; }

/* 第 3 条：这样说、不这样说 */
#pg-rules .ru-say { display: flex; flex-direction: column; gap: 24px; }
#pg-rules .ru-say-g { display: flex; flex-direction: column; gap: 8px; }
#pg-rules .ru-say-g.good { align-items: flex-end; }
#pg-rules .ru-say-k { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t14); color: var(--device-soft); }
#pg-rules .ru-say .d-msg { max-width: 88%; font-size: var(--t15); line-height: 1.6; padding: 12px 16px; }
#pg-rules .ru-say-g.bad .d-msg { color: var(--device-soft); }

/* ---------- 谁看得到什么 ---------- */
#pg-rules .ru-table { border-top: 1px solid var(--line); }
#pg-rules .ru-tr { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 5fr); gap: 32px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--line-2); }
#pg-rules .ru-th { padding: 12px 0; font-size: var(--t13); color: var(--ink-2); }
#pg-rules .ru-c1 { font-size: var(--t21); font-weight: 500; line-height: 1.4; }
#pg-rules .ru-c2 { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t17); flex-wrap: wrap; }
#pg-rules .ru-c2 svg { color: var(--ink-2); }
#pg-rules .ru-priv { font-style: normal; font-size: var(--t13); color: var(--ink); padding: 2px 10px; border-radius: var(--r-pill); background: var(--fill); }
#pg-rules .ru-c3 { font-size: var(--t15); color: var(--ink-2); }

/* ---------- 这里没有的 ---------- */
#pg-rules .ru-no-a { justify-content: space-between; }
#pg-rules .ru-no-t { font-size: var(--t28); font-weight: 700; line-height: 1.35; margin-top: 24px; }
#pg-rules .ru-ic { width: 44px; height: 44px; border-radius: 50%; background: var(--fill); display: flex; align-items: center; justify-content: center; margin-bottom: 8px; }
#pg-rules .ru-end { margin-top: 48px; text-align: center; }

/* v7.2 英文：28 号以上的标题收一点字距（缩到 21 号的窄屏不收）；中文照旧。首屏 72 号大标题是 .h1，ds 里已是 500 */
@media (min-width: 1100px) { html[lang="en"] #pg-rules .ru-pt { letter-spacing: -0.015em; } }
@media (min-width: 760px) { html[lang="en"] #pg-rules .ru-no-t { letter-spacing: -0.015em; } }

@media (max-width: 1099px) {
  #pg-rules .ru-split { gap: 48px; }
  #pg-rules .ru-split.rev .ru-txt { order: -1; }
  #pg-rules .ru-tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #pg-rules .ru-tr .ru-c3 { grid-column: 1 / -1; }
  #pg-rules .ru-th span:last-child { display: none; }
  #pg-rules .ru-pillar { padding: 24px 24px 4px; }
  #pg-rules .ru-pt { font-size: var(--t21); margin-top: 16px; }
  #pg-rules .ru-pc { font-size: var(--t17); }
}
@media (max-width: 759px) {
  #pg-rules .ru-hero { padding: 48px 0 56px; }
  #pg-rules .ru-badge { width: 64px; height: 64px; }
  #pg-rules .ru-head .h1 { font-size: var(--t40); }
  #pg-rules .ru-pillars { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; margin-top: 40px; }
  #pg-rules .ru-pillar { grid-row: auto; grid-template-rows: none; padding: 24px 0 20px; }
  #pg-rules .ru-pillar + .ru-pillar { border-left: 0; border-top: 1px solid var(--line-2); }
  #pg-rules .ru-n { font-size: var(--t40); }
  #pg-rules .ru-pt { font-size: var(--t21); margin-top: 12px; }
  #pg-rules .ru-pc { font-size: var(--t17); margin-top: 4px; }
  #pg-rules .ru-more { margin-top: 12px; }
  #pg-rules .ru-item { padding: 64px 0; }
  #pg-rules .ru-big { font-size: var(--t56); }
  #pg-rules .ru-why p { font-size: var(--t17); }
  #pg-rules .ru-stage { min-height: 0; padding: 20px; }
  #pg-rules .ru-row { white-space: normal; }
  #pg-rules .ru-row .d-chip { min-width: 88px; }
  /* 英文词长，一行放不下「标签 → 结果」：标签一行，箭头和结果下一行（中文照旧一行） */
  html[lang="en"] #pg-rules .ru-row { display: grid; grid-template-columns: 16px minmax(0, 1fr); column-gap: 10px; row-gap: 8px; align-items: center; padding-top: 12px; padding-bottom: 12px; }
  html[lang="en"] #pg-rules .ru-row .d-chip { grid-column: 1 / -1; justify-self: start; }
  #pg-rules .ru-tr { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 20px 0; }
  #pg-rules .ru-th { display: none; }
  #pg-rules .ru-c1 { font-size: var(--t17); }
  #pg-rules .ru-no-t { font-size: var(--t21); }
}