.work{isolation:isolate;grid-template-rows:auto minmax(0,1fr);height:100%;display:grid;position:relative}@media (min-width:768px){.work{grid-template-columns:minmax(22rem,2fr) 3fr;column-gap:1.5rem}}.work-side{min-height:0;display:grid}.work-list{overscroll-behavior:contain;scrollbar-width:none;min-height:0;overflow-y:auto}.work-bar{flex-wrap:wrap;grid-column:1/-1;gap:1.5rem;padding-bottom:1rem;display:flex}.work-tag{color:var(--color-text-muted);font-family:var(--font-pixel);transition:color var(--duration-fast) var(--ease-out)}.work-tag:hover,.work-tag[aria-pressed=true]{color:var(--color-band)}.work-tag[aria-pressed=true]{color:var(--color-blue)}.work-grid{columns:2;column-gap:1rem}.work-item{break-inside:avoid;animation:work-in .4s var(--ease-out) var(--at) backwards;margin:0 0 1rem}@keyframes work-in{0%{opacity:0;translate:0 24px}}.work-tile{background:var(--color-lilac-pale);outline-offset:-4px;width:100%;transition:outline-color var(--duration-fast) var(--ease-out);outline:4px solid #0000;display:block;position:relative}.work-art{position:absolute;inset:0;overflow:hidden}.work-art img{transition:transform .52s var(--ease-out)}@media (hover:hover){.work-tile:hover .work-art img{transform:scale(1.05)}}@media (min-width:768px){.work-item[data-selected] .work-tile{outline-color:var(--color-blue)}}.work-view{display:none}@media (min-width:768px){.work-view{min-height:0;display:grid}}.work-pane{min-height:0;padding-inline:calc(var(--control-size) + 1rem);place-items:center;display:grid;position:relative;container-type:size}.work-frame{width:min(100cqw, 100cqh * var(--ratio));aspect-ratio:var(--ratio);background:var(--color-lilac-pale);position:relative}.work-step{width:var(--control-size);padding:0;position:absolute;top:50%;translate:0 -50%}.work-step-prev{left:0}.work-step-next{right:0}.work-piece{animation:piece-in .32s var(--ease-out);position:absolute;inset:0}@keyframes piece-in{0%{opacity:0;translate:24px}}@media (prefers-reduced-motion:reduce){.work-item,.work-piece{animation:none}}.viewer{border:4px solid var(--color-band);width:min(100vw - 2.5rem,92rem);max-width:none;height:calc(100svh - 2.5rem);max-height:none;color:var(--color-band);background:0 0;margin:auto;padding:0;overflow:hidden}.viewer::backdrop{background:0 0}.viewer-backdrop{background:var(--color-paper);position:absolute;inset:0}.viewer-top{position:absolute;inset:0 0 auto}.viewer-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.viewer-top .viewer-close{margin-left:auto}.viewer-art{inset:4.5rem 1.5rem calc(var(--control-size) + 2rem);pointer-events:none;position:absolute}.viewer-image{background:var(--color-lilac-pale);position:fixed;overflow:hidden}.work-item[data-open] .work-art{visibility:hidden}.viewer-foot{align-items:center;gap:.5rem;display:flex;position:absolute;inset:auto 1.5rem 1rem}.viewer-caption{min-width:0;color:var(--color-text-muted);font-size:var(--text-label);flex:1}.viewer-step{width:var(--control-size);padding:0}@media (max-width:767px){.viewer{width:calc(100vw - 1rem);height:calc(100svh - 1rem)}.viewer-art,.viewer-foot{inset-inline:1rem}}
.poster{--intro:calc(var(--boot) + .12s);isolation:isolate;-webkit-user-select:none;user-select:none;background:#fff;height:100svh;min-height:34rem;position:relative;overflow:hidden}.layer{pointer-events:none;will-change:translate;position:absolute;inset:0}.layer>*{animation:poster-slam .5s var(--ease-out) calc(var(--intro) + var(--in)) backwards}@keyframes poster-slam{0%{opacity:0;scale:1.03}}.main-layer{z-index:1}.name-layer{z-index:4}.type-layer{--type-ink:#fff;z-index:2;mix-blend-mode:difference}.rules-layer{z-index:2}.front-layer{z-index:3}.poster-rules{--rule:linear-gradient(#fff, #fff);--gutter:calc(min(15vw, 17svh) + 4rem);--edge:2rem;opacity:.45;background:var(--rule) var(--gutter) 0 / 1px 100% no-repeat, var(--rule) right var(--edge) top 0 / 1px 100% no-repeat, var(--rule) 0 1.5rem / 100% 1px no-repeat, var(--rule) 0 4.5rem / 100% 1px no-repeat, var(--rule) left 0 bottom var(--edge) / 100% 1px no-repeat;position:absolute;inset:0}.poster-type{color:var(--type-ink);writing-mode:vertical-rl;white-space:nowrap;align-items:flex-end;gap:.75rem;line-height:.8;display:flex;position:absolute;top:0;bottom:0;left:1.5rem;rotate:180deg}.poster-type-big{font-family:var(--font-sans);letter-spacing:-.02em;font-size:min(15vw,17svh);font-weight:700}.poster-micro{--ink:var(--type-ink);height:3rem;position:absolute;top:1.5rem;left:calc(min(15vw,17svh) + 4rem);-webkit-mask-image:none;mask-image:none}@media (max-width:1100px){.poster-micro{display:none}}.poster-micro-star{flex:none;width:2rem}.poster-glyphs{font-family:var(--font-sans);font-size:1.25rem;font-weight:700}.poster-micro>.oug-micro{height:1.5rem}.poster-micro .micro-track:after{background:0 0}.poster-micro .micro-pair{height:3rem}.poster-type-small{font-family:var(--font-pixel);letter-spacing:.08em;padding-bottom:.5rem;font-size:1rem}.main-art{position:absolute;inset:-2vw;overflow:hidden;container-type:size}.stage{width:max(100cqw, 100cqh * var(--art-ratio));aspect-ratio:var(--art-ratio);position:absolute;top:50%;left:50%;translate:-50% -50%}.plane{top:var(--y);left:var(--x);width:var(--w);height:var(--h);will-change:translate;animation:plane-in .7s var(--ease-out) calc(var(--intro) + var(--z) * .16s) backwards;position:absolute}@keyframes plane-in{0%{opacity:0;scale:calc(1 + var(--z) * .12)}}.plane-loop{width:100%;height:100%;animation:var(--period) var(--ease-in-out) infinite alternate;position:relative}.loop-sway{animation-name:plane-sway}.loop-bob{animation-name:plane-bob}.loop-breathe{animation-name:plane-breathe}.loop-float{animation-name:plane-float}@keyframes plane-sway{0%{rotate:-3deg}to{rotate:3.5deg}}@keyframes plane-bob{0%{translate:0 1.2cqh}to{translate:0 -1.6cqh}}@keyframes plane-breathe{0%{scale:1}to{translate:.4cqw -.6cqh;scale:1.018}}@keyframes plane-float{0%{translate:-.8cqw 1cqh}to{translate:.8cqw -1.2cqh}}.plane-img{pointer-events:none;width:100%;height:100%;display:block;position:relative}.poster-logo{color:#fff;width:clamp(18rem,34vw,38rem);padding:.75rem 1rem .625rem;display:grid;position:absolute;top:1.5rem;right:2rem}.poster-logo>[aria-hidden]{grid-area:1/1}.poster-outline{background:var(--color-band);-webkit-mask:url(/assets/logo-outline.webp) 50%/100% 100% no-repeat;mask:url(/assets/logo-outline.webp) 50%/100% 100% no-repeat}.poster .layer>.poster-logo{animation:box-wipe .65s var(--ease-out) calc(var(--boot) + .15s) backwards}.poster-mark{animation:logo-draw .9s var(--ease-in-out) calc(var(--boot) + .45s) backwards}@keyframes box-wipe{0%{clip-path:inset(-8px -8px -8px calc(100% + 8px))}to{clip-path:inset(-8px)}}@keyframes logo-draw{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.letters{padding:.05em .03em;display:inline-flex;overflow:hidden}.letter{white-space:pre;animation:letter-in .8s cubic-bezier(.19, 1, .22, 1) calc(var(--boot) + var(--at)) backwards;display:inline-block}@keyframes letter-in{0%{translate:0 110%}}.hero-nav{z-index:5;flex-direction:column;align-items:flex-end;gap:.625rem;display:flex;position:absolute;bottom:2rem;right:2rem}.hero-link,.hero-social{background:var(--color-volt);color:var(--color-band);font-family:var(--font-display);transition:background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);line-height:1;display:block}.hero-link,.hero-social,.hero-credit{animation:box-wipe .5s var(--ease-out) calc(var(--boot) + var(--wipe)) backwards}.hero-link{padding:.125em .25em .05em;font-size:clamp(3rem,6.5vw,6.5rem)}.hero-link .letters,.hero-social .letters{padding:0}.hero-socials{flex-wrap:wrap;justify-content:flex-end;gap:.5rem;max-width:34rem;margin-top:.25rem;display:flex}.hero-social{aspect-ratio:1;background:var(--color-blue);color:#fff;place-items:center;width:clamp(2rem,2.4vw,2.375rem);display:grid}.hero-social svg{width:55%;height:55%}.hero-credit{background:var(--color-volt);color:var(--color-band);font-family:var(--font-pixel);transition:background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);margin-top:.25rem;padding:.25rem .5rem;font-size:.75rem}.hero-credit:hover,.hero-link:hover,.hero-social:hover{background:var(--color-band);color:var(--color-volt)}.hero-link:hover .letter{animation:letter-in .5s cubic-bezier(.19, 1, .22, 1) var(--hop) both}.hero-link:active,.hero-social:active{background:var(--color-pink);color:var(--color-blue-deep)}.hero-link:focus-visible,.hero-social:focus-visible{outline:var(--focus-ring-width) solid var(--color-focus);outline-offset:2px}@media (max-width:767px){.main-art{inset:0}.poster-type{left:.5rem}.poster-rules{--gutter:calc(min(15vw, 17svh) + 1.5rem);--edge:1rem}.poster-micro{--ink:#fff;height:3rem;position:absolute;top:1.5rem;left:calc(min(15vw,17svh) + 4rem);-webkit-mask-image:none;mask-image:none}@media (max-width:1100px){.poster-micro{display:none}}.poster-micro-star{flex:none;width:2rem}.poster-glyphs{font-family:var(--font-sans);font-size:1.25rem;font-weight:700}.poster-micro>.oug-micro{height:1.5rem}.poster-micro .micro-track:after{background:0 0}.poster-micro .micro-pair{height:3rem}.poster-type-small{display:none}.poster-logo{width:min(20rem,100vw - 2rem);top:1rem;right:1rem}.hero-nav{bottom:1rem;left:1rem;right:1rem}.hero-social{width:2.5rem}}@media (prefers-reduced-motion:reduce){.drift,.layer>*,.letter,.poster-mark,.hero-link,.hero-social,.hero-credit,.plane,.plane-loop{animation:none;translate:none}}