:root{--bg:#f7f8fb;--card:#fff;--text:#0f1724;--muted:#6b7280;--primary:#7c9ef8;--danger:#ffd7d9;--danger-border:#ff6b6b;--radius:12px}
*{box-sizing:border-box}body{font-family:Inter,system-ui,Arial;margin:0;padding:28px;background:linear-gradient(180deg,var(--bg),#fbfdff 60%);color:var(--text)}
.wrap{max-width:1100px;margin:0 auto}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.card{background:var(--card);padding:20px;border-radius:16px;box-shadow:0 8px 28px rgba(19,24,40,0.06)}
input,select,textarea{width:100%;padding:10px;border-radius:10px;border:1px solid #eef2f7;background:#fbfdff}
label{display:block;margin-top:12px;font-weight:700;color:var(--muted)}button{background:var(--primary);color:#fff;padding:10px 14px;border:0;border-radius:10px;margin-top:12px}
.btn{display:inline-block;padding:8px 12px;background:var(--primary);color:#fff;border-radius:10px;text-decoration:none}
.table{width:100%;border-collapse:separate;border-spacing:0 10px}
.ktp-thumb{width:72px;height:48px;object-fit:cover;border-radius:10px}
.small{font-size:12px;color:var(--muted)}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px}
.badge.dp{background:#e6f7ff;color:#035a9a}
.badge.wd{background:#fff4e6;color:#9a5803}
tr.terblokir td{background:linear-gradient(90deg,var(--danger),#fff);border-left:4px solid var(--danger-border)}