:root { --color-navy: var(--sanctuary); --color-gold: var(--gold); --color-gold-rgb: 200, 169, 110; --font-body: var(--font-ui-zh); --font-heading: var(--font-display-en); }
.scroll-top { position: fixed; bottom: 2rem; right: 2rem; width: 44px; height: 44px; background: var(--sanctuary); border: 1px solid var(--gold); color: var(--gold); cursor: pointer; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity 0.3s ease, background 0.2s ease; z-index: 500; border-radius: 2px; }
.scroll-top.visible { opacity: 1; pointer-events: auto; }
.scroll-top:hover { background: var(--gold); color: var(--ink); }
.scroll-top svg { display: block; }
.legal-hero { background: var(--color-navy); padding: 7rem 2rem 4rem; text-align: center; }
.legal-hero-inner { max-width: 720px; margin: 0 auto; }
.legal-eyebrow { font-family: var(--font-body); font-size: 0.78rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--color-gold); margin-bottom: 1rem; }
.legal-title { font-family: var(--font-heading); font-size: clamp(1.8rem, 4vw, 3rem); color: #fff; margin-bottom: 1rem; font-weight: 400; }
.legal-updated { font-family: var(--font-body); font-size: 0.82rem; color: rgba(255,255,255,0.45); letter-spacing: 0.05em; }
.legal-content { background: #faf9f7; padding: 5rem 2rem 6rem; }
.legal-container { max-width: 820px; margin: 0 auto; }
.legal-container h2 { font-family: var(--font-heading); font-size: 1.2rem; color: var(--color-navy); font-weight: 500; margin: 2.5rem 0 0.75rem; padding-bottom: 0.5rem; border-bottom: 1px solid rgba(0,0,0,0.08); letter-spacing: 0.06em; }
.legal-container h3 { font-family: var(--font-body); font-size: 1rem; font-weight: 600; color: var(--color-navy); margin: 1.5rem 0 0.5rem; }
.legal-container p { font-family: var(--font-body); font-size: 0.95rem; line-height: 1.85; color: #3a3a3a; margin-bottom: 1rem; }
.legal-container ul, .legal-container ol { padding-left: 1.5rem; margin-bottom: 1rem; }
.legal-container li { font-family: var(--font-body); font-size: 0.95rem; line-height: 1.8; color: #3a3a3a; margin-bottom: 0.4rem; }
.legal-container strong { color: var(--color-navy); font-weight: 600; }
.legal-container a { color: var(--color-gold); text-decoration: underline; text-underline-offset: 2px; }
.legal-container a:hover { color: var(--gold-deep); }
.policy-table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 0.9rem; }
.policy-table th { background: var(--color-navy); color: #fff; font-family: var(--font-body); font-weight: 500; padding: 0.75rem 1rem; text-align: left; letter-spacing: 0.04em; }
.policy-table td { padding: 0.7rem 1rem; border-bottom: 1px solid rgba(0,0,0,0.07); color: #3a3a3a; font-family: var(--font-body); line-height: 1.6; }
.policy-table tr:nth-child(even) td { background: rgba(0,0,0,0.025); }
.legal-note { background: rgba(var(--color-gold-rgb), 0.06); border-left: 3px solid var(--color-gold); padding: 1rem 1.25rem; margin: 1.5rem 0; border-radius: 0 4px 4px 0; }
.legal-note p { font-size: 0.88rem; color: #555; margin: 0; }
.legal-warning { background: #fff8f0; border-left: 3px solid #c0392b; padding: 1rem 1.25rem; margin: 1.5rem 0; border-radius: 0 4px 4px 0; }
.legal-warning p { font-size: 0.88rem; color: #7a2a1e; margin: 0; }
.legal-contact-block { background: var(--color-navy); color: #fff; padding: 2rem; border-radius: 6px; margin-top: 3rem; }
.legal-contact-block h3 { color: var(--color-gold); font-family: var(--font-heading); font-size: 1.1rem; font-weight: 400; margin-bottom: 0.75rem; letter-spacing: 0.08em; }
.legal-contact-block p { color: rgba(255,255,255,0.8); font-size: 0.9rem; margin-bottom: 0.4rem; }
.legal-contact-block a { color: var(--color-gold); text-decoration: none; transition: opacity 0.2s ease; }
.legal-contact-block a:hover { opacity: 0.8; }
[lang^="zh"] .legal-container p, [lang^="zh"] .legal-container li { font-family: var(--font-body-zh); font-size: 0.97rem; line-height: 2; }
[lang^="zh"] .legal-container h2 { font-family: var(--font-body-zh); letter-spacing: 0.04em; }
[lang^="zh"] .legal-container h3 { font-family: var(--font-body-zh); }
@media (max-width: 768px) {
  .legal-hero { padding: 5rem 1.25rem 3rem; }
  .legal-content { padding: 3rem 1.25rem 4rem; }
  .policy-table { font-size: 0.82rem; }
  .policy-table th, .policy-table td { padding: 0.6rem 0.75rem; }
  .scroll-top { bottom: 1.5rem; right: 1.25rem; }
}