:root{--bg:#080810;--panel:#11111d;--panel2:#171727;--line:#2b2b42;--text:#f5f4ff;--muted:#a5a4bd;--purple:#a855f7;--cyan:#38bdf8;--pink:#f472b6;--good:#4ade80;--danger:#fb7185}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(ellipse at 20% 0%,#211039 0,transparent 35%),radial-gradient(ellipse at 95% 25%,#101e3b 0,transparent 28%),var(--bg);color:var(--text);margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}a{color:inherit;text-decoration:none}.wrap{width:min(1180px,92%);margin:auto}.topbar{z-index:10;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#090912d9;border-bottom:1px solid #ffffff12;position:sticky;top:0}.nav{justify-content:space-between;align-items:center;gap:16px;padding:14px 0;display:flex}.brand{letter-spacing:2px;font-size:1.2rem;font-weight:950}.brand span{color:var(--purple);text-shadow:0 0 20px #a855f799}.navlinks{color:var(--muted);gap:18px;font-size:.92rem;display:flex}.navlinks a:hover{color:#fff}.btn{background:linear-gradient(110deg,var(--purple),#6d5dfc);color:#fff;border-radius:12px;padding:11px 15px;font-weight:800;box-shadow:0 8px 24px #7c3aed33}.btn.ghost{border:1px solid var(--line);box-shadow:none;background:#ffffff0a}.btn.small{padding:8px 11px;font-size:.85rem}.hero{grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;min-height:410px;padding:58px 0 34px;display:grid}.eyebrow{color:#d8b4fe;background:#a855f715;border:1px solid #a855f755;border-radius:999px;align-items:center;gap:8px;padding:7px 11px;font-size:.82rem;display:inline-flex}.hero h1{letter-spacing:-2px;margin:18px 0;font-size:clamp(2.5rem,6vw,5rem);line-height:.98}.hero h1 em{color:#0000;background:linear-gradient(90deg,#c084fc,#67e8f9,#f0abfc);-webkit-background-clip:text;background-clip:text;font-style:normal}.hero p{color:var(--muted);max-width:560px;line-height:1.75}.heroactions{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.heroart{background:linear-gradient(135deg,#281344aa,#0c1d39aa),radial-gradient(circle at 50% 40%,#7c3aed55,#0000 55%);border:1px solid #a855f733;border-radius:28px;place-items:center;min-height:300px;display:grid;position:relative;overflow:hidden}.hero-video{object-fit:cover;opacity:.72;filter:grayscale()contrast(1.08);width:100%;height:100%;position:absolute;inset:0}.hero-shade{background:linear-gradient(90deg,#08081055,#08081022 45%,#08081099),linear-gradient(#0000 45%,#080810cc);position:absolute;inset:0}.heroart .orb,.heroart .orbit,.heroart .artlabel{z-index:1}.heroart .orb{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#08081038;width:145px;height:145px}.heroart .orb span{font-size:4rem}.orb{border:1px solid #c084fc77;border-radius:50%;place-items:center;width:210px;height:210px;animation:5s ease-in-out infinite float;display:grid;box-shadow:0 0 70px #7c3aed66,inset 0 0 50px #38bdf822}.orb span{filter:drop-shadow(0 0 25px #a855f7);font-size:6rem}.orbit{border:1px solid #38bdf877;border-radius:50%;width:280px;height:90px;animation:14s linear infinite spin;position:absolute;transform:rotate(-28deg)}.orbit.two{border-color:#f472b677;width:310px;animation-direction:reverse;transform:rotate(50deg)}.artlabel{color:#ddd6fe;letter-spacing:2px;font-size:.78rem;position:absolute;bottom:16px;left:18px}@keyframes float{50%{transform:translateY(-12px)}}@keyframes spin{to{rotate:360deg}}section{padding:28px 0 45px}.sectionhead{justify-content:space-between;align-items:end;gap:16px;margin-bottom:20px;display:flex}.sectionhead h2{margin:0;font-size:1.7rem}.sectionhead p{color:var(--muted);margin:7px 0 0;font-size:.92rem}.tools{flex-wrap:wrap;gap:10px;margin:18px 0;display:flex}.field{border:1px solid var(--line);color:var(--text);background:#0d0d18;border-radius:12px;outline:none;min-width:0;padding:12px 13px}.field:focus{border-color:#a855f7}.search{flex:1;min-width:190px}.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.card{border:1px solid var(--line);background:linear-gradient(#171725,#10101a);border-radius:18px;transition:all .2s;overflow:hidden}.card:hover{border-color:#a855f777;transform:translateY(-4px);box-shadow:0 14px 35px #0005}.productimg{background:radial-gradient(circle at 50% 35%,#6d28d955,#0000 65%),linear-gradient(135deg,#1b1730,#111827);border-bottom:1px solid #ffffff0d;place-items:center;height:145px;font-size:3.6rem;display:grid}.productimg img{object-fit:cover;width:100%;height:100%}.cardbody{padding:14px}.tag{color:#d8b4fe;background:#a855f71c;border:1px solid #a855f733;border-radius:999px;padding:4px 7px;font-size:.7rem}.card h3{margin:10px 0 6px;font-size:1rem}.desc{color:var(--muted);min-height:38px;font-size:.82rem;line-height:1.5}.price{margin:12px 0;font-size:1.05rem;font-weight:900}.cardactions{gap:8px;display:flex}.cardactions button{flex:1}.empty{color:var(--muted);border:1px dashed var(--line);text-align:center;border-radius:16px;grid-column:1/-1;padding:25px}.notice{color:#cbd5e1;background:#38bdf80d;border:1px solid #38bdf833;border-radius:14px;padding:14px;font-size:.88rem;line-height:1.65}.footer{border-top:1px solid var(--line);color:var(--muted);padding:28px 0;font-size:.85rem}.modalback{z-index:30;background:#000b;place-items:center;padding:16px;display:none;position:fixed;inset:0}.modalback.show{display:grid}.modal{border:1px solid var(--line);background:#11111d;border-radius:20px;width:min(650px,100%);max-height:90vh;padding:22px;overflow:auto;box-shadow:0 25px 90px #0009}.modalhead{justify-content:space-between;align-items:center;gap:12px;display:flex}.modalhead h2{margin:0}.close{color:#fff;border:1px solid var(--line);background:#ffffff12;border-radius:10px;padding:8px 12px}.formgrid{grid-template-columns:1fr 1fr;gap:12px;margin-top:16px;display:grid}.formgrid .full{grid-column:1/-1}.label{color:var(--muted);margin:0 0 6px;font-size:.82rem;display:block}.stack{gap:12px;margin-top:16px;display:grid}.row{border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;display:flex}.row small{color:var(--muted);margin-top:4px;display:block}.qty{align-items:center;gap:8px;display:flex}.qty button{color:#fff;background:#ffffff12;border-radius:8px;width:28px;height:28px}.adminarea{display:none}.adminarea.show{display:block}.tabs{flex-wrap:wrap;gap:8px;margin:15px 0;display:flex}.tab{color:var(--muted);border:1px solid var(--line);background:#ffffff0a;border-radius:10px;padding:9px 12px}.tab.active{color:#fff;background:#a855f71c;border-color:#a855f7}.adminlist{gap:9px;display:grid}.adminitem{border:1px solid var(--line);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:12px;display:flex}.adminitem p{color:var(--muted);margin:4px 0 0;font-size:.82rem}.status{color:#fcd34d;background:#fbbf241c;border-radius:999px;padding:5px 8px;font-size:.75rem}.muted{color:var(--muted)}.toast{opacity:0;pointer-events:none;color:#171321;z-index:50;text-align:center;background:#f5f3ff;border-radius:12px;max-width:90%;padding:12px 18px;font-weight:750;transition:all .25s;position:fixed;bottom:18px;left:50%;transform:translate(-50%,20px)}.toast.show{opacity:1;transform:translate(-50%)}.payoptions{grid-template-columns:1fr 1fr;gap:10px;display:grid}.payoption{border:1px solid var(--line);text-align:left;color:#fff;background:#ffffff06;border-radius:12px;padding:13px}.payoption.selected{border-color:var(--purple);background:#a855f71a}.hidden{display:none!important}@media (width<=850px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr;padding-top:38px}.heroart{min-height:240px}.navlinks{display:none}}@media (width<=480px){.grid{gap:10px}.productimg{height:120px}.cardbody{padding:11px}.cardactions{flex-direction:column}.hero h1{letter-spacing:-1px}.formgrid{grid-template-columns:1fr}.formgrid .full{grid-column:auto}.sectionhead{flex-direction:column;align-items:start}.nav .btn{padding:9px 10px}}.steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.step{border:1px solid var(--line);background:linear-gradient(#171725,#10101a);border-radius:16px;padding:16px}.step b{margin:8px 0 6px;display:block}.step p{color:var(--muted);margin:0;font-size:.85rem;line-height:1.55}.step .num{color:#d8b4fe;background:#a855f71c;border:1px solid #a855f755;border-radius:10px;place-items:center;width:30px;height:30px;font-weight:900;display:inline-grid}.skeleton{border:1px solid var(--line);background:linear-gradient(90deg,#141421,#1b1b2c,#141421) 0 0/200% 100%;border-radius:18px;height:290px;animation:1.4s infinite shimmer}@keyframes shimmer{to{background-position:-200% 0}}.btn:disabled{opacity:.55;cursor:wait}.admin-shell{padding:34px 0 60px}.admin-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;display:flex}.admin-head h1{margin:0;font-size:1.9rem}.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0;display:grid}.stat{border:1px solid var(--line);background:linear-gradient(#171725,#10101a);border-radius:16px;padding:16px}.stat small{color:var(--muted);letter-spacing:.5px;font-size:.78rem}.stat b{margin-top:6px;font-size:1.45rem;display:block}.panel{border:1px solid var(--line);background:#11111d;border-radius:20px;padding:22px}.admin-cols{grid-template-columns:.9fr 1.1fr;align-items:start;gap:18px;display:grid}.admin-cols h3{margin-top:0}.login-card{width:min(440px,100%);margin:60px auto}.filterbar{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.status.s-Diproses{color:#7dd3fc;background:#38bdf81c}.status.s-Selesai{color:#86efac;background:#4ade801c}.status.s-Dibatalkan{color:#fda4af;background:#fb71851c}.thumb{background:#1b1730;border-radius:10px;flex:none;place-items:center;width:42px;height:42px;font-size:1.3rem;display:grid;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%}.linkbtn{color:#c4b5fd;background:0 0;padding:0;text-decoration:underline}@media (width<=850px){.steps,.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-cols{grid-template-columns:1fr}}
