:root{--merah: #b3121f;--merah-tua: #c4202d;--merah-muda: #fbe9ea;--teks: #1f2328;--redup: #5b6470;--garis: #e3e6ea;--latar: #f4f5f7;--kartu: #ffffff;--hijau: #1a7f37;--hijau-muda: #e6f4ea;--kuning: #8a5a00;--kuning-muda: #fff4d6;--biru: #0b5cad;--biru-muda: #e8f1fb;--abu: #eef0f2;--radius: 10px;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;font-size:14px;color:var(--teks);background:var(--latar)}*{box-sizing:border-box}body{margin:0;background:var(--latar)}h1{font-size:22px;margin:0 0 4px}h2{font-size:16px;margin:0 0 12px}p{line-height:1.5}a{color:var(--biru)}.redup{color:var(--redup)}.kecil{font-size:12px}.mono{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:12px;word-break:break-all}.bingkai{display:flex;min-height:100vh}.samping{width:248px;flex-shrink:0;background:#fff;border-right:1px solid var(--garis);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.merek{padding:16px 16px 8px}.merek img{width:180px;display:block}.pilih-klien{padding:6px 12px 10px;border-bottom:1px solid var(--garis)}.pilih-klien select{width:100%}.nav{flex:1;overflow-y:auto;padding:8px 8px 16px}.nav-grup{color:#6b7480;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:12px 10px 4px}.nav a,.nav span.mati{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:7px;color:var(--teks);text-decoration:none;font-size:13px}.nav a:hover{background:#f2f3f5}.nav a.active{background:var(--merah-muda);color:var(--merah);font-weight:600}.nav span.mati{color:#9aa1aa;cursor:default}.nav .lencana{margin-left:auto}.kaki{border-top:1px solid var(--garis);padding:10px 14px;font-size:12px;color:var(--redup)}.kaki button{margin-top:6px}.isi{flex:1;min-width:0;padding:24px 28px 48px}.kepala{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}.tombol-menu{display:none}@media(max-width:860px){.bingkai{flex-direction:column}.samping{position:fixed;z-index:20;left:0;top:0;transform:translate(-100%);transition:transform .2s;box-shadow:0 0 24px #00000026}.samping.buka{transform:none}.tombol-menu{display:inline-flex;margin-bottom:12px}.tirai{position:fixed;inset:0;z-index:10;background:#0f141e59}.isi{padding:16px}}.kartu{background:var(--kartu);border:1px solid var(--garis);border-radius:var(--radius);padding:18px 20px;margin-bottom:16px}.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.ubin{background:#fafbfc;border:1px solid var(--garis);border-radius:8px;padding:12px 14px}.ubin .label{font-size:12px;color:var(--redup)}.ubin .nilai{font-size:20px;font-weight:700;margin-top:4px}button,.tombol{font:inherit;font-weight:600;border-radius:7px;padding:7px 14px;cursor:pointer;border:1px solid #c9ced5;background:#fff;color:var(--teks)}button:hover{background:#f7f8fa}button.utama{background:var(--merah);border-color:var(--merah);color:#fff}button.utama:hover{background:var(--merah-tua)}button:disabled{opacity:.55;cursor:not-allowed}button.tautan{border:0;background:none;color:var(--biru);padding:0;font-weight:500}button.bahaya{color:var(--merah)}input,select,textarea{font:inherit;border:1px solid #c9ced5;border-radius:7px;padding:7px 10px;background:#fff;color:var(--teks)}input:focus,select:focus,textarea:focus{outline:2px solid #f1c3c6;border-color:var(--merah)}label.bidang{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--redup);font-weight:600;margin-bottom:12px}label.bidang input,label.bidang select,label.bidang textarea{font-weight:400;color:var(--teks);font-size:14px}.baris{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}.baris>*{flex:1;min-width:160px}.baris>.pas{flex:0 0 auto;min-width:0}table{width:100%;border-collapse:collapse}th{text-align:left;font-size:12px;color:var(--redup);font-weight:600;background:#fafbfc;border-bottom:1px solid var(--garis);padding:8px}td{border-bottom:1px solid var(--abu);padding:8px;vertical-align:top}.gulir-x{overflow-x:auto}.lencana{display:inline-block;border-radius:9px;padding:2px 9px;font-size:11px;font-weight:600;background:var(--abu);color:#4b5563;white-space:nowrap}.lencana.hijau{background:var(--hijau-muda);color:var(--hijau)}.lencana.merah{background:var(--merah-muda);color:var(--merah)}.lencana.kuning{background:var(--kuning-muda);color:var(--kuning)}.lencana.biru{background:var(--biru-muda);color:var(--biru)}.kotak{border-radius:8px;padding:10px 14px;margin-bottom:14px;border:1px solid}.kotak.info{background:var(--biru-muda);border-color:#cfe0f5;color:#0b3f78}.kotak.peringatan{background:var(--kuning-muda);border-color:#f0d99a;color:#5c3d00}.kotak.galat{background:var(--merah-muda);border-color:#f1c3c6;color:#7a0c15}.kotak.ok{background:var(--hijau-muda);border-color:#bfe3c9;color:#0f5323}.tab{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}.tab button{border-radius:14px;padding:4px 14px;font-weight:500}.tab button.aktif{background:var(--merah);border-color:var(--merah);color:#fff}.masuk{min-height:100vh;display:grid;place-items:center;padding:16px}.masuk .kartu{width:100%;max-width:380px;padding:28px}.masuk img{width:220px;display:block;margin:0 auto 18px}.masuk button.utama{width:100%;padding:10px}.kanan{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.butir{list-style:none;padding:0;margin:0}.butir li{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid var(--abu)}.butir li:last-child{border-bottom:0}.butir .ikon{flex:0 0 20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff;margin-top:1px}.butir .x{background:var(--merah)}.butir .cek{background:#c98a00}.butir .ok{background:var(--hijau)}.butir .info{background:var(--biru)}.butir .rinci{color:var(--redup);font-size:12px;margin-top:2px}.progres{height:10px;background:#e9ecef;border-radius:5px;overflow:hidden;margin:10px 0 6px}.progres>div{height:100%;background:var(--merah);transition:width .3s}.pilih-berkas{border:1.5px dashed #b9c0c8;border-radius:10px;padding:14px;background:#fafbfc}.pilih-berkas input[type=file]{border:0;padding:4px 0;background:none;max-width:100%}tr.pilih{background:var(--merah-muda)}tr.bisa-klik{cursor:pointer}tr.bisa-klik:hover{background:#f7f8fa}tfoot td{font-weight:700;border-top:1px solid var(--garis)}.kecil-input{width:90px}.sangat-kecil-input{width:64px}td input,td select{padding:4px 6px;font-size:13px}.tab-pilih{display:flex;gap:0;border:1px solid #c9ced5;border-radius:8px;overflow:hidden;width:fit-content;margin-bottom:12px}.tab-pilih button{border:0;border-radius:0;font-weight:500}.tab-pilih button.aktif{background:var(--merah);color:#fff}.baris-aksi{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.linimasa{list-style:none;padding:0 0 0 14px;margin:0 0 12px;border-left:2px solid var(--garis)}.linimasa li{position:relative;padding:4px 0 8px 10px}.linimasa li:before{content:"";position:absolute;left:-20px;top:9px;width:10px;height:10px;border-radius:50%;background:var(--biru)}.linimasa li.final:before{background:var(--hijau)}.linimasa li.dikembalikan:before,.linimasa li.ditolak:before,.linimasa li.final_dicabut:before{background:var(--merah)}.linimasa li.ditarik:before{background:#9aa1aa}.naik{color:var(--merah)}.turun{color:var(--hijau)}h3.kecil{font-size:12px;margin:8px 0 6px;font-weight:600}.nav .hitung{margin-left:auto;background:var(--merah);color:#fff;border-radius:9px;padding:0 7px;font-size:11px;font-weight:700}