:root{color-scheme:dark;--bg:#080808;--fg:#edeae3;--muted:#989690;--dim:#66645f;--line:#45433e;--line-soft:#292824;--panel:#111110;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);min-width:320px}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:2px solid var(--fg);outline-offset:5px}
.site-frame{min-height:100svh;display:flex;flex-direction:column}
.masthead,.footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px clamp(24px,4.4vw,72px)}
.masthead{font-size:10px;font-weight:700;letter-spacing:.16em}
.identity{display:inline-flex;align-items:center;gap:14px;white-space:nowrap}
.identity-symbol{width:32px;height:32px;flex:none;display:block;overflow:hidden}
.identity-symbol img{display:block;width:113px;height:113px;max-width:none;transform:translate(-40.5px,-31px);filter:contrast(4);mix-blend-mode:screen}
.identity-name{letter-spacing:.19em}
.arrow-icon{display:inline-block;width:14px;height:14px;flex:none;vertical-align:-.14em;color:inherit}
.masthead-role{color:var(--muted);font-size:10px;letter-spacing:.14em}
.slash{color:var(--dim);padding:0 7px}
.stage{width:100%;flex:1;display:flex;align-items:center;justify-content:center;padding:84px 24px 98px;transition:padding .3s ease}
.stage.has-open{align-items:flex-start;padding-top:clamp(56px,11vh,142px)}
.menu-shell{width:min(100%,800px)}
.introduction{margin:0 0 clamp(42px,8vh,78px)}
.eyebrow,.about-kicker{font-size:10px;letter-spacing:.23em;color:#b8b4ac;font-weight:700;margin:0 0 26px}
.eyebrow span{padding:0 7px;color:#6e6b65}
h1{font-size:clamp(31px,4.4vw,54px);font-weight:400;line-height:1.17;letter-spacing:-.04em;margin:0;max-width:680px}
h1 em{font-style:normal;color:#8e8b84}
.intro-note{font-size:13px;color:var(--muted);margin:22px 0 0;line-height:1.6}
.accordion{border-top:1px solid var(--line)}
.section{border-bottom:1px solid var(--line)}
.section h2{margin:0;font-size:inherit;font-weight:inherit}
.section-toggle{width:100%;border:0;background:transparent;display:grid;grid-template-columns:65px minmax(0,1fr) 35px;align-items:center;text-align:left;cursor:pointer;min-height:91px;padding:0 2px;transition:color .2s ease}
.section-toggle:hover,.section-toggle[aria-expanded=true]{color:white}
.section-index{font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--dim);align-self:center}
.section-title{font-size:clamp(28px,4vw,44px);font-weight:400;letter-spacing:-.045em;line-height:1.1}
.section-action{width:17px;height:17px;position:relative;justify-self:end}
.section-action:before,.section-action:after{content:"";position:absolute;background:var(--muted);top:8px;left:0;width:17px;height:1px;transition:transform .24s ease,background .24s ease}
.section-action:after{transform:rotate(90deg)}
.section-toggle[aria-expanded=true] .section-action:after{transform:rotate(0)}
.section-toggle:hover .section-action:before,.section-toggle:hover .section-action:after{background:var(--fg)}
.section-panel{padding:0 0 33px 65px;animation:appear .3s ease}
.section-panel[hidden],.lightbox[hidden],.project-detail[hidden]{display:none!important}
@keyframes appear{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.panel-intro{color:var(--muted);font-size:13px;line-height:1.6;margin:2px 0 23px;max-width:550px}
.project{border-top:1px solid var(--line-soft)}
.project h3{margin:0;font-size:inherit;font-weight:inherit}
.project:last-child{border-bottom:1px solid var(--line-soft)}
.project-toggle{background:transparent;border:0;width:100%;min-height:66px;display:flex;align-items:center;gap:20px;text-align:left;cursor:pointer;padding:11px 0}
.project-number{color:var(--dim);font-size:11px;letter-spacing:.08em;min-width:30px}
.project-name{flex:1;font-size:20px;letter-spacing:-.025em;transition:transform .2s ease}
.project-toggle:hover .project-name{transform:translateX(4px)}
.project-kind{color:var(--dim);font-size:10px;text-transform:uppercase;letter-spacing:.13em;margin-left:auto;white-space:nowrap}
.project-icon{color:var(--muted);font-size:20px;font-weight:300;line-height:1;width:16px;text-align:right}
.project-toggle[aria-expanded=true] .project-icon{transform:rotate(45deg)}
.project-detail{padding:5px 0 29px 50px;animation:appear .25s ease}
.project-description{color:#b4b0a8;font-size:14px;line-height:1.65;max-width:590px;margin:0 0 22px}
.gallery{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,38%);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#5b5850 transparent;padding:0 0 16px;margin:0 -4px 4px 0}
.gallery-card{border:1px solid #373530;background:#181817;padding:0;cursor:zoom-in;text-align:left;scroll-snap-align:start;min-width:0;transition:border-color .2s,transform .2s}
.gallery-card:hover{border-color:#d2cec4;transform:translateY(-2px)}
.gallery-visual{height:215px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#242322}
.gallery-visual img{width:100%;height:100%;object-fit:contain}
.gallery-card-caption{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#d0ccc3;padding:12px 13px;font-size:11px;line-height:1.35}
.gallery-card-caption .arrow-icon{color:var(--muted)}
.gallery-empty{min-height:138px;border:1px dashed var(--line);display:flex;flex-direction:column;justify-content:center;gap:10px;padding:22px;color:var(--dim);font-size:10px;font-weight:700;letter-spacing:.16em;margin:0 0 14px}
.gallery-empty span{font-size:14px;letter-spacing:0;font-weight:400;color:var(--muted)}
.detail-link,.text-link{display:inline-flex;align-items:center;gap:12px;margin-top:4px;color:var(--fg);border-bottom:1px solid #8d8980;padding:0 0 6px;font-size:12px;letter-spacing:.02em}
.detail-link:hover,.text-link:hover{border-color:white}
.link-list{border-top:1px solid var(--line-soft)}
.link-list a{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-soft);padding:18px 0;font-size:21px;letter-spacing:-.02em}
.link-list a:hover{color:white;padding-left:5px}
.link-list a .arrow-icon{width:17px;height:17px;color:var(--muted)}
.link-list small{font-size:10px;color:var(--dim);letter-spacing:.12em;margin-left:8px;vertical-align:middle}
.about-layout{display:grid;grid-template-columns:minmax(170px,240px) 1fr;gap:clamp(22px,5vw,56px);padding:5px 0 7px;align-items:start}
.about-photo{width:100%;aspect-ratio:3/4;object-fit:cover;filter:grayscale(1)}
.about-copy{max-width:400px}
.about-kicker{margin:0 0 20px}
.about-copy p:not(.about-kicker){font-size:14px;line-height:1.75;color:#c3bfb7;margin:0 0 17px}
.about-copy .text-link{margin-top:15px}
.menu-hint{font-size:9px;font-weight:700;letter-spacing:.18em;color:var(--dim);margin:23px 0 0}
.menu-hint .arrow-icon{width:12px;height:12px;margin-left:6px;vertical-align:-.2em}
.footer{font-size:10px;letter-spacing:.13em;color:var(--dim);padding-top:23px;padding-bottom:28px}
.footer a{color:#aaa59b}
.footer a:hover{color:white}
.lightbox{position:fixed;inset:0;z-index:10;background:rgba(5,5,5,.985);display:flex;flex-direction:column;padding:22px clamp(16px,4vw,56px) 28px}
.lightbox-bar{display:flex;gap:20px;align-items:center;font-size:10px;letter-spacing:.15em;color:var(--muted);min-height:30px}
.lightbox-project{color:var(--fg);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50%}
.lightbox-counter{margin-left:auto;white-space:nowrap}
.lightbox-close{border:0;background:none;font-size:10px;letter-spacing:.15em;cursor:pointer;white-space:nowrap;padding:8px}
.lightbox-close span{font-size:22px;vertical-align:-2px;margin-left:8px}
.lightbox-view{flex:1;min-height:0;display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;gap:12px}
.lightbox-view figure{margin:0;min-width:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.lightbox-view img{max-width:100%;max-height:calc(100svh - 150px);object-fit:contain;min-height:0}
.lightbox-view figcaption{color:var(--muted);font-size:12px;letter-spacing:.02em;text-align:center}
.lightbox-arrow{border:1px solid var(--line);background:transparent;border-radius:50%;width:42px;height:42px;cursor:pointer;font-size:19px;transition:background .2s}
.lightbox-arrow:hover{background:#252421}
body.lightbox-open{overflow:hidden}
@media(max-width:680px){.masthead,.footer{padding-left:22px;padding-right:22px}.masthead-role{display:none}.stage{padding:70px 22px 90px}.stage.has-open{padding-top:68px}.introduction{margin-bottom:47px}h1{font-size:clamp(33px,8vw,44px)}.section-toggle{grid-template-columns:37px minmax(0,1fr) 24px;min-height:82px}.section-title{font-size:clamp(27px,7vw,38px)}.section-panel{padding-left:37px}.project-toggle{min-height:61px;gap:10px}.project-number{min-width:24px}.project-name{font-size:17px}.project-kind{display:none}.project-detail{padding-left:0}.gallery{grid-auto-columns:minmax(205px,78%)}.gallery-visual{height:210px}.about-layout{grid-template-columns:1fr}.about-photo{width:min(100%,260px);aspect-ratio:3/4}.lightbox{padding:14px 12px 24px}.lightbox-view{grid-template-columns:32px minmax(0,1fr) 32px;gap:3px}.lightbox-arrow{width:32px;height:32px;font-size:15px}.lightbox-view img{max-height:calc(100svh - 140px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}