/* Light theme: schedule, event details and contact. */

#dome-app[data-page="events"] .dp-page-head { background:#f7f7f7; }
@container dome (max-width:560px) {
  #dome-app[data-page="events"] .dp-page-head .dp-page-title {
    font-size: min(24px, 5cqw);
    letter-spacing: .04em;
    white-space: nowrap;
  }
  #dome-app[data-page="events"] .dp-page-head > p {
    font-size: min(12px, 2.8cqw);
    letter-spacing: 0;
    white-space: nowrap;
  }
}
#dome-app[data-page="events"] .dp-page-head p {color:#555;}
#dome-app[data-page="events"] .dp-page-head .dp-breadcrumb {background:transparent;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) {
 --dp-bg:#fff; --dp-paper:#f6f6f6; --dp-ink:#161616; --dp-muted:#666; --dp-line:#ddd; --dp-accent:#111;
 background:#fff; color:#161616; min-height:100vh;
}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) :is(.dp-head,.dp-footer,.dp-page-heading,.dp-breadcrumb,.dp-detail-breadcrumb,.dp-event-detail-box,.dp-event-detail-body,.dp-nav) {background:#fff;color:#161616;border-color:#ddd;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) .dp-header-logo { filter:invert(1); }
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) :is(.dp-event-year,.dp-event-count,.dp-sort-button,.dp-pref,.dp-breadcrumb,.dp-footer p,.dp-page-heading p,.dp-event-detail-body dt) {color:#666;border-color:#bbb;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) :is(.dp-nav a,.dp-event-card,.dp-menu-toggle,.dp-button) {color:#161616;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) .dp-menu-toggle i {background:#111;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) .dp-event-card:hover {background:#f5f5f5;}
#dome-app[data-page="eventDetail"] .dp-event-detail-head {background:#f2f2f2;border-color:#ddd;}
#dome-app[data-page="eventDetail"] .dp-event-detail-body dl > div {border-color:#ddd;}
#dome-app[data-page="contact"] .dp-contact input:not([type=checkbox]),
#dome-app[data-page="contact"] .dp-contact textarea {background:#fafafa;color:#111;border-color:#bbb;}
#dome-app[data-page="contact"] .dp-contact label > span {color:#666;}
#dome-app[data-page="contact"] .dp-contact .dp-button {background:#111;color:#fff;border-color:#111;}
#dome-app[data-page="contact"] #dp-contact-confirm dt {color:#666;}
#dome-app[data-page="contact"] #dp-contact-confirm dl > div {border-color:#ddd;}
#dome-app[data-page="contact"] #dp-privacy {background:#fff;color:#111;border-color:#bbb;}
#dome-app[data-page="contact"] #dp-contact-error {color:#a52222;}
/* Shared dark header/footer on the light utility pages. */
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) :is(header.dp-head,footer.dp-footer,nav.dp-nav) {
 background:#000; color:#fff; border-color:#2b373e; --dp-accent:#fff;
}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) :is(header.dp-head,footer.dp-footer) .dp-header-logo {filter:none;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) :is(header.dp-head,footer.dp-footer) :is(a,p,button) {color:#fff;}
#dome-app:is([data-page="events"],[data-page="eventDetail"],[data-page="contact"]) header.dp-head .dp-menu-toggle i {background:#fff;}
/* Event artwork stays uncropped; narrow screens stack the films. */
#dome-app .dp-event-film-posters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  white-space: normal;
}
#dome-app .dp-event-film-poster {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
#dome-app .dp-event-film-title { font-size: 16px; font-weight: 700; }
#dome-app .dp-event-film-poster img {
  display: block;
  width: 100%;
  height: auto;
}
#dome-app .dp-event-film-more { text-decoration: underline; }
@media (max-width: 700px) {
  #dome-app .dp-event-film-posters { grid-template-columns: minmax(0, 1fr); }
}
#dome-app .dp-contact { padding-top: 70px; padding-bottom: 90px; }
#dome-app .dp-contact h1 { font-size: clamp(21px, 3.75vw, 36px); margin-bottom: 24px; }
#dome-app .dp-contact form, #dome-app #dp-contact-confirm { max-width: 850px; margin: 36px auto; }
#dome-app .dp-contact form > label, #dome-app .dp-contact-category { display: block; margin: 26px 0; line-height: 1.8; }
#dome-app .dp-contact label > span { font-size: 12px; color: #f7cc34; }
#dome-app .dp-contact input:not([type=checkbox]), #dome-app .dp-contact textarea {
 display: block; width: 100%; margin-top: 10px; padding: 14px; border: 1px solid #607780; background: #101b21; color: #fff; font: inherit; font-size: 16px; border-radius: 0;
}
#dome-app .dp-contact textarea { resize: vertical; }
#dome-app .dp-contact button { font: inherit; color: inherit; }
#dome-app .dp-contact .dp-button { border: 1px solid #94abb4; background: #172d39; padding: 14px 24px; }
#dome-app .dp-contact .dp-contact-consent { display: flex; align-items: flex-start; gap: 12px; }
#dome-app .dp-contact-consent input { width: 20px; height: 20px; flex-shrink: 0; margin-top: 5px; }
#dome-app .dp-contact-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#dome-app #dp-privacy-open { background: none; border: 0; text-decoration: underline; text-align: left; padding: 12px 0; }
#dome-app #dp-contact-confirm dl > div { padding: 18px 0; border-bottom: 1px solid #354951; }
#dome-app #dp-contact-confirm dt { color: #bacad2; }
#dome-app #dp-contact-confirm dd { margin: 10px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
#dome-app .dp-contact-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 24px; }
#dome-app #dp-contact-error { color: #ffb4a9; }
#dome-app .dp-contact button:disabled { opacity: .5; cursor: wait; }
#dome-app #dp-privacy { max-width: 760px; width: 90%; max-height: 80vh; padding: 28px; background: #101b21; color: #fff; border: 1px solid #607780; line-height: 1.9; }
#dome-app #dp-privacy::backdrop { background: #000b; }
#dome-app #dp-privacy h2 { font-size: 22px; margin: 24px 0; }
#dome-app #dp-privacy h3 { font-size: 18px; margin-top: 24px; }
#dome-app #dp-privacy ul { padding-left: 24px; }
#dome-app #dp-privacy-close { display: block; margin-left: auto; background: none; border: 1px solid #607780; padding: 8px 14px; }
html {
  scroll-behavior: smooth;
  background: #070a0c;
}
body {
  margin: 0;
}
a {
  color: inherit;
  text-decoration: none;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
img {
  max-width: 100%;
}
* {
  box-sizing: border-box;
}
:focus-visible {
  outline: 3px solid #f7cc34;
  outline-offset: 5px;
}
#dome-app {
  font-size: 16px;
  overflow-wrap: anywhere;
}
#dome-app .dp-wrap {
  padding-left: max(6%, calc((100% - 1260px) / 2));
  padding-right: max(6%, calc((100% - 1260px) / 2));
}
#dome-app .dp-brand {
  min-height: 44px;
}
#dome-app .dp-header-logo {
  display: block;
  width: 200px;
  height: auto;
}
#dome-app .dp-nav a {
  font-size: 14px;
  white-space: nowrap;
  padding: 10px 0;
}
#dome-app .dp-nav a[aria-current="page"] {
  color: var(--dp-accent);
}
#dome-app .dp-button,
#dome-app .dp-text-link {
  font-size: 14px;
  min-height: 48px;
}
#dome-app .dp-hero-description,
#dome-app .dp-about p,
#dome-app .dp-detail-story p {
  font-size: 16px;
}
#dome-app .dp-hero h1.dp-hero-logo {
  width: min(100%, 540px);
  margin: 0;
  font-size: inherit;
  line-height: 0;
}
#dome-app .dp-hero-logo img {
  display: block;
  width: 100%;
  height: auto;
}
#dome-app .dp-event-film-line,
#dome-app .dp-pref,
#dome-app .dp-sort-button,
#dome-app .dp-sort-label {
  font-size: 14px;
}
#dome-app .dp-event-year,
#dome-app .dp-event-count,
#dome-app .dp-sort-explanation,
#dome-app .dp-sample-note,
#dome-app .dp-small-note,
#dome-app .dp-footer p,
#dome-app .dp-design-note {
  font-size: 12px;
}
#dome-app .dp-event-card {
  grid-template-columns: 240px 92px minmax(0, 1fr) 24px;
}
#dome-app .dp-event-card h3 {
  font-size: 17px;
}
#dome-app .dp-detail-story p {
  white-space: pre-line;
}
#dome-app .dp-event-detail-body dl > div {
  font-size: 16px;
}
#dome-app .dp-facts dl > div,
#dome-app .dp-event-detail-body a {
  font-size: 14px;
}
#dome-app .dp-breadcrumb,
#dome-app .dp-breadcrumb a {
  font-size: 12px;
}
#dome-app .dp-skip {
  position: absolute;
  left: 16px;
  top: -120px;
  z-index: 20;
  background: #f7cc34;
  color: #070a0c;
  padding: 12px;
}
#dome-app .dp-skip:focus {
  top: 8px;
}
#dome-app .dp-catalog .dp-film-art {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1500/1061;
  object-fit: contain;
  background: #101a21;
}
#dome-app .dp-related .dp-film {
  min-height: 0;
  border: 0;
  background: none;
}
#dome-app .dp-related .dp-film:after {
  display: none;
}
#dome-app .dp-related .dp-film-art {
  position: static;
  height: auto;
  width: 100%;
  aspect-ratio: 1500/1061;
  object-fit: contain;
}
#dome-app .dp-related .dp-film-topline {
  position: static;
  margin-top: 12px;
}
#dome-app .dp-related .dp-film-body {
  min-height: 0;
  padding: 16px 0;
}
#dome-app .dp-related .dp-film h3 {
  min-height: 0;
  font-size: 17px;
}
#dome-app .dp-film-number {
  font-size: 14px;
}
#dome-app .dp-loading {
  padding: 24px 6%;
  color: #bacad2;
}
#dome-app .dp-error {
  padding: 32px 6%;
  background: #241d14;
  color: #f1e5d0;
}
#dome-app .dp-error button {
  margin-top: 12px;
}
#dome-app .dp-media-video {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#dome-app .dp-video-toggle {
  position: absolute;
  right: 6%;
  bottom: 90px;
  z-index: 2;
  border: 1px solid #a8b6bd;
  background: #070a0cd9;
  color: white;
  padding: 10px 16px;
  min-height: 44px;
  font-size: 14px;
}
#dome-app .dp-film-player {
  width: 100%;
  margin-top: 24px;
  aspect-ratio: 16/9;
  background: #101a21;
}
#dome-app .dp-detail-art.is-poster {
  margin-inline: auto;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: #101a21;
  min-height: 0;
  aspect-ratio: 1500/1061;
  max-height: 850px;
}
#dome-app .dp-detail-art.is-poster:before {
  display: none;
}
#dome-app .dp-detail-heading {
  text-align: center;
  padding: 34px 6%;
  background: #0a1117;
  max-width: none;
}
#dome-app .dp-not-found {
  padding: 72px 6%;
}
#dome-app .dp-demo-note {
  font-size: 12px;
  padding: 14px 6%;
  background: #111b23;
  color: #b9c8d0;
}
#dome-app .dp-event-detail-body dd {
  white-space: pre-line;
}
@container dome (max-width:800px) {
  #dome-app .dp-event-card {
    grid-template-columns: 210px 85px minmax(0, 1fr) 18px;
    gap: 15px;
  }
  #dome-app .dp-event-dates {
    font-size: 28px;
  }
}
@container dome (max-width:700px) {
  #dome-app .dp-event-card {
    grid-template-columns: minmax(0, 1fr) 90px;
    gap: 12px;
  }
  #dome-app .dp-event-info {
    grid-column: 1/-1;
  }
  #dome-app .dp-event-arrow {
    display: none;
  }
}
@container dome (max-width:900px) {
  #dome-app .dp-header-logo {
    width: 176px;
  }
  #dome-app .dp-nav a {
    font-size: 15px;
    display: block;
    width: 100%;
    min-height: 44px;
    padding: 12px 0;
  }
}
@container dome (max-width:560px) {
  #dome-app .dp-wrap {
    padding-left: 6%;
    padding-right: 6%;
  }
  #dome-app .dp-event-dates {
    font-size: 29px;
    white-space: normal;
  }
  #dome-app .dp-event-card {
    grid-template-columns: minmax(0, 1fr) 80px;
  }
  #dome-app .dp-pref {
    font-size: 12px;
    padding: 4px;
  }
  #dome-app .dp-event-dates small {
    font-size: 11px;
  }
  #dome-app .dp-sort-group {
    gap: 14px;
  }
  #dome-app .dp-latest h2 {
    font-size: 23px;
  }
  #dome-app .dp-latest-content > p:not(.dp-latest-kicker) {
    font-size: 15px;
  }
  #dome-app .dp-video-toggle {
    bottom: 24px;
  }
  #dome-app .dp-facts .dp-button {
    width: 100%;
    font-size: 14px;
  }
  #dome-app .dp-event-detail-body dl > div {
    display: block;
  }
  #dome-app .dp-event-detail-body dt {
    margin-bottom: 8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  * {
    transition: none !important;
  }
}

#dome-app .dp-hero-image {
  z-index: -4;
}

#dome-app .dp-catalog-group + .dp-catalog-group {
  margin-top: 72px;
  padding-top: 40px;
  border-top: 1px solid var(--dp-line);
}
#dome-app .dp-catalog-group-heading {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 0 0 28px;
  border-left: 4px solid var(--dp-accent);
  padding-left: 16px;
}
#dome-app .dp-catalog-group-heading h2 {
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: clamp(24px, 3cqw, 34px);
  line-height: 1.25;
  letter-spacing: 0.04em;
}
#dome-app .dp-catalog-group-heading > span {
  color: var(--dp-muted);
  font-size: 13px;
  white-space: nowrap;
}
#dome-app .dp-film-topline {
  justify-content: flex-end;
}
#dome-app .dp-catalog .dp-film-topline {
  justify-content: flex-end;
}

/* About copy supplied by the client. */
#dome-app .dp-about .dp-about-title {
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(38px, 5cqw, 66px);
  line-height: 1.15;
  letter-spacing: .02em;
}
#dome-app .dp-about-copy { max-width: 660px; }
#dome-app .dp-about-copy p { max-width: none; }
#dome-app .dp-about-message {
  max-width: 760px;
  margin: 32px 0 0;
  font-size: clamp(18px, 2cqw, 26px);
  line-height: 1.85;
  color: #f0f2f1;
}

/* Category introductions between the about and latest sections. */
#dome-app .dp-experiences { padding-top: 32px; padding-bottom: 100px; }
#dome-app .dp-experience {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 88px);
  align-items: center;
  padding: 72px 0;
  border-top: 1px solid var(--dp-line);
}
#dome-app .dp-experience-visual img { display: block; width: 100%; height: auto; }
#dome-app .dp-experience h2 {
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(36px, 4.5vw, 72px);
  line-height: 1.05;
  letter-spacing: -.02em;
  margin-bottom: 28px;
}
#dome-app .dp-experience h2 span { color: var(--dp-accent); }
#dome-app .dp-experience h3 { font-size: clamp(23px, 2.2vw, 34px); line-height: 1.65; margin-bottom: 24px; }
#dome-app .dp-experience p { font-size: 16px; line-height: 2.1; color: var(--dp-muted); margin-top: 16px; }
#dome-app .dp-experience .dp-button { margin-top: 30px; }
#dome-app .dp-experience-vr .dp-experience-visual { order: 2; }
@media (max-width: 900px) {
  #dome-app .dp-experiences { padding-top: 0; padding-bottom: 48px; }
  #dome-app .dp-experience { grid-template-columns: minmax(0, 1fr); padding: 40px 0 48px; gap: 30px; }
  #dome-app .dp-experience-vr .dp-experience-visual { order: 0; }
  #dome-app .dp-experience h2 { font-size: clamp(36px, 8.5vw, 60px); margin-bottom: 22px; }
  #dome-app .dp-experience .dp-button { width: 100%; padding-inline: 14px; font-size: 13px; }
}

#dome-app .dp-video-note {
  position: absolute;
  top: 88px;
  right: 6%;
  z-index: 2;
  margin: 0;
  padding: 4px 8px;
  background: #070a0c99;
  color: #fff;
  font-size: 12px;
  line-height: 1.6;
}
@media (max-width: 560px) {
  #dome-app .dp-video-note { top: 78px; font-size: 11px; }
}

/* Center the opening hero copy and supplied brand artwork. */
#dome-app .dp-hero-content { align-items: center; text-align: center; }
#dome-app .dp-hero h1.dp-hero-logo { margin-inline: auto; }
#dome-app .dp-hero-message { width: 100%; }
#dome-app .dp-hero-description { margin-inline: auto; }
#dome-app .dp-hero-actions { justify-content: center; }
#dome-app .dp-hero-tail { width: 100%; flex-direction: column; justify-content: center; gap: 4px; }
#dome-app .dp-hero-tail .dp-en { max-width: none; }
#dome-app .dp-hero-actions .dp-button { justify-content: center; gap: 24px; }
#dome-app .dp-video-note { right: 50%; transform: translateX(50%); white-space: nowrap; }

/* The following content rises over the opening video as the page scrolls. */
#dome-app [data-view="home"] { position: relative; isolation: isolate; }
#dome-app .dp-hero { position: sticky; top: var(--dp-hero-sticky-top, 0px); z-index: 0; }
#dome-app .dp-home-content {
  position: relative;
  z-index: 1;
  background: var(--dp-bg);
  box-shadow: 0 -30px 70px #0005;
}
@media (prefers-reduced-motion: reduce) {
  #dome-app .dp-hero { position: relative; top: auto; }
}

/* Shared black header with white navigation. */
#dome-app .dp-head,
#dome-app[data-page="home"] .dp-head { background: #000; color: #fff; }
#dome-app .dp-nav a,
#dome-app .dp-nav a[aria-current="page"],
#dome-app .dp-nav .dp-nav-event { color: #fff; background: transparent; }
#dome-app .dp-nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 7px; }
#dome-app .dp-nav .dp-nav-event { border: 0; padding: 10px 0; }
@container dome (max-width:900px) {
  #dome-app .dp-nav { background: #000; }
  #dome-app .dp-nav .dp-nav-event { padding: 12px 0; text-align: left; }
}

#dome-app .dp-head {
  justify-content: flex-start;
  gap: 36px;
  padding-inline: 3%;
}
@container dome (max-width:900px) {
  #dome-app .dp-head { padding-inline: 6%; gap: 16px; }
  #dome-app .dp-menu-toggle { margin-left: auto; }
}

/* October art direction: cinematic oversized lettering and editorial layout. */
#dome-app[data-page="home"] .dp-head { background: linear-gradient(#00121ec9, transparent); border: 0; height: 104px; margin-bottom: -104px; padding: 22px 3%; gap: 32px; }
#dome-app[data-page="home"] .dp-header-logo { width: 190px; }
#dome-app .dp-header-caption { display: none; }
#dome-app[data-page="home"] .dp-header-caption { display: block; margin-left: auto; font: 11px/1.8 "Outfit", sans-serif; letter-spacing: 4px; order: 2; }
#dome-app[data-page="home"] .dp-menu-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; order: 3; width: 52px; height: 52px; min-width: 52px; padding: 0; border: 1px solid #fff; border-radius: 50%; background: transparent; margin: 0; }
#dome-app[data-page="home"] .dp-menu-toggle span { display: none; }
#dome-app[data-page="home"] .dp-menu-toggle i { display: block; position: static; width: 19px; height: 1px; background: white; margin: 0; }
#dome-app[data-page="home"][data-menu="open"] .dp-nav { display: flex; position: absolute; top: 88px; right: 3%; left: auto; width: min(360px, 94%); padding: 24px; flex-direction: column; align-items: stretch; background: #031522f5; border: 1px solid #ffffff40; }
#dome-app .dp-hero { min-height: 100svh; padding: 185px 4% 60px; }
#dome-app .dp-hero::before { background: linear-gradient(0deg,#000a13 0%,#00132299 25%,#00172908 65%,#00121b33 100%); }
#dome-app .dp-hero-content { text-align: left; align-items: stretch; }
#dome-app .dp-overline { font-size: 18px; letter-spacing: .22em; margin: 0 0 30px; }
#dome-app .dp-overline::after { content: ""; display: block; width: 76px; height: 1px; background: #ffffffb3; margin-top: 24px; }
#dome-app .dp-hero h1.dp-hero-logo { position: relative; width: min(100%,1400px); aspect-ratio: 1.975; margin: 0; line-height: 0; }
#dome-app .dp-hero-logo img { display: none; }
#dome-app .dp-hero h1.dp-hero-logo > span { display: block; position: absolute; width: 82%; height: 50%; background: linear-gradient(180deg,#fff 10%,#ddf7ffdf 50%,#6ac4e960); mask-image: url("assets/dome-planet-logo.png"); mask-size: 100% 200%; mask-repeat: no-repeat; -webkit-mask-image: url("assets/dome-planet-logo.png"); -webkit-mask-size: 100% 200%; -webkit-mask-repeat: no-repeat; }
#dome-app .dp-logo-dome { top: 0; left: 0; mask-position: top; -webkit-mask-position: top; }
#dome-app .dp-logo-planet { bottom: 0; right: 0; mask-position: bottom; -webkit-mask-position: bottom; }
#dome-app .dp-hero-message { width: 100%; margin-top: -20px; position: relative; z-index: 1; }
#dome-app .dp-hero-message h2 { font-size: clamp(44px,5vw,76px); line-height: 1.18; letter-spacing: .06em; font-weight: 800; }
#dome-app .dp-hero-message h2 span { color: #ffcc2b; }
#dome-app .dp-hero-description { margin: 22px 0 0; color: #fff; font-size: 17px; line-height: 1.9; }
#dome-app .dp-hero-actions { justify-content: flex-start; margin-top: 34px; }
#dome-app .dp-hero-actions .dp-button { background: #00101a66; color: #fff; border: 1.5px solid #fff; border-radius: 60px; width: 300px; padding: 17px 30px; justify-content: space-between; box-shadow: none; }
#dome-app .dp-hero-actions .dp-button:hover { background: #ffffff20; }
#dome-app .dp-hero-tail { margin-top: 48px; padding: 0; border: 0; flex-direction: row; align-items: flex-end; justify-content: space-between; }
#dome-app .dp-journey-meta { display: flex; flex-direction: column; gap: 15px; }
#dome-app .dp-journey-rule { display: flex; align-items: center; gap: 28px; font: 12px "Outfit",sans-serif; letter-spacing: 4px; }
#dome-app .dp-journey-rule span { width: 180px; height: 1px; background: #ffffff60; position: relative; }
#dome-app .dp-journey-rule span::before { content: ""; display: block; width: 36px; height: 2px; background: white; }
#dome-app .dp-hero-tail .dp-en, #dome-app .dp-journey-topics { font: 10px/1.8 "Outfit",sans-serif; letter-spacing: 3px; color: #fff; }
#dome-app .dp-journey-topics { color: #b4cbd7; }
#dome-app .dp-scroll { display: flex; flex-direction: column; gap: 18px; padding: 0; margin-right: 45%; font-size: 10px; }
#dome-app .dp-scroll span { display: block; width: 1px; height: 60px; background: white; }
#dome-app .dp-hero-orbit { position: absolute; right: 6%; bottom: 380px; display: flex; align-items: center; gap: 20px; font: 11px/1.8 "Outfit",sans-serif; letter-spacing: 4px; }
#dome-app .dp-hero-orbit i { display: block; width: 85px; height: 85px; border: 1px solid #ffffff55; border-radius: 50%; outline: 1px solid #ffffff25; outline-offset: 15px; }
#dome-app .dp-video-note { top: auto; bottom: 24px; right: 4%; transform: none; background: none; font-size: 10px; }
#dome-app .dp-video-toggle { right: 4%; bottom: 58px; font-size: 11px; border-radius: 40px; border-color: #ffffff66; padding: 6px 14px; }
@container dome (max-width:900px) {
 #dome-app[data-page="home"] .dp-head { height: 90px; margin-bottom: -90px; padding: 20px 6%; justify-content: space-between; }
 #dome-app[data-page="home"] .dp-header-logo { width: 155px; }
 #dome-app[data-page="home"] .dp-header-caption { display: none; }
 #dome-app[data-page="home"] .dp-menu-toggle { width: 44px; height: 44px; min-width: 44px; }
 #dome-app .dp-hero { padding: 280px 8% 38px; min-height: 100svh; }
 #dome-app .dp-overline { text-align: center; font-size: 13px; letter-spacing: .16em; margin-bottom: 22px; }
 #dome-app .dp-overline::after { width: 50px; margin: 18px auto 0; }
 #dome-app .dp-hero h1.dp-hero-logo { width: 104%; max-width: none; margin: 0 -2%; aspect-ratio: 2000 / 1235; }
 #dome-app .dp-hero-logo img { display: none; }
 #dome-app .dp-hero h1.dp-hero-logo > span { display: block; width: 100%; left: 0; right: auto; }
 #dome-app .dp-hero-message { margin-top: 30px; }
 #dome-app .dp-hero-message h2 { font-size: clamp(40px,12vw,64px); line-height: 1.2; letter-spacing: .04em; }
 #dome-app .dp-hero-description { margin-top: 18px; font-size: 14px; letter-spacing: .01em; }
 #dome-app .dp-hero-actions { margin-top: 30px; }
 #dome-app .dp-hero-actions .dp-button { width: 100%; min-height: 56px; padding: 16px 25px; }
 #dome-app .dp-hero-tail { margin-top: 38px; align-items: flex-start; }
 #dome-app .dp-journey-rule { font-size: 11px; gap: 20px; }
 #dome-app .dp-journey-rule span { width: 95px; }
 #dome-app .dp-hero-tail .dp-en { max-width: 185px; font-size: 9px; line-height: 2; letter-spacing: 2.5px; }
 #dome-app .dp-journey-topics, #dome-app .dp-hero-orbit { display: none; }
 #dome-app .dp-scroll { margin: 28px 0 0; font-size: 9px; letter-spacing: 2px; }
 #dome-app .dp-scroll span { height: 64px; }
 #dome-app .dp-video-toggle { bottom: 8px; right: 8%; min-height: 36px; font-size: 10px; }
 #dome-app .dp-video-note { bottom: 12px; left: 8%; right: auto; padding: 0; font-size: 9px; }
}

/* Single-line hero wordmark, assembled from the supplied logo artwork. */
#dome-app .dp-hero h1.dp-hero-logo {
  width: 100%; max-width: 1400px; aspect-ratio: 5.65; margin: 24px auto 50px;
}
#dome-app .dp-hero h1.dp-hero-logo > span {
  top: 0; bottom: auto; height: 100%;
  background: linear-gradient(180deg,#fff 10%,#ddf7ffdf 55%,#6ac4e980);
}
#dome-app .dp-hero h1.dp-hero-logo > .dp-logo-dome {
  left: 0; right: auto; width: 42%;
  mask-size: 133.333% 200%; -webkit-mask-size: 133.333% 200%;
  mask-position: left top; -webkit-mask-position: left top;
}
#dome-app .dp-hero h1.dp-hero-logo > .dp-logo-planet {
  left: auto; right: 0; width: 56%;
  mask-size: 100% 200%; -webkit-mask-size: 100% 200%;
  mask-position: right bottom; -webkit-mask-position: right bottom;
}
@container dome (max-width:900px) {
  #dome-app .dp-hero h1.dp-hero-logo { width: 110%; margin: 10px -5% 0; }
}

/* Full-width wordmark and centered Japanese introduction. */
#dome-app .dp-hero h1.dp-hero-logo { width: calc(100% / .92); max-width: none; margin: 24px calc(-4% / .92) 50px; }
#dome-app .dp-overline { text-align: center; }
#dome-app .dp-overline::after { margin-inline: auto; }
#dome-app .dp-hero-message { text-align: center; }
#dome-app .dp-hero-message h2 { font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif; font-size: clamp(24px,4.5cqw,70px); font-weight: 600; letter-spacing: .04em; line-height: 1.5; white-space: nowrap; }
#dome-app .dp-hero-description { text-align: center; }
#dome-app .dp-hero-actions { justify-content: center; }
#dome-app .dp-hero-tail { justify-content: center; }
#dome-app .dp-scroll { margin-right: 0; align-items: center; }
@container dome (max-width:900px) {
 #dome-app .dp-hero h1.dp-hero-logo { width: calc(100% / .84); margin: 10px calc(-8% / .84) 0; }
 #dome-app .dp-hero-message h2 { font-size: 5.5cqw; letter-spacing: 0; }
 #dome-app .dp-scroll { margin: 20px 0 0; }
}
#dome-app .dp-hero-description { margin-inline: auto; }

/* Refine the opening typography and tighten the space above the wordmark. */
#dome-app .dp-overline { align-self: center; width: fit-content; margin-inline: auto; margin-bottom: 12px; }
#dome-app .dp-overline::after { width: 100%; margin-top: 10px; }
#dome-app .dp-hero h1.dp-hero-logo { margin-top: 0; }
#dome-app .dp-hero-message h2 { font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif; font-weight: 300; font-size: clamp(28px,5.6cqw,88px); }
@container dome (max-width:900px) {
 #dome-app .dp-overline { margin-bottom: 10px; }
 #dome-app .dp-overline::after { width: 100%; margin-top: 8px; }
 #dome-app .dp-hero h1.dp-hero-logo { margin-top: 0; }
 #dome-app .dp-hero-message h2 { font-size: 6.6cqw; font-weight: 300; }
}

/* Soft Mincho headline and centered mobile branding. */
@font-face { font-family: "DP Shippori Mincho"; src: url("assets/ShipporiMincho-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
#dome-app .dp-hero-message h2 { font-family: "DP Shippori Mincho", "Yu Mincho", serif; font-weight: 400; }
#dome-app .dp-overline { font-size: 31.5px; }
#dome-app .dp-hero-actions .dp-button { justify-content: center; text-align: center; gap: 24px; }
@container dome (max-width:900px) {
 #dome-app .dp-overline { font-size: 22.75px; letter-spacing: .08em; }
 #dome-app .dp-hero h1.dp-hero-logo { width: 100%; max-width: none; margin: 10px auto 0; aspect-ratio: auto; }
 #dome-app .dp-hero-logo img { display: block; width: 100%; height: auto; opacity: .93; }
 #dome-app .dp-hero h1.dp-hero-logo > span { display: none; }
}

/* Reduce the hero wordmark and soften the headline. */
#dome-app .dp-hero h1.dp-hero-logo { width: calc(88% / .92); margin-inline: auto; }
#dome-app .dp-hero-message h2 { color: #fff; opacity: .7; }
#dome-app .dp-hero-message h2 span { color: inherit; }
@container dome (max-width:900px) {
 #dome-app .dp-hero h1.dp-hero-logo { width: 88%; margin-inline: auto; }
}

/* Japanese about heading with a small English label. */
#dome-app .dp-about-eyebrow { display: block; font-size: 14px; line-height: 1.5; letter-spacing: .12em; margin-bottom: 14px; color: #bac9ce; }
#dome-app .dp-about .dp-about-title { font-family: inherit; font-size: clamp(24px,3.4cqw,48px); line-height: 1.5; letter-spacing: .02em; margin: 0 0 28px; }
@container dome (max-width:600px) {
 #dome-app .dp-about-eyebrow { font-size: 11px; margin-bottom: 10px; }
 #dome-app .dp-about .dp-about-title { font-size: 5.7cqw; }
}

/* About background film: dark reading area fading into the footage. */
#dome-app .dp-about-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
#dome-app .dp-about::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg,rgba(3,10,16,.96) 0%,rgba(3,10,16,.92) 33.333%,rgba(3,10,16,.65) 53%,rgba(3,10,16,.12) 80%,rgba(3,10,16,.04) 100%); }
#dome-app .dp-about-video-toggle { position: absolute; bottom: 20px; right: 4%; color: white; background: #00101a88; border: 1px solid #ffffff66; border-radius: 30px; padding: 10px 16px; cursor: pointer; font: inherit; font-size: 11px; }
@container dome (max-width:900px) {
 #dome-app .dp-about::before { background: linear-gradient(90deg,#030a10f5 0%,#030a10de 33.333%,#030a1099 100%); }
}

/* Mobile about: readable black panel with a separate film below the copy. */
#dome-app .dp-about-mobile-video { display: none; }
@container dome (max-width:900px) {
 #dome-app .dp-about { background: #000; }
 #dome-app .dp-about::before, #dome-app .dp-about-video, #dome-app .dp-about-video-toggle { display: none; }
 #dome-app .dp-about-mobile-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #000; margin: 28px 0; }
}

/* Mobile introduction order: heading, image, description, then link. */
@media (max-width:900px) {
 #dome-app .dp-experience { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
 #dome-app .dp-experience-copy { display: contents; }
 #dome-app .dp-experience .dp-section-eyebrow,
 #dome-app .dp-experience h2,
 #dome-app .dp-experience h3 { order: 0; }
 #dome-app .dp-experience .dp-experience-visual { order: 1; margin: 0 0 12px; }
 #dome-app .dp-experience p { order: 2; }
 #dome-app .dp-experience .dp-button { order: 3; }
}

/* Mobile hero: intentional two-line introduction and a higher content group. */
@container dome (max-width:900px) {
 #dome-app .dp-hero { padding-top: 200px; }
 #dome-app .dp-overline > span { display: block; white-space: nowrap; }
 #dome-app .dp-overline { font-size: min(22.75px,5.7cqw); }
}

/* Show the complete latest-film artwork on phones, above its description. */
@container dome (max-width:900px) {
 #dome-app .dp-latest { min-height: 0; justify-content: flex-start; background: #050909; }
 #dome-app .dp-latest::after { display: none; }
 #dome-app .dp-latest-top { order: 0; margin-bottom: 24px; }
 #dome-app .dp-latest-art {
  position: relative;
  inset: auto;
  z-index: auto;
  order: 1;
  width: 100%;
  aspect-ratio: 1500 / 1061;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
 }
 #dome-app .dp-latest-content { order: 2; padding-top: 28px; max-width: none; }
}

/* Films catalog: retain only a left-aligned schedule link. */
#dome-app .dp-collection-schedule { display: flex; justify-content: flex-start; padding-top: 24px; padding-bottom: 64px; }

/* Regional separators on both prefecture-sorted schedules. */
#dome-app .dp-home-event-count { display: block; margin-top: 16px; color: var(--dp-muted, #aebec5); font-size: 14px; }
#dome-app [data-event-list="home"] .dp-event-region-heading { background: #101b20; color: #eef3f5; border-top-color: #e9cc3b; }
#dome-app [data-event-list="home"] .dp-event-region-heading > span { color: #aebec5; }
#dome-app .dp-event-region { grid-column: 1 / -1; min-width: 0; }
#dome-app .dp-event-region + .dp-event-region { margin-top: 36px; }
#dome-app .dp-event-region-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; background: #f3f3f3; border-top: 2px solid #161616; color: #161616; }
#dome-app .dp-event-region-heading :is(h2,h3) { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: .08em; }
#dome-app .dp-event-region-heading > span { font-size: 13px; white-space: nowrap; color: #666; }
@media (max-width: 600px) {
 #dome-app .dp-event-region-heading { padding: 14px 16px; }
 #dome-app .dp-event-region-heading :is(h2,h3) { font-size: 18px; }
 #dome-app .dp-event-region + .dp-event-region { margin-top: 24px; }
}

/* Mobile latest film: release heading, full artwork, then details. */
@container dome (max-width:900px) {
 #dome-app .dp-latest-content { display: contents; }
 #dome-app .dp-latest-content > * { order: 3; }
 #dome-app .dp-latest-content > .dp-latest-location { order: 1; margin-bottom: 28px; }
 #dome-app .dp-latest-art { order: 2; }
}
