:root{--hijau: #0f5132;--hijau-muda: #e6efe9;--emas: #f2c14e;--latar: #f7f7f2;--kartu: #ffffff;--teks: #1c2321;--redup: #5c6b64;--garis: #dde4df;--bahaya: #a3231f;--radius: 12px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;color:var(--teks);background:var(--latar);line-height:1.5}*{box-sizing:border-box}body{margin:0;min-height:100vh}h1{font-size:1.5rem;margin:0 0 .25rem}h2{font-size:1.125rem;margin:1.5rem 0 .5rem}.redup{color:var(--redup)}.kecil{font-size:.8125rem}.masuk{min-height:100vh;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(circle at 30% 20%,#eef4ef,var(--latar) 60%)}.kartu-masuk{width:min(380px,100%);background:var(--kartu);border:1px solid var(--garis);border-radius:16px;padding:2rem 1.75rem;display:grid;gap:.875rem;box-shadow:0 12px 32px #0f513214}.kartu-masuk h1{margin:0;font-size:1.375rem}.kartu-masuk p{margin:0}label{display:grid;gap:.375rem;font-size:.875rem;font-weight:600;color:var(--redup)}input,textarea{font:inherit;font-weight:400;color:var(--teks);background:#fff;border:1px solid var(--garis);border-radius:8px;padding:.5rem .625rem;min-width:0}input:focus,textarea:focus{outline:2px solid var(--hijau);outline-offset:1px}.tombol{font:inherit;font-weight:600;cursor:pointer;border:0;border-radius:8px;padding:.6rem 1rem;color:#fff;background:var(--hijau)}.tombol:hover{filter:brightness(1.08)}.tombol:disabled{opacity:.6;cursor:not-allowed}.tombol-kecil{padding:.35rem .7rem;font-size:.8125rem;background:#fff;color:var(--hijau);border:1px solid var(--hijau)}.galat-teks{color:var(--bahaya);font-size:.875rem;margin:.5rem 0}.info-teks{color:var(--hijau);font-size:.875rem;margin:.5rem 0}.shell{min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.625rem 1.25rem;background:var(--hijau);color:#fff;flex-wrap:wrap}.merek{display:inline-flex;align-items:center;gap:.5rem;color:#fff;text-decoration:none;font-weight:700;letter-spacing:.01em}.topbar-aksi{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.pengguna{font-size:.875rem;max-width:16ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lencana{font:inherit;font-size:.75rem;font-weight:700;padding:.2rem .55rem;border-radius:999px;border:0;color:var(--hijau)}.lencana-hijau{background:#d7f0df}.lencana-kuning{background:var(--emas);cursor:pointer}.pita-info{background:var(--emas);color:#3a2a00;font-size:.8125rem;padding:.4rem 1.25rem}.badan{flex:1;display:grid;grid-template-columns:250px minmax(0,1fr);gap:0}.nav-modul{display:flex;flex-direction:column;gap:.125rem;padding:1rem .75rem 2rem;background:var(--hijau-muda);border-right:1px solid var(--garis);overflow-y:auto}.nav-modul a{display:flex;align-items:center;gap:.5rem;padding:.45rem .6rem;border-radius:8px;color:var(--teks);text-decoration:none;font-size:.875rem}.nav-modul a:hover{background:#d9e7de}.nav-modul a.nav-aktif{background:var(--hijau);color:#fff;font-weight:600}.nav-kode{font-size:.6875rem;font-weight:700;letter-spacing:.04em;opacity:.75}.konten{padding:1.5rem clamp(1rem,3vw,2.5rem) 3rem;min-width:0}.kaki{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.75rem 1.25rem;border-top:1px solid var(--garis);color:var(--redup);font-size:.75rem}.kartu-baris{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin:1rem 0 1.5rem}.kartu{background:var(--kartu);border:1px solid var(--garis);border-radius:var(--radius);padding:1rem;display:grid;gap:.25rem;font-size:.875rem;color:var(--redup)}.kartu-angka{font-size:1.5rem;font-weight:700;color:var(--hijau)}.grid-modul{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.75rem}.ubin-modul{font:inherit;text-align:left;cursor:pointer;background:var(--kartu);border:1px solid var(--garis);border-radius:var(--radius);padding:.875rem;display:grid;gap:.2rem}.ubin-modul:hover{border-color:var(--hijau);box-shadow:0 4px 14px #0f513214}.kepala-halaman{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}.chip-baris{display:flex;gap:.375rem;flex-wrap:wrap;margin:.75rem 0}.chip{font:inherit;font-size:.8125rem;cursor:pointer;border:1px solid var(--garis);background:#fff;color:var(--teks);border-radius:999px;padding:.3rem .7rem}.chip-aktif{background:var(--hijau);border-color:var(--hijau);color:#fff;font-weight:600}.toolbar{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}.toolbar input[type=search]{flex:1 1 220px}.panel-form{background:var(--kartu);border:1px solid var(--hijau);border-radius:var(--radius);padding:1rem;margin:.5rem 0 1rem}.panel-form h2{margin-top:0}.grid-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem}.grid-form .penuh,.panel-form .penuh{display:grid;margin-top:.75rem}.aksi-form{display:flex;gap:.5rem;margin-top:.875rem}.tabel-bungkus{overflow-x:auto;border:1px solid var(--garis);border-radius:var(--radius);background:var(--kartu)}.tabel{width:100%;border-collapse:collapse;font-size:.8125rem}.tabel th,.tabel td{text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--garis);white-space:nowrap}.tabel th{background:#f1f5f2;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--redup);position:sticky;top:0}.tabel tbody tr:hover{background:#fafcf9}.aksi-baris{display:flex;gap:.5rem}.tautan{font:inherit;background:none;border:0;padding:0;color:var(--hijau);font-weight:600;cursor:pointer;text-decoration:underline}.tautan-bahaya{color:var(--bahaya)}@media(max-width:820px){.badan{grid-template-columns:1fr}.nav-modul{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--garis);padding:.5rem}.nav-modul a{white-space:nowrap}.konten{padding:1rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}