/* Reusable phone frames. Content remains live, responsive HTML. */
.phone{position:relative;min-width:0;padding:7px;border:2px solid #aaa8b5;border-radius:44px;background:linear-gradient(140deg,#4c495c,#171521 30%,#373441 75%,#656070);box-shadow:0 25px 55px #27134b24,inset 0 0 0 1px #ffffff55;text-align:left;isolation:isolate}
.phone:before,.phone:after{content:"";position:absolute;width:3px;background:#615b70;border-radius:2px;z-index:-1}
.phone:before{left:-4px;top:105px;height:58px}.phone:after{right:-4px;top:145px;height:65px}
.phone-screen{display:flex;flex-direction:column;min-height:100%;height:100%;border-radius:34px;overflow:hidden;background:#faf8ff}
.phone-status{height:40px;min-height:40px;position:relative;display:flex;justify-content:space-between;align-items:center;padding:0 19px;color:#191731;font-size:10px;font-weight:750}
.phone-island{position:absolute;left:50%;top:8px;transform:translateX(-50%);width:70px;height:21px;background:#171521;border-radius:20px}
.phone-island:after{content:"";position:absolute;right:9px;top:7px;width:6px;height:6px;border-radius:50%;background:#28243b;box-shadow:inset 0 0 2px #50517c}
.phone-signals{display:flex;gap:2px;align-items:flex-end;height:10px}.phone-signals i{width:2px;height:4px;border-radius:1px;background:currentColor}.phone-signals i:nth-child(2){height:6px}.phone-signals i:nth-child(3){height:9px}.phone-signals b{display:block;width:15px;height:8px;margin-left:4px;border:1px solid currentColor;border-radius:2px;position:relative}.phone-signals b:before{content:"";position:absolute;inset:1px;background:currentColor;border-radius:1px}.phone-signals b:after{content:"";position:absolute;right:-3px;top:2px;width:1px;height:3px;background:currentColor}
.phone-home{flex-shrink:0;width:90px;height:4px;background:#272338;border-radius:8px;margin:12px auto 8px}
.phone-appbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.phone-appbar img{width:85px;height:auto;display:block}.phone-appbar>span{font-size:9px;color:var(--muted)}
.phone-subtitle{font-size:11px;margin:8px 0 14px}.phone-activity{display:flex;gap:8px;align-items:center;padding:12px 10px;background:#e8f8ee;border-radius:12px;margin-top:18px}.phone-activity .icon{width:28px;height:28px;background:transparent;color:#39896b}.phone-activity strong{font-size:10px}.phone-activity p{font-size:9px;color:#53846f}.phone-appnav{display:flex;justify-content:space-around;gap:7px;padding-top:14px;margin-top:auto;border-top:1px solid var(--line)}.phone-appnav>span{display:grid;justify-items:center;gap:3px;font-size:8px;color:#9892a6}.phone-appnav svg{width:18px;height:18px}.phone-appnav .active{color:var(--purple)}

/* Three app screens in the opening scene. */
.hero-scene{height:620px;max-width:930px;align-items:center;gap:0;margin-top:38px;padding-bottom:30px}
.hero-phone{position:absolute;width:245px;height:485px}
.phone-fairy{left:90px;top:34px;transform:rotate(-9deg);z-index:2}
.phone-superhero{right:90px;top:34px;transform:rotate(9deg);z-index:2}
.phone-overview{position:relative;width:278px;height:575px;z-index:4;transform:translateY(8px)}
.hero-phone .invitation{position:relative;inset:auto;transform:none;width:100%;height:auto;min-height:0;flex:1;margin:0;border:0;border-radius:0;box-shadow:none;overflow:hidden}
.phone-fairy .phone-screen{background:#f3e0ff}.phone-superhero .phone-screen{background:#213e90}.phone-superhero .phone-status{color:#fff}.phone-superhero .phone-home{background:#c0c4e9}
.hero-phone .character{width:190px;height:200px;left:50%;right:auto;top:2px;transform:translateX(-50%);z-index:1}
.hero-phone .invite-copy,.hero-phone.fairy .invite-copy{padding:183px 12px 0;text-align:center}
.hero-phone .mini-brand{display:none}.hero-phone .invite-copy h2{font-size:32px;line-height:1.02;position:relative;z-index:2}.hero-phone .invite-copy h2 br{display:block}.hero-phone .invite-copy p{font-size:12px;margin-top:7px}
.hero-phone .invite-details{margin:14px 15px 0;padding:10px 12px;font-size:9px}.hero-phone .invite-button{margin:10px 15px;font-size:10px;padding:8px}.hero-phone .bunting{left:15px;top:0;font-size:20px}.hero-phone .night-stars{left:15px;top:5px;font-size:19px}
.phone-overview .hero-panel{background:transparent;border:0;border-radius:0;box-shadow:none;transform:none;width:100%;padding:11px 14px 0;flex:1;display:flex;flex-direction:column}
.phone-overview .panel-top{gap:8px}.phone-overview .panel-top strong{font-size:18px!important;line-height:1.15}.phone-overview .panel-top .icon{width:31px;height:31px}.phone-overview .hero-panel>.example{font-size:8px;margin:0 0 9px;text-align:left}.phone-overview .hero-stats{gap:5px}.phone-overview .hero-stats>div{padding:10px 2px}.phone-overview .hero-stats b{font-size:23px}.phone-overview .hero-stats small{font-size:8px}.phone-overview .hero-stats svg{width:17px;height:17px}.phone-overview .tiny-table{font-size:9px;margin-top:17px}.phone-overview .tiny-table>div{padding:8px 3px;gap:3px;grid-template-columns:1.1fr .9fr 1fr}.phone-overview .badge{font-size:8px;padding:2px 5px}
.hero .scene-note{padding-bottom:28px}.hero-scene .c3{left:370px;top:0}.hero-scene .c4{right:370px;top:10px}

/* Organizer screen: portrait layout, with all the same working tabs. */
.organizer{grid-template-columns:1fr 1fr;gap:90px}.organizer-copy>p{max-width:410px}.organizer-phone{width:386px;max-width:100%;justify-self:center;transform:rotate(2deg)}
.organizer-phone .phone-screen{min-height:690px}.phone .dashboard{border:0;border-radius:0;box-shadow:none;background:transparent;padding:8px 17px 15px;flex:1;display:flex;flex-direction:column}
.phone .dash-heading h3{font-size:23px;gap:7px}.phone .dash-heading p{font-size:10px}.phone .dash-heading .example{font-size:9px}.phone .metrics{grid-template-columns:repeat(2,1fr);gap:8px;margin:20px 0 14px}.phone .metrics>div{display:grid;grid-template-columns:25px 1fr;text-align:left;justify-items:start;padding:12px;column-gap:7px;border-radius:13px}.phone .metrics>div>span{grid-row:1/3;align-self:center}.phone .metrics b{font-size:25px;margin:0}.phone .metrics small{font-size:9px;margin:1px 0 0}.phone .dash-tabs button{padding:12px 3px;font-size:11px;min-height:44px}.phone #dash-content{min-height:230px}.phone .dash-bottom{flex-direction:column-reverse;align-items:stretch;gap:10px;margin-top:auto}.phone .dash-bottom .button{font-size:12px;padding:12px;min-height:44px}.phone .dash-bottom>span{text-align:center;font-size:9px}.phone .reminder-preview{font-size:11px;padding:12px}.phone .data-table{font-size:11px}.phone .data-table th{font-size:10px;padding:10px 4px}.phone .data-table td{padding:14px 4px}.phone .menu-summary{padding:17px 4px;gap:17px}.phone .menu-summary>div{font-size:12px}
.attendee-list{display:grid;margin:0;padding:0;list-style:none}.attendee-list li{display:grid;grid-template-columns:32px 1fr auto;gap:9px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.attendee-list img{width:32px;height:32px;border-radius:50%;background:#eae1ff;object-fit:cover}.attendee-list strong{font-size:12px;display:block;line-height:1.3}.attendee-list small{font-size:9px;color:var(--muted);display:block;margin-top:3px}.attendee-list .badge{font-size:9px;padding:3px 7px}.attendee-list .allergy{color:#ab622b}

/* An interactive invitation and its organizer response, each on a phone. */
.demo{grid-template-columns:1.05fr 1fr 1fr;gap:30px}.rsvp-phone,.result-phone{width:100%;max-width:320px;align-self:stretch;justify-self:center}.rsvp-phone .phone-screen,.result-phone .phone-screen{min-height:490px}
.phone .rsvp{border:0;border-radius:0;box-shadow:none;background:transparent;padding:10px 16px 15px;flex:1;display:flex;flex-direction:column}.phone .rsvp-title{display:flex;margin:13px 0 20px;gap:6px}.phone .rsvp-title img{float:none;width:60px;height:75px}.phone .rsvp-title h3{font-size:23px;max-width:none}.phone .rsvp-title p{font-size:10px}.phone .rsvp>label,.phone .rsvp legend{font-size:11px}.phone .rsvp>input{font-size:14px;padding:12px 10px;min-height:44px;margin:7px 0 20px}.phone .meal-choices{flex-wrap:wrap;gap:6px}.phone .meal-choices label{flex:1 1 40%}.phone .meal-choices label:last-child{flex:1 1 100%}.phone .meal-choices span{font-size:12px;padding:11px 4px}.phone .rsvp .button{margin-top:auto;font-size:13px;min-height:44px}.phone .rsvp .example{font-size:9px}.phone .demo-result{border:0;border-radius:0;background:transparent;padding:10px 16px 20px;justify-content:flex-start;flex:1}.phone .demo-result>h3{font-size:23px;margin-top:20px}.phone .demo-counter{padding:20px 0;font-size:12px}.phone .demo-counter b{font-size:40px}.phone .demo-result>.example{font-size:9px}.phone .new-response{margin-top:22px;padding:15px;flex-direction:column;align-items:flex-start;gap:10px;min-height:140px}.phone .new-response p{font-size:12px}.phone .new-response strong{font-size:13px;line-height:1.4;margin-bottom:6px;overflow-wrap:anywhere}.phone .demo-caption{font-size:12px;margin-top:22px}.phone #reset-demo{margin-top:auto;min-height:44px;font-size:12px}

/* Theme previews and the shared gift stay in the same device family. */
.themes{padding:65px 0}.themes-inner{grid-template-columns:1.3fr 1fr 1fr;gap:35px}.theme-phone{width:238px;height:438px;justify-self:center}.theme-phone .theme-card{width:100%;height:auto;flex:1;margin:0;border:0;border-radius:0;box-shadow:none;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;padding:0 14px 22px}.theme-phone .phone-screen{background:#f2dcff}.theme-phone-dark .phone-screen{background:#254391}.theme-phone-dark .phone-status{color:white}.theme-phone-dark .phone-home{background:#a2addf}.theme-phone .theme-card>img{width:215px;height:235px;top:27px;bottom:auto;left:50%;transform:translateX(-50%)}.theme-phone .theme-card>div{margin:0;padding:0;position:relative;background:none;text-align:center}.theme-phone .theme-card h3{font-size:25px}.theme-phone .theme-card p{font-size:11px;display:block;margin:10px 0 0}.theme-label{align-self:center;font-size:10px;position:absolute;top:10px}
.gifts-inner{grid-template-columns:1fr 1.15fr;gap:30px 60px}.gifts-inner>div:first-child{grid-column:1;grid-row:1}.gift-photo{grid-column:2;grid-row:1/3;align-self:center}.gift-photo img{height:auto;aspect-ratio:1/1.03;object-fit:cover}.gift-phone{grid-column:1;grid-row:2;width:285px;justify-self:start;margin:0 0 0 30px;transform:rotate(-3deg)}.gift-phone .phone-screen{min-height:470px}.phone .gift-panel{margin:0;border-radius:0;box-shadow:none;padding:12px 18px 20px;background:transparent;flex:1}.phone .gift-panel h3{display:block;margin:16px 0 20px;font-size:21px;line-height:1.4}.phone .gift-panel h3 em{font-size:30px}.phone .gift-panel .gift-row{display:flex;width:100%;margin:0;font-size:12px;padding:15px 0;gap:10px}.phone .gift-panel .gift-row b{font-size:12px}.phone .gift-panel>small{display:block;font-size:11px;margin-top:16px}.phone .gift-panel .example{font-size:10px}.phone .gift-panel .progress{margin-bottom:13px}

@media(max-width:1000px){.hero-scene{max-width:760px}.phone-fairy{left:30px}.phone-superhero{right:30px}.organizer{gap:40px}.organizer-phone{width:350px}.demo{grid-template-columns:1fr 1fr;max-width:760px;gap:30px}.demo-intro{grid-column:1/-1;max-width:500px}.demo h2{font-size:35px}.themes-inner{grid-template-columns:1fr 1fr;max-width:760px;gap:30px}.themes-inner>div:first-child{grid-column:1/-1;text-align:center}.theme-phone{width:260px;height:455px}.gifts-inner{gap:30px}.gift-phone{margin-left:15px}}
@media(max-width:760px){.hero-scene{height:420px;width:100%;max-width:460px;margin-top:32px;padding:0}.hero-phone{padding:4px;border-width:1px;border-radius:27px;width:174px;height:336px}.hero-phone .phone-screen{border-radius:22px}.hero-phone .phone-status{height:28px;min-height:28px;font-size:7px;padding:0 12px}.hero-phone .phone-island{width:49px;height:15px;top:5px}.hero-phone .phone-island:after{width:4px;height:4px;top:5px;right:7px}.hero-phone .phone-home{height:3px;width:60px;margin:7px auto 6px}.hero-phone .phone-signals{transform:scale(.75);transform-origin:right}.phone-fairy{left:5px;top:32px;transform:rotate(-10deg)}.phone-superhero{right:5px;top:32px;transform:rotate(10deg)}.phone-overview{width:211px;height:400px;transform:translateY(3px)}.hero-phone .character{height:140px;width:140px;top:0}.hero-phone .invite-copy{padding:122px 8px 0}.hero-phone .invite-copy h2{font-size:23px}.hero-phone .invite-copy p{font-size:10px;margin-top:5px}.hero-phone .invite-details{margin:9px 8px 0;padding:7px;font-size:7px}.hero-phone .invite-button{margin:7px 8px;font-size:8px;padding:5px}.hero-phone .bunting,.hero-phone .night-stars{font-size:14px}.phone-overview .hero-panel{padding:8px 10px 0}.hero-phone .phone-appbar{margin-bottom:14px}.hero-phone .phone-appbar img{width:67px}.hero-phone .phone-appbar>span{font-size:7px}.phone-overview .panel-top strong{font-size:14px!important}.phone-overview .panel-top .icon{width:24px;height:24px}.phone-overview .panel-top svg{width:16px;height:16px}.hero-phone .phone-subtitle{font-size:9px;margin:5px 0 9px}.phone-overview .hero-panel>.example{font-size:7px;margin-bottom:7px}.phone-overview .hero-stats>div{padding:7px 1px}.phone-overview .hero-stats b{font-size:19px}.phone-overview .hero-stats svg{width:14px;height:14px}.phone-overview .hero-stats small{font-size:7px}.phone-overview .tiny-table{font-size:7px;margin-top:11px}.phone-overview .tiny-table>div{padding:6px 2px;gap:2px}.phone-overview .tiny-table .badge{font-size:7px;padding:2px 3px}.phone-overview .table-head{font-size:7px}.hero-phone .phone-activity{padding:8px 6px;gap:5px;margin-top:11px}.hero-phone .phone-activity strong{font-size:8px}.hero-phone .phone-activity p{font-size:7px}.hero-phone .phone-activity .icon{width:20px;height:20px}.hero-phone .phone-activity svg{width:18px;height:18px}.hero-phone .phone-appnav{padding-top:9px}.hero-phone .phone-appnav>span{font-size:6px}.hero-phone .phone-appnav svg{width:15px;height:15px}.hero-phone:before{height:30px;top:70px}.hero-phone:after{height:38px;top:95px}.hero-scene .c1{left:15px;top:0}.hero-scene .c2{right:10px;top:0}.hero .scene-note{padding-top:8px;padding-bottom:23px}.organizer{grid-template-columns:1fr;gap:35px}.organizer-phone{transform:none;width:360px}.phone .dashboard{padding:8px 14px 15px}.phone .dash-heading h3{font-size:22px}.phone .metrics b{font-size:24px}.phone .metrics small{font-size:10px}.phone .metrics svg{width:21px;height:21px}.phone .dash-tabs button{font-size:11px}.demo{max-width:700px}.demo-intro p{max-width:450px}.theme-phone{width:225px;height:430px}.themes-inner{gap:25px}.themes-inner>div:first-child{text-align:left}.gifts-inner{grid-template-columns:1fr}.gifts-inner>div:first-child{grid-row:auto;grid-column:1}.gift-photo{grid-column:1;grid-row:auto}.gift-photo img{aspect-ratio:3/2}.gift-phone{grid-column:1;grid-row:auto;justify-self:center;margin:0;width:300px;transform:none}.download h2{font-size:37px}}
@media(max-width:600px){.demo{grid-template-columns:1fr;gap:24px}.rsvp-phone,.result-phone{width:min(100%,320px)}.demo-intro{margin-bottom:8px}.rsvp-phone .phone-screen,.result-phone .phone-screen{min-height:535px}.result-phone .phone-screen{min-height:490px}.phone .rsvp>input{font-size:16px}.theme-phone{width:100%;max-width:210px;height:350px;padding:5px;border-radius:30px;border-width:1px}.theme-phone .phone-screen{border-radius:24px}.theme-phone .phone-status{padding:0 11px;font-size:8px;height:29px;min-height:29px}.theme-phone .phone-island{width:48px;height:16px;top:6px}.theme-phone .phone-island:after{top:5px;width:5px;height:5px;right:7px}.theme-phone .phone-signals{transform:scale(.75);transform-origin:right}.themes-inner{gap:17px}.theme-phone .theme-card{padding:0 5px 18px}.theme-phone .theme-card>img{width:165px;height:185px;top:25px}.theme-phone .theme-card h3{font-size:20px}.theme-phone .theme-card p{font-size:9px}.theme-phone .theme-label{font-size:9px}.theme-phone .phone-home{width:60px;height:3px;margin-top:7px}.theme-phone:before{top:75px;height:30px}.theme-phone:after{top:95px;height:40px}}
@media(max-width:380px){.hero-scene{height:400px}.phone-overview{width:199px;height:385px}.phone-fairy,.phone-superhero{width:150px;height:314px;top:35px}.phone-fairy{left:0}.phone-superhero{right:0}.hero-phone .invite-copy h2{font-size:20px}.hero-phone .character{width:125px;height:133px}.theme-phone{height:315px}.theme-phone .theme-card>img{height:155px;width:145px}.theme-phone .theme-card h3{font-size:17px}.theme-phone .theme-card p{font-size:8px}.phone .dash-heading h3{font-size:20px}.phone .metrics>div{padding:10px 8px}.phone .metrics small{font-size:9px}.phone .dash-tabs button{font-size:10px}.attendee-list li{gap:6px}.attendee-list .badge{font-size:8px}}
@media(max-width:760px){.organizer{grid-template-columns:minmax(0,1fr)}.organizer-phone{width:min(100%,360px)}.hero-scene{height:625px}.phone-fairy,.phone-superhero{width:157px;height:326px;top:10px}.phone-fairy{left:3px;transform:rotate(-6deg)}.phone-superhero{right:3px;transform:rotate(6deg)}.phone-overview{position:absolute;top:auto;bottom:0;width:235px;height:445px;transform:none}.hero-phone .character{width:140px;height:140px}.hero-phone .invite-copy h2{font-size:22px}.phone-overview .hero-stats small{font-size:8px}.phone-overview .tiny-table{font-size:8px}.phone-overview .phone-activity strong{font-size:9px}.phone-overview .phone-activity p{font-size:8px}}

/* Brand signature: official, unmodified wordmark beside the slogan. */
.download>div>.eyebrow{display:block}
.download .brand-slogan{display:inline-flex;justify-content:center;align-items:center;gap:13px;max-width:100%;padding:9px 22px 12px;margin:0 0 25px;border-radius:22px;background:#fffdf8;color:var(--ink);font-size:clamp(32px,3.3vw,44px);box-shadow:0 8px 28px #2c116323;line-height:1.1}
.brand-slogan>span{flex-shrink:0;white-space:nowrap;letter-spacing:-.04em;padding-top:7px}
.brand-slogan>img{display:block;width:clamp(145px,15vw,210px);height:auto;max-width:57%;min-width:0;object-fit:contain}
@media(max-width:760px){.download .brand-slogan{font-size:30px;padding:8px 14px 11px;gap:10px;border-radius:17px;margin-bottom:22px}.brand-slogan>img{width:150px}.brand-slogan>span{padding-top:5px}}
@media(max-width:380px){.download .brand-slogan{font-size:27px;padding:8px 12px 10px;gap:8px}.brand-slogan>img{width:136px}}
@media(max-width:380px){.stores{flex-wrap:wrap}.download .store{min-width:0;width:135px}.demo,.gifts-inner{grid-template-columns:minmax(0,1fr)}.gift-phone{width:min(100%,300px)}.nav{gap:8px}}
