.loop-transform{position:relative}.loop-transform__stage{opacity:0;background:0 0;height:100svh;position:relative;overflow:clip}.loop-transform__media{--loop-media-ar:1920 / 1080;place-items:center;display:grid;position:absolute;inset:0}@media (max-width:767px){.loop-transform__media{--loop-media-ar:720 / 1278}}.loop-transform__media>:is(video,img){width:100%;max-width:100%;max-height:100%;aspect-ratio:var(--loop-media-ar);object-fit:contain;mix-blend-mode:screen;background:0 0;grid-area:1/1;-webkit-mask-image:linear-gradient(#0000 0%,#000 8% 80%,#0000 100%);mask-image:linear-gradient(#0000 0%,#000 8% 80%,#0000 100%)}.loop-transform__poster{z-index:0;transition:opacity .42s cubic-bezier(.2,.7,.3,1)}.loop-transform__clip{z-index:1;opacity:0}.loop-transform__clip.is-painted{opacity:1}.loop-transform__media.is-painted .loop-transform__poster{opacity:0}.loop-transform__scrim{z-index:2;pointer-events:none;background:linear-gradient(to top, color-mix(in oklab, var(--color-bg-base) 92%, transparent) 0%, color-mix(in oklab, var(--color-bg-base) 70%, transparent) 20%, color-mix(in oklab, var(--color-bg-base) 26%, transparent) 40%, transparent 56%);position:absolute;inset:0}.loop-transform__copy{z-index:3;left:var(--container-padding,clamp(1.25rem, 5vw, 3rem));right:var(--container-padding,clamp(1.25rem, 5vw, 3rem));opacity:0;will-change:opacity, transform;max-width:min(46rem,78vw);position:absolute;bottom:clamp(3rem,12vh,8rem)}.loop-transform__flyer{z-index:101;visibility:hidden;opacity:0;pointer-events:none;width:0;height:0;position:fixed;top:0;left:0}.loop-transform__notes{z-index:3;pointer-events:none;position:absolute;inset:0}.loop-transform__note{opacity:0;visibility:hidden;--leader-run:72px;direction:ltr;align-items:center;display:flex;position:absolute;transform:translateY(-50%)}.loop-transform__note[data-side=left]{flex-direction:row-reverse;transform:translate(-100%,-50%)}.loop-transform__note-dot{background:var(--accent-to);width:8px;height:8px;box-shadow:0 0 0 4px color-mix(in oklab, var(--accent-to) 22%, transparent), 0 0 18px color-mix(in oklab, var(--accent-to) 60%, transparent);transform-origin:50%;border-radius:50%;flex:none}.loop-transform__note-leader{width:var(--leader-run);flex:none;height:2px;overflow:visible}.loop-transform__note-leader path{fill:none;stroke:color-mix(in oklab, var(--accent-to) 70%, white 30%);stroke-width:1px;stroke-linecap:round}.loop-transform__note[data-side=left] .loop-transform__note-leader{transform:scaleX(-1)}.loop-transform__note-label{max-width:min(18rem, var(--label-max,34vw));text-shadow:0 1px 12px #020b14e6;flex-direction:column;gap:.35rem;padding-inline:.75rem;display:flex}[dir=rtl] .loop-transform__note-label{text-align:right;direction:rtl}.loop-transform__note-index{font-family:var(--font-mono), monospace;font-size:var(--text-fluid-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-to);white-space:nowrap}.loop-transform__note-sep{color:var(--text-dimmest)}.loop-transform__note-text{font-family:var(--font-sans), sans-serif;color:var(--text-secondary);text-wrap:balance;font-size:clamp(.875rem,.8rem + .35vw,1.0625rem);line-height:1.45}.loop-transform__note-label>span{display:block}@media (max-width:767px){.loop-transform__note-dot,.loop-transform__note-leader{display:none}.loop-transform__note{max-width:calc(100% - 2 * var(--container-padding));transform:none}.loop-transform__note-label{background:color-mix(in oklab, var(--color-bg-base) 72%, transparent);-webkit-backdrop-filter:blur(10px)saturate(150%);max-width:22rem;text-shadow:none;border-radius:.625rem;padding:.625rem .75rem}}.loop-transform__rail{z-index:3;left:var(--container-padding);pointer-events:none;direction:ltr;align-items:center;gap:.75rem;display:flex;position:absolute;top:50%;transform:translateY(-50%)}[dir=rtl] .loop-transform__rail{left:auto;right:var(--container-padding);flex-direction:row-reverse}.loop-transform__rail-track{background:color-mix(in oklab, var(--text-dimmest) 40%, transparent);width:1px;height:clamp(96px,18vh,160px);position:relative;overflow:hidden}.loop-transform__rail-fill{background:linear-gradient(to bottom, var(--accent-from), var(--accent-to));transform-origin:top;position:absolute;inset:0;transform:scaleY(0)}.loop-transform__rail-list{flex-direction:column;justify-content:space-between;height:clamp(96px,18vh,160px);margin:0;padding:0;list-style:none;display:flex}.loop-transform__rail-item{font-family:var(--font-mono), monospace;letter-spacing:.12em;color:var(--text-primary);opacity:.32;font-size:.6875rem;line-height:1}
.reading__beats{flex-direction:column;gap:clamp(1.75rem,4vh,3rem);display:flex}.reading__beat{font-family:var(--font-display), sans-serif;letter-spacing:-.015em;text-wrap:balance;color:var(--text-primary);opacity:.28;margin:0;font-size:clamp(1.5rem,1.1rem + 1.6vw,2.25rem);font-weight:600;line-height:1.2;transition:opacity .52s cubic-bezier(.2,.7,.3,1)}.reading__beat.is-lit{opacity:1}@media (prefers-reduced-motion:reduce){.reading__beat{transition:none}}
.stack{position:relative}.stack__pile{flex-direction:column;gap:0;padding-bottom:30svh;display:flex}.stack-card{transform-origin:top;will-change:transform, opacity, filter;min-height:0;max-height:48svh;margin-bottom:22svh;padding:clamp(1.5rem,4vw,3rem);position:relative}.stack-card:before{content:"";border-radius:inherit;background:linear-gradient(90deg, transparent, color-mix(in oklab, var(--accent-to) 40%, transparent) 30%, color-mix(in oklab, var(--accent-from) 40%, transparent) 70%, transparent);opacity:0;pointer-events:none;height:1px;transition:opacity .32s;position:absolute;inset:0 0 auto}.stack-card.is-active:before{opacity:1}.stack-card.is-active{box-shadow:0 0 0 1px color-mix(in oklab, var(--accent-to) 18%, transparent), 0 24px 64px -24px color-mix(in oklab, var(--accent-from) 45%, transparent)}.stack-card__inner{max-width:44rem}.stack-card__head{justify-content:space-between;align-items:center;margin-bottom:clamp(1.5rem,4vh,2.5rem);display:flex}.stack-card__mark{flex:none;width:clamp(40px,5vw,56px);height:clamp(40px,5vw,56px)}@media (max-width:767px){.stack-card{max-height:56svh;margin-bottom:18svh}.stack__pile{padding-bottom:22svh}}@media (prefers-reduced-motion:reduce){.stack-card{will-change:auto;max-height:none;margin-bottom:1.5rem;opacity:1!important;filter:none!important;transform:none!important}.stack__pile{padding-bottom:0}}
