/* Additive phone pass. Desktop matrix and per-mode Size/Spacing ownership stay unchanged. */
.phone-only{display:none}
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout{--phone-panel-top:calc(var(--common-height) + 6px)}
 .phone-layout .phone-only:not([hidden]){display:flex}
 .phone-layout body>footer{position:fixed!important;inset:auto 0 0!important;display:flex!important;flex-direction:column;gap:0;padding:0 8px env(safe-area-inset-bottom)!important;background:var(--aiml-paper,#faf9f5);z-index:60}
 .phone-layout body>footer .collection-status{position:static!important;order:2;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:2px 8px;width:100%;min-width:0;max-width:none;flex:none;padding:0;min-height:32px}
 .phone-layout .collection-status :is(#match-count,#status-caption,#mode-caption){font-size:10px;line-height:14px;margin:0}
 .phone-layout .collection-status #build-badge{margin-left:auto;font-size:10px;min-height:32px;padding:4px;max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .phone-layout #phone-map-bar,.phone-layout #phone-viewer-bar{gap:4px;align-items:center;min-height:48px;width:100%}
 .phone-layout #phone-map-bar{padding-right:136px;box-sizing:border-box}
 .phone-layout #phone-map-bar>button{flex:1;white-space:nowrap}
 .phone-layout #phone-browse-toggle{order:2}
 .phone-layout #phone-browse-sheet{position:fixed;inset:var(--phone-panel-top) 8px var(--phone-footer-height,84px);flex-direction:column;overflow:auto;overscroll-behavior:contain;padding:10px;border:1px solid #888;background:var(--aiml-paper,#faf9f5);box-shadow:0 4px 20px #0004}
 .phone-layout #phone-browse-sheet[hidden]{display:none!important}
 .phone-layout #lab-controls{position:static!important;inset:auto!important;flex:none;border:0}
 .phone-layout #gesture-hint{display:none!important}
 .phone-layout #lab-controls #filter-panel{padding:0!important}
 .phone-layout #lab-controls #filter-strips{display:flex;flex-direction:column;overflow:visible;min-height:0;padding:0;gap:8px}
 .phone-layout #lab-controls :is(#general-filters,#cluster-scroll,#cluster-buttons){width:100%;min-width:0;height:auto;flex:none;max-width:none;overflow:visible}
 .phone-layout #lab-controls :is(#general-filters,#cluster-buttons,#aspect-buttons,#media-buttons){display:flex;flex-wrap:wrap;justify-content:flex-start;gap:4px}
 html.phone-layout #lab-controls #filter-panel .diagonal,html.phone-layout #lab-controls #cluster-buttons button{transform:none!important;min-height:44px!important;height:auto!important;padding:8px!important;width:auto!important;flex:0 1 auto}
 .phone-layout body>footer #navigation-controls{display:flex!important;width:100%;max-width:none;flex:none;overflow:visible;margin:10px 0 0;padding:0;gap:8px}
 .phone-layout .lab-browse-row{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:0!important}
 .phone-layout .lab-browse-row>.lab-mode-group{display:flex}
 .phone-layout body>footer #navigation-controls .lab-mode-group #views{display:flex!important;flex-wrap:wrap;width:100%;gap:4px}
 .phone-layout body>footer #navigation-controls .lab-mode-group #views button{width:auto;flex:1 0 90px}
 .phone-layout .lab-linear-actions{display:flex;flex-wrap:wrap;width:100%;gap:4px}
 .phone-layout .lab-five-tools{display:flex;flex-wrap:wrap;width:100%;max-width:none}
 .phone-layout .lab-browse-row>.search-field{flex:auto;min-height:44px;width:100%;max-width:none}
 .phone-layout .lab-browse-row>.header-right{flex-wrap:wrap}
 html.phone-layout body :is(#phone-map-bar,#phone-viewer-bar,#navigation-controls,#image-viewer-footer,#settings-panel,#inspector,#full-info) :is(button,a){min-height:44px!important;height:auto!important;max-height:none!important;min-width:44px!important}
 .phone-layout :is(.random-pool,.full-random-pool) label{min-height:44px;display:inline-flex;align-items:center;padding:0 6px}
 .phone-layout input[type=search]{font-size:16px!important}
 /* Future per-mode Size/Spacing controls can use this container without new phone logic. */
 .phone-layout :is(.mode-size-spacing,[data-mode-sizing],#mode-sizing-controls){display:flex;flex-wrap:wrap;gap:8px;min-width:0}
 .phone-layout :is(.mode-size-spacing,[data-mode-sizing],#mode-sizing-controls) input[type=range]{min-height:44px;max-width:100%}
 html.phone-layout #full-view{height:100dvh!important;box-sizing:border-box;overflow:hidden}
 html.phone-layout #full-view .full-body{flex:1 1 0;min-height:80px!important}
 html.phone-layout #full-view #full-content{height:100%!important;min-height:0!important}
 .phone-layout #full-view #image-viewer-footer{flex:none;max-height:min(45dvh,calc(100dvh - var(--common-height) - 96px));overflow:auto;padding:0 8px env(safe-area-inset-bottom)}
 .phone-layout #phone-viewer-bar{position:sticky;top:0;background:var(--aiml-paper,#faf9f5);z-index:2;justify-content:space-between}
 .phone-layout #phone-viewer-more{order:4}
 html.phone-layout #full-view #phone-viewer-bar :is(#full-prev,#full-next){width:auto;flex:1;max-width:none}
 .phone-layout #full-view:not(.phone-details-open) :is(.full-toolbar,.full-description,#full-prompt-overlay,#full-related,#full-video-prompt){display:none!important}
 .phone-layout #full-view .full-toolbar{padding:4px 0!important;min-height:0!important}
 .phone-layout #full-view .full-actions{display:flex;flex-wrap:wrap;gap:4px}
 html.phone-layout #full-view #image-viewer-footer #full-prompt-overlay{max-height:64px;padding:6px 0}
 .phone-layout #full-view .full-description{max-height:32px;overflow:auto;padding:0}
 .phone-layout #full-view #full-related{height:72px!important;flex:0 0 72px}
 .phone-layout #full-view #full-related-items{height:60px!important}
 .phone-layout #full-view #full-related .related-thumb{height:56px!important;flex:0 0 auto}
 .phone-layout #full-view #full-video-prompt{max-height:64px;overflow:auto}
 /* Panels use viewport space, independent of map/footer geometry. */
 html.phone-layout[data-theme] body :is(#inspector,#settings-panel,#full-view #full-info){left:var(--info-panel-x)!important;top:var(--info-panel-y)!important;width:var(--info-width)!important;max-width:calc(100vw - 16px)!important;height:var(--info-height)!important;max-height:var(--info-height)!important;z-index:160}
 html.phone-layout[data-theme] body :is(#inspector,#settings-panel,#full-view #full-info).folded{height:44px!important;min-height:44px!important;max-height:44px!important;padding:0!important}
 html.phone-layout[data-theme] body :is(#inspector .inspector-top,#settings-panel .settings-title,#full-view #full-info .inspector-top){position:relative!important;inset:auto!important;width:100%!important;height:44px!important;min-height:44px!important;touch-action:auto}
 html.phone-layout[data-theme] body :is(#inspector #fold-inspector:not(.panel-window-action),#settings-panel #close-settings:not(.panel-window-action),#full-view #full-info-close:not(.panel-window-action)){position:absolute!important;inset:0 0 auto auto!important;height:44px!important;min-height:44px!important;max-height:none!important;touch-action:auto}
 html.phone-layout[data-theme] body :is(#inspector #inspector-content,#settings-panel .panel-scroll,#full-view #full-info .panel-scroll){top:44px!important;bottom:0!important;height:auto!important;max-height:none!important;overflow:auto;overscroll-behavior:contain}
 .phone-layout :is(.panel-drag-grip,.panel-height-grip){display:none!important}
 /* Sound stays in a reserved bar slot, including the dialog top layer. */
 html.phone-layout.immersive #full-view .full-body{min-height:0!important}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout #mode-sizing-controls{flex:1 1 100%;width:100%;height:auto;margin:0}
 .phone-layout #mode-sizing-controls label{width:auto;flex:1;min-width:100px}
 .phone-layout #mode-sizing-controls input{width:100%}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout #help-panel{top:calc(var(--common-height) + 6px)!important;bottom:90px!important;max-height:calc(100dvh - var(--common-height) - 96px)!important;overflow:auto}
 .phone-layout #full-view #full-related{order:0}
}
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout .aiml-common-header.menu-open{z-index:200}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout #date-navigation{bottom:calc(var(--phone-footer-height,84px) + 8px)!important;left:8px;right:8px;max-height:92px;overflow:auto}
 .phone-layout #date-navigation button{min-height:44px}
}

/* Visible portrait essentials; these are the existing stateful controls. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout #phone-map-core{flex-direction:column;gap:2px;order:-1;padding:3px 0;width:100%}
 .phone-layout #phone-map-nav{display:flex;gap:4px;align-items:center}
 .phone-layout #phone-map-nav .lab-five-tools{display:flex;width:auto;flex:1;gap:3px}
 .phone-layout #phone-map-nav #fit-view{flex:0 0 48px}
 .phone-layout #phone-map-nav button{min-height:44px!important;min-width:44px!important;flex:1;padding:4px!important}
 .phone-layout #phone-map-core #mode-sizing-controls{flex:none;min-height:58px;gap:12px}
 .phone-layout #phone-viewer-core{gap:4px;align-items:center;flex-wrap:wrap;padding:2px 0}
 .phone-layout #phone-viewer-core label{display:flex;flex-direction:column;flex:1;min-width:90px;font-size:11px}
 .phone-layout #phone-thumb-size{width:100%;min-height:32px;margin:0}
 .phone-layout #phone-viewer-core button{min-height:44px!important;min-width:44px!important;padding:4px!important}
 .phone-layout #phone-viewer-core #full-related-toggle{font-size:0}
 .phone-layout #phone-viewer-core #full-related-toggle::after{content:'Thumbs';font-size:11px}
 html.phone-layout #full-view #full-related:not([hidden]){display:block!important;height:var(--related-height,100px)!important;flex:0 0 var(--related-height,100px)}
 html.phone-layout #full-view #full-related-items{height:calc(var(--related-height,100px) - 12px)!important}
 html.phone-layout #full-view #full-related .related-thumb{height:calc(var(--related-height,100px) - 32px)!important;flex:none!important}
}

/* Compact phone status and controls; retain 44px action targets. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer .collection-status{flex-wrap:nowrap;gap:5px;min-height:32px;align-items:center}
 html.phone-layout .collection-status #match-count{display:none}
 html.phone-layout .collection-status #status-caption{display:flex;flex-flow:row nowrap;gap:7px;white-space:nowrap;flex:none;font-size:11px;line-height:16px}
 html.phone-layout #status-caption .media-count-line{display:inline;white-space:nowrap}
 html.phone-layout .collection-status #build-badge{flex:none;max-width:none;margin-left:auto!important;padding:3px 0;font-size:10px;white-space:nowrap}
 html.phone-layout .collection-status #mode-caption{display:none}
 .phone-layout #phone-viewer-core{gap:3px;flex-wrap:nowrap}
 .phone-layout #phone-viewer-core label{min-width:64px;flex:1;font-size:11px}
 .phone-layout #phone-viewer-core button{font-size:11px!important;padding:3px!important;flex:none}
 .phone-layout #phone-viewer-core #full-fit{min-width:58px!important}
 .phone-layout #phone-viewer-bar{gap:3px}
 .phone-layout #phone-viewer-bar button{font-size:11px!important;padding:4px!important}
 .phone-layout #phone-browse-sheet{padding:6px;gap:4px}
 .phone-layout #phone-browse-sheet .lab-browse-row{gap:4px}
 .phone-layout #phone-browse-sheet .header-right{display:flex;gap:3px;justify-content:flex-start}
 .phone-layout #phone-browse-sheet .favorite-access{display:flex;gap:3px}
 .phone-layout #phone-browse-sheet button{font-size:11px!important;padding:4px 6px!important}
 .phone-layout body>footer #navigation-controls .lab-mode-group #views{gap:3px}
 .phone-layout body>footer #navigation-controls .lab-mode-group #views button{flex:1 0 80px;padding:4px!important}
}

@media(max-width:350px){.phone-layout #phone-viewer-core{gap:2px}.phone-layout #phone-viewer-core label{min-width:54px}.phone-layout #phone-viewer-core #full-fit{min-width:54px!important}}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout #phone-map-bar{padding-right:0}
 .phone-layout #phone-categories-toggle{order:3}
 .phone-layout #phone-map-bar button{font-size:11px!important;padding:4px!important;min-height:44px}
 .phone-layout #phone-browse-sheet.categories-only #navigation-controls{display:none!important}
 html.phone-layout body>footer .collection-status{min-height:44px;gap:4px}
 html.phone-layout .collection-status #status-caption{gap:5px;font-size:10px}
 html.phone-layout .collection-status #build-badge{order:3;font-size:0;min-width:36px;min-height:44px}
 html.phone-layout .collection-status #build-badge::after{content:attr(data-phone-version);font-size:11px}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){html.phone-layout #phone-viewer-core #full-related-toggle{font-size:0!important;min-width:44px!important;width:44px}}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout .collection-status #match-count{display:inline;flex:none;white-space:nowrap;font-size:10px}
 html.phone-layout body>footer .collection-status{gap:2px}
 html.phone-layout .collection-status #status-caption{gap:4px}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 .phone-layout #phone-map-core #mode-sizing-controls.has-elevation{width:100%;flex-basis:auto;gap:8px}
 .phone-layout #phone-map-core #mode-sizing-controls.has-elevation label{width:auto;min-width:0;flex:1}
 .phone-layout #phone-map-core #mode-sizing-controls.has-elevation input{width:100%;min-height:44px}
 .phone-layout #mode-sizing-controls input[type=range]::-webkit-slider-thumb{width:16px;height:16px;margin-top:-6.5px}
}

/* Artwork gestures never capture the filmstrip or toolbar, and do not limit page zoom. */
#full-content:has(> #full-image:not([hidden])),#full-image,#full-video-stage{touch-action:none}
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #full-view #image-viewer-footer{max-height:52dvh;padding-top:4px}
 html.phone-layout #phone-viewer-bar{display:grid!important;grid-template-columns:44px 44px 44px minmax(68px,1fr) 44px 44px;gap:3px;min-height:44px;position:relative}
 html.phone-layout #full-view #phone-viewer-bar>button{width:100%!important;max-width:none!important;margin:0;min-height:44px!important;line-height:1.15;white-space:normal}
 html.phone-layout #full-view #phone-viewer-bar #full-still-play[hidden]{display:block!important}
 html.phone-layout #phone-viewer-core{display:grid!important;grid-template-columns:repeat(6,minmax(44px,1fr));gap:3px;padding:3px 0;align-items:center}
 html.phone-layout #phone-viewer-core>button,html.phone-layout #phone-viewer-core>a,html.phone-layout #phone-viewer-core .favorite-access>button{width:100%!important;min-width:44px!important;min-height:44px!important;padding:3px!important;margin:0;font-size:11px!important;line-height:1.15;white-space:normal;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center}
 html.phone-layout #phone-viewer-core .favorite-access{display:contents}
 html.phone-layout #phone-viewer-core .favorite-toggle{font-size:22px!important}
 html.phone-layout #phone-viewer-core .phone-thumb-control{grid-column:span 2;min-width:0;width:100%;height:44px;display:flex;flex-direction:column;font-size:10px;gap:0}
 html.phone-layout #phone-thumb-size{min-height:30px;height:30px;margin:0;width:100%}
 html.phone-layout #phone-viewer-core .full-random-pool{grid-column:span 4;display:flex;flex-direction:row;justify-content:flex-end;gap:4px}
 html.phone-layout #phone-viewer-core .full-random-pool label{font-size:11px;min-height:44px;padding:0 4px;gap:3px}
 html.phone-layout #phone-viewer-more{order:0}
 html.phone-layout #full-view :is(#phone-viewer-bar,#phone-viewer-core) [data-phone-caption]{font-size:0!important}
 html.phone-layout #full-view :is(#phone-viewer-bar,#phone-viewer-core) [data-phone-caption]::after{content:attr(data-phone-caption);font-size:11px}
 html.phone-layout #phone-viewer-bar :is(#full-prev,#full-next,#full-fullscreen)::after{font-size:20px!important}
 html.phone-layout #phone-viewer-core #full-related-toggle{width:100%!important}
 html.phone-layout #full-view .full-toolbar:has(.full-actions:empty){display:none!important}
 html.phone-layout #full-view #video-transport{gap:4px;padding:4px 6px;flex-wrap:wrap}
 html.phone-layout #full-view #video-transport button{min-height:44px;min-width:44px;padding:4px}
 html.phone-layout #full-view #video-time{font-size:10px}
 html.phone-layout #full-view #video-transport>span{font-size:10px}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){html.phone-layout #full-view :is(#phone-viewer-bar,#phone-viewer-core) [data-phone-caption]::before{display:none!important}}

/* Phone viewer: image, Related, complete metadata, then familiar controls in document flow. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout:not(.immersive) #full-view{overflow-y:auto!important;overflow-x:hidden!important;display:flex;flex-direction:column;overscroll-behavior:contain}
 html.phone-layout:not(.immersive) #full-view:not([open]){display:none!important}
 html.phone-layout:not(.immersive) #full-view .full-body{height:clamp(220px,42dvh,440px)!important;min-height:clamp(220px,42dvh,440px)!important;flex:0 0 auto!important;order:1}
 html.phone-layout:not(.immersive) #full-view>#full-related{order:2;flex-shrink:0!important;width:100%}
 html.phone-layout:not(.immersive) #full-view #image-viewer-footer{display:flex;flex-direction:column;max-height:none!important;overflow:visible!important;flex:none;padding:0 8px 8px}
 html.phone-layout:not(.immersive) #full-view #image-viewer-footer #full-prompt-overlay{display:block!important;order:0;max-height:none!important;height:auto!important;overflow:visible!important;padding:8px 0!important;flex:none}
 html.phone-layout:not(.immersive) #full-view #full-overlay-text{max-height:none!important;overflow:visible!important;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.45;font-size:13px;display:block;-webkit-line-clamp:unset}
 html.phone-layout:not(.immersive) #full-view .full-description{display:flex!important;flex-wrap:wrap;gap:4px 10px;order:1;max-height:none!important;overflow:visible!important;padding:6px 0;flex:none;font-size:11px;overflow-wrap:anywhere}
 html.phone-layout:not(.immersive) #full-view .full-description>*{white-space:normal!important;max-height:none!important;overflow:visible!important;text-overflow:clip!important}
 html.phone-layout #phone-viewer-bar{order:2}
 html.phone-layout #phone-viewer-core{order:3}
 html.phone-layout #full-view :is(#full-out,#full-in,#full-prompt,#phone-viewer-more,#full-video-prompt){display:none!important}
 html.phone-layout #full-view .full-toolbar{display:none!important}
 html.phone-layout #phone-viewer-core .full-random-pool{grid-column:span 2}
 html.phone-layout #phone-viewer-core .full-random-pool label{padding:0;gap:2px;font-size:10px}
 html.phone-layout #phone-viewer-core #full-download::after{font-size:10px}
 html.phone-layout #phone-viewer-core #full-related-toggle::after{content:'Related'}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout:not(.immersive) #full-view{height:100dvh!important;max-height:100dvh!important}
 html.phone-layout:not(.immersive) #full-view #image-viewer-footer .full-description{display:flex!important}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){html.phone-layout:not(.immersive) #full-view #image-viewer-footer .full-description>*{margin:0!important;font-size:11px;line-height:1.35}}

/* Main phone map controls stay visible; Categories is the only flags disclosure. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #phone-browse-toggle{display:none!important}
 html.phone-layout #phone-map-options{display:block;width:100%;order:0}
 html.phone-layout #phone-map-bar{order:1}
 html.phone-layout #phone-map-options #navigation-controls{margin:0!important;padding:0!important;gap:3px!important}
 html.phone-layout #phone-map-options .lab-browse-row{gap:3px}
 html.phone-layout #phone-map-options #views{display:flex!important;flex-wrap:nowrap!important;gap:3px!important}
 html.phone-layout #phone-map-options #views button{flex:1 1 0!important;min-width:44px!important;min-height:44px!important;padding:3px!important;font-size:11px!important;white-space:normal!important}
 html.phone-layout #phone-map-options .lab-linear-actions{gap:3px;justify-content:flex-start}
 html.phone-layout #phone-map-options :is(button,a){min-height:44px!important;min-width:44px!important;padding:3px 5px!important;font-size:11px!important}
 html.phone-layout #phone-map-options .search-field{min-height:44px!important}
 html.phone-layout #phone-map-options .header-right{display:flex;gap:3px;align-items:center;justify-content:space-between}
 html.phone-layout #phone-map-options .favorite-access{display:flex;gap:3px}
 html.phone-layout #phone-map-options .random-pool{flex-direction:row;gap:3px}
 html.phone-layout #phone-map-options .random-pool label{padding:0 3px;font-size:11px}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #phone-map-options #zoom-to-image{width:58px!important;white-space:normal;line-height:1.15}
 html.phone-layout #phone-map-options #fit-set{width:44px!important;padding:3px!important}
 html.phone-layout #phone-map-options #random{width:50px!important;padding:3px!important}
 html.phone-layout #phone-map-options .random-pool{width:94px;flex:none;gap:2px}
 html.phone-layout #phone-map-options .random-pool label{width:46px;min-width:44px;font-size:10px;padding:0;gap:1px}
 html.phone-layout #phone-map-options .random-pool input{margin:0;width:12px;height:12px;flex:none}
 html.phone-layout #phone-map-options #map-fullscreen{font-size:0!important}
 html.phone-layout #phone-map-options #map-fullscreen::after{content:'⛶';font-size:20px}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #phone-map-options .header-right{gap:2px}
 html.phone-layout #phone-map-options .header-right button{padding:3px!important}
 html.phone-layout #phone-map-core:has(#mode-sizing-controls:not(.has-elevation)){flex-direction:row;align-items:center;gap:6px}
 html.phone-layout #phone-map-core:has(#mode-sizing-controls:not(.has-elevation)) #phone-map-nav{flex:0 0 138px;width:138px;gap:3px}
 html.phone-layout #phone-map-core:has(#mode-sizing-controls:not(.has-elevation)) #phone-map-nav #fit-view{flex:0 0 44px}
 html.phone-layout #phone-map-core #mode-sizing-controls:not(.has-elevation){flex:1;min-width:0;min-height:58px;width:auto;gap:6px}
 html.phone-layout #phone-map-core #mode-sizing-controls:not(.has-elevation) label{min-width:0;flex:1;width:0}
 html.phone-layout #phone-map-options .lab-linear-actions{flex-wrap:nowrap}
}

/* One phone command group, in desktop order; search occupies a button, not a row. */
#phone-search-dialog:not([open]){display:none}
#phone-search-dialog{box-sizing:border-box;position:fixed;inset:12px 8px auto;margin:0 auto;width:calc(100% - 16px);max-width:440px;max-height:calc(100dvh - 24px);overflow:auto;padding:12px;border:1px solid #888;border-radius:6px;background:var(--aiml-paper,#faf9f5);color:var(--aiml-ink,#222)}
#phone-search-dialog::backdrop{background:#0005}
#phone-search-dialog h2{font-size:16px;margin:0 0 8px}
#phone-search-dialog .search-field{display:flex;width:100%;max-width:none;min-height:44px;box-sizing:border-box}
#phone-search-dialog input{width:100%;min-width:0;font-size:16px}
#phone-search-dialog .phone-search-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
#phone-search-dialog button{min-width:52px;min-height:44px;padding:4px 8px}
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #phone-map-options .lab-linear-actions{display:flex;flex-wrap:wrap!important;gap:2px!important;justify-content:flex-start;align-items:center}
 html.phone-layout #phone-map-options .lab-linear-actions .header-right{display:contents!important}
 html.phone-layout #phone-map-options .favorite-access{display:flex!important;gap:2px;flex:none}
 html.phone-layout #phone-map-options .lab-linear-actions button{flex:0 0 auto!important;margin:0!important;padding:2px 4px!important;min-height:44px!important;min-width:44px!important;font-size:11px!important}
 html.phone-layout #phone-map-options .lab-linear-actions #phone-search-toggle{font-size:22px!important;width:44px}
 html.phone-layout #phone-map-options .lab-linear-actions #phone-search-toggle.active{background:#555;color:white}
 html.phone-layout #phone-map-options #navigation-controls{gap:2px!important}
 html.phone-layout #phone-map-options .lab-browse-row{order:-1}
 html.phone-layout #phone-map-options .lab-utility-row{width:100%;padding:0!important;gap:0!important}
 html.phone-layout #phone-map-options .lab-linear-actions #map-info{font-size:0!important}
 html.phone-layout #phone-map-options .lab-linear-actions #map-info::after{content:'ⓘ';font-size:20px}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){html.phone-layout #phone-map-options .lab-linear-actions #map-info::before{display:none!important}}

/* Explicit five-row map footer. Viewer and desktop keep their own layouts. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer{gap:3px!important}
 html.phone-layout body>footer :is(#phone-map-options,#navigation-controls,#phone-map-core,.lab-browse-row,.lab-utility-row){display:contents!important}
 html.phone-layout body>footer .lab-mode-group{order:0;width:100%;margin:0!important}
 html.phone-layout body>footer #phone-map-nav{order:1;display:flex!important;flex:0 0 auto!important;width:100%!important;gap:3px;min-height:44px}
 html.phone-layout body>footer #phone-map-nav .lab-five-tools{display:flex;flex:0 1 auto;width:auto;gap:3px}
 html.phone-layout body>footer #phone-map-nav button{min-width:44px!important;min-height:44px!important;padding:3px 6px!important}
 html.phone-layout body>footer #phone-map-bar{order:2;display:grid!important;grid-template-columns:1.2fr 1.15fr 1.15fr 1fr 54px;gap:3px;min-height:44px;padding:0!important;margin:0}
 html.phone-layout body>footer #phone-map-bar>button{min-width:0!important;width:100%!important;min-height:44px!important;padding:2px!important;font-size:11px!important;white-space:normal;line-height:1.15;box-sizing:border-box}
 html.phone-layout body>footer #phone-map-bar .random-pool{display:flex;flex-direction:column;width:54px;height:44px;gap:0;margin:0;justify-content:center}
 html.phone-layout body>footer #phone-map-bar .random-pool label{display:flex;align-items:center;min-height:22px;height:22px;padding:0;gap:2px;font-size:10px;line-height:1;width:54px}
 html.phone-layout body>footer #phone-map-bar .random-pool input{width:13px;height:13px;margin:0}
 html.phone-layout body>footer .lab-linear-actions{order:3;display:grid!important;grid-template-columns:1fr .8fr .7fr 1.25fr .7fr 1.1fr .8fr .7fr .7fr;gap:2px!important;width:100%;margin:0!important}
 html.phone-layout body>footer .lab-linear-actions :is(.header-right,.favorite-access){display:contents!important}
 html.phone-layout body>footer .lab-linear-actions button{min-width:0!important;width:100%!important;max-width:none!important;height:44px!important;min-height:44px!important;padding:2px!important;white-space:normal;font-size:11px!important;line-height:1.15;box-sizing:border-box}
 html.phone-layout body>footer #mode-sizing-controls{order:4;display:flex!important;flex-direction:row!important;flex:0 0 auto!important;min-height:50px!important;width:100%!important;gap:8px!important;margin:0!important}
 html.phone-layout body>footer #mode-sizing-controls label{flex:1!important;min-width:0!important;width:0!important}
 html.phone-layout body>footer #mode-sizing-controls input{width:100%!important;min-height:32px!important}
 html.phone-layout body>footer .collection-status{order:5}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer #phone-map-bar>*{order:0!important}
 html.phone-layout #phone-map-options #navigation-controls .lab-linear-actions :is(.header-right,.favorite-access){display:contents!important}
 html.phone-layout #phone-map-options #navigation-controls .lab-linear-actions button{min-width:0!important;width:100%!important;max-width:none!important;padding:2px!important;margin:0!important}
}

/* Phone Image Viewer: two explicit rows; map footer is independent. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #full-view #phone-viewer-bar{display:grid!important;grid-template-columns:minmax(0,1.5fr) minmax(0,1.5fr) minmax(54px,.8fr) 54px!important;gap:3px;position:relative}
 html.phone-layout #full-view #phone-viewer-bar>button{min-width:0!important;min-height:44px!important}
 html.phone-layout #full-view #phone-viewer-bar :is(#full-prev,#full-next)::after{font-size:12px!important}
 html.phone-layout #full-view #phone-viewer-bar .full-random-pool{display:flex!important;flex-direction:column;gap:0;height:44px;width:54px;justify-content:center}
 html.phone-layout #full-view #phone-viewer-bar .full-random-pool label{min-height:22px;height:22px;display:flex;align-items:center;gap:2px;font-size:10px;padding:0;margin:0}
 html.phone-layout #full-view #phone-viewer-bar .full-random-pool input{width:13px;height:13px;margin:0}
 html.phone-layout #full-view #phone-viewer-core{display:grid!important;grid-template-columns:1fr .8fr .7fr 1.7fr .8fr!important;gap:3px}
 html.phone-layout #full-view #phone-viewer-core>button,html.phone-layout #full-view #phone-viewer-core .favorite-access>button{min-width:0!important;width:100%!important;padding:2px!important;min-height:44px!important}
 html.phone-layout #full-view #phone-viewer-core .favorite-access{display:grid!important;grid-template-columns:32px minmax(0,1fr);gap:2px;padding:0;margin:0}
 html.phone-layout #full-view :is(#full-download,#full-scale,#full-still-play,.phone-thumb-control){display:none!important}
 html.phone-layout #full-view .full-body{position:relative}
 html.phone-layout #full-view #phone-viewer-system{display:flex;position:absolute;top:6px;left:6px;right:6px;justify-content:space-between;pointer-events:none;z-index:10}
 html.phone-layout #full-view #phone-viewer-system button{pointer-events:auto;min-width:44px;min-height:44px;padding:4px 8px;background:#444d;color:white;border:1px solid white;border-radius:3px;font-size:0}
 html.phone-layout #full-view #phone-viewer-system button::after{content:attr(data-phone-caption);font-size:14px}
 html.phone-layout #full-view #phone-viewer-system #full-fullscreen::after{font-size:22px}
 html.phone-layout:not(.immersive) #full-view>#full-related:not([hidden]){display:flex!important;height:var(--related-height,148px)!important;flex:0 0 var(--related-height,148px)!important}
 html.phone-layout:not(.immersive) #full-view>#full-related[data-cvb-stage-collapsed]:not([hidden]){display:block!important;height:12px!important;flex:0 0 12px!important;min-height:12px!important}
 html.phone-layout:not(.immersive) #full-view #full-related-items{height:calc(var(--related-height,148px) - 16px)!important}
 html.phone-layout:not(.immersive) #full-view #full-related .related-thumb{height:calc(var(--related-height,148px) - 32px)!important}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){html.phone-layout #full-view #phone-viewer-system button::before{display:none!important}}

/* Phone map utility order; Settings/Help icons share accessible names on desktop. */
#settings-toggle,#help-toggle{font-size:18px}
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer #phone-map-nav .lab-five-tools{width:100%!important;flex:1!important}
 html.phone-layout body>footer #phone-map-nav .lab-five-tools button{flex:1!important;width:0!important}
 html.phone-layout body>footer #phone-map-bar{order:3!important}
 html.phone-layout body>footer .lab-linear-actions{order:2!important;grid-template-columns:1fr 1fr 1.3fr 1fr 1.8fr 1fr 1fr 1fr 1fr 1fr!important}
 html.phone-layout #phone-map-options #navigation-controls #theme-toggle{order:0;font-size:0!important}
 html.phone-layout #phone-map-options #navigation-controls #theme-toggle::after{content:'◐';font-size:20px}
 html.phone-layout #phone-map-options #navigation-controls #fit-view{order:1}
 html.phone-layout #phone-map-options #navigation-controls #fit-set{order:2}
 html.phone-layout #phone-map-options #navigation-controls #map-favorites .favorite-toggle{order:3;font-size:20px!important}
 html.phone-layout #phone-map-options #navigation-controls #map-favorites button:not(.favorite-toggle){order:4}
 html.phone-layout #phone-map-options #navigation-controls #map-info{order:5}
 html.phone-layout #phone-map-options #navigation-controls #phone-search-toggle{order:6}
 html.phone-layout #phone-map-options #navigation-controls #map-fullscreen{order:7}
 html.phone-layout #phone-map-options #navigation-controls #settings-toggle{order:8;font-size:19px!important}
 html.phone-layout #phone-map-options #navigation-controls #help-toggle{order:9;font-size:19px!important}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){html.phone-layout #phone-map-options #navigation-controls #map-fullscreen::before{display:none!important}}

/* Requested map row swap; the phone viewer keeps its two-row structure. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer #phone-map-bar{order:2!important}
 html.phone-layout body>footer .lab-linear-actions{order:3!important}
 html.phone-layout #phone-map-options #navigation-controls #phone-search-toggle{order:5}
 html.phone-layout #phone-map-options #navigation-controls #map-fullscreen{order:6}
 html.phone-layout #phone-map-options #navigation-controls #map-info{order:7}
}

/* Phone viewer bottom controls; Related consumes image space, never overlays it. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout:not(.immersive) #full-view{height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;gap:0}
 html.phone-layout:not(.immersive) #full-view .full-body{height:auto!important;min-height:120px!important;flex:1 1 0!important;order:1}
 html.phone-layout:not(.immersive) #full-view>#full-related{order:2}
 html.phone-layout:not(.immersive) #full-view #phone-viewer-metadata{display:block;order:3;flex:0 1 auto;min-height:44px;max-height:30dvh;overflow:auto;overscroll-behavior:contain;padding:0 8px;box-sizing:border-box}
 html.phone-layout:not(.immersive) #full-view #phone-viewer-metadata #full-prompt-overlay{display:block!important;position:static!important;max-height:none!important;height:auto!important;overflow:visible!important;padding:6px 0!important}
 html.phone-layout:not(.immersive) #full-view #phone-viewer-metadata .full-description{display:flex!important;max-height:none!important;overflow:visible!important;padding:4px 0;gap:4px 8px}
 html.phone-layout:not(.immersive) #full-view #phone-viewer-metadata .full-description>*{margin:0!important;font-size:11px;line-height:1.35}
 html.phone-layout:not(.immersive) #full-view #image-viewer-footer{order:4;flex:0 0 auto!important;margin-top:auto;max-height:none!important;overflow:visible!important;padding:3px 8px calc(3px + env(safe-area-inset-bottom))!important;background:var(--aiml-paper,#faf9f5)}
 html.phone-layout #full-view #phone-viewer-bar{grid-template-columns:44px minmax(0,1.5fr) minmax(0,1.5fr) minmax(52px,.8fr) 54px!important}
 html.phone-layout #full-view #phone-viewer-core{grid-template-columns:1fr .8fr .7fr 1.7fr .7fr 36px!important}
 html.phone-layout #full-view #phone-viewer-core #full-fullscreen::after{font-size:20px}
 html.phone-layout.immersive #phone-viewer-metadata{display:none!important}
}

/* Favorite actions precede fitting actions, without adding rows. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout #phone-map-options #navigation-controls #map-favorites .favorite-toggle{order:1}
 html.phone-layout #phone-map-options #navigation-controls #map-favorites button:not(.favorite-toggle){order:2}
 html.phone-layout #phone-map-options #navigation-controls #fit-view{order:3}
 html.phone-layout #phone-map-options #navigation-controls #fit-set{order:4}
 html.phone-layout body>footer .lab-linear-actions{grid-template-columns:1fr 1fr 1.8fr 1fr 1.3fr 1fr 1fr 1fr 1fr 1fr!important}
 html.phone-layout #full-view #phone-viewer-core{grid-template-columns:1fr .8fr 1.7fr .7fr .7fr 36px!important}
}

/* Search follows Favorites before the fitting controls. */
html.phone-layout #phone-map-options #navigation-controls #phone-search-toggle{order:3}
html.phone-layout #phone-map-options #navigation-controls #fit-view{order:4}
html.phone-layout #phone-map-options #navigation-controls #fit-set{order:5}

/* Compact search: one input and clear/close actions, no repeated heading or glyph. */
#phone-search-dialog{padding:8px;top:max(8px,env(safe-area-inset-top));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center}
#phone-search-dialog:not([open]){display:none}
#phone-search-dialog .search-field{margin:0;min-width:0;min-height:44px;padding:0 6px}
#phone-search-dialog .search-field>span{display:none}
#phone-search-dialog .phone-search-actions{margin:0;gap:2px}
#phone-search-dialog button{min-width:40px;padding:4px;font-size:13px}
#phone-search-dialog [data-search-done]{font-size:24px}

html.phone-layout[data-theme] body :is(#inspector,#full-view #full-info){height:var(--info-height)!important}

/* Search keeps a single compact line and the same reachable actions. */
#phone-search-dialog{width:calc(100% - 24px);max-width:400px;padding:4px 6px;gap:4px;border-radius:4px}
#phone-search-dialog .search-field{padding:0 4px;border-bottom:0;min-height:44px}
#phone-search-dialog .search-field input{padding:6px 0;font-size:16px;min-height:44px}
#phone-search-dialog .phone-search-actions button{border-color:transparent;background:transparent;min-width:40px}

/* Phone map tool row fills its available width; last tool is Download. */
@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer #phone-map-nav{width:100%!important;min-width:0;flex:1 1 100%!important}
 html.phone-layout body>footer #phone-map-nav .lab-five-tools{display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);flex:1 1 0!important;width:100%!important;min-width:0;gap:3px}
 html.phone-layout body>footer #phone-map-nav .lab-five-tools>button{width:100%!important;min-width:0!important;max-width:none!important;min-height:44px!important;font-size:11px!important;padding:2px!important;white-space:nowrap;word-break:normal}
}

@media(max-width:600px),(max-width:950px) and (max-height:500px){
 html.phone-layout body>footer #phone-map-bar{grid-template-columns:repeat(4,minmax(0,1fr)) 54px!important;width:100%!important}
}

/* R130g: phone-static popups never extend below the current image window; their own content scrolls and the header stays visible. */
html.phone-layout[data-theme] body #settings-panel#settings-panel:not(.folded),html.phone-layout[data-theme] body #exhibitions-panel#exhibitions-panel:not(.folded){max-height:var(--cvb-art-max,100dvh)!important}
html.phone-layout[data-theme] body #exhibitions-panel#exhibitions-panel:not(.folded){padding-top:0!important}
html.phone-layout[data-theme] body #exhibitions-panel#exhibitions-panel:not(.folded)>.ex-top{position:sticky!important;top:0!important;z-index:2;margin-bottom:8px;flex:0 0 auto}