:root{font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:#24231f;background:#f8f7f3;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--paper: #f8f7f3;--ink: #24231f;--quiet: #827e76;--hairline: #47443d;--corner: clamp(112px, 13.4vw, 196px);--depth: clamp(66px, 6.8vw, 98px)}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit}::selection{color:var(--ink);background:#ded9cd}.portfolio{position:relative;width:100%;height:100vh;height:100svh;min-height:330px;overflow:hidden;background:var(--paper)}.identity{position:absolute;top:clamp(42px,6.5vh,72px);left:calc(var(--corner) + clamp(28px,3.2vw,58px));z-index:1;pointer-events:none;animation:fade-up .65s 70ms both}.identity p{margin:0}.identity__name{font-size:clamp(10px,.86vw,12px);font-weight:600;letter-spacing:.19em;white-space:nowrap}.identity__mark{font-size:10px;vertical-align:top;margin-left:3px}.identity__subtitle{padding-top:10px;font-size:9px;font-weight:400;letter-spacing:.18em;color:var(--quiet);white-space:nowrap}.portrait-stage{position:absolute;top:50%;left:50%;transform:translate(-50%,-49%);z-index:0;pointer-events:none;mix-blend-mode:darken}.portrait-frame{position:relative;aspect-ratio:1122 / 1402;width:min(39vw,540px,57svh,calc(100vw - (2 * var(--depth)) - 64px));animation:portrait-arrive .72s 70ms both}.portrait-layer{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;opacity:0;transition:opacity .28s cubic-bezier(.22,.74,.24,1)}.portrait-layer--visible{opacity:1}.mobile-readout{display:none}.directional-nav{position:absolute;inset:0;z-index:2;pointer-events:none}.nav-slot{position:absolute;pointer-events:none;animation:nav-arrive .6s .14s both}.nav-slot--top-left,.nav-slot--top-right,.nav-slot--bottom-left,.nav-slot--bottom-right{width:var(--corner);height:var(--corner)}.nav-slot--top-left{top:0;left:0}.nav-slot--top-right{top:0;right:0}.nav-slot--bottom-left{bottom:0;left:0}.nav-slot--bottom-right{bottom:0;right:0}.nav-slot--top-center,.nav-slot--bottom-center{width:calc(var(--depth) * 2);height:var(--depth);left:50%;transform:translate(-50%)}.nav-slot--top-center{top:0}.nav-slot--bottom-center{bottom:0}.nav-slot--middle-left,.nav-slot--middle-right{width:var(--depth);height:calc(var(--depth) * 2);top:50%;transform:translateY(-50%)}.nav-slot--middle-left{left:0}.nav-slot--middle-right{right:0}.nav-shape{position:relative;display:block;width:100%;height:100%;padding:0;margin:0;appearance:none;border:0;background:transparent;color:var(--ink);text-decoration:none;cursor:pointer;pointer-events:auto;overflow:hidden;outline:0}.nav-slot--top-left .nav-shape{clip-path:circle(100% at 0% 0%)}.nav-slot--top-right .nav-shape{clip-path:circle(100% at 100% 0%)}.nav-slot--bottom-left .nav-shape{clip-path:circle(100% at 0% 100%)}.nav-slot--bottom-right .nav-shape{clip-path:circle(100% at 100% 100%)}.nav-slot--top-center .nav-shape{clip-path:ellipse(50% 100% at 50% 0%)}.nav-slot--bottom-center .nav-shape{clip-path:ellipse(50% 100% at 50% 100%)}.nav-slot--middle-left .nav-shape{clip-path:ellipse(100% 50% at 0% 50%)}.nav-slot--middle-right .nav-shape{clip-path:ellipse(100% 50% at 100% 50%)}.nav-shape__svg{position:absolute;inset:0;height:100%;width:100%;display:block}.nav-shape__path{fill:var(--paper);stroke:var(--hairline);stroke-width:1.1px;vector-effect:non-scaling-stroke;transition:fill .27s ease,stroke-width .27s ease,stroke .27s ease}.nav-slot.is-active .nav-shape__path,.nav-slot:focus-within .nav-shape__path{fill:#eeece6;stroke:#1e1d1b;stroke-width:1.9px}.nav-slot:focus-within .nav-shape__index{text-decoration:underline;text-underline-offset:5px}.nav-shape__index{position:absolute;display:flex;flex-direction:column;align-items:center;gap:9px;font-size:10px;line-height:1;font-weight:500;letter-spacing:.11em;transition:transform .27s cubic-bezier(.2,.7,.3,1)}.nav-shape__glyph{font-size:17px;line-height:1;font-weight:300;letter-spacing:0}.nav-slot.is-active .nav-shape__index{transform:translateY(-3px)}.nav-slot--top-left .nav-shape__index{top:34%;left:34%}.nav-slot--top-right .nav-shape__index{top:34%;right:34%}.nav-slot--bottom-left .nav-shape__index{bottom:30%;left:34%}.nav-slot--bottom-right .nav-shape__index{bottom:30%;right:34%}.nav-slot--top-center .nav-shape__index{top:31%;left:50%;translate:-50% 0}.nav-slot--bottom-center .nav-shape__index{bottom:27%;left:50%;translate:-50% 0}.nav-slot--middle-left .nav-shape__index{top:50%;left:31%;translate:0 -50%}.nav-slot--middle-right .nav-shape__index{top:50%;right:31%;translate:0 -50%}.nav-label{position:absolute;display:flex;flex-direction:column;gap:8px;width:max-content;pointer-events:none;white-space:nowrap;opacity:0;transition:opacity .24s ease,translate .24s ease;translate:0 3px}.nav-slot[data-kind=project] .nav-label,.nav-slot[data-kind=contact] .nav-label{opacity:.62;translate:0 0}.nav-slot.is-active .nav-label,.nav-slot:focus-within .nav-label{opacity:1;translate:0 0}.nav-label__name{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.nav-label__detail{color:var(--quiet);font-size:9px;letter-spacing:.14em}.nav-slot--top-left .nav-label{top:calc(100% + 18px);left:22px}.nav-slot--top-right .nav-label{top:calc(100% + 18px);right:22px;align-items:flex-end}.nav-slot--bottom-left .nav-label{bottom:calc(100% + 18px);left:22px}.nav-slot--bottom-right .nav-label{bottom:calc(100% + 18px);right:22px;align-items:flex-end}.nav-slot--top-center .nav-label{top:calc(100% + 16px);left:50%;translate:-50% 3px;align-items:center}.nav-slot--bottom-center .nav-label{bottom:calc(100% + 16px);left:50%;translate:-50% 3px;align-items:center}.nav-slot--top-center.is-active .nav-label,.nav-slot--bottom-center.is-active .nav-label{translate:-50% 0}.nav-slot--middle-left .nav-label{top:50%;left:calc(100% + 20px);translate:0 -45%}.nav-slot--middle-right .nav-label{top:50%;right:calc(100% + 20px);align-items:flex-end;translate:0 -45%}.nav-slot--middle-left.is-active .nav-label,.nav-slot--middle-right.is-active .nav-label{translate:0 -50%}.footer-note{position:absolute;bottom:clamp(24px,4.6vh,48px);left:calc(var(--corner) + clamp(28px,3.2vw,58px));right:calc(var(--corner) + clamp(28px,3.2vw,58px));display:flex;justify-content:space-between;gap:18px;z-index:1;color:var(--quiet);font-size:9px;letter-spacing:.15em;font-weight:400;pointer-events:none;animation:fade-up .7s .24s both}.contact-layer{position:absolute;inset:0;z-index:5;pointer-events:none;visibility:hidden;transition:visibility 0s linear .35s}.contact-layer--open{visibility:visible;pointer-events:auto;transition:visibility 0s}.contact-scrim{position:absolute;inset:0;padding:0;border:0;background:#f8f7f385;cursor:default;opacity:0;transition:opacity .3s ease}.contact-layer--open .contact-scrim{opacity:1}.contact-panel{position:absolute;left:clamp(24px,6.4vw,100px);bottom:clamp(24px,6.4vh,80px);width:min(420px,calc(100vw - 48px));max-height:calc(100svh - 48px);overflow-y:auto;background:#fbfaf7;border:1px solid var(--ink);padding:clamp(24px,3.8vw,42px);box-shadow:none;opacity:0;transform:translateY(16px);transition:opacity .3s ease,transform .34s cubic-bezier(.23,.72,.28,1)}.contact-layer--open .contact-panel{opacity:1;transform:translateY(0)}.contact-panel__top{display:flex;justify-content:space-between;align-items:start}.contact-panel__eyebrow{color:var(--quiet);font-size:9px;line-height:1.5;letter-spacing:.19em}.contact-panel__close{background:transparent;border:1px solid var(--hairline);width:30px;height:30px;display:grid;place-items:center;cursor:pointer;line-height:1;font-size:22px;font-weight:300;transition:background .18s}.contact-panel__close:hover,.contact-panel__close:focus-visible{background:#e8e4dd}.contact-panel h2{margin:42px 0 47px;font-size:clamp(42px,5vw,56px);line-height:.93;font-weight:400;letter-spacing:-.06em}.contact-panel__period{color:#aaa194}.contact-info{margin:0}.contact-info>div{border-top:1px solid #d5d1c9;padding:17px 0 20px}.contact-info>div:last-child{border-bottom:1px solid #d5d1c9}.contact-info dt{margin:0 0 8px;color:var(--quiet);font-size:10px;letter-spacing:.15em;text-transform:uppercase}.contact-info dd{margin:0;font-size:clamp(12px,1.25vw,15px);letter-spacing:.005em}.contact-info dd a{display:flex;align-items:center;justify-content:space-between;gap:10px;text-decoration-thickness:1px;text-underline-offset:5px}.contact-info dd a:not(:hover){text-decoration:none}.contact-info__muted{color:var(--quiet)}.contact-panel__footnote{margin:38px 0 0;color:var(--quiet);font-size:9px;letter-spacing:.16em}@keyframes portrait-arrive{0%{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes nav-arrive{0%{opacity:0}to{opacity:1}}@keyframes fade-up{0%{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}@media(max-width:900px){:root{--corner: clamp(103px, 15vw, 150px);--depth: clamp(60px, 8vw, 80px)}.portrait-frame{width:min(55vw,58svh,calc(100vw - (2 * var(--depth)) - 55px))}.identity{top:35px;left:calc(var(--corner) + 22px)}.footer-note{left:calc(var(--corner) + 22px);right:calc(var(--corner) + 22px)}.footer-note__hint{display:none}}@media(max-width:600px){:root{--corner: clamp(76px, 23vw, 104px);--depth: clamp(45px, 11.7vw, 56px)}.portfolio{min-height:300px}.identity{top:calc(var(--corner) + 18px);left:50%;transform:translate(-50%);text-align:center}.identity__name{font-size:10px;letter-spacing:.16em}.identity__subtitle{padding-top:8px;font-size:8px;letter-spacing:.14em}.portrait-stage{top:48%;transform:translate(-50%,-48%)}.portrait-frame{width:min(78vw,55svh,calc(100vw - (2 * var(--depth)) - 24px))}.nav-label{display:none}.nav-shape__index{gap:6px;font-size:9px}.nav-shape__glyph{font-size:16px}.footer-note{display:none}.mobile-readout{display:flex;position:absolute;top:calc(100% + 18px);left:50%;width:240px;max-width:80vw;transform:translate(-50%);align-items:center;flex-direction:column;gap:8px;text-align:center}.mobile-readout__number{font-size:9px;letter-spacing:.17em;color:var(--quiet)}.mobile-readout strong{font-size:13px;font-weight:500;letter-spacing:.05em;text-transform:uppercase}.mobile-readout__hint{font-size:8px;letter-spacing:.12em;color:var(--quiet)}.contact-panel{left:16px;bottom:16px;width:calc(100vw - 32px);padding:26px;max-height:calc(100svh - 32px)}.contact-panel h2{margin:38px 0 40px}}@media(max-height:520px)and (min-width:601px){.identity{top:18px}.identity__subtitle{display:none}.portrait-stage{top:52%}.portrait-frame{width:min(46svh,35vw,calc(100vw - (2 * var(--depth)) - 90px))}.footer-note{bottom:15px}.nav-label{display:none}}@media(max-height:540px)and (max-width:600px){.identity{top:14px}.identity__subtitle{display:none}.portrait-stage{top:51%}.portrait-frame{width:min(52svh,60vw,calc(100vw - (2 * var(--depth)) - 18px))}.mobile-readout{top:calc(100% + 6px);gap:4px}.mobile-readout__hint{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
