/* Continuous physical staging. Character masks share one invariant 2:3 canvas. */
:root{--paper:#fbfaf7;--red:#d7281c}
body{background:var(--paper)}
.room-stage{background:#efdbc0;isolation:isolate}
.room-environment{position:absolute;inset:-2%;z-index:-1;pointer-events:none;transform-origin:50% 55%;overflow:hidden}
.room-environment>img{width:100%;height:100%;object-fit:fill}
.room-light{position:absolute;inset:0;background:radial-gradient(ellipse at 34% 22%,#fff8 0,transparent 58%),linear-gradient(100deg,#361c090a,transparent 35%,#361c0910);mix-blend-mode:soft-light}
.opening{height:450svh}.opening-stage{perspective:1400px;min-height:580px}
.hero-title{top:17%;left:13%;width:75%;transform:rotate(-6deg);transform-origin:30% 60%}
.hero-title h1{font-size:clamp(90px,14.6vw,235px);letter-spacing:-.075em;text-shadow:1px 2px 0 #65452618,3px 7px 9px #50351912}
.hero-title h1 span+span{font-size:.69em;margin-top:.07em}
.hero-title p{font-size:clamp(23px,2.6vw,42px);letter-spacing:-.04em;margin-top:.5em}
.intro-sock{background-image:url('assets/white-sock-alpha-v10.webp');background-size:contain;background-position:center;clip-path:none;aspect-ratio:1;width:27%;left:-3%;bottom:-8%;filter:drop-shadow(14px 25px 15px #47280924)}
.intro-pearl{width:10%;right:10%;top:19%;filter:drop-shadow(13px 24px 16px #44240b2a)}
.intro-hehe{mix-blend-mode:normal;width:14%;right:2%;bottom:27%;filter:drop-shadow(7px 12px 7px #47280920)}
.intro-doodle{left:4%;bottom:26%;width:9%;opacity:.7}
.scroll-invitation{bottom:4.5%;gap:11px;left:24%;right:24%}
.scroll-invitation strong{font-size:clamp(19px,2vw,29px);font-weight:600;letter-spacing:.01em}
.scroll-invitation span{font-size:14px}.down-arrow{font-size:40px;font-weight:300}
.outfit-assembly{width:min(63svh,48vw);top:-3svh;filter:drop-shadow(7px 13px 7px #633d1424);mix-blend-mode:normal}
.character{width:100%;height:100%;aspect-ratio:2/3;isolation:auto}
.char-rig{position:absolute;inset:0;transform-origin:50% 29%}
.character img{object-fit:fill}
.char-black.left,.char-black.right{inset:0;width:100%;height:100%;max-width:none;aspect-ratio:2/3;transform-origin:50% 84%;background:none}
.char-black.left,.char-white-left{clip-path:polygon(32.5% 77.5%,38% 78.2%,45.4% 78%,46.1% 79.5%,45% 83%,46.7% 86%,46.6% 89%,44% 91.2%,40.5% 92%,36% 91.7%,32.7% 90.4%,30.7% 87.8%,30.3% 85%,31.6% 81.8%);transform-origin:38% 80%}
.char-black.right,.char-white-right{clip-path:polygon(53.5% 78.1%,59% 78.5%,66% 77.6%,66.8% 79.7%,67.8% 83%,69% 85.8%,68.4% 89%,65.7% 91%,61.5% 92%,57% 91.3%,54% 89.5%,53% 86.5%,53.7% 82%);transform-origin:61% 80%}
.char-bare.left{clip-path:polygon(32% 74%,46.5% 74%,45.4% 82%,46% 87%,45% 91.5%,40% 92%,34% 91.5%,31.5% 88%,32% 82%)}
.char-bare.right{clip-path:polygon(52.5% 74%,66.5% 74%,66.5% 82%,68% 88%,66.5% 91.5%,60% 92%,54% 91.5%,52.5% 87%,53% 82%)}
.char-body{clip-path:polygon(30% 28%,36% 28%,40.5% 30.5%,40% 33%,38% 35%,39% 37%,42% 34%,48% 33%,56% 33%,61% 35%,62% 37%,60% 33%,59% 30%,62% 28%,67% 28%,70% 32%,72% 38%,73% 45%,71% 52%,68% 58%,65% 63%,65% 68%,67% 78.5%,53% 78.5%,50% 76%,46% 78.5%,32% 78.5%,34% 68%,34% 62%,29% 56%,27% 50%,27% 43%,28% 36%)}
.product-momo .char-body{clip-path:inherit}.product-momo .char-rig>.char-body{clip-path:polygon(30% 28%,36% 28%,40.5% 30.5%,40% 33%,38% 35%,39% 37%,42% 34%,48% 33%,56% 33%,61% 35%,62% 37%,60% 33%,59% 30%,62% 28%,67% 28%,70% 32%,72% 38%,73% 45%,71% 52%,68% 58%,65% 63%,65% 68%,67% 78.5%,53% 78.5%,50% 76%,46% 78.5%,32% 78.5%,34% 68%,34% 62%,29% 56%,27% 50%,27% 43%,28% 36%)}
.char-hat{left:29.5%;top:30.4%;width:41%;height:14.7%;transform-origin:50% 88%;filter:drop-shadow(0 3px 2px #0003)}
.outfit-heading{left:9%;top:34%;max-width:28%}.outfit-heading h2{font-size:clamp(38px,4.1vw,66px)}
.outfit-steps{right:8%;font-size:12px;gap:24px;letter-spacing:.02em}.outfit-caption{font-size:13px;bottom:4%}
.meeting{height:105svh;min-height:720px}.meeting-character{left:34%;width:min(38vw,63svh);height:auto;top:-2%;filter:drop-shadow(9px 17px 10px #633d1425)}
.meeting .section-heading{top:11%;left:8%;max-width:33%}.meeting .section-heading h2{font-size:clamp(34px,4vw,64px)}
.story-choice{right:6%;top:35%;width:25%;padding:32px;transform:rotate(3deg);border-radius:12px 28px 17px 12px;box-shadow:3px 9px 0 #dfc39e,7px 24px 25px #64432325,inset 0 1px 0 #fffc}
.story-choice strong{font-size:clamp(25px,3vw,43px)}.story-choice p{font-size:13px}.story-choice .red-arrow{margin-top:18px}
.desktop-choice{left:8%;top:51%;width:23%;transform:rotate(-5deg)}.monitor-shell{min-height:195px;border-width:15px;box-shadow:inset 0 1px 14px #0009,3px 8px 0 #c4a477,9px 24px 20px #51351e30,0 0 0 1px #fae8d1}
.monitor-shell b{font-size:24px}.monitor-shell small{font-size:12px}.monitor-stand{box-shadow:5px 12px 10px #65442b30}
.touch-note{left:43%;font-size:11px;bottom:6%}
.desktop-section{padding:clamp(75px,10svh,120px) var(--gutter);min-height:95svh;background:radial-gradient(ellipse at 60% 0,#fffdf7,#f2e6d4 75%)}
.desktop-section .section-heading{align-items:flex-end;justify-content:space-between;row-gap:22px}.desktop-section .section-heading h2{font-size:clamp(40px,4.5vw,70px)}.desktop-section .section-heading>p{padding:0 3% 5px 0;color:#766553;font-size:15px}
.features{gap:0 35px;margin:50px 0 40px;counter-reset:feature}.features article{padding:27px 0;grid-template-columns:43px 1fr;gap:8px 15px;position:relative;counter-increment:feature;border-color:#c7ae8b70}.features article:after{content:'0' counter(feature);position:absolute;right:0;top:22px;font-size:10px;color:#a49177}
.feature-icon{font-size:33px;line-height:1.2}.features h3{font-size:21px;font-weight:750}.features p{font-size:13px;line-height:1.9;max-width:90%}.desktop-actions{gap:32px}.desktop-preview-note{font-size:11px;line-height:1.8;max-width:640px}
.story-section{height:210svh;background:#ecdbc4}.story-stage{background:#ecdbc4;isolation:isolate;min-height:680px}
.sketch-frame{inset:-2%;width:104%;height:104%;border-radius:0;transform:none;z-index:-1;overflow:hidden;transform-origin:65% 55%}
.sketch-frame img{inset:0;width:100%;height:100%;object-fit:cover;object-position:center;max-width:100%;filter:none}
.story-copy{left:6%;top:13%;width:31%;max-width:450px}.story-copy h2{font-size:clamp(33px,3.2vw,53px)}.story-copy>p{font-size:17px;line-height:1.8;margin:22px 0}.story-lines{min-height:120px}.story-lines p{font-size:15px;line-height:1.8;margin:10px 0;color:#7c624b}.story-copy>small{font-size:11px}.making-caption{left:6%;bottom:5%;font-size:13px;background:#f4e7d3c9;padding:12px 17px;border-left:2px solid #d5261d}.making-caption span{font-size:11px}
.presale{padding-top:95px;padding-bottom:35px;background:#fffefa}.presale .section-heading h2{font-size:clamp(36px,3.6vw,59px)}
.presale-grid{min-height:620px;grid-template-columns:27% 44% 29%;margin-top:15px}.product-stage{height:650px}.product-momo{top:-4%;filter:drop-shadow(4px 11px 5px #38251016)}
.product-hat{width:38%;right:-4%;top:3%;transform:rotate(9deg);filter:drop-shadow(6px 11px 6px #38251014)}.product-socks{width:36%;left:-5%;top:37%;transform:rotate(-7deg);filter:drop-shadow(5px 11px 7px #38251018)}.product-pearl{width:12%;bottom:6%;right:6%;filter:drop-shadow(3px 8px 4px #38251020)}
.presale-right{padding-left:36px}.presale-right h3{font-size:22px;line-height:1.4}.presale-right p{font-size:14px;line-height:1.9}.price{letter-spacing:-.09em}.progress-block{margin-top:26px}.progress-block small{line-height:1.7}.presale-footer{padding:24px 0;gap:22px}.presale-footer>div{line-height:1.8}
.finale{height:330svh;background:#fffefa}.finale-stage{background:radial-gradient(ellipse at 55% 35%,#fff,#faf9f5);min-height:650px}
.carry-basket{width:76%;right:-2%;bottom:-7%;transform-origin:55% 55%}.carry-message{top:25%;left:6%}.carry-message h2{font-size:clamp(46px,5vw,79px)}.carry-message p{font-size:15px}
.invitation-scene{grid-template-columns:29% 52% 19%;padding:65px 5% 35px}.invite-window{border-radius:20px;box-shadow:0 3px 5px #35291b08,0 15px 26px #35291b15;border-color:#cccac5}
.invite-header{border-radius:20px 20px 0 0;padding:22px 18px;background:linear-gradient(#f6f6f5,#ebebea)}.invite-header h3{font-size:25px}.invite-header p{font-size:14px}.invite-body{padding:0 22px 24px}.invite-props{height:180px}.invite-body h3{font-size:32px}.invite-goal{font-size:19px}.invite-goal em{font-size:40px}.invite-body>strong{font-size:20px}.invite-body>p:not(.invite-goal){font-size:15px}.invite-footer{border-radius:0 0 20px 20px;padding:19px 55px;background:linear-gradient(#f3f3f2,#e8e8e7)}.invite-footer strong{font-size:28px}.invite-footer small{font-size:12px}.click-hand{width:60px;height:75px;bottom:10px;right:4%;animation:none}
.peek-momo{width:25%;right:-1%;bottom:0}.invitation-side h2{font-size:clamp(35px,4.1vw,64px)}.invitation-side p{font-size:14px;line-height:1.9}
.site-footer{background:#faf9f5;padding-top:24px;padding-bottom:24px;border-color:#dedbd4}
@media(max-width:1000px) and (min-width:701px){.outfit-assembly{width:min(62svh,55vw)}.meeting-character{left:31%;width:43%}.story-choice{right:4%;width:26%;padding:22px}.desktop-choice{left:5%;width:24%}.monitor-shell{min-height:170px}.product-stage{height:530px}.presale-right{padding-left:14px}.presale-right h3{font-size:18px}.presale-right p{font-size:12px}.story-copy{width:32%}.story-copy h2{font-size:32px}.story-copy>p{font-size:15px}.invite-props{height:140px}.invite-header h3{font-size:21px}.invite-body h3{font-size:26px}.invite-body>strong{font-size:17px}.invite-footer strong{font-size:24px}.invitation-side h2{font-size:34px}}
@media(max-width:700px){
 .opening{height:410svh}.opening-stage{min-height:570px}.hero-title{left:9%;top:26%;width:85%}.hero-title h1{font-size:24vw;letter-spacing:-.07em}.hero-title h1 span+span{font-size:.53em}.hero-title p{font-size:25px;margin-top:.7em}.intro-sock{width:51%;left:-13%;bottom:-2%}.intro-pearl{width:18%;right:10%;top:17%}.intro-hehe{width:23%;right:-2%;bottom:31%}.intro-doodle{width:17%;left:4%;bottom:29%}.scroll-invitation{bottom:7%;left:10%;right:10%;gap:11px}.scroll-invitation strong{font-size:17px}.scroll-invitation span{font-size:13px}
 .outfit-assembly{width:min(92vw,calc((100svh - 220px)*.666667));top:max(110px,14svh)}.outfit-heading{left:7%;top:5%;max-width:90%}.outfit-heading h2{font-size:27px}.outfit-heading h2 br{display:none}.outfit-heading small{font-size:10px;margin-bottom:8px}.outfit-steps{bottom:8%;left:9%;right:9%;gap:18px;font-size:10px}.outfit-caption{bottom:3%;font-size:11px}
 .meeting{height:100svh;min-height:760px}.meeting .section-heading{top:8%;left:7%;max-width:90%}.meeting .section-heading h2{font-size:33px}.meeting-character{width:80%;left:20%;top:20%}.story-choice{width:52%;right:6%;top:auto;bottom:6%;padding:22px;z-index:5}.story-choice strong{font-size:25px}.story-choice p{font-size:11px}.story-choice .red-arrow{font-size:29px;margin-top:12px}.desktop-choice{width:36%;left:5%;top:47%}.monitor-shell{min-height:137px;border-width:10px}.monitor-shell b{font-size:16px}.monitor-shell small{font-size:9px;padding:8px 4px}.monitor-shell i{font-size:25px}.monitor-stand{height:21px}.touch-note{left:6%;bottom:5%;width:31%;font-size:10px}
 .desktop-section{padding:65px 23px 50px;min-height:0}.desktop-section .section-heading{row-gap:17px}.desktop-section .section-heading h2{font-size:39px}.desktop-section .section-heading>p{font-size:12px;padding:0}.features{gap:0 22px;margin:32px 0}.features article{padding:21px 0;display:block}.features article:after{top:23px;font-size:9px}.feature-icon{font-size:28px;margin-bottom:13px}.features h3{font-size:17px}.features p{font-size:11px;line-height:1.8;max-width:100%}.desktop-preview-note{font-size:10px}.desktop-actions{gap:15px}
 .story-section{height:180svh}.story-stage{min-height:750px}.sketch-frame{inset:27% -24% -2% -16%;width:140%;height:75%;transform-origin:66% 60%}.sketch-frame img{object-fit:cover;object-position:73% center}.story-copy{top:6%;left:7%;width:85%;max-width:none}.story-copy h2{font-size:33px}.story-copy>p{font-size:14px;margin:16px 0}.story-lines{position:absolute;top:535px;left:0;width:92%;max-width:none;min-height:0;padding:8px 12px;background:#f2e4d2e8;border-left:2px solid #c5231c}.story-lines p{font-size:12px;margin:4px 0;line-height:1.55}.story-lines p br{display:none}.making-caption{display:none}
 .presale{padding-top:62px}.presale .section-heading h2{font-size:31px}.presale-grid{min-height:0;margin-top:10px}.product-stage{height:470px;margin-top:-15px}.product-momo{top:-3%;width:auto}.product-hat{width:31%;right:-1%;top:17%}.product-socks{width:31%;left:0;top:42%}.product-pearl{width:11%;bottom:6%;right:4%}.presale-right{padding:28px 0 0}.presale-right h3{font-size:17px}.presale-right p{font-size:12px}.presale-footer{gap:14px}.price{font-size:70px}.progress-block{margin-top:0}.progress-block small{font-size:10px}.price-block>strong{font-size:12px}
 .finale{height:290svh}.finale-stage{min-height:780px}.carry-message{top:13%;left:7%}.carry-message h2{font-size:42px}.carry-message p{font-size:13px}.carry-basket{width:140%;right:-25%;bottom:9%}.invitation-scene{display:block;padding:35px 6% 20px}.invitation-side{margin-bottom:17px}.invitation-side h2{font-size:28px}.invitation-side p{font-size:12px;margin-top:9px}.invite-window{width:95%}.invite-header{padding:17px 12px}.invite-header h3{font-size:20px}.invite-header p{font-size:12px}.invite-props{height:113px}.invite-body{padding:0 12px 17px}.invite-body h3{font-size:25px}.invite-goal{font-size:17px}.invite-goal em{font-size:34px}.invite-body>strong{font-size:16px}.invite-body>p:not(.invite-goal){font-size:13px}.invite-body>small{font-size:10px;margin-top:13px}.invite-footer{padding:16px 35px}.invite-footer strong{font-size:24px}.invite-footer small{font-size:10px}.click-hand{width:32px;height:40px;bottom:19px;right:0}.peek-momo{width:34%;right:-1%;top:590px;bottom:auto}.site-footer{font-size:10px}
}
@media(max-width:700px) and (max-height:740px){.outfit-heading h2{font-size:24px}.outfit-steps{bottom:7%}.finale-stage{min-height:660px}.invitation-scene{padding-top:22px}.invitation-side h2{font-size:24px}.invitation-side{margin-bottom:10px}.invite-header{padding:12px}.invite-props{height:89px}.invite-body{padding-bottom:12px}.invite-body h3{font-size:23px}.invite-goal em{font-size:29px}.invite-body>strong{font-size:15px}.invite-body>small{margin-top:10px}.invite-footer{padding-top:12px;padding-bottom:12px}.invite-footer strong{font-size:22px}.peek-momo{top:483px}}
@media(prefers-reduced-motion:reduce){.opening{height:auto}.opening-stage{min-height:190svh}.outfit-assembly{top:0}.char-black{opacity:1}.char-white-left,.char-white-right{opacity:0}.product-momo .char-black{opacity:0}.product-momo .char-white-left,.product-momo .char-white-right{opacity:1}.char-hat{opacity:1}.product-momo .char-hat{opacity:0}.story-section,.finale{height:auto}.story-stage,.finale-stage{position:relative}.room-environment{transform:none}.invitation-scene{opacity:1;visibility:visible}.story-copy>*,.story-lines p{opacity:1!important}.outfit-heading{opacity:1!important}}

/* Opaque plush: never tint the character with the room beneath it. */
.outfit-assembly,.meeting-character,.character img{mix-blend-mode:normal}

@media(max-width:700px){
 .story-copy{top:5%;z-index:2}
 .story-copy>p{margin:14px 0}
 .story-lines{position:static;width:100%;padding:0 0 0 12px;margin-top:20px;background:transparent}
 .story-lines p{font-size:12px;line-height:1.7}
 .sketch-frame{inset:39% -18% -3% -14%;width:132%;height:64%;-webkit-mask-image:linear-gradient(transparent,#000 10%);mask-image:linear-gradient(transparent,#000 10%)}
}

/* Curved contours in the original product canvas; no rectangular matte. */
.char-body,.product-momo .char-rig>.char-body{clip-path:url(#momo-body)}
.char-card{clip-path:url(#momo-card)}
.char-grip{clip-path:url(#momo-grip)}
.char-white-left,.char-black.left{clip-path:url(#momo-white-left)}
.char-white-right,.char-black.right{clip-path:url(#momo-white-right)}
.char-bare.left{clip-path:url(#momo-bare-left)}
.char-bare.right{clip-path:url(#momo-bare-right)}


.cap{background-image:url(assets/cap-short-v10.webp);clip-path:url(#momo-cap)}

.hehe{background-size:409.6% 348.299%;background-position:49.0956% 79.178%;aspect-ratio:375/294;clip-path:url(#momo-hehe)}

.peek-portrait{background-image:url(assets/peek-short-v10.webp);background-size:100% 100%;background-position:center;clip-path:url(#momo-peek);transform:rotate(-8deg)}
.peek-momo{height:auto;aspect-ratio:2/3;width:27%;bottom:-12%;right:-3%}
@media(max-width:700px){.peek-momo{width:38%;top:auto;bottom:-3%;right:-2%}}

/* The companion stays attached to the invitation, regardless of screen height. */
.invite-window .peek-momo{width:47%;right:-31%;bottom:-20%;top:auto}
@media(max-width:700px){.invite-window .peek-momo{width:47%;right:-12%;bottom:-41%}}

.carry-basket>img{display:block;width:100%;height:auto}.carry-basket>.carry-details{position:absolute;inset:0;clip-path:url(#momo-carry-details)}

.intro-sock:after{content:"";position:absolute;inset:0;background:url(assets/sock-tag-v10.webp) center/contain no-repeat;clip-path:polygon(80.2% 47.5%,91.8% 51.3%,78.6% 79.4%,67.8% 75.1%)}

.carry-basket{clip-path:url(#momo-carry);width:74%;bottom:1%;right:-1%}
.invite-window .peek-momo{bottom:-34%}
.click-hand{right:20%}
@media(max-width:700px){.carry-basket{width:140%;right:-25%;bottom:9%}.invite-window .peek-momo{bottom:-61%}.click-hand{right:0}}

.carry-basket{bottom:-2.5%;filter:contrast(1.07) brightness(1.04)}
@media(max-width:700px){.carry-basket{bottom:-1%;width:160%;right:-35%}}

@media(max-width:700px) and (prefers-reduced-motion:reduce){.outfit-assembly{top:max(110px,14svh)}}