:root{--biru:#0f5c54;--biru-tua:#0a3f3a;--amber:#e8743b;--krem:#f5f3ec;--garis:#d2d9d0;--teks-lembut:#3c5550;--teks:#0a3f3a;--latar:#f1f3ee;--rel:#08302c;--rel-teks:#9dc2bc;--tint:#fbe3d6;--trek:#e3e9e4;--ok-bg:#d9ebdd;--ok-teks:#1e4d2b;--peringatan:#e8743b;--avatar-bg:#e8743b;--avatar-teks:#fff;--aksen-batang:#0f5c54;--sorot-batang:#e8743b}*{box-sizing:border-box}body{color:var(--biru-tua);background:var(--krem);margin:0;font-family:Inter,system-ui,sans-serif}.rangka{--gx:50%;--gy:32%;background:var(--krem);flex-direction:column;justify-content:space-between;align-items:center;min-height:100dvh;padding:40px 24px 24px;display:flex;position:relative;overflow:hidden}.cahaya{pointer-events:none;background:radial-gradient(440px 320px at var(--gx) var(--gy), color-mix(in srgb, var(--amber) 26%, transparent), transparent 70%);position:absolute;inset:0}.tengah{flex-direction:column;flex:auto;justify-content:center;align-items:center;gap:22px;width:100%;max-width:360px;display:flex;position:relative}.pil{border:1px solid var(--garis);color:var(--teks-lembut);background:#fff;border-radius:999px;align-items:center;gap:8px;padding:5px 12px;font-size:12px;display:flex}.titik{background:var(--amber);border-radius:50%;width:8px;height:8px}.merek{flex-direction:column;align-items:center;gap:10px;display:flex}.nama{letter-spacing:-.04em;color:var(--biru);margin:0;font-family:Archivo,sans-serif;font-size:clamp(56px,15vw,96px);font-weight:800;line-height:1}.slogan{text-align:center;flex-direction:column;align-items:center;gap:10px;display:flex}.slogan p{margin:0;font-size:20px;font-weight:600;line-height:1.3}.kepanjangan{letter-spacing:.14em;text-transform:uppercase;color:var(--teks-lembut);font-size:11px;font-weight:500}.form{flex-direction:column;gap:14px;width:100%;display:flex}.kartu{border:1px solid var(--garis);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff9e;border-radius:14px;transition:border-color .15s,box-shadow .15s;overflow:hidden}.kartu:focus-within{border-color:color-mix(in srgb, var(--biru) 60%, transparent);box-shadow:0 0 0 3px color-mix(in srgb, var(--biru) 16%, transparent)}.baris{align-items:center;gap:12px;padding:8px 16px;transition:background-color .15s,box-shadow .15s;display:flex}.baris.garis{border-bottom:1px solid var(--garis)}.baris:has(.mata){padding-right:4px}.baris:focus-within{background:color-mix(in srgb, var(--biru) 7%, transparent)}.baris svg{flex-shrink:0;transition:stroke .15s}.baris:focus-within>svg{stroke:var(--biru)}.isi{flex-direction:column;flex:1;min-width:0;display:flex}.isi label{color:var(--teks-lembut);font-size:12px;font-weight:600}.baris:focus-within .isi label{color:var(--biru)}.isi input{height:28px;font:inherit;color:var(--biru);background:0 0;border:0;outline:none;padding:0;font-size:16px}.isi input:-webkit-autofill{-webkit-text-fill-color:var(--biru);transition:background-color 9999s ease-out}.isi input:-webkit-autofill:hover{-webkit-text-fill-color:var(--biru);transition:background-color 9999s ease-out}.isi input:-webkit-autofill:focus{-webkit-text-fill-color:var(--biru);transition:background-color 9999s ease-out}.mata{width:44px;height:44px;color:var(--teks-lembut);cursor:pointer;background:0 0;border:0;border-radius:10px;justify-content:center;align-items:center;display:flex}.mata:focus-visible{outline:2px solid var(--biru);outline-offset:-4px}.masuk{background:var(--biru);height:48px;color:var(--krem);font:inherit;cursor:pointer;border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;font-size:16px;font-weight:600;display:flex}.masuk:hover{filter:brightness(1.18)}.masuk:focus-visible{outline:2px solid var(--biru);outline-offset:3px}.catatan{text-align:center;color:var(--teks-lembut);min-height:18px;font-size:12px}.kaki{color:var(--teks-lembut);padding-top:24px;font-size:12px}@media (prefers-reduced-motion:reduce){.baris{transition:none}}.catatan.galat{color:#b3261e;font-weight:600}.akun-contoh{border:1px dashed var(--garis);color:var(--teks-lembut);text-align:center;background:#ffffff80;border-radius:10px;margin-top:4px;padding:10px 14px;font-size:12px}.akun-contoh code{color:var(--biru);-webkit-user-select:all;user-select:all;font-family:inherit;font-weight:600}.baris>svg{color:var(--teks-lembut)}.baris:focus-within>svg{color:var(--biru)}.dasbor{background:var(--latar);min-height:100dvh;color:var(--teks);font-size:14px;display:flex}.dasbor button{font:inherit}.tmb,.lonceng,.lihat{color:var(--teks)}.rel{background:var(--rel);flex-direction:column;flex-shrink:0;justify-content:space-between;align-items:center;width:56px;height:100dvh;padding:10px 0;display:flex;position:sticky;top:0}.rel-atas,.rel-bawah{flex-direction:column;align-items:center;gap:4px;display:flex}.rel-logo{padding:6px 0 12px;display:flex}.rel-tmb{width:56px;height:48px;color:var(--rel-teks);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;display:flex}.rel-tmb:hover{color:#fff;background:#ffffff0f}.rel-tmb.aktif{color:#fff;box-shadow:inset 3px 0 0 var(--amber);background:#ffffff1a}.rel-tmb:focus-visible,.lonceng:focus-visible,.tmb:focus-visible,.lihat:focus-visible,.hp-keluar:focus-visible{outline:2px solid var(--teks);outline-offset:-2px}.rel .rel-tmb:focus-visible{outline-color:#fff}.avatar{background:var(--avatar-bg);width:32px;height:32px;color:var(--avatar-teks);border-radius:50%;justify-content:center;align-items:center;margin:6px 0;font-size:12px;font-weight:700;display:flex}.kolom{flex-direction:column;flex:1;min-width:0;display:flex}.hp-atas{background:var(--rel);color:#fff;align-items:center;gap:12px;padding:10px 16px;display:none}.hp-nama{letter-spacing:.06em;flex:1;font-family:Archivo,sans-serif;font-size:18px;font-weight:800}.hp-keluar{color:#fff;cursor:pointer;background:0 0;border:0;min-height:44px;padding:0 8px;font-size:13px}.bilah{border-bottom:1px solid var(--garis);background:#fff;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:10px 24px;display:flex}.krumb{color:var(--teks-lembut);font-size:13px}.krumb b{color:var(--teks);font-weight:600}.cari{border:1px solid var(--garis);background:var(--latar);max-width:420px;height:36px;color:var(--teks-lembut);border-radius:8px;flex:260px;align-items:center;gap:8px;padding:0 12px;font-size:13px;display:flex}.cari span{flex:1}kbd{font:inherit;border:1px solid var(--garis);background:#fff;border-radius:4px;padding:1px 6px;font-size:11px}.bilah-kanan{align-items:center;gap:8px;margin-left:auto;display:flex}.chip{border:1px solid var(--teks);border-radius:999px;padding:5px 12px;font-size:12px;font-weight:600}.chip.contoh{background:var(--tint);border-color:#0000}.lonceng{cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex;position:relative}.lencana{color:#fff;background:#b3261e;border-radius:8px;justify-content:center;align-items:center;min-width:16px;height:16px;font-size:10px;font-weight:700;display:flex;position:absolute;top:6px;right:6px}.konten{flex-direction:column;flex:1;gap:20px;min-width:0;padding:24px;display:flex}.judul-baris{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;display:flex}h1{margin:0 0 4px;font-family:Archivo,sans-serif;font-size:26px;font-weight:800;line-height:1.15}h2{margin:0;font-size:16px;font-weight:600}.lembut{color:var(--teks-lembut);font-size:13px}.aksi{flex-wrap:wrap;gap:8px;display:flex}.tmb{border:1px solid var(--garis);cursor:pointer;background:#fff;border-radius:8px;min-height:40px;padding:0 16px;font-weight:600}.tmb:hover{filter:brightness(.97)}.tmb.utama{background:var(--biru);color:var(--krem);border-color:#0000}.status{min-height:18px;color:var(--teks-lembut);margin:-12px 0 -8px;font-size:13px}.kpi{flex-wrap:wrap;gap:16px;display:flex}.kartu-kpi{border:1px solid var(--garis);background:#fff;border-radius:12px;flex-direction:column;flex:220px;gap:4px;min-width:0;padding:16px 18px;display:flex}.kartu-kpi.peringatan{background:var(--tint);border-color:var(--peringatan)}.kpi-label{letter-spacing:.12em;color:var(--teks-lembut);font-size:11px;font-weight:600}.kpi-nilai{font-family:Archivo,sans-serif;font-size:32px;font-weight:800;line-height:1.1}.dua{flex-wrap:wrap;align-items:stretch;gap:16px;display:flex}.panel{border:1px solid var(--garis);background:#fff;border-radius:12px;flex-direction:column;gap:12px;min-width:0;padding:18px 20px;display:flex}.panel.luas{flex:3 420px;gap:14px}.panel.sempit{flex:2 320px}.batang{align-items:center;gap:12px;display:flex}.batang-nama{flex-shrink:0;width:150px;font-size:13px;font-weight:500}.trek{background:var(--trek);border-radius:4px;flex:1;min-width:0;height:18px}.isi-batang{background:var(--aksen-batang);border-radius:4px;height:18px}.isi-batang.sorot{background:var(--sorot-batang)}.batang-jumlah{text-align:right;width:40px;font-weight:600}.tindakan{border-top:1px solid var(--trek);align-items:center;gap:12px;padding:10px 0;display:flex}.angka{background:var(--tint);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-family:Archivo,sans-serif;font-weight:800;display:flex}.tindakan-teks{flex:1;min-width:0}.lihat{cursor:pointer;background:0 0;border:0;min-height:44px;padding:0 4px;font-weight:600;text-decoration:underline}.gulir{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:620px;font-size:13px}th{text-align:left;border-bottom:1px solid var(--garis);color:var(--teks-lembut);letter-spacing:.1em;text-transform:uppercase;padding:8px 10px;font-size:11px}td{border-bottom:1px solid var(--trek);padding:11px 10px}td.tebal{font-weight:600}.pil-status{background:var(--tint);color:var(--teks);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;display:inline-block}.pil-status.ok{background:var(--ok-bg);color:var(--ok-teks)}@media (width<=820px){.rel,.krumb,.cari{display:none}.hp-atas{display:flex}.konten{padding:16px}.bilah{padding:8px 16px}}