:root{--ink:#071416;--cream:#f4ead5;--gold:#d8ad63;--red:#a83f2d;--teal:#5fbab1;--glass:rgba(5,23,25,.72)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#061416;color:#f8f0df;font-family:"Noto Sans SC",sans-serif}button,input{font:inherit}button{cursor:pointer}.grain{position:fixed;inset:0;z-index:1000;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E")}.eyebrow{letter-spacing:.24em;font-size:11px;font-weight:700;color:var(--gold);margin:0 0 14px}.login-screen{min-height:100vh;display:grid;grid-template-columns:1.4fr .8fr;background:#09191b}.login-screen.hidden{animation:loginOut 1.1s cubic-bezier(.7,0,.2,1) forwards;pointer-events:none}.login-visual{position:relative;overflow:hidden;min-height:100vh;background:linear-gradient(90deg,rgba(4,16,18,.1),rgba(4,16,18,.55)),url('assets/xiangxi-map.png') center/cover}.login-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,17,18,.05),rgba(5,17,18,.65)),linear-gradient(90deg,transparent 60%,#09191b)}.moon{position:absolute;width:180px;height:180px;border-radius:50%;background:#f9d99b;box-shadow:0 0 80px #efaf56;right:12%;top:8%;opacity:.6}.mountain{position:absolute;left:-10%;right:-10%;height:45%;bottom:-10%;background:#061517;clip-path:polygon(0 70%,8% 50%,17% 66%,28% 29%,39% 67%,51% 22%,63% 59%,74% 33%,82% 57%,91% 38%,100% 64%,100% 100%,0 100%)}.mountain-b{bottom:-2%;opacity:.35;transform:scaleX(-1);background:#284f4e}.login-visual-caption{position:absolute;z-index:2;left:8%;bottom:10%;max-width:540px}.login-visual-caption h1{font-family:"Noto Serif SC",serif;font-weight:600;font-size:clamp(52px,6vw,92px);line-height:1.05;margin:0;letter-spacing:.04em}.login-visual-caption h1 em{color:#ebc985;font-style:normal}.login-visual-caption>p:last-child{font-family:"Noto Serif SC",serif;letter-spacing:.1em;color:#d6d6c7;font-size:15px;margin-top:24px}.vertical-copy{position:absolute;z-index:2;top:9%;left:7%;writing-mode:vertical-rl;letter-spacing:.3em;font-family:"Noto Serif SC",serif;font-size:13px;color:#e5c989}.lantern{position:absolute;z-index:2;top:0;width:38px;height:54px;background:#a93f2e;color:#f7d99a;display:flex;align-items:center;justify-content:center;border-radius:3px 3px 13px 13px;box-shadow:0 5px 25px #a93f2e;animation:sway 4s ease-in-out infinite;transform-origin:top}.lantern:before{content:"";position:absolute;width:1px;height:65px;background:#b9965a;bottom:100%}.l1{right:36%;top:14%}.l2{right:31%;top:22%;animation-delay:.8s}.l3{right:26%;top:12%;animation-delay:1.3s}.l4{right:21%;top:19%;animation-delay:1.9s}.login-panel{display:flex;align-items:center;justify-content:center;padding:48px;position:relative;z-index:3}.login-card{width:min(380px,100%);display:flex;flex-direction:column;gap:22px}.brand-mark{width:54px;height:54px;border:1px solid rgba(216,173,99,.5);display:grid;place-items:center;transform:rotate(45deg);margin-bottom:20px}.brand-mark span{transform:rotate(-45deg);font-family:"Noto Serif SC";font-size:24px;color:#e9c883}.brand-mark i{position:absolute;width:70%;height:70%;border:1px solid rgba(216,173,99,.18)}.login-card h2{font:600 38px/1 "Noto Serif SC";margin:0 0 10px}.muted{color:#7f9898;font-size:13px}.field>span{display:block;font-size:11px;letter-spacing:.2em;color:#9bb0ae;margin-bottom:9px}.field-control{height:56px;border:1px solid rgba(205,230,222,.14);display:flex;align-items:center;background:rgba(255,255,255,.035);transition:.25s}.field-control:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px rgba(216,173,99,.08)}.field-control svg{width:18px;margin:0 14px;fill:none;stroke:#77908d;stroke-width:1.5}.field-control input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font-size:14px;letter-spacing:.04em}.eye{border:0;background:none;color:#6f8583;padding:15px}.login-error{height:16px;margin:-10px 0;color:#e88672;font-size:12px}.primary-btn{height:58px;border:0;background:var(--gold);color:#122324;display:flex;align-items:center;justify-content:space-between;padding:0 20px 0 24px;font-weight:700;letter-spacing:.15em;transition:.25s}.primary-btn:hover{background:#efd08f;transform:translateY(-2px)}.primary-btn b{font-size:20px}.demo-tip{font-size:11px;color:#6f8583;text-align:center}.demo-tip span{color:var(--gold);border:1px solid rgba(216,173,99,.3);padding:2px 5px;margin-right:6px}.world{display:none;min-height:100vh;opacity:0}.world.active{display:block;animation:worldIn 1.6s .4s forwards}.topbar{height:76px;position:fixed;z-index:30;left:0;right:0;top:0;display:flex;align-items:center;padding:0 3.2%;background:linear-gradient(180deg,rgba(4,16,18,.9),transparent);border-bottom:1px solid rgba(255,255,255,.08)}.wordmark{display:grid;grid-template-columns:42px auto;grid-template-rows:auto auto;align-items:center;color:#fff;text-decoration:none}.wordmark>span{grid-row:1/3;width:34px;height:34px;border:1px solid var(--gold);display:grid;place-items:center;transform:rotate(45deg);color:#e7c781}.wordmark>span::first-letter{transform:rotate(-45deg)}.wordmark strong{font:600 16px "Noto Serif SC";letter-spacing:.2em}.wordmark small{font-size:8px;letter-spacing:.15em;color:#91a6a3}.topbar nav{display:flex;align-items:center;gap:6px;margin-left:auto}.nav-btn,.sound-btn{color:#afbfbc;background:rgba(4,20,22,.25);border:1px solid transparent;height:38px;padding:0 16px;font-size:12px;letter-spacing:.1em}.nav-btn.active{border-color:rgba(216,173,99,.35);color:#e6c278}.sound-btn{display:flex;gap:3px;align-items:center;margin-left:12px}.sound-btn i{display:block;width:2px;height:10px;background:var(--gold);animation:eq .9s ease-in-out infinite alternate}.sound-btn i:nth-child(2){height:17px;animation-delay:.2s}.sound-btn i:nth-child(3){height:7px;animation-delay:.4s}.sound-btn.muted i{animation:none;height:2px}.sound-btn span{margin-left:7px}.journey-status{margin-left:24px;padding-left:24px;border-left:1px solid rgba(255,255,255,.13);font-size:10px;letter-spacing:.1em;color:#92a6a4}.journey-status b{display:block;color:#e5c37d;font-size:13px;margin-top:2px}.map-stage{height:100vh;min-height:680px;position:relative;overflow:hidden;background:#0b1a1b url('assets/xiangxi-map.png') center/cover}.map-stage:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 55% 48%,transparent 10%,rgba(1,11,14,.18) 60%,rgba(1,11,14,.82)),linear-gradient(90deg,rgba(2,13,15,.75),transparent 32%,transparent 78%,rgba(2,13,15,.45))}.map-atmosphere{position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(90,203,190,.06),transparent 70%);animation:mist 12s linear infinite}.intro-copy{position:absolute;z-index:3;top:15%;left:4%;width:310px;text-shadow:0 2px 18px #001}.intro-copy h2{font:600 clamp(28px,3.2vw,48px)/1.28 "Noto Serif SC";letter-spacing:.04em;margin:0}.intro-copy h2 span{color:#e9c980}.intro-copy>p:last-child{color:#b9c6c2;line-height:1.8;font-size:12px;width:250px}.map-pin{position:absolute;z-index:5;left:var(--x);top:var(--y);border:0;background:none;color:#fff;text-align:left;filter:drop-shadow(0 3px 12px #001);animation:pinIn .7s var(--delay) both}.map-pin:before{content:"";position:absolute;width:18px;height:18px;border:2px solid #f1cf88;background:#a83f2d;border-radius:50% 50% 50% 0;transform:rotate(-45deg);left:-9px;top:-12px;transition:.25s}.map-pin:after{content:"";position:absolute;left:-1px;top:8px;width:1px;height:31px;background:linear-gradient(#e8c680,transparent)}.map-pin:hover:before,.map-pin:focus:before{transform:rotate(-45deg) scale(1.35);background:#f0c473}.map-pin i{position:absolute;width:46px;height:20px;right:calc(100% + 17px);top:10px;background:rgba(4,19,21,.8);border:1px solid rgba(216,173,99,.4);font-style:normal;font-size:9px;display:grid;place-items:center;color:#d8b76f}.map-pin b,.map-pin small{display:block;margin-left:12px;white-space:nowrap}.map-pin b{font:600 15px "Noto Serif SC";letter-spacing:.1em}.map-pin small{font-size:9px;color:#d7bd88;margin-top:3px;letter-spacing:.12em}.pin-pulse{position:absolute;width:32px;height:32px;border:1px solid #e3bb70;border-radius:50%;left:-16px;top:-19px;animation:pulse 2.8s infinite}.map-pin.is-visited:before{background:#5ab4aa}.map-pin.is-visited .pin-pulse{border-color:#70d0c5}.character-dock{position:absolute;z-index:8;bottom:30px;left:4%;height:108px;display:flex;align-items:center}.character-avatar{width:82px;height:108px;position:relative;filter:drop-shadow(0 10px 12px #001);transform-origin:bottom;animation:breathe 3s ease-in-out infinite}.hat{position:absolute;left:10px;top:6px;width:62px;height:32px;background:#193c3b;border-radius:50% 50% 34% 34%;z-index:3;border-bottom:3px solid #d1a358}.hat:after{content:"";position:absolute;width:76px;height:9px;background:#102b2b;left:-7px;bottom:-5px;border-radius:50%}.hair{position:absolute;z-index:1;top:30px;left:16px;width:52px;height:52px;background:#172424;border-radius:45% 45% 38% 38%}.face{position:absolute;z-index:2;top:34px;left:23px;width:38px;height:35px;border-radius:46%;background:#d6a77c}.face i{position:absolute;width:4px;height:5px;border-radius:50%;background:#101c1c;top:15px;left:10px}.face i:nth-child(2){left:25px}.face b{position:absolute;width:8px;height:3px;border-bottom:1px solid #843f36;left:15px;top:24px;border-radius:50%}.body{position:absolute;z-index:1;bottom:2px;left:17px;width:52px;height:48px;border-radius:20px 20px 5px 5px;background:linear-gradient(135deg,#376865,#163b3b)}.body span{position:absolute;width:25px;height:3px;background:#ca9d5c;transform:rotate(45deg);left:7px;top:17px}.satchel{position:absolute;z-index:4;width:20px;height:17px;background:#9e5739;border:2px solid #c68a58;bottom:12px;right:5px;border-radius:3px}.character-copy{height:74px;background:rgba(5,22,23,.78);border:1px solid rgba(255,255,255,.12);padding:12px 17px 10px 25px;margin-left:-10px;backdrop-filter:blur(12px);min-width:210px}.character-copy small,.character-copy strong{display:block}.character-copy small{font-size:9px;color:#8aa19e;letter-spacing:.14em}.character-copy strong{font:500 13px "Noto Serif SC";margin:4px 0}.character-copy button{border:0;background:none;color:#d5b56f;font-size:9px;padding:0}.speech{margin-left:12px;background:rgba(244,234,213,.92);color:#17302e;padding:14px 18px;border-radius:2px 14px 14px 14px;max-width:240px;font:500 11px/1.6 "Noto Serif SC";box-shadow:0 8px 30px rgba(0,0,0,.18)}.mood-oracle{position:absolute;z-index:6;right:3.5%;bottom:42px;text-align:right}.mood-oracle span{display:block;color:#91a6a3;font-size:10px;margin-bottom:8px}.mood-oracle button{border:1px solid rgba(218,183,112,.45);background:rgba(5,23,25,.67);backdrop-filter:blur(10px);color:#e7c681;padding:12px 18px;letter-spacing:.08em}.mood-oracle button:hover{background:#d8ad63;color:#112021}.mood-oracle i{font-style:normal;margin-right:7px}.map-legend{position:absolute;z-index:4;right:3.5%;top:90px;display:flex;align-items:center;gap:15px;font-size:9px;color:#9eafad;letter-spacing:.12em}.map-legend span i{width:6px;height:6px;display:inline-block;border-radius:50%;background:#d8ad63;margin-right:5px}.map-legend span i.visited{background:#5ab4aa}.map-legend em{font-style:normal;margin-left:8px;color:#d7bd88}.curtain{position:fixed;inset:0;z-index:100;display:none;pointer-events:none}.curtain.active{display:block}.curtain-left,.curtain-right{position:absolute;top:0;bottom:0;width:51%;background:repeating-linear-gradient(90deg,#4b110e 0,#7d241c 8%,#4b110e 16%);box-shadow:inset -16px 0 30px rgba(0,0,0,.4);transform:scaleX(0);transition:transform .7s cubic-bezier(.77,0,.18,1)}.curtain-left{left:0;transform-origin:left}.curtain-right{right:0;transform-origin:right}.curtain.closed .curtain-left,.curtain.closed .curtain-right{transform:scaleX(1)}.curtain.opening .curtain-left{transform-origin:left;transform:translateX(-100%)}.curtain.opening .curtain-right{transform-origin:right;transform:translateX(100%)}.curtain-title{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:.35s;color:#f3d99f}.curtain.closed .curtain-title{opacity:1}.curtain-title small{font-size:11px;letter-spacing:.3em}.curtain-title strong{font:600 clamp(45px,8vw,90px) "Noto Serif SC";letter-spacing:.15em;margin-top:14px}.curtain-title i{width:80px;height:1px;background:#d5b66e;margin-top:20px}.place-modal{position:fixed;z-index:80;inset:0;background:#f0e5cf;color:#152624;overflow:auto;display:none;opacity:0}.place-modal.active{display:block;animation:modalIn .6s forwards}.modal-close{position:fixed;z-index:5;right:30px;top:25px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(7,25,27,.55);color:#fff;font-size:25px;backdrop-filter:blur(8px)}.place-hero{height:48vh;min-height:350px;position:relative;display:flex;align-items:flex-end;padding:5%;color:#fff;background-position:center;background-size:cover;overflow:hidden}.place-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,10,12,.1),rgba(2,15,16,.86)),var(--focus-gradient,transparent)}.place-number{position:absolute;right:5%;bottom:-5%;font:900 min(24vw,250px)/.8 "Noto Serif SC";color:rgba(255,255,255,.07)}.place-heading{position:relative;z-index:2}.place-heading h2{font:600 clamp(45px,7vw,86px)/1 "Noto Serif SC";margin:0;letter-spacing:.07em}.mood-tag{display:inline-block;margin-top:18px;border:1px solid rgba(231,198,129,.6);padding:8px 13px;color:#e8c987;font-size:11px;letter-spacing:.15em}.quote{position:relative;z-index:2;margin-left:auto;max-width:310px;font:500 18px/1.8 "Noto Serif SC";color:#f1dfbd;padding-left:20px;border-left:1px solid #d4aa60}.place-content{display:grid;grid-template-columns:1fr 1.1fr;gap:8%;padding:65px 8% 55px}.section-kicker{font-size:10px;color:#886f45;letter-spacing:.17em}.section-kicker span{background:#173533;color:#fff;padding:5px 8px;margin-right:8px}.story-column h3{font:700 38px "Noto Serif SC";margin:20px 0 14px}.lead{font-size:14px;line-height:2;color:#53605c}.trace-card{margin-top:30px;border-left:3px solid #a84433;padding:12px 0 12px 18px}.trace-card span{font-size:10px;letter-spacing:.14em;color:#a84433}.trace-card p{font:500 13px/1.8 "Noto Serif SC";margin:5px 0}.fourfold{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #bfb39e;border-left:1px solid #bfb39e}.fourfold article{min-height:100px;border-right:1px solid #bfb39e;border-bottom:1px solid #bfb39e;padding:20px;display:flex;gap:14px;align-items:flex-start}.fourfold i{font:700 21px "Noto Serif SC";color:#a94331;font-style:normal}.fourfold small,.fourfold b{display:block}.fourfold small{font-size:9px;color:#9b8b70;letter-spacing:.12em;margin-bottom:8px}.fourfold b{font:600 13px/1.5 "Noto Serif SC"}.collect-btn{width:100%;margin-top:18px;height:58px;border:0;background:#173533;color:#f2dfb7;display:flex;align-items:center;justify-content:space-between;padding:0 20px 0 24px;letter-spacing:.1em}.collect-btn.collected{background:#5e766f}.collect-btn b{font-size:20px}.modal-footer{border-top:1px solid #c8bda9;margin:0 8%;height:72px;display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:.12em}.modal-footer>div{height:1px;background:#c8bda9;flex:1}.modal-footer button{border:0;background:none;color:#1d3835;font-size:11px;padding:10px}.character-modal{position:fixed;inset:0;z-index:120;background:rgba(2,13,15,.86);display:none;place-items:center;backdrop-filter:blur(12px)}.character-modal.active{display:grid}.chooser-card{position:relative;width:min(760px,90vw);background:#efe4cf;color:#18312e;padding:50px}.chooser-card .modal-close{position:absolute;color:#17312e;background:none;border-color:#9c927f;right:15px;top:15px}.chooser-card h2{font:600 32px "Noto Serif SC"}.character-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.character-options button{border:1px solid #c6b99f;background:rgba(255,255,255,.35);padding:22px 10px;color:#17312e}.character-options button:hover{border-color:#a54331;transform:translateY(-3px)}.character-options b,.character-options small{display:block}.character-options b{font:600 14px "Noto Serif SC";margin:12px 0 5px}.character-options small{font-size:10px;color:#8b806d}.mini-avatar{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:auto;background:#315d59;color:#f3dfb6;font:700 20px "Noto Serif SC";border:3px solid #d0aa66}.mini-avatar.red{background:#8c3e31}.mini-avatar.gold{background:#8e6c34}.toast{position:fixed;z-index:150;left:50%;bottom:35px;transform:translate(-50%,30px);opacity:0;background:#173533;color:#f1dcad;padding:14px 24px;font-size:12px;letter-spacing:.12em;transition:.35s}.toast.show{transform:translate(-50%,0);opacity:1}@keyframes sway{50%{transform:rotate(4deg)}}@keyframes eq{to{height:2px}}@keyframes pulse{0%{transform:scale(.4);opacity:1}70%,100%{transform:scale(1.5);opacity:0}}@keyframes pinIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes breathe{50%{transform:scaleY(.97) translateY(2px)}}@keyframes mist{50%{transform:translateX(3%);opacity:.6}}@keyframes loginOut{to{opacity:0;transform:scale(1.04);display:none}}@keyframes worldIn{to{opacity:1}}@keyframes modalIn{to{opacity:1}}@media(max-width:900px){.login-screen{grid-template-columns:1fr}.login-visual{position:absolute;inset:0}.login-panel{background:rgba(4,17,19,.67);backdrop-filter:blur(6px);min-height:100vh}.login-visual-caption,.vertical-copy,.lantern{display:none}.topbar{padding:0 16px}.wordmark small,.nav-btn,.journey-status span{display:none}.journey-status{margin-left:8px;padding-left:10px}.map-stage{min-height:760px;background-position:58% center}.intro-copy{top:13%;left:20px;width:270px}.map-pin{transform:scale(.9)}.map-pin b{font-size:12px}.map-pin i{display:none}.character-dock{left:14px;bottom:20px}.speech{display:none}.mood-oracle{right:15px;bottom:27px}.map-legend{display:none}.place-content{grid-template-columns:1fr;padding:40px 7%}.quote{display:none}.place-hero{padding:8%}.character-options{grid-template-columns:1fr}.chooser-card{max-height:90vh;overflow:auto}}@media(max-width:560px){.login-panel{padding:28px}.map-pin small{display:none}.map-pin:nth-of-type(2){--x:34%!important}.map-pin:nth-of-type(3){--x:67%!important}.map-pin:nth-of-type(4){--x:72%!important}.map-pin:nth-of-type(5){--x:72%!important}.map-pin:nth-of-type(6){--x:42%!important}.character-copy{min-width:160px}.character-copy strong{font-size:11px}.mood-oracle span{display:none}.mood-oracle button{font-size:0;width:46px;height:46px;padding:0;border-radius:50%}.mood-oracle button i{font-size:17px;margin:0}.place-heading h2{font-size:43px}.fourfold{grid-template-columns:1fr}.modal-footer{margin:0 5%}}