.fio-track{height:210vh;position:relative;overflow:clip visible}.fio-art{--a:0;--b:0;--c:0;--d:0;--e:0;--f:0;--round:0;--meta:0;--gx:90cqw;--gy:6cqw;--depth:1;--tilt:1;width:100%;color:var(--ink);position:sticky;top:max(5rem,50vh - 18rem)}.fio-stage{aspect-ratio:100/44;width:100%;position:relative;container-type:inline-size}.fio-space{perspective:1600px;perspective-origin:40% 45%;transform-style:preserve-3d;position:absolute;inset:0}.fio-part{--i:calc(1 - var(--k));transform-origin:50%;transform:translate3d(calc(var(--x0) * var(--i)), calc(var(--y0) * var(--i)), calc(var(--z0) * var(--depth) * var(--i))) rotateX(calc(var(--rx0) * var(--tilt) * var(--i))) rotateY(calc(var(--ry0) * var(--tilt) * var(--i))) scale(calc(1 + (var(--sx0) - 1) * var(--i)), calc(1 + (var(--sy0) - 1) * var(--i)));opacity:calc(var(--o0) + (1 - var(--o0)) * var(--k));will-change:transform, opacity;display:block;position:absolute}.fio-bar{background:var(--ink)}.fio-ring{box-sizing:border-box;border:calc(1px + (5cqw - 1px) * var(--round)) solid var(--ink);border-radius:calc(50% * var(--round));background:0 0}.fio-green{background:var(--green);width:2.4cqw;height:2.4cqw;transform:translate(var(--gx), var(--gy));position:absolute;top:0;left:0}.fio-meta{font-family:var(--font-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--mid);opacity:var(--meta);gap:.5rem;font-size:11px;line-height:1.6;display:grid;position:absolute;top:30cqw;left:80cqw}.fio-meta span:last-child{color:var(--ink)}@media (width<=767px){.fio-track{height:150vh}.fio-art{--depth:.4;--tilt:.5;top:max(5rem,50vh - 10rem)}.fio-stage{aspect-ratio:100/62}.fio-meta{letter-spacing:.18em;grid-auto-flow:column;gap:1.5rem;font-size:10px;top:46cqw;left:0}}@media (prefers-reduced-motion:reduce){.fio-track{height:auto}.fio-art{position:relative;top:0}}
