.map-mode { --map-grid: var(--line); display:flex; flex-direction:column; position:relative; height:100%; min-height:0; min-width:0; overflow:auto; background:var(--bg); color:var(--text); }
.map-mode *, .map-mode *::before, .map-mode *::after { box-sizing:border-box; }
.map-mode [hidden] { display:none!important; }
.map-mode button { font-size:12px; min-height:38px; }
.map-mode button:focus-visible, .map-mode [tabindex]:focus-visible { outline:3px solid var(--aqua); outline-offset:3px; }
.map-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px 12px; flex-shrink:0; }
.map-header h2 { font-size:21px; letter-spacing:-.6px; margin-top:2px; }
.map-header .eyebrow { font-size:9px; letter-spacing:1.3px; }
.map-header-actions { display:flex; align-items:center; gap:10px; font-size:11px; color:var(--muted); text-align:right; }
.map-mode .map-close { font-size:22px; padding:0; width:36px; min-height:36px; flex-shrink:0; background:transparent; border-color:transparent; }
.map-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 20px 12px; flex-wrap:wrap; flex-shrink:0; }
.map-views { display:flex; border:1px solid var(--line); border-radius:10px; background:var(--panel2); padding:3px; gap:3px; }
.map-views button { border:0; background:transparent; color:var(--muted); padding:8px 11px; min-height:34px; white-space:nowrap; }
.map-views button[aria-pressed="true"] { background:var(--panel); color:var(--text); box-shadow:var(--shadow); }
.map-toolbar-actions { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.map-filters { display:flex; align-items:center; gap:12px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--panel); padding:10px 20px; flex-shrink:0; }
.map-filters label { display:flex; align-items:center; gap:7px; font-size:11px; min-width:0; white-space:nowrap; }
.map-filters select,.map-filters input { max-width:155px; width:100%; font-size:11px; padding:7px 9px; min-height:34px; }
.map-view-note { margin-left:auto; color:var(--muted); font-size:11px; line-height:1.5; max-width:250px; }
.map-body { display:flex; flex:1; min-height:150px; position:relative; overflow:hidden; }
.map-stage { position:relative; min-width:0; flex:1; min-height:150px; overflow:hidden; }
.map-viewport { position:absolute; inset:0; overflow:auto; overscroll-behavior:contain; touch-action:none; scrollbar-width:thin; scrollbar-color:var(--line) transparent; background-image:radial-gradient(var(--map-grid) .7px, transparent .8px); background-size:18px 18px; }
.map-world { position:relative; min-width:100%; min-height:100%; }
.map-edges { position:absolute; top:0; left:0; overflow:visible; }
.map-edges marker path { fill:var(--muted); }
.map-edge { cursor:pointer; outline:none; }
.map-edge-line { fill:none; stroke:var(--muted); stroke-width:1.6; opacity:.8; }
.map-edge-hit { stroke:transparent; stroke-width:20; fill:none; }
.map-edge:hover .map-edge-line,.map-edge:focus .map-edge-line,.map-edge.is-selected .map-edge-line { stroke:var(--aqua); stroke-width:3; opacity:1; }
.map-edge text { fill:var(--text); font-size:11px; font-family:inherit; stroke:var(--bg); stroke-width:5px; paint-order:stroke; stroke-linejoin:round; }
.map-nodes { position:absolute; left:0; top:0; transform-origin:0 0; pointer-events:none; }
.map-mode .map-node { pointer-events:auto; position:absolute; display:flex; flex-direction:column; text-align:left; justify-content:space-between; width:216px; min-height:108px; height:auto; padding:12px 14px; border-radius:11px; background:var(--panel); border:1px solid var(--line); box-shadow:var(--shadow); cursor:grab; user-select:none; color:var(--text); }
.map-mode .map-node:active { cursor:grabbing; }
.map-mode .map-node.is-selected { border:2px solid var(--aqua); padding:11px 13px; background:var(--panel); box-shadow:0 0 0 3px var(--accent-soft); }
.map-node-top { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:10px; color:var(--muted); }
.map-node-type { display:flex; align-items:center; gap:6px; }
.map-node-type>span { font-size:16px; line-height:1; color:var(--aqua); }
.map-status-dot { width:7px; height:7px; border:1.5px solid var(--muted); border-radius:50%; }
.status-confirmed .map-status-dot { background:var(--green); border-color:var(--green); }
.status-question .map-status-dot { background:var(--aqua); border-color:var(--aqua); }
.map-node strong { font-size:13px; font-weight:650; line-height:1.35; display:block; margin:7px 0; overflow-wrap:anywhere; }
.map-node-foot { display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:10px; color:var(--muted); white-space:normal; overflow-wrap:anywhere; }
.map-filter-empty { color:var(--muted); padding:70px 30px; font-size:14px; }
.map-empty { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:24px; text-align:center; gap:13px; background:var(--bg); z-index:1; }
.map-empty-icon { color:var(--aqua); font-size:35px; letter-spacing:10px; margin-bottom:2px; }
.map-empty h3 { font-size:18px; letter-spacing:-.3px; }
.map-empty p { font-size:12px; max-width:380px; line-height:1.7; }
.map-empty>div { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
.map-empty small { font-size:11px; }
.map-zoom { position:absolute; bottom:16px; right:16px; display:flex; align-items:center; padding:3px; border:1px solid var(--line); border-radius:10px; background:var(--panel); box-shadow:var(--shadow); z-index:2; }
.map-zoom button { border:0; background:transparent; padding:6px 10px; font-size:14px; }
.map-zoom output { font-size:11px; min-width:42px; text-align:center; color:var(--muted); }
.map-canvas-help { position:absolute; bottom:23px; left:18px; font-size:10px; color:var(--muted); padding:4px 7px; border-radius:5px; background:var(--bg); pointer-events:none; }
.map-inspector { width:292px; flex:0 0 292px; background:var(--panel); border-left:1px solid var(--line); display:flex; flex-direction:column; z-index:3; min-height:0; overflow:hidden; }
.map-drawer-head { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid var(--line); flex-shrink:0; }
.map-drawer-head h3 { font-size:14px; }
.map-drawer-head button { border:0; background:transparent; font-size:22px; padding:0; width:36px; }
.map-drawer-content { overflow:auto; padding:16px; display:flex; flex-direction:column; gap:15px; min-height:0; overscroll-behavior:contain; }
.map-drawer-content label { font-size:11px; gap:5px; }
.map-drawer-content input,.map-drawer-content select,.map-drawer-content textarea { font-size:12px; padding:9px 10px; width:100%; min-width:0; }
.map-drawer-content textarea { min-height:85px; resize:vertical; }
.map-field-pair { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.map-drawer-content .map-check { display:flex; align-items:center; gap:8px; }
.map-check input { width:16px; height:16px; accent-color:var(--aqua); }
.map-help { font-size:11px; line-height:1.6; color:var(--muted); }
.map-drawer-buttons { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.map-connections { border-top:1px solid var(--line); padding-top:14px; display:grid; gap:7px; }
.map-connections h4 { font-size:11px; margin:0 0 3px; color:var(--muted); font-weight:600; }
.map-connections button { text-align:left; overflow-wrap:anywhere; }
.map-connections p { font-size:11px; }
.map-snapshot-form { display:grid; gap:9px; }
.map-history-list { display:grid; gap:10px; }
.map-history-list article { display:flex; align-items:center; justify-content:space-between; gap:7px; padding:10px 0; border-top:1px solid var(--line); }
.map-history-list article>div { min-width:0; display:grid; gap:4px; }
.map-history-list strong { font-size:12px; overflow-wrap:anywhere; }
.map-history-list small { font-size:10px; }
.map-history-list button { flex-shrink:0; }
.map-footer { border-top:1px solid var(--line); background:var(--panel); padding:12px 20px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-shrink:0; }
.map-ai-form { flex:1; min-width:0; max-width:650px; }
.map-ai-label { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:7px; font-size:11px; color:var(--text); }
.map-ai-label span { color:var(--muted); font-size:10px; font-weight:400; }
.map-ai-input { display:flex; gap:7px; align-items:stretch; }
.map-ai-input input { min-width:0; width:100%; font-size:12px; padding:10px 11px; }
.map-ai-input button { white-space:nowrap; background:var(--panel2); }
.map-generation { display:flex; gap:7px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.map-generation>span { color:var(--muted); font-size:10px; flex-basis:100%; text-align:right; }
.map-error { display:flex; justify-content:space-between; align-items:center; gap:10px; background:var(--accent-soft); border-top:1px solid var(--line); color:var(--text); padding:9px 20px; font-size:12px; line-height:1.5; flex-shrink:0; }
.map-error button { flex-shrink:0; }
.map-suggestion { display:grid; grid-template-columns:1fr auto; align-items:center; gap:7px 18px; padding:12px 20px; background:var(--accent-soft); border-top:1px solid var(--line); max-height:40%; overflow:auto; flex-shrink:0; }
.map-suggestion-heading { display:grid; gap:3px; min-width:0; }
.map-suggestion-heading strong { font-size:12px; overflow-wrap:anywhere; }
.map-suggestion-heading p { font-size:10px; }
.map-suggestion-actions { display:flex; gap:7px; grid-column:2; grid-row:1/3; }
.map-suggestion details { grid-column:1; min-width:0; }
.map-suggestion summary { font-size:11px; cursor:pointer; color:var(--text); }
.map-proposal-list { display:grid; gap:9px; padding-top:12px; }
.map-proposal-list article { display:grid; gap:3px; border-bottom:1px solid var(--line); padding-bottom:8px; }
.map-proposal-list strong { font-size:12px; }
.map-proposal-list span,.map-proposal-list p { font-size:11px; overflow-wrap:anywhere; }
.map-mode.map-readonly .map-footer { justify-content:flex-end; }
.map-mode.map-readonly .map-node { cursor:pointer; }
@media (max-width:1000px) {
 .map-footer { flex-direction:column; align-items:stretch; gap:10px; }
 .map-ai-form { max-width:none; }
 .map-generation { flex-wrap:nowrap; }
 .map-generation>span { flex-basis:auto; margin-right:auto; }
 .map-view-note { display:none; }
 .map-canvas-help { display:none; }
}
@media (max-width:650px) {
 .map-mode { min-height:0; }
 .map-header { padding:12px 12px 9px; }
 .map-header h2 { font-size:18px; }
 .map-header-actions { font-size:10px; gap:4px; }
 .map-toolbar { padding:0 12px 10px; gap:8px; }
 .map-views { width:100%; justify-content:space-between; }
 .map-views button { flex:1; font-size:11px; padding:7px 6px; }
 .map-toolbar-actions { width:100%; display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:6px; }
 .map-toolbar-actions button { padding:7px 4px; font-size:11px; white-space:nowrap; }
 .map-toolbar-actions button:first-child { margin-right:0; }
 .map-mode button { min-height:40px; }
 .map-filters { padding:8px 12px; gap:10px; }
 .map-filters label { flex:1; }
 .map-filters input,.map-filters select { max-width:none; }
 .map-footer { padding:10px 12px calc(10px + var(--bottom-inset,0px)); gap:9px; }
 .map-ai-label span { display:none; }
 .map-ai-input { gap:5px; }
 .map-ai-input button { padding:9px; }
 .map-generation { gap:6px; }
 .map-generation button { padding:8px 9px; font-size:11px; }
 .map-generation>span { font-size:10px; }
 .map-inspector { position:absolute; inset:0; width:100%; border-left:0; }
 .map-inspector .map-drawer-content { padding-bottom:calc(16px + var(--bottom-inset,0px)); }
 .map-empty { padding:18px; gap:10px; }
 .map-empty-icon { display:none; }
 .map-empty h3 { font-size:16px; }
 .map-empty p { font-size:11px; line-height:1.6; }
 .map-empty small { display:none; }
 .map-zoom { bottom:10px; right:10px; }
 .map-zoom button { min-height:35px; }
 .map-error { padding:9px 12px; flex-wrap:wrap; font-size:11px; }
 .map-suggestion { padding:10px 12px; grid-template-columns:1fr; max-height:45%; gap:8px; }
 .map-suggestion-actions { grid-column:1; grid-row:auto; justify-content:flex-end; }
}
@media (prefers-reduced-motion:reduce) { .map-mode button { transition:none; } }

@media (max-height:520px) and (min-width:651px) {
 .map-header { padding:5px 12px; }
 .map-header .eyebrow { display:none; }
 .map-header h2 { font-size:15px; margin:0; }
 .map-mode button { min-height:32px; padding-top:5px; padding-bottom:5px; }
 .map-toolbar { padding:0 12px 6px; gap:6px; }
 .map-views button { padding:5px 9px; }
 .map-filters { padding:5px 12px; }
 .map-filters input,.map-filters select { min-height:28px; padding:5px 8px; }
 .map-body,.map-stage { min-height:75px; }
 .map-footer { flex-direction:row; gap:10px; padding:6px 12px; }
 .map-ai-label { margin-bottom:4px; }
 .map-ai-label span { display:none; }
 .map-generation { max-width:235px; flex-wrap:wrap; flex-shrink:0; }
 .map-generation>span { flex-basis:100%; }
 .map-ai-input input { padding:8px; }
 .map-zoom { bottom:7px; }
}
