*{box-sizing:border-box;margin:0;padding:0}p{max-width:40rem}.sequence__controls{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0b0b0bb8;border:1px solid #ffffff29;border-radius:8px;align-items:start;gap:.625rem;padding:.5rem;display:grid;position:absolute;inset-block-start:3rem;inset-inline-end:1rem}.sequence__control-row,.sequence__motion-grid{gap:.5rem;display:grid}.sequence__control-row{grid-template-columns:repeat(2,minmax(6.75rem,1fr))}.sequence__motion-grid{grid-template-columns:repeat(3,minmax(5.8rem,1fr))}.sequence__field{letter-spacing:.04em;color:#f5f5f5b8;gap:.25rem;min-width:6.75rem;font-size:.68rem;display:grid}.sequence__field select,.sequence__field input{appearance:none;color:#f5f5f5;width:100%;min-height:2rem;font:inherit;letter-spacing:0;background:linear-gradient(45deg,#0000 50%,#f5f5f5 50%) right .8rem center/.38rem .38rem no-repeat,linear-gradient(135deg,#f5f5f5 50%,#0000 50%) right .55rem center/.38rem .38rem no-repeat,#171717;border:1px solid #ffffff2e;border-radius:6px;outline:none;padding:0 2rem 0 .625rem}.sequence__field input{background:#171717;padding:0 .625rem}.sequence__field select:hover,.sequence__field input:hover{background-color:#1f1f1f;border-color:#ffffff52}.sequence__field select:focus-visible,.sequence__field input:focus-visible{border-color:#f5f5f5;box-shadow:0 0 0 2px #f5f5f52e}.sequence__field select:disabled{cursor:not-allowed;opacity:.48}@media (width<=520px){.sequence__controls{inset-block:auto 1rem;inset-inline:1rem}.sequence__control-row,.sequence__motion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sequence__field{min-width:0}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f5f5f5;background:#0b0b0b;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}*{box-sizing:border-box}html,body{background:#0b0b0b;min-height:100%;margin:0}body{overflow-x:hidden}.intro,.outro{flex-direction:column;justify-content:center;place-items:center;gap:1.25rem;min-height:100svh;padding:2rem;font-size:clamp(1rem,1.6vw,1.35rem);display:flex}.intro{align-items:flex-start;max-width:68rem;margin-inline:auto}.intro__header{gap:.35rem;display:grid}.intro__header h1{max-width:52rem;font-size:clamp(2rem,5vw,4.8rem);line-height:.95}.intro small{color:#f5f5f594;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem}.intro code{background:#ffffff12;border:1px solid #ffffff24;border-radius:4px;padding:.08rem .28rem;font-size:.82em}.intro__details{gap:.85rem;width:100%;display:grid}.intro__details h2{color:#f5f5f5b8;font-size:1rem}.intro__details dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem 1.25rem;max-width:62rem;display:grid}.intro__details dl>div{gap:.2rem;display:grid}.intro__details dt{font-size:.9rem}.intro__details dd{color:#f5f5f5bd;margin:0;font-size:.9rem;line-height:1.45}.sequence{height:calc(var(--sequence-vh,8) * 100svh);position:relative}.sequence__sticky{background:#0b0b0b;width:100%;height:100svh;position:sticky;inset-block-start:0;overflow:hidden}.sequence__canvas{touch-action:pan-y;width:100%;height:100%;display:block}.sequence__hud{pointer-events:none;letter-spacing:.04em;opacity:.72;grid-template-columns:max-content max-content minmax(0,1fr);justify-content:space-between;align-items:flex-start;gap:.75rem;font-size:.75rem;display:grid;position:absolute;inset:1rem}.sequence__hud #variant-label{text-align:right;overflow-wrap:anywhere;justify-self:end}.sequence__loading{pointer-events:none;background:#0b0b0b;place-items:center;transition:opacity .24s;display:grid;position:absolute;inset:0}.sequence__loading.is-hidden{opacity:0}@media (prefers-reduced-motion:reduce){.sequence{height:100svh}}@media (width<=520px){.sequence__hud{grid-template-columns:1fr;justify-content:start}.intro__details dl{grid-template-columns:1fr}}