/* Adopted Instagram-inspired gradient, explicitly requested by the user. */

.spc-stamp-banner{position:relative;display:block;width:100%;height:100%;aspect-ratio:1280/622;container-type:inline-size;overflow:hidden;isolation:isolate;text-decoration:none!important;color:white!important;font:16px/1.7 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:left;background:radial-gradient(ellipse at 0% 110%,#ffda75 0%,#fb9444 23%,transparent 59%),linear-gradient(125deg,#dc386e 15%,#c22996 53%,#6543ca 100%)}
.spc-stamp-banner *{box-sizing:border-box}.spc-stamp-banner .character{position:absolute;object-fit:contain;width:100%;height:100%;display:block}
.spc-stamp-banner .film-type{position:absolute;left:6%;top:19%;width:43%;z-index:4}.spc-stamp-banner .design-title{font-size:8cqw;line-height:1.14;font-weight:750;letter-spacing:-.035em}
.spc-stamp-banner .camera-start{display:block;background:white;color:#822864;border-radius:5px;font-size:max(12px,2.55cqw);font-weight:750;line-height:1.3;padding:1.5cqw 2.6cqw;width:max-content;margin-top:3.6cqw}.spc-stamp-banner .camera-help{display:block;font-size:max(10px,1.65cqw);line-height:1.5;margin-top:1.1cqw;font-weight:600;color:#64224e}
.spc-stamp-banner .picture{position:relative;background:white}.spc-stamp-banner .spa-scene{position:relative;width:100%;height:100%;overflow:hidden;background-image:url('/toppage/assets/stamp-spa-scenes.jpg');background-size:100% 300%}.spc-stamp-banner .spa-entrance{background-position:center top}.spc-stamp-banner .spa-comics{background-position:center center}.spc-stamp-banner .spa-meal{background-position:center bottom}
.spc-stamp-banner .photo-beaver{width:36%;height:95%;right:5%;bottom:0}.spc-stamp-banner .photo-kappy{width:27%;height:59%;left:5%;bottom:0;transform:rotate(-9deg)}
.spc-stamp-banner:focus-visible{outline:3px solid #202426;outline-offset:-3px}
.spc-stamp-banner .record-unit{position:absolute;left:48%;top:10%;width:46%;height:58%;transform-origin:center;animation:record-unit 12s infinite;z-index:2}
.spc-stamp-banner .record-canvas{position:absolute;inset:0;border:.7cqw solid white;box-shadow:0 .5cqw 2cqw #40213d30;z-index:2}
.spc-stamp-banner .record-ribbon{position:absolute;inset:-110% -5%;padding:1cqw;background:#27212b;border-inline:.8cqw dashed #f3eae7;display:grid;grid-template-rows:1fr 1fr 1fr;gap:1cqw;animation:record-ribbon 12s infinite}
.spc-stamp-banner .record-ribbon .picture{padding:.5cqw;min-height:0}
.spc-stamp-banner .record-ribbon .spa-scene{height:100%}
.spc-stamp-banner .record-tray{position:absolute;left:49%;top:73%;width:44%;height:21%;display:flex;gap:1.3cqw;animation:record-tray 12s infinite}
.spc-stamp-banner .record-tray>span{position:relative;background:#fff;width:30%;border-radius:4px;overflow:hidden}
.spc-stamp-banner .record-tray>span:nth-child(2){width:40%}
.spc-stamp-banner .record-tray b{position:absolute;right:0;top:0;background:#842f91;color:white;font-size:2cqw;line-height:1.3;padding:0 .4cqw;opacity:0}
.spc-stamp-banner .choice-one b{animation:record-check-one 12s infinite}
.spc-stamp-banner .choice-two b{animation:record-check-two 12s infinite}
.spc-stamp-banner .record-canvas .edit-kappy{left:7%;top:21%;width:26%;height:52%;animation:record-kappy 12s infinite}
.spc-stamp-banner .record-canvas .edit-family{left:38%;top:22%;width:62%;height:73%;animation:record-family 12s infinite}
.spc-stamp-banner .edit-handles{position:absolute;left:36%;top:20%;width:62%;height:72%;border:1px dashed white;outline:1px dashed #842f91;animation:record-handles 12s infinite}
.spc-stamp-banner .edit-handles:before,.spc-stamp-banner .edit-handles:after{content:'';position:absolute;width:1.2cqw;height:1.2cqw;background:white;border:1px solid #842f91}
.spc-stamp-banner .edit-handles:before{left:-.6cqw;top:-.6cqw}
.spc-stamp-banner .edit-handles:after{bottom:-.6cqw;right:-.6cqw}
.spc-stamp-banner .record-flash{position:absolute;inset:0;background:white;animation:record-flash 12s infinite}
.spc-stamp-banner .record-shutter{position:absolute;left:88%;top:61%;font-size:4.5cqw;line-height:1;background:white;color:#842f91;padding:.4cqw;z-index:4;animation:record-shutter 12s infinite}
.spc-stamp-banner .record-cursor{position:absolute;left:54%;top:79%;font-size:3.8cqw;color:white;text-shadow:0 1px 3px #222;z-index:6;animation:record-cursor 12s infinite}
.spc-stamp-banner .record-phases{position:absolute;left:6%;top:7%;font-size:max(10px,1.7cqw);font-weight:700;color:white}
.spc-stamp-banner .record-phases span{position:absolute;white-space:nowrap;opacity:0;animation:record-phase-one 12s infinite}
.spc-stamp-banner .record-phases span:nth-child(2){animation-name:record-phase-two}
.spc-stamp-banner .record-phases span:nth-child(3){animation-name:record-phase-three}
.spc-stamp-banner .record-phases span:nth-child(4){animation-name:record-phase-four}
@keyframes record-unit{0%,70%{transform:translate(0,0) scale(1) rotate(0deg)}83%,100%{transform:translate(6cqw,6cqw) scale(.85) rotate(12deg)}}
@keyframes record-ribbon{0%,70%{opacity:0}82%,100%{opacity:1}}
@keyframes record-tray{0%,66%{opacity:1;translate:0 0}73%,100%{opacity:0;translate:0 3cqw}}
@keyframes record-check-one{0%,10%{opacity:0}13%,100%{opacity:1}}
@keyframes record-check-two{0%,21%{opacity:0}24%,100%{opacity:1}}
@keyframes record-kappy{0%,10%{opacity:0;transform:translate(0,10cqw) scale(.5)}18%{opacity:1;transform:translate(0,0) scale(1)}32%,100%{opacity:1;transform:translate(1cqw,3cqw) scale(.9) rotate(12deg)}}
@keyframes record-family{0%,21%{opacity:0;transform:translate(0,12cqw) scale(.5)}29%{opacity:1;transform:translate(0,0) scale(.7)}38%{transform:translate(-3cqw,0) scale(.7)}48%{transform:translate(-1cqw,0) scale(1)}57%,100%{opacity:1;transform:translate(-1cqw,0) scale(1) rotate(-10deg)}}
@keyframes record-handles{0%,29%{opacity:0;transform:scale(.7)}32%{opacity:1;transform:scale(.7)}38%{opacity:1;transform:translate(-3cqw,0) scale(.7)}48%{opacity:1;transform:translate(-1cqw,0) scale(1)}57%,60%{opacity:1;transform:translate(-1cqw,0) rotate(-10deg)}63%,100%{opacity:0;transform:translate(-1cqw,0) rotate(-10deg)}}
@keyframes record-cursor{0%,9%{opacity:1;transform:translate(0,0)}12%{transform:translate(0,0) scale(.8)}22%,25%{transform:translate(15cqw,0)}31%{transform:translate(20cqw,-20cqw)}38%{transform:translate(17cqw,-20cqw)}48%{transform:translate(35cqw,-13cqw)}57%{transform:translate(33cqw,-23cqw)}64%,66%{opacity:1;transform:translate(34cqw,-8cqw)}69%,100%{opacity:0;transform:translate(34cqw,-8cqw)}}
@keyframes record-shutter{0%,58%{opacity:0;scale:1}61%,65%{opacity:1;scale:1}67%{opacity:1;scale:.8}71%,100%{opacity:0}}
@keyframes record-flash{0%,65%,70%,100%{opacity:0}66.5%{opacity:.85}}
@keyframes record-phase-one{0%,26%{opacity:1}28%,100%{opacity:0}}
@keyframes record-phase-two{0%,28%,62%,100%{opacity:0}30%,60%{opacity:1}}
@keyframes record-phase-three{0%,63%,73%,100%{opacity:0}65%,71%{opacity:1}}
@keyframes record-phase-four{0%,75%{opacity:0}79%,100%{opacity:1}}
