@layer components{.work-index{--wi-muted:#3b3b3b;--wi-ink:var(--color-white-100);--wi-row-shift:2.8rem;--wi-preview-swap-duration:.9s;--wi-preview-swap-ease:cubic-bezier(.3, .2, .2, 1);--wi-clip-bleed:-.15em;--wi-name-max:90vw;isolation:isolate;background:var(--color-background);padding:calc(50svh - 7vw) 0;position:relative;overflow-x:clip}@media (min-width:900px){.work-index{padding:calc(50svh - 4.62vw) 0}}.work-index-list{z-index:2;text-align:center;mix-blend-mode:difference;will-change:transform;position:relative}.work-index-copy{display:block}.work-index-blur{z-index:3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none;height:24svh;position:fixed;left:0;right:0}.work-index-blur--top{top:0;-webkit-mask-image:linear-gradient(#000 0%,#0009 45%,#0000 100%);mask-image:linear-gradient(#000 0%,#0009 45%,#0000 100%)}.work-index-blur--bottom{bottom:0;-webkit-mask-image:linear-gradient(#0000 0%,#0009 55%,#000 100%);mask-image:linear-gradient(#0000 0%,#0009 55%,#000 100%)}.work-index-row{transition:opacity .55s var(--ease-expo-out), transform .8s var(--ease-expo-out)}.work-index-row[hidden]{display:none}.work-index-link{padding:0 .08em;font-size:13vw;line-height:1.08;display:inline-block;position:relative}@media (min-width:900px){.work-index-link{font-size:8.4vw;line-height:1.1}}.work-index-name{display:inline-block;position:relative}.work-index-serif,.work-index-sans{box-sizing:border-box;max-width:var(--wi-name-max);margin-inline:var(--wi-clip-bleed);padding-inline:calc(var(--wi-clip-bleed) * -1);text-wrap:balance;padding-bottom:.1em;display:block;overflow:hidden}.work-index-serif{font-family:var(--font-serif);letter-spacing:-.035em;color:var(--wi-muted);clip-path:inset(0 var(--wi-clip-bleed));transition:clip-path var(--wi-preview-swap-duration) var(--wi-preview-swap-ease);font-weight:400}.work-index-sans{width:max-content;font-family:var(--font-sans);letter-spacing:-.045em;color:var(--wi-ink);clip-path:inset(100% var(--wi-clip-bleed) 0);transition:clip-path var(--wi-preview-swap-duration) var(--wi-preview-swap-ease);margin-inline:0;font-weight:700;position:absolute;top:50%;left:50%;translate:-50% calc(.04em - 50%)}.work-index-row[data-row-active=true] .work-index-serif{clip-path:inset(0 var(--wi-clip-bleed) 100%)}.work-index-row[data-row-active=true] .work-index-sans{clip-path:inset(0 var(--wi-clip-bleed))}.work-index-list[data-wrapping] .work-index-serif,.work-index-list[data-wrapping] .work-index-sans{transition:none}.work-index-list[data-phase=out] .work-index-row{opacity:0;transform:translate3d(0, calc(var(--wi-row-shift) * -1), 0);transition-delay:calc(min(var(--wi-i), var(--wi-stagger-max)) * var(--wi-out-step))}.work-index-list[data-phase=pre] .work-index-row{opacity:0;transform:translate3d(0, var(--wi-row-shift), 0);transition:none}.work-index-list[data-phase=in] .work-index-row{transition:none}.work-index-empty{font-family:var(--font-serif);color:#c4c4c4;text-align:center;opacity:0;transition:opacity .6s var(--ease-expo-out);pointer-events:none;font-size:clamp(2.8rem,3.4vw,5.4rem);position:fixed;top:50%;left:50%;translate:-50% -50%}.work-index[data-empty=true] .work-index-empty{opacity:1}.work-index-preview{z-index:1;aspect-ratio:16/9;pointer-events:none;will-change:transform;width:48vw;position:fixed;top:0;left:0}@media (min-width:900px){.work-index-preview{width:26vw}}.work-index-preview-frame{clip-path:inset(50%);transition:clip-path .85s var(--ease-expo-out);position:absolute;inset:0;overflow:hidden}.work-index-preview[data-visible=true] .work-index-preview-frame{clip-path:inset(0)}.work-index-preview-track{position:absolute;inset:0}.work-index-preview-slide{opacity:0;transition:mask-position var(--wi-preview-swap-duration) var(--wi-preview-swap-ease), -webkit-mask-position var(--wi-preview-swap-duration) var(--wi-preview-swap-ease);position:absolute;inset:-1px;overflow:hidden;-webkit-mask-size:100% 250%;mask-size:100% 250%;-webkit-mask-repeat:repeat-x;mask-repeat:repeat-x}.work-index-preview-zoom{width:100%;height:100%;transition:transform var(--wi-preview-zoom-duration,2s) var(--ease-expo-out);transform:scale(1.2)}.work-index-preview-zoom[data-active=true]{transform:none}.work-index-filter,.work-index-filter-popover{--wi-filter-bottom:2.2rem;--wi-filter-line:2.4rem;left:50%;bottom:var(--wi-filter-bottom);z-index:30;transition:opacity .5s var(--ease-expo-out), translate .7s var(--ease-expo-out);position:fixed;translate:-50%}.work-index-filter{mix-blend-mode:difference}.work-index-list ::selection,.work-index-filter ::selection{color:#000;background-color:#0ff}.work-index-filter-popover{bottom:calc(var(--wi-filter-bottom) + var(--wi-filter-line) + 1rem);pointer-events:none}.work-index-filter[data-hidden=true],.work-index-filter-popover[data-hidden=true]{opacity:0;pointer-events:none;translate:-50% 2.4rem}.work-index-filter-button{font-family:var(--font-sans);font-size:1.8rem;font-weight:600;line-height:var(--wi-filter-line);letter-spacing:-.04em;color:var(--color-white-100);white-space:nowrap;cursor:pointer;align-items:center;gap:.7rem;display:inline-flex}.work-index-filter-button:focus-visible{outline:2px solid var(--color-white-100);outline-offset:4px}.work-index-filter-option:focus-visible{outline:2px solid var(--color-black-100);outline-offset:2px}.work-index-filter-label{opacity:.5}.work-index-filter-value{text-transform:uppercase}.work-index-filter-caret{-webkit-user-select:none;user-select:none;width:1.6rem;height:1.6rem;transition:transform .6s var(--ease-expo-out);flex:none;display:block}.work-index-filter-caret img{width:100%;height:100%;display:block}.work-index-filter[data-open=true] .work-index-filter-caret{transform:rotate(180deg)}@media (min-width:900px){.work-index-filter,.work-index-filter-popover{--wi-filter-line:3.2rem}.work-index-filter-button{letter-spacing:0;text-transform:uppercase;font-size:2.4rem}.work-index-filter-caret{width:2.4rem;height:2.4rem}.work-index-filter-caret img{filter:invert()}}.work-index-filter-menu{opacity:0;visibility:hidden;transform-origin:50% 100%;pointer-events:none;min-width:22rem;transition:opacity .35s var(--ease-expo-out), transform .6s var(--ease-expo-out), visibility 0s linear .6s;transform:translateY(1rem)scale(.97)}.work-index-filter-popover[data-open=true] .work-index-filter-menu{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s;transform:none}.work-index-filter-option{width:100%;font-family:var(--font-sans);text-transform:uppercase;letter-spacing:-.01em;text-align:left;cursor:pointer;opacity:.5;justify-content:space-between;align-items:center;padding:.6rem 0;font-size:1.5rem;font-weight:600;transition:opacity .3s;display:flex}.work-index-filter-option:hover,.work-index-filter-option:focus-visible,.work-index-filter-option[aria-selected=true]{opacity:1}.work-index-filter-option small{font-family:var(--font-body);color:#8a8a8a;font-size:1.2rem;font-weight:500}.work-index-filter-option span{margin-right:auto}@media (prefers-reduced-motion:reduce){.work-index-row,.work-index-serif,.work-index-sans,.work-index-empty,.work-index-preview-frame,.work-index-preview-slide,.work-index-preview-zoom,.work-index-filter,.work-index-filter-popover,.work-index-filter-caret,.work-index-filter-menu{transition:none}}}