@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root{
  --biru:#123a6b; --biru2:#1c4f8f; --biru3:#2f6fc4; --emas:#d99a1e;
  --garis:#e1e6ee; --abu:#6b7280; --bg:#eef2f8; --putih:#fff;
  --hijau:#2e7d32; --merah:#c62828;
  --radius:12px; --radius-sm:8px; --topbar-h:58px;
  --shadow-sm:0 1px 3px rgba(18,58,107,.08), 0 1px 2px rgba(18,58,107,.06);
  --shadow-md:0 8px 24px rgba(18,58,107,.10), 0 2px 6px rgba(18,58,107,.06);
  --shadow-lift:0 14px 32px rgba(18,58,107,.16), 0 4px 10px rgba(18,58,107,.08);
}
*{box-sizing:border-box}
body{
  margin:0;font-family:"Plus Jakarta Sans","Segoe UI",Arial,sans-serif;font-size:14px;color:#1a1a1a;
  background:
    radial-gradient(circle at 10% 0%, #dbe6f7 0%, transparent 45%),
    radial-gradient(circle at 100% 15%, #fdf1dc 0%, transparent 40%),
    var(--bg);
  min-height:100vh;
}

.topbar{
  display:flex;justify-content:space-between;align-items:center;
  background:linear-gradient(135deg, var(--biru) 0%, var(--biru2) 65%, var(--biru3) 100%);
  color:#fff;padding:14px 22px;box-shadow:0 4px 16px rgba(18,58,107,.25);
  position:sticky;top:0;z-index:10;min-height:var(--topbar-h);
}
.topbar .brand{font-weight:700;font-size:15px;letter-spacing:.2px;display:flex;align-items:center;gap:8px}
.topbar .brand span{font-weight:400;opacity:.8}
.brand-logo{height:28px;width:auto;display:block}
.topbar nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.topbar nav a{
  color:#fff;text-decoration:none;margin-left:4px;opacity:.85;font-size:13px;font-weight:500;
  padding:8px 14px;border-radius:999px;transition:background .15s,opacity .15s;
}
.topbar nav a:hover{opacity:1;background:rgba(255,255,255,.14)}
.topbar nav .btn-sekunder{background:transparent;color:#fff;border-color:rgba(255,255,255,.5);margin-left:6px}
.topbar nav .btn-sekunder:hover{background:rgba(255,255,255,.14)}
.user-chip{color:#fff;font-size:12.5px;margin-left:10px;font-weight:600;white-space:nowrap}
.user-chip .mini{color:rgba(255,255,255,.75);font-weight:500}

.bell-btn{position:relative;background:none;border:0;color:#fff;font-size:17px;cursor:pointer;padding:6px 8px;margin-left:4px;border-radius:999px;transition:background .15s}
.bell-btn:hover{background:rgba(255,255,255,.14)}
.bell-badge{position:absolute;top:0;right:0;background:var(--merah);color:#fff;font-size:10px;font-weight:800;border-radius:999px;padding:1px 5px;line-height:1.3}
.notif-panel{position:fixed;top:calc(var(--topbar-h) + 6px);right:22px;width:320px;max-height:70vh;overflow-y:auto;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-lift);z-index:40}
.notif-head{padding:12px 16px;font-weight:800;color:var(--biru);border-bottom:1px solid var(--garis)}
.notif-list p{margin:0}
.notif-item{padding:10px 16px;border-bottom:1px solid var(--garis);font-size:13px}
.notif-item:last-child{border-bottom:0}
.notif-item.notif-belum{background:#f2f6fb}
.notif-item span{display:block;margin-top:3px;color:var(--abu)}

.form-judul{margin-top:24px;font-size:15px;color:var(--biru);border-top:1px solid var(--garis);padding-top:16px}

/* ---------- Halaman Login ---------- */
body.auth-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 12% 8%, rgba(217,154,30,.25) 0%, transparent 42%),
    radial-gradient(circle at 88% 92%, rgba(47,111,196,.35) 0%, transparent 45%),
    linear-gradient(135deg, var(--biru) 0%, var(--biru2) 55%, var(--biru3) 100%);
}
body.auth-page main{max-width:none;margin:0;padding:0}
.auth-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px;gap:18px}
.auth-card{
  background:#fff;border-radius:20px;padding:38px 34px 32px;width:100%;max-width:420px;
  box-shadow:0 24px 60px rgba(8,20,40,.35),0 4px 14px rgba(8,20,40,.15);
  text-align:center;
}
.auth-logo{height:min(320px, 40vh);width:auto;max-width:100%;margin:0 auto 26px;display:block}
.auth-card .grid2, .auth-card label:not(.grid2 label){max-width:380px;margin-left:auto;margin-right:auto}
.auth-btn{max-width:380px;margin-left:auto;margin-right:auto;display:block}
.auth-card label{text-align:left}
.auth-btn{width:100%;margin-top:14px;padding:12px;font-size:14.5px}
.auth-footer{color:rgba(255,255,255,.75);font-size:12px;letter-spacing:.3px}
@media(max-width:420px){.auth-card{padding:30px 22px 26px;border-radius:16px}}

main{max-width:1180px;margin:26px auto;padding:0 16px}
h1{color:var(--biru);font-size:21px;margin:0 0 4px;font-weight:800;letter-spacing:-.2px}
h2{font-weight:700;letter-spacing:-.1px}
.muted{color:var(--abu);font-size:13px}
.card,.lembar{
  background:var(--putih);border:1px solid var(--garis);border-radius:var(--radius);
  padding:24px;margin-bottom:22px;box-shadow:var(--shadow-sm);
  transition:box-shadow .2s;
}

label{display:block;font-weight:600;font-size:13px;margin:12px 0 4px;color:#33404f}
input[type=text],input[type=number],textarea,select{
  width:100%;padding:10px 12px;border:1.5px solid var(--garis);border-radius:var(--radius-sm);
  font:inherit;font-weight:400;background:#fbfcfe;transition:border-color .15s,box-shadow .15s;
}
input:focus,textarea:focus,select:focus{
  outline:none;border-color:var(--biru3);box-shadow:0 0 0 3px rgba(47,111,196,.15);background:#fff;
}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}

.segmented{display:flex;gap:8px;margin-bottom:4px}
.seg{padding:10px 18px;border:1.5px solid var(--garis);background:#fff;border-radius:var(--radius-sm);cursor:pointer;font:inherit;font-weight:600;color:#455066;transition:all .15s}
.seg:hover{border-color:var(--biru3)}
.seg.active{background:var(--biru);color:#fff;border-color:var(--biru);box-shadow:var(--shadow-sm)}
.opsi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.opsi-btn{text-align:left;padding:13px;border:1.5px solid var(--garis);border-radius:var(--radius-sm);background:#fff;cursor:pointer;font:inherit;transition:all .15s}
.opsi-btn:hover{border-color:var(--biru3);transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.opsi-btn strong{display:block;color:var(--biru);font-weight:700}
.opsi-btn span{font-size:12px;color:var(--abu)}
.opsi-btn.aktif{border-color:var(--biru);box-shadow:inset 0 0 0 1.5px var(--biru),var(--shadow-sm);background:#f2f6fb}
.pesan{color:var(--merah);font-size:13px;min-height:18px;margin:10px 0 0;font-weight:600}

.btn-utama{background:linear-gradient(135deg,var(--biru2),var(--biru3));color:#fff;border:0;padding:11px 20px;border-radius:var(--radius-sm);cursor:pointer;font:inherit;font-weight:700;box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s}
.btn-utama:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-utama:active{transform:translateY(0)}
.btn-sekunder{background:#fff;color:var(--biru);border:1.5px solid var(--biru);padding:10px 18px;border-radius:var(--radius-sm);cursor:pointer;font:inherit;font-weight:600;transition:all .15s}
.btn-sekunder:hover{background:#f2f6fb;transform:translateY(-1px)}
.btn-hapus{background:#fff;color:var(--merah);border:1.5px solid #f0c2c2;padding:6px 12px;border-radius:var(--radius-sm);cursor:pointer;font:inherit;font-size:12px;font-weight:600;transition:all .15s}
.btn-hapus:hover{background:#fdecec}
.nav{display:flex;justify-content:space-between;gap:10px;margin-top:20px}

.lompat-bar{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.lompat-bar select{width:auto;min-width:220px;padding:7px 10px;border:1.5px solid var(--garis);border-radius:var(--radius-sm);font:inherit;font-size:12.5px;font-weight:600;color:var(--biru)}

.head-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.crumb{font-size:12px;color:var(--abu);text-transform:uppercase;letter-spacing:.5px;font-weight:600}
.crumb a{color:var(--biru2);text-transform:none;letter-spacing:0;font-weight:600}
.definisi{font-style:italic;color:#444;margin:4px 0 0}
.badge{min-width:90px;text-align:center;padding:9px 12px;border-radius:999px;font-weight:800;background:#eee;color:#555;box-shadow:var(--shadow-sm)}
.badge.lv1,.badge.lv2{background:#fdeeee;color:var(--merah)}
.badge.lv3{background:#eaf7ec;color:var(--hijau)}
.badge.lv4{background:#e8f1fb;color:var(--biru)}
.badge.lv5{background:#e3f0fd;color:#0b57a4;box-shadow:inset 0 0 0 2px #0b57a4}
.progress{height:5px;background:#e9edf3;border-radius:99px;margin:14px 0 18px;overflow:hidden}
.progress .bar{height:100%;background:linear-gradient(90deg,var(--emas),#f0b84a);border-radius:99px;transition:width .3s}

.pancingan{background:linear-gradient(135deg,#fdf7ea,#fbeecb);border-left:4px solid var(--emas);padding:14px 16px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-bottom:16px;box-shadow:var(--shadow-sm)}
.pancingan-judul{font-size:12px;font-weight:800;color:#8a6108;text-transform:uppercase;letter-spacing:.4px}
.pancingan blockquote{margin:6px 0 0;font-size:15px;font-weight:600;color:#3d2c06}
.pancingan details{margin-top:10px}
.pancingan summary{cursor:pointer;font-size:13px;color:var(--biru2);font-weight:700}
.alur-key{margin-top:10px;font-size:13px;color:#3d2c06}
.alur-key ol{margin:4px 0 0;padding-left:18px}
.alur-key li{margin:2px 0}
.dua-kolom{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px;font-size:13px}
.dua-kolom ol{margin:4px 0;padding-left:18px}
.mini{font-size:12px;color:var(--abu);margin:6px 0 0}

/* border-collapse:separate + tanpa overflow:hidden di sini dengan sengaja
   — sama seperti table.rekap, supaya thead th position:sticky di bawah
   benar-benar nempel saat halaman di-scroll (tidak jalan kalau
   border-collapse:collapse atau ada ancestor overflow:hidden). */
table.kamus{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px;border-radius:var(--radius-sm)}
table.kamus thead th{position:sticky;top:var(--topbar-h);z-index:2;box-shadow:0 2px 6px rgba(0,0,0,.18)}
table.kamus th{background:var(--biru);color:#fff;padding:9px 10px;border-bottom:1px solid var(--biru);border-right:1px solid var(--biru);text-align:left;vertical-align:top;font-weight:700}
table.kamus th:last-child{border-right:none}
table.kamus th span{display:block;font-weight:400;opacity:.85;font-size:11px;margin-top:2px}
table.kamus td{border-bottom:1px solid var(--garis);border-right:1px solid var(--garis);padding:0;vertical-align:top;width:29%}
table.kamus td:last-child{border-right:none}
table.kamus td.kkey{width:13%;padding:9px;background:#fff8e6;font-weight:700;color:#6b4c07}
.hint-key{margin-top:6px;font-weight:400}
.hint-key summary{cursor:pointer;font-size:11px;color:var(--biru2);font-weight:600}
.hint-key p{margin:6px 0 0;font-size:11.5px;color:#444;font-weight:400}
table.kamus td.kosong{text-align:center;color:#aaa;background:#f7f8fa;padding:8px}
label.butir{display:flex;gap:8px;padding:9px;cursor:pointer;align-items:flex-start;height:100%;transition:background .15s}
label.butir input{margin-top:2px;width:16px;height:16px;flex:0 0 auto;cursor:pointer;accent-color:var(--biru2)}
label.butir:hover{background:#f6f9fd}
td.sel:has(input:checked){background:#eaf8ec;transition:background .2s}
td.sel:has(input:checked) label.butir{font-weight:700}

.catatan{font-size:12px;color:#8a1c1c;background:#fdf1f1;border-left:3px solid var(--merah);padding:9px 12px;margin:10px 0 0;border-radius:0 6px 6px 0}
.penentu{display:flex;gap:24px;flex-wrap:wrap;margin:14px 0 6px;font-size:13px}
.penentu label{font-weight:400;display:flex;gap:8px;align-items:center;margin:0}
.ringkas{background:linear-gradient(135deg,#f2f6fb,#e8f0fa);border-radius:var(--radius-sm);padding:11px 14px;font-size:13px;font-weight:500;box-shadow:var(--shadow-sm)}
.catatan-asesor{margin-top:12px}

/* border-collapse:separate (bukan collapse) dan tanpa overflow:hidden di
   sini dengan sengaja — position:sticky pada th (dipakai .tabel-scroll)
   tidak akan pernah nempel kalau tabelnya border-collapse:collapse atau
   ada ancestor dengan overflow:hidden. */
table.rekap{width:100%;border-collapse:separate;border-spacing:0;font-size:13px;margin-top:12px;border-radius:var(--radius-sm)}
table.rekap th{background:var(--biru);color:#fff;padding:9px;border-bottom:1px solid var(--biru);border-right:1px solid var(--biru);text-align:left;font-weight:700}
table.rekap td{border-bottom:1px solid var(--garis);border-right:1px solid var(--garis);padding:8px 10px}
table.rekap th:last-child,table.rekap td:last-child{border-right:none}
table.rekap tbody tr{transition:background .12s}
table.rekap tbody tr:nth-child(even) td{background:#f7f9fc}
table.rekap tbody tr:hover td{background:#eef4fc}
.lvcell{text-align:center;font-weight:800;color:var(--biru)}
.ident{margin:6px 0 10px}
.skor{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}
.skor div{background:linear-gradient(135deg,#f2f6fb,#e8f0fa);border-radius:var(--radius-sm);padding:12px 14px;box-shadow:var(--shadow-sm)}
.skor span{display:block;font-size:12px;color:var(--abu);font-weight:500}
.skor b{font-size:17px;color:var(--biru);font-weight:800}
@media(max-width:900px){.grid2,.opsi,.dua-kolom,.skor{grid-template-columns:1fr}}

.jd-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 16px;margin:10px 0 18px;font-size:13px}
.jd-meta div{display:flex;flex-direction:column;background:#f7f9fc;border-radius:var(--radius-sm);padding:8px 10px}
.jd-meta span{font-size:11px;color:var(--abu);text-transform:uppercase;letter-spacing:.3px;font-weight:600}
.jd-meta b{font-weight:700}
.jd-list{margin:6px 0 0;padding-left:20px;font-size:13.5px}
.jd-list li{margin:4px 0}
.jd-kelompok{margin-bottom:14px}
.jd-indikator{font-size:12px;color:var(--abu);margin:4px 0 0}
.jd-table{width:100%;border-collapse:collapse;font-size:13px;margin:6px 0 14px;border-radius:var(--radius-sm);overflow:hidden}
.jd-table th{background:#eef2f7;color:var(--biru);padding:7px 9px;border:1px solid var(--garis);text-align:left;font-weight:700}
.jd-table td{border:1px solid var(--garis);padding:7px 9px}
@media(max-width:900px){.jd-meta{grid-template-columns:1fr 1fr}}

.hav-box{margin-top:20px;background:linear-gradient(135deg,#fbf9f2,#fdf3de);border:1px solid #ecd9a0;border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow-sm)}
.hav-box h2{margin:0 0 8px;font-size:17px;color:#8a6108}
.hav-box > button{margin-top:10px}
.hav-kategori{margin-top:10px;font-size:15px}
.hav-kategori b{color:var(--biru)}

.prioritas-blok{margin-top:20px}
.prioritas-blok h2{font-size:17px;color:var(--biru);margin:0 0 4px}
.prioritas-item{background:#fff;border:1px solid var(--garis);border-left:4px solid var(--biru3);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:12px 16px;margin-top:12px;box-shadow:var(--shadow-sm)}
.prioritas-judul{font-weight:800;color:var(--biru);font-size:14px}
.prioritas-baris{font-size:12.5px;margin:6px 0 0;color:#444}
.prioritas-mendesak{color:#8a1c1c}
.prioritas-kuat{color:var(--hijau)}

/* ---------- Dashboard HAV Maps ---------- */
.dash-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
.dash-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dash-total{font-weight:800;color:var(--biru);font-size:13px;background:#e8f1fb;padding:6px 12px;border-radius:999px}
.dash-filters select{padding:8px 12px;border:1.5px solid var(--garis);border-radius:var(--radius-sm);font:inherit;width:auto}
.dash-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;margin-top:16px;align-items:start}
@media(max-width:1000px){.dash-layout{grid-template-columns:1fr}}

.hav-grid{display:flex;gap:8px}
.hav-axis-y{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:700;color:var(--abu);text-align:center;padding:4px 0}
.hav-grid-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;flex:1}
.hav-axis-x{grid-column:1/-1;text-align:center;font-size:12px;font-weight:700;color:var(--abu);margin-top:2px}
.hav-cell{border-radius:var(--radius-sm);padding:11px;min-height:80px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .15s,box-shadow .15s;cursor:pointer}
.hav-cell:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.hav-cell-nama{font-size:12px;font-weight:800;line-height:1.25}
.hav-cell-nama .mini{font-weight:500;opacity:.8}
.hav-cell-nums{display:flex;gap:6px;margin-top:6px}
.hav-cell-nums span{background:rgba(0,0,0,.14);border-radius:6px;padding:3px 8px;font-size:12px;font-weight:800}
.hav-red{background:#f6c6c6;color:#7a1f1f}
.hav-darkred{background:#e08585;color:#4a0f0f}
.hav-yellow{background:#fbe6a5;color:#6b5000}
.hav-green{background:#c9f0c0;color:#1f5c1a}
.hav-darkgreen{background:linear-gradient(135deg,#7fd67a,#5fc95a);color:#12360f;box-shadow:inset 0 0 0 2px rgba(18,54,15,.15)}

.dash-list table.rekap{font-size:12.5px}
.rekom-teks{margin:0}
.contoh-hav{margin-top:6px}
.contoh-hav summary{cursor:pointer;color:var(--biru2);font-weight:600;font-size:11.5px;list-style:none}
.contoh-hav summary::before{content:"▸ ";display:inline-block;transition:transform .15s}
.contoh-hav[open] summary::before{transform:rotate(90deg)}
.contoh-hav p{margin:6px 0 0;color:var(--abu);font-style:italic}

/* ---------- Modal ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(18,30,48,.55);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}
.modal-overlay[hidden]{display:none}
.modal-box{background:#fff;border-radius:var(--radius);max-width:640px;width:100%;max-height:85vh;overflow-y:auto;padding:24px 26px;box-shadow:var(--shadow-lift);position:relative}
.modal-box h2{margin:0 0 14px;font-size:17px;color:var(--biru);padding-right:24px}
.modal-close{position:absolute;top:14px;right:16px;background:none;border:0;font-size:22px;line-height:1;color:var(--abu);cursor:pointer;padding:4px}
.modal-close:hover{color:var(--merah)}
.modal-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--biru2);margin:16px 0 4px}
.modal-label:first-of-type{margin-top:0}
.modal-box p{margin:0;font-size:13.5px;line-height:1.5}
.modal-list{margin:0;padding-left:18px;font-size:13.5px;line-height:1.7}

.panduan-grup{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--emas);margin:18px 0 6px;padding-top:10px;border-top:1px solid var(--garis)}
.panduan-grup:first-child{margin-top:0;padding-top:0;border-top:0}
.panduan-item{border:1px solid var(--garis);border-radius:var(--radius-sm);padding:0;margin-top:8px;overflow:hidden}
.panduan-item summary{cursor:pointer;padding:10px 14px;font-weight:700;font-size:13px;color:var(--biru);list-style:none;background:#f7f9fc}
.panduan-item summary::-webkit-details-marker{display:none}
.panduan-item summary::before{content:"▸ ";display:inline-block;transition:transform .15s}
.panduan-item[open] summary::before{transform:rotate(90deg)}
.panduan-item[open] summary{border-bottom:1px solid var(--garis)}
.panduan-item > p, .panduan-item > .modal-label{padding-left:14px;padding-right:14px}
.panduan-item p:last-child{padding-bottom:12px}

/* Pembungkus generik untuk tabel apa pun yang datanya bisa bertambah terus
   (mis. Riwayat, daftar Dashboard) — dibatasi tingginya lalu discroll,
   header ikut nempel. */
.tabel-scroll{max-height:60vh;overflow-y:auto;border:1px solid var(--garis);border-radius:var(--radius-sm);margin-top:12px}
.tabel-scroll table.rekap{margin-top:0}
.tabel-scroll table.rekap thead th{position:sticky;top:0;z-index:1}

.toast-msg{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--merah);color:#fff;padding:11px 20px;border-radius:999px;font-size:13px;font-weight:600;box-shadow:var(--shadow-lift);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:100;max-width:90vw}
.toast-msg.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- Tanda tangan manual & cetak PDF ----------
   Blok ini KHUSUS untuk lembar PDF (persetujuan atasan) — sengaja tidak
   ditampilkan di halaman web, cuma muncul saat print/"Save as PDF". */
.ttd-blok{display:none}
.ttd-judul{font-size:11px;color:var(--abu);margin:0 0 10px}
.ttd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ttd-grid-satu{grid-template-columns:240px;justify-content:start}
.ttd-kolom{display:flex;flex-direction:column;text-align:center}
.ttd-label{font-size:11px;color:var(--abu);text-transform:uppercase;letter-spacing:.4px;font-weight:700;margin-bottom:30px}
.ttd-garis{border-top:1.5px solid #333;margin-bottom:6px}
.ttd-kolom b{font-size:13px}
.ttd-kolom .mini{margin-top:4px}

@media print{
  .no-print,.topbar,.nav,#toast-msg,.modal-overlay{display:none!important}
  body{background:#fff;font-size:11px}
  main{max-width:100%;margin:0;padding:0}
  h1{font-size:16px;margin-bottom:2px}
  .card,.lembar{box-shadow:none;border:none;padding:4px 2px;margin-bottom:0;position:static!important}
  .hav-cell:hover{transform:none;box-shadow:none}
  /* position:sticky pada topbar & thead bisa bikin browser salah render
     lintas halaman saat print (elemen "nempel ulang" atau baris tabel
     terpotong tepat di batas halaman) — matikan semua sticky saat print
     dan pakai cara native tabel untuk mengulang header per halaman. */
  .topbar,table.kamus thead th,table.rekap thead th{position:static!important}
  table.kamus thead,table.rekap thead{display:table-header-group}
  table.kamus tr,table.rekap tr{page-break-inside:avoid;break-inside:avoid}
  .ident,.head-row,.skor,.hav-box,.ttd-blok{page-break-inside:avoid;break-inside:avoid}

  /* padatkan semua jarak & ukuran huruf supaya muat 1 lembar */
  table.rekap{font-size:10px;margin-top:6px}
  table.rekap th,table.rekap td{padding:3px 6px}
  .ident{margin:2px 0 6px;font-size:11px}
  .skor{gap:6px;margin-top:8px}
  .skor div{padding:6px 8px}
  .skor span{font-size:10px}
  .skor b{font-size:13px}
  .hav-box{margin-top:8px;padding:8px 10px}
  .hav-box h2{font-size:13px;margin-bottom:4px}
  .hav-kategori{margin-top:5px;font-size:12px}
  .jd-indikator{margin-top:3px}

  .ttd-blok{display:block!important;margin-top:14px;padding-top:8px}
  .ttd-judul{font-size:9.5px;margin-bottom:6px}
  .ttd-grid-satu{grid-template-columns:200px}
  .ttd-label{margin-bottom:20px;font-size:10px}
  .ttd-kolom b{font-size:11px}

  @page{margin:10mm;size:auto}
}
