
.g-dark, .g-over, .g-tun, .g-dream, .g-fly, .g-keep, .g-ink { position: absolute; display: block; pointer-events: none; }
.g-over > i, .g-dream > i, .g-fly > i, .g-keep > i { position: absolute; display: block; pointer-events: none; }

.g-dark { opacity: 0; will-change: opacity; }
.g-dark-top { left: 0; right: 0; top: 0; z-index: 9; background: linear-gradient(rgba(8, 10, 28, .9), rgba(10, 12, 32, .88) 70%, rgba(10, 12, 32, .8)); }
.g-dark-wood { inset: 0; z-index: 0; background: rgba(10, 12, 32, .74); }
.g-dark-sheet { inset: 0; z-index: 3; border-radius: inherit; background: rgba(10, 12, 32, .62); }
.g-tun { left: 0; top: 0; bottom: 0; width: 200%; z-index: 1; opacity: 0; background: url(art/g-tunnel.svg) 0 0 / auto 100% repeat-x; will-change: transform, opacity; }
.g-over { inset: 0; z-index: 10; }

.g-beam { opacity: 0; transform-origin: 50% 0; transform: perspective(700px) rotateX(32deg) skewX(12deg);
  background: linear-gradient(90deg, transparent 2%, rgba(232, 228, 246, .16) 10%, rgba(232, 228, 246, .16) 26%, transparent 33%, transparent 36%, rgba(232, 228, 246, .16) 43%, rgba(232, 228, 246, .16) 57%, transparent 64%, transparent 67%, rgba(232, 228, 246, .16) 74%, rgba(232, 228, 246, .16) 90%, transparent 98%);
  -webkit-mask: linear-gradient(transparent, #000 12%, rgba(0, 0, 0, .55) 50%, transparent); mask: linear-gradient(transparent, #000 12%, rgba(0, 0, 0, .55) 50%, transparent); }

.g-fog { aspect-ratio: 260 / 200; opacity: 0; background: url(art/g-fog.svg) center / contain no-repeat; }
.g-ticket { aspect-ratio: 240 / 150; opacity: 0; transform: rotate(-7deg); background: url(art/g-ticket.svg) center / contain no-repeat; }

.g-glass { position: absolute; display: block; overflow: hidden; pointer-events: none; }
.g-girl-glass { z-index: 10; mix-blend-mode: screen; }
.g-girl { position: absolute; display: block; opacity: 0; pointer-events: none; will-change: opacity, transform; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  filter: sepia(.4) hue-rotate(176deg) saturate(1.5) brightness(.94) contrast(1.32) blur(.5px); }
.g-girl-i { position: absolute; inset: 0; width: 100%; height: 100%; display: block; max-width: none; }
.g-girl-2 { opacity: .28; transform: translate(1.7%, .5%); }

.g-hand { aspect-ratio: 120 / 170; opacity: 0; transform: rotate(-10deg); background: url(art/g-hand.svg) center / contain no-repeat; }
.g-hand-2 { transform: rotate(14deg) scaleX(-1); }
.g-guest { aspect-ratio: 200 / 260; opacity: 0; background: url(art/g-guest.svg) center / contain no-repeat; }

.g-keep { inset: 0; z-index: 10; }
.g-ticket-face { aspect-ratio: 240 / 150; opacity: 0; transform: rotate(-7deg); background: url(art/g-ticket-face.svg) center / contain no-repeat; filter: drop-shadow(0 2px 3px rgba(40, 28, 16, .35)); }
.g-tassel { aspect-ratio: 60 / 140; transform-origin: 50% 0; background: url(art/tassel.svg) center / contain no-repeat; will-change: transform; }
.car.g-tassel-on .cw-roll::after { visibility: hidden; }
.g-late { position: absolute; inset: 0; display: block; pointer-events: none; }

.g-ink { inset: 0; z-index: 4; opacity: 0; will-change: opacity; }
.g-ink-line { position: absolute; display: block; white-space: nowrap; transform-origin: 0 50%; padding: 14px; margin: -14px;  font-family: 'Yubi Mincho', serif; font-weight: 700; font-size: clamp(17px, 4.7vw, 23px); letter-spacing: .12em; line-height: 1.5;
  color: #d6ffe6; filter: url(#g-ink-pen);
  text-shadow: 0 0 1px rgba(214, 255, 230, .95), 0 0 6px rgba(150, 255, 200, .75), 0 0 16px rgba(110, 240, 170, .5), 0 0 30px rgba(90, 220, 150, .35); }
.g-ink[lang='en'] .g-ink-line { font-family: 'Yubi Fell', serif; font-style: italic; letter-spacing: .03em; font-size: clamp(15px, 4.1vw, 20px); }
.g-ink-line > span { display: inline-block; white-space: pre; }
.g-ink-y { color: #e6ffc4; }

.g-dream { inset: 0; z-index: 1; }
.g-dim { inset: 0; opacity: 0; background: radial-gradient(70% 50% at 50% 70%, rgba(8, 10, 30, .58), rgba(8, 10, 30, .34) 70%); }
.g-stars, .g-cons { left: 0; right: 0; top: 0; height: 44%; opacity: 0; background: url(art/g-stars.svg) center top / cover no-repeat; -webkit-mask: linear-gradient(#000 60%, transparent); mask: linear-gradient(#000 60%, transparent); }
.g-cons { background-image: url(art/g-constellation.svg); }
.g-fly { inset: 0; z-index: 3; }
.g-seg { background: url(art/train.svg) 0 0 no-repeat; transform-origin: 50% 50%; will-change: transform; }
.g-puff { left: 0; top: 0; opacity: 0; transform-origin: 50% 50%; background: url(art/g-cloud.svg) center / contain no-repeat; will-change: transform, opacity; }
.g-puff-2 { background-image: url(art/g-cloud-2.svg); }

.g-arrived .v-train, .g-arrived .v-train *, .g-arrived .hero-title, .g-arrived .hero-title *, .g-arrived .hero-sub, .g-arrived .vista, .g-arrived .moon svg, .g-arrived .moon figcaption { animation-delay: -30s !important; }

html[data-motion='reduce'] .g-dark, html[data-motion='reduce'] .g-over, html[data-motion='reduce'] .g-tun, html[data-motion='reduce'] .g-dream, html[data-motion='reduce'] .g-fly, html[data-motion='reduce'] .g-keep, html[data-motion='reduce'] .g-ink, html[data-motion='reduce'] .g-girl-glass { display: none; }
