.odp-table { min-width: 1040px; }
.odp-table th:first-child,
.odp-table td:first-child { width: 36px; text-align: center; }
.odp-customer-count { display: inline-grid; place-items: center; min-width: 24px; height: 24px; margin-right: 8px; padding: 0 5px; border-radius: 999px; background: #e6f3f5; color: #176d86; font-size: 11px; font-weight: 850; }
.odp-map-link { color: #176d86; font-weight: 800; text-decoration: none; }
.odp-map-link:hover { text-decoration: underline; }
.odp-editor { max-width: 920px; margin: 0 auto; padding: 24px; }
.odp-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.odp-form-grid label { display: grid; align-content: start; gap: 7px; color: #37535b; font-weight: 750; }
.odp-form-grid input,
.odp-form-grid select { width: 100%; min-height: 46px; box-sizing: border-box; padding: 10px 12px; border: 1px solid #c5d8dc; border-radius: 7px; background: #fff; color: #173640; font: inherit; }
.odp-wide { grid-column: 1 / -1; }
.coordinate-link { justify-self: start; border: 0; background: none; color: #168ab4; cursor: pointer; font-size: 12px; font-weight: 850; }
.coordinate-link:hover { text-decoration: underline; }
.odp-toolbar > div:first-child { align-items: flex-start; }
.odp-manage { position: relative; margin-bottom: 10px; }
.odp-manage-toggle { min-height: 42px; background: #10a94e; border-color: #078f3e; color: #fff; font-weight: 850; }
.odp-manage-menu { position: absolute; z-index: 20; top: calc(100% + 2px); left: 0; min-width: 285px; overflow: hidden; border: 1px solid #c6d2d4; border-radius: 3px; background: #fff; box-shadow: 0 10px 24px rgba(20, 47, 54, .18); }
.odp-manage-menu button { display: block; width: 100%; padding: 13px 18px; border: 0; border-bottom: 1px solid #e2e9ea; background: #fff; color: #283f45; text-align: left; font: inherit; cursor: pointer; }
.odp-manage-menu button:last-child { border-bottom: 0; }
.odp-manage-menu button:hover { background: #f0f8f8; }
.odp-map-card { padding: 18px; }
.odp-map-filters { display: grid; grid-template-columns: 1.35fr .8fr .8fr; gap: 14px; margin-bottom: 16px; }
.odp-map-filters label { display: grid; gap: 7px; color: #38535b; font-size: 12px; font-weight: 800; }
.odp-map-filters select,
.odp-map-filters input { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #c5d6da; border-radius: 5px; background: #fff; color: #253d44; font: inherit; }
.odp-map-canvas { position: relative; min-height: 570px; overflow: hidden; border: 1px solid #bfd1d5; border-radius: 5px; background: linear-gradient(145deg,#d5e6dc,#b8d5db); }
.odp-map-canvas .map-grid { opacity: .65; }
.odp-map-canvas::after { position: absolute; inset: 0; content: ""; pointer-events: none; background: radial-gradient(circle at 75% 28%,#66a8a32e 0 9%,transparent 10%),radial-gradient(circle at 35% 65%,#72a66b30 0 12%,transparent 13%); }
.odp-map-pin { position: absolute; z-index: 3; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #e3433e; box-shadow: 0 0 0 7px #e3433e33,0 4px 11px #173f4a55; color: #fff; text-decoration: none; transform: translate(-50%,-50%); }
.odp-map-pin > span { font-size: 10px; font-weight: 900; }
.odp-map-pin > b { display: none; position: absolute; left: 24px; top: 28px; min-width: 190px; padding: 9px; border-radius: 5px; background: #fff; box-shadow: 0 6px 16px #173f4a36; color: #24434c; font-size: 12px; }
.odp-map-pin > b small { display: block; margin-top: 4px; color: #71878e; font-weight: 650; }
.odp-map-pin:hover > b,
.odp-map-pin:focus > b { display: block; }
.odp-map-pin[hidden] { display: none; }
.odp-map-empty { position: absolute; z-index: 2; left: 50%; top: 50%; padding: 14px 18px; border-radius: 5px; background: #ffffffdc; color: #526b72; font-weight: 750; transform: translate(-50%,-50%); }
.odp-map-compass { position: absolute; z-index: 2; right: 18px; top: 18px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; box-shadow: 0 3px 10px #173f4a33; color: #d4423d; font-weight: 900; }
.odp-map-legend { position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 16px; display: flex; justify-content: space-between; gap: 16px; padding: 11px 13px; border: 1px solid #c9d9dc; border-radius: 4px; background: #ffffffeb; color: #466068; }

@media (max-width: 700px) {
  .odp-editor { padding: 16px; }
  .odp-form-grid { grid-template-columns: 1fr; }
  .odp-wide { grid-column: auto; }
  .odp-map-filters { grid-template-columns: 1fr; }
  .odp-map-canvas { min-height: 480px; }
  .odp-map-legend { flex-direction: column; }
}