html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#f2fcf6;-webkit-text-size-adjust:100%}
*{box-sizing:border-box}
button{font:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
#bticket-motion{--bt-ink:#134f41;--bt-muted:#53756b;--bt-accent:#24a77f;--bt-top-inset:0px;--bt-language-height:140px;width:100%;height:100%;max-width:none;margin:0;color:var(--bt-ink);font-family:-apple-system,BlinkMacSystemFont,'Hiragino Sans','Noto Sans JP',sans-serif;font-size:14px;line-height:1.5;color-scheme:light}
#bticket-motion .bt-phone{width:100%;height:100%;position:relative;display:grid;grid-template-rows:var(--bt-top-inset) 44px var(--bt-language-height) minmax(0,1fr);padding:0 14px;isolation:isolate;overflow:hidden;background:#f2fcf6;border:0;border-radius:0}
#bticket-motion .bt-header{display:flex;align-items:center;justify-content:space-between;padding:0;min-height:44px;z-index:12}
#bticket-motion .bt-header-spacer{width:44px;height:44px;flex:0 0 44px}
#bticket-motion .bt-header .bt-header-brand{display:flex;align-items:center;justify-content:center;width:68.6875px;height:30px;flex:0 0 68.6875px;transform:none;position:relative;z-index:12}
#bticket-motion .bt-header-brand img{display:block;width:100%;height:auto;object-fit:contain}
#bticket-motion .bt-languages{position:relative;display:block;width:100%;height:138px;max-width:300px;margin:0 auto;z-index:2;transform:scale(var(--bt-language-scale,1));transform-origin:50% 0}
#bticket-motion .bt-phone .bt-stage{position:relative;height:auto;min-height:0;aspect-ratio:auto;margin:0 -14px}
#bticket-motion .bt-video-shell{height:100%;width:100%;max-width:none;bottom:0;pointer-events:none}
#bticket-motion .bt-tropical-scenery{height:calc(100% + 30px);opacity:1;background-image:url('assets/tropical-terrace.webp');background-size:cover;background-position:center 52%}
#bticket-motion .bt-scenery-video{object-fit:cover;object-position:center 52%;opacity:0}
#bticket-motion .bt-scenery-video[data-decoded=true]{opacity:1}
#bticket-motion video::-webkit-media-controls,#bticket-motion video::-webkit-media-controls-enclosure,#bticket-motion video::-webkit-media-controls-panel,#bticket-motion video::-webkit-media-controls-overlay-enclosure,#bticket-motion video::-webkit-media-controls-overlay-play-button,#bticket-motion video::-webkit-media-controls-start-playback-button{display:none!important;opacity:0!important;pointer-events:none!important;-webkit-appearance:none}
#bticket-motion .bt-floor{top:calc(93% - 12px);bottom:-100vh}
#bticket-motion .bt-sms-floating{top:calc(var(--bt-top-inset) + 60px);height:112px}
#bticket-motion .bt-ticket-sky{z-index:4}
#bticket-motion .bt-languages[aria-hidden=true]{visibility:hidden;pointer-events:none}
#bticket-motion[data-reduced=true] *,#bticket-motion[data-reduced=true] *:before,#bticket-motion[data-reduced=true] *:after,#bticket-motion[data-playback-blocked=true] *,#bticket-motion[data-playback-blocked=true] *:before,#bticket-motion[data-playback-blocked=true] *:after{animation:none!important;transition:none!important}
#bticket-motion[data-reduced=true] .bt-bubble-arrival,#bticket-motion[data-playback-blocked=true] .bt-bubble-arrival{opacity:1;transform:none}
#bticket-motion[data-playback-blocked=true] .bt-scenery-video{opacity:0}
#bticket-motion button:focus-visible{outline:2px solid #134f41;outline-offset:3px}
/* The app's 2026-10-07 revision (apps/mobile …/tropical-auth-motion/hero.css): the
   bubbles fall from the very top of the phone, each starting wholly above the screen
   and visible the whole way down, and the scenery video fades over its poster. Only
   the phone frame — narrower than Tailwind's md (the hero is full-bleed there) and
   shorter than the 600px desktop frame — so wider pages keep their composition. */
@media(max-width:767px) and (max-height:599px){
  #bticket-motion .bt-scenery-video{transition:opacity .18s ease}
  #bticket-motion .bt-bubble-arrival{animation-name:bt-fall-from-top}
}
@keyframes bt-fall-from-top{
  0%{opacity:1;transform:translateY(calc(-1 * ((var(--bt-top-inset) + 44px) / var(--bt-language-scale, 1) + 160px))) rotate(-13deg) scale(.84);animation-timing-function:cubic-bezier(.32,.04,.48,1)}
  62%{transform:translateY(7px) rotate(2deg) scale(1.02,.97);animation-timing-function:ease-out}
  80%{transform:translateY(-5px) rotate(-1deg) scale(.995,1.01);animation-timing-function:ease-in-out}
  100%{opacity:1;transform:translateY(0) rotate(0) scale(1)}
}
/* Consumer web: five locales, so the lower row holds two bubbles at the quarter points instead of three. */
#bticket-motion .bt-languages .bt-bubble:nth-child(4){left:calc(27% - 44px);right:auto;top:90px;--tilt:-4deg}
#bticket-motion .bt-languages .bt-bubble:nth-child(5){left:calc(73% - 47px);right:auto;top:87px;--tilt:3deg}
@media(max-width:355px){#bticket-motion .bt-languages .bt-bubble:nth-child(4){left:calc(27% - 40px)}
#bticket-motion .bt-languages .bt-bubble:nth-child(5){left:calc(73% - 42px)}}
/* Only the desktop frame is this tall; the mobile composition stays unchanged. */
@media(min-height:600px){
  #bticket-motion .bt-header{padding-top:18px}
  #bticket-motion .bt-header .bt-header-brand{width:100px;flex-basis:100px}
  #bticket-motion .bt-languages{transform:translateY(28px) scale(1.15)}
}