:root{
  --bg:#07030b; --bg2:#170719; --text:#fff7fb; --muted:rgba(255,247,251,.74);
  --card:rgba(255,255,255,.085); --line:rgba(255,255,255,.16); --accent:#ffd1e4; --accent2:#bca7ff;
}
*{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth}
body{min-height:100vh;font-family:Inter,Arial,sans-serif;background:radial-gradient(circle at 20% 5%,rgba(255,166,214,.22),transparent 26%),radial-gradient(circle at 80% 15%,rgba(165,138,255,.20),transparent 30%),linear-gradient(180deg,var(--bg2),var(--bg) 62%,#020104);color:var(--text);overflow-x:hidden;transition:background 1s ease,color .4s ease}
body.theme-sun{--bg:#fff1c9;--bg2:#ffb967;--text:#2a160b;--muted:rgba(42,22,11,.72);--card:rgba(255,255,255,.36);--line:rgba(90,50,10,.18);--accent:#ffe27b;--accent2:#ff8b5c;background:radial-gradient(circle at 75% 8%,rgba(255,255,210,.95),transparent 14%),radial-gradient(circle at 20% 20%,rgba(255,255,255,.34),transparent 26%),linear-gradient(180deg,#ffbd75,#ffe6a8 48%,#fff7db)}
body.theme-evening{--bg:#120a20;--bg2:#4b1847;--text:#fff7fb;--muted:rgba(255,247,251,.75);--card:rgba(255,255,255,.10);--line:rgba(255,255,255,.18);--accent:#ffd49b;--accent2:#ff7a9c;background:radial-gradient(circle at 10% 8%,rgba(255,171,99,.28),transparent 28%),radial-gradient(circle at 80% 5%,rgba(255,120,170,.22),transparent 28%),linear-gradient(180deg,#4b1847,#14091d 70%,#07030b)}
body.theme-night{--bg:#07030b;--bg2:#170719;--text:#fff7fb;--muted:rgba(255,247,251,.74);--card:rgba(255,255,255,.085);--line:rgba(255,255,255,.16);--accent:#ffd1e4;--accent2:#bca7ff;background:radial-gradient(circle at 20% 5%,rgba(255,166,214,.22),transparent 26%),radial-gradient(circle at 80% 15%,rgba(165,138,255,.20),transparent 30%),linear-gradient(180deg,var(--bg2),var(--bg) 62%,#020104)}
button{font-family:inherit}.progress{position:fixed;top:0;left:0;height:4px;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));z-index:100}.grain{position:fixed;inset:0;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");z-index:3}.ambient{position:fixed;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:-2;animation:pulse 7s ease-in-out infinite alternate}.ambient-one{width:360px;height:360px;background:rgba(255,158,208,.22);right:-90px;top:12%}.ambient-two{width:300px;height:300px;background:rgba(132,112,255,.18);left:-70px;bottom:10%;animation-delay:1.3s}.sun-orb,.moon-orb{position:fixed;pointer-events:none;border-radius:50%;z-index:-1;transition:opacity .9s ease,transform .9s ease}.sun-orb{width:145px;height:145px;right:7%;top:7%;background:#fff2a0;box-shadow:0 0 80px rgba(255,205,76,.65);opacity:0}.moon-orb{width:112px;height:112px;right:8%;top:8%;background:rgba(255,255,255,.92);box-shadow:0 0 55px rgba(255,255,255,.35);opacity:1}.moon-orb:after{content:"";position:absolute;width:96px;height:96px;border-radius:50%;background:#130719;left:-23px;top:-6px}body.theme-sun .sun-orb{opacity:1;transform:scale(1.08)}body.theme-sun .moon-orb{opacity:0;transform:translateY(30px)}body.theme-evening .sun-orb{opacity:.28;transform:translateY(26px) scale(.82)}body.theme-evening .moon-orb{opacity:.46}body.theme-night .sun-orb{opacity:0}body.theme-night .moon-orb{opacity:1}canvas{position:fixed;inset:0;pointer-events:none}#weatherCanvas{z-index:-1;opacity:.45}#sparkCanvas{z-index:80}.start-screen{position:fixed;inset:0;display:grid;place-items:center;z-index:90;background:radial-gradient(circle at center,rgba(60,28,72,.98),#050207 72%);transition:.8s}.start-screen.hide{opacity:0;pointer-events:none;transform:scale(1.02)}.start-box{width:min(560px,91vw);padding:38px;border:1px solid var(--line);border-radius:34px;background:rgba(255,255,255,.09);backdrop-filter:blur(18px);text-align:center;box-shadow:0 35px 120px rgba(0,0,0,.55)}.start-box h1{font-size:clamp(34px,7vw,60px);line-height:1;margin:14px 0}.start-box p{color:rgba(255,255,255,.75);line-height:1.75;margin-bottom:24px}.section{width:min(1120px,92vw);margin:0 auto 28px;padding:36px;border-radius:34px}.hero{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center}.glass-panel,.switcher,.fairy,.mood,.player,.final,.story-text{background:var(--card);border:1px solid var(--line);backdrop-filter:blur(18px);box-shadow:0 25px 95px rgba(0,0,0,.34)}.mini-label{text-transform:uppercase;letter-spacing:2.5px;font-size:12px;color:var(--muted);font-weight:800}.hero-copy h2,.section h2{font-size:clamp(36px,7vw,78px);line-height:.95;letter-spacing:-2px;margin:14px 0 18px}.typing,.big-text,.final p,.theme-line{font-size:clamp(18px,2.3vw,23px);line-height:1.75;color:var(--muted)}.main-btn{border:0;border-radius:999px;padding:15px 23px;margin:7px 6px 7px 0;background:linear-gradient(135deg,var(--accent),#fff);color:#1b0a18;font-weight:900;cursor:pointer;transition:.24s;box-shadow:0 14px 35px rgba(0,0,0,.20)}.main-btn:hover{transform:translateY(-3px) scale(1.02)}.ghost{background:rgba(255,255,255,.06);color:var(--text);border:1px solid var(--line);box-shadow:none}.active-choice{background:linear-gradient(135deg,var(--accent),#fff)!important;color:#1b0a18!important;border:0!important;box-shadow:0 0 0 4px rgba(255,255,255,.13),0 16px 38px rgba(0,0,0,.22)}.message-box{margin-top:20px;padding:22px;border-radius:24px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.10);line-height:1.7;color:var(--muted)}.hero-photos{min-height:585px;position:relative}.photo{position:absolute;object-fit:cover;border-radius:30px;border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 90px rgba(0,0,0,.48);cursor:pointer}.photo-main{right:0;top:22px;width:74%;height:430px;animation:float 4s ease-in-out infinite alternate}.photo-side{left:0;bottom:20px;width:48%;height:290px;animation:float 4s ease-in-out infinite alternate-reverse}.photo-mini{right:9%;bottom:0;width:35%;height:170px;animation:float 5s ease-in-out infinite alternate}.floating-note{position:absolute;right:10%;bottom:62px;padding:13px 17px;border-radius:18px;background:rgba(0,0,0,.38);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(12px);font-weight:800;color:#fff}.switcher{text-align:center}.theme-buttons{margin:16px 0}.story{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:center}.story-photo{min-height:470px;position:relative}.story-photo img{position:absolute;object-fit:cover;border-radius:32px;border:1px solid rgba(255,255,255,.18);box-shadow:0 26px 70px rgba(0,0,0,.38);cursor:pointer}.story-photo img:first-child{left:0;top:25px;width:68%;height:340px;transform:rotate(-4deg)}.story-photo img:last-child{right:0;bottom:8px;width:58%;height:330px;transform:rotate(5deg)}.story-text{padding:34px;border-radius:34px}.compliment{margin-top:18px;color:var(--accent);font-size:22px;font-weight:800;min-height:32px}.fairy{text-align:center}.fairy-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;gap:16px;margin-top:24px}.tile{position:relative;overflow:hidden;border-radius:28px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 50px rgba(0,0,0,.26);cursor:pointer;transition:.25s}.tile:hover{transform:translateY(-7px) scale(1.015)}.tile img{width:100%;height:100%;object-fit:cover;display:block;transition:.45s}.tile:hover img{transform:scale(1.06)}.tile figcaption{position:absolute;left:12px;right:12px;bottom:12px;padding:11px 13px;border-radius:18px;background:rgba(0,0,0,.42);backdrop-filter:blur(12px);font-weight:900;color:#fff}.tile.tall{grid-row:span 2}.tile.wide{grid-column:span 2}.mood{display:grid;grid-template-columns:.8fr 1.2fr;gap:25px}.mood-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mood article{padding:22px;border-radius:24px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.10)}.mood b{color:var(--accent);font-size:26px}.mood h3{margin:10px 0}.mood p,.player p{color:var(--muted);line-height:1.6}.player{display:grid;grid-template-columns:1fr 1fr;gap:22px}.track-list{display:grid;gap:12px;margin-top:20px}.track{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;border-radius:20px;padding:15px 17px;background:rgba(255,255,255,.07);color:var(--text);border:1px solid rgba(255,255,255,.12);cursor:pointer}.track.active{background:linear-gradient(135deg,var(--accent),#fff);color:#1b0a18}.now-card{padding:28px;border-radius:28px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}.now-card h3{font-size:32px;margin:12px 0}.equalizer{height:86px;display:flex;gap:8px;align-items:end;margin:24px 0}.equalizer i{width:11px;border-radius:99px;background:linear-gradient(var(--accent),#fff);animation:eq .75s ease-in-out infinite alternate}.equalizer i:nth-child(1){height:35%}.equalizer i:nth-child(2){height:70%;animation-delay:.1s}.equalizer i:nth-child(3){height:45%;animation-delay:.2s}.equalizer i:nth-child(4){height:90%;animation-delay:.3s}.equalizer i:nth-child(5){height:55%;animation-delay:.4s}.equalizer i:nth-child(6){height:75%;animation-delay:.5s}.final{text-align:center}.final h2{max-width:780px;margin-left:auto;margin-right:auto}.final p{max-width:820px;margin:0 auto 20px}.reveal{opacity:0;transform:translateY(24px);transition:.7s ease}.reveal.show{opacity:1;transform:none}.modal{position:fixed;inset:0;background:rgba(0,0,0,.78);display:none;place-items:center;z-index:85;padding:24px}.modal.open{display:grid}.modal img{max-width:min(920px,94vw);max-height:90vh;border-radius:28px;box-shadow:0 25px 90px #000}@keyframes pulse{to{transform:scale(1.16);opacity:.8}}@keyframes float{to{transform:translateY(-13px) rotate(1deg)}}@keyframes eq{from{transform:scaleY(.35);opacity:.48}to{transform:scaleY(1);opacity:1}}@media(max-width:900px){.hero,.mood,.player,.story{grid-template-columns:1fr}.hero{padding-top:120px}.hero-photos{min-height:455px}.fairy-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:210px}.mood-grid{grid-template-columns:1fr}.story-photo{min-height:430px}}@media(max-width:540px){.section{padding:24px}.hero-copy h2,.section h2{letter-spacing:-1px}.hero-photos{min-height:390px}.photo-main{height:310px}.photo-side{height:210px}.photo-mini{height:145px}.fairy-grid{grid-template-columns:1fr;grid-auto-rows:330px}.tile.tall,.tile.wide{grid-row:auto;grid-column:auto}.story-photo img:first-child,.story-photo img:last-child{height:300px}.start-box{padding:28px}}

/* v3 refinements */
.hero{overflow:hidden}.hero-copy{padding:34px;border-radius:34px;max-width:100%}.hero-copy h2,.section h2{font-size:clamp(32px,5.4vw,64px);line-height:1.04;letter-spacing:-1.4px;overflow-wrap:normal}.hero-actions{display:flex;flex-wrap:wrap;gap:8px}.hero-actions .main-btn{margin:0}.typing{max-width:100%}.message-box{font-size:16px}
.lightning-bolt{position:fixed;inset:0;pointer-events:none;z-index:2;opacity:0}.auto-note{margin-top:12px;font-size:14px;color:var(--muted)}
.photo-chapter{display:grid;grid-template-columns:.82fr 1.18fr;gap:24px;align-items:center}.chapter-two{grid-template-columns:1.16fr .84fr}.chapter-text{padding:32px;border-radius:32px}.chapter-text p,.cinematic-line p{color:var(--muted);font-size:18px;line-height:1.75}.triptych{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;min-height:430px}.triptych figure,.duo-frame figure,.window-row figure{position:relative;overflow:hidden;border-radius:30px;border:1px solid rgba(255,255,255,.16);box-shadow:0 24px 70px rgba(0,0,0,.32);cursor:pointer;background:rgba(255,255,255,.08)}.triptych figure:nth-child(1){transform:translateY(34px) rotate(-2deg)}.triptych figure:nth-child(2){transform:translateY(-16px);z-index:2}.triptych figure:nth-child(3){transform:translateY(42px) rotate(2deg)}.triptych img,.duo-frame img,.window-row img{width:100%;height:100%;object-fit:cover;display:block;transition:.45s}.triptych figure:hover img,.duo-frame figure:hover img,.window-row figure:hover img{transform:scale(1.05)}.triptych figcaption,.duo-frame figcaption,.window-row figcaption{position:absolute;left:14px;right:14px;bottom:14px;padding:11px 13px;border-radius:18px;background:rgba(0,0,0,.42);backdrop-filter:blur(12px);color:#fff;font-weight:900}.duo-frame{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;min-height:520px}.duo-frame figure:first-child{height:520px}.duo-frame figure:last-child{height:390px;align-self:center;transform:rotate(2deg)}.cinematic-line{text-align:center;background:var(--card);border:1px solid var(--line);backdrop-filter:blur(18px);box-shadow:0 25px 95px rgba(0,0,0,.34)}.window-row{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:16px;margin-top:24px}.window-row figure{height:360px}.window-row figure:nth-child(2){height:430px;margin-top:-35px}.fairy-grid{display:none}
@media(max-width:900px){.photo-chapter,.chapter-two{grid-template-columns:1fr}.triptych{grid-template-columns:1fr 1fr;min-height:auto}.triptych figure{height:330px!important;transform:none!important}.triptych figure:nth-child(2){grid-row:span 2;height:680px!important}.duo-frame{min-height:auto}.window-row{grid-template-columns:1fr}.window-row figure,.window-row figure:nth-child(2){height:360px;margin-top:0}.hero-copy{padding:28px}}
@media(max-width:540px){.section{width:min(94vw,1120px);padding:22px}.hero{padding-top:80px}.hero-copy h2,.section h2{font-size:clamp(34px,12vw,48px);letter-spacing:-.8px}.typing,.big-text,.final p,.theme-line{font-size:17px}.main-btn{padding:13px 18px}.triptych{grid-template-columns:1fr}.triptych figure,.triptych figure:nth-child(2){height:360px!important}.duo-frame{grid-template-columns:1fr}.duo-frame figure:first-child,.duo-frame figure:last-child{height:390px;transform:none}.photo-main{width:78%;right:0}.photo-side{width:54%}.photo-mini{width:42%;right:3%}}


/* v5 photo and music refinements */
.hero-photos .photo{object-position:center top}
.triptych figure,.duo-frame figure,.window-row figure{background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(0,0,0,.18));display:grid;place-items:center}
.triptych img,.duo-frame img,.window-row img{object-fit:contain;background:rgba(0,0,0,.18);image-orientation:from-image}
.triptych figure:hover img,.duo-frame figure:hover img,.window-row figure:hover img{transform:scale(1.015)}
.story-photo img{object-fit:contain;background:rgba(0,0,0,.15);object-position:center top}
.track-list::before{content:'треки только для выбранной погоды';display:block;color:var(--muted);font-size:13px;margin-bottom:4px;letter-spacing:1px;text-transform:uppercase;font-weight:800}
body.theme-sun .start-screen{background:radial-gradient(circle at 70% 15%,rgba(255,235,150,.70),transparent 28%),linear-gradient(180deg,#ffbd75,#fff1bf)}
body.theme-sun .start-box p{color:rgba(42,22,11,.72)}
body.theme-sun .start-box{background:rgba(255,255,255,.38);color:#2a160b;box-shadow:0 35px 120px rgba(138,78,10,.24)}
body.theme-night.thunder-now{animation:screenFlash .55s ease}
@keyframes screenFlash{0%,100%{filter:none}35%{filter:brightness(1.65)}}
@media(max-width:900px){.triptych img,.duo-frame img,.window-row img{object-fit:contain}.triptych figure:nth-child(2){height:560px!important}}
@media(max-width:540px){.triptych figure,.triptych figure:nth-child(2),.duo-frame figure:first-child,.duo-frame figure:last-child,.window-row figure,.window-row figure:nth-child(2){height:430px!important}}

/* v6: photos without heavy frames, full images visible */
.hero-photos .photo,
.story-photo img,
.triptych figure,
.duo-frame figure,
.window-row figure{
  border:0!important;
  background:transparent!important;
  box-shadow:0 22px 65px rgba(0,0,0,.28)!important;
}

.hero-photos .photo,
.story-photo img,
.triptych img,
.duo-frame img,
.window-row img{
  object-fit:contain!important;
  background:transparent!important;
  image-orientation:from-image;
}

.triptych,
.duo-frame,
.window-row{
  align-items:center;
}

.triptych figure,
.duo-frame figure,
.window-row figure{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
  padding:0!important;
}

.triptych figure{height:390px!important;min-height:390px;}
.triptych figure:nth-child(2){height:430px!important;min-height:430px;}
.duo-frame figure:first-child{height:520px!important;}
.duo-frame figure:last-child{height:430px!important;}
.window-row figure{height:390px!important;}
.window-row figure:nth-child(2){height:460px!important;}

.triptych img,
.duo-frame img,
.window-row img{
  max-width:100%;
  max-height:100%;
  width:auto!important;
  height:auto!important;
  display:block;
  border-radius:28px;
}

.hero-photos .photo{
  padding:0!important;
  border-radius:30px;
}
.photo-main{height:430px!important;}
.photo-side{height:300px!important;}
.photo-mini{height:210px!important;width:40%!important;right:5%!important;}

.compliment{
  color:var(--text)!important;
  background:rgba(255,255,255,.45);
  display:inline-block;
  padding:12px 18px;
  border-radius:18px;
  text-shadow:none!important;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}
body.theme-night .compliment, body.theme-evening .compliment{
  background:rgba(0,0,0,.28);
  color:#fff!important;
}

.nature-joke{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:24px;
  align-items:center;
  background:var(--card);
  border:1px solid var(--line);
  backdrop-filter:blur(18px);
  box-shadow:0 25px 95px rgba(0,0,0,.34);
}
.nature-joke p{color:var(--muted);font-size:20px;line-height:1.75;margin:12px 0;}
.joke-line{font-weight:900;color:var(--text)!important;background:rgba(255,255,255,.18);padding:14px 18px;border-radius:20px;}
.nature-link{text-decoration:none;display:inline-block;}
.river-card{
  min-height:320px;
  border-radius:34px;
  padding:26px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  overflow:hidden;
  position:relative;
  background:linear-gradient(180deg,rgba(75,172,255,.22),rgba(18,54,75,.55)), radial-gradient(circle at 50% 10%,rgba(255,255,255,.45),transparent 25%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 25px 75px rgba(0,0,0,.28);
}
.river-card b{font-size:24px;line-height:1.25;color:#fff;text-shadow:0 3px 16px rgba(0,0,0,.4);position:relative;z-index:2;}
.river-card small{margin-top:10px;color:rgba(255,255,255,.75);line-height:1.5;position:relative;z-index:2;}
.river-video-link{position:relative;z-index:2;margin:0;}
.river-animation{position:absolute;inset:0;overflow:hidden;opacity:.82;}
.river-animation i{position:absolute;left:-20%;width:140%;height:42px;border-radius:50%;background:rgba(255,255,255,.28);filter:blur(10px);animation:riverMove 7s linear infinite;}
.river-animation i:nth-child(1){bottom:36%;animation-delay:0s;}
.river-animation i:nth-child(2){bottom:26%;animation-delay:1.2s;opacity:.7;}
.river-animation i:nth-child(3){bottom:16%;animation-delay:2.4s;opacity:.55;}
.river-animation i:nth-child(4){bottom:6%;animation-delay:3.3s;opacity:.45;}
@keyframes riverMove{from{transform:translateX(-8%) rotate(-2deg)}to{transform:translateX(8%) rotate(2deg)}}

@media(max-width:900px){
  .nature-joke{grid-template-columns:1fr;}
  .triptych figure,.triptych figure:nth-child(2),.duo-frame figure:first-child,.duo-frame figure:last-child,.window-row figure,.window-row figure:nth-child(2){height:auto!important;min-height:0!important;}
  .triptych img,.duo-frame img,.window-row img{width:100%!important;height:auto!important;max-height:none!important;}
}

/* final small fix: remove yellow transparent photo beds/frames, keep layout + animations */
.hero-photos .photo{
  border:0!important;
  background:transparent!important;
  object-fit:cover!important;
  box-shadow:0 22px 65px rgba(0,0,0,.28)!important;
}

.story-photo img{
  border:0!important;
  background:transparent!important;
  object-fit:cover!important;
  box-shadow:0 22px 65px rgba(0,0,0,.26)!important;
}

.triptych figure,
.duo-frame figure,
.window-row figure{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.triptych img,
.duo-frame img,
.window-row img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  background:transparent!important;
  border-radius:28px;
  box-shadow:0 22px 65px rgba(0,0,0,.24)!important;
}

.triptych figure:hover img,
.duo-frame figure:hover img,
.window-row figure:hover img{
  transform:scale(1.035)!important;
}

/* hero note + crop tuning */
.floating-note{
  animation:noteDrift 4.8s ease-in-out infinite alternate;
  will-change:transform;
}

.photo-mini{
  object-position:center 76%!important;
}

@keyframes noteDrift{
  0%{transform:translateY(0) translateX(0) rotate(-.6deg)}
  50%{transform:translateY(-10px) translateX(5px) rotate(.7deg)}
  100%{transform:translateY(7px) translateX(-4px) rotate(-.3deg)}
}

/* sun mode callout */
.sun-callout{
  position:fixed;
  right:8.5%;
  top:155px;
  z-index:1;
  color:#2a160b;
  font-family:"Comic Sans MS","Segoe Print",cursive;
  font-weight:900;
  line-height:1.05;
  text-align:center;
  transform:rotate(-8deg);
  opacity:0;
  pointer-events:none;
  transition:opacity .45s ease, transform .45s ease;
}
.sun-callout span{font-size:24px;display:block;position:relative;}
.sun-callout span::before,
.sun-callout span::after{
  position:absolute;
  top:-42px;
  font-size:30px;
  line-height:1;
}
.sun-callout span::before{content:"↖";left:16px;}
.sun-callout span::after{content:"↗";right:18px;}
.sun-callout small{display:none;}
.sun-callout::before,
.sun-callout::after{
  content:"";
  position:absolute;
  width:48px;
  height:30px;
  border-left:3px solid currentColor;
  border-bottom:3px solid currentColor;
  border-radius:0 0 0 28px;
}
.sun-callout::before{
  right:76px;
  top:-28px;
  transform:rotate(28deg);
}
.sun-callout::after{
  right:-18px;
  top:8px;
  transform:rotate(-58deg);
}
body.theme-sun .sun-callout{
  opacity:1;
  transform:translateY(0) rotate(-8deg);
  animation:sunCalloutFloat 4.6s ease-in-out infinite alternate;
}
body.theme-evening .sun-callout,
body.theme-night .sun-callout{opacity:0;}
@keyframes sunCalloutFloat{
  to{transform:translateY(-7px) rotate(-5deg);}
}

/* garden notes */
.garden-note{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:34px;
  align-items:center;
}
.garden-note:not(.open){
  grid-template-columns:minmax(280px,560px);
  justify-content:center;
}
.garden-note:not(.open) .note-two{
  display:none;
}
.paper-note{
  min-height:430px;
  padding:38px 34px;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:9px 26px 14px 30px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.22),transparent 30%),
    radial-gradient(circle at 18% 12%,rgba(120,72,28,.12),transparent 26%),
    linear-gradient(180deg,#f7ead6,#ecd6bb);
  box-shadow:0 24px 70px rgba(64,31,10,.25);
  color:#2d160c;
  font-family:"Comic Sans MS","Segoe Print",cursive;
}
.paper-note::before{
  content:"";
  position:absolute;
  inset:12px;
  border:1px solid rgba(78,45,20,.12);
  border-radius:inherit;
  pointer-events:none;
}
.paper-note h2{
  font-size:clamp(34px,4vw,52px);
  line-height:1;
  margin:0 0 22px;
  text-align:center;
  text-decoration:underline;
  text-decoration-color:#bf5656;
  text-decoration-thickness:3px;
  text-underline-offset:10px;
  letter-spacing:0;
}
.paper-note p{
  margin:34px 0 0;
  padding:12px 24px;
  border:1px solid rgba(111,45,38,.42);
  border-radius:999px;
  font-size:20px;
  font-weight:900;
}
.note-one{transform:rotate(-1.6deg);}
.note-two{
  transform:rotate(1.4deg) translateY(18px);
  opacity:0;
  filter:saturate(.65);
  transition:opacity .45s ease, filter .45s ease, transform .45s ease;
}
.garden-note.open .note-two{
  opacity:1;
  filter:saturate(1);
  transform:rotate(1deg) translateY(0);
}
.rose-button,
.rose-glow{
  width:190px;
  height:245px;
  position:relative;
  border:0;
  background:transparent;
}
.rose-button{cursor:pointer;transition:transform .25s ease;}
.rose-button:hover{transform:translateY(-4px) rotate(-2deg);}
.rose-bloom{
  position:absolute;
  left:50%;
  top:28px;
  width:104px;
  height:88px;
  transform:translateX(-50%);
}
.rose-bloom i{
  position:absolute;
  inset:18px;
  border-radius:52% 44% 55% 45%;
  background:linear-gradient(135deg,#ffc0cb,#bd5260);
  box-shadow:inset 0 0 0 2px rgba(116,24,40,.16);
}
.rose-bloom i:nth-child(1){transform:translate(-25px,10px) rotate(-32deg);}
.rose-bloom i:nth-child(2){transform:translate(24px,8px) rotate(34deg);}
.rose-bloom i:nth-child(3){transform:translate(-5px,-18px) rotate(8deg);}
.rose-bloom i:nth-child(4){transform:translate(0,18px) rotate(-8deg);}
.rose-bloom i:nth-child(5){inset:30px;background:linear-gradient(135deg,#ffe3e7,#9f3448);}
.rose-stem{
  position:absolute;
  left:50%;
  top:105px;
  width:5px;
  height:126px;
  border-radius:99px;
  background:#596638;
  transform:translateX(-50%) rotate(2deg);
}
.rose-leaf{
  position:absolute;
  width:56px;
  height:28px;
  top:155px;
  border-radius:60% 0 60% 0;
  background:linear-gradient(135deg,#87955f,#526638);
}
.leaf-left{left:42px;transform:rotate(-20deg);}
.leaf-right{right:40px;top:177px;transform:scaleX(-1) rotate(-22deg);}
.rose-glow::before{
  content:"";
  position:absolute;
  left:25px;
  right:25px;
  top:6px;
  height:96px;
  border-radius:50%;
  background:rgba(255,110,130,.14);
  filter:blur(4px);
}
.answer-paper{
  width:min(320px,88%);
  margin-top:-34px;
  padding:22px 26px;
  transform:rotate(-2deg);
  background:#f5e1c6;
  box-shadow:0 14px 38px rgba(64,31,10,.18);
  border-radius:8px;
  font-size:32px;
  line-height:1.15;
  text-align:center;
  color:#6a2630;
  font-weight:900;
}

@media(max-width:900px){
  .sun-callout{right:4%;top:130px;}
  .garden-note{grid-template-columns:1fr;}
}

@media(max-width:540px){
  .sun-callout{top:112px;right:4%;transform:scale(.82) rotate(-8deg);transform-origin:top right;}
  body.theme-sun .sun-callout{animation:none;transform:scale(.82) rotate(-8deg);}
  .paper-note{min-height:380px;padding:30px 22px;}
  .rose-button,.rose-glow{transform:scale(.86);}
}

/* garden PNG replacement */
.garden-note{
  gap:28px;
}
.garden-note:not(.open){
  grid-template-columns:minmax(280px,760px);
}
.paper-note{
  min-height:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  border-radius:0!important;
}
.paper-note::before{display:none!important;}
.rose-button{
  width:100%!important;
  height:auto!important;
  min-height:0;
  display:grid;
  place-items:center;
  position:relative;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}
.garden-paper-img,
.garden-answer-img{
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 24px 55px rgba(58,28,10,.28));
}
.garden-rose-img{
  position:absolute;
  width:31%;
  min-width:150px;
  left:50%;
  top:42%;
  transform:translate(-50%,-50%);
  border-radius:18px;
  box-shadow:0 18px 50px rgba(71,28,16,.22);
  transition:transform .28s ease, filter .28s ease;
}
.rose-button:hover .garden-rose-img{
  transform:translate(-50%,-54%) scale(1.04) rotate(-2deg);
  filter:saturate(1.12);
}
.note-two{
  position:relative;
}
.garden-note.open .note-one{
  animation:gardenFirstNote .45s ease both;
}
.garden-note.open .note-two{
  animation:gardenSecondNote .55s ease both;
}
.garden-petals-img{
  position:absolute;
  width:38%;
  right:-4%;
  bottom:-8%;
  opacity:.72;
  mix-blend-mode:multiply;
  transform:rotate(-8deg);
  pointer-events:none;
}
@keyframes gardenFirstNote{
  to{transform:translateX(-8px) rotate(-1deg);}
}
@keyframes gardenSecondNote{
  from{opacity:0;transform:translateY(18px) rotate(2deg) scale(.96);}
  to{opacity:1;transform:translateY(0) rotate(1deg) scale(1);}
}

@media(max-width:900px){
  .garden-note.open{grid-template-columns:1fr;}
  .garden-note.open .note-one{display:none;}
  .garden-rose-img{width:34%;min-width:120px;}
}

@media(max-width:540px){
  .garden-note:not(.open){grid-template-columns:1fr;}
  .garden-rose-img{width:38%;min-width:92px;}
  .garden-petals-img{width:46%;right:-10%;bottom:-10%;}
}

/* final garden redesign with generated cohesive cards */
.sun-callout{
  top:220px;
  right:8%;
  z-index:0;
}
.sun-callout::before{
  width:58px;
  height:42px;
  right:56px;
  top:-48px;
  border-left:0;
  border-bottom:0;
  border-right:3px solid currentColor;
  border-top:3px solid currentColor;
  border-radius:0 30px 0 0;
  transform:rotate(-18deg);
}
.sun-callout::after{
  width:54px;
  height:36px;
  right:-2px;
  top:-42px;
  border-left:3px solid currentColor;
  border-bottom:0;
  border-top:3px solid currentColor;
  border-radius:30px 0 0 0;
  transform:rotate(22deg);
}
.garden-note{
  width:min(980px,92vw);
  grid-template-columns:1fr 1fr;
  gap:26px;
}
.garden-note:not(.open){
  grid-template-columns:minmax(280px,760px);
}
.rose-button{
  overflow:visible;
  filter:drop-shadow(0 25px 60px rgba(62,31,12,.22));
}
.garden-paper-img,
.garden-answer-img{
  border-radius:20px;
}
.garden-title,
.garden-hint,
.answer-paper{
  position:absolute;
  left:50%;
  z-index:2;
  font-family:"Segoe Print","Comic Sans MS",cursive;
  color:#2d160c;
  text-align:center;
  letter-spacing:0;
  text-shadow:0 2px 12px rgba(255,240,210,.55);
}
.garden-title{
  top:13%;
  transform:translateX(-50%) rotate(-1deg);
  width:82%;
  font-size:clamp(26px,3.5vw,46px);
  line-height:1.1;
}
.garden-hint{
  bottom:10%;
  transform:translateX(-50%) rotate(-2deg);
  padding:10px 22px;
  border:1px solid rgba(122,58,44,.36);
  border-radius:999px;
  font-size:clamp(16px,2vw,22px);
  font-weight:900;
  background:rgba(255,238,210,.46);
}
.note-one::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:18%;
  width:28px;
  height:34px;
  border-right:3px solid rgba(73,32,24,.7);
  border-bottom:3px solid rgba(73,32,24,.7);
  border-radius:0 0 18px 0;
  transform:translateX(-50%) rotate(35deg);
  pointer-events:none;
}
.answer-paper{
  width:42%;
  left:50%;
  bottom:16%;
  transform:translateX(-50%) rotate(-1.5deg);
  padding:0;
  background:transparent;
  box-shadow:none;
  border-radius:0;
  font-size:clamp(22px,2.8vw,36px);
  line-height:1.15;
  color:#7a2732;
}
.answer-title{
  top:9%;
}
.garden-note.open .note-two{
  display:block;
}
.garden-petals-img,
.garden-rose-img{
  display:none!important;
}

@media(max-width:900px){
  .sun-callout{top:198px;right:5%;}
  .garden-note.open{grid-template-columns:1fr;}
  .garden-note.open .note-one{display:none;}
  .answer-paper{width:48%;bottom:16%;}
}

@media(max-width:540px){
  .sun-callout{
    top:178px;
    right:2%;
    transform:scale(.78) rotate(-8deg);
    transform-origin:top right;
  }
  body.theme-sun .sun-callout{
    transform:scale(.78) rotate(-8deg);
  }
  .garden-title{font-size:clamp(20px,7vw,30px);top:12%;}
  .garden-hint{font-size:15px;padding:8px 16px;bottom:8%;}
  .answer-paper{width:52%;font-size:clamp(16px,5.8vw,24px);bottom:15%;}
}

/* final sun pointer + supplied garden cards */
.sun-callout{
  top:265px;
  right:8.2%;
}
.sun-callout span{
  font-size:23px;
}
.sun-callout span::before,
.sun-callout span::after,
.sun-callout::after{
  display:none!important;
}
.sun-callout::before{
  display:block!important;
  content:"";
  position:absolute;
  width:86px;
  height:74px;
  right:42px;
  top:-92px;
  border:0;
  border-left:3px solid currentColor;
  border-top:3px solid currentColor;
  border-radius:70px 0 0 0;
  transform:rotate(18deg);
}
.sun-callout span::after{
  content:"";
}
.sun-callout::after{
  display:block!important;
  content:"";
  position:absolute;
  width:14px;
  height:14px;
  right:122px;
  top:-93px;
  border-top:3px solid currentColor;
  border-left:3px solid currentColor;
  transform:rotate(5deg);
  border-radius:2px 0 0 0;
}
.garden-title,
.garden-hint,
.answer-paper,
.note-one::after{
  display:none!important;
}
.garden-paper-img,
.garden-answer-img{
  border-radius:18px;
  filter:drop-shadow(0 24px 55px rgba(58,28,10,.24));
}

@media(max-width:900px){
  .sun-callout{top:235px;right:5%;}
}

@media(max-width:540px){
  .sun-callout{top:208px;right:2%;}
}

/* booking start screen */
.start-screen{
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 18%,rgba(255,213,151,.45),transparent 24%),
    radial-gradient(circle at 82% 14%,rgba(255,188,177,.36),transparent 26%),
    radial-gradient(circle at 50% 105%,rgba(255,246,220,.72),transparent 36%),
    linear-gradient(145deg,#6e3b35 0%,#b66d5b 42%,#f2c69a 100%)!important;
  transition:opacity .9s ease, transform .9s ease, background 1.3s ease;
}
.start-screen::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 22%,rgba(255,232,169,.88) 0 3px,transparent 4px),
    radial-gradient(circle at 30% 16%,rgba(255,226,154,.72) 0 2px,transparent 3px),
    radial-gradient(circle at 72% 24%,rgba(255,232,169,.70) 0 3px,transparent 4px),
    radial-gradient(circle at 86% 34%,rgba(255,236,180,.62) 0 2px,transparent 3px);
  filter:blur(.2px);
  opacity:.9;
}
.start-screen::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(39,15,18,.22),transparent 24%,transparent 76%,rgba(39,15,18,.18));
  pointer-events:none;
}
.booking-card{
  position:relative;
  z-index:2;
  width:min(610px,91vw);
  padding:42px 40px 38px!important;
  border:1px solid rgba(255,224,166,.74)!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,rgba(255,255,255,.34),rgba(255,246,226,.16))!important;
  color:#3a1b16!important;
  box-shadow:0 34px 110px rgba(61,24,20,.34), inset 0 0 0 1px rgba(255,255,255,.24)!important;
  backdrop-filter:blur(22px)!important;
}
.booking-card .mini-label{
  color:rgba(58,27,22,.7);
}
.booking-copy{
  margin:16px 0 26px!important;
  color:#3a1b16!important;
  font-size:clamp(24px,3.4vw,34px);
  line-height:1.42!important;
  font-weight:700;
}
.booking-control{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:center;
}
.booking-control input{
  min-width:0;
  height:54px;
  border-radius:999px;
  border:1px solid rgba(118,63,44,.18);
  background:rgba(255,250,238,.72);
  color:#321611;
  padding:0 20px;
  font:700 16px inherit;
  outline:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.booking-control input::placeholder{color:rgba(58,27,22,.48);}
.booking-control input:focus{
  border-color:rgba(173,111,48,.72);
  box-shadow:0 0 0 4px rgba(255,222,158,.25);
}
.booking-control .main-btn{
  height:54px;
  margin:0;
  padding:0 24px;
  border:1px solid rgba(128,75,28,.16);
  background:linear-gradient(135deg,#ffe3a1,#fff7dd);
  box-shadow:0 16px 36px rgba(87,38,23,.20);
}
.booking-status{
  min-height:52px;
  margin:18px 0 0!important;
  color:rgba(58,27,22,.76)!important;
  font-size:16px!important;
  line-height:1.55!important;
}
.booking-card.booking-error{
  animation:bookingShake .28s ease;
  border-color:rgba(164,69,62,.72)!important;
}
.booking-card.booking-error .booking-status{color:#7b2d27!important;}
.booking-card.booking-success{
  border-color:rgba(197,146,72,.86)!important;
}
.booking-card.booking-success .booking-status{color:#4c4f21!important;}
.booking-letter{
  position:absolute;
  left:50%;
  top:50%;
  width:112px;
  height:78px;
  border-radius:8px;
  background:linear-gradient(180deg,#fff2d5,#eecb9b);
  box-shadow:0 22px 55px rgba(65,29,18,.28);
  opacity:0;
  transform:translate(-50%,-50%) scale(.6) rotate(-7deg);
  pointer-events:none;
}
.booking-letter::before{
  content:"";
  position:absolute;
  inset:0;
  clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);
  background:linear-gradient(135deg,rgba(181,119,63,.22),transparent 45%);
}
.start-roses{
  position:absolute;
  z-index:1;
  width:260px;
  height:300px;
  pointer-events:none;
  opacity:.74;
  filter:drop-shadow(0 18px 32px rgba(76,29,22,.22));
}
.start-roses-left{left:-46px;bottom:-42px;transform:rotate(-12deg);}
.start-roses-right{right:-42px;top:-38px;transform:scaleX(-1) rotate(-18deg);}
.start-roses i{
  position:absolute;
  width:118px;
  height:118px;
  border-radius:50%;
  background:
    radial-gradient(circle at 52% 48%,#9f3b48 0 8%,#d56c75 9% 22%,#efb0aa 23% 36%,transparent 37%),
    conic-gradient(from 20deg,#d35f72,#f2b1ad,#c94f64,#f4c2b8,#b84655,#d35f72);
}
.start-roses i:nth-child(1){left:26px;top:22px;}
.start-roses i:nth-child(2){left:118px;top:112px;transform:scale(.75) rotate(22deg);}
.start-roses i:nth-child(3){left:18px;top:174px;transform:scale(.55) rotate(-18deg);}
.start-petals{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:3;
}
.start-petals i{
  position:absolute;
  width:24px;
  height:13px;
  border-radius:80% 20% 80% 20%;
  background:linear-gradient(135deg,#ffd3d0,#d96a78);
  opacity:.55;
  animation:startPetal 10s linear infinite;
}
.start-petals i:nth-child(1){left:8%;top:18%;animation-delay:-1s;}
.start-petals i:nth-child(2){left:20%;top:72%;animation-delay:-4s;}
.start-petals i:nth-child(3){left:34%;top:12%;animation-delay:-6s;}
.start-petals i:nth-child(4){left:48%;top:82%;animation-delay:-2s;}
.start-petals i:nth-child(5){left:63%;top:20%;animation-delay:-7s;}
.start-petals i:nth-child(6){left:76%;top:74%;animation-delay:-3s;}
.start-petals i:nth-child(7){left:88%;top:38%;animation-delay:-5s;}
.start-petals i:nth-child(8){left:12%;top:48%;animation-delay:-8s;}
.start-preview{
  position:absolute;
  inset:0;
  z-index:0;
  opacity:0;
  background:linear-gradient(180deg,#fff4da,#fff9ed);
  transition:opacity 1s ease;
}
.start-preview span{
  position:absolute;
  border-radius:28px;
  background:rgba(255,255,255,.6);
  box-shadow:0 22px 70px rgba(138,86,44,.12);
}
.start-preview span:nth-child(1){left:7%;top:12%;width:38%;height:38%;}
.start-preview span:nth-child(2){right:8%;top:16%;width:28%;height:46%;}
.start-preview span:nth-child(3){left:18%;bottom:10%;width:58%;height:20%;}
.start-screen.opening{
  background:linear-gradient(180deg,#fff0cf,#fff9ea)!important;
}
.start-screen.opening .start-preview{opacity:1;}
.start-screen.opening .booking-card{
  animation:bookingOpen 1.35s ease forwards;
}
.start-screen.opening .booking-card > :not(.booking-letter){
  animation:bookingContentOut .5s ease forwards;
}
.start-screen.opening .booking-letter{
  animation:letterFly 1.25s ease forwards;
}
.start-screen.opening .start-petals i{
  animation-duration:3s;
  opacity:.82;
}
@keyframes bookingShake{
  20%{transform:translateX(-5px)}
  45%{transform:translateX(5px)}
  70%{transform:translateX(-3px)}
}
@keyframes startPetal{
  from{transform:translateY(-20vh) rotate(0deg)}
  to{transform:translateY(120vh) rotate(380deg)}
}
@keyframes bookingContentOut{
  to{opacity:0;transform:translateY(-8px)}
}
@keyframes bookingOpen{
  45%{transform:scale(.86);opacity:.9}
  100%{transform:scale(.58) translateY(-18px);opacity:0}
}
@keyframes letterFly{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.6) rotate(-7deg)}
  35%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(3deg)}
  100%{opacity:0;transform:translate(-50%,-190%) scale(.68) rotate(12deg)}
}
@media(max-width:720px){
  .booking-card{padding:32px 22px 28px!important;}
  .booking-control{grid-template-columns:1fr;}
  .booking-control .main-btn{width:100%;}
  .start-roses{width:190px;height:230px;}
}

/* luxury invitation start screen */
.start-screen{
  place-items:center;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.9),transparent 22%),
    radial-gradient(circle at 78% 12%,rgba(255,220,190,.72),transparent 26%),
    radial-gradient(circle at 52% 78%,rgba(255,239,211,.86),transparent 35%),
    linear-gradient(135deg,#fff7ec 0%,#f8ddcd 46%,#fff2df 100%)!important;
}
.start-screen::after{
  background:
    linear-gradient(90deg,rgba(255,255,255,.22),transparent 20%,transparent 80%,rgba(255,255,255,.2)),
    radial-gradient(circle at 50% 45%,rgba(255,255,255,.34),transparent 38%)!important;
}
.booking-card{
  width:min(640px,90vw);
  min-height:390px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:54px 58px 46px!important;
  border-radius:32px!important;
  border:1px solid rgba(211,159,85,.56)!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.56),rgba(255,245,228,.28)),
    radial-gradient(circle at 18% 10%,rgba(255,255,255,.58),transparent 28%),
    linear-gradient(180deg,rgba(255,248,233,.9),rgba(245,221,194,.82))!important;
  box-shadow:
    0 36px 90px rgba(165,104,69,.18),
    0 10px 34px rgba(116,72,42,.11),
    inset 0 0 0 1px rgba(255,255,255,.62)!important;
  color:#382018!important;
}
.booking-card::before,
.booking-card::after{
  content:"";
  position:absolute;
  top:50%;
  width:28px;
  height:56px;
  border-radius:999px;
  background:rgba(255,237,214,.78);
  box-shadow:inset 0 0 0 1px rgba(210,157,92,.22);
}
.booking-card::before{left:-14px;transform:translateY(-50%);}
.booking-card::after{right:-14px;transform:translateY(-50%);}
.booking-card .mini-label{
  color:#9b6a46;
  letter-spacing:3px;
  font-size:12px;
  margin-bottom:22px;
}
.booking-copy{
  width:min(470px,100%);
  margin:0 auto!important;
  color:#44251d!important;
  font-size:clamp(25px,3vw,36px);
  line-height:1.22!important;
  font-weight:750;
}
.booking-copy-small{
  margin-top:12px!important;
  color:rgba(68,37,29,.72)!important;
  font-size:clamp(20px,2.3vw,27px);
  font-weight:600;
}
.booking-control{
  width:min(390px,100%);
  margin:34px auto 0;
  display:block;
  position:relative;
}
.booking-control::after{
  content:"Enter";
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.58);
  color:rgba(92,54,39,.54);
  font-size:12px;
  font-weight:800;
  letter-spacing:.7px;
  pointer-events:none;
}
.booking-control input{
  width:100%;
  height:58px;
  padding:0 78px 0 22px;
  border-radius:18px;
  border:1px solid rgba(172,111,70,.22);
  background:rgba(255,255,255,.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 14px 34px rgba(142,83,51,.08);
  color:#3b2119;
  font-weight:700;
}
.booking-status{
  width:min(430px,100%);
  min-height:76px;
  margin:20px auto 0!important;
  white-space:pre-line;
  font-size:16px!important;
}
.booking-card.booking-success .booking-control{
  opacity:.46;
}
.booking-card.booking-success .booking-status{
  color:#7c5b25!important;
}
.booking-card.booking-error .booking-status{
  color:#9a4b46!important;
}
.start-roses{
  opacity:.28;
  filter:blur(.2px) drop-shadow(0 18px 36px rgba(186,105,92,.18));
}
.start-roses-left{left:-30px;bottom:-54px;}
.start-roses-right{right:-34px;top:-54px;}
.start-petals{z-index:1;}
.start-petals i{
  width:28px;
  height:15px;
  opacity:.34;
  background:linear-gradient(135deg,#ffd9d5,#dc7c8a);
  animation:startPetal 13s linear infinite;
}
.start-screen.opening{
  background:linear-gradient(180deg,#fff8ed,#fffdf6)!important;
}
.start-screen.opening .booking-card{
  animation:ticketDissolve 1.55s cubic-bezier(.2,.78,.24,1) forwards;
}
.start-screen.opening .booking-letter{
  animation:letterFly 1.35s ease forwards;
}
.start-screen.opening .start-petals i{
  animation-name:petalBurst;
  animation-duration:1.8s;
  animation-iteration-count:1;
  opacity:.9;
}
@keyframes ticketDissolve{
  0%{opacity:1;transform:translateY(0) scale(1);filter:none}
  45%{opacity:.82;transform:translateY(-8px) scale(.96);filter:blur(.2px)}
  100%{opacity:0;transform:translateY(-34px) scale(.72) rotate(-4deg);filter:blur(8px)}
}
@keyframes petalBurst{
  from{transform:translate(0,0) rotate(0deg) scale(1)}
  to{transform:translate(var(--burst-x, 90px),-46vh) rotate(420deg) scale(1.4)}
}
.start-petals i:nth-child(1){--burst-x:-220px;}
.start-petals i:nth-child(2){--burst-x:180px;}
.start-petals i:nth-child(3){--burst-x:-110px;}
.start-petals i:nth-child(4){--burst-x:260px;}
.start-petals i:nth-child(5){--burst-x:-260px;}
.start-petals i:nth-child(6){--burst-x:120px;}
.start-petals i:nth-child(7){--burst-x:-180px;}
.start-petals i:nth-child(8){--burst-x:220px;}

@media(max-width:720px){
  .booking-card{
    min-height:360px;
    padding:42px 24px 34px!important;
  }
  .booking-card::before,
  .booking-card::after{display:none;}
  .booking-control::after{display:none;}
  .booking-control input{padding-right:22px;}
}

/* multi-concept romantic invitation */
.start-screen{
  background:
    radial-gradient(circle at 20% 16%,rgba(255,255,255,.95),transparent 24%),
    radial-gradient(circle at 82% 20%,rgba(255,211,194,.62),transparent 27%),
    radial-gradient(circle at 50% 72%,rgba(255,232,199,.8),transparent 34%),
    linear-gradient(135deg,#fffaf0 0%,#f9dfcf 48%,#fff4e7 100%)!important;
}
.start-screen::before{
  background-image:url("start-assets/start-light.png"),url("start-assets/start-light.png"),url("start-assets/start-light.png");
  background-repeat:no-repeat;
  background-size:90px 90px,68px 68px,120px 120px;
  background-position:18% 24%,76% 22%,52% 80%;
  opacity:.8;
  filter:none;
}
.booking-card{
  width:min(780px,92vw);
  min-height:0;
  aspect-ratio:1180/760;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  display:grid;
  place-items:center;
  overflow:visible;
}
.booking-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  z-index:0;
  pointer-events:none;
  transition:opacity .35s ease, transform .35s ease, filter .35s ease;
}
.booking-card .mini-label,
.booking-copy,
.booking-copy-small,
.booking-control,
.booking-status{
  position:relative;
  z-index:2;
}
.booking-card .mini-label{
  position:absolute;
  top:17%;
  left:50%;
  transform:translateX(-50%);
  margin:0;
  font-size:11px;
  color:#a46d46;
  letter-spacing:3.4px;
}
.booking-copy{
  position:absolute!important;
  top:28%;
  left:50%;
  transform:translateX(-50%);
  width:min(520px,70%);
  margin:0!important;
  font-size:clamp(24px,3vw,34px);
  line-height:1.18!important;
}
.booking-copy-small{
  position:absolute!important;
  top:39%;
  left:50%;
  transform:translateX(-50%);
  width:min(480px,66%);
  margin:0!important;
  font-size:clamp(18px,2.2vw,25px);
}
.booking-control{
  position:absolute;
  left:50%;
  bottom:18%;
  transform:translateX(-50%);
  width:min(360px,55%);
  margin:0;
}
.booking-control input{
  height:54px;
  border-radius:18px;
  background:rgba(255,255,255,.56);
  backdrop-filter:blur(10px);
}
.booking-status{
  position:absolute!important;
  left:50%;
  bottom:8%;
  transform:translateX(-50%);
  width:min(520px,72%);
  min-height:44px;
  margin:0!important;
}
.booking-card.booking-error .booking-art{
  animation:bookingShake .28s ease;
  filter:saturate(.9);
}
.booking-card.booking-success .booking-art{
  filter:saturate(1.08) brightness(1.02);
}
.booking-letter{
  width:170px;
  height:auto;
  border-radius:0;
  background:none;
  box-shadow:none;
}
.concept-switcher{
  position:absolute;
  left:50%;
  bottom:28px;
  z-index:4;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  width:min(760px,92vw);
}
.concept-switcher button{
  border:1px solid rgba(171,113,70,.18);
  border-radius:999px;
  padding:9px 13px;
  background:rgba(255,255,255,.35);
  color:rgba(72,41,31,.72);
  font:800 12px inherit;
  cursor:pointer;
  backdrop-filter:blur(12px);
  transition:.22s ease;
}
.concept-switcher button:hover,
.concept-switcher button.active-choice{
  color:#3b2119;
  background:rgba(255,255,255,.68)!important;
  box-shadow:0 10px 28px rgba(139,83,47,.12);
}
.start-petals i{
  background-image:url("start-assets/start-petal-1.png");
  background-color:transparent;
  background-size:contain;
  background-repeat:no-repeat;
  width:44px;
  height:32px;
  border-radius:0;
}
.start-petals i:nth-child(2n){background-image:url("start-assets/start-petal-2.png");}
.start-petals i:nth-child(3n){background-image:url("start-assets/start-petal-3.png");}
.start-screen.opening .concept-switcher{
  opacity:0;
  pointer-events:none;
}
.start-screen.opening .booking-art{
  animation:ticketDissolve 1.55s cubic-bezier(.2,.78,.24,1) forwards;
}
.start-screen.opening .booking-card > :not(.booking-letter):not(.booking-art){
  animation:bookingContentOut .45s ease forwards;
}
.start-screen.opening .booking-letter{
  animation:letterFly 1.3s ease forwards;
}
@media(max-width:720px){
  .booking-card{width:min(96vw,780px);}
  .booking-card .mini-label{top:15%;font-size:10px;}
  .booking-copy{width:76%;font-size:clamp(20px,6vw,28px);top:25%;}
  .booking-copy-small{width:74%;font-size:clamp(16px,4.7vw,22px);top:39%;}
  .booking-control{width:68%;bottom:16%;}
  .booking-status{width:78%;bottom:4%;font-size:14px!important;}
  .concept-switcher{bottom:14px;}
  .concept-switcher button{padding:8px 10px;font-size:11px;}
}

/* final booking invitation */
.start-screen{
  place-items:center!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 46%,rgba(255,255,255,.95),transparent 28%),
    radial-gradient(circle at 28% 30%,rgba(255,224,205,.58),transparent 30%),
    radial-gradient(circle at 72% 68%,rgba(245,199,193,.42),transparent 34%),
    linear-gradient(145deg,#fffaf3 0%,#f9e8dc 48%,#fff6ec 100%)!important;
  isolation:isolate;
  transition:opacity 1.1s ease, transform 1.1s ease, background 1.4s ease, filter 1.4s ease!important;
}
.start-screen.hide{
  opacity:0!important;
  pointer-events:none!important;
  transform:scale(1.01)!important;
  transition:opacity .45s ease, transform .45s ease!important;
}
.start-screen::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 18% 24%,rgba(255,255,255,.72) 0 2px,transparent 3px),
    radial-gradient(circle at 36% 18%,rgba(218,164,116,.22) 0 1px,transparent 2px),
    radial-gradient(circle at 62% 28%,rgba(255,255,255,.7) 0 2px,transparent 3px),
    radial-gradient(circle at 82% 58%,rgba(205,137,125,.18) 0 1px,transparent 2px),
    radial-gradient(circle at 42% 78%,rgba(255,255,255,.58) 0 2px,transparent 3px)!important;
  background-size:360px 320px!important;
  opacity:.7!important;
  animation:lightMotes 12s ease-in-out infinite alternate;
}
.start-screen::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.36),transparent 36%,rgba(255,255,255,.24)),
    radial-gradient(ellipse at 50% 48%,rgba(255,255,255,.44),transparent 46%)!important;
  z-index:-1;
}
.start-glow{
  position:absolute;
  inset:12% 16%;
  border-radius:48%;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.65),rgba(255,225,208,.22) 48%,transparent 72%);
  filter:blur(24px);
  opacity:0;
  animation:inviteFade .9s ease .12s forwards;
}
.start-roses,
.concept-switcher,
.booking-art{
  display:none!important;
}
.booking-card{
  position:relative!important;
  z-index:2!important;
  width:min(760px,91vw)!important;
  min-height:360px!important;
  aspect-ratio:auto!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  padding:52px 72px 46px!important;
  overflow:visible!important;
  text-align:center!important;
  border-radius:24px!important;
  border:1px solid rgba(196,139,76,.34)!important;
  background:
    linear-gradient(90deg,transparent 0 76px,rgba(203,148,91,.18) 77px 78px,transparent 79px),
    radial-gradient(circle at 18% 20%,rgba(255,255,255,.82),transparent 28%),
    radial-gradient(circle at 76% 84%,rgba(245,213,190,.56),transparent 32%),
    linear-gradient(135deg,#fffdfa 0%,#fff3e3 47%,#f8dfca 100%)!important;
  box-shadow:0 30px 90px rgba(134,83,56,.18),0 12px 30px rgba(185,123,86,.12),inset 0 0 0 1px rgba(255,255,255,.66)!important;
  color:#48281e!important;
  backdrop-filter:none!important;
  transform-origin:center;
  opacity:0;
  animation:ticketArrive 1s cubic-bezier(.22,.74,.28,1) .55s forwards;
}
.booking-card.booking-ready{
  opacity:1!important;
  transform:translateY(0) scale(1)!important;
}
.booking-card::before,
.booking-card::after{
  content:""!important;
  position:absolute!important;
  top:50%!important;
  width:42px!important;
  height:42px!important;
  border-radius:50%!important;
  background:#fff7ee!important;
  box-shadow:inset 0 0 0 1px rgba(196,139,76,.22)!important;
  z-index:3!important;
}
.booking-card::before{left:-21px!important;transform:translateY(-50%)!important;}
.booking-card::after{right:-21px!important;transform:translateY(-50%)!important;}
.booking-card .mini-label{
  position:static!important;
  transform:none!important;
  margin:0 0 20px!important;
  color:#a47043!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:13px!important;
  line-height:1.3!important;
  letter-spacing:3.8px!important;
  font-weight:700!important;
  opacity:0;
  animation:inviteFade .8s ease 1.05s forwards;
}
.booking-copy-wrap{
  width:min(520px,100%);
}
.booking-copy{
  position:static!important;
  transform:none!important;
  width:auto!important;
  margin:0!important;
  color:#4c2a20!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(24px,3.2vw,35px)!important;
  line-height:1.25!important;
  font-weight:600!important;
  opacity:0;
  animation:inviteFade .8s ease 1.55s forwards;
}
.booking-copy-small{
  margin-top:10px!important;
  color:rgba(76,42,32,.72)!important;
  font-family:Inter,Arial,sans-serif!important;
  font-size:clamp(17px,2vw,21px)!important;
  line-height:1.55!important;
  font-weight:500!important;
  animation-delay:1.7s!important;
}
.booking-confirmed{
  color:#8a6428!important;
}
.booking-control{
  position:relative!important;
  left:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:min(360px,100%)!important;
  margin:31px auto 0!important;
  opacity:0;
  animation:inviteFade .8s ease 2.2s forwards;
}
.booking-control::after{
  content:"Enter"!important;
  position:absolute!important;
  right:13px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  padding:5px 9px!important;
  border-radius:9px!important;
  border:1px solid rgba(178,128,75,.23)!important;
  background:rgba(255,255,255,.72)!important;
  color:#a06e43!important;
  font:700 11px/1 Inter,Arial,sans-serif!important;
  letter-spacing:.4px!important;
  box-shadow:0 5px 14px rgba(151,95,54,.1),inset 0 -1px 0 rgba(169,116,70,.1)!important;
  pointer-events:none!important;
}
.booking-control input{
  width:100%!important;
  height:58px!important;
  padding:0 78px 0 20px!important;
  border-radius:16px!important;
  border:1px solid rgba(181,124,80,.24)!important;
  outline:0!important;
  background:rgba(255,255,255,.55)!important;
  color:#4a281d!important;
  font:600 17px/1 Inter,Arial,sans-serif!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 16px 34px rgba(148,91,56,.1)!important;
  transition:border-color .25s ease, box-shadow .25s ease, background .25s ease!important;
}
.booking-control input:focus{
  border-color:rgba(199,149,76,.62)!important;
  background:rgba(255,255,255,.74)!important;
  box-shadow:0 0 0 4px rgba(230,180,106,.18),0 18px 38px rgba(148,91,56,.12)!important;
}
.booking-control input::placeholder{
  color:rgba(93,55,42,.46)!important;
}
.booking-status{
  position:static!important;
  transform:none!important;
  width:min(470px,100%)!important;
  min-height:54px!important;
  margin:17px auto 0!important;
  white-space:pre-line!important;
  color:#9a4b46!important;
  font:500 15px/1.55 Inter,Arial,sans-serif!important;
}
.booking-mark{
  position:absolute;
  top:22px;
  right:28px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font:700 24px/1 Georgia,serif;
  opacity:0;
  transform:scale(.8);
  transition:opacity .3s ease, transform .3s ease;
}
.booking-error .booking-mark,
.booking-success .booking-mark{
  opacity:1;
  transform:scale(1);
}
.booking-error .booking-mark{
  color:#a94c48;
  background:rgba(255,239,235,.9);
  box-shadow:0 10px 24px rgba(169,76,72,.12);
}
.booking-success .booking-mark{
  color:#a97825;
  background:rgba(255,247,220,.94);
  box-shadow:0 10px 26px rgba(181,134,47,.18);
}
.booking-card.booking-error{
  animation:ticketShake .42s ease!important;
  opacity:1!important;
  transform:translateY(0) scale(1)!important;
  border-color:rgba(181,82,72,.38)!important;
}
.booking-card.booking-success{
  border-color:rgba(206,158,79,.58)!important;
}
.booking-card.booking-success .booking-control{
  opacity:.3!important;
}
.booking-letter{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:118px!important;
  height:78px!important;
  display:block!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#fff8eb,#efd1aa)!important;
  box-shadow:0 18px 48px rgba(121,76,45,.22)!important;
  opacity:0;
  transform:translate(-50%,-50%) scale(.64) rotate(-5deg)!important;
  pointer-events:none!important;
}
.booking-letter::before,
.booking-letter::after{
  content:"";
  position:absolute;
  inset:0;
}
.booking-letter::before{
  clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%);
  background:linear-gradient(135deg,#f7ddb8,#fff9ed 52%,#e7bd8b);
  border-radius:8px;
}
.booking-letter::after{
  clip-path:polygon(0 100%,50% 46%,100% 100%);
  background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(213,157,98,.25));
  border-radius:0 0 8px 8px;
}
.start-petals{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  overflow:hidden!important;
  pointer-events:none!important;
}
.start-petals i{
  position:absolute!important;
  width:18px!important;
  height:10px!important;
  display:block!important;
  border-radius:80% 18% 80% 18%!important;
  background:linear-gradient(135deg,rgba(244,188,181,.42),rgba(218,127,132,.26))!important;
  opacity:.24!important;
  filter:none!important;
  animation:petalDrift 16s linear infinite!important;
}
.start-petals i:nth-child(1){left:11%;top:-8%;animation-delay:-1s!important;--petal-x:28px;}
.start-petals i:nth-child(2){left:24%;top:-12%;animation-delay:-8s!important;--petal-x:-36px;}
.start-petals i:nth-child(3){left:38%;top:-10%;animation-delay:-4s!important;--petal-x:48px;}
.start-petals i:nth-child(4){left:51%;top:-9%;animation-delay:-11s!important;--petal-x:-24px;}
.start-petals i:nth-child(5){left:66%;top:-14%;animation-delay:-6s!important;--petal-x:36px;}
.start-petals i:nth-child(6){left:79%;top:-9%;animation-delay:-13s!important;--petal-x:-42px;}
.start-petals i:nth-child(7){left:88%;top:-13%;animation-delay:-3s!important;--petal-x:20px;}
.start-petals i:nth-child(8){left:18%;top:-8%;animation-delay:-15s!important;--petal-x:-26px;}
.start-petals i:nth-child(9){left:44%;top:-13%;animation-delay:-18s!important;--petal-x:34px;}
.start-petals i:nth-child(10){left:72%;top:-7%;animation-delay:-20s!important;--petal-x:-34px;}
.start-petals i:nth-child(11){left:31%;top:-15%;animation-delay:-22s!important;--petal-x:42px;}
.start-petals i:nth-child(12){left:58%;top:-11%;animation-delay:-24s!important;--petal-x:-48px;}
.start-preview{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  opacity:0!important;
  background:linear-gradient(180deg,#fffaf4,#fffef9)!important;
  transition:opacity 1.5s ease!important;
}
.start-preview span{
  position:absolute!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.5)!important;
  box-shadow:0 24px 80px rgba(151,95,54,.08)!important;
}
.start-preview span:nth-child(1){left:7%;top:12%;width:38%;height:38%;}
.start-preview span:nth-child(2){right:8%;top:16%;width:28%;height:46%;}
.start-preview span:nth-child(3){left:18%;bottom:10%;width:58%;height:20%;}
.start-screen.opening{
  background:linear-gradient(180deg,#fffaf4,#fffef9)!important;
  filter:brightness(1.04);
}
.start-screen.opening .start-preview{
  opacity:1!important;
}
.start-screen.opening .booking-card{
  animation:ticketToLetter .9s cubic-bezier(.22,.8,.28,1) forwards!important;
}
.start-screen.opening .booking-card > :not(.booking-letter){
  animation:bookingContentOut .5s ease forwards!important;
}
.start-screen.opening .booking-letter{
  animation:letterLift .95s ease .12s forwards!important;
}
.start-screen.opening .start-petals i{
  opacity:.8!important;
  animation:petalBurst 1.15s cubic-bezier(.18,.7,.3,1) forwards!important;
}
.start-screen.opening .start-petals i:nth-child(1){--burst-x:-42vw;--burst-y:-28vh;}
.start-screen.opening .start-petals i:nth-child(2){--burst-x:36vw;--burst-y:-35vh;}
.start-screen.opening .start-petals i:nth-child(3){--burst-x:-28vw;--burst-y:-48vh;}
.start-screen.opening .start-petals i:nth-child(4){--burst-x:44vw;--burst-y:-22vh;}
.start-screen.opening .start-petals i:nth-child(5){--burst-x:-50vw;--burst-y:-12vh;}
.start-screen.opening .start-petals i:nth-child(6){--burst-x:28vw;--burst-y:-52vh;}
.start-screen.opening .start-petals i:nth-child(7){--burst-x:-18vw;--burst-y:-38vh;}
.start-screen.opening .start-petals i:nth-child(8){--burst-x:50vw;--burst-y:-40vh;}
@keyframes inviteFade{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes ticketArrive{
  from{opacity:0;transform:translateY(18px) scale(.985);filter:blur(4px)}
  to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}
@keyframes ticketShake{
  15%{transform:translateX(-8px) rotate(-.5deg)}
  35%{transform:translateX(7px) rotate(.45deg)}
  55%{transform:translateX(-5px) rotate(-.3deg)}
  75%{transform:translateX(3px) rotate(.2deg)}
}
@keyframes lightMotes{
  to{transform:translateY(-16px);opacity:.92}
}
@keyframes petalDrift{
  from{transform:translateY(-12vh) translateX(0) rotate(0deg)}
  to{transform:translateY(116vh) translateX(var(--petal-x, 30px)) rotate(360deg)}
}
@keyframes ticketToLetter{
  0%{opacity:1;transform:scale(1) translateY(0);filter:none}
  48%{opacity:.96;transform:scale(.72) translateY(-8px);border-radius:18px}
  100%{opacity:0;transform:scale(.22) translateY(-48px);filter:blur(2px)}
}
@keyframes letterLift{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.5) rotate(-6deg)}
  38%{opacity:1;transform:translate(-50%,-64%) scale(1) rotate(2deg)}
  100%{opacity:0;transform:translate(-50%,-142%) scale(.72) rotate(10deg)}
}
@keyframes petalBurst{
  0%{left:50%;top:50%;opacity:0;transform:translate(-50%,-50%) scale(.45) rotate(0deg)}
  18%{opacity:.9}
  100%{left:50%;top:50%;opacity:0;transform:translate(calc(-50% + var(--burst-x, 24vw)),calc(-50% + var(--burst-y, -32vh))) scale(1.45) rotate(520deg)}
}
@media(max-width:720px){
  .booking-card{
    width:min(91vw,760px)!important;
    min-height:400px!important;
    padding:44px 28px 38px!important;
    border-radius:22px!important;
  }
  .booking-card::before,
  .booking-card::after{
    width:32px!important;
    height:32px!important;
  }
  .booking-card::before{left:-16px!important;}
  .booking-card::after{right:-16px!important;}
  .booking-card .mini-label{font-size:11px!important;letter-spacing:2.6px!important;}
  .booking-control{width:min(330px,92%)!important;}
  .booking-control::after{display:grid!important;}
  .booking-status{font-size:14px!important;min-height:72px!important;}
}

/* requested polish fixes */
.booking-control::after{
  opacity:0!important;
  transform:translateY(-50%) scale(.92)!important;
  transition:opacity .1s ease, transform .1s ease!important;
}
.booking-card.booking-has-value .booking-control::after{
  opacity:1!important;
  transform:translateY(-50%) scale(1)!important;
}
.booking-card.booking-error .booking-mark{
  display:none!important;
}
.booking-status{
  opacity:0!important;
  transform:translateY(8px)!important;
  transition:opacity .38s ease, transform .38s ease!important;
}
.booking-status.booking-status-visible,
.booking-card.booking-success .booking-status{
  opacity:1!important;
  transform:translateY(0)!important;
}
.booking-control input{
  transition:border-color .25s ease, box-shadow .25s ease, background .25s ease, color .7s ease!important;
}
.booking-control input.name-clearing{
  color:rgba(74,40,29,0)!important;
}
.booking-card .mini-label{
  font-family:Inter,Arial,sans-serif!important;
  font-weight:800!important;
}

.garden-note{
  position:relative;
  min-height:clamp(360px,48vw,560px);
}
.garden-note.open{
  grid-template-columns:minmax(280px,760px)!important;
  justify-content:center;
}
.garden-note.open .note-one{
  display:flex!important;
  grid-area:1 / 1;
  animation:gardenCardOut .8s cubic-bezier(.2,.75,.25,1) forwards!important;
  pointer-events:none;
}
.garden-note.open .note-two{
  display:flex!important;
  grid-area:1 / 1;
  opacity:0;
  transform:translateY(28px) scale(.96) rotate(.8deg);
  animation:gardenCardIn .95s cubic-bezier(.18,.78,.24,1) .22s forwards!important;
}
.garden-note.open .garden-answer-img{
  animation:gardenAnswerGlow 1.2s ease .36s both;
}
.rose-button:hover{
  transform:translateY(-6px) rotate(-1.6deg)!important;
}
@keyframes gardenCardOut{
  0%{opacity:1;transform:translateY(0) scale(1) rotate(-1.6deg);filter:none}
  55%{opacity:.85;transform:translateY(-18px) scale(.965) rotate(-3deg);filter:saturate(1.05)}
  100%{opacity:0;transform:translateY(-42px) scale(.9) rotate(-5deg);filter:blur(2px)}
}
@keyframes gardenCardIn{
  0%{opacity:0;transform:translateY(34px) scale(.94) rotate(2.5deg);filter:blur(3px)}
  100%{opacity:1;transform:translateY(0) scale(1) rotate(1deg);filter:blur(0)}
}
@keyframes gardenAnswerGlow{
  0%{filter:drop-shadow(0 18px 40px rgba(96,54,32,.08))}
  55%{filter:drop-shadow(0 28px 68px rgba(196,126,104,.28))}
  100%{filter:drop-shadow(0 22px 54px rgba(96,54,32,.16))}
}

.sun-orb{
  overflow:visible;
}
body.theme-sun .sun-orb::before{
  content:"";
  position:absolute;
  inset:-28px;
  border-radius:50%;
  background:repeating-conic-gradient(from -4deg,rgba(42,22,11,.55) 0 2deg,transparent 2deg 18deg);
  -webkit-mask:radial-gradient(circle,transparent 0 56%,#000 57% 68%,transparent 69%);
  mask:radial-gradient(circle,transparent 0 56%,#000 57% 68%,transparent 69%);
  opacity:.62;
}
.sun-callout{
  right:calc(7% + 128px)!important;
  top:calc(7% + 104px)!important;
  z-index:1!important;
  transform:rotate(-7deg)!important;
}
body.theme-sun .sun-callout{
  transform:rotate(-7deg)!important;
  animation:sunAttachedFloat 4.8s ease-in-out infinite alternate!important;
}
.sun-callout span{
  font-size:22px!important;
}
.sun-callout::before{
  display:block!important;
  width:64px!important;
  height:44px!important;
  right:-52px!important;
  top:-36px!important;
  border:0!important;
  border-right:3px solid currentColor!important;
  border-top:3px solid currentColor!important;
  border-radius:0 26px 0 0!important;
  transform:rotate(16deg)!important;
}
.sun-callout::after{
  display:block!important;
  content:""!important;
  position:absolute!important;
  width:13px!important;
  height:13px!important;
  right:-58px!important;
  top:-39px!important;
  border:0!important;
  border-top:3px solid currentColor!important;
  border-right:3px solid currentColor!important;
  transform:rotate(20deg)!important;
}
@keyframes sunAttachedFloat{
  to{transform:translateY(-5px) rotate(-6deg)}
}
@media(max-width:900px){
  .sun-callout{
    right:calc(7% + 112px)!important;
    top:calc(7% + 94px)!important;
  }
}
@media(max-width:540px){
  .sun-orb{
    width:104px;
    height:104px;
    right:6%;
    top:5%;
  }
  .sun-callout{
    right:calc(6% + 86px)!important;
    top:calc(5% + 78px)!important;
    transform:scale(.78) rotate(-7deg)!important;
    transform-origin:top right!important;
  }
  body.theme-sun .sun-callout{
    transform:scale(.78) rotate(-7deg)!important;
    animation:none!important;
  }
}

/* final sun arrow and lightweight hearts */
.sun-callout{
  right:calc(7% + 184px)!important;
  top:calc(7% + 86px)!important;
  transform:rotate(-5deg)!important;
}
body.theme-sun .sun-callout{
  transform:rotate(-5deg)!important;
  animation:sunAttachedFloat 4.8s ease-in-out infinite alternate!important;
}
.sun-callout::before{
  width:78px!important;
  height:34px!important;
  right:-72px!important;
  top:-18px!important;
  border:0!important;
  border-top:3px solid currentColor!important;
  border-right:3px solid currentColor!important;
  border-radius:0 26px 0 0!important;
  transform:rotate(8deg)!important;
}
.sun-callout::after{
  width:14px!important;
  height:14px!important;
  right:-77px!important;
  top:-23px!important;
  border:0!important;
  border-top:3px solid currentColor!important;
  border-right:3px solid currentColor!important;
  transform:rotate(28deg)!important;
}
@media(max-width:900px){
  .sun-callout{
    right:calc(7% + 154px)!important;
    top:calc(7% + 76px)!important;
  }
}
@media(max-width:540px){
  .sun-callout{
    right:calc(6% + 124px)!important;
    top:calc(5% + 59px)!important;
    transform:scale(.78) rotate(-5deg)!important;
  }
  body.theme-sun .sun-callout{
    transform:scale(.78) rotate(-5deg)!important;
  }
  .sun-callout::before{
    width:66px!important;
    right:-61px!important;
    top:-15px!important;
  }
  .sun-callout::after{
    right:-66px!important;
    top:-20px!important;
  }
}

.heart-layer{
  position:fixed;
  inset:0;
  z-index:82;
  pointer-events:none;
  overflow:hidden;
}
.css-heart{
  position:absolute;
  left:50%;
  top:72%;
  width:var(--size);
  height:var(--size);
  background:linear-gradient(135deg,#ff9fbd,#ffcfdf);
  border-radius:3px;
  transform:translate(-50%,-50%) rotate(45deg);
  opacity:0;
  will-change:transform,opacity;
  animation:cssHeartFloat 1.9s cubic-bezier(.18,.72,.25,1) forwards;
  box-shadow:0 8px 18px rgba(188,74,109,.16);
}
.css-heart::before,
.css-heart::after{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  border-radius:50%;
  background:inherit;
}
.css-heart::before{left:-50%;top:0;}
.css-heart::after{left:0;top:-50%;}
@keyframes cssHeartFloat{
  0%{opacity:0;transform:translate(calc(-50% + var(--x)),0) rotate(45deg) scale(.55)}
  12%{opacity:.9}
  100%{opacity:0;transform:translate(calc(-50% + var(--x) + var(--drift)),calc(-1 * var(--rise))) rotate(calc(45deg + var(--rot))) scale(1.12)}
}
@media(max-width:540px){
  .css-heart{
    top:76%;
    animation-duration:1.55s;
  }
}

/* latest content and arrow tweaks */
#heroLabel:empty{
  display:none;
}
.sun-callout{
  width:330px!important;
  height:132px!important;
  right:calc(7% + 166px)!important;
  top:calc(7% + 66px)!important;
  color:#21170f!important;
  transform:rotate(-3deg)!important;
}
body.theme-sun .sun-callout{
  transform:rotate(-3deg)!important;
}
.sun-callout span{
  position:absolute!important;
  left:0!important;
  bottom:20px!important;
  font-size:30px!important;
  line-height:1!important;
  white-space:nowrap!important;
  text-shadow:0 1px 0 rgba(255,255,255,.28)!important;
}
.sun-callout::before{
  content:""!important;
  position:absolute!important;
  left:104px!important;
  top:38px!important;
  width:196px!important;
  height:78px!important;
  border:0!important;
  border-bottom:4px solid currentColor!important;
  border-right:4px solid currentColor!important;
  border-radius:0 0 150px 0!important;
  transform:rotate(-20deg)!important;
  transform-origin:right bottom!important;
  opacity:.92!important;
}
.sun-callout::after{
  content:""!important;
  position:absolute!important;
  left:286px!important;
  top:30px!important;
  width:30px!important;
  height:30px!important;
  border:0!important;
  border-top:4px solid currentColor!important;
  border-right:4px solid currentColor!important;
  transform:rotate(40deg)!important;
  opacity:.92!important;
}
@media(max-width:900px){
  .sun-callout{
    width:280px!important;
    height:116px!important;
    right:calc(7% + 136px)!important;
    top:calc(7% + 58px)!important;
  }
  .sun-callout span{font-size:25px!important;}
  .sun-callout::before{left:88px!important;width:166px!important;height:66px!important;top:34px!important;}
  .sun-callout::after{left:242px!important;top:29px!important;width:25px!important;height:25px!important;}
}
@media(max-width:540px){
  .sun-callout{
    width:218px!important;
    height:88px!important;
    right:calc(6% + 126px)!important;
    top:calc(5% + 42px)!important;
    transform:scale(.78) rotate(-3deg)!important;
  }
  body.theme-sun .sun-callout{
    transform:scale(.78) rotate(-3deg)!important;
  }
  .sun-callout span{font-size:22px!important;bottom:14px!important;}
  .sun-callout::before{left:74px!important;width:126px!important;height:50px!important;top:24px!important;border-bottom-width:3px!important;border-right-width:3px!important;}
  .sun-callout::after{left:190px!important;top:21px!important;width:20px!important;height:20px!important;border-top-width:3px!important;border-right-width:3px!important;}
}

/* latest hero actions and restrained sun pointer */
.sun-callout{
  width:240px!important;
  height:96px!important;
  right:calc(7% + 154px)!important;
  top:calc(7% + 54px)!important;
  z-index:-1!important;
  pointer-events:none!important;
  opacity:.82!important;
  transform:rotate(-3deg)!important;
}
body.theme-sun .sun-callout{
  opacity:.82!important;
  transform:rotate(-3deg)!important;
  animation:none!important;
}
body.theme-evening .sun-callout,
body.theme-night .sun-callout{opacity:0!important;}
.sun-callout span{
  left:0!important;
  bottom:14px!important;
  font-size:24px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.sun-callout::before{
  left:82px!important;
  top:28px!important;
  width:132px!important;
  height:52px!important;
  border:0!important;
  border-bottom:3px solid currentColor!important;
  border-right:3px solid currentColor!important;
  border-radius:0 0 110px 0!important;
  transform:rotate(-19deg)!important;
}
.sun-callout::after{
  left:202px!important;
  top:23px!important;
  width:20px!important;
  height:20px!important;
  border:0!important;
  border-top:3px solid currentColor!important;
  border-right:3px solid currentColor!important;
  transform:rotate(38deg)!important;
}
.joy-notes{
  list-style:none;
  display:grid;
  gap:10px;
  padding:0;
  margin:0;
  text-align:left;
}
.joy-notes li{
  padding:12px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.26);
  border:1px solid rgba(255,255,255,.18);
}
.flower-layer{
  position:fixed;
  inset:0;
  z-index:82;
  pointer-events:none;
  overflow:hidden;
}
.css-flower{
  position:absolute;
  left:var(--x);
  top:-40px;
  font-size:var(--size);
  opacity:0;
  will-change:transform,opacity;
  animation:flowerFall 2.8s cubic-bezier(.18,.72,.28,1) forwards;
}
@keyframes flowerFall{
  0%{opacity:0;transform:translate(0,0) rotate(0deg) scale(.8)}
  12%{opacity:.95}
  100%{opacity:0;transform:translate(var(--drift),var(--fall)) rotate(310deg) scale(1.05)}
}
@media(max-width:900px){
  .sun-callout{
    width:210px!important;
    height:86px!important;
    right:calc(7% + 128px)!important;
    top:calc(7% + 48px)!important;
  }
  .sun-callout span{font-size:21px!important;}
  .sun-callout::before{left:72px!important;width:116px!important;height:46px!important;}
  .sun-callout::after{left:178px!important;width:18px!important;height:18px!important;}
}
@media(max-width:540px){
  .sun-callout{
    width:168px!important;
    height:72px!important;
    right:calc(6% + 112px)!important;
    top:calc(5% + 34px)!important;
    transform:scale(.82) rotate(-3deg)!important;
  }
  body.theme-sun .sun-callout{transform:scale(.82) rotate(-3deg)!important;}
  .sun-callout span{font-size:19px!important;bottom:10px!important;}
  .sun-callout::before{left:60px!important;top:21px!important;width:88px!important;height:36px!important;}
  .sun-callout::after{left:140px!important;top:17px!important;width:16px!important;height:16px!important;}
}

/* final arrow refinement and chapter spacing */
.sun-callout{
  width:198px!important;
  height:76px!important;
  right:calc(7% + 154px)!important;
  top:calc(7% + 56px)!important;
}
.sun-callout span{
  font-size:21px!important;
  bottom:9px!important;
}
.sun-callout::before{
  left:70px!important;
  top:29px!important;
  width:110px!important;
  height:34px!important;
  border-bottom-width:2.5px!important;
  border-right-width:2.5px!important;
  border-radius:0 0 90px 0!important;
  transform:rotate(-14deg)!important;
}
.sun-callout::after{
  left:172px!important;
  top:25px!important;
  width:15px!important;
  height:15px!important;
  border-top-width:2.5px!important;
  border-right-width:2.5px!important;
  transform:rotate(45deg)!important;
}
.cinematic-line{
  padding-top:24px!important;
}
.cinematic-line h2{
  margin-top:0!important;
}
@media(max-width:900px){
  .sun-callout{
    width:176px!important;
    height:68px!important;
    right:calc(7% + 130px)!important;
    top:calc(7% + 50px)!important;
  }
  .sun-callout span{font-size:19px!important;}
  .sun-callout::before{left:62px!important;width:96px!important;height:30px!important;top:27px!important;}
  .sun-callout::after{left:150px!important;top:23px!important;width:14px!important;height:14px!important;}
}
@media(max-width:540px){
  .sun-callout{
    width:142px!important;
    height:58px!important;
    right:calc(6% + 112px)!important;
    top:calc(5% + 36px)!important;
  }
  .sun-callout span{font-size:16px!important;bottom:8px!important;}
  .sun-callout::before{left:50px!important;width:76px!important;height:24px!important;top:21px!important;border-bottom-width:2px!important;border-right-width:2px!important;}
.sun-callout::after{left:120px!important;top:18px!important;width:12px!important;height:12px!important;border-top-width:2px!important;border-right-width:2px!important;}
}

/* final small interaction polish */
.sun-callout::before,
.sun-callout::after{
  display:none!important;
}
.cinematic-line h2{
  transform:translateY(-10px);
}
.message-box.sleep-message{
  animation:sleepSoftAppear .75s ease both;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,223,235,.18));
  box-shadow:0 18px 45px rgba(120,70,100,.12), inset 0 0 0 1px rgba(255,255,255,.16);
}
@keyframes sleepSoftAppear{
  0%{opacity:0;transform:translateY(10px) scale(.98);filter:blur(3px)}
  55%{opacity:1;transform:translateY(-3px) scale(1.01);filter:blur(0)}
  100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}

/* optimization pass: smoother garden swap and cheaper effects */
.garden-note .note-one,
.garden-note .note-two{
  will-change:opacity,transform;
  backface-visibility:hidden;
  transform-style:preserve-3d;
}
.garden-note .note-two{
  display:flex!important;
  grid-area:1 / 1;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(0,22px,0) scale(.97) rotate(.8deg);
}
.garden-note:not(.open) .note-two{
  display:flex!important;
}
.garden-note.open .note-one{
  display:flex!important;
  grid-area:1 / 1;
  animation:gardenCardOutOptimized .62s cubic-bezier(.2,.75,.25,1) forwards!important;
}
.garden-note.open .note-two{
  visibility:visible;
  pointer-events:auto;
  animation:gardenCardInOptimized .72s cubic-bezier(.18,.78,.24,1) .12s forwards!important;
}
.garden-note.open .garden-answer-img{
  animation:none!important;
}
@keyframes gardenCardOutOptimized{
  0%{opacity:1;transform:translate3d(0,0,0) scale(1) rotate(-1.6deg)}
  100%{opacity:0;transform:translate3d(0,-26px,0) scale(.94) rotate(-3deg)}
}
@keyframes gardenCardInOptimized{
  0%{opacity:0;transform:translate3d(0,24px,0) scale(.96) rotate(1.8deg)}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1) rotate(1deg)}
}
@media(max-width:900px){
  .garden-note.open .note-one{
    display:flex!important;
  }
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}

/* tighten spacing around the first photo chapter and garden invitation */
.photo-chapter.chapter-three{
  margin-bottom:0!important;
}
.photo-chapter.chapter-three + .garden-note{
  margin-top:10px!important;
}
.photo-chapter.chapter-three .triptych{
  min-height:360px!important;
}
.photo-chapter.chapter-three .triptych figure{
  height:340px!important;
  min-height:340px!important;
}
.photo-chapter.chapter-three .triptych figure:nth-child(2){
  height:380px!important;
  min-height:380px!important;
}

/* final spacing fix: keep the rose card close before and after click */
.booking-letter{
  display:none!important;
}
.start-screen.opening .booking-letter{
  display:none!important;
  animation:none!important;
}
.photo-chapter.chapter-three{
  margin-bottom:-58px!important;
}
.photo-chapter.chapter-three + .garden-note{
  margin-top:-34px!important;
}
.garden-note{
  min-height:0!important;
  padding-top:0!important;
  align-items:start!important;
}
.garden-note:not(.open){
  min-height:0!important;
  align-items:start!important;
}
.garden-note .note-one,
.garden-note .note-two{
  align-self:start!important;
}
@media(max-width:900px){
  .photo-chapter.chapter-three + .garden-note{
    margin-top:-8px!important;
  }
  .photo-chapter.chapter-three .triptych figure,
  .photo-chapter.chapter-three .triptych figure:nth-child(2){
    height:auto!important;
    min-height:0!important;
  }
}

/* corrected garden stack layout: both cards share one grid cell */
.photo-chapter.chapter-three{
  margin-bottom:18px!important;
}
.photo-chapter.chapter-three + .garden-note{
  margin-top:0!important;
}
.garden-note,
.garden-note:not(.open),
.garden-note.open{
  width:min(980px,92vw)!important;
  display:grid!important;
  grid-template-columns:minmax(280px,760px)!important;
  grid-template-rows:auto!important;
  justify-content:center!important;
  align-items:start!important;
  min-height:0!important;
  padding-top:0!important;
}
.garden-note .note-one,
.garden-note .note-two,
.garden-note.open .note-one,
.garden-note.open .note-two,
.garden-note:not(.open) .note-one,
.garden-note:not(.open) .note-two{
  grid-column:1!important;
  grid-row:1!important;
  align-self:start!important;
}
.garden-note:not(.open) .note-one{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:rotate(-1.6deg)!important;
  animation:none!important;
}
.garden-note:not(.open) .note-two{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translate3d(0,18px,0) scale(.97) rotate(.8deg)!important;
  animation:none!important;
}
.garden-note.open .note-one{
  visibility:visible!important;
  pointer-events:none!important;
  animation:gardenCardOutOptimized .62s cubic-bezier(.2,.75,.25,1) forwards!important;
}
.garden-note.open .note-two{
  visibility:visible!important;
  pointer-events:auto!important;
  animation:gardenCardInOptimized .72s cubic-bezier(.18,.78,.24,1) .12s forwards!important;
}
@media(max-width:900px){
  .photo-chapter.chapter-three{
    margin-bottom:18px!important;
  }
  .photo-chapter.chapter-three + .garden-note{
    margin-top:0!important;
  }
  .garden-note,
  .garden-note:not(.open),
  .garden-note.open{
    grid-template-columns:minmax(260px,92vw)!important;
  }
  .garden-note.open .note-one{
    display:flex!important;
  }
}

/* desktop visual alignment: closed garden card matches the opened card position */
@media(min-width:901px){
  .photo-chapter.chapter-three + .garden-note{
    margin-top:0!important;
  }
}

.message-box:empty{
  display:none;
}

.joy-note-footer{
  margin:16px 0 0;
  padding-top:14px;
  border-top:1px solid rgba(110,72,48,.14);
  color:#8b5f4d;
  font-weight:800;
  line-height:1.55;
}
