#pbj-untad {
  --pbj-primary: #0b337c;
  --pbj-primary-dark: #186bbd;
  --pbj-accent: #d6a84f;
  --pbj-text: #26332d;
  --pbj-muted: #68766f;
  --pbj-border: #dfe7e2;
  --pbj-bg: #f5f8f6;
  font-family: inherit;
  color: var(--pbj-text);
  width: 100%;
}
#pbj-untad * { box-sizing: border-box; }
#pbj-untad .pbj-hero {
  background: linear-gradient(125deg, var(--pbj-primary-dark), var(--pbj-primary));
  color: #fff; border-radius: 14px; padding: 28px 30px; margin-bottom: 22px;
  position: relative; overflow: hidden;
}
#pbj-untad .pbj-hero:after {
  content:""; position:absolute; width:180px; height:180px; right:-45px; top:-65px;
  border:25px solid rgba(255,255,255,.08); border-radius:50%;
}
#pbj-untad .pbj-eyebrow { text-transform:uppercase; letter-spacing:.12em; font-size:12px; font-weight:700; opacity:.82; margin:0 0 8px; }
#pbj-untad .pbj-hero h2 { color:#fff; font-size:clamp(24px,3vw,34px); line-height:1.2; margin:0 0 10px; }
#pbj-untad .pbj-hero p { color:rgba(255,255,255,.88); margin:0; max-width:720px; }
#pbj-untad .pbj-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:22px; align-items:start; }
#pbj-untad .pbj-sidebar { border:1px solid var(--pbj-border); border-radius:12px; overflow:hidden; background:#fff; }
#pbj-untad .pbj-sidehead { background:var(--pbj-primary); color:#fff; padding:15px 17px; font-weight:700; }
#pbj-untad .pbj-nav { padding:8px; }
#pbj-untad .pbj-nav button {
  display:flex; align-items:center; gap:10px; width:100%; text-align:left;
  background:transparent; color:var(--pbj-text); border:0; border-radius:8px;
  padding:12px 11px; margin:2px 0; font:inherit; font-size:14px; line-height:1.35;
  cursor:pointer; transition:background .15s,color .15s;
}
#pbj-untad .pbj-nav button:hover { background:#edf5f0; }
#pbj-untad .pbj-nav button[aria-current="page"] { background:var(--pbj-primary); color:#fff; font-weight:700; }
#pbj-untad .pbj-nav .pbj-nav-icon { width:24px; height:24px; flex:0 0 24px; display:grid; place-items:center; border-radius:6px; background:#edf5f0; color:var(--pbj-primary); font-size:12px; font-weight:800; }
#pbj-untad .pbj-nav button[aria-current="page"] .pbj-nav-icon { background:rgba(255,255,255,.17); color:#fff; }
#pbj-untad .pbj-content { min-width:0; }
#pbj-untad .pbj-panel { display:none; background:#fff; border:1px solid var(--pbj-border); border-radius:12px; padding:24px; }
#pbj-untad .pbj-panel.is-active { display:block; }
#pbj-untad .pbj-panel h3 { font-size:24px; line-height:1.3; color:var(--pbj-primary-dark); margin:0 0 8px; }
#pbj-untad .pbj-intro { color:var(--pbj-muted); margin:0 0 20px; }
#pbj-untad .pbj-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:18px 0; }
#pbj-untad .pbj-stat { border:1px solid var(--pbj-border); border-radius:10px; padding:15px; background:var(--pbj-bg); }
#pbj-untad .pbj-stat strong { display:block; color:var(--pbj-primary); font-size:23px; margin-bottom:3px; }
#pbj-untad .pbj-stat span { color:var(--pbj-muted); font-size:12px; }
#pbj-untad .pbj-note { background:#fff8e9; border-left:4px solid var(--pbj-accent); padding:13px 15px; border-radius:5px; font-size:13px; margin:16px 0; }
#pbj-untad .pbj-yearlinks { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
#pbj-untad .pbj-chip { display:inline-block; border:1px solid var(--pbj-border); border-radius:999px; padding:8px 13px; color:var(--pbj-primary); text-decoration:none; font-weight:700; font-size:13px; background:#fff; }
#pbj-untad .pbj-chip:hover { background:#edf5f0; }
#pbj-untad .pbj-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; margin:16px 0; }
#pbj-untad .pbj-packages { display:flex; flex-wrap:wrap; gap:8px; }
#pbj-untad .pbj-packages button { border:1px solid var(--pbj-border); border-radius:8px; background:#fff; padding:10px 13px; cursor:pointer; font:inherit; font-size:13px; font-weight:700; color:var(--pbj-text); }
#pbj-untad .pbj-packages button.is-active { background:var(--pbj-primary); border-color:var(--pbj-primary); color:#fff; }
#pbj-untad .pbj-search { max-width:260px; width:100%; border:1px solid var(--pbj-border); border-radius:8px; padding:10px 12px; font:inherit; font-size:13px; }
#pbj-untad .pbj-tablewrap { overflow-x:auto; border:1px solid var(--pbj-border); border-radius:9px; }
#pbj-untad table { width:100%; border-collapse:collapse; min-width:560px; margin:0; }
#pbj-untad th { background:#edf4ef; color:var(--pbj-primary-dark); font-size:12px; text-align:left; padding:13px 12px; }
#pbj-untad td { border-top:1px solid var(--pbj-border); padding:12px; vertical-align:middle; font-size:13px; }
#pbj-untad tbody tr:hover { background:#fafcfb; }
#pbj-untad .pbj-doclink { color:var(--pbj-primary); text-decoration:none; font-weight:700; }
#pbj-untad .pbj-doclink:hover { text-decoration:underline; }
#pbj-untad .pbj-status { display:inline-block; background:#f0f2f1; color:#59655e; border-radius:6px; padding:6px 8px; font-size:11px; font-weight:700; }
#pbj-untad .pbj-footer-note { margin-top:12px; color:var(--pbj-muted); font-size:12px; }
#pbj-untad .pbj-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#pbj-untad .pbj-card { border:1px solid var(--pbj-border); border-radius:10px; padding:17px; text-decoration:none; color:inherit; display:block; }
#pbj-untad .pbj-card:hover { border-color:var(--pbj-primary); background:#fbfdfb; }
#pbj-untad .pbj-card strong { display:block; color:var(--pbj-primary); margin-bottom:5px; }
#pbj-untad .pbj-card span { color:var(--pbj-muted); font-size:13px; }
#pbj-untad .pbj-empty { display:none; padding:18px; text-align:center; color:var(--pbj-muted); }
@media(max-width:767px) {
  #pbj-untad .pbj-layout { grid-template-columns:1fr; gap:14px; }
  #pbj-untad .pbj-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; }
  #pbj-untad .pbj-nav button { align-items:flex-start; padding:10px 8px; font-size:12px; }
  #pbj-untad .pbj-nav .pbj-nav-icon { width:21px; height:21px; flex-basis:21px; }
  #pbj-untad .pbj-panel { padding:17px; }
  #pbj-untad .pbj-stats { grid-template-columns:1fr; }
  #pbj-untad .pbj-cards { grid-template-columns:1fr; }
  #pbj-untad .pbj-hero { padding:22px 20px; }
  #pbj-untad .pbj-toolbar { align-items:stretch; }
  #pbj-untad .pbj-search { max-width:none; }
}

#pbj-untad .pbj-filterbar{display:flex;justify-content:flex-end;margin:0 0 14px}
#pbj-untad .pbj-yearfilter{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--pbj-text)}
#pbj-untad .pbj-yearfilter select{border:1px solid var(--pbj-border);border-radius:8px;padding:9px 12px;background:#fff;font:inherit}
#pbj-untad .pbj-package-list{display:grid;gap:18px}
#pbj-untad .pbj-package{border:1px solid var(--pbj-border);border-radius:10px;overflow:hidden;background:#fff;margin:16px 0}
#pbj-untad .pbj-package>header{padding:18px;background:var(--pbj-bg);border-bottom:1px solid var(--pbj-border)}
#pbj-untad .pbj-package>header .pbj-eyebrow{color:var(--pbj-primary);margin:0 0 6px}
#pbj-untad .pbj-package h4{margin:0 0 8px;color:var(--pbj-primary-dark);font-size:19px}
#pbj-untad .pbj-package header p:last-child{margin:0}
#pbj-untad .pbj-tablewrap{overflow-x:auto}
#pbj-untad .pbj-tablewrap table{width:100%;border-collapse:collapse}
#pbj-untad .pbj-tablewrap th,#pbj-untad .pbj-tablewrap td{padding:12px;border-bottom:1px solid var(--pbj-border);text-align:left;vertical-align:top}
#pbj-untad .pbj-tablewrap th{background:#f7f9f8;color:var(--pbj-primary-dark)}
#pbj-untad .pbj-doc-link{font-weight:700;color:var(--pbj-primary);text-decoration:none}
#pbj-untad .pbj-status{display:inline-block;background:#f0f2f4;border-radius:6px;padding:5px 8px;font-size:13px;color:#58645d}
#pbj-untad .pbj-neutral{background:#edf5f0;color:#27385b}
#pbj-untad .pbj-warning{background:#fff4e5;color:#8a4b08}
#pbj-untad .pbj-muted{background:#f0f2f4;color:#58645d}
#pbj-untad .pbj-footer-note{color:var(--pbj-muted);font-size:13px;margin-top:18px}
#pbj-untad .pbj-panel[hidden]{display:none!important}
@media(max-width:760px){#pbj-untad .pbj-layout{grid-template-columns:1fr}#pbj-untad .pbj-sidebar{position:static}#pbj-untad .pbj-filterbar{justify-content:stretch}#pbj-untad .pbj-yearfilter{width:100%;justify-content:space-between}#pbj-untad .pbj-yearfilter select{flex:1;max-width:65%}}


/* Layout responsive mengikuti Template.html acuan */
#pbj-untad .pbj-package-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
#pbj-untad .pbj-package{min-width:0;margin:0}
#pbj-untad .pbj-package .pbj-tablewrap table{min-width:500px}
#pbj-untad .pbj-filterbar[hidden]{display:none!important}
@media(max-width:900px){#pbj-untad .pbj-package-list{grid-template-columns:1fr}}


/* Struktur tabel mengikuti Template.html: ringkasan paket berdampingan, satu tabel gabungan */
#pbj-untad .pbj-package-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch;margin:16px 0 20px}
#pbj-untad .pbj-package-summary{min-width:0;border:1px solid var(--pbj-border);border-radius:10px;background:var(--pbj-bg);padding:18px}
#pbj-untad .pbj-package-summary h4{margin:0 0 14px;color:var(--pbj-primary-dark);font-size:18px}
#pbj-untad .pbj-package-summary p{margin:7px 0;color:var(--pbj-text);font-size:14px}
#pbj-untad .pbj-combined-table table{width:100%;min-width:760px;table-layout:auto}
#pbj-untad .pbj-combined-table th{background:#edf5f0;font-weight:700}
#pbj-untad .pbj-combined-table td{overflow-wrap:anywhere}
#pbj-untad .pbj-combined-table .pbj-status{white-space:normal}
@media(max-width:900px){#pbj-untad .pbj-package-list{grid-template-columns:1fr}}


/* Pencarian dokumen mengikuti Template HTML acuan */
#pbj-untad .pbj-toolbar{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:12px;margin:16px 0}
#pbj-untad .pbj-search{max-width:260px;width:100%;border:1px solid var(--pbj-border);border-radius:8px;padding:10px 12px;font:inherit;font-size:13px;background:#fff;color:var(--pbj-text)}
#pbj-untad .pbj-empty{display:none;padding:18px;text-align:center;color:var(--pbj-muted)}
#pbj-untad .pbj-empty.is-visible{display:block}
@media(max-width:767px){#pbj-untad .pbj-toolbar{align-items:stretch}#pbj-untad .pbj-search{max-width:none}}