:root{color-scheme:dark;--hijau: #a78bfa;--hijau-tua: #c4b5fd;--latar: #1d1b30;--kartu: #282645;--kartu-2: #34315a;--teks: #ebe9f7;--redup: #a3a0c4;--garis: #433f6b;--merah: #ff8a80;--kuning: #3b3420;--kuning-garis: #7a6a2e}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--latar);color:var(--teks);font-size:16px;line-height:1.45}h1{font-size:1.5rem;margin:0 0 4px}h3{font-size:1rem;margin:0 0 8px}p{margin:8px 0}code{background:var(--kartu-2);padding:1px 5px;border-radius:4px}.redup{color:var(--redup)}.kecil{font-size:.85rem}.jarak{margin-top:24px}.tengah{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}.kartu{background:var(--kartu);border-radius:14px;padding:24px 20px;width:100%;max-width:400px;box-shadow:0 1px 3px #00000059}.aplikasi{max-width:560px;margin:0 auto;min-height:100vh;background:var(--latar)}.aplikasi.lebar-admin{max-width:1000px}.atas{display:flex;align-items:center;gap:12px;padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top));background:var(--kartu);border-bottom:1px solid var(--garis)}.tab{display:flex;background:var(--kartu);border-bottom:1px solid var(--garis);position:sticky;top:0;z-index:5;overflow-x:auto}.tab button{flex:1;min-width:80px;padding:12px 8px;border:0;background:none;font:inherit;color:var(--redup);border-bottom:3px solid transparent;cursor:pointer}.tab button.aktif{color:var(--hijau);border-bottom-color:var(--hijau);font-weight:600}.isi{padding:16px;padding-bottom:calc(96px + var(--lencana) + env(safe-area-inset-bottom))}.form{display:flex;flex-direction:column;gap:12px}label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--redup)}input,select{font:inherit;color:var(--teks);background:var(--latar);border:1px solid var(--garis);border-radius:8px;padding:10px 12px;width:100%;min-height:44px}input:focus,select:focus{outline:2px solid var(--hijau);outline-offset:0;border-color:var(--hijau)}input:disabled{background:var(--kartu-2);color:var(--redup)}.tombol{font:inherit;font-weight:600;cursor:pointer;border:0;border-radius:8px;background:var(--hijau);color:#1a1233;padding:11px 16px;min-height:44px}.tombol:hover{background:var(--hijau-tua)}.tombol:disabled{opacity:.5;cursor:not-allowed}.tombol.sekunder{background:transparent;color:var(--hijau);border:1px solid var(--hijau)}.tombol.sekunder:hover{background:var(--kartu-2)}.tombol.lebar{width:100%}.tombol.kecil-tombol{padding:6px 12px;min-height:36px;font-size:.9rem}.baris-tombol{display:flex;gap:8px;flex-wrap:wrap}.ikon{border:0;background:none;font-size:1.4rem;line-height:1;color:var(--redup);cursor:pointer;padding:4px 10px;min-height:44px}.ikon:hover{color:var(--merah)}.galat{color:var(--merah);background:#4a2a30;border-radius:8px;padding:8px 12px}.info{color:#7ee2b8;background:#1f3d3a;border-radius:8px;padding:8px 12px}.peringatan{background:var(--kuning);border:1px solid var(--kuning-garis);border-radius:8px;padding:10px 12px}.peringatan ul{margin:6px 0 0;padding-left:20px}.tab-mini{display:flex;gap:4px;background:var(--latar);padding:4px;border-radius:10px;margin:16px 0}.tab-mini button{flex:1;border:0;background:none;padding:8px;border-radius:8px;font:inherit;cursor:pointer;color:var(--redup)}.tab-mini button.aktif{background:var(--kartu-2);color:var(--hijau);font-weight:600;box-shadow:0 1px 2px #00000059}.pemisah{text-align:center;color:var(--redup);margin:16px 0;position:relative}.pemisah:before{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--garis)}.pemisah span{position:relative;background:var(--kartu);padding:0 10px}.blok{background:var(--kartu);border-radius:12px;padding:14px;box-shadow:0 1px 2px #00000040;display:flex;flex-direction:column;gap:8px}.komponen{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:center}.komponen input:nth-child(3){grid-column:1 / 3}.komponen .ikon{grid-row:1;grid-column:3}.ringkasan{background:var(--kartu);border-radius:12px;padding:14px;box-shadow:0 1px 2px #00000040}.ringkasan>div{display:flex;justify-content:space-between;padding:4px 0}.ringkasan .total{border-top:1px solid var(--garis);margin-top:6px;padding-top:8px;font-weight:700;font-size:1.1rem}.daftar{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.daftar li{background:var(--kartu);border-radius:10px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;box-shadow:0 1px 2px #00000040}.daftar li.kolom{flex-direction:column;align-items:stretch}.lencana{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.8rem;font-weight:600;align-self:flex-start}.lencana.hijau{background:#1f3d3a;color:#7ee2b8}.lencana.merah{background:#4a2a30;color:var(--merah)}.filter{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.filter>:nth-child(3),.filter>:nth-child(4){grid-column:1 / -1}@media (min-width: 700px){.filter{grid-template-columns:180px 240px 1fr auto;align-items:end}.filter>:nth-child(3),.filter>:nth-child(4){grid-column:auto}}.tabel-bungkus{overflow-x:auto;background:var(--kartu);border-radius:12px;box-shadow:0 1px 2px #00000040}.tabel{border-collapse:collapse;width:100%;font-size:.9rem}.tabel th,.tabel td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--garis);white-space:nowrap}.tabel th{background:var(--kartu-2);font-weight:600}.tabel .kanan{text-align:right}.tabel tr.belum td{background:#33301f}.kolom-sandi{position:relative}.kolom-sandi input{padding-right:76px}.lihat-sandi{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--hijau);font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;padding:8px}.tautan{border:0;background:none;color:var(--hijau);font:inherit;font-size:.9rem;cursor:pointer;padding:4px 0;text-align:left}.tautan:hover{text-decoration:underline}.logo{display:block;border-radius:50%}.merek{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;margin-bottom:4px}.merek h1{font-size:1.3rem;margin-top:10px}.merek p{margin:2px 0 0}.splash{flex-direction:column;gap:14px}.avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#8b5cf6,#4f46e5);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:none}.atas-teks{min-width:0}.atas-teks strong{display:block}:root{--lencana: 0px}.menu-bawah{position:fixed;left:12px;right:12px;bottom:calc(var(--lencana) + env(safe-area-inset-bottom));z-index:20;display:flex;justify-content:center;max-width:560px;margin:0 auto;background:var(--kartu);border:1px solid var(--garis);border-radius:18px;box-shadow:0 6px 22px #0006;overflow:hidden}.menu-bawah button{flex:1;max-width:200px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 9px;border:0;background:none;color:var(--redup);font:inherit;font-size:.72rem;cursor:pointer;min-height:56px}.menu-bawah button.aktif{color:var(--hijau)}.menu-bawah button.aktif svg{stroke-width:2.4}.susun{display:flex;flex-direction:column;gap:14px}.baris-sebar{display:flex;justify-content:space-between;align-items:center;gap:10px}.profil-kartu{flex-direction:row;align-items:center;gap:14px}.profil-kartu .avatar{width:52px;height:52px;font-size:1.1rem}.status-besar{border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:8px;background:var(--kartu);border:1px solid var(--garis)}.status-besar.ok{background:linear-gradient(135deg,#2a2a55,#33307a);border-color:#5b52a8}.status-besar.belum{background:#3b3420;border-color:var(--kuning-garis)}.status-besar .besar{font-size:1.7rem;font-weight:800}.kisi-stat{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media (min-width: 760px){.kisi-stat{grid-template-columns:repeat(4,1fr)}}.stat{background:var(--kartu);border-radius:14px;padding:12px 14px;border:1px solid var(--garis);min-width:0}.stat-label{color:var(--redup);font-size:.8rem}.stat-nilai{font-size:1.2rem;font-weight:700;margin-top:2px;overflow-wrap:anywhere}.stat-catatan{color:var(--redup);font-size:.75rem;margin-top:2px}.stat.waspada .stat-nilai{color:#fbbf24}.bar{height:8px;border-radius:99px;background:var(--latar);overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,#8b5cf6,#a78bfa);border-radius:99px}.tombol-kartu{text-align:left;font:inherit;color:var(--teks);display:flex;flex-direction:column;gap:2px;cursor:pointer;width:100%}.total-baris{border-top:1px solid var(--garis);padding-top:6px}.kartu-rekap{display:flex}.tabel-lebar{display:none}@media (min-width: 900px){.kartu-rekap{display:none}.tabel-lebar{display:block}}input[type=search]{-webkit-appearance:none}.daftar li.belum{border:1px solid var(--kuning-garis)}.kisi-stat{margin-bottom:12px}
