:root{--bg: #030510;--deep-blue: #07122e;--star-blue: #162953;--text-main: #f7f3ea;--champagne: #e9ce8d;--text-secondary: #b8c3dc;--mist-pink: #d9aab6;--halo-blue: #668dff;--font-body: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;--font-title: "Songti SC", "STSong", "Noto Serif SC", serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text-main);font-family:var(--font-body);-webkit-font-smoothing:antialiased}#app{position:fixed;inset:0;width:100%;height:100%}@supports (padding: max(0px)){.control-panel{top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right))}.camera-preview{bottom:max(16px,env(safe-area-inset-bottom));right:max(16px,env(safe-area-inset-right))}}.webgl-canvas{position:fixed;inset:0;display:block;width:100%;height:100%;touch-action:none}.ui-layer{position:fixed;inset:0;pointer-events:none;z-index:10}.ui-layer>*{pointer-events:auto}.btn{font-family:var(--font-body);font-size:16px;letter-spacing:.04em;padding:12px 28px;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:transform .2s ease,background .2s ease,box-shadow .2s ease,opacity .2s ease;color:var(--text-main);background:#16295380;backdrop-filter:blur(6px)}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn:focus-visible{outline:2px solid var(--champagne);outline-offset:3px}.btn:disabled{opacity:.5;cursor:default;transform:none}.btn-primary{background:linear-gradient(135deg,#e9ce8deb,#d9aab6eb);color:#1a1206;font-weight:600;box-shadow:0 6px 24px #e9ce8d47}.btn-ghost{border-color:#b8c3dc66;background:#07122e66}.overlay{position:absolute;inset:0;pointer-events:none}.overlay>*{pointer-events:auto}.title-screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;background:radial-gradient(ellipse at center,#07122e59,#030510d9);transition:opacity .9s ease,visibility .9s ease;padding:24px}.title-screen.is-hidden{opacity:0;visibility:hidden}.title-inner{max-width:640px;animation:fadeUp 1.4s ease both}.title-kicker{color:var(--text-secondary);letter-spacing:.3em;font-size:14px;margin:0 0 18px}.title-main{font-family:var(--font-title);font-size:clamp(34px,7vw,64px);margin:0 0 24px;letter-spacing:.08em;background:linear-gradient(120deg,var(--text-main),var(--champagne));-webkit-background-clip:text;background-clip:text;color:transparent}.title-desc{color:var(--text-secondary);line-height:1.9;font-size:16px;margin:0 0 36px}.title-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.title-privacy{margin:28px auto 0;max-width:460px;color:#b8c3dca6;font-size:12.5px;line-height:1.7}.hint{position:absolute;top:7%;left:50%;transform:translate(-50%);max-width:86vw;text-align:center;font-size:clamp(15px,2.4vw,19px);color:var(--text-main);text-shadow:0 2px 18px rgba(3,5,16,.9);opacity:0;transition:opacity .6s ease;pointer-events:none}.hint.is-visible{opacity:.96}.gesture-feedback{position:absolute;bottom:12%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;transition:opacity .4s ease;pointer-events:none}.gesture-feedback.is-visible{opacity:1}.progress-ring{width:76px;height:76px;transform:rotate(-90deg)}.ring-bg{fill:none;stroke:#b8c3dc33;stroke-width:5}.ring-fg{fill:none;stroke:var(--champagne);stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .12s linear}.feedback-text{font-size:15px;color:var(--text-secondary);letter-spacing:.05em}.blessing{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.96);max-width:80vw;text-align:center;font-family:var(--font-title);font-size:clamp(22px,4vw,38px);letter-spacing:.06em;color:var(--text-main);text-shadow:0 4px 30px rgba(3,5,16,.95);opacity:0;transition:opacity .7s ease,transform .7s ease;pointer-events:none}.blessing.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.countdown{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-title);font-size:clamp(80px,18vw,160px);color:var(--champagne);text-shadow:0 0 40px rgba(233,206,141,.6);opacity:0;pointer-events:none}.countdown.is-visible{animation:countPop 1s ease forwards}.control-panel{position:absolute;top:16px;right:16px;z-index:30;display:flex;flex-direction:column;align-items:flex-end;gap:8px;opacity:0;transition:opacity .5s ease}.control-panel.is-visible{opacity:1}.cp-toggle{width:44px;height:44px;border-radius:50%;border:1px solid rgba(184,195,220,.3);background:#07122e99;color:var(--text-main);font-size:20px;cursor:pointer;backdrop-filter:blur(8px)}.cp-toggle:focus-visible{outline:2px solid var(--champagne);outline-offset:2px}.cp-menu{display:none;flex-direction:column;gap:6px;padding:8px;border-radius:14px;background:#07122eb8;border:1px solid rgba(184,195,220,.2);backdrop-filter:blur(10px)}.control-panel.is-open .cp-menu{display:flex}.cp-item{font-family:var(--font-body);font-size:14px;text-align:left;padding:9px 14px;border-radius:9px;border:none;background:transparent;color:var(--text-main);cursor:pointer;white-space:nowrap}.cp-item:hover{background:#668dff2e}.cp-item:focus-visible{outline:2px solid var(--champagne);outline-offset:-2px}.cp-item.is-off{color:#b8c3dc80}.camera-preview{position:absolute;bottom:16px;right:16px;width:200px;height:150px;border-radius:16px;overflow:hidden;border:1px solid rgba(184,195,220,.25);box-shadow:0 8px 30px #03051099;background:#030510cc;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease,visibility .4s ease;z-index:25}.camera-preview.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.camera-preview.is-mobile{width:132px;height:99px}.preview-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.landmark-canvas{position:absolute;inset:0;width:100%;height:100%;transform:scaleX(-1);pointer-events:none}.cp-close{position:absolute;top:4px;right:6px;width:22px;height:22px;border-radius:50%;border:none;background:#03051099;color:var(--text-main);font-size:16px;line-height:1;cursor:pointer;z-index:2}.memory-card-layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0305108c;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease;perspective:1200px;padding:20px;z-index:20}.memory-card-layer.is-visible{opacity:1;visibility:visible}.memory-card{display:flex;width:min(760px,92vw);max-height:86vh;border-radius:20px;overflow:hidden;background:linear-gradient(160deg,#162953f5,#07122efa);border:1px solid rgba(233,206,141,.25);box-shadow:0 30px 80px #030510b3;transform:scale(.9);opacity:0;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s ease;transform-style:preserve-3d}.memory-card.is-open{transform:scale(1);opacity:1}.mc-photo{width:46%;object-fit:cover;background:linear-gradient(160deg,var(--star-blue),var(--deep-blue));min-height:280px}.mc-photo.is-placeholder{background:radial-gradient(circle at 30% 30%,rgba(217,170,182,.5),transparent 60%),radial-gradient(circle at 70% 70%,rgba(102,141,255,.5),transparent 60%),linear-gradient(160deg,var(--star-blue),var(--deep-blue))}.mc-body{flex:1;padding:36px 32px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}.mc-index{color:var(--champagne);font-size:13px;letter-spacing:.2em}.mc-title{font-family:var(--font-title);font-size:28px;margin:0}.mc-text{color:var(--text-secondary);line-height:2;font-size:16px;margin:0;flex:1}.mc-close{align-self:flex-start;margin-top:8px}.letter-layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s ease;perspective:1400px;padding:24px;z-index:18}.letter-layer.is-visible{opacity:1;visibility:visible}.letter-open-btn{display:none}.letter-open-btn.is-visible{display:inline-block;animation:fadeUp .8s ease both}.letter-paper{width:min(620px,92vw);max-height:82vh;overflow:hidden;padding:0;border-radius:16px;background:linear-gradient(180deg,#f7f3eaf7,#e9e0cdf7);color:#2a2418;box-shadow:0 30px 90px #030510b3;transform:rotateX(28deg) translateY(40px) scale(.92);opacity:0;transition:transform 1.1s cubic-bezier(.2,.8,.2,1),opacity 1s ease;transform-style:preserve-3d}.letter-paper.is-open{transform:rotateX(6deg) translateY(0) scale(1);opacity:1}.letter-scroll{max-height:82vh;overflow-y:auto;padding:48px 44px;font-family:var(--font-title);line-height:2.1;font-size:17px}.letter-scroll p{margin:0 0 16px}.letter-scroll p:first-child{font-size:20px}.continue-finale-btn{position:absolute;bottom:7%;left:50%;transform:translate(-50%);z-index:19;animation:fadeUp .8s ease both}.finale-panel{position:absolute;bottom:10%;left:50%;transform:translate(-50%) translateY(20px);text-align:center;opacity:0;visibility:hidden;transition:opacity .8s ease,transform .8s ease,visibility .8s ease;z-index:18;width:92vw}.finale-panel.is-visible{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.finale-title{font-family:var(--font-title);font-size:clamp(26px,5vw,44px);margin:0 0 8px}.finale-sub{color:var(--text-secondary);margin:0 0 24px;font-size:15px}.finale-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}.debug-panel{position:absolute;top:12px;left:12px;z-index:40;background:#030510d1;border:1px solid rgba(102,141,255,.4);border-radius:8px;padding:8px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#9fe6c4;pointer-events:none;max-width:300px}.debug-title{color:var(--champagne);font-weight:700;margin-bottom:4px;letter-spacing:.2em}.debug-body{margin:0;white-space:pre;line-height:1.5}.fallback-2d{position:fixed;inset:0;overflow-y:auto;background:radial-gradient(ellipse at top,var(--deep-blue),var(--bg));display:flex;align-items:flex-start;justify-content:center;padding:8vh 20px}.fallback-inner{max-width:620px;text-align:center}.fallback-note{color:var(--text-secondary);line-height:1.9;margin:0 0 32px;font-size:14px}.fallback-letter{text-align:left;font-family:var(--font-title);line-height:2.1;font-size:16px;background:#f7f3eaf2;color:#2a2418;padding:36px 30px;border-radius:14px}.fallback-letter p{margin:0 0 14px}.fallback-sign{color:var(--champagne);margin-top:28px;font-family:var(--font-title)}.noscript-fallback{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--text-main)}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes countPop{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}70%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.9)}}@media (max-width: 560px){.btn{font-size:15px;padding:11px 22px}.memory-card{flex-direction:column}.mc-photo{width:100%;height:180px;min-height:0}.mc-body{padding:22px 20px}.letter-scroll{padding:32px 24px;font-size:16px}.finale-actions{flex-direction:column;align-items:center}.finale-actions .btn{width:80%}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.08s!important}.letter-paper{transform:none}}