:root{color-scheme:dark;--bg: #202a30;--ink: #f0f1e9;--muted: #a4afb1;--accent: #c6d8bc;--gutter: clamp(24px, 6vw, 88px)}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,PingFang TC,Noto Sans TC,Microsoft JhengHei,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:8px}button{border:0}body.intro-running{overflow:hidden}header{height:calc(94px + env(safe-area-inset-top));padding:env(safe-area-inset-top) var(--gutter) 0;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--bg);z-index:4}.brand-slot{display:block;width:144px;aspect-ratio:920/180;text-decoration:none}.header-note{font-size:9px;letter-spacing:1.6px;display:flex;gap:8px;align-items:center}.moving-brand{position:fixed;top:0;left:0;z-index:10;mix-blend-mode:screen;transform-origin:0 0;pointer-events:none;will-change:transform;visibility:hidden}.logo-crop{position:relative;width:100%;aspect-ratio:920/180;overflow:hidden}.logo-crop img{position:absolute;display:block;width:136.304348%;height:auto;max-width:none;left:0;top:0;transform:translate(-13.556619%,-42.424242%)}.intro-backdrop{position:fixed;inset:0;background:var(--bg);z-index:8}.typing-caret{position:fixed;width:3px;z-index:11;background:#fff;border-radius:1px;pointer-events:none;opacity:0;will-change:transform}.skip-button{position:fixed;z-index:12;right:var(--gutter);bottom:calc(30px + env(safe-area-inset-bottom));background:transparent;color:#aeb7b9;font-size:11px;letter-spacing:1.5px;padding:12px 0 12px 16px}.skip-button span{margin-left:14px}.header-note,main,footer{opacity:0;transition:opacity .7s ease,transform .9s cubic-bezier(.16,1,.3,1)}main{transform:translateY(14px)}body.ready main,body.ready footer,body.ready .header-note{opacity:1;transform:none}.replay-button{display:flex;align-items:center;gap:16px;padding:0;background:transparent;font-size:11px;letter-spacing:1px}footer{height:calc(60px + env(safe-area-inset-bottom));padding:0 var(--gutter) env(safe-area-inset-bottom);display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:7px;letter-spacing:1.4px;color:#8c9a9d;position:relative}footer:before{content:"";position:absolute;left:var(--gutter);right:var(--gutter);top:0;border-top:1px solid #ffffff1f}@media(min-width:700px){.brand-slot{width:178px}header{height:116px}.header-note{font-size:10px}.replay-button{font-size:12px;gap:25px}footer{height:70px;font-size:9px}}@media(max-width:360px){.brand-slot{width:126px}.header-note{font-size:8px;letter-spacing:1px}.replay-button{gap:10px}}@media(max-height:720px)and (max-width:699px){header{height:80px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.moving-brand{will-change:auto}}.music-button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 0 8px 12px;background:transparent;color:var(--muted);font-size:10px;letter-spacing:1px;white-space:nowrap}.music-button:hover,.music-button.is-playing{color:var(--ink)}.music-button:disabled{cursor:default}.music-wave{height:16px;width:18px;display:flex;align-items:center;gap:3px}.music-wave i{display:block;width:2px;height:4px;background:currentColor;border-radius:2px;transform-origin:center}.music-wave i:nth-child(2){height:12px}.music-wave i:nth-child(3){height:8px}.music-button.is-playing .music-wave i{animation:music-wave .9s ease-in-out infinite alternate}.music-button.is-playing .music-wave i:nth-child(2){animation-delay:-.3s}.music-button.is-playing .music-wave i:nth-child(3){animation-delay:-.6s}@keyframes music-wave{0%{transform:scaleY(.5)}to{transform:scaleY(1.5)}}body{overflow:hidden}header{position:fixed;inset:0 0 auto;height:calc(62px + env(safe-area-inset-top));background:transparent;z-index:12}.brand-slot{visibility:hidden}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;background:transparent;width:44px;height:44px;padding:10px}.menu-toggle span{height:1px;width:24px;background:#fff}.moving-brand{z-index:10}main{position:fixed;inset:0;transform:none!important;opacity:1!important;clip-path:inset(100% 0 0);transition:none!important}.lobby-image{width:100%;height:100%;object-fit:cover;display:block}.lobby-shade{position:absolute;inset:0;background:linear-gradient(transparent,#0000002e,#0000001a)}.intro-backdrop{z-index:0}footer{display:none}.load-status{position:fixed;bottom:65px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:2px;color:#aeb7b9;z-index:11}.menu-open{overflow:hidden}#site-menu{position:fixed;inset:0 0 0 auto;margin:0;width:min(340px,88vw);height:100dvh;max-height:none;max-width:none;border:0;padding:30px;background:#202a30;color:var(--ink)}#site-menu::backdrop{background:#0008}#site-menu a{display:block;text-decoration:none;color:inherit;background:none;padding:20px 0;border-bottom:1px solid #ffffff25;width:100%;text-align:left;font-size:17px}#site-menu .music-button{margin-top:24px}.ready .load-status{display:none}.skip-button,.load-status{display:none!important}.load-status.load-error{display:block!important}.header{z-index:16}.menu-toggle span{transition:transform .5s cubic-bezier(.65,0,.35,1),opacity .3s}.menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}#site-menu{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;position:fixed;inset:0 0 auto;margin:0;width:100%;height:max(25svh,190px);padding:calc(62px + env(safe-area-inset-top)) var(--gutter) 18px;z-index:15;background:#202a30f5;border:0;transform:translateY(-105%);visibility:hidden;transition:transform .65s cubic-bezier(.76,0,.24,1),visibility 0s .65s}body.menu-open #site-menu{transform:translateY(0);visibility:visible;transition:transform .65s cubic-bezier(.76,0,.24,1),visibility 0s}#site-menu a{font-family:"Noto Serif TC",Songti TC,PMingLiU,serif;font-size:clamp(17px,4.6vw,24px);font-weight:400;letter-spacing:2px;padding:10px 0;display:flex;align-items:center;min-height:44px;border-bottom:1px solid #ffffff18}.menu-backdrop{position:fixed;inset:0;background:#0002;z-index:14}.menu-backdrop[hidden]{display:none}body>.music-button{position:fixed;bottom:calc(18px + env(safe-area-inset-bottom));left:var(--gutter);z-index:12;color:#fff;opacity:0;visibility:hidden}body.ready>.music-button{opacity:1;visibility:visible}.header-note{opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .9s ease,transform 1.1s cubic-bezier(.16,1,.3,1),visibility 0s .9s}body.ready .header-note{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .9s ease .1s,transform 1.1s cubic-bezier(.16,1,.3,1) .1s,visibility 0s}body>.music-button{width:44px;height:44px;padding:0;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .9s ease,transform 1.1s cubic-bezier(.16,1,.3,1),visibility 0s .9s}body.ready>.music-button{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .9s ease .2s,transform 1.1s cubic-bezier(.16,1,.3,1) .2s,visibility 0s}.lobby-tagline{position:fixed;top:var(--tag-top, 55vh);left:0;right:0;margin:0;text-align:center;z-index:10;color:#fff;font-family:"Noto Serif TC",Songti TC,PMingLiU,serif;font-size:clamp(14px,3.8vw,22px);letter-spacing:3px;opacity:0;transform:translateY(16px);filter:blur(3px);pointer-events:none;transition:opacity 1s ease,transform 1.3s cubic-bezier(.16,1,.3,1),filter 1.2s ease}.lobby-tagline span{font-family:Georgia,serif;font-size:.8em;margin:0 8px;font-weight:400}body.ready .lobby-tagline{opacity:1;transform:translateY(0);filter:blur(0);transition-delay:.45s}.lobby-picture{display:block;width:100%;height:100%}.logo-crop{isolation:isolate}.logo-crop:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(150deg,#4f6d80,#91a4b0 24%,#e6e8ec 45%,#a9bac4 62%,#567487 82%,#e6e8ec);background-size:220% 220%;background-position:0% 0%;mix-blend-mode:multiply;animation:logo-flow 9s cubic-bezier(.45,0,.55,1) infinite alternate}@keyframes logo-flow{0%{background-position:0% 0%}to{background-position:80% 80%}}@media(prefers-reduced-motion:reduce){.logo-crop:after{background-size:100% 100%;background:linear-gradient(180deg,#4f6d80,#e6e8ec);animation:none}}@font-face{font-family:"Studio Serif";src:url("./fonts/serif-tc-NNP5NQLC.ttf") format("truetype");font-weight:200;font-style:normal;font-display:swap}:root{--bg: #252f31;--font-serif: "Studio Serif", "Noto Serif TC", "Songti TC", "PMingLiU", serif}html,body{background:var(--bg)}body{overflow-x:hidden;overflow-y:auto}body.intro-running,body.menu-open{overflow:hidden}main{position:relative;inset:auto;clip-path:none!important;min-height:200svh}.lobby{position:relative;width:100%;height:100svh;overflow:hidden;clip-path:inset(100% 0 0)}.intro-backdrop{background:var(--bg)}.lobby-tagline{position:absolute;font-family:var(--font-serif);font-weight:200;font-size:clamp(12px,3.45vw,20px);letter-spacing:1px;white-space:nowrap}.lobby-tagline .tagline-text{display:inline-block;font-family:inherit;font-weight:200;font-size:inherit;margin:0;transform:scaleX(.93)}.lobby-tagline .separator{font-size:.8em;margin:0 5px}.logo-crop:after{animation-duration:5.5s;background-image:linear-gradient(145deg,#325568,#718e9f 22%,#f4f5f6 43%,#a9bac4 60%,#3e6076,#eff2f4);opacity:1;transition:opacity .65s ease}body.entering-lobby .logo-crop:after,body.ready .logo-crop:after{opacity:0}.menu-backdrop{background:transparent}#site-menu{background:var(--bg);border-radius:0 0 26px 26px;overflow:hidden}#site-menu a{font-family:var(--font-serif);font-weight:200;letter-spacing:2px}#site-menu a>span{display:inline-block;transform:scaleX(.92);transform-origin:left center}.header{background:transparent;transition:background-color .65s ease}.header .brand-slot{width:128px;visibility:hidden}body.is-docked .header{background:var(--bg)}body.is-docked .brand-slot{visibility:visible}.moving-brand{z-index:17}body.is-docked .lobby-tagline{opacity:0;transition-delay:0s}.next-screen{position:relative;min-height:100svh;padding:120px var(--gutter) 64px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--ink);background:var(--bg);text-align:center}body{--scroll-y: 0px;--photo-shift: 0px;--photo-scale: 1.04}.lobby{position:sticky;top:0;z-index:0}.lobby-picture{transform:translate3d(0,var(--photo-shift),0) scale(var(--photo-scale));transform-origin:center;will-change:transform}.next-screen{position:relative;z-index:3;min-height:100svh;padding:0;display:block;box-shadow:0 -20px 65px #00000025}.lobby-tagline,body.ready .lobby-tagline{transform:translate3d(0,calc(0px - var(--scroll-y)),0);filter:none;transition:opacity .5s ease;transition-delay:0s}.lobby-tagline .tagline-word{display:inline-block;font-family:inherit;font-size:inherit;font-weight:200;margin:0;opacity:0;filter:blur(8px);transform:translateY(9px);transition:opacity .85s ease,filter 1.1s ease,transform 1.1s cubic-bezier(.16,1,.3,1);transition-delay:0s}.lobby-tagline .separator.tagline-word{font-family:Georgia,serif;font-size:.8em;margin:0 4px}body.ready .lobby-tagline .tagline-word{opacity:1;filter:blur(0);transform:translateY(0);transition-delay:calc(.35s + var(--order) * .18s)}.phone-link{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:0;height:44px;margin-left:-8px;overflow:hidden;color:#fff;opacity:0;visibility:hidden;transform:translateY(7px);transition:width .65s cubic-bezier(.65,0,.35,1),margin-left .65s ease,opacity .55s ease,transform .65s cubic-bezier(.16,1,.3,1),visibility 0s .65s}.phone-link svg{width:22px;height:22px;flex-shrink:0}body.is-docked .phone-link{width:44px;margin-left:0;opacity:1;visibility:visible;transform:translateY(0);transition:width .65s cubic-bezier(.65,0,.35,1),margin-left .65s ease,opacity .55s ease .15s,transform .65s cubic-bezier(.16,1,.3,1),visibility 0s}@media(prefers-reduced-motion:reduce){.lobby-picture{transform:none}.lobby-tagline .tagline-word{filter:none}}main{min-height:200dvh}.lobby{height:100dvh}.next-screen{height:100dvh;min-height:100dvh;transform:translateZ(0);box-shadow:0 -10px 30px #00000018}.lobby-picture{transform:scale(1.04)}.lobby-tagline,body.ready .lobby-tagline{transform:none;transition:none}.logo-crop:after{will-change:auto}body.ready .logo-crop:after{animation:none;display:none}.header-note{width:44px;position:relative;gap:0}.menu-toggle{flex-shrink:0;transition:transform .35s cubic-bezier(.16,1,.3,1)}body.is-docked .menu-toggle{transform:translate(-52px)}.phone-link,body.is-docked .phone-link{position:absolute;right:0;top:0;width:44px;height:44px;margin:0;transition:opacity .3s ease,transform .35s cubic-bezier(.16,1,.3,1),visibility 0s .35s}body.is-docked .phone-link{transition:opacity .3s ease,transform .35s cubic-bezier(.16,1,.3,1),visibility 0s}.header{transition:background-color .3s ease}:root{--scene-height: 100lvh;--viewport-height: 100svh}main{min-height:calc(var(--scene-height) * 2)}.lobby{height:var(--scene-height)}.next-screen{height:var(--scene-height);min-height:var(--scene-height)}.lobby-picture{transform:none!important;will-change:auto}.lobby-image{object-fit:cover;object-position:center}#site-menu{height:max(calc(var(--viewport-height) * .25),190px)}html{scrollbar-gutter:stable}.header{position:fixed;inset:0 0 auto;z-index:40}.moving-brand{z-index:41;transition:none}#site-menu{z-index:39}.menu-backdrop{z-index:38}.next-screen{min-height:max(var(--scene-height),100lvh);box-shadow:none}body.is-docked .moving-brand{animation:header-brand-appear .18s ease both}body.lobby-restored .moving-brand{animation:lobby-brand-appear .18s ease both}body.is-docked .header-note,body.lobby-restored .header-note{animation:controls-appear .35s ease .2s both}body.lobby-restored .lobby-tagline{animation:details-appear .55s ease .2s both}@keyframes header-brand-appear{0%{opacity:0}to{opacity:1}}@keyframes lobby-brand-appear{0%{opacity:0}to{opacity:1}}@keyframes controls-appear{0%{opacity:0}to{opacity:1}}@keyframes details-appear{0%{opacity:0}to{opacity:1}}body.is-docked .moving-brand,body.lobby-restored .moving-brand{animation:none;opacity:1}body.logo-travel .header-note,body.logo-travel .lobby-tagline{animation:none!important;opacity:0!important;pointer-events:none}