@font-face{font-family:YQInk;src:url('../../assets/fonts/MaShanZheng-Regular.ttf')}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#122a25;color:#253d34;font-family:'Songti SC','SimSun',serif}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font-family:inherit;cursor:pointer}#stage{width:1920px;height:1080px;position:absolute;transform-origin:top left;overflow:hidden;background:radial-gradient(ellipse at 80% 20%,#37635888,transparent 50%),linear-gradient(125deg,#173b32,#102a24 80%)}.frame{position:absolute;inset:23px;border:1px solid #b79a6266;pointer-events:none}.frame:before,.frame:after{content:'';position:absolute;width:100px;height:100px;border:3px double #bea46b99}.frame:before{top:8px;left:8px;border-right:0;border-bottom:0}.frame:after{right:8px;bottom:8px;border-left:0;border-top:0}header{position:absolute;top:43px;left:60px;right:60px;height:110px;display:flex;align-items:center;gap:55px;color:#e5d6ad;border-bottom:1px solid #b39a6266}.brand{font-size:25px;letter-spacing:5px;padding-right:45px;border-right:1px solid #b39a6266}.brand small{display:block;font:14px/2 system-ui;letter-spacing:2px;color:#aabbb0;margin-top:8px}.heading{display:flex;align-items:baseline;gap:28px}h1{font:68px YQInk,serif;font-weight:400;letter-spacing:10px;margin:0}.heading p{font-size:22px;letter-spacing:4px}.header-actions{display:flex;gap:14px;margin-left:auto}button,.header-actions a{border:1px solid #a59163;background:#efe5ca;color:#264438;padding:13px 20px;font-size:20px;text-decoration:none;transition:background .2s,box-shadow .2s}.header-actions a,.header-actions button{background:#173d31;color:#e9d7a8;font-size:18px}button:hover:not(:disabled),a:hover{background:#d4c398;box-shadow:0 3px 12px #10271e33}button:active:not(:disabled){filter:brightness(.93)}button:disabled{opacity:.34;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #dcab45;outline-offset:4px}.primary{background:#254e3d;color:#eee0b9;border-color:#8c7848}.primary:hover:not(:disabled){background:#3b6550}.header-actions button:hover,.header-actions a:hover{background:#42694e}#overview,#detail{position:absolute;left:60px;right:60px;top:179px;bottom:150px;display:grid;gap:30px}#overview{grid-template-columns:1450px 1fr}.scroll,.theatre,.reading{background-color:#eee5cf;background-image:radial-gradient(#8d754610 .7px,transparent .8px),linear-gradient(110deg,#f9f2df,#e9ddbf 90%);background-size:5px 5px,100% 100%;box-shadow:0 18px 45px #0005,inset 0 0 40px #b89f6940}.scroll{position:relative;border:1px solid #bfa46c;border-inline:12px solid #b79d68;overflow:hidden}.scroll:before,.scroll:after{content:'';position:absolute;top:0;bottom:0;width:8px;background:linear-gradient(90deg,#72583599,#e1c690,#967d4b99);z-index:3}.scroll:before{left:0}.scroll:after{right:0}.scroll-title{height:49px;display:flex;justify-content:space-between;align-items:center;padding:5px 34px;border-bottom:1px solid #ad945f55}.scroll-title>span{font-size:23px;letter-spacing:5px}.scroll-title small{font-size:17px;color:#75694f}#scene-map{position:absolute;inset:54px 18px 33px}#routes{position:absolute;width:100%;height:100%;overflow:visible;color:#8a6b38;pointer-events:none}.route-line{fill:none;stroke:#a8894f;stroke-width:2;stroke-dasharray:5 5;marker-end:url(#arrow)}#scenes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);column-gap:92px;row-gap:10px;padding:0 34px}.scene{position:relative;padding:0 0 0 68px;background:transparent;border:0;box-shadow:none!important;display:flex;align-items:center;justify-content:center;min-height:0;isolation:isolate}.scene img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;filter:sepia(.25) contrast(.95);transition:transform .45s,filter .45s}.scene .caption{position:absolute;left:6px;top:33px;writing-mode:vertical-rl;display:flex;gap:8px;align-items:center}.scene .caption b{font:34px YQInk;font-weight:400;letter-spacing:4px}.scene .caption small{font:13px system-ui;writing-mode:horizontal-tb;color:#816e46;border-top:1px solid #a68c57;padding-top:4px}.scene:after{content:'';position:absolute;inset:4px -6px;border:1px solid transparent;pointer-events:none;transition:background .3s,border-color .3s;z-index:-1}.scene:hover{background:transparent!important}.scene:hover img{transform:translateY(-4px) scale(1.035);filter:sepia(.15) contrast(1.1)}.scene:hover:after,.scene:focus-visible:after{border-color:#ac8d5677;background:#c4b17e22}.scene.visited .caption small{color:#276349;border-color:#276349}.scroll-end{position:absolute;left:40px;right:40px;bottom:9px;display:flex;align-items:center;gap:22px;font-size:13px;letter-spacing:5px;color:#897344}.scroll-end i{height:1px;background:#ab925655;flex:1}.intro{color:#dfd8bf;padding:28px 0 0 4px}.small-title{font-size:16px;letter-spacing:4px;color:#c7ae76}.intro h2{font:39px/1.65 YQInk;margin:23px 0;letter-spacing:2px;color:#f0e3bd}.intro-line{width:45px;height:3px;background:#b29457;margin:24px 0}.intro p{font-size:21px;line-height:1.9;margin:17px 0}.instruction{border-top:1px solid #a88f574f;margin-top:24px;padding-top:18px;display:grid;gap:6px}.instruction b{font-size:20px;font-weight:400;color:#dec58c}.instruction span{font-size:16px;color:#a8bbae;margin-bottom:12px}.intro .primary{display:flex;justify-content:space-between;width:100%;font-size:19px;background:#cdb67c;color:#173728;margin-top:25px;padding:15px}.intro .note{font-size:14px;line-height:1.8;color:#a6b5a6;margin-top:17px}#detail{grid-template-columns:1210px 1fr;gap:25px}.theatre{border:1px solid #b99c62;position:relative;padding:24px 28px 14px;display:flex;flex-direction:column;min-height:0;overflow:hidden}.theatre-head{display:flex;justify-content:space-between;align-items:center;letter-spacing:3px;font-size:21px;position:relative;z-index:1}.theatre-head small{font-size:16px;letter-spacing:1px;color:#73806a}.theatre-head span:before{content:'◈';color:#9e7138;margin-right:12px}#active-art{position:relative;flex:1;min-height:0;margin:8px 20px 0;display:grid;place-items:center;overflow:hidden;mix-blend-mode:multiply}#active-art svg{width:100%;height:100%;max-width:990px;overflow:visible}.phase-track{height:49px;display:flex;align-items:center;gap:0;margin:8px 30px 12px}.phase-track span{font-size:18px;color:#8e8064;display:flex;align-items:center;gap:13px;flex:1;transition:color .3s}.phase-track span:before{content:'';width:8px;height:8px;border:1px solid #aa915e;border-radius:50%}.phase-track span:after{content:'';height:1px;background:#b9a77988;flex:1;margin-right:20px}.phase-track span:last-child:after{display:none}.phase-track span.on{color:#285a43}.phase-track span.on:before{background:#47725b;box-shadow:0 0 0 4px #587c5422}.playback{display:flex;align-items:center;gap:12px;border-top:1px solid #af976566;padding-top:15px;height:73px;font-family:system-ui}.playback button{font-size:18px;padding:11px 16px}.playback #play{min-width:116px;background:#294c3c;color:#f1e7ca}.seek-label{flex:1;font-size:13px;color:#7c6c4f;display:flex;align-items:center;gap:14px}input[type=range]{accent-color:#3f6950;min-height:32px;cursor:pointer;flex:1;min-width:0}output{font-size:15px;color:#6d654f;font-variant-numeric:tabular-nums}.reading{border:1px solid #b99c62;position:relative;padding:30px 35px;overflow:hidden}.step-heading{display:flex;align-items:center;gap:23px;padding-bottom:19px;border-bottom:1px solid #a68c5655}.step-heading>span:first-child{font:62px Georgia,serif;color:#b59c63;letter-spacing:-4px}.step-heading small{font-size:15px;letter-spacing:6px;color:#7a7055}.step-heading h2{font:56px YQInk;margin:8px 0 0;letter-spacing:8px;font-weight:400}.seal{margin-left:auto;border:2px solid #94664b;color:#956345;font:20px YQInk;writing-mode:vertical-rl;padding:6px;letter-spacing:5px;transform:rotate(4deg)}.reading h3{font-size:25px;font-weight:400;line-height:1.5;margin:20px 0 16px;color:#315947}.reading>p{font-size:23px;line-height:1.85;text-align:justify;margin:0;min-height:171px}.observe{border-top:1px solid #b1996855;padding-top:15px;margin-top:18px}.observe>span{font-size:16px;letter-spacing:4px;color:#95713e}.observe p{font-size:20px;line-height:1.65;margin:8px 0}.tools{display:flex;align-items:center;gap:20px;margin:13px 0 17px}.tools small{font-size:15px;color:#7b7358;white-space:nowrap}.tools p{font-size:19px;margin:0}.step-actions{display:flex;gap:12px;margin-top:20px}.step-actions button{flex:1;padding:12px 8px;font-size:19px}.tour-control{display:block;width:100%;margin-top:12px;background:transparent;font-size:18px}.tour-control[aria-pressed=true]{background:#ddd0aa}.reading .detail-note{font-size:14px;margin-top:10px;min-height:0;text-align:center;line-height:1.6;color:#7a735b}#step-nav{position:absolute;left:60px;right:60px;bottom:67px;height:60px;display:flex;gap:12px}#step-nav button{background:#16362d;color:#c8c9b0;border-color:#9a895b66;flex:1;padding:9px 7px;display:flex;justify-content:center;align-items:center;gap:16px;font-size:23px;letter-spacing:4px}#step-nav button span{font:15px Georgia;color:#ab9869;letter-spacing:1px}#step-nav button.active{background:#d7c48c;color:#16382b;border-color:#d7c48c}#step-nav button.active span{color:#5c563e}#step-nav button:hover{background:#46634b;color:#fff1d0}footer{position:absolute;left:65px;right:65px;bottom:34px;display:flex;justify-content:space-between;font-size:14px;letter-spacing:3px;color:#97aa99}[hidden]{display:none!important}.reading{animation:read-in .45s ease-out}@keyframes read-in{from{opacity:.3;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
#overview{grid-template-rows:minmax(0,1fr)}.scroll,.intro{min-height:0}.scene{isolation:auto}.scene img{filter:grayscale(1) contrast(1.03)}.scene:hover img{filter:grayscale(1) contrast(1.08)}.intro{padding-top:18px}.intro h2{font-size:36px;line-height:1.5;margin:19px 0}.intro-line{margin:18px 0}.intro p{font-size:20px;line-height:1.8;margin:15px 0}.instruction{margin-top:16px;padding-top:14px;gap:4px}.instruction span{margin-bottom:8px}.intro .primary{margin-top:19px}.intro .note{margin-top:13px}#active-art svg{position:absolute;inset:0;max-width:none;width:100%;height:100%}
.scene canvas{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .4s}.scene:hover canvas{transform:translateY(-3px) scale(1.025)}.art-plane{position:relative;flex:none;max-width:100%;max-height:100%}.art-plane canvas,.art-plane svg{position:absolute!important;inset:0;width:100%!important;height:100%!important}.narration-status{height:55px;flex-shrink:0;margin-top:16px;border-top:1px solid #ae93625c;padding-top:15px;display:flex;align-items:center;gap:15px;color:#4c6d58;font-size:18px}.voice-wave{height:21px;display:flex;align-items:center;gap:4px}.voice-wave i{display:block;background:#6d8e77;width:3px;height:8px}.voice-wave i:nth-child(2){height:19px}.voice-wave i:nth-child(3){height:14px}.voice-wave.speaking i{animation:voice 1s ease-in-out infinite alternate}.voice-wave.speaking i:nth-child(2){animation-delay:.3s}.voice-wave.speaking i:nth-child(3){animation-delay:.6s}#voice-retry{margin-left:auto;font-size:16px;padding:7px 14px;background:#e8ddbe}@keyframes voice{to{transform:scaleY(.45)}}.reading .detail-note{margin-top:22px}.theatre #active-art{margin-top:18px}