:root{--black:#111;--black-2:#1a1a1a;--black-3:#2a2a2a;--red:#ee4d2d;--red-dark:#d73211;--red-soft:#fff1ee;--text:#222;--muted:#757575;--line:#e8e8e8;--bg:#f5f5f5;--white:#fff;--star:#ffb400;--font:"Figtree", system-ui, sans-serif;--font-brand:"Syne", sans-serif;--max:1200px;--header-h:72px;--ease:cubic-bezier(.22, 1, .36, 1);--shadow:0 1px 2px #0000000f;--shadow-card:0 1px 4px #00000014}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{min-width:320px;font-family:var(--font);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0);margin:0;font-size:14px;line-height:1.45}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,select{font:inherit}button{cursor:pointer;background:0 0;border:none}p,h1,h2,h3{margin:0}ul{margin:0;padding:0;list-style:none}#root{min-height:100svh}.ongkir{box-shadow:var(--shadow);background:#fff;border-radius:4px;padding:1.15rem 1.2rem 1.35rem}.ongkir-head{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:1rem;padding-bottom:.85rem;display:flex}.ongkir-mode{color:#555;white-space:nowrap;background:#f0f0f0;border-radius:3px;padding:.35rem .55rem;font-size:11px;font-weight:700}.ongkir-mode.account{color:#2e7d32;background:#e8f5e9}.ongkir-dims{gap:.45rem;display:grid}.ongkir-dims-label{color:#444;font-size:.82rem;font-weight:700}.ongkir-row.three{grid-template-columns:repeat(3,1fr)}.ongkir-accuracy{color:var(--muted);margin-bottom:.75rem;font-size:.8rem;line-height:1.4}.ongkir-results li.cheapest{background:#fff8f6;border-color:#f0cfc7}.ongkir-kicker{color:var(--red);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.35rem;font-size:11px;font-weight:800}.ongkir-head h2{font-family:var(--font-brand);letter-spacing:-.03em;margin-bottom:.25rem;font-size:1.25rem}.ongkir-head p{color:var(--muted);font-size:.92rem}.ongkir-form{gap:.85rem;display:grid}.ongkir-field{gap:.35rem;display:grid;position:relative}.ongkir-field label,.ongkir-row label{color:#444;font-size:.82rem;font-weight:700}.ongkir-field input,.ongkir-row input{border:1px solid var(--line);width:100%;color:var(--text);background:#fff;border-radius:3px;padding:.7rem .8rem}.ongkir-field input:focus,.ongkir-row input:focus{border-color:var(--red);outline:2px solid #ee4d2d33}.ongkir-hint{color:var(--muted);font-size:.78rem}.ongkir-suggest{z-index:20;border:1px solid var(--line);background:#fff;border-radius:4px;max-height:240px;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow:auto;box-shadow:0 8px 24px #0000001f}.ongkir-suggest button{text-align:left;border-bottom:1px solid #f0f0f0;gap:.15rem;width:100%;padding:.65rem .75rem;display:grid}.ongkir-suggest button:hover{background:#fff1ee}.ongkir-suggest strong{color:#111;font-size:.88rem}.ongkir-suggest span{color:var(--muted);font-size:.78rem}.ongkir-row{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.ongkir-row label{gap:.35rem;display:grid}.ongkir-error{color:#c62828;background:#fff5f5;border:1px solid #ffcdd2;border-radius:3px;padding:.55rem .7rem;font-size:.85rem}.ongkir-submit{border:none;width:100%}.ongkir-results{border-top:1px solid var(--line);margin-top:1.1rem;padding-top:1rem}.ongkir-results-head{justify-content:space-between;align-items:baseline;gap:.75rem;margin-bottom:.65rem;display:flex}.ongkir-results-head h3{font-family:var(--font);font-size:.95rem;font-weight:800}.ongkir-results-head span{color:var(--muted);font-size:.78rem}.ongkir-results ul{gap:.45rem;display:grid}.ongkir-results li{border:1px solid var(--line);background:#fafafa;border-radius:3px;justify-content:space-between;align-items:center;gap:.75rem;padding:.7rem .75rem;display:flex}.ongkir-results li:first-child{background:#fff8f6;border-color:#f0cfc7}.ongkir-results strong{font-size:.9rem;display:block}.ongkir-results li>div>span{color:var(--muted);font-size:.78rem}.ongkir-price{text-align:right}.ongkir-price strong{color:var(--red);font-size:1rem}.ongkir-price em{color:var(--muted);font-size:.75rem;font-style:normal;text-decoration:line-through;display:block}@media (width<=560px){.ongkir-row,.ongkir-row.three{grid-template-columns:1fr}.ongkir-head{flex-direction:column;align-items:stretch}.ongkir-results li{flex-wrap:wrap;align-items:flex-start}.ongkir-price{text-align:left;justify-content:space-between;align-items:baseline;gap:.5rem;width:100%;display:flex}}.checkout-backdrop{z-index:80;background:#0000008c;place-items:end center;padding:0;display:grid;position:fixed;inset:0}@media (width>=720px){.checkout-backdrop{place-items:center;padding:1rem}}.checkout-panel{background:#fff;border-radius:12px 12px 0 0;width:min(100%,520px);max-height:min(94svh,820px);overflow:auto;box-shadow:0 -8px 32px #0003}@media (width>=720px){.checkout-panel{border-radius:8px;box-shadow:0 16px 48px #00000040}}.checkout-head{z-index:2;color:#fff;background:#111;justify-content:space-between;align-items:flex-start;gap:.75rem;padding:1rem 1.15rem;display:flex;position:sticky;top:0}.checkout-kicker{letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin-bottom:.2rem;font-size:11px;font-weight:800}.checkout-head h2{font-family:var(--font-brand);letter-spacing:-.03em;font-size:1.25rem}.checkout-close{color:#fff;padding:.25rem .4rem;font-size:1.15rem}.checkout-form{gap:.85rem;padding:1.1rem 1.15rem 1.5rem;display:grid}.checkout-hint{color:var(--muted);font-size:.88rem;line-height:1.45}.checkout-form>label{color:#444;gap:.35rem;font-size:.82rem;font-weight:700;display:grid}.checkout-form input,.checkout-form textarea{border:1px solid var(--line);width:100%;font:inherit;color:var(--text);resize:vertical;border-radius:3px;padding:.7rem .8rem;font-weight:500}.checkout-form input:focus,.checkout-form textarea:focus{border-color:var(--red);outline:2px solid #ee4d2d33}.checkout-ship{border:1px solid var(--line);background:#fafafa;border-radius:6px;padding:.85rem}.checkout-ship-head{justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.65rem;display:flex}.checkout-ship-head h3{font-family:var(--font);font-size:.95rem;font-weight:800}.checkout-ship-head span{color:var(--muted);font-size:.78rem}.checkout-rates{gap:.4rem;max-height:220px;display:grid;overflow:auto}.checkout-rates label{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:4px;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;padding:.55rem .6rem;display:grid}.checkout-rates label.active{border-color:var(--red);background:#fff8f6}.rate-info{gap:.1rem;min-width:0;display:grid}.rate-info strong{color:#111;font-size:.85rem}.rate-info em{color:var(--muted);font-size:.75rem;font-style:normal}.rate-price{color:var(--red);white-space:nowrap;font-size:.9rem;font-weight:800}.checkout-summary{border-top:1px solid var(--line);gap:.4rem;padding-top:.35rem;display:grid}.checkout-summary>div{color:#555;justify-content:space-between;font-size:.9rem;display:flex}.checkout-summary .grand{color:#111;padding-top:.35rem;font-size:1.05rem}.checkout-summary .grand strong{color:var(--red);font-size:1.2rem}.checkout-submit{border:none;width:100%;margin-top:.25rem}.shop{flex-direction:column;min-height:100svh;display:flex}.topbar{background:var(--black);color:#ffffffbf;font-size:12px}.topbar-inner{width:min(100% - 1.5rem, var(--max));justify-content:space-between;align-items:center;gap:1rem;margin:0 auto;padding:.4rem 0;display:flex}.topbar-links{gap:1rem;display:flex}.topbar-links a:hover{color:var(--red)}.header{z-index:40;background:var(--black);color:#fff;padding-top:env(safe-area-inset-top,0);position:sticky;top:0;box-shadow:0 2px 8px #00000040}.header-inner{width:min(100% - 1.5rem, var(--max));grid-template-columns:auto 1fr auto;align-items:center;gap:1.25rem;margin:0 auto;padding:.85rem 0 .55rem;display:grid}.logo{font-family:var(--font-brand);letter-spacing:-.05em;white-space:nowrap;font-size:1.55rem;font-weight:800}.logo span{color:var(--red)}.brand{align-items:center;gap:.55rem;min-width:0;display:flex}.brand-logo{object-fit:cover;background:#000;border-radius:50%;flex-shrink:0;width:48px;height:48px}.brand-text{font-family:var(--font-brand);letter-spacing:-.05em;white-space:nowrap;font-size:1.35rem;font-weight:800}.brand-text span{color:var(--red)}.footer-brand{align-items:center;gap:.75rem;margin-bottom:.65rem;display:flex}.footer-brand img{background:#000;border-radius:50%}.footer-brand strong{color:#fff;font-family:var(--font-brand);font-size:1.1rem;display:block}.footer-brand p{color:#ffffff8c;font-size:.8rem}.search{border:2px solid var(--red);background:#fff;border-radius:3px;align-items:stretch;min-width:0;display:flex;overflow:hidden}.search input{min-width:0;color:var(--text);border:none;outline:none;flex:1;padding:.7rem .9rem}.search input::placeholder{color:#9a9a9a}.search-btn{background:var(--red);color:#fff;place-items:center;padding:0 1.1rem;transition:background .2s;display:grid}.search-btn:hover{background:var(--red-dark)}.header-actions{align-items:center;gap:.75rem;display:flex}.nav-text{color:#ffffffbf;white-space:nowrap;cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:.88rem;font-weight:600}.nav-text:hover{color:#fff}.header-simple .header-inner{padding:.75rem 0}.header-simple .suggest{display:none}@keyframes landing-rise{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes landing-drift{0%,to{transform:scale(1.02)translate(0,0)}50%{transform:scale(1.06)translate(1.5%,-1%)}}.landing{color:#fff;isolation:isolate;align-items:end;min-height:min(92svh,820px);display:grid;position:relative;overflow:hidden}.landing-media{z-index:-2;background:#0a0a0a;position:absolute;inset:0}.landing-media img{object-fit:cover;object-position:center;opacity:.45;width:100%;height:100%;animation:18s ease-in-out infinite landing-drift}.landing-media:after{content:"";background:linear-gradient(#0a0a0a59 0%,#0a0a0a8c 40%,#0a0a0aeb 100%),linear-gradient(90deg,#0a0a0aa6 0%,#0000 55%);position:absolute;inset:0}.landing-inner{width:min(100% - 2rem, var(--max));gap:.85rem;max-width:34rem;margin:0 auto;padding:4.5rem 0 3.5rem;display:grid}.landing-mark{object-fit:cover;width:72px;height:72px;animation:landing-rise .7s var(--ease) both;background:#000;border-radius:50%}.landing-brand{font-family:var(--font-brand);letter-spacing:-.06em;animation:landing-rise .75s var(--ease) 80ms both;font-size:clamp(3rem,10vw,5.5rem);font-weight:800;line-height:.92}.landing-brand span{color:var(--red)}.landing h1{font-family:var(--font-brand);letter-spacing:-.03em;max-width:18ch;animation:landing-rise .75s var(--ease) .16s both;font-size:clamp(1.35rem,3.2vw,1.85rem);font-weight:700;line-height:1.2}.landing-lead{color:#ffffffc7;max-width:32ch;animation:landing-rise .75s var(--ease) .24s both;font-size:1.05rem;line-height:1.5}.landing-cta{animation:landing-rise .75s var(--ease) .32s both;flex-wrap:wrap;gap:.65rem;padding-top:.5rem;display:flex}.btn{transition:transform .3s var(--ease), background .2s ease;cursor:pointer;color:inherit;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:.85rem 1.25rem;font-family:inherit;font-size:.95rem;font-weight:700;display:inline-flex}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--red);color:#fff}.btn-ghost-light{color:#fff;outline:1.5px solid #ffffff73}.btn-ghost-light:hover{background:#ffffff14;outline-color:#fff}.steps{border-bottom:1px solid var(--line);background:#fff}.steps-inner{width:min(100% - 2rem, var(--max));margin:0 auto;padding:2.25rem 0 2.5rem}.steps-inner h2{font-family:var(--font-brand);letter-spacing:-.03em;margin-bottom:1.35rem;font-size:clamp(1.35rem,3vw,1.75rem)}.steps-list{counter-reset:none;gap:1rem;display:grid}@media (width>=800px){.steps-list{grid-template-columns:repeat(3,1fr);gap:1.5rem}}.steps-list li{grid-template-columns:auto 1fr;align-items:start;gap:.85rem;display:grid}.steps-list li>span{background:var(--black);color:#fff;width:2rem;height:2rem;font-family:var(--font-brand);border-radius:4px;place-items:center;font-size:.9rem;font-weight:800;display:grid}.steps-list strong{margin-bottom:.2rem;font-size:1.05rem;display:block}.steps-list p{color:var(--muted);font-size:.92rem;line-height:1.4}@media (width<=720px){.nav-text{display:none}}.icon-btn{color:#fff;place-items:center;padding:.25rem;display:grid;position:relative}.icon-btn:hover{color:var(--red)}.badge-count{background:var(--red);color:#fff;border-radius:9px;place-items:center;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:700;line-height:1;display:grid;position:absolute;top:-4px;right:-8px}.suggest{padding-bottom:.55rem}.suggest-inner{width:min(100% - 1.5rem, var(--max));scrollbar-width:none;gap:.85rem;margin:0 auto;padding-left:max(0px,8.5rem);display:flex;overflow-x:auto}.suggest-inner::-webkit-scrollbar{display:none}.suggest button{color:#ffffff8c;white-space:nowrap;font-size:12px}.suggest button:hover{color:#fff}.main{width:min(100% - 1.5rem, var(--max));flex:1;gap:1rem;margin:0 auto;padding:1.1rem 0 2.5rem;display:grid}.hero-row{gap:.75rem;display:grid}@media (width>=900px){.hero-row{grid-template-columns:1.7fr 1fr;min-height:280px}}.banner{background:var(--black);border-radius:4px;min-height:200px;position:relative;overflow:hidden}.banner img{object-fit:cover;opacity:.55;width:100%;height:100%;min-height:200px}@media (width>=900px){.banner img{min-height:280px}}.banner-copy{color:#fff;background:linear-gradient(#0000,#000000d9);padding:1.5rem;position:absolute;inset:auto 0 0}.banner-kicker{color:var(--red);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.35rem;font-size:12px;font-weight:800}.banner-copy h1{font-family:var(--font-brand);letter-spacing:-.03em;margin-bottom:.3rem;font-size:clamp(1.6rem,3vw,2.2rem)}.banner-side{gap:.75rem;display:grid}.mini-banner{background:var(--black-2);border-radius:4px;min-height:95px;position:relative;overflow:hidden}.mini-banner img{object-fit:cover;opacity:.6;width:100%;height:100%;min-height:95px}.mini-banner span{color:#fff;font-size:.95rem;font-weight:700;position:absolute;bottom:.75rem;left:.9rem}.cats{scrollbar-width:none;gap:.5rem;padding:.15rem 0;display:flex;overflow-x:auto}.cats::-webkit-scrollbar{display:none}.cat-chip{background:var(--white);border:1px solid var(--line);color:var(--text);border-radius:3px;flex:none;padding:.55rem 1rem;font-size:13px;font-weight:600;transition:border-color .2s,color .2s,background .2s}.cat-chip:hover{border-color:var(--red);color:var(--red)}.cat-chip.active{background:var(--red);border-color:var(--red);color:#fff}.flash{background:var(--white);box-shadow:var(--shadow);border-radius:4px;padding:1rem}.flash-head{justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.85rem;display:flex}.flash-head h2{font-family:var(--font-brand);letter-spacing:-.03em;font-size:1.25rem}.flash-head h2 span{color:var(--red)}.flash-head p{color:var(--muted);font-size:12px;font-weight:600}.flash-rail{gap:.65rem;padding-bottom:.25rem;display:flex;overflow-x:auto}.flash-item{background:var(--bg);text-align:left;transition:transform .2s var(--ease);border-radius:3px;flex:0 0 120px;position:relative;overflow:hidden}.flash-item:hover{transform:translateY(-2px)}.flash-item img{aspect-ratio:1;object-fit:cover;width:100%}.flash-item strong{color:var(--red);padding:.45rem .5rem .15rem;font-size:13px;display:block}.flash-item em{background:var(--red);color:#fff;padding:.2rem .35rem;font-size:11px;font-style:normal;font-weight:700;position:absolute;top:0;right:0}#home,#cara-order,#cek-ongkir,#katalog{scroll-margin-top:5.5rem}.catalog{background:var(--white);box-shadow:var(--shadow);border-radius:4px;padding:1rem}.catalog-head{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.85rem;display:flex}.catalog-head h2{font-family:var(--font-brand);align-items:baseline;gap:.55rem;font-size:1.2rem;display:flex}.catalog-head h2 span{font-family:var(--font);color:var(--muted);font-size:13px;font-weight:500}.sort{color:var(--muted);align-items:center;gap:.5rem;font-size:13px;display:flex}.sort select{border:1px solid var(--line);color:var(--text);background:#fff;border-radius:3px;padding:.45rem .6rem}.grid{grid-template-columns:repeat(2,1fr);gap:.65rem;display:grid}@media (width>=640px){.grid{grid-template-columns:repeat(3,1fr)}}@media (width>=960px){.grid{grid-template-columns:repeat(4,1fr);gap:.75rem}}.card{background:var(--white);border:1px solid var(--line);transition:box-shadow .2s ease, transform .25s var(--ease);border-radius:3px;flex-direction:column;display:flex;overflow:hidden}.card:hover{box-shadow:var(--shadow-card);border-color:#f0cfc7;transform:translateY(-2px)}.card-media{background:var(--bg);width:100%;padding:0;display:block;position:relative}.card-media img{aspect-ratio:1;object-fit:cover;width:100%}.card-badge{background:var(--black);color:#fff;letter-spacing:.02em;padding:.2rem .45rem;font-size:10px;font-weight:700;position:absolute;top:8px;left:0}.card-off{background:var(--red);color:#fff;padding:.35rem .4rem;font-size:11px;font-weight:800;line-height:1;position:absolute;top:0;right:0}.card-body{flex-direction:column;flex:1;gap:.2rem;padding:.65rem .7rem .75rem;display:flex}.card-body h3{font-family:var(--font);letter-spacing:0;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:2.7em;font-size:13px;font-weight:500;line-height:1.35;display:-webkit-box;overflow:hidden}.card-body h3 button{text-align:left;color:inherit}.card-body h3 button:hover{color:var(--red)}.card-price{color:var(--red);margin-top:.2rem;font-size:1.05rem;font-weight:800}.card-price.lg{font-size:1.55rem}.card-orig{color:var(--muted);font-size:12px;text-decoration:line-through}.card-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:.45rem;margin-top:.15rem;font-size:12px;display:flex}.stars{color:var(--star);align-items:center;gap:.2rem;font-weight:700;display:inline-flex}.card-loc{color:var(--muted);font-size:11px}.btn-cart{border:1px solid var(--red);width:100%;color:var(--red);padding-top:.55rem;border-radius:3px;margin-top:auto;padding-block:.45rem;font-size:12px;font-weight:700;transition:background .2s,color .2s}.btn-cart:hover{background:var(--red);color:#fff}.btn-red{background:var(--red);border:none;border-radius:3px;justify-content:center;align-items:center;padding:.75rem 1.1rem;font-weight:700;transition:background .2s;display:inline-flex;color:#fff!important}.btn-red:hover:not(:disabled){background:var(--red-dark)}.btn-red:disabled{opacity:.45;cursor:not-allowed}.btn-outline{border:1px solid var(--red);color:var(--red);background:var(--red-soft);border-radius:3px;justify-content:center;align-items:center;padding:.75rem 1.1rem;font-weight:700;display:inline-flex}.btn-outline:hover{background:#ffe4de}.empty{text-align:center;justify-items:center;gap:.5rem;padding:3rem 1rem;display:grid}.empty h3{font-family:var(--font-brand);font-size:1.3rem}.empty p{color:var(--muted);margin-bottom:.75rem}.footer{background:var(--black);color:#ffffffb3;margin-top:auto}.footer-inner{width:min(100% - 1.5rem, var(--max));grid-template-columns:1fr 1fr;gap:1.5rem;margin:0 auto;padding:2rem 0 1.25rem;display:grid}.footer-inner>div:first-child{grid-column:1/-1}@media (width>=720px){.footer-inner{grid-template-columns:1.4fr 1fr 1fr}.footer-inner>div:first-child{grid-column:auto}}.footer .logo{color:#fff;margin-bottom:.5rem;display:inline-block}.footer h3{color:#fff;font-family:var(--font);letter-spacing:0;margin-bottom:.55rem;font-size:.95rem}.footer li+li{margin-top:.3rem}.footer a:hover{color:var(--red)}.copy{width:min(100% - 1.5rem, var(--max));color:#ffffff73;border-top:1px solid #ffffff1a;margin:0 auto;padding:.85rem 0 1.25rem;font-size:12px}.drawer-backdrop{opacity:0;pointer-events:none;z-index:50;background:#00000073;transition:opacity .25s;position:fixed;inset:0}.drawer-backdrop.open{opacity:1;pointer-events:auto}.drawer{z-index:60;width:min(100%,380px);height:100%;transition:transform .3s var(--ease);background:#fff;flex-direction:column;display:flex;position:fixed;top:0;right:0;transform:translate(100%);box-shadow:-4px 0 24px #00000026}.drawer.open{transform:translate(0)}.drawer-head{border-bottom:1px solid var(--line);background:var(--black);color:#fff;justify-content:space-between;align-items:center;padding:1rem 1.1rem;display:flex}.drawer-head h2{font-family:var(--font-brand);font-size:1.15rem}.drawer-head button{color:#fff;padding:.25rem;font-size:1.1rem}.drawer-body{flex:1;align-content:start;gap:.85rem;padding:1rem;display:grid;overflow-y:auto}.drawer-empty{color:var(--muted);text-align:center;padding:2rem 1rem}.cart-row{grid-template-columns:72px 1fr;gap:.75rem;display:grid}.cart-row img{object-fit:cover;background:var(--bg);border-radius:3px;width:72px;height:72px}.cart-row p{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:.25rem;font-size:13px;display:-webkit-box;overflow:hidden}.cart-row strong{color:var(--red);font-size:14px}.qty{border:1px solid var(--line);border-radius:3px;align-items:center;gap:.35rem;margin-top:.4rem;display:inline-flex;overflow:hidden}.qty button{background:var(--bg);width:28px;height:28px;font-weight:700}.qty span{text-align:center;min-width:24px;font-size:13px;font-weight:700}.drawer-foot{border-top:1px solid var(--line);gap:.75rem;padding:1rem 1.1rem 1.25rem;display:grid}.total{justify-content:space-between;align-items:baseline;display:flex}.total strong{color:var(--red);font-size:1.25rem}.modal-backdrop{z-index:70;background:#0000008c;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:4px;width:min(100%,820px);max-height:min(92svh,640px);display:grid;position:relative;overflow:auto}@media (width>=720px){.modal{grid-template-columns:1fr 1fr;overflow:hidden}}.modal-close{z-index:2;color:#fff;background:#0000008c;border-radius:3px;width:32px;height:32px;position:absolute;top:.65rem;right:.75rem}.modal>img{aspect-ratio:1;object-fit:cover;background:var(--bg);width:100%}@media (width>=720px){.modal>img{aspect-ratio:auto;height:100%}}.modal-body{flex-direction:column;gap:.35rem;padding:1.25rem 1.35rem 1.5rem;display:flex}.modal-cat{color:var(--red);text-transform:uppercase;letter-spacing:.06em;font-size:12px;font-weight:700}.modal-body h2{font-family:var(--font);letter-spacing:0;font-size:1.15rem;font-weight:700;line-height:1.35}.modal-loc{color:var(--muted);margin-top:.35rem;font-size:13px}.modal-actions{grid-template-columns:1fr 1fr;gap:.55rem;margin-top:1rem;display:grid}@media (width<=720px){.header-inner{width:min(100% - 1rem, var(--max));grid-template-columns:auto 1fr auto;gap:.5rem .65rem}.header-simple .header-inner{padding:.55rem 0}.logo{font-size:1.25rem}.brand-text{font-size:1rem}.brand-logo{width:36px;height:36px}.search input{padding:.55rem .65rem;font-size:.9rem}.search-btn{padding:0 .75rem}.nav-text{display:none}.landing{min-height:min(78svh,640px)}.landing-inner{width:min(100% - 1.25rem, var(--max));gap:.7rem;padding:2.75rem 0 2.25rem}.landing-mark{width:52px;height:52px}.landing-brand{font-size:clamp(2.4rem,14vw,3.4rem)}.landing h1{max-width:22ch;font-size:1.2rem}.landing-lead{font-size:.95rem}.landing-cta .btn{flex:auto;min-width:140px;padding:.75rem 1rem;font-size:.9rem}.steps-inner{width:min(100% - 1.25rem, var(--max));padding:1.75rem 0 2rem}.steps-inner h2{margin-bottom:1rem;font-size:1.25rem}.main{width:min(100% - 1rem, var(--max));gap:.75rem;padding:.85rem 0 2rem}.cats{margin:0 -.15rem;padding-bottom:.15rem}.catalog{border-radius:0;margin:0 -.15rem;padding:.75rem}.catalog-head{flex-direction:column;align-items:stretch;gap:.55rem;margin-bottom:.75rem;padding-bottom:.65rem}.catalog-head h2{font-size:1.05rem}.sort{justify-content:space-between;width:100%}.sort select{flex:1;max-width:60%}.grid{gap:.5rem}.card:hover{transform:none}.card-body{padding:.5rem .55rem .6rem}.card-body h3{min-height:2.6em;font-size:12px}.card-price{font-size:.95rem}.card-meta{gap:.3rem;font-size:11px}.card-loc{display:none}.btn-cart{padding-block:.4rem;font-size:11px}.ongkir{border-radius:0;margin:0 -.15rem;padding:.9rem .85rem 1.1rem}.footer-inner{width:min(100% - 1.25rem, var(--max));gap:1.25rem;padding:1.75rem 0 1.1rem}.drawer{width:min(100%,100vw)}.modal{width:min(100% - 1rem,520px);max-height:90svh;overflow:auto}.modal-actions{grid-template-columns:1fr}.suggest-inner{padding-left:0}.topbar-inner span:first-child{display:none}}@media (width>=721px) and (width<=1024px){.landing{min-height:min(85svh,720px)}.landing-inner{padding:4rem 0 3rem}.grid{grid-template-columns:repeat(3,1fr)}.main{width:min(100% - 1.75rem, var(--max))}}@media (width>=1025px){.landing{min-height:min(90svh,780px)}.landing-inner{max-width:38rem;padding:5rem 0 4rem}.card-body h3{font-size:13.5px}.main{gap:1.15rem;padding:1.35rem 0 3rem}}@media (hover:none){.card:hover,.btn:hover{transform:none}}.admin-login{background:#111;place-items:center;min-height:100svh;padding:1.5rem;display:grid}.login-card{text-align:center;color:#fff;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:8px;justify-items:center;gap:.75rem;width:min(100%,340px);padding:1.75rem 1.35rem;display:grid}.login-card img{border-radius:50%}.login-card h1{font-family:var(--font-brand);font-size:1.35rem}.login-card input{color:#fff;background:#111;border:1px solid #333;border-radius:4px;outline:none;width:100%;padding:.75rem .9rem}.login-card input:focus{border-color:var(--red)}.login-card .error{color:#ff8a7a;font-size:.85rem}.back-link{color:#ffffff8c;font-size:.88rem}.back-link:hover{color:var(--red)}.admin{background:#f4f4f4;grid-template-rows:auto auto 1fr;min-height:100svh;display:grid}.admin-bar{color:#fff;background:#111;grid-template-columns:auto 1fr auto;align-items:center;gap:.75rem;padding:.65rem 1rem;display:grid}.admin-bar-brand{align-items:center;gap:.5rem;display:flex}.admin-bar-brand img{border-radius:50%}.admin-bar-brand strong{font-family:var(--font-brand);font-size:.95rem}.live-dot{color:#aaa;background:#333;border-radius:999px;padding:.15rem .45rem;font-size:.72rem;font-weight:700}.live-dot.on{color:#81c784;background:#2e7d3240}.admin-nav{justify-self:center;width:min(100%,200px)}.admin-nav select{appearance:none;color:#fff;cursor:pointer;background:#1f1f1f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23aaa' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") right .75rem center no-repeat;border:1px solid #333;border-radius:4px;width:100%;padding:.5rem 2rem .5rem .75rem;font-family:inherit;font-size:.9rem;font-weight:600}.admin-nav select:focus{border-color:var(--red);outline:none}.admin-bar-actions{align-items:center;gap:.85rem;display:flex}.admin-bar-actions a{color:#ffffffa6;font-size:.85rem;font-weight:600}.admin-bar-actions a:hover{color:#fff}.logout{color:#ffffff80;cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:.85rem;font-weight:600}.logout:hover{color:var(--red)}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.admin-stack{gap:1rem;display:grid}@media (width<=560px){.admin-bar{grid-template-columns:1fr auto}.admin-bar-brand strong{display:none}.admin-nav{order:3;grid-column:1/-1;justify-self:stretch;width:100%}}.toast{color:#fff;border-bottom:2px solid var(--red);background:#111;padding:.55rem 1.1rem;font-size:.88rem;font-weight:600}.admin-main{box-sizing:border-box;align-content:start;gap:1rem;width:min(960px,100%);margin:0 auto;padding:1rem;display:grid}.admin-split{grid-template-columns:1fr;gap:1rem;width:100%;min-width:0;display:grid}.admin-split>.panel{width:100%;min-width:0;overflow:visible}@media (width<=860px){.admin-main{gap:.75rem;padding:.75rem}.panel{border-radius:4px;padding:.85rem .9rem 1rem}.product-list{max-height:none}.product-list-item{grid-template-columns:auto 44px 1fr;gap:.5rem}.product-list-item .row-actions{grid-column:2/-1;justify-content:flex-start}.bulk-bar{flex-direction:column;align-items:stretch}.bulk-actions{width:100%}.bulk-actions .btn-ghost{flex:1}.tt-grid{grid-template-columns:1fr}.tt-card{grid-template-columns:auto 56px 1fr}.auto-search-row{flex-direction:column}.auto-search-row .btn-primary,.auto-search-row .btn-ghost{width:100%}}@media (width>=861px){.admin-main{width:min(880px,100%);padding:1.25rem 1.5rem 2.5rem}}.panel{background:#fff;border:1px solid #e8e8e8;border-radius:6px;padding:1rem 1.1rem 1.2rem}.panel-head{border-bottom:1px solid #f0f0f0;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.85rem;padding-bottom:.65rem;display:flex}.panel-head h2{font-family:var(--font-brand);color:#111;font-size:1.05rem}.product-form{gap:.7rem;display:grid}.product-form label{color:#555;gap:.3rem;min-width:0;font-size:.8rem;font-weight:600;display:grid}.product-form input,.product-form select{box-sizing:border-box;color:#111;background:#fff;border:1px solid #ddd;border-radius:4px;width:100%;min-width:0;max-width:100%;padding:.6rem .7rem;font-size:.92rem;font-weight:500}.product-form input:focus,.product-form select:focus{border-color:var(--red);outline:2px solid #ee4d2d33}.form-row{grid-template-columns:1fr 1fr;gap:.55rem;display:grid}.form-row:has(label:nth-child(3)){grid-template-columns:1fr 1fr 1fr}@media (width<=560px){:is(.form-row,.form-row:has(label:nth-child(3))){grid-template-columns:1fr}}.file-label{color:#555;gap:.35rem;font-size:.8rem;font-weight:600;display:grid}.file-label input[type=file]{box-sizing:border-box;cursor:pointer;background:#fafafa;border:1px dashed #ccc;border-radius:4px;width:100%;padding:.55rem}.file-label input[type=file]:disabled{opacity:.6;cursor:wait}.image-upload{gap:.65rem;display:grid}.preview{background:#f7f7f7;border:1px solid #eee;border-radius:4px;align-items:center;gap:.85rem;padding:.75rem;display:flex}.preview img{object-fit:cover;background:#eee;border-radius:4px;flex-shrink:0;width:88px;height:88px}.preview-meta{justify-items:start;gap:.4rem;display:grid}.preview-meta span{color:#2e7d32;font-size:.85rem;font-weight:600}.btn-primary{background:var(--red);color:#fff;cursor:pointer;border:none;border-radius:4px;width:100%;padding:.7rem 1rem;font-family:inherit;font-weight:700}.btn-primary:hover{background:var(--red-dark)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-ghost{color:#444;cursor:pointer;background:0 0;border:1px solid #ddd;border-radius:4px;padding:.4rem .7rem;font-family:inherit;font-size:.85rem;font-weight:600}.btn-ghost:hover{border-color:var(--red);color:var(--red)}.btn-ghost.danger:hover{color:#c62828;border-color:#c62828}.list-tools{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.list-tools input{border:1px solid #ddd;border-radius:4px;min-width:140px;padding:.4rem .6rem;font-size:.88rem}.bulk-bar{background:#f7f7f7;border:1px solid #eee;border-radius:4px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.55rem;margin-bottom:.75rem;padding:.55rem .65rem;display:flex}.bulk-check{color:#444;cursor:pointer;align-items:center;gap:.45rem;font-size:.85rem;font-weight:600;display:inline-flex}.bulk-actions{flex-wrap:wrap;gap:.4rem;display:flex}.bulk-actions .btn-ghost:disabled{opacity:.4;cursor:not-allowed}.product-list{gap:.45rem;max-height:min(70vh,640px);margin:0;padding:0;list-style:none;display:grid;overflow:auto}.product-list-item{border:1px solid #f0f0f0;border-radius:4px;grid-template-columns:auto 48px 1fr auto;align-items:center;gap:.55rem;padding:.5rem;display:grid}.product-list-item.selected{background:#fff8f6;border-color:#f0cfc7}.item-check{cursor:pointer;place-items:center;display:grid}.product-list-item img{object-fit:cover;background:#f0f0f0;border-radius:4px;width:48px;height:48px}.product-list-info{min-width:0}.product-list-info strong{color:#111;white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;display:block;overflow:hidden}.product-list-info span{color:#777;margin-top:.15rem;font-size:.75rem;display:block}.row-actions{gap:.3rem;display:flex}.row-actions button{color:#333;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:3px;padding:.3rem .55rem;font-family:inherit;font-size:.75rem;font-weight:600}.row-actions button:hover{border-color:var(--red);color:var(--red)}.row-actions button.danger:hover{color:#c62828;border-color:#c62828}.empty-list{text-align:center;color:#888;padding:1.25rem;list-style:none}.shipping-note{color:#666;margin-bottom:.75rem;font-size:.88rem}.shipping-hint{color:#888;font-size:.78rem}.admin-origin{position:relative}.api-key-field{color:#555;gap:.3rem;font-size:.8rem;font-weight:600;display:grid}.api-key-field input{border:1px solid #ddd;border-radius:4px;padding:.6rem .7rem;font-weight:500}.api-key-field input:focus{border-color:var(--red);outline:2px solid #ee4d2d33}.form-actions{gap:.55rem;padding-top:.25rem;display:flex}.auto-search-row{flex-wrap:wrap;gap:.45rem;margin-bottom:.85rem;display:flex}.auto-search-row input{border:1px solid #ddd;border-radius:4px;flex:1;min-width:180px;padding:.6rem .7rem}.auto-search-row input:focus{border-color:var(--red);outline:2px solid #ee4d2d33}.auto-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.55rem;display:grid}.auto-card{text-align:left;cursor:pointer;background:#fafafa;border:1px solid #e8e8e8;border-radius:4px;grid-template-columns:56px 1fr;gap:.55rem;padding:.45rem;font-family:inherit;display:grid}.auto-card:hover{border-color:var(--red);background:#fff8f6}.auto-card img{object-fit:cover;background:#eee;border-radius:4px;width:56px;height:56px}.auto-card strong{-webkit-line-clamp:2;color:#111;-webkit-box-orient:vertical;font-size:.8rem;display:-webkit-box;overflow:hidden}.auto-card span{color:#666;margin-top:.2rem;font-size:.72rem;display:block}.tt-paste{color:#555;gap:.35rem;margin-bottom:.5rem;font-size:.8rem;font-weight:600;display:grid}.tt-paste textarea{resize:vertical;border:1px solid #ddd;border-radius:4px;padding:.6rem .7rem;font-family:inherit;font-weight:500}.tt-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.65rem;display:grid}.tt-card{cursor:pointer;background:#fafafa;border:1px solid #e8e8e8;border-radius:6px;grid-template-columns:auto 64px 1fr;align-items:start;gap:.55rem;padding:.55rem;display:grid}.tt-card.on{border-color:var(--red);background:#fff8f6}.tt-card img{object-fit:cover;background:#eee;border-radius:4px;width:64px;height:64px}.tt-card-body{gap:.2rem;min-width:0;display:grid}.tt-card-body strong{color:#111;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.82rem;display:-webkit-box;overflow:hidden}.tt-price{color:var(--red);font-size:.9rem;font-weight:700}.tt-price small{color:#999;margin-left:.35rem;font-size:.75rem;font-weight:500;text-decoration:line-through}.tt-meta,.tt-shop{color:#777;font-size:.72rem}.tt-card .btn-ghost{justify-self:start;margin-top:.25rem;padding:.25rem .5rem;font-size:.75rem}
