/* Reading layout for the app's authoritative legal documents. */
.legal-page { --font-body: system-ui, -apple-system, "Segoe UI", var(--font-cjk); --heading-tracking: 0; --font-display: var(--font-body); overflow-x: visible; }
.legal-skip { position: fixed; top: 12px; left: 20px; z-index: 100; padding: 10px 16px; background: var(--surface); transform: translateY(-200%); }
.legal-skip:focus { transform: none; }
.legal-header { border-bottom: 1px solid var(--line); }
.legal-header-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 80px; }
.legal-actions { display: flex; align-items: center; gap: 28px; font-size: 14px; color: var(--text-2); }
.legal-actions a { display: inline-flex; align-items: center; min-height: 44px; }
.legal-actions a:hover, .legal-footer a:hover { color: var(--accent-hi); }
.legal-heading { padding-block: 64px 32px; }
.legal-eyebrow { font-size: 13px; color: var(--text-dim); margin-bottom: 18px; }
.legal-heading h1 { max-width: 24ch; font-size: clamp(30px, 3.4vw, 44px); font-weight: 600; line-height: 1.25; letter-spacing: var(--heading-tracking); text-wrap: pretty; }
.legal-meta { margin-top: 18px; font-size: 14px; color: var(--text-2); }
.legal-tabs { display: flex; flex-wrap: wrap; gap: 8px 30px; border-bottom: 1px solid var(--line); }
.legal-tabs a { display: inline-flex; align-items: center; min-height: 48px; font-size: 14px; color: var(--text-2); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.legal-tabs a:hover { color: var(--text); }
.legal-tabs [aria-current="page"] { color: var(--text); border-bottom-color: var(--accent); }
.legal-layout { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: clamp(40px, 5vw, 72px); padding-block: 44px 72px; align-items: start; }
.legal-sidebar { position: sticky; top: 28px; max-height: calc(100vh - 56px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
.legal-toc > p { font-size: 12px; color: var(--text-dim); margin-bottom: 14px; }
.legal-sidebar ol { list-style: none; }
.legal-sidebar li + li { margin-top: 4px; }
.legal-sidebar a { display: block; padding: 5px 12px 5px 0; font-size: 13px; line-height: 1.6; color: var(--text-2); overflow-wrap: anywhere; }
.legal-sidebar a:hover { color: var(--accent-hi); }
.legal-mobile-toc { display: none; }
.legal-document { min-width: 0; max-width: 760px; font-size: 15px; line-height: 1.9; color: var(--text-2); overflow-wrap: anywhere; }
.legal-document h2, .legal-document h3 { color: var(--text); font-weight: 600; line-height: 1.55; letter-spacing: 0; text-wrap: pretty; scroll-margin-top: 24px; }
.legal-document h2 { font-size: 21px; margin: 46px 0 20px; padding-top: 28px; border-top: 1px solid var(--line); }
.legal-document h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.legal-document h3 { font-size: 17px; margin: 30px 0 14px; }
.legal-document p, .legal-document ul { margin: 16px 0; }
.legal-document ul { padding-left: 1.3em; }
.legal-document li + li { margin-top: 10px; }
.legal-document li::marker { color: var(--text-dim); }
.legal-document strong { font-weight: 600; color: var(--text); }
.legal-document a { color: var(--accent-hi); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--accent) 40%, transparent); text-underline-offset: 3px; }
.legal-document a:hover { text-decoration-color: currentColor; }
.legal-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-block: 24px; border-top: 1px solid var(--line); font-size: 13px; color: var(--text-dim); }
@media (max-width: 800px) {
  .legal-header-in { min-height: 72px; }
  .legal-actions { gap: 20px; font-size: 13px; }
  .legal-heading { padding-block: 40px 28px; }
  .legal-layout { grid-template-columns: minmax(0, 1fr); gap: 30px; padding-block: 24px 48px; }
  .legal-sidebar { position: static; max-height: none; overflow: visible; }
  .legal-toc { display: none; }
  .legal-mobile-toc { display: block; border-bottom: 1px solid var(--line); padding-bottom: 16px; }
  .legal-mobile-toc summary { min-height: 32px; font-size: 14px; cursor: pointer; color: var(--text-2); }
  .legal-mobile-toc nav { padding-top: 12px; }
  .legal-mobile-toc a { padding-block: 10px; }
  .legal-document h2 { font-size: 19px; margin-top: 34px; padding-top: 24px; }
}
@media (max-width: 380px) {
  .legal-actions { gap: 12px; }
  .legal-tabs { gap: 4px 20px; }
  .legal-tabs a { font-size: 13px; }
}
@media print {
  .legal-page { background: white; color: black; }
  .legal-header, .legal-tabs, .legal-sidebar, .legal-footer, .legal-skip, .legal-eyebrow { display: none; }
  .legal-main { max-width: none; padding: 0; }
  .legal-heading { padding: 0 0 20px; }
  .legal-heading h1 { font-size: 24pt; }
  .legal-meta, .legal-document, .legal-document strong, .legal-document h2, .legal-document h3, .legal-document a { color: black; }
  .legal-layout { display: block; padding: 0; }
  .legal-document { max-width: none; font-size: 10pt; }
  .legal-document h2, .legal-document h3 { break-after: avoid; }
}

/* Mainland pages use the site's local assets and system CJK font stack. */
.legal-page .footer-beian { font-family: var(--font-body); }
.legal-notices-nav { padding-top: 24px; }
.legal-notices { padding-block: 48px 64px; }
.third-party-page { background: var(--bg); color: var(--text-2); }
.third-party-page .container { font-family: var(--font-body); overflow-wrap: anywhere; }
.third-party-page .intro { text-align: left; margin-bottom: 40px; }
.third-party-page h1 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.3; margin-bottom: 20px; }
.third-party-page h2 { font-size: 22px; line-height: 1.5; margin: 32px 0 16px; }
.third-party-page h3 { font-size: 18px; line-height: 1.5; margin: 24px 0 12px; }
.third-party-page p, .third-party-page ul { margin-block: 14px; }
.third-party-page .license-text { background: var(--surface); border: 1px solid var(--line); padding: 16px; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; white-space: pre-wrap; }
.third-party-page .license-used-by { padding-left: 20px; }
.third-party-page a { color: var(--accent-hi); }
@media (max-width: 800px) { .legal-notices { padding-block: 32px 48px; } }
@media print {
  .legal-page .footer-beian, .legal-notices-nav { display: none; }
  .legal-notices { padding: 0; }
  .third-party-page .license-text { max-height: none; overflow: visible; color: black; background: white; }
}
