/* A consistent action hierarchy for the photograph viewer on every page. */
#lightbox .viewer-layout{--viewer-border:#a892742e;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:64px minmax(180px,1fr) 68px auto;gap:0;height:100%;padding:env(safe-area-inset-top) max(24px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(24px,env(safe-area-inset-left));overflow:auto;overscroll-behavior:contain}
#lightbox .lightbox-header{grid-column:1/-1;grid-row:1;height:64px;min-height:64px;border-bottom:1px solid var(--viewer-border);gap:20px}
#lightbox .lightbox-brand{font:11px/1.5 var(--sans);letter-spacing:.06em;color:#c6b9a6;min-width:0}
#lightbox .lightbox-header-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
#lightbox .lightbox-header-actions :is(button,a){min-height:44px;border-radius:8px;font-size:11px}
#lightbox .studio-share-button{max-width:180px;padding:9px 15px;border-color:var(--viewer-border);background:#ffffff05}
#lightbox .fullscreen-button{display:flex;align-items:center;justify-content:center;gap:8px;width:auto;min-width:44px;height:44px;padding:8px 12px;border:1px solid var(--viewer-border);color:#e4d9c9}
#lightbox #fullscreen-label{position:static;width:auto;height:auto;margin:0;padding:0;overflow:visible;clip:auto;white-space:normal;font:11px/1.4 var(--sans)}
#lightbox .fullscreen-button>span:last-child{padding:0;font-size:22px}
#lightbox .close{width:44px;height:44px;border:1px solid transparent;font-size:28px!important}
#lightbox .lightbox-stage{grid-column:1;grid-row:2;min-height:180px;min-width:0;gap:20px;padding:16px 0}
#lightbox .lightbox-stage>img{width:calc(100% - 128px);height:100%;min-height:0;object-fit:contain}
#lightbox .lightbox-stage>.icon-button{position:static;width:44px;height:44px;background:#ffffff07;border-color:var(--viewer-border);border-radius:50%}
#lightbox .viewer-filmstrip{grid-column:1;grid-row:3;width:auto;height:68px;max-height:68px;min-width:0;margin:0 64px;padding:7px 2px;flex-basis:68px;border-top:1px solid var(--viewer-border);scrollbar-color:#9b8464 transparent}
#lightbox .viewer-thumb[aria-current=true]{border-color:#dcc4a0;background:#655039}
#lightbox .lightbox-footer{grid-column:1;grid-row:4;display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,460px);align-items:center;gap:32px;min-width:0;min-height:0;max-height:none;margin:0 64px;padding:20px 0 24px;border-top:1px solid var(--viewer-border);overflow:visible}
#lightbox .viewer-photo-info{display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:100%;gap:0}
#lightbox .lightbox-footer h2{font:400 clamp(25px,2.5vw,34px)/1.18 var(--serif);letter-spacing:-.02em;overflow-wrap:anywhere}
#lightbox .lightbox-footer #lightbox-category{font:10px/1.7 var(--sans);letter-spacing:.025em;color:#ae9f8b;max-width:46em;margin-top:7px;overflow-wrap:anywhere}
#lightbox .studio-lightbox-story{order:2;margin-top:7px;max-width:40em}
#lightbox .studio-share-panel{order:3;width:100%;margin-top:8px}
#lightbox .viewer-owner-tools{order:4;display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:10px}
#lightbox .viewer-owner-tools:empty{display:none}
#lightbox .viewer-owner-tools>button{min-height:44px;margin:0;padding:8px 12px;border:1px solid var(--viewer-border);border-radius:7px;background:transparent;color:#cbb99e;font:11px/1.4 var(--sans)}
#lightbox .viewer-owner-tools #lightbox-management{order:-1}
#lightbox .lightbox-bottom-right{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr);grid-template-rows:44px auto;gap:12px 20px;align-items:center;justify-content:normal;min-width:0;width:100%;max-width:none;color:#e0d3bf;white-space:normal}
#lightbox .viewer-playback-controls{grid-column:1;grid-row:1;display:flex;align-items:center;justify-content:center;gap:12px;min-width:0;direction:ltr}
#lightbox #lightbox-count{position:static;text-align:start;font:10px/1.4 var(--sans);font-variant-numeric:tabular-nums;color:#ae9f8b;white-space:nowrap;flex-shrink:0}
#lightbox .lightbox-playback{width:44px;height:44px;border:1px solid var(--viewer-border);background:#ffffff07;border-radius:8px;font-size:17px}
#lightbox .slideshow-speed--viewer{gap:0;min-width:0}
#lightbox .slideshow-speed--viewer label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
#lightbox .slideshow-speed--viewer select{min-height:44px;width:78px;max-width:100%;padding:8px 7px;background:#ffffff07;border:1px solid var(--viewer-border);border-radius:8px;color:#e0d3bf;font:12px var(--sans)}
#lightbox .slideshow-speed--viewer option{background:#30291f;color:#f5ead9}
#lightbox .viewer-reaction-controls{grid-column:1;grid-row:2;display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
#lightbox .lightbox-reactions{display:flex;align-items:center;gap:8px}
#lightbox .lightbox-reactions>span{display:flex;min-width:0}
#lightbox .viewer-reaction-controls .favorite-photo{width:44px;height:44px;margin:0;border:1px solid var(--viewer-border);border-radius:8px;background:#ffffff07;font-size:25px;color:#e0d3bf}
#lightbox .favorite-photo.is-favorite{color:#f0a5b2}
#lightbox .viewer-reaction-controls :is(.photo-like-button,.photo-comment-button){min-height:44px;min-width:64px;border-radius:8px;font:12px/1 var(--sans)}
#lightbox .photo-purchase-actions{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;gap:10px;min-width:0;width:100%;max-width:none;padding:0}
#lightbox .photo-purchase-actions>a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:10px 14px;border-radius:8px;font:500 12px/1.5 var(--sans);line-height:1.4}
#lightbox .photo-purchase-actions .photo-inquiry{background:#ffffff05;border-color:#a58a675e;color:#e6d1b3;grid-column:auto;grid-row:auto}
#lightbox .photo-purchase-actions .photo-inquiry:hover{background:#a58a6720}
#lightbox :is(button,a,select):focus-visible{outline:2px solid #e6c79e;outline-offset:3px}
#lightbox [hidden]{display:none!important}

/* Comments stay alongside the photograph on a wide screen. */
#lightbox .viewer-layout.comments-open{grid-template-columns:minmax(0,1fr) minmax(300px,340px);grid-template-rows:64px minmax(180px,1fr) auto;column-gap:28px;overflow:auto}
#lightbox .comments-open>.lightbox-footer{grid-row:3;grid-template-columns:minmax(0,1fr);gap:16px;margin:0;padding:18px 0}
#lightbox .comments-open>.photo-comments-panel{grid-column:2;grid-row:2/4;min-height:0;max-height:100%;overflow:auto;padding-top:20px}
#lightbox .comments-open>.viewer-filmstrip{display:none}

@media(max-width:1000px){
 #lightbox .lightbox-footer{grid-template-columns:minmax(0,1fr);gap:16px;margin-inline:36px;padding:16px 0 20px}
 #lightbox .lightbox-bottom-right{grid-template-columns:minmax(210px,1fr) minmax(180px,1fr);max-width:640px;justify-self:center}
 #lightbox .viewer-photo-info{width:100%}
 #lightbox .viewer-filmstrip{margin-inline:36px}
 #lightbox .viewer-owner-tools{margin-top:8px}
}
@media(max-width:850px){
 #lightbox .viewer-layout.comments-open{display:flex;flex-direction:column;gap:0;overflow:auto}
 #lightbox .comments-open>.lightbox-header{position:sticky;top:0;z-index:5;background:var(--warm-dark);flex-shrink:0}
 #lightbox .comments-open>.lightbox-stage{flex:0 0 auto;height:40svh;min-height:200px;width:100%;padding:14px 0}
 #lightbox .comments-open>.lightbox-footer{flex:0 0 auto;width:100%;padding:16px 0 20px;max-height:none;overflow:visible}
 #lightbox .comments-open>.photo-comments-panel{flex:0 0 auto;max-height:none;width:100%;overflow:visible;padding:20px 0 28px;border-left:0;border-top:1px solid var(--viewer-border)}
}
@media(max-width:600px){
 #lightbox .viewer-layout{grid-template-rows:58px minmax(220px,1fr) 58px auto;padding-inline:max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-right))}
 #lightbox .lightbox-header{height:58px;min-height:58px;gap:12px}
 #lightbox .lightbox-brand{font-size:9px;letter-spacing:.02em;max-width:120px}
 #lightbox .lightbox-header-actions{gap:6px}
 #lightbox .studio-share-button{max-width:112px;padding:8px 11px;font-size:10px!important}
 #lightbox .fullscreen-button{width:44px;padding:0}
 #lightbox #fullscreen-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 #lightbox .lightbox-stage{min-height:220px;padding:10px 0;gap:0}
 #lightbox .lightbox-stage>img{width:100%}
 #lightbox .lightbox-stage>.icon-button{position:absolute;top:50%;bottom:auto;transform:translateY(-50%);background:#211d19b8}
 #lightbox .lightbox-stage>.previous{left:4px}
 #lightbox .lightbox-stage>.next{right:4px}
 #lightbox .viewer-filmstrip{margin:0;height:58px;max-height:58px;padding:6px 2px;gap:6px}
 #lightbox .viewer-thumb{width:54px;flex-basis:54px;height:44px}
 #lightbox .lightbox-footer{margin:0;padding:14px 0 max(18px,env(safe-area-inset-bottom));gap:14px}
 #lightbox .lightbox-footer h2{font-size:27px}
 #lightbox .lightbox-footer #lightbox-category{font-size:10px;margin-top:5px}
 #lightbox .lightbox-bottom-right{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:10px}
 #lightbox .viewer-playback-controls{grid-column:1;grid-row:1;gap:16px}
 #lightbox .slideshow-speed--viewer select{font-size:16px;width:88px}
 #lightbox .viewer-reaction-controls{grid-column:1;grid-row:2;gap:10px}
 #lightbox .lightbox-reactions{gap:10px}
 #lightbox .viewer-reaction-controls :is(.photo-like-button,.photo-comment-button){min-width:78px}
 #lightbox .photo-purchase-actions{grid-column:1;grid-row:3;flex-direction:row;gap:10px;margin-top:4px}
 #lightbox .photo-purchase-actions>a{flex:1 1 0;min-height:48px;font-size:11px;padding:9px 10px}
 #lightbox .viewer-owner-tools{gap:8px}
 #lightbox .viewer-owner-tools>button{font-size:10px;padding:8px 10px}
}
/* Landscape phones keep the photograph large and the controls in a side rail. */
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
 #lightbox .viewer-layout:not(.comments-open){grid-template-columns:minmax(0,1fr) minmax(230px,30%);grid-template-rows:52px minmax(120px,1fr) 56px;column-gap:20px;overflow:hidden;padding-inline:max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-right))}
 #lightbox .lightbox-header{height:52px;min-height:52px}
 #lightbox .lightbox-stage{grid-row:2;min-height:120px;padding:8px 0}
 #lightbox .lightbox-stage>img{width:100%}
 #lightbox .lightbox-stage>.icon-button{position:absolute;top:50%;bottom:auto;transform:translateY(-50%);background:#211d19b8}
 #lightbox .lightbox-stage>.previous{left:4px}
 #lightbox .lightbox-stage>.next{right:4px}
 #lightbox .viewer-filmstrip{grid-column:1;grid-row:3;margin:0;height:56px;max-height:56px;padding:6px 2px}
 #lightbox .viewer-layout:not(.comments-open)>.lightbox-footer{grid-column:2;grid-row:2/4;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-height:0;max-height:100%;gap:14px;margin:0;padding:14px 0 18px;border:0;overflow:auto}
 #lightbox .lightbox-footer h2{font-size:25px}
 #lightbox .lightbox-bottom-right{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:10px}
 #lightbox .viewer-playback-controls{grid-column:1;grid-row:1;gap:12px}
 #lightbox .viewer-reaction-controls{grid-column:1;grid-row:2}
 #lightbox .photo-purchase-actions{grid-column:1;grid-row:3;flex-direction:column;gap:8px}
 #lightbox .viewer-owner-tools>button{font-size:10px;padding-inline:9px}
 #lightbox .slideshow-speed--viewer select{font-size:16px;width:86px}
 #lightbox .viewer-layout.comments-open{display:flex;overflow:auto}
}

/* Give the opened photograph more space; the actions remain below it. */
body #lightbox .viewer-layout:not(.comments-open){grid-template-rows:58px minmax(62svh,1fr) 60px auto}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-header{position:sticky;top:0;z-index:6;height:58px;min-height:58px;background:var(--warm-dark,#242018)}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage{min-height:0;gap:0;padding:10px 0;justify-content:center}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>img{width:100%;height:100%;object-fit:contain}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>.icon-button{position:absolute;top:50%;bottom:auto;transform:translateY(-50%);z-index:2;background:#242018cc;border-color:#c5af8b70}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>.previous{left:8px}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>.next{right:8px}
body #lightbox .viewer-layout:not(.comments-open)>.viewer-filmstrip{margin-inline:0;height:60px;max-height:60px;padding-block:5px}
@media(max-width:600px){
 body #lightbox .viewer-layout:not(.comments-open){grid-template-rows:58px max-content 58px auto;padding-inline:max(8px,env(safe-area-inset-left)) max(8px,env(safe-area-inset-right))}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage{display:block;padding:8px 0}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>img{width:100%;height:auto;max-height:72svh;object-fit:contain}
 body #lightbox .viewer-layout:not(.comments-open)>.viewer-filmstrip{height:58px;max-height:58px;padding-block:6px}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>.previous{left:4px}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>.next{right:4px}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
 body #lightbox .viewer-layout:not(.comments-open){grid-template-columns:minmax(0,1fr) minmax(210px,27%);grid-template-rows:52px minmax(0,1fr) 52px;column-gap:12px;padding-inline:max(10px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-right))}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-header{height:52px;min-height:52px}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage{display:flex;padding:6px 0}
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-stage>img{height:100%;max-height:100%}
 body #lightbox .viewer-layout:not(.comments-open)>.viewer-filmstrip{height:52px;max-height:52px;padding-block:4px}
}
