:root { --ink: #070d14; --line: rgba(213,193,122,.2); --muted: #a4b1bf; --gold: #d5c17a; --white: #f2f4f5; }
* { box-sizing: border-box; }
html { background: var(--ink); scroll-behavior: smooth; }
body { min-width: 320px; margin: 0; color: var(--white); background: radial-gradient(circle at 78% 0%, rgba(213,193,122,.11), transparent 31rem), linear-gradient(145deg, #0d161f 0%, #07101a 70%); font-family: Inter, "Segoe UI", Arial, sans-serif; }
a { color: var(--gold); text-underline-offset: 3px; }
.legal-header, .legal-footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: min(1240px, calc(100% - 64px)); margin: auto; }
.legal-header { min-height: 84px; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--white); text-decoration: none; }
.brand img { width: 38px; height: 38px; object-fit: contain; }.brand span { display: grid; gap: 2px; }.brand strong { font-size: 14px; letter-spacing: .11em; }.brand small { color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .13em; }
.header-actions { display: flex; align-items: center; gap: 18px; }.return-link { color: #d2dbe3; font-size: 13px; font-weight: 700; text-decoration: none; }.return-link:hover { color: var(--gold); }
.language-picker { position: relative; }.language-toggle, .language-menu button { border: 1px solid var(--line); color: var(--white); background: rgba(10,19,29,.85); font: inherit; cursor: pointer; }.language-toggle { display: flex; align-items: center; justify-content: space-between; gap: 9px; min-width: 98px; height: 34px; padding: 0 10px; font-size: 12px; }.language-toggle i { width: 6px; height: 6px; border-right: 1px solid var(--gold); border-bottom: 1px solid var(--gold); transform: translateY(-2px) rotate(45deg); }.language-menu { position: absolute; z-index: 3; top: calc(100% + 6px); right: 0; display: none; width: 100%; overflow: hidden; border: 1px solid var(--line); background: #111c27; box-shadow: 0 14px 28px rgba(0,0,0,.3); }.language-picker.is-open .language-menu { display: grid; }.language-menu button { border: 0; padding: 9px 10px; text-align: left; font-size: 12px; }.language-menu button:hover, .language-menu button.is-active { color: #17130a; background: var(--gold); }
.legal-shell { width: min(900px, calc(100% - 64px)); margin: 0 auto; padding: 74px 0 80px; }.eyebrow, .document-label { margin: 0; color: var(--gold); font-size: 11px; font-weight: 800; letter-spacing: .15em; }.legal-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 54px; border-bottom: 1px solid var(--line); padding-bottom: 17px; }.legal-nav a { border: 1px solid transparent; padding: 8px 12px; color: #bdc9d3; font-size: 13px; font-weight: 700; text-decoration: none; }.legal-nav a:hover, .legal-nav a[aria-current="page"] { border-color: rgba(213,193,122,.35); color: #17130a; background: var(--gold); }
.legal-copy { margin-top: 44px; font-size: 15px; line-height: 1.8; }.legal-copy h1 { margin: 12px 0 4px; font-size: clamp(38px,6vw,56px); letter-spacing: -.04em; line-height: 1.08; }.updated { margin: 0 0 30px; color: var(--muted); font-size: 13px; }.legal-copy h2 { margin: 40px 0 8px; font-size: 20px; line-height: 1.3; }.legal-copy p { margin: 0 0 15px; color: #c2ced8; }.notice { margin: 30px 0; border-left: 3px solid var(--gold); padding: 17px 20px; color: #dae1e7; background: rgba(213,193,122,.09); line-height: 1.7; }.notice strong { color: #f5e6a8; }.translation-note { margin-top: 42px !important; border-top: 1px solid var(--line); padding-top: 18px; color: var(--muted) !important; font-size: 13px; }.legal-footer { min-height: 80px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }.legal-footer-links { display: flex; flex-wrap: wrap; gap: 14px; }.legal-footer-links a { color: #bdc9d3; font-weight: 700; text-decoration: none; }.legal-footer-links a:hover { color: var(--gold); }
html[data-language="en"] [data-copy-language="zh"], html[data-language="zh"] [data-copy-language="en"] { display: none; }
@media (max-width: 620px) { .legal-header, .legal-footer, .legal-shell { width: calc(100% - 32px); }.legal-header { min-height: 72px; }.brand strong { font-size: 12px; }.brand small { display: none; }.header-actions { gap: 12px; }.return-link { font-size: 12px; }.legal-shell { padding-top: 46px; }.legal-copy { margin-top: 34px; font-size: 14px; }.legal-copy h2 { margin-top: 31px; font-size: 18px; }.legal-footer { align-items: flex-start; flex-direction: column; justify-content: center; gap: 6px; } }
