:root{--fs-judul:28px;--fs-sub:18px;--fs-bagian:15px;--fs-isi:14px;--fs-kecil:12.5px;--fs-mini:11.5px;--fs-angka:20px;--fw-biasa:400;--fw-judul:600;--fw-kuat:700;--lh-isi:1.5;--lh-judul:1.25;--tinggi-atas:64px;--ink:#17354a;--muted:#5f7380;--line:#d9e5ea;--brand:#1f5f87;--brand-2:#7dbab9;--brand-soft:#e6f3f3;--nav:#174f73;--nav-deep:#123d59;--head:#eef5f9;--danger:#b42318;--warn-bg:#fff6e5;--warn:#8a5a00;--ok-bg:#e3f2ea;--ok:#1b6b3a;--soft:#f4f7f9;--font:"Segoe UI",Roboto,"Avenir Next",Arial,sans-serif;color-scheme:light}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;background:#fff;color:var(--ink);font-family:var(--font);font-size:var(--fs-isi);font-weight:var(--fw-biasa);line-height:var(--lh-isi)}
h1,h2,h3,h4{line-height:var(--lh-judul)}
input,select,textarea,button{font-family:inherit}
a{color:var(--brand)}
button{font-family:inherit}
:focus-visible{outline:3px solid #7dbab9;outline-offset:2px}
.tanpa-tanda .p,.tanpa-tanda .contoh{display:none!important}
.p{display:inline-flex;width:20px;height:20px;border-radius:50%;background:#e07a2f;color:#fff;font-size:var(--fs-mini);font-weight:var(--fw-kuat);align-items:center;justify-content:center;vertical-align:middle;flex:none;margin:0 4px;line-height:1}
.contoh{display:inline-block;font-size:var(--fs-mini);font-weight:var(--fw-kuat);letter-spacing:.04em;text-transform:uppercase;color:var(--warn);background:var(--warn-bg);border-radius:6px;padding:2px 6px;vertical-align:middle}
/* kerangka */
.bingkai{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh;transition:grid-template-columns .18s ease}
.bingkai.ciut{grid-template-columns:76px minmax(0,1fr)}
.nav{background:linear-gradient(180deg,var(--nav),var(--nav-deep));color:#fff;display:flex;flex-direction:column;padding:0 10px 12px;position:sticky;top:0;height:100vh;overflow-y:auto;overflow-x:hidden;z-index:30;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav .merek{display:flex;align-items:center;gap:10px;height:var(--tinggi-atas);flex:none;padding:0 10px 0 18px;margin:0 -10px 10px;border-bottom:1px solid rgba(255,255,255,.14);overflow:hidden;white-space:nowrap}
.nav .merek > div{min-width:154px;transition:opacity .14s ease}
.nav .merek img{width:40px;height:40px;border-radius:12px;flex:none;background:#fff;padding:2px}
.nav .merek b{display:block;font-size:var(--fs-isi);line-height:1.15}
.nav .merek span{font-size:var(--fs-mini);opacity:.8}
.nav a{display:flex;align-items:center;gap:12px;padding:9px 12px 9px 15px;border-radius:12px;color:#fff;text-decoration:none;font-size:var(--fs-isi);white-space:nowrap;cursor:pointer;border-left:3px solid transparent;overflow:hidden;flex:none}
.nav a span{transition:opacity .14s ease}
.nav a:hover{background:rgba(255,255,255,.08)}
.nav a.on{background:rgba(255,255,255,.16);font-weight:var(--fw-kuat);border-left-color:#7dbab9}
.nav a.redup{opacity:.45;cursor:default}
.nav a.redup:hover{background:none}
.nav a svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.nav .ciutkan{margin-top:auto;margin-left:6px;align-self:flex-start;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff;font-size:var(--fs-sub);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:none}
.nav .tutup-laci{display:none}
/* L0.2.2 perbaikan rupa #2: ikon & logo tetap di tempat (tengah jalur 76 px) saat menu diciutkan/dilebarkan; hanya lebar menu dan teks yang bergerak */
.bingkai.ciut .nav .merek > div,.bingkai.ciut .nav a span{opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){.bingkai,.nav a span,.nav .merek > div{transition:none}}
.tirai{display:none}
.bingkai > .utama{min-width:0;display:flex;flex-direction:column;background:#fff}
.atas{background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;height:var(--tinggi-atas);padding:0 24px;position:sticky;top:0;z-index:20}
.atas .menu-hp{display:none}
.versi{border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:var(--fs-mini);font-weight:var(--fw-kuat);display:inline-flex;align-items:center;gap:6px;color:var(--ink);white-space:nowrap}
.versi-blok{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.versi-ket{font-size:var(--fs-mini);color:var(--muted);letter-spacing:.02em;white-space:nowrap;padding-left:2px}
.versi i{width:7px;height:7px;border-radius:50%;background:#2fa36b;display:inline-block}
.atas .ruang{flex:1}
.ikon{width:38px;height:38px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;border:0;background:none;color:var(--ink);cursor:pointer;position:relative;flex:none}
.ikon:hover{background:var(--soft)}
.ikon svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.avatar{width:40px;height:40px;border-radius:50%;background:#2a6f98;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:var(--fw-kuat);margin-left:6px;flex:none}
.siapa b{display:block;font-size:var(--fs-isi);line-height:1.15;white-space:nowrap}.siapa span{font-size:var(--fs-mini);color:var(--muted);white-space:nowrap}
.keluar{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 10px;font-weight:var(--fw-kuat);font-size:var(--fs-mini);color:var(--ink);margin-left:8px;cursor:pointer}
.pop{position:absolute;top:44px;right:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.16);padding:6px;min-width:210px;z-index:40;text-align:left}
.pop a{display:block;padding:9px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:var(--fs-isi);font-weight:var(--fw-judul);cursor:pointer;white-space:nowrap}
.pop a:hover{background:var(--soft)}
.pop a.bahaya{color:var(--danger)}
/* kepala halaman biru muda + tab */
.kepala{background:linear-gradient(180deg,#f1f7fb,var(--head));padding:30px 32px 26px;border-bottom:1px solid #d3e2ea}
.kepala.bertab{padding-bottom:0}
.kepala-atas{display:flex;align-items:center;gap:12px;min-height:44px;flex-wrap:wrap}
.kepala h1{margin:0;font-size:var(--fs-judul);font-weight:var(--fw-judul);color:var(--nav-deep);letter-spacing:-.01em;line-height:1.2}
.kepala .ruang{flex:1}
.kepala .tombol{display:flex;gap:8px;flex-wrap:wrap}
.remah{font-size:var(--fs-kecil);color:var(--muted);margin-bottom:6px}
.remah a{cursor:pointer;font-weight:var(--fw-kuat);text-decoration:none}
.tabbar{display:flex;gap:2px;margin-top:22px;margin-bottom:-1px;position:relative;z-index:1;align-items:flex-end;overflow-x:auto;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tabbar a{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;width:auto;min-width:128px;height:44px;padding:0 20px;font-weight:var(--fw-kuat);font-size:var(--fs-isi);line-height:1;text-align:center;color:#4b5f6a;text-decoration:none;border:1px solid transparent;border-bottom:0;border-radius:10px 10px 0 0;cursor:pointer;white-space:nowrap;position:relative}
.tabbar a:hover{background:rgba(255,255,255,.7);color:var(--nav-deep)}
.tabbar a.on{background:#fff;border-color:#d3e2ea;color:var(--nav-deep);height:45px;padding-top:1px}
.tabbar a[aria-expanded="true"]{color:var(--nav-deep)}
.tabbar a[aria-expanded="true"]:not(.on){background:#e4eef4}
.tabbar .panah{font-size:9px;color:currentColor;transition:transform .15s}
.tabbar a[aria-expanded="true"] .panah{transform:rotate(180deg)}
.pop.pop-tab{padding:8px;border-radius:14px;border:1px solid #cfe3e6;box-shadow:0 16px 34px -10px rgba(18,61,89,.22);display:grid;gap:2px}
.pop.pop-tab a{display:flex;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;font-weight:var(--fw-kuat);font-size:var(--fs-isi);color:var(--nav-deep)}
.pop.pop-tab a:hover{background:#eef5f9}
.pop.pop-tab a.on{background:linear-gradient(90deg,#1f5f87,#3b8f8d);color:#fff;box-shadow:0 6px 14px -6px rgba(31,95,135,.55)}
@media (prefers-reduced-motion:reduce){.tabbar .panah{transition:none}}
.isi{padding:26px 32px 40px;min-width:0;background:#fff;flex:1}
/* tombol */
.btn{min-height:38px;padding:8px 16px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-size:var(--fs-isi);font-weight:var(--fw-kuat);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;white-space:nowrap;flex-shrink:0;position:relative}
.btn:hover{background:var(--soft)}
.btn.utama{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 6px 14px rgba(31,95,135,.22)}
.btn.utama:hover{background:#184f72}
.btn.abu{background:#eef2f4;border-color:#eef2f4}
.btn.redup{opacity:.5;cursor:not-allowed}
.btn.kecil{min-height:30px;padding:4px 10px;font-size:var(--fs-kecil)}
.btn.besar{min-height:46px;padding:10px 22px}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.btn[disabled]{opacity:.6;cursor:wait}
/* daftar */
.status-baris{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.stat{border:1px solid var(--line);background:#fff;border-radius:12px;padding:9px 16px;font-size:var(--fs-isi);font-weight:var(--fw-kuat);color:#4b5f6a;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.stat b{color:var(--ink);font-weight:var(--fw-kuat)}
.stat:hover{border-color:#b9cdd6}
.stat.on{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 6px 14px rgba(31,95,135,.25)}
.stat.on b{color:#fff}
.jenis-dok{display:inline-flex;align-items:center;gap:10px;margin-left:8px;color:var(--muted);font-weight:var(--fw-judul);white-space:nowrap}
.jenis-dok select{width:230px}
.alat-baris{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.alat-baris .ruang{flex:1}
.cek-batal{display:inline-flex;align-items:center;gap:8px;color:#4b5f6a;font-size:var(--fs-isi);cursor:pointer}
.cek-batal input{width:17px;height:17px;accent-color:var(--brand)}
.cari{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 12px;width:340px;max-width:100%;min-height:42px;background:#fff;color:var(--muted)}
.cari svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;flex:none}
.cari input{border:0;outline:0;font:inherit;font-size:var(--fs-isi);flex:1;min-width:0;background:transparent;color:var(--ink)}
.btn.filter{background:#eef2f4;border-color:#eef2f4;min-height:42px}
.gulir{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
table.app{width:100%;border-collapse:collapse;background:#fff}
table.app th,table.app td{padding:11px 12px;border-top:1px solid var(--line);font-size:var(--fs-isi);text-align:left;vertical-align:top}
table.app th{background:#f4f7f9;border-top:0;font-size:var(--fs-mini);color:#4b5f6a;font-weight:var(--fw-kuat);text-transform:uppercase;letter-spacing:.04em;vertical-align:middle}
table.app td.uang,table.app th.uang{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.app td.cek,table.app th.cek{width:44px;text-align:center}
table.app input[type=checkbox]{width:16px;height:16px;accent-color:var(--brand)}
table.app a{color:var(--brand);font-weight:var(--fw-kuat);text-decoration:none;white-space:nowrap;cursor:pointer}
table.app a:hover{text-decoration:underline}
table.app .in{min-height:36px;padding:5px 8px}
table.app td .ket{display:block;font-size:var(--fs-mini);color:var(--muted);font-weight:400;margin-top:2px;white-space:normal}
table.app tbody tr:hover td{background:#fafcfd}
table.app tr.baris-batal td{color:#8a9aa4;background:#fbfbfb}
table.app.rapat th,table.app.rapat td{padding:10px 6px;font-size:var(--fs-kecil)}
table.app.rapat th:first-child,table.app.rapat td:first-child{padding-left:12px}
table.app.rapat th{font-size:var(--fs-mini)}
table.app.rapat a{font-size:var(--fs-kecil)}
table.app.rapat td:nth-child(3){min-width:140px}
table.app.rapat .tag{font-size:var(--fs-mini);padding:2px 8px}
tr.kosong td{text-align:center;color:var(--muted);padding:22px}
.tag{display:inline-block;font-size:var(--fs-mini);font-weight:var(--fw-kuat);border-radius:999px;padding:3px 10px;white-space:nowrap}
.tag.ok{background:var(--ok-bg);color:var(--ok)}.tag.belum{background:var(--warn-bg);color:var(--warn)}.tag.lewat{background:#fde8e6;color:var(--danger)}.tag.abu{background:#eef2f4;color:var(--muted)}.tag.biru{background:#e2f0f3;color:var(--nav-deep)}
.kecil{font-size:var(--fs-kecil);color:var(--muted)}
.kaki{display:flex;justify-content:space-between;gap:10px;margin-top:10px;font-size:var(--fs-kecil);color:var(--muted);flex-wrap:wrap}
.kartu{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px}
.kartu h4{margin:0 0 8px;font-size:var(--fs-isi)}
.ringkasan{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px}
.ringkasan.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rk{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff;position:relative;min-height:96px;text-align:left;font:inherit;color:inherit}
button.rk{cursor:pointer}
.rk .lbl{font-size:var(--fs-kecil);color:#4b5f6a;display:block}
.rk .hit~.lbl{padding-right:36px}
.rk .lbl b{font-size:var(--fs-isi);color:var(--ink)}
.rk .nil{display:block;font-size:var(--fs-angka);font-weight:var(--fw-kuat);margin-top:4px;font-variant-numeric:tabular-nums}
.rk .sub{display:block;font-size:var(--fs-kecil);color:#4b5f6a;margin-top:2px}
.rk .hit{position:absolute;top:14px;right:14px;min-width:26px;height:26px;border-radius:999px;background:var(--nav-deep);color:#fff;font-size:var(--fs-mini);font-weight:var(--fw-kuat);display:inline-flex;align-items:center;justify-content:center;padding:0 7px}
.rk.teal{background:#e9f4f4;border-color:#cfe5e5}
.rk.merah{background:#fff5f5;border-color:#f2c1bd}.rk.merah .hit{background:#c0392b}
.nil.merah{color:var(--danger)}
.rk.hijau{background:#eef9f2;border-color:#b9e2c8}.rk.hijau .hit{background:#2e8b57}
.rk.garis{border:1.5px dashed #5b86a3}
.rk .tautan{display:inline-block;margin-top:4px;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);color:var(--brand);cursor:pointer}
/* formulir */
.form-atas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 18px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px}
.form-atas.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.form-atas.polos{border:0;padding:0}
label.f{display:block;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);color:#3d5463;margin-bottom:5px}
.in{width:100%;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font:inherit;font-size:var(--fs-isi);background:#fff;color:var(--ink);min-height:42px}
.in:focus{border-color:#5b86a3;outline:none;box-shadow:0 0 0 3px rgba(91,134,163,.18)}
.in[readonly]{background:#f4f7f9;color:var(--muted)}
textarea.in{min-height:64px;resize:vertical}
.tgl{display:flex;gap:4px;position:relative}.tgl .in{flex:1;min-width:0}.tgl button{width:42px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;flex:none}
.tgl input[type=date]{position:absolute;right:0;bottom:0;width:42px;height:42px;opacity:0;pointer-events:none}
.saklar{display:flex;align-items:center;gap:10px;min-height:42px;cursor:pointer;font-weight:var(--fw-kuat);font-size:var(--fs-isi)}
.saklar input{width:18px;height:18px;accent-color:var(--brand)}
.bawah{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;margin-top:16px;align-items:start}
.ringkas{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.ringkas .r{display:flex;justify-content:space-between;gap:10px;padding:4px 0;font-variant-numeric:tabular-nums;align-items:center}
.ringkas .r.total{font-size:var(--fs-bagian);font-weight:var(--fw-kuat);border-top:1px solid var(--line);margin-top:6px;padding-top:8px}
.lampir{border:1px dashed var(--brand-2);border-radius:12px;padding:12px;text-align:center;color:var(--muted);font-size:var(--fs-kecil);background:#fff;margin-top:10px;cursor:pointer;display:block}
.lampir:hover{background:#f7fbfb}
.aksi{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;flex-wrap:wrap}
.bilah-aksi{display:flex;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);flex-wrap:wrap}
.bilah-aksi .ruang{flex:1}
.peringatan{background:var(--warn-bg);color:var(--warn);border-radius:10px;padding:9px 12px;font-size:var(--fs-kecil);margin-top:10px}
.galat{background:#fde8e6;color:var(--danger);border-radius:10px;padding:9px 12px;font-size:var(--fs-kecil);margin-top:10px}
.pesan-ok{background:var(--ok-bg);color:var(--ok);border-radius:10px;padding:10px 14px;font-weight:var(--fw-kuat);margin-bottom:14px;font-size:var(--fs-isi)}
.fakta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px}
.fakta div span{display:block;font-size:var(--fs-mini);color:var(--muted);font-weight:var(--fw-kuat)}.fakta div b{font-size:var(--fs-isi)}
.jurnal{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.jurnal .sisi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.jurnal .sisi h4{margin:0 0 6px;font-size:var(--fs-isi)}
.jurnal .r{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-top:1px solid var(--line);font-size:var(--fs-isi);font-variant-numeric:tabular-nums}
.jurnal .r:first-of-type{border-top:0}
.seimbang{margin-top:8px;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);color:var(--ok);grid-column:1/-1}
.tahap{display:flex;gap:6px;margin-bottom:14px;align-items:center;flex-wrap:wrap}
.tahap span:not(.p){flex:1;text-align:center;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);padding:9px;border-radius:10px;background:#eef2f4;color:var(--muted);min-width:120px}
.tahap span.ok{background:var(--ok-bg);color:var(--ok)}.tahap span.on{background:#e2f0f3;color:var(--nav-deep)}
.sapa{text-align:center;margin-top:4px}
.sapa-halo{font-size:var(--fs-sub);font-weight:var(--fw-kuat);color:var(--ink)}
.sapa-tanya{font-size:var(--fs-judul);font-weight:var(--fw-kuat);color:var(--ink);margin-top:6px;line-height:var(--lh-judul);text-wrap:balance}
.pintas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1130px;margin:26px auto 0}
.pintas a{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;text-decoration:none;color:var(--ink);font-weight:var(--fw-kuat);font-size:var(--fs-bagian);box-shadow:0 2px 8px rgba(23,79,115,.06);cursor:pointer}
.pintas a:hover{border-color:#9cc7c7;background:#f9fcfc}
.pintas a i{width:48px;height:48px;border-radius:12px;background:#e2f0f3;color:var(--nav-deep);display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:var(--fs-isi);font-weight:var(--fw-kuat);flex:none}
.pil{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);background:#fff;cursor:pointer;color:var(--ink);font-family:inherit}
.pil.on{background:#e2f0f3;border-color:var(--brand-2);color:var(--nav-deep)}
.pil.isi{background:#e2f0f3;border-color:#e2f0f3;color:var(--nav-deep);cursor:default}
.pil-baris{display:flex;gap:8px;flex-wrap:wrap}
.label{display:inline-block;border:1px solid #333;padding:4px 6px;margin:4px;background:#fff;color:#000;font-family:monospace;font-size:10px;line-height:1.2}
.label .bar{height:22px;background:repeating-linear-gradient(90deg,#000 0 2px,#fff 2px 3px,#000 3px 4px,#fff 4px 7px,#000 7px 9px,#fff 9px 10px)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
/* scan */
.dua-kolom{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:22px;align-items:start}
.kartu-besar{border:1px solid var(--line);border-radius:18px;padding:24px;background:#fff}
.kartu-besar h4{margin:0;font-size:var(--fs-sub)}
.kartu-besar .desk{color:#4b5f6a;margin:4px 0 16px}
.form-dua{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.form-dua .penuh{grid-column:1/-1}
.sesi-kartu{border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-top:12px;background:#f9fcfc;display:block;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer}
.sesi-kartu:hover{border-color:#9cc7c7}
.sesi-kartu b.no-sesi{font-size:var(--fs-bagian);color:var(--nav-deep)}
.sesi-kartu .meta{font-size:var(--fs-kecil);color:#4b5f6a;margin:6px 0}
.sesi-kartu .angka{font-weight:var(--fw-kuat);font-size:var(--fs-isi)}
.sesi-kepala{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.sesi-kepala h4{margin:0 0 8px;font-size:var(--fs-sub)}
.kotak-scan{border:1.5px dashed #9cc7c7;border-radius:14px;background:#f5fbfb;padding:18px 22px;margin-top:18px}
.kotak-scan .baris-isian{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr) 140px auto;gap:12px;align-items:end}
.kotak-scan .baris-isian.lima{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) 110px auto}
.kotak-scan .status-scan{margin-top:10px;font-weight:var(--fw-kuat);color:#1b6b5a;font-size:var(--fs-isi)}
.pilih-tiru{display:flex;align-items:center;justify-content:space-between;border:1.5px solid #5b86a3;border-radius:10px;min-height:46px;padding:0 12px;background:#fff}
.pilih-tiru input{border:0;outline:0;font:inherit;font-size:var(--fs-isi);flex:1;min-width:0;background:transparent}
.empat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:16px}
.empat div{border:1px solid var(--line);border-radius:12px;padding:12px 16px;background:#fbfdfd;min-width:0}
.empat span{display:block;font-size:var(--fs-kecil);color:#4b5f6a}
.empat b{display:block;font-size:var(--fs-angka);margin-top:2px;overflow-wrap:anywhere}
.kosong-baris{border:1px dashed var(--line);border-radius:10px;padding:22px;text-align:center;color:var(--muted)}
.hanya-hp{display:none}
/* masuk */
.masuk-hal{min-height:100vh;background:radial-gradient(circle at 50% 18%,#e4eeef,#f2f5f6 55%);display:flex;align-items:center;justify-content:center;padding:24px 16px}
.masuk-kartu{background:#fff;border:1px solid #d7e4e7;border-radius:22px;box-shadow:0 24px 50px -24px rgba(23,79,115,.35);padding:40px;width:100%;max-width:588px}
.masuk-merek{display:flex;align-items:center;gap:14px;margin-bottom:36px}
.masuk-merek img{width:58px;height:58px;border-radius:50%;box-shadow:0 8px 18px rgba(23,79,115,.3)}
.masuk-merek b{display:block;font-size:var(--fs-sub)}
.masuk-merek span{font-size:var(--fs-kecil);color:var(--muted)}
.masuk-kartu h1{margin:0 0 10px;font-size:var(--fs-judul);font-weight:var(--fw-kuat);letter-spacing:-.01em}
.masuk-kartu p{margin:0 0 30px;color:#4b5f6a;font-size:var(--fs-isi)}
.btn-google{width:100%;min-height:56px;border:1px solid #cddde2;border-radius:12px;background:#fff;color:var(--nav-deep);font:inherit;font-size:var(--fs-bagian);font-weight:var(--fw-kuat);display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}
.btn-google:hover{background:#f7fbfb}
.masuk-ket{text-align:center;font-size:var(--fs-kecil);color:var(--muted);margin-top:28px}
/* laci bantuan & toast */
.laci-kanan{position:fixed;top:0;right:0;bottom:0;width:480px;max-width:92vw;background:#fff;box-shadow:-12px 0 30px rgba(0,0,0,.16);z-index:60;display:flex;flex-direction:column}
.laci-kanan header{display:flex;align-items:center;gap:10px;height:var(--tinggi-atas);flex:none;padding:0 18px;border-bottom:1px solid var(--line)}
.laci-kanan header b{flex:1;font-size:var(--fs-sub)}
.laci-kanan .badan{padding:16px 18px;overflow-y:auto}
.laci-kanan ol{margin:0;padding-left:20px}.laci-kanan li{margin:8px 0}
.tirai-kanan{position:fixed;inset:0;background:rgba(9,30,44,.35);z-index:59}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--nav-deep);color:#fff;border-radius:12px;padding:11px 16px;font-size:var(--fs-isi);font-weight:var(--fw-judul);z-index:70;box-shadow:0 12px 26px rgba(0,0,0,.25);max-width:min(560px,calc(100vw - 32px))}
.memuat{position:fixed;top:0;left:0;height:3px;background:#7dbab9;z-index:80;animation:muat .5s ease-out forwards}
@keyframes muat{from{width:0}to{width:100%}}
@media (prefers-reduced-motion:reduce){.memuat{animation:none;width:100%}}

/* ---------- lebar tablet & HP ---------- */
@media (max-width:1100px){
  .ringkasan{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-atas.k4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fakta{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  :root{--fs-judul:24px}
  .bingkai,.bingkai.ciut{grid-template-columns:minmax(0,1fr)}
  .nav{position:fixed;left:0;top:0;bottom:0;width:272px;height:100%;transform:translateX(-102%);transition:transform .22s;box-shadow:8px 0 26px rgba(0,0,0,.25)}
  .bingkai,.bingkai.ciut{transition:none}
  .bingkai.ciut .nav .merek > div,.bingkai.ciut .nav a span{opacity:1;pointer-events:auto}
  .laci-buka .nav{transform:none}
  .laci-buka .tirai{display:block;position:fixed;inset:0;background:rgba(9,30,44,.45);z-index:25}
  .nav .ciutkan{display:none}
  .nav .tutup-laci{display:inline-flex;margin-left:auto}
  .atas{padding:8px 14px;gap:4px}
  .atas .menu-hp{display:inline-flex}
  .siapa,.keluar{display:none}
  .kepala{padding:20px 16px 18px}
  .tabbar{margin-top:16px}
  .isi{padding:18px 16px 32px}
  .form-atas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bawah,.dua-kolom,.grid2,.jurnal{grid-template-columns:minmax(0,1fr)}
  .kotak-scan .baris-isian,.kotak-scan .baris-isian.lima{grid-template-columns:1fr 1fr}
  .empat{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pintas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .status-baris{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
  .cari{flex:1 1 100%;width:auto}
  .jenis-dok select{width:200px}
}
@media (max-width:700px){
  :root{--fs-judul:22px;--fs-angka:18px}
  .form-atas,.form-atas.k4,.form-dua,.ringkasan,.ringkasan.k3,.fakta{grid-template-columns:minmax(0,1fr)}
  .form-dua .penuh{grid-column:auto}
  .kotak-scan{padding:14px}
  .kotak-scan .baris-isian,.kotak-scan .baris-isian.lima{grid-template-columns:minmax(0,1fr)}
  .pintas{grid-template-columns:minmax(0,1fr)}
  .rk{min-height:0}
  .kartu-besar{padding:16px}
  .hanya-hp{display:block}
  /* tabel jadi kartu */
  .gulir{border:0;overflow:visible}
  table.app,table.app tbody,table.app tr,table.app td{display:block;width:100%}
  table.app thead{display:none}
  table.app tr{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:6px 0;background:#fff}
  table.app tr.kosong{border-style:dashed}
  table.app td,table.app.rapat td{border:0;display:flex;justify-content:space-between;gap:12px;padding:5px 14px;text-align:right;font-size:var(--fs-isi);min-width:0!important}
  table.app td.uang{text-align:right}
  table.app td::before{content:attr(data-l);color:var(--muted);font-size:var(--fs-mini);font-weight:var(--fw-kuat);text-transform:uppercase;letter-spacing:.03em;text-align:left;flex:none;max-width:45%}
  table.app td[data-l=""]::before{display:none}
  table.app td > *{max-width:60%}
  table.app td .in{max-width:62%}
  table.app td.cek{justify-content:flex-start}
  table.app td .ket{text-align:right}
  table.app tbody tr:hover td{background:none}
  .kepala .tombol{width:100%}
  .kepala .tombol .btn{flex:1}
  .versi{font-size:var(--fs-mini);padding:3px 9px}
}
.pop{position:fixed;top:0;left:0;right:auto}
.pop a.bahaya{color:var(--danger)}
.salah{border-color:var(--danger)!important;box-shadow:0 0 0 3px rgba(180,35,24,.12)!important}
.waspada{border-color:#e0a000!important}
.hapus-baris{min-height:30px;width:30px;padding:0}
.modal-latar{position:fixed;inset:0;background:rgba(9,30,44,.45);z-index:90;display:flex;align-items:center;justify-content:center;padding:16px}
.modal{background:#fff;border-radius:16px;max-width:440px;width:100%;padding:22px;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.modal h2{margin:0 0 8px;font-size:var(--fs-sub)}.modal p{margin:0;color:#4b5f6a;font-size:var(--fs-isi)}
.btn.utama.bahaya{background:var(--danger);border-color:var(--danger);box-shadow:none}
.lampir.terisi{border-style:solid;color:var(--ink);background:#f7fbfb}
table.app input:disabled{background:#f4f7f9;color:var(--muted)}
button.sesi-kartu{display:block}
.pil.isi{flex:none}
table.app td.kode{white-space:nowrap}

.laci-kanan .badan{padding:18px}
.bantu-item{display:flex;align-items:center;gap:14px;width:100%;padding:14px;border:0;background:none;border-radius:12px;text-align:left;cursor:pointer;color:var(--ink);font:inherit}
.bantu-item:hover{background:#f4f8fa}
.bantu-ikon{width:52px;height:52px;border-radius:12px;background:#e6f3f3;color:var(--nav-deep);display:inline-flex;align-items:center;justify-content:center;flex:none}
.bantu-ikon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bantu-teks{flex:1;min-width:0}.bantu-teks b{display:block;font-size:var(--fs-bagian)}.bantu-teks span{display:block;font-size:var(--fs-kecil);color:var(--muted);margin-top:2px}
.bantu-item > svg{width:18px;height:18px;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round;flex:none}
.ikon[disabled]{opacity:.35;cursor:default}
.kilat{position:fixed;inset:0;background:#fff;z-index:95;pointer-events:none;animation:kilat .35s ease-out forwards}
@keyframes kilat{from{opacity:.85}to{opacity:0}}
@media (prefers-reduced-motion:reduce){.kilat{animation:none;opacity:0}}
.tangkap-baris{display:flex;justify-content:space-between;gap:10px;padding:10px 4px;border-top:1px solid var(--line);font-size:var(--fs-isi)}
.tangkap-baris:first-child{border-top:0}
.tangkap-baris span{color:var(--muted);font-size:var(--fs-kecil);white-space:nowrap}

/* tinjau final: dasbor, laporan, kas */
@media (max-width:1100px){.ringkasan[style]{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:700px){.ringkasan[style]{grid-template-columns:minmax(0,1fr)!important}}
.judul-form{margin:0 0 14px;font-size:var(--fs-isi);font-weight:var(--fw-kuat);letter-spacing:.1em;text-transform:uppercase;color:var(--nav-deep);padding-bottom:10px;border-bottom:1px solid var(--line)}
.rentang{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:18px}
.f-sebaris{display:inline-flex;align-items:center;gap:8px;font-weight:var(--fw-kuat);font-size:var(--fs-kecil);color:#3d5463}
.f-sebaris .tgl{width:190px}
.omset{display:grid;grid-template-columns:repeat(3,auto) 1fr;gap:12px 48px;align-items:center;background:#e9f4f4;border:1px solid #cfe5e5;border-radius:14px;padding:16px 22px;margin-bottom:18px}
.omset span{display:block;font-size:var(--fs-kecil);color:#4b5f6a}.omset b{font-size:var(--fs-angka);font-variant-numeric:tabular-nums}
.omset p{margin:0;font-size:var(--fs-kecil);color:#4b5f6a}
.dasbor-grid{gap:18px}
.kartu-g{border:1px solid var(--line);border-radius:14px;background:#fff;min-width:0}
.kartu-g header{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding:16px 20px;border-bottom:1px solid var(--line)}
.kartu-g h3{margin:0;font-size:var(--fs-bagian)}.kartu-g header span:not(.pil){font-size:var(--fs-kecil);color:var(--muted)}
.g-wadah{position:relative;padding:12px 16px 0}
.grafik-svg{width:100%;height:auto;display:block}
.g-grid{stroke:#e3ebef;stroke-width:1;stroke-dasharray:3 4}.g-nol{stroke:#9fb1bc;stroke-width:1}
.g-sumbu{font-size:11px;fill:#5f7380;font-family:var(--font)}
.g-hit:hover{fill:rgba(31,95,135,.05)}
.g-tip{position:absolute;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 24px rgba(18,61,89,.14);padding:8px 12px;font-size:var(--fs-kecil);pointer-events:none;display:grid;gap:3px;min-width:200px;z-index:2}
.g-tip i,.g-leg i,.komp-baris i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.g-leg i.garis{height:3px;border-radius:2px;vertical-align:3px}
.g-leg{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;padding:10px 20px 16px;font-size:var(--fs-kecil);color:#3d5463}
.tautan-kecil{margin-left:auto;border:0;background:none;color:var(--brand);font:inherit;font-weight:var(--fw-kuat);cursor:pointer;padding:0}
.g-tabel{margin:0 16px 16px}
.komposisi{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:24px;align-items:center;padding:18px 24px}
.donat{width:100%;max-width:260px;margin:0 auto;display:block}
.donat path{stroke:#fff;stroke-width:2;transition:opacity .15s}
.donat .redup,.komp-baris.redup{opacity:.35}
.donat-angka{font-size:26px;font-weight:700;fill:var(--ink);font-family:var(--font)}
.komp-baris{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:var(--fs-isi);cursor:default}
.komp-baris b{font-variant-numeric:tabular-nums;font-weight:var(--fw-biasa)}
.komp-total{text-align:right;font-size:var(--fs-bagian);font-weight:var(--fw-kuat);padding-top:12px}
.ops{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ops-k{cursor:pointer}.ops-k:hover{border-color:#9cc7c7}
.lap-judul h2{margin:0;font-size:var(--fs-sub);color:var(--ink)}.lap-judul h2 span{color:var(--muted);font-weight:var(--fw-judul)}
.lap-judul p{margin:4px 0 16px;font-size:var(--fs-kecil);color:var(--muted)}
.lap-filter{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;padding-bottom:16px;border-bottom:1px solid var(--line)}
.lap-filter > div:not(.lap-tombol){width:200px}
.lap-tombol{display:flex;gap:10px}
.lap-info{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:var(--fs-kecil);color:var(--muted);padding:10px 4px 12px}
table.app.lap td{vertical-align:middle}
table.app.lap .lap-grup td{background:#eef3f6;font-weight:var(--fw-kuat);color:var(--ink)}
table.app.lap .lap-sub td{background:#f8fafb;font-weight:var(--fw-kuat);font-size:var(--fs-kecil);color:#3d5463}
table.app.lap .lap-total td{font-weight:var(--fw-kuat);border-top:1.5px solid #c9d8e0}
table.app.lap .lap-kode{padding-left:22px;color:#4b5f6a;font-variant-numeric:tabular-nums}
table.app.bb .akun-kepala{cursor:pointer}
.panah-bb{display:inline-block;transition:transform .15s;margin-right:4px}
.akun-kepala[aria-expanded="false"] .panah-bb{transform:rotate(-90deg)}
.split{display:inline-flex}
.split .btn{border-radius:10px 0 0 10px;min-height:40px}
.split .btn + .btn{border-radius:0 10px 10px 0;border-left:0;width:40px;padding:0}
.ket.selisih{color:var(--danger);font-weight:var(--fw-kuat)}
table.saldo-kas td{vertical-align:top}
@media (max-width:900px){.omset{grid-template-columns:1fr 1fr}.omset p{grid-column:1/-1}.komposisi{grid-template-columns:minmax(0,1fr)}.ops{grid-template-columns:repeat(2,minmax(0,1fr))}.lap-filter > div:not(.lap-tombol){width:calc(50% - 6px)}}
@media (max-width:700px){.omset{grid-template-columns:minmax(0,1fr)}.ops{grid-template-columns:minmax(0,1fr)}.lap-filter > div:not(.lap-tombol){width:100%}.f-sebaris .tgl{width:150px}}
@media (prefers-reduced-motion:reduce){.panah-bb,.donat path{transition:none}}

.lap-filter .ruang{flex:1}
table.saldo-kas td.uang{white-space:nowrap}
table.saldo-kas td:nth-child(8){white-space:normal;min-width:150px;max-width:170px}
table.saldo-kas .split .btn{min-height:34px;font-size:var(--fs-kecil);padding:4px 12px}
table.saldo-kas .split .btn + .btn{width:34px;padding:0}
table.saldo-kas td:nth-child(3){min-width:0}
table.app.rapat.saldo-kas th:nth-child(2),table.app.rapat.saldo-kas td:nth-child(2){max-width:120px}
table.app.rapat.bb td:nth-child(4){min-width:160px}

.tombol-buat .panah{font-size:9px;margin-left:2px}
.merah-teks{color:var(--danger)}
/* ===== Produksi bagian dalam (21 Okt) ===== */
.btn.abu{background:#e8eef1;border-color:#e8eef1;color:var(--ink)}
.btn.abu:hover{background:#dde6ea}
.dok-kepala{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;margin-bottom:14px}
.dok-kepala .dk-kiri{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.dk-balik{font-size:var(--fs-kecil);font-weight:var(--fw-kuat);color:var(--brand);text-decoration:none;cursor:pointer;align-self:flex-start}
.dk-balik:hover{text-decoration:underline}
.dk-sub{font-size:var(--fs-kecil);color:var(--muted)}
.dk-kanan{text-align:right;min-width:0}
.dk-jenis{display:block;font-size:var(--fs-mini);font-weight:var(--fw-kuat);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dk-no{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:4px;flex-wrap:wrap}
.dk-no b{font-size:var(--fs-sub);color:var(--nav-deep)}
.dk-no span:not(.tag){font-size:var(--fs-kecil);color:var(--muted)}
.dok-status{display:flex;align-items:center;gap:16px;background:#f2f8f8;border:1px solid #cfe5e4;border-radius:14px;padding:14px 20px;margin-bottom:14px}
.dok-status > div:first-child{flex:1;min-width:0}
.dok-status b{display:block;font-size:var(--fs-isi)}
.dok-status span{font-size:var(--fs-kecil);color:var(--muted)}
.ds-tombol{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.ds-tombol .btn:not(.utama){background:#e8eef1;border-color:#e8eef1;min-width:100px}
.tahap-kartu{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:6px;background:#fff}
.tahap2{display:flex;align-items:center;gap:2px;padding:8px;background:#eef6f7;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:thin}
.tahap2 .th{display:inline-flex;align-items:center;gap:8px;border:0;background:#e2edf0;color:var(--nav-deep);border-radius:10px;padding:8px 12px;font:inherit;font-size:var(--fs-isi);font-weight:var(--fw-kuat);white-space:nowrap;cursor:pointer;flex:none;min-height:40px;gap:7px;padding:8px 10px}
.tahap2 .th:hover{background:#d4e5ea}
.tahap2 .th .no{font-size:var(--fs-mini);color:var(--muted);font-variant-numeric:tabular-nums}
.tahap2 .th .ikon{display:inline-flex;align-items:center;justify-content:center;font-size:var(--fs-mini);border-radius:999px;min-width:20px;height:20px;padding:0 6px}
.tahap2 .th .ikon.ok{background:var(--ok-bg);color:var(--ok)}
.tahap2 .th .ikon.tunggu{background:#d4e2e7;color:var(--muted)}
.tahap2 .th .ikon.kunci{color:#c28a1f;padding:0}
.tahap2 .th.on{background:linear-gradient(135deg,var(--brand),#2f8a8f);color:#fff;box-shadow:0 4px 10px rgba(31,95,135,.25)}
.tahap2 .th.on .no{color:#fff;background:rgba(255,255,255,.22);border-radius:6px;padding:1px 6px}
.tahap2 .th.on .ikon.ok,.tahap2 .th.on .ikon.tunggu{background:rgba(255,255,255,.22);color:#fff}
.tahap2 .th.kunci{background:transparent;color:#8aa0ab}
.tahap2 .th.kunci:hover{background:#e2edf0}
.tahap2 .sep{color:#9fb3bd;flex:none;font-size:var(--fs-kecil)}
@media (min-width:701px){.tahap2{overflow:hidden}.tahap2 .th{flex:0 1 auto;min-width:0}.tahap2 .th .nm{overflow:hidden;text-overflow:ellipsis;min-width:0}.tahap2 .th .no,.tahap2 .th .ikon{flex:none}}
@media (min-width:701px) and (max-width:1300px){.tahap2 .sep{display:none}.tahap2{gap:4px}}
@media (min-width:701px) and (max-width:1279px){.tahap2 .th:not(.on) .nm{display:none}}
.tahap-fakta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.tahap-fakta div{padding:12px 20px;border-left:1px solid var(--line);min-width:0}
.tahap-fakta div:first-child{border-left:0}
.tahap-fakta span{display:block;font-size:var(--fs-mini);font-weight:var(--fw-kuat);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tahap-fakta b{font-size:var(--fs-isi);overflow-wrap:anywhere}
.sub-bagian{margin:22px 0 10px;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);letter-spacing:.08em;text-transform:uppercase;color:var(--nav-deep)}
.bantu-isi{display:block;font-size:var(--fs-mini);color:var(--muted);margin-top:4px}
.kode-kecil{font-size:var(--fs-mini);color:var(--muted);font-weight:var(--fw-biasa)}
.kartu-tabel{border:1px solid var(--line);border-radius:14px;padding:4px 18px 16px;margin-top:22px;background:#fff}
.kt-judul{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.kt-judul .sub-bagian{margin:16px 0 10px}
.kt-judul .kecil{margin-left:auto}
.kotak-kosong{border:1px dashed #c3d4db;border-radius:12px;padding:22px;text-align:center;color:var(--muted);font-size:var(--fs-kecil);background:#fbfdfd}
.total-batch{background:#eaf5f3;border:1px solid #cfe5e4;border-radius:14px;padding:14px 20px;text-align:right;margin:12px 0 4px}
.total-batch > span{display:block;font-size:var(--fs-mini);font-weight:var(--fw-kuat);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.total-batch b{display:block;font-size:var(--fs-angka);color:var(--nav-deep);margin:2px 0}
.total-batch small{font-size:var(--fs-kecil);color:var(--muted)}
.bahan-nm b{display:block;font-size:var(--fs-isi)}
.bahan-nm span{font-size:var(--fs-mini);color:var(--muted)}
.merah-kecil{display:block;color:var(--danger);font-size:var(--fs-mini);font-weight:var(--fw-kuat);margin-top:3px}
table.app input.angka{text-align:right;max-width:130px;margin-left:auto;display:block}
table.app .in:disabled{background:#f4f7f9;color:#9aaab3}
table.tabel-pakai select.in{min-width:260px}
table.tabel-biaya .in{min-width:0}
tr.alasan td{background:var(--warn-bg);border-top:0;padding-top:0}
tr.alasan .al-teks{display:block;font-size:var(--fs-kecil);color:var(--warn);margin:6px 0}
tr.alasan .in{max-width:520px}
.baris-bawah{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.ringkas-kecil{min-width:260px}
.al-baris{display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}
.al-baris span{flex:1;min-width:200px}
.al-baris .in{flex:1;min-width:220px;max-width:420px}
.tautan-btn{border:0;background:none;padding:6px 0;color:var(--brand);font:inherit;font-size:var(--fs-isi);font-weight:var(--fw-kuat);cursor:pointer}
.tautan-btn:hover{text-decoration:underline}
/* jendela cetak label */
.modal.modal-label{max-width:1080px;padding:0;display:flex;flex-direction:column;max-height:calc(100vh - 32px);overflow:hidden}
.ml-kepala{display:flex;gap:16px;align-items:flex-start;padding:18px 24px;border-bottom:1px solid var(--line)}
.ml-kepala small{display:block;font-size:var(--fs-kecil);color:var(--muted)}
.ml-kepala h2{margin:2px 0;font-size:var(--fs-sub);color:var(--nav-deep)}
.ml-badan{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);flex:1;min-height:0;overflow:auto}
.ml-kiri{padding:18px 24px;border-right:1px solid var(--line)}
.ml-kanan{padding:18px 24px;background:#f7fafb}
.ml-kaki{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:14px 24px;border-top:1px solid var(--line)}
.ml-kaki .kecil{flex:1;color:var(--danger)}
.ml-batch{display:flex;align-items:center;gap:10px}
.ml-batch b{font-size:var(--fs-sub);color:var(--nav-deep)}
.ml-exp{display:flex;gap:8px}.ml-exp .in{flex:1;min-width:0}
.maju-angka{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.maju-angka b{font-size:var(--fs-angka);color:var(--nav-deep)}
.maju-angka span{font-size:var(--fs-kecil);color:var(--muted)}
.maju{height:10px;border-radius:999px;background:#e3ecef;overflow:hidden;margin:8px 0}
.maju i{display:block;height:100%;background:#2f6d4f;border-radius:999px}
.ukuran-pil{display:flex;gap:12px;align-items:center;width:100%;border:1px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;margin-bottom:8px;background:#fff;font:inherit;text-align:left;color:var(--ink)}
.ukuran-pil.on{border:2px solid var(--brand);background:#f0f6fa;padding:9px}
.ukuran-pil b{display:block;font-size:var(--fs-isi)}
.ukuran-pil small{display:block;font-size:var(--fs-kecil);color:var(--muted)}
.ukuran-pil .mini{width:96px;flex:none;pointer-events:none}
.ukuran-pil .mini .lblc{transform:scale(.62);transform-origin:top left;width:155px;margin-bottom:-38%}
.lblc{background:#fff;border:1px solid #cdd8de;border-radius:6px;padding:8px 10px;color:#000;font-family:Consolas,'Courier New',monospace;line-height:1.25;overflow:hidden}
.lblc .bc svg{display:block;width:100%;height:34px;fill:#000}
.lblc .k{text-align:center;font-size:var(--fs-kecil);letter-spacing:.06em}
.lblc .r{font-size:var(--fs-mini);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lblc .r small{font-size:var(--fs-mini)}
.l40-bawah{display:flex;gap:8px;align-items:center;margin-top:4px}
.l40-bawah .qr{width:42px;flex:none}.l40-bawah .qr svg{display:block;width:42px;height:42px;fill:#000}
.lbl-kosong{border:1px dashed #c3d4db;border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:var(--fs-mini);min-height:96px;background:#fff}
.pratinjau{display:grid;gap:12px;margin-bottom:12px}
@media (max-width:900px){
  .tahap-fakta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tahap-fakta div:nth-child(3){border-left:0}
  .tahap-fakta div:nth-child(n+3){border-top:1px solid var(--line)}
  .ml-badan{grid-template-columns:minmax(0,1fr)}
  .ml-kiri{border-right:0;border-bottom:1px solid var(--line)}
}
@media (max-width:700px){
  .dok-kepala,.dok-status{flex-direction:column;align-items:stretch;gap:10px;padding:14px 16px}
  .dk-kanan{text-align:left}.dk-no{justify-content:flex-start}
  .ds-tombol .btn{flex:1}
  .tahap-fakta div{padding:10px 14px}
  .kartu-tabel{padding:4px 12px 12px}
  .kt-judul .kecil{margin-left:0}
  table.tabel-pakai select.in{min-width:0}
  table.app input.angka{max-width:62%}
  tr.alasan td{display:block}
  .modal-latar.label-latar{padding:0}
  .modal.modal-label{max-height:100vh;height:100%;border-radius:0}
  .ml-kepala,.ml-kiri,.ml-kanan,.ml-kaki{padding-left:16px;padding-right:16px}
  .ringkas-kecil{min-width:0;width:100%}
}

@media (max-width:700px){.tabel-pakai td.cek{justify-content:space-between}}
/* ===== Produk bagian dalam (21 Okt) ===== */
.hijau-teks{color:var(--ok)}
.det-kepala{display:flex;align-items:flex-start;gap:16px;margin:14px 0 18px}
.det-kepala > div:first-child{flex:1;min-width:0}
.det-kepala h2{margin:0 0 4px;font-size:var(--fs-sub);color:var(--nav-deep);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.det-grid{display:grid;grid-template-columns:minmax(0,560px) minmax(200px,1fr);gap:32px;align-items:start}
.info-judul{font-size:var(--fs-bagian);color:var(--nav-deep);margin:18px 0 6px}
.info-judul:first-child{margin-top:0}
.info-r{display:grid;grid-template-columns:220px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:var(--fs-kecil)}
.info-r span{color:var(--muted)}
.info-r b{color:var(--ink);overflow-wrap:anywhere}
.det-foto{display:flex;flex-direction:column;gap:6px;justify-self:center;width:240px;text-align:center}
.det-foto svg,.foto-kotak svg{display:block;width:100%;height:auto;border-radius:12px}
.tab-dalam{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:26px 0 14px;overflow-x:auto}
.tab-dalam button{border:0;background:none;padding:10px 16px;font:inherit;font-size:var(--fs-isi);font-weight:var(--fw-kuat);color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tab-dalam button.on{color:var(--nav-deep);border-bottom-color:var(--brand)}
.tab-dalam button:disabled{color:#b3c1c8;cursor:not-allowed}
.form-produk{padding:0 24px 22px;border-radius:14px}
.fp-kepala{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid var(--line);margin-bottom:4px}
.fp-kepala h2{flex:1;margin:0;font-size:var(--fs-sub);color:var(--nav-deep)}
.fp-dasar{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:24px;align-items:start}
.form-tiga{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 18px}
.form-tiga .dua{grid-column:span 2}
.alias{display:flex;align-items:center;gap:8px}.alias input[type=checkbox]{width:18px;height:18px;accent-color:var(--brand);flex:none}
.fp-foto .foto-kotak{border:1px solid var(--line);border-radius:12px;padding:8px;background:#f7fafb}
.fp-foto .lampir{margin-top:8px}
.fp-tipe{display:flex;gap:24px;margin:22px 0 0;font-weight:var(--fw-kuat)}
.fp-tipe label{display:flex;align-items:center;gap:8px;cursor:pointer}.fp-tipe input{width:18px;height:18px;accent-color:var(--brand)}
.fp-bagian{padding:16px 0;border-bottom:1px solid var(--line)}
.fp-bagian .saklar{margin-bottom:8px}
.fp-bagian.mati .form-tiga{opacity:.55}
.form-tiga .in:disabled{background:#f4f7f9}
@media (max-width:1100px){.det-grid{grid-template-columns:minmax(0,1fr) 200px;gap:20px}.det-foto{width:200px}.info-r{grid-template-columns:170px minmax(0,1fr)}}
@media (max-width:900px){.fp-dasar{grid-template-columns:minmax(0,1fr)}.fp-foto{max-width:240px}.form-tiga{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){
  .det-kepala{flex-direction:column;align-items:stretch}
  .det-grid{grid-template-columns:minmax(0,1fr)}
  .det-foto{max-width:220px;order:-1;justify-self:start;text-align:left}
  .info-r{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .form-produk{padding:0 14px 16px}
  .form-tiga{grid-template-columns:minmax(0,1fr)}.form-tiga .dua{grid-column:auto}
  .fp-kepala{flex-wrap:wrap}
}

/* ===== bilah atas HP rapi (21 Okt) ===== */
.hanya-hp-f{display:none}
.pop-siapa{display:flex;align-items:center;gap:10px;padding:8px 12px 10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.pop-siapa .avatar{width:34px;height:34px;margin:0;font-size:var(--fs-kecil)!important}
.pop-siapa b{display:block;font-size:var(--fs-isi)}.pop-siapa small{font-size:var(--fs-mini);color:var(--muted)}
@media (max-width:700px){
  .atas{padding:0 10px 0 6px;gap:2px}
  .atas .bukan-hp{display:none}
  .atas .hanya-hp-f{display:inline-flex}
  .atas .ikon{width:44px;height:44px;border-radius:12px}
  .atas .ikon svg{width:24px;height:24px;stroke-width:2}
  .atas .menu-hp svg{width:28px;height:28px;stroke-width:2.2}
  .atas .versi-blok{margin-left:4px;gap:2px}
  .atas .versi{padding:2px 9px}
  .atas .avatar{width:38px;height:38px;margin-left:4px;font-size:var(--fs-isi)}
  .atas .pop{right:-44px}
}
@media (max-width:360px){.atas .versi-ket{display:none}}
/* ===== Rekonsiliasi Marketplace (21 Okt) ===== */
.langkah-mp{display:flex;align-items:center;gap:4px;padding:6px;border:1px solid var(--line);border-radius:14px;background:#fff;margin-bottom:18px;overflow-x:auto}
.langkah-mp > a,.lm-belah{display:inline-flex;align-items:center;border-radius:10px;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);color:var(--nav-deep);white-space:nowrap;cursor:pointer;text-decoration:none;flex:none}
.langkah-mp > a{padding:9px 16px}
.langkah-mp > a:hover,.lm-belah:hover{background:#eef5f7}
.lm-belah a{padding:9px 8px 9px 16px;color:inherit;text-decoration:none}
.lm-belah button{border:0;background:none;color:inherit;font:inherit;padding:9px 12px 9px 8px;cursor:pointer;border-left:1px solid #c9dbe1}
.langkah-mp > a.on,.lm-belah.on{background:linear-gradient(135deg,var(--brand),#2f8a8f);color:#fff;box-shadow:0 4px 10px rgba(31,95,135,.22)}
.lm-belah.on button{border-left-color:rgba(255,255,255,.35)}
.mp-saring{gap:10px;flex-wrap:wrap}
.mp-saring select.in{width:auto;min-width:190px}
.mp-saring .cari{width:380px}
.mp-judul{font-size:var(--fs-bagian);color:var(--nav-deep);margin:28px 0 4px}
.mp-antre{margin:0 0 12px}
.mi-periode{display:flex;align-items:center;gap:8px;max-width:420px}.mi-periode .in{flex:1}
.mi-bawah{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;flex-wrap:wrap}
.mi-pratinjau{margin-top:16px}
.mi-ringkas{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:14px 0 4px}
.mi-ringkas div{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.mi-ringkas span{display:block;font-size:var(--fs-mini);color:var(--muted)}.mi-ringkas b{font-size:var(--fs-isi)}
.mi-konfirmasi{margin-top:14px}
.mj-kunci{display:flex;flex-wrap:wrap;gap:6px;align-items:center;max-width:260px}
.mj-kunci .ket{flex-basis:100%}
.mp-audit{margin-top:14px;font-size:var(--fs-kecil)}
.mp-audit summary{cursor:pointer;font-weight:var(--fw-kuat);color:var(--brand)}
.mr-filter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:10px 0 14px}
.mr-filter .btn{justify-self:start}
.mp-file{display:flex;flex-direction:column;gap:2px;margin-top:4px;font-size:var(--fs-mini);color:var(--muted)}
.mp-cat{min-width:260px;font-size:var(--fs-kecil)}
@media (max-width:1100px){.mi-ringkas{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.mp-saring select.in,.mp-saring .cari{width:100%;min-width:0}.mr-filter{grid-template-columns:minmax(0,1fr)}.mi-ringkas{grid-template-columns:repeat(2,minmax(0,1fr))}.mj-kunci{max-width:none}.mp-cat{min-width:0}}
@media (max-width:700px){.mi-bawah .ds-tombol{flex-direction:column;width:100%}.mi-bawah .ds-tombol .btn{width:100%;white-space:normal}.mi-bawah > .btn{width:100%}}
/* ===== Daftar Akun & Daftar Lainnya (21 Okt) ===== */
.info-biru{display:flex;align-items:center;gap:12px;background:#e9f3fb;border:1px solid #cfe2f1;border-radius:12px;padding:12px 16px;margin-bottom:16px;font-size:var(--fs-isi);color:var(--ink)}
.i-bulat{width:24px;height:24px;border-radius:50%;background:#1f6fae;color:#fff;font-weight:var(--fw-kuat);display:inline-flex;align-items:center;justify-content:center;flex:none;font-size:var(--fs-kecil)}
table.tabel-akun td{vertical-align:middle}
.tabel-akun .kunci-k{white-space:nowrap;color:#c28a1f;width:56px}
.tabel-akun .kunci-k b{color:var(--ink);margin-left:2px}
.akun-nm.t1{padding-left:16px}.akun-nm.t2{padding-left:32px}
.akun-nm a{font-weight:var(--fw-biasa)!important;white-space:normal!important}
.akun-nm .ket{max-width:520px}
tr.akun-kp td{background:#fbfcfd}
.ie-judul{margin:4px 0 4px;font-size:var(--fs-judul);font-weight:var(--fw-judul);color:var(--nav-deep)}
@media (max-width:700px){.akun-nm.t1,.akun-nm.t2{padding-left:0}.info-biru{align-items:flex-start}}
@media (max-width:700px){#ak-gol,#ie-fitur,#ie-st{width:100%!important;min-width:0!important}.tabel-akun .akun-nm .ket{max-width:none}}
@media (max-width:700px){.tabel-akun .kunci-k{width:auto}}
.gol-k{overflow-wrap:anywhere}
/* ===== tombol bermenu: rupa tombol belah (21 Okt) ===== */
.btn.utama.tombol-buat{padding:0;gap:0;align-items:stretch;border:0;border-radius:12px;background:linear-gradient(135deg,var(--brand),#2f8a8f);box-shadow:0 4px 10px rgba(31,95,135,.22);min-height:40px;overflow:hidden}
.btn.utama.tombol-buat:hover{background:linear-gradient(135deg,#184f72,#277a7f)}
.tombol-buat .tb-lbl{display:flex;align-items:center;justify-content:center;padding:8px 14px 8px 18px;white-space:nowrap;flex:1}
.tombol-buat .tb-panah{display:flex;align-items:center;justify-content:center;width:40px;border-left:1px solid rgba(255,255,255,.35);font-size:var(--fs-kecil);transition:background .15s}
.tombol-buat[aria-expanded="true"] .tb-panah{background:rgba(255,255,255,.14)}
.lm-belah button{width:40px;padding:9px 0;text-align:center}
.lm-belah{overflow:hidden}
.pop.pop-buat{padding:8px;border-radius:14px}.pop.pop-buat a{padding:11px 14px;font-size:var(--fs-isi)}
/* ===== kalender pilih tanggal (21 Okt) ===== */
.tgl button[data-aksi="kalender"]{display:inline-flex;align-items:center;justify-content:center;color:var(--brand)}
.tgl button[data-aksi="kalender"] svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round}
.tgl button[data-aksi="kalender"][aria-expanded="true"],.tgl button[data-aksi="kalender"]:hover{background:#eef5f9;border-color:#bcd3da}
.pop.pop-kal{width:292px;padding:12px;border-radius:14px}
.kal-kepala{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.kal-kepala b{font-size:var(--fs-isi);color:var(--nav-deep)}
.kal-kepala button{width:34px;height:34px;border:0;border-radius:10px;background:none;font-size:var(--fs-sub);color:var(--nav-deep);cursor:pointer}
.kal-kepala button:hover{background:#eef5f9}
.kal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.kal-nama span{text-align:center;font-size:var(--fs-mini);font-weight:var(--fw-kuat);color:var(--muted);padding:4px 0}
.kal-hari{height:36px;border:0;border-radius:10px;background:none;font:inherit;font-size:var(--fs-kecil);color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums}
.kal-hari:hover{background:#eef5f9}
.kal-hari.kal-ini{box-shadow:inset 0 0 0 1.5px var(--brand-2);font-weight:var(--fw-kuat)}
.kal-hari.kal-pilih{background:linear-gradient(135deg,var(--brand),#2f8a8f);color:#fff;font-weight:var(--fw-kuat)}
.kal-kaki{display:flex;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.kal-kaki button{border:0;background:none;font:inherit;font-size:var(--fs-kecil);font-weight:var(--fw-kuat);color:var(--brand);cursor:pointer;padding:6px 8px;border-radius:8px}
.kal-kaki button:hover{background:#eef5f9}
/* ===== Aset & Pengaturan (21 Okt) ===== */
.aset-kepala{display:flex;align-items:flex-start;gap:16px;margin:4px 0 14px}
.aset-kepala h2{margin:0;font-size:var(--fs-bagian);color:var(--nav-deep)}
.aset-kepala .kecil{margin:4px 0 0}
.aset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;align-items:start}
.aset-grid .info-r{grid-template-columns:200px minmax(0,1fr)}
.chip-baris{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-block;background:#eef2f4;border-radius:8px;padding:3px 9px;font-size:var(--fs-mini);font-weight:var(--fw-kuat);color:var(--ink);white-space:nowrap}
.akses{display:inline-block;border-radius:8px;padding:2px 8px;font-size:var(--fs-mini);font-weight:var(--fw-kuat)}
.akses-P{background:var(--ok-bg);color:var(--ok)}.akses-U{background:#e2f0f3;color:var(--nav-deep)}.akses-L{background:#eef2f4;color:var(--muted)}.akses-n{color:#a9b6bd}
.peran-pilih{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 16px}
#fa-susut.mati{opacity:.55}
@media (max-width:900px){.aset-grid{grid-template-columns:minmax(0,1fr);gap:8px}.peran-pilih{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.aset-grid .info-r{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}}