:root{color-scheme:light;background:#f8dfe7}
*{box-sizing:border-box}
html,body{margin:0;width:100%;min-height:100%;overflow-x:hidden}
body{height:100svh;background:radial-gradient(ellipse at 50% 48%,#fff5f7 0%,#fceaf0 35%,#f8dfe7 75%,#f4d5e0 100%);isolation:isolate}
.definitions{position:absolute;width:0;height:0;overflow:hidden}
.wallpaper{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1;mask-image:radial-gradient(ellipse 37% 31% at 50% 50%,transparent 45%,#000 100%)}
.motif{position:absolute;width:clamp(58px,8vw,125px);height:auto;aspect-ratio:650/724;opacity:.105;filter:saturate(.72);transform:rotate(var(--angle,-10deg));}
.m1{left:4%;top:4%;--angle:-19deg;width:8vw}
.m2{left:28%;top:12%;--angle:13deg;width:5.2vw;opacity:.075}
.m3{left:57%;top:-5%;--angle:-11deg;width:8.7vw}
.m4{right:7%;top:10%;--angle:17deg;width:6.7vw}
.m5{left:-3%;top:38%;--angle:12deg;width:9vw;opacity:.085}
.m6{right:-2%;top:39%;--angle:-18deg;width:8.2vw}
.m7{left:16%;bottom:19%;--angle:-9deg;width:6vw;opacity:.075}
.m8{right:18%;bottom:19%;--angle:20deg;width:5.4vw}
.m9{left:1%;bottom:-4%;--angle:17deg;width:8.8vw}
.m10{left:35%;bottom:2%;--angle:-18deg;width:6.1vw}
.m11{right:33%;bottom:8%;--angle:11deg;width:4.3vw;opacity:.065}
.m12{right:3%;bottom:-3%;--angle:-12deg;width:8vw}
main{height:100%;min-height:100svh;display:grid;place-items:center;padding:clamp(20px,5vw,80px)}
.entrance{display:block;width:min(760px,72vw);line-height:0;text-decoration:none;border-radius:24px;outline-offset:18px;filter:drop-shadow(0 9px 15px #81394a16);transition:transform .22s ease,filter .22s ease;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.entrance img{display:block;width:100%;height:auto;user-select:none}
.entrance-button{display:flex;align-items:center;justify-content:center;gap:14px;width:max-content;min-height:52px;margin:30px auto 0;padding:12px 28px;border:1px solid #a03b53;border-radius:14px;background:#8e243e;color:#fff0d7;font:600 18px/1.5 "Microsoft YaHei","PingFang SC",sans-serif;letter-spacing:1px;box-shadow:0 6px 18px #8e243e20}
.entrance-button span{font-size:22px;line-height:1}
.entrance:focus-visible{outline:2px solid #982c48}
.entrance:active{transform:scale(.975)}
@media(hover:hover){.entrance:hover{transform:translateY(-3px);filter:drop-shadow(0 12px 17px #81394a28)}}
@media(max-width:600px){
  main{padding:20px}
  .entrance{width:100%;max-width:470px;outline-offset:8px}
  .entrance-button{min-height:48px;margin-top:26px;padding:10px 24px;font-size:16px;border-radius:12px}
  .wallpaper{mask-image:radial-gradient(ellipse 65% 23% at 50% 50%,transparent 37%,#000 100%)}
  .m1{left:2%;top:4%;width:83px}
  .m2{left:54%;top:7%;width:49px}
  .m3{left:auto;right:-6%;top:23%;width:94px}
  .m4{right:25%;top:27%;width:48px;opacity:.065}
  .m5{left:-7%;top:29%;width:85px}
  .m6{right:-6%;top:60%;width:75px}
  .m7{left:11%;bottom:26%;width:53px}
  .m8{right:27%;bottom:18%;width:43px;opacity:.07}
  .m9{left:-3%;bottom:2%;width:88px}
  .m10{left:40%;bottom:-3%;width:63px}
  .m11{left:41%;top:19%;width:38px}
  .m12{right:-1%;bottom:1%;width:78px}
}
@media(max-height:450px) and (min-width:601px){.entrance{width:min(620px,68vw)}main{padding:18px}}
@media(prefers-reduced-motion:reduce){.entrance{transition:none}}