.stage{flex-direction:column;justify-content:center;align-items:center;min-height:100dvh;display:flex;position:relative}.sky{z-index:-2;background:radial-gradient(150% 88% at 50% -6%, #6080d66b 0%, #6080d626 46%, #6080d600 74%), linear-gradient(180deg, var(--sky-0) 0%, var(--sky-1) 30%, var(--sky-2) 64%, var(--sky-3) 100%);position:fixed;inset:0}.content{flex-direction:column;align-items:center;gap:clamp(24px,6vh,50px);width:100%;max-width:720px;padding:clamp(26px,7vh,60px) clamp(20px,6vw,40px) 44px;display:flex;position:relative}.starfield{z-index:-1;pointer-events:none;position:fixed;inset:0}.star{opacity:.2;will-change:opacity, transform;background:#fff;border-radius:50%;animation-name:twinkle;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute}.star--big{box-shadow:0 0 6px 1px #ffffff80}@keyframes twinkle{0%,to{opacity:.18;transform:scale(.85)}50%{opacity:var(--star-peak,.9);transform:scale(1)}}.hero{text-align:center;flex-direction:column;align-items:center;display:flex}.sky-scene{aspect-ratio:1;width:clamp(178px,52vw,288px);margin-bottom:clamp(30px,8vw,48px);position:relative}.moon-wrap{position:absolute;inset:0}.moon-halo{background:radial-gradient(circle,#ffebb85c 0%,#ffe2a029 34%,#ffdc9600 68%);border-radius:50%;animation:9s ease-in-out infinite breathe;position:absolute;inset:-45%}.moon{filter:drop-shadow(0 0 26px #ffe4a880)drop-shadow(0 0 68px #ffd68c3d);width:100%;height:100%;display:block;position:relative}@keyframes breathe{0%,to{opacity:.82;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}.rabbit{filter:drop-shadow(0 0 14px #c6e0ff80)drop-shadow(0 8px 18px #00000059);width:42%;position:absolute;bottom:-8%;right:-7%;overflow:visible}.rabbit-float{animation:5.5s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.rabbit-eye{transform-box:fill-box;transform-origin:50%;animation:6s ease-in-out infinite blink}@keyframes blink{0%,91%,to{transform:scaleY(1)}94%{transform:scaleY(.12)}}.rabbit-ear{transform-box:fill-box;transform-origin:bottom}.rabbit-ear--l{animation:7.5s ease-in-out infinite ear-twitch}.rabbit-ear--r{animation:7.5s ease-in-out .35s infinite ear-twitch}@keyframes ear-twitch{0%,86%,to{transform:rotate(0)}90%{transform:rotate(-4deg)}94%{transform:rotate(2deg)}}.eyebrow{letter-spacing:.42em;text-indent:.42em;color:var(--gold);opacity:.76;margin:0;font-size:.78rem}.title{font-family:var(--serif);letter-spacing:.16em;text-indent:.16em;background:linear-gradient(#fffaef 10%,#f7e0b0 60%,#e5be79 100%);color:#0000;filter:drop-shadow(0 0 28px #ffdc9652);-webkit-background-clip:text;background-clip:text;margin:12px 0 0;font-size:clamp(2.6rem,12.5vw,4rem);font-weight:500;line-height:1.18}.cakes{flex-direction:column;align-items:center;gap:18px;width:100%;display:flex}.hint{letter-spacing:.16em;color:var(--ink-faint);margin:0;font-size:.84rem}.cake-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,3.6vw,28px);width:100%;max-width:620px;display:grid}@media (width>=680px){.cake-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}.cake{appearance:none;cursor:pointer;-webkit-tap-highlight-color:transparent;filter:drop-shadow(0 8px 16px #0000006b);background:0 0;border:0;border-radius:50%;width:100%;padding:0;line-height:0;transition:transform .26s cubic-bezier(.2,.8,.3,1),opacity .26s;display:block}.cake svg{width:100%;height:auto;display:block}.cake--fresh{animation:4s ease-in-out infinite cake-glow}@keyframes cake-glow{0%,to{filter:drop-shadow(0 8px 16px #0000006b)}50%{filter:drop-shadow(0 8px 16px #0000006b)drop-shadow(0 0 18px #ffd28273)}}.cake:hover{transform:translateY(-7px)scale(1.05)}.cake:active{transition-duration:90ms;transform:translateY(-2px)scale(.97)}.cake:focus-visible{outline:2px solid var(--gold);outline-offset:8px}.cake--opened{opacity:.68}.cake--opened:hover{opacity:1}.done{font-family:var(--serif);letter-spacing:.18em;text-indent:.18em;color:var(--gold);margin:6px 0 0;font-size:1.18rem;animation:.62s both rise}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.foot{letter-spacing:.26em;text-indent:.26em;color:var(--ink-faint);padding-top:6px;font-size:.76rem}.modal-backdrop{z-index:30;-webkit-backdrop-filter:blur(10px);background:#03061299;place-items:center;padding:24px;animation:.3s both fade-in;display:grid;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.card{text-align:center;background:linear-gradient(168deg,#2c3c6cf7,#101832fa);border:1px solid #e9c8804d;border-radius:26px;width:min(380px,100%);padding:42px 30px 30px;animation:.42s cubic-bezier(.2,.9,.3,1.15) both pop-in;position:relative;box-shadow:0 30px 70px #0000008c,inset 0 1px #ffffff14}@keyframes pop-in{0%{opacity:0;transform:translateY(16px)scale(.94)}to{opacity:1;transform:none}}.card-moon{background:radial-gradient(circle at 34% 30%,#fffdf4,#f7e7bf 60%,#e3cb9a);border-radius:50%;width:46px;height:46px;margin:0 auto 22px;box-shadow:0 0 20px #ffe2a08c,0 0 46px #ffd68c4d}.card-text{font-family:var(--serif);letter-spacing:.14em;text-indent:.14em;color:#fdf6e6;margin:0;font-size:clamp(1.75rem,7.6vw,2.1rem);line-height:1.5}.card-sign{letter-spacing:.3em;text-indent:.3em;color:var(--gold);opacity:.7;margin:20px 0 0;font-size:.74rem}.card-close{color:var(--ink-dim);letter-spacing:.16em;text-indent:.16em;cursor:pointer;background:#e9c88014;border:1px solid #e9c88059;border-radius:999px;margin-top:26px;padding:10px 30px;font-size:.86rem;transition:background .2s,color .2s,border-color .2s}.card-close:hover{color:var(--ink);background:#e9c8802e;border-color:#e9c88099}.card-close:focus-visible{outline:2px solid var(--gold);outline-offset:3px}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--sky-0:#04071a;--sky-1:#091130;--sky-2:#122046;--sky-3:#1b2b58;--gold:#e9c880;--gold-soft:#e9c88047;--moon-warm:#ffeec4;--ink:#f3eddf;--ink-dim:#f3eddfa3;--ink-faint:#f3eddf70;--serif:"Songti SC", "STSong", "Noto Serif SC", "SimSun", "Times New Roman", serif;--sans:"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, -apple-system, sans-serif}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--sans);color:var(--ink);background:var(--sky-0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;overflow-x:hidden}button{font:inherit;color:inherit}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
