:root{font-family:Avenir Next,Helvetica Neue,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;color:#f4f1e9;background:#dededd;font-synthesis:none;text-rendering:optimizeLegibility;--text: #f4f1e9;--muted: #aaa8ae;--accent-gradient: linear-gradient(108deg, #8dbbff 0%, #9983ff 31%, #df83c9 63%, #ffc082 100%);--mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;--display: Didot, "Bodoni 72", "Iowan Old Style", "Songti SC", "STSong", serif;color-scheme:dark}*{box-sizing:border-box}html{min-width:320px;background:#dededd}body{margin:0;min-width:320px;min-height:100dvh;overflow-x:hidden;color:var(--text);background:#dededd}button{font:inherit}button:focus-visible{outline:2px solid #ffc183;outline-offset:4px}button:active{transform:translateY(1px)}.app-shell{position:relative;min-height:100dvh;overflow:hidden;background:#dededd}.cover-screen,.birthday-page{position:relative;display:grid;min-height:calc(100dvh - 44px);width:min(calc(100% - 44px),1540px);margin:22px auto;border:4px solid #f7f7f5;border-radius:4px 4px 34px 34px;overflow:hidden;background:#07070a;box-shadow:0 24px 46px #0000004a}.cosmic-field{position:absolute;inset:0;isolation:isolate;pointer-events:none;background:radial-gradient(ellipse at 50% 58%,rgba(83,65,142,.13),transparent 38%),radial-gradient(ellipse at 76% 22%,rgba(35,53,89,.09),transparent 34%),linear-gradient(180deg,#08080c,#07070a 48%,#050507)}.cosmic-field canvas{position:absolute;z-index:2;inset:0;width:100%;height:100%;opacity:.88}.cosmic-field:before{position:absolute;z-index:1;inset:-18%;content:"";opacity:.32;background:radial-gradient(ellipse at 28% 54%,rgba(72,111,246,.32),transparent 19%),radial-gradient(ellipse at 57% 64%,rgba(177,81,213,.25),transparent 17%),radial-gradient(ellipse at 74% 46%,rgba(237,114,165,.2),transparent 16%),radial-gradient(ellipse at 61% 75%,rgba(241,158,82,.18),transparent 14%);filter:blur(44px);mix-blend-mode:screen;will-change:transform,opacity;animation:cosmicWash 22s cubic-bezier(.45,0,.55,1) infinite alternate}.cosmic-field:after{position:absolute;z-index:5;inset:0;content:"";opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E")}.cosmic-haze{position:absolute;z-index:3;display:block;width:min(46vw,680px);aspect-ratio:1;border-radius:50%;filter:blur(52px);mix-blend-mode:screen;opacity:.16;will-change:transform,opacity}.cosmic-haze-one{left:8%;top:48%;background:radial-gradient(circle,rgba(94,122,255,.52),rgba(137,78,202,.16) 42%,transparent 70%);animation:hazeOne 18s cubic-bezier(.45,0,.55,1) infinite alternate}.cosmic-haze-two{right:7%;top:30%;background:radial-gradient(circle,rgba(239,113,171,.42),rgba(242,151,92,.13) 43%,transparent 70%);animation:hazeTwo 26s cubic-bezier(.45,0,.55,1) infinite alternate}@keyframes cosmicWash{50%{opacity:.44;transform:translate3d(2.4%,-1.5%,0) scale(1.05) rotate(1.5deg)}to{opacity:.28;transform:translate3d(-1.7%,2%,0) scale(1.09) rotate(-1deg)}}@keyframes hazeOne{to{opacity:.24;transform:translate3d(12vw,-10vh,0) scale(1.17)}}@keyframes hazeTwo{to{opacity:.23;transform:translate3d(-15vw,12vh,0) scale(.88)}}.frame-corners{position:absolute;z-index:2;inset:28px;pointer-events:none;opacity:.26;background:linear-gradient(#f4f1e9,#f4f1e9) left top / 26px 1px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) left top / 1px 26px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) right top / 26px 1px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) right top / 1px 26px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) left bottom / 26px 1px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) left bottom / 1px 26px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) right bottom / 26px 1px no-repeat,linear-gradient(#f4f1e9,#f4f1e9) right bottom / 1px 26px no-repeat;animation:framePulse 9s ease-in-out infinite alternate}@keyframes framePulse{to{opacity:.42}}.cover-nav,.birthday-nav{position:absolute;z-index:4;top:34px;left:50%;display:flex;width:calc(100% - 80px);justify-content:space-between;color:#f4f1e980;font:500 8px/1 var(--mono);letter-spacing:.18em;transform:translate(-50%)}.system-label{margin:0 0 24px;color:#f4f1e980;font:500 8px/1 var(--mono);letter-spacing:.22em}.cover-copy{position:absolute;z-index:3;top:48%;left:50%;width:min(calc(100% - 56px),920px);text-align:center;transform:translate(-50%,-50%)}.cover-copy h1,.birthday-heading h1{margin:0;font-family:var(--display);font-weight:400;line-height:.86;letter-spacing:-.06em;text-shadow:0 4px 24px rgba(0,0,0,.32);-webkit-font-smoothing:antialiased;text-wrap:balance}.cover-copy h1{font-size:clamp(64px,8.4vw,128px)}.cover-copy h1 span,.cover-copy h1 em,.birthday-heading h1 span,.birthday-heading h1 em{display:block;will-change:transform,opacity,filter,clip-path}.cover-copy h1 em,.birthday-heading h1 em{margin-top:.08em;padding:.04em .08em .12em;color:transparent;background:var(--accent-gradient);background-size:210% 100%;background-clip:text;-webkit-background-clip:text;font-style:italic;font-weight:400;filter:drop-shadow(0 8px 24px rgba(169,101,215,.14));animation:titleSpectrum 11s ease-in-out infinite alternate}@keyframes titleSpectrum{0%{background-position:0% 50%}to{background-position:100% 50%}}.cover-copy>p:not(.system-label){max-width:31rem;margin:18px auto 22px;color:#f4f1e994;font-size:clamp(11px,1.2vw,14px);line-height:1.75}.cover-copy .primary-button{margin-top:26px}.primary-button{min-height:50px;padding:0 25px;border:1px solid #f4f1e9;border-radius:999px;color:#09090c;background:#f4f1e9;box-shadow:0 12px 38px #0000002e;cursor:pointer;font-size:13px;font-weight:720;white-space:nowrap;transition:transform .28s cubic-bezier(.16,1,.3,1),background-color .28s ease,box-shadow .28s ease}.primary-button:hover{background:#fff;box-shadow:0 14px 44px #8b6fdd33}.cover-exclamation,.birthday-exclamation{position:absolute;z-index:2;color:transparent;font-family:var(--display);font-weight:400;line-height:.72;-webkit-text-stroke:1px rgba(169,137,255,.12);-webkit-user-select:none;user-select:none}.cover-exclamation{top:26%;right:7%;font-size:clamp(180px,26vw,390px)}.cover-edition,.birthday-meta{position:absolute;z-index:4;right:44px;bottom:42px;margin:0;color:#f4f1e96b;font:500 8px/1.6 var(--mono);letter-spacing:.16em;text-align:right}.cover-edition-left,.birthday-meta-left{right:auto;left:44px;text-align:left}.music-control{position:fixed;z-index:30;top:max(34px,env(safe-area-inset-top));right:38px;display:flex;min-height:38px;padding:0 13px;align-items:center;gap:9px;border:1px solid rgba(244,241,233,.24);border-radius:999px;color:var(--text);background:#07070ab8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);cursor:pointer;font:500 8px/1 var(--mono);letter-spacing:.1em}.music-bars{display:flex;height:12px;align-items:flex-end;gap:2px}.music-bars i{display:block;width:2px;height:4px;background:#e9a2be}.music-bars.is-playing i{animation:meter 1.5s ease-in-out infinite alternate}.music-bars.is-playing i:nth-child(2){animation-delay:-.55s}.music-bars.is-playing i:nth-child(3){animation-delay:-.9s}@keyframes meter{to{height:11px}}.birthday-content{position:relative;z-index:3;display:grid;width:min(calc(100% - 96px),820px);margin:0 auto;padding:clamp(82px,10vh,118px) 0 clamp(78px,10vh,120px);align-content:center;gap:clamp(34px,4.5vh,48px);text-align:center}.birthday-heading>p{margin:0 0 24px;color:#f4f1e980;font:500 8px/1 var(--mono);letter-spacing:.2em}.birthday-heading h1{font-size:clamp(72px,9.5vw,140px)}.birthday-heading>span{display:block;margin-top:14px;color:#f4f1e959;font:500 7px/1 var(--mono);letter-spacing:.26em}.cake-moment{position:relative;z-index:4;display:grid;min-height:236px;place-items:center;align-content:center;gap:12px}.cake-visual{position:relative;width:250px;height:178px;padding:0;border:0;color:inherit;background:transparent;cursor:pointer;filter:drop-shadow(0 22px 28px rgba(0,0,0,.34))}.cake-plate{position:absolute;z-index:1;left:50%;bottom:5px;width:236px;height:25px;border:1px solid rgba(244,241,233,.34);border-radius:50%;background:linear-gradient(180deg,#f4f1e938,#f4f1e90a);transform:translate(-50%)}.cake-body{position:absolute;z-index:2;left:50%;bottom:17px;display:grid;width:190px;height:78px;place-items:center;border:1px solid rgba(244,241,233,.3);border-radius:7px 7px 43px 43px;color:#f4f1e9b8;background:linear-gradient(105deg,rgba(255,255,255,.13),transparent 28%),linear-gradient(110deg,#687ed2,#896eca 45%,#c476ac 76%,#e6a273);box-shadow:inset 0 -18px 35px #180e283d;transform:translate(-50%)}.cake-body span{margin-top:7px;font:italic 400 29px/1 var(--display);letter-spacing:-.04em;text-shadow:0 3px 14px rgba(15,8,30,.36)}.cake-top{position:absolute;z-index:3;left:50%;bottom:78px;width:190px;height:42px;border:1px solid rgba(244,241,233,.42);border-radius:50%;background:linear-gradient(110deg,#dbe3ff,#c9c2f0 40%,#e7bfd5 72%,#f3d3b3);box-shadow:0 6px 15px #1c10323d;transform:translate(-50%)}.cake-candle{position:absolute;z-index:4;left:50%;bottom:105px;width:10px;height:49px;border-radius:5px 5px 2px 2px;background:repeating-linear-gradient(135deg,#f2ede6 0 7px,#aa8bef 7px 12px);box-shadow:0 4px 14px #160e2638;transform:translate(-50%)}.cake-flame{position:absolute;z-index:5;left:50%;bottom:154px;width:17px;height:27px;border-radius:70% 35% 65%;background:radial-gradient(circle at 52% 72%,#fff7d7 0 18%,#ffc46f 34%,#ff765f 67%,transparent 70%);filter:drop-shadow(0 0 10px rgba(255,171,94,.78));transform:translate(-50%) rotate(4deg);transform-origin:50% 100%;animation:candleFlicker 1.6s ease-in-out infinite alternate}.cake-smoke{position:absolute;z-index:5;left:calc(50% - 4px);bottom:154px;width:8px;height:30px;border-left:2px solid rgba(216,213,225,.5);border-radius:50%;opacity:0;transform:translateY(5px) rotate(-10deg)}.cake-copy{min-height:39px;text-align:center}.cake-copy p{margin:0;color:#f4f1e9a3;font:500 9px/1.5 var(--mono);letter-spacing:.15em}.cake-copy small{display:block;margin-top:7px;color:#f4f1e96b;font-size:9px}.cake-moment.is-extinguished .cake-flame{opacity:0;animation:none}.cake-moment.is-extinguished .cake-smoke{animation:candleSmoke 2.2s ease-out both}@keyframes candleFlicker{0%{transform:translate(-50%) rotate(-4deg) scale(.94,1.02)}to{transform:translate(-50%) rotate(6deg) scale(1.06,.96)}}@keyframes candleSmoke{0%{opacity:0;transform:translateY(4px) rotate(-10deg) scale(.8)}18%{opacity:.56}to{opacity:0;transform:translate(8px,-34px) rotate(22deg) scale(1.5)}}.birthday-letter{max-width:660px;margin:0 auto;padding:26px 0 0;border-top:1px solid rgba(244,241,233,.15)}.birthday-letter p{margin:0 0 14px;color:#f4f1e9bf;font-size:clamp(13px,1.2vw,16px);line-height:1.72}.birthday-letter p:last-of-type{margin-top:22px;color:var(--text);font-family:var(--display);font-size:clamp(28px,3.2vw,44px);line-height:1.1}.birthday-letter small{display:block;margin-top:28px;color:#f4f1e961;font-size:9px;line-height:1.65}.birthday-exclamation{right:4%;bottom:-8%;font-size:clamp(260px,39vw,580px)}@media(hover:hover){.primary-button:hover{transform:translateY(-1px)}}@media(max-width:767px){.cover-screen,.birthday-page{min-height:calc(100dvh - 16px);width:calc(100% - 16px);margin:8px auto;border-width:3px;border-radius:2px 2px 25px 25px}.frame-corners{inset:17px;opacity:.18}.cosmic-field canvas{opacity:.76}.cosmic-field:before{filter:blur(30px);opacity:.27}.cosmic-haze{width:74vw;filter:blur(38px);opacity:.13}.cover-nav,.birthday-nav{top:23px;width:calc(100% - 44px);font-size:6px}.cover-copy{top:48%;width:calc(100% - 34px)}.cover-copy h1{max-width:340px;margin:0 auto;font-size:clamp(50px,15vw,66px)}.cover-copy>p:not(.system-label){max-width:270px;margin-top:15px;font-size:11px}.primary-button{min-height:46px;padding:0 23px;font-size:12px}.cover-exclamation{top:29%;right:4%;opacity:.65;font-size:62vw}.cover-edition{right:20px;bottom:22px;font-size:7px}.cover-edition-left{right:auto;left:20px}.music-control{top:max(20px,env(safe-area-inset-top));right:20px;width:40px;min-height:40px;padding:0;justify-content:center}.music-control>span:last-child{display:none}.birthday-content{width:calc(100% - 44px);padding:78px 0 62px;align-content:center;gap:31px}.birthday-heading>p{margin-bottom:18px;font-size:6px}.birthday-heading h1{max-width:340px;margin:0 auto;font-size:clamp(50px,14.5vw,62px)}.birthday-heading>span{margin-top:11px;font-size:6px}.birthday-letter{padding-top:22px}.birthday-letter p{margin-bottom:12px;font-size:12px;line-height:1.65}.birthday-letter p:last-of-type{margin-top:18px;font-size:27px}.birthday-letter small{margin-top:23px;font-size:8px}.birthday-exclamation{right:-5%;bottom:16%;font-size:70vw}.birthday-meta{display:none}}@media(prefers-reduced-motion:reduce){.cosmic-field:before,.cosmic-haze,.frame-corners,.cake-flame,.cake-smoke,.cover-copy h1 em,.birthday-heading h1 em,.music-bars.is-playing i{animation:none!important}*,*:before,*:after{transition-duration:.01ms!important}}