html{--menu-width:clamp(280px,28vw,440px);--page-space-grey:#0b0c0e;background:var(--page-space-grey);}
html body,html #root,html #root > main{background:var(--page-space-grey)!important;background-image:none!important;}
html.menu-is-open body{background:#e5e6e8!important;}
html[data-portfolio-page] body header:has(.liquid-toolbar){display:none!important;}
#root{position:relative;z-index:1;width:100%;background:var(--page-space-grey);left:0;transform:none;transition:left 650ms cubic-bezier(.76,0,.24,1),border-radius 650ms ease;}
html.menu-is-open #root{left:calc(-1 * var(--menu-width));border-radius:0;}
@property --frame-gap{syntax:'<length>';inherits:false;initial-value:0px;}
@property --frame-radius{syntax:'<length>';inherits:false;initial-value:0px;}
.site-menu-frame{position:fixed;left:0;top:0;width:100%;height:100dvh;z-index:1000;pointer-events:none;--frame-gap:0px;--frame-radius:0px;background:linear-gradient(#e5e6e8,#e5e6e8) left top/100% var(--frame-gap) no-repeat,linear-gradient(#e5e6e8,#e5e6e8) left bottom/100% var(--frame-gap) no-repeat,radial-gradient(circle at 0 100%,transparent var(--frame-radius),#e5e6e8 calc(var(--frame-radius) + .5px)) right top var(--frame-gap)/var(--frame-radius) var(--frame-radius) no-repeat,radial-gradient(circle at 0 0,transparent var(--frame-radius),#e5e6e8 calc(var(--frame-radius) + .5px)) right bottom var(--frame-gap)/var(--frame-radius) var(--frame-radius) no-repeat;transition:width 650ms cubic-bezier(.76,0,.24,1),--frame-gap 650ms cubic-bezier(.76,0,.24,1),--frame-radius 650ms cubic-bezier(.76,0,.24,1);}
html.menu-is-open .site-menu-frame{width:calc(100% - var(--menu-width));--frame-gap:4px;--frame-radius:16px;}
html.menu-is-open body{overflow:hidden;background:#e5e6e8;}
.site-menu-panel{position:fixed;inset:0 0 0 auto;width:var(--menu-width);z-index:0;background:#e5e6e8;color:#25282d;visibility:visible;display:flex;flex-direction:column;overflow-y:auto;}
.site-menu-panel nav{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:150px 40px 40px;}
.site-menu-panel a{font:450 clamp(25px,2.7vw,42px)/1.2 Inter,Arial,sans-serif;letter-spacing:normal;color:#25282d;text-decoration:none;opacity:0;transform:translateY(18px);transition:opacity 220ms ease,transform 400ms cubic-bezier(.2,.8,.2,1),color 250ms ease-out;}
.site-menu-panel a:hover,.site-menu-panel a:focus-visible{color:#8b7155;}
.site-menu-panel .menu-social{position:relative;margin:0 40px;padding-top:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.site-menu-panel .menu-social::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:#25282d18;opacity:0;transform:translateY(18px);transition:opacity 220ms ease,transform 400ms cubic-bezier(.2,.8,.2,1);}
html.menu-is-open .site-menu-panel .menu-social::before{opacity:1;transform:none;transition-delay:375ms;}
.site-menu-panel .menu-social a{display:inline-block;font-size:14px;font-weight:400;line-height:1.5;}
.site-menu-panel .menu-copyright{margin: auto 0 0;padding:40px;font:400 12px/1.5 Inter,Arial,sans-serif;color:#b7b8ba;opacity:0;transition:opacity 220ms ease;}
html.menu-is-open .site-menu-panel .menu-copyright{opacity:1;transition-delay:360ms;}
.menu-wordmark{position:absolute;right:40px;bottom:35px;width:132px;height:42px;overflow:hidden;scale:.55;transform-origin:bottom right;mix-blend-mode:multiply;opacity:0;transition:opacity 220ms ease;pointer-events:none;}
.menu-wordmark img{position:absolute;width:196px;max-width:none;height:auto;left:-33px;top:-34px;opacity:.2;}
html.menu-is-open .menu-wordmark{opacity:1;transition-delay:360ms;}
@media(max-width:640px){.menu-wordmark{right:24px;bottom:28px;}}
#root footer{display:none!important;}
.site-menu-panel .menu-copyright{position:absolute;left:40px;right:auto;bottom:35px;display:flex;align-items:center;gap:7px;margin:0;padding:0;font-size:17px;line-height:23px;color:#b7b8ba;scale:.9;transform-origin:bottom left;}
.menu-copyright .menu-wordmark{position:relative;inset:auto;width:73px;height:23px;scale:1;opacity:1;transition:none;}
.menu-copyright .menu-wordmark img{width:108px;left:-18px;top:-19px;}
@media(max-width:640px){.site-menu-panel .menu-copyright{left:24px;right:auto;bottom:28px;}}
html.menu-is-open .site-menu-panel{visibility:visible;}
html.menu-is-open .site-menu-panel a{opacity:1;transform:none;transition-delay:calc(180ms + var(--index)*65ms),calc(180ms + var(--index)*65ms),0ms;}
.site-menu-toggle{position:fixed;z-index:2000;right:28px;top:24px;width:116px;height:48px;padding:0;border:0;background:none;color:#f4f4f4;font:600 15px/1 Arial,Helvetica,sans-serif;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;outline-offset:5px;transition:color 250ms ease;}
.site-menu-toggle{scale:.85;transform-origin:top right;}
html.menu-is-open .site-menu-toggle{color:#292b2e;}
.overview-wordmark{--brand-left:28px;position:fixed;left:var(--brand-left);top:27px;width:132px;height:42px;overflow:hidden;z-index:1500;mix-blend-mode:screen;scale:.85;transform-origin:top left;transition:left 650ms cubic-bezier(.76,0,.24,1);}
.overview-wordmark img{position:absolute;width:196px;max-width:none;height:auto;left:-33px;top:-34px;filter:invert(1);}
.overview-descriptor{position:fixed;left:28px;top:70px;margin:0;color:#999da3;font:400 12px/1.4 Geist,Arial,sans-serif;z-index:1500;opacity:1;visibility:visible;transition:left 650ms cubic-bezier(.76,0,.24,1),opacity 240ms ease,visibility 0s;}
html body .overview-descriptor{font-family:"Arial Rounded MT Bold",Arial,sans-serif!important;font-weight:400;}
html body .overview-descriptor .descriptor-location{font-family:inherit!important;}
@media(max-width:640px){.overview-descriptor .descriptor-location{display:block;}}
html.menu-is-open .overview-descriptor{left:calc(28px - var(--menu-width));pointer-events:none;}
html[data-portfolio-page="about"] .overview-descriptor,html:has(.project-pockets:not([data-mode="shelf"])) .overview-descriptor{opacity:0;visibility:hidden;pointer-events:none;transition:left 650ms cubic-bezier(.76,0,.24,1),opacity 180ms ease,visibility 0s 180ms;}
@media(prefers-reduced-motion:reduce){.overview-descriptor{transition:none!important;}}
@media(max-width:640px){.overview-descriptor{left:20px;top:66px;font-size:11px;}html.menu-is-open .overview-descriptor{left:calc(20px - var(--menu-width));}}
html:has(.project-pockets[data-mode="detail"]) .overview-wordmark{display:none;}
@media(max-width:640px){html:has(.project-pockets[data-mode="desk"]) .overview-wordmark{display:none;}}
@media(max-width:640px){html[data-portfolio-page="about"] .overview-wordmark{display:none;}}
html[data-portfolio-page="about"] .overview-wordmark,
html:has(.project-pockets:not([data-mode="shelf"])) .overview-wordmark{--brand-left:calc(50% - 56px);}
html.menu-is-open .overview-wordmark{left:calc(var(--brand-left) - var(--menu-width));pointer-events:none;}
@media(max-width:640px){.overview-wordmark{--brand-left:20px;top:23px;}}
.site-menu-toggle .glass-backdrop{position:absolute;left:0;top:0;width:166px;height:52px;background:rgba(255,255,255,.05);-webkit-backdrop-filter:blur(9px) saturate(1.15);backdrop-filter:blur(9px) saturate(1.15);pointer-events:none;}
.site-menu-toggle .surface{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;filter:drop-shadow(0 3px 3px #00000008);}
.site-menu-toggle .content{position:absolute;inset:0;pointer-events:none;}
.site-menu-toggle .main-content{position:absolute;top:0;left:0;width:116px;height:48px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:400;}
.site-menu-toggle .labels{position:relative;width:42px;height:18px;text-align:left;}
.site-menu-toggle .labels span{position:absolute;left:0;top:0;width:100%;text-align:center;white-space:nowrap;}
.site-menu-toggle .close-icon{position:absolute;left:129px;top:16px;width:16px;height:16px;}
.site-menu-toggle .close-icon:before,.site-menu-toggle .close-icon:after{content:"";position:absolute;left:0;top:7px;width:16px;height:2.5px;background:currentColor;border-radius:2px;transform:rotate(45deg);}
.site-menu-toggle .close-icon:after{transform:rotate(-45deg);}
.site-menu-toggle #blue-glow{display:none;}
.site-menu-toggle:focus-visible,.site-menu-panel a:focus-visible{outline:2px solid currentColor;outline-offset:5px;}
@media(max-width:640px){html{--menu-width:min(72vw,330px);}.site-menu-toggle{right:20px;top:20px;}.site-menu-panel nav{padding:120px 24px 24px;}}
@media(max-width:640px){.site-menu-panel .menu-social{margin-inline:24px;padding-top:20px;}}
.site-menu-panel{--menu-inset:40px;}
.site-menu-panel{background:var(--page-space-grey);transition:background-color 0s 650ms;}
html.menu-is-open .site-menu-panel{background:#e5e6e8;transition-delay:0s;}
.site-menu-panel nav{padding-inline:var(--menu-inset);}
.site-menu-panel .menu-social{margin-inline:var(--menu-inset);}
.site-menu-panel .menu-copyright{left:var(--menu-inset);right:auto;padding:0;}
@media(max-width:640px){.site-menu-panel{--menu-inset:24px;}}
@media(prefers-reduced-motion:reduce){#root,.site-menu-panel,.site-menu-panel *,.site-menu-toggle *{transition:none!important;}}

/* Touch taps do not need keyboard focus rings; keyboard input restores them. */
html[data-input-modality="touch"] :is(button,a,input,[tabindex]):focus,
html[data-input-modality="touch"] :is(button,a,input,[tabindex]):focus-visible{outline:none!important;}

html.menu-is-open,html.menu-is-open body{overflow:hidden!important;overscroll-behavior:none;}
.site-menu-panel{overscroll-behavior:contain;}
