@charset "UTF-8";
:root{--ink:#18334c;--accent:#25659b;--muted:#58738a;--line:#dceaf5;--sky:#62a9df;--paper:#f5faff;--sans:Arial,"Microsoft YaHei","PingFang SC",sans-serif;--display:Impact,"Arial Narrow",Arial,sans-serif;--serif:Georgia,"Times New Roman",serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:var(--sans);color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit}
button{border:0;background:none;color:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
img{display:block;max-width:100%}
h1,h2,h3,p,figure{margin:0}
[hidden]{display:none!important}
::selection{background:#cfe8ff;color:var(--accent)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:8px;left:8px;z-index:150;background:#fff;padding:12px 20px;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.reading-progress{position:fixed;inset:0 0 auto;height:2px;background:var(--sky);transform:scaleX(0);transform-origin:left;z-index:120}
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;height:82px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;gap:30px;color:#fff;background:linear-gradient(#eaf5ff80,transparent);transition:background .25s,color .25s,border-color .25s;border-bottom:1px solid transparent}
.site-header.is-scrolled{background:#eaf5ffee;backdrop-filter:blur(14px)}
.site-header.is-light{color:var(--ink);background:#fffffff5;border-bottom-color:var(--line);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;letter-spacing:.04em;flex-shrink:0}
.brand small{display:block;font-size:7px;letter-spacing:.18em;font-weight:400;margin-top:4px}
.brand-mark{width:32px;height:32px;transition:filter .25s}
.is-light .brand-mark{filter:brightness(0)}
nav{display:flex;align-items:center;gap:40px}
nav a{position:relative;min-height:44px;display:flex;align-items:center;font-size:13px;white-space:nowrap}
nav a:after{content:"";position:absolute;left:35%;right:35%;bottom:1px;height:2px;background:currentColor;transform:scaleX(0);transition:transform .2s}
nav a:hover:after,nav a[aria-current]:after{transform:scaleX(1)}
.header-socials{display:flex;gap:25px;font-size:11px;white-space:nowrap}
.header-socials a{padding:15px 0}
.eyebrow{font-size:10px;font-weight:500;letter-spacing:.13em;line-height:1.5}
.micro{font-size:11px;color:inherit}
.section-top{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:24px;gap:20px}
.hero{position:relative;height:100svh;min-height:680px;max-height:1300px;background:#10151c;color:#fff;overflow:hidden}
.hero-media{position:absolute;inset:0;overflow:hidden;animation:frame-open 1.5s cubic-bezier(.16,1,.3,1) both}
.hero-image{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 66%;opacity:0;transform:scale(1.035);transition:opacity 1.1s,transform 7s linear}
.hero-image.is-active{opacity:1;transform:scale(1)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(#10151c40,transparent 55%,#10151cb0);pointer-events:none}
.hero-intro{position:absolute;top:20%;left:7vw}
.hero-intro .eyebrow{font-weight:400;color:#ffffffe0}
.hero-title{display:block;font-family:var(--display);font-weight:400;font-size:clamp(120px,16vw,260px);line-height:.95;letter-spacing:-.025em;margin:20px 0 3px}
.hero-subtitle{display:flex;align-items:center;gap:20px;font-family:var(--serif);font-weight:400;font-style:italic;font-size:clamp(25px,3.1vw,50px)}
.hero-subtitle i{width:45px;height:2px;background:var(--sky)}
.hero-copy{font-size:13px;letter-spacing:.06em;margin-top:25px;color:#f5faff}
.hero-bottom{position:absolute;left:5vw;right:5vw;bottom:32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.scroll-link{display:flex;align-items:center;gap:12px;padding:6px 19px 6px 6px;border:1px solid #ffffff60;border-radius:999px;background:#10151c30;backdrop-filter:blur(8px);font-size:11px;min-height:48px}
.scroll-link small{display:block;font-size:7px;letter-spacing:.08em;margin-top:5px;opacity:.6}
.round-arrow{display:grid;place-items:center;width:36px;height:36px;background:#f5faff;color:#25659b;border-radius:50%;font-size:20px}
.scroll-link:hover{background:#f5faff;color:var(--accent)}
.hero-switcher{width:250px}
.hero-caption{display:flex;gap:14px;align-items:center;font-size:11px;margin-bottom:8px}
.hero-current{font-family:var(--serif);font-size:23px}
.hero-total{margin-left:auto;font-size:9px;color:#ffffff80}
.hero-tabs{display:flex;gap:10px}
.hero-tab{display:flex;flex:1;flex-direction:column;justify-content:center;min-height:44px;padding:0;text-align:left}
.hero-tab span{font-size:8px;margin-bottom:6px;opacity:.5}
.hero-tab i{display:block;width:100%;height:2px;background:#ffffff40;overflow:hidden;position:relative}
.hero-tab i:after{content:"";position:absolute;inset:0;background:var(--sky);transform:scaleX(0);transform-origin:left}
.hero-tab.is-active span{opacity:1}
.hero-tab.is-active i:after{transform:scaleX(1)}
.is-playing .hero-tab.is-active i:after{animation:slide-progress 7s linear both}
.autoplay-toggle{min-width:40px;min-height:44px;font-size:14px}
.hero-reveal{animation:rise-in 1s cubic-bezier(.16,1,.3,1) both;animation-delay:.15s}
.hero-title.hero-reveal{animation-delay:.25s}.hero-subtitle.hero-reveal{animation-delay:.35s}.hero-copy.hero-reveal{animation-delay:.45s}
@keyframes frame-open{from{clip-path:inset(12% 10%);filter:brightness(.75)}to{clip-path:inset(0);filter:brightness(1)}}
@keyframes rise-in{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:none}}
@keyframes slide-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Selected work: a centered horizontal gallery. */
.selected{position:relative;overflow:hidden;background:#fff;padding:112px 0 90px;--slide-width:clamp(480px,46vw,820px);--slide-gap:clamp(26px,4.5vw,68px)}
.legacy-anchor{position:absolute;top:0}
.selected-heading{text-align:center;margin-bottom:50px}
.selected-heading p{font-size:15px;letter-spacing:.05em;font-weight:600;color:#587b99}
.selected-heading h2{font-size:29px;font-weight:650;letter-spacing:.02em;margin-top:12px}
.featured-track{position:relative;display:flex;gap:var(--slide-gap);width:100%;padding:0 calc((100% - var(--slide-width))/2) 4px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab}
.featured-track::-webkit-scrollbar{display:none}
.featured-track.is-dragging{scroll-snap-type:none;cursor:grabbing}
.featured-card{position:relative;flex:0 0 var(--slide-width);width:var(--slide-width);scroll-snap-align:center;transform:scale(.94);opacity:.5;transition:opacity .45s,transform .6s cubic-bezier(.16,1,.3,1)}
.featured-card.is-current{transform:scale(1);opacity:1}
.featured-image{position:relative;display:block;width:100%;aspect-ratio:16/10;background:#eff6fc;overflow:hidden}
.featured-image img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;transition:transform .6s}
.featured-image:hover img{transform:scale(1.015)}
.featured-open{position:absolute;right:18px;bottom:18px;width:43px;height:43px;display:grid;place-items:center;background:#ffffffee;color:#25659b;border-radius:50%;font-size:23px;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}
.featured-image:hover .featured-open,.featured-image:focus-visible .featured-open{opacity:1;transform:none}
.featured-caption{display:flex;justify-content:center;align-items:center;gap:9px;margin-top:24px;min-height:30px}
.caption-mark{font-size:20px;line-height:1;color:var(--accent)}
.featured-caption h3{font-size:15px;font-weight:500;letter-spacing:.01em}
.featured-type{font-size:10px;color:#59788f;margin-left:5px}
.featured-toolbar{max-width:900px;width:calc(100% - 90px);margin:42px auto 0;display:flex;align-items:center;justify-content:space-between;gap:28px}
.featured-controls{display:flex;align-items:center;gap:20px}
.featured-controls button{width:46px;height:46px;border:1px solid #cadfed;border-radius:50%;font-size:20px;transition:background .2s,color .2s}
.featured-controls button:hover{background:var(--ink);color:white;border-color:var(--ink)}
.featured-counter{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.featured-counter span{color:#628299;margin-left:4px}
.all-work-link{font-size:12px;padding:12px 0;border-bottom:1px solid #b8d3e9;white-space:nowrap}
.all-work-link span{font-size:18px;margin-left:25px}

/* All work: searchable photo archive. */
.catalog{padding:118px 4.5vw 70px;max-width:1800px;margin:0 auto;min-height:80svh}
.catalog-heading{text-align:center;margin-bottom:23px}
.catalog-eyebrow{font-size:9px;letter-spacing:.12em;color:#57748c;margin-bottom:10px}
.catalog-heading h1{font-size:25px;letter-spacing:.04em;font-weight:600}
.catalog-search{max-width:630px;height:50px;margin:0 auto 24px;display:flex;align-items:center;border:1px solid #d7e7f3;border-radius:6px;background:white}
.catalog-search:focus-within{border-color:#62a9df}
.catalog-search input{border:0;outline:none;min-width:0;width:100%;height:100%;background:transparent;padding:0 18px;font-size:13px;color:var(--ink)}
.catalog-search input::placeholder{color:#738fa5}
.catalog-search input:focus-visible{outline:none}
.catalog-search button{width:50px;height:48px;flex-shrink:0;display:grid;place-items:center}
.catalog-search svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.8}
.catalog-categories{display:flex;justify-content:center;align-items:center;gap:70px;border-bottom:1px solid var(--line);min-height:65px}
.category-tab{position:relative;font-size:14px;color:#5f7c93;min-height:64px;padding:17px 7px}
.category-tab span{font-size:10px;margin-left:7px;font-variant-numeric:tabular-nums}
.category-tab:after{content:"";position:absolute;height:3px;width:18px;left:calc(50% - 9px);bottom:0;background:var(--ink);transform:scaleX(0);transition:transform .2s}
.category-tab.is-active{color:var(--ink);font-weight:600}
.category-tab.is-active:after{transform:scaleX(1)}
.library-shell{display:grid;grid-template-columns:160px minmax(0,1fr);gap:30px;padding-top:27px}
.library-sidebar{position:sticky;top:105px;align-self:start;max-height:calc(100svh - 130px);overflow:auto;scrollbar-width:thin;padding-right:12px}
.filter-panel-heading{height:44px;display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:12px}
.filter-panel-heading h2{font-size:13px;font-weight:600}
.reset-filters{font-size:11px;color:#57748c;padding:12px 0}
.reset-filters:hover{color:var(--accent)}
.facet+.facet{margin-top:30px}
.facet h3{font-size:11px;color:#58738a;font-weight:400;margin-bottom:12px}
.topic-options,.shape-options{display:flex;flex-direction:column;gap:4px}
.facet-button,.shape-options button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:10px 12px;min-height:36px;font-size:11px;text-align:left;border-radius:3px;color:#486c88}
.facet-button[aria-pressed="true"],.shape-options button[aria-pressed="true"]{background:#ddebfa;color:var(--accent);font-weight:600}
.facet-button:hover,.shape-options button:hover{background:#edf6ff}
.facet-count{font-size:10px;color:#58738a;font-weight:400}
.filter-close{display:none}
.library-content{min-width:0}
.library-toolbar{display:flex;align-items:center;gap:16px;min-height:44px;margin-bottom:22px}
.filter-toggle{font-size:12px;min-height:44px;display:flex;align-items:center;gap:6px;padding:9px 0}
.filter-toggle>span{font-size:19px}
#results-count{font-size:11px;color:#57748c}
.sort-control{margin-left:auto}
.sort-control select{border:0;background:#fff;color:#456983;padding:12px 22px 12px 8px;font-size:11px;max-width:150px;cursor:pointer}
.active-filters{display:flex;gap:8px;flex-wrap:wrap}
.active-filters:empty{display:none}
.filter-chip{font-size:10px;padding:8px 10px;background:#e8f4ff;border:1px solid #cbe1f4;border-radius:3px;margin-bottom:20px;max-width:100%;overflow-wrap:anywhere}
.library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:58px 18px;align-items:start}
.library-card{min-width:0;animation:card-appear .35s ease both}
.library-image{position:relative;display:block;width:100%;aspect-ratio:16/10;background:#eff6fc;overflow:hidden}
.library-image img{width:100%;height:100%;object-fit:contain;transition:transform .5s;user-select:none}
.library-image:hover img{transform:scale(1.025)}
.library-image-open{position:absolute;right:12px;bottom:12px;background:#ffffffee;color:#25659b;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;font-size:18px;opacity:0;transition:opacity .2s}
.library-image:hover .library-image-open,.library-image:focus-visible .library-image-open{opacity:1}
.library-card-title{display:flex;align-items:center;gap:7px;margin-top:14px;min-width:0}
.library-card-title h2{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5}
.photo-symbol{position:relative;width:12px;height:10px;border:1.4px solid currentColor;border-radius:2px;flex-shrink:0}
.photo-symbol:before{content:"";position:absolute;left:2px;top:-3px;width:5px;height:2px;border:1px solid currentColor;border-bottom:0}
.photo-symbol:after{content:"";position:absolute;width:3px;height:3px;border:1px solid currentColor;border-radius:50%;left:3px;top:2px}
.orientation-badge{font-size:8px;line-height:1.6;padding:0 4px;border:1px solid #c5dcea;border-radius:3px;white-space:nowrap;flex-shrink:0;color:#4a6e89}
.library-meta{display:flex;gap:13px;flex-wrap:wrap;font-size:10px;color:#57748c;margin-top:9px;line-height:1.7}
.library-end{font-size:11px;text-align:center;color:#607e96;margin:70px 0 12px}
.library-empty{padding:90px 20px;text-align:center}
.library-empty>span{font-size:50px;color:#adcde5}
.library-empty h2{font-size:18px;font-weight:500;margin:18px 0 12px}
.library-empty p{font-size:12px;line-height:1.8;color:#58738a}
.library-empty button{border-bottom:1px solid #68a8d8;color:var(--accent);margin-top:20px;font-size:12px}
.library-shell.filters-hidden{grid-template-columns:1fr}
.filters-hidden .library-sidebar{display:none}
.library-footer{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line);padding:30px 5vw;color:#57748c;font-size:10px}
.library-footer .brand{color:var(--accent);font-size:14px}
.library-footer .brand small{font-size:6px}
.library-footer>div{display:flex;gap:28px;font-size:11px}
.filter-dialog{width:calc(100vw - 36px);max-width:400px;max-height:85svh;padding:22px 24px;border:0;border-radius:8px;overflow:auto;color:var(--ink)}
.filter-dialog::backdrop{background:#eaf5ff80;backdrop-filter:blur(3px)}
.filter-dialog .filter-close{display:block;position:sticky;bottom:0;background:var(--accent);color:white;border-radius:4px;width:100%;padding:15px;margin-top:25px;font-size:13px}
.filter-dialog .facet-button,.filter-dialog .shape-options button{min-height:43px;font-size:12px}
@keyframes card-appear{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:none}}

/* About and social links retain CHAIR's own identity. */
.perspective{background:#e5f2ff;color:#f5faff;padding:55px 7vw 0;overflow:hidden}
.perspective .section-top{border-color:#ffffff25}
.perspective-grid{display:grid;grid-template-columns:1fr 2fr;align-items:center;gap:9vw;padding:75px 0 85px}
.perspective h2{font-size:clamp(34px,4.1vw,64px);font-weight:400;line-height:1.4;letter-spacing:-.04em}
.serif-accent{font-family:var(--serif);color:#3b81b8}
.perspective p{font-size:14px;line-height:2;margin-top:28px;color:#456985}
.perspective .perspective-footnote{font-size:10px;letter-spacing:.08em;color:#527b9b}
.perspective-symbol{width:100%;aspect-ratio:1;position:relative;display:grid;place-items:center}
.orbit{position:absolute;border:1px solid #8dbce0;border-radius:50%;width:78%;height:78%;animation:orbit-spin 24s linear infinite}
.orbit-one{transform:rotateY(62deg) rotateZ(24deg)}
.orbit-two{animation-direction:reverse;animation-duration:31s;transform:rotateX(65deg) rotateZ(-32deg)}
.orbit-three{width:48%;height:48%;animation-duration:16s;border-color:#73abda}
.perspective-mark{width:25%;height:auto;position:relative}
.type-band{margin:0 -7vw;padding:22px 0 15px;border-top:1px solid #ffffff20;white-space:nowrap;overflow:hidden}
.type-band span{display:block;font-family:var(--display);font-size:clamp(65px,10vw,160px);line-height:1;color:#94bee0;letter-spacing:.01em}
@keyframes orbit-spin{from{rotate:0deg}to{rotate:360deg}}
.contact{padding:55px 7vw 24px;background:#fff}
.contact-main{display:flex;align-items:center;justify-content:space-between;gap:50px;padding:65px 0 75px}
.contact-kicker{font-size:12px;color:#58738a;margin-bottom:25px}
.contact h2{font-size:clamp(48px,7vw,110px);font-weight:500;line-height:1.15;letter-spacing:-.06em;color:var(--accent)}
.social-links{width:min(100%,380px)}
.social-link{display:flex;align-items:center;gap:20px;padding:25px 0;border-bottom:1px solid #d0e3f2}
.social-icon{font-size:13px;font-weight:700;color:white;background:#ec343a;padding:12px 6px;border-radius:10px;white-space:nowrap}
.social-icon-douyin{background:#18334c;min-width:51px;text-align:center;text-shadow:1px 1px #fe2c55,-1px -1px #25f4ee}
.social-link>span:nth-child(2){font-size:15px}
.social-link small{display:block;font-size:8px;color:#57748c;letter-spacing:.05em;margin-top:9px}
.social-arrow{margin-left:auto;font-size:33px;font-family:var(--serif)}
.footer-brand{display:block;width:170px;margin:-10px 0 22px}
.footer-brand img{width:100%;height:auto}
.footer-line{display:flex;align-items:center;justify-content:space-between;gap:22px;padding-top:22px;border-top:1px solid #dceaf5;font-size:9px;color:#57748c}
.js .reveal{opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s}
.js .reveal.is-visible{opacity:1;transform:none}

/* Shared photo viewer. */
.lightbox{position:fixed;inset:0;width:100vw;height:100svh;max-width:100vw;max-height:100svh;border:0;overflow:hidden;background:#f4f9fe;color:#f5faff;padding:max(18px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}
.lightbox::backdrop{background:#f4f9fe}
.lightbox[open]{display:flex;flex-direction:column}
.lightbox-top{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:44px;flex-shrink:0}
.lightbox-top p{display:flex;align-items:center;gap:22px;font-size:11px}
.lightbox-index{font-variant-numeric:tabular-nums;color:#456983}
.viewer-actions{display:flex;gap:12px;align-items:center;flex-shrink:0}
.viewer-actions button{min-height:44px}
.lightbox-share{font-size:11px;border:1px solid #ffffff40;border-radius:999px;padding:9px 14px;white-space:nowrap}
.lightbox-share:hover{border-color:var(--sky);color:var(--sky)}
.lightbox-close{font-size:12px;padding:7px 0 7px 12px}
.lightbox-close>span{font-size:28px;margin-left:12px;vertical-align:middle}
.lightbox figure{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;gap:12px;padding:12px 0}
.lightbox-stage{position:relative;flex:1;min-height:0;width:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}
.lightbox-image{height:100%;width:100%;min-height:0;object-fit:contain;user-select:none;-webkit-user-drag:none}
.image-loading,.image-retry{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);padding:9px 14px;background:#f4f9fecc;color:#f5faff;font-size:11px;border-radius:999px;white-space:nowrap}
.image-loading{display:none;pointer-events:none}
.is-loading .image-loading{display:block}
.image-retry{border:1px solid #ffffff40;min-height:44px}
.lightbox figcaption{display:flex;align-items:center;justify-content:space-between;gap:30px;width:100%;min-height:32px;flex-shrink:0}
.lightbox-title{font-size:15px}
.lightbox-description{font-size:11px;color:#456983;text-align:right;line-height:1.6}
.lightbox-thumbnails{position:relative;display:flex;gap:8px;width:100%;padding:6px 2px 10px;overflow-x:auto;overscroll-behavior-x:contain;flex-shrink:0;scrollbar-width:thin;scrollbar-color:#82b6dd transparent}
.photo-thumb{width:80px;height:56px;flex:0 0 80px;padding:3px;overflow:hidden;border:1px solid transparent;border-radius:2px;opacity:.5;transition:opacity .2s,border-color .2s}
.photo-thumb img{width:100%;height:100%;object-fit:contain;background:#e0eef9}
.photo-thumb:hover,.photo-thumb.is-active{opacity:1}
.photo-thumb.is-active{border-color:var(--sky)}
.photo-thumb:focus-visible{outline-offset:1px}
.lightbox-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;flex-shrink:0}
.lightbox-bottom button{font-size:12px;min-height:44px;min-width:80px}
.lightbox-bottom button:disabled{opacity:.25;cursor:default}
.lightbox-bottom>span{font-size:9px;color:#57748c}
.mobile-help{display:none}
.share-fallback{padding:12px 0;flex-shrink:0}
.share-fallback label{display:block;font-size:11px;color:#456983;margin-bottom:8px}
.share-fallback input{display:block;width:100%;padding:10px;background:#e0eef9;color:#f5faff;border:1px solid #82b6dd;border-radius:3px;font-size:12px}
.view-cursor{display:none}

@media(min-width:1680px){.library-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:60px 22px}.library-shell{grid-template-columns:180px minmax(0,1fr);gap:36px}}
@media(max-width:1000px){
  .site-header{padding:0 4vw;gap:22px}nav{gap:28px}.header-socials{gap:16px;font-size:10px}
  .library-shell{grid-template-columns:140px minmax(0,1fr);gap:22px}
  .library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 16px}
  .hero-intro{top:19%}.hero-title{font-size:20vw}
}
@media(max-width:800px){
  html{scroll-padding-top:80px}
  .site-header{height:70px;padding:0 24px}
  .brand{font-size:15px;gap:9px}.brand-mark{width:29px;height:29px}
  .header-socials{display:none}nav{gap:24px}nav a{font-size:12px}
  .catalog{padding:100px 24px 50px}
  .catalog-heading{margin-bottom:22px}.catalog-heading h1{font-size:23px}
  .catalog-search{height:48px;margin-bottom:16px}.catalog-search button{height:46px}
  .catalog-categories{gap:48px;min-height:58px}
  .category-tab{font-size:13px;min-height:57px;padding:14px 4px}
  .library-shell{display:block;padding-top:16px}
  .library-sidebar{display:none}
  .library-toolbar{margin-bottom:20px}
  .library-card-title{gap:5px}.library-card-title h2{font-size:13px}
  .library-meta{font-size:10px;gap:9px;margin-top:7px}
  .featured-toolbar{width:calc(100% - 60px)}
  .perspective-grid{gap:6vw;padding:60px 0}.perspective p{font-size:12px}
}
@media(max-width:650px){
  .site-header{height:68px;padding:0 20px;gap:15px}
  nav{gap:18px}nav a{font-size:11px}.brand small{font-size:6px}
  .hero{min-height:640px;max-height:1000px}
  .hero-media{inset:35% 0 13%;animation:rise-in 1.2s ease both}
  .hero-image{object-fit:contain;object-position:center}
  .hero-shade{background:linear-gradient(#10151c 0%,transparent 34%,transparent 76%,#10151c 96%)}
  .hero-intro{top:112px;left:25px;right:25px}
  .hero-intro .eyebrow{font-size:7px;letter-spacing:.1em}
  .hero-title{font-size:28vw;margin-top:18px}
  .hero-subtitle{font-size:25px;gap:13px}.hero-subtitle i{width:32px}
  .hero-copy{font-size:12px;letter-spacing:.02em;margin-top:20px}
  .hero-bottom{left:20px;right:20px;bottom:max(25px,env(safe-area-inset-bottom));gap:14px}
  .scroll-link{font-size:10px;gap:8px;padding:5px 13px 5px 5px;min-height:44px;background:#f5faff;color:var(--accent);flex-shrink:0}
  .round-arrow{width:32px;height:32px;background:var(--accent);color:#f5faff;font-size:18px}
  .scroll-link small{font-size:6px}
  .hero-switcher{width:145px}.hero-caption{font-size:8px;gap:6px;margin-bottom:0}.hero-current{font-size:17px}.hero-total{font-size:7px}
  .hero-tabs{gap:6px}.hero-tab span{font-size:7px}.autoplay-toggle{min-width:32px;font-size:12px}
  .selected{padding:65px 0 55px;--slide-width:calc(100vw - 64px);--slide-gap:18px}
  .selected-heading{margin-bottom:34px}.selected-heading p{font-size:11px;letter-spacing:.06em}.selected-heading h2{font-size:24px;margin-top:10px}
  .featured-card{transform:scale(.94)}.featured-card.is-current{transform:scale(1)}
  .featured-caption{margin-top:18px;gap:7px;flex-wrap:wrap}
  .featured-caption h3{font-size:13px}.caption-mark{font-size:18px}
  .featured-type{font-size:9px;margin-left:3px}
  .featured-open{width:33px;height:33px;font-size:19px;right:11px;bottom:11px;opacity:1;transform:none}
  .featured-toolbar{width:calc(100% - 48px);margin-top:30px;gap:18px}
  .featured-controls{gap:11px}.featured-controls button{width:40px;height:40px;font-size:18px}
  .featured-counter{font-size:9px}.all-work-link{font-size:10px}.all-work-link span{margin-left:10px;font-size:16px}
  .catalog{padding:96px 18px 45px}
  .catalog-heading{margin-bottom:20px}.catalog-eyebrow{font-size:8px}
  .catalog-search input{font-size:12px;padding-left:13px}
  .catalog-categories{gap:33px}.category-tab{font-size:12px}.category-tab span{font-size:8px;margin-left:4px}
  .library-grid{gap:30px 12px}.library-image{aspect-ratio:4/3}
  .library-card-title{margin-top:11px;gap:5px}.library-card-title h2{font-size:11px;font-weight:500}
  .photo-symbol{display:none}.orientation-badge{font-size:7px;padding:0 3px}
  .library-meta{font-size:9px;gap:7px;margin-top:5px}
  .library-image-open{opacity:1;width:25px;height:25px;font-size:15px;right:7px;bottom:7px}
  .library-toolbar{gap:12px}.filter-toggle{font-size:11px}
  .sort-control select{font-size:10px;max-width:120px}
  #results-count{font-size:10px}
  .library-end{font-size:10px;margin-top:45px}
  .library-footer{padding:25px 20px;gap:20px;flex-wrap:wrap}
  .library-footer>div{gap:18px;font-size:10px}.library-footer>span{font-size:8px}
  .perspective{padding:35px 25px 0}
  .section-top{padding-top:22px}.eyebrow{font-size:8px}.micro{font-size:9px}
  .perspective-grid{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding:30px 0 50px}
  .perspective-symbol{width:130px;margin-left:auto}
  .perspective h2{font-size:9vw}.perspective p{font-size:12px;margin-top:23px;line-height:2}
  .perspective .perspective-footnote{font-size:9px}
  .type-band{margin:0 -25px;padding:18px 0 12px}.type-band span{font-size:21vw}
  .contact{padding:35px 25px 22px}
  .contact-main{display:block;padding:45px 0 55px}
  .contact-kicker{font-size:11px}.contact h2{font-size:15vw}
  .social-links{width:100%;margin-top:30px}.social-link{padding:24px 0;gap:17px}
  .social-link>span:nth-child(2){font-size:14px}.social-icon{font-size:12px}
  .footer-brand{width:150px}.footer-line{font-size:8px}.footer-line>span:nth-child(2){display:none}
  .lightbox{padding:max(10px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom))}
  .lightbox-top p{font-size:10px;gap:10px}.viewer-actions{gap:6px}
  .lightbox-share{font-size:10px;padding:8px 11px}
  .lightbox-close{font-size:10px;padding:4px 0 4px 8px}.lightbox-close>span{font-size:25px;margin-left:5px}
  .lightbox figure{padding:8px 0;gap:14px}
  .lightbox figcaption{display:block;min-height:55px}
  .lightbox-title{display:block;font-size:15px}
  .lightbox-description{display:block;font-size:11px;text-align:left;line-height:1.6;margin-top:7px}
  .photo-thumb{width:66px;height:50px;flex-basis:66px}
  .lightbox-thumbnails{gap:6px;padding-bottom:7px}
  .lightbox-bottom>span{font-size:9px}.lightbox-bottom button{font-size:11px}
  .desktop-help{display:none}.mobile-help{display:inline}
}
@media(max-width:360px){
  .site-header{padding:0 16px}nav{gap:12px}nav a{font-size:10px}
  .hero-bottom{left:16px;right:16px;gap:10px}.hero-switcher{width:133px}.hero-caption-text{font-size:7px}.scroll-link{padding-right:10px}
  .featured-controls{gap:8px}.featured-controls button{width:36px;height:36px}.featured-toolbar{width:calc(100% - 36px)}
  .all-work-link{font-size:9px}.all-work-link span{margin-left:6px}
  .catalog-categories{gap:21px}.category-tab{font-size:11px}
  .library-card-title h2{font-size:10px}
  .lightbox-label{display:none}
}
@media(max-height:500px) and (orientation:landscape){
  .lightbox{padding:5px 18px}.lightbox-top{min-height:38px}
  .lightbox figure{padding:2px 0;gap:4px}.lightbox figcaption{min-height:20px}
  .lightbox-description{display:none}.lightbox-title{font-size:12px}
  .photo-thumb{height:35px;width:56px;flex-basis:56px}.lightbox-thumbnails{padding:3px 2px}
  .lightbox-bottom{min-height:35px}.lightbox-bottom button{min-height:35px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .js .reveal{opacity:1;transform:none}.hero-image,.hero-image.is-active{transform:none}
  .orbit{animation:none}.featured-card{transform:none}
}


/* Blue and white: an open photo journal. */
:root{--ice:#eaf5ff;--soft-blue:#d9edff;--ease:cubic-bezier(.16,1,.3,1)}
.site-header,.site-header.is-scrolled,.site-header.is-light{color:var(--ink);background:#ffffffd9;border-bottom-color:#dceaf580;backdrop-filter:blur(18px);transition:height .35s var(--ease),background .35s,border-color .35s}
.site-header.is-scrolled{height:70px;background:#fffffff0;border-bottom-color:var(--line)}
.is-light .brand-mark{filter:none}
.brand-mark{transition:transform .6s var(--ease)}
nav a:after{left:15%;right:15%;background:var(--sky);height:3px;border-radius:4px}
.reading-progress{height:3px;background:linear-gradient(90deg,#a9d8ff,#438cc8)}
.selected{background:radial-gradient(ellipse at 50% 0,#e9f5ff88,transparent 46%),#fff;padding-top:108px}
.selected-heading p,.catalog-eyebrow{color:#486c88;letter-spacing:.16em;font-size:9px}
.selected-heading h2{font-size:clamp(26px,3vw,40px);letter-spacing:.04em;color:#244f72}
.selected-heading:after{content:"";display:block;width:40px;height:3px;border-radius:3px;background:#83c3f3;margin:21px auto 0;transform:scaleX(0);transition:transform .8s var(--ease) .2s}
.selected-heading.is-visible:after{transform:scaleX(1)}
.featured-image{border:10px solid #fff;border-radius:4px;background:#f0f7fd;box-shadow:0 9px 40px #3c77a811;transition:box-shadow .5s,border-color .5s}
.featured-card.is-current .featured-image{box-shadow:0 15px 45px #3976a81a}
.featured-image img,.library-image img{transition:transform .65s var(--ease)}
.featured-image:hover img,.library-image:hover img{transform:none}
.featured-open,.library-image-open{background:#ecf7fff2;color:#266ca1;box-shadow:0 4px 16px #1d48621c}
.featured-controls button{border-color:#d1e5f4;background:#f4faff;color:var(--accent);transition:background .25s,color .25s,transform .25s}
.featured-controls button:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.all-work-link{color:#376e97;border-color:#b7d7ef;display:flex;align-items:center;gap:24px}
.all-work-link span{display:inline-block;margin-left:0;transition:transform .35s var(--ease)}
body[data-page="library"]{background:linear-gradient(#eef7ff 0,#fff 480px)}
.catalog-heading h1{font-size:clamp(26px,3vw,36px);color:#244f72}
.catalog-search{border-color:#d1e5f5;border-radius:999px;box-shadow:0 6px 25px #427daa08;transition:box-shadow .3s,border-color .3s,transform .3s}
.catalog-search:focus-within{box-shadow:0 0 0 4px #deeffd;border-color:#79b2de;transform:translateY(-2px)}
.catalog-search button{color:var(--accent)}
.category-tab{transition:color .25s,background .25s}.category-tab.is-active{color:var(--accent)}
.category-tab:after{background:#65ace1;width:28px;left:calc(50% - 14px);border-radius:3px}
.library-sidebar{background:#f6fbffb3;border:1px solid #e0eef8;border-radius:14px;padding:5px 12px 18px}
.facet-button,.shape-options button{border-radius:7px;transition:background .2s,color .2s}
.facet-button[aria-pressed="true"],.shape-options button[aria-pressed="true"]{background:#deefff;color:#285f8c}
.filter-chip{background:#e8f5ff;border-color:#cde5f7;color:#366b93;border-radius:999px;padding:9px 13px}
.library-card{animation:none;transition:opacity .65s var(--ease),transform .65s var(--ease);transition-delay:var(--reveal-delay,0ms)}
.js .library-card{opacity:0;transform:translateY(22px)}
.js .library-card.is-visible{opacity:1;transform:none}
.library-image{border-radius:5px;background:#eff7ff;outline:1px solid #e4eff7;outline-offset:-1px;transition:box-shadow .4s,outline-color .4s}
.library-card-title h2{transition:color .25s}.orientation-badge{background:#f4faff;border-color:#d2e6f5;color:#507796}
.sort-control select{background:transparent;color:#4e7390}
.filter-dialog{border:1px solid #cde5f7;border-radius:18px;background:#fafdff;box-shadow:0 24px 80px #23537a33}
.filter-dialog::backdrop{background:#18334c55}
.filter-dialog[open]{animation:panel-open .3s var(--ease) both}
.filter-dialog .filter-close{border-radius:999px;background:#347caf}
.perspective{position:relative;background:linear-gradient(120deg,#eff8ff,#dfefff);color:var(--ink)}
.perspective .section-top{border-color:#bfdcf0}.perspective h2{color:#224e72}
.perspective p{color:#4c708b}.perspective .perspective-footnote{color:#486c88}
.serif-accent{color:#367cae}.perspective-symbol{perspective:600px}
.orbit{border-color:#8ebfe4}.orbit-three{border-color:#70a8d3;background:#ffffff33}
.perspective-mark{filter:drop-shadow(0 7px 10px #5797ca25)}
.type-band{border-top-color:#bed9ed;transform:rotate(-2deg);margin-top:15px;padding:25px 0;background:#ffffff4d}
.type-band span{color:transparent;-webkit-text-stroke:1px #78a9cc;transform:translate3d(var(--band-shift,0px),0,0);will-change:transform}
.contact{background:radial-gradient(ellipse at 100% 100%,#eaf5ff,transparent 60%),#fff}
.contact h2{color:#2f6894}.social-link{position:relative;border-color:#d4e7f6;border-radius:8px;transition:background .3s,padding .35s var(--ease)}
.social-arrow{color:#548eb9;transition:transform .35s var(--ease)}
.lightbox{background:#f4f9fe;color:var(--ink)}.lightbox::backdrop{background:#eaf5ff}
.lightbox[open]{animation:viewer-open .3s var(--ease)}
.lightbox-share{border-color:#bdd7ec;background:#fff}.lightbox-share:hover{border-color:#5c9ed0;color:#286d9f}
.photo-thumb{border-radius:4px;opacity:.55}.photo-thumb img{background:#e0eef9}
.photo-thumb.is-active{border-color:#4389bd;background:#fff;opacity:1}
.image-loading,.image-retry{background:#ffffffed;color:#346f99;border-color:#bad8ef;box-shadow:0 4px 16px #34608014}
.share-fallback input{background:#fff;color:var(--ink);border-color:#bad8ef}
@keyframes photo-unfold{from{opacity:0;clip-path:inset(6% 5% 6% 5%);translate:0 18px}to{opacity:1;clip-path:inset(0);translate:0 0}}
@keyframes panel-open{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
@keyframes viewer-open{from{opacity:0;scale:.985}to{opacity:1;scale:1}}
@view-transition{navigation:auto}
::view-transition-old(root){animation:page-out .16s ease both}
::view-transition-new(root){animation:page-in .28s ease both}
@keyframes page-out{to{opacity:0}}
@keyframes page-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@media(hover:hover) and (pointer:fine){
 .brand:hover .brand-mark{transform:rotate(-8deg)}
 .all-work-link:hover span,.social-link:hover .social-arrow{transform:translate(4px,-4px)}
 .featured-image:hover{border-color:#f4faff;box-shadow:0 17px 45px #3f83b826}
 .featured-controls button:hover{transform:translateY(-2px)}
 .library-card:hover .library-image{box-shadow:0 12px 24px #3573a51c;outline-color:#9fcaea}
 .library-card:hover h2{color:#2e7db6}
 .social-link:hover{background:#eff8ff;padding-left:16px;padding-right:16px}
}
@media(max-width:1000px) and (min-width:651px){
}
@media(max-width:800px){.site-header.is-scrolled{height:68px}.catalog{padding-top:112px}}
@media(max-width:650px){
 .site-header,.site-header.is-scrolled{height:68px;background:#fffffff0}
 .selected{padding-top:70px}.selected-heading p{font-size:8px}.selected-heading h2{font-size:26px}
 .selected-heading:after{width:28px;margin-top:16px}.featured-image{border-width:6px}
 .featured-controls button{width:44px;height:44px}.featured-controls{gap:8px}
 .all-work-link{gap:8px}.featured-toolbar{gap:12px;width:calc(100% - 40px)}
 .catalog{padding-top:104px}.catalog-heading h1{font-size:28px}
 .library-card-title h2{font-size:11px}.library-image{border-radius:4px}
 .perspective-symbol{width:155px;margin-top:5px}.type-band{padding:20px 0}
 .lightbox-thumbnails{scrollbar-color:#82b6dd transparent}
}
@media(max-width:360px){
 .featured-toolbar{width:calc(100% - 28px);gap:8px}.featured-controls{gap:6px}
 .featured-controls button{width:40px;height:44px}.all-work-link{font-size:9px;gap:5px}
}
@media(prefers-reduced-motion:reduce){
 .js .library-card{opacity:1;transform:none;transition:none}.type-band span{transform:none}
 ::view-transition-old(root),::view-transition-new(root){animation:none!important}
}


/* Keep the original full-screen photo opening; blue and white begins below it. */
body[data-page="home"] .site-header{height:82px}
body[data-page="home"] .site-header:not(.is-light){color:#fff;background:linear-gradient(#10151c80,transparent);border-bottom-color:transparent;backdrop-filter:none}
body[data-page="home"] .site-header.is-scrolled:not(.is-light){background:#10151cee;backdrop-filter:blur(14px)}
.hero{overflow:clip}
.hero button:focus-visible,.hero a:focus-visible{outline-color:#8dcbf6}
@media(max-width:800px){body[data-page="home"] .site-header{height:70px}}
@media(max-width:650px){body[data-page="home"] .site-header{height:68px}}

/* Formal domain launch: display the verified ICP number on both pages. */
.icp-line{width:100%;text-align:center;font-size:11px;line-height:1.8;color:#57748c;letter-spacing:0;margin-top:18px}
.icp-link{display:inline-block;text-decoration:none;text-underline-offset:3px}
.icp-link:hover,.icp-link:focus-visible{text-decoration:underline}
.library-footer{flex-wrap:wrap}
.library-footer>.icp-line{flex-basis:100%;justify-content:center;gap:0;margin-top:0}
