/* /id/kompres-foto/ + /id/ubah-ukuran-foto/ — bagian khusus di atas UI kit v1 (09/11/2026) */
.kf-opts{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.kf-opts .t-hint{display:block;margin-bottom:6px;font-weight:600;color:var(--t-ink)}
.kf-custom{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:15px;color:var(--t-mute)}
.kf-custom .t-input{width:110px;min-height:40px}
.kf-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.kf-row label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--t-mute)}
.kf-row .t-input{width:130px}
.kf-chk{flex-direction:row!important;align-items:center;gap:6px!important;min-height:44px}
.kf-list{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.kf-list li{display:grid;grid-template-columns:48px 1fr auto;grid-template-areas:"th n b" "th s b" "th r b";column-gap:10px;align-items:center;border:1px solid var(--t-line);border-radius:12px;padding:8px 10px;background:#fff}
.kf-list .th{grid-area:th;width:48px;height:48px;border-radius:8px;background:var(--t-bg);overflow:hidden}
.kf-list .th img{width:100%;height:100%;object-fit:cover;display:block}
.kf-list .n{grid-area:n;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.kf-list .s{grid-area:s;font-size:13px;color:var(--t-mute)}
.kf-list .r{grid-area:r;font-size:13px;color:var(--t-mute)}
.kf-list .r .ok{color:var(--t-ok);font-weight:600}
.kf-list .r .bad{color:var(--t-bad);font-weight:600}
.kf-list .b{grid-area:b;display:flex;gap:6px;align-items:center}
.kf-list .x{border:0;background:none;color:var(--t-mute);cursor:pointer;font-size:20px;min-width:36px;min-height:36px;border-radius:8px}
.kf-list .x:hover{background:var(--t-bad-l);color:var(--t-bad)}
.kf-rel h2{margin-bottom:12px}
.kf-relg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.kf-relg a{display:flex;flex-direction:column;gap:2px;border:1px solid var(--t-line);border-radius:14px;padding:14px 16px;background:#fff;text-decoration:none;color:var(--t-ink)}
.kf-relg a:hover{border-color:var(--t-main)}
.kf-relg span{font-size:13px;color:var(--t-mute)}
@media(max-width:480px){.kf-row .t-input{width:110px}.kf-list li{grid-template-columns:44px 1fr auto}}