:root{--hijau: #0f766e;--hijau-tua: #115e59;--emas: #d97706;--bg: #f4f7f6;--kartu: #ffffff;--garis: #e2e8e6;--teks: #14231f;--redup: #6b7c78}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--teks);-webkit-font-smoothing:antialiased}.app{min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:linear-gradient(120deg,#0f766e,#115e59 60%,#134e4a);color:#fff}.brand{display:flex;align-items:center;gap:10px}.brand strong{display:block;font-size:15px;line-height:1.2}.brand small{opacity:.75;font-size:11.5px}.logo{width:38px;height:38px;border-radius:12px;background:#ffffff29;border:1px solid rgba(255,255,255,.28);display:grid;place-items:center;font-weight:700;font-size:13px;letter-spacing:.5px}.btn-admin{border:1px solid rgba(255,255,255,.35);background:#ffffff1f;color:#fff;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:600;cursor:pointer;max-width:45vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-admin:hover{background:#ffffff38}.btn-admin.aktif{background:#fbbf24;color:#422006;border-color:#fbbf24}.nav{display:flex;gap:8px;padding:10px 14px;overflow-x:auto;background:#fff;border-bottom:1px solid var(--garis);position:sticky;top:0;z-index:20;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}.chip{border:1px solid var(--garis);background:#f8faf9;color:var(--redup);padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}.chip.on{background:var(--hijau);border-color:var(--hijau);color:#fff}.wrap{flex:1;width:100%;max-width:980px;margin:0 auto;padding:16px 14px 40px}.alert{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;padding:10px 12px;border-radius:12px;font-size:13px;margin-bottom:12px;display:flex;gap:10px;align-items:center;justify-content:space-between}.notice{background:#f0fdfa;border:1px solid #ccfbf1;color:#115e59;padding:10px 12px;border-radius:12px;font-size:13px;margin-bottom:12px}.loading{padding:40px;text-align:center;color:var(--redup)}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px}.stats.dua{grid-template-columns:repeat(2,1fr)}.stat{background:var(--kartu);border:1px solid var(--garis);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:4px;box-shadow:0 1px 2px #0f3c320a}.stat span{font-size:12px;color:var(--redup);font-weight:600;text-transform:uppercase;letter-spacing:.4px}.stat strong{font-size:26px;line-height:1.15}.stat strong.kecil{font-size:17px}.card{background:var(--kartu);border:1px solid var(--garis);border-radius:16px;padding:16px;margin-bottom:14px;box-shadow:0 1px 2px #0f3c320a}.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}.card h2{margin:0;font-size:16px}.card h3{margin:2px 0 4px;font-size:15.5px}.card p{margin:2px 0;font-size:13px}.bars{display:flex;flex-direction:column;gap:10px}.bar-label{display:flex;justify-content:space-between;font-size:12.5px;color:var(--redup);margin-bottom:4px;gap:8px}.bar-label strong{color:var(--teks)}.bar-track{height:8px;background:#eef4f2;border-radius:99px;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#14b8a6,#0f766e)}.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.list li{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px dashed var(--garis);font-size:13px}.list li:last-child{border-bottom:0}.grow{flex:1}.tag{display:inline-block;background:#ecfdf5;color:#047857;border-radius:8px;padding:3px 8px;font-size:11px;font-weight:700;white-space:nowrap}.tag.t-korel{background:#eff6ff;color:#1d4ed8}.tag.t-relawan{background:#fff7ed;color:#b45309}.head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.head h1{font-size:20px;margin:0}.head p{margin:2px 0 0;font-size:13px}.btn{background:var(--hijau);color:#fff;border:0;padding:10px 16px;border-radius:12px;font-weight:700;font-size:13.5px;cursor:pointer;text-align:center;text-decoration:none;display:inline-block}.btn:hover{background:var(--hijau-tua)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn.ghost{background:#fff;color:var(--hijau-tua);border:1px solid var(--garis)}.link{background:none;border:0;padding:2px 4px;color:var(--hijau);font-weight:700;font-size:12.5px;cursor:pointer}.link.danger{color:#b91c1c}.grid{display:grid;grid-template-columns:1fr;gap:12px}.grid .card{margin-bottom:0}.item{display:flex;flex-direction:column;gap:8px}.aksi{display:flex;gap:6px;justify-content:flex-end;border-top:1px solid var(--garis);padding-top:8px}.catatan{background:#f8faf9;border-left:3px solid #99f6e4;padding:7px 10px;border-radius:8px;color:#3f524d;margin-top:6px!important}.muted{color:var(--redup)}.center{text-align:center}.kecil-teks{font-size:11.5px}.table-card{background:#fff;border:1px solid var(--garis);border-radius:16px;overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:520px}th,td{padding:11px 12px;text-align:left;font-size:13px;border-bottom:1px solid var(--garis)}th{background:#f8fafc;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--redup)}tbody tr:last-child td{border-bottom:0}.kanan{text-align:right}.foot{text-align:center;padding:18px;font-size:12px;color:var(--redup)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a231e73;display:flex;align-items:flex-end;justify-content:center;padding:0;z-index:60}.modal{background:#fff;width:100%;max-width:560px;border-radius:20px 20px 0 0;padding:18px;max-height:92vh;overflow-y:auto;animation:naik .18s ease-out}@keyframes naik{0%{transform:translateY(18px);opacity:.6}to{transform:none;opacity:1}}.modal h2{margin:0 0 10px;font-size:18px}.kecil-modal{max-width:420px}.fields{display:grid;grid-template-columns:1fr;gap:10px}.fields label{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:600;color:#3f524d}.fields label.full{grid-column:1 / -1}.fields input,.fields select,.fields textarea{border:1px solid var(--garis);background:#fbfdfc;border-radius:10px;padding:10px 11px;font-size:14px;font-family:inherit;color:var(--teks);width:100%}.fields input:focus,.fields select:focus,.fields textarea:focus{outline:2px solid #99f6e4;border-color:var(--hijau);background:#fff}.fields textarea{resize:vertical}.modal-aksi{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}.modal-aksi.kolom{flex-direction:column}@media (min-width: 640px){.stats{grid-template-columns:repeat(4,1fr)}.stats.dua{grid-template-columns:repeat(3,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.fields{grid-template-columns:1fr 1fr}.overlay{align-items:center;padding:20px}.modal{border-radius:20px}.topbar{padding:16px 24px}.wrap{padding:20px 24px 48px}.head h1{font-size:24px}}
