.portfolio-reader{margin:0;padding:0;width:100%;max-width:none;height:100dvh;max-height:none;border:0;overflow:auto;background:#fff;color:#000;color-scheme:light;font-family:Infamous,cursive}
.portfolio-reader::backdrop{background:#fff}
.portfolio-page{max-width:1360px;margin:0 auto;background:#fff;min-height:100dvh}
.portfolio-top-reserved{height:clamp(240px,41.1765vw,560px)}
.portfolio-experience{margin:0 0 0 10.735294%;width:78.816912%;padding-bottom:72px}
.portfolio-experience h1{font-size:clamp(28px,2.6471vw,36px);line-height:43px;font-weight:400;margin:0 0 clamp(50px,5.588235vw,76px);outline:none}
.portfolio-work-grid{position:relative;display:block}
.portfolio-wordmarks{container-type:inline-size;min-width:0}
.portfolio-work-item{margin-top:calc(var(--work-gap)/1071.91*100cqw)}
.portfolio-work-row{display:block;position:relative;padding:0;border:0;background:none;cursor:pointer;isolation:isolate;outline-offset:8px;min-height:44px}
.portfolio-work-row img{position:absolute;left:0;top:0;display:block;width:100%;height:auto;pointer-events:none;transition:opacity 180ms ease-in-out}
.portfolio-wordmark-outline{opacity:1}.portfolio-wordmark-filled{opacity:0}
.portfolio-row-highlight{position:absolute;inset:10% -1% 1%;z-index:-1;background:var(--accent-cyan);clip-path:polygon(0 4%,99% 0,100% 94%,1% 100%);transform:scaleX(0);transform-origin:left center;transition:transform 180ms ease-in-out}
.portfolio-work-row[data-active=true] .portfolio-wordmark-filled{opacity:1}.portfolio-work-row[data-active=true] .portfolio-wordmark-outline{opacity:0}.portfolio-work-row[data-active=true] .portfolio-row-highlight{transform:scaleX(1)}
.portfolio-work-row:focus-visible,.portfolio-back:focus-visible{outline:2px solid #000}
.portfolio-overview-rail{position:fixed;right:clamp(18px,4vw,60px);top:clamp(100px,32dvh,280px);width:clamp(220px,24vw,320px);min-width:0;padding:0;z-index:3;pointer-events:none}
.portfolio-overview-slot{opacity:0;transform:translateY(5px);transition:opacity 180ms ease-in-out,transform 180ms ease-in-out}
.portfolio-overview-slot[data-visible=true]{opacity:1;transform:none}
.experience-note{position:relative;isolation:isolate;padding:20px 18px;transform:rotate(-.8deg)}
.experience-note::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--accent-cyan);clip-path:polygon(1% 4%,97% 0,100% 95%,0 100%)}
.experience-note p{margin:0}.experience-note-label{font-size:clamp(23px,2vw,28px);line-height:1.15;margin-bottom:15px!important}.experience-note-copy{font-size:21px;line-height:1.4}
.portfolio-mobile-overview{display:none}.portfolio-back{display:block;margin-top:70px;background:none;border:0;border-bottom:1px solid currentColor;padding:8px 0;color:#000;font-size:22px;cursor:pointer}
.portfolio-keyboard-close:focus{position:fixed;top:16px;right:16px;left:auto;width:auto;height:auto;clip:auto;margin:0;padding:12px;background:#fff;color:#000;border:1px solid #000;font-size:20px;z-index:20}
@media(max-width:760px){.portfolio-experience{margin-left:10.735294%;width:78.816912%}.portfolio-work-grid{grid-template-columns:minmax(0,1fr)}.portfolio-overview-rail{display:none}.portfolio-mobile-overview:not([hidden]){display:block;margin:14px 0 22px 12%}.portfolio-experience h1{margin-bottom:48px}.portfolio-top-reserved{height:240px}.portfolio-work-row{min-height:44px}.portfolio-work-row img{top:50%;transform:translateY(-50%)}.portfolio-experience{padding-bottom:40px}}
@media(prefers-reduced-motion:reduce){.portfolio-reader *{transition:none!important;animation:none!important}}