/* Magic intro: a pixie spark draws a golden arc over the title, the title
   flies into place, and gold dust keeps drifting over the hall. Everything
   here is inert unless html.bga-intro-on / html.bga-magic is set by JS. */
.bga-intro{display:none}
html.bga-intro-on .bga-intro{display:block;position:fixed;inset:0;z-index:50;overflow:hidden}
.bga-intro-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 50% 46%,#123128 0%,#0a1b16 48%,#040b09 100%);
 transition:opacity 1.4s cubic-bezier(.4,0,.2,1)}
.bga-intro.is-lifting .bga-intro-bg{opacity:0}
.bga-intro.is-lifting .bga-intro-skip,.bga-intro.is-lifting .bga-intro-sub{opacity:0;transition:opacity .4s ease}
html.bga-intro-on body{overflow:hidden}
.bga-intro-glow{position:absolute;left:50%;top:46%;width:120vmax;height:120vmax;transform:translate(-50%,-50%) scale(.2);
 border-radius:50%;background:radial-gradient(circle,#ffe9b333 0%,#d9b46a14 30%,transparent 62%);opacity:0;pointer-events:none}
.bga-intro-title{position:absolute;left:50%;top:46%;width:max-content;transform:translate(-50%,-50%) scale(.94);text-align:center;
 font:normal clamp(46px,8.4vw,112px)/1.12 Libre,Georgia,serif;color:#fffaf0;white-space:nowrap;pointer-events:none}
.bga-intro-line{display:block;width:max-content;margin:-.3em auto;padding:.3em .5em;transform-origin:0 0;
 -webkit-mask-image:linear-gradient(90deg,#000 0,#000 var(--r,-3em),transparent calc(var(--r,-3em) + 1.4em));
 mask-image:linear-gradient(90deg,#000 0,#000 var(--r,-3em),transparent calc(var(--r,-3em) + 1.4em));
 text-shadow:0 0 18px #ffe2a055,0 0 42px #d9b46a33}
.bga-intro-line em{font-style:italic;color:transparent;
 background:linear-gradient(110deg,#c9a45f 0%,#edd9ab 30%,#fffbea 46%,#fff4d2 50%,#c59c56 58%,#edd9ab 74%,#b98f4c 100%);
 background-size:260% 100%;background-position:100% 50%;-webkit-background-clip:text;background-clip:text;
 filter:drop-shadow(0 0 14px #f0cf8a66)}
html.bga-intro-shine .bga-intro-line em{transition:background-position 1.6s cubic-bezier(.3,.6,.2,1);background-position:0% 50%}
.bga-intro-sub{display:block;margin-top:.9em;font:600 clamp(11px,1.15vw,15px)/1.4 Source,Arial,sans-serif;letter-spacing:.42em;
 color:#e9d6a6;opacity:0;transform:translateY(8px);transition:opacity 1s ease,transform 1.2s cubic-bezier(.2,.7,.2,1),letter-spacing 2s ease}
html.bga-intro-sub-on .bga-intro-sub{opacity:.92;transform:none;letter-spacing:.32em}
.bga-intro-skip{position:absolute;right:24px;bottom:22px;z-index:2;min-height:44px;padding:10px 18px;border:1px solid #d2bd8866;border-radius:999px;
 background:#0c1f19aa;color:#efe3c4;font:500 13px/1 Source,Arial,sans-serif;letter-spacing:.14em;cursor:pointer;opacity:0;transition:opacity .6s ease .8s}
html.bga-intro-on .bga-intro-skip{opacity:.85}
.bga-intro-skip:hover{opacity:1;border-color:#edd9ab}
.bga-intro-skip:focus-visible{outline:2px solid #edd9ab;outline-offset:3px}
#bga-magic{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:55}

/* While the intro plays the page waits underneath; it arrives in a cascade. */
html.bga-wait .opening header,html.bga-wait .opening .eyebrow,html.bga-wait .opening .intro,
html.bga-wait .opening .date,html.bga-wait .opening-countdown,html.bga-wait .opening footer,
html.bga-wait .opening-bottom{opacity:0;transform:translateY(14px)}
html.bga-wait .opening-stage h1,html.bga-flying .opening-stage h1{opacity:0}
html.bga-wait .opening .scene{animation:none;transform:scale(1.14);filter:brightness(.35) saturate(.7)}
html.bga-reveal .opening header,html.bga-reveal .opening .eyebrow,html.bga-reveal .opening .intro,
html.bga-reveal .opening .date,html.bga-reveal .opening-countdown,html.bga-reveal .opening footer,
html.bga-reveal .opening-bottom{opacity:1;transform:none;transition:opacity 1s ease var(--d,0s),transform 1.2s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
html.bga-reveal .opening header{--d:.15s}html.bga-reveal .opening .eyebrow{--d:.35s}
html.bga-reveal .opening-countdown{--d:.6s}html.bga-reveal .opening .intro{--d:.75s}
html.bga-reveal .opening .date{--d:.9s}html.bga-reveal .opening footer,html.bga-reveal .opening-bottom{--d:1.1s}
html.bga-reveal .opening .scene{animation:bga-scene-in 2.6s cubic-bezier(.2,.65,.25,1) both,exhibition-drift 36s ease-in-out 2.6s infinite alternate}
@keyframes bga-scene-in{from{transform:scale(1.14);filter:brightness(.35) saturate(.7)}to{transform:scale(1.025) translate3d(-.3%,0,0);filter:none}}
/* The countdown frame re-draws itself once the page arrives. */
html.bga-wait .magic-frame path{animation:none;stroke-dashoffset:1}
html.bga-reveal .magic-frame path{animation:frame-reveal 3s cubic-bezier(.25,.6,.3,1) .7s both}

/* A soft glint that crosses the hall when the curtain lifts. */
.bga-glint{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bga-glint::before{content:"";position:absolute;top:-20%;bottom:-20%;left:-40%;width:28%;
 background:linear-gradient(100deg,transparent,#fff1c81c 40%,#fff6dc33 50%,#fff1c81c 60%,transparent);transform:skewX(-14deg) translateX(0);opacity:0}
html.bga-reveal .bga-glint::before{animation:bga-glint 2.8s cubic-bezier(.4,.1,.2,1) .25s both}
@keyframes bga-glint{0%{opacity:0;transform:skewX(-14deg) translateX(0)}15%{opacity:1}100%{opacity:0;transform:skewX(-14deg) translateX(560%)}}

/* Started only once the title text is in place: a running transform animation keeps the width it began with. */
.bga-intro.is-playing .bga-intro-title{animation:bga-title-push 5s cubic-bezier(.2,.6,.3,1) forwards}
@keyframes bga-title-push{to{transform:translate(-50%,-50%) scale(1)}}
.bga-intro-glow{transition:opacity 1.6s ease,transform 2.4s cubic-bezier(.2,.7,.2,1)}
html.bga-intro-shine .bga-intro-glow{opacity:1;transform:translate(-50%,-50%) scale(1)}
.bga-intro.is-lifting .bga-intro-glow{opacity:0;transition:opacity .9s ease}
.bga-sound-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:0 0 44px;padding:0;border:1px solid #d2bd8866;border-radius:50%;
 background:#0c1f19aa;color:#efe3c4;cursor:pointer;position:relative}
.bga-sound-btn:hover{border-color:#edd9ab;color:#fff6dc}
.bga-sound-btn:focus-visible{outline:2px solid #edd9ab;outline-offset:3px}
.bga-sound-btn svg{width:20px;height:20px}
.bga-sound-btn .on{display:none}.bga-sound-btn[aria-pressed="true"] .on{display:inline}.bga-sound-btn[aria-pressed="true"] .off{display:none}
.bga-intro-sound{position:absolute;left:24px;bottom:22px;z-index:2;opacity:0;transition:opacity .6s ease .8s}
html.bga-intro-on .bga-intro-sound{opacity:.9}
.bga-intro.is-lifting .bga-intro-sound{opacity:0;transition:opacity .4s ease}
.bga-intro-sound[aria-pressed="false"]::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid #edd9ab;animation:bga-sound-call 2.2s ease-out 1.2s infinite;pointer-events:none}
@keyframes bga-sound-call{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7);opacity:0}}
header .bga-sound-btn{margin-left:auto}header .bga-sound-btn+.language-select{margin-left:10px}
@media(max-width:480px){header .bga-sound-btn{position:fixed;right:16px;bottom:16px;z-index:56;margin:0;background:#0c1f19d9}header .bga-sound-btn+.language-select{margin-left:auto}}
@media(max-width:700px){.bga-intro-title{font-size:13.4vw}.bga-intro-sound{left:16px;bottom:16px}.bga-intro-sub{font-size:10.5px;letter-spacing:.3em;white-space:nowrap}html.bga-intro-sub-on .bga-intro-sub{letter-spacing:.22em}.bga-intro-skip{right:16px;bottom:16px}}
html[lang="zh-Hans"] .bga-intro-title{font-family:Georgia,"Songti SC","Noto Serif CJK SC",serif}
html[lang="zh-Hans"] .bga-intro-line em{font-style:normal}
@media(prefers-reduced-motion:reduce){.bga-intro,#bga-magic,.bga-glint{display:none!important}}