/* ══════════════════════════════════════════════════════════════════════
   /peta-masalah — ruang kerja Atlas Masalah
   ══════════════════════════════════════════════════════════════════════
   Lembar KEDUA. Yang pertama, peta-masalah.css, memuat kerangka situs
   (token, header, menu ponsel) dan dipinjam /atlas; ia sengaja tidak
   disentuh supaya tata letak modul ini bisa berubah tanpa menggeser
   halaman lain satu piksel pun.

   SATU VIEWPORT, DUA RUANG. Peta di kiri, data di kanan, dan halaman ini
   satu-satunya di situs yang tidak bergulir sebagai halaman: yang bergulir
   isi panel, bukan badan. Dua scrollbar yang bersaing membuat pengguna
   kehilangan konteks, dan di ponsel peta yang panjang akan mendorong
   seluruh daftar bukti keluar layar.

   DI PONSEL KEDUA RUANG BERGANTIAN, bukan bertumpuk. Kontrol bawah berada
   di luar ruang gulir, di atas safe area, dan tidak pernah menutupi legenda
   atau data.

   WARNA TIDAK PERNAH MEMBAWA ARTI SENDIRIAN: "anggota sebagian" diarsir,
   "tanpa catatan" diarsir, dan tiap keadaan juga tertulis di legenda serta
   di aria-label tiap bentuk.
   ══════════════════════════════════════════════════════════════════════ */

:root{
  --pm-anggota:#9dbc8d;
  --pm-anggota-redup:#dde5d3;
  --pm-ada-temuan:#74965f;
  --pm-peta-kosong:#ecefe4;
  --pm-peta-garis:#c6d2bb;
  --pm-peta-luar:#dde3d4;
  --pm-peta-latar:#eef2e8;
  --pm-terpilih:#b85c2e;
  --pm-peta-tepi:#fbfcf7;
  --pm-panel:#fffdf8;
  --pm-samar:#6f7a6e;
}

.pm-body{
  min-height:100vh;
  min-height:100dvh;
  height:100dvh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.pm-body > header{flex:none;position:static}
.pm-noscript{width:min(1180px,calc(100% - 48px));margin:24px auto;font-size:15px}

/* ── bilah alat ───────────────────────────────────────────────────── */
.pm-toolbar{
  flex:none;
  display:flex;
  align-items:center;
  gap:24px;
  padding:12px 26px;
  background:var(--white);
  border-bottom:1px solid var(--line);
  position:relative;
  z-index:12;
}
.pm-cari-kotak{position:relative;width:320px;flex:none}
.pm-cari-kotak input{
  width:100%;height:44px;padding:10px 12px 10px 34px;
  border:1px solid var(--line-strong);border-radius:6px;background:var(--paper);
  font-size:14px;color:inherit;
}
.pm-cari-tanda{position:absolute;left:11px;top:8px;font-size:20px;color:var(--muted);pointer-events:none}
.pm-cari-hasil{
  position:absolute;top:50px;left:0;right:0;max-height:min(60vh,400px);overflow:auto;
  border:1px solid var(--line);border-radius:8px;background:var(--white);
  box-shadow:0 16px 40px rgba(19,44,35,.16);padding:6px;z-index:40;
}
.pm-cari-baris{
  display:block;width:100%;border:0;background:none;padding:10px;text-align:left;
  border-radius:5px;font-size:14px;min-height:44px;
}
.pm-cari-baris:hover,.pm-cari-baris:focus-visible{background:var(--wash)}
.pm-cari-baris small{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.pm-cari-kosong{padding:14px;font-size:13.5px;color:var(--muted)}

.pm-jejak{flex:1;min-width:0}
.pm-jejak ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0;padding:0}
.pm-jejak li{display:flex;align-items:center;gap:8px;font-size:13px}
.pm-jejak li + li::before{content:"/";color:var(--line-strong)}
.pm-jejak button{
  border:0;background:none;padding:0;font-size:13px;color:var(--green);
  text-decoration:underline;text-underline-offset:4px;min-height:30px;
}
.pm-jejak [aria-current]{color:var(--ink);font-weight:600}

/* Siapa yang dapat ruang lebar: peta (bawaan) atau panel data. Membaca
   temuan butuh lebar; menavigasi butuh peta. Pola dan alasannya sama dengan
   #tataRuang di /atlas-demografi. */
.pm-tata{
  flex:none;min-height:34px;padding:5px 11px;
  border:1px solid var(--line-strong);border-radius:7px;background:var(--white);
  font:650 11.5px/1.3 var(--sans);color:var(--green);white-space:nowrap;
}
.pm-tata:hover{background:var(--wash)}
.pm-tata[aria-pressed=true]{background:var(--ok-soft);border-color:#b9ceab}

.pm-topik{display:flex;align-items:center;gap:9px;flex:none}
.pm-topik label{font-size:12.5px;color:var(--muted);white-space:nowrap}
.pm-topik select{
  max-width:230px;border:1px solid var(--line-strong);border-radius:6px;
  padding:9px 10px;font-size:13.5px;background:var(--white);height:42px;color:inherit;
}

/* ── ruang kerja ──────────────────────────────────────────────────── */
/* TIGA KOLOM: peta, pemisah, panel. Lebar panel hidup di satu variabel, dan
   itulah satu-satunya tempat yang mengaturnya — tombol "Perbesar panel data"
   dan seretan pemisah menulis ke variabel yang sama, jadi keduanya tidak
   pernah berselisih tentang siapa yang sedang lebar. */
.pm-ruang{
  flex:1;min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto var(--pm-panel-lebar,415px);
}
.pm-pemisah{
  width:9px;flex:none;cursor:col-resize;background:var(--line);
  border:0;padding:0;position:relative;touch-action:none;
}
.pm-pemisah::before{
  content:"";position:absolute;inset:0 -5px;
}
.pm-pemisah span{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:3px;height:34px;border-radius:99px;background:var(--line-strong);
}
.pm-pemisah:hover,.pm-pemisah[data-seret=ya]{background:var(--pm-anggota)}
.pm-pemisah:hover span,.pm-pemisah[data-seret=ya] span{background:var(--green)}
.pm-pemisah:focus-visible{outline:3px solid var(--orange);outline-offset:-2px}
.pm-peta-area{
  display:flex;flex-direction:column;min-width:0;min-height:0;
  background:var(--pm-peta-latar);border-right:1px solid var(--line);
}
.pm-peta-kepala{
  display:flex;justify-content:space-between;align-items:flex-start;gap:20px;
  padding:20px 26px 10px;flex:none;
}
.pm-peta-kepala h1{font-size:clamp(22px,2.4vw,28px);font-weight:650;margin-top:6px}
.pm-sub{font-size:12.5px;color:var(--pm-samar);margin-top:6px}
.pm-segmen{
  display:flex;border:1px solid var(--line-strong);background:var(--white);
  border-radius:6px;padding:3px;align-items:center;flex:none;
}
.pm-segmen button{
  border:0;background:none;border-radius:4px;padding:8px 12px;font-size:12.5px;
  min-height:36px;color:var(--muted);white-space:nowrap;
}
.pm-segmen button[aria-pressed=true]{background:var(--green);color:#fff;font-weight:600}

.pm-peta-kendali{display:flex;align-items:center;gap:10px;padding:0 26px 14px;flex:none;flex-wrap:wrap}
.pm-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid var(--line-strong);border-radius:6px;background:var(--white);
  color:inherit;font-size:13px;padding:8px 12px;min-height:38px;
}
.pm-btn:hover:not(:disabled){background:var(--wash)}
.pm-btn:disabled{opacity:.42;cursor:default}
.pm-naik{font-size:17px;padding:8px 13px}
.pm-lensa{display:flex;flex-wrap:wrap;gap:6px}
.pm-lensa button{
  border:1px solid var(--line-strong);border-radius:5px;background:var(--white);
  padding:8px 12px;font-size:12px;color:var(--muted);min-height:38px;
}
.pm-lensa button[aria-pressed=true]{
  background:#dde8d2;border-color:#8ca67a;color:var(--green);font-weight:650;
}
.pm-label-saklar{
  margin-left:auto;display:flex;align-items:center;gap:6px;
  font-size:12px;color:var(--muted);white-space:nowrap;
}
.pm-label-saklar input{accent-color:var(--green);width:16px;height:16px}

/* ── panggung peta ────────────────────────────────────────────────── */
.pm-panggung{
  flex:1;min-height:120px;position:relative;margin:0 18px;
  border:1px solid var(--line);border-radius:8px;overflow:hidden;
  background-color:#f1f4eb;
  background-image:radial-gradient(rgba(200,212,191,.5) .75px,transparent .75px);
  background-size:18px 18px;
  touch-action:none;
}
.pm-peta{width:100%;height:100%;display:block;cursor:grab}
.pm-peta:active{cursor:grabbing}
.pm-area{
  fill:var(--pm-peta-luar);stroke:var(--pm-peta-tepi);stroke-width:1.4;
  vector-effect:non-scaling-stroke;
}
.pm-area.luar{fill:var(--pm-peta-luar)}
.pm-area.anggota{fill:var(--pm-anggota)}
.pm-area.sebagian{fill:url(#pmArsirSebagian)}
.pm-area.ada-temuan{fill:var(--pm-ada-temuan)}
.pm-area.tanpa-temuan{fill:url(#pmArsirKosong)}
.pm-area.terpilih{fill:var(--pm-terpilih);stroke:#fff8ec;stroke-width:2.2}
.pm-sorotan{fill:none;stroke:#2b543c;stroke-width:2.6;vector-effect:non-scaling-stroke;pointer-events:none}
.pm-tautan{cursor:pointer}
.pm-tautan:hover .pm-area,.pm-tautan:focus .pm-area{stroke:#2b543c;stroke-width:2.6;filter:brightness(.95)}
.pm-tautan:focus{outline:none}
.pm-tautan:focus-visible .pm-area{stroke:var(--orange);stroke-width:3.4}
.pm-label{
  font-family:var(--sans);fill:#3f5836;paint-order:stroke;stroke:#f2f6eb;
  stroke-linejoin:round;pointer-events:none;text-anchor:middle;dominant-baseline:middle;
}
.pm-label.aktif{fill:#fffaf0;stroke:#8e4522}
.pm-arah{
  position:absolute;right:18px;top:14px;font:11px var(--mono);color:var(--pm-samar);
  text-align:center;pointer-events:none;margin:0;
}
.pm-arah b{font-size:21px;display:block;line-height:1.1;font-weight:400}
.pm-stempel{
  position:absolute;left:16px;bottom:14px;font:9.5px var(--mono);
  letter-spacing:.08em;color:#7d8a73;pointer-events:none;margin:0;
}
.pm-kartu-sorot{
  position:absolute;top:14px;left:14px;max-width:calc(100% - 96px);
  background:rgba(255,253,248,.95);backdrop-filter:blur(6px);
  border:1px solid var(--line);border-radius:6px;padding:9px 13px;
  pointer-events:none;box-shadow:0 6px 20px rgba(41,67,31,.08);
}
.pm-kartu-sorot b{font-size:13px;display:block}
.pm-kartu-sorot span{font-size:11px;color:var(--muted)}
.pm-status-peta{
  position:absolute;inset:auto 14px 14px 14px;max-width:420px;
  background:var(--white);border:1px solid var(--line-strong);border-radius:8px;
  padding:14px 16px;font-size:13px;box-shadow:0 10px 30px rgba(19,44,35,.12);
}
.pm-status-peta p + p,.pm-status-peta .pm-btn{margin-top:8px}
.pm-status-ket{color:var(--muted);font-size:12.5px}
.pm-zoom{
  position:absolute;right:14px;bottom:14px;display:flex;flex-direction:column;
  background:var(--white);border:1px solid var(--line-strong);border-radius:6px;
  overflow:hidden;box-shadow:0 4px 10px rgba(46,75,37,.08);
}
.pm-zoom button{
  width:40px;height:38px;border:0;background:none;border-bottom:1px solid var(--line);
  font-size:19px;color:var(--green);
}
.pm-zoom button:last-child{border-bottom:0;font-size:16px}
.pm-zoom button:hover:not(:disabled){background:var(--wash)}
.pm-zoom button:disabled{opacity:.38;cursor:default}

/* ── daftar wilayah (setara peta untuk papan ketik) ───────────────── */
.pm-daftar-wilayah{
  flex:1;min-height:0;overflow:auto;margin:0 18px;
  border:1px solid var(--line);background:var(--white);border-radius:8px;
}
.pm-baris-wilayah{
  display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;
  padding:12px 16px;text-align:left;border:0;background:none;
  border-bottom:1px solid var(--wash);font-size:13.5px;min-height:52px;
}
.pm-baris-wilayah small{display:block;font-size:11.5px;color:var(--muted);margin-top:3px}
.pm-baris-wilayah:hover{background:var(--wash)}
.pm-baris-wilayah[aria-pressed=true]{background:#e3ecda}
.pm-panah{color:#78906b}
.pm-daftar-kosong{padding:20px;font-size:13.5px;color:var(--muted)}

/* ── kaki peta ────────────────────────────────────────────────────── */
.pm-peta-kaki{padding:12px 26px 14px;flex:none}
.pm-legenda{display:flex;align-items:center;gap:15px;flex-wrap:wrap;font-size:11.5px;color:#5e7256}
.pm-legenda > span{display:flex;align-items:center;gap:6px}
.pm-contoh{
  display:inline-block;width:11px;height:11px;border:1px solid #a5b898;border-radius:2px;
  background:var(--pm-peta-luar);
}
.pm-contoh.anggota{background:var(--pm-anggota)}
.pm-contoh.ada-temuan{background:var(--pm-ada-temuan)}
.pm-contoh.terpilih{background:var(--pm-terpilih);border-color:#a3542b}
.pm-contoh.sebagian,.pm-contoh.tanpa-temuan{
  background:repeating-linear-gradient(45deg,var(--pm-anggota-redup) 0 3px,var(--pm-anggota) 3px 4.4px);
}
.pm-contoh.tanpa-temuan{
  background:repeating-linear-gradient(45deg,var(--pm-peta-kosong) 0 3px,var(--pm-peta-garis) 3px 4px);
}
.pm-peta-ket{font-size:11.5px;color:#73846c;margin-top:8px;line-height:1.55;max-width:96ch}

/* ── panel data ───────────────────────────────────────────────────── */
.pm-panel{display:flex;flex-direction:column;min-height:0;min-width:0;background:var(--pm-panel)}
.pm-panel-kepala{padding:20px 22px 18px;border-bottom:1px solid var(--line);flex:none}
.pm-panel-kepala h2{font-size:clamp(22px,2.2vw,28px);font-weight:650;margin:6px 0 4px}
.pm-panel-meta{font-size:12.5px;color:var(--muted)}
.pm-pemilih{display:grid;grid-template-columns:1fr 1.05fr;gap:10px;margin-top:16px}
.pm-pemilih label{font-size:11.5px;display:block;color:var(--muted);margin-bottom:4px}
.pm-pemilih select{
  width:100%;min-width:0;height:40px;font-size:13px;padding:8px;color:inherit;
  border:1px solid var(--line-strong);background:var(--white);border-radius:5px;
}
.pm-baris-anggota{display:flex;align-items:center;gap:7px;font-size:11.5px;color:#55714a;margin-top:13px}
.pm-titik{width:7px;height:7px;border-radius:50%;background:var(--pm-ada-temuan);flex:none}

/* KEPALA BOLEH PERGI, TAB TIDAK.
 *
 * Sebelumnya kepala panel (eyebrow, judul, meta, dua pemilih, baris anggota)
 * dan baris tab keduanya berlabuh permanen: di 1440×1000 keduanya memakan
 * ±250 px dari tinggi panel, menyisakan jendela sempit untuk temuan yang
 * batas pembacaannya saja bisa lima baris. Sekarang yang bergulir SELURUH
 * isi panel, dan hanya baris tab yang berlabuh — berpindah Temuan/Cakupan
 * dari posisi bawah tidak boleh menuntut gulir balik ke atas dulu.
 *
 * Latarnya WAJIB pekat: yang lewat di bawahnya kartu temuan, bukan ruang
 * kosong. Kakinya tetap di luar ruang gulir, sebab di situlah jalan keluar
 * dari saringan lokasi. */
.pm-tab{
  display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line);
  padding:0 22px;flex:none;position:sticky;top:0;z-index:5;background:var(--pm-panel);
}
.pm-nama-dok{
  margin-left:auto;font-size:12px;font-weight:650;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40%;
}
.pm-tabpanel{padding:18px 22px 24px}
/* Apa pun yang digulirkan ke dalam pandangan harus berhenti DI BAWAH baris tab
   yang berlabuh, bukan di belakangnya. Tanpa ini, menekan tombol temuan ke-7
   menggulirkan kartunya tepat ke bawah bilah yang menutupinya. */
.pm-tabpanel [id],.pm-tabpanel > *{scroll-margin-top:60px}
.pm-tab [role=tablist]{display:flex;gap:18px}
.pm-tab button{
  border:0;background:none;border-bottom:2px solid transparent;font-size:13px;
  padding:13px 0;color:var(--muted);min-height:44px;
}
.pm-tab button[aria-selected=true]{color:var(--green);border-color:var(--green);font-weight:650}
.pm-sumber-buka{margin-left:auto;font-size:12px;text-decoration:underline;text-underline-offset:4px}
/* Begitu nama dapil ikut berlabuh, dialah yang mendorong; tombol Sumber
   cukup berjarak tetap supaya keduanya tidak saling menempel. */
.pm-nama-dok:not([hidden]) ~ .pm-sumber-buka{margin-left:14px}

.pm-panel-gulir{
  padding:0;overflow:auto;flex:1;min-height:0;
  scrollbar-width:thin;overscroll-behavior:contain;
}
.pm-catatan{
  font-size:12.5px;line-height:1.65;background:var(--warn-soft);border:1px solid #e5d9b8;
  border-radius:5px;color:var(--warn-ink);padding:12px 13px;margin-bottom:14px;
}
.pm-catatan b{display:block;margin-bottom:4px}
.pm-catatan p + p{margin-top:6px}
.pm-saring-lokasi{
  font-size:12.5px;background:var(--wash);border:1px solid var(--line);border-radius:5px;
  padding:9px 11px;margin-bottom:12px;display:flex;align-items:center;
  justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.pm-saring-lokasi button{border:0;background:none;font-size:12.5px;text-decoration:underline;min-height:32px}
.pm-ringkas-topik{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.pm-ringkas-topik h3{font-size:16px;font-weight:650}
.pm-cacah{
  background:var(--ok-soft);color:#4e6a3f;font:11px var(--mono);
  border-radius:4px;padding:4px 7px;white-space:nowrap;
}
.pm-pindah-temuan{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:15px}
.pm-pindah-temuan button{
  border:1px solid var(--line);background:var(--white);border-radius:5px;
  min-width:34px;height:32px;font-size:11.5px;color:var(--muted);
}
.pm-pindah-temuan button[aria-pressed=true]{background:var(--green);color:#fff;border-color:var(--green)}

.pm-jenis{font-size:11.5px;color:#7b866d;margin-bottom:8px}
.pm-pernyataan{font-size:16px;line-height:1.72}
.pm-lokasi-temuan{
  display:flex;align-items:baseline;gap:6px;margin-top:12px;
  font-size:12px;color:#9d5530;line-height:1.5;
}
.pm-lokasi-temuan button{
  border:0;background:none;padding:0;font-size:12px;color:inherit;
  text-decoration:underline;text-underline-offset:3px;text-align:left;
}
.pm-lokasi-temuan .pm-tanda{flex:none}
.pm-batas{
  margin-top:18px;padding:14px 16px;border-radius:5px;
  background:var(--warn-soft);border-left:3px solid #b49355;
}
.pm-batas h3,.pm-konteks h3{font-size:12.5px;margin-bottom:7px}
.pm-batas ul,.pm-konteks ul{padding-left:18px;margin:0;font-size:12.5px;line-height:1.7}
.pm-batas li + li,.pm-konteks li + li{margin-top:6px}
.pm-konteks{margin-top:16px;color:#52604f}
.pm-teknis{margin-top:14px;border-top:1px solid var(--line)}
.pm-teknis summary{padding:12px 0;font-size:12.5px;font-weight:650}
.pm-teknis dl{font-size:12.5px;margin:0 0 16px}
.pm-teknis dt{font-weight:650;margin-top:11px;text-transform:capitalize}
.pm-teknis dd{margin:3px 0;color:var(--muted);overflow-wrap:anywhere}
.pm-sidik-penuh{font-family:var(--mono);font-size:11px}
.pm-kaki-temuan{
  border-top:1px solid var(--line);padding-top:14px;margin-top:12px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.pm-kaki-temuan .pm-btn{font-size:12px}
.pm-sidik{font:10px var(--mono);color:#8d9683}

.pm-kosong{padding:22px 18px;border:1px solid var(--line);border-radius:6px;background:var(--wash)}
.pm-kosong h3{font-size:16px;margin-bottom:8px}
.pm-kosong p{font-size:13px;color:var(--muted);line-height:1.65}
.pm-kosong .pm-btn{margin-top:14px}

.pm-cakupan h3{font-size:15px;margin:18px 0 8px}
.pm-cakupan h3:first-child{margin-top:0}
.pm-cakupan p{font-size:12.5px;color:var(--muted);line-height:1.75}
.pm-cakupan ul{font-size:12.5px;line-height:1.7;padding-left:18px;margin:0}
.pm-cakupan li{margin-bottom:6px}
.pm-anggota li{color:var(--ink)}
.pm-tingkat-anggota{display:block;font-size:11px;color:var(--muted)}
.pm-tanpa-kode{color:var(--warn-ink)}
.pm-peringatan{
  background:var(--warn-soft);border:1px solid #e8dcc2;border-radius:4px;
  padding:11px 13px;color:var(--warn-ink);margin-top:10px;
}
.pm-catatan-cakupan ul{margin-top:6px}
.pm-cakupan-peta{margin-top:10px}

.pm-panel-kaki{
  padding:11px 22px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);
  flex:none;background:var(--paper);display:flex;align-items:center;
  justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.pm-panel-kaki button{
  border:0;background:none;padding:0;color:var(--green);
  text-decoration:underline;font-size:11.5px;min-height:30px;
}

/* ── kendali ponsel & kaki halaman ────────────────────────────────── */
.pm-kendali-ponsel{display:none}
.pm-kaki-halaman{
  flex:none;display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:8px 26px;font-size:11px;color:#7a866e;background:var(--paper);
  border-top:1px solid var(--line);
  padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));
}
.pm-kaki-halaman a{white-space:nowrap}

/* ── kabar & dialog ───────────────────────────────────────────────── */
.pm-kabar{
  position:fixed;bottom:max(22px,env(safe-area-inset-bottom,0px));left:50%;
  transform:translateX(-50%);background:var(--night);color:#fff;padding:12px 20px;
  border-radius:8px;max-width:calc(100% - 32px);z-index:200;font-size:13px;line-height:1.5;
  box-shadow:0 10px 30px rgba(19,44,35,.3);
}
.pm-dialog{
  width:min(680px,calc(100% - 28px));max-height:85dvh;overflow:auto;
  background:var(--white);color:var(--ink);border:1px solid var(--line);
  border-radius:10px;padding:24px;
}
.pm-dialog::backdrop{background:rgba(21,43,36,.42);backdrop-filter:blur(2px)}
.pm-dialog-kepala{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.pm-dialog-kepala h2{font-size:clamp(20px,2.4vw,25px);margin:6px 0 0}
.pm-tutup{
  border:1px solid var(--line);background:var(--white);border-radius:6px;
  width:40px;height:40px;font-size:20px;line-height:1;flex:none;
}
.pm-dialog-isi h3{font-size:14.5px;margin:20px 0 6px}
.pm-dialog-isi p,.pm-dialog-isi li{font-size:13px;line-height:1.75;color:var(--muted)}
.pm-dialog-isi a{color:var(--green)}
.pm-dialog-isi code{font-family:var(--mono);font-size:12px}
.pm-sumber-kecil{font-size:12px}
.pm-sumber-tambahan ul{margin:6px 0 0;padding-left:18px}
.pm-dialog-salin .pm-dialog-ket{font-size:13px;color:var(--muted);margin:10px 0}
.pm-dialog-salin textarea{
  width:100%;height:min(48vh,300px);font:12.5px/1.7 var(--mono);padding:12px;
  border:1px solid var(--line);border-radius:6px;background:var(--paper);color:inherit;
}

/* ── layar sempit: peta dan data bergantian ───────────────────────── */
@media (max-width:1150px){
  /* Pita edisi disembunyikan di ambang yang sama, tapi aturannya tinggal di
   * peta-masalah.css — di sana ia menjaga /atlas juga. */
  .pm-ruang{--pm-panel-lebar:360px}
  .pm-toolbar{gap:14px;padding-left:18px;padding-right:18px}
  .pm-cari-kotak{width:240px}
  .pm-topik label{display:none}
  .pm-topik select{max-width:180px}
  .pm-peta-kepala,.pm-peta-kendali,.pm-peta-kaki{padding-left:18px;padding-right:18px}
  .pm-panggung,.pm-daftar-wilayah{margin:0 14px}
  .pm-panel-kepala,.pm-panel-kaki,.pm-tabpanel{padding-left:18px;padding-right:18px}
  .pm-tab{padding:0 18px}
  .pm-label-saklar{display:none}
}

@media (max-width:800px){
  .pm-ruang{display:block;position:relative;overflow:hidden}
  .pm-peta-area{height:100%;border-right:0}
  .pm-panel{display:none;height:100%}
  .pm-body.pm-panel-terbuka .pm-panel{display:flex}
  .pm-body.pm-panel-terbuka .pm-peta-area{display:none}
  .pm-toolbar{padding:9px 16px;flex-wrap:wrap;gap:8px 12px}
  .pm-cari-kotak{flex:1;width:auto;min-width:150px}
  .pm-cari-kotak input{height:42px;font-size:13px}
  .pm-topik{width:158px;flex:none}
  .pm-topik select{width:100%;max-width:none;height:42px;font-size:12.5px}
  .pm-jejak{order:3;flex-basis:100%}
  .pm-jejak li,.pm-jejak button{font-size:12px}
  /* Di ponsel peta dan panel sudah bergantian lewat tombol Peta/Data;
     "Perbesar panel data" tidak punya arti di sana. */
  .pm-tata,.pm-pemisah{display:none}
  .pm-kendali-ponsel{
    display:flex;flex:none;gap:8px;padding:9px 16px;background:var(--white);
    border-top:1px solid var(--line);position:relative;z-index:15;
  }
  .pm-kendali-ponsel button{
    flex:1;border:1px solid var(--line-strong);border-radius:6px;background:var(--white);
    padding:10px 12px;min-height:46px;font-size:14px;color:inherit;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .pm-kendali-ponsel button[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
  .pm-peta-kepala{padding:15px 16px 10px}
  /* Satu baris, bukan dua: "ATLAS MASALAH / JELAJAH SPASIAL" yang membungkus
     memakan ~16 px tinggi kanvas peta di layar yang petanya sudah paling
     sempit. Dipendekkan hurufnya, bukan dihapus teksnya. */
  .pm-peta-kepala .eyebrow{font-size:9px;letter-spacing:.1em;white-space:nowrap}
  .pm-peta-kendali{padding:0 16px 11px;gap:6px}
  .pm-panggung,.pm-daftar-wilayah{margin:0 12px}
  .pm-peta-kaki{padding:11px 16px 12px}
  .pm-legenda{font-size:10.5px;gap:10px}
  .pm-peta-ket{font-size:10.5px;margin-top:6px}
  .pm-stempel{font-size:8px;left:12px;bottom:10px}
  .pm-zoom{right:10px;bottom:10px}
  .pm-zoom button{width:36px;height:35px}
  .pm-arah{right:12px;top:10px;font-size:9.5px}
  .pm-arah b{font-size:18px}
  .pm-panel-kepala{padding:16px 18px}
  .pm-tabpanel{padding:16px 18px 22px}
  .pm-tab{padding:0 18px;gap:14px}
  .pm-panel-kaki{padding:10px 18px}
  .pm-kaki-halaman{padding:7px 16px;font-size:10px}
  .pm-kaki-halaman a{display:none}
  .pm-kartu-sorot{max-width:calc(100% - 72px);left:10px;top:10px}
}

/* Layar sangat sempit: tombol naik tingkat pindah ke jejak, lensa memenuhi
   lebar, dan keterangan peta tetap ada — dipendekkan, bukan dihapus. */
@media (max-width:400px){
  .pm-peta-kendali{padding:0 12px 10px}
  .pm-naik{padding:8px 10px}
  .pm-lensa{flex:1;flex-wrap:nowrap}
  .pm-lensa button{flex:1;padding:8px 4px;font-size:10.5px;min-width:0}
  .pm-peta-kepala{padding:12px 14px 8px;gap:10px}
  .pm-peta-kepala h1{font-size:21px}
  .pm-sub{display:none}
  .pm-panggung,.pm-daftar-wilayah{margin:0 10px}
  .pm-peta-kaki{padding:9px 14px 10px}
  .pm-legenda{font-size:9.5px;gap:8px}
  .pm-peta-ket{font-size:9.5px;line-height:1.45}
  .pm-toolbar{padding:8px 12px}
  .pm-topik{width:140px}
  .pm-panel-kepala{padding:14px 15px}
  .pm-tabpanel{padding:14px 15px 20px}
  .pm-tab{padding:0 15px}
  .pm-kendali-ponsel{padding:8px 12px}
}

/* Di bawah 360 px dua pemilih berdampingan tinggal ~150 px masing-masing dan
   nama tingkat dapil terpotong di tengah kata. Ditumpuk, bukan dipersempit. */
@media (max-width:359px){
  .pm-pemilih{grid-template-columns:1fr;gap:8px}
}

/* Layar pendek (ponsel mendatar, laptop 768 tinggi): yang dipangkas jarak,
   bukan isi. Kontrol bawah tetap di luar ruang gulir. */
/* Laptop 768 px tinggi adalah ukuran nyata, bukan kasus tepi: di sana kepala
   peta, kendali lensa, legenda, dan keterangan menyisakan kanvas peta kurang
   dari separuh layar. Yang dipangkas jarak, bukan isi. */
@media (max-height:820px) and (min-width:801px){
  .pm-peta-kepala{padding-top:13px;padding-bottom:6px}
  .pm-peta-kendali{padding-bottom:10px}
  .pm-peta-kaki{padding-top:9px;padding-bottom:10px}
  .pm-panel-kepala{padding-top:14px;padding-bottom:13px}
  .pm-toolbar{padding-top:8px;padding-bottom:8px}
  .pm-peta-ket{max-height:3.2em;overflow:auto}
}
@media (max-height:560px){
  .pm-peta-kepala h1{font-size:19px}
  .pm-sub{display:none}
  .pm-peta-ket{max-height:2.9em;overflow:auto}
  .pm-panel-kepala{padding-top:12px;padding-bottom:12px}
}

@media (prefers-reduced-motion:reduce){
  .pm-area{transition:none}
}

/* C1 · Ajakan Dasbor di kaki panel. Berdiri SESUDAH temuan, bukan di atasnya:
   yang meyakinkan orang membuka Dasbor adalah temuan yang barusan dibacanya,
   bukan janji sebelum ia membaca apa pun. */
.pm-ajakan{display:grid;gap:12px;padding:16px 18px;border-top:1px solid var(--line);background:var(--wash)}
.pm-ajakan p{margin:0;font-size:12.5px;line-height:1.55;color:var(--muted)}
.pm-ajakan-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 16px;border-radius:6px;background:var(--green);color:#fff;font-size:13px;font-weight:650;text-decoration:none;border:1px solid var(--green)}
.pm-ajakan-cta:hover{background:var(--green2,var(--green));border-color:currentColor}
@media print{.pm-ajakan{display:none!important}}