@font-face { font-family: Assistant; src: url(fonts/Assistant.ttf); font-weight: 200 800; }
html, body { margin: 0; height: 100%; background: #000; overflow: hidden; cursor: none; }
#stage { position: absolute; left: 0; top: 0; width: 1920px; height: 1080px; transform-origin: 0 0; background: #07080c; overflow: hidden; }
#c { position: absolute; inset: 0; width: 1920px; height: 1080px; }
#ui { position: absolute; inset: 0; pointer-events: none; font-family: Assistant, sans-serif; color: #f3f1ec; }
.t { position: absolute; top: 84px; right: 120px; width: 820px; text-align: right; opacity: 0; transform: translateY(18px); transition: opacity .35s ease, transform .35s ease; }
.t.on { opacity: 1; transform: none; transition: opacity .9s cubic-bezier(.2,.7,.2,1) .05s, transform 1s cubic-bezier(.2,.7,.2,1) .05s; }
.t.center { left: 0; right: 0; width: auto; top: 380px; text-align: center; }
.t.low { left: 0; right: 0; width: auto; top: auto; bottom: 120px; text-align: center; }
.t .k { margin: 0 0 14px; font: 700 17px/1 Assistant, sans-serif; letter-spacing: .32em; color: var(--hi, #ffc56b); }
.t h1 { margin: 0; font: 300 68px/1.05 Assistant, sans-serif; letter-spacing: -.5px; text-shadow: 0 4px 30px rgb(0 0 0 / .6); }
.t.center h1 { font-size: 104px; }
.t h1 em { font-style: normal; font-weight: 700; color: var(--hi, #ffc56b); }
.t p.s { margin: 16px 0 0; font: 300 24px/1.45 Assistant, sans-serif; color: rgb(255 255 255 / .62); text-shadow: 0 2px 16px rgb(0 0 0 / .7); }
.foot { position: absolute; left: 40px; bottom: 26px; margin: 0; font: 400 14px/1 Assistant, sans-serif; letter-spacing: .12em; color: rgb(255 255 255 / .28); }
.count { position: absolute; right: 40px; bottom: 26px; margin: 0; font: 600 14px/1 Assistant, sans-serif; letter-spacing: .2em; color: rgb(255 255 255 / .3); direction: ltr; }