.map-surfaces-key{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;color:#29483d;font-size:10px;line-height:1.5;margin-top:10px}
.map-surfaces-key span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.map-surfaces-key i{display:inline-block;width:13px;height:8px;border-radius:2px;flex:0 0 auto}
.road-swatch{background:#4b5353;border:1px solid #b4b2a4}
.landscape-swatch{background:#a0ad85;border:1px solid #75866a}
.map-surfaces-caption{font-size:10px;line-height:1.5;color:#657369;margin-top:5px;max-width:290px}
.map-surfaces-on-map{width:max-content;max-width:100%;padding:5px 8px;background:#edf1e5eb;border:1px solid #ffffff6b;border-radius:4px;text-shadow:none;margin-top:7px}
@media(max-width:700px){.map-surfaces-key{font-size:9px;gap:5px 12px}.map-surfaces-on-map{margin-top:5px;padding:4px 7px}.map-surfaces-caption{max-width:none}}
@media(max-width:359px){.map-surfaces-on-map{gap:5px 9px}}