@layer components{.koi-page:has(>.koi-experience-layout){max-width:84ch}.koi-role{grid-template-columns:12ch minmax(0,1fr);column-gap:2.5ch;display:grid}.koi-role+.koi-role{margin-top:2.4em}.koi-role>*{grid-column:2}.koi-role>.koi-role-label{grid-column:1}.koi-role>.koi-role-label:not(:first-child),.koi-role>.koi-role-label:not(:first-child)+*{margin-top:.5em}.koi-role-inline{display:none}@media (width<=680px){.koi-role{grid-template-columns:minmax(0,1fr)}.koi-role>*,.koi-role>.koi-role-label{grid-column:1}.koi-role>.koi-role-label:not(:first-child){display:none}.koi-role-inline{display:inline}}@media (width<=1199px){.koi-role-file+.koi-role-file{margin-top:.9em}}.koi-stack{grid-template-columns:12ch minmax(0,1fr);gap:.3em 2.5ch;margin-top:.5em;display:grid}@media (width<=680px){.koi-stack{grid-template-columns:9ch minmax(0,1fr);column-gap:1.5ch}}.koi-work-media{border:1px solid var(--border);background:var(--bg);border-radius:6px;margin-top:.6em;overflow:hidden}.koi-work-media>:is(img,video,div){width:100%;height:auto;display:block}.koi-work-media>div{aspect-ratio:16/10}.koi-work-fan{display:none}@media (width>=1200px){.koi-page:has(>.koi-experience-layout){max-width:none}.koi-experience-layout{grid-template-columns:minmax(0,84ch) minmax(0,1fr);align-items:start;column-gap:clamp(32px,4vw,72px);display:grid}.koi-work-media{display:none}.koi-role-file.is-linked .zen-link{color:var(--accent)}.koi-work-fan{display:block;position:sticky;top:calc(50vh - 200px)}.koi-work-fan .showcase-slot{animation:none}}}.koi-work-fan .showcase-scene{--showcase-card-width:clamp(220px, 19vw, 300px);--fan-step-x:clamp(72px, 6.5vw, 110px);--fan-step-y:16px;background:0 0;width:100%;max-width:none;height:400px;margin:0;left:0;overflow:visible;transform:none}