:root{--ink:#314b44;--muted:#7c8880;--paper:#f8f6ef;--mint:#dbe6d7;--line:rgba(62,82,69,.15)}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#e9e6da;color:var(--ink);font-family:"Segoe UI","Microsoft YaHei",sans-serif;font-size:14px}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit;color:inherit}button{cursor:pointer;border:0;transition:background .2s,transform .2s}button:hover{transform:translateY(-2px)}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #d7a175;outline-offset:4px}button:disabled{opacity:.5;cursor:wait}button:active{transform:translateY(0)}[hidden]{display:none!important}#world,#world canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline:0}#world:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(248,246,236,.55),transparent 23%,transparent 66%,rgba(38,48,37,.12))}.topbar{position:fixed;left:36px;right:36px;top:25px;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:3}.brand{display:flex;align-items:center;text-decoration:none;color:var(--ink);gap:10px;font-size:21px;font-weight:700;letter-spacing:.8px;white-space:nowrap;flex-shrink:0}.brand-logo{display:block;width:52px;height:52px;object-fit:contain;flex-shrink:0}.loader-logo{display:block;width:112px;height:112px;object-fit:contain}.brand small{display:block;font-size:8px;font-weight:600;letter-spacing:2px;margin-top:3px}.room-label{font-size:12px;letter-spacing:1px;display:flex;gap:13px;align-items:center;background:rgba(250,248,240,.84);border:1px solid #ffffff9c;backdrop-filter:blur(12px);border-radius:30px;padding:12px 19px}.sun{font-size:19px;color:#b78647}.divider{width:1px;height:12px;background:var(--line)}nav{display:flex;gap:9px}.icon-btn{position:relative;width:39px;height:39px;border:1px solid #ffffff90;border-radius:50%;font-size:21px;background:rgba(250,248,240,.85);backdrop-filter:blur(12px)}.text-icon{font-size:12px}.sound-off{position:absolute;right:8px;bottom:3px;color:#c57c61;font-size:23px}.welcome{position:fixed;left:44px;bottom:104px;width:390px;border:1px solid #ffffffbd;background:rgba(251,249,240,.93);padding:32px 34px 24px;border-radius:5px 44px 5px 5px;box-shadow:0 14px 70px #38403218;backdrop-filter:blur(18px);z-index:2;transition:opacity .4s,transform .4s}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:600;color:#819080;display:flex;align-items:center;gap:8px}.eyebrow>span{width:6px;height:6px;border-radius:50%;background:#859f7c}h1,h2,p{margin:0}.welcome h1{font-family:"STKaiti","KaiTi","Microsoft YaHei",serif;font-size:40px;line-height:1.5;font-weight:500;letter-spacing:2px;margin:18px 0 15px}.welcome h1 em{font-style:normal;color:#69836b}.welcome p{font-size:12px;line-height:2.1;color:#7b8479;white-space:nowrap}.welcome-actions{display:flex;gap:14px;margin-top:24px;align-items:center}.primary{background:#486856;color:#fffdf4;padding:14px 19px;border-radius:5px;font-size:12px;box-shadow:0 4px 12px #28482c12}.primary:hover{background:#355942}.primary>span{margin-left:21px}.secondary{background:transparent;padding:12px 0;font-size:12px}.secondary>span{margin-left:7px}.welcome-note{margin-top:24px;padding-top:17px;border-top:1px solid var(--line);font-size:10px;color:#8d9485;letter-spacing:1px}.welcome-note>span{margin-right:6px;color:#c19d75}.scene-caption{position:fixed;right:46px;bottom:125px;display:flex;gap:13px;align-items:flex-start;color:#fdfcf4;text-shadow:0 1px 8px #313b2c99;font-size:12px;letter-spacing:2px;pointer-events:none}.caption-line{height:1px;width:26px;background:#fcfcf5;margin-top:9px}.scene-caption small{display:block;font-size:10px;letter-spacing:1px;margin-top:11px;opacity:.8}.bottom-bar{position:fixed;left:36px;right:36px;bottom:24px;display:flex;align-items:center;justify-content:space-between;gap:18px;z-index:3}#control-hint{display:flex;align-items:center;gap:9px;font-size:10px;color:#4c5a50;background:#f9f8f0ed;padding:12px 16px;border-radius:7px;box-shadow:0 3px 20px #31442e0b}kbd{font-family:inherit;font-size:10px;display:inline-flex;align-items:center;justify-content:center;width:19px;height:20px;border:1px solid #b1bbad;border-radius:3px;box-shadow:0 1px 0 #bac1b1;background:#fffdf180}.key-group{display:flex;gap:3px;margin-left:-5px}#control-hint i{width:1px;height:13px;background:var(--line);margin:0 5px}.mouse-icon{width:13px;height:18px;border:1px solid #879381;border-radius:7px}.view-actions{display:flex;gap:8px}.view-actions button{background:#f9f8f0ed;backdrop-filter:blur(12px);border:1px solid #ffffff77;border-radius:6px;padding:13px 16px;font-size:12px}.view-actions button span{margin-left:5px}.objective{position:fixed;right:32px;top:100px;background:#fbfaf1ed;border:1px solid #fff9;border-radius:10px;padding:17px 19px;width:278px;backdrop-filter:blur(12px)}.objective-top{display:flex;align-items:center;gap:12px}.basket-icon{font-size:26px;line-height:30px;width:39px;background:#e4ebda;text-align:center;border-radius:10px}.objective small{font-size:9px;color:#86907d;display:block;letter-spacing:1px;margin-bottom:4px}.objective strong{font-size:12px;font-weight:500}#count{margin-left:auto;font-size:11px;color:#8c997c}.progress-track{height:3px;background:#e4e7db;margin-top:16px}.progress-track>div{width:0;height:100%;background:#86a784;transition:width .4s}.objective p{font-size:10px;color:#929987;margin-top:10px;line-height:1.8}#crosshair{position:fixed;left:50%;top:50%;width:8px;height:8px;border:1px solid #fffc;border-radius:50%;box-shadow:0 0 5px #3b4b39;pointer-events:none;transform:translate(-50%,-50%)}#interact-prompt{position:fixed;left:50%;top:58%;transform:translateX(-50%);padding:10px 17px;border-radius:30px;background:#f9f7edee;font-size:12px;box-shadow:0 4px 20px #31442720;pointer-events:none;display:flex;align-items:center;gap:10px;white-space:nowrap}#art-label{position:fixed;pointer-events:none;background:#fffcf2f2;padding:13px 17px;border-radius:5px 16px 5px 5px;box-shadow:0 6px 22px #24372120;z-index:5;max-width:220px}#art-label small{font-size:8px;letter-spacing:2px;color:#9b9b83}#art-label strong{display:block;font-size:14px;font-weight:500;margin-top:6px}#art-label span{font-size:9px;color:#919885;margin-top:6px;display:block}#toast{position:fixed;top:110px;left:50%;transform:translate(-50%,-10px);opacity:0;padding:12px 24px;background:#f8f8ecf5;border-radius:28px;box-shadow:0 6px 30px #25362818;transition:.25s;pointer-events:none;z-index:30;font-size:12px;white-space:nowrap}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{color:var(--ink);background:#faf8f0;border:1px solid #ffffffb0;border-radius:16px;padding:38px;width:min(670px,92vw);box-shadow:0 30px 100px #20312650}dialog::backdrop{background:#273a3255;backdrop-filter:blur(6px)}.close{position:absolute;right:15px;top:10px;width:35px;height:35px;border-radius:50%;font-size:26px;background:transparent;color:#889182}dialog h2{font-weight:500;font-size:27px;margin:12px 0}dialog p{font-size:11px;color:#8a917f;line-height:1.9}.piano-footer{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:10px}#note-name{font-size:9px;letter-spacing:1px;color:#8e967f}#piano-keys{display:flex;height:174px;position:relative;margin-top:25px;padding:9px 9px 0;background:#b49975;border:5px solid #c9af89;border-radius:8px;box-shadow:0 7px 0 #ac9270}.piano-key.white{flex:1;border:1px solid #c5c3b8;border-bottom:5px solid #dedbd1;background:#fffdf3;border-radius:0 0 4px 4px;display:flex;align-items:end;justify-content:center;padding-bottom:12px;color:#a6aa98;font-size:10px}.piano-key.black{position:absolute;top:9px;z-index:2;height:61%;width:7%;background:#35403b;border-bottom:5px solid #1a2520;border-radius:0 0 4px 4px;color:#b3bbae;padding-top:67px;font-size:9px}.piano-key.active{background:#bccfb4;border-bottom-color:#8ca784;transform:translateY(2px)}.piano-key.black.active{background:#70947b}.piano-key:hover{transform:none}dl{display:grid;grid-template-columns:70px 1fr;gap:15px 12px;font-size:12px;line-height:1.8;margin:25px 0}dt{font-weight:600}dd{margin:0;color:#7f8b7a}#photo-panel{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#faf8efed;backdrop-filter:blur(12px);border-radius:12px;padding:16px 22px;display:flex;align-items:center;gap:24px;z-index:8;white-space:nowrap}#photo-panel small{font-size:8px;letter-spacing:2px;color:#939c8c;display:block;margin-bottom:4px}#photo-panel strong{font-size:13px;font-weight:500}select{background:#e9eddf;border:0;border-radius:4px;font-size:12px;padding:10px 9px}.photo .topbar,.photo .bottom-bar,.photo #objective,.photo #crosshair,.photo #scene-caption,.photo #interact-prompt,.photo #mobile-controls,.photo #art-label,.photo #welcome{display:none!important}#mobile-controls{position:fixed;bottom:88px;left:28px;right:28px;pointer-events:none;display:flex;align-items:center;justify-content:space-between}#joystick{width:106px;height:106px;border-radius:50%;background:#f8f7e852;border:1px solid #ffffff88;pointer-events:auto;touch-action:none;position:relative}#stick{position:absolute;left:32px;top:32px;width:42px;height:42px;border-radius:50%;background:#fbfaf0b0;box-shadow:0 3px 12px #3333}#mobile-interact{width:56px;height:56px;border-radius:50%;background:#f4f5e8bb;border:1px solid #fff8;pointer-events:auto;touch-action:none}#loading{position:fixed;inset:0;background:#f7f5eb;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .6s}#loading h1{font-size:23px;font-weight:500;letter-spacing:5px;margin-top:28px}#loading p{font-size:12px;color:#96a08a;margin-top:14px}#loading small{font-size:8px;color:#a7ae98;letter-spacing:2px;margin-top:45px}.load-track{width:180px;height:3px;background:#e1e6d6;margin-top:26px;overflow:hidden;border-radius:5px}.load-track>span{display:block;width:5%;height:100%;background:#90a684;transition:width .4s}.loader-house{width:90px;height:76px;background:#ead8b6;border-radius:8px;position:relative;margin-top:25px;display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px}.loader-house:before{content:"";position:absolute;width:70px;height:70px;left:10px;top:-31px;background:#93a992;transform:rotate(45deg);border-radius:8px;z-index:-1}.loader-house i{background:#f9f6e9;border-radius:4px}.loader-house span{position:absolute;color:#d49c5f;font-size:25px;right:-29px;top:-35px;animation:spark 1.2s infinite alternate}@keyframes spark{to{transform:rotate(30deg) scale(.7);opacity:.5}}#error{position:fixed;z-index:120;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#f8f6ee;gap:20px;padding:30px}#error p{max-width:480px;line-height:2}#error button{padding:12px 25px;background:#dbe6d7;border-radius:8px}
@media(max-width:800px){.topbar{left:20px;right:20px;top:18px}.room-label{display:none}.welcome{left:24px;bottom:104px;width:340px;padding:26px}.welcome h1{font-size:34px}.welcome p{font-size:11px}.bottom-bar{left:20px;right:20px;bottom:20px}#control-hint{gap:6px;padding:10px;font-size:9px}#control-hint i{margin:0 2px}.view-actions button{padding:12px;font-size:11px}.scene-caption{display:none}.objective{right:20px;top:86px;width:240px}.objective p{font-size:9px}.brand{font-size:19px}.icon-btn{width:35px;height:35px}#photo-panel{gap:12px;padding:13px 16px}#photo-panel>div{display:none}}
@media(pointer:coarse){#control-hint{display:none}.bottom-bar{justify-content:flex-end}.objective{width:220px}.welcome-note{margin-top:19px}}
@media(max-width:480px){.welcome{left:18px;right:18px;width:auto;bottom:88px;padding:25px 26px}.welcome h1{font-size:31px;margin:13px 0}.welcome-note{margin-top:16px;padding-top:12px}.welcome-actions{margin-top:18px}.brand small{font-size:7px;letter-spacing:2px}.brand-logo{width:40px;height:40px}.topbar{gap:9px}.icon-btn{width:32px;height:32px}nav{gap:6px}dialog{padding:30px 20px}dialog h2{font-size:23px}#piano-keys{height:150px;padding:5px 5px 0}.piano-key.black{top:5px;padding-top:50px}#photo-panel{bottom:20px;gap:9px;padding:12px}#photo-panel button{font-size:10px;padding:12px 9px}select{font-size:10px;max-width:95px}.objective{top:76px;width:210px;padding:13px}.objective-top{gap:8px}.objective p{line-height:1.7}.objective strong{font-size:11px}#toast{max-width:90vw;white-space:normal;text-align:center;top:88px}dl{grid-template-columns:60px 1fr;gap:12px 7px;font-size:11px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

#photo-result{width:min(900px,94vw);padding:28px}#photo-preview{display:block;width:100%;max-height:65vh;object-fit:contain;border-radius:5px;margin:18px 0}#photo-download{text-decoration:none;display:inline-block}#photo-result h2{font-size:22px}@media(max-width:819px){#control-hint{display:none}.bottom-bar{justify-content:flex-end}}@media(max-height:540px){.welcome{bottom:77px;padding:20px 26px;width:340px}.welcome h1{font-size:26px;margin:10px 0}.welcome p,.welcome-note{display:none}.welcome-actions{margin-top:12px}.objective{top:73px;padding:12px}.objective p{display:none}.topbar{top:13px}.bottom-bar{bottom:16px}#mobile-controls{bottom:60px}dialog{max-height:90vh;overflow:auto}.scene-caption{bottom:93px}}
#mobile-drop{position:absolute;right:0;bottom:-35px;pointer-events:auto;touch-action:none;background:#f7f8e9dc;border:1px solid #fff8;border-radius:20px;width:56px;height:29px;font-size:10px}
#mobile-drop{bottom:-20px}@media(max-height:540px){#mobile-drop{right:70px;bottom:25px}}

/* 第二场景沿用暖白与鼠尾草绿；地图只作指引，实际从门洞步行进入。 */
#area-guide{position:fixed;left:36px;top:98px;z-index:3}#map-btn{position:relative;text-align:left;background:#faf8eeed;border:1px solid #fff9;border-radius:9px;padding:12px 40px 12px 15px;min-width:211px;backdrop-filter:blur(10px)}#map-btn small{display:block;font-size:8px;letter-spacing:2px;color:#89977d}#map-btn strong{display:block;font-size:12px;font-weight:500;margin-top:5px}#map-btn em{font-style:normal;display:block;font-size:9px;color:#8b9481;margin-top:7px}#map-btn>span{position:absolute;right:15px;top:21px;font-size:20px;color:#8b9d7d}.photo #area-guide,.photo #rest-panel{display:none!important}
#rest-panel{position:fixed;bottom:120px;left:50%;transform:translateX(-50%);z-index:4;background:#faf7ecf0;backdrop-filter:blur(12px);border:1px solid #fff8;border-radius:12px;padding:17px 23px;display:grid;grid-template-columns:1fr auto;gap:8px 24px;white-space:nowrap}#rest-panel>span{font-size:14px}#rest-panel small{font-size:10px;color:#8b967e;grid-column:1}#rest-panel button{grid-column:2;grid-row:1 / 3;border-radius:5px;padding:10px 17px;background:#dbe6d7}
#npc-modal{max-width:530px}#npc-text{font-size:15px;line-height:2.1;min-height:110px;margin:20px 0;color:#65795f}#npc-modal .piano-footer small{font-size:10px;color:#9b9f8a}.talk-flower{color:#c88c7d;font-size:24px}#map-modal{max-width:490px}.house-map{display:flex;flex-direction:column;align-items:center;margin:22px 0}.house-map>div{width:80%;border:1px solid #cbd2bf;background:#eeeede;border-radius:7px;padding:18px;text-align:center}.house-map .active{border:2px solid #789372;background:#e2eada}.house-map strong,.house-map span,.house-map small{display:block}.house-map small{font-size:10px;color:#9a9d85;margin-bottom:5px}.house-map strong{font-size:14px}.house-map span{font-size:10px;margin-top:8px;color:#819176}.house-map i{font-size:11px;color:#9a9d85;padding:10px;font-style:normal}
@media(max-width:1000px){#control-hint{display:none}.bottom-bar{justify-content:flex-end}}
@media(max-width:800px){#area-guide{left:20px;top:79px}#map-btn{min-width:174px;padding:10px 32px 10px 12px}#map-btn em{font-size:8px}.objective{top:174px}}
@media(max-width:480px){.view-actions{gap:5px}.view-actions button{padding:12px 8px;font-size:10px}.view-actions button span{margin-left:2px}#map-btn{min-width:167px}#map-btn small{font-size:7px}#map-btn strong{font-size:11px}#map-btn em{font-size:8px}.objective{width:190px;top:166px}.objective p{display:none}#rest-panel{bottom:150px;padding:14px 18px;gap:6px 14px}#npc-text{font-size:14px;min-height:140px}#toast{top:250px}}
@media(max-height:540px){#area-guide{top:66px}#map-btn em{display:none}.objective{top:74px}#rest-panel{bottom:83px}#area-guide small{display:none}}