.map-layout { display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(19rem, 1fr); gap: 1.5rem; align-items: start; }
.map-layout > * { min-width: 0; }
.map-tools, .geometry, .position-row { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.map-tools output { min-width: 4rem; text-align: center; font-variant-numeric: tabular-nums; }
.geometry { align-items: end; margin-block: 1rem; }
.geometry > div { flex: 1; min-width: 6rem; }
.geometry label { margin-top: 0; }
#map-viewport { overflow: auto; scroll-axis-lock: none; overscroll-behavior: contain; height: 30rem; border: 1px solid var(--field-border); background: var(--canvas); }
#map { display: block; background: var(--paper); }
.map-element rect { fill: #e6f4ed; stroke: #49616a; stroke-width: 2; vector-effect: non-scaling-stroke; }
.map-element text { fill: var(--ink); font: 600 16px "Segoe UI", sans-serif; pointer-events: none; }
.map-element { cursor: pointer; }
.map-element:hover rect { stroke: var(--accent); stroke-width: 3; }
.map-element.match rect { fill: #fbe6ba; stroke: #805500; }
.map-element.selected rect { stroke: var(--accent); stroke-width: 4; }
.map-element:focus-visible { outline: none; }
.map-element:focus-visible rect { stroke: var(--focus); stroke-width: 4; }
.map-element.draggable { touch-action: none; -webkit-user-select: none; user-select: none; cursor: grab; }
.map-element.draggable:active { cursor: grabbing; }
.position-list { max-height: 24rem; overflow: auto; margin-block: 1rem; }
.position-row { border-bottom: 1px solid var(--line); padding-block: .75rem; flex-wrap: nowrap; align-items: start; }
.position-row > button:first-child { flex: 1; text-align: left; overflow-wrap: anywhere; }
.position-row small { display: block; color: var(--muted); }
#workspace input, #workspace select, #workspace button, #login-panel input, #login-panel button { min-height: 48px; }
#editor { border-top: 1px solid var(--line); margin-top: 1.5rem; }
#selected-path, #map-state, #publish-help { overflow-wrap: anywhere; }
.position-row [aria-pressed=true] { background: var(--success-bg, #e6f4ed); }
::selection { background: #c7e8dc; color: #162d36; }
input { caret-color: var(--accent); }
/* The map remains the primary workspace; search is a bounded adjacent list. */
main { padding-top: 1rem; }
.intro { margin-bottom: .5rem; }
.intro h1 { font-size: 1.625rem; margin-bottom: .35rem; }
.intro p { margin-bottom: .35rem; }
.workspace-nav { gap: .25rem 1rem; margin-bottom: .25rem; }
.toolbar { padding-block: .75rem; margin-bottom: .75rem; }
.toolbar > .map-context { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; width: min(100%, 44rem); }
.map-context label { margin-top: 0; }
.search-row { margin-bottom: 1rem; }
.map-panel, .map-layout > aside { padding: 1rem; }
.map-panel h2, .map-layout > aside h2 { font-size: 1.25rem; }
.map-tools { gap: .5rem; }
#view-status:empty { display: none; }
#results-panel { padding: 0 0 1rem; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; margin-bottom: 1rem; }
#results-panel .table-scroll { max-height: 26rem; overflow-x: hidden; }
#results-panel table, #results, #results tr, #results td { display: block; width: 100%; min-width: 0; max-width: none; }
#results-panel thead { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
#results tr { padding: .75rem; border-bottom: 1px solid var(--line); }
#results td { border: 0; padding: .15rem 0; }
#results td::before { content: attr(data-label) ": "; font-weight: 600; }
#results td:first-child { font-weight: 600; }
#results td:first-child::before, #results td:last-child::before { content: none; }
#results td:last-child { padding-top: .5rem; }
#results td button { width: 100%; }
#results-panel .pagination { flex-wrap: wrap; margin-bottom: 0; }
@media (max-width: 1000px) { .map-layout { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .map-panel { padding: 1rem; } #map-viewport { height: 23rem; } .map-tools { gap: .5rem; } .map-tools button { flex: 1 0 auto; } .geometry { gap: .5rem; } .map-layout { gap: 0; } .toolbar { gap: .5rem; } .toolbar > .map-context { gap: .5rem; } .search-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; } .search-row > div { grid-column: 1 / -1; } .search-row button { padding-inline: .5rem; } }