:root{--p:#600010;--s:#8B1E2D;--t:#F4D9DC;--bg:#FBF1F1;--cd:#fff;--tx:#1E1819;--mu:#7a6a6c;--ln:#e9cfd2;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#1a1113;--cd:#271a1d;--tx:#f6e9ea;--mu:#b9a2a5;--t:#3a1f25;--ln:#4a2c32}}
:root[data-theme="dark"]{--bg:#1a1113;--cd:#271a1d;--tx:#f6e9ea;--mu:#b9a2a5;--t:#3a1f25;--ln:#4a2c32}
*{box-sizing:border-box;margin:0}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;background:var(--bg);color:var(--tx);padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none}
header{position:sticky;top:0;z-index:20;background:var(--p);color:#fff;padding:10px 14px;display:flex;gap:10px;align-items:center;border-radius:0 0 24px 24px}
header.sb{padding:14px;font-weight:800;font-size:17px}header.sb span{flex:1}
.lg{width:38px;height:38px;border-radius:50%;background:#f7b9bf;color:var(--p);font-weight:800;font-size:22px;display:grid;place-items:center;flex:none}
header input{flex:1;min-width:0;background:#fff;border:1.5px solid #fff;border-radius:99px;padding:8px 14px;color:#69000F;outline:0}
header input::placeholder{color:#69000F;opacity:.55}
.ic{color:#fff;font-size:18px;position:relative;padding:3px}.ic b{position:absolute;top:-3px;right:-5px;background:#ff6b78;font-size:10px;border-radius:99px;padding:1px 5px}
.av{width:34px;height:34px;border-radius:50%;background:#d9d9de;display:grid;place-items:center;flex:none;font-size:17px;color:#333}
main{max-width:1000px;margin:0 auto;padding:12px 14px}
.ch{display:flex;gap:8px;overflow-x:auto;padding:4px 0 10px}
.cp{flex:none;border:1.5px solid var(--p);color:var(--p);border-radius:99px;padding:6px 16px;font-weight:600;font-size:13px;background:var(--cd)}
@media(prefers-color-scheme:dark){.cp{color:#f6b8be;border-color:#b84a58}}
.cp.on{background:var(--p);color:#fff;border-color:var(--p)}
h2{font-size:17px;margin:14px 0 8px;color:var(--p)}h3{font-size:16px;color:var(--p);margin:14px 0 6px;cursor:pointer}
@media(prefers-color-scheme:dark){h2,h3{color:#f6b8be}}
.sc{position:relative;background:var(--cd);border-radius:20px;padding:10px 12px 12px;box-shadow:0 2px 12px #0002;margin:14px 0}.sh2{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:800;color:var(--p);margin-bottom:8px}.sh2 small{font-size:12px;font-weight:600}@media(prefers-color-scheme:dark){.sh2{color:#f6b8be}}.cl .rw,.cl .nx,.cl .stk{display:none}
.rw{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory;scroll-behavior:smooth}
.rw .cd{flex:none;width:165px;scroll-snap-align:start;border:1px solid var(--ln)}.rw .th{height:190px}.pb{display:flex;justify-content:space-between;align-items:center;margin-top:6px}.sc2{background:var(--t);color:var(--mu);border-radius:99px;padding:2px 9px;font-size:11px;font-weight:600}.in p{color:var(--mu)!important;font-weight:500!important;font-size:12px!important}
.nx{z-index:5;position:absolute;right:10px;top:calc(50% + 17px);margin-top:-19px;width:38px;height:38px;border-radius:50%;background:var(--p);color:#fff;font-size:22px;box-shadow:0 2px 8px #0005}
.gr{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:700px){.gr{grid-template-columns:repeat(4,1fr)}.rw .cd{width:200px}}
.cd{background:var(--cd);border-radius:16px;overflow:hidden;box-shadow:0 1px 6px #0002;cursor:pointer}
.th{height:150px;position:relative;display:grid;place-items:center;font-size:58px;overflow:hidden}
.th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.th i{position:absolute;font-style:normal;font-size:10px;font-weight:800;border-radius:99px;padding:3px 9px;z-index:1}
.gb{top:8px;left:8px;background:var(--p);color:#fff}.tg{top:30px;left:8px;background:#fff;color:var(--s)}.al{top:auto!important;bottom:8px;left:8px;background:#ffd36b;color:#4a3300;border-radius:6px!important}
.sz{bottom:8px;left:8px;background:#000a;color:#fff}.hr{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:50%;background:#fff;color:var(--s);font-size:15px;z-index:2}
.in{padding:8px 10px 11px}.in small{color:var(--mu);font-size:11px;display:block}.in p{font-size:13px;font-weight:600;margin:2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr{color:var(--s);font-size:15px}@media(prefers-color-scheme:dark){.pr{color:#ff9aa5}}.in s{color:var(--mu);font-size:11px}.in em{font-size:11px;color:var(--s);font-style:normal;font-weight:800}
.tp{text-align:center;margin:6px 0;border:1px solid var(--ln);border-radius:8px;padding:3px}
.bg{width:100%;background:var(--t);color:var(--p);border-radius:10px;padding:8px;font-weight:800;font-size:13px}
.hero{background:linear-gradient(120deg,var(--p),var(--s));color:#fff;border-radius:20px;padding:16px;margin-bottom:10px}
.hero h1{font-size:20px;margin:4px 0}.hero p{font-size:13px;opacity:.9}.hero button{background:#fff;color:var(--p);font-weight:800;border-radius:99px;padding:8px 16px;margin-top:10px}
.ad{background:linear-gradient(135deg,var(--t),var(--cd));border:1px solid var(--s);border-radius:20px;padding:10px 12px}
.adh{display:flex;justify-content:space-between;font-size:12px;font-weight:800;color:var(--s);margin-bottom:8px}.adh span+span{font-weight:600;color:var(--mu)}
.seg{display:flex;background:var(--t);border-radius:99px;padding:4px;margin-bottom:10px}.seg button{flex:1;padding:9px 6px;border-radius:99px;font-weight:800;font-size:13px;color:var(--mu)}.seg .on{background:var(--p);color:#fff}.seg.sl{position:relative}.seg.sl .sp{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:99px;background:var(--p);transition:transform .38s cubic-bezier(.4,0,.2,1)}.seg.sl[data-i="1"] .sp{transform:translateX(100%)}.seg.sl button{position:relative;z-index:1;transition:color .25s ease}.seg.sl .on{background:none;color:#fff}.fo{opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease}.fi{animation:fiu .32s cubic-bezier(.22,.8,.3,1)}@keyframes fiu{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.seg.sl .sp,.seg.sl button{transition:none}.fo{transition:none}.fi{animation:none}}
.bx{background:var(--cd);border-radius:20px;padding:14px;margin:10px 0;box-shadow:0 1px 6px #0001}
.bt{display:block;width:100%;background:var(--p);color:#fff;border-radius:14px;padding:12px;font-weight:800;margin-top:10px;text-align:center}.bt.o{background:var(--t);color:var(--p)}
@media(prefers-color-scheme:dark){.bt.o{color:#f6b8be}}
.two{display:flex;gap:8px}.two .bt{margin-top:10px}
.pl{display:inline-block;background:var(--t);border-radius:99px;padding:3px 10px;font-size:11px;font-weight:600;margin:0 4px 4px 0}.rd{background:#ffd9dc;color:#a0182b;font-weight:800}
label{display:block;font-size:12px;font-weight:700;margin:10px 0 4px}
.bx input:not([type=radio]):not([type=checkbox]):not([type=file]),.bx select,.bx textarea{width:100%;border:1.5px solid var(--ln);background:var(--bg);border-radius:12px;padding:9px 12px}
.cg{display:flex;gap:8px;flex-wrap:wrap}.cg button{border:1.5px solid var(--ln);border-radius:99px;padding:7px 14px;font-weight:600;font-size:13px;background:var(--bg)}.cg .on{background:var(--p);color:#fff;border-color:var(--p)}
.ss{display:flex;gap:6px;margin:8px 0;font-size:11px}.ss i{flex:1;text-align:center;padding:5px 2px;border-radius:8px;background:var(--t);font-style:normal}.ss .d{background:var(--s);color:#fff}
.mt{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.mt div{background:var(--t);border-radius:12px;padding:8px 10px;font-size:12px}.mt b{display:block;font-size:15px}
.f3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.f3 div{background:var(--t);border-radius:12px;padding:10px 4px;text-align:center;font-size:11px;font-weight:600}
.st{display:flex;gap:10px;align-items:center;padding:12px 0;border-top:1px solid var(--ln);cursor:pointer}.st>span:first-child{width:38px;height:38px;background:var(--t);border-radius:50%;display:grid;place-items:center}.st div{flex:1}.st small{color:var(--mu);font-size:12px;display:block}
.ft{text-align:center;color:var(--mu);font-size:12px;margin:18px 0}.er{color:#c0182b;font-size:12px;min-height:16px;margin-top:6px}
.lk{color:var(--p);font-weight:800;font-size:13px;cursor:pointer;text-decoration:none}.lk:hover{text-decoration:underline}.fp{text-align:right;margin-top:8px}.fp .lk{border:0!important;border-radius:0;padding:0;margin:0;background:none!important;box-shadow:none;color:#69000F!important;font-size:13px;font-weight:800}.sw{text-align:center;font-size:13px;color:var(--mu);margin:16px 0 0}.au{max-width:420px;margin:0 auto;padding-top:20px;text-align:center}.au .lg{width:64px;height:64px;font-size:38px;margin:0 auto 8px}.au .bx{text-align:left}.au h1{color:var(--p)}
nav{position:fixed;bottom:0;left:0;right:0;background:var(--p);display:flex;justify-content:space-around;align-items:flex-end;padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));border-radius:24px 24px 0 0;z-index:20}
nav button{color:#e8c4c8;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:2px;width:84px}nav button span{font-size:22px}nav .on{color:#fff;font-weight:800}
nav button{transition:margin .2s,background .2s}nav button.on{background:#a8313f;margin-top:-22px;padding:10px 0 8px;border-radius:16px;box-shadow:0 -3px 12px #0005;border:3px solid var(--bg)}
.bar{position:fixed;bottom:0;left:0;right:0;background:var(--cd);display:flex;gap:8px;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));z-index:20;box-shadow:0 -2px 10px #0002}
.bar .bt{margin:0}.bar .sq{width:54px;flex:none;background:var(--t);color:var(--p);font-size:11px;border-radius:14px;padding:4px}
.qr{width:220px;height:220px;margin:10px auto;background:#fff;padding:6px;border-radius:12px;position:relative}.qr svg{width:100%;height:100%}
.qr.x svg{filter:blur(8px) grayscale(1);opacity:.4}.qr.x::after{content:'KEDALUWARSA';position:absolute;inset:0;display:grid;place-items:center;font-weight:800;color:#a0182b;font-size:20px}
.tm{background:#ffd9dc;color:#a0182b;border-radius:14px;padding:12px;font-size:13px;font-weight:600;display:flex;justify-content:space-between}
.pv img{width:64px;height:64px;object-fit:cover;border-radius:10px;margin:2px}.ph img{width:100%;max-width:140px;border-radius:10px;margin:2px}
code,textarea.cd2{font-size:10px;word-break:break-all;display:block;background:var(--t);border-radius:10px;padding:8px;max-height:70px;overflow:auto}
.md{position:fixed;inset:0;background:#000a;z-index:50;display:flex;align-items:flex-end;justify-content:center}.sh{background:var(--cd);width:100%;max-width:520px;max-height:88%;overflow:auto;border-radius:24px 24px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px))}.sh input{width:100%;border:1.5px solid var(--ln);background:var(--bg);border-radius:12px;padding:9px 12px}.sf{position:sticky;bottom:-16px;background:var(--cd);padding:12px 0 0;display:flex;gap:8px}.sf .bt{flex:1}.fb{display:flex;gap:8px;align-items:center;margin:4px 0 8px}.so{margin-left:auto;border:1.5px solid var(--p);border-radius:99px;padding:6px 10px;background:var(--cd);font-weight:600;font-size:13px}
.bt:disabled{opacity:.45}nav button{position:relative}.nb{position:absolute;top:-4px;right:10px;background:#ff6b78;color:#fff;font-size:10px;border-radius:99px;padding:1px 6px}
.rb{margin:14px 0;position:relative}.rn{display:none;position:absolute;top:46%;width:36px;height:36px;border-radius:50%;background:var(--p);color:#fff;font-size:22px;box-shadow:0 2px 8px #0005;z-index:3}.rb.ov .rn{display:block}.rn.l{left:2px}.rn.r{right:2px}.rh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:2px}.rh b{color:var(--p)}.rh small{color:var(--mu)}
.rack{overflow-x:auto;overflow-y:hidden;padding:10px 0 14px;cursor:grab;scrollbar-width:thin;scrollbar-color:#a99a80 transparent;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;background:linear-gradient(var(--cd),transparent 75%);border-radius:18px}.rack::-webkit-scrollbar{height:6px}.rack::-webkit-scrollbar-thumb{background:#a99a80;border-radius:6px}
.track{display:inline-flex;gap:26px;min-width:100%;position:relative;padding:18px 24px 0}
.track::before{content:'';position:absolute;left:0;right:0;top:12px;height:9px;border-radius:5px;background:linear-gradient(#e8dccb,#a99a80);box-shadow:0 2px 4px #0003}
.hg{flex:none;width:150px;position:relative;transform-origin:50% 0;cursor:pointer;user-select:none;-webkit-user-select:none;outline-offset:4px}
.hk{display:block;width:66px;height:28px;margin:0 auto;fill:none;stroke:#8a7b63;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.gm{margin-top:-8px;transition:transform .22s cubic-bezier(.2,.9,.3,1.3)}@media(hover:hover){.hg:hover .gm{transform:translateY(-16px) scale(1.04)}}.hg:focus-visible .gm,.hg:active .gm{transform:translateY(-16px) scale(1.04)}.hg:hover .gs,.hg:hover .pic,.hg:focus-visible .gs,.hg:focus-visible .pic{filter:drop-shadow(0 12px 10px #0004)}@media(prefers-reduced-motion:reduce){.gm{transition:none}}
.gs{display:block;width:140px;height:150px;margin:0 auto;filter:drop-shadow(0 6px 5px #0003)}.pic{display:block;width:140px;height:160px;object-fit:contain;margin:0 auto;filter:drop-shadow(0 6px 5px #0004);pointer-events:none}
.tg2{position:relative;background:#fff6e4;color:#2a2020;border-radius:8px;margin:14px 14px 0;padding:6px 8px 8px;text-align:center;box-shadow:0 2px 5px #0003}
.tg2::before{content:'';position:absolute;left:50%;top:-14px;width:1.5px;height:14px;background:#8a7b63}.tg2::after{content:'';position:absolute;left:50%;top:4px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 1px #8a7b63}
.tg2 b{display:block;color:#600010;font-size:14px;margin-top:8px}.tg2 small{display:block;font-size:11px;color:#6b5a5a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tg2 .bg{margin-top:6px;padding:6px;font-size:12px;background:#f4d9dc;color:#600010}
.pop{background:#fff;color:#1E1819;border-radius:28px;width:min(360px,90%);padding:18px 18px 22px;text-align:center;position:relative;animation:pi .35s cubic-bezier(.2,1.4,.4,1)}.pop .x{position:absolute;top:8px;right:10px;color:#600010;z-index:2}
.pop img{width:100%;display:block;animation:none;transform:none}.pop .go{background:#600010;color:#fff;border-radius:99px;padding:14px 26px;font-weight:800;font-size:18px;margin-top:8px;line-height:1.2}.pop .go i{font-weight:400}
@keyframes pi{from{opacity:0;transform:scale(.85)}}
.pfsec{border-top:1px solid var(--ln);margin-top:16px;padding-top:12px}.sh input[readonly]{cursor:default}
.pfh{display:flex;gap:12px;align-items:center}.pfe{flex:none;font-size:12px;font-weight:700;color:var(--p);background:var(--t);border-radius:99px;padding:6px 12px;cursor:pointer;transition:transform .25s cubic-bezier(.34,1.4,.64,1),opacity .2s}.pfe:active{transform:scale(.92)}@media(hover:hover){.pfe:hover{opacity:.8}}.pfa{overflow:hidden}.pfa img{width:100%;height:100%;object-fit:cover;display:block}.pfp{width:96px;height:96px;font-size:44px;margin:4px auto 10px;border:3px solid var(--t)}.pfn{font-size:12px;color:var(--mu);display:block;margin-top:4px}.pfl{opacity:.6}.pfb{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:6px}.adr small.er{display:block;margin-top:3px}
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.22,.8,.3,1),transform .9s cubic-bezier(.22,.8,.3,1);will-change:opacity,transform}.rv.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
#wdm input#wdn,#wdm input#wda{width:100%;box-sizing:border-box;text-align:right;border:1.5px solid var(--ln);background:var(--bg);border-radius:99px;padding:10px 18px;outline:0;transition:border-color .2s,box-shadow .2s;-moz-appearance:textfield;appearance:textfield}#wdm input#wdn:focus,#wdm input#wda:focus{border-color:var(--p);box-shadow:0 0 0 3px #6000101f}#wdm input#wda::-webkit-outer-spin-button,#wdm input#wda::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}#wdm input::placeholder{text-align:right}
#wdn,#wda{text-align:right}#wdn::placeholder,#wda::placeholder{text-align:right}
.wli{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--ln);cursor:pointer}.wli:first-of-type{border-top:0}.wlt{flex:none;width:64px;height:76px;border-radius:12px;overflow:hidden;display:grid;place-items:center}.wlt img{width:100%;height:100%;object-fit:cover}.wlt svg.gs{width:44px;height:48px;margin:0}.wli>div:nth-child(2){flex:1;min-width:0}.wli p{margin:0;font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wli small{display:block;color:var(--mu);font-size:12px}.wlx{flex:none;width:34px;height:34px;border-radius:50%;background:var(--t);display:grid;place-items:center;transition:transform .25s cubic-bezier(.34,1.4,.64,1)}.wlx:active{transform:scale(.88)}.wlx .ico{width:18px;height:18px}
.hr,.bar .sq{transition:transform .28s cubic-bezier(.34,1.4,.64,1),box-shadow .28s ease,background-color .28s ease;will-change:transform}.hr:active,.bar .sq:active{transform:scale(.9)}@media(hover:hover){.hr:hover{transform:scale(1.1);box-shadow:0 3px 10px #0003}}.ico.hp{animation:hp .5s cubic-bezier(.34,1.56,.64,1)}@keyframes hp{0%{opacity:0;transform:scale(.3) rotate(-12deg)}55%{opacity:1;transform:scale(1.25) rotate(4deg)}100%{transform:scale(1) rotate(0)}}.cd{transition:transform .3s ease,box-shadow .3s ease}@media(hover:hover){.cd:hover{transform:translateY(-2px);box-shadow:0 6px 16px #0003}}@media(prefers-reduced-motion:reduce){.hr,.bar .sq,.cd{transition:none}.ico.hp{animation:none}}@keyframes swp{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}
@media(prefers-reduced-motion:reduce){.pop,.pop img{animation:none}}
.hero2{height:340px;border-radius:20px;font-size:120px}.gal{position:absolute;inset:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.gal::-webkit-scrollbar{display:none}.gal img{flex:none;width:100%;height:100%;object-fit:cover;scroll-snap-align:center}.cnt{right:10px;bottom:10px;background:#000a;color:#fff}.sp4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:6px 0}.sp4 div{background:var(--cd);border:1px solid var(--ln);border-radius:12px;padding:8px 4px;text-align:center}.sp4 small{display:block;font-size:11px;color:var(--mu)}.sp4 b{font-size:14px}.lb{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--mu);margin:12px 0 4px}
.stk{position:relative;width:100%;border-radius:16px;overflow:hidden;isolation:isolate;background:var(--t)}.sk{position:absolute;top:-4px;bottom:-4px;border-radius:14px;overflow:hidden;box-shadow:6px 0 12px #0004;cursor:pointer}.sk img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.sk svg{position:absolute;left:50%;top:50%;width:min(130px,90%);height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 4px 4px #0003)}.sk .em{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:54px}.rw.ex{animation:fi .25s}@keyframes fi{from{opacity:0;transform:translateY(6px)}}@media(prefers-reduced-motion:reduce){.rw.ex{animation:none}}
.sk .sl{position:absolute;left:0;right:0;bottom:0;padding:20px 9px 7px;background:linear-gradient(transparent,#000b);color:#fff;display:flex;flex-direction:column;text-align:left;pointer-events:none}.sk .sl span{font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sk .sl b{font-size:14px}
.shp{display:block;border:2px solid var(--ln);border-radius:16px;padding:12px;margin:8px 0;cursor:pointer;background:var(--cd)}.shp.on{border-color:var(--p);background:var(--t)}.shp b{display:block;font-size:14px}.shp small{display:block;color:var(--mu);font-size:12px;line-height:1.45;margin-top:2px}.shp .fe{float:right;color:var(--p);font-weight:800;font-size:14px}.shp:focus-visible{outline:2px solid var(--p);outline-offset:2px}
.stk .sk:first-child{box-shadow:6px 0 14px #0005}.pk{padding:12px;width:min(340px,90%)}.pk .th{height:270px;border-radius:18px;font-size:90px}.pk .th img{animation:none;transform:none;position:absolute;inset:0;height:100%;object-fit:cover}.pk svg.gs{width:190px;height:205px}
.lg{overflow:hidden;padding:0;cursor:pointer}.lg img{width:100%;height:100%;object-fit:cover;display:block}.th img.cut,.sk img.cut,.pk .th img.cut{object-fit:contain;padding:10px;filter:drop-shadow(0 5px 7px #0003)}.th>.gs{width:min(140px,78%);height:auto;max-height:86%}
.stk{touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;outline-offset:2px}.stk:active{cursor:grabbing}.sk{will-change:left}.sk img{pointer-events:none}
.stkw{position:relative;max-width:720px;margin:0 auto}.stkw .nx{top:50%;right:8px}.sk{border-radius:14px}
.stk{overflow-x:clip;overflow-y:visible}.sk{transition:transform .22s cubic-bezier(.2,.9,.3,1.3),box-shadow .22s}@media(hover:hover){.stk:not(.dg) .sk:hover{transform:translateY(-12px);box-shadow:4px 8px 16px #0005}}.stk:not(.dg) .sk:active{transform:translateY(-12px)}.stk.dg .sk{transition:none}@media(prefers-reduced-motion:reduce){.sk{transition:none}}.sh2{margin-bottom:16px}
.pad{column-count:2;column-gap:12px}@media(min-width:700px){.pad{column-count:3}}.pc{break-inside:avoid;margin-bottom:12px;border-radius:16px;padding:12px;color:#2a2020;box-shadow:0 2px 8px #0003;transform:rotate(var(--rt,0deg))}.pc p{font-size:13px;line-height:1.5;margin:6px 0}.pc small{color:#6b5a5a}.pc .pl{background:#ffffffb0;color:#2a2020}.pr1{display:flex;gap:8px;align-items:center;font-size:13px}.avl{width:30px;height:30px;border-radius:50%;background:#600010;color:#fff;display:grid;place-items:center;font-weight:800;flex:none}.pp{display:flex;gap:8px;align-items:center;cursor:pointer;background:#ffffff90;border-radius:12px;padding:6px;margin:8px 0;font-size:13px}.bx .pp{background:var(--t)}.pp .th{width:48px;height:48px;border-radius:10px;font-size:20px;flex:none}.pp .th img.cut{padding:3px}.stz{color:#e0a100;letter-spacing:2px}.stz small{letter-spacing:0;margin-left:8px}.lk{margin-top:6px;border:1px solid #0003;border-radius:99px;padding:4px 12px;font-size:12px;background:#ffffff90;color:#2a2020}.lk.on{background:#600010;color:#fff}.stp button{font-size:32px;color:#e0a100;padding:0 4px}
.tc p{font-size:13px;line-height:1.6;margin-top:4px;color:var(--mu)}.gc p{font-size:13px;line-height:1.6;margin-top:6px}.gst{color:#e0a100;font-size:20px;letter-spacing:2px}.gst span{color:#d8c9c0}.gst small{color:var(--mu);font-size:12px;letter-spacing:0;font-weight:700}.gw{background:#ffd9dc;color:#a0182b;border-radius:10px;padding:8px 10px;font-weight:700}.gi{font-size:13px;line-height:1.6;padding:6px 0;border-top:1px solid var(--ln)}.gi:first-child{border-top:0}.seg button{font-size:12px}
.gsr{color:#e0a100;letter-spacing:1px}.gsr s{text-decoration:none;color:#d8c9c0}.pc .gsr s{color:#cdbfb5}
#hd{position:sticky;top:0;z-index:30}
#ts{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 72px);width:max-content;transform:translateX(-50%);background:#1E1819;color:#fff;padding:10px 18px;border-radius:99px;font-size:13px;z-index:60;opacity:0;pointer-events:none;transition:.25s;max-width:90%;text-align:center}#ts.on{opacity:1}

/* ===== Popup Kebijakan Privasi ===== */
.pvm{position:fixed;inset:0;background:#000b;z-index:90;display:flex;align-items:center;justify-content:center;padding:calc(14px + env(safe-area-inset-top,0px)) 14px calc(14px + env(safe-area-inset-bottom,0px))}
.pvb{background:var(--cd);color:var(--tx);width:100%;max-width:520px;max-height:100%;display:flex;flex-direction:column;border-radius:22px;padding:16px;box-shadow:0 10px 40px #0006}
.pvh{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.pvh h2{font-size:18px;color:var(--p)}
:root[data-theme="dark"] .pvh h2{color:var(--tx)}
.pvx{font-size:20px;line-height:1;padding:2px 6px;color:var(--mu)}
.pvs{font-size:12px;color:var(--mu);margin:4px 0 10px}
.pvc{flex:1;min-height:120px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border:1.5px solid var(--ln);border-radius:14px;background:var(--bg);padding:12px 14px;font-size:13px;line-height:1.65;text-align:left}
.pvc h3{font-size:14px;color:var(--p);margin:16px 0 4px}.pvc h3:first-child{margin-top:0}
:root[data-theme="dark"] .pvc h3{color:var(--t)}
.pvc h4{font-size:13px;margin:10px 0 2px}
.pvc p{margin:4px 0}.pvc ol{margin:4px 0 4px 20px}.pvc li{margin:2px 0}
.pvt{overflow-x:auto;margin:6px 0}.pvt table{border-collapse:collapse;width:100%;min-width:420px;font-size:12px}
.pvt th,.pvt td{border:1px solid var(--ln);padding:6px 8px;text-align:left;vertical-align:top}.pvt th{background:var(--t);color:var(--p)}
:root[data-theme="dark"] .pvt th{color:var(--tx)}
.pvk{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:14px;font-weight:800;cursor:pointer;text-align:left}
.pvk input{width:20px;height:20px;flex:none;accent-color:var(--p);cursor:pointer}
.pvb .bt{margin-top:10px}.pvb .bt:disabled{opacity:.4;cursor:not-allowed}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .pvh h2,:root:not([data-theme="light"]) .pvt th{color:var(--tx)}:root:not([data-theme="light"]) .pvc h3{color:var(--t)}}
.pc video{width:100%;max-height:260px;border-radius:12px;margin:6px 0;background:#000;display:block}
.vdb{background:var(--bg);border:1.5px dashed var(--ln);border-radius:12px;padding:10px;margin-top:4px}.vdb input{width:100%;font-size:12px;border:0;background:none}.vdb small{display:block;margin-top:4px;color:var(--mu)}.vdb small.ok{color:#1f5f3a;font-weight:800}.vdb small.no{color:#c0182b;font-weight:800}
.pbar{height:8px;border-radius:99px;background:var(--t);margin:8px 0;overflow:hidden}.pbar i{display:block;height:100%;background:var(--p);border-radius:99px}
.wz{display:flex;gap:6px;margin:12px 0 4px}.wz i{position:relative;flex:1;text-align:center;font-style:normal;font-size:11px;font-weight:800;color:var(--mu)}.wz i b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;margin:0 auto 4px;background:var(--t);color:var(--p);font-size:13px}.wz i:not(:last-child)::after,.wz i:not(:last-child)::before{content:'';position:absolute;top:14px;left:calc(50% + 19px);width:calc(100% - 32px);height:2px;border-radius:1px;background:var(--t)}.wz i:not(:last-child)::before{z-index:1;background:#2e7d4f;width:0;transition:width .55s ease}.wz i.dn:not(:last-child)::before{width:calc(100% - 32px)}.wz i b{transition:background .3s ease,color .3s ease}.wz i.on b{transition-delay:.45s}.wz i.on{color:var(--p)}.wz i.on b{background:var(--p);color:#fff}.wz i.dn{cursor:pointer;color:#2e7d4f}.wz i.dn b{background:#2e7d4f;color:#fff}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .gb{color:#FFC83D}}:root[data-theme="dark"] .gb{color:#FFC83D}
.ico{display:block;width:24px;height:24px;pointer-events:none}.ico.nv{width:30px;height:30px}.ico.nvh{width:28px;height:28px}.ico.nvt{width:26px;height:26px}.ico.sti{width:24px;height:24px}.ic .ico{width:26px;height:26px}
.hr{background:var(--p);display:grid;place-items:center;padding:0}.hr .ico{position:static;inset:auto;width:18px;height:18px;object-fit:contain;margin:0}
.bar .sq{background:var(--p);display:flex;align-items:center;justify-content:center}.bar .sq .ico{width:28px;height:28px}
/* Navigasi bawah: transisi halus */
nav button{border-radius:16px;background:transparent;transition:margin .38s cubic-bezier(.34,1.4,.64,1),padding .38s cubic-bezier(.34,1.4,.64,1),background-color .28s ease,color .28s ease,box-shadow .35s ease,transform .18s ease;-webkit-tap-highlight-color:transparent}
nav button.on{border:0;box-shadow:0 -3px 12px #0005,0 0 0 3px var(--bg)}
nav button span{display:grid;place-items:center;height:30px;transition:transform .38s cubic-bezier(.34,1.56,.64,1)}
nav button.on span{transform:translateY(-1px) scale(1.12)}
nav button:active{transform:scale(.93)}
@media(hover:hover){nav button:not(.on):hover span{transform:scale(1.1)}}
nav.nv-in{animation:nvIn .45s cubic-bezier(.22,1,.36,1)}
@keyframes nvIn{from{transform:translateY(100%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){nav button,nav button span{transition:none}nav.nv-in{animation:none}}
.wnb{background:#fff;border:1px solid #f0d0d4;border-radius:12px;max-height:210px;overflow:auto;margin-top:4px}.wnb:empty{display:none}.wnb button{display:block;width:100%;text-align:left;padding:10px 12px;background:none;border:0;border-bottom:1px solid #f7e6e8;font:inherit;color:inherit;cursor:pointer}.wnb button:last-child{border-bottom:0}.wnb small{display:block;padding:10px 12px;color:var(--mu)}
/* ===== Motion halaman Masuk/Daftar: muncul bertahap, halus dan singkat ===== */
@media(prefers-reduced-motion:no-preference){
@keyframes auIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes auLogo{from{opacity:0;transform:scale(.7) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(2deg)}to{opacity:1;transform:none}}
.au.ent>*,.au.ent2>*{animation:auIn .5s cubic-bezier(.22,.8,.3,1) backwards}
.au.ent>.lg{animation:auLogo .65s cubic-bezier(.34,1.4,.64,1) backwards}
.au.ent>:nth-child(2){animation-delay:.08s}.au.ent>:nth-child(3){animation-delay:.14s}.au.ent>:nth-child(4){animation-delay:.2s}.au.ent>:nth-child(5){animation-delay:.27s}.au.ent>:nth-child(6){animation-delay:.34s}.au.ent>:nth-child(n+7){animation-delay:.41s}
.au.ent2>:nth-child(-n+3){animation:none}
.au.ent2>:nth-child(5){animation-delay:.06s}.au.ent2>:nth-child(6){animation-delay:.12s}.au.ent2>:nth-child(n+7){animation-delay:.18s}
}
/* ===== Panah rak: chevron digambar CSS agar tepat di tengah ===== */
.nx{font-size:0}.nx::before{content:'';position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-top:2px solid currentColor;border-right:2px solid currentColor;border-radius:1px;transform:translateX(-2.5px) rotate(45deg)}
/* ===== Polish visual (detailing): hanya tambahan tampilan; motion yang sudah ada tidak diubah ===== */
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;background-image:radial-gradient(900px 420px at 88% -120px,color-mix(in srgb,var(--s) 10%,transparent),transparent 70%),radial-gradient(700px 360px at -12% 38%,color-mix(in srgb,var(--t) 75%,transparent),transparent 70%);background-repeat:no-repeat}
::selection{background:var(--p);color:#fff}
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--s) 35%,transparent) transparent}
.ch,.rw{scrollbar-width:none}.ch::-webkit-scrollbar,.rw::-webkit-scrollbar{display:none}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--s);outline-offset:2px}
h1,h2,h3{letter-spacing:-.01em;text-wrap:balance}p{text-wrap:pretty}
header{box-shadow:0 8px 20px -10px #60001099}
header input:focus{box-shadow:0 0 0 3px #ffffff55}
nav{box-shadow:0 -10px 26px -12px #600010aa}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 100% 0,#ffffff26,transparent 46%),linear-gradient(120deg,var(--p),var(--s));box-shadow:0 12px 26px -14px #600010cc}
.hero::after{content:'';position:absolute;right:-34px;bottom:-44px;width:130px;height:130px;border-radius:50%;background:#ffffff14;pointer-events:none}
.hero>*{position:relative;z-index:1}
.hero h1{letter-spacing:-.02em;line-height:1.2}.hero p{line-height:1.55}
.hero button{box-shadow:0 5px 14px -5px #0005}
.cd{box-shadow:0 0 0 1px #6000100d,0 1px 2px #60001012,0 8px 20px -10px #60001040}
.cd .th::after{content:'';position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(transparent,#00000026);pointer-events:none}
.in{padding:9px 11px 12px}
.in p{letter-spacing:-.005em}.pr{font-weight:800;letter-spacing:-.01em}.in s{text-decoration-thickness:1px}
.th i{box-shadow:0 2px 6px #0003}.gb,.sz{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pl{letter-spacing:.01em}
.bx,.sc{box-shadow:0 0 0 1px #6000100a,0 1px 2px #60001010,0 10px 24px -14px #60001040}
.ad{box-shadow:0 10px 24px -16px #60001066}
.seg{box-shadow:inset 0 1px 3px #60001018}.seg.a4 button{font-size:11px;padding:9px 2px}.seg.sl .sp{box-shadow:0 4px 10px -4px #600010aa}
.cp{box-shadow:0 1px 3px #60001014}.cp.on{box-shadow:0 5px 12px -5px #600010bb}
.cg button.on{box-shadow:0 4px 10px -5px #600010aa}
.bt{box-shadow:0 8px 16px -8px #600010aa}.bt.o,.bt:disabled{box-shadow:none}
.md{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.sh{box-shadow:0 -12px 32px -12px #0006}
.bx input:not([type=radio]):not([type=checkbox]):not([type=file]):focus,.bx select:focus,.bx textarea:focus,.sh input:focus{outline:0;border-color:var(--p);box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 18%,transparent)}
@media(prefers-reduced-motion:no-preference){
.bt,.hero button{transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}
.bt:active,.hero button:active{transform:scale(.97)}
.cp,.cg button{transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease}
.bx input:not([type=radio]):not([type=checkbox]):not([type=file]),.bx select,.bx textarea,.sh input{transition:border-color .2s ease,box-shadow .2s ease}
}
.adst{font-style:normal;color:#FFC83D}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .gb,:root:not([data-theme="light"]) .adst{color:#fff}:root:not([data-theme="light"]) .ad{border-color:#f3d9dc}:root:not([data-theme="light"]) .ad .adh,:root:not([data-theme="light"]) .ad .adh span{color:#f3d9dc}:root:not([data-theme="light"]) .ad .pr{color:#f3d9dc}}
:root[data-theme="dark"] .gb,:root[data-theme="dark"] .adst{color:#fff}:root[data-theme="dark"] .ad{border-color:#f3d9dc}:root[data-theme="dark"] .ad .adh,:root[data-theme="dark"] .ad .adh span{color:#f3d9dc}:root[data-theme="dark"] .ad .pr{color:#f3d9dc}
/* Mode gelap: semua outline/border #f3d9dc */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--ln:#f3d9dc}:root:not([data-theme="light"]) .cp,:root:not([data-theme="light"]) .cp.on,:root:not([data-theme="light"]) .cg .on,:root:not([data-theme="light"]) .so,:root:not([data-theme="light"]) .shp.on,:root:not([data-theme="light"]) .pfp,:root:not([data-theme="light"]) .lk,:root:not([data-theme="light"]) .wnb,:root:not([data-theme="light"]) .ad,:root:not([data-theme="light"]) .bx input:focus,:root:not([data-theme="light"]) .bx select:focus,:root:not([data-theme="light"]) .bx textarea:focus,:root:not([data-theme="light"]) .sh input:focus,:root:not([data-theme="light"]) #wdm input#wdn:focus,:root:not([data-theme="light"]) #wdm input#wda:focus{border-color:#f3d9dc}:root:not([data-theme="light"]) .wnb button{border-bottom-color:#f3d9dc}:root:not([data-theme="light"]) :where(button,a,input,select,textarea,[tabindex]):focus-visible,:root:not([data-theme="light"]) .shp:focus-visible{outline-color:#f3d9dc}}
:root[data-theme="dark"]{--ln:#f3d9dc}:root[data-theme="dark"] .cp,:root[data-theme="dark"] .cp.on,:root[data-theme="dark"] .cg .on,:root[data-theme="dark"] .so,:root[data-theme="dark"] .shp.on,:root[data-theme="dark"] .pfp,:root[data-theme="dark"] .lk,:root[data-theme="dark"] .wnb,:root[data-theme="dark"] .ad,:root[data-theme="dark"] .bx input:focus,:root[data-theme="dark"] .bx select:focus,:root[data-theme="dark"] .bx textarea:focus,:root[data-theme="dark"] .sh input:focus,:root[data-theme="dark"] #wdm input#wdn:focus,:root[data-theme="dark"] #wdm input#wda:focus{border-color:#f3d9dc}:root[data-theme="dark"] .wnb button{border-bottom-color:#f3d9dc}:root[data-theme="dark"] :where(button,a,input,select,textarea,[tabindex]):focus-visible,:root[data-theme="dark"] .shp:focus-visible{outline-color:#f3d9dc}
/* Mode gelap: teks keterangan jumlah item di header section -> putih */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .sh2 small{color:#fff!important}}
:root[data-theme="dark"] .sh2 small{color:#fff!important}
/* Mode gelap: outline kotak section Beranda #f3d9dc */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .sc{border:1px solid #f3d9dc}}
:root[data-theme="dark"] .sc{border:1px solid #f3d9dc}
/* Mode gelap: ring/outline tombol nav aktif #f3d9dc */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) nav button.on{box-shadow:0 -3px 12px #0005,0 0 0 3px #f3d9dc}}
:root[data-theme="dark"] nav button.on{box-shadow:0 -3px 12px #0005,0 0 0 3px #f3d9dc}
/* Mode gelap: pop up Thrift - kotak #28191c, outline #f3d9dc, highlight putih di belakang burung */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .pop{background:#28191c;color:#f3d9dc;border:3px solid #f3d9dc}:root:not([data-theme="light"]) .pop .x{color:#f3d9dc}:root:not([data-theme="light"]) .pop img{background:radial-gradient(ellipse 62% 56% at 50% 50%,#ffffffd9 0,#ffffff80 45%,#ffffff00 100%)}}
:root[data-theme="dark"] .pop{background:#28191c;color:#f3d9dc;border:3px solid #f3d9dc}:root[data-theme="dark"] .pop .x{color:#f3d9dc}:root[data-theme="dark"] .pop img{background:radial-gradient(ellipse 62% 56% at 50% 50%,#ffffffd9 0,#ffffff80 45%,#ffffff00 100%)}
/* Mode gelap: halaman Thrift - kontras elemen rak/hero/kotak jaminan (mode terang tidak diubah) */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .rh b{color:#f3d9dc}:root:not([data-theme="light"]) .rn{background:#8B1E2D;color:#fff;box-shadow:0 0 0 2px #f3d9dc,0 2px 8px #0008}:root:not([data-theme="light"]) .hero.tpg{background:radial-gradient(circle at 100% 0,#ffffff26,transparent 46%),linear-gradient(120deg,#8B1E2D,#b84a58);border:1px solid #f3d9dc;box-shadow:0 12px 26px -14px #000a}:root:not([data-theme="light"]) .bx.tpg{border:1px solid #f3d9dc}:root:not([data-theme="light"]) .hk{stroke:#d9c7a6}:root:not([data-theme="light"]) .tg2::before{background:#d9c7a6}:root:not([data-theme="light"]) .tg2::after{box-shadow:inset 0 0 0 1px #d9c7a6}:root:not([data-theme="light"]) .rack .gs{filter:drop-shadow(0 0 1px #f3d9dcb3) drop-shadow(0 6px 5px #0006)}:root:not([data-theme="light"]) .hg:hover .gs,:root:not([data-theme="light"]) .hg:focus-visible .gs{filter:drop-shadow(0 0 1px #f3d9dcb3) drop-shadow(0 12px 10px #0008)}}
:root[data-theme="dark"] .rh b{color:#f3d9dc}
:root[data-theme="dark"] .rn{background:#8B1E2D;color:#fff;box-shadow:0 0 0 2px #f3d9dc,0 2px 8px #0008}
:root[data-theme="dark"] .hero.tpg{background:radial-gradient(circle at 100% 0,#ffffff26,transparent 46%),linear-gradient(120deg,#8B1E2D,#b84a58);border:1px solid #f3d9dc;box-shadow:0 12px 26px -14px #000a}
:root[data-theme="dark"] .bx.tpg{border:1px solid #f3d9dc}
:root[data-theme="dark"] .hk{stroke:#d9c7a6}
:root[data-theme="dark"] .tg2::before{background:#d9c7a6}
:root[data-theme="dark"] .tg2::after{box-shadow:inset 0 0 0 1px #d9c7a6}
:root[data-theme="dark"] .rack .gs{filter:drop-shadow(0 0 1px #f3d9dcb3) drop-shadow(0 6px 5px #0006)}
:root[data-theme="dark"] .hg:hover .gs,:root[data-theme="dark"] .hg:focus-visible .gs{filter:drop-shadow(0 0 1px #f3d9dcb3) drop-shadow(0 12px 10px #0008)}

@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .tg2{border:1px solid #f3d9dc}:root:not([data-theme="light"]) .pfe{background:#600010;border:1px solid #600010;color:#ffffff}:root:not([data-theme="light"]) .pfs{border:1px solid #a78f93}}
:root[data-theme="dark"] .tg2{border:1px solid #f3d9dc}:root[data-theme="dark"] .pfe{background:#600010;border:1px solid #600010;color:#ffffff}:root[data-theme="dark"] .pfs{border:1px solid #a78f93}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .trko{outline:1px solid #f3d9dc;outline-offset:-1px}:root:not([data-theme="light"]) .trko .trkh{color:#edb1b7!important}}
:root[data-theme="dark"] .trko{outline:1px solid #f3d9dc;outline-offset:-1px}:root[data-theme="dark"] .trko .trkh{color:#edb1b7!important}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .rvo,:root:not([data-theme="light"]) .wzs{outline:1px solid #f3d9dc;outline-offset:-1px}}
:root[data-theme="dark"] .rvo,:root[data-theme="dark"] .wzs{outline:1px solid #f3d9dc;outline-offset:-1px}
/* ===== Halaman Masuk/Daftar: polish UX ===== */
.au{position:relative;isolation:isolate}
.au::before{content:'';position:absolute;z-index:-1;inset:-30px -24px auto -24px;height:420px;pointer-events:none;background:radial-gradient(circle at 20% 25%,#edb1b744,transparent 46%),radial-gradient(circle at 82% 12%,#8B1E2D2e,transparent 44%),radial-gradient(circle at 55% 78%,#f3d9dc55,transparent 50%);filter:blur(22px);animation:auGlow 12s ease-in-out infinite alternate}
@keyframes auGlow{from{transform:translate3d(-8px,0,0) scale(1);opacity:.85}to{transform:translate3d(10px,14px,0) scale(1.08);opacity:1}}
@keyframes auFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.au .lg{box-shadow:0 10px 24px -10px #8B1E2Dcc,0 0 0 6px #edb1b733;animation:auFloat 4.5s ease-in-out infinite}
.au h1{color:#610011;font-size:34px;letter-spacing:.14em}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .au h1{color:#edb1b7;text-shadow:0 2px 14px #8B1E2D55}}
:root[data-theme="dark"] .au h1{color:#edb1b7;text-shadow:0 2px 14px #8B1E2D55}
.au h1+p{letter-spacing:.06em;font-size:14px}
.au .bx{border:1px solid #edb1b755;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 20px 40px -24px #600010aa;transition:box-shadow .3s ease,transform .3s ease}
.au .bx:focus-within{box-shadow:0 24px 46px -22px #600010cc;transform:translateY(-2px)}
.au input{transition:border-color .2s ease,box-shadow .25s ease,background-color .2s ease}
.au input:focus{outline:none;border-color:#edb1b7;box-shadow:0 0 0 4px #edb1b755}
.au .bt{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .25s ease,filter .2s ease}
.au .bt::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff40 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s ease;pointer-events:none}
.au .bt:hover{transform:translateY(-2px);box-shadow:0 12px 22px -10px #600010cc;filter:brightness(1.06)}
.au .bt:hover::after{transform:translateX(120%)}
.au .bt:active{transform:scale(.98)}
.au .lk{background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .3s ease}
.au .lk:hover{background-size:100% 1.5px}
.au .er:not(:empty){animation:auShake .4s ease}
@keyframes auShake{0%,100%{transform:none}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(prefers-reduced-motion:reduce){.au::before,.au .lg,.au .er:not(:empty){animation:none}.au .bt,.au .bt::after,.au .bx,.au .lk{transition:none}}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .au .sw .lk{background:#9c9899;color:#2e2a30;padding:3px 14px;border-radius:99px;font-weight:800;text-decoration:none}}
:root[data-theme="dark"] .au .sw .lk{background:#9c9899;color:#2e2a30;padding:3px 14px;border-radius:99px;font-weight:800;text-decoration:none}
/* ===== Polish UX global (halus, tidak mengubah konsep) ===== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
*{-webkit-tap-highlight-color:transparent}
::selection{background:#edb1b755}
:focus-visible{outline:2px solid #edb1b7;outline-offset:2px;border-radius:8px}
button,select,.cd,.sh2 span[role=link]{transition:transform .2s ease,box-shadow .25s ease,background-color .25s ease,border-color .25s ease,opacity .2s ease}
button:not(:disabled):active{transform:scale(.97)}
.cd:active{transform:scale(.985)}
.cd .th{overflow:hidden}
.cd .th img:not(.ico){transition:transform .6s cubic-bezier(.22,.8,.3,1)}
@media(hover:hover){.cd:hover .th img:not(.ico){transform:scale(1.04)}.cg button:hover,select:hover{border-color:#edb1b7}.sh2 span[role=link]:hover{opacity:.75}}
.cg button{transition:background-color .25s ease,border-color .25s ease,transform .2s ease}
select{cursor:pointer}
*{scrollbar-width:thin;scrollbar-color:#edb1b788 transparent}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cd .th img:not(.ico){transition:none}.cd:hover .th img:not(.ico){transform:none}button:not(:disabled):active,.cd:active{transform:none}}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) #wlm>div{outline:1px solid #ff9aa5;outline-offset:-1px}}
:root[data-theme="dark"] #wlm>div{outline:1px solid #ff9aa5;outline-offset:-1px}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .dpr{color:#ff9aa5!important}}
:root[data-theme="dark"] .dpr{color:#ff9aa5!important}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) #pvc h3,:root:not([data-theme="light"]) #pvT h3{color:#ff9aa5!important}}
:root[data-theme="dark"] #pvc h3,:root[data-theme="dark"] #pvT h3{color:#ff9aa5!important}
/* ===== Polish halaman Thrift ===== */
.tg2 b{color:var(--s)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .tg2 b{color:#ff9aa5}}
:root[data-theme="dark"] .tg2 b{color:#ff9aa5}

.hero.tpg{animation:auIn .6s cubic-bezier(.22,.8,.3,1) backwards}
.hero.tpg small{letter-spacing:.08em;opacity:.92}
[data-cd]{font-variant-numeric:tabular-nums;display:inline-block;min-width:8.2ch}
.hero.tpg button{transition:transform .2s ease,box-shadow .25s ease}
@media(hover:hover){.hero.tpg button:hover{transform:translateY(-2px);box-shadow:0 10px 20px -8px #0006}}
.hero.tpg p{max-width:36em}
.rack{scroll-behavior:smooth}
.tg2{transform-origin:50% -14px;transition:transform .45s cubic-bezier(.34,1.4,.64,1),box-shadow .3s ease}
@media(hover:hover){.hg:hover .tg2{transform:rotate(-1.5deg)}}
.tg2 .bg{transition:background-color .25s ease,transform .2s ease}
@media(hover:hover){.tg2 .bg:hover{filter:brightness(.96)}}
.bx.tpg{transition:box-shadow .3s ease}
@media(hover:hover){.bx.tpg:hover{box-shadow:0 10px 24px -14px #60001055}}
@media(prefers-reduced-motion:reduce){.hero.tpg{animation:none}.tg2,.hero.tpg button{transition:none}.hg:hover .tg2{transform:none}.rack{scroll-behavior:auto}}
/* tab Belanja Saya / Titip Jual menempel di bawah header saat scroll */
.wz{position:sticky;top:calc(var(--hh,58px) + 8px);z-index:25;background:var(--bg);padding:6px 4px;border-radius:14px;box-shadow:0 0 0 6px var(--bg),0 6px 14px -6px #60001033}
.wz{background:rgba(96,0,16,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:none}
.wz i,.wz i.on,.wz i.dn{color:#ffffff}
.wz i b{background:rgba(255,255,255,.22);color:#ffffff}
.wz i.on b{background:var(--s);color:#ffffff;box-shadow:0 0 0 2px #ffffff}
.wz i.dn b{background:#2e7d4f;color:#ffffff}
.wz i:not(:last-child)::after{background:rgba(255,255,255,.3)}
.seg.sl.stk{position:sticky;top:calc(var(--hh,58px) + 8px);z-index:25;box-shadow:0 0 0 8px var(--bg),0 6px 14px -6px #60001033}
/* Mode gelap: outline #a78f93 kartu pesanan selesai, pill QC, tombol Ulasan, tab Pesanan; tanggal #f6e9ea */
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .od,:root:not([data-theme="light"]) .od .qc,:root:not([data-theme="light"]) .od .rvb,:root:not([data-theme="light"]) .seg.ot{outline:1px solid #a78f93;outline-offset:-1px}:root:not([data-theme="light"]) .od>div:first-child>b{color:#f6e9ea!important}}
:root[data-theme="dark"] .od,:root[data-theme="dark"] .od .qc,:root[data-theme="dark"] .od .rvb,:root[data-theme="dark"] .seg.ot{outline:1px solid #a78f93;outline-offset:-1px}:root[data-theme="dark"] .od>div:first-child>b{color:#f6e9ea!important}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .od .bt.o,:root:not([data-theme="light"]) .od .pl{outline:1px solid #a78f93;outline-offset:-1px}}
:root[data-theme="dark"] .od .bt.o,:root[data-theme="dark"] .od .pl{outline:1px solid #a78f93;outline-offset:-1px}
/* Mode gelap: outline #f3d9dc tab aktif di Pesanan */
@media(prefers-color-scheme:dark){}
.pvw{position:relative;display:inline-block}
.pvd{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;background:#000a;color:#fff;font-size:12px;line-height:22px;padding:0;border:0;cursor:pointer}
.pc{min-width:0;max-width:100%;box-sizing:border-box;overflow:hidden}
.pc p{overflow-wrap:anywhere;word-break:break-word}
.pc .pr1>div{min-width:0}
.pc .pr1 b{overflow-wrap:anywhere;word-break:break-word}
.pc .pp{min-width:0}
.pc .pp>div:last-child{min-width:0;overflow-wrap:anywhere}
.pc video{display:block;width:100%;max-width:100%;height:auto;max-height:320px;border-radius:12px;background:#000}
/* Konten dibatasi dan di tengah. Header dan navigasi bawah dibiarkan penuh seperti desain asli. */
#app{width:100%;max-width:1000px;margin-left:auto;margin-right:auto;box-sizing:border-box;padding-left:14px;padding-right:14px}
.od .two{display:flex;gap:10px}
.od .two .bt{flex:1;min-width:0;padding-top:12px;padding-bottom:12px}