@font-face{font-family:Songhe;src:url('assets/songhe.ttf') format('truetype');font-display:swap}
@font-face{font-family:DreamHome;src:url('assets/dream-home.ttf') format('truetype');font-display:swap}
:root{--ink:#473921;--paper:#d7bd8a;--ivory:#eddec1;--muted:#b3a88f;--red:#773a30;--gold:#b29861;--cn:Songhe,'SimSun',serif;--en:DreamHome,Georgia,serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#0c100e}body{font-family:var(--cn);color:var(--ivory);font-weight:400}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible{outline:1px solid var(--ivory);outline-offset:7px}button:hover{color:#fff3d9}button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}button small,small[lang=en],[lang=en],kbd{font-family:var(--en);font-weight:400}p,h1,h2,h3{margin:0;font-weight:400}img{display:block;max-width:100%}[hidden]{display:none!important}#app{width:100%;height:100%;position:relative;isolation:isolate;overflow:hidden}.screen{position:absolute;inset:0;min-height:100%;overflow:hidden}.home-screen{background:#060906}.scenery,.scene,.vignette,.begin-surface,.scene-black{position:absolute;inset:0;width:100%;height:100%}.scene{object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity 1.8s ease;will-change:opacity,transform}.scene.active{opacity:1;animation:scene-drift 27s ease-in-out both}.scene.painted{object-position:center 43%}.scene-black{background:#050605;z-index:2;opacity:0;transition:opacity 1.5s ease}.scene-black.dark{opacity:1}.vignette{pointer-events:none;background:radial-gradient(ellipse at 44% 42%,transparent 28%,#05080855 76%,#050808a8 100%),linear-gradient(#02070760,transparent 38%,transparent 65%,#030805c9);z-index:3}.begin-surface{z-index:4}.home-title{position:absolute;z-index:5;width:min(34vw,490px);left:50%;top:5.5%;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 4px 14px #0009)}.home-title img{width:100%;height:auto;opacity:.93}.utility-menu{position:absolute;z-index:6;right:3.4%;top:12%;display:flex;flex-direction:column;gap:26px}.utility{display:flex;align-items:center;flex-direction:column;width:85px;transition:transform .3s,filter .3s;color:#d8c7a4}.utility img{width:59px;height:67px;object-fit:contain;filter:drop-shadow(0 3px 5px #0009);margin-bottom:5px;opacity:.85;transition:opacity .3s}.utility span{font-size:17px;letter-spacing:2px;white-space:nowrap}.utility small{font-size:10px;line-height:1.5;letter-spacing:.6px;opacity:.65;margin-top:4px}.utility:hover{transform:translateY(-3px);filter:brightness(1.18)}.utility:hover img{opacity:1}.begin{position:absolute;z-index:6;left:50%;bottom:13%;transform:translateX(-50%);text-align:center;padding:20px 45px;white-space:nowrap}.begin>span:not(.ornament){font-size:clamp(20px,2vw,28px);letter-spacing:7px;text-shadow:0 2px 16px #000;animation:beckon 4s ease-in-out infinite}.begin small{display:block;font-size:12px;letter-spacing:1.5px;margin-top:13px;color:#c5b598;opacity:.9}.ornament{display:block;width:130px;height:1px;background:linear-gradient(90deg,transparent,#bba67f,transparent);margin:0 auto 24px;position:relative}.ornament:after{content:'';position:absolute;left:calc(50% - 3px);top:-3px;width:6px;height:6px;background:#c1ac84;transform:rotate(45deg);box-shadow:0 0 12px #bba67f77}.home-footer{position:absolute;z-index:6;bottom:30px;left:3.8%;right:10%;display:flex;align-items:center;justify-content:space-between;font-size:13px;letter-spacing:1px;color:#aeaa99}.home-footer [lang=en]{font-size:10px;letter-spacing:.6px}.footer-divider{margin:0 10px;opacity:.35}.scene-controls{position:absolute;left:53.5%;transform:translateX(-50%);display:flex;gap:13px}.scene-controls button{height:7px;width:7px;border:1px solid #d4c29d88;transform:rotate(45deg);transition:background .3s}.scene-controls button.current{background:#d4c29d}.sound-toggle{position:absolute;z-index:12;bottom:23px;right:3.8%;display:flex;gap:8px;align-items:center;color:#c5b799;padding:8px;font-size:13px;letter-spacing:2px}.sound-toggle svg{width:22px;height:22px}.sound-hint{position:absolute;right:3.8%;bottom:63px;z-index:12;font-size:11px;color:#b7a78c;pointer-events:none;transition:opacity .4s}#app[data-screen=loading] .sound-hint{display:none}.loading-screen{background:#080d0a}.loading-screen video{width:100%;height:100%;object-fit:cover}.loading-shade{position:absolute;inset:0;background:linear-gradient(#0007,transparent 35%,#0003 65%,#000c);pointer-events:none}.loading-logo{position:absolute;top:6%;left:5%;width:165px;opacity:.8;filter:drop-shadow(0 2px 5px #000)}.loading-copy{position:absolute;bottom:8%;left:50%;transform:translateX(-50%);width:min(440px,65vw);text-align:center}.loading-copy>p{font-size:24px;letter-spacing:6px;margin-bottom:10px}.loading-copy>span{font-size:12px;letter-spacing:1px;color:#b8ab8e}.loading-progress{height:2px;background:#dbccaa35;margin-top:28px;position:relative}.loading-progress>div{height:100%;background:#d4bd82;width:0;box-shadow:0 0 8px #dfce9a88;transition:width .2s linear}.loading-progress:before,.loading-progress:after{content:'';position:absolute;top:-2px;width:5px;height:5px;transform:rotate(45deg);background:#c8ae75}.loading-progress:before{left:-3px}.loading-progress:after{right:-3px}.loading-copy output{font:12px var(--en);display:block;margin-top:13px;color:#b7a98b}.quiet-button{display:inline-flex;align-items:center;gap:10px;font-size:15px;letter-spacing:2px;color:#c5b99d;transition:color .2s}.quiet-button [lang=en]{font-size:10px;letter-spacing:.6px;opacity:.65}.quiet-button svg{width:23px}#skip-loading{position:absolute;right:4.5%;top:7%}#video-error{position:absolute;inset:35% 20%;background:#111d;text-align:center;padding:35px}#video-error button{margin:24px 15px;text-decoration:underline}.transition{position:absolute;inset:0;background:#050706;pointer-events:none;opacity:0;z-index:30;transition:opacity .65s ease}.transition.closed{opacity:1;pointer-events:auto}
.chapter-screen{background:#111712}.chapter-backdrop{position:absolute;inset:0;background:linear-gradient(#0b110fe0,#111812ec),url('assets/home-forest.webp') center/cover;filter:blur(3px);transform:scale(1.03)}.chapter-header{position:relative;z-index:1;height:12vh;min-height:72px;display:flex;align-items:center;justify-content:space-between;margin:0 4.5%}.chapter-header>img{width:136px;opacity:.65}.book-wrap{position:relative;width:min(1110px,83vw);height:min(71vh,680px);min-height:480px;margin:1vh auto 0;perspective:1800px}.book{position:relative;width:100%;height:100%;display:grid;grid-template-columns:1fr 1fr;filter:drop-shadow(0 24px 24px #000b);transform:rotate(-.45deg);border-radius:8px 16px 15px 6px;background:#392a1c;box-shadow:0 0 0 3px #2a2119,0 0 0 6px #453528,0 7px 0 8px #1a1713;isolation:isolate}.book:before{content:'';position:absolute;inset:7px -3px -4px;background:repeating-linear-gradient(#958668 0px,#958668 1px,#b1a17b 1px,#b1a17b 3px);border-radius:3px 10px 12px 4px;z-index:-1;transform:rotate(.35deg)}.book-page{position:relative;color:var(--ink);background-color:var(--paper);background-image:linear-gradient(#f2e8c470,#f2e8c430),url('assets/parchment.webp');background-size:cover;overflow:hidden}.illustration-page{border-radius:6px 0 0 5px;padding:28px 45px 30px 40px;background-position:left center;box-shadow:inset 1px 2px 9px #5a3b224d,inset -23px 0 30px -17px #38231088}.contents-page{border-radius:0 7px 8px 0;padding:28px 38px 30px 44px;box-shadow:inset -3px 0 8px #5a3b2244,inset 22px 0 35px -22px #3823109c;background-position:right center}.page-running{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #6d563a55;padding-bottom:11px;font-size:12px;letter-spacing:2px;color:#705a3e}.page-running [lang=en]{font-size:10px;letter-spacing:1px}.illustration-frame{height:47%;min-height:180px;margin:22px auto 17px;position:relative;max-width:350px;padding:7px;border:1px solid #7a593e6e;outline:1px solid #7a593e2c;outline-offset:4px;transform:rotate(-1.2deg);background:#af976954;box-shadow:0 4px 10px #49342020}.illustration-frame:before,.illustration-frame:after{content:'';position:absolute;width:37px;height:15px;background:#e0c798b3;box-shadow:0 1px 3px #41302022;z-index:2;top:-4px;left:-12px;transform:rotate(-36deg)}.illustration-frame:after{top:auto;left:auto;bottom:-4px;right:-12px;transform:rotate(-36deg)}.illustration-frame img{width:100%;height:100%;object-fit:cover;object-position:center 43%;filter:sepia(.15) saturate(.8)}.illustration-frame.archive img{object-fit:contain;mix-blend-mode:multiply;filter:sepia(.4)}.illustration-frame.archive{background:#c9b48955}.story-caption{text-align:center}.story-caption>small{font-size:13px;color:#8c5237;letter-spacing:4px}.story-caption h1{font-size:34px;letter-spacing:6px;margin:6px 0}.story-caption #chapter-english{font-size:12px;letter-spacing:1px}.fine-rule{height:1px;width:95px;margin:14px auto;background:linear-gradient(90deg,transparent,#7b553f99,transparent)}.story-caption #chapter-description{font-size:14px;line-height:1.8;letter-spacing:1px}.story-caption #chapter-description-en{font-size:10px;line-height:1.65;max-width:290px;margin:6px auto 0;color:#7c634b}.page-number{position:absolute;bottom:14px;left:50%;font-size:10px;color:#8f7658}.contents-page>h2{font-size:30px;letter-spacing:5px;margin:19px 0 7px}.contents-subtitle{font-size:11px;color:#81694e;letter-spacing:.4px;margin-bottom:17px}.chapter-list-item{display:flex;width:100%;align-items:center;gap:13px;text-align:left;border-bottom:1px solid #73583b30;min-height:42px;padding:7px 9px;position:relative;color:#715c41;transition:background .25s,color .25s,transform .25s}.chapter-list-item:hover{color:#7d332a;background:#6a3e2310;transform:translateX(3px)}.chapter-list-item.active{color:#733b2d;background:linear-gradient(90deg,#8d4a2e20,transparent)}.chapter-list-item.active:before{content:'';position:absolute;left:-6px;height:22px;top:calc(50% - 11px);width:2px;background:#8b4334}.chapter-list-item .index{font-size:12px;min-width:21px;font-family:var(--en);opacity:.7}.chapter-list-item .story-title{flex:1;font-size:17px;letter-spacing:2px}.chapter-list-item .chapter-label{font-size:10px;color:#8d7657;letter-spacing:1px}.chapter-list-item svg{width:13px;height:13px;opacity:.6}.chapter-list-item.unknown .story-title{font-size:18px;letter-spacing:5px}.chapter-action{margin-top:17px;display:flex;align-items:center;justify-content:space-between;gap:8px}.chapter-action>p{font-size:12px;letter-spacing:1px;color:#8a7457}.ink-button{border-bottom:1px solid #693c2c;color:#713b2c;font-size:17px;letter-spacing:2px;display:flex;align-items:center;gap:15px;padding:9px 0;transition:color .25s}.ink-button svg{width:35px;height:20px}.ink-button:hover{color:#a04930}.contents-page button:focus-visible,.letter-paper button:focus-visible{outline-color:#8b4935}.book-spine{position:absolute;left:calc(50% - 14px);top:0;width:28px;height:100%;pointer-events:none;background:linear-gradient(90deg,transparent,#37230f26 27%,#1a120b65 49%,#e4c89955 64%,transparent);z-index:3}.ribbon{position:absolute;right:23px;top:-9px;width:24px;height:69px;background:linear-gradient(90deg,#642b25,#8b4335 40%,#6a2a24);box-shadow:3px 3px 4px #38230e66;clip-path:polygon(0 0,100% 0,100% 100%,50% 85%,0 100%);z-index:4}.chapter-footer{position:relative;display:flex;align-items:center;justify-content:space-between;margin:35px 6% 0;color:#a99c82;font-size:12px;letter-spacing:1px}.chapter-footer>[lang=en]{font-size:10px;letter-spacing:.3px}.page-turners{display:flex;gap:20px;align-items:center}.page-turners span{font-size:12px}.page-turners button svg{width:37px;height:20px}.page-turners button{padding:8px}.page-turners button:disabled{opacity:.25}.page-turning .illustration-frame,.page-turning .story-caption{animation:page-reveal .5s ease both}#unknown-art{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(#5a54302b,transparent);border:1px solid #7a593e26}#unknown-art>span{font-size:95px;opacity:.24}#unknown-art>p{font-size:14px;letter-spacing:3px;opacity:.65}
dialog{border:0;padding:0;width:min(920px,89vw);max-height:88dvh;background:transparent;color:var(--ink);overflow:visible}dialog::backdrop{background:#060b0ad9;backdrop-filter:blur(6px)}dialog[open]{animation:letter-in .45s ease both}.letter-paper{position:relative;padding:32px 48px 29px;background:linear-gradient(#eadab480,#eadab455),url('assets/parchment.webp') center/cover;border:1px solid #957448;border-radius:3px 7px 5px 2px;box-shadow:0 25px 80px #000b,inset 0 0 55px #6b442a40,0 0 0 6px #79603d22;max-height:86dvh;overflow:auto;scrollbar-color:#8c6d43 #d6bb8c}.letter-paper:before{content:'';position:absolute;inset:12px;border:1px solid #7d583635;pointer-events:none}.close-letter{position:absolute;right:24px;top:24px;color:#806244;padding:7px;z-index:2}.close-letter:hover{color:#7f3128}.letter-header{display:flex;justify-content:center;align-items:center;gap:17px;border-bottom:1px solid #73533744;margin-bottom:26px;padding-bottom:23px}.letter-header img{width:57px;height:66px;object-fit:contain}.letter-header h2{font-size:30px;letter-spacing:4px}.letter-header p{font-size:12px;color:#816344;margin-top:8px;letter-spacing:1px}.letter-body{display:grid;grid-template-columns:1fr 1fr;gap:38px}.letter-column{font-size:17px;line-height:1.95;letter-spacing:1px}.letter-column p{margin-bottom:14px}.letter-column[lang=en]{border-left:1px solid #76533726;padding-left:30px;font-size:13px;line-height:1.85;letter-spacing:.05px;color:#71573d}.salutation{color:#713c2e}.letter-footer{position:relative;border-top:1px solid #73533744;margin-top:14px;padding-top:22px;display:flex;justify-content:space-between;align-items:center;font-size:13px;letter-spacing:2px;min-height:57px;padding-right:65px}.letter-footer [lang=en]{font-size:10px;letter-spacing:.6px}.wax-seal{position:absolute;right:0;top:9px;display:grid;place-items:center;width:47px;height:47px;background:radial-gradient(circle at 40% 30%,#985043,#632c25 80%);color:#c48e69;font-size:22px;border-radius:49% 45% 46% 43%;border:3px double #743729;box-shadow:1px 3px 3px #392a2255;transform:rotate(14deg)}.guide-content,.credits-content{grid-column:1/-1}.control-row{display:flex;align-items:center;gap:33px;padding:13px 10px;border-bottom:1px solid #73533725}.key-group{display:flex;gap:8px;align-items:center;min-width:185px;justify-content:center}.key-group>span{font:11px var(--en);opacity:.6}.key-group kbd{font-size:19px;width:36px;height:36px;display:grid;place-items:center;border:1px solid #8e6f4a;background:#f0d9ac55;box-shadow:0 2px 0 #9b7e57}.control-row p{font-size:17px;letter-spacing:1px}.control-row small{font-size:12px;display:block;margin-top:7px;color:#84674b}.guide-note{text-align:center;padding:25px 0 10px;font-size:16px}.guide-note [lang=en]{font-size:12px;margin-top:10px;line-height:1.6;color:#84674b}.credits-content{text-align:center;padding:0 0 10px}.credits-content>img{width:100px;margin:0 auto 18px;opacity:.9}.credits-content>p:not([lang=en]){font-size:21px;line-height:1.8;letter-spacing:4px}.credits-content h3{font-size:27px;letter-spacing:6px;margin-top:8px}.credits-content [lang=en]{font-size:13px;line-height:1.9;color:#755b42}.credits-content .credits-note{margin-top:24px;font-size:15px!important;letter-spacing:2px!important}.chapter-letter{grid-column:1/-1;text-align:center;padding:20px 20px 32px}.chapter-letter h3{font-size:26px;letter-spacing:3px;margin-bottom:18px}.chapter-letter p{font-size:18px;line-height:1.9}.chapter-letter [lang=en]{font-size:14px;line-height:1.9;color:#7d6449;margin-top:20px}.chapter-letter .ink-button{margin:26px auto 0}
@keyframes scene-drift{from{transform:scale(1.025) translateX(-.3%)}to{transform:scale(1.09) translateX(.3%)}}@keyframes beckon{0%,100%{opacity:.65}50%{opacity:1}}@keyframes letter-in{from{opacity:0;transform:translateY(18px) rotate(-1deg)}to{opacity:1;transform:translateY(0)}}@keyframes page-reveal{from{opacity:.3;transform:translateX(12px)}to{opacity:1}}@media(min-height:950px){.book-wrap{height:680px}.illustration-frame{height:48%}.chapter-list-item{min-height:48px}.chapter-action{margin-top:25px}}
@media(max-height:760px) and (min-width:801px){.book-wrap{height:73vh;min-height:420px;margin-top:0}.chapter-header{height:10vh;min-height:55px}.illustration-page,.contents-page{padding-top:20px}.illustration-frame{height:42%;min-height:130px;margin-top:16px;margin-bottom:12px}.story-caption h1{font-size:29px;margin:4px 0}.fine-rule{margin:10px auto}.story-caption #chapter-description-en{font-size:9px}.contents-page>h2{font-size:26px;margin-top:13px}.contents-subtitle{margin-bottom:10px}.chapter-list-item{min-height:36px;padding:5px 8px}.chapter-list-item .story-title{font-size:15px}.chapter-action{margin-top:8px}.chapter-action>p{font-size:10px}.chapter-footer{margin-top:22px}.letter-paper{padding-top:24px}.letter-column{font-size:15px}.letter-column[lang=en]{font-size:12px}.letter-header{margin-bottom:18px;padding-bottom:17px}.control-row{padding:10px}.guide-note{padding:18px 0 5px}}
@media(max-width:800px){.home-title{width:min(63vw,420px);top:8%}.utility-menu{right:3%;top:36%;gap:20px}.utility{width:65px}.utility img{width:46px;height:51px}.utility span{font-size:14px;letter-spacing:1px}.utility small{font-size:9px;margin-top:2px}.begin{bottom:16%;padding:20px 15px}.begin>span:not(.ornament){font-size:22px;letter-spacing:4px}.begin small{font-size:10px;letter-spacing:.5px}.home-footer{left:6%;right:20%;bottom:26px;font-size:11px}.home-footer>span:last-child{display:none}.scene-controls{left:66%;gap:12px}.sound-toggle{right:4%;bottom:19px;font-size:11px}.sound-hint{right:5%;bottom:58px;font-size:10px}.loading-logo{width:130px}.loading-copy{width:65vw;bottom:13%}.chapter-screen{overflow:auto}.chapter-header{height:85px;margin:0 6%}.chapter-header>img{width:105px}.quiet-button{font-size:13px;letter-spacing:1px}.book-wrap{width:88vw;height:auto;min-height:0;margin:4px auto 0}.book{display:block;transform:rotate(-.2deg)}.book-spine{display:none}.illustration-page{padding:22px 26px 30px;border-radius:5px 5px 0 0;box-shadow:inset 0 0 20px #5a3b2220}.illustration-frame{width:65%;height:220px;min-height:0;margin-top:20px;margin-bottom:16px}.story-caption h1{font-size:29px}.story-caption #chapter-description{font-size:14px}.contents-page{padding:24px 28px 35px;border-radius:0 0 5px 5px;border-top:3px double #94724c55;box-shadow:inset 0 0 20px #5a3b2220}.contents-page>h2{font-size:27px}.contents-subtitle{margin-bottom:14px}.chapter-list-item{min-height:47px}.chapter-list-item .story-title{font-size:16px}.chapter-action{margin-top:20px}.chapter-action>p{font-size:11px}.ink-button{font-size:16px}.chapter-footer{margin:27px 6% 80px;justify-content:center}.chapter-footer>span{display:none}.page-number{bottom:10px}.ribbon{right:18px;height:57px}.letter-paper{padding:27px 26px 24px;max-height:85dvh}.letter-header{justify-content:flex-start;gap:12px;margin-bottom:20px;padding-bottom:20px}.letter-header img{width:42px;height:52px}.letter-header h2{font-size:23px;letter-spacing:2px}.letter-header p{font-size:10px;letter-spacing:.3px;max-width:210px}.close-letter{top:14px;right:13px;padding:4px}.close-letter svg{width:19px;height:19px}.letter-body{grid-template-columns:1fr;gap:14px}.letter-column{font-size:16px;line-height:1.9}.letter-column[lang=en]{border-left:0;border-top:1px solid #76533726;padding-left:0;padding-top:20px;font-size:12px}.letter-footer{font-size:11px;letter-spacing:1px;flex-direction:column;align-items:flex-start;gap:7px}.letter-footer [lang=en]{font-size:9px}.control-row{gap:14px;padding:14px 0;align-items:flex-start;flex-direction:column}.key-group{justify-content:flex-start;min-width:0}.control-row p{font-size:16px}.control-row small{font-size:11px;line-height:1.65}.guide-note{text-align:left;font-size:15px;line-height:1.8}.guide-note [lang=en]{font-size:11px}.credits-content>p:not([lang=en]){font-size:20px}.credits-content h3{font-size:25px}.credits-content [lang=en]{font-size:11px}.chapter-letter{padding:12px 0 18px}.chapter-letter p{font-size:16px}.chapter-letter [lang=en]{font-size:12px}}
.loading-controls{position:absolute;right:4.5%;top:7%;display:flex;gap:30px;align-items:center}.loading-controls #skip-loading{position:static}.loading-controls #pause-loading{font-size:12px;color:#c5b99d99}
@media(max-width:800px){.loading-controls{top:6%;gap:13px}.loading-controls #pause-loading{font-size:10px}.loading-controls #skip-loading{font-size:12px}.loading-controls [lang=en]{display:none}}
@media(max-width:400px){.home-title{top:10%;width:70vw}.utility-menu{top:36%;right:2%;gap:16px}.home-footer{letter-spacing:0}.home-footer [lang=en]{font-size:9px}.illustration-frame{width:80%}.letter-paper{padding-left:22px;padding-right:22px}.letter-header h2{font-size:20px}.letter-header img{width:33px}.letter-header p{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.scene.active{transform:scale(1.025)}}
