.mtsbk{--g:#0a5a1f;--g2:#17802f;--lime:#69b81f;--ye:#ffd21f;--ink:#12301b;--mut:#5d6f63;--line:#e3ebe5;--bg:#f4f8f4;
  font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);max-width:1180px;margin:0 auto;padding:10px 0 30px;font-size:15px;line-height:1.55}
.mtsbk *{box-sizing:border-box}
.mtsbk a{color:var(--g2)}
.bk-ic{width:1.15em;height:1.15em;vertical-align:-.2em}
.bk-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;border-bottom:3px solid var(--ye);padding-bottom:12px;margin-bottom:20px}
.bk-title{margin:0;color:var(--g);font-size:clamp(22px,3vw,30px);font-weight:800;line-height:1.2}
.bk-sub{margin:2px 0 0;color:var(--mut);font-size:14px}
.bk-who{font-size:13px;color:var(--mut);display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.bk-who span{font-weight:600;color:var(--ink)}
.bk-lead{color:var(--mut);margin:0 0 18px}

/* hub */
.bk-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.bk-hubcard{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:var(--ink)!important;box-shadow:0 6px 18px rgba(8,60,25,.08);transition:transform .2s,box-shadow .2s}
.bk-hubcard:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(8,60,25,.16)}
.bk-hubico{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:#fff;margin-bottom:6px}
.bk-hubico .bk-ic{width:26px;height:26px}
.c-blue .bk-hubico{background:#2f80ed}.c-green .bk-hubico{background:#1f9d3a}.c-orange .bk-hubico{background:#f59e0b}.c-purple .bk-hubico{background:#8b3fd1}
.bk-hubcard strong{font-size:17px;line-height:1.3}.bk-hubcard small{color:var(--mut)}.bk-hubcard em{font-style:normal;font-weight:600;color:var(--g2);font-size:13px;margin-top:6px}

/* kartu, tab, form */
.bk-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:18px;box-shadow:0 4px 14px rgba(8,60,25,.06)}
.bk-card h3{margin:0 0 12px;color:var(--g);font-size:18px}.bk-card h3 small{color:var(--mut);font-weight:500;font-size:13px}
.bk-card h4{margin:14px 0 6px;font-size:14px;color:var(--mut)}
.bk-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.bk-tabs a{padding:9px 18px;border-radius:999px;background:#fff;border:1px solid var(--line);text-decoration:none;font-weight:600;font-size:14px;color:var(--ink)}
.bk-tabs a.on{background:linear-gradient(180deg,#0f6a27,#0a5a1f);color:#fff;border-color:var(--g)}
.bk-form label,.bk-filter label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:12px}
.bk-form input,.bk-form select,.bk-form textarea,.bk-filter input,.bk-filter select{display:block;width:100%;margin-top:4px;padding:10px 12px;border:1px solid #cfdcd2;border-radius:10px;font:inherit;font-weight:400;background:#fff;color:var(--ink)}
.bk-form input:focus,.bk-form select:focus,.bk-form textarea:focus,.bk-filter input:focus,.bk-filter select:focus{outline:2px solid var(--lime);border-color:var(--lime)}
.bk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0 16px}
.bk-wide{grid-column:1/-1}
@media(min-width:760px){.bk-pick .bk-wide{grid-column:span 1}.bk-pick{grid-template-columns:1fr 1fr 2fr}}
.bk-check{display:flex!important;align-items:center;gap:8px;font-weight:500!important}
.bk-form .bk-check input{width:auto;margin:0}
.bk-fs{border:1px dashed #b9cdbd;border-radius:12px;padding:12px 14px;margin:0 0 14px}.bk-fs legend{font-size:13px;font-weight:700;color:var(--g);padding:0 6px}
.bk-btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(180deg,#17802f,#0f6a27);color:#fff!important;border:0;border-radius:10px;padding:11px 22px;font:600 14px/1.2 inherit;font-family:inherit;cursor:pointer;text-decoration:none;box-shadow:0 5px 12px rgba(10,90,31,.25);transition:transform .15s}
.bk-btn:hover{transform:translateY(-2px)}
.bk-sm{padding:8px 14px;font-size:13px}
.bk-ghost{background:#fff;color:var(--g)!important;border:1px solid #b9cdbd;box-shadow:none}
.bk-danger{background:#c43232;box-shadow:none}
.bk-link{background:none;border:0;color:var(--g2);font:600 13px inherit;font-family:inherit;cursor:pointer;padding:0;text-decoration:underline}
.bk-del{color:#c43232}
.bk-inline{display:inline;margin:0}.bk-inline+.bk-inline{margin-left:10px}
.bk-actions{display:flex;gap:8px;align-items:center}
.bk-filter{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px}
.bk-filter label{margin:0;flex:1 1 140px}.bk-filter .bk-btn{flex:none}
.bk-login{max-width:420px;margin:0 auto}.bk-login form p{margin:0 0 12px}.bk-login label{display:block;font-weight:600;font-size:13px}
.bk-login input[type=text],.bk-login input[type=password]{width:100%;padding:10px 12px;border:1px solid #cfdcd2;border-radius:10px;font:inherit}
.bk-login input[type=submit]{background:var(--g2);color:#fff;border:0;border-radius:10px;padding:11px 22px;font-weight:600;cursor:pointer}
.bk-login .login-remember label{font-weight:400}

/* notice */
.bk-note{border-radius:12px;padding:12px 16px;margin-bottom:14px;font-size:14px;font-weight:500}
.bk-ok{background:#e4f6e0;color:#12611f;border:1px solid #bfe3b8}.bk-err{background:#fde8e8;color:#9b1c1c;border:1px solid #f5c0c0}.bk-info{background:#e8f1fd;color:#1d4f91;border:1px solid #c3d8f5}

/* tabel */
.bk-tablewrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:14px}
.bk-table{width:100%;border-collapse:collapse;font-size:14px}
.bk-table th{background:var(--g);color:#fff;text-align:left;padding:10px 12px;font-size:13px;white-space:nowrap}
.bk-table td{padding:11px 12px;border-top:1px solid var(--line);vertical-align:top}
.bk-table tr:nth-child(even) td{background:#fafcfa}
.bk-compact td,.bk-compact th{padding:8px 10px}
.bk-desc{color:var(--mut);font-size:13px}
.bk-empty{color:var(--mut);text-align:center;padding:18px!important}
.bk-act{white-space:nowrap}
.bk-meta{color:var(--mut);font-size:13px;margin:0 0 10px}
.bk-pager{margin:16px 0;display:flex;gap:6px;flex-wrap:wrap}
.bk-pager a,.bk-pager span{padding:6px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;text-decoration:none;font-weight:600;font-size:13px}
.bk-pager .current{background:var(--g2);color:#fff;border-color:var(--g2)}

/* badge */
.bk-b{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap}
.b-gray{background:#eceff1;color:#455a64}.b-yellow{background:#fff3c4;color:#8a6a00}.b-orange{background:#ffe3c2;color:#a35200}.b-red{background:#fcd5d5;color:#a11919}.b-green{background:#dcf3d4;color:#1a6a20}.b-blue{background:#d9e8fb;color:#1d4f91}
.lv0{background:#dcf3d4;color:#1a6a20}.lv1{background:#fff3c4;color:#8a6a00}.lv2{background:#ffe3c2;color:#a35200}.lv3{background:#fcd5d5;color:#a11919}

/* detail kasus */
.bk-row{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:flex-start}
.bk-dl{display:grid;grid-template-columns:200px 1fr;gap:10px 16px;margin:14px 0 0}.bk-dl dt{font-weight:700;color:var(--g);font-size:13px}.bk-dl dd{margin:0}
@media(max-width:640px){.bk-dl{grid-template-columns:1fr}.bk-dl dd{margin-bottom:8px}}
.bk-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px;align-items:start}
.bk-timeline{list-style:none;margin:16px 0 0;padding:0 0 0 18px;border-left:3px solid #cfe6c5}
.bk-timeline li{position:relative;margin-bottom:16px;padding-left:12px}
.bk-timeline li::before{content:"";position:absolute;left:-26px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--g2);border:2px solid #fff}
.bk-timeline time{font-size:12px;font-weight:700;color:var(--g2)}.bk-timeline p{margin:2px 0}.bk-timeline small{color:var(--mut)}
.bk-mini{list-style:none;margin:0;padding:0}.bk-mini li{padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}.bk-mini li:last-child{border:0}
.bk-poin{margin:0 0 10px}.bk-poin strong{font-size:26px;color:var(--g)}

/* dasbor */
.bk-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.bk-kpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;border-top:4px solid var(--g2);box-shadow:0 4px 12px rgba(8,60,25,.06)}
.bk-kpi strong{display:block;font-size:30px;line-height:1.1;color:var(--g)}.bk-kpi span{font-size:13px;color:var(--mut);font-weight:500}
.k-red{border-top-color:#d9534f}.k-red strong{color:#c43232}.k-green{border-top-color:#43aa3b}.k-orange{border-top-color:#f59e0b}.k-orange strong{color:#c77700}.k-blue{border-top-color:#2f80ed}.k-blue strong{color:#1d5fc0}
.bk-chart{display:flex;gap:14px;align-items:flex-end;height:220px;overflow-x:auto;padding-top:10px}
.bk-col{flex:1 0 54px;display:flex;flex-direction:column;align-items:center;height:100%}
.bk-bars{flex:1;display:flex;gap:4px;align-items:flex-end;width:100%;justify-content:center}
.bk-bars i{display:block;width:40%;max-width:26px;min-height:3px;border-radius:6px 6px 0 0;position:relative}
.bk-bars i b{position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:11px;font-style:normal;color:var(--mut)}
.bk-bars .r,.bk-legend .r{background:#e0624d}.bk-bars .g,.bk-legend .g{background:#43aa3b}
.bk-col span{font-size:11px;color:var(--mut);margin-top:6px;white-space:nowrap}
.bk-legend{font-size:12px;color:var(--mut);margin:10px 0 0}.bk-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin:0 4px 0 10px;vertical-align:-1px}.bk-legend i:first-child{margin-left:0}
.bk-legend small.g{background:none;color:#43aa3b;font-weight:600}
.bk-hbars{list-style:none;margin:0;padding:0}
.bk-hbars li{display:grid;grid-template-columns:minmax(80px,1.3fr) 2fr auto;gap:10px;align-items:center;padding:5px 0;font-size:13px}
.bk-hbars .b{height:10px;background:#edf3ee;border-radius:99px;overflow:hidden}.bk-hbars .b i{display:block;height:100%;background:linear-gradient(90deg,var(--lime),var(--g2));border-radius:99px}
.bk-hbars .v{font-weight:700;min-width:36px;text-align:right}.bk-hbars .v small{color:#43aa3b}
.bk-gauge{height:12px;border-radius:99px;background:#edf3ee;overflow:hidden;margin:6px 0}.bk-gauge i{display:block;height:100%;border-radius:99px;min-width:4px}
.bk-gauge .lv0{background:#43aa3b}.bk-gauge .lv1{background:#f2c200}.bk-gauge .lv2{background:#f08a1c}.bk-gauge .lv3{background:#d9534f}

/* mobile: tabel jadi kartu */
@media(max-width:720px){
  .bk-tablewrap{border:0;background:none}
  .bk-table thead{display:none}
  .bk-table,.bk-table tbody,.bk-table tr,.bk-table td{display:block;width:100%}
  .bk-table tr{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;padding:6px 4px}
  .bk-table tr:nth-child(even) td{background:none}
  .bk-table td{border:0;padding:6px 12px;display:flex;gap:10px;justify-content:space-between}
  .bk-table td[data-l]::before{content:attr(data-l);font-weight:700;color:var(--g);font-size:12px;flex:none;min-width:70px}
  .bk-table td>*{max-width:100%}
  .bk-compact tr{padding:0}
}
@media print{
  body *{visibility:hidden}
  .mtsbk,.mtsbk *{visibility:visible}
  .mtsbk{position:absolute;left:0;top:0;width:100%}
  .bk-filter,.bk-btn,.bk-tabs,.bk-who,.bk-link{display:none!important}
  .bk-card,.bk-kpi{box-shadow:none;break-inside:avoid}
}