:root{--paper:#f3f1e9;--ink:#283d35;--green:#365e50;--line:#d9ddd1;--muted:#7d877b}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.8 'Microsoft YaHei',sans-serif}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #b67e49;outline-offset:4px}header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid var(--line);background:var(--paper)}.brand{font-family:Georgia,'SimSun',serif;font-size:24px;letter-spacing:2px}.brand small{font:9px sans-serif;letter-spacing:2px;margin-left:12px}nav{display:flex;gap:32px;font-size:13px}.edition{font-size:11px;color:var(--muted);letter-spacing:2px}main{max-width:1600px;margin:auto}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:650px;padding:70px 7% 30px}.hero-copy{padding-top:35px;position:relative;z-index:1}.eyebrow{font-size:10px;letter-spacing:2.8px;color:#6c8775;margin-bottom:24px}.hero h1{font:normal clamp(38px,4.5vw,68px)/1.4 'SimSun',Georgia,serif;letter-spacing:3px;margin:0 0 25px}.intro{color:#737c71;font-size:14px;line-height:2.2;margin-bottom:30px}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;background:var(--green);color:#fff;padding:14px 25px;border:1px solid var(--green);font-size:13px;letter-spacing:1px;border-radius:3px}.primary:hover{background:#264a3c}.textlink{border:0;background:none;padding:10px 0;color:#596e5d;font-size:12px}.hero .textlink{display:block;margin-top:12px}.hero-note{display:flex;gap:24px;font-size:10px;color:#899181;margin-top:40px}.hero-art{position:relative;display:flex;align-items:center;justify-content:center;min-width:0}.hero-art canvas{width:112%;position:relative;z-index:1}.orb{position:absolute;width:90%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#cdd8c8 0%,#e0e6d8 48%,transparent 71%)}.vertical{position:absolute;right:-10px;top:90px;writing-mode:vertical-rl;letter-spacing:6px;font:12px 'SimSun',serif}.art-caption{position:absolute;bottom:40px;left:20%;font:16px 'SimSun',serif;letter-spacing:3px}.art-caption small{display:block;font:9px sans-serif;letter-spacing:1px;margin-top:10px;color:#7e8d7d}.story{padding:60px 7%;display:grid;grid-template-columns:1fr 1.25fr .8fr;gap:60px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}h2{font:normal 35px/1.5 'SimSun',Georgia,serif;letter-spacing:2px;margin:0}.story p:not(.eyebrow){font-size:13px;color:#6c776b}.fact{border-left:1px solid var(--line);padding:25px 0 0 35px}.fact strong{display:block;font:30px 'SimSun',serif}.fact span{display:block;font-size:10px;letter-spacing:2px;margin-top:14px}.fact hr{border:0;border-top:1px solid var(--line);margin:25px 0}.fact small{font-size:10px;color:#84907f}.studio,.result,.collection,.sources{padding:70px 7%}.sectiontop{display:flex;justify-content:space-between;align-items:end;margin-bottom:35px}.sectiontop p:not(.eyebrow){font-size:12px;color:#7c8679}.sectiontop .eyebrow{margin-bottom:12px}.workspace{display:grid;grid-template-columns:1.7fr 1fr;border:1px solid var(--line);min-height:660px}.stage{background:radial-gradient(ellipse at 50% 45%,#e1e8da,#e9eade 80%);position:relative;display:flex;flex-direction:column;min-width:0}.stagehead,.stagefoot{display:flex;justify-content:space-between;padding:20px 24px;font-size:10px;color:#7c8a78;gap:10px}.stagehead span:last-child{border:1px solid #b6c3ae;padding:0 8px;border-radius:20px}.stage canvas{width:100%;height:490px;touch-action:pan-y;display:block}.stagefoot{margin-top:auto}.viewtools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.viewtools button,.templatebuttons button,.name-actions button,.secondary{background:transparent;border:1px solid #b6c3ae;color:var(--ink);border-radius:3px;padding:9px 13px;font-size:11px;min-height:44px}.controls{padding:26px;background:#f9f8f2}.steps{display:flex;border-bottom:1px solid var(--line);margin-bottom:28px}.steps button{flex:1;border:0;border-bottom:2px solid transparent;background:none;font-size:12px;padding:8px 0 15px;color:#969f8f;min-height:44px}.steps button.active{color:var(--green);border-color:var(--green)}.control-title{font:19px 'SimSun',serif;margin:0 0 20px}.templatebuttons{display:flex;gap:8px}.templatebuttons button{flex:1}.selected{border-color:var(--green)!important;background:#e7ecdf!important}.hint{color:#7c8976;font-size:11px;line-height:1.9;margin:17px 0}label{display:block;font-size:12px;margin:17px 0;color:#5c6d58}label output{float:right;font-size:11px}input[type=range]{display:block;width:100%;accent-color:var(--green);margin:14px 0}select{background:transparent;color:var(--ink);border:1px solid var(--line);padding:8px;width:100%;margin-top:7px;min-height:44px}.observe{padding-top:15px;border-top:1px solid var(--line);margin:20px 0}.observe strong{font-size:11px;letter-spacing:1px}.observe p{font-size:11px;color:#7b8775}.full{width:100%;justify-content:center}.swatches{display:flex;gap:12px}.swatches button{border:1px solid transparent;padding:10px;background:transparent;color:var(--ink);font-size:11px;flex:1}.swatches i{width:40px;height:40px;border-radius:50%;display:block;margin:0 auto 10px;box-shadow:inset 1px 2px 6px #ffffff88}.fireseal{height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:65px 'SimSun';color:#99a68d}.fireseal span{font:10px sans-serif;letter-spacing:4px;margin-top:17px}#fireStatus{font-size:12px;min-height:24px}.burning{animation:fire 1s infinite alternate}@keyframes fire{to{background:#dfc19a}}.result{border-top:1px solid var(--line)}.pill{border:1px solid #b8c2b2;font-size:10px;padding:5px 12px;border-radius:20px}.resultgrid{display:grid;grid-template-columns:1fr 1fr;gap:65px}.resultpreview{background:#e7ebdf;text-align:center}.resultpreview canvas{width:100%;max-height:460px;object-fit:contain}.resultpreview div{font-size:11px;padding:0 15px 20px;color:#7c8976}.resultcopy{max-width:440px;padding-top:25px}.resultcopy input,.resultcopy textarea{width:100%;display:block;background:transparent;border:0;border-bottom:1px solid #b9c3b0;color:var(--ink);padding:10px 0;font-size:20px;resize:vertical}.resultcopy textarea{font-size:13px;height:110px}.name-actions{margin:20px 0}.name-actions small{display:block;font-size:10px;color:#8b9384;margin-top:8px}.secondary{margin-top:12px}.collection{border-top:1px solid var(--line)}#gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.piece{background:#e7ebdf;padding:15px}.piece img{width:100%;height:230px;object-fit:contain}.piece strong{font:20px 'SimSun';display:block}.piece small{font-size:10px;color:#7b8873}#compare{font-size:12px;padding-top:30px;color:#6e7e68}.compare-row{display:flex;gap:25px}.compare-row img{height:130px;background:#e6eadc}.sources{display:grid;grid-template-columns:1fr 1.5fr;gap:80px;border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:17px 0;font-size:12px}summary{cursor:pointer;min-height:30px}details p,details a{color:#7b8973;font-size:11px}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:35px 7%;align-items:center}footer span,footer small{font-size:10px;color:#89947e}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);padding:12px 24px;background:var(--ink);color:white;border-radius:4px;font-size:12px;opacity:0;pointer-events:none;z-index:99}#toast.show{opacity:1}[hidden]{display:none!important}@media(max-width:900px){.edition{display:none}.hero{min-height:550px;padding:35px 6%}.hero h1{font-size:42px}.hero-art canvas{width:135%}.story{gap:25px;grid-template-columns:1fr 1.2fr}.fact{display:none}.workspace{grid-template-columns:1.2fr 1fr}.controls{padding:20px}.hero-note{gap:12px}.stage canvas{height:460px}.resultgrid{gap:30px}}@media(max-width:650px){header{height:70px;padding:0 5%}.brand{font-size:19px}.brand small{display:none}nav{gap:16px;font-size:11px}nav a:last-child{display:none}.hero{display:flex;flex-direction:column;padding-top:25px}.hero-copy{padding-top:0}.hero h1{font-size:40px}.hero-art{height:340px;margin-top:-25px;overflow:hidden}.hero-art canvas{width:360px}.hero-note{margin-top:25px}.vertical{right:15px;top:70px}.art-caption{bottom:10px;left:10%}.story{display:block;padding:35px 6%}.story h2{font-size:27px;margin-bottom:25px}.eyebrow{margin-bottom:15px}.studio,.result,.collection,.sources{padding:40px 5%}h2{font-size:28px}.sectiontop{align-items:start;gap:15px}.sectiontop p:not(.eyebrow){display:none}.workspace{display:flex;flex-direction:column}.stage canvas{height:370px}.stagehead,.stagefoot{padding:13px;font-size:9px}.controls{padding:22px}.steps{margin-bottom:20px}.resultgrid{grid-template-columns:1fr;gap:0}.resultcopy{max-width:none}.resultpreview canvas{max-height:350px}.result .sectiontop{display:block}.pill{display:inline-block;margin-top:15px}#gallery{grid-template-columns:1fr 1fr;gap:12px}.piece img{height:150px}.sources{display:block}.sources h2{margin-bottom:20px}footer{gap:20px;flex-wrap:wrap}footer span{display:none}.hero .eyebrow{font-size:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important}}
/* Cultural atlas and editorial imagery */
.hero-landscape{position:absolute;width:115%;height:100%;object-fit:cover;opacity:.28;mask-image:radial-gradient(ellipse,#000 35%,transparent 72%);border-radius:50%}.culture-section{padding:70px 7%;border-top:1px solid var(--line)}.editorial-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:55px;align-items:center}figure{margin:0}figure img,.illustrated-map>img{width:100%;display:block;aspect-ratio:3/2;object-fit:cover;border-radius:4px}figcaption{font-size:10px;color:#82917a;margin-top:10px;letter-spacing:1px}.choice-row,.process-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:25px}.choice-row button,.process-buttons button,.pattern-options button,.observation-hotspots button{border:1px solid #bbc6b4;background:transparent;color:var(--ink);padding:10px 15px;border-radius:3px;min-height:44px;font-size:12px}.reading-panel small{font-size:10px;letter-spacing:2px;color:#859078}.reading-panel h3{font:normal 29px/1.5 SimSun,serif;letter-spacing:1px;margin:15px 0}.reading-panel p{font-size:13px;line-height:2.1;color:#62715e}.reading-panel p:last-child{border-top:1px solid var(--line);padding-top:15px;font-size:11px}.source-link{display:block;font-size:10px;color:#6f8566;margin-top:20px;text-decoration:underline;text-underline-offset:4px}.illustrated-map{position:relative}.map-pin{position:absolute;border:1px solid #fff;border-radius:50%;width:38px;height:38px;background:#365e50;color:white;box-shadow:0 0 0 6px #ffffff40;min-height:38px}.map-pin span{position:absolute;top:40px;left:50%;transform:translateX(-50%);white-space:nowrap;color:#283d35;background:#f3f1e9e8;padding:1px 8px;font-size:11px}.map-pin.selected{color:var(--green);box-shadow:0 0 0 9px #ffffff70}.illustrated-map>small{position:absolute;bottom:10px;left:12px;background:#f3f1e9dd;padding:3px 8px;font-size:9px;color:#65775c}.map-section{background:#e9edde}.inline-actions{display:flex;gap:14px;margin:20px 0}.inline-actions .secondary{margin-top:0}.observation-stage{background:radial-gradient(ellipse,#dce5d3,#ebeee2);position:relative;border-radius:4px}.observation-stage canvas{width:100%;display:block;max-height:490px;object-fit:contain}.observation-hotspots{position:absolute;right:15px;top:20%;display:flex;flex-direction:column;gap:32px}.observation-hotspots button{background:#f3f1e9dc}.pattern-editor{border-top:1px solid var(--line);margin-top:22px;padding-top:22px}.pattern-options{display:flex;gap:6px;flex-wrap:wrap}.pattern-options button{padding:7px 12px;font-size:11px}.controls{max-height:880px;overflow-y:auto}.workspace{align-items:stretch}.stage{position:relative}.stage canvas{margin:auto 0}.edition{display:none}nav{gap:22px}#mapProgress{white-space:nowrap}@media(max-width:900px){.editorial-grid{gap:28px}.culture-section{padding:45px 6%}nav{gap:14px}nav a{font-size:11px}.brand small{display:none}}@media(max-width:650px){.editorial-grid{grid-template-columns:1fr;gap:25px}.culture-section{padding:40px 5%}.reading-panel h3{font-size:25px}nav{gap:12px;max-width:58%;overflow-x:auto;white-space:nowrap}nav a{display:block!important}.controls{max-height:none;overflow:visible}.illustrated-map>small{font-size:8px;bottom:5px;left:5px;right:5px}.map-pin{width:32px;height:32px;min-height:32px}.choice-row button{flex:1;white-space:nowrap;padding:9px 10px}.observation-stage canvas{max-height:390px}}
.puzzle{margin-top:35px;padding:25px;border:1px solid #b8c7ad;background:#edf0e5}.puzzle h3{font:26px SimSun,serif}.match-board{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:130px;max-width:850px;margin:25px auto}.match-board>svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.matched-line{fill:none;stroke:#63916c;stroke-width:3}.match-board>div{display:grid;gap:15px;grid-template-rows:repeat(4,105px)}.match-board button{border:1px solid #b8c7ad;background:#f8f7ef;color:#344d3d;border-radius:4px;min-height:44px}.match-picture{display:flex;align-items:center;padding:0;overflow:hidden;gap:15px;touch-action:none}.match-picture img{height:100%;width:65%;object-fit:cover}.match-picture span{font-size:11px}.match-board .correct{border:2px solid #6b996b;background:#e0edda}.route-overlay{position:absolute;inset:0}.route-overlay svg,#routePad{position:absolute;inset:0;width:100%;height:100%}#routePad{touch-action:none;cursor:crosshair}#routeLine{fill:none;stroke:#fff9d6;stroke-width:3;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 1px 2px #486045)}#routeStart{fill:#365e50;stroke:#fff;stroke-width:.6}#routeEnd{fill:#be8858;stroke:#fff;stroke-width:.6}#routeWalker{fill:#f5edc7;stroke:#365e50;stroke-width:.8}.route-tools .secondary{margin:0}.route-tools>p:first-child{font-size:13px;color:#365e50;min-height:25px}#sortList{padding:0;list-style:none}#sortList li{display:flex;align-items:center;gap:7px;background:#f8f7ef;padding:11px;border:1px solid #c6d0bd;margin:8px 0;cursor:grab}#sortList span{flex:1;font-size:12px}#sortList button{font-size:10px;padding:7px;border:1px solid #c3cdb9;background:transparent;color:#3d5947;min-height:36px}#sortFeedback,#matchFeedback{color:#365e50;font-size:12px;min-height:25px}.illustrated-map>small{z-index:3;pointer-events:none}#craftLessons[hidden]{display:none!important}@media(max-width:650px){.puzzle{padding:16px}.match-board{gap:45px}.match-board>div{grid-template-rows:repeat(4,90px)}.match-picture{gap:3px;flex-direction:column}.match-picture img{width:100%;height:65px}.match-picture span{font-size:9px}.match-board button{font-size:11px}#sortList li{padding:8px}#sortList button{min-height:44px}.route-tools .hint{font-size:10px}}
.hand-controls{padding-bottom:18px;margin-bottom:19px;border-bottom:1px solid var(--line)}.hand-controls .control-title{margin-bottom:12px}.camera-frame{position:relative;overflow:hidden;border-radius:4px;background:#283d35}.camera-frame video{display:block;width:100%;transform:scaleX(-1)}.camera-frame canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.swatches{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.swatches button{padding:8px 2px;min-height:60px}.swatches i{width:32px;height:32px;margin-bottom:4px}
#heroThree{width:min(112%,720px);aspect-ratio:1.08;display:block;position:relative;z-index:1}
.hero-art .art-caption{z-index:2}.art-caption button{display:block;margin-top:9px;background:#f4f2e9c9}
.story-guide{align-items:start}.story-copy h3{font:normal 22px/1.5 SimSun,serif;margin:0 0 8px}.story-copy p{color:#596954;line-height:2;margin:0 0 22px}.story-sources{display:flex;gap:18px;flex-wrap:wrap}.story-sources a{font-size:12px;text-decoration:underline;text-underline-offset:3px}.site-location img{aspect-ratio:auto}
#routeWalker{position:absolute;width:34px;height:41px;transform:translate(-50%,-85%);pointer-events:none;filter:drop-shadow(0 2px 2px #263f35);z-index:2}#routeWalker svg{width:100%;height:100%}#routePad{z-index:3}.craft-frame{position:relative}.craft-frame canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:4px}.craft-figure .secondary{margin-top:10px}
@media(max-width:650px){#heroThree{width:100%;max-width:420px}#routeWalker{width:27px;height:33px}}