:root{--bg: #dff3e4;--bg-deep: #c8e6d0;--leaf: #6fbf7a;--leaf-deep: #3d8f55;--mint: #a8dcb5;--ink: #163528;--ink-soft: #3d5c4c;--paper: #f7fbf7;--paper-edge: #e2efe6;--cta: #2f7a4a;--cta-hover: #24633b;--glow: rgba(129, 199, 132, .45);--font-display: "ZCOOL XiaoWei", "Noto Serif SC", serif;--font-serif: "Noto Serif SC", "Songti SC", serif;--font-body: "DM Sans", "PingFang SC", "Hiragino Sans GB", sans-serif;--ease-out: cubic-bezier(.22, 1, .36, 1)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{min-height:100dvh;color:var(--ink);font-family:var(--font-body);background:radial-gradient(ellipse 90% 70% at 15% 20%,#f2fbf4 0%,transparent 55%),radial-gradient(ellipse 80% 60% at 85% 75%,#b7e0c2 0%,transparent 50%),linear-gradient(165deg,var(--bg) 0%,var(--bg-deep) 55%,#b9dcc4 100%);overflow-x:hidden}button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}.atmosphere{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.orb{position:absolute;border-radius:50%;filter:blur(40px);opacity:.7;animation:drift 18s var(--ease-out) infinite alternate}.orb-a{width:min(42vw,320px);height:min(42vw,320px);top:-8%;left:-6%;background:var(--glow)}.orb-b{width:min(36vw,280px);height:min(36vw,280px);right:-4%;top:35%;background:#a8dcb58c;animation-duration:22s;animation-delay:-4s}.orb-c{width:min(48vw,360px);height:min(48vw,360px);left:25%;bottom:-18%;background:#6db88259;animation-duration:26s;animation-delay:-8s}.leaf{position:absolute;width:18px;height:28px;background:linear-gradient(135deg,var(--mint),var(--leaf-deep));border-radius:80% 0;opacity:.55;animation:float-leaf 14s linear infinite}.leaf:after{content:"";position:absolute;top:20%;right:48%;bottom:20%;left:48%;background:#ffffff59;border-radius:2px}.leaf-1{top:12%;left:12%;animation-duration:16s}.leaf-2{top:28%;right:14%;width:14px;height:22px;animation-duration:19s;animation-delay:-3s}.leaf-3{bottom:22%;left:18%;width:16px;height:24px;animation-duration:21s;animation-delay:-7s}.leaf-4{top:58%;right:22%;animation-duration:17s;animation-delay:-5s}.leaf-5{bottom:12%;right:38%;width:12px;height:20px;animation-duration:23s;animation-delay:-10s}.stage{position:relative;z-index:1;min-height:100dvh;display:grid;place-items:center;padding:clamp(1.5rem,4vw,3rem)}.hero{width:min(100%,40rem);text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.1rem;transition:opacity .45s var(--ease-out),transform .45s var(--ease-out),visibility .45s}.hero.is-dimmed{opacity:0;transform:scale(.96) translateY(-12px);visibility:hidden;pointer-events:none}.eyebrow{margin:0;font-size:.95rem;letter-spacing:.28em;text-indent:.28em;color:var(--ink-soft);text-transform:none;opacity:0;animation:rise-in .9s var(--ease-out) .1s forwards}.wish-title{margin:0;display:flex;flex-direction:column;gap:.2em;font-family:var(--font-display);font-weight:400;font-size:clamp(2.6rem,9vw,4.75rem);line-height:1.15;letter-spacing:.04em;color:var(--ink)}.wish-line{display:block;opacity:0;animation:rise-in 1s var(--ease-out) forwards}.wish-line:first-child{animation-delay:.25s}.wish-line.accent{color:var(--leaf-deep);animation-delay:.45s}.lede{margin:.35rem 0 .5rem;max-width:22rem;font-size:1.05rem;line-height:1.7;color:var(--ink-soft);opacity:0;animation:rise-in .9s var(--ease-out) .65s forwards}.cta{margin-top:.5rem;padding:.95rem 1.85rem;border-radius:999px;background:var(--cta);color:#f4fff7;font-size:1rem;letter-spacing:.08em;box-shadow:0 12px 28px #2f7a4a47;opacity:0;animation:rise-in .9s var(--ease-out) .85s forwards;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}.cta:hover{background:var(--cta-hover);transform:translateY(-2px);box-shadow:0 16px 32px #2f7a4a57}.cta:focus-visible{outline:2px solid var(--leaf-deep);outline-offset:3px}.letter-panel{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:grid;place-items:center;padding:clamp(1rem,4vw,2.5rem);background:#16352847;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .4s var(--ease-out),visibility .4s}.letter-panel.is-open{opacity:1;visibility:visible}.letter-panel[hidden]{display:none}.letter-panel.is-open[hidden]{display:grid}.letter{position:relative;width:min(100%,34rem);max-height:min(88dvh,42rem);overflow:auto;padding:clamp(1.75rem,5vw,2.75rem);background:linear-gradient(180deg,rgba(255,255,255,.55),transparent 28%),var(--paper);color:var(--ink);border:1px solid var(--paper-edge);border-radius:4px 18px 8px;box-shadow:0 1px #fffc inset,0 24px 60px #16352838;transform:translateY(28px) scale(.92);opacity:0;transition:transform .55s var(--ease-out),opacity .45s var(--ease-out)}.letter-panel.is-open .letter{transform:translateY(0) scale(1);opacity:1}.letter:before{content:"";position:absolute;top:0;left:1.4rem;right:1.4rem;height:4px;background:linear-gradient(90deg,transparent,var(--mint),var(--leaf),var(--mint),transparent);opacity:.85}.letter-close{position:absolute;top:.65rem;right:.85rem;width:2.25rem;height:2.25rem;border-radius:50%;font-size:1.45rem;line-height:1;color:var(--ink-soft);transition:background .2s ease,color .2s ease}.letter-close:hover{background:#6db8822e;color:var(--ink)}.letter-close:focus-visible{outline:2px solid var(--leaf-deep);outline-offset:2px}.letter-salutation{margin:.4rem 0 1.25rem;font-family:var(--font-serif);font-size:clamp(1.35rem,3.5vw,1.7rem);font-weight:700;letter-spacing:.02em}.letter-body{display:flex;flex-direction:column;gap:1rem;font-family:var(--font-serif);font-size:clamp(1rem,2.6vw,1.12rem);line-height:1.9;color:var(--ink)}.letter-body p{margin:0}.letter-sign{margin:1.75rem 0 0;text-align:right;font-family:var(--font-display);font-size:1.15rem;color:var(--leaf-deep);letter-spacing:.06em}.letter-actions{margin-top:1.75rem;display:flex;justify-content:center}.cta-inline{margin-top:0;opacity:1;animation:none;padding:.8rem 1.6rem;font-size:.95rem}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.letter-panel[data-view=notes]{display:block;padding:0;overflow:hidden;background:#f3f5f4;-webkit-backdrop-filter:none;backdrop-filter:none}.notes-view{position:relative;width:100%;height:100%;min-height:100dvh}.notes-view[hidden]{display:none}.notes-toolbar{position:absolute;top:.85rem;left:.85rem;right:.85rem;z-index:100;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.notes-toolbar>*{pointer-events:auto}.text-btn{padding:.45rem .85rem;border-radius:999px;color:var(--ink);font-size:.88rem;letter-spacing:.04em;background:#ffffffd1;box-shadow:0 6px 18px #1635281f;transition:background .2s ease}.text-btn:hover{background:#fff}.text-btn:focus-visible{outline:2px solid var(--leaf-deep);outline-offset:2px}.notes-close{position:static;color:var(--ink-soft);background:#ffffffd1;box-shadow:0 6px 18px #1635281f}.notes-close:hover{background:#fff;color:var(--ink)}.notes-board{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.sticky-note{position:absolute;width:clamp(7.6rem,24vw,10rem);min-height:clamp(7.6rem,24vw,10rem);padding:.95rem .8rem;display:flex;align-items:center;justify-content:center;border-radius:.55rem;box-shadow:0 1px #ffffffa6 inset,0 10px 24px #28282829;transform:translate(-50%,-50%) scale(.35) rotate(calc(var(--rotate, 0deg) - 8deg));opacity:0;transition:opacity .28s ease-out,transform .45s var(--ease-out);will-change:transform,opacity}.sticky-note.is-visible{opacity:1;transform:translate(-50%,-50%) scale(var(--note-scale, 1)) rotate(var(--rotate, 0deg))}.sticky-note p{margin:0;font-family:var(--font-body);font-size:clamp(.78rem,2.4vw,.95rem);font-weight:500;line-height:1.45;color:#222;text-align:center}.sticky-note.tint-butter{background:#ffe9a8}.sticky-note.tint-blush{background:#ffd4df}.sticky-note.tint-cream{background:#fff6e8}.sticky-note.tint-mint{background:#d8f0de}.sticky-note.tint-peach{background:#ffdcc8}.sticky-note.tint-foam{background:#eef7f1}.sticky-note.tint-lemon{background:#fff1b8}.sticky-note.tint-sage{background:#cfe8d4}@keyframes rise-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes drift{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(24px,18px,0) scale(1.08)}}@keyframes float-leaf{0%{transform:translateZ(0) rotate(0)}50%{transform:translate3d(18px,28px,0) rotate(18deg)}to{transform:translate3d(-10px,8px,0) rotate(-8deg)}}@media(max-width:640px){.stage{padding:1.25rem 1.1rem 2rem}.hero{gap:.95rem}.wish-title{font-size:clamp(2.35rem,12vw,3.2rem)}.cta{width:min(100%,16rem)}.letter{border-radius:6px 14px 8px;padding:1.6rem 1.25rem 1.75rem}.sticky-note{width:clamp(6.4rem,30vw,8.2rem);min-height:clamp(6.4rem,30vw,8.2rem);padding:.75rem .65rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.eyebrow,.wish-line,.lede,.cta{opacity:1;transform:none}.sticky-note{opacity:1;transform:translate(-50%,-50%) scale(var(--note-scale, 1)) rotate(var(--rotate, 0deg))}}
