:root{--sky-top: #bfe9ff;--sky-mid: #d8f3ff;--grass: #d7f3c0;--frame: #ffffff;--shadow: 31, 84, 122}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}body{font-family:"Baloo 2",PingFang SC,Microsoft YaHei,system-ui,sans-serif;background:var(--sky-mid);overflow-x:hidden}#app{position:relative;min-height:100dvh;width:100%;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,56px) 16px;background:radial-gradient(120% 80% at 50% 120%,var(--grass) 0%,rgba(215,243,192,0) 42%),linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 55%,#eafff0 100%);isolation:isolate}.sky{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;z-index:-2;pointer-events:none}.sun{position:absolute;top:clamp(24px,6vw,70px);right:clamp(24px,8vw,110px);width:clamp(70px,12vw,140px);height:clamp(70px,12vw,140px);border-radius:50%;background:radial-gradient(circle at 50% 50%,#fff4b8,#ffd94a 55%,#ffc233);box-shadow:0 0 0 14px #ffde5947,0 0 70px 18px #ffd14080;animation:pulse 6s ease-in-out infinite}.cloud{position:absolute;background:#fff;border-radius:100px;opacity:.9;filter:drop-shadow(0 12px 18px rgba(120,170,200,.18))}.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}.cloud--1{width:150px;height:46px;top:14%;left:-160px;animation:drift 38s linear infinite}.cloud--2{width:110px;height:36px;top:32%;left:-160px;opacity:.75;animation:drift 52s linear infinite 6s}.cloud--3{width:190px;height:56px;top:8%;left:-220px;opacity:.6;animation:drift 64s linear infinite 12s}.cloud:before{width:60%;height:160%;top:-55%;left:12%}.cloud:after{width:45%;height:130%;top:-30%;right:14%}.bubbles{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none}.bubbles span{position:absolute;bottom:-80px;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fffffff2,#ffffff40);box-shadow:inset 0 0 6px #fffc;animation:rise linear infinite}.bubbles span:nth-child(1){left:8%;width:18px;height:18px;animation-duration:16s}.bubbles span:nth-child(2){left:20%;width:28px;height:28px;animation-duration:22s;animation-delay:3s}.bubbles span:nth-child(3){left:34%;width:14px;height:14px;animation-duration:14s;animation-delay:1s}.bubbles span:nth-child(4){left:48%;width:30px;height:30px;animation-duration:24s;animation-delay:5s}.bubbles span:nth-child(5){left:62%;width:16px;height:16px;animation-duration:18s;animation-delay:2s}.bubbles span:nth-child(6){left:75%;width:24px;height:24px;animation-duration:20s;animation-delay:6s}.bubbles span:nth-child(7){left:86%;width:12px;height:12px;animation-duration:13s;animation-delay:4s}.bubbles span:nth-child(8){left:93%;width:26px;height:26px;animation-duration:26s;animation-delay:1.5s}.stage{display:flex;align-items:center;justify-content:center;width:100%}.poster{position:relative;width:min(440px,100%);border-radius:clamp(20px,4vw,32px);padding:clamp(8px,1.6vw,14px);background:linear-gradient(160deg,#fff,#f3fbff);box-shadow:0 2px #ffffffe6 inset,0 18px 30px -12px rgba(var(--shadow),.35),0 40px 70px -20px rgba(var(--shadow),.4);transform:translateY(24px);opacity:0;animation:enter .9s cubic-bezier(.22,1,.36,1) forwards;transition:transform .4s ease,box-shadow .4s ease}.poster:hover{transform:translateY(-6px) scale(1.012);box-shadow:0 2px #ffffffe6 inset,0 24px 38px -12px rgba(var(--shadow),.4),0 56px 90px -22px rgba(var(--shadow),.45)}.poster img{display:block;width:100%;height:auto;border-radius:clamp(14px,3vw,22px)}@keyframes enter{to{transform:translateY(0);opacity:1}}@keyframes drift{0%{transform:translate(0)}to{transform:translate(calc(100vw + 260px))}}@keyframes rise{0%{transform:translateY(0) translate(0);opacity:0}10%{opacity:.9}90%{opacity:.7}to{transform:translateY(-105dvh) translate(20px);opacity:0}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}@media (prefers-reduced-motion: reduce){.sun,.cloud,.bubbles span{animation:none}.poster{animation:none;opacity:1;transform:none}}