*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;background:#16181b;overflow:hidden;font-family:Rubik,Arial,sans-serif;color:#23262B}
#viewport{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}
#stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform-origin:0 0;background:#F8F7F3}
#stage>section{position:absolute;left:0;top:0;width:1920px;height:1080px;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s}
#stage>section.on{opacity:1;visibility:visible;transition:opacity .45s ease}
section:not([style*="display"]),section div:not([style*="display"]){display:flex;flex-direction:column}
section[style*="display:flex"],section div[style*="display:flex"]{}
h1{font-size:96px;font-weight:600;line-height:1.1}
h2{font-size:64px;font-weight:600;line-height:1.15}
h3{font-size:44px;font-weight:600;line-height:1.2}
p{font-size:32px;line-height:1.4}
img,video{display:block;object-fit:cover}
video.clip{cursor:pointer;background:#000}
a{color:inherit}
ul,ol{padding-left:1.2em}
#bar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;gap:6px;background:rgba(35,38,43,.82);backdrop-filter:blur(8px);color:#FBFBF9;border-radius:999px;padding:6px 10px;font:500 15px Rubik,Arial,sans-serif;transition:opacity .4s;z-index:10}
#bar button{all:unset;cursor:pointer;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1}
#bar button:hover{background:rgba(255,255,255,.14)}
#bar button:focus-visible{outline:2px solid #B3A3F5}
#fs{font-size:18px!important}
#count{min-width:64px;text-align:center;font-variant-numeric:tabular-nums}
body.idle #bar{opacity:0}
@media (max-width:700px){#fs{display:none}}