/* A full-screen welcome, with sound enabled only by an intentional touch. */
@media screen {
  body[data-view="home"] { overflow:hidden }
  body[data-view="home"] main { width:min(100%,480px); height:100vh; height:100dvh; min-height:0; margin-inline:auto; border:0; box-shadow:none }
  body[data-view="home"] #home-view { width:100%; height:100% }
  body[data-view="home"] .site-footer { display:none }
  body[data-view="home"] .site-header {
    position:absolute; inset:0 0 auto; width:min(100%,480px); margin-inline:auto; height:76px;
    padding-top:env(safe-area-inset-top,0px); box-sizing:content-box;
    background:transparent; border:0; backdrop-filter:none;
  }
  body[data-view="home"] .header-inner { position:relative; justify-content:center; padding-inline:22px }
  body[data-view="home"] .brand { color:#e5f8f3; font-size:21px; text-shadow:0 2px 18px #071217 }
  body[data-view="home"] .brand-seal { display:none }
  body[data-view="home"] .brand small { color:#d5eeeb; text-align:center; font-size:9px; letter-spacing:.26em }
  body[data-view="home"] .header-library {
    position:absolute; right:18px; width:44px; height:44px; padding:0;
    justify-content:center; overflow:hidden; font-size:0; color:#d5eeeb;
  }
  body[data-view="home"] .header-library .icon-book { flex-shrink:0 }
  .arrival.arrival-immersive { width:100%; height:100vh; height:100dvh; min-height:0; max-height:none; background:#071217 }
  .arrival-immersive .arrival-art { inset:0; z-index:-1 }
  .arrival-immersive .arrival-art > img,
  .arrival-immersive .arrival-art > .arrival-video {
    position:absolute; inset:0; display:block; width:100%; height:100%;
    object-fit:cover; object-position:center 28%; border:0; border-radius:0; pointer-events:none;
  }
  .arrival-immersive .arrival-video { opacity:0; transition:opacity .4s ease }
  .arrival-immersive .arrival-video.is-ready { opacity:1 }
  .arrival-immersive .arrival-shade {
    pointer-events:none;
    background:linear-gradient(180deg,#07121790 0%,#07121720 16%,#07121700 35%,#07121710 44%,#071217a8 65%,#071217ed 86%,#071217 100%);
  }
  .arrival-immersive .arrival-art:after {
    pointer-events:none;
    background:linear-gradient(90deg,#07121733,transparent 20%,transparent 80%,#07121733);
  }
  .arrival-panel {
    position:absolute; z-index:3;
    inset:auto 26px max(23px,env(safe-area-inset-bottom));
    max-width:508px; margin-inline:auto;
    text-align:center; pointer-events:none;
  }
  .arrival-origin { margin:0 0 11px; color:#c4e7e3; font-size:11px; line-height:1.8; letter-spacing:.06em }
  .arrival-immersive .arrival-title { padding:0 }
  .arrival-immersive h1 {
    margin:0; font-size:clamp(29px,7.9vw,40px); line-height:1.45; letter-spacing:-.045em;
    color:#f0f9f8; text-shadow:0 2px 22px #071217;
  }
  .arrival-immersive h1 em { color:#b6efe4 }
  .arrival-welcome { margin:14px 0 23px; color:#d1e6e5; font:400 14px/1.9 var(--serif); letter-spacing:-.01em }
  .arrival-immersive .arrival-actions { pointer-events:auto }
  .arrival-immersive .button-large {
    width:100%; min-height:62px; justify-content:space-between; padding:17px 24px;
    border:1px solid #bceee8; border-radius:8px; background:linear-gradient(110deg,#b5eee3,#99d8de);
    box-shadow:0 5px 30px #0b39455c,inset 0 1px 0 #e9fffc80;
    color:#082b33; font:500 18px/1.5 var(--serif); letter-spacing:-.025em;
  }
  .arrival-immersive .button-large > span:last-child { font:400 23px var(--sans) }
  .arrival-immersive .arrival-fine { margin:12px 0 0; color:#a5c2c8; font-size:11px; line-height:1.8 }
  .arrival-fine > span { padding-inline:6px }
  .arrival-sound-toggle {
    position:absolute; z-index:4; right:18px; top:calc(82px + env(safe-area-inset-top,0px));
    display:flex; align-items:center; gap:7px; min-height:44px; padding:9px 12px;
    border:1px solid #c3eae32e; border-radius:24px; background:#07121770; color:#e3f4f0;
    font:400 11px var(--sans); backdrop-filter:blur(10px); cursor:pointer;
  }
  .arrival-sound-toggle svg { width:19px; height:19px }
  .arrival-sound-toggle[aria-pressed="false"] .sound-wave,
  .arrival-sound-toggle[aria-pressed="true"] .sound-slash { display:none }
  .arrival-sound-toggle:focus-visible { outline:2px solid #a4e8df; outline-offset:3px }
  .arrival-sound-status { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
  @media (max-height:720px) {
    .arrival-panel { bottom:max(16px,env(safe-area-inset-bottom)); inset-inline:22px }
    .arrival-origin { margin-bottom:8px; font-size:10px }
    .arrival-immersive h1 { font-size:29px; line-height:1.4 }
    .arrival-welcome { margin:11px 0 16px; font-size:13px; line-height:1.8 }
    .arrival-immersive .button-large { min-height:56px; padding:14px 20px; font-size:17px }
    .arrival-immersive .arrival-fine { margin-top:9px; font-size:10px }
  }
  @media (prefers-reduced-motion:reduce) {
    .arrival-immersive .arrival-video { transition:none }
  }
}
