:root {
  --bg: #f5f6f8; --kartu: #fff; --teks: #1d2433; --muted: #4b5563; --garis: #e3e6eb;
  --utama: #1f3864;
  --kavling: #f2c94c; --proses: #f2994a; --ready: #27ae60; --cash: #9b51e0; --booking: #2f80ed; --terjual: #eb5757;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: "Lexend", Arial, Helvetica, sans-serif; font-size: 14px; background: var(--bg); color: var(--teks); }
a { color: var(--utama); }
.muted { color: var(--muted); }
.link { background: none; border: 0; color: inherit; cursor: pointer; font: inherit; padding: 0; }

header#topbar { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: var(--utama); color: #fff; padding: 8px 20px; position: sticky; top: 0; z-index: 15; }
header#topbar a, header#topbar .link { color: #fff; text-decoration: none; font-weight: bold; }
header#topbar nav { align-items: center; }
.brand img { background: #fff; border-radius: 8px; padding: 3px 8px; }
.menu { position: relative; }
.menu-isi { position: absolute; right: 0; top: calc(100% + 10px); background: #fff; border-radius: 10px; min-width: 220px;
  box-shadow: 0 10px 30px rgba(0,0,0,.18); padding: 6px; display: flex; flex-direction: column; }
.menu-isi[hidden] { display: none; }
header#topbar .menu-isi a, header#topbar .menu-isi .link { color: var(--teks); font-weight: normal; padding: 10px 12px; border-radius: 6px; text-align: left; }
header#topbar .menu-isi a:hover, header#topbar .menu-isi .link:hover { background: #eef2f8; }
.menu-isi hr { border: 0; border-top: 1px solid var(--garis); margin: 4px 0; }
.peta { width: 100%; height: 200px; border: 0; border-radius: 10px; display: block; margin: 4px 0 8px; }
header#topbar nav { display: flex; gap: 18px; }
.brand { display: flex; align-items: center; gap: 12px; font-weight: bold; font-size: 16px; }
.brand img { height: 40px; width: auto; display: block; }

main { max-width: 1200px; margin: 0 auto; padding: 20px 16px 60px; }
h1 { font-size: 22px; margin: 4px 0 16px; }
h2 { font-size: 17px; margin: 24px 0 10px; }

.kartu { background: var(--kartu); border: 1px solid var(--garis); border-radius: 10px; padding: 16px; }
.login { max-width: 360px; margin: 10vh auto; }
.login h1 { text-align: center; }
label { display: block; font-weight: bold; margin: 12px 0 4px; }
input, select { width: 100%; padding: 9px 10px; border: 1px solid var(--garis); border-radius: 6px; font: inherit; }
button.utama { background: var(--utama); color: #fff; border: 0; border-radius: 6px; padding: 10px 14px; font: inherit; font-weight: bold; cursor: pointer; width: 100%; margin-top: 16px; }
button.utama:disabled { opacity: .6; }
.galat { color: #b42318; margin-top: 10px; }
.sukses { color: #067647; margin-top: 10px; }

.legenda { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 16px; }
.legenda span { display: inline-flex; align-items: center; gap: 6px; }
.titik { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.s-kavling { background: var(--kavling); } .s-proses { background: var(--proses); }
.s-ready { background: var(--ready); } .s-cash { background: var(--cash); } .s-booking { background: var(--booking); } .s-terjual { background: var(--terjual); }

.ringkas { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 8px; }
.ringkas .kartu { padding: 12px 14px; }
.ringkas .angka { font-size: 24px; font-weight: bold; }

.grid-lokasi { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 14px; }
.kartu-lokasi { display: block; text-decoration: none; color: inherit; transition: box-shadow .15s; }
.kartu-lokasi:hover { box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.kartu-lokasi .nama { font-weight: bold; font-size: 15px; }
.kartu-lokasi .sub { color: var(--muted); font-size: 12px; margin: 2px 0 10px; }
.bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: var(--garis); }
.bar i { display: block; height: 100%; }
.angka-status { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; font-size: 12px; }
.lencana { font-size: 11px; padding: 2px 7px; border-radius: 10px; background: #eef1f6; color: var(--muted); margin-left: 6px; font-weight: normal; }

.alat { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.alat input, .alat select { width: auto; min-width: 180px; }
.blok { margin-bottom: 18px; }
.blok h3 { font-size: 14px; margin: 0 0 8px; }
.kotak-wrap { display: flex; flex-wrap: wrap; gap: 5px; }
.kotak { width: 52px; height: 34px; border-radius: 5px; border: 0; color: #1d2433; font-size: 11px; font-weight: bold; cursor: pointer; }
.kotak.s-ready, .kotak.s-cash, .kotak.s-booking, .kotak.s-terjual { color: #fff; }
.kotak.redup { opacity: .18; }

.panel { position: fixed; inset: 0; background: rgba(0,0,0,.35); display: flex; justify-content: flex-end; z-index: 30; }
.panel[hidden] { display: none; }
.panel-box { background: #fff; width: min(420px, 100%); height: 100%; overflow-y: auto; padding: 20px; position: relative; }
.panel-tutup { position: absolute; right: 14px; top: 10px; font-size: 24px; background: none; border: 0; cursor: pointer; }
dl.rinci { display: grid; grid-template-columns: 130px 1fr; gap: 6px 10px; margin: 12px 0; }
dl.rinci dt { color: var(--muted); }
dl.rinci dd { margin: 0; }

@media (max-width: 600px) {
  header#topbar { flex-wrap: wrap; }
  .alat input, .alat select { width: 100%; }
}

/* tombol kedua, siteplan, tambah blok */
button.kedua, a.kedua { background: #fff; color: var(--utama); border: 1px solid var(--utama); border-radius: 6px; padding: 8px 12px; font: inherit; font-weight: bold; cursor: pointer; }
button.kedua:hover, a.kedua:hover { background: #eef2f8; }
button.kedua.lebar { width: 100%; margin-top: 12px; }
.alat-siteplan { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.alat-siteplan select { width: auto; }
.pemisah { width: 1px; height: 22px; background: var(--garis); margin: 0 4px; }
.siteplan-scroll { overflow: auto; max-height: 78vh; background: #fff; border: 1px solid var(--garis); border-radius: 10px; }
.siteplan { position: relative; min-width: 300px; }
.siteplan img { display: block; width: 100%; height: auto; user-select: none; }
.judul-baris { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 24px 0 10px; }
.judul-baris h2 { margin: 0; }
.foto-lokasi { aspect-ratio: 4 / 3; margin: -16px -16px 12px; border-radius: 10px 10px 0 0; overflow: hidden; background: linear-gradient(135deg, var(--utama), #4a6fa5); display: flex; align-items: center; justify-content: center; }
.foto-lokasi img { width: 100%; height: 100%; object-fit: contain; }
.foto-lokasi span { color: rgba(255,255,255,.85); font-size: 26px; font-weight: bold; letter-spacing: 1px; }
.s-kosong { background: #fff; box-shadow: inset 0 0 0 1px #c9ced6; }
.bar i.s-kosong { background: #dfe3e8; box-shadow: none; }
.kotak.s-kosong { color: #6b7280; }
.tip-sp { position: fixed; z-index: 40; background: #1d2433; color: #fff; font-size: 12px; padding: 4px 8px; border-radius: 4px; pointer-events: none; white-space: nowrap; }
.sp-view { position: relative; overflow: hidden; height: calc(100vh - 150px); min-height: 360px; background: #fff;
  border: 1px solid var(--garis); border-radius: 10px; cursor: grab; touch-action: none; user-select: none; }
.sp-view canvas { position: absolute; left: 0; top: 0; transform-origin: 0 0; max-width: none; }
.sp-view.menggeser, .sp-view.menggeser canvas { cursor: grabbing !important; }

/* footer, logo login */
.kaki { text-align: center; color: var(--muted); font-size: 12px; padding: 18px 16px 24px; border-top: 1px solid var(--garis); }
.logo-login { display: block; height: 70px; margin: 4px auto 6px; }

/* status aktif lokasi */
.kartu-lokasi { position: relative; }
.lencana-aktif { display: inline-block; font-size: 11px; font-weight: bold; padding: 3px 10px; border-radius: 999px; border: 2px solid; background: #fff; }
.lencana-aktif.aktif { color: #067647; border-color: #27ae60; }
.lencana-aktif.mati { color: #b42318; border-color: #eb5757; }
.kartu-lokasi .lencana-aktif { position: absolute; top: 10px; left: 10px; z-index: 1; }
.kartu-lokasi.nonaktif { background: #f1f2f4; }
.kartu-lokasi.nonaktif > :not(.lencana-aktif) { filter: grayscale(1); opacity: .55; }

/* halaman lokasi: data kiri, siteplan kanan */
main.lebar { max-width: none; padding: 16px 20px 40px; }
.lokasi-dua { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.lokasi-kiri { position: sticky; top: 76px; max-height: calc(100vh - 92px); overflow-y: auto; padding-right: 4px; }
.lokasi-kiri h1 { margin: 8px 0 6px; font-size: 20px; }
.lokasi-kiri dl.rinci { grid-template-columns: 80px 1fr; font-size: 13px; margin: 8px 0 14px; }
.lokasi-kiri dl.rinci dd { word-break: break-word; }
.daftar-status { background: #fff; border: 1px solid var(--garis); border-radius: 10px; padding: 6px 12px; }
.baris-status { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--garis); }
.baris-status span { display: inline-flex; align-items: center; gap: 6px; }
.baris-status.total b { font-size: 16px; }
.kecil { font-size: 12px; padding: 6px 0 2px; }
.alat-kiri label { margin-top: 10px; }
.tombol-kiri { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
@media (max-width: 900px) {
  .lokasi-dua { grid-template-columns: 1fr; }
  .lokasi-kiri { position: static; max-height: none; overflow: visible; }
}

/* handphone */
@media (max-width: 600px) {
  header#topbar { padding: 6px 12px; flex-wrap: nowrap; }
  .brand img { height: 32px; }
  .brand span { display: none; }
  header#topbar nav { gap: 14px; font-size: 13px; }
  main, main.lebar { padding: 12px 12px 32px; }
  h1 { font-size: 19px; }
  .ringkas { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .ringkas .angka { font-size: 20px; }
  .grid-lokasi { grid-template-columns: 1fr; }
  .lokasi-dua { gap: 12px; }
  .sp-view { height: 70vh; }
  .alat-siteplan .muted { font-size: 12px; flex-basis: 100%; }
  .daftar-status { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
  .baris-status { font-size: 13px; }
  .tombol-kiri { flex-direction: row; flex-wrap: wrap; }
  .tombol-kiri button { flex: 1 1 45%; }
  .kotak { width: 46px; }
  dl.rinci { grid-template-columns: 110px 1fr; }
  .panel-box { width: 100%; }
}
a.tombol-link { display: block; text-align: center; text-decoration: none; margin-bottom: 14px; }

/* Lexend di semua elemen form, info lokasi dipertegas */
button, input, select, textarea { font-family: inherit; }
.lokasi-kiri dl.rinci dt { color: var(--teks); font-weight: 500; }
.lokasi-kiri dl.rinci dd { color: var(--teks); font-weight: 600; }
.lokasi-kiri h1 { font-weight: 700; }

/* ===== modul menu ===== */
button.utama.pendek { width: auto; margin-top: 0; }
button.kedua.merah { color: #b42318; border-color: #eb5757; }
.peringatan { background: #fff8e6; border-color: #f2c94c; }
.tabel-wadah { overflow-x: auto; padding: 0; }
table.tabel { width: 100%; border-collapse: collapse; font-size: 13px; }
table.tabel th, table.tabel td { padding: 9px 10px; border-bottom: 1px solid var(--garis); text-align: left; vertical-align: top; }
table.tabel th { background: #eef2f8; color: var(--utama); font-weight: 600; white-space: nowrap; }
table.tabel tbody tr[data-id] { cursor: pointer; }
table.tabel tbody tr[data-id]:hover { background: #f6f8fc; }
.st { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; background: #eef1f6; }
.st-Draft { background: #eef1f6; color: #374151; } .st-MenungguTTD { background: #fff4d6; color: #8a5a00; }
.st-Terkirim { background: #e3edff; color: #1d4ed8; } .st-Selesai, .st-Terjual { background: #e3f6ea; color: #067647; }
.st-Dibatalkan { background: #fde8e8; color: #b42318; } .st-Dibooking { background: #e3edff; color: #1d4ed8; }
.kunci { font-size: 12px; }
.dua-kolom { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; align-items: start; }
dl.rinci.tebal dt { color: var(--teks); font-weight: 500; } dl.rinci.tebal dd { font-weight: 600; }
.tombol-baris { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 14px 0 8px; }
.baris-kecil { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.baris-kecil select { width: auto; }
.riwayat { list-style: none; padding: 0; margin: 0; }
.riwayat li { padding: 8px 0; border-bottom: 1px solid var(--garis); }
.form-lebar .kartu { margin-bottom: 14px; }
.grid-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 16px; }
.grid-form .penuh { grid-column: 1 / -1; }
.grid-form [hidden] { display: none; }
textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--garis); border-radius: 6px; font: inherit; resize: vertical; }
table.tabel-form td { padding: 5px; }
table.tabel-form input, table.tabel-form select, table.tabel-form textarea { padding: 6px 8px; font-size: 13px; }
table.cek-form td:first-child { white-space: nowrap; color: var(--muted); }
table.cek-form td:nth-child(2) { min-width: 220px; }
table.cek-form td:nth-child(3) { min-width: 180px; }
table.cek-form tr.grup td { background: #f3f5f9; font-weight: 700; color: var(--utama); }
.grid-pt { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 16px; }
.pratinjau-kop { background: #fff; border: 1px solid var(--garis); border-radius: 8px; padding: 14px; margin-bottom: 10px; overflow-x: auto; }

/* penampil dokumen (pratinjau kertas A4) */
#dokumen { position: fixed; inset: 0; z-index: 50; background: #525659; overflow: auto; }
#dokumen[hidden] { display: none; }
.dok-alat { position: sticky; top: 0; z-index: 1; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; background: var(--utama); color: #fff; padding: 10px 16px; }
.dok-alat .spasi { flex: 1; }
.dok-alat button.utama { width: auto; margin: 0; background: #fff; color: var(--utama); }
.dok-wadah { padding: 24px 12px 60px; }
.dok-wadah .kertas { background: #fff; width: 210mm; max-width: 100%; min-height: 297mm; margin: 0 auto 18px; padding: 18mm 20mm; box-shadow: 0 4px 18px rgba(0,0,0,.35); }
.dok-wadah.mendatar .kertas { width: 297mm; min-height: 210mm; padding: 12mm; }
.dok-wadah.slf .kertas { padding: 15mm 15mm; }
.kertas { font-family: Arial, Helvetica, sans-serif; font-size: 11pt; line-height: 1.45; color: #000; }
.kertas p { margin: 0 0 10px; }
.kop { display: flex; align-items: center; gap: 16px; border-bottom: 3px double #000; padding-bottom: 8px; margin-bottom: 18px; }
.kop img { height: 70px; width: auto; }
.kop .teks-kop { flex: 1; text-align: center; }
.kop .nama-pt { font-size: 16pt; font-weight: bold; }
.kop .tagline { font-style: italic; }
.kop .kecil { font-size: 9.5pt; }
table.meta { border-collapse: collapse; margin-bottom: 10px; }
table.meta td { padding: 0 6px 0 0; vertical-align: top; }
table.rincian { border-collapse: collapse; margin: 0 0 10px 24px; }
table.rincian td { padding: 1px 6px 1px 0; vertical-align: top; }
.ttd-ruang { height: 70px; }
.ttd-qr { margin: 4px 0 6px; width: max-content; }
.ttd-qr img { width: 26mm; height: 26mm; image-rendering: pixelated; display: block; }
/* Cap PRATINJAU hanya di layar; hasil cetak dan PDF bersih. */
.dok-wadah.ada-cap .kertas { position: relative; overflow: hidden; }
.dok-wadah.ada-cap .kertas::after { content: "PRATINJAU"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-35deg);
  font: 700 88px/1 Lexend, Arial, sans-serif; letter-spacing: 8px; color: rgba(220, 38, 38, .16); pointer-events: none; white-space: nowrap; }
.judul-dok { text-align: center; font-weight: bold; font-size: 12pt; }
table.cek { width: 100%; border-collapse: collapse; font-size: 8.5pt; }
table.cek th, table.cek td { border: 1px solid #000; padding: 3px 4px; vertical-align: top; }
table.cek th { background: #eee; }
table.cek td.tengah { text-align: center; }
table.cek tr.grup td { font-weight: bold; }
table.cek tfoot td { border: 0; font-size: 8pt; font-style: italic; text-align: center; padding-top: 6px; }
table.lap { width: 100%; border-collapse: collapse; font-size: 9pt; }
table.lap th, table.lap td { border: 1px solid #000; padding: 3px 5px; }
table.lap th { background: #eee; }

@media (max-width: 900px) { .dua-kolom { grid-template-columns: 1fr; } .grid-pt { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .dok-wadah .kertas { padding: 10mm 8mm; min-height: 0; } }

@page { size: A4; margin: 15mm; }
@media print {
  body.ada-dokumen > *:not(#dokumen) { display: none !important; }
  body.ada-dokumen { background: #fff; }
  #dokumen { position: static; background: #fff; overflow: visible; }
  .dok-alat { display: none !important; }
  .dok-wadah { padding: 0; }
  .dok-wadah .kertas { width: auto; min-height: 0; margin: 0; padding: 0; box-shadow: none; }
  .kertas.halaman-baru { break-before: page; }
  .dok-wadah.ada-cap .kertas::after { display: none; }
  table.cek tr { break-inside: avoid; }
}
.dok-wadah.mendatar .kertas { page: mendatar; }
@page mendatar { size: A4 landscape; margin: 10mm; }
.menu-isi [hidden] { display: none !important; }
table.rincian td:first-child { white-space: nowrap; }
#pita-latihan { background: #fff4d6; color: #8a5a00; border-bottom: 1px solid #f2c94c; padding: 8px 16px; text-align: center; font-weight: 600; font-size: 13px; }

.harga-kons { margin: 2px 0 10px; font-size: 16px; }
#f-kons textarea { width: 100%; box-sizing: border-box; font: inherit; }

/* BAST: mengikuti cetakan lama */
.kertas.bast { font-family: "Lexend", Arial, sans-serif; font-size: 10.5pt; line-height: 1.5; }
.kertas.bast p { margin: 0 0 8px; }
.kertas.bast .tengah { text-align: center; }
.kertas.bast .rata { text-align: justify; }
.kop-bast { display: flex; align-items: center; gap: 18px; }
.kop-bast > img { height: 54px; }
.kop-bast .kb-nama { flex: 1; }
.kop-bast .kb-pt { color: #1e4e9a; font-weight: 700; font-size: 20pt; line-height: 1.1; max-width: 250px; }
.kop-bast .kb-tag { color: #d71920; font-weight: 700; font-size: 7.5pt; margin-top: 4px; }
.kop-bast .kb-batas { width: 6px; align-self: stretch; background: #d71920; }
.kop-bast .kb-alamat { text-align: right; font-size: 8pt; color: #444; line-height: 1.6; }
.kb-garis { height: 4px; margin: 8px 0 22px; background: linear-gradient(to right, #d71920 50%, #1e4e9a 50%); }
.kertas.bast .judul-dok { margin-bottom: 6px; }
.kertas.bast table.daftar { margin: 0 0 14px; border-collapse: collapse; width: 100%; }
.kertas.bast table.daftar td { padding: 1px 6px 1px 0; vertical-align: top; }
.kertas.bast table.daftar td.no { width: 22px; }
.kertas.bast table.daftar td.lbl { width: 190px; }
.kertas.bast table.daftar td:nth-child(3) { width: 14px; }
.kertas.bast table.daftar { table-layout: fixed; }
.kertas.bast ol { margin: 0 0 18px; padding-left: 22px; }
.kertas.bast table.ttd-dua { width: 100%; margin-top: 18px; }
.kertas.bast table.ttd-dua td { width: 50%; text-align: center; vertical-align: top; }
.kertas.bast .ttd-qr { display: table; margin: 6px auto; }
.kertas.bast .ttd-qr > img:first-child { width: 30mm; height: 30mm; }
.kertas.bast .ttd-ruang-bast { height: 26mm; margin: 6px 0; }
.ttd-qr.ber-logo { position: relative; }
.ttd-qr .qr-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8mm !important; height: auto !important; background: #fff; padding: 1px 2px; image-rendering: auto !important; }

/* Dashboard penjualan di Beranda (ringkas; laporan lengkap ada di Menu) */
.ringkas { grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); }
.dash { margin: 12px 0 16px; padding: 12px 14px; }
.dash-kepala { display: flex; align-items: center; gap: 10px; }
.dash-kepala select { width: auto; margin: 0; padding: 4px 8px; font-size: 13px; }
.dash-baris { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 8px; }
.dash-st { display: flex; align-items: baseline; gap: 6px; font-size: 13px; }
.dash-st span { color: var(--muted); }
.dash-st b { font-size: 16px; }
.dash-per { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; font-size: 12px; color: var(--muted); }
.dash-per b { color: var(--teks); font-weight: 600; }
.kecil { font-size: 12px; }

/* Laporan penjualan */
.lap-filter { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px 14px; margin: 12px 0; }
.lap-f { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; flex: 1 1 150px; }
.lap-f select, .lap-f input { margin: 0; }
.lap-cari { flex: 2 1 200px; }
.lap-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 12px; }
.lap-kpi .kartu { padding: 12px 14px; }
.lap-kpi .angka { font-size: 24px; font-weight: 700; }
.lap-kpi .kpi-waspada { border-color: #f2c94c; background: #fffbea; }
.lap-dua { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; margin-bottom: 12px; }
.lap-dua .kartu, .lap-dua + .kartu, .lap-dua + .kartu + .kartu { margin-bottom: 12px; }
.lap-judul { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
.lap-judul h2 { font-size: 15px; margin: 0; }
.lap-legenda { display: flex; gap: 12px; font-size: 12px; color: var(--muted); }
.lap-legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.lap-grafik { display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; height: 180px; border-bottom: 1px solid var(--garis); position: relative; }
.lg-kol { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding-bottom: 2px; border-radius: 6px; }
.lg-kol:hover, .lg-kol.aktif { background: #eef3fb; }
.lg-batang { flex: 1; display: flex; align-items: flex-end; gap: 2px; width: 100%; justify-content: center; }
.lg-batang i { display: block; width: 36%; max-width: 12px; border-radius: 4px 4px 0 0; }
.lg-kol span { font-size: 10.5px; color: var(--muted); margin-top: 4px; }
.lg-tip { margin-top: 6px; font-size: 12px; font-weight: 600; }
.tabel.ringan th, .tabel.ringan td { padding: 6px 8px; }
.serap { display: inline-block; width: 70px; height: 6px; border-radius: 3px; background: #e5e7eb; vertical-align: middle; margin-right: 6px; overflow: hidden; }
.serap i { display: block; height: 100%; background: var(--booking); border-radius: 3px; }
.tabel tfoot td { font-weight: 700; border-top: 2px solid var(--garis); }
.lap-detail th[data-urut] { cursor: pointer; white-space: nowrap; user-select: none; }
.lap-detail td { white-space: nowrap; }
.aging { font-weight: 600; }
.aging.a-kuning { color: #a15c00; }
.aging.a-merah { color: #b42318; }
@media (max-width: 900px) { .lap-dua { grid-template-columns: 1fr; } }
.tabel-gulir { overflow-x: auto; }
.tabel .kanan, .tabel th.kanan, .tabel td.kanan { text-align: right; }

/* SLF: tulisan "Lampiran 4" kecil di kiri bawah lembar 1 dan 2 */
.kertas.ada-kaki { position: relative; }
.kaki-lampiran { position: absolute; left: 20mm; bottom: 10mm; font-size: 8pt; font-style: italic; color: #333; }
.dok-wadah.slf .kaki-lampiran { left: 15mm; }
@media print {
  .kertas.ada-kaki { min-height: 265mm; }
  .dok-wadah.slf .kaki-lampiran, .kaki-lampiran { left: 0; bottom: 0; }
}
.kar-id { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.kar-id button { flex-shrink: 0; }
@media (max-width: 600px) { .kar-id { flex-direction: column; align-items: stretch; } }
tr.baris-klik { cursor: pointer; }
tr.baris-klik:hover td { background: #f5f8fd; }
.kpi-pilih { cursor: pointer; }
.kpi-pilih.aktif { border-color: var(--utama, #1f3864); box-shadow: inset 0 0 0 1px var(--utama, #1f3864); }
.lencana-form { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #eef2f7; color: #1f2937; white-space: nowrap; }
.lencana-form.f-SLF { background: #e3f6ea; color: #067647; }
.lencana-form.f-BAST { background: #f3e8ff; color: #6b21a8; }
.lencana-form.f-UMUM { background: #e3edff; color: #1d4ed8; }
/* Daftar Akun & otorisasi */
.hak-ringkas { max-width: 420px; }
.hak-chip { display: inline-block; margin: 1px 2px; padding: 2px 8px; border-radius: 999px; font-size: 11px; white-space: nowrap; background: #eef2f7; color: #374151; }
.hak-chip.t2 { background: #e3edff; color: #1d4ed8; }
.hak-chip.t3 { background: #e3f6ea; color: #067647; }
.matriks-hak td, .matriks-hak th { vertical-align: middle; }
.matriks-hak .tengah { text-align: center; width: 92px; }
.matriks-hak input[type=checkbox] { width: 20px; height: 20px; cursor: pointer; }
.cek-super { display: flex; gap: 8px; align-items: center; margin: 4px 0 12px; }
.cek-super input { width: auto; }
.preset-hak { margin-bottom: 8px; }
.preset-hak button.kecil { padding: 4px 10px; font-size: 12px; }
.redup { opacity: .45; }
p.peringatan { background: #fff7e6; border: 1px solid #f5c26b; border-radius: 8px; padding: 6px 10px; }
.dash-kepala { flex-wrap: wrap; }
.dash-st.d-booking b { color: var(--booking); } .dash-st.d-proses b { color: #e67e22; } .dash-st.d-akad b { color: var(--terjual); }
/* Perjalanan Berkas */
.berkas-alur { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 12px 0; }
.berkas-alur .kartu { text-align: left; font: inherit; cursor: pointer; margin: 0; border-top: 4px solid #cbd5e1; }
.tahap-lencana { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #eef2f7; color: #374151; white-space: nowrap; }
.tb-Booking { --tb: var(--booking); } .tb-Berkas-dikumpulkan { --tb: #94a3b8; } .tb-Berkas-lengkap { --tb: #0ea5e9; }
.tb-Diserahkan-ke-bank { --tb: #e67e22; } .tb-SP3K-terbit { --tb: #d97706; } .tb-Akad { --tb: var(--terjual); } .tb-Ditolak-batal { --tb: #6b7280; }
.berkas-alur .kartu[class*="tb-"] { border-top-color: var(--tb); }
.tahap-lencana[class*="tb-"] { background: color-mix(in srgb, var(--tb) 15%, #fff); color: color-mix(in srgb, var(--tb) 75%, #000); }
.linimasa { list-style: none; padding: 0 0 0 14px; margin: 12px 0; border-left: 3px solid #e5e7eb; }
.linimasa li { position: relative; padding: 0 0 12px 12px; }
.linimasa li::before { content: ""; position: absolute; left: -22px; top: 3px; width: 13px; height: 13px; border-radius: 50%; background: var(--tb, #94a3b8); border: 2px solid #fff; }
.berkas-alur .angka { font-size: 24px; font-weight: 700; }
.isi-koordinat { margin: 8px 0 12px; } .isi-koordinat .baris-kecil { flex-wrap: nowrap; } .isi-koordinat input { flex: 1; min-width: 0; margin: 0; }
/* Kartu ringkasan Beranda: label satu baris, kolom sama lebar (desktop 8, tablet 4, HP 2) */
.ringkas { grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 10px; }
.ringkas .kartu { padding: 10px 12px; min-width: 0; margin: 0; }
.ringkas .muted { display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.ringkas .muted .titik { flex: none; margin: 0; }
.ringkas .angka { font-size: 22px; line-height: 1.25; margin-top: 2px; }
@media (max-width: 1100px) { .ringkas { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ringkas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .ringkas .angka { font-size: 20px; } }
.ringkas .kartu { padding: 10px 10px; } .ringkas .muted { font-size: 12.5px; gap: 5px; }
@media (max-width: 1180px) { .ringkas { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ringkas { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dash-kepala select { flex: 1 1 140px; } }
.tabel td.satu-baris, .tabel th.satu-baris { white-space: nowrap; }
#k-tabel th, #k-tabel td:nth-child(1), #k-tabel td:nth-child(6), #k-tabel td:nth-child(7), #k-tabel td:nth-child(8), #k-tabel td:nth-child(9) { white-space: nowrap; }
/* Tools data master */
.tools-tab { margin: 12px 0; }
.tools-tabel input, .tools-tabel select, .tools-tabel textarea { margin: 0; padding: 6px 8px; font-size: 13px; width: 100%; box-sizing: border-box; }
.tools-tabel input[type=number] { width: 70px; }
.tools-tabel textarea { resize: vertical; font: inherit; }
.tools-tabel td { vertical-align: middle; }
.tools-tabel tr.baris-tambah td { background: #f8fafc; }
.tools-tabel button.kecil { padding: 5px 10px; font-size: 12px; }
.tools-tab button, .tools-tabel button { width: auto; margin: 0; }
.tools-tab { flex-wrap: wrap; }
.tools-tabel select { min-width: 95px; }
/* Tombol berdampingan (Ubah, Hapus, Unduh, dll.) selalu rata dan sama tinggi */
.baris-kecil > a.kedua, .baris-kecil > button.kedua, .baris-kecil > button.utama, .tombol-baris > a.kedua, .tombol-baris > button {
  display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 38px; margin: 0; line-height: 1.2; vertical-align: middle; }
.baris-kecil > a.tombol-link { margin-bottom: 0; }
[hidden] { display: none !important; }
/* No. HP lebih dari satu + tanda WA */
.hp-baris { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.hp-baris .hp-no { flex: 1; min-width: 0; margin: 0; }
.hp-baris .hp-wa { display: inline-flex; align-items: center; gap: 4px; margin: 0; font-weight: 600; white-space: nowrap; }
.hp-baris .hp-wa input { width: auto; margin: 0; }
.hp-baris .hp-hapus { margin: 0; }
.hp-satu { display: inline-flex; align-items: center; gap: 4px; margin-right: 8px; white-space: nowrap; }
.chip-wa { display: inline-block; padding: 1px 7px; border-radius: 999px; background: #e3f6ea; color: #067647; font-size: 11px; font-weight: 700; text-decoration: none; }
.chip-wa:hover { background: #25d366; color: #fff; }
/* Bar biru lebih tinggi di layar lebar agar semboyan tampil besar */
@media (min-width: 1001px) {
  header#topbar { padding-top: 16px; padding-bottom: 16px; }
  .lokasi-kiri { top: 92px; max-height: calc(100vh - 108px); }
}
/* Mode pindahkan kavling di siteplan */
.sp-pindah { position: absolute; left: 50%; top: 10px; transform: translateX(-50%); z-index: 5; display: flex; align-items: center; gap: 10px;
  background: #1d2433; color: #fff; padding: 8px 12px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,.25); font-size: 13px; max-width: calc(100% - 20px); }
.sp-pindah button { background: #fff; margin: 0; }
/* Halaman isi data mandiri karyawan (isi.html) */
main.isi-mandiri { max-width: 860px; }
.isi-mandiri .wajib { color: #b42318; }
.isi-mandiri .kurang { border-color: #b42318 !important; background: #fff6f5; }
.isi-mandiri .redup-tombol { opacity: .55; }
.isi-mandiri .isi-kirim { text-align: center; }
.isi-mandiri .isi-kirim button.utama { max-width: 320px; }
.isi-pesan { text-align: center; padding: 40px 20px; }
.hal-isi header#topbar .brand { color: #fff; }
/* Link isi data di detail karyawan */
.link-isi { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.link-isi input { flex: 1; min-width: 220px; margin: 0; font-size: 13px; }
.link-isi .kedua, .link-isi a { margin: 0; }
.link-isi button { width: auto; margin: 0; min-height: 38px; }

/* Baru booking (belum SLF & proses bank): warna kavling tetap, bingkai tebal biru / ungu (cash). Pembatalan. */
.kotak.bingkai-booking { box-shadow: inset 0 0 0 3px var(--booking); }
.kotak.bingkai-cash { box-shadow: inset 0 0 0 3px var(--cash); }
.titik.bingkai-booking { box-shadow: inset 0 0 0 2px var(--booking); }
.titik.bingkai-cash { box-shadow: inset 0 0 0 2px var(--cash); }
.kotak.s-kavling.bingkai-booking, .kotak.s-kavling.bingkai-cash, .kotak.s-proses.bingkai-booking, .kotak.s-proses.bingkai-cash { color: #1d2433; }
.tb-Dibatalkan { --tb: #b42318; }
.cek-surat { display: grid; gap: 6px; margin: 4px 0 6px; }
.cek-baris { display: flex; align-items: center; gap: 8px; font-weight: normal; margin: 0; flex-wrap: wrap; }
.cek-baris input { width: auto; margin: 0; }
button.merah-penuh { background: #d92d20; border-color: #d92d20; color: #fff; }

/* Laporan penjualan: kolom dua tingkat dan grafik per SPV / marketing (KPR biru, Tunai oranye). */
.tabel-dua th.grup { border-bottom: 1px solid #c9d3e4; }
.tabel-dua th.tengah { text-align: center; }
.beli-kpr { background: #2f80ed; } .beli-tunai { background: #e67e22; }
.grafik-orang { display: grid; gap: 14px; }
.go-baris { display: grid; gap: 4px; }
.go-nama { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.go-batang { display: grid; grid-template-columns: 62px 1fr minmax(120px, auto); align-items: center; gap: 8px; font-size: 13px; }
.go-jenis { color: #5b6476; }
.go-isi { display: flex; gap: 2px; height: 14px; background: #f1f3f7; border-radius: 4px; overflow: hidden; }
.go-isi i { display: block; height: 100%; border-radius: 0 4px 4px 0; }
.go-isi i:first-child { border-radius: 4px 0 0 4px; } .go-isi i:only-child { border-radius: 4px; }
.go-angka { white-space: nowrap; font-weight: 600; }
.go-angka .muted { font-weight: normal; }
@media (max-width: 600px) { .go-batang { grid-template-columns: 52px 1fr; } .go-angka { grid-column: 2; } }

/* ---------- absensi ---------- */
.absen-kartu { max-width: 560px; }
.absen-dua { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.absen-jam { border: 1px solid var(--garis); border-radius: 10px; padding: 12px; text-align: center; }
.absen-jam .angka { font-size: 28px; font-weight: 700; margin: 2px 0; }
.absen-jam.sudah { border-color: #27ae60; background: #f0faf4; }
.absen-tombol { font-size: 18px; padding: 14px; }
.absen-selesai { color: #067647; font-weight: 600; text-align: center; }
.absen-ok { color: #067647; font-weight: 600; }
.absen-peta { width: 100%; height: 220px; border: 0; border-radius: 10px; margin-top: 10px; }
.absen-kamera { background: #111; border-radius: 12px; overflow: hidden; aspect-ratio: 3 / 4; max-height: 52vh; margin: 0 auto 8px; }
.absen-kamera video { width: 100%; height: 100%; object-fit: cover; transform: scaleX(-1); display: block; }
.absen-foto { width: 100%; max-width: 320px; border-radius: 10px; display: block; margin: 6px 0; background: #eee; min-height: 60px; }
.absen-detail { border-top: 1px solid var(--garis); padding-top: 8px; margin-top: 8px; }
.sub-judul { margin: 24px 0 10px; }
.tanda-curiga { color: #b42318; font-weight: 600; font-size: 12px; }
.tabel tr.baris-curiga td { background: #fff4f2; }
.titik-form { margin-top: 14px; border-top: 1px solid var(--garis); padding-top: 10px; }
#ab-saya tr[data-k], #ab-rekap tr[data-i] { cursor: pointer; }
.tanda-telat { color: #b54708; font-weight: 600; font-size: 12px; }
.chip-libur { display: flex; flex-wrap: wrap; gap: 6px; }
.chip-libur span { background: #eef4ff; color: var(--utama); border-radius: 999px; padding: 3px 10px; font-size: 12px; }
.chip-libur span.hari-ini { background: var(--utama); color: #fff; }
.chip-libur span.muted { background: none; padding: 0; }
.st-libur { font-size: 12px; font-weight: 600; }
.st-Diajukan { color: #b54708; } .st-Disetujui { color: #067647; } .st-Ditolak { color: #b42318; }
.ajuan-libur { border-color: #f79009; margin-bottom: 10px; }
.kal-libur { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; margin: 8px 0; }
.kal-libur b { font-size: 12px; color: var(--muted); }
.hari-kal { display: block; margin: 0; cursor: pointer; }
.hari-kal input { position: absolute; opacity: 0; width: 0; }
.hari-kal span { display: block; padding: 9px 0; border: 1px solid var(--garis); border-radius: 8px; font-weight: 500; }
.hari-kal.minggu span { color: #b42318; }
.hari-kal input:checked + span { background: var(--utama); color: #fff; border-color: var(--utama); }
.hari-kal input:focus-visible + span { outline: 2px solid #f2c94c; }
.lencana-dl { display: inline-block; background: #fef0c7; color: #93370d; border-radius: 999px; padding: 1px 8px; font-size: 11px; font-weight: 600; }
.absen-dl { border: 1px solid #f79009; background: #fffaeb; border-radius: 10px; padding: 10px; margin-bottom: 10px; }

/* ---------- Rekrutmen & halaman publik di Tools ---------- */
.cek-baris { display: flex; gap: 8px; align-items: center; font-weight: normal; }
.cek-baris input { width: auto; }
.st-lm-Baru { background: #fff4d6; color: #8a5a00; } .st-lm-Diproses { background: #e3edff; color: #1d4ed8; }
.st-lm-Interview { background: #f1e8fd; color: #6b21a8; } .st-lm-Diterima { background: #e3f6ea; color: #067647; } .st-lm-Ditolak { background: #fde8e8; color: #b42318; }
button.kedua.lebar.merah { margin-top: 8px; }
.pub-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 16px; }
.pub-grid label { margin-top: 10px; }
.pub-medsos td input { min-width: 150px; }
/* Tanda simpan di tombol */
button.proses { opacity: .85; cursor: progress; }
button.tersimpan, button.kedua.tersimpan, button.tersimpan:disabled { background: #067647 !important; border-color: #067647 !important; color: #fff !important; opacity: 1 !important; transition: background .2s; }
.putar { display: inline-block; width: 12px; height: 12px; margin-right: 6px; vertical-align: -1px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: putar .7s linear infinite; }
@keyframes putar { to { transform: rotate(360deg); } }
label.tombol-file { display: inline-flex; align-items: center; cursor: pointer; margin: 0 8px 8px 0; font-weight: bold; background: #fff; color: var(--utama); border: 1px solid var(--utama); border-radius: 6px; padding: 8px 12px; }
label.tombol-file:hover { background: #eef2f8; }
.tombol-file.proses { opacity: .7; cursor: progress; }
.latar-atur { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.latar-pratinjau { aspect-ratio: 16 / 7; border-radius: 10px; background: linear-gradient(120deg, #14264a, var(--utama)) center / cover no-repeat; display: grid; place-items: center; color: #dbe3f1; font-size: 13px; padding: 10px; text-align: center; }
.br-foto { border: 1px dashed var(--garis); border-radius: 8px; min-height: 80px; display: grid; place-items: center; margin-bottom: 8px; overflow: hidden; }
.br-foto img { width: 100%; max-height: 220px; object-fit: contain; display: block; }
img.br-mini { width: 64px; height: 40px; object-fit: contain; border-radius: 4px; display: block; }
@media (max-width: 700px) { .latar-atur { grid-template-columns: 1fr; } }

.bod-lihat img { aspect-ratio: 3 / 4; object-fit: contain; max-width: 180px; }
img.bod-mini { width: 42px; height: 56px; object-fit: contain; }

.cek-bawahan { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 14px; padding: 8px 10px; border: 1px solid #e3e7ee; border-radius: 8px; }

.aju-bulan { margin-top: 12px; padding-top: 10px; border-top: 1px solid #eef0f4; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.chip-libur span.ditolak { text-decoration: line-through; opacity: .7; }
.cuti-sisa { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.cuti-sisa > div { display: flex; flex-direction: column; align-items: center; min-width: 90px; }
.cuti-sisa .angka { font-size: 34px; font-weight: 700; color: var(--utama); line-height: 1.1; }

details.rangkap summary { cursor: pointer; font-weight: 500; margin-bottom: 6px; }

.input-satuan { display: flex; align-items: center; gap: 8px; }
.input-satuan input { max-width: 120px; }
.input-satuan span { color: #667085; font-size: 13px; }

/* Motto panjang diperkecil supaya tidak menabrak logo dan menu */
nav a.ke-publik { font-size: 13px; opacity: .85; }
@media (max-width: 560px) { nav a.ke-publik { display: none; } }


/* Pilihan bentuk motto (Tools) dan gaya di bar biru */
.motto-gaya { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 10px; margin: 6px 0 12px; }
.motto-gaya-pilih { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid #e3e7ee; border-radius: 10px; cursor: pointer; margin: 0; }
.motto-gaya-pilih:has(input:checked) { border-color: var(--utama); background: #f3f6fb; box-shadow: 0 0 0 2px var(--utama)22; }
.motto-gaya-nama { display: flex; align-items: center; gap: 6px; font-weight: 600; }
.motto-gaya-nama input { width: auto; margin: 0; }
.contoh-bar { display: flex; justify-content: center; align-items: center; min-height: 64px; padding: 8px; border-radius: 8px; background: var(--utama); overflow: hidden; }

/* Pengaturan nama & logo (Tools) */
.brand-atur { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.brand-contoh { justify-content: flex-start; padding: 14px 16px; }
.brand-contoh-isi { display: flex; align-items: center; gap: 12px; color: #fff; font-size: 17px; }
.brand-contoh-isi img { height: 42px; width: auto; max-width: 180px; object-fit: contain; background: #fff; border-radius: 8px; padding: 3px 8px; }
@media (max-width: 700px) { .brand-atur { grid-template-columns: 1fr; } }
.share-atur { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.share-contoh { background: #e7f6dd; border-radius: 10px; padding: 6px; max-width: 380px; box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.share-contoh img { display: block; width: 100%; aspect-ratio: 1.91 / 1; object-fit: contain; background: #fff; border-radius: 7px 7px 0 0; }
.share-contoh div { background: #f2faec; padding: 8px 10px; border-radius: 0 0 7px 7px; display: grid; gap: 2px; }
.share-contoh b { font-size: 14px; color: #111; }
.share-contoh span { font-size: 12.5px; color: #444; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.share-contoh small { font-size: 11.5px; color: #6b7280; }
.share-ikon { width: 32px; height: 32px; object-fit: contain; border: 1px solid #e5e7eb; border-radius: 6px; background: #fff; }
@media (max-width: 700px) { .share-atur { grid-template-columns: 1fr; } }
.warna-preset { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.warna-pilih { display: inline-flex; align-items: center; gap: 6px; width: auto; margin: 0; }
.warna-pilih span { width: 14px; height: 14px; border-radius: 50%; border: 1px solid #0002; }
input[type=color] { height: 42px; padding: 3px; cursor: pointer; }
.mu-daftar { display: flex; flex-direction: column; gap: 8px; margin: 8px 0; }
.mu-baris { display: grid; grid-template-columns: auto minmax(120px, 1fr) minmax(200px, 300px) auto; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid #e3e7ee; border-radius: 10px; }
.mu-baris input { margin: 0; }
.mu-baris audio { width: 100%; height: 36px; }
.mu-no { width: 24px; height: 24px; border-radius: 50%; background: #eef2f8; display: grid; place-items: center; font-weight: 700; font-size: 12px; }
@media (max-width: 700px) { .mu-baris { grid-template-columns: auto 1fr; } .mu-baris audio, .mu-baris > .satu-baris { grid-column: 1 / -1; } }
.baris-wilayah { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.baris-wilayah:has(> .wil-prov), .baris-wilayah.tiga { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wil-bantu { gap: 8px; margin: 6px 0 10px; }
.wil-bantu select { margin: 0; font-size: .9em; }
@media (max-width: 600px) { .baris-wilayah, .baris-wilayah:has(> .wil-prov), .baris-wilayah.tiga { grid-template-columns: 1fr; } }

/* Huruf awal tiap kata kapital untuk judul, label, pilihan, tombol, menu (data isian tetap apa adanya) */
h1, h2, h3, h4, th, label, button, select, option, nav a, .menu-isi a, .menu-isi .link, .st, .lap-f > span, .tab, [data-tab], .kpi span, .kpi small, .chip, a.kedua, a.utama, .kartu-lokasi h3, .muted-judul {
  text-transform: capitalize;
}
label .muted, label .kecil, label .wajib, .cek-baris, .cek-bawahan label, .motto-gaya-pilih .contoh-bar, .brand-contoh-isi { text-transform: none; }
::placeholder { text-transform: none; }

/* Peta tunda: kotak ringan sebelum peta Google dimuat */
.peta-tunda { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
  background: linear-gradient(135deg, #e8eef6, #f5f7fa); color: #4b5563; font: inherit; font-size: 13px; text-transform: none; }
.peta-tunda svg { width: 34px; height: 34px; color: var(--utama, #1f3864); }
.peta-tunda:hover { background: #e2e9f3; }

/* ===== Keuangan ===== */
.panel-box.lebar { width: min(980px, 100%); }
.keu-tab { flex-wrap: wrap; margin: 10px 0; }
.keu-tab a.tab { text-decoration: none; padding: 8px 12px; border-radius: 8px; font-size: 13px; }
.kanan { text-align: right !important; }
.tengah { text-align: center !important; }
table.tabel td.kanan { white-space: nowrap; font-variant-numeric: tabular-nums; }
.keu-angka { font-size: 20px !important; }
.keu-sub td { font-weight: 700; background: #f6f8fc; }
.keu-jml td { font-weight: 600; border-top: 1px solid #c9d2e3; }
.keu-hasil td { font-weight: 700; background: #eef2f8; }
.keu-total td { font-weight: 700; background: #e3e9f4; border-top: 2px solid var(--utama); }
.keu-isi { padding-left: 24px !important; }
.keu-kredit { padding-left: 28px !important; }
.keu-batal td { color: #9aa1ad; text-decoration: line-through; }
.keu-batal td .galat, .keu-batal td button { text-decoration: none; }
table.keu-jurnal tr.keu-awal td { border-top: 2px solid #d5dbe6; }
.keu-lr { max-width: 760px; }
.keu-dua { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.keu-grafik { display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; height: 190px; align-items: end; }
.keu-kolom { display: flex; flex-direction: column; align-items: center; height: 100%; gap: 4px; font-size: 11px; color: var(--muted); }
.keu-batang { flex: 1; width: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 2px; border-bottom: 1px solid var(--garis); }
.keu-batang i { width: 40%; border-radius: 3px 3px 0 0; min-height: 1px; }
.keu-p { background: #2e7d32; }
.keu-b { background: #d9822b; }
.lap-legenda i.keu-p, .lap-legenda i.keu-b { display: inline-block; }
.keu-hbar { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 13px; margin: 6px 0; }
.keu-hbar div { background: #eef2f8; border-radius: 4px; height: 10px; overflow: hidden; }
.keu-hbar i { display: block; height: 100%; background: #d9822b; }
.keu-hbar b { white-space: nowrap; font-size: 12px; }
table.tabel-form .kanan { text-align: right; }
.keu-kertas table.lap td:last-child, .keu-kertas table.lap th:last-child { text-align: right; }
@media (max-width: 900px) { .keu-dua { grid-template-columns: 1fr; } }
.keu-tab a.tab.utama { background: var(--utama); color: #fff; border: 1px solid var(--utama); font-weight: 600; }

.pp-atur { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 16px; margin-top: 12px; align-items: start; }
.pp-lihat { border-radius: 12px; padding: 16px; background: rgba(10, 18, 35, .72); display: flex; justify-content: center; }
.pp-lihat .popup-isi { transform: none; max-height: none; box-shadow: none; }
.pp-lihat .popup-teks b { font-size: 19px; }
.pp-lihat .popup-ikon { width: 56px; height: 56px; }
.pp-template { display: flex; flex-wrap: wrap; gap: 6px; }
.pp-tpl { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px !important; font-size: 12px; }
.pp-tpl i { width: 16px; height: 16px; border-radius: 4px; background: var(--pp-latar); border: 3px solid var(--pp-aksen); }
@media (max-width: 640px) { .pp-atur { grid-template-columns: 1fr; } }

/* Menu berkelompok (anak cabang), tulisan kecil */
header#topbar .menu-isi { font-size: 13px; min-width: 230px; max-height: calc(100vh - 90px); overflow-y: auto; }
header#topbar .menu-isi a, header#topbar .menu-isi .link { font-size: 13px; padding: 7px 12px; }
.menu-grup summary { list-style: none; cursor: pointer; padding: 8px 12px; border-radius: 6px; font-size: 13px; font-weight: 600; color: var(--utama);
  display: flex; justify-content: space-between; align-items: center; user-select: none; }
.menu-grup summary::-webkit-details-marker { display: none; }
.menu-grup summary::after { content: "▸"; font-size: 11px; color: var(--muted); transition: transform .15s; }
.menu-grup[open] summary::after { transform: rotate(90deg); }
.menu-grup summary:hover { background: #eef2f8; }
header#topbar .menu-grup a { display: block; padding: 6px 12px 6px 24px; font-size: 12.5px; }
.menu-grup[open] { background: #f8fafd; border-radius: 6px; padding-bottom: 4px; }

/* ===== Teknik ===== */
.tk-bar { background: #eef2f8; border-radius: 4px; height: 8px; overflow: hidden; margin-bottom: 2px; }
.tk-bar i { display: block; height: 100%; background: #2f6fb3; border-radius: 4px; }
.tk-bar.lewat i { background: #c0392b; }
.tk-banding { display: grid; grid-template-columns: auto 1fr auto; gap: 2px 6px; align-items: center; margin-bottom: 3px; }
.tk-banding .tk-bar { margin: 0; }
.tk-banding b { font-size: 11.5px; text-align: right; }
tr.tk-belum td { background: #fff8e6; }
.kv-pilih { max-height: 260px; overflow: auto; border: 1px solid var(--garis); border-radius: 8px; padding: 8px; margin-bottom: 8px; }
.kv-blok { margin-bottom: 8px; }
.kv-pilih label.kv-semua { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 6px; margin: 0 0 4px; width: auto; }
.kv-pilih .kv-semua input { width: auto; margin: 0; }
.kv-isi { display: flex; flex-wrap: wrap; gap: 4px; }
.kv-cek { margin: 0; }
.kv-cek input { position: absolute; opacity: 0; pointer-events: none; }
.kv-cek span { display: inline-block; padding: 4px 9px; border: 1px solid var(--garis); border-radius: 6px; font-size: 12.5px; cursor: pointer; background: #fff; }
.kv-cek input:checked + span { background: var(--utama, #1f3864); color: #fff; border-color: var(--utama, #1f3864); }
.kv-cek input:disabled + span { cursor: default; opacity: .8; }
.fp-tahap { border-left: 3px solid var(--garis); padding: 6px 0 10px 12px; margin-left: 10px; }
.fp-tahap.lewat { border-left-color: #2f6fb3; }
.fp-tahap.kini { background: #f3f7fd; border-radius: 0 8px 8px 0; }
.fp-kepala { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fp-kepala .tombol-file { margin-left: auto; }
.fp-no { width: 22px; height: 22px; border-radius: 50%; background: #eef2f8; display: inline-grid; place-items: center; font-size: 11px; font-weight: bold; margin-left: -24px; }
.fp-tahap.lewat .fp-no { background: #2f6fb3; color: #fff; }
.fp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; margin-top: 8px; }
.fp-grid figure { margin: 0; position: relative; }
.fp-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; border-radius: 8px; display: block; background: #eef2f8; }
.fp-grid figcaption { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.fp-hapus { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(0,0,0,.55); color: #fff; font-size: 16px; line-height: 1; cursor: pointer; padding: 0; }
.tk-bar.selesai i { background: #2e7d32; }
.tk-ren { background: #9fb4d0; }
.lap-legenda i.tk-ren { display: inline-block; }
.tk-grafik .keu-batang i { width: 28%; }
.st-tk { display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 10px; background: #eef2f8; color: #3b4a5e; white-space: nowrap; }
.st-tk-draft, .st-tk-diajukan, .st-tk-menunggu { background: #fff4d6; color: #8a6100; }
.st-tk-disetujui, .st-tk-jadi-po, .st-tk-berjalan, .st-tk-aktif, .st-tk-sebagian { background: #e3eefc; color: #1d4f8a; }
.st-tk-selesai, .st-tk-diterima, .st-tk-lunas, .st-tk-ditutup { background: #e3f4e5; color: #1f6b25; }
.st-tk-batal, .st-tk-ditolak, .st-tk-arsip { background: #fde8e6; color: #9b2c22; }
.tk-suf { display: flex; align-items: stretch; }
.tk-suf input { flex: 1; min-width: 0; }
.tk-suf span { display: flex; align-items: center; padding: 0 10px; background: #f1f4f8; border: 1px solid var(--garis); border-left: 0; border-radius: 0 6px 6px 0; font-size: 13px; color: var(--muted); }
.hj-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
table.tk-rab input, table.tk-rab select { min-width: 70px; }
table.tk-rab td:nth-child(2) input { min-width: 180px; }
tr.tk-kurang td { background: #fff6f5; }
.tk-waspada { color: #a86b00; }

/* ===== Absen cepat di halaman depan (SQL 32) ===== */
.absen-cepat { background: #fff; border: 1px solid var(--garis); border-left: 4px solid var(--utama, #1f6b25); border-radius: 12px; padding: 12px 14px; margin: 0 0 16px; }
.absen-cepat .ac-atas { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; }
.absen-cepat .ac-judul { font-weight: 600; font-size: 14px; }
.absen-cepat .ac-link { font-size: 13px; text-decoration: none; }
.absen-cepat .ac-isi { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; }
.absen-cepat .ac-jam { display: flex; flex-direction: column; font-size: 12px; color: var(--muted); }
.absen-cepat .ac-jam b { font-size: 22px; color: var(--teks, #222); font-variant-numeric: tabular-nums; }
.absen-cepat .ac-jam.sudah b { color: #1f6b25; }
.absen-cepat .ac-ket { color: var(--muted); font-size: 13px; margin-left: auto; }
.absen-cepat .ac-lengkap { color: #1f6b25; font-weight: 600; }
.absen-cepat .ac-tombol { margin-left: auto; width: auto; padding: 12px 22px; font-size: 16px; font-weight: 600; }
@media (max-width: 560px) { .absen-cepat .ac-tombol, .absen-cepat .ac-ket { margin-left: 0; width: 100%; } }
.ab-perlu-pilih { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 10px; }
.ab-perlu-pilih button { width: auto; }
tr.t-sembunyi td input:not([type=checkbox]), tr.t-sembunyi td select { color: #9aa3b1; background: #f4f6f9; }

/* ===== Pengajuan (SQL 33) ===== */
.aju-n { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: #c0392b; color: #fff; font-size: 11px; line-height: 18px; text-align: center; }
.aju-alur { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: -4px 0 10px; }
.aju-langkah { background: #eef2f8; border-radius: 10px; padding: 2px 8px; font-size: 12px; }
.aju-langkah i { font-style: normal; color: var(--muted); }
.aju-panah { color: var(--muted); }
.aju-lampiran { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; }
.aju-file { background: #f1f4f8; border-radius: 6px; padding: 2px 4px 2px 8px; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
.aju-file button { width: auto; padding: 0 6px; }
.aju-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px 16px; margin-bottom: 8px; }
.aju-info > div { display: flex; flex-direction: column; }
.aju-tahap { list-style: none; padding: 0; margin: 0 0 12px; counter-reset: t; }
.aju-tahap li { position: relative; padding: 4px 0 8px 30px; display: flex; flex-direction: column; border-left: 2px solid #d5dbe6; margin-left: 10px; }
.aju-tahap li::before { counter-increment: t; content: counter(t); position: absolute; left: -11px; top: 2px; width: 20px; height: 20px; border-radius: 50%; background: #d5dbe6; color: #3b4a5e; font-size: 11px; text-align: center; line-height: 20px; }
.aju-tahap li.ok::before { content: "✓"; background: #2e7d32; color: #fff; }
.aju-tahap li.kini::before { background: #f2a516; color: #fff; }
.aju-tahap li.tolak::before { content: "✗"; background: #c0392b; color: #fff; }
.aju-tahap li.lewat::before { content: "–"; }
.aju-tahap li:last-child { border-left-color: transparent; }
.aju-putus { background: #fbfcfe; }
.aju-log { list-style: none; padding: 0; margin: 0 0 10px; font-size: 13px; }
.aju-log li { padding: 5px 0; border-bottom: 1px dashed #e3e7ee; }
.aju-cat { margin: 2px 0 0 0; padding: 4px 8px; background: #f6f8fb; border-radius: 6px; }
.aju-cepat a { color: inherit; }
.aju-cepat a b { color: #c0392b; }
tr.baris-klik { cursor: pointer; }
tr.baris-klik:hover td { background: #f6f8fb; }
.st-tk-dikembalikan, .st-tk-menunggu-pencairan { background: #fff4d6; color: #8a6100; }
.st-tk-dicairkan { background: #e3f4e5; color: #1f6b25; }
#fa-rincian td:first-child input { min-width: 170px; } #fa-rincian td:nth-child(4) input { min-width: 110px; }
#panel .wil-bantu { grid-template-columns: 1fr; }
.judul-contoh { background: #1f3864; color: #fff; border-radius: 10px; padding: 14px 18px; margin: 4px 0 12px; overflow-wrap: anywhere; }
.judul-contoh .muted { color: #c9d3e6; }
.judul-contoh div { font-size: clamp(22px, 4vw, 48px); font-weight: 700; line-height: 1.15; }
/* Gaji & slip gaji */
.cek-kol { width: 34px; text-align: center; }
.cek-kol input { width: auto; margin: 0; }
.gj-ringkas { margin: 10px 0; padding: 10px 14px; }
.gj-bersih { font-size: 1.15em; color: var(--utama, #1f3864); }
.gp-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
table.gj-info { width: 100%; font-size: 10pt; }
table.gj-info td { padding: 2px 4px; }
.gt-tabel select { min-width: 110px; margin: 0; padding: 6px 8px; }
.gt-tabel input[type=checkbox] { width: auto; margin: 0; }
.gt-tabel input[type=color] { width: 40px; height: 30px; padding: 0 2px; margin: 0; vertical-align: middle; }
.gt-contoh span { font-size: 15px; white-space: nowrap; }
.qr-low-poster { background: #f5f6f8; border: 1px solid var(--garis); border-radius: 10px; padding: 10px; margin: 8px 0 12px; text-align: center; }
.qr-low-poster img { width: 100%; max-width: 420px; aspect-ratio: 4 / 5; border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,.12); background: #fff; }
.qr-low-tombol { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.qr-low-tombol button, .qr-low-tombol a { width: 100%; margin: 0; text-align: center; }
.qr-low-tombol a { grid-column: 1 / -1; display: block; padding: 10px; text-decoration: none; }
.keu-beban { display: flex; flex-direction: column; gap: 2px; }
.keu-beban-tombol { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.keu-beban-tombol .tab, .keu-beban-tombol button { width: auto; margin: 0; text-decoration: none; }
.keu-beban-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.keu-beban-tombol a.tab { display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 8px; font-size: 13px; font-weight: 600; background: var(--utama); color: #fff; border: 1px solid var(--utama); }
.keu-beban { justify-content: flex-start; }
.keu-beban-tombol { margin-top: auto; padding-top: 10px; }
.absen-cepat .ac-kunci { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.absen-cepat .ac-kunci .ac-tombol { margin-left: 0; opacity: .55; cursor: not-allowed; }
.absen-cepat .ac-kunci .ac-ket { margin-left: 0; }
@media (max-width: 560px) { .absen-cepat .ac-kunci { margin-left: 0; width: 100%; align-items: stretch; text-align: center; } }
.absen-cepat .ac-tombol.ac-terkunci { background: #8a94a6; border-color: #8a94a6; }
.absen-cepat .ac-tombol.ac-selesai { background: #1f6b25; border-color: #1f6b25; }
.absen-cepat .ac-peringatan { margin-top: 10px; padding: 10px 12px; border-radius: 8px; background: #fff6e0; border: 1px solid #f0c36d; color: #6b4a00; font-size: 14px; line-height: 1.45; }
.absen-cepat .ac-peringatan.kedip { animation: ac-kedip .6s ease 2; }
@keyframes ac-kedip { 50% { background: #ffe3a3; } }
.ins-sel { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; min-width: 170px; }
.ins-sel .ins-n { white-space: nowrap; }
.ins-sel .ins-aksi, .ins-sel .ins-edit { display: inline-flex; gap: 4px; align-items: center; }
.ins-sel .ins-aksi button, .ins-sel .ins-edit button { width: auto; margin: 0; padding: 4px 10px; }
.ins-sel .ins-edit input { width: 130px; margin: 0; padding: 6px 8px; }
.ins-detail .ins-sel { justify-content: flex-start; font-size: 18px; }
.ins-lama { margin-top: 10px; }
@media (max-width: 560px) {
  .tabel-insentif thead { display: none; }
  .tabel-insentif tr { display: block; padding: 10px 4px; border-bottom: 1px solid var(--garis); }
  .tabel-insentif td { display: inline; border: 0 !important; padding: 0 6px 0 0 !important; background: none !important; }
  .tabel-insentif td:nth-child(1), .tabel-insentif td:nth-child(4) { display: none; }
  .tabel-insentif td:nth-child(3), .tabel-insentif td:nth-child(5) { color: var(--muted); font-size: 13px; }
  .tabel-insentif td.kanan { display: block; margin-top: 8px; }
  .tabel-insentif .ins-sel { justify-content: space-between; }
}
.kunci-daftar { display: grid; gap: 6px; margin: 8px 0 10px; }
.kunci-info { background: #fff7e6; border-color: #f5c66b; color: #8a5300; margin-bottom: 12px; }
.kunci-daftar .cek-super { margin: 0; align-items: flex-start; }
.tk-rab-pajak { max-width: 640px; } .tk-rab-pajak input { max-width: 130px; } .tk-rab-pajak td:first-child { min-width: 90px; }
.peran-latihan { display: grid; gap: 8px; }
.peran-latihan button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 10px 12px; height: auto; }
#pita-latihan button { margin-left: 6px; padding: 2px 8px; }
.peran-latihan button span { text-transform: none; font-weight: 400; }
/* Lokasi komersil: kavling abu-abu, SLF pink, BAST hijau */
body.lok-komersil { --kavling: #9ca3af; --ready: #ec4899; }
.s-bast { background: #27ae60; }
.kotak.s-bast { color: #fff; }
.pajak-kons { display: grid; grid-template-columns: auto 1fr 1fr auto; gap: 6px 8px; align-items: center; margin: 4px 0 8px; }
.pajak-kons label { margin: 0; display: flex; gap: 6px; align-items: center; }
.pajak-kons label input { width: auto; }
.pajak-kons input[type=text], .pajak-kons input:not([type]) { margin: 0; }
.pajak-kons .kanan { text-align: right; white-space: nowrap; }
.kotak-ringkas { background: #f5f8fd; border: 1px solid var(--garis); border-radius: 8px; padding: 8px 10px; margin: 4px 0 10px; }
#bar-kembali { max-width: 1200px; margin: 10px auto -4px; padding: 0 16px; }
#bar-kembali button { width: auto; }
#bar-kembali.lebar { max-width: none; padding: 0 20px; }

/* ===== Target, tim & leads (SQL 45) ===== */
.tm-sel { min-width: 96px; }
.tm-sel b { font-size: 15px; }
.tm-besar b { font-size: 24px; }
.tm-p { display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 10px; background: #fde68a; color: #92400e; }
.tm-p.ok { background: #bbf7d0; color: #166534; }
.tm-bar { height: 6px; background: #e5e7eb; border-radius: 4px; margin-top: 4px; overflow: hidden; }
.tm-bar i { display: block; height: 100%; background: #f59e0b; border-radius: 4px; }
.tm-bar i.ok { background: #16a34a; }
.tm-tw { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 8px; }
.tm-tw-kartu { border: 1px solid #e5e7eb; border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.tm-tw-baris { display: flex; flex-direction: column; }
.tm-st { font-size: 12px; font-weight: 600; }
.tm-st.ok { color: #166534; } .tm-st.gagal { color: #b91c1c; } .tm-st.jalan { color: #b45309; }
.tm-kejar { font-size: 11px; color: #b45309; margin-top: 3px; }
.tm-kejar.gagal { color: #b91c1c; }
.tm-tabel td { vertical-align: top; }
.tm-lvl0 td { background: #f8fafc; }
.tm-saya td:first-child { box-shadow: inset 3px 0 0 var(--utama, #1f3864); }
.tm-peran { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 10px; white-space: nowrap; }
.tm-peran.p-SPV { background: #dbeafe; color: #1e40af; } .tm-peran.p-TL { background: #ede9fe; color: #5b21b6; } .tm-peran.p-MKT { background: #f1f5f9; color: #334155; }
.tm-daftar { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 4px 12px; }
.tm-pilih { align-items: flex-start; }
.tm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ld-st { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 10px; background: #f1f5f9; color: #334155; }
.ld-Hot { background: #fee2e2; color: #b91c1c; } .ld-Warm { background: #ffedd5; color: #c2410c; } .ld-Cold { background: #e0f2fe; color: #0369a1; }
.ld-Booking { background: #dcfce7; color: #166534; } .ld-Batal { background: #e5e7eb; color: #6b7280; }
.ld-telat { color: #b91c1c; font-weight: 600; }
.ld-awas .angka { color: #b91c1c; }
.fu-leads { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; background: #fff7ed; border: 1px solid #fdba74; border-left: 4px solid #f97316;
  border-radius: 10px; padding: 10px 12px; margin: 10px 0; font-size: 14px; }
.fu-leads a { margin-left: auto; font-weight: 600; }
.merah-teks { color: #b91c1c; }
@media (prefers-color-scheme: dark) { .fu-leads { background: #431407; border-color: #9a3412; } .tm-lvl0 td { background: transparent; } }
.aj-aktif { white-space: nowrap; margin: 0; }
/* Sertifikat & NIB kavling (SQL 46) */
.nib-angka { letter-spacing: .5px; font-variant-numeric: tabular-nums; }
.nib-ok { color: #166534; font-size: 13px; }
.nib-belum { color: #b45309; font-size: 13px; }
.nib-form { margin: 8px 0; }
.ld-centang { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 2px 10px; margin: 4px 0 8px; }
.ld-centang .cek-baris { margin: 0; }
.ld-riwayat { margin: 8px 0; font-size: 13px; } .ld-riwayat ul { margin: 6px 0; padding-left: 18px; }
.login-admin { border-top: 4px solid var(--utama, #1f3864); }
.ks-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.ks-tools span { min-width: 96px; padding: 8px 12px; border: 1px solid var(--garis); border-radius: 10px; font-size: 12.5px; color: var(--muted); }
.ks-tools span b { display: block; font-size: 18px; color: var(--teks, #1f2328); }
/* Model kop surat (Tools > PT & kode > Ubah > Model kop) */
.kop-m { display: flex; align-items: center; gap: 16px; padding-bottom: 8px; }
.kop-m img.kop-logo { width: auto; }
.kop-m .teks-kop { flex: 1; text-align: center; }
.kop-m.model-tengah { flex-direction: column; gap: 6px; } .kop-m.model-tengah .teks-kop { width: 100%; }
.kop-m.model-kiri .teks-kop, .kop-m.model-kanan .teks-kop { text-align: left; }
.kop-m.model-modern { gap: 18px; } .kop-m .km-nama { flex: 1; } .kop-m .km-nama > div:first-child { max-width: 300px; }
.kop-m .km-batas { width: 6px; align-self: stretch; } .kop-m .km-alamat { text-align: right; line-height: 1.6; }
.kop-garis { margin: 0 0 18px; } .kop-garis.ganda { border-bottom: 3px double; } .kop-garis.tebal { border-bottom: 3px solid; }
.kop-garis.tipis { border-bottom: 1px solid; } .kop-garis.dua { height: 4px; margin: 4px 0 22px; }
.kop-model { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-bottom: 10px; }
.kop-model label { border: 1px solid var(--garis); border-radius: 8px; padding: 8px 10px; cursor: pointer; font-size: 13px; }
.kop-model label:has(input:checked) { border-color: var(--utama, #1f3864); box-shadow: 0 0 0 2px rgba(31,56,100,.15); }
.kop-model small { display: block; color: var(--muted); font-size: 11.5px; }
.kop-baris td, .kop-baris th { padding: 4px 6px; white-space: nowrap; }
.kop-baris input[type=number] { width: 70px; } .kop-baris select { min-width: 140px; }
.kop-baris input[type=color] { width: 42px; height: 30px; padding: 1px; }
.kop-lihat { background: #fff; color: #000; border: 1px solid var(--garis); border-radius: 8px; padding: 14px; margin: 10px 0; overflow-x: auto; font-family: Arial, Helvetica, sans-serif; }
.kop-lihat { overflow: hidden; } .kop-skala { width: 680px; transform-origin: top left; }
.kop-atur summary { cursor: pointer; margin: 12px 0 8px; }
.kop-model label { display: block; text-transform: none; font-weight: 400; margin: 0; }
.kop-model input[type=radio], .kop-baris input[type=checkbox] { width: auto; margin: 0 4px 0 0; display: inline; }
.kop-atur input[type=color] { width: 56px; height: 34px; padding: 2px; }
.kop-atur .baris-kecil { gap: 6px; }
.menu-sub { display: block; padding: 8px 12px 2px 24px; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.lencana-pic { display: inline-block; padding: 1px 8px; border-radius: 999px; background: #e0f2fe; color: #075985; font-size: 11.5px; font-weight: 600; }
#menu-isi a.menu-mati, header#topbar .menu-grup a.menu-mati { color: #9aa3ae; cursor: not-allowed; }
#menu-isi a.menu-mati::after { content: " 🔒"; font-size: 10px; }
.menu-grup.divisi-mati > summary { color: #9aa3ae; }
.divisi-mati-info { text-align: center; padding: 28px 18px; }
.divisi-mati-info .dm-ikon { font-size: 34px; } .divisi-mati-info h2 { margin: 6px 0; }

/* Pencairan KPR per unit (Keuangan) */
.cair-st { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.cair-Lunas { background: #dcfce7; color: #166534; }
.cair-Sebagian { background: #fef3c7; color: #92400e; }
.cair-Belum-cair { background: #fee2e2; color: #991b1b; }
.cair-Plafon-kosong { background: #e5e7eb; color: #374151; }
.cair-piutang { padding: 12px; margin: 8px 0; }
.cair-bar { height: 8px; background: #e5e7eb; border-radius: 999px; overflow: hidden; margin-top: 8px; }
.cair-bar i { display: block; height: 100%; background: #16a34a; }
.cair-laba td:last-child { text-align: right; white-space: nowrap; }
@media (prefers-color-scheme: dark) {
  .cair-Lunas { background: #14532d; color: #bbf7d0; }
  .cair-Sebagian { background: #78350f; color: #fde68a; }
  .cair-Belum-cair { background: #7f1d1d; color: #fecaca; }
  .cair-Plafon-kosong, .cair-bar { background: #374151; color: #e5e7eb; }
}
/* Zona bahaya: hapus proyek & reset Tools (SQL 58) */
.zona-bahaya { border: 1.5px solid #eb5757; border-radius: 10px; padding: 10px 12px; margin-top: 12px; background: rgba(217, 45, 32, .05); }
.zona-bahaya button.merah-penuh { width: auto; margin: 0; }

/* Ikon email admin di bar atas (SQL 63) */
.email-admin { position: relative; display: flex; align-items: center; }
.email-admin[hidden] { display: none; }
.btn-email { position: relative; display: flex; align-items: center; padding: 4px; }
.btn-email svg { width: 24px; height: 24px; }
.email-angka { position: absolute; top: -6px; right: -10px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #e11d2e; color: #fff;
  font-size: 11px; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--utama, #1f3864); }
.email-angka[hidden] { display: none; }
.email-isi { position: absolute; right: -60px; top: calc(100% + 12px); width: 320px; max-width: calc(100vw - 24px); background: #fff; color: var(--teks);
  border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.18); padding: 12px; z-index: 50; font-weight: normal; }
.email-isi[hidden] { display: none; }
.email-kepala { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.email-item { display: grid; gap: 1px; padding: 7px 0; border-top: 1px solid var(--garis); font-size: 13px; }
.email-item span { color: var(--teks); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.email-item small { color: var(--muted); font-size: 11.5px; }
header#topbar .email-isi a.email-buka { display: block; text-align: center; margin-top: 8px; padding: 9px; border-radius: 8px; background: var(--utama, #1f3864); color: #fff; }
@media (max-width: 560px) { .email-isi { position: fixed; left: 12px; right: 12px; top: 58px; width: auto; } }

/* Kwitansi (Keuangan, SQL 65) */
.kw-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 900px) { .kw-form { grid-template-columns: 1fr; } }
.kw-pratinjau { border: 1px solid var(--garis, #d8dde6); border-radius: 8px; background: #fff; color: #000; padding: 14px; font-size: 9pt; overflow: hidden; }
.kw-pratinjau .kertas { font-size: 9pt; }
.kw-pratinjau .kop-logo { max-height: 44px; }
.dok-wadah.kw-dok .kertas { min-height: 0; }
.kertas.kwitansi { border: 1px dashed #999; }
.kertas.kw-batal { opacity: .7; }
@media print { .kertas.kwitansi { border: 0; } }
.kw-lbl { display: block; font-weight: 600; font-size: 13px; margin: 10px 0 6px; }
.kw-mode { gap: 16px; }
.kw-ttd-daftar { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 16px; margin: 8px 0 12px; }
.kw-pratinjau .ttd-qr img:first-child { width: 22mm; height: 22mm; }
.kw-pratinjau .kw-logo { height: 40px !important; max-width: 90px !important; }
.kw-ttd-daftar label.cek-baris { flex-wrap: nowrap; align-items: flex-start; }
tr.tr-selisih td { background: #fff4e5; }
.tabel-form .tr-alasan, .tabel-form .tr-cat { min-width: 170px; }

/* Berita & Promo (SQL 67) */
tr.br-semat td { background: #fff9e6; }
.br-media { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 6px 0; }
.br-media .br-foto img { width:100%; max-height:200px; object-fit:contain; border-radius:8px; display:block; }
.br-media .br-foto video { width: 100%; max-height: 200px; object-fit: cover; border-radius: 8px; display: block; }
@media (max-width: 760px) { .br-media { grid-template-columns: 1fr; } }
.pr-daftar { display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 16px; }
.pr-item { border: 1px solid var(--garis); border-radius: 12px; overflow: hidden; background: #fff; }
.pr-item .pr-ket { padding: 10px 12px; display: grid; gap: 8px; }
.pr-mini { zoom: .5; pointer-events: none; }
.pr-mini.kecil { zoom: .3; }
.pr-item .pr-mini .promo { border-radius: 0; }
.pf-galeri { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.pf-tpl { display: grid; gap: 4px; text-align: left; padding: 6px; border: 2px solid var(--garis); border-radius: 10px; background: #fff; cursor: pointer; font: inherit; color: inherit; width: auto; margin: 0; }
.pf-tpl.pilih { border-color: var(--utama, #1f3864); box-shadow: 0 0 0 2px rgba(31,56,100,.2); }
.pf-tpl .pr-mini .promo { border-radius: 10px; min-height: 0; }
.pf-kanan { position: sticky; top: 0; }
#pf-lihat .promo { min-height: 280px; }
@media (min-width: 901px) { #pf-lihat { zoom: .62; } }
[data-pf-jenis] { width: auto !important; margin: 0 !important; }
.promo { text-transform: none; }
/* Kwitansi: ukuran kertas (SQL 69) */
.kertas.kw-kecil .ttd-qr img:first-child { width: 20mm; height: 20mm; }
.kertas.kw-mini .ttd-qr img:first-child { width: 15mm; height: 15mm; }
.kertas.kw-mini .ttd-qr { margin: 1px 0 2px; }
.kertas.kw-mini .ttd-qr .qr-logo { width: 5mm !important; }
.kw-pratinjau .kertas.kwitansi { font-size: 9pt !important; }
.kw-pratinjau .kertas.kw-mini { font-size: 8pt !important; }
.dok-alat .kw-alat { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 0 12px; font-size: 13px; font-weight: 600; }
.dok-alat .kw-alat select { width: auto; margin: 0; padding: 4px 8px; }
@media print { .kertas.kwitansi { box-shadow: none; } }
.dok-alat .kw-alat select { text-transform: none; }
.cek-grid { display: grid; gap: 2px 14px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); margin-bottom: 10px; }

/* Stiker & plat KPR Sejahtera (stiker.js): dicetak di kertas stiker A4 ukuran asli (plat 210 x 150 mm, stiker 210 x 80 mm). */
.dok-wadah.kpr { overflow-x: auto; }
.dok-wadah.kpr .kertas.lembar-kpr { width: 210mm; height: 297mm; min-height: 0; max-width: none; padding: 5mm 0 !important; page: a4kpr; display: flex; flex-direction: column; align-items: center; gap: 10mm;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; box-sizing: border-box; overflow: hidden; }
@page a4kpr { size: 210mm 297mm; margin: 0; }
.kpr-pilihan { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.kpr-pilihan select { width: auto; margin: 0; padding: 4px 8px; }
.kpr-saran { max-width: 210mm; margin: 0 auto 10px; font-size: 13px; color: #fff; text-align: center; }
.plat-kpr, .stiker-kpr { flex: 0 0 auto; width: 210mm; position: relative; overflow: hidden; box-sizing: border-box; outline: .2mm solid #777; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.plat-kpr { height: 150mm; background: #1e4f32; padding: 3mm; display: flex; flex-direction: column; gap: 2.5mm; font-family: Arial, Helvetica, sans-serif; color: #222; }
.stiker-kpr { height: 80mm; background: #fff; }
/* Garis potong: tepi tiap potongan = garis potong (abu-abu tipis); tanda sudut 4 mm di luar potongan sebagai patokan gunting/cutter. */
.kpr-pot { position: relative; flex: 0 0 auto; width: 210mm; }
.kpr-pot .kp { position: absolute; width: 0; height: 0; pointer-events: none; }
.kpr-pot .kp::before, .kpr-pot .kp::after { content: ""; position: absolute; background: #000; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.kpr-pot .kp::before { width: .2mm; height: 4mm; left: -.1mm; }
.kpr-pot .kp::after { height: .2mm; width: 4mm; top: -.1mm; }
.kpr-pot .kp-ka, .kpr-pot .kp-ki { top: 0; } .kpr-pot .kp-ba, .kpr-pot .kp-bi { bottom: 0; }
.kpr-pot .kp-ki, .kpr-pot .kp-bi { left: 0; } .kpr-pot .kp-ka, .kpr-pot .kp-ba { right: 0; }
.kpr-pot .kp-ka::before, .kpr-pot .kp-ki::before { bottom: .5mm; } .kpr-pot .kp-ba::before, .kpr-pot .kp-bi::before { top: .5mm; }
.kpr-pot .kp-ki::after, .kpr-pot .kp-bi::after { right: .5mm; } .kpr-pot .kp-ka::after, .kpr-pot .kp-ba::after { left: .5mm; }
.plat-kpr .pk-atas { position: relative; flex: 0 0 72mm; background: rgb(91,178,72); border: .6mm solid #2f7d3a; text-align: center; color: #fff; }
.plat-kpr .pk-logo-kiri { position: absolute; left: 5mm; top: 4mm; height: 21mm; }
.plat-kpr .pk-logo-kanan { position: absolute; right: 5mm; top: 4mm; height: 19mm; }
.plat-kpr .pk-judul { font-family: Impact, Anton, "Arial Narrow", sans-serif; font-size: 66pt; line-height: 1; margin-top: 13mm; letter-spacing: .5mm; }
.plat-kpr .pk-sub { font-family: Impact, Anton, "Arial Narrow", sans-serif; font-size: 34pt; line-height: 1; margin-top: 5mm; }
.plat-kpr .pk-bawah { flex: 1; display: flex; gap: 2.5mm; min-height: 0; }
.plat-kpr .pk-panel { background: #fff; padding: 3mm; overflow: hidden; }
.plat-kpr .pk-nomor { flex: 0 0 50mm; display: flex; flex-direction: column; align-items: center; text-align: center; }
.plat-kpr .pk-nomor { gap: 2.5mm; }
.plat-kpr .pk-nr { flex: 1; width: 100%; min-height: 0; display: flex; align-items: center; justify-content: center; font-family: Impact, Anton, "Arial Narrow", sans-serif; color: #000; white-space: nowrap; overflow: hidden; }
.plat-kpr .pk-nr span { display: inline-block; line-height: .9; transform-origin: center; }
.plat-kpr .pk-per { flex: 0 0 auto; font: 800 10pt Arial, Helvetica, sans-serif; color: #000; letter-spacing: .4mm; line-height: 1; margin-top: -1mm; }
.plat-kpr .pk-tahun { flex: 0 0 21mm; width: 100%; background: #f6a623; color: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1mm 2mm; box-sizing: border-box; overflow: hidden; }
.plat-kpr .pk-tahun small { font: 900 9pt Arial, Helvetica, sans-serif; color: #000; letter-spacing: .3mm; }
.plat-kpr .pk-tahun b { flex: 1; width: 100%; min-height: 0; display: flex; align-items: center; justify-content: center; font-family: Arial Black, Arial, Helvetica, sans-serif; font-weight: 900; line-height: 1; color: #000; white-space: nowrap; overflow: hidden; }
.plat-kpr .pk-tengah { flex: 1; display: flex; align-items: center; justify-content: space-around; gap: 3mm; }
.plat-kpr .pk-bank { flex: 1; min-width: 0; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; font-weight: 800; font-size: 16pt; color: #1f3864; }
.plat-kpr .pk-bank img { width: 100%; height: 100%; object-fit: contain; }
.plat-kpr .pk-qr { flex: 0 0 42mm; width: 42mm; height: 42mm; }
@media screen { .plat-kpr .pk-qr { outline: .3mm dashed #ccc; } }
.plat-kpr img, .stiker-kpr img { image-rendering: auto; }

.plat-kpr .pk-ketentuan { flex: 0 0 56mm; font-size: 9pt; line-height: 1.25; color: #000; font-weight: 600; }
.plat-kpr .pk-ketentuan b { display: block; text-align: center; font-size: 1.3em; font-weight: 900; margin-bottom: .6em; }
.plat-kpr .pk-ketentuan ol { margin: 0 0 2mm; padding-left: 4mm; }
.plat-kpr .pk-ketentuan li { margin-bottom: 1mm; }
.plat-kpr .pk-ketentuan p { margin: 0; }
.stiker-kpr .sk-dasar { position: absolute; inset: 0; width: 100%; height: 100%; }
.stiker-kpr .sk-kotak { position: absolute; top: auto; bottom: 59%; width: 12%; height: 23%; display: flex; align-items: flex-end; justify-content: center; padding: 0; box-sizing: border-box; text-align: center; font: 700 7pt Arial, sans-serif; color: #fff; }
@media screen { .stiker-kpr .sk-kotak:has(span) { outline: .3mm dashed rgba(255,255,255,.6); } }
.stiker-kpr .sk-bank { left: 53.9%; }
.stiker-kpr .sk-dev { left: 68.3%; }
.stiker-kpr .sk-kotak img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.stiker-kpr .sk-kotak.putih img { filter: brightness(0) invert(1); }
@media print { .kpr-saran { display: none; } }
.dok-wadah.kpr-hal { padding: 12px; background: #5b6168; border-radius: 10px; margin-top: 12px; overflow: hidden; }
.dok-wadah.kpr-hal .kpr-saran { color: #fff !important; }
@media print { body.ada-dokumen .kpr-hal { display: none; } }

/* v93-t3: sejajarkan judul dan label filter penjualan, tanpa mengubah form lain. */
.dash-kepala { row-gap: 14px; }
.dash-kepala > b { margin: 0; line-height: 1.4; align-self: center; }
.dash-kepala > label { display: inline-flex; align-items: center; gap: 6px; margin: 0; line-height: 1.4; }
@media (max-width: 600px) { .dash-kepala > label { flex: 1 1 100%; } }

/* Tahap 6D: kontrol lebar panel, tanpa mengubah skala atau data formulir. */
.panel-box.panel-ukuran-manual { width: var(--msb-panel-width); max-width:100%; flex-shrink:0; }
.panel-ukuran-toolbar { position:sticky; top:-20px; z-index:5; display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:-20px -20px 16px; padding:12px 44px 12px 12px; background:#fff; border-bottom:1px solid var(--garis); box-shadow:0 2px 5px #00000008; }
.panel-ukuran-toolbar button:not(.panel-tutup) { width:auto; min-height:34px; padding:6px 9px; font-size:12px; margin:0; }
.panel-ukuran-toolbar .panel-tutup { top:9px; right:10px; margin:0; width:28px; height:32px; padding:0; }
.biaya-table { min-width:1380px; table-layout:auto; }
.biaya-table th { white-space:normal; }
.biaya-table td:first-child { min-width:280px; }
.biaya-table textarea { width:100%; min-width:260px; min-height:54px; resize:vertical; white-space:pre-wrap; overflow-wrap:anywhere; }
.biaya-table select[data-key="kode"] { min-width:115px; }
.biaya-table select[data-key="penanggung"] { min-width:145px; }
.biaya-table select[data-key="dana"] { min-width:115px; }
.biaya-table select[data-key="mode"] { min-width:135px; }
.biaya-table input[data-key="nilai"],.biaya-table input[data-key="dasar"] { min-width:145px; text-align:right; }
@media print { .panel-ukuran-toolbar { display:none!important; } }

/* Warna hanya untuk judul subbagian; menu utama memakai gaya awal. */
#menu-isi .menu-sub { margin:10px 8px 4px 16px; padding:6px 9px; border-radius:5px; border-left:3px solid; line-height:1.4; }
#menu-isi [data-sub-warna="penjualan"] { color:#1e40af; background:#edf3ff; border-color:#2563eb; }
#menu-isi [data-sub-warna="marketing"] { color:#9d174d; background:#fdf0f5; border-color:#be185d; }
#menu-isi [data-sub-warna="proyek"] { color:#155e75; background:#eaf7fb; border-color:#0e7490; }
#menu-isi [data-sub-warna="legal"] { color:#5b21b6; background:#f3edff; border-color:#7c3aed; }
#menu-isi [data-sub-warna="keuangan"] { color:#166534; background:#eaf7ee; border-color:#15803d; }
#menu-isi [data-sub-warna="sdm"] { color:#9a3412; background:#fff1e8; border-color:#c2410c; }

/* QR lengkap pada detail; kotak plat memakai QR saja. */
.siaki-kartu { display:flex; align-items:center; gap:24px; flex-wrap:wrap; padding:16px; background:#fff; color:#111; }
.siaki-qr { position:relative; display:block; flex-shrink:0; width:240px; height:240px; background:#fff; }
.siaki-qr .siaki-code { display:block; width:100%; height:100%; }
.siaki-logo { position:absolute; top:43%; left:43%; width:14%; height:14%; box-sizing:border-box; border:3px solid white; background:#fff; display:flex; align-items:center; justify-content:center; }
.siaki-logo img { width:100%; height:100%; object-fit:contain; }
.siaki-data { flex:1; min-width:180px; overflow-wrap:anywhere; }
.siaki-data h2 { margin:0 0 8px; }
.siaki-data p { margin:6px 0; }
.plat-kpr .pk-qr .siaki-qr { width:42mm; height:42mm; }
@media(max-width:480px) { .siaki-kartu { padding:8px; gap:12px; } .siaki-qr { width:200px; height:200px; } }
@media print { .siaki-kartu { break-inside:avoid; } .siaki-qr { width:55mm; height:55mm; } }

/* Submenu Keuangan: kelompok input dan rekap/laporan. */
.keu-tab { align-items:flex-start; gap:10px; }
.keu-submenu { flex:1 1 210px; min-width:0; border:1px solid #cbd5e1; border-radius:9px; background:#fff; overflow:hidden; }
.keu-submenu > summary { cursor:pointer; padding:12px 14px; font-weight:600; font-size:13px; color:#1e3a5f; }
.keu-sub-input > summary { background:#eaf5ee; color:#166534; }
.keu-sub-laporan > summary { background:#eaf0fc; color:#1e40af; }
.keu-sub-atur > summary { background:#f3edfc; color:#5b21b6; }
.keu-submenu > summary:focus-visible { outline:2px solid #1e40af; outline-offset:-3px; }
.keu-subisi { display:flex; flex-wrap:wrap; gap:8px; padding:12px; border-top:1px solid #e2e8f0; }
.keu-subisi .tab { margin:0; }
@media(max-width:600px) { .keu-submenu { flex-basis:100%; } }
/* ID card: ukuran fisik independen dari kertas cetak. */
.idcard-tools { display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:12px; }
.idcard-tools label { display:flex; align-items:center; gap:5px; color:#fff; margin:0; }
.idcard-tools select,.idcard-tools input { width:auto; margin:0; padding:5px; background:white; color:#172b4d; }
.idcard-tools input { width:60px; }
.id-sheet { display:flex; flex-wrap:wrap; align-content:flex-start; gap:5mm; background:#fff; width:210mm; min-height:297mm; padding:10mm; margin:auto; box-sizing:border-box; }
.id-sheet.id-f4 { width:210mm; min-height:330mm; }
.id-sheet.id-letter { width:215.9mm; min-height:279.4mm; }
.msb-idcard { position:relative; flex:0 0 auto; box-sizing:border-box; background:#fff; color:#172b4d; border:.2mm solid #cbd5e1; border-radius:3mm; overflow:hidden; width:53.98mm; height:85.6mm; display:flex; flex-direction:column; align-items:center; padding:3mm; break-inside:avoid; font-family:Lexend,Arial,sans-serif; }
.msb-idcard .id-kop { display:flex; flex-direction:column; align-items:center; width:100%; background:transparent; padding:0; position:static; color:#172b4d; border:0; }
.id-logo { width:32mm; height:11.69mm; overflow:hidden; flex-shrink:0; }
.id-logo img { width:32mm; height:auto; display:block; }
.id-pt { text-align:center; font-size:6.5pt; font-weight:600; line-height:1.3; margin-top:1mm; max-width:100%; }
.id-isi { display:flex; flex-direction:column; align-items:center; width:100%; gap:4mm; margin-top:3mm; }
.id-foto { width:30mm; height:40mm; object-fit:contain; background:#fff; border:.2mm solid #e2e8f0; border-radius:1mm; }
.id-identitas { width:100%; text-align:center; }
/* Tahap68o: baris bawah = identitas + QR data ID */
.id-bawah { display:flex; align-items:center; gap:2mm; width:100%; }
.id-bawah .id-identitas { flex:1; min-width:0; text-align:left; }
.id-qr { flex:0 0 15mm; width:15mm; height:15mm; }
.id-qr svg { width:100%; height:100%; display:block; }
/* Tahap68r — logo MSB di tengah QR (bagian bawah logo "PROPERTY" dipotong seperti di kop kartu). */
.id-qr { position:relative; }
.id-qr-logo { position:absolute; left:50%; top:50%; width:34%; height:19%; transform:translate(-50%,-50%); background:#fff; border-radius:.4mm; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.id-qr-logo img { width:86%; aspect-ratio:2.73; object-fit:contain; object-position:top; display:block; }
.id-portrait .id-isi { gap:2.5mm; margin-top:2.5mm; }
.id-landscape .id-bawah { flex:1; align-self:stretch; flex-direction:column; align-items:flex-start; justify-content:space-between; }
.id-landscape .id-qr { flex:0 0 17mm; width:17mm; height:17mm; align-self:flex-end; }
.id-nama { font-size:10pt; font-weight:700; line-height:1.2; overflow-wrap:anywhere; max-height:9mm; overflow:hidden; }
.id-nomor { margin-top:1mm; font-size:9pt; font-weight:600; overflow-wrap:anywhere; }
.id-kaki { position:absolute; height:2mm; bottom:0; left:0; right:0; background:linear-gradient(90deg,#c62828 0 50%,#1e40af 50%); }
.msb-idcard.id-landscape { width:85.6mm; height:53.98mm; padding:3mm; }
.id-landscape .id-kop { flex-direction:row; gap:3mm; }
.id-landscape .id-logo { width:27mm; height:9.86mm; }
.id-landscape .id-logo img { width:27mm; }
.id-landscape .id-pt { flex:1; text-align:left; margin:0; }
.id-landscape .id-isi { flex-direction:row; margin-top:2mm; gap:4mm; }
.id-landscape .id-foto { width:24mm; height:32mm; }
.id-landscape .id-identitas { flex:1; }
.idcard-dok { overflow-x:auto; }
@page idcarda4 { size:A4 portrait; margin:10mm; }
@page idcardf4 { size:210mm 330mm; margin:10mm; }
@page idcardletter { size:Letter portrait; margin:10mm; }
@media print {
 .id-sheet { width:auto!important; min-height:0!important; margin:0; padding:0; }
 .id-sheet.id-a4 { page:idcarda4; }
 .id-sheet.id-f4 { page:idcardf4; }
 .id-sheet.id-letter { page:idcardletter; }
 .msb-idcard { print-color-adjust:exact; -webkit-print-color-adjust:exact; }
}

/* Kop kosong memakai master kop surat yang sama. */
.dok-wadah.kop-kosong .kop-lembar { box-sizing:border-box; max-width:none; padding:15mm; break-after:page; }
.dok-wadah.kop-kosong .kop-lembar:last-child { break-after:auto; }
.dok-wadah.kop-kosong .kc-a4-portrait { width:210mm; min-height:297mm; page:kcka4portrait; }
@page kcka4portrait { size:210mm 297mm; margin:15mm; }
.dok-wadah.kop-kosong .kc-a4-landscape { width:297mm; min-height:210mm; page:kcka4landscape; }
@page kcka4landscape { size:297mm 210mm; margin:15mm; }
.dok-wadah.kop-kosong .kc-f4-portrait { width:210mm; min-height:330mm; page:kckf4portrait; }
@page kckf4portrait { size:210mm 330mm; margin:15mm; }
.dok-wadah.kop-kosong .kc-f4-landscape { width:330mm; min-height:210mm; page:kckf4landscape; }
@page kckf4landscape { size:330mm 210mm; margin:15mm; }
.dok-wadah.kop-kosong .kc-letter-portrait { width:215.9mm; min-height:279.4mm; page:kckletterportrait; }
@page kckletterportrait { size:215.9mm 279.4mm; margin:15mm; }
.dok-wadah.kop-kosong .kc-letter-landscape { width:279.4mm; min-height:215.9mm; page:kckletterlandscape; }
@page kckletterlandscape { size:279.4mm 215.9mm; margin:15mm; }
@media print { .dok-wadah.kop-kosong .kop-lembar { width:auto; min-height:0; padding:0; margin:0; box-shadow:none; } }

/* Empat logo disusun sebagai satu kelompok, pusatnya sama dengan judul. */
.stiker-kpr .sk-logo-mask { position:absolute; left:32%; top:10%; width:25%; height:33%; background:rgb(42,90,112); }
.stiker-kpr .sk-logo-row { position:absolute; left:29.4%; width:52.2%; top:11%; height:30%; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:5.75%; align-items:end; }
.stiker-kpr .sk-logo-row .sk-kotak { position:static; width:100%; height:100%; min-width:0; display:flex; align-items:flex-end; justify-content:center; }
.stiker-kpr .sk-logo-row .sk-kotak img { display:block; width:100%; height:100%; object-fit:contain; object-position:center bottom; }
@media print { .stiker-kpr .sk-logo-mask { print-color-adjust:exact; -webkit-print-color-adjust:exact; } }

.id-photo-loading { position:fixed; inset:0; z-index:99999; background:rgba(255,255,255,.95); display:flex; align-items:center; justify-content:center; padding:24px; text-align:center; color:#172b4d; font:16px Lexend,Arial,sans-serif; }

/* Lebar/jarak tetap; proporsi asli bank/PT, tinggi dibatasi di bawah bulatan Tapera. */
.stiker-kpr .sk-logo-row .sk-bank img,.stiker-kpr .sk-logo-row .sk-dev img { height:78%; max-height:78%; object-fit:contain; object-position:center bottom; }

.id-sheet + .id-sheet { margin-top:8mm; }
@media print { .id-sheet { break-after:page; } .id-sheet:last-child { break-after:auto; } .id-sheet + .id-sheet { margin-top:0; } }

.paklaring-kertas .pkl-identitas { width:100%; border:0; }
.paklaring-kertas .pkl-identitas td { border:0; padding:2mm 0; vertical-align:top; }
.paklaring-kertas .pkl-identitas td:first-child { width:35mm; }
.paklaring-kertas .pkl-ttd { width:65mm; margin-left:auto; text-align:center; break-inside:avoid; }
.paklaring-kertas .pkl-ttd img { max-width:26mm; }

/* Draft harus tetap dikenali pada preview, cetak, dan PDF. */
.dok-wadah.draft-cetak .kertas::before { content:'DRAFT — BELUM FINAL'; display:block; color:#b42318; font:700 10pt Lexend,Arial,sans-serif; text-align:center; padding:2mm 0; }
@media print { .dok-wadah.draft-cetak .kertas::before { display:block!important; } }

/* Pengecualian: logo Sumsel/Syariah berada di tengah slot, bukan rata bawah. */
.stiker-kpr .sk-logo-row .sk-bank.sk-bank-tengah { align-items:flex-end; }
.stiker-kpr .sk-logo-row .sk-bank.sk-bank-tengah img { object-position:center bottom; }

/* Default isi surat rata kiri-kanan; blok struktural tetap mengikuti format. */
.dok-wadah .kertas > p:not([style*="text-align"]),.dok-wadah .kertas .surat-isi { text-align:justify; }

textarea[id^="s-p"],#pk-isi,#pk-penutup,#sf-kronologi,#sf-dasar,#sf-klarifikasi,#sf-perbaikan,#sf-penutup { text-align:justify; }

/* Default dokumen preview/cetak: Verdana; SLF mempertahankan format yang ada. */
.dok-wadah:not(.slf) { font-family:Verdana,Arial,sans-serif; }
.dok-wadah:not(.slf) .kertas,.dok-wadah:not(.slf) .msb-idcard { font-family:Verdana,Arial,sans-serif; }

/* Kerapian teks preview/cetak; pertahankan identitas, kop, angka, TTE dan SLF. */
.dok-wadah:not(.slf) .kertas p { line-height:1.5; orphans:3; widows:3; overflow-wrap:break-word; word-break:normal; }
.dok-wadah:not(.slf) .kertas .dok-identitas { text-align:left; }
.dok-wadah:not(.slf) .kertas table { max-width:100%; border-collapse:collapse; }
.dok-wadah:not(.slf) .kertas th,.dok-wadah:not(.slf) .kertas td { vertical-align:top; }
.dok-wadah:not(.slf) .kertas thead { display:table-header-group; }
@media print { .dok-wadah:not(.slf) .kertas tr { break-inside:avoid; } }

/* Bantuan halaman dan pasangan label–nilai: struktur ringkas, bukan satu paragraf panjang. */
.panduan-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0;}
.panduan-item {padding:14px 16px;background:#fff;border:1px solid #dbe2ea;border-radius:10px;min-width:0;}
.panduan-item h2 {font-size:15px;margin:0 0 8px;color:#1f3864;}
.panduan-item p {margin:0;line-height:1.65;text-align:left;}
.panduan-detail {margin:8px 0 18px;line-height:1.65;}
.panduan-detail summary {cursor:pointer;color:#1f3864;font-weight:600;}
.panduan-halaman {max-width:100%;margin:12px 0 18px;line-height:1.65;text-align:left;}
.panduan-halaman ul {margin:0;padding-left:22px;display:grid;gap:7px;}
.label-rapi {display:grid;grid-template-columns:max-content minmax(0,1fr);gap:5px 12px;text-align:left;margin:10px 0 16px;line-height:1.5;}
.label-rapi dt {font-weight:600;margin:0;}
.label-rapi dd {position:relative;margin:0;padding-left:12px;overflow-wrap:break-word;}
.label-rapi dd::before {content:':';position:absolute;left:0;}
@media(max-width:650px){.panduan-grid{grid-template-columns:1fr}.label-rapi{grid-template-columns:minmax(95px,35%) minmax(0,1fr);gap:6px 8px}}
/* Pola keterbacaan umum di seluruh modul portal, modal, dan preview. */
#app > p,#app .judul-baris p,#panel-isi > p {line-height:1.65;max-width:100ch;margin:10px 0 16px;}
#app .kartu > p,#panel-isi .kartu > p {line-height:1.65;}
#app h1,#panel-isi h1 {margin-bottom:14px;}
#app h2,#panel-isi h2 {line-height:1.4;}
#app .panduan-halaman,#panel-isi .panduan-halaman {padding:12px 16px;border-left:3px solid #cbd5e1;background:#f8fafc;border-radius:5px;}
#panel-isi .label-rapi {margin:12px 0 18px;}
#app .lap-filter,#panel-isi .pub-grid {row-gap:12px;}
.dok-wadah .label-rapi {font-size:inherit;break-inside:avoid;}

.monitor-badge-m,.monitor-badge-k{background:#b42318;color:#fff;border-radius:12px;padding:2px 6px;font-size:11px;}
.monitor-badge-m::before{content:'M ';}.monitor-badge-k::before{content:'K ';}

.monitor-nav{margin:14px 0 18px;gap:8px;flex-wrap:wrap;}
.monitor-nav a{white-space:normal;text-align:center;}

/* Tahap63: sub menu bertingkat (Divisi > Sub > menu). Hanya satu sub terbuka per kelompok. */
#menu-isi .menu-subgrup { margin: 2px 6px 2px 14px; background: transparent; }
#menu-isi .menu-subgrup > summary { margin: 4px 0; padding: 6px 9px; border-radius: 5px; border-left: 3px solid; font-size: 12px; line-height: 1.4; }
#menu-isi .menu-subgrup[open] { background: transparent; }
header#topbar .menu-subgrup a { padding-left: 20px; }
/* Tahap63: Tools Master per divisi. */
.tools-grup-wadah { display: grid; gap: 6px; margin: 12px 0; }
.tools-grup { display: grid; grid-template-columns: 190px 1fr; gap: 8px; align-items: start; padding: 6px 9px; border-left: 3px solid; border-radius: 5px; }
.tools-grup .tools-tab { margin: 0; gap: 6px; }
.tools-grup .tools-tab a.tombol-link, .tools-grup .tools-tab button { padding: 6px 10px; font-size: 13px; }
.tools-grup-judul { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding-top: 7px; }
.tools-grup[data-sub-warna="proyek"] { color: #155e75; background: #eaf7fb; border-color: #0e7490; }
.tools-grup[data-sub-warna="penjualan"] { color: #1e40af; background: #edf3ff; border-color: #2563eb; }
.tools-grup[data-sub-warna="legal"] { color: #5b21b6; background: #f3edff; border-color: #7c3aed; }
.tools-grup[data-sub-warna="sdm"] { color: #9a3412; background: #fff1e8; border-color: #c2410c; }
.tools-grup[data-sub-warna="keuangan"] { color: #166534; background: #eaf7ee; border-color: #15803d; }
@media (max-width: 640px) { .tools-grup { grid-template-columns: 1fr; gap: 4px; } .tools-grup-judul { padding-top: 0; } }
#menu-isi .menu-grup:not([open]) > summary::after { transform: none; }
#menu-isi .menu-grup[open] > summary::after { transform: rotate(90deg); }

/* Tahap68: kartu lokasi di beranda rata — foto, nama, bar, dan angka status sejajar walau nama/isi berbeda panjang. */
.grid-lokasi { align-items: stretch; }
.kartu-lokasi { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; }
.kartu-lokasi .foto-lokasi { flex: none; }
.kartu-lokasi .nama { min-height: 2.6em; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kartu-lokasi .sub { min-height: 1.4em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kartu-lokasi .bar { margin-top: auto; flex: none; }
.kartu-lokasi .angka-status { min-height: 1.5em; }
/* Tahap68b: kartu lokasi sejajar - batalkan jarak atas ".kartu + .kartu" (rapi.css) di dalam grid lokasi */
main .grid-lokasi > .kartu.kartu-lokasi { margin: 0; }
/* Tahap68f: link isi data mandiri */
#panel [hidden], .isi-mandiri [hidden], #k-mandiri [hidden] { display: none !important; }
#panel label input[type=radio], #panel label input[type=checkbox] { width: auto; margin: 0 4px 0 0; vertical-align: middle; }
/* Tahap68g: Perizinan (tombol akses bergambar) */
.li-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 14px; margin-top: 14px; }
.li-tombol { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 18px 10px 14px; background: #fff; border: 1px solid #e4e7ec; border-radius: 14px; text-decoration: none; color: inherit; text-align: center; transition: box-shadow .15s, transform .15s; }
.li-tombol:hover { box-shadow: 0 6px 18px rgba(16, 24, 40, .12); transform: translateY(-2px); }
.li-tombol b { font-size: 13px; line-height: 1.3; }
.li-gambar { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 14px; color: #fff; font-weight: 700; overflow: hidden; flex: none; }
.li-gambar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 18%; background: #fff; }
.li-gambar.ada-logo { box-shadow: inset 0 0 0 1px #e4e7ec; }
.li-gambar:not(.ada-logo) img { opacity: 0; }
.li-saklar { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; white-space: nowrap; }
.li-saklar input { width: auto; margin: 0; }

/* 1.70: lampiran SIMAK SLF mengikuti tata letak SiKumbang */

.slf-sk, .dok-wadah .kertas.slf-sk { font-family: "Open Sans", Arial, sans-serif; font-size: 8.5pt; line-height: 1.35; }
  .slf-sk table.sk-tabel td, .slf-sk table.sk-tabel td * { font-size: 8pt; }
.slf-sk .sk-judul { font-size: 12pt; font-weight: 600; margin: 0 0 8px; }
.slf-sk .sk-isian { margin: 0 0 6px; } .slf-sk .sk-isian > div:first-child { margin-bottom: 2px; }
.slf-sk .sk-kotak { display: inline-block; min-width: 60%; min-height: 1.4em; border: 1px solid #c9ced6; border-radius: 3px; padding: 1px 5px; vertical-align: middle; box-sizing: border-box; }
.slf-sk .sk-kotak.lebar { display: block; width: 100%; background: #f4f5f7; }
.slf-sk .sk-kotak.kosong { color: #9aa1ab; }
.slf-sk .sk-unit { margin-left: 3px; }
.slf-sk .sk-cap { font-size: 6.5pt; color: #6b7280; margin-top: 2px; }
.slf-sk table.sk-tabel { width: 100%; border-collapse: collapse; margin-top: 8px; table-layout: fixed; }
  .slf-sk .sk-ts { display: flex; align-items: center; gap: 4px; } .slf-sk .sk-ts .sk-kotak { flex: 1; min-width: 0; }
.slf-sk table.sk-tabel th, .slf-sk table.sk-tabel td { border: 1px solid #d5d9e0; padding: 4px 5px; vertical-align: middle; }
.slf-sk table.sk-tabel th { font-size: 7.5pt; font-weight: 700; text-align: center; color: #333; }
.slf-sk table.sk-tabel td:first-child { text-align: center; }
.slf-sk tr.sk-bab td, .slf-sk tr.sk-grup td { font-weight: 700; }
.slf-sk tr.sk-bab td:first-child, .slf-sk tr.sk-grup td:first-child { text-align: center; }
.slf-sk .sk-t1 { padding-left: 14px !important; } .slf-sk .sk-t2 { padding-left: 26px !important; }
.slf-sk .sk-tengah { text-align: center; }
.slf-sk .sk-r { display: inline-block; width: 9px; height: 9px; border: 1px solid #555; border-radius: 50%; vertical-align: -1px; box-sizing: border-box; }
.slf-sk .sk-r.on { border-color: #1a73e8; background: radial-gradient(circle, #1a73e8 0 2.5px, #fff 3px); }
.slf-sk .sk-opsi { display: flex; flex-wrap: wrap; gap: 1px 8px; } .slf-sk .sk-opsi.dua { display: grid; grid-template-columns: max-content max-content; gap: 1px 8px; } .slf-sk .sk-opsi .sk-o, .slf-sk table.sk-tabel td .sk-opsi .sk-o { font-weight: 400; white-space: nowrap; font-size: 7pt; } .slf-sk .sk-opsi.dua { gap: 1px 5px; }
.slf-sk td .sk-kotak { min-width: 80%; } .slf-sk .sk-opsi + .sk-kotak { margin-top: 2px; min-width: 60%; }
@media print { .slf-sk .sk-r.on { -webkit-print-color-adjust: exact; print-color-adjust: exact; } .slf-sk table.sk-tabel tr { break-inside: avoid; } }

/* 1.72 — Form checklist BAST */
.bast-form-grup { margin: 10px 0; padding: 8px 10px; border: 1px solid var(--garis, #ddd); border-radius: 8px; }
.bast-form-grup > b { display: block; margin-bottom: 6px; }
.bast-form-butir { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 0; border-top: 1px dashed var(--garis, #e5e5e5); font-weight: normal; }
.bast-form-butir span { flex: 1; text-transform: none; letter-spacing: normal; }
.bast-form-butir select { width: 130px; flex: none; }

/* 1.72 — Foto opname rapi: kartu per tahap dan galeri dikelompokkan per tahap */
.fp-tahap-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin-top: 12px; }
.fp-tahap { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid var(--garis, #dde3ec); border-radius: 10px; background: #fff; }
.fp-tahap-kepala { display: flex; align-items: center; gap: 8px; min-height: 28px; }
.fp-tahap-kepala b { flex: 1; line-height: 1.25; text-transform: none; letter-spacing: normal; }
.fp-tahap-no { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: #23642d; color: #fff; font-size: 12px; font-weight: 700; }
.fp-tahap-jml { flex: none; font-size: 11.5px; color: var(--muted); }
.fp-tahap-tombol { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.fp-tahap-tombol button { width: 100%; margin: 0; }
.fp-kelompok { margin: 10px 0 14px; }
.fp-kelompok h4 { margin: 0 0 4px; padding-bottom: 4px; border-bottom: 1px solid var(--garis, #e5e9f0); }
.fp-grid figure { background: #f8fafc; border: 1px solid #e5e9f0; border-radius: 8px; padding: 4px; }
.fp-grid figcaption { line-height: 1.3; padding: 2px 2px 0; }

/* 1.72 — Dana ditahan bank (retensi) */
.cair-tahan { padding: 12px; margin-top: 12px; }
.cair-tahan .ct-ringkas { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 6px 0 8px; }
.cair-tahan .ct-form { margin-top: 8px; }
.cair-tahan .ct-form summary { cursor: pointer; font-weight: 600; }
.cair-tahan td .kedua.kecil { margin: 1px 0; }

/* 1.72 — BAST format GMM + checklist (salinan CSS_DOKUMEN untuk pratinjau) */
.kertas.bast table.daftar td.lbl { width: 150px; }
.kertas.bast table.daftar.b3 td:nth-child(2) { width: 14px; }
.kertas.bast table.daftar.b3 td:nth-child(3) { width: auto; }
.kertas.bast .kecil { font-size: 9pt; }
.kertas.bast .bast-cek-judul { margin: 10px 0 4px; font-weight: 700; }
.kertas.bast table.bast-cek { width: 100%; border-collapse: collapse; font-size: 9.5pt; }
.kertas.bast table.bast-cek th, .kertas.bast table.bast-cek td { border: 1px solid #000; padding: 2px 6px; vertical-align: top; }
.kertas.bast table.bast-cek th:first-child, .kertas.bast table.bast-cek td:first-child { width: 34px; text-align: center; }
.kertas.bast table.bast-cek th:nth-child(3), .kertas.bast table.bast-cek th:nth-child(4) { width: 100px; }
.kertas.bast table.bast-cek td.c { text-align: center; font-weight: 700; }
.kertas.bast .bast-catatan { min-height: 60px; margin-bottom: 12px; }
.kertas.bast .bast-catatan div { border-bottom: 1px solid #000; height: 22px; }
.kertas.bast table.ttd-tiga { width: 100%; margin-top: 18px; text-align: center; }
.kertas.bast table.ttd-tiga td { width: 33%; vertical-align: bottom; }
.kertas.bast table.ttd-dua td { width: 50%; text-align: center; vertical-align: top; }

/* 1.73 — SPK borongan per tahapan */
.spt { padding: 12px; margin: 8px 0; }
.spt-tabel th, .spt-tabel td { text-align: center; padding: 4px 6px; }
.spt-tabel th:first-child, .spt-tabel td:first-child { text-align: left; position: sticky; left: 0; background: #fff; z-index: 1; }
.spt-tabel th.spt-kol { cursor: pointer; font-size: 11.5px; min-width: 64px; text-transform: none; letter-spacing: normal; }
.spt-tabel th { font-size: 11.5px; text-transform: none; letter-spacing: normal; }
.spt-tabel td.spt-sel label { display: flex; flex-direction: column; align-items: center; gap: 2px; margin: 0; cursor: pointer; }
.spt-tabel td.spt-sel input { width: 18px; height: 18px; margin: 0; }
.spt-tabel td.on { background: #e7f4ea; }
.spt-tabel td.naik { background: #fff4d6; }
.spt-tabel td.spt-lain { background: #eef0f3; color: #6b7280; font-size: 12px; }
.spt-tabel td.spt-kosong { background: #f7f8fa; }
.spt-tabel td.spt-op select { width: auto; min-width: 74px; padding: 2px 4px; }
.spt-hasil { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; padding: 10px 12px; margin: 10px 0; }
.spt-ret { padding: 8px 12px; margin: 8px 0; }
.spt-tabel td:first-child { min-width: 72px; }
.spt-tabel td:first-child button { white-space: nowrap; }

/* 1.74: semua tombol Kembali di pojok kiri atas, bentuk sama */
.tombol-kembali{display:flex!important;width:auto!important;margin:0 auto 10px 0!important;align-self:flex-start}
#ub-root .berkas-unit-nav{justify-content:flex-start}