:root{--bg:#f6f7f4;--kertas:#fff;--garis:#e3e6df;--tinta:#14201a;--tinta-lembut:#5c6b62;--hijau:#0f7b4f;--hijau-terang:#e7f4ec;--merah:#b3261e;--kuning:#f5c400;--radius:14px;--bayang:0 1px 2px rgba(16,32,24,.06),0 6px 18px rgba(16,32,24,.05)}*{box-sizing:border-box}body,html{margin:0;padding:0;background:var(--bg);color:var(--tinta);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}h1,h2,h3{margin:0;line-height:1.25}h1{font-size:1.25rem}h2{font-size:1.05rem}h3{font-size:.95rem}.kecil,small{font-size:.8rem;color:var(--tinta-lembut)}.mono{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:20;background:var(--tinta);color:#fff;padding:10px 14px;display:flex;align-items:center;gap:12px}.topbar .merek{font-weight:700;letter-spacing:.2px}.topbar .merek span{color:#7fe0b0}.topbar .kanan{margin-left:auto;display:flex;gap:10px;align-items:center;font-size:.8rem}.topbar .kanan a{opacity:.85}.topbar .kanan a:hover{opacity:1}.topbar .kanan form{display:flex}.tautan-keluar{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;opacity:.85}.tautan-keluar:hover{opacity:1}.nav-bawah{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;gap:2px;background:#fff;border-top:1px solid var(--garis);padding:5px 6px calc(5px + env(safe-area-inset-bottom));box-shadow:0 -2px 14px rgba(16,32,24,.08)}.nav-bawah>*{flex:1 1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:6px 2px;border-radius:12px;border:0;background:none;font-family:inherit;font-size:.72rem;font-weight:600;line-height:1.1;cursor:pointer;color:var(--tinta-lembut);text-align:center}.nav-bawah>* svg{width:23px;height:23px;display:block}.nav-ikon{position:relative;display:grid;place-items:center}.nav-lencana{position:absolute;top:-5px;right:-10px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--merah);color:#fff;font-size:.62rem;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px #fff}.nav-bawah>[data-aktif=ya] .nav-lencana{box-shadow:0 0 0 2px var(--hijau)}.nav-bawah>[data-aktif=ya]{background:var(--hijau);color:#fff;font-weight:700;box-shadow:0 4px 10px rgba(15,123,79,.3)}.sheet-latar{position:fixed;inset:0;z-index:40;align-items:center;justify-content:center;background:rgba(10,20,15,.45)}.sheet,.sheet-latar{display:flex;padding:16px}.sheet{width:100%;max-width:520px;max-height:80vh;overflow:auto;background:#fff;border-radius:16px;flex-direction:column;gap:12px;box-shadow:0 18px 50px rgba(10,20,15,.28)}.konfirmasi-latar{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(10,20,15,.45)}.konfirmasi{width:min(400px,100%);padding:16px;border-radius:16px;background:var(--kertas);color:var(--tinta);display:grid;grid-gap:8px;gap:8px;box-shadow:0 18px 50px rgba(10,20,15,.28)}.konfirmasi p{margin:0}.konfirmasi .baris{justify-content:flex-end;margin-top:6px}.sheet-daftar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:8px;gap:8px}.sheet-daftar a{padding:14px 12px;border:1px solid var(--garis);border-radius:10px;font-size:.9rem;font-weight:600}.sheet-daftar a[data-aktif=ya]{border-color:var(--hijau);color:var(--hijau);font-weight:700}.pilih-cara{display:grid;grid-gap:8px;gap:8px;grid-template-columns:1fr}.cara-pil{display:flex;align-items:center;gap:8px;margin:0;padding:10px 12px;border:1px solid var(--garis);border-radius:10px;background:#fff;font-size:.88rem;font-weight:600;color:var(--tinta);cursor:pointer}.cara-pil input{width:auto;margin:0;accent-color:var(--hijau)}.cara-pil.aktif{border-color:var(--hijau);background:var(--hijau-terang)}.opsi-daftar{display:grid;grid-gap:8px;gap:8px;grid-template-columns:1fr}.opsi-pil{display:flex;align-items:center;gap:8px;margin:0;padding:10px 12px;border:1px solid var(--garis);border-radius:10px;background:#fff;font-size:.88rem;font-weight:600;color:var(--tinta);cursor:pointer}.opsi-pil input{width:auto;margin:0;accent-color:var(--hijau)}.opsi-pil.aktif{border-color:var(--hijau);background:var(--hijau-terang)}.opsi-pil .kecil{margin-left:auto}.opsi-pesanan,.opsi-terpilih{color:var(--hijau)}.opsi-baris{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.opsi-kecil{display:inline-flex;align-items:center;gap:5px;margin:0;padding:4px 9px;border:1px solid var(--garis);border-radius:999px;background:#fff;font-size:.74rem;font-weight:600;color:var(--tinta);cursor:pointer}.opsi-kecil input{width:auto;margin:0;accent-color:var(--hijau)}.opsi-kecil.aktif{border-color:var(--hijau);background:var(--hijau-terang);color:var(--hijau)}.opsi-kecil .kecil{color:inherit}.opsi-item{padding:6px 0;border-bottom:1px dashed var(--garis)}.notif-pesanan{display:flex;align-items:center;gap:10px;text-decoration:none;background:#fff8e1;border:1px solid #ead48a;color:var(--tinta);border-radius:var(--radius);padding:12px 14px;font-size:.88rem;box-shadow:var(--bayang)}.notif-pesanan:hover{background:#fff3c9}.notif-pesanan strong{color:#8a6d00}.notif-ikon{font-size:1.05rem;line-height:1}.notif-aksi{margin-left:auto;color:var(--hijau);font-weight:700;white-space:nowrap}.wadah{max-width:1120px;margin:0 auto;padding:14px 12px 90px}.kartu{background:var(--kertas);border:1px solid var(--garis);border-radius:var(--radius);box-shadow:var(--bayang);padding:14px}.kartu+.kartu{margin-top:12px}.antara,.baris{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.antara{justify-content:space-between}.grid{display:grid;grid-gap:10px;gap:10px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:1fr}.stack>*+*{margin-top:10px}.stat{background:var(--kertas);border:1px solid var(--garis);border-radius:var(--radius);padding:12px 14px}.stat .label{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--tinta-lembut)}.stat .nilai{font-size:1.2rem;font-weight:700;margin-top:4px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.stat .sub{font-size:.75rem;color:var(--tinta-lembut);margin-top:2px}.stat.hijau .nilai{color:var(--hijau)}.stat.merah .nilai{color:var(--merah)}.gulir{overflow-x:auto;-webkit-overflow-scrolling:touch}table{width:100%;border-collapse:collapse;font-size:.85rem}td,th{padding:9px 8px;text-align:left;border-bottom:1px solid var(--garis);vertical-align:middle}th{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--tinta-lembut);background:#fafbf8;position:-webkit-sticky;position:sticky;top:0}td.angka,th.angka{text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}tbody tr:hover{background:#fafbf8}label{display:block;font-size:.78rem;font-weight:600;color:var(--tinta-lembut);margin-bottom:4px}input,select,textarea{width:100%;padding:10px 11px;font-size:.92rem;border:1px solid var(--garis);border-radius:10px;background:#fff;color:var(--tinta);font-family:inherit}input:focus,select:focus,textarea:focus{outline:2px solid var(--hijau-terang);border-color:var(--hijau)}textarea{resize:none;height:76px;max-height:76px;overflow-y:auto}.input-baris{display:grid;grid-gap:10px;gap:10px;grid-template-columns:1fr}.tombol{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 14px;border-radius:10px;border:1px solid var(--garis);background:#fff;color:var(--tinta);font-weight:600;font-size:.88rem;cursor:pointer;font-family:inherit}.tombol:hover{background:#f3f6f1}.tombol.utama{background:var(--hijau);border-color:var(--hijau);color:#fff}.tombol.utama:hover{filter:brightness(1.06)}.tombol.bahaya{background:#fdeceb;border-color:#f6c9c6;color:var(--merah)}.tombol.kecil{padding:6px 10px;font-size:.8rem}.tombol:disabled{opacity:.55;cursor:not-allowed}.lencana{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.72rem;font-weight:700;background:var(--hijau-terang);color:var(--hijau)}.lencana.merah{background:#fdeceb;color:var(--merah)}.lencana.kuning{background:#fdf6d8;color:#8a6d00}.lencana.abu{background:#eef1ec;color:var(--tinta-lembut)}.kasir-grid{display:grid;grid-gap:12px;gap:12px;grid-template-columns:1fr}.daftar-produk{display:grid;grid-gap:8px;gap:8px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.pilihan{text-align:left;padding:10px;border-radius:12px;border:1px solid var(--garis);background:#fff;cursor:pointer;font-family:inherit}.pilihan:hover{border-color:var(--hijau);background:var(--hijau-terang)}.pilihan .nama{font-weight:600;font-size:.86rem}.pilihan .harga{color:var(--hijau);font-weight:700;font-size:.84rem;margin-top:2px}.keranjang-item{display:grid;grid-template-columns:1fr auto auto;grid-gap:8px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--garis)}.qty-kontrol{display:flex;align-items:center;gap:6px}.qty-kontrol button{width:30px;height:30px;border-radius:8px;border:1px solid var(--garis);background:#fff;font-size:1rem;cursor:pointer}.pesan{padding:10px 12px;border-radius:10px;font-size:.85rem}.pesan.galat{background:#fdeceb;color:var(--merah);border:1px solid #f6c9c6}.pesan.ok{background:var(--hijau-terang);color:var(--hijau);border:1px solid #bfe3cf}.pesan.info{background:#eef4fb;color:#1c4b78;border:1px solid #cfe0f2}.login-wadah{min-height:100dvh;display:grid;place-items:center;padding:20px}.login-kartu{width:100%;max-width:380px}.login-kartu h1{font-size:1.35rem;margin-bottom:2px}.chart{display:flex;align-items:flex-end;gap:6px;height:120px;padding-top:8px}.chart .batang{flex:1 1;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;min-width:0}.chart .isi{background:var(--hijau);border-radius:4px 4px 0 0;min-height:2px}.chart .isi.modal{background:#cfe3d6}.chart .ket{font-size:.62rem;text-align:center;color:var(--tinta-lembut)}@media (min-width:768px){.wadah{padding:20px 20px 96px}.grid-2{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.kasir-grid{grid-template-columns:1.2fr 1fr;align-items:start}.input-baris{grid-template-columns:repeat(2,minmax(0,1fr))}h1{font-size:1.5rem}}.grid-produk{display:grid;grid-gap:10px;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.kartu-produk{padding:0;overflow:hidden;display:flex;flex-direction:column;position:relative}.kartu-produk+.kartu-produk{margin-top:0}.kartu-produk.nonaktif{opacity:.62}.foto-produk{aspect-ratio:1/1;background:#f1f3ee;display:grid;place-items:center;overflow:hidden;border-bottom:1px solid var(--garis)}.foto-produk img{width:100%;height:100%;object-fit:cover;display:block}.foto-img{opacity:0;transition:opacity .3s ease}.foto-img.siap{opacity:1}.foto-memuat{position:absolute;inset:0;background:#e6eae5;animation:denyut-foto 1.6s ease-in-out infinite}@keyframes denyut-foto{0%,to{opacity:1}50%{opacity:.45}}.foto-gagal{position:absolute;inset:0;z-index:1;display:grid;place-items:center;background:#eef1ec;color:#b6bfb4}@media (prefers-reduced-motion:reduce){.foto-memuat{animation:none}}.foto-kosong{font-size:.7rem;color:var(--tinta-lembut);text-align:center;padding:6px}.kartu-produk-isi{padding:10px;display:flex;flex-direction:column;gap:3px;min-width:0}.kartu-produk-isi strong{font-size:.86rem;line-height:1.25}.harga-jual{color:var(--hijau);font-weight:700;font-size:.95rem}.menu-produk-tombol{position:absolute;top:8px;right:8px;z-index:2;width:34px;height:34px;display:grid;place-items:center;cursor:pointer;font-size:17px;line-height:1;background:hsla(0,0%,100%,.94);color:var(--tinta);border:1px solid var(--garis);border-radius:10px;box-shadow:0 1px 3px rgba(16,32,24,.14)}.menu-produk-tombol:hover{border-color:var(--hijau);color:var(--hijau)}.menu-produk-isi{position:fixed;inset:0;margin:auto;width:min(520px,calc(100% - 24px));max-height:84vh;overflow:auto;padding:14px;border:1px solid var(--garis);border-radius:16px;background:var(--kertas);box-shadow:0 18px 50px rgba(10,20,15,.28)}.menu-produk-isi::-webkit-backdrop{background:rgba(10,20,15,.45)}.menu-produk-isi::backdrop{background:rgba(10,20,15,.45)}.menu-produk-kepala{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:8px;margin-bottom:10px;border-bottom:1px solid var(--garis)}.menu-pilihan{margin-top:8px}.menu-pilihan>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px;list-style:none;cursor:pointer;border:1px solid var(--garis);border-radius:10px;font-size:.88rem;font-weight:600;color:var(--tinta)}.menu-pilihan>summary::-webkit-details-marker{display:none}.menu-pilihan>summary:after{content:"\203A";font-size:1.1rem;line-height:1;color:var(--tinta-lembut)}.menu-pilihan[open]>summary{border-color:var(--hijau);background:var(--hijau-terang);color:var(--hijau);border-bottom-left-radius:0;border-bottom-right-radius:0}.menu-pilihan[open]>summary:after{content:"\02C5"}.toko-kartu{cursor:pointer;font-family:inherit;color:inherit;text-align:left}.toko-kartu:hover{border-color:var(--hijau)}.toko-kartu:disabled{opacity:.55;cursor:not-allowed}.toko-harga{color:var(--hijau);font-weight:700;font-size:.95rem}.toko-sukses{align-items:center;text-align:center}.toko-etalase{padding-bottom:12px}.toko-atas{position:-webkit-sticky;position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--bg);padding:4px 0 8px}.toko-merek{font-size:1.15rem;letter-spacing:.2px}.sering{display:flex;flex-direction:column;gap:7px}.sering-judul{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--tinta-lembut)}.sering-baris{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}.sering-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 12px;border:1px solid var(--garis);border-radius:12px;background:var(--kertas);color:var(--tinta);cursor:pointer;font-family:inherit;text-align:left;box-shadow:var(--bayang)}.sering-item:hover{border-color:var(--hijau)}.sering-nama{font-size:.9rem;font-weight:600;white-space:nowrap}.sering-harga{font-size:.8rem;font-weight:700;color:var(--hijau)}.toko-keranjang{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border:1px solid var(--garis);border-radius:12px;background:var(--kertas);color:var(--tinta);cursor:pointer;font-family:inherit;font-weight:700;font-size:.85rem;box-shadow:var(--bayang)}.toko-keranjang:hover{border-color:var(--hijau);color:var(--hijau)}.toko-ikon{position:relative;display:grid;place-items:center}.toko-ikon svg{width:23px;height:23px;display:block}.toko-lencana{position:absolute;top:-7px;right:-9px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--merah);color:#fff;font-size:.62rem;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px var(--kertas)}.toko-angka{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.foto-produk{position:relative}.toko-kartu.dipilih{border-color:var(--hijau);box-shadow:0 0 0 1.5px var(--hijau)}.pilih-item{right:8px;margin:0;width:30px;height:30px;cursor:pointer}.pilih-item,.tanda-habis{position:absolute;top:8px;z-index:2}.tanda-habis{left:8px;padding:3px 9px;border-radius:999px;background:rgba(179,38,30,.92);color:#fff;font-size:.8rem;font-weight:700;line-height:1.2;box-shadow:0 1px 4px rgba(16,32,24,.25)}.pilih-item input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0}.pilih-tanda{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:2px solid #fff;color:transparent;background:hsla(0,0%,100%,.9);box-shadow:0 1px 4px rgba(16,32,24,.28);font-size:.9rem;font-weight:800;line-height:1}.pilih-item input:checked+.pilih-tanda{background:var(--hijau);border-color:#fff;color:#fff}.kode-pesanan{font-size:2rem;font-weight:800;letter-spacing:.06em;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.total-pesanan{font-size:1.25rem;font-weight:700;color:var(--hijau)}.grid-pesanan{display:grid;grid-gap:10px;gap:10px;grid-template-columns:1fr;align-items:start}.kartu-pesanan+.kartu-pesanan{margin-top:0}.kartu-pesanan.menunggu{border-color:#ead48a;box-shadow:0 1px 2px rgba(138,109,0,.08)}.kartu-pesanan table{font-size:.8rem}@media (min-width:768px){.grid-produk{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-pesanan{grid-template-columns:repeat(2,minmax(0,1fr))}.nav-bawah{left:50%;right:auto;transform:translateX(-50%);width:min(720px,calc(100% - 24px));bottom:12px;border:1px solid var(--garis);border-radius:16px;padding:6px}}@media (min-width:1024px){.input-baris.tiga{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-produk{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-pesanan{grid-template-columns:repeat(3,minmax(0,1fr))}}