:root{--ink: #eef1ff;--ink-dim: #b7c0f0;--glass: rgba(8, 12, 46, .78);--glass-border: rgba(160, 176, 255, .28);--accent: #ffb3d0;--accent-2: #9ec3ff;--font: "PingFang TC", "Noto Sans TC", "Helvetica Neue", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#04061c;color:var(--ink);font-family:var(--font);overflow:hidden}button{font:inherit;color:inherit}a{color:var(--accent-2)}#app,.viewport{position:fixed;top:0;right:0;bottom:0;left:0}.stage{position:absolute;left:50%;top:50%;transform-origin:center;overflow:hidden;-webkit-user-select:none;user-select:none;cursor:pointer;background:#070a2a}.world{position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:0 0;will-change:transform}.layer{position:absolute;top:0;right:0;bottom:0;left:0}.layer.bg img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.layer.person img{position:absolute;height:auto;transition:opacity .35s ease}.layer.fx{pointer-events:none}.vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 50% 45%,transparent 50%,rgba(3,5,26,.6) 100%);pointer-events:none}.bulb{position:absolute;width:9px;height:9px;margin:-4px;border-radius:50%;background:#fff2c4;box-shadow:0 0 10px 3px #ffe6aacc;opacity:.5}.glow{position:absolute;border-radius:50%;pointer-events:none}.glow.screen{background:radial-gradient(ellipse,#a0c8ff8c,#a0c8ff00 65%);opacity:.3;mix-blend-mode:screen}.glow.lamp{background:radial-gradient(ellipse,#ffbe78b3,#ffbe7800 65%);opacity:.45;mix-blend-mode:screen}.hint{position:absolute;bottom:26px;left:50%;transform:translate(-50%);font-size:15px;letter-spacing:.16em;color:var(--ink-dim);opacity:0;pointer-events:none}.layer.hotspots{pointer-events:none}.hotspot{position:absolute;transform:translate(-50%,-50%);width:56px;height:56px;border:0;background:transparent;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .6s ease}.hotspots.revealed .hotspot{opacity:1;pointer-events:auto}.hotspot .dot{position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px;border-radius:50%;background:#fff;box-shadow:0 0 14px var(--accent-2)}.hotspot .ring{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px;border-radius:50%;border:1.5px solid rgba(255,255,255,.7);animation:pulse 2.2s ease-out infinite}@keyframes pulse{0%{transform:scale(.6);opacity:.9}to{transform:scale(1.7);opacity:0}}.hotspot .tag{position:absolute;left:50%;top:-4px;transform:translate(-50%,-100%) translateY(6px);padding:5px 12px;border-radius:999px;font-size:14px;white-space:nowrap;background:var(--glass);border:1px solid var(--glass-border);opacity:0;transition:opacity .2s,transform .2s}.hotspot:hover .tag{opacity:1;transform:translate(-50%,-100%)}.hotspot:hover .dot{background:var(--accent);box-shadow:0 0 16px var(--accent)}.vn{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.sprite{position:absolute;left:30px;bottom:-40px;height:700px;width:560px;pointer-events:none;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .5s ease;filter:drop-shadow(0 20px 40px rgba(0,0,0,.55))}.sprite.out{opacity:0;transform:translate(-60px)}.sprite img{position:absolute;left:0;bottom:0;height:100%;width:auto;opacity:0;transition:opacity .18s ease}.sprite img.on{opacity:1}.vn-box{position:absolute;left:60px;right:60px;bottom:44px;min-height:172px;padding:26px 34px 28px;border-radius:16px;background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--glass-border);box-shadow:0 24px 70px #00000080;pointer-events:auto;transition:opacity .35s ease,transform .35s ease}.vn-box.hidden{opacity:0;transform:translateY(14px);pointer-events:none}.vn-name{position:absolute;top:-18px;left:26px;padding:6px 16px;border-radius:999px;background:var(--accent-2);color:#0c1240;font-size:15px;font-weight:600;letter-spacing:.12em}.vn-text{font-size:24px;line-height:1.6;min-height:2.2em;white-space:pre-wrap}.vn-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.vn-links:empty{display:none}.vn-links a{padding:6px 14px;border-radius:999px;border:1px solid var(--glass-border);text-decoration:none;font-size:15px}.vn-links a:hover{background:#ffffff1a}.vn-cue{position:absolute;right:24px;bottom:14px;font-size:14px;color:var(--accent-2);animation:bob 1s ease-in-out infinite}.vn-cue.hidden{display:none}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}.vn-ask{display:flex;gap:8px;margin-top:12px}.vn-ask.hidden{display:none}.vn-ask input{flex:1;min-width:0;border:0;border-radius:10px;padding:10px 14px;background:#ffffff1a;color:var(--ink);outline:none;font-size:18px}.vn-ask input::placeholder{color:var(--ink-dim)}.vn-ask button{border:0;border-radius:10px;padding:10px 18px;background:var(--accent-2);color:#0c1240;cursor:pointer;font-size:16px}.vn-choices{position:absolute;left:50%;top:44%;transform:translate(-30%,-50%);display:flex;flex-direction:column;gap:12px;min-width:320px;pointer-events:auto;transition:opacity .3s ease,transform .3s ease}.vn-choices.hidden{opacity:0;transform:translate(-30%,-46%);pointer-events:none}.vn-choices button{padding:14px 28px;border-radius:12px;border:1px solid var(--glass-border);background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:20px;cursor:pointer;text-align:center;transition:background .15s,transform .15s}.vn-choices button:hover{background:#788cff59;transform:translate(6px)}@media(max-width:720px){.vn-text{font-size:28px}.vn-choices button{font-size:24px}}