body.intro-open { overflow: hidden; }
.intro-dialog {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  height: 100svh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #e9e4d5;
  color: #fff9ec;
  overscroll-behavior: none;
}
.intro-dialog:not([open]) { display: none; }
.intro-dialog[open] { display: block; }
.intro-dialog::backdrop { background: #dfe5d2; }
.intro-fill,
.intro-poster,
.intro-film {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-position: center;
  pointer-events: none;
}
.intro-fill {
  inset: -32px;
  width: calc(100% + 64px);
  height: calc(100% + 64px);
  object-fit: cover;
  filter: blur(22px) saturate(.8) brightness(.82);
}
.intro-fill img,
.intro-poster img { display: block; width: 100%; height: 100%; max-width: none; object-position: center; }
.intro-fill img { object-fit: cover; }
.intro-poster,
.intro-poster img { object-fit: contain; }
.intro-poster { z-index: 1; }
.intro-film { z-index: 2; object-fit: contain; background: transparent; }
.intro-dialog.is-playing .intro-poster { visibility: hidden; }
.intro-dialog.is-static .intro-film { display: none; }
.intro-brand,
.intro-music-gate,
.intro-start,
.intro-loading { display: none !important; }
.intro-film-title {
  --intro-title-phase: 0;
  position: absolute;
  left: 0;
  right: 0;
  bottom: max(8svh, env(safe-area-inset-bottom));
  z-index: 3;
  width: min(1500px, 96%);
  margin-inline: auto;
  transform-origin: center;
  color: #fff8e7;
  text-align: center;
  pointer-events: none;
  text-shadow: 0 2px 2px #071b13, 0 5px 12px #071b13d9, 0 12px 32px #071b1399;
  animation: intro-film-title-enter 2.8s linear both paused;
  animation-delay: calc(var(--intro-title-phase) * -2.8s);
}
.intro-film-title::before { content: ''; position: absolute; z-index: -1; inset: -65% -8% -40%; background: radial-gradient(ellipse, #0d251db8 0%, #0d251d66 40%, transparent 73%); pointer-events: none; }
.intro-film-title > span { display: block; font: 400 clamp(42px, 9.2vw, 136px)/1.05 var(--serif); letter-spacing: -.035em; text-wrap: balance; }
.intro-film-title > small { display: block; margin-top: 16px; font: 500 clamp(19px, 2.7vw, 38px)/1.4 var(--sans); letter-spacing: .08em; }
@keyframes intro-film-title-enter {
  0% { opacity: 0; transform: scale(3.6); }
  30% { opacity: 1; transform: scale(1.22); }
  70% { opacity: 1; transform: scale(1.035); }
  100% { opacity: 1; transform: scale(1); }
}
@media (max-width: 600px) { .intro-film-title { bottom: max(10svh, env(safe-area-inset-bottom)); width: 94%; } .intro-film-title > small { margin-top: 12px; letter-spacing: .035em; } }
@keyframes intro-film-title-fade {
  from { opacity: 0; transform: none; }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) { .intro-film-title { animation-name: intro-film-title-fade; } }
.intro-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
[data-intro-replay][aria-busy="true"] { cursor: progress; }

.intro-skip{position:absolute;right:max(22px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:5;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #fff8e66b;border-radius:999px;background:#173b314d;color:#fff8e6;box-shadow:0 3px 12px #0e2d2026;backdrop-filter:blur(6px);font:400 13px/1.4 var(--sans);opacity:.8;cursor:pointer;transition:opacity .18s,background .18s}.intro-skip:hover,.intro-skip:focus-visible{opacity:1;background:#173b317a}.intro-skip:focus-visible{outline:2px solid #fff8e6;outline-offset:4px}@media(max-width:600px){.intro-skip{right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));padding-inline:15px;font-size:12px}}@media(prefers-reduced-motion:reduce){.intro-skip{transition:none}}
