body.invitation-page{background:color-mix(in srgb,var(--base) 25%,#191516);color:var(--ink)}.preview-tools{position:fixed;top:22px;left:24px;display:flex;flex-direction:column;align-items:flex-start;gap:13px;z-index:30;color:#f7f0e6;font:11px var(--sans)}.preview-tools a{text-decoration:none}.preview-tools button{background:#fff1;color:inherit;border:1px solid #fff4;padding:11px 15px;border-radius:100px}.preview-tools small{font-size:10px;opacity:.65}.invite{width:min(100%,580px);margin:auto;background:var(--base);overflow:hidden;position:relative;box-shadow:0 0 100px #0004}.invite:before{content:'';position:absolute;inset:0;opacity:.06;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E");z-index:15}.hero{min-height:860px;text-align:center;position:relative;padding:75px 35px 40px}.hero:before{content:'';position:absolute;inset:24px 24px 55px;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);pointer-events:none}.kicker{font:10px/1.5 var(--sans);letter-spacing:2.8px;text-transform:uppercase;color:var(--accent)}.hero-script{font:63px/1.3 var(--script);font-weight:400;margin:30px 0 0;color:var(--accent)}.hero-subtitle{font-size:16px;letter-spacing:.8px;margin:7px 0 0}.hero-names{font:48px/1.1 var(--serif);font-weight:400;margin:26px 0 0;overflow-wrap:anywhere}.hero-date{font:11px var(--sans);letter-spacing:2px;margin-top:20px}.text-in>span{display:inline-block;animation:rise 1.2s both;animation-delay:calc(var(--i)*.13s)}.envelope-stage{position:relative;margin:55px auto 0;width:min(100%,430px);height:310px}.letter-slip{position:absolute;left:13%;right:13%;top:40px;background:var(--paper);color:var(--paper-ink);height:180px;padding:23px 15px;transform:rotate(-4deg);transition:transform 1.3s cubic-bezier(.2,.7,.2,1);box-shadow:0 5px 15px #0003}.letter-slip p{font:32px var(--script);margin:5px}.letter-slip span{font:10px var(--sans)}.envelope-button{position:relative;width:100%;padding:0;background:none;display:block;z-index:2;transition:transform 1.3s,opacity 1.3s}.envelope-button img{width:100%;display:block;animation:drift 7s ease-in-out infinite;filter:drop-shadow(0 20px 14px #0003)}.envelope-stage.is-open .letter-slip{transform:translateY(-95px) rotate(0)}.envelope-stage.is-open .envelope-button{transform:translateY(42px) rotate(4deg)}.envelope-stage.is-open .envelope-button img{animation-play-state:paused}.envelope-hint{font:10px var(--sans);letter-spacing:1px;position:relative;z-index:3;margin:22px 0 0;color:var(--accent)}.scroll-link{display:inline-flex;flex-direction:column;align-items:center;gap:13px;text-decoration:none;font:10px var(--sans);letter-spacing:1px;margin-top:18px}.scroll-link:after{content:'';height:36px;width:1px;background:var(--accent)}.spark{position:absolute;color:var(--accent);animation:glint 4s ease-in-out infinite;pointer-events:none}.spark.one{top:16%;left:11%;font-size:25px}.spark.two{top:49%;right:8%;font-size:18px;animation-delay:-2s}.spark.three{bottom:12%;left:7%;font-size:17px;animation-delay:-1s}.invitation-section{position:relative;padding:60px 44px 95px;text-align:center}.paper-card{background:var(--paper);color:var(--paper-ink);padding:45px 27px 55px;box-shadow:0 12px 22px #0002;position:relative}.paper-card:before{content:'';position:absolute;inset:12px;border:1px solid color-mix(in srgb,var(--paper-ink) 32%,transparent);pointer-events:none}.card-flourish{font-size:30px;color:var(--paper-ink);margin-bottom:12px}.paper-card h2{font:44px/1.2 var(--script);margin:0 0 20px;font-weight:400;overflow-wrap:anywhere}.paper-card p{font-size:17px;line-height:1.8;max-width:320px;margin:16px auto}.paper-card .occasion-line{font-size:12px;font-family:var(--sans);letter-spacing:1.3px}.bow-holder{position:relative;z-index:3;width:58%;margin:-50px auto -50px;pointer-events:none}.bow-holder img{display:block;animation:ribbon 8s ease-in-out infinite;transform-origin:50% 20%;filter:drop-shadow(0 9px 6px #0002)}.section-whisper{font:16px/1.8 var(--serif);max-width:280px;margin:68px auto 0;color:var(--accent)}.milestone{position:relative;text-align:center;padding:40px 40px 90px}.milestone .large-number{font:230px/.9 var(--serif);color:var(--accent);letter-spacing:-20px;margin:20px 20px 0 0}.milestone .script{font-size:44px;margin:6px 0 0}.milestone .occasion-art{width:58%;margin:30px auto 0;display:block;animation:drift 9s ease-in-out infinite;filter:drop-shadow(0 12px 12px #0003)}.milestone.birthday .occasion-art{width:70%;margin:20px auto}.milestone .milestone-copy{max-width:270px;margin:25px auto 0;font-size:16px}.milestone-floral{position:absolute;width:38%;right:-20px;top:20px;animation:drift 10s ease-in-out infinite;animation-delay:-4s;opacity:.95}.event-section{padding:30px 44px 90px;position:relative}.event-ticket{text-align:center;padding:55px 25px 45px;position:relative;background:var(--paper);color:var(--paper-ink);box-shadow:0 10px 25px #0003;mask-image:radial-gradient(circle at 9px 0,transparent 6px,#000 6.5px);mask-size:18px 100%;mask-repeat:repeat-x}.event-ticket:before{content:'';position:absolute;inset:22px 15px;border:1px solid color-mix(in srgb,var(--paper-ink) 25%,transparent);pointer-events:none}.event-ticket .script{font-size:30px;margin:5px 0 15px}.event-ticket h2{font:38px/1.2 var(--serif);font-weight:400;margin:0 0 26px;overflow-wrap:anywhere}.date-row{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #a99d88;border-bottom:1px solid #a99d88;margin:20px 8px}.date-cell{padding:20px 5px}.date-cell+div{border-left:1px solid #a99d88}.date-cell strong{display:block;font-weight:400;font-size:40px}.date-cell span{font:10px/1.6 var(--sans);letter-spacing:1.2px}.address{font:12px/1.7 var(--sans);max-width:260px;margin:22px auto}.calendar-button{padding:12px 15px;border-bottom:1px solid currentColor;background:transparent;font:11px var(--sans);position:relative;z-index:1}.dress-section{position:relative;padding:40px 40px 90px;text-align:center}.dress-section>.script{font-size:43px;margin:0 0 45px}.dress-collage{position:relative;min-height:385px;width:100%;display:flex;align-items:center;justify-content:center}.polaroid{width:75%;background:var(--paper);padding:13px 13px 38px;transform:rotate(9deg);box-shadow:0 8px 16px #0003}.polaroid-inner{aspect-ratio:1;background:color-mix(in srgb,var(--base) 90%,#fff);position:relative;display:grid;place-items:center;overflow:hidden}.polaroid img{width:90%;display:block;animation:drift 8s ease-in-out infinite;animation-delay:-3s}.dress-note{position:absolute;top:0;left:0;z-index:3;transform:rotate(-7deg);width:61%;background:var(--paper);color:var(--paper-ink);padding:22px 17px;box-shadow:0 5px 12px #0002;font-size:15px;line-height:1.6}.dress-note:before{content:'';position:absolute;left:22px;top:-17px;width:15px;height:43px;border:2px solid #bba272;border-radius:15px;transform:rotate(5deg)}.palette{display:flex;justify-content:center;gap:14px;margin:27px 0 20px}.palette span{height:35px;width:35px;border-radius:50%;border:1px solid #a8987e80;box-shadow:inset 0 0 0 3px #fff2}.dress-section .dress-caption{font:12px/1.8 var(--sans);color:var(--accent);margin:0}.closing-section{text-align:center;position:relative;padding:30px 40px 60px}.closing-floral{display:block;width:50%;margin:0 auto 18px;animation:drift 10s ease-in-out infinite;animation-delay:-5s}.closing-section>.script{font-size:39px;line-height:1.3;margin:16px 0 25px}.closing-section>p{font-size:16px;margin:20px auto;max-width:310px}.rsvp{display:inline-block;padding:16px 32px;background:var(--paper);color:var(--paper-ink);font:12px var(--sans);text-decoration:none;margin:10px 0;border-radius:1px;box-shadow:0 6px 15px #0002}.rsvp-note{font:10px/1.7 var(--sans)!important;color:var(--accent)}.closing-names{font:37px var(--script);margin:30px 0!important;overflow-wrap:anywhere}.invite-footer{font:10px var(--sans);text-align:center;padding:20px 25px 30px;color:var(--accent)}.invite-footer a{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:4px}.reveal{opacity:1}.js-motion .reveal{opacity:0;transform:translateY(28px) rotate(-2deg);clip-path:inset(0 0 18% 0);transition:opacity 1.1s,transform 1.2s cubic-bezier(.2,.7,.2,1),clip-path 1.4s}.js-motion .reveal.visible{opacity:1;transform:none;clip-path:inset(0)}.progress-line{height:2px;background:var(--accent);position:fixed;top:0;left:0;width:0;z-index:50}.editor{border:0;max-width:480px;width:calc(100% - 32px);max-height:90svh;padding:28px;background:#fff9ef;color:#492630;box-shadow:0 25px 100px #0005}.editor::backdrop{background:#16101699;backdrop-filter:blur(7px)}.editor h2{font-size:35px;margin:0;font-weight:400}.editor>p{font:12px/1.8 var(--sans);color:#79656a}.editor form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.editor label{display:flex;flex-direction:column;gap:7px;font:11px var(--sans)}.editor .full{grid-column:1/-1}.editor input,.editor textarea{width:100%;border:1px solid #cbb9ae;background:#fffdf8;padding:11px;font:14px var(--sans);color:#492630;border-radius:0;min-width:0}.editor textarea{min-height:90px;resize:vertical}.editor-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:5px}.editor-actions button{font:11px var(--sans);padding:13px 18px;background:#592532;color:#fff9ef}.editor-actions .secondary{background:#ece3da;color:#492630}.editor-close{float:right;font:22px var(--sans);background:transparent;min-width:34px;min-height:34px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:90vw;width:max-content;background:#fff9ef;color:#492630;box-shadow:0 5px 30px #0003;padding:15px 20px;z-index:100;font:12px/1.5 var(--sans)}.toast:empty{display:none}@media(max-width:1000px){.preview-tools{position:relative;top:auto;left:auto;flex-direction:row;align-items:center;justify-content:center;flex-wrap:wrap;padding:13px 10px;gap:10px;background:#191516;font-size:10px}.preview-tools button{padding:8px 11px;font-size:10px}.preview-tools small{display:none}}@media(max-width:450px){.hero{padding:60px 25px 30px;min-height:740px}.hero:before{inset:17px 17px 40px}.hero-script{font-size:53px;margin-top:24px}.hero-names{font-size:39px}.envelope-stage{height:265px;margin-top:50px}.envelope-hint{margin:0}.hero-subtitle{font-size:14px}.hero-date{font-size:10px}.invitation-section{padding:35px 25px 80px}.paper-card{padding:38px 23px 50px}.paper-card h2{font-size:39px}.paper-card p{font-size:15px}.bow-holder{width:60%;margin-top:-37px}.section-whisper{font-size:15px}.milestone{padding:15px 25px 70px}.milestone .large-number{font-size:190px}.milestone .script{font-size:37px}.milestone-floral{width:37%;top:15px;right:-25px}.event-section{padding:25px 25px 65px}.event-ticket{padding:48px 17px 35px}.event-ticket h2{font-size:32px}.dress-section{padding:30px 30px 60px}.dress-collage{min-height:310px}.dress-note{font-size:13px;padding:20px 14px}.dress-section>.script{font-size:36px}.closing-section{padding:15px 28px 40px}.closing-section>.script{font-size:33px}.closing-names{font-size:33px}}@media print{.preview-tools,.progress-line,.editor,.toast,.scroll-link{display:none!important}.invite{box-shadow:none;width:100%}.invite:before{display:none}.reveal{opacity:1!important;transform:none!important;clip-path:none!important}*{animation:none!important}.invitation-page{background:var(--base)}.paper-card,.event-ticket,.dress-collage{break-inside:avoid}}
/* Reserve the full transparent asset bounds so text never overlaps the envelope. */
.envelope-stage{height:auto;aspect-ratio:1}

/* Shared alignment rules apply to every occasion and palette. */
.hero:before { bottom: 20px; }
.hero-script, .hero-names, .paper-card h2, .event-ticket h2,
.milestone .script, .dress-section > .script, .closing-section > .script {
  text-wrap: balance;
}
.text-in > span { max-width: 100%; overflow-wrap: anywhere; }
.envelope-stage { margin-bottom: 42px; }
.envelope-hint { line-height: 1.6; }
.paper-card .occasion-line { line-height: 1.65; }
.milestone .large-number { margin: 20px 0 0; letter-spacing: -.065em; text-indent: -.065em; }
.milestone-floral { width: 25%; right: 0; top: 0; pointer-events: none; }
.milestone .kicker { max-width: 65%; margin-inline: auto; line-height: 1.8; }
.milestone .script { line-height: 1.35; }
.date-row { align-items: stretch; }
.date-cell { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.date-cell strong { font-variant-numeric: tabular-nums; line-height: 1.1; }
.closing-section > .closing-names {
  font: 37px/1.45 var(--script);
  max-width: 100%;
  margin: 30px auto !important;
  text-wrap: balance;
}
.editor { overscroll-behavior: contain; }
.editor form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editor label { min-width: 0; }
.motion-paused .text-in > span { animation: none; }
.motion-paused .reveal { opacity: 1; transform: none; clip-path: none; transition: none; }
@media (max-width: 450px) {
  .hero-script { font-size: clamp(39px, 12.5vw, 53px); }
  .hero-names { font-size: clamp(32px, 9.5vw, 39px); line-height: 1.25; }
  .milestone-floral { width: 24%; top: 0; right: 0; }
  .milestone .kicker { max-width: 67%; letter-spacing: 2px; }
  .milestone .script { font-size: 34px; }
  .closing-section > .closing-names { font-size: 31px; }
  .date-cell strong { font-size: clamp(30px, 9.5vw, 40px); }
  .dress-collage { min-height: 0; padding-top: 62px; padding-bottom: 26px; }
  .dress-note { width: 68%; }
  .polaroid { width: 82%; }
}
@media (max-width: 360px) {
  .preview-tools { column-gap: 8px; }
  .preview-tools button { padding-inline: 9px; }
  .paper-card { padding-inline: 21px; }
  .paper-card h2 { font-size: 34px; }
  .event-ticket h2 { font-size: 29px; }
  .event-ticket .script { font-size: 26px; }
  .editor { padding: 22px 18px; }
  .editor form { grid-template-columns: minmax(0, 1fr); }
  .editor-actions { gap: 8px; }
}
/* The letter scales with the envelope instead of peeking below it on small phones. */
.letter-slip { top: 12%; height: 42%; padding: 16px 12px; }
.letter-slip p { font-size: 28px; line-height: 1.2; }
.letter-slip span { display: block; line-height: 1.5; }
/* Keep the revealed note clear of the date and the envelope clear of its hint. */
.envelope-stage { margin-bottom: 60px; }
.envelope-stage.is-open .letter-slip { transform: translateY(-50px) rotate(0); }
/* Wrapped labels must not stagger the date and time input baselines. */
.editor label > input { margin-top: auto; height: 44px; }

.invite-credit {
  margin: 18px 0 0;
  line-height: 1.5;
}

.card-flourish img {
  display: block;
  width: 56px;
  height: auto;
  margin: 0 auto;
}

.invite-glass {
  --glass-tint: color-mix(in srgb, var(--base) 64%, var(--paper-ink));
  --glass-edge: color-mix(in srgb, var(--accent) 42%, #fff);
  position: fixed;
  z-index: 25;
  bottom: calc(12px + env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  padding: 9px 15px;
  border: 1px solid color-mix(in srgb, var(--glass-edge) 62%, transparent);
  border-radius: 999px;
  background:
    radial-gradient(ellipse at 26% 0%, #ffffff46, transparent 60%),
    linear-gradient(155deg, #ffffff15, transparent 54%, #ffffff20),
    color-mix(in srgb, var(--glass-tint) 88%, transparent);
  color: #fffaf3;
  backdrop-filter: blur(18px) saturate(155%);
  -webkit-backdrop-filter: blur(18px) saturate(155%);
  box-shadow: inset 0 1px 1px #ffffff78, inset 0 -2px 4px #ffffff29,
    0 5px 18px #0004;
  font: 600 11px/1.2 var(--sans);
  transition: transform .2s ease, box-shadow .2s ease;
}
[data-theme=blush] .invite-glass {
  --glass-tint: color-mix(in srgb, var(--base) 20%, var(--paper-ink));
}
.invite-glass[aria-pressed=true] {
  border-color: var(--glass-edge);
  box-shadow: inset 0 1px 2px #ffffffa6, inset 0 -3px 6px #ffffff45,
    0 0 12px color-mix(in srgb, var(--accent) 35%, transparent), 0 5px 18px #0004;
}
.invite-glass:active { transform: scale(.96); }
@media (prefers-reduced-motion: reduce) {
  .invite-glass { transition: none; }
  .invite-glass:active { transform: none; }
}
.invite-glass span[aria-hidden] { font-size: 16px; }
.invite-glass-scroll { left: max(12px, env(safe-area-inset-left)); }
.invite-glass-music { right: max(12px, env(safe-area-inset-right)); }
.invitation-page .invite-footer { padding-bottom: calc(78px + env(safe-area-inset-bottom)); }
@media print { .invite-glass { display: none; } }

.editor-actions .book-invite {
  display: inline-flex;
  align-items: center;
  padding: 13px 18px;
  background: #164a37;
  color: #fff9ef;
  font: 11px var(--sans);
  text-decoration: none;
}
