:root{--bg:#fdf6ec;--bg-dark:#2c2420;--text:#4a3728;--text-light:#fdf6ec;--rose:#c97878;--green:#7d9b76;--gold:#d4a843;--pink:#e8c4c4;--orange:#e8a87c;--font-title:"Ma Shan Zheng",cursive;--font-body:"Noto Serif SC",serif;--font-en:"Playfair Display",serif}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;font-family:var(--font-body);color:var(--text);background:var(--bg-dark);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overflow:hidden}.scene,.scene-inner{touch-action:manipulation;-webkit-touch-action:manipulation}.btn,#audio-btn,#start-btn{touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:#c9787833}#audio-btn{z-index:200;border:2px solid var(--pink);width:40px;height:40px;color:var(--pink);cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;background:#2c242099;border-radius:50%;justify-content:center;align-items:center;font-size:1.1rem;transition:all .3s;display:flex;position:fixed;top:16px;right:16px}#audio-btn:hover{background:var(--rose);color:var(--text-light);border-color:var(--rose)}#loading{background:var(--bg-dark);z-index:9999;color:var(--pink);font-family:var(--font-body);flex-direction:column;justify-content:center;align-items:center;font-size:1.1rem;transition:opacity .8s;display:flex;position:fixed;inset:0}#loading .spinner{border:2px solid var(--rose);border-top-color:#0000;border-radius:50%;width:30px;height:30px;margin-bottom:1rem;animation:1s linear infinite spin}#loading .load-progress{background:#ffffff1a;border-radius:2px;width:180px;height:3px;margin-top:.8rem;overflow:hidden}#loading .load-progress-bar{background:var(--rose);border-radius:2px;width:0;height:100%;transition:width .3s}@keyframes spin{to{transform:rotate(360deg)}}#start-screen{background:var(--bg-dark);z-index:9998;opacity:0;visibility:hidden;flex-direction:column;justify-content:center;align-items:center;transition:opacity .6s;display:flex;position:fixed;inset:0}#start-screen.show{opacity:1;visibility:visible}#start-screen .start-title{font-family:var(--font-title);color:var(--rose);margin-bottom:.6rem;font-size:2.4rem}#start-screen .start-sub{color:var(--pink);opacity:.7;margin-bottom:2rem;font-size:.9rem}#start-screen .start-btn{border:2px solid var(--rose);color:var(--rose);font-family:var(--font-body);cursor:pointer;background:0 0;border-radius:30px;align-items:center;gap:.5rem;padding:.8rem 2.5rem;font-size:1rem;transition:all .3s;display:flex}#start-screen .start-btn:hover{background:var(--rose);color:var(--text-light)}#start-screen .start-btn .music-icon{font-size:1.2rem}#start-screen .start-hint{color:var(--pink);opacity:.5;margin-top:1rem;font-size:.75rem}#tsparticles{z-index:1;pointer-events:none;position:fixed;inset:0}#app{z-index:2;position:fixed;inset:0}.scene{opacity:0;visibility:hidden;justify-content:center;align-items:center;transition:background-color 1.2s,color 1.2s;display:flex;position:absolute;inset:0;overflow:hidden}.scene.active{opacity:1;visibility:visible}.scene.dark{background:var(--bg-dark);color:var(--text-light)}.scene.warm{background:var(--bg);color:var(--text)}.scene.cool{color:var(--text);background:#d8e8e8}.scene.gray{color:#5a5248;background:#c8c4bc}.scene.cold{color:#3a4a5a;background:#c8d8e8}.scene-inner{z-index:3;text-align:center;width:100%;max-width:560px;padding:2rem;position:relative}.story-text{opacity:0}.story-text p{text-shadow:0 1px 3px #00000014;margin:.4rem 0;font-size:1.05rem;line-height:1.8}.story-text .hl{color:var(--rose);font-size:1.4rem;font-family:var(--font-title)}.story-text .date{font-family:var(--font-en);color:var(--gold);letter-spacing:2px;font-size:1.5rem}.story-text .big{font-family:var(--font-title);color:var(--rose);font-size:2.2rem}.story-text .sm{color:#8a7e72;margin-top:.8rem;font-size:.85rem}#progress{z-index:100;background:#00000014;height:3px;position:fixed;bottom:0;left:0;right:0}#progress-fill{background:var(--rose);width:0;height:100%}#hint{z-index:100;color:var(--pink);opacity:0;white-space:nowrap;pointer-events:none;font-size:.82rem;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}#chapter{z-index:100;color:var(--pink);opacity:0;font-size:.72rem;font-family:var(--font-en);letter-spacing:1px;pointer-events:none;position:fixed;top:16px;left:50%;transform:translate(-50%)}.btn{border:2px solid var(--rose);color:var(--rose);font-family:var(--font-body);cursor:pointer;background:0 0;border-radius:30px;margin-top:1.2rem;padding:.65rem 1.8rem;font-size:.95rem;transition:background .3s,color .3s,transform .15s;display:inline-block}.btn:hover{background:var(--rose);color:var(--text-light)}.btn:active{transform:scale(.95)}.train-track{height:60px;position:absolute;bottom:32%;left:8%;right:8%}.track-line{background:var(--gold);opacity:.3;height:2px;position:absolute;bottom:0;left:0;right:0}.station{font-family:var(--font-title);color:var(--gold);opacity:.6;font-size:1.1rem;position:absolute;bottom:6px}.station.left{left:0}.station.right{right:0}#train1{width:60px;height:40px;position:absolute;bottom:4px;left:-80px}.heart-lock{cursor:pointer;margin:-20px;padding:20px;display:inline-block;position:relative}.heart-lock svg{z-index:1;width:110px;height:130px;position:relative}@media (width<=480px){.heart-lock{margin:-30px;padding:30px}}.two-cities{gap:1rem;width:100%;display:flex}.city{flex-direction:column;flex:1;align-items:center;gap:.6rem;display:flex}.city-label{font-family:var(--font-title);color:var(--gold);font-size:1.6rem}.city-skyline{width:100%;max-width:220px;height:100px}.visit-counter{font-family:var(--font-en);color:var(--rose);margin:.8rem 0;font-size:1.8rem}.sub-scene{opacity:0;visibility:hidden;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.sub-scene.active{opacity:1;visibility:visible}.lake{pointer-events:none;height:35%;position:absolute;bottom:0;left:0;right:0}.lake-crowd{pointer-events:none;flex-wrap:wrap;justify-content:center;gap:6px;padding:0 2rem;display:flex;position:absolute;bottom:38%;left:0;right:0}.lake-crowd .p{background:var(--text);opacity:.25;border-radius:5px 5px 0 0;width:10px;height:20px}.boat{cursor:pointer;pointer-events:auto;z-index:10;width:70px;margin:-15px;padding:15px;display:block;position:absolute;bottom:34%;left:28%}.job-sign{color:#6a5e52;text-align:center;background:#e8e0d4;border:1px dashed #8a7e72;max-width:180px;margin-bottom:.8rem;padding:.8rem 1.2rem;font-size:.85rem}.crayfish{cursor:pointer;width:90px;margin:-20px;padding:20px;display:inline-block;position:relative}.crayfish svg{filter:grayscale(80%);z-index:1;transition:filter .8s;position:relative}.crayfish.cooked svg{filter:grayscale(0%)}.cake{cursor:pointer;margin:-20px;padding:20px;display:inline-block;position:relative}.cake svg{z-index:1;width:110px;height:130px;position:relative}.flame{opacity:0}.cake.lit .flame{opacity:1}.cake-glow{opacity:0;pointer-events:none;background:radial-gradient(circle at 50% 45%,#d4a84359,#0000 60%);transition:opacity 1.5s;position:absolute;inset:-40px}.warm-veil{opacity:0;pointer-events:none;background:radial-gradient(circle at 50% 55%,#d4a84340,#0000 65%);position:absolute;inset:0}.flower{cursor:pointer;margin:-20px;padding:20px;display:inline-block;position:relative}.flower svg{z-index:1;width:140px;height:160px;transition:filter 2s;position:relative}.flower.dried svg{filter:saturate(25%)brightness(80%)sepia(25%)}.frame{opacity:0;pointer-events:none;transform:scale(.7)}.durian{cursor:pointer;margin:-20px;padding:20px;display:inline-block;position:relative}.durian svg{z-index:1;width:100px;height:110px;position:relative}.durian-half{opacity:0;width:70px;transition:all .5s;position:absolute;top:5%;left:105%;transform:translate(-15px)}.durian.opened .durian-half{opacity:1;transform:translate(0)}.durian-glow{opacity:0;pointer-events:none;background:radial-gradient(circle,#d4a84359,#0000 65%);transition:opacity .8s;position:absolute;inset:-25px}.durian.opened .durian-glow{opacity:1}@media (width<=480px){.cake,.flower,.durian{margin:-30px;padding:30px}.cake svg{width:85px;height:100px}.flower svg{width:110px;height:125px}.durian svg{width:75px;height:85px}}.food-float{opacity:.6;pointer-events:none;font-size:1.6rem;position:absolute}.cam-icon{opacity:.5;pointer-events:none;font-size:1.3rem;position:absolute}.finale-text{font-family:var(--font-title);color:var(--rose);opacity:0;font-size:2.8rem;transform:scale(.5)}.finale-sub{color:var(--pink);opacity:0;margin-top:1rem;font-size:.95rem}.memory-star{background:var(--gold);pointer-events:none;border-radius:50%;width:6px;height:6px;position:absolute}.noodles-popup{opacity:0;pointer-events:none;z-index:5;position:absolute;bottom:22%;left:50%;transform:translate(-50%)scale(0)}@media (width<=480px){.story-text p{font-size:.92rem}.story-text .hl{font-size:1.15rem}.story-text .big{font-size:1.7rem}.story-text .date{font-size:1.2rem}.finale-text{font-size:2rem}.city-label{font-size:1.3rem}.visit-counter{font-size:1.4rem}.scene-inner{padding:1.2rem}.two-cities{flex-direction:column;gap:.3rem}.city-skyline{max-width:160px;height:70px}.heart-lock svg,.cake svg{width:85px;height:100px}.flower svg{width:110px;height:125px}.durian svg{width:75px;height:85px}.crayfish{width:70px}.boat{width:55px}#train1{width:45px;height:30px}.start-title{font-size:1.8rem!important}.start-sub{font-size:.8rem!important}}