/* Screenshot collage: the crop viewports preserve the original artwork. */
.upload-poster{--pink:#f484b4;--violet:#baa6ed;--ink:#2d2c3c;background:#fff;color:var(--ink);overflow:clip;position:relative;isolation:isolate;padding-bottom:22px}
.upload-poster:before{content:"";position:absolute;z-index:-1;left:-15%;right:-15%;bottom:0;height:52%;background:linear-gradient(to top,#f0e8ff 0%,#f8f3ff 38%,#ffffff00 100%);border-radius:52% 48% 0 0 / 16% 20% 0 0;pointer-events:none}
.poster-hero{width:95%;max-width:1760px;margin:auto;display:grid;grid-template-columns:51% 49%;height:clamp(460px,34.5vw,650px);position:relative}
.poster-art{position:relative;min-width:0;isolation:isolate;--drift-x:0px;--drift-y:0px;--lean:0deg}
.poster-halo{display:block;position:absolute;z-index:0;width:min(78%,560px);aspect-ratio:1;left:10%;top:4%;border-radius:50%;background:radial-gradient(circle at 40% 32%,#f4f0ff 0 13%,#e9e1ff 52%,#d9cafb 100%);box-shadow:0 24px 60px #bca7ec24;opacity:.92;pointer-events:none}
.poster-character-enter{position:absolute;z-index:2;inset:24px 1% 8px 0;opacity:1;transform-origin:50% 100%}
.has-motion .poster-art:not(.is-ready) .poster-character-enter{opacity:0}
.poster-character{height:100%;width:100%;transform:translate(var(--drift-x),var(--drift-y)) rotate(var(--lean));transform-origin:50% 87%;transition:transform .8s cubic-bezier(.2,.9,.25,1.35)}
.poster-character>img{display:block;width:100%;height:100%;box-sizing:border-box;padding-top:10px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 2px 0 #fff) drop-shadow(0 10px 10px #83709110);transform-origin:50% 100%}
.poster-art.is-ready .poster-character-enter{animation:poster-pop-in 1.36s cubic-bezier(.16,.78,.28,1) both}
.poster-copy{align-self:center;padding:20px 7% 12px 5%;position:relative;z-index:7;min-width:0}
.poster-badge{display:inline-flex;align-items:center;background:#e7ddfc;padding:9px 19px;border-radius:40px;transform:rotate(-2deg);color:#7d68ba;font-size:clamp(10px,.9vw,15px);font-weight:700;margin-bottom:24px;line-height:1.2;letter-spacing:.08em}
.poster-copy h1{margin:0 0 22px;font-size:clamp(42px,4.6vw,84px);font-family:"Microsoft YaHei",Arial,sans-serif;font-weight:900;line-height:1.22;letter-spacing:-.065em;transform:rotate(-1.8deg) skew(-4deg);white-space:nowrap}
.poster-copy h1>span{display:block}.poster-copy h1>em{position:relative;display:inline-block;color:#f17caa;font-style:normal;isolation:isolate;margin-top:2px}
.poster-copy h1>em:after{content:"";position:absolute;bottom:2%;right:-9%;height:21%;width:48%;border-radius:50px;background:#ffe3ee;z-index:-1;transform:rotate(-6deg)}
.poster-lead{font-size:clamp(13px,1.17vw,20px);line-height:1.8;color:#737080;margin:0 0 21px}.poster-mobile-break{display:none}
.poster-cta{display:flex;justify-content:center;align-items:center;gap:15px;position:relative;isolation:isolate;overflow:hidden;border:3px solid #33323d;border-radius:100px;background:linear-gradient(110deg,#f5a1c6,#f17fae);color:#fff;padding:17px 22px;font-size:clamp(18px,1.75vw,29px);font-weight:700;box-shadow:0 5px 0 #3a344322,0 8px 16px #ba82a121;transform:none;transition:transform .32s cubic-bezier(.2,.7,.2,1.4),box-shadow .3s}
.poster-cta:before{content:"";position:absolute;inset:-20%;z-index:-1;background:linear-gradient(105deg,transparent 32%,#ffffff5c 50%,transparent 66%);transform:translateX(-120%);transition:transform .7s ease}
.poster-cta:hover,.poster-cta:focus-visible{transform:translateY(-4px);box-shadow:0 8px 0 #3a34431b,0 14px 22px #ba82a131}.poster-cta:hover:before{transform:translateX(120%)}.poster-cta b{font-size:1.2em;font-weight:500;transition:transform .3s}.poster-cta:hover b{transform:translate(3px,-3px)}
.poster-downloads{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:15px 0 0}.poster-download{min-width:0;border:2px solid #33323d;border-radius:100px;padding:12px 14px;display:flex;align-items:center;justify-content:center;gap:8px;color:#4f4857;font:inherit;font-size:clamp(11px,.86vw,15px);font-weight:700;line-height:1.3;box-shadow:0 4px 0 #3a34431b,0 8px 14px #8e7b9a14;cursor:pointer;transform:none;transition:transform .25s ease,box-shadow .25s ease,filter .25s ease}.poster-download-example{background:linear-gradient(135deg,#fff0a9,#ffe17c);border-color:#33323d}.poster-download-template{background:linear-gradient(135deg,#eee8ff,#dbe8ff);border-color:#33323d}.poster-download:hover,.poster-download:focus-visible{transform:translateY(-3px);box-shadow:0 7px 0 #3a344314,0 12px 20px #8e7b9a20;filter:saturate(1.08)}.poster-download b{font-size:1.15em}.poster-download-template:hover,.poster-download-template:focus-visible{transform:translateY(-3px)}
.poster-guide{display:table;position:relative;z-index:8;margin:15px auto 0;padding:3px 10px 5px;border-radius:18px;background:#fffdfcd9;font-size:clamp(11px,.95vw,16px);color:#807a8c;text-decoration:underline;text-underline-offset:5px}.poster-guide span{display:inline-block;margin-left:8px;transition:transform .25s}.poster-guide:hover span{transform:translateX(4px)}
.poster-scribble{position:absolute;font-family:"Segoe Print","Comic Sans MS",cursive;font-style:italic;line-height:1.3;color:#cbbbe9;pointer-events:none;font-size:clamp(12px,1.25vw,23px);transform:rotate(-12deg)}.copy-scribble{top:-19px;right:0;font-size:clamp(10px,1.05vw,18px)}.art-scribble{bottom:4%;right:-1%;z-index:4;font-size:clamp(11px,1.1vw,18px)}
.poster-cheer{position:absolute;right:-4%;bottom:38px;background:#e8dffc;border:4px solid #fff9fc;border-radius:48% 44% 39% 36%;padding:12px 14px;color:#947fc6;font-size:clamp(10px,.85vw,14px);line-height:1.4;transform:rotate(-9deg);text-align:center;box-shadow:-3px 5px 0 #fde7ed;pointer-events:none}.poster-cheer>span{position:absolute;top:-40px;left:28%;font-size:38px;color:#f2a0c0}
.poster-charm{position:absolute;z-index:5;width:clamp(64px,7vw,124px);aspect-ratio:1}
.poster-charm-card{--tilt-x:0deg;--tilt-y:0deg;--roll:0deg;display:block;width:100%;height:100%;padding:7px;background:white;border:1px solid #f6edf9;border-radius:17px;box-shadow:0 8px 17px #ad94cb24;transform:perspective(500px) rotateZ(calc(var(--rest) + var(--roll))) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transform-origin:center;transition:transform .55s cubic-bezier(.2,.9,.3,1.55),box-shadow .25s;cursor:grab}
.poster-charm-card:hover,.poster-charm-card:focus-visible{box-shadow:0 13px 24px #ad94cb40}.poster-charm-card:active{cursor:grabbing}.poster-charm-picture{display:block;overflow:hidden;width:100%;height:100%;border-radius:10px;background:#fff1ed}.poster-crop{display:block;width:100%;height:100%}
.charm-blue{--rest:-8deg;left:1%;top:25%}.charm-green{--rest:-13deg;left:0;top:49%}.charm-mouth{--rest:9deg;left:9%;top:73%;width:clamp(53px,5.5vw,97px)}.charm-smile{--rest:-11deg;right:5%;top:19%}.charm-wink{--rest:7deg;right:0;top:44%}
.poster-spark{position:absolute;z-index:3;color:#f8a0c9;pointer-events:none}.spark-one{left:15%;top:10%;font-size:44px;transform:rotate(12deg)}.spark-two{right:11%;bottom:19%;font-size:34px;color:#b8a0e6}.poster-heart{position:absolute;right:8%;top:7%;font-size:26px;color:#f39abf;transform:rotate(18deg)}
.poster-paw{position:absolute;left:1%;top:5%;font-size:35px;color:#efe6fb;transform:rotate(-24deg);line-height:1}.poster-paw i{position:absolute;top:-8px;left:-5px;font-size:13px;white-space:nowrap;font-style:normal}
.poster-mini-board{position:absolute;z-index:6;right:1%;bottom:5%;width:clamp(74px,5.7vw,92px);aspect-ratio:1;padding:5px;border:1.5px solid #e4d9f6;border-radius:14px;background:#fffefa;box-shadow:0 10px 22px #9c87b820,0 2px 0 #fff;transform:rotate(2deg);transition:transform .42s cubic-bezier(.2,.8,.2,1.15),box-shadow .3s}.poster-mini-board:hover{transform:translateY(-4px) rotate(0);box-shadow:0 15px 26px #9c87b82c,0 2px 0 #fff}.poster-mini-canvas{display:grid;place-items:center;width:100%;height:100%;border-radius:9px;background-color:#fff;background-image:linear-gradient(45deg,#ececf0 25%,transparent 25%),linear-gradient(-45deg,#ececf0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ececf0 75%),linear-gradient(-45deg,transparent 75%,#ececf0 75%);background-position:0 0,0 6px,6px -6px,-6px 0;background-size:12px 12px;overflow:hidden}.poster-mini-canvas img{display:block;width:76%;height:76%;object-fit:contain;filter:drop-shadow(0 2px 2px #47495220)}
.poster-process{position:relative;z-index:6;max-width:1710px;width:92%;margin:-4px auto 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,3.7vw,67px);padding:17px 0 40px}
.poster-curve{display:block;position:relative;z-index:5;width:100%;height:clamp(70px,7vw,125px);margin:-8px 0 -8px;pointer-events:none}
.poster-process:before{display:none}
.poster-connector{position:absolute;left:5%;top:57px;width:90%;height:145px;z-index:-1;overflow:visible;fill:none;stroke:#c6b4f3;stroke-width:2.5;stroke-dasharray:7 8;stroke-linecap:round}
.poster-step{min-width:0}.poster-step-heading{display:flex;align-items:center;gap:12px;margin:0 -3px 23px;transform:rotate(-2deg)}.poster-step:nth-of-type(2) .poster-step-heading{transform:rotate(-1deg)}.poster-step:nth-of-type(3) .poster-step-heading{transform:rotate(-2.3deg)}
.poster-step-number{flex:none;display:grid;place-items:center;background:#f59bc2;color:white;font-size:clamp(23px,2.1vw,36px);font-weight:800;width:clamp(48px,4.3vw,72px);height:clamp(38px,3.2vw,55px);border-radius:46% 48% 42% 45%;transform:rotate(-5deg)}.poster-step:nth-of-type(even) .poster-step-number{background:#cab7f4}
.poster-step-heading h2{font-size:clamp(18px,1.65vw,28px);line-height:1.25;letter-spacing:-.05em;margin:0 0 5px;white-space:nowrap}.poster-step-heading p{margin:0;font-size:clamp(10px,.88vw,15px);line-height:1.5;color:#87808e;white-space:nowrap}
.poster-frame{position:relative;padding:8px;border:2px solid #e7ddf6;border-radius:18px;background:#fff;box-shadow:0 12px 20px #a98fbd1d;transform:rotate(-4deg);transition:transform .5s cubic-bezier(.2,.8,.2,1.3),box-shadow .3s}.poster-frame:before{content:"";position:absolute;inset:4px;border:1px solid #eae4f4;border-radius:13px;pointer-events:none}.poster-step:nth-of-type(2) .poster-frame{transform:rotate(-1.7deg)}.poster-step:nth-of-type(3) .poster-frame{transform:rotate(-2.1deg)}.poster-step:nth-of-type(4) .poster-frame{transform:rotate(-4deg)}
.poster-step:hover .poster-frame{transform:translateY(-7px) rotate(1deg);box-shadow:0 20px 28px #a98fbd30}.poster-step-crop{aspect-ratio:1/1.12;overflow:hidden;border-radius:9px;background:#faf8fc}.poster-step-crop .poster-crop{transition:scale .5s}.poster-step:hover .poster-crop{scale:1.025}
.poster-step-sticker{position:absolute;z-index:2;right:-8%;bottom:-7%;min-width:100px;text-align:center;transform:rotate(-6deg);color:#6e5b89}.poster-step-sticker>i{display:grid;place-items:center;margin:0 0 -10px auto;width:65px;height:59px;background:#e1d2fd;border:4px solid white;border-radius:48% 50% 43% 44%;position:relative;z-index:1;transform:rotate(9deg);font-style:normal}.poster-step-sticker svg{width:29px;height:29px}.poster-step-sticker>span{display:block;padding:10px 15px;background:#e9defc;border:4px solid #fff;border-radius:40% 37% 29% 31%;font-size:clamp(11px,1vw,16px);font-weight:600;line-height:1.4;box-shadow:0 7px 10px #9b88ab13}
.poster-step:nth-of-type(odd) .poster-step-sticker>i,.poster-step:nth-of-type(odd) .poster-step-sticker>span,.poster-step:last-child .poster-step-sticker>i,.poster-step:last-child .poster-step-sticker>span{background:#ffc3df;color:#7c5570}.poster-step:first-of-type .poster-step-sticker{left:-9%;right:auto;transform:rotate(-6deg)}.poster-step:first-of-type .poster-step-sticker>span{background:#fff2df;color:#8c766e}.poster-step:first-of-type .poster-step-sticker>i{background:#f89cc5;color:#fff}.poster-step:nth-of-type(3) .poster-step-sticker>i,.poster-step:nth-of-type(3) .poster-step-sticker>span{background:#d9efff;color:#4f6f91}
.poster-signoff{display:flex;align-items:center;justify-content:center;gap:13px;padding:17px 15px 4px;color:#b5a7c0;font-size:9px;letter-spacing:.09em;text-align:center}.poster-signoff span{font-weight:700}.poster-signoff i{font-style:normal}.poster-signoff b{font-size:18px;font-weight:400}
.upload-poster.has-motion [data-poster-reveal]{opacity:0;translate:0 26px;transition:opacity .7s ease,translate .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0s)}.upload-poster.has-motion [data-poster-reveal].is-visible{opacity:1;translate:0 0}
@keyframes poster-pop-in{0%{opacity:0;transform:translateY(95%) scale(.9)}64%{opacity:1;transform:translateY(-1.7%) scale(1.01)}84%{transform:translateY(.55%) scale(.997)}100%{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:1800px){.poster-copy{padding-right:10%}.poster-copy h1{font-size:84px}.poster-step-crop{aspect-ratio:1/.94}.poster-hero{height:650px}}
@media(max-width:1050px) and (min-width:761px){.poster-copy{padding-right:2%;padding-left:2%}.poster-copy h1{font-size:4.8vw}.poster-cheer{display:none}.poster-step-heading{gap:8px}.poster-step-heading h2{font-size:17px}.poster-step-heading p{white-space:normal}.poster-process{gap:22px}.poster-step-sticker>i{width:51px;height:46px}.poster-step-sticker>span{padding:8px 10px}}
@media(max-width:760px){.poster-hero{width:92%;height:auto;grid-template-columns:1fr;padding-top:34px}.poster-copy{grid-row:1;padding:0 3%;text-align:center}.poster-badge{font-size:9px;margin-bottom:22px;padding:8px 13px}.poster-copy h1{font-size:clamp(33px,8.9vw,58px);margin-bottom:20px}.poster-lead{font-size:12px;line-height:1.8;margin-bottom:19px}.poster-mobile-break{display:block}.poster-cta{font-size:19px;padding:15px 17px;border-width:2px}.poster-guide{font-size:11px;margin-top:15px}.copy-scribble,.poster-cheer{display:none}.poster-art{height:clamp(340px,88vw,540px);margin-top:24px}.poster-character-enter{inset:0 -2% 0}.poster-halo{top:0;width:94%;left:3%}.poster-charm{width:19%}.charm-mouth{width:15%}.charm-blue{top:26%;left:0}.charm-green{top:50%;left:-1%}.charm-mouth{top:73%;left:6%}.charm-smile{right:2%;top:17%}.charm-wink{right:-2%;top:43%}.poster-charm-card{border-radius:13px;padding:5px}.poster-mini-board{right:1%;bottom:5%;width:76px}.art-scribble{font-size:11px;bottom:7%;right:-1%}.spark-one{font-size:30px;left:16%;top:11%}.poster-heart{font-size:20px}.poster-process{width:87%;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 28px;padding:20px 0 45px}.poster-connector{display:none}.poster-step-heading{gap:8px;margin-bottom:18px;align-items:flex-start}.poster-step-number{width:34px;height:30px;font-size:19px}.poster-step-heading h2{font-size:clamp(13px,3.6vw,20px);margin-top:2px}.poster-step-heading p{font-size:9px;white-space:normal;line-height:1.5}.poster-frame{padding:5px;border-radius:13px}.poster-step-crop{aspect-ratio:1/1.15}.poster-step-sticker{min-width:0;right:-11%;bottom:-11%}.poster-step-sticker>i{width:41px;height:37px;border-width:3px;margin-bottom:-8px}.poster-step-sticker svg{width:20px;height:20px}.poster-step-sticker>span{font-size:10px;border-width:3px;padding:7px 9px}.poster-step:first-of-type .poster-step-sticker{left:-10%}.poster-signoff{gap:7px;font-size:6px;letter-spacing:0;padding-top:6px}.poster-signoff b{font-size:13px}}
@media(max-width:760px){.poster-downloads{grid-template-columns:1fr;gap:10px;margin-top:12px}.poster-download{font-size:12px;padding:10px 12px}.poster-curve{height:75px;margin:-18px 0 -7px}.poster-character-enter{inset:12px -2% 0}.poster-character>img{padding-top:7px}}
