:root{--black:#0e0e0f;--muted:#666;--page-gutter:clamp(24px, 5.45vw, 120px);--theme-transition-duration:.62s;--theme-transition-ease:cubic-bezier(.72, .04, .2, 1);--motion-ease-smooth:cubic-bezier(.72, .04, .56, .96);--motion-ease-quick:cubic-bezier(0, .62, .56, 1);--portfolio-copy-size:16px;--text-fade-in-duration:.4s;--text-fade-out-duration:.18s;--text-enter-offset-y:80px;--text-exit-offset-y:-20px}*{box-sizing:border-box}html{color:var(--black);background:#fff}body{letter-spacing:0;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit;font:inherit}a{color:inherit}.site-shell{background:#fff;min-height:100svh;overflow:hidden}.portfolio-section{--theme-page-background:#fff;--theme-text:#0c0c0c;--theme-card-container-background:#f3f3f3;--theme-muted-text:var(--muted);--theme-tag-muted-text:#00000080;--theme-focus-ring:#00000052;--theme-trigger-line:#d9d9d9;--theme-hover-card-background:#fff;--theme-hover-card-shadow:0 18px 50px #00000029, 0 1px 2px #0000001a;background-color:var(--theme-page-background);height:100svh;min-height:100svh;color:var(--theme-text);transition:background-color var(--theme-transition-duration) var(--theme-transition-ease), color var(--theme-transition-duration) var(--theme-transition-ease);flex-direction:column;padding-top:48px;display:flex;overflow:hidden}.portfolio-section.is-night{--theme-page-background:#0c0c0c;--theme-text:#e0e0e1;--theme-card-container-background:#171717;--theme-muted-text:#e0e0e1;--theme-tag-muted-text:#ffffff80;--theme-focus-ring:#ffffff52;--theme-trigger-line:#444;--theme-hover-card-background:#121212;--theme-hover-card-shadow:0 18px 50px #0000005c, 0 1px 2px #ffffff1f}.portfolio-copy{padding-inline:var(--page-gutter);opacity:0;transform:translateY(var(--text-enter-offset-y));transition:none;position:relative}.portfolio-copy.is-visible{opacity:1;transition:opacity var(--text-fade-in-duration) var(--motion-ease-quick), transform var(--text-fade-in-duration) var(--motion-ease-quick);transform:translateY(0)}.portfolio-copy.is-exiting{opacity:0;transform:translateY(var(--text-exit-offset-y));transition:opacity var(--text-fade-out-duration) var(--motion-ease-smooth), transform var(--text-fade-out-duration) var(--motion-ease-smooth)}.portfolio-intro{max-width:560px;color:var(--theme-text);font-size:var(--portfolio-copy-size);letter-spacing:.024em;transition:color var(--theme-transition-duration) var(--theme-transition-ease);margin:0;font-weight:400;line-height:1.5}.portfolio-intro span{color:var(--theme-text);transition:color var(--theme-transition-duration) var(--theme-transition-ease)}.portfolio-intro--overview{color:var(--theme-text);flex-direction:column;gap:0;display:flex}.portfolio-intro--overview p{margin:0}.portfolio-intro-name{color:var(--theme-text);transition:color var(--theme-transition-duration) var(--theme-transition-ease)}.portfolio-intro-updated{color:var(--theme-text);opacity:.4;transition:color var(--theme-transition-duration) var(--theme-transition-ease)}.portfolio-intro--overview .portfolio-intro-body{margin-top:1.5em}.portfolio-hover-trigger{cursor:default;border-radius:4px;outline:none;position:relative}.portfolio-hover-trigger:after{background-color:var(--theme-trigger-line);content:"";height:1px;transition:background-color var(--theme-transition-duration) var(--theme-transition-ease);position:absolute;bottom:-4px;left:0;right:0}.portfolio-hover-trigger:focus-visible{outline:1px solid var(--theme-focus-ring);outline-offset:2px}.night-mode-toggle{--toggle-active-icon-opacity:.4;top:2px;right:var(--page-gutter);z-index:10;background-color:var(--theme-card-container-background);width:24px;height:24px;color:var(--theme-text);cursor:pointer;transition:background-color var(--theme-transition-duration) var(--theme-transition-ease), color var(--theme-transition-duration) var(--theme-transition-ease), opacity var(--theme-transition-duration) var(--theme-transition-ease);border:0;border-radius:4px;place-items:center;padding:0;display:grid;position:absolute}.night-mode-toggle:hover,.night-mode-toggle:focus-visible{--toggle-active-icon-opacity:1}.night-mode-toggle:focus-visible{outline:1px solid var(--theme-focus-ring);outline-offset:5px}.night-mode-toggle-icon-frame{transform-origin:50%;width:16px;height:16px;transition:transform .12s var(--theme-transition-ease);place-items:center;display:grid;transform:scale(1)}.night-mode-toggle:active .night-mode-toggle-icon-frame{transform:scale(.9)}.night-mode-toggle-icon{transform-origin:50%;width:16px;height:16px;transition:opacity .24s var(--theme-transition-ease), transform var(--theme-transition-duration) var(--theme-transition-ease), background-color var(--theme-transition-duration) var(--theme-transition-ease);background-color:currentColor;grid-area:1/1;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:16px 16px;mask-size:16px 16px;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.night-mode-toggle-icon--moon{opacity:var(--toggle-active-icon-opacity);transform:rotate(0)scale(1);-webkit-mask-image:url(/icons/icon-moon.svg);mask-image:url(/icons/icon-moon.svg)}.night-mode-toggle-icon--sun{opacity:0;transform:rotate(-35deg)scale(.84);-webkit-mask-image:url(/icons/icon-sun.svg);mask-image:url(/icons/icon-sun.svg)}.portfolio-section.is-night .night-mode-toggle-icon--moon{opacity:0;transform:rotate(35deg)scale(.84)}.portfolio-section.is-night .night-mode-toggle-icon--sun{opacity:var(--toggle-active-icon-opacity);transform:rotate(0)scale(1)}.portfolio-hover-card{--hover-card-divider:#0c0c0c1f;z-index:20;width:min(360px,100vw - 24px);height:var(--hover-card-content-height,auto);background:var(--theme-hover-card-background,#fff);max-height:calc(100svh - 24px);box-shadow:var(--theme-hover-card-shadow,0 18px 50px #0000001f, 0 1px 2px #00000014);color:var(--theme-text,#0c0c0c);letter-spacing:.012em;opacity:0;pointer-events:none;transform-origin:top;transition:top .24s cubic-bezier(.72, .04, .2, 1), height .24s cubic-bezier(.72, .04, .2, 1), opacity .62s cubic-bezier(.72, .04, .2, 1), transform .62s cubic-bezier(.72, .04, .2, 1), background-color var(--theme-transition-duration) var(--theme-transition-ease), color var(--theme-transition-duration) var(--theme-transition-ease), box-shadow var(--theme-transition-duration) var(--theme-transition-ease);will-change:opacity, transform;border-radius:16px;padding:12px;font-size:14px;font-weight:400;line-height:1.5;display:block;position:fixed;overflow:hidden auto;transform:translateY(8px)scale(.98)}.portfolio-hover-card-content{opacity:0;gap:8px;transition:opacity .24s cubic-bezier(.72,.04,.2,1);display:grid}.portfolio-hover-card-content.is-visible{opacity:1;transition-duration:.62s}.portfolio-hover-card.is-night{--hover-card-divider:#e0e0e129;color:#e0e0e1;background:#121212;box-shadow:0 18px 50px #0000005c,0 1px 2px #ffffff1f}.portfolio-hover-card[data-placement=top]{transform-origin:bottom;transform:translateY(-8px)scale(.98)}.portfolio-hover-card.is-visible{opacity:1;transform:translate(0,0)scale(1)}.portfolio-hover-card-header{justify-content:space-between;align-items:center;gap:24px;font-weight:500;line-height:1.2;display:flex}.portfolio-hover-card-header span:last-child{opacity:.6}.portfolio-hover-card-body{gap:12px;display:grid}.portfolio-hover-card-paragraph{display:block}.portfolio-hover-card-row-list{gap:12px;display:grid}.portfolio-hover-card-row{justify-content:space-between;align-items:baseline;gap:20px;display:flex}.portfolio-hover-card-row+.portfolio-hover-card-row{border-top:1px solid var(--hover-card-divider);padding-top:12px}.portfolio-hover-card-row span:first-child{min-width:0}.portfolio-hover-card-row span:last-child{opacity:.6;text-align:right;flex:none}.portfolio-stage{margin-top:auto;padding:24px 0 clamp(22px,4vh,56px)}.tag-controller{padding-inline:var(--page-gutter);gap:24px;margin-bottom:16px;display:none}.tag-controller button{height:auto;color:var(--theme-tag-muted-text);cursor:pointer;font-size:var(--portfolio-copy-size);letter-spacing:.03em;opacity:0;transition:color var(--theme-transition-duration) var(--theme-transition-ease), opacity var(--tag-load-duration) var(--motion-ease-smooth);transition-delay:var(--tag-load-delay);background:0 0;border:0;padding:0;font-weight:400;line-height:1.5}.tag-controller button.is-active{color:var(--theme-text)}.tag-controller.is-loaded button{opacity:1}.tag-letter{color:currentColor;transition:color 20ms linear;transition-delay:calc((var(--tag-length) - var(--char-index)) * 20ms);display:inline-block}.tag-controller button.is-active .tag-letter{color:var(--theme-text);transition-delay:0s}.tag-controller button:not(.is-active):hover .tag-letter,.tag-controller button:not(.is-active):focus-visible .tag-letter{color:var(--theme-text);transition-duration:60ms;transition-delay:calc(var(--char-index) * 40ms)}.tag-controller button:focus-visible{outline:1px solid var(--theme-focus-ring);outline-offset:5px}.preview-track{width:100vw;padding-inline:var(--page-gutter);scroll-padding-inline:var(--page-gutter);scroll-snap-type:none;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:20px;display:flex;overflow:auto hidden}.preview-track::-webkit-scrollbar{display:none}.preview-card{opacity:0;scroll-snap-align:none;width:max-content;transition:opacity var(--card-exit-duration) var(--motion-ease-smooth);flex:none;transition-delay:0s}.preview-track.is-loaded .preview-card{opacity:1;transition-duration:var(--card-load-duration);transition-delay:var(--card-load-delay)}.preview-track.is-exiting .preview-card{opacity:0;transition-duration:var(--card-exit-duration);transition-delay:0s}.card-container{--card-content-height:calc(var(--card-container-height) - var(--card-padding-v) - var(--card-padding-v));width:max-content;height:var(--card-container-height);padding:var(--card-padding-v) var(--card-padding-h);border-radius:var(--card-container-radius,40px);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.card-container:before{z-index:0;border-radius:inherit;background-color:var(--card-background,#000);content:"";opacity:1;transition:background-color var(--theme-transition-duration) var(--theme-transition-ease), opacity .16s var(--motion-ease-smooth);position:absolute;inset:0}.card-container:hover:before{opacity:.3}.card-container[data-dim-on-hover=false]:hover:before{opacity:1}.card-container>*{z-index:1;position:relative}.card-container[data-fill=true]{--card-content-height:var(--card-container-height);padding:0}.card-container[data-fill=true] .card-content{border-radius:var(--card-content-radius,40px)}.card-content{width:auto;height:var(--card-content-height);aspect-ratio:var(--card-content-aspect) / 1;border-radius:var(--card-content-radius,24px);background-color:var(--card-content-background,#f8f7f2);transition:background-color var(--theme-transition-duration) var(--theme-transition-ease);-webkit-user-select:none;user-select:none;flex:none;overflow:hidden}.card-media-group{height:var(--card-content-height);align-items:center;gap:var(--card-media-gap,20px);display:flex}.card-content--image img{object-fit:cover;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.card-content--video,.card-content--lottie{border-radius:var(--card-content-radius,24px);background-color:var(--card-content-background,#f0f0f0);position:relative}.card-content--video[data-shape=splash],.card-content--lottie[data-shape=splash]{border-radius:110px}.card-content--video[data-shape=pill],.card-content--lottie[data-shape=pill]{border-radius:9999px}.card-content--video video{z-index:0;width:calc(var(--card-media-scale,100%) + var(--card-media-bleed,0px));height:calc(var(--card-media-scale,100%) + var(--card-media-bleed,0px));object-fit:cover;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;max-width:none;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-content--lottie{cursor:pointer}.card-content--lottie:focus-visible{outline:1px solid var(--theme-focus-ring);outline-offset:5px}.card-lottie-animation{z-index:0;width:calc(var(--card-media-scale,100%) + var(--card-media-bleed,0px));height:calc(var(--card-media-scale,100%) + var(--card-media-bleed,0px));pointer-events:none;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;max-width:none;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-lottie-animation svg{width:100%;height:100%;display:block}.card-video-overlay{z-index:1;object-fit:contain;pointer-events:none;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;width:min(31.5%,240px);max-height:70%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-text{box-sizing:border-box;width:100%;min-width:0;color:var(--theme-muted-text);letter-spacing:.012em;transition:color var(--theme-transition-duration) var(--theme-transition-ease);justify-content:space-between;align-items:center;gap:24px;margin:20px 0 0;padding-inline:20px;font-size:14px;line-height:1.5;display:flex}.card-text-label{flex:auto;min-width:0}.card-text-meta{opacity:.6;text-align:right;flex:none}@media (max-width:800px){.portfolio-section{--card-mobile-height-boost:32px;padding-top:48px}.portfolio-stage{margin-top:auto;padding:24px 0}.preview-track{scroll-snap-type:none;gap:14px;width:100vw;padding-inline:24px;scroll-padding-inline:24px;overflow-x:auto}.preview-card{scroll-snap-align:none;width:max-content}.card-text{padding-inline:12px;font-size:14px}.card-container{border-radius:var(--card-container-radius,24px)}.card-container[data-fill=true] .card-content,.card-content,.card-content--video,.card-content--lottie{border-radius:var(--card-content-radius,8px)}.card-content--video[data-shape=splash],.card-content--lottie[data-shape=splash]{border-radius:72px}.card-content--video[data-shape=pill],.card-content--lottie[data-shape=pill]{border-radius:9999px}.tag-controller{padding-inline:24px}}@media (max-width:420px){.tag-controller{gap:14px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}.preview-track{transform:none!important}.portfolio-copy{opacity:1;transition:none;transform:none}.preview-card,.tag-controller button{opacity:1;transition:none}.portfolio-hover-card{transition:none;transform:none}}
