body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;margin:5%;background:var(--bg);color:#222}	
	
	.sub{color:#555;font-size:0.8em;text-align:right;margin:0 0 12px}
	


#map{height:650px;border:1px solid #dcdde1;border-radius:10px;margin:8px 0 14px;}





.legend{background:#fff;border:1px solid #e6e6e8;border-radius:8px;padding:8px;display:flex;gap:12px;flex-wrap:wrap}
	.legend .dot,.chip{width:12px;height:12px;border-radius:50%;border:1px solid #666;display:inline-block;}
	.card{background:#fff;border:1px solid #ebecef;border-radius:10px;padding:10px;margin:8px 0}
	.basemap{display:none}
	.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 6px;border:1px solid #e6e6e8;border-radius:999px;background:#fff;font-size:.95rem;margin-right:10px;}
	.badge .chip{width:15px;height:15px;border-color:#444;}
		.chip span{color:${color};}
	#profChip{background:#ccc;border-color:#444;}
	.reset {padding: 6px 12px;background: #d94733;color: white;border: none;border-radius: 6px;cursor: pointer;margin-top: 20px;font-size:1.1em;}
	.reset:hover {background:#333;}
	label {font-weight:600;padding-bottom:25px;font-size:1.2rem;}
	h3 {color:#d94733;font-weight:600}

@media (max-width: 768px) {
  .conteneur {
    flex-direction: column;
  display:flex;
	}
	.filters{display:flex;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e6e6e8;border-radius:10px;padding:12px;width:100%;margin-right:1%;margin-top:8px}

	h1 {color:#333;font-size:1.4em;margin:0 0 6px;font-weight:600;line-height:1em;}
	.titre-h1 span {line-height:0.3em!important; font-size:0.65em;font-weight:500;}
}
@media (min-width: 768px) {
  .conteneur {
  flex-direction: row;
  display:flex;
	}
	.filters{display:flex;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e6e6e8;border-radius:10px;padding:12px;width:30%;margin-right:1%;margin-top:8px}
	h1 {color:#333;font-size:2em;margin:0 0 6px;font-weight:600;line-height:1em;}
	.titre-h1 span {line-height:0.3em!important; font-size:0.65em;font-weight:500;}
	.map {width:90%;}
}