*{box-sizing:border-box}body{margin:0;background:#101a1c;color:#e9f2f0;font:16px system-ui,Arial,sans-serif}header{padding:16px 24px;background:#17282a;border-bottom:1px solid #34504b;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}header span,.muted{color:#a9c1bd}main{max-width:1250px;margin:auto;padding:20px}nav{display:flex;gap:18px;flex-wrap:wrap;margin:0 0 20px}a{color:#a4e5c3}h1{font-size:1.7rem}h2{font-size:1.15rem}.panel{background:#1b2c2e;border:1px solid #36504d;border-radius:14px;padding:22px;margin:14px 0}.narrow{max-width:470px;margin:45px auto}label{display:block;margin:10px 0;font-weight:600}input,textarea{display:block;width:100%;padding:12px;border-radius:8px;border:1px solid #648078;background:#0f2021;color:white;margin-top:7px;font:inherit}button{border:0;background:#79d9a9;color:#10241c;border-radius:8px;padding:11px 16px;font:inherit;font-weight:700;cursor:pointer;margin:6px 5px 6px 0}.secondary{background:#42625c;color:white}.error{color:#ffb8b8}.ok{color:#a7f1b9}.intro{margin-bottom:16px}.toolbar{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-bottom:12px}.toolbar label{min-width:260px;margin:0}.toolbar button{margin:0}#map{height:62vh;min-height:400px;border-radius:12px;background:#334}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}@media(max-width:600px){main{padding:12px}#map{height:58vh}header{padding:12px}}

/* LiDAR Lens Ravels – uitgebreide kaartbediening */

#map {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Zorg dat Leaflet zijn eigen kaartopmaak behoudt */
#map .leaflet-container {
  font: 13px Arial, sans-serif;
}

#map .leaflet-control {
  color: #172527;
}

/* Nieuwe onderzoeksbediening */
#map .research-control {
  background: #ffffff;
  color: #172527;
  padding: 12px;
  border-radius: 9px;
  box-shadow: 0 2px 12px rgba(0,0,0,.25);
  width: 245px;
  max-width: calc(100vw - 70px);
  font: 13px Arial, sans-serif;
}

#map .research-control label {
  display: block;
  margin: 9px 0 4px;
  font-weight: 600;
}

#map .research-control select,
#map .research-control input[type="range"] {
  display: block;
  width: 100%;
  margin: 5px 0 10px;
  box-sizing: border-box;
}

#map .research-control select {
  padding: 7px;
  background: #fff;
  color: #172527;
  border: 1px solid #aab9b5;
  border-radius: 5px;
}

#map .research-control input[type="range"] {
  padding: 0;
  border: 0;
  background: transparent;
  accent-color: #288b67;
}

#map .research-control button {
  width: 100%;
  margin: 4px 0;
  padding: 8px;
  border-radius: 5px;
  font-size: 13px;
}

#map .research-control .tool-hint {
  font-size: 11px;
  line-height: 1.5;
  color: #53615e;
}

#map .leaflet-popup-content {
  color: #172527;
}

@media (max-width: 600px) {
  #map .research-control {
    width: 200px;
    padding: 9px;
  }
}