:root {
  --ink: #252723;
  --muted: #6f7068;
  --paper: #f3eddf;
  --paper-light: #fbf8f0;
  --red: #a53b2b;
  --line: rgba(55, 57, 51, .15);
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Microsoft YaHei", "PingFang SC", sans-serif; }
.legal-header { max-width: 900px; margin: auto; padding: 32px 24px 22px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.seal { width: 42px; height: 42px; display: grid; place-items: center; color: #f5e8d0; background: var(--red); font: 25px "STKaiti", "KaiTi", serif; transform: rotate(-2deg); }
.brand b { font: 20px "STKaiti", "KaiTi", serif; letter-spacing: 2px; }
.legal-nav { display: flex; gap: 18px; font-size: 13px; }
.legal-nav a { color: var(--muted); text-decoration: none; }
.legal-nav a:hover { color: var(--red); }
.legal-page { max-width: 900px; margin: 34px auto 70px; padding: 42px 55px; background: rgba(251,248,240,.82); border: 1px solid var(--line); }
.breadcrumb { display: flex; gap: 9px; margin-bottom: 24px; color: #8b887e; font-size: 12px; }
.breadcrumb a { color: #8b887e; text-decoration: none; }
.breadcrumb a:hover { color: var(--red); }
.legal-page h1 { margin: 0; font: 38px "STKaiti", "KaiTi", serif; letter-spacing: 3px; }
.updated { margin: 10px 0 36px; color: #8b887e; font-size: 12px; }
.summary { padding: 18px 20px; border-left: 3px solid var(--red); background: rgba(165,59,43,.045); color: #55574f; line-height: 1.9; }
.legal-page h2 { margin: 34px 0 10px; font: 22px "STKaiti", "KaiTi", serif; }
.legal-page p, .legal-page li { color: var(--muted); font-size: 14px; line-height: 2; }
.legal-page ul { padding-left: 22px; }
.legal-page a { color: var(--red); }
.back { display: inline-block; margin-top: 34px; color: var(--red); text-decoration: none; }
.legal-actions { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-top: 34px; }
.legal-actions .back { margin-top: 0; }
.legal-actions a { font-size: 14px; text-decoration: none; }
@media (max-width: 680px) {
  .legal-header { padding: 20px 16px; }
  .brand b { font-size: 16px; }
  .legal-nav { gap: 10px; font-size: 12px; }
  .legal-nav a:first-child { display: none; }
  .legal-page { margin: 14px 12px 45px; padding: 30px 22px; }
  .legal-page h1 { font-size: 30px; }
  .legal-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
}
