/* DIGIWEBS OS — identitas: Causten (huruf dokumen resmi PT), hijau hutan dari kop surat, kertas hijau pucat. */
@font-face{font-family:Causten;src:url(/static/fonts/causten-regular.ttf) format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Causten;src:url(/static/fonts/causten-semibold.ttf) format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:Causten;src:url(/static/fonts/causten-bold.ttf) format("truetype");font-weight:700;font-display:swap}
:root{--hutan:#01401E;--hutan-2:#0C5A2F;--daun:#0B7D40;--tunas:#00C65A;--kertas:#F3F7F1;--putih:#FFFFFF;--garis:#D3E2D6;
  --tinta:#14231B;--abu:#5D6E64;--bata:#B42318;--bata-bg:#FDEDEB;--kunyit:#A15C07;--kunyit-bg:#FFF4E0;--daun-bg:#E7F5EC;--radius:14px;--tinggi-atas:60px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--kertas);color:var(--tinta);font:400 15px/1.55 Causten,system-ui,sans-serif}
a{color:var(--daun);text-underline-offset:3px}a:hover{color:var(--hutan)}
:focus-visible{outline:3px solid var(--tunas);outline-offset:2px;border-radius:6px}
h1{font-size:28px;line-height:1.15;font-weight:700;letter-spacing:-.01em;margin:4px 0 6px;color:var(--hutan)}
h2{font-size:17px;font-weight:600;margin:26px 0 10px;color:var(--hutan)}
p{margin:0 0 10px;max-width:68ch}.lembut{color:var(--abu)}.kecil{font-size:13px}
/* kerangka */
.atas{position:sticky;top:0;z-index:5;height:var(--tinggi-atas);display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--hutan);color:#fff}
.atas img{width:28px;height:26px}.atas b{font-weight:700;letter-spacing:.02em}.atas .siapa{margin-left:auto;font-size:13px;line-height:1.4;color:#BFE6CF;text-align:right}
.rangka{display:block}.isi{max-width:780px;margin:0 auto;padding:18px 16px 96px}
.navi{position:fixed;bottom:0;left:0;right:0;z-index:5;display:flex;justify-content:space-around;background:var(--putih);border-top:1px solid var(--garis);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.navi a{flex:1;text-align:center;text-decoration:none;color:var(--abu);font-size:12px;padding:6px 2px;border-radius:10px}
.navi a .ik{display:block;font-size:19px;line-height:1.1}.navi a[aria-current]{color:var(--hutan);background:var(--daun-bg);font-weight:600}
.navi .lebar,.navi .blok-lebar{display:none}
@media (min-width:900px){
  .rangka{display:grid;grid-template-columns:230px 1fr;align-items:start}.isi{padding:28px 32px 48px;margin:0}
  .navi{position:sticky;top:var(--tinggi-atas);height:calc(100vh - var(--tinggi-atas));overflow-y:auto;flex-direction:column;justify-content:flex-start;gap:2px;border-top:0;border-right:1px solid var(--garis);padding:16px 10px;background:var(--kertas)}
  .navi a{flex:0 0 auto;text-align:left;font-size:14px;padding:7px 12px;display:flex;gap:10px;align-items:center}.navi a .ik{display:inline;font-size:16px;width:20px;text-align:center}
  .navi .lebar{display:flex}.navi .sempit{display:none}.navi .blok-lebar{display:flex;flex-direction:column;gap:2px;flex:1}
  .navi hr{border:0;border-top:1px solid var(--garis);margin:8px 4px}.navi .keluar{margin-top:auto;padding-top:12px}
}
.penuh{width:100%}.sebaris{display:inline}.kunci-teks{letter-spacing:.08em}.input-catatan{margin:6px 0}
/* halaman Menu (HP) */
.menu-daftar{display:flex;flex-direction:column;background:var(--putih);border:1px solid var(--garis);border-radius:14px;overflow:hidden;margin:12px 0 18px}
.menu-daftar a{display:flex;gap:14px;align-items:center;padding:15px 16px;text-decoration:none;color:var(--tinta);border-top:1px solid var(--garis)}
.menu-daftar a:first-child{border-top:0}.menu-daftar a .ik{width:22px;text-align:center}.menu-daftar a[aria-current]{background:var(--daun-bg);font-weight:600}
/* strip minggu ini — elemen khas halaman Hari ini */
.minggu{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:14px 0 6px}
.hari{background:var(--putih);border:1px solid var(--garis);border-radius:12px;padding:10px 6px 8px;text-align:center}
.hari .nm{font-size:12px;color:var(--abu)}.hari .tg{font-size:20px;font-weight:700;color:var(--hutan)}
.hari .titik{width:10px;height:10px;border-radius:50%;margin:6px auto 0;border:2px solid var(--garis)}
.hari.hadir .titik{background:var(--tunas);border-color:var(--tunas)}.hari.kini{border:2px solid var(--hutan)}
.hari.lewat:not(.hadir) .tg{color:#9AA9A0}
/* tombol & aksi */
.aksi{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
@media (min-width:600px){.aksi{grid-template-columns:repeat(4,1fr)}}
.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px Causten,sans-serif;border:0;border-radius:12px;padding:12px 16px;cursor:pointer;
  background:var(--hutan);color:#fff;text-decoration:none;min-height:46px}
.btn:hover,button:hover{background:var(--hutan-2);color:#fff}.btn.dua,button.dua{background:var(--putih);color:var(--hutan);border:1.5px solid var(--hutan)}
.btn.bahaya,button.bahaya{background:var(--bata)}.btn.tanya,button.tanya{background:var(--kunyit)}
.aksi .btn{flex-direction:column;padding:14px 8px;min-height:78px;font-size:14px}.aksi .btn .ik{font-size:22px}
/* daftar tindakan */
.daftar{list-style:none;margin:0;padding:0;background:var(--putih);border:1px solid var(--garis);border-radius:var(--radius);overflow:hidden}
.daftar li{padding:12px 14px 12px 16px;border-top:1px solid var(--garis);border-left:4px solid var(--garis)}.daftar li:first-child{border-top:0}
.daftar li.telat{border-left-color:var(--bata)}.daftar li.dekat{border-left-color:var(--kunyit)}.daftar li.aman{border-left-color:var(--tunas)}
.daftar .jdl{font-weight:600}.daftar .ket{font-size:13px;color:var(--abu)}
.kosong{padding:18px;color:var(--abu)}
.chip{display:inline-block;font-size:12px;font-weight:600;border-radius:99px;padding:2px 9px;background:var(--daun-bg);color:var(--hutan)}
.chip.menunggu,.chip.siap,.chip.di_bank{background:var(--kunyit-bg);color:var(--kunyit)}.chip.ditolak,.chip.diblokir{background:var(--bata-bg);color:var(--bata)}
.chip.perlu.info,.chip.perlu_verifikasi{background:var(--kunyit-bg);color:var(--kunyit)}
/* formulir */
form.panel,.panel{background:var(--putih);border:1px solid var(--garis);border-radius:var(--radius);padding:16px;margin:12px 0}
label{display:block;font-weight:600;margin:12px 0 5px}label .lembut{font-weight:400}
input,select,textarea{width:100%;font:15px Causten,sans-serif;padding:11px 12px;border:1.5px solid var(--garis);border-radius:10px;background:#fff;color:var(--tinta)}
input:focus,select:focus,textarea:focus{border-color:var(--daun);outline:none}
.baris{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.pesan{padding:12px 14px;border-radius:12px;margin:10px 0;background:var(--daun-bg)}.pesan.salah{background:var(--bata-bg);color:var(--bata)}
.angka{font-size:26px;font-weight:700;color:var(--hutan)}
table{width:100%;border-collapse:collapse;font-size:14px;background:var(--putih)}th,td{padding:9px 10px;border-bottom:1px solid var(--garis);text-align:left;vertical-align:top}
th{font-weight:600;color:var(--abu);font-size:13px}.gulir{overflow-x:auto;border:1px solid var(--garis);border-radius:var(--radius)}
/* asisten */
.obrolan{display:flex;flex-direction:column;gap:10px;min-height:40vh}
.gelembung{max-width:88%;padding:11px 14px;border-radius:16px;white-space:pre-wrap}.gelembung.saya{align-self:flex-end;background:var(--hutan);color:#fff;border-bottom-right-radius:4px}
.gelembung.ai{align-self:flex-start;background:var(--putih);border:1px solid var(--garis);border-bottom-left-radius:4px}
.tulis{position:sticky;bottom:72px;display:flex;gap:8px;background:var(--kertas);padding:10px 0}@media (min-width:900px){.tulis{bottom:0}}
.saran-q{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.saran-q button{background:var(--putih);color:var(--hutan);border:1px solid var(--garis);min-height:0;padding:8px 12px;font-weight:400;font-size:14px}
.masuk{max-width:420px;margin:8vh auto;padding:0 16px}.masuk .logo{display:flex;gap:10px;align-items:center;color:var(--hutan);font-weight:700;font-size:18px;margin-bottom:18px}
.masuk .logo img{width:40px;background:var(--hutan);border-radius:10px;padding:6px}
@media (prefers-reduced-motion:no-preference){.hari.kini .titik{animation:denyut 2.4s ease-in-out 1}}
@keyframes denyut{0%{transform:scale(.6)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.card{background:var(--putih);border:1px solid var(--garis);border-radius:var(--radius);padding:16px;margin:12px 0}.muted{color:var(--abu);font-size:13px}
input[type=file]::file-selector-button{font:inherit;font-weight:600;border:1px solid var(--hutan);background:var(--putih);color:var(--hutan);border-radius:10px;padding:7px 14px;margin-right:12px;cursor:pointer}
.baris-centang{display:flex;gap:8px;align-items:center;margin-top:8px}.input-progres{max-width:120px}
.panel.peringatan{background:var(--kunyit-bg);border-color:#F1D3A2}.panel .jdl{font-weight:600}.panel .ket{font-size:13px;color:var(--abu)}
.sebaris-form{display:inline}.sebaris-form button{padding:2px 10px;min-height:0;font-size:13px}
p.ket{font-size:13px;color:var(--abu)}
.grup-menu{font-size:12px;font-weight:600;color:var(--abu);padding:10px 12px 2px}.menu-daftar .grup-menu{padding:14px 16px 6px;border-top:1px solid var(--garis);background:var(--kertas)}
@media (min-width:900px){.navi a{padding:4px 12px;line-height:1.45}.navi .grup-menu:first-of-type{padding-top:2px}}
.bar-proyek{display:inline-block;width:90px;height:8px;border-radius:4px;background:var(--garis);vertical-align:middle;overflow:hidden}.bar-proyek span{display:block;height:100%;background:var(--daun)}
.chip.diedit{background:var(--kunyit-bg);color:var(--kunyit);text-decoration:none;font-weight:600}
td.lama{color:var(--bata);text-decoration:line-through;text-decoration-thickness:1px}
/* ruang pemeriksa: lihat saja */
.lihat-saja{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.dokumen img{display:block;max-width:100%;height:auto;margin:0 auto 14px;border:1px solid var(--garis);border-radius:6px;background:#fff;pointer-events:none}
.tabel-gulir{overflow:auto;max-height:75vh;border:1px solid var(--garis);border-radius:var(--radius);background:#fff;margin:8px 0}
.berlapis{position:relative;display:inline-block;min-width:100%}
.berlapis::after{content:"";position:absolute;inset:0;background:url(/audit/tanda-air.svg) repeat;pointer-events:none}
table.lembar{border-collapse:collapse;font-size:12.5px;min-width:100%}
table.lembar td,table.lembar th{border:1px solid #E3E8E5;padding:4px 8px;white-space:nowrap;vertical-align:top;text-align:left}
table.lembar th{background:var(--daun-bg);position:sticky;top:0}

table.kv th{text-align:left;font-weight:600;padding:3px 12px 3px 0;vertical-align:top;color:var(--abu)}table.kv td{padding:3px 0}
fieldset{border:1px solid var(--garis);border-radius:10px;margin:12px 0;padding:6px 12px}fieldset legend{font-weight:600}
@media print{body[data-lihat-saja] .isi,body[data-lihat-saja] .navi{display:none!important}
  body[data-lihat-saja]::after{content:"Mencetak tidak diizinkan di Ruang pemeriksa. Gunakan tombol Minta salinan resmi.";display:block;padding:40px;font-size:18px}}
.keluar-hp{margin:24px 0}@media (min-width:900px){.keluar-hp{display:none}}
table.lembar td.kan{text-align:right;font-variant-numeric:tabular-nums}table.lembar a{display:inline;min-height:0;padding:0}
input[type=checkbox],input[type=radio]{width:auto}
label.cek{display:flex;gap:8px;align-items:center;font-weight:400;margin:8px 0}
form.cari{display:flex;gap:8px;align-items:center}form.cari input{flex:1;min-width:0}
table.lembar td{white-space:normal;min-width:48px;max-width:340px}table.lembar td.kan{white-space:nowrap}
.isi:has(.tabel-gulir){max-width:none}
/* Situs & konten: editor tulisan */
.editor{border:1px solid var(--garis);border-radius:12px;background:var(--putih);margin:8px 0 14px}
.editor-alat{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border-bottom:1px solid var(--garis);position:sticky;top:var(--tinggi-atas);background:var(--putih);z-index:2;border-radius:12px 12px 0 0}
.editor-alat button{min-height:36px;padding:4px 10px;font-size:13px}
.editor-isi{min-height:340px;padding:14px 16px;font-size:16px;line-height:1.7;outline:0}
.editor-isi img{max-width:min(100%,520px);height:auto;border-radius:8px}.editor-isi figure{margin:12px 0}.editor-isi figcaption{font-size:13px;color:var(--abu)}
.editor-isi blockquote{border-left:4px solid var(--tunas);margin:10px 0;padding:2px 12px;color:var(--abu)}
.editor-sumber{width:100%;font:13px/1.5 ui-monospace,monospace;border:0;padding:12px;box-sizing:border-box}
.editor-status{padding:0 12px 8px;margin:0}
.sampul-pratinjau{max-width:320px;border-radius:10px;margin:6px 0}
pre.log{white-space:pre-wrap;font-size:12px;max-height:340px;overflow:auto;background:var(--kertas);padding:10px;border-radius:8px}
.centang{display:flex;gap:8px;align-items:flex-start}
/* login redaksi per situs */
body.redaksi .atas{background:var(--redaksi,#01401E)}
body.redaksi .redaksi-isi{max-width:960px;margin:0 auto;padding:16px}
.redaksi-nav{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:12px}
.redaksi-nav a{font-weight:600}
/* susunan seret-lepas */
.urut{list-style:none;margin:0 0 12px;padding:0}.urut li{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid #d9dee3;border-radius:8px;margin:6px 0;background:#fff;cursor:grab}
.urut li.diseret{opacity:.5}.urut .pegangan{font-size:1.2rem;color:#7a8794}.urut label{flex:1;margin:0}.urut-tombol{display:flex;gap:4px}.urut-tombol button{padding:4px 10px}
.dua-kolom{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.kartu-ringkas{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:12px 0}
.kartu-ringkas div{background:#fff;border:1px solid #d9dee3;border-radius:10px;padding:12px}.kartu-ringkas b{display:block;font-size:1.5rem}.kartu-ringkas span{font-size:.85rem;color:#5e6870}
.gulir-x{overflow-x:auto}
/* tautan bergaya tombol (a.tombol) seragam dengan <button>; baris tombol rapi di HP */
a.tombol{display:inline-flex;align-items:center;gap:6px;font:600 14px Causten,sans-serif;border-radius:10px;padding:9px 14px;text-decoration:none;background:var(--hutan);color:#fff;margin:2px 0}
a.tombol.dua{background:var(--putih);color:var(--hutan);border:1px solid var(--garis)}
a.tombol:hover{filter:brightness(1.08)}
.baris{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.panel table{border-collapse:collapse}.panel.gulir-x,.panel:has(> table){overflow-x:auto}

.kisi-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:12px 0}
