/* ============================================================================
   MASAR v10.8 — css5/14-maptools.css
   The map toolkit (js5/map/maptools.js): search, measure, area check,
   density, context menu, status pill. Same panel grammar as the HUD.
   ========================================================================== */

.m-mtools{position:absolute;inset:0;z-index:690;pointer-events:none;font:var(--ty-body);color:var(--text)}
.m-mtools > *{pointer-events:auto}

/* --- the bar: top end of the map ----------------------------------- */
.m-mt-bar{position:absolute;top:14px;right:14px;display:flex;align-items:flex-start;gap:8px;max-width:calc(100% - 28px)}
.m-mt-bar .m-map-grp{flex-direction:row}
.m-mt-bar .m-map-grp .m-map-btn + .m-map-btn{border-top:0;border-left:1px solid var(--map-panel-line)}
.m-mt-bar > .m-map-btn{border-radius:var(--r-sm);background:var(--map-panel);border:1px solid var(--map-panel-line);box-shadow:var(--sh-map)}

.m-mt-search{position:relative;display:flex;align-items:center;gap:8px;height:36px;width:min(340px,42vw);padding:0 10px;
  background:var(--map-panel);border:1px solid var(--map-panel-line);border-radius:var(--r-sm);box-shadow:var(--sh-map);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text-3);transition:width .18s var(--ease, ease)}
.m-mt-search.is-open,.m-mt-search:focus-within{width:min(420px,52vw);border-color:var(--accent);color:var(--accent)}
.m-mt-search svg{flex:0 0 auto;width:15px;height:15px}
.m-mt-search input{flex:1 1 auto;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font:var(--ty-body);height:100%}
.m-mt-search input::placeholder{color:var(--text-3)}
.m-mt-search input::-webkit-search-cancel-button{display:none}
.m-mt-search kbd,.m-mt-key kbd{font:600 10px/1 var(--font-mono, monospace);padding:3px 6px;border-radius:5px;border:1px solid var(--line);
  background:var(--surface-sunken);color:var(--text-2)}
.m-mt-search:focus-within kbd{display:none}

.m-mt-results{position:absolute;top:calc(100% + 6px);left:0;right:0;max-height:min(420px,60vh);overflow:auto;padding:4px;
  background:var(--surface);border:1px solid var(--map-panel-line);border-radius:var(--r-md);box-shadow:var(--sh-pop, 0 12px 32px rgba(0,0,0,.22))}
.m-mt-grp{padding:8px 8px 4px;font:var(--ty-label-sm);text-transform:uppercase;letter-spacing:.06em;color:var(--text-3)}
.m-mt-hit{display:flex;align-items:center;gap:10px;width:100%;padding:7px 8px;border:0;background:none;border-radius:8px;text-align:start;color:inherit;cursor:pointer}
.m-mt-hit:hover,.m-mt-hit.is-on{background:var(--accent-soft)}
.m-mt-hit__ic{flex:0 0 28px;height:28px;border-radius:8px;display:grid;place-items:center;--hc:var(--accent);
  color:var(--hc);background:color-mix(in srgb,var(--hc) 14%,transparent)}
.m-mt-hit__ic svg{width:15px;height:15px}
.m-mt-hit__x{display:flex;flex-direction:column;min-width:0}
.m-mt-hit__x b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-mt-hit__x span{font:var(--ty-caption);color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-mt-empty{padding:14px;text-align:center;color:var(--text-3);font:var(--ty-caption)}

/* the layer panel steps down below the bar instead of under it */
.m-map-host.has-mtools .m-hud--tr{top:60px}

/* --- panels: stacked under the bar ---------------------------------- */
.m-mt-stack{position:absolute;top:60px;right:14px;display:flex;flex-direction:column;gap:8px;width:min(330px,calc(100% - 90px));
  max-height:calc(100% - 140px);pointer-events:none}
.m-mt-stack > *{pointer-events:auto}
.m-mt-panel{display:flex;flex-direction:column;min-height:0;background:var(--surface);border:1px solid var(--map-panel-line);
  border-radius:var(--r-md);box-shadow:var(--sh-map);overflow:hidden}
.m-mt-panel__h{display:flex;align-items:center;gap:8px;padding:9px 10px 9px 12px;border-bottom:1px solid var(--line-subtle, var(--map-panel-line))}
.m-mt-panel__h > svg{color:var(--accent);flex:0 0 auto}
.m-mt-panel__h b{font:var(--ty-label);white-space:nowrap}
.m-mt-sub{font:var(--ty-caption);color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto}
.m-mt-x{margin-inline-start:auto;width:26px;height:26px;border:0;border-radius:7px;background:none;color:var(--text-3);display:grid;place-items:center;cursor:pointer;flex:0 0 auto}
.m-mt-x:hover{background:var(--surface-sunken);color:var(--text)}
.m-mt-seg{display:inline-flex;padding:2px;border-radius:8px;background:var(--surface-sunken);gap:2px;margin-inline-start:auto}
.m-mt-panel__h .m-mt-seg + .m-mt-x{margin-inline-start:4px}
.m-mt-seg button{border:0;background:none;padding:4px 9px;border-radius:6px;font:600 11px/1.2 var(--font);color:var(--text-2);cursor:pointer}
.m-mt-seg button[aria-pressed="true"]{background:var(--surface);color:var(--accent);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.m-mt-seg--full{display:flex;margin:8px 10px 2px}
.m-mt-seg--full button{flex:1 1 0}

.m-mt-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px}
.m-mt-figs--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.m-mt-fig{display:flex;flex-direction:column;gap:1px;padding:7px 8px;border-radius:8px;background:var(--surface-sunken);min-width:0}
.m-mt-fig b{font:700 15px/1.15 var(--font);color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-mt-fig span{font:var(--ty-caption);font-size:10.5px;color:var(--text-3);line-height:1.2}
.m-mt-figs--4 .m-mt-fig b{font-size:14px}
.m-mt-hint{padding:0 12px 10px;font:var(--ty-caption);color:var(--text-3)}
.m-mt-acts{display:flex;gap:6px;padding:8px 10px;border-top:1px solid var(--line-subtle, var(--map-panel-line));background:var(--surface-subtle)}
.m-mt-acts button{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border-radius:7px;border:1px solid var(--line);
  background:var(--surface);color:var(--text-2);font:600 11.5px/1 var(--font);cursor:pointer}
.m-mt-acts button:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}
.m-mt-acts button:disabled{opacity:.45;cursor:default}
.m-mt-acts button.is-primary{margin-inline-start:auto;background:var(--accent);border-color:var(--accent);color:#fff}
.m-mt-acts button svg{width:13px;height:13px}

.m-mt-scroll{overflow:auto;min-height:0}
.m-mt-chips{display:flex;flex-wrap:wrap;gap:5px;padding:0 10px 8px}
.m-mt-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;background:var(--surface-sunken);font:var(--ty-caption);color:var(--text-2)}
.m-mt-chip i{width:7px;height:7px;border-radius:50%}
.m-mt-chip b{color:var(--text)}
.m-mt-sec{padding:2px 6px 6px}
.m-mt-sec h5{margin:4px 6px 2px;font:var(--ty-label-sm);text-transform:uppercase;letter-spacing:.06em;color:var(--text-3)}
.m-mt-row{display:flex;align-items:center;gap:9px;width:100%;padding:6px;border:0;background:none;border-radius:8px;text-align:start;color:inherit;cursor:pointer}
.m-mt-row:hover,.m-mt-row.is-on{background:var(--accent-soft)}
.m-mt-row > svg{flex:0 0 auto;color:var(--text-3)}
.m-mt-row__x{display:flex;flex-direction:column;min-width:0;flex:1 1 auto}
.m-mt-row__x b{font-weight:600;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-mt-row__x span,.m-mt-row__n span{font:var(--ty-caption);font-size:10.5px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-mt-row__n{display:flex;flex-direction:column;align-items:flex-end;flex:0 0 auto}
.m-mt-row__n b{font:600 12px/1.2 var(--font);font-variant-numeric:tabular-nums}
.m-mt-row__n b.is-warn{color:var(--warn)}
.m-mt-row__n b.is-crit{color:var(--critical)}
.m-mt-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 2px var(--surface)}
.m-mt-note{display:flex;gap:7px;align-items:flex-start;margin:4px 10px 8px;padding:7px 9px;border-radius:8px;background:var(--surface-sunken);font:var(--ty-caption);color:var(--text-2)}
.m-mt-note svg{flex:0 0 auto;margin-top:1px;color:var(--accent)}
.m-mt-note.is-crit{background:var(--crit-soft);color:var(--critical)}
.m-mt-note.is-crit svg{color:var(--critical)}

.m-mt-ramp{padding:6px 12px 10px}
.m-mt-ramp i{display:block;height:8px;border-radius:5px;background:linear-gradient(90deg,rgba(6,182,212,.7),#22c55e,#eab308,#f97316,#dc2626)}
.m-mt-ramp div{display:flex;justify-content:space-between;font:var(--ty-caption);font-size:10px;color:var(--text-3);margin-top:3px}
.m-mt-heatm .m-mt-row{margin:0 6px;width:calc(100% - 12px)}
.m-mt-heatm .m-mt-row:first-of-type{margin-top:6px}

.m-mt-key{display:flex;align-items:center;gap:10px;padding:5px 12px;font:var(--ty-caption);color:var(--text-2)}
.m-mt-key kbd{min-width:52px;text-align:center}
.m-mt-help{padding-bottom:6px}

/* --- status pill ---------------------------------------------------- */
.m-mt-status{position:absolute;top:58px;left:14px;display:flex;align-items:center;gap:10px;height:26px;padding:0 10px;
  background:var(--map-panel);border:1px solid var(--map-panel-line);border-radius:999px;box-shadow:var(--sh-map);
  font:500 10.5px/1 var(--font-mono, monospace);color:var(--text-2);white-space:nowrap;pointer-events:none}
.m-mt-ll{display:inline-flex;align-items:center;gap:5px}
.m-mt-ll svg{width:12px;height:12px;opacity:.6}
.m-mt-z{color:var(--text-3)}
.m-mt-scale{display:inline-flex;align-items:center;gap:6px}
.m-mt-scale i{display:block;height:6px;border:1.5px solid var(--text-2);border-top:0}
.m-map-host.is-shortmap .m-mt-status{top:52px;left:10px}
.m-map-host.is-tinymap .m-mt-status{display:none}

/* --- on the map ------------------------------------------------------- */
.m-mt-heat{position:absolute;top:0;left:0;pointer-events:none;opacity:.9}
.leaflet-container.is-measuring,.leaflet-container.is-measuring .leaflet-interactive{cursor:crosshair !important}
.leaflet-container.is-picking,.leaflet-container.is-picking .leaflet-interactive{cursor:cell !important}
.m-mt-leg span,.m-mt-tot span{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;padding:2px 7px;border-radius:999px;
  font:600 10.5px/1.3 var(--font);background:var(--surface);color:var(--text);border:1px solid var(--line);box-shadow:0 1px 4px rgba(0,0,0,.18)}
.m-mt-tot span{transform:translate(10px,-130%);background:var(--accent);color:#fff;border-color:var(--accent);font-size:11.5px}
.m-mt-pulse{position:relative}
.m-mt-pulse b{position:absolute;inset:4px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px #fff}
.m-mt-pulse i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);animation:mMtPulse 1.6s ease-out infinite}
.m-mt-pulse i + i{animation-delay:.8s}
@keyframes mMtPulse{from{transform:scale(1);opacity:.9}to{transform:scale(4.2);opacity:0}}

/* --- context menu ----------------------------------------------------- */
.m-mt-ctx{position:absolute;min-width:232px;padding:4px;background:var(--surface);border:1px solid var(--map-panel-line);border-radius:var(--r-md);
  box-shadow:var(--sh-pop, 0 12px 32px rgba(0,0,0,.24));z-index:695}
.m-mt-ctx__h{display:flex;align-items:center;gap:6px;padding:6px 8px 7px;font:500 10.5px/1.2 var(--font-mono, monospace);color:var(--text-3);border-bottom:1px solid var(--line-subtle, var(--line));margin-bottom:3px}
.m-mt-ctx__h em{margin-inline-start:auto;font:600 10.5px/1.2 var(--font);font-style:normal;color:var(--accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.m-mt-ctx button{display:flex;align-items:center;gap:9px;width:100%;padding:7px 8px;border:0;background:none;border-radius:7px;color:var(--text);text-align:start;cursor:pointer}
.m-mt-ctx button:hover{background:var(--accent-soft)}
.m-mt-ctx button svg{color:var(--text-3);flex:0 0 auto}
.m-mt-ctx button span{display:flex;flex-direction:column}
.m-mt-ctx button b{font-weight:550;font-size:12.5px}
.m-mt-ctx button i{font-style:normal;font:var(--ty-caption);color:var(--text-3)}
.m-mt-ctx__sep{height:1px;background:var(--line-subtle, var(--line));margin:4px 2px}

/* --- small maps ------------------------------------------------------- */
.m-map-host.is-shortmap .m-mt-bar{top:10px;right:10px}
.m-map-host.is-shortmap .m-mt-stack{top:54px;right:10px;max-height:calc(100% - 110px)}
.m-map-host.is-shortmap .m-mt-figs--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.m-map-host.is-tinymap .m-mt-tools [data-mt="help"]{display:none}
@media (max-width:760px){ .m-mt-search{width:min(220px,46vw)} }

/* RTL: the map does not mirror, the toolkit's text does (panels carry dir) */
html[dir="rtl"] .m-mt-row__n{align-items:flex-start}
/* while a tool is armed, a click lands on the ground, not on a marker */
.leaflet-container.is-measuring .leaflet-marker-icon,
.leaflet-container.is-picking .leaflet-marker-icon{pointer-events:none !important}
/* map cards size to the page, not to a fixed clamp — no clipped legend */
.p-fa9__mapcard .p-facmap{height:auto;min-height:200px;flex:1 1 auto}

/* v10.9 — Settings › Map › Street map */
.p-set__osmprog{display:flex;flex-direction:column;gap:6px;margin:12px 0 4px}
.p-set__osmprog span{font:var(--ty-caption);color:var(--text-2)}
.p-set__osmacts{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
.m-mt-src{font:600 9.5px/1 var(--font);letter-spacing:.04em;text-transform:uppercase;padding:3px 6px;border-radius:999px;background:var(--surface-sunken);color:var(--text-3)}
.m-mt-src.is-real{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
.m-mt-src.is-loading{background:var(--accent-soft);color:var(--accent);animation:mMtBlink 1.4s ease-in-out infinite}
@keyframes mMtBlink{50%{opacity:.55}}
