/* Upper UI only. Rows participate in layout; the immutable CPU world is untouched. */
#atlas-filters{height:auto;padding:6px 20px;flex:none}
#filter-controls{height:auto;grid-template-columns:minmax(160px,188px) minmax(196px,226px) max-content max-content minmax(220px,1fr);grid-template-rows:none;gap:6px 8px;align-items:start}
#difficulty-field,#availability-field,#branch-menu,#reset-filters,#knowledge-search{grid-column:auto;grid-row:auto;width:auto;justify-self:stretch}
.filter-field{display:flex;height:30px;min-width:0}
.filter-field>span{display:block;width:auto;font-size:11px}
.filter-field select{width:auto;height:30px;font-size:12px}
#branch-menu,#branch-menu>summary,#reset-filters,#search{height:30px}
#branch-menu>summary{padding:6px 8px}
#knowledge-search{min-width:0;display:grid;grid-template-columns:minmax(0,1fr)}
#search-results:not(:empty){display:none;position:static;inset:auto;margin-block-start:4px;width:100%;max-width:100%;max-height:min(160px,25dvh)}
#knowledge-search:focus-within #search-results:not(:empty){display:block}
#filter-context{height:auto;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;grid-template-areas:'legend progress public details';gap:6px 14px;align-items:center;margin-top:6px}
#catalog-legend{grid-area:legend;display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;min-width:0}
#atlas-context{font-size:11px;white-space:normal;overflow:visible;flex:none}
#difficulty-distribution{display:flex;flex-wrap:wrap;gap:4px 8px;white-space:normal;min-width:0}
.difficulty-legend{font-size:11px;white-space:nowrap;gap:4px}
.difficulty-solved{font-size:10px;color:var(--muted)}
#global-progress{grid-area:progress;gap:7px;white-space:nowrap;font-size:12px}
#global-progress strong{font-size:12px}
#public-progress-panel{grid-area:public;display:flex;align-items:center;justify-content:flex-end;gap:6px 8px;flex-wrap:wrap;min-width:0;font-size:12px;color:var(--muted)}
#public-progress-status{white-space:nowrap}
#refresh-public-progress,#public-progress-details>summary{height:30px;padding:5px 8px;font:inherit;white-space:nowrap;border:1px solid var(--border);border-radius:4px;background:#171f27}
#public-progress-details{grid-area:details;min-width:0;max-width:100%;margin:0;font-size:12px}
#public-progress-details>summary{cursor:pointer;list-style:none}
#public-progress-details>summary::-webkit-details-marker{display:none}
#public-progress-details>summary:after{content:' ▾';color:var(--muted)}
#public-progress-details[open]{grid-area:auto;grid-column:1/-1;grid-row:2;width:100%}
#public-progress-details[open]>summary{width:max-content}
#public-progress-diagnostics{max-height:120px;overflow:auto;overflow-wrap:anywhere;line-height:1.6;margin-top:6px;font-size:11px}

#map-main,#map-main[data-inspector-open=true][data-inspector-pinned=true]{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr)}
#map-toolbar{grid-column:1;grid-row:1;display:flex;align-items:center;gap:8px;padding:6px 20px;border-bottom:1px solid var(--border);min-width:0;background:var(--bg)}
.map-controls{position:static;inset:auto;display:flex;align-items:center;flex-wrap:wrap;flex:1;gap:6px 12px;max-width:none;padding:0;background:transparent}
.map-navigation,.map-zoom{display:flex;align-items:center;gap:5px}
.map-controls button{height:30px;padding:4px 7px;font-size:12px}
#zoom-label{font-size:12px;min-width:44px}
#inspector-toggle{position:static;inset:auto;flex:none;height:30px;padding:4px 8px;font-size:12px}
#overview-guide,#map-main[data-inspector-open=true][data-inspector-pinned=false] #overview-guide{grid-column:1;grid-row:2;position:static;inset:auto;max-width:none;width:100%;margin:0;padding:6px 20px;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
#overview-guide button{height:auto;min-height:28px;font-size:12px;line-height:18px}
#map-stage{grid-column:1;grid-row:3;position:relative;min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr)}
#canvas-container{min-width:0;min-height:0;grid-column:1;grid-row:1}
#map-main[data-inspector-open=true][data-inspector-pinned=true] #map-stage{grid-template-columns:minmax(0,1fr) 280px}
#map-main[data-inspector-open=true][data-inspector-pinned=true] #inspector-drawer{position:relative;inset:auto;width:auto;grid-column:2;grid-row:1;min-height:0;max-height:100%}
/* Visible keyboard focus shares the accepted V6.6 accent. */
#atlas-filters :is(button,input,select,summary):focus-visible,#map-toolbar :is(button,output):focus-visible,#overview-guide button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media(max-width:900px){
 #atlas-filters{padding-inline:12px}
 #filter-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto auto}
 #knowledge-search{grid-column:1/-1}
 #filter-context{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:'legend legend legend' 'progress public details'}
 #public-progress-details[open]{grid-row:3}
 #map-toolbar,#overview-guide{padding-inline:12px}
}
@media(max-width:600px){
 #filter-controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .filter-field>span{display:none}
 .filter-field select{width:100%}
 #knowledge-search{grid-row:2}
 #branch-menu,#reset-filters{grid-row:3}
 #filter-context{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'legend legend' 'progress progress' 'public details';gap:5px}
 #catalog-legend{gap:4px 8px}
 #global-progress{justify-self:start}
 #public-progress-panel{justify-content:flex-start}
 #public-progress-details[open]{grid-row:4}
 #difficulty-distribution{justify-content:flex-start;gap:4px 8px}
 #overview-guide{grid-template-columns:repeat(2,minmax(0,1fr))}
 .map-controls button,#inspector-toggle,#zoom-label{font-size:11px}
}
@media(max-width:700px){
 #map-main[data-inspector-open=true] #overview-guide{display:none}
 #map-main[data-inspector-open=true] .map-controls,#map-main[data-inspector-open=true][data-inspector-pinned=false] .map-controls{max-width:none}
 #map-main[data-inspector-open=true][data-inspector-pinned=true] #map-stage{grid-template-columns:minmax(0,1fr)}
 #map-main[data-inspector-open=true] #inspector-drawer{position:absolute;inset:auto 0 0;width:100%;height:min(300px,45%);max-height:45%;grid-column:auto;grid-row:auto;border-left:0;border-top:1px solid var(--border);padding:12px}
}
