.msn-map-page{width:100%;font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#17243a}
.msn-map-page *{box-sizing:border-box}
.msn-map-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 24px;border-radius:18px;background:linear-gradient(135deg,#10233f,#1c4b7d);color:#fff;margin-bottom:16px;box-shadow:0 12px 28px rgba(16,35,63,.13)}
.msn-map-eyebrow{display:block;font-size:9px;letter-spacing:.15em;color:#d4ac58;font-weight:800}.msn-map-hero h2{margin:5px 0 7px;font-size:25px}.msn-map-hero p{margin:0;max-width:760px;color:#d6e0ed;font-size:11px;line-height:1.55}
.msn-map-kpis{display:flex;gap:8px}.msn-map-kpis>div{min-width:90px;padding:10px 12px;border-radius:11px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}.msn-map-kpis strong{display:block;font-size:18px}.msn-map-kpis span{display:block;font-size:8px;color:#dbe5f1;margin-top:2px}

.msn-map-card{background:#fff;border:1px solid #e3e9f1;border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(20,45,73,.05)}
.msn-map-toolbar{display:grid;grid-template-columns:minmax(250px,1.6fr) 1fr 1fr .8fr auto;gap:8px;padding:12px;border-bottom:1px solid #e6ebf2;background:#f8fafc}
.msn-map-toolbar input,.msn-map-toolbar select,.msn-map-toolbar button{height:38px;border:1px solid #d8e0ea;border-radius:9px;background:#fff;padding:0 10px;font-size:10px;color:#27364a;outline:none}
.msn-map-toolbar button{background:#10233f;color:#fff;border-color:#10233f;font-weight:700;cursor:pointer}.msn-map-search{position:relative}.msn-map-search span{position:absolute;left:11px;top:8px;color:#7b899c}.msn-map-search input{width:100%;padding-left:28px}
.msn-map-layout{display:grid;grid-template-columns:minmax(0,1fr) 345px;height:690px}.msn-map-canvas-wrap{position:relative;min-width:0}.msn-map-canvas-wrap #msnNationalMap{height:100%;width:100%;background:#eaf0f5}
.msn-map-side{overflow:auto;padding:18px;border-left:1px solid #e5eaf1;background:#fff}.msn-side-kicker{font-size:9px;letter-spacing:.12em;color:#b28735;font-weight:800;text-transform:uppercase}.msn-map-side h3{font-size:18px;line-height:1.25;margin:5px 0}.msn-map-side>p{font-size:10px;color:#758297;line-height:1.55}
.msn-side-stats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:15px 0}.msn-side-stats>div,.msn-side-card{padding:11px;border:1px solid #e7ecf2;border-radius:10px;background:#f8fafc}.msn-side-stats span,.msn-side-card span{display:block;font-size:8px;color:#7d899a}.msn-side-stats strong,.msn-side-card strong{display:block;font-size:17px;margin-top:3px}
.msn-side-note,.msn-side-source{padding:11px;border-radius:10px;background:#f5f7fa;color:#718094;font-size:9px;line-height:1.5;margin-top:11px}.msn-side-source{background:#fff9ea;color:#8a681f}
.msn-side-block{padding:12px 0;border-bottom:1px solid #edf1f5}.msn-side-block b{display:block;font-size:9px;color:#6f7d90;text-transform:uppercase;letter-spacing:.05em}.msn-side-block span{display:block;font-size:11px;font-weight:700;margin-top:4px}.msn-side-block small{display:block;font-size:9px;color:#7c899a;margin-top:2px}.msn-side-block p{font-size:10px;color:#647286;line-height:1.5;margin:5px 0 0}
.msn-side-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}.msn-side-actions a{display:inline-flex;align-items:center;min-height:34px;padding:0 10px;border-radius:8px;background:#173b67;color:#fff;text-decoration:none;font-size:9px;font-weight:800}.msn-side-actions a.wa{background:#238054}
.msn-map-legend{position:absolute;left:12px;bottom:12px;z-index:500;display:flex;gap:8px;flex-wrap:wrap;max-width:70%;padding:8px 10px;border-radius:9px;background:rgba(255,255,255,.93);box-shadow:0 3px 12px rgba(20,45,70,.12)}.msn-map-legend span{display:flex;align-items:center;gap:4px;font-size:8px;color:#59677a}.msn-map-legend i{width:8px;height:8px;border-radius:50%;display:inline-block}.msn-map-legend .planning{background:#315f9a}.msn-map-legend .investment{background:#a77824}.msn-map-legend .tourism{background:#2d7a62}.msn-map-legend .digital{background:#6555a7}.msn-map-legend .infrastructure{background:#9b4a4a}.msn-map-legend .government{background:#657386}
.msn-div-icon{background:transparent;border:0}.msn-div-icon span{display:block;width:17px;height:17px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--c);border:2px solid #fff;box-shadow:0 2px 7px rgba(0,0,0,.25)}.msn-div-icon span:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;left:4px;top:4px}
.msn-popup{font-family:Inter,system-ui,Arial;min-width:250px}.msn-popup-kicker{font-size:8px;color:#987024;text-transform:uppercase;letter-spacing:.06em}.msn-popup h4{font-size:13px;margin:3px 0 4px;color:#173b67}.msn-popup-meta{font-size:9px;color:#748195}.msn-popup-tags{display:flex;gap:5px;margin:8px 0}.msn-popup-tags span{font-size:8px;padding:3px 6px;border-radius:99px;background:#eef3f8;color:#53657b}.msn-popup-line{margin-top:7px}.msn-popup-line b{display:block;font-size:8px;color:#758297;text-transform:uppercase}.msn-popup-line span{display:block;font-size:9px;line-height:1.4;margin-top:2px}.msn-popup-actions{display:flex;gap:6px;margin-top:10px}.msn-popup-actions a{padding:6px 8px;border-radius:7px;background:#173b67;color:#fff;text-decoration:none;font-size:8px;font-weight:700}.msn-popup-actions a.wa{background:#238054}

@media(max-width:1050px){.msn-map-toolbar{grid-template-columns:1fr 1fr}.msn-map-layout{grid-template-columns:1fr;height:auto}.msn-map-canvas-wrap #msnNationalMap{height:560px}.msn-map-side{border-left:0;border-top:1px solid #e5eaf1}.msn-map-kpis{display:none}}
@media(max-width:650px){.msn-map-hero{align-items:flex-start}.msn-map-toolbar{grid-template-columns:1fr}.msn-map-canvas-wrap #msnNationalMap{height:470px}.msn-map-legend{max-width:90%}}

/* v0.2.75.5 multi-view map workspace */
.msn-map-viewbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid #e5eaf1;background:#fff}
.msn-view-tabs{display:flex;gap:6px;flex-wrap:wrap}.msn-view-tabs button{height:34px;padding:0 12px;border:1px solid #dbe3ed;border-radius:9px;background:#fff;color:#5f6f83;font-size:9px;font-weight:800;cursor:pointer}.msn-view-tabs button.active{background:#173b67;color:#fff;border-color:#173b67}.msn-basemap-switch{display:flex;align-items:center;gap:7px}.msn-basemap-switch span{font-size:9px;color:#758397}.msn-basemap-switch select{height:34px;border:1px solid #dbe3ed;border-radius:8px;background:#fff;padding:0 8px;font-size:9px;color:#405168}

.msn-map-workspace{display:grid;grid-template-columns:minmax(0,1fr) 345px;height:690px}.msn-map-directory{display:none;overflow:auto;background:#f7f9fc}
.msn-map-workspace[data-mode="map"]{grid-template-columns:minmax(0,1fr) 345px}.msn-map-workspace[data-mode="map"] .msn-map-directory{display:none}
.msn-map-workspace[data-mode="split"]{grid-template-columns:minmax(0,1.15fr) 330px 360px}.msn-map-workspace[data-mode="split"] .msn-map-directory{display:block}.msn-map-workspace[data-mode="split"] .msn-map-side{display:block}
.msn-map-workspace[data-mode="cards"]{display:block;height:auto}.msn-map-workspace[data-mode="cards"] .msn-map-canvas-wrap,.msn-map-workspace[data-mode="cards"] .msn-map-side{display:none}.msn-map-workspace[data-mode="cards"] .msn-map-directory{display:block;min-height:560px}
.msn-map-workspace[data-mode="focus"]{grid-template-columns:1fr}.msn-map-workspace[data-mode="focus"] .msn-map-side,.msn-map-workspace[data-mode="focus"] .msn-map-directory{display:none}.msn-map-workspace[data-mode="focus"] .msn-map-canvas-wrap{min-height:760px}

.msn-directory-head{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;border-bottom:1px solid #e5eaf1;background:#fff;position:sticky;top:0;z-index:2}.msn-directory-head span{display:block;font-size:8px;letter-spacing:.11em;color:#9b762d;font-weight:800}.msn-directory-head h3{margin:3px 0 0;font-size:15px}.msn-directory-head>strong{font-size:18px;color:#173b67}
.msn-directory-grid{display:grid;grid-template-columns:1fr;gap:9px;padding:12px}.msn-map-workspace[data-mode="cards"] .msn-directory-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding:16px}
.msn-opd-map-card{background:#fff;border:1px solid #e3e9f1;border-radius:12px;padding:12px;box-shadow:0 4px 12px rgba(22,48,76,.04)}.msn-card-top{display:flex;justify-content:space-between;gap:7px;align-items:center}.msn-card-top span{font-size:8px;color:#7a8798}.msn-card-top b{font-size:8px;color:#9a6d19;background:#fff5dc;padding:3px 6px;border-radius:999px}.msn-opd-map-card h4{font-size:11px;line-height:1.35;margin:8px 0 4px;color:#173b67}.msn-opd-map-card p{font-size:8px;color:#748195;margin:0}.msn-card-meta{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}.msn-card-meta span{font-size:8px;padding:3px 6px;border-radius:6px;background:#f1f4f8;color:#5f6e81}.msn-card-actions{display:flex;gap:5px;flex-wrap:wrap}.msn-card-actions button,.msn-card-actions a{height:29px;display:inline-flex;align-items:center;padding:0 8px;border-radius:7px;border:1px solid #cfdbe8;background:#fff;color:#184a79;text-decoration:none;font-size:8px;font-weight:800;cursor:pointer}.msn-card-actions a.wa{background:#238054;color:#fff;border-color:#238054}.msn-directory-empty{padding:30px;text-align:center;color:#8996a6;font-size:10px}
@media(max-width:1250px){.msn-map-workspace[data-mode="split"]{grid-template-columns:1fr 330px}.msn-map-workspace[data-mode="split"] .msn-map-side{display:none}.msn-map-workspace[data-mode="cards"] .msn-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.msn-map-viewbar{align-items:flex-start;flex-direction:column}.msn-map-workspace,.msn-map-workspace[data-mode="map"],.msn-map-workspace[data-mode="split"]{grid-template-columns:1fr;height:auto}.msn-map-workspace[data-mode="split"] .msn-map-directory{display:block}.msn-map-workspace[data-mode="cards"] .msn-directory-grid{grid-template-columns:1fr}.msn-map-workspace[data-mode="focus"] .msn-map-canvas-wrap{min-height:560px}}

/* v0.2.76 rich popup + full scrollable OPD profile */
.msn-map-workspace[data-mode="map"]{grid-template-columns:minmax(0,1fr) 430px}
.msn-map-workspace[data-mode="split"]{grid-template-columns:minmax(0,1.1fr) 410px 340px}
.msn-map-side{padding:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b9c4d1 #f2f5f8}
.msn-map-side::-webkit-scrollbar{width:8px}.msn-map-side::-webkit-scrollbar-track{background:#f2f5f8}.msn-map-side::-webkit-scrollbar-thumb{background:#b9c4d1;border-radius:99px}

.msn-side-profile{min-height:100%;background:#fff}
.msn-side-photo{position:relative;width:100%;aspect-ratio:16/9;background:#edf2f6;overflow:hidden}
.msn-side-photo img{width:100%;height:100%;display:block;object-fit:cover}
.msn-side-photo span{position:absolute;left:10px;bottom:10px;right:10px;padding:6px 8px;border-radius:7px;background:rgba(10,25,45,.68);color:#fff;font-size:8px;line-height:1.4}
.msn-side-photo.broken:after{content:"Foto kantor belum dapat ditampilkan";position:absolute;inset:0;display:grid;place-items:center;background:#f5f7fa;color:#8591a0;font-size:10px}
.msn-side-photo.broken img{display:none}
.msn-side-photo-empty{aspect-ratio:16/7;background:linear-gradient(135deg,#edf2f7,#f7f9fb);display:grid;place-items:center;text-align:center;color:#8492a4}
.msn-side-photo-empty span{font-size:28px}.msn-side-photo-empty b{display:block;font-size:9px;margin-top:-18px}

.msn-side-profile-head{padding:16px 17px 14px;border-bottom:1px solid #edf1f5}
.msn-side-profile-head h3{font-size:18px;line-height:1.3;margin:5px 0 5px;color:#15395f}
.msn-side-profile-head p{font-size:10px;color:#758397;margin:0}
.msn-side-badges{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}
.msn-side-badges span{font-size:8px;padding:4px 7px;border-radius:999px;background:#eef3f8;color:#53657a;font-weight:800}

.msn-side-section{padding:14px 17px;border-bottom:1px solid #edf1f5}
.msn-side-section h4{margin:0 0 9px;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#506177}
.msn-side-section>p{margin:0;font-size:10px;color:#606f82;line-height:1.65}
.msn-side-contact-section{background:#fbfcfe}.msn-side-marketing{background:#fffaf0}
.msn-side-data{display:grid;gap:8px}.msn-side-data>div{display:grid;grid-template-columns:105px minmax(0,1fr);gap:8px;align-items:start}
.msn-side-data b{font-size:8px;color:#8894a4;text-transform:uppercase;letter-spacing:.04em}
.msn-side-data span{font-size:10px;color:#34465d;line-height:1.45;word-break:break-word}.msn-side-data a{color:#1b568c;text-decoration:none}
.msn-side-text-link{display:inline-flex;margin-top:10px;font-size:9px;color:#1a568b;text-decoration:none;font-weight:800}
.msn-source-links{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.msn-source-links a{font-size:8px;text-decoration:none;color:#52677e;background:#f1f4f8;border-radius:6px;padding:5px 7px}
.msn-side-actions-sticky{position:sticky;bottom:0;z-index:3;margin:0;padding:12px 17px;background:rgba(255,255,255,.96);border-top:1px solid #e6ebf2;backdrop-filter:blur(8px)}

.msn-popup-rich{min-width:285px;max-width:330px}
.msn-popup-photo{width:calc(100% + 24px);height:140px;margin:-12px -12px 10px;overflow:hidden;background:#edf2f6;border-radius:8px 8px 0 0;position:relative}
.msn-popup-photo img{width:100%;height:100%;object-fit:cover;display:block}
.msn-popup-photo.broken:after{content:"Foto kantor belum dapat ditampilkan";position:absolute;inset:0;display:grid;place-items:center;color:#8190a2;font-size:9px;background:#f4f7fa}
.msn-popup-photo.broken img{display:none}
.msn-popup-summary{font-size:9px;line-height:1.5;color:#59697b;margin:8px 0;padding:8px;background:#f7f9fb;border-radius:7px}
.msn-popup-actions a.web{background:#6b7788}

@media(max-width:1250px){
 .msn-map-workspace[data-mode="map"]{grid-template-columns:minmax(0,1fr) 390px}
 .msn-map-workspace[data-mode="split"]{grid-template-columns:1fr 380px}
}
@media(max-width:800px){
 .msn-map-workspace[data-mode="map"],.msn-map-workspace[data-mode="split"]{grid-template-columns:1fr}
 .msn-map-side{max-height:680px}
 .msn-side-data>div{grid-template-columns:90px minmax(0,1fr)}
}

/* v0.2.76.5 Kabupaten/Kota hover label */
.leaflet-tooltip.msn-region-hover-tooltip{
  background:#102b4e;
  color:#fff;
  border:0;
  border-radius:7px;
  box-shadow:0 5px 16px rgba(16,43,78,.20);
  padding:6px 9px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.01em;
  white-space:nowrap;
}
.leaflet-tooltip-top.msn-region-hover-tooltip:before{
  border-top-color:#102b4e;
}

/* v0.2.76.6 stronger Kabupaten/Kota hover tooltip */
.leaflet-tooltip.msn-region-hover-tooltip{
  background:#0f2d50 !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:8px !important;
  box-shadow:0 7px 20px rgba(13,40,70,.28) !important;
  padding:7px 10px !important;
  font-size:11px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  opacity:1 !important;
  pointer-events:none !important;
  z-index:10000 !important;
}
.leaflet-tooltip.msn-region-hover-tooltip strong{color:#fff !important;font-weight:800 !important}
.leaflet-tooltip-top.msn-region-hover-tooltip:before{border-top-color:#0f2d50 !important}