@import url("https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@400;500;600;700;900&display=swap");

:root { color-scheme: dark; --home-ink:#0b1617; --home-deep:#102524; --home-sea:#173b41; --home-land:#68705a; --home-paper:#d6c59b; --home-dim:#9f987e; --home-gold:#c4a467; --home-red:#9a4b3d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--home-ink); }
body { margin:0; color:var(--home-paper); background:radial-gradient(circle at 72% 8%, rgba(70,117,103,.22), transparent 28rem), linear-gradient(135deg,#0b1718 0%,#122423 52%,#0a1415 100%); font-family:"Noto Serif SC","Songti SC",serif; }
a { color:inherit; }
.home-body { min-height:100vh; overflow-x:hidden; }
.home-nav { height:76px; padding:0 clamp(18px,4vw,70px); display:flex; align-items:center; gap:34px; border-bottom:1px solid rgba(202,176,119,.2); background:rgba(8,17,18,.78); backdrop-filter:blur(16px); position:sticky; top:0; z-index:10; }
.home-brand { display:flex; align-items:center; gap:12px; text-decoration:none; margin-right:auto; }
.home-brand strong { display:block; font-size:20px; letter-spacing:.25em; }
.home-brand small { display:block; margin-top:3px; color:var(--home-dim); font-size:9px; letter-spacing:.18em; }
.home-seal { display:grid; place-items:center; width:40px; height:40px; color:#f1dfb7; background:#843c32; border:2px solid #bd806a; box-shadow:inset 0 0 0 3px #602a25; font:27px "Ma Shan Zheng",cursive; }
.home-nav nav { display:flex; gap:25px; color:var(--home-dim); font-size:11px; letter-spacing:.12em; }
.home-nav nav a,.home-footer a { text-decoration:none; }
.home-nav nav a:hover,.home-footer a:hover { color:#f0d59d; }
.nav-play { padding:10px 16px; color:#f0d59d; border:1px solid rgba(196,164,103,.56); text-decoration:none; font-size:11px; letter-spacing:.14em; }
.nav-play span { margin-left:8px; font-size:16px; }
.home-hero { min-height:650px; max-width:1280px; margin:0 auto; padding:clamp(68px,9vw,130px) clamp(22px,5vw,70px) 84px; display:grid; grid-template-columns:minmax(0,.9fr) minmax(390px,1.1fr); align-items:center; gap:clamp(35px,7vw,110px); }
.hero-copy { position:relative; z-index:2; }
.eyebrow { margin:0 0 16px; color:var(--home-gold); font-size:10px; letter-spacing:.27em; text-transform:uppercase; }
.hero-copy h1 { margin:0; color:#eee0b8; font:clamp(70px,11vw,142px)/.9 "Ma Shan Zheng",serif; font-weight:400; letter-spacing:.08em; text-shadow:0 16px 32px rgba(0,0,0,.5); }
.hero-lead { max-width:520px; margin:30px 0 14px; color:#ead9ae; font-size:clamp(18px,2.1vw,26px); line-height:1.7; letter-spacing:.08em; }
.hero-body { max-width:510px; margin:0; color:var(--home-dim); font-size:13px; line-height:2.15; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-width:148px; padding:13px 20px; text-decoration:none; font-size:12px; letter-spacing:.15em; transition:transform .2s,background .2s,border-color .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#f8e6b7; background:#8b3b31; border:1px solid #c27b60; box-shadow:0 10px 24px rgba(0,0,0,.25); }
.button-primary:hover { background:#a34e3d; }
.button-primary span { margin-left:12px; font-size:18px; }
.button-secondary { color:#d2c398; background:rgba(20,40,38,.52); border:1px solid rgba(196,164,103,.48); }
.button-secondary:hover { border-color:#d4b87b; background:rgba(37,64,56,.7); }
.hero-note { margin:18px 0 0; color:#777b6a; font-size:9px; letter-spacing:.1em; }
.atlas-hero { position:relative; height:min(50vw,510px); min-height:360px; overflow:hidden; background:radial-gradient(circle at 42% 48%,rgba(97,132,105,.28),transparent 38%),linear-gradient(142deg,#1a4546,#173538 52%,#102a30); border:1px solid rgba(204,179,121,.38); box-shadow:inset 0 0 60px rgba(0,0,0,.5),0 30px 70px rgba(0,0,0,.24); transform:rotate(1.2deg); }
.atlas-hero::before { content:""; position:absolute; inset:16px; border:1px solid rgba(204,179,121,.25); pointer-events:none; }
.atlas-grid { position:absolute; inset:0; opacity:.34; background:linear-gradient(90deg,transparent 49.8%,rgba(203,184,137,.16) 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,rgba(203,184,137,.12) 50%,transparent 50.2%); background-size:72px 72px; }
.atlas-coast,.atlas-river { position:absolute; pointer-events:none; }
.atlas-coast { border:2px solid rgba(209,194,150,.46); border-left-color:transparent; border-bottom-color:transparent; border-radius:52% 48% 42% 65%; transform:rotate(-18deg); }
.coast-a { width:70%; height:72%; left:10%; top:11%; }
.coast-b { width:42%; height:52%; right:-1%; bottom:-4%; transform:rotate(32deg); opacity:.7; }
.atlas-river { height:2px; background:rgba(108,185,191,.62); transform-origin:left center; box-shadow:0 0 8px rgba(108,185,191,.25); }
.river-a { width:68%; left:18%; top:47%; transform:rotate(10deg); }
.river-b { width:40%; left:38%; top:59%; transform:rotate(-24deg); opacity:.72; }
.atlas-label { position:absolute; color:#e5d4a9; font-size:15px; letter-spacing:.15em; text-shadow:0 2px 4px #0b1717; }
.label-chang { left:31%; top:43%; }.label-luo { left:55%; top:35%; }.label-jian { left:20%; top:68%; }.label-yan { right:16%; top:23%; }
.atlas-compass { position:absolute; top:28px; right:30px; color:#c8ae78; text-align:center; font-size:10px; line-height:1.5; }.atlas-compass i { font-style:normal; font-size:15px; }
.atlas-stamp { position:absolute; right:28px; bottom:28px; width:48px; height:56px; display:grid; place-items:center; color:rgba(187,93,76,.75); border:2px solid rgba(187,93,76,.65); font:15px/1.1 "Ma Shan Zheng",cursive; transform:rotate(-7deg); }
.home-section { max-width:1120px; margin:0 auto; padding:100px clamp(22px,5vw,60px); }
.section-heading { border-bottom:1px solid rgba(203,177,118,.18); padding-bottom:20px; }.section-heading h2,.home-cta h2 { margin:0; color:#e4d7b2; font-size:clamp(25px,3.6vw,42px); font-weight:500; letter-spacing:.12em; }
.world-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:34px; background:rgba(204,174,112,.17); }.world-grid article { min-height:220px; padding:28px 25px; background:rgba(14,31,30,.8); }.feature-number { color:var(--home-gold); font-size:11px; letter-spacing:.2em; }.world-grid h3 { margin:28px 0 13px; color:#e3d4ad; font-size:19px; font-weight:500; }.world-grid p { margin:0; color:var(--home-dim); font-size:12px; line-height:2; }
.dark-section { max-width:none; padding-left:max(22px,calc((100% - 1000px)/2)); padding-right:max(22px,calc((100% - 1000px)/2)); background:rgba(5,14,15,.33); border-top:1px solid rgba(198,169,108,.1); border-bottom:1px solid rgba(198,169,108,.1); }.feature-list { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:35px; }.feature-list div { padding:22px 0; border-top:2px solid rgba(196,164,103,.42); }.feature-list b { display:block; color:#d8bd80; font-size:16px; }.feature-list span { display:block; margin-top:13px; color:var(--home-dim); font-size:12px; line-height:1.9; }
.home-cta { padding:110px 22px 125px; text-align:center; background:radial-gradient(circle at center,rgba(63,102,83,.18),transparent 48%); }.home-cta .eyebrow { margin-bottom:14px; }.home-cta .hero-actions { justify-content:center; margin-top:28px; }
.home-footer { min-height:68px; padding:20px clamp(22px,5vw,70px); display:flex; align-items:center; gap:26px; color:#777c6c; border-top:1px solid rgba(202,176,119,.16); font-size:9px; letter-spacing:.08em; }.home-footer span:nth-child(2) { margin-right:auto; }.home-footer a { color:#c9ae75; }
@media (max-width:780px) { .home-nav { height:64px; gap:10px; }.home-nav nav { display:none; }.nav-play { padding:9px 10px; font-size:9px; }.home-hero { grid-template-columns:1fr; padding-top:66px; }.atlas-hero { min-height:310px; height:78vw; }.world-grid,.feature-list { grid-template-columns:1fr; }.world-grid article { min-height:0; }.home-section { padding-top:72px; padding-bottom:72px; }.home-footer { flex-wrap:wrap; gap:9px; }.home-footer span:nth-child(2) { width:100%; order:3; } }

.download-main { max-width:1080px; margin:0 auto; padding:90px clamp(22px,5vw,60px) 120px; }
.download-header { max-width:680px; }.download-header h1 { margin:0; color:#eadbb4; font-size:clamp(34px,5vw,58px); font-weight:500; letter-spacing:.12em; }.download-header p:not(.eyebrow) { color:var(--home-dim); font-size:13px; line-height:2; }
.download-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:48px; }.download-card { min-height:240px; padding:27px; display:flex; flex-direction:column; border:1px solid rgba(200,171,112,.23); background:rgba(14,32,31,.68); }.download-card h2 { margin:0; color:#eadab4; font-size:19px; font-weight:500; }.download-card p { flex:1; color:#99957e; font-size:11px; line-height:1.9; }.download-card .version { color:#c3a466; font-size:10px; letter-spacing:.12em; }.download-card .button { min-width:0; width:100%; margin-top:18px; }.download-card.soon { opacity:.72; }.download-card.soon .button { color:#90886f; border-color:rgba(150,136,105,.32); cursor:default; }.download-note { margin-top:45px; padding:20px 22px; color:#a29b82; background:rgba(8,20,20,.55); border-left:2px solid var(--home-gold); font-size:11px; line-height:1.9; }.download-note a { color:#d3b478; }
@media (max-width:780px) { .download-main { padding-top:65px; }.download-grid { grid-template-columns:1fr; } }
