/* Revision 03: supporting logos, expressive graphic scenes. */
.top{padding:10px 0;gap:18px}.brand{display:flex;align-items:center;gap:14px;flex-shrink:0}.brand>img{display:block;width:84px;height:84px;object-fit:contain;background:none;padding:0}.brand small{margin:0;font-size:11px;line-height:1.5;letter-spacing:1.4px}.stage{min-height:740px}
.origin .art{background:none;border:0;transform:none;width:35%;height:65%;top:12%;right:3%}.ann-photo{position:absolute;inset:0;background:#5e2c57;border:1px solid #e593b4;box-shadow:17px 17px 0 #cf276a;overflow:hidden}.ann-photo>span{font:clamp(120px,15vw,240px)/1 Impact,sans-serif;position:absolute;top:0;left:0;color:#ffbf5555}.ann-photo .portrait-placeholder{border:none;inset:20% 8% 10%;font-size:clamp(28px,3vw,48px);text-align:left;justify-content:flex-start;font-style:italic}.ann-photo small{position:absolute;bottom:17px;left:20px;font-size:10px;letter-spacing:1px}.origin .art .label{bottom:-42px;right:0}
.sound .title{font-size:clamp(60px,5.8vw,100px);max-width:59%}.sound .art{top:7%;right:-1%;width:44%;height:80%}.sound-orbit{position:absolute;inset:4% -7% 5% 0;border:1px solid #de759660;border-radius:50%;transform:rotate(-20deg)}.sound .disc{width:68%;right:0;top:4%;box-shadow:12px 16px 0 #120c1960}.sound .disc:after{content:'FIND YOUR SOUND';background:#ed893a;inset:35%;font-size:8px;font-weight:700;color:#211229}.sound-word{position:absolute;left:0;top:3%;font:clamp(45px,5.4vw,83px)/.9 Impact,sans-serif;color:#f8efdf;transform:rotate(-8deg);z-index:2}.sound-word em{font:italic .58em Georgia,serif;color:var(--gold);white-space:nowrap}.mixing-desk{position:absolute;left:4%;top:35%;width:85%;height:42%;background:#361f44;border:2px solid #d789ae;transform:rotate(-8deg);box-shadow:13px 17px 0 #120c19;z-index:2;padding:18px}.desk-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#f3d6e6;border-bottom:1px solid #81536e;padding-bottom:13px}.desk-top b{color:#ffbe55}.channels{height:80%;display:flex;gap:12px;padding-top:17px}.channel{flex:1;position:relative;text-align:center}.channel b{display:block;width:17px;height:17px;border-radius:50%;background:#ed893a;margin:auto}.channel span{position:absolute;top:25%;bottom:12%;width:3px;background:#130c1a;left:50%}.channel span:after{content:'';position:absolute;top:var(--pos);left:-9px;width:20px;height:9px;background:#f6e8d0;border:1px solid #6b4057}.channel i{position:absolute;width:13px;height:5px;background:#cc487c;bottom:0;left:calc(50% - 6px)}.sound .wave{bottom:10%;height:50px;left:0;right:0;transform:none;opacity:.4}.sp-signature{position:absolute;left:0;bottom:1%;width:230px;height:126px;background:#faf4eb;overflow:hidden;z-index:3;border-bottom:3px solid #ed893a}.sp-signature img{position:absolute;width:230px;height:230px;max-width:none;top:-48px;left:0}.sound .art .label{bottom:0;right:-1%;font-size:8px;max-width:160px;text-align:center;line-height:1.7}
.community .title{font-size:clamp(64px,6.8vw,115px);max-width:55%}.community .body{max-width:43%}.community .art{top:6%;right:-1%;width:49%;height:83%;background:none;border:0;border-radius:0;transform:none;overflow:visible}.community .art:before{display:none}.carnival-orbit{position:absolute;width:85%;aspect-ratio:1;border-radius:50%;top:10%;left:9%;background:#e17c35;box-shadow:0 0 0 15px #cf276a,0 0 0 16px #f8efdf55}.party-line{position:absolute;inset:0 -4% auto;height:65px;border-bottom:2px solid #ffbe55;border-radius:0 0 50% 50%;transform:rotate(8deg)}.party-line:after{content:'✦      ✦      ✦      ✦';position:absolute;top:42px;width:100%;text-align:center;color:#ffbe55;font-size:28px;letter-spacing:12px}.party-word{position:absolute;left:10%;top:15%;font:clamp(45px,5.7vw,92px)/.93 Impact,sans-serif;color:#fff1db;transform:rotate(-7deg);z-index:2}.party-word em{font:italic .59em Georgia,serif;color:#fff1db}.toys-logo{position:absolute;width:41%;height:auto;object-fit:contain;right:1%;top:7%;z-index:4;filter:drop-shadow(0 5px 8px #29162966)}.gift{position:absolute;bottom:7%;width:27%;height:27%;background:#b42464;z-index:3;box-shadow:9px 10px 0 #28172850;transform:rotate(-13deg)}.gift:before{content:'';position:absolute;width:110%;height:16%;left:-5%;top:0;background:#e54088}.gift:after{content:'';position:absolute;width:18%;height:100%;left:42%;top:0;background:#ffbf55}.gift i{position:absolute;width:55%;height:24%;left:25%;top:-23%;border:5px solid #ffbf55;border-radius:60% 10% 60% 10%}.gift-one{left:7%}.gift-two{left:39%;bottom:5%;height:36%;background:#713c93;transform:rotate(8deg)}.gift-two:before{background:#9c5caf}.gift-three{right:0;bottom:8%;height:21%;background:#e69439;transform:rotate(-4deg)}.gift-three:before{background:#ffbf55}.gift-three:after{background:#c12870}.event-ticket{position:absolute;right:0;top:48%;padding:13px 20px;background:var(--paper);color:#31152a;display:flex;gap:16px;align-items:center;transform:rotate(7deg);z-index:5;box-shadow:7px 7px 0 #31152a33}.event-ticket strong{font:34px/.9 Impact,sans-serif;border-right:1px dashed #31152a;padding-right:15px}.event-ticket span{font-size:9px;line-height:1.7;letter-spacing:1px}
.support .title{font-size:clamp(62px,7.2vw,120px);max-width:78%}.support .art{opacity:.8;right:-4%;top:20%;width:34%;height:62%}.logo-footer{padding:25px 4vw;background:#211229;color:var(--paper);display:flex;align-items:center;gap:25px;border-top:1px solid #ffffff35}.logo-footer img{width:86px;height:auto;display:block}.logo-footer p{font-size:13px;line-height:1.7;margin:0}.logo-footer small{display:block;color:#d2abc5;font-size:11px}
@media(min-width:761px) and (max-width:1050px){.sound .title{font-size:64px}.community .body{max-width:47%}.sound .art{width:40%}.sp-signature{width:190px;height:104px}.sp-signature img{width:190px;height:190px;top:-40px}.sound .art .label{display:none}.event-ticket{padding:10px;gap:8px}.party-word{font-size:58px}}
@media(max-width:760px){.brand>img{width:68px;height:68px}.brand small{display:none}.top>span{font-size:10px;letter-spacing:1px}.motion-toggle{font-size:10px}.stage,.all .scene{min-height:1110px}.sound .title,.community .title,.support .title{font-size:clamp(54px,12.6vw,94px);max-width:100%}.community .body{max-width:100%}.origin .art{top:590px;right:8%;width:80%;height:350px;max-width:380px}.sound .art{top:585px;right:4%;width:90%;height:380px;max-width:440px}.sound-word{font-size:58px}.sound .disc{width:65%}.mixing-desk{height:42%;padding:12px}.channels{gap:9px}.sp-signature{width:170px;height:94px;bottom:-4%}.sp-signature img{width:170px;height:170px;top:-35px}.sound .art .label{bottom:-2%;max-width:135px}.community .art{top:600px;right:3%;width:94%;height:370px;max-width:440px}.party-word{font-size:58px}.party-line:after{font-size:20px;letter-spacing:8px}.event-ticket{padding:9px 12px;gap:9px}.event-ticket strong{font-size:28px}.event-ticket span{font-size:8px}.support .art{top:600px;right:8%;width:70%;height:340px}.logo-footer{gap:18px}.logo-footer img{width:70px}.logo-footer p{font-size:11px}.caption{bottom:15px}.ann-photo>span{font-size:150px}.ann-photo .portrait-placeholder{font-size:36px}}



/* Five requested refinements from the accepted rollback baseline. */
.community .give-word{color:#fff}
.community .event-ticket{top:55%}
.community .toys-title{color:#ffbe55}
.community .nawf-title{color:#ef88b5}
/* The parent sets the stacking context: lift the lettering above the gifts. */
.community .party-word{z-index:4}
.community-note{position:relative;margin:0;padding:16px 20px;background:#211229;color:#f8efdf;border-top:1px solid #b88ea9;font-size:13px;line-height:1.6;text-align:left}
.community-note[hidden]{display:none}
/* Scoped adjustment: darker GATHER and inset date card to prevent clipping. */
.community .gather-word{color:#512044}
.community .event-ticket{right:7%;max-width:86%;box-sizing:border-box}
/* Invitation record: slow continuous rotation; honor both motion controls. */
@keyframes invitation-record-spin{from{transform:rotate(-14deg)}to{transform:rotate(346deg)}}
.hero.active .disc{animation:invitation-record-spin 24s linear infinite}
.all .hero .disc{animation:invitation-record-spin 24s linear infinite}
body.still .hero .disc{animation:none}
@media(prefers-reduced-motion:reduce){.hero.active .disc,.all .hero .disc{animation:none}}
/* Music scene: independently paced mixing-desk faders. */
@keyframes music-fader-travel{0%,100%{top:var(--pos)}30%{top:10%}65%{top:78%}}
.sound.active .channel span:after,.all .sound .channel span:after{animation:music-fader-travel var(--fader-speed,4s) ease-in-out var(--fader-delay,0s) infinite}
.channel:nth-child(1){--fader-speed:4.3s;--fader-delay:-1.1s}
.channel:nth-child(2){--fader-speed:3.7s;--fader-delay:-2.4s}
.channel:nth-child(3){--fader-speed:5.1s;--fader-delay:-.7s}
.channel:nth-child(4){--fader-speed:4.6s;--fader-delay:-3.2s}
.channel:nth-child(5){--fader-speed:3.9s;--fader-delay:-1.8s}
.channel:nth-child(6){--fader-speed:5.4s;--fader-delay:-4.1s}
.channel:nth-child(7){--fader-speed:4.8s;--fader-delay:-2.7s}
body.still .channel span:after{animation:none!important}
@media(prefers-reduced-motion:reduce){.sound.active .channel span:after,.all .sound .channel span:after{animation:none!important}}
/* Support scene: quiet movement in the artwork, with the copy kept still. */
@keyframes support-frame-sway{0%,100%{transform:translateY(0) rotate(9deg)}50%{transform:translateY(-12px) rotate(6deg)}}
@keyframes support-star-turn{from{transform:rotate(14deg)}to{transform:rotate(374deg)}}
.support.active .frame,.all .support .frame{animation:support-frame-sway 7s ease-in-out infinite}
.support.active .asterisk,.all .support .asterisk{animation:support-star-turn 32s linear infinite}
body.still .support .frame,body.still .support .asterisk{animation:none!important}
@media(prefers-reduced-motion:reduce){.support.active .frame,.all .support .frame,.support.active .asterisk,.all .support .asterisk{animation:none!important}}
/* Idea flies in, an arrow follows, then Possibility materializes letter by letter. */
.frame{container-type:inline-size}
.frame:after{content:none}
.idea-sequence{position:absolute;bottom:10%;left:8%;width:88%;z-index:2;font:900 clamp(15px,10cqw,40px)/1.15 Arial,sans-serif}
.idea-line{display:flex;align-items:center;gap:.55em;margin-bottom:.18em}
.idea-word{display:inline-block;color:#552274}
.idea-arrow{display:inline-block;color:#211229;font-size:1.5em;-webkit-text-stroke:1.2px currentColor}
.possibility-word{display:block;white-space:nowrap;color:#941747}
.possibility-word>span{display:inline-block}
@keyframes idea-fly-in{from{opacity:0;transform:translate(-70px,-15px) rotate(-12deg)}70%{opacity:1;transform:translate(4px,0) rotate(2deg)}to{opacity:1;transform:none}}
@keyframes idea-arrow-appear{from{opacity:0;transform:scaleX(.25);transform-origin:left}to{opacity:1;transform:scaleX(1);transform-origin:left}}
@keyframes possibility-fizzle-in{0%{opacity:0;transform:translateY(6px) scale(.94)}35%{opacity:.25;transform:translateY(-2px) scale(1.02)}65%{opacity:.7;transform:translateY(1px) scale(.99)}100%{opacity:1;transform:none}}
.scene.active .idea-word,.all .idea-word{animation:idea-fly-in .8s cubic-bezier(.2,.7,.25,1) .15s both}
.scene.active .idea-arrow,.all .idea-arrow{animation:idea-arrow-appear .4s ease-out 1s both}
.scene.active .possibility-word>span,.all .possibility-word>span{animation:possibility-fizzle-in 1.1s ease-out calc(1.5s + var(--letter)*.065s) both}
body.still .idea-word,body.still .idea-arrow,body.still .possibility-word>span{animation:none!important;opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.scene.active .idea-word,.all .idea-word,.scene.active .idea-arrow,.all .idea-arrow,.scene.active .possibility-word>span,.all .possibility-word>span{animation:none!important;opacity:1;transform:none}}
/* Keep the animated label and its frame in front of the record. */
.hero .frame,.support .frame{z-index:2}
/* Invitation: foreground record at the visitor's right screen edge. */
.stage:has(.hero.active){overflow:visible;clip-path:inset(0 -4vw)}
.hero .art{container-type:size}
.hero .disc{top:10%;left:calc(65% - min(35%,170px,27cqh));right:auto;width:min(70%,340px,54cqh);z-index:3;box-shadow:none}
.stage:hover .hero .art{transform:none}
/* Support artwork: keep the record and the entire caption inside the scene. */
.support .art{right:3%;container-type:size;opacity:1}
.support .disc{top:8%;right:-6%;width:min(72%,66cqh);z-index:3;box-shadow:none}
.support.active .disc,.all .support .disc{animation:invitation-record-spin 24s linear infinite}
.support .art .label{right:5%;bottom:7%;width:90%;max-width:420px;line-height:1.6;text-align:center;white-space:normal;transform:rotate(-6deg);z-index:5}
.support .asterisk{right:0;top:-15%;font-size:clamp(70px,8vw,130px);z-index:4}
body.still .support .disc{animation:none}
@media(prefers-reduced-motion:reduce){.support.active .disc,.all .support .disc{animation:none}}
@media(max-width:760px){.support .art{right:8%}}