[hidden]{display:none!important}
body.opening-active{overflow:hidden}
.invitation-opening{position:fixed;inset:0;z-index:100;background:#260303;height:100dvh}
.envelope{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;background:#260303;color:#ffe6b6}
.envelope img,.opening-film video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.envelope-hint{position:absolute;bottom:max(8%,env(safe-area-inset-bottom));left:0;width:100%;padding:20px;font-size:10px;letter-spacing:3px;text-shadow:0 2px 8px #000}
.envelope:focus-visible{outline:3px solid #e4c281;outline-offset:-6px}
.opening-film{position:absolute;inset:0;background:#260303}
.skip-film{position:absolute;bottom:max(20px,env(safe-area-inset-bottom));right:20px;padding:12px 18px;border:1px solid #d7b57680;border-radius:24px;background:#260303b3;color:#ffe6b6;font-size:11px}
.hero{height:100svh;min-height:540px;max-height:none;background:#260303}
.hero .hero-scene{inset:0;width:100%;height:100%;transform:none;object-fit:cover;object-position:center}
.hero:before,.hero:after,.hero-frame,.hero-footnote{display:none}
.hero .hero-content{max-width:600px;padding:65px 35px}
.hero .hero-eyebrow{font-size:clamp(7px,2vw,10px);letter-spacing:2px;font-weight:600;margin-bottom:24px}
.hero .small-title{font-size:10px;letter-spacing:2px}
.hero h1{font-size:clamp(76px,23vw,126px);margin:0 -12px;line-height:1.5}
.hero h1:focus{outline:none}
.hero .hero-subtitle{font-size:clamp(18px,5vw,25px);margin:20px 0}
.hero .hero-date{font-size:24px;letter-spacing:3px;margin:24px 0 0}
.hero .hero-date span{margin:0 6px}
.hero-rule span{width:50px}
@media(min-aspect-ratio:3/4){
  .envelope img,.opening-film video{object-fit:contain}
  .hero .hero-scene{width:min(100%,56.25svh);left:50%;transform:translateX(-50%)}
  .hero .hero-content{max-width:56.25svh;padding:45px 30px}
  .hero h1{font-size:clamp(64px,13svh,110px)}
  .hero .hero-subtitle{font-size:clamp(16px,2.8svh,24px)}
  .hero .hero-eyebrow{font-size:8px;letter-spacing:1px}
}
@media(max-height:650px){
  .hero .hero-content{padding-top:40px;padding-bottom:40px}
  .hero .hero-eyebrow{margin-bottom:12px}
  .hero h1{line-height:1.3}
  .hero .hero-subtitle{margin:14px 0}
  .hero .hero-date{margin-top:16px}
}

.music-toggle {
  position:fixed;
  left:max(16px,env(safe-area-inset-left));
  bottom:max(16px,env(safe-area-inset-bottom));
  z-index:110;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:44px;
  padding:12px 16px;
  border:1px solid var(--gold);
  border-radius:32px;
  background:var(--rust);
  color:#f6e5c4;
  font:500 11px var(--sans);
  letter-spacing:.5px;
  transition:background-color .25s;
}
.music-toggle:hover {background:#8b3428}
.music-icon {display:block;width:18px;height:18px;flex:none}
.music-toggle[data-playing="true"] .music-icon--play,
.music-toggle[data-playing="false"] .music-icon--mute {display:none}
.music-credits {
  max-width:640px;
  margin:16px auto 0;
  font-size:10px;
  line-height:1.7;
  letter-spacing:0;
  color:#705139;
}
.music-credits summary {cursor:pointer}
.music-credits p {margin:10px 0 0}
.music-credits a {text-decoration:underline;text-underline-offset:3px}
