:root{--hijau-900: #072f24;--hijau-800: #0b4433;--hijau-700: #0d5c46;--hijau-600: #12795c;--hijau-500: #17a077;--hijau-100: #e2f4ec;--emas: #c9a227;--emas-lembut: #f7efd7;--krem: #f8f6f1;--putih: #ffffff;--teks: #16241f;--teks-lembut: #5c6b64;--garis: #e3e6e0;--merah: #b3261e;--merah-lembut: #fdeceb;--radius: 16px;--bayang: 0 8px 24px rgba(9, 46, 35, .08);--bayang-lembut: 0 2px 8px rgba(9, 46, 35, .06)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--krem);color:var(--teks);font-family:Segoe UI,system-ui,-apple-system,Helvetica Neue,Arial,sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}h1,h2,h3,h4{margin:0;line-height:1.25;font-weight:700;letter-spacing:-.01em}p{margin:0}button{font-family:inherit;font-size:inherit;cursor:pointer}input,select,textarea{font-family:inherit;font-size:15px;color:var(--teks)}.arab{font-family:Traditional Arabic,Amiri,Scheherazade New,Times New Roman,serif;direction:rtl;line-height:1.9}.aplikasi{min-height:100vh;display:flex;flex-direction:column}.header{background:linear-gradient(135deg,var(--hijau-900),var(--hijau-700) 70%,var(--hijau-600));color:#fff;padding:14px 0 0;box-shadow:var(--bayang);position:sticky;top:0;z-index:30}.header-isi{max-width:1120px;margin:0 auto;padding:0 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.merek{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.logo{width:40px;height:40px;border-radius:12px;background:#ffffff1f;border:1px solid rgba(255,255,255,.25);display:grid;place-items:center;font-size:20px;color:var(--emas-lembut);flex:0 0 auto}.merek-teks strong{display:block;font-size:16px;letter-spacing:.01em}.merek-teks span{display:block;font-size:11.5px;color:#ffffffb8;letter-spacing:.06em;text-transform:uppercase}.nav{display:flex;gap:4px;overflow-x:auto;padding:12px 16px 0;max-width:1120px;margin:0 auto;width:100%;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}.nav button{background:transparent;border:none;color:#ffffffc7;padding:10px 14px;border-radius:10px 10px 0 0;white-space:nowrap;font-weight:600;font-size:13.5px;border-bottom:3px solid transparent}.nav button:hover{color:#fff;background:#ffffff14}.nav button.aktif{color:#fff;background:#ffffff24;border-bottom-color:var(--emas)}.utama{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:20px 16px 64px}.judul-halaman{margin-bottom:16px}.judul-halaman h1{font-size:22px}.judul-halaman p{color:var(--teks-lembut);font-size:13.5px;margin-top:4px}.kartu{background:var(--putih);border:1px solid var(--garis);border-radius:var(--radius);box-shadow:var(--bayang-lembut);padding:16px}.kartu+.kartu{margin-top:12px}.kisi{display:grid;gap:12px}.kisi.k2{grid-template-columns:repeat(2,minmax(0,1fr))}.kisi.k3{grid-template-columns:repeat(3,minmax(0,1fr))}.kisi.k4{grid-template-columns:repeat(4,minmax(0,1fr))}.stat{background:var(--putih);border:1px solid var(--garis);border-radius:var(--radius);padding:14px;box-shadow:var(--bayang-lembut)}.stat .label{font-size:12px;color:var(--teks-lembut);text-transform:uppercase;letter-spacing:.05em;font-weight:600}.stat .nilai{font-size:26px;font-weight:800;color:var(--hijau-700);margin-top:4px;line-height:1.1}.stat .kecil{font-size:12px;color:var(--teks-lembut);margin-top:2px}.tombol{border:1px solid transparent;border-radius:10px;padding:9px 14px;font-weight:600;font-size:13.5px;background:var(--hijau-700);color:#fff;transition:transform .06s ease,background .15s ease}.tombol:active{transform:translateY(1px)}.tombol:hover{background:var(--hijau-600)}.tombol.ringan{background:var(--putih);color:var(--hijau-700);border-color:var(--garis)}.tombol.ringan:hover{background:var(--hijau-100)}.tombol.emas{background:var(--emas);color:#2a2200}.tombol.emas:hover{background:#d9b23a}.tombol.bahaya{background:var(--merah-lembut);color:var(--merah);border-color:#f3cfcc}.tombol.bahaya:hover{background:#fbdcd9}.tombol.kecil{padding:6px 10px;font-size:12.5px;border-radius:8px}.tombol:disabled{opacity:.5;cursor:not-allowed}.header .tombol.admin{background:#ffffff24;border:1px solid rgba(255,255,255,.32);color:#fff;padding:8px 14px;border-radius:999px;font-size:13px}.header .tombol.admin:hover{background:#ffffff3d}.medan{display:grid;gap:5px}.medan label{font-size:12.5px;font-weight:700;color:var(--teks-lembut)}.medan input,.medan select,.medan textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--garis);background:#fcfdfc;outline:none}.medan input:focus,.medan select:focus,.medan textarea:focus{border-color:var(--hijau-500);box-shadow:0 0 0 3px #17a07724;background:#fff}.medan textarea{min-height:72px;resize:vertical}.baris{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.baris.antara{justify-content:space-between}.lencana{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:700;background:var(--hijau-100);color:var(--hijau-700);white-space:nowrap}.lencana.emas{background:var(--emas-lembut);color:#85660a}.lencana.abu{background:#f0f1ee;color:var(--teks-lembut)}.lencana.merah{background:var(--merah-lembut);color:var(--merah)}.pisah{height:1px;background:var(--garis);margin:12px 0}.daftar{display:grid;gap:10px}.item{border:1px solid var(--garis);border-radius:14px;padding:12px 14px;background:var(--putih);display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}.item .info{min-width:0;flex:1 1 220px}.item .nama{font-weight:700;font-size:14.5px}.item .meta{color:var(--teks-lembut);font-size:12.5px;margin-top:2px}.item .aksi{display:flex;gap:6px;flex-wrap:wrap}.kosong{text-align:center;padding:28px 16px;color:var(--teks-lembut);font-size:13.5px;border:1px dashed var(--garis);border-radius:14px;background:#fdfdfb}.pesan-galat{background:var(--merah-lembut);color:#7a1a14;border:1px solid #f0cbc7;border-radius:12px;padding:10px 14px;font-size:13.5px;margin-bottom:12px}.pesan-ok{background:var(--hijau-100);color:var(--hijau-800);border:1px solid #bfe5d5;border-radius:12px;padding:10px 14px;font-size:13.5px;margin-bottom:12px}.memuat{display:flex;align-items:center;gap:10px;color:var(--teks-lembut);font-size:13.5px;padding:18px 4px}.putar{width:16px;height:16px;border:2px solid var(--hijau-100);border-top-color:var(--hijau-600);border-radius:50%;animation:putar .8s linear infinite}@keyframes putar{to{transform:rotate(360deg)}}.lapisan{position:fixed;top:0;right:0;bottom:0;left:0;background:#061e178c;display:flex;align-items:center;justify-content:center;padding:16px;z-index:80;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.dialog{background:var(--putih);border-radius:18px;width:100%;max-width:460px;max-height:90vh;overflow-y:auto;padding:20px;box-shadow:0 20px 48px #041a134d}.dialog h2{font-size:18px;margin-bottom:4px}.dialog .sub{color:var(--teks-lembut);font-size:13px;margin-bottom:14px}.dialog .tutup{background:transparent;border:none;font-size:20px;line-height:1;color:var(--teks-lembut);padding:2px 6px;border-radius:8px}.dialog .tutup:hover{background:#f1f2ef}.tabel-bungkus{overflow-x:auto;border:1px solid var(--garis);border-radius:14px;background:var(--putih)}table.rapi{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}table.rapi th{text-align:left;padding:10px 12px;background:#f5f8f5;color:var(--teks-lembut);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;border-bottom:1px solid var(--garis);white-space:nowrap}table.rapi td{padding:10px 12px;border-bottom:1px solid #f0f1ee;vertical-align:middle}table.rapi tr:last-child td{border-bottom:none}.segmen{display:flex;gap:6px;background:#eef1ec;padding:4px;border-radius:12px;overflow-x:auto;scrollbar-width:none}.segmen::-webkit-scrollbar{display:none}.segmen button{border:none;background:transparent;padding:8px 12px;border-radius:9px;font-weight:600;font-size:13px;color:var(--teks-lembut);white-space:nowrap}.segmen button.aktif{background:var(--putih);color:var(--hijau-700);box-shadow:var(--bayang-lembut)}.bilah-atas{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}.bilah-atas .cari{flex:1 1 200px}.kecil-teks{font-size:12px;color:var(--teks-lembut)}.progres{height:7px;border-radius:999px;background:#eef1ec;overflow:hidden;margin-top:6px}.progres>span{display:block;height:100%;background:linear-gradient(90deg,var(--hijau-600),var(--hijau-500));border-radius:999px}.kaki{text-align:center;font-size:11.5px;color:#8a958f;padding:18px 16px 26px}.arab-judul{font-family:Traditional Arabic,Amiri,Scheherazade New,serif;font-size:18px;color:var(--emas-lembut);opacity:.9}@media (max-width: 820px){.kisi.k4,.kisi.k3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 620px){.utama{padding:16px 12px 56px}.kisi.k2,.kisi.k3,.kisi.k4{grid-template-columns:minmax(0,1fr)}.judul-halaman h1{font-size:19px}.dialog{padding:16px}.item .aksi .tombol{flex:1 1 auto}}
