:root{--c:#a24a25;--d:#5a2f24;--blue:#083d6b;--bg:#fff8ed}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arial,sans-serif;color:#4b2b20;background:url('desa.jpeg') center/cover fixed no-repeat;display:flex}body:before{content:'';position:fixed;inset:0;background:rgba(255,248,237,.88);z-index:-1}aside{width:245px;background:linear-gradient(#ad562c,#793319);min-height:100vh;position:fixed;left:0;top:0;padding:28px 16px;color:white}aside h2{font-size:19px;margin-bottom:34px}aside a{display:flex;gap:12px;align-items:center;color:white;text-decoration:none;padding:14px 18px;border-radius:12px;margin:8px 0;font-weight:600}aside a.on,aside a:hover{background:rgba(255,255,255,.20)}main{margin-left:245px;width:calc(100% - 245px);padding:24px}header{height:66px;border-radius:16px;background:rgba(255,255,255,.95);box-shadow:0 8px 25px #5a2f2415;display:flex;align-items:center;justify-content:space-between;padding:0 28px;margin-bottom:16px}header b{font-size:20px}.hero,.form-card,.paper-form,.table-wrap,.cards div{background:rgba(255,255,255,.95);border-radius:18px;padding:22px;box-shadow:0 8px 25px #5a2f2412}.hero h1,.form-card h1,.paper-form h1{margin:0;color:var(--blue);font-size:30px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cards b{display:block;font-size:30px;color:var(--c);margin-top:8px}input,select,textarea{width:100%;height:42px;border:1px solid #d9e1eb;border-radius:7px;padding:0 12px;background:#fff;font-size:14px}textarea{height:70px;padding:12px}label{font-weight:800;color:#082f57;font-size:14px}.two{display:grid;grid-template-columns:1fr 1fr;gap:18px 28px}.two.small{gap:14px 22px}.box,fieldset{border:1px solid #e0d6c9;border-radius:8px;margin-top:14px;padding:14px 16px;background:rgba(255,255,255,.64)}legend{font-weight:800;color:#071f3d;padding:0 8px}.note{background:#fff1bb;border-radius:7px;padding:14px 18px;color:#5c4100}.submit-row{align-items:center;margin-top:14px}.submit-row button,.actions button,button,.btn{border:0;border-radius:9px;background:#1778bd;color:white;padding:12px 18px;text-decoration:none;font-weight:800;display:inline-block}.btn{background:#af4d2b;padding:8px 12px;margin:2px}.danger{background:#c22922!important}.ok{background:#11a355!important}.grid6{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.grid6 button{background:#bd5630}.table-wrap{overflow:auto;margin-top:14px}table{width:100%;border-collapse:collapse}th{background:#a04525;color:white;text-align:left}th,td{padding:12px;border-bottom:1px solid #eee}.paper-form{max-width:1120px}.paper-form h1{font-size:28px}.paper-form>p{margin-top:4px}.line{border-bottom:1px solid #ccc;padding-bottom:10px}.nomor{display:flex;gap:8px;align-items:center}.nomor input{width:180px}.surat-grid{display:grid;grid-template-columns:130px 14px minmax(190px,1fr) minmax(140px,1fr);gap:10px;align-items:center}.surat-grid span,.surat-grid b,.surat-grid em{font-size:14px;font-style:normal;color:#111}.surat-text{border:1px solid #e0d6c9;border-radius:8px;margin-top:12px;padding:16px;line-height:1.8}.actions{margin-top:15px;display:flex;gap:12px}.reset{background:white!important;color:#333!important;border:1px solid #ddd!important}.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}.brand-login{position:fixed;top:22px;left:34px;font-size:25px;font-weight:800;color:white;text-shadow:0 2px 8px #000}.brand-login span{display:block;font-size:13px}.login-card{width:min(430px,92vw);background:rgba(255,255,255,.92);border-radius:26px;padding:30px 34px;text-align:center}.login-icon{font-size:42px}.login-card h2{text-align:center;font-size:32px}.login-card input{margin:8px 0;height:48px}.center-link{text-align:center}.center-link a{color:#5a2f24;font-weight:800;text-decoration:none}.reg-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.reg-grid button{grid-column:1/-1}@media(max-width:900px){aside{position:static;width:100%;min-height:auto}body{display:block}main{margin:0;width:100%;padding:12px}.two,.cards,.quick-cards,.grid6,.reg-grid{grid-template-columns:1fr}.surat-grid{grid-template-columns:1fr}.table-wrap{font-size:12px}}

.user-dashboard{background:rgba(255,255,255,.78);border-radius:18px;padding:22px;box-shadow:0 8px 25px #5a2f2412}.user-dashboard h1{margin:0;color:var(--blue);font-size:30px}.user-dashboard p{margin:6px 0 18px;color:#5a2f24}.quick-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.quick-cards a{min-height:145px;background:rgba(255,255,255,.96);border:1px solid #e0e6ef;border-radius:14px;box-shadow:0 8px 25px rgba(8,61,107,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:#073963;font-size:22px;font-weight:800;transition:.2s}.quick-cards a:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(8,61,107,.16)}.qicon{font-size:48px;line-height:1;margin-bottom:18px}.quick-cards b{font-size:21px}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px}.metric-grid div{background:#fff7ef;border:1px solid #ead3c3;border-radius:14px;padding:16px}.metric-grid span{display:block;color:#5a2f24;font-weight:700}.metric-grid b{display:block;font-size:30px;color:#a14426;margin:8px 0}.metric-grid small{color:#6b5148}.hasil-akhir{color:#0b3b66;background:#fff3d6;border-left:6px solid #b4532f;padding:12px;border-radius:10px;text-align:center}@media(max-width:850px){.metric-grid{grid-template-columns:1fr}}

/* Perapian khusus form pengajuan SKTM */
.sktm-clean{max-width:1120px;margin:0 auto;padding:20px 24px;border-radius:12px;background:rgba(255,255,255,.98)}
.sktm-clean h1{font-size:28px;line-height:1.1;margin-bottom:4px;color:#062f58}
.sktm-clean .subtitle{font-size:13px;margin:0 0 10px;color:#333;border-bottom:1px solid #cfd5dc;padding-bottom:10px}
.sktm-clean .form-top{gap:28px;margin:8px 0 12px}
.sktm-clean label{font-size:13px;color:#082f57;font-weight:800}
.sktm-clean input,.sktm-clean select{height:36px;border:1px solid #d9e1eb;border-radius:5px;padding:0 12px;font-size:13px;background:#fff}
.sktm-clean .nomor{display:flex;align-items:center;gap:8px;margin-top:7px}
.sktm-clean .nomor input{width:165px}
.sktm-clean .nomor span{font-size:14px;color:#111;white-space:nowrap}
.sktm-clean .section-card{border:1px solid #e1d2c4;border-radius:6px;background:rgba(255,255,255,.72);padding:10px 14px 12px;margin-top:10px}
.sktm-clean .section-card legend{display:block;width:calc(100% + 28px);margin-left:-14px;margin-bottom:8px;background:#fff7ee;border-bottom:1px solid #e1d2c4;padding:8px 12px;font-size:13px;color:#111;font-weight:800}
.sktm-clean .clean-grid{display:grid;grid-template-columns:120px 12px minmax(260px,1fr);gap:8px 10px;align-items:center;max-width:900px}
.sktm-clean .clean-grid>span,.sktm-clean .clean-grid>b{font-size:13px;color:#111;font-weight:500}
.sktm-clean .clean-grid>b{text-align:center}
.sktm-clean .inline-year{display:flex;align-items:center;gap:12px}
.sktm-clean .inline-year input{width:260px}.sktm-clean .inline-year em{font-size:13px;font-style:normal;color:#111}
.sktm-clean .inline-date{display:grid;grid-template-columns:1fr 190px;gap:10px;max-width:610px}
.sktm-clean .address-line{display:flex;align-items:center;gap:10px;min-width:0}.sktm-clean .address-line span{font-size:13px;color:#111}.sktm-clean .address-line input{width:260px}.sktm-clean .address-line em{font-size:13px;color:#111;font-style:normal;white-space:nowrap}
.sktm-clean .clean-text{border:1px solid #e1d2c4;border-radius:6px;margin-top:10px;padding:13px 14px;line-height:1.8;font-size:13px;background:rgba(255,255,255,.74)}
.sktm-clean .clean-actions{display:flex;gap:12px;margin-top:12px}.sktm-clean .clean-actions button{height:40px;border-radius:6px;padding:0 18px;font-size:13px}.sktm-clean .clean-actions .reset{min-width:105px}.sktm-clean .clean-actions button[name="submit_sktm"]{background:#1976bd;min-width:140px}
@media(max-width:900px){.sktm-clean{padding:14px}.sktm-clean .clean-grid{grid-template-columns:1fr}.sktm-clean .inline-date{grid-template-columns:1fr}.sktm-clean .address-line{flex-direction:column;align-items:stretch}.sktm-clean .address-line input,.sktm-clean .inline-year input{width:100%}.sktm-clean .section-card legend{width:auto;margin-left:0}}

/* Dashboard admin rapi */
.admin-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,246,234,.94));border:1px solid rgba(162,74,37,.12);border-radius:24px;padding:28px 32px;box-shadow:0 12px 35px rgba(90,47,36,.10);margin-bottom:18px}
.admin-badge{display:inline-block;background:#fff1df;color:#a24a25;border:1px solid #efcfb9;border-radius:999px;padding:7px 14px;font-weight:800;font-size:13px;margin-bottom:10px}.admin-hero h1{margin:0;color:#083d6b;font-size:32px;line-height:1.15}.admin-hero p{margin:8px 0 0;color:#6a4a3f;max-width:720px;font-size:15px}.admin-hero-icon{width:86px;height:86px;border-radius:22px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:44px;box-shadow:0 10px 25px rgba(162,74,37,.16)}
.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:18px 0}.stat-card{background:rgba(255,255,255,.97);border:1px solid rgba(162,74,37,.10);border-radius:20px;padding:22px;text-decoration:none;color:#5a2f24;box-shadow:0 10px 28px rgba(90,47,36,.10);transition:.2s}.stat-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(90,47,36,.16)}.stat-card span{font-size:34px;display:block;margin-bottom:8px}.stat-card small{font-size:14px;color:#7a5b51;font-weight:700}.stat-card b{display:block;font-size:36px;color:#a24a25;margin-top:7px;line-height:1}
.admin-grid{display:grid;grid-template-columns:1.35fr .85fr;gap:18px;margin-bottom:18px}.admin-panel{background:rgba(255,255,255,.97);border:1px solid rgba(162,74,37,.10);border-radius:20px;padding:22px;box-shadow:0 10px 28px rgba(90,47,36,.10);overflow:hidden}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.panel-title h3{margin:0;color:#5a2f24;font-size:20px}.panel-title a{color:#a24a25;text-decoration:none;font-weight:800}.progress-box{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.progress-box div{background:#fff8ef;border:1px solid #efd8c8;border-radius:14px;padding:14px}.progress-box label{display:block;color:#79544a;font-weight:700}.progress-box strong{font-size:28px;color:#a24a25}.bar{height:13px;background:#f0dfd4;border-radius:99px;overflow:hidden;margin:18px 0 8px}.bar i{display:block;height:100%;background:linear-gradient(90deg,#a24a25,#e07a44);border-radius:99px}.muted{color:#7a5b51;margin:0}.quick-admin{display:grid;gap:12px}.quick-admin a{display:block;text-decoration:none;color:white;background:linear-gradient(135deg,#a24a25,#bf5b32);border-radius:14px;padding:15px 18px;font-weight:800;box-shadow:0 8px 20px rgba(162,74,37,.16)}
@media(max-width:1000px){.admin-stats{grid-template-columns:repeat(2,1fr)}.admin-grid{grid-template-columns:1fr}.admin-hero{align-items:flex-start}.admin-hero-icon{display:none}}@media(max-width:650px){.admin-stats{grid-template-columns:1fr}.admin-hero h1{font-size:24px}.admin-hero{padding:20px}.progress-box{grid-template-columns:1fr}}

/* ===== Login Modern - hanya mengubah tampilan halaman login ===== */
body.login-page{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  overflow:auto;
}
body.login-page:before{
  content:'';
  position:fixed;
  inset:0;
  background:linear-gradient(110deg,rgba(92,42,24,.55),rgba(255,248,237,.58) 45%,rgba(255,255,255,.84));
  z-index:-1;
}
body.login-page:after{
  content:'';
  position:fixed;
  width:520px;
  height:520px;
  right:-160px;
  top:-160px;
  border-radius:50%;
  background:rgba(162,74,37,.20);
  filter:blur(6px);
  z-index:-1;
}
.brand-login{
  position:fixed;
  top:28px;
  left:34px;
  color:#fff;
  font-size:28px;
  line-height:1.1;
  letter-spacing:.2px;
  text-shadow:0 4px 14px rgba(0,0,0,.45);
}
.brand-login:before{
  content:'⌂';
  display:inline-flex;
  width:34px;
  height:34px;
  align-items:center;
  justify-content:center;
  margin-right:8px;
  border-radius:10px;
  background:rgba(255,255,255,.20);
  backdrop-filter:blur(6px);
}
.brand-login span{
  margin-left:46px;
  margin-top:4px;
  color:#fff3e7;
  font-weight:600;
  letter-spacing:1px;
}
.login-card{
  width:min(410px,92vw);
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.70);
  border-radius:30px;
  padding:34px 36px 30px;
  text-align:center;
  box-shadow:0 24px 70px rgba(69,31,18,.34);
  backdrop-filter:blur(12px);
  animation:loginFloat .45s ease both;
}
@keyframes loginFloat{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.login-icon{
  width:70px;
  height:70px;
  margin:0 auto 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  color:#fff;
  font-size:38px;
  background:linear-gradient(135deg,#a24a25,#d77945);
  box-shadow:0 12px 24px rgba(162,74,37,.30);
}
.login-card h2{
  margin:8px 0 22px;
  color:#5a2f24;
  font-size:34px;
  font-weight:900;
  text-align:center;
}
.login-card .msg{
  margin:0 0 10px;
  color:#b13b2a;
  font-weight:700;
}
.login-card input{
  height:50px;
  border-radius:14px;
  border:1px solid #ead6c7;
  background:#fff;
  margin:8px 0;
  padding:0 16px;
  font-size:15px;
  transition:.2s;
}
.login-card input:focus{
  outline:none;
  border-color:#b95a31;
  box-shadow:0 0 0 4px rgba(185,90,49,.13);
}
.login-card button{
  min-width:155px;
  border-radius:16px;
  margin-top:12px;
  padding:13px 22px;
  background:linear-gradient(135deg,#a94b28,#cf6d3c);
  box-shadow:0 10px 22px rgba(169,75,40,.30);
  transition:.2s;
}
.login-card button:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(169,75,40,.38);
}
.center-link{
  margin:16px 0 8px;
}
.center-link a{
  color:#7d351f;
  font-weight:900;
  text-decoration:none;
}
.center-link a:hover{text-decoration:underline}
.login-card small{
  color:#745245;
  line-height:1.6;
}
.register-card{
  width:min(560px,94vw);
}
.register-card h2{
  font-size:30px;
}
.register-card .reg-grid{
  grid-template-columns:1fr 1fr;
  gap:10px 12px;
}
.register-card .reg-grid button{
  grid-column:1/-1;
  justify-self:center;
}
@media(max-width:700px){
  body.login-page{padding:22px 14px;align-items:flex-start;padding-top:110px}
  .brand-login{position:absolute;left:20px;top:22px;font-size:24px}
  .brand-login span{margin-left:42px}
  .login-card,.register-card{width:100%;padding:28px 22px;border-radius:24px}
  .register-card .reg-grid{grid-template-columns:1fr}
}

/* Register form sesuai contoh: kolom vertikal besar */
.register-card{width:min(540px,94vw);text-align:left}
.register-card .login-icon,.register-card h2,.register-card .msg,.register-card .center-link{text-align:center}
.register-card .daftar-vertical{display:block}
.register-card .daftar-vertical label{display:block;margin:16px 0 8px;color:#123455;font-size:18px;font-weight:900}
.register-card .daftar-vertical input{width:100%;height:54px;margin:8px 0 0;border-radius:10px;background:#fff;border:1px solid #e4eaf2;font-size:16px}
.register-card .daftar-vertical button{display:block;margin:18px auto 0;min-width:150px}
@media(max-width:700px){.register-card .daftar-vertical label{font-size:16px}.register-card .daftar-vertical input{height:50px}}

/* Register dibuat sama ukuran dengan login */
.register-card{width:min(430px,92vw)!important;max-width:430px!important;text-align:center!important;padding:30px 34px!important;border-radius:26px!important;}
.register-card h2{font-size:30px!important;margin:14px 0 18px!important;}
.register-card .daftar-vertical{display:block!important;}
.register-card .daftar-vertical label{display:block!important;text-align:left!important;margin:10px 0 5px!important;color:#123455!important;font-size:15px!important;font-weight:800!important;}
.register-card .daftar-vertical input{height:46px!important;margin:5px 0 0!important;border-radius:9px!important;font-size:15px!important;}
.register-card .daftar-vertical button{margin:14px auto 0!important;min-width:135px!important;padding:11px 18px!important;}
.register-card .center-link{margin-top:12px!important;}
@media(max-width:700px){.register-card{width:92vw!important;padding:26px 22px!important}.register-card .daftar-vertical input{height:44px!important}}

/* ===== Profil modern seperti contoh, tidak mengubah halaman lain ===== */
.profile-page{max-width:1120px;margin:0 auto}.profile-title-row{display:flex;align-items:center;justify-content:space-between;margin:8px 0 18px}.profile-title-row h2{font-size:28px;color:#5a2f24;margin:0}.profile-title-row p{margin:5px 0 0;color:#6f625d}.profile-edit-btn{background:#fff;color:#5a2f24;border:1px solid #e6ddd6;border-radius:10px;padding:11px 16px;text-decoration:none;font-weight:800;box-shadow:0 6px 18px rgba(90,47,36,.08)}.profile-card-modern{background:rgba(255,255,255,.96);border-radius:16px;box-shadow:0 8px 25px rgba(90,47,36,.10);padding:26px;display:grid;grid-template-columns:1.5fr 1fr;gap:24px;margin-bottom:18px}.profile-left{display:flex;gap:28px;align-items:center;border-right:1px solid #eee;padding-right:25px}.avatar-big{width:130px;height:130px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#9c421f,#d77945);color:#fff;font-size:45px;font-weight:900;box-shadow:0 14px 30px rgba(156,66,31,.28)}.profile-main-info h2{margin:0 0 8px;color:#111;font-size:24px}.role-badge{display:inline-block;background:#e9f3ff;color:#1473c8;border-radius:9px;padding:6px 10px;font-weight:800;font-size:12px;margin-bottom:12px}.profile-main-info p{margin:10px 0;color:#4d403b}.profile-main-info b{display:inline-block;min-width:85px;color:#5e6b79}.profile-right{padding:8px 0}.profile-right p{margin:0 0 18px;display:grid;grid-template-columns:1fr;gap:5px;color:#4d403b}.profile-right b{color:#5e6b79}.profile-right span{font-weight:800;color:#5a2f24}.profile-right .aktif{display:inline-block;background:#d7f7df;color:#15933d;border-radius:20px;padding:4px 10px;width:max-content}.settings-card{background:rgba(255,255,255,.96);border-radius:16px;box-shadow:0 8px 25px rgba(90,47,36,.10);padding:18px 22px}.settings-card h3{margin:0 0 12px;color:#5a2f24}.setting-item{display:flex;align-items:center;gap:14px;border:1px solid #eee;border-radius:12px;padding:14px 16px;margin:10px 0;background:#fff}.setting-item summary{display:flex;align-items:center;gap:14px;cursor:pointer;width:100%;list-style:none}.setting-item summary::-webkit-details-marker{display:none}.setting-item div{flex:1}.setting-item b{display:block;color:#2d2522}.setting-item small{display:block;color:#7e716c;margin-top:3px}.setting-item em{font-size:28px;color:#7b6c66;font-style:normal}.set-ico{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center}.blue{background:#eaf4ff}.green{background:#e8faee}.orange{background:#fff1e6}.purple{background:#f4eaff}.gray{background:#f1f3f5}.switch input{display:none}.switch i{display:block;width:44px;height:24px;background:#dfe5ea;border-radius:30px;position:relative}.switch i:before{content:'';position:absolute;width:18px;height:18px;background:#fff;border-radius:50%;top:3px;left:3px;transition:.2s;box-shadow:0 2px 5px #0002}.switch input:checked+i{background:#91df9e}.switch input:checked+i:before{left:23px}.inline-form{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;margin-top:12px;width:100%}.inline-form button,.edit-profile-form button{background:#a24a25}.edit-profile-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.edit-profile-form label{color:#123455}.edit-profile-form button{grid-column:1/-1;width:max-content;padding:12px 22px}@media(max-width:900px){.profile-card-modern{grid-template-columns:1fr}.profile-left{border-right:0;border-bottom:1px solid #eee;padding-right:0;padding-bottom:20px}.profile-title-row{align-items:flex-start;gap:12px;flex-direction:column}.inline-form,.edit-profile-form{grid-template-columns:1fr}.avatar-big{width:105px;height:105px;font-size:36px}}


/* ===== Perbaikan data warga, aksi pengajuan, dan responsif HP/Laptop ===== */
.data-tabs{display:grid;gap:18px;margin-top:12px}.data-tabs .form-card{overflow:hidden}.data-tabs h3{margin:0 0 6px;color:#083d6b;font-size:22px}.aksi-wrap{display:flex;flex-wrap:wrap;gap:6px;min-width:420px}.aksi-wrap .btn{white-space:nowrap}.alert{background:#fff3cd;border-left:5px solid #a24a25;border-radius:12px;padding:12px 16px;margin-bottom:14px;font-weight:700;color:#5a2f24}
@media(max-width:900px){
  body:not(.login-page){display:block;background-attachment:scroll}aside{position:relative;width:100%;min-height:auto;padding:16px;display:block}aside h2{margin:0 0 10px;font-size:18px}aside a{display:inline-flex;margin:4px;padding:10px 12px;font-size:13px;border-radius:10px}main{margin-left:0;width:100%;padding:12px}header{height:auto;min-height:58px;padding:14px 16px;gap:10px;align-items:flex-start;flex-direction:column}.hero h1,.form-card h1,.paper-form h1,.user-dashboard h1{font-size:24px}.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-wrap table{min-width:720px}th,td{padding:10px;font-size:12px}.aksi-wrap{min-width:360px}.btn{padding:8px 10px;font-size:12px}.quick-cards{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.two,.grid6{grid-template-columns:1fr!important}.actions{flex-wrap:wrap}.surat-grid{grid-template-columns:1fr!important}.nomor{flex-wrap:wrap}.nomor input{width:100%}.data-tabs{gap:14px}
}
@media(min-width:901px) and (max-width:1200px){main{padding:18px}.cards{grid-template-columns:repeat(2,1fr)}.grid6{grid-template-columns:repeat(3,1fr)}.table-wrap{overflow-x:auto}.aksi-wrap{min-width:390px}}

/* Submenu Data Warga admin */
.submenu-admin{margin:-8px 0 10px 28px;display:flex;flex-direction:column;gap:6px}
.submenu-admin a{padding:9px 12px;border-radius:12px;font-size:13px;background:rgba(255,255,255,.08);color:#fff;text-decoration:none}
.submenu-admin a.on,.submenu-admin a:hover{background:rgba(255,255,255,.22)}
.data-subnav{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}
.data-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:900px){.data-tabs{grid-template-columns:1fr}.submenu-admin{margin-left:14px}}
.badge-info{display:inline-block;padding:9px 12px;border-radius:10px;background:#f7eadf;color:#8b3d1f;font-weight:700;font-size:13px;white-space:nowrap}

/* ===== Perbaikan kolom Aksi status pengajuan ===== */
th.col-aksi, td.col-aksi{
  text-align:center!important;
  vertical-align:middle!important;
}
.aksi-center{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:nowrap;
  white-space:nowrap;
}
.aksi-center .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
}


/* Perapihan final kolom Aksi */
table th:last-child, table td:last-child, th.col-aksi, td.col-aksi{
  text-align:center!important;
  vertical-align:middle!important;
}
.aksi-center{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  flex-wrap:nowrap!important;
  white-space:nowrap!important;
}
.aksi-center::before,.aksi-center::after{content:none!important;display:none!important;}
.aksi-center .btn{margin:0!important;line-height:1.2!important;}

/* ===== Perbaikan akhir dashboard admin ===== */
.dashboard-top{margin-bottom:20px}
.dashboard-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0 0 20px}
.dashboard-stats .stat-card{min-height:150px;display:flex;flex-direction:column;justify-content:center}
.dashboard-summary,.dashboard-table{margin-bottom:20px}
.dashboard-summary{max-width:100%;padding:24px}
.progress-box.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.progress-box.four div{min-height:86px;display:flex;flex-direction:column;justify-content:center}
.dashboard-table{padding:24px}
.dashboard-table .table-wrap{margin-top:10px;border-radius:14px;background:white}
.dashboard-table table th,.dashboard-table table td{padding:14px 16px}
@media(max-width:1000px){.dashboard-stats,.progress-box.four{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.dashboard-stats,.progress-box.four{grid-template-columns:1fr}.dashboard-stats .stat-card{min-height:auto}}

/* ===== Fitur Notifikasi ===== */
.notif-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;background:#fff;color:#7d351c;text-decoration:none;box-shadow:0 6px 18px rgba(90,47,36,.12);font-size:20px;margin-left:10px}
.notif-bell em{position:absolute;right:-6px;top:-6px;min-width:21px;height:21px;padding:0 5px;border-radius:20px;background:#c0392b;color:white;font-size:12px;font-style:normal;font-weight:900;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
.notif-actions{margin-bottom:12px;display:flex;gap:10px;flex-wrap:wrap}.notif-list{display:grid;gap:12px}.notif-item{display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(255,255,255,.96);border-radius:15px;padding:16px 18px;box-shadow:0 8px 22px rgba(90,47,36,.08);border-left:5px solid #d9c7bc}.notif-item.unread{border-left-color:#a24a25;background:#fff8f4}.notif-item b{display:block;color:#5a2f24;margin-bottom:4px}.notif-item small{display:block;color:#8d7a72;font-size:12px;margin-bottom:8px}.notif-item p{margin:0;color:#4d403b;line-height:1.45}.notif-btns{display:flex;gap:8px;flex-shrink:0}@media(max-width:700px){.notif-item{align-items:flex-start;flex-direction:column}.notif-btns{width:100%}.notif-btns .btn{flex:1;text-align:center}.notif-bell{margin-left:0}header .notif-bell{align-self:flex-end;margin-top:-42px}}


/* Revisi header: nama admin dipindahkan ke kanan dekat notifikasi */
.header-title{display:flex;flex-direction:column;gap:3px;line-height:1.1}.header-title small{font-size:13px;color:#8a6a5d;font-weight:700}.topbar-right{display:flex;align-items:center;gap:12px}.user-badge{height:42px;display:flex;align-items:center;gap:9px;padding:0 14px;border-radius:14px;background:#fff7f1;color:#5a2f24;border:1px solid rgba(162,74,37,.16);box-shadow:0 6px 18px rgba(90,47,36,.08)}.user-badge span{font-size:18px}.user-badge b{font-size:14px;white-space:nowrap}@media(max-width:700px){header{align-items:stretch}.topbar-right{justify-content:flex-end;width:100%}.user-badge{height:38px;padding:0 11px}.user-badge b{font-size:13px}.header-title small{font-size:12px}}

/* Pencarian tabel Data Warga */
.table-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0 10px;flex-wrap:wrap;}
.table-tools .btn{white-space:nowrap;padding:10px 16px;border-radius:10px;font-weight:700;}
.table-tools input{width:280px;max-width:100%;height:42px;border:1px solid #ead6c7;border-radius:12px;padding:0 14px;font-size:14px;background:#fff;color:#4d2a1f;margin-left:auto;}
.table-tools input:focus{outline:none;border-color:#a24a25;box-shadow:0 0 0 3px rgba(162,74,37,.12);}
.nb-plain{line-height:1.85;font-size:14px;color:#4d2a1f;}
.nb-plain p{margin:0 0 8px;}
.nb-plain strong{display:block;margin:18px 0 6px;color:#7b3f2f;font-size:15px;}

/* ===== Dashboard Admin Naive Bayes sesuai contoh ===== */
.nb-hero{background:rgba(255,255,255,.92);border:1px solid rgba(226,212,199,.75);box-shadow:0 12px 30px rgba(90,47,36,.10);margin-bottom:18px}
.nb-hero h1{font-size:30px;color:#083d6b;margin:0 0 6px;font-weight:900}.nb-hero p{margin:0;color:#7a5b4c}.nb-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:18px}.nb-stat{min-height:138px;background:rgba(255,255,255,.97)!important;border:1px solid #eadfd7;border-radius:18px;box-shadow:0 12px 30px rgba(90,47,36,.10);transition:.2s}.nb-stat:hover{transform:translateY(-2px)}.nb-stat span{font-size:34px}.nb-stat small{font-size:15px;color:#6b4c40;font-weight:900}.nb-stat b{font-size:34px;color:#a24a25}.nb-stat em{display:block;margin-top:2px;font-style:normal;color:#8b7469;font-size:12px}.nb-dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}.nb-dashboard-grid.three{grid-template-columns:1fr 1.2fr 1fr}.nb-table-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.nb-panel{background:rgba(255,255,255,.97);border:1px solid #eadfd7;border-radius:18px;box-shadow:0 12px 30px rgba(90,47,36,.10);padding:22px}.panel-title h3{margin:0;color:#4c2b20;font-size:18px}.info-list p{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;margin:0;padding:11px 0;border-bottom:1px solid #eee6df}.info-list p:last-child{border-bottom:0}.info-list span{font-size:19px}.info-list b{color:#3d2c26;font-size:14px}.info-list strong{color:#071f3d;font-size:14px}.status-on{background:#dff7e7;color:#16833b;padding:6px 10px;border-radius:8px}.eval-row{margin:14px 0}.eval-row label{font-weight:900;color:#3d2c26}.eval-row b{float:right;color:#071f3d}.eval-row div{clear:both;height:8px;border-radius:30px;background:#e9edf2;margin-top:8px;overflow:hidden}.eval-row i{display:block;height:100%;border-radius:30px;background:linear-gradient(90deg,#1d6ee8,#6b3bd1)}.eval-note{margin-top:18px;background:#eef6ff;border:1px solid #bfdcff;color:#244d75;border-radius:10px;padding:12px 14px}.donut{width:156px;height:156px;border-radius:50%;margin:14px auto;background:conic-gradient(#20b84a calc(var(--p)*1%), #f04444 0);display:grid;place-items:center;position:relative}.donut:before{content:'';position:absolute;width:76px;height:76px;background:white;border-radius:50%}.donut span{position:relative;font-weight:900;color:#0c3b22;font-size:20px}.legend-line{display:flex;align-items:center;gap:8px;margin:10px 0;color:#4b2b20}.legend-line b{margin-left:auto;color:#071f3d}.legend-line i{width:12px;height:12px;border-radius:3px;display:inline-block}.legend-line i.green{background:#20b84a}.legend-line i.red{background:#f04444}.legend-line i.orange{background:#ff8a00}.cmatrix{border-collapse:separate;border-spacing:0;width:100%;overflow:hidden;border-radius:12px;border:1px solid #e3e8ef}.cmatrix th{background:#f6f8fb!important;color:#071f3d!important;text-align:center}.cmatrix td{text-align:center;font-size:24px;font-weight:900}.okcell{background:#dff7e7;color:#10803b}.badcell{background:#ffe1e1;color:#d81818}.center{text-align:center}.mini-chart{height:190px;border-left:1px solid #dbe2ea;border-bottom:1px solid #dbe2ea;margin:12px 4px 10px;background:linear-gradient(180deg,transparent 24%,#f1f3f5 25%,transparent 26%,transparent 49%,#f1f3f5 50%,transparent 51%,transparent 74%,#f1f3f5 75%,transparent 76%)}.mini-chart svg{width:100%;height:100%}.mini-chart polyline{fill:none;stroke:#20b84a;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}.mini-chart polyline+polyline{stroke:#ff8a00}.dashboard-table .table-wrap{box-shadow:none;padding:0;background:transparent;border-radius:12px}.dashboard-table th{background:#f4f6f9!important;color:#33241f!important}.dashboard-table td{font-size:13px}.muted{color:#79675d}
@media(max-width:1100px){.nb-dashboard-grid,.nb-dashboard-grid.three,.nb-table-grid{grid-template-columns:1fr}.nb-stat-grid{grid-template-columns:1fr}}

/* Revisi dashboard dataset dan evaluasi model */
.nb-stat-grid.five{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}
.nb-stat-grid.five .nb-stat{min-height:118px!important;padding:22px 18px!important}
.nb-stat-grid.five .nb-stat span{font-size:28px!important}
.nb-stat-grid.five .nb-stat b{font-size:30px!important}
.nb-dashboard-grid.eval3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;margin-bottom:18px;align-items:stretch}
.class-report-panel{overflow:hidden}
.class-report{width:100%;border-collapse:separate;border-spacing:0;border:1px solid #eadfd7;border-radius:12px;overflow:hidden;margin-top:14px;background:white}
.class-report th{background:#fbf6f2!important;color:#3d2c26!important;font-weight:900;text-align:center;padding:11px 8px;border-bottom:1px solid #eadfd7;font-size:13px}
.class-report td{padding:12px 8px;border-bottom:1px solid #eadfd7;text-align:center;color:#3d2c26;font-size:13px}
.class-report tr:last-child td{border-bottom:0}
.class-report td:first-child{background:#a64b22!important;color:#fff!important;font-weight:900;text-align:left;padding-left:12px;white-space:nowrap}
.class-report th:first-child{background:#a64b22!important;color:#fff!important}
.cmatrix .badcell{background:#e9f4fc!important;color:#1f2730!important}
.cmatrix .okcell{background:#0f3d78!important;color:#fff!important}
.cmatrix td{height:76px}
.mini-chart.overfit-like{height:220px;background:repeating-linear-gradient(to bottom, transparent 0, transparent 42px, #e4e7eb 43px, transparent 44px),repeating-linear-gradient(to right, transparent 0, transparent 58px, #e4e7eb 59px, transparent 60px);border:1px solid #cfd6de;border-radius:8px;padding:8px}
.mini-chart.overfit-like polyline{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.mini-chart.overfit-like .train-line{stroke:red!important}
.mini-chart.overfit-like .test-line{stroke:green!important}
.overfit-panel .legend-line i.red{background:red!important;border-radius:50%}
.overfit-panel .legend-line i.green{background:green!important;border-radius:50%}
@media(max-width:1250px){.nb-stat-grid.five{grid-template-columns:repeat(2,minmax(0,1fr))!important}.nb-dashboard-grid.eval3{grid-template-columns:1fr!important}}
@media(max-width:700px){.nb-stat-grid.five{grid-template-columns:1fr!important}}


/* Revisi final: warna confusion matrix hijau/merah dan tabel laporan seperti classification_report */
.cmatrix .okcell{background:#d8f3dc!important;color:#0b8f3a!important;font-weight:900!important}
.cmatrix .badcell{background:#fde2e2!important;color:#d71920!important;font-weight:900!important}
.class-report th:first-child{background:#a64b22!important;color:#fff!important;text-align:center!important}
.class-report td:first-child{background:#fff!important;color:#3d2c26!important;font-weight:700!important;text-align:left!important;padding-left:12px!important}
.class-report tr.accuracy-row td{background:#fff!important;color:#3d2c26!important;font-weight:700!important}


/* Revisi permintaan: tabel laporan klasifikasi dan persentase donut */
.class-report td:first-child{
  background:#a64b22!important;
  color:#fff!important;
  font-weight:900!important;
  text-align:center!important;
  padding-left:8px!important;
  vertical-align:middle!important;
}
.class-report tr.accuracy-row td{
  background:#fff!important;
  color:#3d2c26!important;
  font-weight:700!important;
}
.class-report tr.accuracy-row td:first-child{
  background:#fff!important;
  color:#3d2c26!important;
  text-align:center!important;
}
.class-report tr.accuracy-row td.accuracy-value{
  text-align:left!important;
  padding-left:28px!important;
  color:#3d2c26!important;
  font-weight:900!important;
}
.class-report th,.class-report td{
  vertical-align:middle!important;
}
.donut.donut-split{
  width:156px;
  height:156px;
  border-radius:50%;
  margin:14px auto;
  background:conic-gradient(#20b84a calc(var(--p)*1%), #f04444 0);
  display:block;
  position:relative;
}
.donut.donut-split:before{
  content:'';
  position:absolute;
  width:76px;
  height:76px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:white;
  border-radius:50%;
  z-index:1;
}
.donut.donut-split .donut-center{
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  font-weight:900;
  color:#3d2c26;
  font-size:14px;
  line-height:1.25;
  text-align:center;
  white-space:nowrap;
}
.donut.donut-split .pct{
  position:absolute;
  z-index:3;
  width:46px;
  height:46px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff!important;
  font-size:17px;
  font-weight:900;
  border:2px solid rgba(255,255,255,.95);
  box-shadow:0 3px 8px rgba(0,0,0,.12);
}
.donut.donut-split .pct-layak{
  right:8px;
  top:50px;
  background:#20b84a;
}
.donut.donut-split .pct-tidak{
  left:6px;
  top:72px;
  background:#f04444;
}


/* Revisi 260626: sidebar, akurasi laporan, dan persentase donut */
.class-report tr.accuracy-row td{
  background:#fbf6f2!important;
  color:#3d2c26!important;
  font-weight:700!important;
  text-align:center!important;
}
.class-report tr.accuracy-row td:first-child{
  background:#fbf6f2!important;
  color:#3d2c26!important;
  text-align:center!important;
  font-weight:900!important;
}
.class-report tr.accuracy-row td.accuracy-value{
  background:#fbf6f2!important;
  color:#3d2c26!important;
  text-align:center!important;
  padding-left:0!important;
  font-weight:900!important;
}
.donut.donut-split .pct{
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  border-radius:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  color:#fff!important;
  text-shadow:0 1px 3px rgba(0,0,0,.35);
}
.donut.donut-split .pct-layak{right:18px!important;top:62px!important;background:transparent!important;}
.donut.donut-split .pct-tidak{left:16px!important;top:80px!important;background:transparent!important;}

/* Revisi terbaru: angka persentase donut warna hitam dan tetap di dalam garis donut */
.donut.donut-split .pct{
  color:#000!important;
  text-shadow:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  font-size:17px!important;
  font-weight:900!important;
  line-height:1!important;
  z-index:4!important;
}
.donut.donut-split .pct-layak{
  right:24px!important;
  top:42px!important;
}
.donut.donut-split .pct-tidak{
  left:24px!important;
  top:98px!important;
}


/* Revisi final distribusi kelas: tampilan seperti contoh */
.class-dist{
  min-height:260px!important;
  padding:18px 20px!important;
}
.class-dist .panel-title h3{
  color:#253044!important;
  font-size:17px!important;
  font-weight:900!important;
  margin-bottom:12px!important;
}
.class-dist .dist-body{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:28px!important;
}
.class-dist .donut.donut-split{
  width:155px!important;
  height:155px!important;
  margin:4px 0 0 0!important;
  flex:0 0 155px!important;
  background:conic-gradient(#20b84a calc(var(--p)*1%), #f04444 0)!important;
}
.class-dist .donut.donut-split:before{
  width:72px!important;
  height:72px!important;
  background:#fff!important;
  z-index:1!important;
}
.class-dist .donut.donut-split .donut-center{display:none!important;}
.class-dist .donut.donut-split .pct{
  position:absolute!important;
  z-index:4!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  border-radius:0!important;
  color:#fff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.35)!important;
  font-size:17px!important;
  font-weight:900!important;
  line-height:1!important;
}
.class-dist .donut.donut-split .pct-layak{
  right:21px!important;
  top:73px!important;
}
.class-dist .donut.donut-split .pct-tidak{
  left:16px!important;
  top:75px!important;
}
.class-dist .dist-legend{
  display:flex!important;
  flex-direction:column!important;
  gap:22px!important;
  min-width:135px!important;
}
.class-dist .dist-item{
  display:flex!important;
  align-items:flex-start!important;
  gap:10px!important;
  color:#253044!important;
}
.class-dist .dist-item i{
  width:12px!important;
  height:12px!important;
  border-radius:3px!important;
  display:inline-block!important;
  margin-top:4px!important;
  flex:0 0 12px!important;
}
.class-dist .dist-item i.green{background:#20b84a!important;}
.class-dist .dist-item i.red{background:#f04444!important;}
.class-dist .dist-item b{
  display:block!important;
  color:#2f211c!important;
  font-size:15px!important;
  font-weight:900!important;
  margin-bottom:8px!important;
}
.class-dist .dist-item span{
  display:block!important;
  color:#071f3d!important;
  font-size:14px!important;
  font-weight:500!important;
  white-space:nowrap!important;
}
.class-dist .dist-total{
  margin-top:14px!important;
  color:#071f3d!important;
  font-size:13px!important;
  font-weight:500!important;
}
@media(max-width:900px){
  .class-dist .dist-body{gap:18px!important;}
  .class-dist .donut.donut-split{width:135px!important;height:135px!important;flex-basis:135px!important;}
  .class-dist .donut.donut-split:before{width:64px!important;height:64px!important;}
  .class-dist .donut.donut-split .pct-layak{right:17px!important;top:62px!important;}
  .class-dist .donut.donut-split .pct-tidak{left:14px!important;top:64px!important;}
}

/* Revisi 260626 lanjutan: persen donut kecil dan tepat di tengah warna, panel bisa dibuka */
.class-dist .donut.donut-split .pct{
  position:absolute!important;
  z-index:4!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  border-radius:0!important;
  color:#fff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.35)!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  transform:translate(-50%,-50%)!important;
  white-space:nowrap!important;
}
.class-dist .donut.donut-split .pct-layak{
  left:var(--layak-x)!important;
  top:var(--layak-y)!important;
  right:auto!important;
}
.class-dist .donut.donut-split .pct-tidak{
  left:var(--tidak-x)!important;
  top:var(--tidak-y)!important;
  right:auto!important;
}
.clickable-panel{cursor:pointer;transition:.2s}
.clickable-panel:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(90,47,36,.14)}
.panel-title.with-link{display:flex;align-items:center;justify-content:space-between;gap:10px}
.panel-title.with-link a{font-size:12px;font-weight:900;color:#a64b22;text-decoration:none;background:#fbf6f2;border:1px solid #eadfd7;border-radius:8px;padding:7px 9px;white-space:nowrap}
.panel-title.with-link a:hover{background:#a64b22;color:#fff}
.detail-page{max-width:1120px;margin:0 auto 20px}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.page-head h1{font-size:26px!important;color:#4c2b20!important}
.calc-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:16px 0 20px}
.calc-steps div{background:#fbf6f2;border:1px solid #eadfd7;border-radius:14px;padding:14px 16px;color:#3d2c26}
.calc-steps b{display:block;margin-bottom:6px;color:#a64b22}
.calc-steps p{margin:0;line-height:1.5;font-size:14px}
.report-opened{margin-top:12px!important}
.eval-opened{background:#fff;border:1px solid #eadfd7;border-radius:14px;padding:18px;margin-top:12px}
@media(max-width:900px){.page-head{flex-direction:column}.calc-steps{grid-template-columns:1fr}.panel-title.with-link{align-items:flex-start;flex-direction:column}.class-dist .donut.donut-split .pct{font-size:11px!important}}

/* Revisi final: persen donut hitam tepat di tengah tiap potongan, tanpa tulisan Buka proses */
.class-dist .donut.donut-split .pct{
  color:#000!important;
  text-shadow:none!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1!important;
  transform:translate(-50%,-50%)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
}
.class-dist .donut.donut-split .pct-layak{
  left:var(--layak-x)!important;
  top:var(--layak-y)!important;
  right:auto!important;
}
.class-dist .donut.donut-split .pct-tidak{
  left:var(--tidak-x)!important;
  top:var(--tidak-y)!important;
  right:auto!important;
}
.panel-title.with-link a{display:none!important;}
.calc-steps.calc-steps-detail{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
.calc-steps.calc-steps-detail div{min-height:112px!important;}
.calc-steps.calc-steps-detail p{font-size:13px!important;}
@media(max-width:900px){
  .class-dist .donut.donut-split .pct{font-size:10px!important;}
  .calc-steps.calc-steps-detail{grid-template-columns:1fr!important;}
}

/* Revisi final lanjutan 260626: persen donut hitam, kecil, dan berada di tengah area warna */
.class-dist .donut.donut-split .pct{
  color:#000!important;
  text-shadow:none!important;
  font-size:10px!important;
  font-weight:900!important;
  line-height:1!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  width:auto!important;
  height:auto!important;
  transform:translate(-50%,-50%)!important;
  z-index:5!important;
  pointer-events:none!important;
}
.class-dist .donut.donut-split .pct-layak{
  left:var(--layak-x)!important;
  top:var(--layak-y)!important;
  right:auto!important;
}
.class-dist .donut.donut-split .pct-tidak{
  left:var(--tidak-x)!important;
  top:var(--tidak-y)!important;
  right:auto!important;
}

/* Halaman proses dibuka hanya menampilkan rumus/perhitungan, bukan hasil akhir tabel/diagram */
.calc-only-page .formula-box{
  background:#fff7f1;
  border:1px solid #eadfd7;
  border-left:5px solid #a64b22;
  border-radius:14px;
  padding:16px 18px;
  margin:12px 0 18px;
  color:#3d2c26;
}
.calc-only-page .formula-box h3{
  margin:0 0 8px;
  color:#a64b22;
  font-size:17px;
}
.calc-only-page .formula-box p{margin:0;line-height:1.6;font-size:14px;}
.calc-only-page .calc-steps.calc-steps-detail{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
}
.calc-only-page .calc-steps.calc-steps-detail div{
  background:#fbf6f2!important;
  border:1px solid #eadfd7!important;
  border-radius:16px!important;
  padding:16px 18px!important;
  min-height:138px!important;
  box-shadow:0 8px 18px rgba(90,47,36,.06)!important;
}
.calc-only-page .calc-steps.calc-steps-detail b{
  color:#a64b22!important;
  font-size:15px!important;
  margin-bottom:8px!important;
}
.calc-only-page .calc-steps.calc-steps-detail p{
  font-size:13px!important;
  line-height:1.65!important;
  color:#3d2c26!important;
}
.calc-only-page .calc-steps.calc-steps-detail strong{color:#4c2b20!important;font-weight:900!important;}
.eval-calc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
@media(max-width:900px){
  .calc-only-page .calc-steps.calc-steps-detail,
  .eval-calc-grid{grid-template-columns:1fr!important;}
  .class-dist .donut.donut-split .pct{font-size:9px!important;}
}


/* Revisi tampilan halaman proses perhitungan */
.detail-page .page-head{
  align-items:center!important;
  margin-bottom:20px!important;
}
.detail-page .page-head h1{
  font-size:34px!important;
  line-height:1.15!important;
  font-weight:900!important;
  color:#4c2b20!important;
  margin:0!important;
}
.detail-page .page-head .muted,
.calc-only-page .page-head .muted{
  display:none!important;
}
.btn-kembali-dashboard,
.detail-page .page-head .btn{
  white-space:nowrap!important;
  min-width:160px!important;
  text-align:center!important;
  padding:13px 18px!important;
  line-height:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:9px!important;
}
.calc-only-page .formula-box{
  margin-top:8px!important;
  padding:20px 22px!important;
}
.calc-only-page .formula-box h3{
  font-size:20px!important;
  font-weight:900!important;
}
.calc-only-page .formula-box p{
  font-size:15px!important;
}
.calc-only-page .calc-steps.calc-steps-detail div{
  padding:18px 20px!important;
}
.calc-only-page .calc-steps.calc-steps-detail b{
  font-size:17px!important;
}
.calc-only-page .calc-steps.calc-steps-detail p{
  font-size:14px!important;
}
@media(max-width:900px){
  .detail-page .page-head h1{font-size:26px!important;}
  .btn-kembali-dashboard,.detail-page .page-head .btn{min-width:150px!important;}
}

/* Revisi data warga & sosial: tombol lihat semua di pojok kiri bawah */
.lihat-semua-wrap{
  display:flex;
  justify-content:flex-start;
  margin-top:14px;
}
.lihat-semua-wrap .btn{
  white-space:nowrap;
  padding:10px 16px;
  border-radius:10px;
  font-weight:700;
}

/* Revisi final data warga & data sosial */
.data-master-card .table-scroll{
  width:100%;
  overflow-x:auto;
}
.data-master-card table{
  min-width:1100px;
}
.data-master-card .lihat-semua-wrap{
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center;
  margin-top:14px!important;
}
.data-master-card .lihat-semua-wrap .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  padding:10px 16px!important;
  border-radius:10px!important;
  font-weight:700!important;
}