
:root{color-scheme:dark;--gold:#e7c48b;--ink:#f2e2c8;--scene:none}
*{box-sizing:border-box}body{margin:0;background:#101622;color:var(--ink);font-family:'Microsoft YaHei',sans-serif}body:before{content:'';position:fixed;inset:0;background-image:linear-gradient(180deg,rgba(6,12,23,.08),rgba(7,12,22,.15) 38%,rgba(7,12,22,.90) 84%),var(--scene);background-size:cover;background-position:center;z-index:-1}#app{min-height:100dvh}nav{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;max-width:760px;margin:auto}nav a{color:var(--gold);text-decoration:none;letter-spacing:4px;font-size:13px}nav button{width:auto;padding:7px 14px;background:#12182888}main.scene{max-width:620px;margin:24vh auto 0;padding:24px 24px 45px;background:linear-gradient(180deg,transparent,#111522e6 18%,#111522f5);border-radius:30px 30px 0 0;min-height:60vh}small{font-size:11px;letter-spacing:2px;color:#ceb587}h1{font-family:'STZhongsong','SimSun',serif;font-size:clamp(26px,6vw,38px);font-weight:400;line-height:1.5;color:#f5ddac;margin:14px 0 23px}h2{font-size:20px;font-weight:400}h3{font-size:17px;font-weight:400;color:#e6c68e}p{font-size:15px;line-height:1.95;margin:8px 0}.story{white-space:normal}.choices{display:grid;gap:12px;margin-top:28px}button,.primary{font:inherit;cursor:pointer;display:block;width:100%;padding:17px 19px;border:1px solid #af8a4c75;background:linear-gradient(130deg,#33252ad9,#162130d9);color:#f2dfbe;border-radius:8px;text-align:left;text-decoration:none;line-height:1.7;transition:background .2s,transform .2s}button:hover,.primary:hover{border-color:#edcc89;background:#433132}button:focus-visible,a:focus-visible{outline:3px solid #f5d899;outline-offset:4px}button:disabled{cursor:default;opacity:.5}footer{text-align:center;font-size:10px;letter-spacing:3px;padding:24px;color:#9a8e7b}.map-scene{margin-top:5vh!important;background:linear-gradient(180deg,#11152277,#111522dd)!important}.city-map{position:relative;height:620px;margin:15px -12px;background:radial-gradient(ellipse,#d9a85824,transparent 64%);isolation:isolate}.city-map:before{content:'';position:absolute;inset:13% 17%;border:1px solid #bd955c66;transform:rotate(20deg);border-radius:48%;z-index:-1}.hub{position:absolute;left:35%;top:43%;width:30%;text-align:center;color:#d4b378;font-size:11px;letter-spacing:3px;text-shadow:0 0 20px #e0a75e}.hub em{display:block;font:22px 'SimSun';margin:10px}.place{position:absolute;width:43%;padding:10px 8px;text-align:center;background:#162030b8;box-shadow:0 5px 25px #0005;border-radius:30% 8px 25% 8px}.place strong{font-size:14px;font-weight:400;display:block}.place small{font-size:9px;letter-spacing:0}.place-icon{display:block;font-size:26px;color:#f7d79e;text-shadow:0 0 15px #ffb843}.place-0{left:0;top:2%}.place-1{right:0;top:5%}.place-2{left:0;top:25%}.place-3{right:0;top:28%}.place-4{left:0;top:51%}.place-5{right:0;top:55%}.place-6{left:0;top:77%}.place-7{right:0;top:80%}.visits-1 .place:not(.visited){box-shadow:0 0 20px #d9aa5b33}.visits-2{filter:sepia(.16)}.hotels{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}.hotel{min-height:230px;padding:17px 13px;background:linear-gradient(#142431ae,#09151fe8),url('../../assets/night.png') center/cover}.hotel.spirit{background-image:linear-gradient(#13231aaa,#112419ec),url('../../assets/forest.png')}.hotel.tavern{background-image:linear-gradient(#301716aa,#231720ed),url('../../assets/food.png')}.hotel p{font-size:12px;line-height:1.8}.hotel h2{font:19px 'SimSun';line-height:1.5;color:#f6d5a0}.hotel span{font-size:12px;display:block;margin-top:15px}.inspect{display:flex;gap:8px;margin:22px 0}.inspect button{padding:10px 6px;text-align:center;font-size:12px}details{border-top:1px solid #b69a5755;padding:18px 0;margin-top:20px}summary{cursor:pointer;color:#dec294;font-size:14px}dt{color:#b9a481;font-size:12px;margin-top:20px}dd{margin:8px 0;color:#ecdcc6;font-size:14px;line-height:1.9}.echoes article{margin:22px 0;padding:18px;border-left:1px solid #c9a362;background:#dacaa50a;animation:appear .8s both;animation-delay:var(--delay)}.paper{padding:20px 16px;border:1px solid #b9965855;background:#171b24c9;margin-top:24px}blockquote{margin:20px 0;padding:14px;border-left:2px solid #bf9958;color:#f1d4a8;line-height:1.8}blockquote small{display:block;margin-top:8px;color:#b8af9e;letter-spacing:0;font-size:12px}.abilities{display:grid;gap:10px}.abilities article{border-bottom:1px solid #bca56a44;padding-bottom:12px}.note{color:#bfa986;font-size:13px}.flashback dd{animation:appear 1.2s both}.door-flash:after{content:'';pointer-events:none;position:fixed;inset:0;z-index:100;animation:open-door 1.8s forwards}.story p{animation:appear .45s both}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes open-door{0%{background:white;opacity:1}35%{background:#000;opacity:1}100%{background:#000;opacity:0}}@media(min-width:800px){body:before{background-size:auto 100%;background-repeat:no-repeat;background-color:#0c121c}main.scene{margin-top:15vh}.map-scene{max-width:620px}.city-map{height:640px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.door-flash:after{display:none}}

body{isolation:isolate}body:before{z-index:-1}html{background:#101622}.result-certificate{margin:0 -16px 30px}.result-certificate img{width:100%;height:auto;display:block}.result-certificate img[hidden]{display:none}.result-certificate figcaption{font-size:12px;text-align:center;color:#baa785;padding:12px}body[data-node="RESULT"] main.scene{margin-top:5vh}

/* User-selected opening artwork: preserve the original image and its proportions. */
body[data-node="COVER"]{background:#241319}
body[data-node="COVER"]:before{display:none}
.cover-screen{min-height:100svh;min-height:100dvh;display:grid;place-items:center;margin:0;padding:0;background:radial-gradient(ellipse at center,#713523,#241319 75%)}
.cover-art{position:relative;width:min(100vw,calc(100dvh * 941 / 1672));line-height:0}
.cover-art>img{display:block;width:100%;height:auto}
button.cover-enter{position:absolute;left:20%;top:80%;width:60%;height:10%;margin:0;padding:0;background:transparent;border:0;border-radius:45%;box-shadow:none;color:transparent;cursor:pointer}
button.cover-enter:hover{background:rgba(255,222,163,.08);box-shadow:0 0 24px #ffd39133}
button.cover-enter:focus-visible{outline:3px solid #fff0b5;outline-offset:3px;background:#fff0b51a}
button.cover-enter:active{background:#ffd39122}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


/* Reference-led world guide, four distinct portals and editable forest story. */
body[data-node="WORLD_GUIDE"]:before,body[data-node="WORLD_PORTALS"]:before,body[data-node="FOREST_STORY"]:before{display:none}
.guide-art .guide-enter,.guide-art .art-back,.guide-art .art-skip{position:absolute;background:transparent;border:0;box-shadow:none;margin:0;padding:0;color:transparent}
.guide-art .guide-enter{left:25%;top:81%;width:50%;height:11%;border-radius:40%}
.guide-art .art-back{left:2%;top:1%;width:9%;height:6%}
.guide-art .art-skip{right:3%;top:1%;width:15%;height:6%}
.guide-art button:hover{background:#ffe3a811}
.portals-art{container-type:inline-size}
.portal-back{position:absolute;top:1.5%;left:3%;width:9%;padding:0;border:0;background:transparent;font-size:36px;color:#f9dfaa;text-align:center}
.portal-choices{position:absolute;left:4%;right:3.5%;top:78%;height:9%;display:grid;grid-template-columns:repeat(4,1fr);gap:2%}
.portal-choices button{border:0;background:transparent;box-shadow:none;padding:32% 0 0;border-radius:45%;color:#ffe7b1;display:flex;justify-content:center;align-items:center;gap:3px;font-family:STZhongsong,SimSun,serif;font-size:clamp(11px,2.8cqw,18px);line-height:1.3;text-shadow:0 1px 8px #140507}
.portal-choices button:hover{background:#ffe3a812;box-shadow:0 0 18px #ffd18233}
.portal-choices b{font-size:1.4em;font-weight:400}
body[data-node="FOREST_STORY"]{background:#171712}
.forest-art{position:relative;max-width:560px;min-height:100dvh;margin:0 auto;padding:0 0 28px;background-image:var(--forest-art);background-size:100% auto;background-position:top center;background-repeat:no-repeat;background-color:#281713;container-type:inline-size}
.forest-header{position:absolute;inset:0 0 auto;display:flex;align-items:flex-start;padding:16px 18px;gap:13px}
.forest-header>button{background:none;border:0;width:28px;padding:0;line-height:1;font-size:36px;color:#f4e4c6}
.forest-header>div{flex:1;text-align:center;padding-right:35px}
.forest-header span{font-family:Georgia,serif;letter-spacing:4px;font-size:9px;color:#efd6a4}
.forest-header label{display:block;font:10px Georgia,serif;letter-spacing:3px;color:#f8e6c3;margin:18px 0 8px}
.entry-depth{height:5px;max-width:175px;margin:auto;border:1px solid #d9b978;border-radius:8px;background:#382a22}
.entry-depth i{display:block;height:100%;background:#ffe3a8;box-shadow:0 0 9px #e2b968}
.forest-narrative{padding:85% 8% 4%;background:linear-gradient(180deg,transparent 45%,#0d100a00 48%,#17110944 68%,#29161966)}
.forest-narrative small{font-family:SimSun,serif;font-size:clamp(12px,3.1cqw,18px);letter-spacing:3px;color:#ead1a0}
.forest-narrative h1{font-size:clamp(25px,5.9cqw,35px);margin:10px 0 16px;letter-spacing:3px;border-bottom:1px solid #bc975762;padding-bottom:13px;line-height:1.45;text-shadow:0 2px 12px #000}
.forest-prose p{font-family:SimSun,serif;font-size:clamp(14px,3.5cqw,19px);line-height:1.8;color:#f1e8d5;text-shadow:0 1px 6px #000;margin:6px 0}
.forest-choices{display:grid;gap:10px;margin-top:20px}
.forest-choices button{display:grid;grid-template-columns:24px 1fr 12px;align-items:center;gap:8px;padding:12px 14px;min-height:49px;border-radius:28px 12px 28px 12px;border:1px solid #e9c598;background:linear-gradient(115deg,#4b2224db,#482c2dde);box-shadow:inset 0 0 0 3px #ab785733,0 2px 9px #0004;color:#ffe7c8;font-family:SimSun,serif;font-size:clamp(13px,3.4cqw,18px);line-height:1.55}
.forest-choices button:hover{background:linear-gradient(115deg,#743735e8,#694530e8)}
.choice-emblem{color:#d8ad74;font-size:22px;text-align:center}.forest-choices b{font-size:24px;font-weight:400}
@media(max-height:600px) and (orientation:landscape){.cover-art{width:min(100vw,420px)}.cover-screen{align-items:start}}

/* V4.9.3: distinct route scenery and protected reading surfaces. */
body[data-node="PATH_STORY"]:before{display:none}
.forest-art{--route-rgb:15,24,19;--route-button:#233c2c;--route-accent:#e5cc9b;background-color:rgb(var(--route-rgb))}
.route-future{--route-rgb:12,20,39;--route-button:#243652;--route-accent:#cadcff}
.route-ancient{--route-rgb:27,19,13;--route-button:#483422;--route-accent:#f1ce93}
.route-daily{--route-rgb:27,16,28;--route-button:#492b40;--route-accent:#f0cdd4}
.forest-header{padding-bottom:26px;background:linear-gradient(#070b17dc,transparent);z-index:1}
.forest-header span{font-size:10px;text-shadow:0 2px 4px #000}
.forest-header label{font-size:11px;text-shadow:0 2px 4px #000}
.forest-narrative{padding:84% 6% 5%;background:linear-gradient(180deg,transparent 0,transparent 240px,rgba(var(--route-rgb),.35) 340px,rgba(var(--route-rgb),.96) 540px,rgb(var(--route-rgb)) 740px)}
.story-reading{padding:20px 18px 18px;border-radius:14px;background:rgba(var(--route-rgb),.90);box-shadow:0 8px 30px #0002;border-top:1px solid #dec69940}
.forest-narrative small{font-size:14px;color:var(--route-accent);letter-spacing:2px}
.forest-narrative h1{font-size:clamp(26px,6cqw,34px);letter-spacing:1px;color:#fff0d2;margin-bottom:14px;text-shadow:none}
.forest-prose p{font-family:'Microsoft YaHei','PingFang SC',sans-serif;font-size:clamp(16px,3.8cqw,19px);line-height:1.95;color:#fff3df;text-shadow:none;margin:10px 0}
.forest-choices{gap:12px;margin-top:18px}
.forest-choices button{background:var(--route-button);color:#fff3e2;border-color:var(--route-accent);font-family:'Microsoft YaHei','PingFang SC',sans-serif;font-size:clamp(16px,3.8cqw,19px);line-height:1.7;padding:14px;box-shadow:inset 0 0 0 3px #dfc48b14,0 4px 12px #0003}
.forest-choices button:hover{background:var(--route-button);filter:brightness(1.18)}
.choice-emblem{color:var(--route-accent);font-size:19px}
.portal-choices button{font-size:clamp(14px,3.5cqw,20px);padding:0 3px;background:#261b20eb;border:1px solid #dcb875;border-radius:12px;line-height:1.6;text-shadow:none}
.portal-choices{top:80%;height:7%;gap:1.5%}
.portal-choices button:hover{background:#4a292e}
main.scene .story{padding:15px 16px;background:#101724f2;border-radius:12px}
main.scene .story p{font-size:16px;color:#fff0dc}
main.scene>.choices button{background:#202b3b;color:#fff0dc;font-size:16px}
.place{background:#152131f5}.place strong{font-size:16px;color:#fff0d4}.place small{font-size:11px;color:#dcc9a9}
.hotel p{font-size:14px;color:#fff0dc}.hotel span{font-size:14px}
@media(max-width:360px){.forest-narrative{padding-left:4%;padding-right:4%}.story-reading{padding:16px 13px}.forest-choices button{grid-template-columns:18px 1fr 10px;gap:6px}}

/* Quiet entry: one calm reading surface, one decision at a time. */
body[data-node="WORLD_GUIDE"],body[data-node="WORLD_PORTALS"]{background:#171916;color:#eee5d4}
body[data-node="WORLD_GUIDE"]:before,body[data-node="WORLD_PORTALS"]:before{display:none}
.quiet-page{min-height:100dvh;display:grid;place-items:center;padding:28px 18px;background:radial-gradient(ellipse at 50% 28%,#4a3528 0,#26251f 38%,#171916 78%)}
.quiet-card{width:min(100%,520px);padding:clamp(26px,7vw,48px);border:1px solid #d1b27a42;border-radius:22px;background:#171a18eF;box-shadow:0 24px 80px #0005;text-align:center}
.quiet-mark{font-size:28px;color:#d8bb86;margin-bottom:16px}
.quiet-card>small{font-size:12px;letter-spacing:2px;color:#d8bb86}
.quiet-card h1{font-size:clamp(28px,7vw,38px);line-height:1.55;margin:22px 0;color:#f3e5c8}
.quiet-card p{font-size:16px;line-height:2;color:#ded5c5}
.quiet-cue{margin-top:26px!important;color:#baa984!important;font-size:13px!important}
.quiet-primary{margin-top:22px;text-align:center;border-radius:999px;background:#49352b;border-color:#c6a56d;color:#f6e7cc}
.quiet-primary span{padding-left:10px}
.quiet-back{width:auto;display:inline-block;padding:10px 16px;margin-top:14px;border:0;background:transparent;color:#b9ad96;text-align:center;font-size:13px}
.portal-card{text-align:left}
.portal-card h1{font-size:clamp(26px,6.5vw,34px);margin:16px 0 8px}
.portal-card>p{font-size:15px}
.portal-back{margin:0 0 24px;padding:8px 0;color:#d2c09d}
.quiet-options{display:grid;gap:10px;margin-top:24px}
.quiet-options button{position:relative;padding:16px 42px 16px 18px;border-radius:13px;background:#252720;border:1px solid #bda16e4d;color:#f0e5d1;font-size:16px}
.quiet-options button small{display:block;margin-top:5px;color:#bdb3a0;font-size:12px;letter-spacing:.2px}
.quiet-options button b{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:22px;color:#d1b27a;font-weight:400}
.quiet-options button:hover{background:#302d25;border-color:#cfb47e}
@media(prefers-reduced-motion:reduce){.quiet-page *{animation:none!important;transition:none!important}}
