/* ModelMaps cross-section panel and map line (assets/mf-xsection.js). Colours from the page tokens (mf.css design system). */
#xsBtn[hidden]{display:none!important}
@media (min-width:901px) and (pointer:fine){.ctl .tools:has(#xsBtn:not([hidden])){grid-template-columns:repeat(11,1fr)}}
.map.xs-on{cursor:crosshair}
.xs-line{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible}
.xs-line polyline{fill:none;stroke:#fff;stroke-width:2.2;stroke-linejoin:round}
.xs-line polyline.halo{stroke:#0d1014;stroke-width:5;stroke-opacity:.75}
.xs-line circle{fill:var(--acc,#b8975a);stroke:#0d1014;stroke-width:2}
.xs-line circle.cur{fill:#fff;stroke:#0d1014}
.xs-line text{font:800 12px Inter,system-ui,sans-serif;fill:#fff;paint-order:stroke;stroke:#0d1014;stroke-width:3px}
.xs{flex:none;max-height:52vh;overflow:auto;background:var(--panel,#12161b);border-top:1px solid var(--acc,#b8975a);padding:8px 14px 10px;scrollbar-width:thin;scrollbar-color:var(--line2,#3a3f48) transparent}
.xs[hidden]{display:none}
.xs-h{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:34px}
.xs-h>b{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--acc-soft,#d9c49a)}
.xs-mod{flex:none;gap:3px}
.xs-sub{font:500 11.5px var(--mono,monospace);color:var(--mute,#b5afa1)}
.xs-sp{flex:1}
.xs .pill{min-height:30px;padding:4px 9px}
.xs .tsel.xs-top{height:30px;flex:none;width:auto}
.xs-ctl{display:flex;align-items:flex-start;gap:8px;margin-top:6px}
.xs-l{flex:none;width:44px;padding-top:8px;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim,#938f84);font-weight:600}
.xs-ctl .row{flex:1;min-width:0}
.xs-msg{margin:6px 0 0;font-size:12px;color:var(--mute,#b5afa1)}
.xs-msg:empty{display:none}
.xs-msg .warn{color:var(--hot,#d9a441);font-weight:600}
.xs-plot{position:relative;margin-top:8px;width:100%;touch-action:pan-y}
.xs-plot[hidden]{display:none}
.xs-plot canvas{display:block}
.xs-cur{position:absolute;left:0;top:0;cursor:crosshair}
.xs-read{min-height:18px;margin-top:4px;font:500 11.5px/1.45 Inter,system-ui,sans-serif;color:#dbd6ca}
.xs-read b{color:#fff}
.xs-leg{margin-top:6px;font-size:11px;color:var(--mute,#b5afa1)}
.xs-bar{display:grid;grid-template-columns:auto minmax(120px,260px);gap:2px 10px;align-items:center;margin-bottom:6px}
.xs-bk{grid-row:span 2;max-width:330px;line-height:1.35}
.xs-bar i{display:block;height:9px;border-radius:2px;border:1px solid var(--line2,#3a3f48);background-color:#0f1318}
.xs-tk{position:relative;height:13px;font:500 10px var(--mono,monospace)}
.xs-tk em{position:absolute;transform:translateX(-50%);font-style:normal;white-space:nowrap}
.xs-keys{display:flex;flex-wrap:wrap;gap:4px 14px}
.xs-keys span{display:inline-flex;align-items:center;gap:5px}
.xs-keys i{display:inline-block;width:14px;height:9px;border-radius:2px}
.xs-keys i.ln{height:0;border-top:2px solid;border-radius:0}
.xs-keys i.ln.dash{border-top-style:dashed}
.xs-keys i.ln.dot{border-top-style:dotted}
.xs-note{margin:8px 0 0;font-size:11px;line-height:1.5;color:var(--dim,#938f84)}
.xs.min{padding-bottom:6px}
/* phones and portrait tablets: a sheet over the lower screen; the map stays above it for more taps */
@media(max-width:700px),(max-width:1000px) and (orientation:portrait){
  .xs{position:fixed;left:0;right:0;bottom:0;z-index:45;max-height:56dvh;padding:6px 12px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -12px 30px #0009}
  .xs .pill{min-height:40px}
  .xs .tsel.xs-top{height:40px;font-size:16px}
  .xs-l{width:38px;padding-top:12px}
  .xs-ctl .row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .xs-ctl .row .pill{flex:none}
  .xs-bar{grid-template-columns:1fr}
  .xs-bk{grid-row:auto}
}