/* form.css — 表单页组件表（投放咨询 / DMCA 申诉）。
   由 advertise.css（103 块）与 dmca.css（67 块）合并而来，26 个逐字节相同的块
   已合并成逗号选择器，其余按原顺序拼接。两套前缀 .adv-* 与 .dmca-* 命名空间不相交，
   所以拼接不会互相影响 —— 这一点由 scripts/lib/cascade-diff.mjs 在三个使用页上实测过。

   使用页：全部 /<locale>/advertise/（zh-hans 手写，其余由 build-advertise-pages.mjs 生成）
   与全部 /<locale>/dmca/。
   ⚠ 这张表**不是** zh-hans 专用，改动前先确认其它语言的使用页不受影响。 */


/* 2026-09-15 剪枝：删掉在三个使用页（advertise / zh-hans dmca / en dmca）上
   一个元素都匹配不到的 35 条选择器。大头是 .adv-main / .adv-hero / .adv-section /
   .adv-form-section —— DOM 统一那一轮把投放页迁进了标准外壳，这些旧外壳类随之消失。 */


/* 2026-09-19 恢复：合并 advertise.css + dmca.css 时这两个 :root 块**一起丢了**，
   于是全表 54 处 var() 全部 invalid at computed-value time（取 unset）——
   background 简写塌成 transparent、border 简写塌成 border-style:none、color 退回继承。
   后果是三个页面的提交按钮白字压白底 1.00:1，一个字看不见。取值逐字节取自
   `git show acc38769f4~1:codings/assets/css/{advertise,dmca}.css`。

   ⚠ 这两个块只能放自定义属性，一条普通声明都不能加。
   check-zh-hans-css-contract.mjs 的 R12 deadselector 覆盖 form.css，而本仓库的
   matchesNode() 对 ':root' 恒返回 false。今天不红，只因为 parseDecls 跳过 '--'
   开头的声明、parseCss 又丢弃声明数为 0 的规则 —— 一旦混进一条普通声明，
   ':root' 就变成可见规则、匹配 0 个元素，css:validate-contract 立刻 exit 1。

   两组取值有 7 个重复（primary / primary-dark / focus / success / success-bg /
   error / error-bg）。刻意不合并：本次是逐字节回退到已知良好态，合并就不再是回退。
   要合并的前提是先统一类名前缀（.adv-* / .dmca-* → .form-*），变量名自然跟着走。 */

:root {
  --adv-primary: #c0265a;
  --adv-primary-dark: #8f1642;
  --adv-focus: #2563eb;
  --adv-ink: #1f2937;
  --adv-body: #4b5563;
  --adv-muted: #667085;
  --adv-line: #e5e7eb;
  --adv-success: #176b45;
  --adv-success-bg: #ecfdf3;
  --adv-error: #9f1d2f;
  --adv-error-bg: #fff1f2;
}

:root {
  --dmca-primary: #c0265a;
  --dmca-primary-dark: #8f1642;
  --dmca-focus: #2563eb;
  --dmca-success: #176b45;
  --dmca-success-bg: #ecfdf3;
  --dmca-error: #9f1d2f;
  --dmca-error-bg: #fff1f2;
}

[hidden] {
  display: none !important;
}

/* text-decoration is declared here rather than inherited from a host sheet's
   bare `a` rule. /en/ and /es/ each strip link underlines site-wide, but the
   zh-hans family does not, so on the Traditional Chinese copyright pages the
   focused skip link rendered underlined against its dark pill. Measured with
   scripts/lib/cascade-diff.mjs: 32 assertions per page across zh-tw, zh-hk and
   zh-hant. A component that only looks right on the sheets that happen to
   reset links is not self-contained. */
.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  padding: 10px 14px;
  border-radius: 8px;
  background: #111827;
  color: #fff;
  text-decoration: none;
  transform: translateY(-150%);
}

.skip-link:focus {
  transform: translateY(0);
}

/* 版心。2026-09-15 的合并剪掉了原 advertise.css 的 3 条排版上限且无替代
   （`.adv-main { width: min(100% - 32px, 980px) }`、`.adv-hero p { max-width:780px }`、
   `.adv-section > p, .adv-note > p { max-width:820px }`），于是正文改走
   content.css 的 `.page { max-width: 1180px }` + 裸 `p { font-size:15px }`，
   实际 measure 1092px ≈ 72 字/行 —— 而本页最长那段正文正好 73 字，整段挤成一行。
   中文舒适阅读是 30–40 字/行。收到 1000px（measure 912px ≈ 60 字/行）。
   顺带让 `.adv-card-grid` 的 `repeat(auto-fit, minmax(260px,1fr))` 从「3+2 残行」
   变成确定 3 列 —— 1092px 距离翻成 4 列只差 2px（4×260+3×18=1094）。

   (0,2,0) 压过 content.css 的 `.page` (0,1,0)，不依赖两张表的先后顺序
   —— 在 zh-hans 两页上 form.css 反而排在 content.css 之前。
   `/en/dmca/` 不受影响：它用旧外壳 `main.dmca-main`，`class="page"` 计数为 0
   （已实测）。两条选择器各自在一个使用页上匹配 1 个元素，R12 不会判死。 */
.advertise-page .page,
.dmca-page .page {
  max-width: 1000px;
}

.adv-eyebrow,
.adv-step,
.adv-success-kicker {
  margin: 0 0 6px;
  color: var(--adv-primary-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.adv-lead {
  max-width: 780px;
  margin: 0 0 16px;
  color: var(--adv-ink);
  font-size: 1.12rem;
  font-weight: 650;
  line-height: 1.5;
}

.adv-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.adv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 22px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}

.adv-btn-primary {
  background: linear-gradient(135deg, var(--adv-primary-dark), var(--adv-primary));
  color: #fff;
  box-shadow: 0 9px 22px rgba(192, 38, 90, 0.22);
}

.adv-btn-primary:hover {
  background: var(--adv-primary-dark);
  color: #fff;
}

/* content.css 的 `.box a` (0,1,1) 与 `.box a:hover` (0,2,1) 会吃掉按钮的
   color / font-weight / text-decoration —— 定价区那颗主按钮在 section.box 内
   （zh-hans/advertise/index.html:306）。恢复 :root 之前它是 #be185d 压透明底、
   还能读；恢复之后会变成 #be185d 压 #8f1642→#c0265a 渐变 ≈ 1.05–1.47:1，
   hover 更糟 ≈ 1.08:1。所以这一条必须与上面的 :root 同批落地。
   同型先例见 content.css 的 `.box a.watch-btn`（CLAUDE.md 记过那次「45 个联盟
   按钮被 .content a 吃掉字色」）。靠特异性取胜，不依赖 form.css 与 content.css
   的先后顺序 —— 在 zh-hans 两页上 form.css 反而排在前面，依赖顺序会输。
   hover / focus-visible 必须一并覆盖：对手是 (0,2,1)，裸的 .box a.adv-btn-primary
   同为 (0,2,1)，同特异性时排在后面的 content.css 会赢。
   不要顺手加 .adv-btn-ghost：它只在 hero，`.box a.adv-btn-ghost` 匹配 0 个元素，
   R12 deadselector 会判死；而且 ghost 是白底，给它 color:#fff 就是白字白底。 */
.box a.adv-btn-primary,
.box a.adv-btn-primary:hover,
.box a.adv-btn-primary:focus-visible {
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}

.adv-btn-ghost {
  border-color: #d9c2cc;
  background: #fff;
  color: var(--adv-primary-dark);
}

.adv-btn-ghost:hover {
  border-color: var(--adv-primary);
  color: var(--adv-primary-dark);
}

/* 不透明实色：rgba(37,99,235,.24) 合成到 #fff 上是 rgb(203,218,250) = 1.40:1，
   低于 WCAG 2.2 SC 2.4.11 要求的 3:1。输入框那组（下面 .adv-field input:focus …）
   不受影响，因为它们同一条规则里还有 border-color: var(--adv-focus) = #2563eb 兜底；
   按钮没有 border（.adv-submit { border: 0 }），焦点环是唯一的可见指示。
   #2563eb on #fff = 5.17:1。 */
.adv-btn:focus-visible {
  outline: 3px solid #2563eb;
  outline-offset: 2px;
}

/* 章节导语原本只有 margin-top，于是走 content.css 的裸 `p`，与普通段落逐字节相同
   —— 全页只剩 h2(24px) 与正文(15px) 两级。原本承担这一级的 `.adv-section > p`
   在 2026-09-15 的剪枝里没了。17px / #4b5563 是站内既有档位（content.css 的
   `.lead`、`.faq-card-header p`、`.safety-check-header p` 都是这一档），不是新造的。
   (0,1,0) 足以压过裸 `p` (0,0,1)。 */
.adv-section-intro {
  margin-top: 0 !important;
  max-width: 820px;
  color: #4b5563;
  font-size: 17px;
  line-height: 1.8;
}

.adv-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  margin-top: 22px;
}

/* 描边与底色对齐站内卡片规范（content.css 的 `.card` 是 #fffafc / #f0dbe3 / 14px）。
   原来是冷灰卡（#fcfcfd / #e5e7eb / 12px）嵌在粉壳 `.box`（#f2dbe3 描边 / 18px 圆角）
   里，整页出现两套互不相干的卡片语言。
   ⚠ 这里直接写 border-color 而不是改 --adv-line 的值：那个变量还驱动
   `.adv-card-note` 的虚线分隔与 `.adv-form fieldset + fieldset` 的分隔线，
   把结构性分隔线也染成粉色是另一回事。 */
.adv-card {
  min-width: 0;
  padding: 20px;
  border: 1px solid #f0dbe3;
  border-radius: 14px;
  background: #fffafc;
}

/* 1.08rem 时 h3 : 正文 = 1.15×，级差不足（站内同类 .faq-card-item h3 是 1.31×、
   .route-card h3 是 1.27×）；而且紧挨着的 .adv-split-item h3 是 1.02rem，
   两组卡片上下相邻却是两个字号。统一到 1.18rem = 18.88px ≈ 1.26×。 */
.adv-card h3 {
  margin: 0 0 8px;
  padding-left: 11px;
  border-left: 3px solid var(--adv-primary);
  color: var(--adv-ink);
  font-size: 1.18rem;
  line-height: 1.4;
}

.adv-card p {
  margin: 8px 0 0;
  color: var(--adv-body);
  font-size: 0.94rem;
  line-height: 1.68;
}

.adv-card ul {
  margin: 10px 0 0;
  padding-left: 1.15rem;
  color: var(--adv-body);
  font-size: 0.94rem;
  line-height: 1.7;
}

/* `.adv-card ul` 想让 <li> 继承这三个值，但 content.css 的裸 `li`
   （font-size:15px; line-height:1.8; color:#374151）**直接命中** <li> ——
   直接声明恒压过继承，与特异性无关。9 张卡里 6 张是「一句引导 + 一组列表」，
   这个错位重复 6 次。(0,1,1) 压过裸 `li` (0,0,1)。 */
.adv-card li {
  margin: 3px 0;
  color: var(--adv-body);
  font-size: 0.94rem;
  line-height: 1.7;
}

/* 必须是 `.adv-card p.adv-card-note` (0,2,1)：裸 `.adv-card-note` 是 (0,1,0)，
   被同一张表里的 `.adv-card p` (0,1,1) 压过，7 个脚注一个都拿不到自己的
   字号/颜色/上边距，只有无竞争者的 padding-top 与 border-top 活了下来
   —— 卡片的「标题 / 正文 / 脚注」三级塌成两级。7 个元素全是 <p>（已实测）。 */
.adv-card p.adv-card-note {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--adv-line);
  color: var(--adv-muted);
  font-size: 0.86rem;
  line-height: 1.6;
}

.adv-rule-list {
  margin: 16px 0 0;
  padding-left: 1.15rem;
  color: var(--adv-body);
  line-height: 1.78;
}

.adv-rule-list li {
  margin: 4px 0;
}

/* (0,2,0)：裸 `.box-accent` (0,1,0) 与 content.css 的 `.box { border: 1px solid #f2dbe3 }`
   同特异性，而 content.css 在后 —— 于是「Sponsored 与自然推荐」那一节本该有的
   5px 粉色强调条一直不存在。同样必须与 :root 同批：变量没回来时
   border-left-style 取 none，那一侧连 1px 细边都没有，比现状更怪。 */
.box.box-accent {
  border-left: 5px solid var(--adv-primary);
}

.adv-split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-top: 20px;
}

/* 与 .adv-card 同批对齐站内卡片规范，理由见上。 */
.adv-split-item {
  min-width: 0;
  padding: 18px;
  border: 1px solid #f0dbe3;
  border-radius: 14px;
  background: #fffafc;
}

/* 与 .adv-card h3 统一到 1.18rem —— 两组卡片上下相邻，原本是 1.08 / 1.02 两个字号。 */
.adv-split-item h3 {
  margin: 0 0 8px;
  color: var(--adv-ink);
  font-size: 1.18rem;
  line-height: 1.4;
}

.adv-split-item p {
  margin: 0;
  color: var(--adv-body);
  font-size: 0.94rem;
  line-height: 1.68;
}

.adv-tag {
  display: inline-block;
  margin-bottom: 9px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.adv-tag-sponsored {
  background: #fdeaf1;
  color: var(--adv-primary-dark);
}

.adv-tag-editorial {
  background: #eef2f7;
  color: #3f4b5b;
}

.adv-form-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
}

.adv-form-heading h2 {
  margin: 0;
}

.adv-form-heading > p {
  flex: 0 0 auto;
  margin: 4px 0 0;
  color: var(--adv-muted);
  font-size: 0.82rem;
}

.adv-form-heading > p span,
.adv-field > label > span:not(.optional),
.adv-legend-required,
.adv-checkbox span span {
  color: var(--adv-error);
}

.adv-form fieldset,
.dmca-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.adv-form fieldset + fieldset {
  margin-top: 28px;
  padding-top: 26px;
  border-top: 1px solid var(--adv-line);
}

.adv-form legend {
  width: 100%;
  margin-bottom: 16px;
  color: #374151;
  font-size: 1.08rem;
  font-weight: 750;
}

.adv-grid,
.dmca-grid {
  display: grid;
  gap: 20px;
  min-width: 0;
}

.adv-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.adv-field,
.dmca-field {
  min-width: 0;
}

.adv-field label {
  display: block;
  margin-bottom: 7px;
  color: var(--adv-ink);
  font-size: 0.94rem;
  font-weight: 700;
}

.adv-field .optional,
.dmca-field .optional {
  display: inline;
  margin-left: 5px;
  color: #6b7280;
  font-size: 0.76rem;
  font-weight: 500;
}

.adv-help {
  margin: -2px 0 8px;
  color: var(--adv-muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

.adv-field input,
.adv-field select,
.adv-field textarea,
.dmca-field input,
.dmca-field select,
.dmca-field textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border: 1px solid #cfd4dc;
  border-radius: 9px;
  background: #fff;
  color: #111827;
  font: inherit;
  font-size: 16px;
}

.adv-field input,
.adv-field select,
.dmca-field input,
.dmca-field select {
  min-height: 46px;
  padding: 10px 12px;
}

.adv-field select {
  text-overflow: ellipsis;
}

.adv-field textarea {
  min-height: 108px;
  padding: 11px 12px;
  line-height: 1.55;
  resize: vertical;
}

.adv-field input:focus,
.adv-field select:focus,
.adv-field textarea:focus,
.adv-check input:focus-visible,
.adv-checkbox input:focus-visible,
.adv-submit:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.24);
  outline-offset: 2px;
  border-color: var(--adv-focus);
}

/* 只把**按钮**的焦点环提到不透明（理由同 .adv-btn:focus-visible 那条）。
   单独一条而不是改上面那组：上面那组里的输入框有 border-color 兜底，
   半透明环在它们身上不构成无障碍缺陷，没必要一起动。 */
.adv-submit:focus-visible {
  outline-color: #2563eb;
}

/* 2026-09-19 恢复（原 advertise.css:449）。2026-09-15 的剪枝按**静态 HTML** 判死，
   看不到这个属性是 JS 在运行时写上去的 —— assets/javascript/advertise.js
   （2026-10-09 前是 zh-hans/advertise.js 分叉）。删掉之后字段级报错高亮完全失效：提交被拒时只有第一个出错
   字段有原生气泡（advertise.js 里的 reportValidity()），第 2..N 个在视觉上与
   正常字段毫无区别。R12 的 RUNTIME_ONLY 白名单负责让它不再被判死。
   (0,2,0) 压过基础 `.adv-field input` (0,1,1)，输给 `:focus` (0,2,1)，与迁移前一致。
   可见效果几乎全部来自 border-color —— #fffafa 与 #fff 只差 2%，肉眼难分。 */
.adv-field [aria-invalid="true"] {
  border-color: var(--adv-error);
  background: #fffafa;
}

.adv-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin-top: 2px;
}

.adv-check {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #e1e5eb;
  border-radius: 9px;
  background: #fafbfc;
  color: #374151;
  font-size: 0.92rem;
  cursor: pointer;
}

.adv-check input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--adv-primary);
}

.adv-check span {
  min-width: 0;
  line-height: 1.4;
}

.adv-subfield {
  margin-top: 12px;
}

.adv-checkbox {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 15px;
  border: 1px solid #e1e5eb;
  border-radius: 10px;
  background: #fafbfc;
  color: #374151;
  cursor: pointer;
}

.adv-checkbox input {
  width: 19px;
  height: 19px;
  margin: 3px 0 0;
  accent-color: var(--adv-primary);
}

.adv-checkbox span,
.dmca-checkbox span {
  min-width: 0;
  font-size: 0.91rem;
  line-height: 1.58;
}

.adv-privacy-inline {
  margin: 14px 0 0;
  color: var(--adv-muted);
  font-size: 0.85rem;
  line-height: 1.65;
}

.adv-privacy-inline a {
  color: var(--adv-primary-dark);
  text-decoration: underline;
}

.adv-turnstile {
  min-height: 68px;
  max-width: 100%;
  margin-top: 24px;
  overflow: hidden;
}

.adv-submit-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 26px;
}

.adv-submit {
  min-height: 50px;
  padding: 12px 22px;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--adv-primary-dark), var(--adv-primary));
  color: #fff;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 9px 22px rgba(192, 38, 90, 0.22);
}

.adv-submit:hover:not(:disabled) {
  background: var(--adv-primary-dark);
}

.adv-submit:disabled,
.dmca-submit:disabled {
  cursor: wait;
  opacity: 0.7;
}

.adv-submit-status {
  min-height: 1.5em;
  margin: 0;
  color: var(--adv-body);
  font-size: 0.9rem;
}

.adv-alert,
.adv-success,
.dmca-alert,
.dmca-success {
  margin: 0 0 24px;
  padding: 18px;
  border-radius: 11px;
}

.adv-alert-error {
  display: grid;
  gap: 5px;
  border: 1px solid #fecdd3;
  background: var(--adv-error-bg);
  color: var(--adv-error);
}

.adv-alert-error a {
  color: var(--adv-error);
  text-decoration: underline;
}

.adv-success {
  border: 1px solid #a7e7c6;
  background: var(--adv-success-bg);
  color: var(--adv-success);
}

.adv-success h2 {
  margin: 0 0 12px;
  color: #145c3c;
  font-size: 1.45rem;
}

.adv-success p,
.dmca-success p {
  margin: 7px 0;
}

.adv-lead-id,
.dmca-case-id {
  color: #0f5134;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: clamp(1rem, 4vw, 1.3rem);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.adv-honeypot,
.dmca-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.adv-contact-list {
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  color: var(--adv-body);
  line-height: 1.8;
}

.adv-contact-list li {
  margin: 4px 0;
  overflow-wrap: anywhere;
}

.adv-contact-list a {
  color: var(--adv-primary-dark);
  text-decoration: underline;
}

.dmca-main {
  width: min(100% - 32px, 920px);
  margin: 0 auto;
  padding: 36px 0 24px;
}

.dmca-hero,
.dmca-scope,
.dmca-form-section,
.dmca-privacy-note {
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.06);
}

.dmca-hero {
  padding: clamp(28px, 5vw, 46px);
  border-top: 5px solid var(--dmca-primary);
}

.dmca-eyebrow,
.dmca-step,
.dmca-success-kicker {
  margin: 0 0 6px;
  color: var(--dmca-primary-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.dmca-hero h1 {
  margin: 0 0 16px;
  color: #1f2937;
  font-size: clamp(2rem, 6vw, 3.2rem);
  line-height: 1.12;
}

.dmca-hero p {
  max-width: 760px;
  margin: 0;
  color: #4b5563;
  font-size: 1.05rem;
}

.dmca-scope,
.dmca-privacy-note {
  margin-top: 22px;
  padding: clamp(22px, 4vw, 32px);
}

.dmca-scope h2,
.dmca-privacy-note h2 {
  margin: 0 0 12px;
  color: #1f2937;
  font-size: 1.35rem;
}

.dmca-scope p,
.dmca-privacy-note p {
  margin: 10px 0 0;
  color: #4b5563;
}

.dmca-form-section {
  margin-top: 22px;
  padding: clamp(20px, 4vw, 34px);
}

.dmca-form-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

.dmca-form-heading h2 {
  margin: 0;
  color: #1f2937;
  font-size: 1.65rem;
}

.dmca-form-heading > p {
  flex: 0 0 auto;
  margin: 4px 0 0;
  color: #6b7280;
  font-size: 0.82rem;
}

.dmca-form-heading > p span,
.dmca-field > label > span:not(.optional),
.dmca-checkbox span span {
  color: var(--dmca-error);
}

.dmca-form fieldset + fieldset {
  margin-top: 30px;
  padding-top: 28px;
  border-top: 1px solid #e5e7eb;
}

.dmca-form legend {
  width: 100%;
  margin-bottom: 18px;
  color: #374151;
  font-size: 1.1rem;
  font-weight: 750;
}

.dmca-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dmca-field label {
  display: block;
  margin-bottom: 7px;
  color: #1f2937;
  font-size: 0.94rem;
  font-weight: 700;
}

.dmca-help {
  margin: -2px 0 8px;
  color: #667085;
  font-size: 0.82rem;
  line-height: 1.5;
}

.dmca-field textarea {
  min-height: 120px;
  padding: 11px 12px;
  line-height: 1.55;
  resize: vertical;
}

.dmca-field input:focus,
.dmca-field select:focus,
.dmca-field textarea:focus,
.dmca-checkbox input:focus-visible,
.dmca-submit:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.24);
  outline-offset: 2px;
  border-color: var(--dmca-focus);
}

/* 2026-09-19 恢复（原 dmca.css:224）。同上：由 assets/javascript/dmca.js 在
   运行时写入（setCustomValidity 前后成对设置 aria-invalid），静态剪枝看不到。
   2026-09-21 起覆盖全部 82 个 /<locale>/dmca/ 页 —— 原先的
   assets/javascript/zh-hans/dmca.js 分叉已删除，文案改由页内
   <script type="application/json" id="dmca-i18n"> 提供，脚本只剩一份。 */
.dmca-field [aria-invalid="true"] {
  border-color: var(--dmca-error);
  background: #fffafa;
}

.dmca-declarations {
  display: grid;
  gap: 14px;
}

.dmca-checkbox {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 15px;
  border: 1px solid #e1e5eb;
  border-radius: 10px;
  background: #fafbfc;
  color: #374151;
  cursor: pointer;
}

.dmca-checkbox input {
  width: 19px;
  height: 19px;
  margin: 3px 0 0;
  accent-color: var(--dmca-primary);
}

.dmca-signature {
  max-width: 520px;
  margin-top: 20px;
}

.dmca-turnstile {
  min-height: 68px;
  margin-top: 24px;
  overflow: hidden;
}

.dmca-submit-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 26px;
}

.dmca-submit {
  min-height: 50px;
  padding: 12px 20px;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--dmca-primary-dark), var(--dmca-primary));
  color: #fff;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 9px 22px rgba(192, 38, 90, 0.22);
}

.dmca-submit:hover:not(:disabled) {
  background: var(--dmca-primary-dark);
}

.dmca-submit-status {
  min-height: 1.5em;
  margin: 0;
  color: #4b5563;
  font-size: 0.9rem;
}

.dmca-alert-error {
  display: grid;
  gap: 5px;
  border: 1px solid #fecdd3;
  background: var(--dmca-error-bg);
  color: var(--dmca-error);
}

.dmca-alert-error a {
  text-decoration: underline;
}

.dmca-success {
  border: 1px solid #a7e7c6;
  background: var(--dmca-success-bg);
  color: var(--dmca-success);
}

.dmca-success h2 {
  margin: 0 0 12px;
  color: #145c3c;
  font-size: 1.45rem;
}

.dmca-privacy-note {
  border-left: 4px solid #9ca3af;
  box-shadow: none;
}

/* 2026-10-09：/<locale>/advertise/ 生成页（documents:scripts/build-advertise-pages.mjs）的
   版心与区块。zh-hans 手写页走 zh-hans/content.css 的 .page / .hero / .box，其余 80 个
   语言的样式表没有这三个类，而且各自用容器类去套表单控件 —— 与 .dmca-main 同一个理由，
   生成页的容器只用 .adv-main，版心、区块、标题与正文全部在这里自给。
   一律单类选择器（.adv-hero h1 除外），不依赖与各语言样式表的先后顺序；
   .adv-title / .adv-text 是类而不是 `.adv-box h2` / `.adv-box p`，否则会压掉
   上面 .adv-card p、.adv-success h2 这些同特异性的组件规则。 */
.adv-main {
  width: min(100% - 32px, 1000px);
  margin: 0 auto;
  padding: 36px 0 24px;
}

.adv-hero,
.adv-box {
  border: 1px solid #f0dbe3;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.06);
}

.adv-hero {
  padding: clamp(26px, 5vw, 46px);
  border-top: 5px solid var(--adv-primary);
}

.adv-hero h1 {
  margin: 0 0 12px;
  color: #1f2937;
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  line-height: 1.15;
}

.adv-box {
  margin-top: 22px;
  padding: clamp(20px, 4vw, 32px);
}

.adv-box-accent {
  border-inline-start: 5px solid var(--adv-primary);
}

.adv-title {
  margin: 0 0 12px;
  color: #1f2937;
  font-size: 1.45rem;
  line-height: 1.3;
}

.adv-text {
  max-width: 820px;
  margin: 10px 0 0;
  color: #4b5563;
  line-height: 1.75;
}

/* 从右往左书写的生成页（ar / fa / he / ur / ps）：卡片标题的强调线、列表缩进与
   「选填」标记的间距在上面的组件规则里写死在左侧，这里镜像到右侧。 */
[dir="rtl"] .adv-card h3 {
  padding-right: 11px;
  padding-left: 0;
  border-right: 3px solid var(--adv-primary);
  border-left: 0;
}

[dir="rtl"] .adv-card ul,
[dir="rtl"] .adv-rule-list {
  padding-right: 1.15rem;
  padding-left: 0;
}

[dir="rtl"] .adv-field .optional {
  margin-right: 5px;
  margin-left: 0;
}

/* 蜜罐字段用 left:-10000px 藏到视口外。从右往左的文档里，左侧溢出恰好是可滚动方向 ——
   实测 /ar/advertise/ 与 /ps/advertise/ 在 375px 下整页出现 10000px 横向滚动。
   RTL 页改为向右藏：右侧溢出在 RTL 文档里不可滚动。(0,2,0) + !important 压过上面 (0,1,0) 的 !important。 */
[dir="rtl"] .adv-honeypot,
[dir="rtl"] .dmca-honeypot {
  right: -10000px !important;
  left: auto !important;
}

/* 德语等语言的复合词比复选框还宽（实测 de 在 375px 下撑出 8px），只在生成页允许任意处断行；
   zh-hans 手写页不在 .adv-main 里，不受影响。 */
.adv-main .adv-check span {
  overflow-wrap: anywhere;
}

@media (max-width: 860px) {
  .adv-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  }

}

@media (max-width: 700px) {
  .adv-grid-two,
  .adv-card-grid,
  .adv-split {
    grid-template-columns: minmax(0, 1fr);
  }

  .adv-form-heading,
  .adv-submit-row {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .adv-form-heading > p {
    margin: 0;
  }

  .adv-cta-row .adv-btn,
  .adv-submit,
  .dmca-submit {
    width: 100%;
  }

  .adv-lead {
    font-size: 1rem;
  }

  .adv-success h2 {
    font-size: 1.2rem;
  }

  .adv-main {
    width: min(100% - 24px, 1000px);
    padding-top: 22px;
  }

  .adv-hero h1 {
    font-size: 1.6rem;
    line-height: 1.2;
  }

  .adv-title {
    font-size: 1.3rem;
  }

  .dmca-main {
    width: min(100% - 24px, 920px);
    padding-top: 22px;
  }

  .dmca-grid-two {
    grid-template-columns: minmax(0, 1fr);
  }

  .dmca-form-heading,
  .dmca-submit-row {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .dmca-form-heading > p {
    margin: 0;
  }

  .dmca-turnstile {
    max-width: 100%;
  }

  .dmca-hero h1 {
    font-size: 1.375rem;
    line-height: 1.2;
  }

  .dmca-form-heading h2 {
    font-size: 1.3rem;
  }

  .dmca-success h2 {
    font-size: 1.2rem;
  }

}

@media (max-width: 420px) {
  .adv-check-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }

  .adv-card,
  .adv-split-item {
    padding: 16px;
  }

}

@media (max-width: 390px) {
  .adv-main {
    width: min(100% - 18px, 1000px);
  }

  .adv-hero,
  .adv-box {
    border-radius: 12px;
  }

  .adv-box {
    padding-right: 15px;
    padding-left: 15px;
  }

  .dmca-main {
    width: min(100% - 18px, 920px);
  }

  .dmca-hero,
  .dmca-scope,
  .dmca-form-section,
  .dmca-privacy-note {
    border-radius: 12px;
  }

  .dmca-form-section {
    padding-right: 15px;
    padding-left: 15px;
  }

  .dmca-checkbox {
    padding: 12px;
  }

  .dmca-hero h1 {
    font-size: 1.25rem;
  }

  .dmca-form-heading h2 {
    font-size: 1.2rem;
  }

}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

}
