:root { --ink:#0a0a0a; --paper:#f5f3ef; --gold:#c99642; --gold-light:#f0cc84; --muted:#77746e; --line:rgba(255,255,255,.13); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:#f8f6f0; background:#080808; font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.site-header { position:sticky; top:0; z-index:50; height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 5vw; border-bottom:1px solid var(--line); background:rgba(8,8,8,.84); backdrop-filter:blur(20px); }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:.14em; }
.brand img { width:46px; height:46px; object-fit:contain; }
.main-nav,.legal-nav { display:flex; align-items:center; gap:30px; font-size:14px; color:#bbb8b0; }
.main-nav a,.legal-nav a { transition:.25s ease; }
.main-nav a:hover,.legal-nav a:hover,.legal-nav .active { color:#fff; }
.nav-cta { padding:11px 18px; border:1px solid rgba(240,204,132,.5); border-radius:999px; color:var(--gold-light)!important; }
.menu-button { display:none; color:#fff; border:1px solid var(--line); background:transparent; border-radius:999px; padding:8px 13px; }
.hero { min-height:calc(100vh - 76px); display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:6vw; padding:70px 7vw 90px; position:relative; overflow:hidden; background:radial-gradient(circle at 78% 30%,rgba(197,139,47,.14),transparent 30%),linear-gradient(135deg,#0b0b0b,#050505); }
.hero::before { content:"唐"; position:absolute; left:-3vw; bottom:-18vw; font-family:serif; font-size:48vw; line-height:1; color:rgba(255,255,255,.018); pointer-events:none; }
.hero-glow { position:absolute; inset:20% 8% auto auto; width:350px; height:350px; background:rgba(201,150,66,.18); filter:blur(100px); border-radius:50%; }
.hero-copy { position:relative; z-index:2; max-width:650px; }
.eyebrow,.section-kicker { margin:0 0 22px; color:var(--gold-light); font-size:12px; font-weight:700; letter-spacing:.28em; }
.hero h1 { margin:0; font-family:"Songti SC","STSong",serif; font-size:clamp(52px,6vw,92px); line-height:1.08; font-weight:600; letter-spacing:-.04em; }
.hero h1 span { color:transparent; -webkit-text-stroke:1px rgba(240,204,132,.85); }
.hero-lead { max-width:570px; margin:30px 0; color:#aaa69f; font-size:17px; line-height:1.9; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 24px; border-radius:3px; font-weight:650; }
.button-primary { color:#17120a; background:linear-gradient(135deg,#f3d18f,#bc8431); box-shadow:0 12px 35px rgba(188,132,49,.2); }
.button-ghost { border:1px solid rgba(255,255,255,.2); }
.version { margin-top:18px; color:#65625d; font-size:12px; }
.hero-art { min-height:680px; position:relative; display:grid; place-items:center; }
.hero-logo { position:absolute; width:min(650px,50vw); opacity:.25; filter:drop-shadow(0 20px 70px rgba(0,0,0,.7)); }
.orbit { position:absolute; border:1px solid rgba(231,193,117,.14); border-radius:50%; }
.orbit-one { width:560px; height:560px; }
.orbit-two { width:680px; height:680px; }
.phone { position:relative; z-index:2; width:300px; padding:9px; border:1px solid #53442c; border-radius:44px; background:linear-gradient(145deg,#4b3e29,#111,#644b25); box-shadow:0 55px 100px rgba(0,0,0,.65); transform:rotate(3deg); }
.phone-screen { min-height:610px; overflow:hidden; color:#151515; background:#fff; border-radius:36px; position:relative; }
.phone-status { height:38px; display:flex; justify-content:space-between; padding:13px 20px 0; font-size:10px; }
.phone-banner { margin:6px 13px; height:170px; padding:28px 20px; display:flex; flex-direction:column; color:#fff; background:linear-gradient(115deg,rgba(0,0,0,.25),rgba(0,0,0,.78)),url("assets/app-home-bg.png") center/cover; border-radius:16px; }
.phone-banner span { color:#e9c16f; font-size:9px; letter-spacing:.15em; }.phone-banner strong { margin-top:16px; font-family:serif; font-size:24px; }.phone-banner small { margin-top:8px; color:#bcb7ac; }
.notice { width:84%; margin:-20px auto 0; display:flex; gap:12px; padding:11px 13px; font-size:9px; background:#fff; border-radius:9px; box-shadow:0 8px 25px rgba(0,0,0,.12); }.notice b { color:#b57b28; }
.quick-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; padding:18px 12px 14px; font-size:8px; text-align:center; }.quick-grid span { display:grid; gap:5px; }.quick-grid i { width:32px; height:32px; display:grid; place-items:center; margin:auto; color:#a36d20; background:#f4eee3; border-radius:50%; font-style:normal; font-family:serif; font-size:14px; }
.phone-tabs { display:flex; gap:18px; padding:10px 15px; color:#999; font-size:11px; }.phone-tabs b { color:#111; border-bottom:2px solid #b47b2e; padding-bottom:7px; }
.art-card { margin:4px 14px; padding:10px; display:flex; align-items:center; gap:10px; background:#f4f3f1; border-radius:12px; }.art-card>div { width:62px; height:66px; background:linear-gradient(135deg,#cfa75f,#171717); border-radius:8px; }.art-card p { display:grid; flex:1; gap:7px; margin:0; }.art-card strong { font-size:12px; }.art-card small { color:#999; font-size:8px; }.art-card>b { font-size:8px; color:#a77627; }
.phone-nav { position:absolute; inset:auto 0 0; display:flex; justify-content:space-around; padding:14px 8px 18px; background:#fff; border-top:1px solid #eee; font-size:8px; color:#999; }.phone-nav b { color:#111; }
.section-pad { padding:130px 8vw; }
.manifesto { text-align:center; background:var(--paper); color:var(--ink); }.manifesto h2 { max-width:920px; margin:0 auto; font-family:"Songti SC",serif; font-size:clamp(34px,5vw,68px); line-height:1.35; font-weight:500; }.manifesto>p:last-child { max-width:650px; margin:30px auto 0; color:var(--muted); line-height:1.9; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:55px; }.section-heading h2,.safety h2,.support h2,.download h2 { margin:0; font-family:"Songti SC",serif; font-size:clamp(38px,4.5vw,64px); font-weight:500; }.section-heading>p { max-width:480px; margin:0; color:#8c8983; line-height:1.8; }
.feature-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:18px; }.feature-card { min-height:360px; padding:34px; position:relative; overflow:hidden; border:1px solid var(--line); background:linear-gradient(145deg,#121212,#0b0b0b); }.feature-large { grid-row:span 2; min-height:738px; }.feature-number { color:var(--gold); font:12px monospace; letter-spacing:.2em; }.feature-card h3 { margin:75px 0 14px; font:500 31px "Songti SC",serif; }.feature-card p { max-width:410px; color:#8c8983; line-height:1.8; }.mini-gallery { position:absolute; right:30px; bottom:35px; display:flex; align-items:end; gap:10px; }.mini-gallery span { width:80px; height:120px; background:linear-gradient(160deg,#e5c484,#3b2e20 55%,#111); transform:rotate(-5deg); }.mini-gallery span:nth-child(2) { height:170px; transform:translateY(-12px); }.mini-gallery span:nth-child(3) { transform:rotate(5deg); }.line-art { position:absolute; right:-80px; bottom:-90px; width:300px; height:300px; border:1px solid #7d5b29; border-radius:50%; box-shadow:0 0 0 20px #0d0d0d,0 0 0 21px #3c2c18,0 0 0 42px #0d0d0d,0 0 0 43px #241d12; }.collection-stack { position:absolute; right:30px; bottom:30px; width:180px; height:130px; }.collection-stack i { position:absolute; width:100px; height:125px; border:1px solid #86642f; background:linear-gradient(145deg,#272118,#090909); transform:rotate(-10deg); }.collection-stack i:nth-child(2) { left:36px; transform:rotate(0); }.collection-stack i:nth-child(3) { left:72px; transform:rotate(10deg); }
.safety { display:grid; grid-template-columns:1fr 1fr; gap:8vw; color:#15130f; background:#d2aa63; }.safety .section-kicker { color:#5e421a; }.safety-copy>p:not(.section-kicker) { margin:28px 0; max-width:560px; color:#604a2b; line-height:1.9; }.legal-actions { display:flex; flex-wrap:wrap; gap:28px; font-weight:700; }.privacy-list { border-top:1px solid rgba(0,0,0,.18); }.privacy-list>div { display:flex; align-items:center; gap:24px; padding:24px 4px; border-bottom:1px solid rgba(0,0,0,.18); }.privacy-list span { font:12px monospace; }.privacy-list p { display:grid; gap:6px; margin:0; }.privacy-list strong { font-size:19px; }.privacy-list small { color:#604a2b; }
.support { background:#0d0d0d; }.support-panel { padding:65px; border:1px solid var(--line); background:linear-gradient(135deg,#15130f,#0a0a0a); }.support-panel>p:not(.section-kicker) { color:#8f8a80; }.support-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:45px; background:var(--line); }.support-grid>div { min-height:120px; display:flex; flex-direction:column; justify-content:center; gap:12px; padding:24px; background:#111; }.support-grid small { color:#74716b; }.todo { color:#e0a94b!important; }
.download { display:grid; grid-template-columns:160px 1fr auto; align-items:center; gap:50px; background:#050505; border-top:1px solid var(--line); }.download>img { width:160px; filter:drop-shadow(0 20px 35px rgba(190,137,50,.16)); }.download>div>p:last-child { color:#777; }.store-badge { min-width:185px; display:grid; padding:10px 20px; border:1px solid #555; border-radius:10px; }.store-badge small { font-size:10px; }.store-badge b { font-size:22px; }
footer { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; padding:45px 5vw; border-top:1px solid var(--line); color:#777; font-size:13px; }.footer-brand { display:flex; align-items:center; gap:10px; color:#fff; }.footer-brand img { width:42px; }.footer-brand div { display:grid; gap:3px; }.footer-brand span { color:#777; font-size:9px; letter-spacing:.2em; }.footer-links { display:flex; gap:24px; color:#aaa; }footer>p { grid-column:1/-1; margin:0; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s ease; }.reveal.is-visible { opacity:1; transform:none; }
.legal-page { color:#171717; background:#f5f3ef; }.legal-page .site-header { color:#fff; }.legal-shell { width:min(1200px,90vw); margin:0 auto; display:grid; grid-template-columns:280px minmax(0,760px); justify-content:space-between; gap:80px; padding:90px 0 120px; }.legal-shell aside { position:sticky; top:120px; height:max-content; }.legal-shell aside>p { color:#a87731; font-size:12px; letter-spacing:.25em; }.legal-shell aside h1 { margin:15px 0; font:500 48px "Songti SC",serif; }.legal-shell aside>span { color:#8a8780; font-size:13px; line-height:1.8; }.legal-shell aside nav { display:grid; gap:10px; margin-top:35px; border-left:1px solid #d4d0c8; }.legal-shell aside nav a { padding-left:16px; color:#8a8780; font-size:12px; line-height:1.45; }.legal-content { min-width:0; }.legal-intro { padding:30px; margin-bottom:50px; background:#ebe6dc; line-height:1.9; }.legal-warning { color:#8d5b17; }.legal-content section { padding:10px 0 35px; border-bottom:1px solid #dedad3; }.legal-content h2 { margin:32px 0 20px; font:600 27px "Songti SC",serif; }.legal-content h3 { margin:25px 0 10px; font-size:17px; }.legal-content p,.legal-content li { color:#5d5a54; font-size:15px; line-height:2; }.legal-content li+li { margin-top:8px; }.legal-content a { color:#9b681f; text-decoration:underline; }.legal-content mark { padding:2px 5px; color:#8b5b19; background:#f0dfbf; }.data-table { margin:20px 0; border:1px solid #d8d2c8; }.data-table>div { display:grid; grid-template-columns:.7fr 1.7fr 1fr; }.data-table>div+div { border-top:1px solid #d8d2c8; }.data-table b,.data-table span { padding:13px; font-size:13px; line-height:1.6; }.data-table b { background:#e9e4da; }.sdk-table>div { grid-template-columns:1fr 1.2fr 1.8fr; }.legal-footer { display:flex; grid-template-columns:none; justify-content:space-between; background:#0a0a0a; color:#888; }.legal-footer div { display:flex; gap:24px; }
@media (max-width:900px) { .site-header { height:66px; padding:0 20px; }.brand img { width:40px;height:40px }.menu-button { display:block; }.main-nav { position:absolute; inset:66px 14px auto; display:none; flex-direction:column; align-items:stretch; gap:0; padding:10px; border:1px solid var(--line); border-radius:10px; background:#111; }.main-nav.is-open { display:flex; }.main-nav a { padding:14px; }.nav-cta { margin-top:5px; text-align:center; }.hero { grid-template-columns:1fr; padding:75px 7vw; }.hero-art { min-height:600px; }.hero-logo { width:90vw; }.section-pad { padding:90px 7vw; }.section-heading { align-items:start; flex-direction:column; }.feature-grid { grid-template-columns:1fr; }.feature-large { grid-row:auto; min-height:500px; }.safety { grid-template-columns:1fr; }.support-grid { grid-template-columns:1fr; }.download { grid-template-columns:100px 1fr; }.download>img { width:100px; }.store-badge { grid-column:1/-1; width:max-content; }.legal-shell { grid-template-columns:1fr; gap:30px; padding-top:50px; }.legal-shell aside { position:static; }.legal-shell aside nav { display:none; }.legal-nav { gap:14px; font-size:12px; }.legal-nav a:first-child { display:none; } }
@media (max-width:560px) { .hero h1 { font-size:47px; }.hero-art { min-height:540px; }.phone { width:270px; }.phone-screen { min-height:560px; }.orbit-one{width:430px;height:430px}.orbit-two{width:520px;height:520px}.feature-card { min-height:390px; padding:26px; }.feature-card h3 { margin-top:55px; }.mini-gallery { opacity:.55; }.support-panel { padding:32px 22px; }.download { grid-template-columns:1fr; gap:28px; }.download>img { width:120px; }.footer-links { flex-wrap:wrap; gap:14px; }footer { grid-template-columns:1fr; }.data-table { overflow-x:auto; }.data-table>div { min-width:620px; }.legal-shell { width:88vw; }.legal-content h2 { font-size:23px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal { opacity:1; transform:none; transition:none; } }