@font-face{font-family:Bitsy;src:url(dist/assets/BitsyVF.woff2) format("woff2");font-display:swap}
.work-header{position:fixed;z-index:10;top:28px;left:3.8vw;right:3.8vw;display:flex;align-items:flex-start;justify-content:space-between;color:#fff;mix-blend-mode:difference;pointer-events:none}
.work-header::after{content:"";position:absolute;top:calc(100% + 13px);left:0;right:0;height:1px;background:currentColor;opacity:.52;pointer-events:none}
.work-header a{pointer-events:auto}
.work-header .brand{font-family:Bitsy,Arial,sans-serif;font-variation-settings:'slnt' 1000,'wdth' 365,'wght' 369}
.work-header .brand{position:relative;display:inline-flex;align-items:flex-start;flex:none;white-space:nowrap;font-size:clamp(28px,3.1vw,57px);line-height:1;transform-origin:left top}
.work-header .brand-letter{display:inline-flex;justify-content:flex-start;flex:none;letter-spacing:-.025em}
.work-header .brand sup{position:absolute;left:calc(100% + .05em);top:.08em;font:clamp(7px,.65vw,10px)/1 Arial,sans-serif;font-variation-settings:normal}
.work-header .header-link{padding:8px 0 10px;font-size:clamp(12px,1.1vw,16px);letter-spacing:.12em;border-bottom:1px dotted currentColor}

.work-header a{text-decoration:none}.work-header button:focus-visible{outline:2px solid var(--blue);outline-offset:5px}.work-header .items-toggle.header-link{max-width:none}
@media(max-width:650px){.work-header{top:25px}.work-header .brand{font-size:28px}.work-header .header-link{font-size:10px;text-align:right}}
/* The same project picker appears on Work pages and the studio home. */
.work-header{mix-blend-mode:normal;color:var(--ink)}
.work-header::after{color:var(--ink);mix-blend-mode:normal}
.work-header .brand{color:var(--ink);mix-blend-mode:normal}
.work-header .items-menu-host{position:relative;z-index:8;display:inline-flex;align-items:center;margin-left:auto;pointer-events:auto}
.work-header .items-toggle{position:relative;z-index:2;display:inline-flex;align-items:center;gap:.8em;appearance:none;border:0;background:transparent;color:var(--ink);mix-blend-mode:normal;font:inherit;letter-spacing:.12em;line-height:1.2;text-decoration:none;cursor:pointer;pointer-events:auto}
.work-header .items-toggle.header-link{padding:8px 0 10px;font-size:clamp(12px,1.1vw,16px);border:0}
.work-header .items-toggle::after{content:"";position:absolute;bottom:2px;left:0;right:0;height:2px;background-image:radial-gradient(circle at 1px 1px,currentColor .65px,transparent .85px);background-size:5px 2px;background-repeat:repeat-x;opacity:.72;pointer-events:none;animation:cta-dots 1.25s linear infinite}
.work-header .items-toggle:hover::after,.work-header .items-toggle:focus-visible::after,.work-header .items-menu-host.is-open .items-toggle::after{opacity:1;animation-duration:.65s}
.work-header .items-icon{position:relative;display:block;flex:0 0 1em;width:1em;height:1em;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.work-header .items-icon i{position:absolute;left:50%;top:50%;display:block;width:.78em;height:1.5px;border-radius:2px;background:currentColor;transform:translate(-50%,-50%)}
.work-header .items-icon i+i{transform:translate(-50%,-50%) rotate(90deg)}
.work-header .items-menu-host:is(:hover,:focus-within) .items-icon,.work-header .items-menu-host.is-open .items-icon{transform:rotate(45deg)}
.work-header .items-menu{position:absolute;top:calc(100% + 23px);right:0;z-index:1;display:grid;width:min(286px,calc(100vw - 40px));padding:7px 13px;background:rgba(255,255,255,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.76);border-radius:15px;box-shadow:0 14px 42px rgba(25,25,30,.13);color:#303032;mix-blend-mode:normal;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px) scale(.985);filter:blur(4px);transform-origin:top right;transition:opacity .28s ease,transform .38s cubic-bezier(.2,.75,.25,1),filter .34s ease,visibility .34s}
.work-header .items-menu-host.is-open .items-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);filter:blur(0)}
.work-header .items-menu a{display:grid;grid-template-columns:25px minmax(0,1fr) 16px;align-items:center;gap:10px;padding:13px 4px;color:inherit;border-top:1px dotted rgba(48,48,50,.25);font-size:13px;letter-spacing:.01em;text-decoration:none;transition:padding .2s ease,color .2s ease}
.work-header .items-menu a:first-child{border-top:0}
.work-header .items-menu a:hover,.work-header .items-menu a:focus-visible{padding-inline:8px;color:#4257f5}
.work-header .items-menu-number{font-size:9px;letter-spacing:.08em;opacity:.55}
.work-header .items-menu-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.work-header .items-menu-arrow{justify-self:end;font-size:14px;transition:transform .2s ease}
.work-header .items-menu a:hover .items-menu-arrow,.work-header .items-menu a:focus-visible .items-menu-arrow{transform:translate(2px,-2px)}
@keyframes cta-dots{from{background-position:0 0}to{background-position:5px 0}}
@media(max-width:650px){.work-header .items-menu{top:calc(100% + 21px);width:min(270px,calc(100vw - 40px));padding:6px 11px}.work-header .items-menu a{padding:14px 4px;font-size:13px}.work-header .items-toggle.header-link{font-size:10px}}
@media(prefers-reduced-motion:reduce){.work-header .items-toggle::after{animation:none}.work-header .items-icon,.work-header .items-menu,.work-header .items-menu a,.work-header .items-menu-arrow{transition:none}}
.work-header .brand sup{font-family:"Neue Machina",Arial,sans-serif;font-size:clamp(15px,calc(1.5vw - 1px),23px);font-style:normal;font-weight:400;line-height:1}
