/* Equal control zones keep the photograph, reactions and navigation balanced. */
body #lightbox .lightbox-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px}
body #lightbox .lightbox-header>#photo-share{justify-self:start;width:100px;height:40px;min-height:40px;font-size:11px;padding:5px 8px}
body #lightbox .lightbox-header>.lightbox-brand{justify-self:center;text-align:center;font-size:10px}
body #lightbox .lightbox-header-actions{justify-self:end;gap:8px}
body #lightbox .lightbox-header-actions .fullscreen-button{width:112px;height:40px;min-height:40px;padding:5px 8px}
body #lightbox .lightbox-header-actions .close{width:46px;height:40px;min-height:40px;padding:0;font-size:21px!important}
body #lightbox #fullscreen-label::after{content:' · F';font-size:10px}
body #lightbox .lightbox-header .close::after{content:'Esc';font:9px/1 var(--sans);margin-left:3px}
body #lightbox .viewer-layout:not(.comments-open)>.lightbox-footer{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:6px 0}
body #lightbox .viewer-photo-info{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;width:100%}
body #lightbox .viewer-owner-tools{width:100%;text-align:start}
body #lightbox .lightbox-bottom-right{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:44px;align-items:center;gap:12px;width:100%;max-width:none;direction:ltr}
body #lightbox .viewer-playback-controls{grid-column:1;grid-row:1;justify-content:flex-start;gap:6px;width:100%;min-width:0}
body #lightbox #lightbox-count{font-size:9px;min-width:0}
body #lightbox .lightbox-playback{height:44px;min-height:44px;min-width:60px;width:auto;padding:5px 8px;font-size:11px}
body #lightbox .lightbox-playback .control-label::after{content:' · ␣';font-size:10px}
body #lightbox .slideshow-speed--viewer select{height:44px;min-height:44px;width:88px;min-width:88px;padding:5px;font-size:12px;flex-shrink:0}
body #lightbox .viewer-reaction-controls{grid-column:2;grid-row:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-content:center;gap:5px;width:100%;min-width:0}
body #lightbox .lightbox-reactions{display:contents}
body #lightbox .lightbox-reactions>span{min-width:0;width:100%}
body #lightbox .viewer-reaction-controls .favorite-photo{grid-column:1;grid-row:1}
body #lightbox #lightbox-like{grid-column:2;grid-row:1}
body #lightbox #lightbox-comments{grid-column:3;grid-row:1}
body #lightbox .viewer-reaction-controls :is(.favorite-photo,.photo-like-button,.photo-comment-button){width:100%;min-width:0;height:44px;min-height:44px;margin:0;padding:5px 6px;border-radius:11px;font-size:11px;gap:4px;justify-content:center}
body #lightbox .photo-purchase-actions{grid-column:3;grid-row:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:100%;padding:0;margin:0}
body #lightbox .photo-purchase-actions>a{width:100%;height:44px;min-height:44px;padding:5px 7px;font-size:11px;line-height:1.25;text-align:center;white-space:normal}
@media(max-width:1000px){
 body #lightbox .lightbox-playback{width:44px;min-width:44px}
 body #lightbox .lightbox-playback .control-label{display:none}
 body #lightbox :is(.photo-like-label,.photo-comment-label){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
@media(max-width:700px){
 body #lightbox .lightbox-bottom-right{grid-template-columns:136px minmax(0,1fr);grid-template-rows:44px 44px;gap:6px 10px}
 body #lightbox .viewer-reaction-controls{grid-column:1/-1;grid-row:1;grid-template-columns:repeat(3,minmax(0,1fr))}
 body #lightbox .viewer-playback-controls{grid-column:1;grid-row:2;gap:4px}
 body #lightbox #lightbox-count{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 body #lightbox .photo-purchase-actions{grid-column:2;grid-row:2}
 body #lightbox .slideshow-speed--viewer select{font-size:16px}
 body #lightbox .lightbox-header{grid-template-columns:repeat(2,minmax(0,1fr))}
 body #lightbox .lightbox-header>.lightbox-brand{display:none}
 body #lightbox :is(.photo-like-label,.photo-comment-label){position:static;width:auto;height:auto;overflow:visible;clip-path:none;font-size:11px}
}
@media(max-width:360px){body #lightbox .photo-purchase-actions>a{font-size:10px;padding-inline:3px}}
@media(orientation:landscape) and (max-height:600px){
 body #lightbox .viewer-layout:not(.comments-open)>.lightbox-footer{display:flex;flex-direction:column;align-items:stretch;gap:7px;padding:4px 0}
 body #lightbox .lightbox-bottom-right{grid-template-columns:minmax(0,1fr);grid-template-rows:44px 44px 44px;gap:5px}
 body #lightbox .viewer-playback-controls{grid-column:1;grid-row:1;justify-content:flex-start}
 body #lightbox .viewer-reaction-controls{grid-column:1;grid-row:2}
 body #lightbox .photo-purchase-actions{grid-column:1;grid-row:3}
 body #lightbox .photo-purchase-actions>a{font-size:10px}
}
body #lightbox .viewer-playback-controls>.lightbox-playback{order:1}
body #lightbox .viewer-playback-controls>.slideshow-speed{order:2}
body #lightbox .viewer-playback-controls>#lightbox-count{order:3}
@media(min-width:1001px){body #lightbox .lightbox-playback{min-width:92px}}
body #lightbox #photo-inquiry{background:#e9d6bb;border-color:#c6a97d;color:#4d3824}
body #lightbox :is(#previous-photo,#next-photo){background:#e8d6bce8;color:#543c27;border-color:#b59b75}

body #lightbox .viewer-keyboard-help{grid-column:1/-1;margin:0;text-align:center;font:9px/1.5 var(--sans);color:#c9b99f}
body #lightbox .viewer-keyboard-help kbd{font:inherit;color:#f1dfc5;border:1px solid #6f5d46;border-radius:3px;padding:0 3px;white-space:nowrap}
@media(hover:none),(max-width:480px){body #lightbox .viewer-keyboard-help{display:none}}

/* A browser-embedded preview may refuse native fullscreen; keep F useful there. */
body #lightbox .viewer-layout.is-immersive:not(.comments-open){display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:44px minmax(0,1fr);padding-inline:8px}
body #lightbox .viewer-layout.is-immersive>.lightbox-header{grid-column:1;grid-row:1}
body #lightbox .viewer-layout.is-immersive>.lightbox-stage{grid-column:1;grid-row:2;padding:0}
body #lightbox .viewer-layout.is-immersive>:is(.viewer-filmstrip,.lightbox-footer){display:none}
