:root{--kuning: #ffc531;--kuning-tua: #f0ab00;--kuning-lembut: #fff5d6;--tinta: #191713;--redup: #7c7364;--garis: #ece5d8;--kertas: #fbf8f1;--putih: #ffffff;--hijau: #1f9d55;--merah: #d64545;--bayang: 0 8px 24px rgba(40, 30, 10, .08);--bayang-lembut: 0 2px 10px rgba(40, 30, 10, .06)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Segoe UI,system-ui,-apple-system,Helvetica Neue,sans-serif;background:var(--kertas);color:var(--tinta);-webkit-font-smoothing:antialiased;line-height:1.5}button{font-family:inherit;cursor:pointer}h1,h2,h3,h4{margin:0;line-height:1.25;letter-spacing:-.01em}p{margin:0}.aplikasi{min-height:100vh;display:flex;flex-direction:column}.bilah-atas{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:10px clamp(12px,4vw,32px);background:#ffffffeb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--garis)}.merek{display:flex;align-items:center;gap:10px;background:none;border:0;padding:0;text-align:left}.logo{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;font-size:20px;background:linear-gradient(135deg,var(--kuning),#ff9d00);box-shadow:var(--bayang-lembut)}.logo.kecil{width:32px;height:32px;font-size:16px;border-radius:10px}.merek-teks{display:flex;flex-direction:column}.merek-teks strong{font-size:15px}.merek-teks small{font-size:11px;color:var(--redup)}.navigasi{display:none;gap:4px;margin-left:12px}.tautan-nav{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:9px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--redup)}.tautan-nav:hover{background:var(--kuning-lembut);color:var(--tinta)}.tautan-nav.aktif{background:var(--kuning);color:var(--tinta)}.lencana{display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--tinta);color:#fff;font-size:11px;font-weight:700}.aksi-atas{margin-left:auto;display:flex;align-items:center;gap:8px}.tombol-murid,.tombol-admin{border:1px solid var(--garis);background:var(--putih);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;white-space:nowrap;max-width:44vw;overflow:hidden;text-overflow:ellipsis}.tombol-murid{display:none}.tombol-admin{background:var(--tinta);color:#fff;border-color:var(--tinta)}.banner-galat,.banner-memuat{display:flex;align-items:center;gap:10px;padding:10px clamp(12px,4vw,32px);font-size:13px}.banner-galat{background:#fdecec;color:#8c2f2f}.banner-memuat{background:var(--kuning-lembut);color:#6b5300}.putaran{width:14px;height:14px;border:2px solid rgba(107,83,0,.3);border-top-color:#6b5300;border-radius:50%;animation:putar .7s linear infinite}@keyframes putar{to{transform:rotate(360deg)}}main{flex:1;padding-bottom:78px}.halaman{max-width:1140px;margin:0 auto;padding:clamp(14px,3vw,26px) clamp(12px,4vw,32px) 32px}.hero{border-radius:24px;padding:clamp(20px,4vw,40px);background:radial-gradient(120% 130% at 10% 0%,#fff2c2,#ffd24d 42%,#ffb020);box-shadow:var(--bayang);overflow:hidden;position:relative}.hero:after{content:"";position:absolute;right:-60px;bottom:-80px;width:240px;height:240px;border-radius:50%;background:#ffffff59}.hero-isi{position:relative;z-index:1;max-width:640px}.hero-label{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;background:#191713d9;color:#ffe08a;padding:5px 12px;border-radius:999px}.hero h1{font-size:clamp(24px,5vw,40px);margin:12px 0 8px}.hero p{font-size:clamp(13px,2.4vw,15px);color:#4a3d13}.hero-cari{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}.hero-cari input{flex:1 1 220px;min-width:0;border:0;border-radius:14px;padding:13px 16px;font-size:14px;box-shadow:var(--bayang-lembut);background:#fffffff2;color:var(--tinta)}.hero-cari input:focus{outline:2px solid rgba(25,23,19,.5)}.hero-stats{display:flex;gap:18px;margin-top:16px;flex-wrap:wrap;font-size:13px;color:#4a3d13}.hero-stats strong{font-size:17px;color:var(--tinta)}.tombol-kuning,.tombol-gelap,.tombol-garis,.tombol-merah-garis,.tombol-mini{border-radius:12px;font-weight:700}.tombol-kuning{background:var(--kuning);border:0;color:var(--tinta);padding:10px 16px;font-size:13px;box-shadow:0 2px 0 var(--kuning-tua);transition:transform .12s ease}.tombol-kuning:hover{transform:translateY(-1px)}.tombol-kuning:disabled,.tombol-gelap:disabled,.tombol-garis:disabled{opacity:.6;cursor:progress;transform:none}.tombol-kuning.besar,.tombol-gelap.besar{width:100%;padding:14px 18px;font-size:15px}.tombol-gelap{background:var(--tinta);color:#fff;border:0;padding:12px 18px;font-size:14px}.tombol-garis{background:transparent;border:1px solid var(--garis);color:var(--tinta);padding:10px 15px;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.tombol-garis.kecil{padding:6px 12px;font-size:12px}.tombol-merah-garis{background:transparent;border:1px solid #f2c9c9;color:var(--merah);padding:10px 15px;font-size:13px}.tombol-mini{background:var(--putih);border:1px solid var(--garis);padding:5px 10px;font-size:12px}.tombol-mini.bahaya{color:var(--merah);border-color:#f2c9c9}.tombol-x{border:0;background:#0000000d;color:var(--redup);width:28px;height:28px;border-radius:50%;font-size:13px;display:grid;place-items:center;flex:none}.tombol-x:hover{background:#0000001a;color:var(--tinta)}.blok{margin-top:30px}.kepala-blok{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}.kepala-blok h1,.kepala-blok h2{font-size:clamp(19px,3.4vw,24px)}.judul-halaman{font-size:clamp(20px,3.6vw,26px)}.kecil-redup{font-size:12.5px;color:var(--redup)}.pusat{text-align:center}.jarak-atas{margin-top:16px}.chip-baris{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:16px;scrollbar-width:none}.chip-baris::-webkit-scrollbar{display:none}.chip-pilih{border:1px solid var(--garis);background:var(--putih);color:var(--redup);border-radius:999px;padding:8px 15px;font-size:13px;font-weight:600;white-space:nowrap}.chip-pilih.aktif{background:var(--tinta);border-color:var(--tinta);color:#fff}.chip{display:inline-block;background:var(--kuning-lembut);color:#7a5c00;border-radius:999px;padding:4px 11px;font-size:11.5px;font-weight:700}.grid-karya{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:14px}.kartu-karya{background:var(--putih);border-radius:18px;overflow:hidden;box-shadow:var(--bayang-lembut);border:1px solid var(--garis);display:flex;flex-direction:column;transition:transform .15s ease,box-shadow .15s ease}.kartu-karya:hover{transform:translateY(-3px);box-shadow:var(--bayang)}.tutup-karya{position:relative;display:block;width:100%;aspect-ratio:4 / 3;border:0;padding:0;background:var(--kuning-lembut);overflow:hidden}.tutup-karya img{width:100%;height:100%;object-fit:cover;display:block}.emoji-besar{display:grid;place-items:center;width:100%;height:100%;font-size:46px}.label-kategori{position:absolute;left:8px;top:8px;background:#fffffff2;border-radius:999px;padding:3px 9px;font-size:10.5px;font-weight:700;color:#6b5300}.isi-kartu{padding:11px 12px 12px;display:flex;flex-direction:column;gap:4px;flex:1}.isi-kartu h3{font-size:14px;cursor:pointer}.toko-kecil{font-size:12px;color:var(--redup)}.baris-nilai{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.bintang{display:inline-flex;gap:1px;font-size:15px;line-height:1}.bintang.kecil{font-size:12px}.bintang-isi{color:#ffb400}.bintang-kosong{color:#ded6c6}.kaki-kartu{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px}.poin{font-weight:800;font-size:15px}.poin small{font-size:10.5px;font-weight:600;color:var(--redup)}.poin.kecil{font-size:13px}.kaki-kartu .tombol-kuning{padding:7px 11px;font-size:12px}.kosong{text-align:center;padding:40px 18px;background:var(--putih);border:1px dashed var(--garis);border-radius:20px;display:flex;flex-direction:column;align-items:center;gap:8px}.emoji-kosong{font-size:34px}.kosong h3{font-size:16px}.kosong p{font-size:13px;color:var(--redup);max-width:380px}.latar-dialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#16120a80;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:flex-end;justify-content:center;padding:0;animation:pudar .15s ease}@keyframes pudar{0%{opacity:0}}.kartu-dialog{background:var(--putih);width:100%;max-height:92vh;overflow-y:auto;border-radius:22px 22px 0 0;box-shadow:0 -10px 40px #00000040;animation:naik .2s ease}@keyframes naik{0%{transform:translateY(22px);opacity:.6}}.kepala-dialog{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--garis);background:var(--putih)}.kepala-dialog h3{font-size:16px}.isi-dialog{padding:16px 18px 24px}.detail-karya{display:grid;gap:16px}.detail-visual{border-radius:16px;overflow:hidden;background:var(--kuning-lembut)}.detail-visual img{width:100%;display:block;aspect-ratio:4 / 3;object-fit:cover}.emoji-jumbo{display:grid;place-items:center;aspect-ratio:4 / 3;font-size:70px}.detail-info{display:flex;flex-direction:column;gap:8px}.detail-info h2{font-size:20px}.deskripsi{font-size:13.5px;color:#4a4238;white-space:pre-wrap}.kotak-poin{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--kuning-lembut);border-radius:16px;padding:13px 15px;margin-top:4px}.kotak-poin strong{font-size:18px;display:block}.kotak-poin .tombol-kuning{padding:11px 16px;font-size:13.5px}.catatan-ulasan{background:#f7f4ee;border-radius:12px;padding:10px 12px}.blok-ulasan{margin-top:20px;border-top:1px solid var(--garis);padding-top:14px}.blok-ulasan h4{font-size:14px;margin-bottom:8px}.daftar-ulasan{list-style:none;margin:0;padding:0;display:grid;gap:10px}.daftar-ulasan li{background:#faf7f1;border-radius:14px;padding:11px 13px}.kepala-ulasan{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}.kepala-ulasan strong{font-size:13px}.daftar-ulasan p{font-size:13px;color:#4a4238}.pilih-bintang{display:flex;gap:3px;margin:4px 0}.pilih-bintang button{border:0;background:none;font-size:24px;line-height:1;padding:0 2px}.form-admin,.kartu-form{display:flex;flex-direction:column;gap:12px}.kartu-form{background:var(--putih);border:1px solid var(--garis);border-radius:18px;padding:16px;margin-bottom:16px;box-shadow:var(--bayang-lembut)}.kartu-form.dalam{background:#fdfbf6;box-shadow:none}.kartu-form h3{font-size:15px}label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:700;color:#57503f}input,textarea,select{font-family:inherit;font-size:14px;font-weight:400;color:var(--tinta);border:1px solid var(--garis);border-radius:12px;padding:11px 13px;background:var(--putih);width:100%}input:focus,textarea:focus,select:focus{outline:2px solid var(--kuning);border-color:var(--kuning-tua)}textarea{resize:vertical;min-height:60px}.baris-form{display:grid;grid-template-columns:1fr;gap:12px}.baris-tombol{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.tombol-tumpuk{display:grid;gap:8px}.kartu-identitas{display:flex;align-items:center;gap:12px;background:var(--kuning-lembut);border-radius:16px;padding:14px}.avatar{width:42px;height:42px;border-radius:50%;background:var(--putih);display:grid;place-items:center;font-size:20px}.pesan-galat{font-size:12.5px;color:var(--merah);background:#fdecec;border-radius:10px;padding:9px 12px}.kotak-info{background:var(--kuning-lembut);border-radius:14px;padding:12px 14px;font-size:13px;color:#6b5300;margin-bottom:16px}.daftar-toko{display:grid;gap:16px}.kartu-toko{background:var(--putih);border:1px solid var(--garis);border-radius:20px;padding:16px;box-shadow:var(--bayang-lembut);display:flex;flex-direction:column;gap:10px}.kepala-toko{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.identitas-toko{display:flex;align-items:center;gap:11px}.avatar-toko{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:21px;background:var(--kuning-lembut);flex:none}.identitas-toko h3{font-size:15px}.aksi-toko{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}.aksi-toko .tombol-kuning{padding:8px 13px;font-size:12.5px}.desk-toko{font-size:13px;color:var(--redup)}.grid-karya.kecil{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.kartu-karya.ringkas{flex-direction:row;padding:8px;gap:10px;align-items:stretch;box-shadow:none;background:#fdfbf6}.kartu-karya.ringkas:hover{transform:none}.visual-ringkas{width:62px;border-radius:12px;display:grid;place-items:center;font-size:24px;overflow:hidden;flex:none}.visual-ringkas img{width:100%;height:100%;object-fit:cover}.isi-ringkas{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.isi-ringkas strong{font-size:13px}.isi-ringkas .baris-tombol{gap:6px;margin-top:2px}.layout-keranjang{display:grid;gap:16px}.daftar-keranjang{display:grid;gap:10px;align-content:start}.baris-keranjang{display:flex;align-items:center;gap:11px;background:var(--putih);border:1px solid var(--garis);border-radius:16px;padding:10px}.visual-keranjang{width:58px;height:58px;border-radius:12px;display:grid;place-items:center;font-size:24px;overflow:hidden;flex:none}.visual-keranjang img{width:100%;height:100%;object-fit:cover}.info-keranjang{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.info-keranjang strong{font-size:13.5px}.atur-qty{display:flex;align-items:center;gap:2px;background:var(--kuning-lembut);border-radius:999px;padding:3px;flex:none}.atur-qty button{width:26px;height:26px;border-radius:50%;border:0;background:var(--putih);font-size:15px;font-weight:700;line-height:1}.atur-qty span{min-width:20px;text-align:center;font-size:13px;font-weight:700}.ringkasan-kuning{background:linear-gradient(160deg,#fff3c9,#ffd24d);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:10px;align-self:start;box-shadow:var(--bayang-lembut)}.ringkasan-kuning h3{font-size:15px}.baris-ringkas{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:#4a3d13}.baris-ringkas.total{border-top:1px dashed rgba(74,61,19,.35);padding-top:9px;font-size:15px;color:var(--tinta)}.baris-ringkas.total strong{font-size:19px}.label-catatan{font-size:12px;color:#4a3d13}.ringkasan-kuning input,.ringkasan-kuning textarea{background:#ffffffe6;border-color:#4a3d1333}.daftar-pesanan{display:grid;gap:14px}.kartu-pesanan{background:var(--putih);border:1px solid var(--garis);border-radius:18px;padding:14px;box-shadow:var(--bayang-lembut);display:flex;flex-direction:column;gap:10px}.kepala-pesanan{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}.kepala-pesanan strong{font-size:14px}.kanan-pesanan{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.label-status{font-size:11px;font-weight:800;border-radius:999px;padding:4px 10px;background:#f1ece1;color:#6b6355}.label-status.diproses{background:#e8f1ff;color:#1f5fbb}.label-status.selesai{background:#e4f6ea;color:var(--hijau)}.label-status.menunggu{background:var(--kuning-lembut);color:#8a6500}.label-wajib{font-size:11px;font-weight:800;border-radius:999px;padding:4px 10px;background:#fdecec;color:var(--merah)}.item-pesanan{list-style:none;margin:0;padding:0;display:grid;gap:10px}.item-pesanan li{border-bottom:1px dashed var(--garis);padding-bottom:8px}.item-pesanan li:last-child{border-bottom:0;padding-bottom:0}.baris-item{display:flex;align-items:center;gap:10px}.emoji-item{width:36px;height:36px;border-radius:10px;background:var(--kuning-lembut);display:grid;place-items:center;font-size:17px;flex:none}.info-item{flex:1;min-width:0}.info-item strong{font-size:13px}.kotak-ulasan{margin-top:8px;background:#fdf8ee;border:1px solid #f5e9cf;border-radius:14px;padding:11px 12px;display:flex;flex-direction:column;gap:7px;align-items:flex-start}.kotak-ulasan.selesai{background:#eefaf1;border-color:#d6eede}.judul-ulasan{font-size:12.5px;font-weight:800;color:#8a6500}.kotak-ulasan textarea{width:100%;font-size:13px}.kotak-ulasan .tombol-kuning{padding:8px 14px;font-size:12.5px}.catatan-pesanan{font-size:12.5px;color:var(--redup);background:#f7f4ee;border-radius:12px;padding:9px 12px}.kaki-pesanan{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;border-top:1px solid var(--garis);padding-top:10px}.total-kecil{font-size:13px;color:var(--redup)}.total-kecil strong{color:var(--tinta);font-size:15px}.kaki-halaman{display:flex;gap:12px;align-items:flex-start;padding:20px clamp(14px,4vw,32px) 96px;border-top:1px solid var(--garis);background:var(--putih);font-size:12.5px;color:var(--redup)}.nav-bawah{position:fixed;bottom:0;left:0;right:0;z-index:40;display:flex;background:#fffffff7;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--garis);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}.tautan-bawah{flex:1;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10.5px;font-weight:700;color:var(--redup);padding:6px 2px;border-radius:12px}.tautan-bawah.aktif{color:var(--tinta);background:var(--kuning-lembut)}.ikon-nav{position:relative;font-size:18px}.ikon-nav .lencana{position:absolute;top:-4px;right:-8px}.toast{position:fixed;left:50%;bottom:86px;transform:translate(-50%);z-index:80;background:var(--tinta);color:#fff;padding:11px 18px;border-radius:999px;font-size:13px;font-weight:600;box-shadow:0 10px 30px #00000040;max-width:90vw;text-align:center;animation:naik .2s ease}@media (min-width: 760px){.navigasi{display:flex}.tombol-murid{display:inline-flex;align-items:center}.nav-bawah{display:none}main{padding-bottom:0}.kaki-halaman{padding-bottom:24px}.toast{bottom:28px}.latar-dialog{align-items:center;padding:24px}.kartu-dialog{border-radius:22px;max-height:88vh}.detail-karya{grid-template-columns:1fr 1fr;gap:20px}.blok-ulasan{grid-column:1 / -1}.baris-form{grid-template-columns:1fr auto;align-items:end}.layout-keranjang{grid-template-columns:1.55fr 1fr;align-items:start}.grid-karya{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px}.ringkasan-kuning{position:sticky;top:84px}}