@font-face{font-family:hb-shs;src:url("assets/v2/f-shs-1.ttf");font-display:swap}
@font-face{font-family:hb-shs2;src:url("assets/v2/f-shs-2.ttf");font-display:swap}
@font-face{font-family:hb-kai;src:url("assets/v2/f-kai-1.ttf");font-display:swap}
@font-face{font-family:hb-kai2;src:url("assets/v2/f-kai-2.ttf");font-display:swap}
@font-face{font-family:hb-hei;src:url("assets/v2/f-hei-1.ttf");font-display:swap}
@font-face{font-family:hb-hei2;src:url("assets/v2/f-hei-2.ttf");font-display:swap}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{background:#eef0f1;font-family:"Microsoft YaHei",sans-serif}
.wechat-share-thumb{position:absolute;left:-10000px;top:-10000px;width:300px;height:300px;overflow:hidden;pointer-events:none}
.wechat-share-thumb img{display:block;width:300px;height:300px;object-fit:cover}
#music{display:none}

#page{position:relative;width:10rem;height:182rem;margin:0 auto;background:#fffdf5;overflow:hidden;box-shadow:0 0 30px rgba(0,0,0,.08)}

.f-shs{font-family:hb-shs,hb-shs2,"Source Han Sans SC","Microsoft YaHei",sans-serif}
.f-kai{font-family:hb-kai,hb-kai2,"Kaiti SC",KaiTi,serif}
.f-hei{font-family:hb-hei,hb-hei2,"Microsoft YaHei",sans-serif}
.f-yahei{font-family:"Microsoft YaHei",sans-serif}

.t{position:absolute;padding:.13333rem;font-size:.32rem;line-height:1;color:#000;word-break:break-all}
.center{text-align:center}
.right{text-align:right}
.vcol{width:.58667rem;line-height:1.5;text-align:center;word-break:break-all}

.rect{position:absolute;background:#d3a68f}
.rect.black{background:#000}
.circle{position:absolute;width:1.06667rem;height:1.06667rem;background:#d3a68f;border-radius:50%}
.slash{position:absolute;width:.02667rem;height:.4rem;background:#000;transform:rotate(30deg)}

.img{position:absolute;overflow:hidden}
.img>img{display:block;width:100%;height:100%;object-fit:cover}
.img.masked{-webkit-mask-box-image-source:url("assets/v2/mask.png");-webkit-mask-box-image-slice:0 fill}

.calendar{position:absolute;left:-.08rem;top:109.04rem;width:8.66667rem;height:8.66667rem;transform:scale(.75);border:.05333rem solid #d3a68f;border-radius:1.38667rem;padding:.62rem .78rem 0;color:#d3a68f}
.cal-size{text-align:center;font-size:1.17rem;line-height:1.15}
.cal-size span{font-size:.59rem}
.cal-year{text-align:center;font-size:.43rem;letter-spacing:.08rem;margin:.12rem 0 .3rem}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:.37rem;padding-bottom:.24rem;border-bottom:.02667rem solid #d3a68f}
.cal-days{list-style:none;display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:.86rem;text-align:center;font-size:.37rem;color:#666;margin-top:.2rem}
.cal-days li{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1}
.cal-days li.active{color:#bf0404;font-weight:700}
.cal-days li.active::after{content:"♥";font-size:.27rem;line-height:1;color:#bf0404}

.countdown{position:absolute;left:7.6rem;top:108.373rem;width:2.26667rem;height:10rem;display:flex;flex-direction:column;justify-content:space-between;transform:scale(.855)}
.cd-box{width:2.26667rem;height:2.26667rem;background:#d3a68f;border-radius:.13333rem;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}
.cd-box b{font-size:.64rem;font-weight:400;line-height:1;font-family:Arial,"Microsoft YaHei",sans-serif}
.cd-box span{font-size:.32rem;margin-top:.14rem}

.map{position:absolute;left:1.9rem;top:121.067rem;width:6.24rem;height:3.70667rem;display:block;border:.08rem solid #d3a68f;border-radius:.56rem;overflow:hidden;background:#edf1ef}
.map img{display:block;width:100%;height:100%;object-fit:cover}

.fin{position:absolute;left:2.10667rem;width:5.86667rem;height:.93333rem;background:#fff;border:.02667rem solid #d3a68f;border-radius:.45333rem;display:flex;align-items:center;padding:0 .35rem}
.fin .req{color:#ff4b4b;font-size:.37333rem;margin-right:.12rem;font-family:Arial,sans-serif}
.fin input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:.37333rem;color:#6e6e6e;font-family:"Microsoft YaHei",sans-serif}
.fsub{position:absolute;left:2.10667rem;width:5.86667rem;height:.93333rem;border:0;background:#d3a68f;border-radius:.45333rem;color:#fff;font-size:.42667rem;font-family:"Microsoft YaHei",sans-serif;cursor:pointer}
.fsub:active{opacity:.85}

.music-btn{position:fixed;z-index:20;top:.35rem;right:max(.27rem,calc((100vw - 10rem)/2 + .27rem));width:.85rem;height:.85rem;padding:.16rem;border:0;border-radius:50%;background:rgba(211,166,143,.42);overflow:hidden;cursor:pointer}
.music-btn img{display:block;width:100%;height:100%;object-fit:contain}
.music-btn.playing{animation:spin 5s linear infinite}
.music-btn.muted::after{content:"";position:absolute;left:.08rem;top:.4rem;width:.69rem;height:1px;background:#fff;transform:rotate(45deg)}
@keyframes spin{to{transform:rotate(360deg)}}

.toast{position:fixed;z-index:60;left:50%;bottom:1.6rem;transform:translate(-50%,.3rem);padding:.24rem .43rem;border-radius:.08rem;color:#fff;background:rgba(0,0,0,.78);font-size:.32rem;opacity:0;pointer-events:none;transition:.22s ease}
.toast.show{opacity:1;transform:translate(-50%,0)}

.gift-stage{position:fixed;inset:0;z-index:150;pointer-events:none}
.gift-hero{position:absolute;left:50%;top:42%;width:2.4rem;height:2.4rem;transform:translate(-50%,-50%) scale(0);animation:giftHero 2.4s ease forwards}
@keyframes giftHero{0%{transform:translate(-50%,-50%) scale(0);opacity:0}18%{transform:translate(-50%,-50%) scale(1.25);opacity:1}30%{transform:translate(-50%,-50%) scale(1)}70%{transform:translate(-50%,-80%) scale(1);opacity:1}100%{transform:translate(-50%,-130%) scale(.9);opacity:0}}
.gift-particle{position:absolute;left:50%;top:42%;opacity:0;animation:giftParticle 1.6s ease-out forwards}
@keyframes giftParticle{0%{transform:translate(-50%,-50%) scale(.6);opacity:1}100%{transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(1.15);opacity:0}}

@media (prefers-reduced-motion:reduce){.music-btn.playing{animation:none}}
