:root{
  --navy:#18203b;--ink:#26304e;--muted:#69708a;--line:#e7e8f2;--paper:#fffdfb;
  --aqua:#1fc8d4;--aqua2:#dff9fb;--pink:#ff5ea8;--pink2:#fff0f7;--yellow:#ffd84f;
  --purple:#8b5cf6;--purple2:#f1ebff;--coral:#ff7b5c;--green:#64d39a;--blue:#5aa7ff;
  --shadow:0 18px 50px rgba(39,48,78,.12)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--paper)}a{color:inherit;text-decoration:none}h1,h2,h3{font-family:'Baloo 2',sans-serif;margin:.2em 0 .35em;line-height:1.04}p{line-height:1.65;color:var(--muted)}button,input,textarea,select{font:inherit}.small{font-size:.82rem}.muted-note{color:var(--muted)}
.site-header{height:86px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(255,253,251,.95);position:sticky;top:0;z-index:50;backdrop-filter:blur(14px)}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--yellow),var(--pink));display:grid;place-items:center;color:white;font-size:1.2rem;transform:rotate(-4deg)}.brand strong,.brand small{display:block}.brand strong{font-family:'Baloo 2';font-size:1.3rem;line-height:1}.brand small{font-size:.69rem;color:var(--muted);margin-top:2px}.site-header nav{display:flex;align-items:center;gap:23px;font-size:.86rem;font-weight:700}.nav-cta{background:var(--navy);color:white;padding:11px 17px;border-radius:999px}.eyebrow,.step-kicker{text-transform:uppercase;letter-spacing:.13em;font-weight:800;font-size:.72rem;color:var(--pink)}
.hero{max-width:1240px;margin:0 auto;padding:82px 28px;display:grid;grid-template-columns:1.03fr .97fr;gap:64px;align-items:center}.bright-hero{position:relative}.bright-hero:before{content:"";position:absolute;width:260px;height:260px;background:var(--aqua2);border-radius:50%;left:-170px;top:40px;z-index:-1}.hero h1{font-size:clamp(3.6rem,6.5vw,6rem);letter-spacing:-.035em}.hero h1 em{font-style:normal;color:var(--pink)}.hero-lede{font-size:1.15rem;max-width:680px}.hero-actions{display:flex;align-items:center;gap:20px;margin-top:30px;flex-wrap:wrap}.text-link{font-weight:800;color:var(--purple)}.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:999px;padding:13px 20px;font-weight:800;cursor:pointer;transition:.18s}.btn:hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg,var(--pink),var(--purple));color:white;box-shadow:0 10px 25px rgba(139,92,246,.22)}.btn.ghost{background:white;border:1px solid var(--line)}.btn.accent{background:var(--yellow);color:var(--navy)}.btn.mini{padding:.55rem .8rem;border:1px solid var(--line);background:white;font-size:.78rem}.btn:disabled{opacity:.55;cursor:wait;transform:none}.mini-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.mini-badges span{background:white;border:1px solid var(--line);padding:8px 11px;border-radius:999px;font-size:.75rem;font-weight:700}.hero-card{min-height:450px;border-radius:38px;background:linear-gradient(145deg,#7fe7ee 0%,#a99bff 45%,#ff92c7 100%);position:relative;padding:42px;box-shadow:var(--shadow);overflow:hidden}.storybook{background:#fff;border-radius:28px;padding:35px;position:absolute;inset:54px 42px;transform:rotate(1.3deg);box-shadow:0 15px 40px rgba(28,34,57,.16)}.book-top{text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;color:var(--purple);font-weight:800}.character-bubbles{display:flex;gap:14px;margin:48px 0 32px}.character-bubbles span{width:78px;height:78px;border-radius:22px;display:grid;place-items:center;font-size:2.5rem;background:#f6f3ff;border:2px solid white;box-shadow:0 7px 18px rgba(38,48,78,.1)}.audio-pill{background:var(--navy);color:white;border-radius:17px;padding:16px;font-size:.84rem}.story-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.story-tags span{background:var(--yellow);border-radius:999px;padding:5px 9px;font-size:.69rem;font-weight:800}.confetti{position:absolute;color:white;font-size:1.8rem}.c1{top:18px;right:34px}.c2{bottom:28px;left:26px;color:var(--yellow)}.c3{top:150px;left:18px}.c4{bottom:30px;right:24px;color:#fff}
.choice-section,.how-it-works{max-width:1180px;margin:0 auto;padding:78px 24px}.section-heading{max-width:780px;margin-bottom:35px}.section-heading h2{font-size:clamp(2.5rem,4.4vw,4rem)}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.choice-card{background:white;border:2px solid var(--line);border-radius:28px;padding:34px;box-shadow:0 10px 35px rgba(39,48,78,.06);transition:.2s}.choice-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--aqua)}.choice-card.featured{border-color:#c8b8ff;background:linear-gradient(180deg,#fff,#f8f5ff)}.choice-icon{font-size:2.5rem}.choice-card h3{font-size:1.8rem}.choice-card span{color:var(--purple);font-weight:800}.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step{padding:24px;border:1px solid var(--line);border-radius:22px;background:white}.step b{display:grid;place-items:center;width:38px;height:38px;border-radius:14px;background:var(--aqua2);color:#0c98a3;margin-bottom:18px}.promise-band{background:var(--navy);color:white;display:grid;grid-template-columns:repeat(3,1fr)}.promise-band>div{padding:36px clamp(24px,5vw,65px);border-right:1px solid rgba(255,255,255,.12)}.promise-band strong,.promise-band span{display:block}.promise-band span{color:#d8ddef;font-size:.9rem;margin-top:.5rem}.site-footer{padding:40px clamp(24px,5vw,70px);display:flex;justify-content:space-between;gap:30px;border-top:1px solid var(--line)}
.page-hero{max-width:1000px;margin:0 auto;padding:80px 24px 44px;text-align:center}.page-hero h1{font-size:clamp(3rem,6vw,5.3rem)}.page-hero p{max-width:700px;margin:0 auto;font-size:1.08rem}.colorful-page{position:relative}.colorful-page:after{content:"";display:block;width:110px;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--aqua),var(--yellow),var(--pink),var(--purple));margin:28px auto 0}.examples-grid-wrap,.faq-wrap{max-width:1100px;margin:0 auto;padding:20px 24px 90px}.examples-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.sample-card{background:white;border:1px solid var(--line);border-radius:26px;padding:28px;box-shadow:0 10px 30px rgba(39,48,78,.06)}.sample-emoji{font-size:3.2rem}.sample-card audio{width:100%;margin-top:10px}.sample-placeholder{border:1px dashed #c9cce0;background:#f8f8fc;border-radius:14px;padding:16px;color:var(--muted);font-size:.83rem;margin-top:18px}.center-cta{text-align:center;margin-top:42px}.faq-wrap{max-width:880px}.faq-item{background:white;border:1px solid var(--line);border-radius:18px;margin:12px 0;padding:0 20px}.faq-item summary{cursor:pointer;font-family:'Baloo 2';font-size:1.25rem;font-weight:700;padding:20px 0}.faq-item p{padding:0 0 20px;margin:0}
.builder-shell{min-height:calc(100vh - 86px);display:grid;grid-template-columns:365px 1fr}.builder-aside{background:linear-gradient(165deg,var(--navy),#2c3468);color:white;padding:64px 42px;position:sticky;top:86px;height:calc(100vh - 86px);overflow:hidden}.builder-aside:after{content:"★";position:absolute;right:-15px;bottom:-40px;font-size:12rem;color:rgba(255,216,79,.08);transform:rotate(-15deg)}.builder-aside h1{font-size:3rem}.builder-aside p,.builder-aside .small{color:#d6dcef}.progress{height:8px;border-radius:99px;background:rgba(255,255,255,.14);margin:35px 0 10px;overflow:hidden}.progress div{height:100%;background:linear-gradient(90deg,var(--aqua),var(--yellow),var(--pink));transition:.3s}.builder-panel{padding:65px clamp(28px,8vw,120px);max-width:1080px}.builder-step{display:none;animation:fade .25s ease}.builder-step.active{display:block}@keyframes fade{from{opacity:.2;transform:translateY(5px)}to{opacity:1;transform:none}}.builder-step h2{font-size:clamp(2.5rem,4.7vw,4.2rem);max-width:800px}.choice-note{font-weight:600}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:35px}.mode-card,.visual-options button,.pill-options button{cursor:pointer}.mode-card{border:2px solid var(--line);border-radius:26px;background:white;text-align:left;padding:30px;min-height:220px}.mode-card:hover{border-color:var(--aqua);box-shadow:var(--shadow)}.mode-card strong,.mode-card small{display:block}.mode-card strong{font-family:'Baloo 2';font-size:1.75rem}.mode-card small{font-size:.95rem;line-height:1.5;margin-top:10px;color:var(--muted)}.mode-emoji{font-size:2.7rem;display:block;margin-bottom:24px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}.form-grid .full{grid-column:1/-1}label{font-size:.83rem;font-weight:800;color:var(--ink)}input,textarea,select{width:100%;margin-top:8px;border:1.5px solid var(--line);border-radius:14px;padding:14px 15px;background:white;color:var(--ink)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--aqua);box-shadow:0 0 0 3px rgba(31,200,212,.12)}textarea{min-height:105px;resize:vertical}.optional{color:var(--muted);font-weight:500}.helper{font-size:.82rem;background:#eefbfc;border-radius:13px;padding:13px 14px;color:var(--muted);margin-top:20px}.nav-row{display:flex;justify-content:space-between;margin-top:40px}.visual-options{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}.visual-options.compact{grid-template-columns:repeat(3,1fr)}.visual-options button{border:2px solid var(--line);background:white;border-radius:20px;padding:22px 12px;font-size:1.9rem;min-height:130px}.visual-options button span{display:block;font-size:.82rem;font-weight:800;margin-top:12px;color:var(--ink)}.visual-options button:hover{border-color:#b5e9ec}.visual-options button.selected,.pill-options button.selected{border-color:var(--purple);background:var(--purple2);box-shadow:0 0 0 2px rgba(139,92,246,.08)}.subquestion{font-family:'DM Sans';font-size:1rem;margin-top:38px}.pill-options{display:flex;flex-wrap:wrap;gap:10px}.pill-options button{border:2px solid var(--line);background:white;border-radius:999px;padding:11px 16px;font-weight:800}.custom-choice{margin-top:18px;padding:18px;background:linear-gradient(90deg,#fff9df,#fff1f7);border-radius:17px;border:1px solid #f4e7c6}.review-box{background:#f4f1ff;border:1px solid #d9ceff;border-radius:18px;padding:20px;margin:30px 0}.review-box small{display:block;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:var(--purple)}.check-row{display:flex;gap:10px;align-items:flex-start;font-weight:500}.check-row input{width:auto;margin-top:3px}
.confirmation{max-width:700px;margin:90px auto;padding:0 24px;text-align:center}.success-icon{width:70px;height:70px;border-radius:22px;background:var(--green);display:grid;place-items:center;margin:0 auto 24px;font-size:2rem}.timeline{text-align:left;background:white;border:1px solid var(--line);border-radius:22px;padding:20px;margin:35px 0}.timeline>div{display:flex;gap:16px;padding:15px}.timeline b{width:30px;height:30px;border-radius:10px;background:var(--yellow);display:grid;place-items:center;color:var(--navy);flex:none}.timeline strong,.timeline small{display:block}.timeline small{margin-top:3px}.flash-wrap{position:fixed;right:25px;top:100px;z-index:99}.flash{background:var(--navy);color:white;padding:12px 16px;border-radius:12px;margin-bottom:8px;box-shadow:var(--shadow)}
.admin-shell{max-width:1300px;margin:55px auto;padding:0 24px}.admin-top{display:flex;justify-content:space-between;gap:25px;align-items:flex-start;margin-bottom:28px}.admin-top h1{font-size:3.3rem}.admin-list{background:white;border:1px solid var(--line);border-radius:20px;overflow:hidden}.admin-story-row{display:flex;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--line)}.admin-story-row:hover{background:#fbfcff}.admin-story-row strong,.admin-story-row span,.admin-story-row small{display:block}.status{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--purple);font-weight:800}.admin-login{max-width:440px;margin:100px auto}.card{background:white;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:0 8px 30px rgba(39,48,78,.05)}.stack{display:grid;gap:15px}.two-col,.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.wide{margin-top:24px}.sync-card{display:flex;justify-content:space-between;align-items:center;gap:30px}.sync-card p{max-width:760px}.voice-edit-list{display:grid;gap:12px}.voice-edit-row{display:grid;grid-template-columns:1.1fr 1fr 1fr 1.4fr 1fr auto;gap:10px;align-items:end;padding:16px;border:1px solid var(--line);border-radius:16px}.voice-edit-row label{font-size:.72rem}.voice-id-block strong,.voice-id-block small{display:block}.voice-id-block small{word-break:break-all;color:var(--muted);margin-top:4px}.voice-list>div{padding:14px 0;border-bottom:1px solid var(--line)}.voice-list strong,.voice-list span,.voice-list small{display:block}.voice-tags{color:var(--purple);margin-top:4px}.request-list div{display:grid;grid-template-columns:170px 1fr;padding:9px 0;border-bottom:1px solid var(--line)}.request-list dt{font-weight:800}.request-list dd{margin:0;color:var(--muted)}.section-row{display:flex;justify-content:space-between;align-items:flex-start}.cast-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.cast-card{border:1px solid var(--line);border-radius:17px;padding:18px}.cast-card>div:first-child{display:flex;justify-content:space-between}.cast-card>div:first-child span{font-size:.7rem;text-transform:uppercase;color:var(--purple);font-weight:800}.assigned{background:#e8fbf1;padding:10px;border-radius:10px;font-size:.83rem}.inline-form{display:flex;gap:8px;margin-top:12px}.inline-form select{margin:0}.voice-prompt{background:#f6f4fb;border-radius:10px;padding:10px;margin:12px 0;font-size:.82rem}.voice-prompt small{display:block;font-weight:800;margin-bottom:4px}.preview-row{display:flex;align-items:center;gap:10px;margin-top:10px}.preview-row audio{height:32px;width:220px}.selected-pill{background:#e8fbf1;border-radius:99px;padding:5px 8px;font-size:.72rem}.production-action{margin-top:25px}.audio-player{width:100%;margin-top:10px}.script-view{max-height:600px;overflow:auto;border-top:1px solid var(--line)}.script-view div{display:grid;grid-template-columns:120px 1fr;border-bottom:1px solid var(--line);padding:10px 0}.script-view b{text-transform:uppercase;font-size:.72rem;color:var(--purple)}.script-view p{margin:0}.approve-box{display:flex;justify-content:space-between;align-items:center}.empty{padding:40px;text-align:center;color:var(--muted)}
.loading-overlay{display:none;position:fixed;inset:0;background:rgba(24,32,59,.65);z-index:999;align-items:center;justify-content:center;padding:24px}.loading-overlay.show{display:flex}.loading-card{background:white;border-radius:26px;padding:36px;max-width:480px;text-align:center;box-shadow:var(--shadow)}.spinner{width:54px;height:54px;border:6px solid #eee;border-top-color:var(--purple);border-radius:50%;margin:0 auto 20px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1100px){.voice-edit-row{grid-template-columns:1fr 1fr}.voice-id-block{grid-column:1/-1}}@media(max-width:920px){.site-header nav>a:not(.nav-cta){display:none}.hero{grid-template-columns:1fr}.hero-card{min-height:340px}.choice-grid,.steps-grid,.promise-band,.two-col,.admin-grid,.cast-grid,.examples-grid{grid-template-columns:1fr}.builder-shell{grid-template-columns:1fr}.builder-aside{position:relative;top:0;height:auto;padding:30px 24px}.builder-aside h1{font-size:2.2rem}.builder-panel{padding:42px 24px}.visual-options{grid-template-columns:repeat(2,1fr)}.visual-options.compact{grid-template-columns:repeat(2,1fr)}.site-footer{flex-direction:column}.promise-band>div{border-bottom:1px solid rgba(255,255,255,.12)}.admin-top,.sync-card{flex-direction:column;align-items:flex-start}}@media(max-width:560px){.site-header{height:74px}.brand small{display:none}.hero{padding-top:50px}.hero h1{font-size:3.3rem}.mode-grid,.form-grid{grid-template-columns:1fr}.visual-options,.visual-options.compact{grid-template-columns:1fr 1fr}.builder-step h2{font-size:2.45rem}.request-list div,.script-view div{grid-template-columns:1fr}.admin-story-row{flex-direction:column;gap:12px}.storybook{inset:40px 22px}.site-header{padding:0 16px}}
.guided-choice{background:linear-gradient(135deg,#eefbfc,#f6f0ff);border-color:#d5edf0}.custom-choice-title{font-family:'Baloo 2';font-weight:800;font-size:1.15rem;color:var(--ink)}.field-hint{font-size:.8rem;color:var(--muted);margin:6px 0 0;line-height:1.5}.compact-form{margin-top:16px}.people-pets-list{display:grid;gap:14px;margin:16px 0}.person-pet-card{background:white;border:1.5px solid var(--line);border-radius:16px;padding:16px}.person-card-top{display:flex;align-items:center;justify-content:space-between}.remove-person{border:0;background:#fff0f4;color:#d84e73;width:30px;height:30px;border-radius:999px;font-size:1.25rem;cursor:pointer}.small-btn{padding:9px 14px;font-size:.82rem}

.audio-actions,.review-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.audio-actions p{margin:0}.review-actions form{margin:0}
.cast-tools,.production-actions,.admin-search{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.cast-tools form{margin:0}.voice-mini-player{width:100%;height:34px;margin-top:10px}.library-preview{max-width:230px}.needs-voice{background:#fff4df;border:1px solid #f0d49a;padding:10px;border-radius:10px;font-size:.83rem;color:#7a5a18}.admin-search{margin:0 0 18px}.admin-search input{max-width:420px;margin:0}.production-actions{margin-top:24px}.production-actions .production-action{margin:0}

/* v7 workflow polish */
.story-status-card,.approve-box{display:flex;justify-content:space-between;gap:24px;align-items:flex-start}.status-kicker{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--pink);font-weight:800}.status-line{margin-top:8px}.status.large{font-size:.85rem;padding:8px 12px;border-radius:999px;display:inline-flex}.status{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f3f4fb;color:var(--ink)}.status-neutral{background:#f3f4fb;color:var(--ink)}.status-review{background:#fff4df;color:#7a5a18}.status-approved{background:#eef3ff;color:#3357b1}.status-delivered{background:#e8fbf1;color:#1e7a4c}.status-progress{background:#f1ebff;color:#6b46c1}.status-error{background:#ffe9ef;color:#c03362}.row-status-block{text-align:right}.status-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;color:var(--muted);font-size:.86rem}.status-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.delivery-theme-chip-row,.delivery-chip-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.theme-chip{background:#fff;border:1px solid var(--line);padding:7px 12px;border-radius:999px;font-size:.78rem;font-weight:700}.saved-hint{font-size:.74rem;color:var(--muted)}

/* delivery preview */
.delivery-page{position:relative;max-width:1180px;margin:40px auto;padding:0 24px 80px;overflow:hidden}.delivery-page .card{position:relative;z-index:1}.delivery-hero{padding:38px;border-radius:32px;overflow:hidden}.delivery-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.85);backdrop-filter:blur(4px);padding:8px 12px;border-radius:999px;font-size:.8rem;font-weight:800;margin-bottom:8px}.delivery-title{font-size:1.2rem;color:var(--ink);font-weight:700}.delivery-sub{max-width:650px}.delivery-actions{display:grid;gap:16px;margin-top:20px}.delivery-buttons{display:flex;gap:12px;flex-wrap:wrap}.delivery-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.delivery-list{padding-left:18px;color:var(--muted);line-height:1.7}.delivery-player{max-width:620px}.delivery-decor{position:absolute;border-radius:999px;opacity:.28;filter:blur(2px);z-index:0}.decor-1{width:180px;height:180px;top:20px;right:20px}.decor-2{width:120px;height:120px;bottom:40px;left:-10px}.decor-3{width:90px;height:90px;top:220px;left:10%}
.theme-magical .delivery-hero{background:linear-gradient(135deg,#fff3fb,#f4efff 45%,#e7fbff)}.theme-magical .decor-1,.theme-magical .decor-2,.theme-magical .decor-3{background:linear-gradient(135deg,var(--pink),var(--purple))}.theme-underwater .delivery-hero{background:linear-gradient(135deg,#e8fbff,#dff7ff 45%,#eef9ff)}.theme-underwater .decor-1,.theme-underwater .decor-2,.theme-underwater .decor-3{background:linear-gradient(135deg,var(--aqua),var(--blue))}.theme-winter .delivery-hero{background:linear-gradient(135deg,#f7fbff,#eef5ff 45%,#f3efff)}.theme-winter .decor-1,.theme-winter .decor-2,.theme-winter .decor-3{background:linear-gradient(135deg,#b5d4ff,#d8e8ff)}.theme-space .delivery-hero{background:linear-gradient(135deg,#eff1ff,#ede7ff 45%,#f8f2ff)}.theme-space .decor-1,.theme-space .decor-2,.theme-space .decor-3{background:linear-gradient(135deg,#8794ff,#d77bff)}.theme-forest .delivery-hero{background:linear-gradient(135deg,#effcf4,#f3fff1 45%,#f7fbe7)}.theme-forest .decor-1,.theme-forest .decor-2,.theme-forest .decor-3{background:linear-gradient(135deg,#67cf8f,#c7e47a)}.theme-royal .delivery-hero{background:linear-gradient(135deg,#fff8eb,#fff0fb 45%,#f6f0ff)}.theme-royal .decor-1,.theme-royal .decor-2,.theme-royal .decor-3{background:linear-gradient(135deg,#ffd84f,#ff8cc5)}
.animation-bubbles .decor-1,.animation-bubbles .decor-2,.animation-bubbles .decor-3{animation:floaty 7s ease-in-out infinite}.animation-sparkles .decor-1,.animation-sparkles .decor-2,.animation-sparkles .decor-3{animation:twinkle 4.5s ease-in-out infinite}.animation-stars .decor-1,.animation-stars .decor-2,.animation-stars .decor-3{animation:twinkle 3.8s ease-in-out infinite}.animation-snow .decor-1,.animation-snow .decor-2,.animation-snow .decor-3{animation:drift 8s linear infinite}.animation-leaves .decor-1,.animation-leaves .decor-2,.animation-leaves .decor-3{animation:drift 6s ease-in-out infinite}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}@keyframes twinkle{0%,100%{transform:scale(1);opacity:.25}50%{transform:scale(1.15);opacity:.45}}@keyframes drift{0%{transform:translateY(0) translateX(0)}50%{transform:translateY(25px) translateX(12px)}100%{transform:translateY(0) translateX(0)}}

@media(max-width:920px){.story-status-card,.approve-box{flex-direction:column}.delivery-grid{grid-template-columns:1fr}.row-status-block{text-align:left}}

/* v8 delivery reveal polish */
.delivery-page{min-height:calc(100vh - 86px);border-radius:34px;padding-top:34px;background:linear-gradient(145deg,rgba(255,255,255,.3),rgba(255,255,255,.08));isolation:isolate}.delivery-page:before{content:"";position:absolute;inset:0;border-radius:34px;z-index:-3}.theme-magical:before{background:radial-gradient(circle at 15% 20%,#ffdff1 0,transparent 32%),radial-gradient(circle at 82% 18%,#dfd7ff 0,transparent 34%),linear-gradient(135deg,#fff4fb,#eafcff)}.theme-underwater:before{background:radial-gradient(circle at 12% 16%,#9ff3f6 0,transparent 28%),radial-gradient(circle at 84% 14%,#b9ddff 0,transparent 33%),linear-gradient(180deg,#c8fbff,#e9f8ff)}.theme-winter:before{background:radial-gradient(circle at 15% 15%,#fff 0,transparent 24%),radial-gradient(circle at 78% 18%,#d9eaff 0,transparent 34%),linear-gradient(160deg,#eef8ff,#f5f1ff)}.theme-space:before{background:radial-gradient(circle at 20% 18%,#918cff 0,transparent 23%),radial-gradient(circle at 78% 18%,#d27cff 0,transparent 28%),linear-gradient(155deg,#1f2355,#3c3273 55%,#281f54)}.theme-forest:before{background:radial-gradient(circle at 15% 18%,#a8efbf 0,transparent 30%),radial-gradient(circle at 82% 18%,#e8ef9c 0,transparent 28%),linear-gradient(160deg,#dff7e8,#f4f8dc)}.theme-royal:before{background:radial-gradient(circle at 16% 18%,#ffe79d 0,transparent 27%),radial-gradient(circle at 82% 16%,#ffcce8 0,transparent 31%),linear-gradient(145deg,#fff6df,#f5eaff)}
.delivery-glass{position:relative;z-index:2;background:rgba(255,255,255,.64);border:1px solid rgba(255,255,255,.75);box-shadow:0 18px 50px rgba(39,48,78,.12);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:28px;padding:30px}.theme-space .delivery-glass{background:rgba(255,255,255,.78)}.delivery-hero.delivery-glass{padding:42px}.delivery-grid .delivery-glass{min-height:250px}.delivery-help-link{color:var(--purple);font-weight:800;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.keep-going-card{display:flex;flex-direction:column;justify-content:center}.keep-going-icon{font-size:3rem}.share-status{font-size:.78rem;color:var(--muted);min-height:1.2em;margin-top:10px}
.delivery-sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.delivery-sky span{position:absolute;font-size:2.1rem;filter:drop-shadow(0 6px 12px rgba(39,48,78,.12));animation:deliveryFloat 8s ease-in-out infinite}.delivery-sky span:nth-child(1){left:4%;top:10%;animation-delay:-1s}.delivery-sky span:nth-child(2){left:16%;top:32%;font-size:2.7rem;animation-delay:-4s}.delivery-sky span:nth-child(3){left:83%;top:8%;animation-delay:-2s}.delivery-sky span:nth-child(4){left:91%;top:40%;font-size:2.8rem;animation-delay:-6s}.delivery-sky span:nth-child(5){left:70%;top:70%;animation-delay:-3s}.delivery-sky span:nth-child(6){left:8%;top:72%;font-size:2.6rem;animation-delay:-5s}.delivery-sky span:nth-child(7){left:45%;top:4%;animation-delay:-7s}.delivery-sky span:nth-child(8){left:48%;top:83%;font-size:2.5rem;animation-delay:-2.5s}@keyframes deliveryFloat{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-22px) rotate(5deg)}}
.theme-space .delivery-title,.theme-space .delivery-sub,.theme-space .delivery-badge{color:var(--ink)}
@media(max-width:720px){.delivery-page{border-radius:0;margin-top:0}.delivery-sky span{font-size:1.6rem}.delivery-grid .delivery-glass{min-height:0}}


/* v9: make story theming much more visible */
.delivery-page{
  max-width:1320px;
  padding:46px 30px 90px;
  background:transparent;
}
.delivery-page:before{
  opacity:1;
}
.delivery-glass{
  background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.7);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  box-shadow:0 18px 55px rgba(39,48,78,.14);
}
.theme-space .delivery-glass{
  background:rgba(255,255,255,.58);
}
.delivery-hero.delivery-glass{
  padding:44px;
  min-height:500px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.delivery-grid .delivery-glass{
  background:rgba(255,255,255,.46);
}
.delivery-theme-showcase{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}
.delivery-theme-showcase .scene-item{
  position:absolute;
  font-size:clamp(3.2rem,5vw,5.8rem);
  filter:drop-shadow(0 12px 18px rgba(39,48,78,.16));
  animation:showcaseFloat 7s ease-in-out infinite;
}
.delivery-theme-showcase .s1{left:1.5%;top:12%;transform:rotate(-8deg)}
.delivery-theme-showcase .s2{right:2%;top:13%;animation-delay:-1.7s;transform:rotate(8deg)}
.delivery-theme-showcase .s3{left:7%;top:52%;font-size:clamp(2.6rem,4vw,4.6rem);animation-delay:-3.2s}
.delivery-theme-showcase .s4{right:5%;top:54%;font-size:clamp(2.8rem,4.4vw,5rem);animation-delay:-4.6s}
.delivery-theme-showcase .s5{left:45%;bottom:1.5%;font-size:clamp(2.5rem,4vw,4.4rem);animation-delay:-2.4s}
@keyframes showcaseFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -16px}
}

.delivery-sky{
  z-index:0;
}
.delivery-sky span{
  opacity:.92;
  font-size:2.7rem;
}
.delivery-sky span:nth-child(9){left:28%;top:16%;font-size:2.3rem;animation-delay:-3.3s}
.delivery-sky span:nth-child(10){left:76%;top:84%;font-size:2.8rem;animation-delay:-4.8s}

.delivery-hero,
.delivery-grid{
  position:relative;
  z-index:2;
}
.delivery-badge,
.theme-chip{
  background:rgba(255,255,255,.72);
}
.delivery-hero h1{
  max-width:790px;
  text-shadow:0 2px 0 rgba(255,255,255,.35);
}
.delivery-title{
  max-width:760px;
}
.theme-underwater .delivery-page,
.theme-underwater{
  --theme-accent:#1fc8d4;
}
.theme-underwater .delivery-hero{
  box-shadow:0 22px 70px rgba(41,167,191,.18);
}
.theme-winter .delivery-hero{
  box-shadow:0 22px 70px rgba(113,155,220,.18);
}
.theme-space .delivery-hero{
  box-shadow:0 22px 70px rgba(69,55,135,.26);
}
.theme-forest .delivery-hero{
  box-shadow:0 22px 70px rgba(62,146,91,.18);
}
.theme-royal .delivery-hero{
  box-shadow:0 22px 70px rgba(186,127,72,.18);
}

@media(max-width:920px){
  .delivery-theme-showcase .scene-item{font-size:3.2rem}
  .delivery-theme-showcase .s1{left:0;top:7%}
  .delivery-theme-showcase .s2{right:0;top:12%}
  .delivery-theme-showcase .s3{left:1%;top:56%}
  .delivery-theme-showcase .s4{right:1%;top:60%}
  .delivery-theme-showcase .s5{left:42%;bottom:0}
  .delivery-hero.delivery-glass{min-height:0}
}
@media(max-width:620px){
  .delivery-page{padding:28px 14px 70px}
  .delivery-glass{background:rgba(255,255,255,.56)}
  .delivery-theme-showcase .scene-item{opacity:.72;font-size:2.4rem}
  .delivery-sky span{font-size:1.8rem}
}

/* v10 delivery layout: visible themed art beside and on top of cards */
.delivery-hero.delivery-glass{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
  align-items:center;
  gap:28px;
  padding:44px 46px;
  overflow:visible;
}
.delivery-hero-copy{position:relative;z-index:3}
.delivery-vignette{
  min-height:360px;
  position:relative;
  display:grid;
  place-items:center;
  isolation:isolate;
}
.vignette-glow{
  position:absolute;
  width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.95),rgba(255,255,255,.2) 45%,rgba(255,255,255,0) 72%);
  filter:blur(2px);
  z-index:-1;
}
.delivery-vignette .vg{
  position:absolute;
  filter:drop-shadow(0 16px 22px rgba(39,48,78,.18));
  animation:vignetteBob 5.5s ease-in-out infinite;
}
.delivery-vignette .big{font-size:9rem;left:50%;top:50%;transform:translate(-50%,-50%)}
.delivery-vignette .v2{font-size:4.6rem;right:4%;top:7%;animation-delay:-1s}
.delivery-vignette .v3{font-size:4rem;left:2%;bottom:8%;animation-delay:-2s}
.delivery-vignette .v4{font-size:3.6rem;left:14%;top:10%;animation-delay:-3s}
.delivery-vignette .v5{font-size:4.2rem;right:8%;bottom:12%;animation-delay:-4s}
@keyframes vignetteBob{0%,100%{translate:0 0}50%{translate:0 -12px}}

.delivery-info-card{
  position:relative;
  overflow:visible;
  padding-top:40px;
}
.card-top-decor{
  position:absolute;
  top:-28px;
  left:28px;
  font-size:2.7rem;
  letter-spacing:.12em;
  filter:drop-shadow(0 9px 12px rgba(39,48,78,.14));
  white-space:nowrap;
  animation:decorBob 6s ease-in-out infinite;
}
.card-top-decor.right{left:auto;right:28px;animation-delay:-2.5s}
@keyframes decorBob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}

.delivery-grid{margin-top:38px;gap:34px}

/* reduce background clutter now that we have stronger foreground artwork */
.delivery-theme-showcase{opacity:.55}
.delivery-sky span{opacity:.58}

@media(max-width:980px){
  .delivery-hero.delivery-glass{grid-template-columns:1fr;gap:10px}
  .delivery-vignette{min-height:260px}
  .delivery-vignette .big{font-size:7rem}
}
@media(max-width:620px){
  .delivery-hero.delivery-glass{padding:30px 24px}
  .delivery-vignette{min-height:210px}
  .delivery-vignette .big{font-size:5.8rem}
  .delivery-vignette .v2,.delivery-vignette .v3,.delivery-vignette .v4,.delivery-vignette .v5{font-size:2.7rem}
  .card-top-decor{font-size:2rem;top:-22px;left:18px}
  .card-top-decor.right{right:18px}
}

/* v11 delivery theme: clean custom palette + focused vignette */
.delivery-page{
  --delivery-bg-1:#e8fbff;
  --delivery-bg-2:#eef6ff;
  --delivery-accent:#1fc8d4;
  --delivery-accent-2:#5aa7ff;
  --delivery-soft:#dff9fb;
  --delivery-link:#4b63db;
  max-width:1320px;
  min-height:calc(100vh - 86px);
  margin:0 auto;
  padding:46px 30px 90px;
  border-radius:0 0 36px 36px;
  background:
    radial-gradient(circle at 84% 14%,color-mix(in srgb,var(--delivery-accent-2) 24%,transparent) 0,transparent 30%),
    radial-gradient(circle at 12% 22%,color-mix(in srgb,var(--delivery-accent) 20%,transparent) 0,transparent 28%),
    linear-gradient(145deg,var(--delivery-bg-1),var(--delivery-bg-2));
}
.delivery-page:before{display:none!important}
.delivery-sky,.delivery-theme-showcase{display:none!important}

/* Base palette by story setting */
.theme-underwater{--delivery-bg-1:#c9fbf7;--delivery-bg-2:#e4f3ff;--delivery-accent:#10bfc8;--delivery-accent-2:#4f90ff;--delivery-soft:#d7fbf6;--delivery-link:#6358df}
.theme-winter{--delivery-bg-1:#eefaff;--delivery-bg-2:#e8efff;--delivery-accent:#6bbfe8;--delivery-accent-2:#8c7cf3;--delivery-soft:#edf8ff;--delivery-link:#5b58c7}
.theme-space{--delivery-bg-1:#20234f;--delivery-bg-2:#473277;--delivery-accent:#7f8cff;--delivery-accent-2:#d166ff;--delivery-soft:#ecebff;--delivery-link:#6d52dc}
.theme-forest{--delivery-bg-1:#e4f9e9;--delivery-bg-2:#f1f6d8;--delivery-accent:#55bd78;--delivery-accent-2:#b5cb4c;--delivery-soft:#edfaef;--delivery-link:#4b7f69}
.theme-royal{--delivery-bg-1:#fff3dc;--delivery-bg-2:#f6e8ff;--delivery-accent:#e6a93b;--delivery-accent-2:#c467db;--delivery-soft:#fff3df;--delivery-link:#9b52bc}
.theme-magical{--delivery-bg-1:#fff0f8;--delivery-bg-2:#e9f8ff;--delivery-accent:#f05aa5;--delivery-accent-2:#8b5cf6;--delivery-soft:#fff0f7;--delivery-link:#7b50d5}

/* Mood slightly changes the same setting so two stories can still feel different. */
.palette-bright{filter:saturate(1.08)}
.palette-bright .delivery-hero{background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(255,255,255,.49))}
.palette-cozy{--delivery-bg-2:color-mix(in srgb,var(--delivery-bg-2) 72%,#fff4dc);--delivery-accent-2:color-mix(in srgb,var(--delivery-accent-2) 65%,#f4a86d)}
.palette-mysterious{--delivery-bg-2:color-mix(in srgb,var(--delivery-bg-2) 72%,#cfc7f4);--delivery-accent-2:color-mix(in srgb,var(--delivery-accent-2) 60%,#6d57b8)}

.delivery-glass{
  background:rgba(255,255,255,.68);
  border:1px solid rgba(255,255,255,.84);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  box-shadow:0 18px 55px rgba(39,48,78,.13);
}
.theme-space .delivery-glass{background:rgba(255,255,255,.88)}
.delivery-hero.delivery-glass{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
  gap:34px;
  min-height:510px;
  padding:48px 50px;
  border-top:7px solid var(--delivery-accent);
  overflow:hidden;
}
.delivery-info-card{
  border-top:6px solid var(--delivery-accent-2);
  padding-top:34px;
  overflow:visible;
}
.delivery-info-card:nth-child(2){border-top-color:var(--delivery-accent)}
.delivery-badge{background:var(--delivery-soft);color:var(--ink);border:1px solid rgba(255,255,255,.7)}
.theme-chip{background:rgba(255,255,255,.78);border-color:color-mix(in srgb,var(--delivery-accent) 25%,#e7e8f2)}
.delivery-help-link{color:var(--delivery-link)}
.delivery-primary{
  background:linear-gradient(135deg,var(--delivery-accent),var(--delivery-accent-2))!important;
  box-shadow:0 10px 26px color-mix(in srgb,var(--delivery-accent-2) 28%,transparent)!important;
}

.delivery-vignette{
  min-height:390px;
  position:relative;
  display:grid;
  place-items:center;
  isolation:isolate;
  border-radius:36px;
  background:
    radial-gradient(circle at 50% 48%,rgba(255,255,255,.92) 0,rgba(255,255,255,.48) 37%,rgba(255,255,255,.08) 66%,transparent 72%);
}
.vignette-orbit{
  position:absolute;
  width:310px;height:310px;
  border:2px dashed color-mix(in srgb,var(--delivery-accent) 32%,transparent);
  border-radius:50%;
  animation:orbitTurn 26s linear infinite;
}
@keyframes orbitTurn{to{transform:rotate(360deg)}}
.vignette-glow{
  width:300px;height:300px;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.96),color-mix(in srgb,var(--delivery-accent) 19%,transparent) 47%,transparent 72%);
}
.delivery-vignette .big{font-size:10rem}
.delivery-vignette .v2{font-size:5rem;right:2%;top:5%}
.delivery-vignette .v3{font-size:4.4rem;left:0;bottom:6%}
.delivery-vignette .v4{font-size:4rem;left:10%;top:8%}
.delivery-vignette .v5{font-size:4.6rem;right:6%;bottom:9%}
.card-accent-icon{
  width:64px;height:64px;
  margin-top:-67px;
  margin-bottom:14px;
  display:grid;place-items:center;
  border-radius:20px;
  background:linear-gradient(145deg,var(--delivery-soft),rgba(255,255,255,.96));
  border:1px solid rgba(255,255,255,.88);
  box-shadow:0 10px 24px rgba(39,48,78,.12);
  font-size:2.1rem;
  transform:rotate(-4deg);
}
.keep-going-card .card-accent-icon{transform:rotate(4deg)}
.delivery-grid{margin-top:42px;gap:34px}

@media(max-width:980px){
  .delivery-hero.delivery-glass{grid-template-columns:1fr;padding:38px 34px}
  .delivery-vignette{min-height:290px}
  .delivery-vignette .big{font-size:8rem}
}
@media(max-width:620px){
  .delivery-page{padding:26px 14px 70px;border-radius:0}
  .delivery-hero.delivery-glass{padding:30px 24px;min-height:0}
  .delivery-vignette{min-height:220px}
  .delivery-vignette .big{font-size:6rem}
  .delivery-vignette .v2,.delivery-vignette .v3,.delivery-vignette .v4,.delivery-vignette .v5{font-size:2.8rem}
  .vignette-orbit{width:210px;height:210px}
  .card-accent-icon{width:54px;height:54px;margin-top:-57px;font-size:1.8rem}
}

/* v12 turnaround notice */
.turnaround-callout{
  margin:22px auto 26px;
  max-width:720px;
  padding:16px 20px;
  border-radius:18px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(104,84,190,.16);
  box-shadow:0 10px 30px rgba(68,52,128,.08);
  line-height:1.55;
}


/* v14 holiday/season delivery themes */
.theme-halloween{
  --theme-1:#fff2df;
  --theme-2:#f6d6ff;
  --theme-3:#ffd4a8;
  --theme-accent:#8f4ac5;
  --theme-deep:#5f2b84;
  --theme-button:#7b3fad;
}
.theme-halloween.delivery-page:before{
  background:
    radial-gradient(circle at 18% 18%, rgba(255,155,71,.35), transparent 30%),
    radial-gradient(circle at 82% 26%, rgba(148,81,190,.25), transparent 34%),
    linear-gradient(135deg,#fff3df,#f8e8ff 50%,#ffe4c4);
}
.theme-halloween .vignette-glow{
  background:radial-gradient(circle,rgba(255,169,85,.55),rgba(153,87,194,.18) 55%,transparent 72%);
}

.theme-fall{
  --theme-1:#fff1d7;
  --theme-2:#ffe0c2;
  --theme-3:#f3d9a5;
  --theme-accent:#c86b2d;
  --theme-deep:#8c4520;
  --theme-button:#b85f27;
}
.theme-fall.delivery-page:before{
  background:
    radial-gradient(circle at 20% 18%, rgba(245,175,85,.32), transparent 30%),
    radial-gradient(circle at 82% 28%, rgba(188,104,55,.20), transparent 34%),
    linear-gradient(135deg,#fff4dc,#ffe7c8 52%,#f7dfb1);
}
.theme-fall .vignette-glow{
  background:radial-gradient(circle,rgba(244,168,78,.45),rgba(191,103,47,.14) 55%,transparent 72%);
}


/* v16: cleaner themed delivery pages */

/* The two floating card badges were removed. */
.delivery-info-card{
  padding-top:38px;
}
.card-accent-icon{display:none!important}

/* Christmas is intentionally distinct from generic winter. */
.theme-variant-christmas{
  --delivery-bg-1:#fff8ef;
  --delivery-bg-2:#eef8f0;
  --delivery-accent:#c83d4a;
  --delivery-accent-2:#2f8a58;
  --delivery-soft:#fff4e4;
  --delivery-link:#b92f40;
}
.theme-variant-christmas.delivery-page{
  background:
    radial-gradient(circle at 82% 12%,rgba(213,50,62,.13) 0,transparent 29%),
    radial-gradient(circle at 10% 28%,rgba(37,132,78,.15) 0,transparent 31%),
    linear-gradient(145deg,#fff9ef 0%,#f4fbf4 48%,#fff3e0 100%);
}
.theme-variant-christmas .delivery-hero.delivery-glass{
  border-top-color:#c83d4a;
}
.theme-variant-christmas .delivery-info-card{
  border-top-color:#2f8a58;
}
.theme-variant-christmas .delivery-info-card:nth-child(2){
  border-top-color:#c83d4a;
}
.theme-variant-christmas .vignette-orbit{
  border-color:rgba(200,61,74,.28);
}
.theme-variant-christmas .vignette-glow{
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.97),rgba(255,222,168,.48) 44%,rgba(47,138,88,.12) 64%,transparent 74%);
}

/* Subtle purposeful snowfall. It sits over the page, not behind the cards as random objects. */
.delivery-snow{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:6;
  border-radius:0 0 36px 36px;
}
.delivery-page > *:not(.delivery-snow){
  position:relative;
  z-index:2;
}
.delivery-snow span{
  position:absolute;
  top:-7%;
  opacity:.72;
  color:#fff;
  text-shadow:0 1px 7px rgba(76,126,170,.28);
  animation-name:deliverySnowFall;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
}
.delivery-snow span:nth-child(1){left:3%;font-size:17px;animation-duration:9s;animation-delay:-1s}
.delivery-snow span:nth-child(2){left:8%;font-size:25px;animation-duration:13s;animation-delay:-7s}
.delivery-snow span:nth-child(3){left:13%;font-size:15px;animation-duration:11s;animation-delay:-5s}
.delivery-snow span:nth-child(4){left:18%;font-size:22px;animation-duration:15s;animation-delay:-9s}
.delivery-snow span:nth-child(5){left:23%;font-size:13px;animation-duration:10s;animation-delay:-4s}
.delivery-snow span:nth-child(6){left:28%;font-size:24px;animation-duration:14s;animation-delay:-11s}
.delivery-snow span:nth-child(7){left:33%;font-size:17px;animation-duration:12s;animation-delay:-6s}
.delivery-snow span:nth-child(8){left:38%;font-size:21px;animation-duration:16s;animation-delay:-12s}
.delivery-snow span:nth-child(9){left:43%;font-size:14px;animation-duration:10s;animation-delay:-3s}
.delivery-snow span:nth-child(10){left:48%;font-size:26px;animation-duration:15s;animation-delay:-8s}
.delivery-snow span:nth-child(11){left:53%;font-size:16px;animation-duration:12s;animation-delay:-10s}
.delivery-snow span:nth-child(12){left:58%;font-size:23px;animation-duration:14s;animation-delay:-2s}
.delivery-snow span:nth-child(13){left:63%;font-size:14px;animation-duration:11s;animation-delay:-7s}
.delivery-snow span:nth-child(14){left:68%;font-size:27px;animation-duration:17s;animation-delay:-13s}
.delivery-snow span:nth-child(15){left:73%;font-size:17px;animation-duration:12s;animation-delay:-5s}
.delivery-snow span:nth-child(16){left:78%;font-size:21px;animation-duration:14s;animation-delay:-9s}
.delivery-snow span:nth-child(17){left:83%;font-size:15px;animation-duration:10s;animation-delay:-6s}
.delivery-snow span:nth-child(18){left:88%;font-size:24px;animation-duration:16s;animation-delay:-12s}
.delivery-snow span:nth-child(19){left:93%;font-size:16px;animation-duration:12s;animation-delay:-4s}
.delivery-snow span:nth-child(20){left:97%;font-size:22px;animation-duration:15s;animation-delay:-10s}
.delivery-snow span:nth-child(21){left:35%;font-size:12px;animation-duration:9s;animation-delay:-2s}
.delivery-snow span:nth-child(22){left:56%;font-size:19px;animation-duration:13s;animation-delay:-8s}
.delivery-snow span:nth-child(23){left:71%;font-size:13px;animation-duration:10s;animation-delay:-1s}
.delivery-snow span:nth-child(24){left:15%;font-size:19px;animation-duration:13s;animation-delay:-10s}
@keyframes deliverySnowFall{
  0%{transform:translate3d(0,-8vh,0) rotate(0deg)}
  50%{transform:translate3d(18px,52vh,0) rotate(170deg)}
  100%{transform:translate3d(-10px,112vh,0) rotate(360deg)}
}

/* A deliberate repeating motif runs along the bottom instead of random card badges. */
.delivery-theme-border{
  width:calc(100% - 18px);
  margin:38px auto -58px;
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:12px;
  overflow:hidden;
  padding:8px 10px 12px;
  border-top:2px solid color-mix(in srgb,var(--delivery-accent) 24%,transparent);
  opacity:.88;
  mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent);
  -webkit-mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent);
}
.delivery-theme-border span{
  flex:0 0 auto;
  font-size:clamp(1.55rem,2.2vw,2.25rem);
  filter:drop-shadow(0 6px 8px rgba(39,48,78,.10));
  animation:borderMotifBob 4.8s ease-in-out infinite;
}
.delivery-theme-border span:nth-child(3n+2){animation-delay:-1.6s}
.delivery-theme-border span:nth-child(3n){animation-delay:-3.1s}
@keyframes borderMotifBob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}

@media(max-width:620px){
  .delivery-theme-border{
    margin-bottom:-50px;
    min-height:54px;
    gap:10px;
  }
  .delivery-theme-border span{
    font-size:1.55rem;
  }
  .delivery-theme-border span:nth-child(n+13){display:none}
}


/* v17 homepage hero carousel */
.hero-carousel{
  position:relative;
  min-width:0;
  align-self:center;
  border-radius:32px;
  overflow:hidden;
  box-shadow:0 24px 70px rgba(47,48,96,.16);
  background:linear-gradient(145deg,#e8fbff,#f8efff);
  aspect-ratio:1.14/1;
}
.hero-slides{
  position:absolute;
  inset:0;
}
.hero-slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:scale(1.015);
  transition:opacity .65s ease,transform .8s ease;
}
.hero-slide.is-active{
  opacity:1;
  transform:scale(1);
  z-index:1;
}
.hero-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.hero-arrow{
  position:absolute;
  top:50%;
  z-index:3;
  width:42px;
  height:42px;
  margin-top:-21px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:50%;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 8px 24px rgba(29,35,74,.14);
  color:#202b52;
  font-size:2rem;
  line-height:1;
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:transform .18s ease,background .18s ease;
}
.hero-arrow:hover{
  transform:scale(1.06);
  background:#fff;
}
.hero-prev{left:14px}
.hero-next{right:14px}
.hero-dots{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  display:flex;
  gap:8px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.hero-dots button{
  width:9px;
  height:9px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#bec6df;
  cursor:pointer;
  transition:width .2s ease,background .2s ease;
}
.hero-dots button.is-active{
  width:24px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff56ae,#6d58ff);
}
@media(max-width:900px){
  .hero-carousel{
    width:100%;
    max-width:720px;
    margin:8px auto 0;
    aspect-ratio:1.22/1;
  }
}
@media(max-width:620px){
  .hero-carousel{
    border-radius:24px;
    aspect-ratio:1.08/1;
  }
  .hero-arrow{
    width:36px;
    height:36px;
    margin-top:-18px;
    font-size:1.7rem;
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-slide{transition:none}
}


/* v18 immersive homepage hero */
.hero-immersive{
  position:relative;
  display:block;
  overflow:hidden;
  max-width:1320px;
  min-height:610px;
  padding:86px 42px 110px;
  border-radius:44px;
  background:
    radial-gradient(circle at 86% 16%, rgba(168,211,255,.28), transparent 24%),
    linear-gradient(180deg,#fbfafb 0%, #f8fbff 58%, #fbf8ff 100%);
}
.hero-immersive::before{
  content:"";
  position:absolute;
  right:110px;
  top:54px;
  width:430px;
  height:430px;
  border-radius:50%;
  z-index:0;
  transition:background .6s ease, transform .6s ease;
}
.hero-immersive[data-active-theme="underwater"]::before{
  background:radial-gradient(circle, rgba(158,238,255,.44) 0%, rgba(187,235,255,.22) 42%, rgba(255,255,255,0) 72%);
}
.hero-immersive[data-active-theme="space"]::before{
  background:radial-gradient(circle, rgba(198,196,255,.46) 0%, rgba(255,214,240,.20) 44%, rgba(255,255,255,0) 74%);
}
.hero-immersive[data-active-theme="forest"]::before{
  background:radial-gradient(circle, rgba(203,240,225,.42) 0%, rgba(235,216,255,.19) 42%, rgba(255,255,255,0) 74%);
}
.hero-scene{
  position:absolute;
  inset:0;
  z-index:1;
}
.hero-scene-slide{
  position:absolute;
  top:10px;
  right:-34px;
  bottom:26px;
  width:min(67%, 900px);
  margin:0;
  opacity:0;
  transform:translate3d(24px,0,0) scale(1.01);
  transition:opacity .65s ease, transform .8s ease;
}
.hero-scene-slide.is-active{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}
.hero-scene-slide img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:right center;
  display:block;
  filter:drop-shadow(0 18px 42px rgba(58,58,100,.12));
}
.hero-scene-fade{
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:50%;
  background:linear-gradient(90deg, rgba(251,250,251,.98) 0%, rgba(251,250,251,.95) 50%, rgba(251,250,251,.65) 75%, rgba(251,250,251,0) 100%);
  z-index:2;
}
.hero-immersive .hero-copy{
  position:relative;
  z-index:3;
  max-width:560px;
  padding-left:90px;
}
.hero-immersive .hero-copy::before{
  content:"";
  position:absolute;
  left:-28px;
  top:-36px;
  width:248px;
  height:248px;
  border-radius:50%;
  background:#d9f4f7;
  z-index:-1;
}
.hero-immersive .hero-actions,
.hero-immersive .mini-badges{position:relative; z-index:3}
.hero-scene-dots{
  position:absolute;
  left:68%;
  bottom:26px;
  transform:translateX(-50%);
  z-index:4;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.76);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 10px 32px rgba(46,47,90,.10);
}
.hero-scene-dots button{
  width:11px;
  height:11px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#c7cee5;
  cursor:pointer;
  transition:width .18s ease, background .18s ease, transform .18s ease;
}
.hero-scene-dots button:hover{transform:scale(1.08)}
.hero-scene-dots button.is-active{
  width:28px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff56ae,#735cff);
}

@media (max-width: 1180px){
  .hero-immersive{
    min-height:560px;
    padding:70px 28px 98px;
  }
  .hero-immersive .hero-copy{
    max-width:500px;
    padding-left:46px;
  }
  .hero-scene-slide{
    width:min(63%, 760px);
    right:-26px;
  }
  .hero-scene-dots{left:70%}
}

@media (max-width: 920px){
  .hero-immersive{
    min-height:auto;
    padding:48px 18px 76px;
  }
  .hero-scene{
    position:relative;
    margin-top:26px;
    height:380px;
    inset:auto;
  }
  .hero-scene-slide{
    top:0;
    right:0;
    bottom:0;
    width:100%;
  }
  .hero-scene-fade{
    width:100%;
    height:45%;
    top:auto;
    bottom:0;
    background:linear-gradient(180deg, rgba(251,250,251,0) 0%, rgba(251,250,251,.25) 24%, rgba(251,250,251,.92) 100%);
  }
  .hero-immersive .hero-copy{
    max-width:none;
    padding-left:10px;
  }
  .hero-immersive .hero-copy::before{
    left:-46px;
    top:-34px;
    width:180px;
    height:180px;
  }
  .hero-immersive::before{
    right:50%;
    transform:translateX(50%);
    top:280px;
    width:320px;
    height:320px;
  }
  .hero-scene-dots{
    left:50%;
    bottom:18px;
  }
}

@media (max-width: 620px){
  .hero-immersive{
    border-radius:28px;
    padding:34px 14px 70px;
  }
  .hero-immersive .hero-copy{
    padding-left:0;
  }
  .hero-immersive .hero-copy::before{
    left:-50px;
    top:-28px;
    width:150px;
    height:150px;
  }
  .hero-scene{
    height:300px;
  }
  .hero-scene-slide{
    right:-6px;
  }
  .hero-scene-dots{
    gap:8px;
    padding:7px 10px;
  }
  .hero-scene-dots button{
    width:9px;
    height:9px;
  }
  .hero-scene-dots button.is-active{
    width:22px;
  }
}

@media (prefers-reduced-motion: reduce){
  .hero-scene-slide{
    transition:none;
  }
}


/* v19 hero fix: no overlap between live copy and generated art */
.hero-immersive{
  display:grid !important;
  grid-template-columns:minmax(0, .92fr) minmax(520px, 1.08fr) !important;
  gap:18px !important;
  align-items:center !important;
  max-width:1380px !important;
  min-height:650px !important;
  padding:70px 34px 82px !important;
  overflow:hidden !important;
}

.hero-immersive .hero-copy{
  grid-column:1 !important;
  position:relative !important;
  z-index:5 !important;
  max-width:590px !important;
  padding-left:44px !important;
}

.hero-immersive .hero-copy::before{
  left:-42px !important;
  top:-34px !important;
  width:250px !important;
  height:250px !important;
}

.hero-scene{
  grid-column:2 !important;
  position:relative !important;
  inset:auto !important;
  width:100% !important;
  height:560px !important;
  z-index:2 !important;
  overflow:visible !important;
}

.hero-scene-slide{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
}

.hero-scene-slide img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  display:block !important;
  filter:drop-shadow(0 20px 44px rgba(58,58,100,.13)) !important;
}

.hero-scene-fade{
  display:none !important;
}

.hero-immersive::before{
  right:20px !important;
  top:70px !important;
  width:520px !important;
  height:520px !important;
}

.hero-scene-dots{
  left:auto !important;
  right:27% !important;
  bottom:24px !important;
  transform:none !important;
}

@media (max-width:1180px){
  .hero-immersive{
    grid-template-columns:minmax(0, .95fr) minmax(450px, 1.05fr) !important;
    min-height:590px !important;
    padding:56px 26px 78px !important;
  }
  .hero-immersive .hero-copy{
    padding-left:24px !important;
  }
  .hero-scene{
    height:500px !important;
  }
}

@media (max-width:920px){
  .hero-immersive{
    display:block !important;
    min-height:auto !important;
    padding:46px 20px 76px !important;
  }
  .hero-immersive .hero-copy{
    max-width:none !important;
    padding-left:8px !important;
  }
  .hero-scene{
    width:100% !important;
    height:430px !important;
    margin-top:20px !important;
  }
  .hero-scene-dots{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    bottom:18px !important;
  }
}

@media (max-width:620px){
  .hero-scene{
    height:320px !important;
  }
}


/* v20: keep hero copy and artwork on the SAME grid row */
.hero-immersive .hero-copy{
  grid-row:1 !important;
}
.hero-scene{
  grid-row:1 !important;
}

/* Keep the dots attached to the artwork zone on desktop. */
.hero-scene-dots{
  grid-column:2 !important;
  grid-row:1 !important;
}

/* On stacked layouts, return to normal document flow. */
@media (max-width:920px){
  .hero-immersive .hero-copy{
    grid-row:auto !important;
  }
  .hero-scene{
    grid-row:auto !important;
  }
  .hero-scene-dots{
    grid-column:auto !important;
    grid-row:auto !important;
  }
}


/* v21: full-width rotating hero using the approved sample images */
.full-hero-carousel{
  position:relative;
  max-width:1380px;
  margin:0 auto 48px;
  padding:0;
  min-height:690px;
  border-radius:42px;
  overflow:hidden;
  background:#f6f6fb;
  box-shadow:0 24px 70px rgba(46,47,90,.10);
}

.full-hero-slides{
  position:absolute;
  inset:0;
}

.full-hero-slide{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transition:opacity .65s ease;
}

.full-hero-slide.is-active{
  opacity:1;
  z-index:1;
}

.full-hero-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

.hero-cta-overlay{
  position:absolute;
  left:56px;
  bottom:52px;
  z-index:3;
  display:flex;
  flex-direction:column;
  gap:18px;
  max-width:min(760px, 60%);
}

.full-hero-carousel .hero-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:22px;
  margin:0;
}

.hero-cta-overlay .hero-actions .btn.primary{
  box-shadow:0 12px 30px rgba(115,92,255,.18);
}

.hero-cta-overlay .text-link{
  font-size:1.2rem;
  font-weight:800;
  color:#7259ff;
  text-decoration:none;
}

.hero-cta-overlay .text-link:hover{
  text-decoration:underline;
}

.full-hero-carousel .mini-badges{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:0;
}

.full-hero-carousel .mini-badges span{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 8px 24px rgba(39,48,78,.08);
}

.full-hero-carousel .hero-scene-dots{
  position:absolute;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  z-index:4;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 10px 32px rgba(46,47,90,.10);
}

.full-hero-carousel .hero-scene-dots button{
  width:11px;
  height:11px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#c7cee5;
  cursor:pointer;
  transition:width .18s ease, background .18s ease, transform .18s ease;
}

.full-hero-carousel .hero-scene-dots button:hover{
  transform:scale(1.08);
}

.full-hero-carousel .hero-scene-dots button.is-active{
  width:28px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff56ae,#735cff);
}

@media (max-width: 1200px){
  .full-hero-carousel{
    min-height:620px;
  }
  .hero-cta-overlay{
    left:40px;
    bottom:44px;
    max-width:min(760px, 68%);
  }
}

@media (max-width: 920px){
  .full-hero-carousel{
    min-height:0;
    border-radius:28px;
    margin-bottom:38px;
  }
  .full-hero-slide img{
    object-fit:contain;
    background:#f6f6fb;
  }
  .hero-cta-overlay{
    position:relative;
    left:auto;
    bottom:auto;
    max-width:none;
    padding:18px 16px 68px;
    margin-top:auto;
    background:linear-gradient(180deg, rgba(246,246,251,0) 0%, rgba(246,246,251,.30) 14%, rgba(246,246,251,.92) 36%, rgba(246,246,251,.98) 100%);
  }
  .full-hero-slides{
    position:relative;
    aspect-ratio:16/12;
  }
}

@media (max-width: 620px){
  .hero-cta-overlay{
    padding:16px 14px 64px;
    gap:14px;
  }
  .full-hero-carousel .hero-actions{
    gap:14px;
  }
  .hero-cta-overlay .text-link{
    font-size:1.05rem;
  }
  .full-hero-carousel .hero-scene-dots{
    bottom:14px;
  }
  .full-hero-carousel .hero-scene-dots button{
    width:9px;
    height:9px;
  }
  .full-hero-carousel .hero-scene-dots button.is-active{
    width:22px;
  }
}

@media (prefers-reduced-motion: reduce){
  .full-hero-slide{
    transition:none;
  }
}


/* v22: hide the duplicated CTA/badges baked into the hero artwork,
   then place one clean live CTA + stacked live badges on top. */
.full-hero-carousel::after{
  content:"";
  position:absolute;
  z-index:2;
  left:34px;
  bottom:24px;
  width:560px;
  height:225px;
  border-radius:32px;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,.985) 0%,
      rgba(255,255,255,.975) 58%,
      rgba(255,255,255,.92) 78%,
      rgba(255,255,255,0) 100%);
  pointer-events:none;
}

.hero-cta-overlay{
  left:58px !important;
  bottom:44px !important;
  z-index:5 !important;
  max-width:500px !important;
  gap:14px !important;
}

.hero-cta-overlay .hero-actions{
  gap:18px !important;
}

.hero-badge-stack{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 10px;
  width:max-content;
  max-width:100%;
}

.hero-badge-stack span{
  display:flex;
  align-items:center;
  min-height:39px;
  padding:8px 12px;
  border:1px solid rgba(110,122,160,.22);
  border-radius:999px;
  background:rgba(255,255,255,.97);
  box-shadow:0 7px 18px rgba(39,48,78,.06);
  color:var(--navy);
  font-size:.78rem;
  font-weight:750;
  white-space:nowrap;
}

@media(max-width:1200px){
  .full-hero-carousel::after{
    left:22px;
    bottom:18px;
    width:520px;
    height:215px;
  }
  .hero-cta-overlay{
    left:42px !important;
    bottom:36px !important;
  }
}

@media(max-width:920px){
  .full-hero-carousel::after{
    display:none;
  }
  .hero-cta-overlay{
    left:auto !important;
    bottom:auto !important;
    max-width:none !important;
  }
  .hero-badge-stack{
    grid-template-columns:1fr 1fr;
    width:100%;
  }
}

@media(max-width:620px){
  .hero-badge-stack{
    grid-template-columns:1fr;
  }
  .hero-badge-stack span{
    width:max-content;
    max-width:100%;
  }
}


/* v23: tighten and extend the white overlay panel behind the live CTA/badges */
.full-hero-carousel::after{
  left:38px !important;
  bottom:-4px !important;
  width:470px !important;
  height:305px !important;
  border-radius:34px !important;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,.988) 0%,
      rgba(255,255,255,.978) 64%,
      rgba(255,255,255,.94) 82%,
      rgba(255,255,255,.18) 100%) !important;
}

.hero-cta-overlay{
  left:60px !important;
  bottom:34px !important;
  max-width:455px !important;
}

.hero-badge-stack{
  gap:10px 10px !important;
}

@media(max-width:1200px){
  .full-hero-carousel::after{
    left:26px !important;
    bottom:-2px !important;
    width:438px !important;
    height:290px !important;
  }
  .hero-cta-overlay{
    left:44px !important;
    bottom:30px !important;
    max-width:430px !important;
  }
}


/* v24 homepage hero refresh: use the cleaned artwork directly, remove the cover box,
   keep live CTA/badges on top, and make the carousel auto-rotate cleanly. */
.full-hero-carousel::after{display:none !important;}

.full-hero-carousel{
  position:relative;
  max-width:1380px;
  margin:0 auto 52px;
  padding:0;
  min-height:clamp(520px, 48vw, 690px);
  border-radius:40px;
  overflow:hidden;
  background:#f7f8fd;
  box-shadow:0 24px 70px rgba(46,47,90,.10);
}

.full-hero-slides{position:absolute; inset:0;}
.full-hero-slide{position:absolute; inset:0; margin:0; opacity:0; transition:opacity .65s ease;}
.full-hero-slide.is-active{opacity:1; z-index:1;}
.full-hero-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}

.hero-cta-overlay{
  position:absolute;
  left:56px !important;
  bottom:34px !important;
  z-index:5 !important;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px !important;
  max-width:460px !important;
  background:none !important;
}

.full-hero-carousel .hero-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:18px;
  margin:0;
}

.hero-cta-overlay .hero-actions .btn.primary{box-shadow:0 12px 30px rgba(115,92,255,.18);}
.hero-cta-overlay .text-link{
  font-size:1.18rem;
  font-weight:800;
  color:#7259ff;
  text-decoration:none;
}
.hero-cta-overlay .text-link:hover{text-decoration:underline;}

.hero-badge-stack{
  display:grid;
  grid-template-columns:repeat(2, max-content);
  gap:10px;
  align-items:start;
  width:max-content;
  max-width:100%;
}
.hero-badge-stack span{
  display:flex;
  align-items:center;
  min-height:39px;
  padding:8px 12px;
  border:1px solid rgba(110,122,160,.18);
  border-radius:999px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 7px 18px rgba(39,48,78,.06);
  color:var(--navy);
  font-size:.78rem;
  font-weight:750;
  white-space:nowrap;
}

.full-hero-carousel .hero-scene-dots{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:6;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 10px 32px rgba(46,47,90,.10);
}
.full-hero-carousel .hero-scene-dots button{
  width:11px; height:11px; padding:0; border:0; border-radius:50%;
  background:#c7cee5; cursor:pointer;
  transition:width .18s ease, background .18s ease, transform .18s ease;
}
.full-hero-carousel .hero-scene-dots button:hover{transform:scale(1.08);}
.full-hero-carousel .hero-scene-dots button.is-active{width:28px; border-radius:999px; background:linear-gradient(90deg,#ff56ae,#735cff);}

.pronunciation-tools{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:4px;
  margin-bottom:10px;
  flex-wrap:wrap;
}
.pronunciation-preview-btn{padding:.68rem 1rem;}
.inline-check{display:flex; align-items:flex-start; gap:10px; font-weight:600; margin:12px 0 10px; color:var(--ink);}
.inline-check input{margin-top:4px;}

@media (max-width: 1200px){
  .full-hero-carousel{min-height:clamp(480px, 52vw, 620px);}
  .hero-cta-overlay{left:40px !important; bottom:30px !important; max-width:430px !important;}
}

@media (max-width: 920px){
  .full-hero-carousel{min-height:0; border-radius:28px; margin-bottom:38px;}
  .full-hero-slide img{object-fit:contain; background:#f7f8fd;}
  .full-hero-slides{position:relative; aspect-ratio:16/10;}
  .hero-cta-overlay{
    position:relative; left:auto !important; bottom:auto !important; max-width:none !important;
    padding:18px 16px 68px; margin-top:auto;
    background:linear-gradient(180deg, rgba(247,248,253,0) 0%, rgba(247,248,253,.28) 14%, rgba(247,248,253,.92) 36%, rgba(247,248,253,.98) 100%) !important;
  }
  .hero-badge-stack{grid-template-columns:1fr 1fr; width:100%;}
}

@media (max-width: 620px){
  .hero-cta-overlay{padding:16px 14px 64px; gap:14px !important;}
  .full-hero-carousel .hero-actions{gap:14px;}
  .hero-cta-overlay .text-link{font-size:1.05rem;}
  .hero-badge-stack{grid-template-columns:1fr; width:100%;}
  .hero-badge-stack span{width:max-content; max-width:100%;}
  .full-hero-carousel .hero-scene-dots{bottom:14px;}
  .full-hero-carousel .hero-scene-dots button{width:9px; height:9px;}
  .full-hero-carousel .hero-scene-dots button.is-active{width:22px;}
}

@media (prefers-reduced-motion: reduce){.full-hero-slide{transition:none;}}


/* v25 voice library coverage dashboard */
.voice-count-card{margin-top:22px}
.voice-count-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:22px}
.voice-count-heading h2{margin-bottom:8px}
.voice-count-heading p{max-width:760px;margin:0}
.voice-total-pill{min-width:116px;padding:14px 16px;border-radius:20px;background:linear-gradient(145deg,var(--purple2),var(--aqua2));text-align:center;border:1px solid var(--line)}
.voice-total-pill strong,.voice-total-pill span,.voice-total-pill small{display:block}
.voice-total-pill strong{font-family:'Baloo 2';font-size:2rem;line-height:1;color:var(--purple)}
.voice-total-pill span{font-weight:800;font-size:.82rem;margin-top:4px}
.voice-total-pill small{font-size:.7rem;color:var(--muted);margin-top:3px}
.voice-count-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.voice-count-item{border:1px solid var(--line);border-radius:18px;padding:16px;background:#fff}
.voice-count-item.coverage-good{background:linear-gradient(180deg,#fff,#f5fff9);border-color:#cdebdc}
.voice-count-item.coverage-need{background:linear-gradient(180deg,#fff,#fffaf0);border-color:#f1dfb9}
.voice-count-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.voice-count-top>strong{font-size:.9rem}
.coverage-badge{display:inline-flex;padding:4px 7px;border-radius:999px;font-size:.66rem;font-weight:800;white-space:nowrap}
.coverage-badge.good{background:#e2f8ec;color:#27754a}
.coverage-badge.need{background:#fff0ca;color:#906316}
.voice-count-number{font-family:'Baloo 2';font-size:1.9rem;font-weight:700;line-height:1.1;margin-top:14px;color:var(--navy)}
.voice-count-number span{font-family:'DM Sans';font-size:.72rem;font-weight:700;color:var(--muted)}
.voice-count-item small{display:block;margin-top:5px;color:var(--muted)}
.uncategorized-callout{margin-top:15px;padding:14px 16px;border-radius:16px;background:#f5f7fb;border:1px solid var(--line);display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.uncategorized-callout.needs-review{background:#fff3f7;border-color:#ffd0e0}
.uncategorized-callout strong{font-size:.86rem}
.uncategorized-callout span{color:var(--muted);font-size:.82rem;flex:1;min-width:260px}
.uncategorized-callout small{color:var(--muted)}
@media(max-width:900px){.voice-count-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.voice-count-heading{display:block}.voice-total-pill{margin-top:14px;width:116px}.voice-count-grid{grid-template-columns:1fr}.voice-count-top{align-items:center}}


/* v27 builder refinements */
.name-use-option{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:18px 0 10px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  cursor:pointer;
  max-width:720px;
}
.name-use-option input{
  width:auto !important;
  min-width:18px;
  height:18px;
  margin:2px 0 0 !important;
  flex:0 0 auto;
  accent-color:var(--purple);
}
.name-use-option span{
  display:block;
  min-width:0;
}
.name-use-option strong{
  display:block;
  font-size:.9rem;
  color:var(--ink);
  line-height:1.35;
}
.name-use-option small{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:.78rem;
  font-weight:500;
  line-height:1.45;
}
#peoplePetsLimitNote{
  margin-top:9px;
}
#addPersonPet:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none;
}


/* v29 persistent storage status */
.admin-top-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.status-callout{border-radius:18px;padding:18px 20px;margin-bottom:22px;border:1px solid var(--line)}
.status-callout strong{display:block;font-size:1.05rem;color:var(--navy)}
.status-callout p{margin:6px 0 0}
.success-callout{background:#f1fbf6;border-color:#bde8cf}
.warning-callout{background:#fff9e8;border-color:#f2d88a}
.error-callout{background:#fff1f1;border-color:#f0bcbc}
.storage-details{display:grid;gap:12px}
.storage-details>div{display:grid;grid-template-columns:180px 1fr;gap:16px;align-items:start}
.storage-details span{font-weight:700;color:var(--muted)}
.storage-details code{white-space:normal;overflow-wrap:anywhere}
@media(max-width:620px){.storage-details>div{grid-template-columns:1fr;gap:4px}}


/* v33 payment visibility */
.payment-badge{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.02em;
  border:1px solid var(--line);
  background:#f4f6f8;
  color:var(--navy);
}
.payment-paid{background:#eef9f2;border-color:#bfe3ca}
.payment-pending{background:#fff8e8;border-color:#ecd28b}
.payment-test{background:#eef4ff;border-color:#c8d7ff}
.payment-unknown{background:#f5f5f5;border-color:#ddd}
.payment-summary{
  margin:14px 0 20px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
}
.payment-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.payment-inline{margin:4px 0 8px}


/* v35 story deletion */
.btn.danger{
  background:#fff3f3;
  border:1px solid #e3a6a6;
  color:#8a2020;
}
.btn.danger:hover{background:#ffe9e9}
.delete-story-form{display:inline-block;margin-left:8px}
.queue-delete-form{display:inline-block;margin-top:8px}
.small-btn{padding:7px 11px;font-size:.82rem}


/* v36 sample story manager */
.sample-upload-card{margin-bottom:28px}
.sample-upload-form{display:grid;gap:16px}
.sample-upload-form label{display:grid;gap:7px;font-weight:700}
.sample-upload-form input,
.sample-upload-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--line);
  border-radius:12px;
  padding:11px 12px;
  font:inherit;
  background:#fff;
}
.sample-upload-form small{font-weight:400;color:var(--muted)}
.sample-form-grid{display:grid;grid-template-columns:140px 1fr;gap:14px}
.sample-admin-list{display:grid;gap:14px}
.sample-admin-list>h2{margin-bottom:0}
.sample-admin-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:22px;
}
.sample-admin-info{flex:1;min-width:0}
.sample-admin-info audio{width:100%;max-width:560px;margin-top:10px}
.sample-admin-title{display:flex;gap:12px;align-items:flex-start}
.sample-admin-title strong{font-size:1.08rem}
.sample-admin-emoji{font-size:1.8rem;line-height:1}
.compact-tags{margin-top:7px}
.sample-empty{text-align:center;padding:40px 20px}
@media(max-width:650px){
  .sample-form-grid{grid-template-columns:1fr}
  .sample-admin-row{flex-direction:column}
}

/* v39 sample editing + email status */
.sample-admin-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sample-admin-actions form{margin:0}
.email-error{color:#8a2020}

/* v41 always-visible email status */
.email-status-card{margin-bottom:22px}
.email-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}
.email-status-grid>div{display:grid;gap:5px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}
.email-label{font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.email-ok{color:#267a45}
.email-waiting{color:#8a6b16}
.email-error-box{margin-top:14px;padding:14px;border-radius:14px;background:#fff1f1;border:1px solid #efbcbc;color:#8a2020}
@media(max-width:760px){.email-status-grid{grid-template-columns:1fr}}

/* v44 customer email editing + contact form */
.customer-email-edit{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.customer-email-edit input{
  min-width:240px;
  flex:1;
  border:1px solid var(--line);
  border-radius:10px;
  padding:9px 10px;
  font:inherit;
}
.contact-wrap{max-width:760px;margin:0 auto;padding:8px 20px 56px}
.contact-card{padding:26px}
.contact-form{display:grid;gap:16px}
.contact-form label{display:grid;gap:7px;font-weight:700}
.contact-form input,.contact-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--line);
  border-radius:12px;
  padding:11px 12px;
  font:inherit;
  background:#fff;
}
.optional{font-weight:400;color:var(--muted);font-size:.9em}
.contact-success{text-align:center;padding:22px 10px}
.contact-success-icon{font-size:42px}