/* Open, full-width pages; controls retain their shared shape. */
:root{--pad:clamp(24px,3vw,64px)}
body:not(.immersive-detail){min-height:100dvh;display:flex;flex-direction:column}
body:not(.immersive-detail)>main{flex:1;width:100%;max-width:none}
.collection-main>.section-pad,.project-manager-main{min-height:calc(100dvh - 96px)}
.home-page .home-introduction,.home-page .expertise,.home-page .contact{min-height:100dvh}
.collection-main>.section-pad{padding-inline:var(--pad)}
.comparison-section .viewer-stage{width:calc(100% + 2 * var(--pad));margin-inline:calc(-1 * var(--pad));height:100dvh;max-height:none}
.collection-breadcrumb{display:none}
.info-settings{display:flex;flex-wrap:wrap;gap:14px 24px;border:0;border-top:1px solid var(--line);padding:20px 0;margin:0}
.info-settings legend{font-size:1rem;padding-right:12px}
.project-form .info-settings label{display:flex;flex-direction:row;align-items:center;gap:10px}
.project-form .info-settings input{appearance:auto;width:18px;height:18px;accent-color:var(--orange)}
.portfolio-project-description{max-height:6.4em;overflow:auto;white-space:pre-wrap}
.portfolio-overlay [hidden]{display:none!important}
.home-page main>.expertise,.home-page main>.contact{min-height:100dvh}
.portfolio-tools{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:32px}
.portfolio-tools .category-filters{margin-bottom:0}
.export-portfolio,.google-export-setup button{min-height:52px;padding:14px 20px;border:1px solid #ffffff35;background:transparent;color:var(--cream);cursor:pointer;white-space:nowrap}
.export-portfolio:hover,.google-export-setup button:hover{border-color:var(--orange);background:#ffffff0a}
.export-portfolio:disabled{opacity:.4;cursor:default}
.portfolio-export-dialog{width:min(520px,calc(100vw - 32px));background:rgb(17 18 15 / 80%)}
.portfolio-export-dialog .export-result{display:block;margin-block:20px;padding:12px 16px;background:var(--orange);color:var(--bg);border-radius:var(--button-radius);text-align:center}
.portfolio-export-dialog [hidden]{display:none!important}
.google-export-setup{margin-top:64px;padding-top:32px;border-top:1px solid var(--line)}
.google-export-setup h2{font-size:1.5rem;margin-bottom:16px}
.google-export-setup p,.google-export-setup details{margin-block:16px;color:var(--muted);font-size:.9375rem;line-height:1.6}
.google-export-setup form{display:flex;gap:16px;align-items:flex-end;max-width:900px}
.google-export-setup label{display:grid;gap:8px;flex:1;min-width:0}
.google-export-setup input{font:inherit;padding:14px;width:100%;border:1px solid var(--line);background:transparent;color:var(--cream);border-radius:var(--button-radius)}
.google-export-setup code{overflow-wrap:anywhere}
.google-export-setup a{color:var(--cream);text-decoration:underline}
@media(max-width:600px){.portfolio-tools{flex-wrap:wrap}.google-export-setup form{flex-direction:column;align-items:stretch}.export-portfolio{font-size:.875rem}.portfolio-tools .category-filters{width:100%}}
.earlier-uploads{margin-top:64px}
.project-admin-actions{display:flex;flex-wrap:wrap;gap:8px;grid-column:3/-1}
.project-visibility{font-size:.8125rem;color:var(--orange)}
.earlier-upload-grid article>button{margin-top:12px;padding:10px 14px;border:1px solid var(--line);background:transparent;color:var(--cream);cursor:pointer}
@media(max-width:720px){.project-admin-actions{grid-column:1/-1}}
.earlier-upload-group{margin-block:32px}
.earlier-upload-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px;margin-top:20px}
.earlier-upload-card{display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--cream)}
.earlier-upload-card img{width:100%;height:160px;object-fit:contain;background:var(--bg)}
.earlier-upload-card:hover{color:var(--orange)}
.collection-main,.detail-main{width:100%;max-width:none;margin:0}
.detail-main{padding:36px var(--pad) 64px}
.site-header{border-bottom:0}
.detail-shell{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.detail-toolbar{padding:24px 0}
.detail-heading{margin-inline:0}
.detail-stage,.viewer-stage{border:0;border-radius:0;background:var(--bg);box-shadow:none}
.detail-image-wrap,.viewer-stage .viewer-media{border-radius:0}
.viewer-outgoing{background:var(--bg)}
.detail-caption,.detail-feedback,.gallery-strip{padding-inline:0}
.comparison-section .gallery-strip{border-top:0}
.portfolio-card{border:0;border-radius:0;background:transparent}
.portfolio-card.is-open{outline:none}
.portfolio-reveal:focus-visible{border-radius:0}
.portfolio-grid{column-gap:clamp(16px,2vw,32px)}
.portfolio-card{margin-bottom:clamp(16px,2vw,32px)}
.home-hero{min-height:calc(100svh - 96px)}
.home-introduction,.home-page .expertise{border:0;min-height:80svh;align-items:center}
.home-page .contact{min-height:75svh;display:flex;flex-direction:column;justify-content:center}
.home-hero-foot{border:0}
.project-form,.pair-upload-form,.category-manager{border:0;border-radius:0;background:transparent;padding:24px 0}
.project-source-fields label{border:0;border-radius:0;background:transparent;padding:0}
.saved-project{border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;overflow:visible}
.saved-project .project-admin-item,.project-admin-item{border:0;border-radius:0;background:transparent;padding:24px 0}
.saved-project-assets,.project-view-links{padding-inline:0}
/* Minimal zoom: a fine track, small thumb and the current percentage. */
.zoom-control{width:200px;max-width:100%;padding:0;border:0;border-radius:0;background:transparent}
.zoom-control-heading{font-size:.875rem;color:var(--muted)}
.zoom-control-heading output{color:var(--cream)}
#zoom-range{height:44px;margin:0}
#zoom-range::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--cream) var(--zoom-fill),#ffffff30 var(--zoom-fill))}
#zoom-range::-webkit-slider-thumb{width:12px;height:12px;margin-top:-5px;border:0;border-radius:50%;background:var(--cream)}
#zoom-range::-moz-range-track{height:2px;background:#ffffff30}
#zoom-range::-moz-range-progress{height:2px;background:var(--cream)}
#zoom-range::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--cream)}
/* Press feedback complements, rather than replacing, each control's hover. */
:where(button,[role=button],.site-nav a,.header-contact,.text-link,.portfolio-actions a,.project-view-links a,.site-footer a){transition-property:background-color,border-color,color,scale;transition-duration:.18s;transition-timing-function:ease}
:where(button,[role=button],.site-nav a,.header-contact,.text-link,.portfolio-actions a,.project-view-links a,.site-footer a):active:not(:disabled){scale:.97}
input::file-selector-button{transition:scale .18s}
input::file-selector-button:active{scale:.97}
.category-label{display:inline-block;transition:filter .22s ease;pointer-events:none}
@media(hover:hover) and (pointer:fine){.category-filter:hover .category-label{filter:blur(1px)}}
.category-filter:focus-visible .category-label,.category-filter:active .category-label{filter:none}
@media(max-width:900px){.home-hero{min-height:calc(100svh - 88px)}}
@media(max-width:720px){.detail-main{padding:30px var(--pad) 48px}.detail-toolbar{padding:20px 0}.home-introduction,.home-page .expertise{min-height:0}.home-page .contact{min-height:70svh}.zoom-control{width:min(100%,240px)}.project-form,.pair-upload-form,.category-manager{padding:20px 0}.project-source-fields label{padding:0}.saved-project .project-admin-item{padding:20px 0}}
@media(prefers-reduced-motion:reduce){:where(button,[role=button],.site-nav a,.header-contact,.text-link,.portfolio-actions a,.project-view-links a,.site-footer a):active:not(:disabled){scale:1}input::file-selector-button{transition:none}input::file-selector-button:active{scale:1}.category-label{transition:none;filter:none!important}}
/* Open category rail: a quiet surface with animated labels and a clear selection. */
.portfolio-tools{align-items:center;gap:24px}
.portfolio-tools .category-strip{width:auto;flex:1;min-width:0;z-index:auto}
.category-strip-options{display:flex;gap:8px;overflow-x:auto;padding:6px 3px 12px;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}
.category-strip .category-filter{position:relative;isolation:isolate;flex:none;display:flex;align-items:center;justify-content:center;gap:18px;min-height:50px;padding:12px 18px;border:1px solid #ffffff18;background:transparent;color:var(--cream);overflow:hidden;white-space:nowrap;border-radius:var(--button-radius);transition:border-color .25s,color .25s,background-color .25s}
.category-strip .category-filter::before{content:'';position:absolute;inset:0;background:var(--orange);z-index:-1;transform:translateY(105%);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.category-strip .category-total{font-size:.75rem;opacity:.5;font-variant-numeric:tabular-nums;transition:opacity .25s,transform .25s}
.category-strip .category-filter[aria-pressed=true]{background:transparent;border-color:var(--orange);color:var(--bg)}
.category-strip .category-filter[aria-pressed=true]::before{transform:translateY(0)}
.category-strip .category-filter[aria-pressed=true] .category-total{opacity:.8}
@media(hover:hover){.category-strip .category-filter:hover{border-color:var(--orange)}.category-strip .category-filter:hover .category-label{animation:category-label-focus .4s ease both}.category-strip .category-filter:hover .category-total{transform:translateY(-2px);opacity:1}}
@keyframes category-label-focus{0%{filter:blur(0);transform:translateY(0)}40%{filter:blur(2px);transform:translateY(-3px)}100%{filter:blur(0);transform:translateY(0)}}
.project-form .detail-upload-choice{display:flex;flex-direction:row;align-items:flex-start;gap:14px}.project-form .detail-upload-choice input{appearance:auto;width:18px;height:18px;flex-shrink:0;margin-top:4px;accent-color:var(--orange)}.detail-upload-choice small{display:block;margin-top:8px}
@media(max-width:720px){.portfolio-tools{flex-direction:column;align-items:stretch;gap:12px}.portfolio-tools .category-strip{width:100%}.portfolio-tools .export-portfolio{align-self:flex-end}.category-strip .category-filter{padding:10px 14px;gap:12px}}
@media(prefers-reduced-motion:reduce){.category-strip .category-filter,.category-strip .category-filter::before,.category-strip .category-total{transition:none}.category-strip .category-label{animation:none!important;filter:none!important}}
.client-management{margin-top:60px}.client-management>p{margin-top:16px;line-height:1.6;color:var(--muted)}.client-admin-row{display:flex;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}.client-admin-row img{width:100px;height:60px;object-fit:contain;filter:brightness(0) invert(1)}.client-admin-row span{flex:1;min-width:0;overflow-wrap:anywhere}.client-admin-row button{min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:var(--button-radius);background:transparent;color:var(--cream)}
/* Small screens: let content determine height and keep controls within the viewport. */
main,section,form,fieldset,.portfolio-tools,.project-admin-item>div{min-width:0}
@media(max-width:720px){
 :root{--pad:clamp(16px,5vw,28px)}
 input,select,textarea{font-size:16px!important;max-width:100%;min-width:0}
 .site-header{padding-inline:var(--pad);gap:12px}.site-nav{max-height:calc(100dvh - 80px);overflow:auto}
 .site-footer{align-items:flex-start;font-size:.875rem}.site-footer>div{flex-wrap:wrap;gap:16px}.site-footer a{min-height:44px;display:inline-flex;align-items:center}
 .home-page .home-hero h1{font-size:clamp(1.8rem,8.1vw,3.8rem);overflow-wrap:normal}.home-page .home-hero,.home-page .home-introduction,.home-page .expertise,.home-page .contact{min-height:auto}
 .contact-bottom>a{max-width:100%;overflow-wrap:anywhere}.home-intro-copy h2,.expertise-intro h2{font-size:clamp(2rem,8vw,3rem)}
 .portfolio-grid{columns:1}.portfolio-description h3{font-size:clamp(1.3rem,6vw,2rem);overflow-wrap:anywhere}.portfolio-actions{flex-wrap:wrap;gap:10px}.portfolio-actions a{min-height:44px}
 .collection-main .comparison-section .viewer-stage{height:68svh;min-height:260px;max-height:650px}.comparison-caption{align-items:flex-start}.project-view-info{height:auto!important;max-height:none!important;overflow:visible!important;min-width:0}.comparison-caption h3{overflow-wrap:anywhere}.comparison-caption p{white-space:pre-wrap}.comparison-position{flex-shrink:0}
 .gallery-strip-heading{flex-wrap:wrap;gap:16px}.thumbnail-rail{max-width:100%;overscroll-behavior-x:contain}
 .project-source-fields,.project-form{grid-template-columns:minmax(0,1fr)}.generated-image-set,.saved-project-assets{grid-template-columns:repeat(2,minmax(0,1fr))}
 .project-form-actions,.project-view-links,.project-admin-actions{flex-wrap:wrap}.project-list-heading{align-items:flex-start;flex-wrap:wrap}.project-admin-item{display:flex;flex-wrap:wrap}.project-admin-item h3{overflow-wrap:anywhere}.category-add{flex-wrap:wrap}.category-admin-list{grid-template-columns:minmax(0,1fr)}
 .studio-dialog{box-sizing:border-box;width:calc(100% - 32px);max-width:calc(100% - 32px);max-height:calc(100dvh - 32px);overflow:auto;padding:24px!important}.studio-dialog h2{font-size:clamp(1.6rem,7vw,2.4rem)}.studio-dialog-actions{flex-wrap:wrap}.studio-dialog-actions>*{min-height:44px;flex:1}
 .google-export-setup code{overflow-wrap:anywhere}.detail-heading{flex-wrap:wrap;gap:20px}.legal-main h1{overflow-wrap:anywhere}
}
@media(max-height:500px) and (orientation:landscape){.site-header{position:relative}.studio-dialog{max-height:calc(100dvh - 20px);overflow:auto}.home-page .home-hero{min-height:auto}}

.manage-section-nav{display:flex;gap:12px;flex-wrap:wrap;padding:24px var(--pad) 0}.manage-section-nav a{padding:12px 20px;min-height:44px;border:1px solid var(--line);border-radius:var(--button-radius)}.manage-section-nav a:hover{border-color:var(--orange);color:var(--orange)}
.project-image-manager{padding:20px 0;border-top:1px solid var(--line)}.project-image-manager>summary{cursor:pointer;padding:10px 0;color:var(--orange)}.project-image-admin-rail{display:flex;gap:16px;overflow-x:auto;padding:18px 0}.project-image-admin-rail>div{flex:0 0 130px;display:flex;flex-direction:column;gap:8px}.project-image-admin-rail img{width:130px;height:100px;object-fit:contain;background:#ffffff05}.project-image-admin-rail span{font-size:.75rem;overflow-wrap:anywhere}.project-images-add{display:grid;grid-template-columns:1fr 1fr;gap:16px}.project-images-add label{display:flex;flex-direction:column;gap:10px;font-size:.875rem}.project-images-add input[type=file]{max-width:100%;min-width:0}.project-images-add .batch-detail-choice{flex-direction:row;align-items:center}.batch-detail-choice input{width:18px;height:18px;accent-color:var(--orange)}.batch-selection{overflow-wrap:anywhere;font-size:.875rem;line-height:1.6}.project-images-add button,.project-image-admin-rail button{min-height:44px;border:1px solid var(--line);border-radius:var(--button-radius);background:transparent;color:var(--cream);padding:10px 16px;font:inherit}@media(max-width:720px){.project-images-add{grid-template-columns:1fr}.content-toolbar label{min-width:100%}}

.project-images-add>*{min-width:0}.project-image-admin-rail img{flex-shrink:0}.project-images-add button:hover,.project-image-admin-rail button:hover{border-color:var(--orange);background:#d35a2714}.project-images-add button:disabled,.project-image-admin-rail button:disabled{opacity:.5;cursor:wait}

/* Every route uses the viewport width, including ultrawide displays. */
html body{width:100%;max-width:none;margin-inline:0}
:root{--pad:clamp(16px,1.6vw,32px)}
body>main,.collection-main,.project-manager-main,.detail-main,.legal-main,.content-main{width:100%;max-width:none;margin-inline:0}
.home-page main>section,.collection-main>section{width:100%;max-width:none}
.collection-main>#work{padding-inline:0}
.collection-main>#work>.section-top,.collection-main>#work>.section-heading,.collection-main>#work>.portfolio-tools,.collection-main>#work>p{margin-inline:var(--pad)}
.legal-main article{max-width:none;columns:2;column-gap:clamp(32px,6vw,120px)}
.legal-main article h2{break-after:avoid}.legal-main article p{break-inside:avoid}
/* Group covers hold a physical stack; expanded images enter the same flow. */
#portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:clamp(20px,2.2vw,40px) clamp(12px,1.4vw,24px);columns:auto;padding:12px 0 28px;overflow:clip;overflow-clip-margin:20px}
#portfolio-grid>.portfolio-card{margin:0;min-width:0;overflow:visible;transform-origin:top left}
#portfolio-grid .portfolio-cover{position:relative;z-index:0;background:var(--bg);transform:none}
#portfolio-grid .portfolio-overlay{z-index:2;padding-top:70px}
.project-layers{position:absolute;inset:0;pointer-events:none;z-index:-1}
.project-layers img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:translateY(12px) scale(.97,1) rotate(.8deg);opacity:.85}
.project-layers img:first-child{transform:translateY(24px) scale(.94,1) rotate(-.8deg);opacity:.5}
#portfolio-grid .is-stack{margin-bottom:24px}
.project-stack-toggle{position:absolute;top:14px;right:14px;z-index:3;min-height:44px;padding:10px 16px;border:1px solid #ffffff50;border-radius:var(--button-radius);background:rgb(17 18 15 / 80%);color:var(--cream);font-size:.875rem;cursor:pointer}
.project-stack-toggle:hover,.project-stack-toggle[aria-expanded=true]{border-color:var(--orange);background:var(--orange);color:var(--bg)}
@media(max-width:1100px){#portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){#portfolio-grid{grid-template-columns:minmax(0,1fr);row-gap:24px}.legal-main article{columns:1}.collection-main>#work{padding-inline:0}}
/* Stable columns pack mixed ratios without empty grid rows. */
#portfolio-grid{display:block;position:relative;padding:0;overflow:hidden;overflow-anchor:none;transition:height .55s cubic-bezier(.22,1,.36,1)}
.portfolio-project{position:absolute;top:0;left:0;margin:0;min-width:0;overflow:hidden;transition:transform .55s cubic-bezier(.22,1,.36,1),height .55s cubic-bezier(.22,1,.36,1);contain:layout style}
#portfolio-grid .portfolio-card{margin:0;overflow:visible;width:100%}
#portfolio-grid .portfolio-cover{aspect-ratio:auto;transform:none}
#portfolio-grid .is-stack{margin-bottom:0}
.project-extra-images{display:flex;flex-direction:column;gap:var(--image-gap,16px);padding-top:var(--image-gap,16px);opacity:0;transform:translateY(-12px);transition:opacity .3s,transform .55s cubic-bezier(.22,1,.36,1);pointer-events:none}
.is-expanded .project-extra-images{opacity:1;transform:none;pointer-events:auto}
.project-layers{transition:opacity .25s}.is-expanded .project-layers{opacity:0}
#portfolio-grid.is-resetting,#portfolio-grid.is-resetting .portfolio-project{transition:none}
@media(prefers-reduced-motion:reduce){#portfolio-grid,.portfolio-project,.project-extra-images,.project-layers{transition:none}}
.home-art-management{margin-top:60px;padding-top:32px;border-top:1px solid var(--line)}.home-art-management>p{margin:18px 0;line-height:1.6;color:var(--muted)}#home-art-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.home-art-card{display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0}.home-art-card img{width:100%;height:260px;object-fit:contain;background:var(--bg)}.home-art-card label{display:grid;gap:10px;max-width:100%}.home-art-card input{max-width:100%}.home-art-card button,#home-art-retry{min-height:44px;padding:12px 18px;border:1px solid var(--line);border-radius:var(--button-radius);color:var(--cream);background:transparent;cursor:pointer}.home-art-card button:hover{border-color:var(--orange)}.home-art-card p{line-height:1.6}.home-art-card [hidden]{display:none}@media(max-width:720px){#home-art-list{grid-template-columns:1fr}}
