:root{
  --pink:#E91E63; --pink-dark:#C2185B;
  --navy:#1B3C74; --navy-dark:#13294F;
  --green:#2E9E4F; --amber:#F5A623;
  --ink:#1A1A1A; --muted:#6B7280; --line:#E5E7EB;
  --bg:#F4F5F7; --card:#FFFFFF;
  --radius:14px;
  --shadow:0 6px 20px rgba(17,24,39,.07);
  box-sizing:border-box;
}
*{box-sizing:inherit; margin:0; padding:0;}
html{scroll-padding-top:76px;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
button{font:inherit; cursor:pointer; border:none; background:none;}
a{color:inherit; text-decoration:none;}
input,select,textarea{font:inherit;}

/* ================= Header ================= */
header.top{ position:sticky; top:0; z-index:40; background:var(--navy); padding-top:env(safe-area-inset-top,0px); box-shadow:0 2px 10px rgba(0,0,0,.12); }
.top-inner{display:flex; align-items:center; gap:16px; padding:14px 16px; max-width:1280px; margin:0 auto;}
.logo{color:#fff; font-size:21px; font-weight:800; letter-spacing:.2px; white-space:nowrap; display:flex; align-items:center; gap:8px;}
.logo img{height:40px; width:auto; max-width:170px; object-fit:contain; display:block;}
.logo .dot{width:9px; height:9px; border-radius:50%; background:var(--pink);}
.deliver{display:none; flex-direction:column; line-height:1.25; cursor:pointer; padding:6px 10px; border-radius:9px; flex-shrink:0; background:none;}
.deliver:hover{background:rgba(255,255,255,.08);}
@media(min-width:640px){.deliver{display:flex;}}
.deliver .l1{font-size:10px; color:#a9b7d4; font-weight:700; letter-spacing:.4px; text-align:left;}
.deliver .l2{font-size:13px; color:#fff; font-weight:700; display:flex; align-items:center; gap:4px;}
.search-wrap{flex:1; position:relative; min-width:0;}
.search-wrap input{ width:100%; padding:10px 14px 10px 38px; border-radius:22px; border:none; background:#fff; font-size:14px; outline:none; }
.search-wrap svg{position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; opacity:.5;}
.icon-btn{ position:relative; height:38px; border-radius:10px; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; background:rgba(255,255,255,.12); padding:0 10px; gap:7px; }
.icon-btn svg{width:19px; height:19px; flex-shrink:0;}
.icon-btn .lbl{color:#fff; font-size:12.5px; font-weight:700; display:none; white-space:nowrap;}
@media(min-width:900px){ .icon-btn .lbl{display:inline;} }
.badge{ position:absolute; top:-4px; right:-4px; background:var(--pink); color:#fff; font-size:10px; font-weight:700; min-width:16px; height:16px; border-radius:8px; display:flex; align-items:center; justify-content:center; padding:0 3px; }

.acc-wrap{position:relative;}
.acc-menu{ display:none; position:absolute; right:0; top:calc(100% + 8px); background:#fff; border-radius:12px; box-shadow:0 12px 34px rgba(0,0,0,.18); min-width:200px; padding:8px; z-index:50; }
.acc-menu.show{display:block;}
.acc-menu a, .acc-menu button{ display:flex; align-items:center; gap:10px; width:100%; padding:10px 12px; border-radius:9px; font-size:13.5px; color:var(--ink); text-align:left; }
.acc-menu a:hover, .acc-menu button:hover{background:var(--bg);}
.acc-menu hr{border:none; border-top:1px solid var(--line); margin:6px 0;}

nav.tabs{background:var(--navy); overflow-x:auto; scrollbar-width:none;}
nav.tabs::-webkit-scrollbar{display:none;}
.tabs-inner{display:flex; gap:6px; padding:0 12px 12px; max-width:1280px; margin:0 auto;}
@media(min-width:900px){ .tabs-inner{ padding:0 20px 12px; } }
.tab{ color:#cfd8ea; font-size:13.5px; font-weight:600; padding:8px 16px; border-radius:20px; white-space:nowrap; flex-shrink:0; }
.tab.active{background:#fff; color:var(--navy);}

main{max-width:1280px; margin:0 auto; padding:16px; padding-bottom:86px; min-height:60vh;}
@media(min-width:900px){ main{padding:28px 20px 60px;} }

/* ================= Ad slider ================= */
.slider{position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:16/7; background:#e9ebef; margin-bottom:18px;}
@media(min-width:900px){ .slider{aspect-ratio:16/4.4;} }
.slider img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0; opacity:0; transition:opacity .5s ease;}
.slider img.show{opacity:1;}
.slider-dots{position:absolute; bottom:10px; left:0; right:0; display:flex; justify-content:center; gap:5px;}
.slider-dots span{width:6px; height:6px; border-radius:3px; background:rgba(255,255,255,.6);}
.slider-dots span.on{width:16px; background:var(--pink);}

/* ================= Section head + product rail (sliders of 6) ================= */
.sec-head{display:flex; align-items:baseline; justify-content:space-between; margin:22px 0 12px;}
.sec-head h1,.sec-head h2{font-size:17px; font-weight:800;}
@media(min-width:900px){ .sec-head h1,.sec-head h2{font-size:20px;} }
.sec-head a{font-size:13px; color:var(--pink); font-weight:700;}
.crumb{font-size:12.5px; color:var(--muted); margin-bottom:14px;}
.crumb a{color:var(--navy); font-weight:600;}

.rail-wrap{position:relative; margin-bottom:8px;}
.rail{display:grid; grid-auto-flow:column; grid-auto-columns:calc(50% - 6px); gap:12px; overflow-x:auto; overflow-y:visible; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:18px;}
.rail::-webkit-scrollbar{display:none;}
.rail > *{scroll-snap-align:start;}
@media(min-width:560px){ .rail{grid-auto-columns:calc(33.333% - 9px);} }
@media(min-width:820px){ .rail{grid-auto-columns:calc(25% - 9px); gap:14px;} }
@media(min-width:1100px){ .rail{grid-auto-columns:calc(16.6666% - 12px);} }
.rail-nav{ display:none; position:absolute; top:50%; transform:translateY(-50%); width:36px; height:36px; border-radius:50%; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.18); align-items:center; justify-content:center; z-index:5; }
@media(min-width:820px){ .rail-nav{display:flex;} }
.rail-nav.prev{left:-14px;} .rail-nav.next{right:-14px;}
.rail-nav svg{width:16px;height:16px;}

/* ================= Product grid (search / listing / old products) ================= */
.grid{ display:grid; gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(min-width:560px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(min-width:820px){.grid{grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px;}}
@media(min-width:1100px){.grid{grid-template-columns:repeat(5,minmax(0,1fr));}}

.pcard{ background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); display:flex; flex-direction:column; position:relative; transition:box-shadow .15s, transform .15s; }
@media(min-width:900px){ .pcard:hover{ box-shadow:0 12px 28px rgba(17,24,39,.12); transform:translateY(-2px); } }
.pcard .thumb{position:relative; aspect-ratio:1; background:#f1f2f5; border-radius:var(--radius) var(--radius) 0 0; overflow:hidden;}
.pcard .thumb img{width:100%; height:100%; object-fit:cover; object-position:center;}
.pcard .off{position:absolute; top:8px; left:8px; background:var(--green); color:#fff; font-size:11px; font-weight:700; padding:2px 7px; border-radius:6px;}
.pcard .wish{position:absolute; top:6px; right:6px; width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,.9); display:flex; align-items:center; justify-content:center;}
.pcard .wish svg{width:15px; height:15px;}
.qtybox{ position:absolute; right:8px; bottom:-14px; z-index:2; }
.qtybox .add{ background:var(--navy); color:#fff; font-size:12px; font-weight:700; padding:8px 14px; border-radius:9px; white-space:nowrap; }
.qtybox .stepper{ display:flex; align-items:center; gap:0; background:var(--navy); border-radius:9px; overflow:hidden; }
.qtybox .stepper button{ color:#fff; font-size:15px; font-weight:800; width:28px; height:32px; display:flex; align-items:center; justify-content:center; }
.qtybox .stepper span{ color:#fff; font-size:12.5px; font-weight:700; min-width:18px; text-align:center; }
.pcard .body{padding:10px 10px 20px;}
.pcard .name{font-size:13px; font-weight:600; line-height:1.3; height:34px; overflow:hidden;}
.pcard .seller{font-size:11px; color:var(--muted); margin-top:2px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.pcard .price{margin-top:6px; font-size:14px; font-weight:800;}
.pcard .mrp{font-size:12px; color:var(--muted); text-decoration:line-through; font-weight:400; margin-left:5px;}
.pcard .ship{font-size:10.5px; color:var(--green); font-weight:700; margin-top:3px;}
.pcard .cond{position:absolute; top:8px; left:8px; background:var(--navy); color:#fff; font-size:10.5px; font-weight:700; padding:3px 8px; border-radius:6px;}

.empty{text-align:center; padding:50px 20px; color:var(--muted);}
.empty .btn{max-width:240px; margin:16px auto 0;}

/* ================= Category listing page ================= */
.listing{display:block;}
@media(min-width:820px){ .listing{display:grid; grid-template-columns:220px 1fr; gap:24px; align-items:start;} }
.filters{display:none;}
@media(min-width:820px){ .filters{display:block; position:sticky; top:96px;} }
.filters .fgroup{background:#fff; border-radius:12px; padding:16px; margin-bottom:14px; box-shadow:var(--shadow);}
.filters .fgroup h4{font-size:13px; font-weight:800; margin-bottom:10px;}
.filters .fopt{display:flex; align-items:center; gap:8px; font-size:13px; padding:5px 0; cursor:pointer; color:#333;}
.listing-bar{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap;}
.listing-bar .count{font-size:13px; color:var(--muted);}
.listing-bar .count b{color:var(--ink);}
.listing-bar select{padding:9px 12px; border-radius:9px; border:1.5px solid var(--line); font-size:13px; background:#fff;}

/* ================= Bottom nav (mobile) — rebuilt bulletproof ================= */
.bottomnav{
  position:fixed; left:0; right:0; bottom:0; z-index:45; background:#fff;
  border-top:1px solid var(--line); display:flex !important; flex-direction:row !important;
  padding-bottom:env(safe-area-inset-bottom,0px); height:60px;
}
@media(min-width:900px){.bottomnav{display:none !important;}}
.bottomnav > a, .bottomnav > button{
  flex:1 1 0; min-width:0; height:100%; display:flex !important; flex-direction:column !important;
  align-items:center; justify-content:center; gap:2px; color:var(--muted); font-size:10px; font-weight:600;
  background:none; border:none;
}
.bottomnav > a.active, .bottomnav > button.active{color:var(--pink);}
.bottomnav svg{width:20px; height:20px; flex-shrink:0;}
body{padding-bottom:60px;}
@media(min-width:900px){ body{padding-bottom:0;} }

.cartpill{ position:fixed; right:18px; bottom:72px; z-index:39; background:var(--navy); color:#fff; border-radius:26px; padding:12px 18px; display:none; align-items:center; gap:10px; box-shadow:0 8px 22px rgba(0,0,0,.25); font-size:13.5px; font-weight:700; }
@media(min-width:900px){.cartpill{display:none !important; bottom:24px;}}
.cartpill.show{display:flex;}

/* ================= Buttons / fields ================= */
.field{margin-bottom:14px;}
.field label{display:block; font-size:12px; color:var(--muted); margin-bottom:5px; font-weight:600;}
.field input, .field select, .field textarea{ width:100%; padding:12px 14px; border:1.5px solid var(--line); border-radius:11px; font-size:14.5px; outline:none; font-family:inherit; }
.field textarea{resize:vertical; min-height:90px;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--navy);}
.field-row{display:flex; gap:12px;}
.field-row .field{flex:1;}

.btn{ padding:14px 22px; border-radius:11px; font-size:15px; font-weight:700; text-align:center; display:inline-block; }
.btn.block{width:100%;}
.btn-pink{background:var(--pink); color:#fff;}
.btn-navy{background:var(--navy); color:#fff;}
.btn-outline{background:#fff; border:1.5px solid var(--line); color:var(--ink);}
.btn[disabled]{opacity:.55; pointer-events:none;}

.panel{background:#fff; border-radius:16px; padding:18px; box-shadow:var(--shadow);}
.panel + .panel{margin-top:16px;}
.panel h3{font-size:15px; font-weight:800; margin-bottom:14px;}
.form-page{max-width:560px; margin:0 auto;}

.page-2col{display:block;}
@media(min-width:900px){ .page-2col{display:grid; grid-template-columns:1fr 380px; gap:24px; align-items:flex-start;} .page-2col .side{ position:sticky; top:96px; } }

.cline{display:flex; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line);}
.cline img{width:64px; height:64px; border-radius:10px; object-fit:cover; background:#f1f2f5;}
.cline .info{flex:1; min-width:0;}
.cline .info .n{font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cline .info .p{font-size:13px; color:var(--muted); margin-top:2px;}
.qty{display:flex; align-items:center; gap:9px; border:1.5px solid var(--line); border-radius:9px; padding:4px 8px;}
.qty button{font-size:16px; font-weight:800; color:var(--navy); width:18px;}
.sumrow{display:flex; justify-content:space-between; font-size:13.5px; padding:6px 0; color:var(--muted);}
.sumrow.total{color:var(--ink); font-weight:800; font-size:16px; border-top:1px solid var(--line); margin-top:8px; padding-top:12px;}

.paytile{display:flex; gap:12px; align-items:center; border:1.5px solid var(--line); border-radius:12px; padding:13px; margin-bottom:10px; cursor:pointer;}
.paytile.on{border-color:var(--pink); background:#fdf0f4;}
.paytile .dot{width:18px; height:18px; border-radius:50%; border:2px solid var(--line); flex-shrink:0; position:relative;}
.paytile.on .dot{border-color:var(--pink);}
.paytile.on .dot::after{content:'';position:absolute; inset:3px; background:var(--pink); border-radius:50%;}
.paytile .t{font-size:14px; font-weight:700;}
.paytile .s{font-size:12px; color:var(--muted);}

.addr-tile{display:flex; gap:12px; align-items:center; border:1.5px solid var(--line); border-radius:12px; padding:13px; cursor:pointer;}

.toast{ position:fixed; left:50%; bottom:78px; transform:translateX(-50%); z-index:80; background:var(--ink); color:#fff; padding:11px 20px; border-radius:24px; font-size:13.5px; opacity:0; transition:opacity .25s; pointer-events:none; max-width:90vw; text-align:center; }
@media(min-width:900px){ .toast{bottom:28px;} }
.toast.show{opacity:1;}

.orow{background:#fff; border-radius:14px; padding:16px; box-shadow:var(--shadow); margin-bottom:12px;}
.orow .top{display:flex; justify-content:space-between; align-items:center;}
.orow .no{font-weight:800; font-size:14px;}
.orow .st{font-size:11px; font-weight:700; padding:3px 10px; border-radius:12px; background:#e8f5e9; color:var(--green);}
.orow .meta{font-size:12.5px; color:var(--muted); margin-top:4px;}
.orow .track{font-size:12.5px; color:var(--pink); font-weight:700;}

.skel{background:linear-gradient(90deg,#eee 25%,#f5f5f5 50%,#eee 75%); background-size:200% 100%; animation:shimmer 1.3s infinite;}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

.seg{display:flex; background:var(--bg); border-radius:11px; padding:4px; margin-bottom:16px;}
.seg button{flex:1; padding:9px; border-radius:8px; font-size:13px; font-weight:700; color:var(--muted);}
.seg button.active{background:#fff; color:var(--navy); box-shadow:0 2px 6px rgba(0,0,0,.08);}

.track-step{display:flex; gap:14px; padding-bottom:22px; position:relative;}
.track-step::before{content:''; position:absolute; left:11px; top:26px; bottom:0; width:2px; background:var(--line);}
.track-step:last-child::before{display:none;}
.track-step .dot{width:24px; height:24px; border-radius:50%; background:var(--line); flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:12px;}
.track-step.done .dot{background:var(--green);}
.track-step .t{font-size:13.5px; font-weight:700;}
.track-step .s{font-size:12px; color:var(--muted); margin-top:2px;}

/* ================= Product detail page ================= */
.pd{display:block;}
@media(min-width:900px){ .pd{display:grid; grid-template-columns:64px 1fr 340px; gap:28px; align-items:start;} }
.pd .thumbs{display:none;}
@media(min-width:900px){ .pd .thumbs{display:flex; flex-direction:column; gap:8px;} }
.pd .thumbs img{width:64px; height:64px; object-fit:cover; border-radius:8px; border:1.5px solid var(--line); cursor:pointer;}
.pd .thumbs img.active{border-color:var(--pink);}
.pd .gallery img{width:100%; aspect-ratio:1; object-fit:cover; border-radius:16px; background:#f1f2f5;}
.pd .info h1{font-size:19px; font-weight:800; margin:10px 0 4px;}
@media(min-width:900px){ .pd .info h1{font-size:23px; margin-top:0;} }
.pd .info .seller-line{font-size:12.5px; color:var(--pink); font-weight:600; margin-bottom:8px;}
.pd .info .desc{margin-top:18px; font-size:14px; line-height:1.7; color:#333;}
.pd .info .desc h4{font-size:13.5px; font-weight:800; margin-bottom:8px;}
.buybox{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; margin-top:16px; }
@media(min-width:900px){ .buybox{margin-top:0; position:sticky; top:96px;} }
.buybox .price{font-size:26px; font-weight:800;}
.buybox .mrp-row{font-size:13px; color:var(--muted); margin-top:2px;}
.buybox .ship-row{display:flex; align-items:center; gap:6px; color:var(--green); font-size:13px; font-weight:700; margin:12px 0;}
.buybox hr{border:none; border-top:1px solid var(--line); margin:14px 0;}
.buybox .qtyrow{display:flex; gap:10px; margin-bottom:12px;}
.buybox .seller-card{display:flex; gap:10px; align-items:center; background:var(--bg); border-radius:10px; padding:10px; margin-top:14px;}
.buybox .seller-card .nm{font-size:12.5px; color:var(--muted);}
.buybox .seller-card .val{font-size:13px; font-weight:700;}
.wishbtn{width:100%; margin-top:10px; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border:1.5px solid var(--line); border-radius:11px; font-size:13.5px; font-weight:700; background:#fff;}
.wishbtn.on{border-color:var(--pink); color:var(--pink);}

.review-row{padding:16px 0; border-bottom:1px solid var(--line);}
.review-row .stars{color:var(--amber); font-size:13px;}
.review-row .rname{font-size:13px; font-weight:700; margin-top:4px;}
.review-row .rtext{font-size:13.5px; color:#333; margin-top:5px; line-height:1.6;}
.review-row .rdate{font-size:11.5px; color:var(--muted); margin-top:4px;}

/* ================= Location modal ================= */
.loc-sheet .search-in-sheet{position:relative; margin-bottom:14px;}
.loc-sheet .search-in-sheet input{width:100%; padding:12px 14px 12px 38px; border:1.5px solid var(--line); border-radius:11px; font-size:14px;}
.loc-sheet .search-in-sheet svg{position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; opacity:.5;}
.loc-current{display:flex; align-items:center; gap:10px; background:#fdf0f4; color:var(--pink); font-weight:700; font-size:13.5px; padding:13px; border-radius:11px; margin-bottom:16px; cursor:pointer;}
.loc-label{font-size:11px; font-weight:800; color:var(--muted); letter-spacing:.4px; margin-bottom:8px;}
.loc-item{display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); cursor:pointer;}
.loc-item .nm{font-size:14px; font-weight:700;}
.loc-item .sub{font-size:12px; color:var(--muted);}
.loc-item .check{margin-left:auto; color:var(--green);}

/* ================= Login modal ================= */
.overlay{ position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:60; display:none; align-items:flex-end; justify-content:center; }
.overlay.show{display:flex;}
@media(min-width:720px){ .overlay{align-items:center;} }
.sheet{ background:#fff; width:100%; max-width:420px; max-height:92vh; overflow-y:auto; border-radius:20px 20px 0 0; padding:22px; position:relative; }
@media(min-width:720px){ .sheet{border-radius:20px; max-height:88vh;} }
.sheet.wide{max-width:560px;}
.sheet .close{position:absolute; top:14px; right:14px; width:32px; height:32px; border-radius:50%; background:var(--bg); display:flex; align-items:center; justify-content:center;}
.sheet h3{font-size:18px; font-weight:800; margin-bottom:16px;}
.login-banner{ background:linear-gradient(135deg, var(--pink), var(--pink-dark)); border-radius:14px; height:70px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; }

/* ================= Footer ================= */
.site-footer{background:var(--navy-dark); color:#c7d1e6; margin-top:40px; padding:40px 20px 20px;}
.footer-inner{max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:28px;}
@media(min-width:720px){ .footer-inner{grid-template-columns:2fr repeat(3,1fr);} }
.footer-logo{color:#fff; font-size:19px; font-weight:800; margin-bottom:10px;}
.footer-logo img{height:44px; width:auto; max-width:190px; object-fit:contain; display:block;}
.footer-about{font-size:12.5px; line-height:1.7; max-width:320px;}
.footer-col h5{color:#fff; font-size:12.5px; font-weight:800; margin-bottom:12px; letter-spacing:.3px;}
.footer-col a{display:block; font-size:12.5px; padding:5px 0; color:#c7d1e6;}
.footer-col a:hover{color:#fff;}
.footer-bottom{max-width:1280px; margin:28px auto 0; padding-top:18px; border-top:1px solid rgba(255,255,255,.12); font-size:11.5px; text-align:center; color:#8493b3;}

.hide{display:none !important;}

/* ================= v3 additions: seller line, detail page, seller store, etc. ================= */
.pcard .seller .pro-star, .pdx-seller .pro-star{color:#F5A623; margin-right:3px; font-size:11px;}
.pcard .seller{display:block;}

/* ---- product detail ---- */
.pd-main{padding-bottom:150px;}
@media(min-width:900px){ .pd-main{padding-bottom:60px;} }
.pdx{display:block;}
@media(min-width:900px){ .pdx{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:36px; align-items:start;} }
.pdx-gallery{display:flex; gap:12px; align-items:flex-start;}
@media(min-width:900px){ .pdx-gallery{position:sticky; top:130px;} }
.pdx-thumbs{display:none; flex-direction:column; gap:10px; max-height:520px; overflow-y:auto; scrollbar-width:none;}
.pdx-thumbs::-webkit-scrollbar{display:none;}
@media(min-width:900px){ .pdx-thumbs{display:flex;} }
.pdx-thumbs button{width:68px; height:68px; border-radius:10px; border:2px solid var(--line); background:#fff; padding:3px; flex-shrink:0; overflow:hidden;}
.pdx-thumbs button.active{border-color:var(--pink);}
.pdx-thumbs img{width:100%; height:100%; object-fit:contain;}
.pdx-stage{position:relative; flex:1; min-width:0; background:#fff; border-radius:18px; box-shadow:var(--shadow); overflow:hidden;}
.pdx-track{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;}
.pdx-track::-webkit-scrollbar{display:none;}
.pdx-slide{flex:0 0 100%; scroll-snap-align:center; aspect-ratio:1; display:flex; align-items:center; justify-content:center; background:#fff;}
.pdx-slide img{width:100%; height:100%; object-fit:contain;}
.pdx-off{position:absolute; top:14px; left:14px; background:var(--green); color:#fff; font-size:12px; font-weight:800; padding:4px 10px; border-radius:8px;}
.pdx-actions{position:absolute; top:12px; right:12px; display:flex; flex-direction:column; gap:10px;}
.pdx-actions button{width:40px; height:40px; border-radius:50%; background:#fff; box-shadow:0 3px 10px rgba(0,0,0,.15); display:flex; align-items:center; justify-content:center;}
.pdx-dots{position:absolute; bottom:12px; left:0; right:0; display:flex; justify-content:center; gap:6px;}
.pdx-dots span{width:7px; height:7px; border-radius:4px; background:rgba(0,0,0,.22);}
.pdx-dots span.on{width:20px; background:var(--pink);}

.pdx-info{margin-top:18px;}
@media(min-width:900px){ .pdx-info{margin-top:0;} }
.pdx-brand{font-size:12.5px; font-weight:800; color:var(--pink); letter-spacing:.5px; text-transform:uppercase;}
.pdx-title{font-size:21px; font-weight:800; line-height:1.3; margin:4px 0 10px;}
@media(min-width:900px){ .pdx-title{font-size:27px;} }
.pdx-meta{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px;}
.rate-chip{background:var(--green); color:#fff; font-size:12.5px; font-weight:800; padding:3px 9px; border-radius:7px;}
.rate-chip.sm{font-size:11.5px; padding:2px 7px;}
.rate-count{font-size:13px; color:var(--muted);}
.unit-chip{font-size:12px; font-weight:700; color:var(--navy); background:#e8eefb; padding:3px 10px; border-radius:7px;}
.pdx-price{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;}
.pdx-price .now{font-size:32px; font-weight:800;}
.pdx-price .was{font-size:17px; color:var(--muted); text-decoration:line-through;}
.pdx-price .pct{font-size:15px; color:var(--green); font-weight:800;}
.pdx-tax{font-size:12.5px; color:var(--muted); margin-top:4px;}
.pdx-tax b{color:var(--green);}
.pdx-low{display:inline-block; margin-top:12px; background:#fff3e0; color:#e65100; font-size:12.5px; font-weight:700; padding:7px 12px; border-radius:8px;}

.pdx-cta{display:flex; gap:12px; margin:20px 0;}
.pdx-cta .btn{flex:1; padding:15px 12px;}
.pdx-stepper{flex:1; display:flex; align-items:center; justify-content:space-between; background:var(--navy); border-radius:11px; color:#fff; font-weight:800; font-size:14px;}
.pdx-stepper button{color:#fff; width:52px; height:50px; font-size:20px; font-weight:800;}
@media(max-width:899px){
  .pdx-cta{position:fixed; left:0; right:0; bottom:60px; z-index:44; margin:0; padding:10px 14px; background:#fff; border-top:1px solid var(--line); box-shadow:0 -6px 18px rgba(0,0,0,.08);}
  .cartpill{display:none !important;}
}

.pdx-box{background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:16px 18px; margin-top:14px;}
.pdx-box h3{font-size:15px; font-weight:800; margin-bottom:10px;}
.pdx-row{display:flex; align-items:center; gap:12px;}
.pdx-row .ic{font-size:20px;}
.pdx-row .t{font-size:13.5px;}
.pdx-row .s{font-size:12px; color:var(--muted); margin-top:2px;}
.lnk{color:var(--pink); font-size:13px; font-weight:800; white-space:nowrap;}
.pdx-perks{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; padding-top:14px; border-top:1px dashed var(--line); font-size:12.5px; font-weight:600;}
.pdx-perks .ic{margin-right:6px;}
.pdx-hl{list-style:none;}
.pdx-hl li{position:relative; padding:5px 0 5px 20px; font-size:13.5px; line-height:1.5;}
.pdx-hl li::before{content:'\2713'; position:absolute; left:0; color:var(--green); font-weight:800;}
.pdx-seller{display:flex; align-items:center; gap:14px; background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:14px 18px; margin-top:14px;}
.pdx-seller .logo{width:50px; height:50px; border-radius:12px; background:var(--bg); display:flex; align-items:center; justify-content:center; font-size:24px; overflow:hidden; flex-shrink:0;}
.pdx-seller .logo img{width:100%; height:100%; object-fit:cover;}
.pdx-seller .lbl{font-size:11.5px; color:var(--muted);}
.pdx-seller .nm{font-size:14.5px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pdx-seller .sub{font-size:12px; color:var(--muted); margin-top:1px;}
.pro-badge{background:#F5A623; color:#fff; font-size:10px; font-weight:800; padding:2px 6px; border-radius:5px; margin-left:4px; vertical-align:middle;}

.pdx-section{background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:20px; margin-top:22px;}
.pdx-section h2{font-size:17px; font-weight:800;}
.pdx-desc{margin-top:12px; font-size:14px; line-height:1.75; color:#333;}
.pdx-rev-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px;}
.pdx-rev-sum{display:flex; align-items:baseline; gap:12px; margin:10px 0 4px;}
.pdx-rev-sum .big{font-size:34px; font-weight:800;}
.pdx-rev-sum .big span{color:var(--amber); font-size:24px; margin-left:3px;}
.pdx-rev-sum .cnt{color:var(--muted); font-size:13px;}
.review-row .rv-top{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.review-row .rname{margin-top:0;}
.review-row .rdate{margin-top:0; margin-left:auto;}
.stars-pick{display:flex; gap:6px; margin-bottom:16px;}
.stars-pick button{font-size:34px; color:#d6d9df; line-height:1;}
.stars-pick button.on{color:var(--amber);}

/* ---- seller store ---- */
.store-cover{border-radius:16px; overflow:hidden; aspect-ratio:16/5; background:linear-gradient(135deg,#1B3C74,#13294F); position:relative;}
@media(max-width:640px){ .store-cover{aspect-ratio:16/8;} }
.store-cover img{width:100%; height:100%; object-fit:cover;}
.store-head{display:flex; align-items:center; gap:14px; background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:16px 18px; margin-top:-26px; position:relative; margin-left:14px; margin-right:14px;}
.store-head .logo{width:56px; height:56px; border-radius:14px; background:var(--bg); display:flex; align-items:center; justify-content:center; font-size:26px; overflow:hidden; flex-shrink:0;}
.store-head .logo img{width:100%; height:100%; object-fit:cover;}
.store-head h1{font-size:18px; font-weight:800;}
.store-head .sub{font-size:12.5px; color:var(--muted); margin-top:2px;}
.chips{display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px 0 8px;}
.chips::-webkit-scrollbar{display:none;}
.chip{padding:8px 16px; border-radius:20px; background:#fff; border:1px solid var(--line); font-size:13px; font-weight:700; white-space:nowrap; flex-shrink:0;}
.chip.on{background:var(--navy); color:#fff; border-color:var(--navy);}

/* shop by sellers rail */
.seller-tile{display:block; background:#fff; border-radius:14px; box-shadow:var(--shadow); overflow:hidden;}
.seller-tile .cv{aspect-ratio:16/10; background:var(--bg); display:flex; align-items:center; justify-content:center; font-size:32px; overflow:hidden;}
.seller-tile .cv img{width:100%; height:100%; object-fit:cover;}
.seller-tile .nm{font-size:13px; font-weight:800; padding:9px 10px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.seller-tile .ct{font-size:11.5px; color:var(--muted); padding:2px 10px 10px;}

/* ---- cart / checkout extras ---- */
.save-banner{display:flex; align-items:center; gap:10px; background:#e8f5e9; color:#1b5e20; font-size:13px; font-weight:700; padding:11px 14px; border-radius:11px; margin-bottom:14px;}
.ship-hint{background:#e8eefb; color:var(--navy); font-size:12.5px; font-weight:600; padding:10px 12px; border-radius:10px; margin-bottom:12px;}
.coupon-row{display:flex; gap:8px;}
.coupon-row input{flex:1; min-width:0; padding:12px 14px; border:1.5px dashed var(--line); border-radius:11px; font-size:14px; text-transform:uppercase; outline:none;}
.coupon-row .btn{padding:12px 18px;}
.coupon-ok{display:flex; align-items:center; justify-content:space-between; background:#e8f5e9; color:#1b5e20; border-radius:11px; padding:11px 14px; font-size:13px; font-weight:700;}
.coupon-ok button{color:#c62828; font-size:12.5px; font-weight:800;}
.sumrow.green{color:var(--green); font-weight:700;}
.cline .info .sl{font-size:11.5px; color:var(--muted); margin-top:1px;}
.cline .rm{font-size:12px; color:#c62828; font-weight:700; margin-top:4px;}

/* ---- orders ---- */
.ocard{background:#fff; border-radius:16px; box-shadow:var(--shadow); padding:16px 18px; margin-bottom:14px;}
.ocard .oh{display:flex; justify-content:space-between; align-items:center; gap:10px;}
.ocard .no{font-weight:800; font-size:14.5px;}
.ocard .od{font-size:12px; color:var(--muted); margin-top:2px;}
.st-pill{font-size:11px; font-weight:800; padding:4px 11px; border-radius:12px; background:#e8f5e9; color:var(--green); text-transform:capitalize;}
.st-pill.warn{background:#fff3e0; color:#e65100;}
.st-pill.bad{background:#fdeaea; color:#c62828;}
.ostep{display:flex; margin:14px 0 4px;}
.ostep div{flex:1; text-align:center; font-size:10.5px; color:var(--muted); position:relative; padding-top:18px; font-weight:600;}
.ostep div::before{content:''; position:absolute; top:5px; left:50%; width:10px; height:10px; border-radius:50%; background:var(--line); transform:translateX(-50%); z-index:1;}
.ostep div::after{content:''; position:absolute; top:9px; left:-50%; width:100%; height:2px; background:var(--line);}
.ostep div:first-child::after{display:none;}
.ostep div.done{color:var(--ink);}
.ostep div.done::before, .ostep div.done::after{background:var(--green);}
.oitems{border-top:1px solid var(--line); margin-top:12px; padding-top:6px;}
.oit{display:flex; align-items:center; gap:12px; padding:8px 0;}
.oit img{width:48px; height:48px; border-radius:9px; object-fit:cover; background:var(--bg);}
.oit .n{font-size:13px; font-weight:600; line-height:1.3;}
.oit .q{font-size:12px; color:var(--muted);}
.oact{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; align-items:center;}
.oact .tot{font-weight:800; font-size:15px; margin-right:auto;}
.btn-sm{padding:9px 16px; font-size:13px; border-radius:10px;}
.btn-danger-o{background:#fff; color:#c62828; border:1.5px solid #f3c2c2;}

/* ---- profile / refer ---- */
.stat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:14px 0;}
.stat-grid div{background:var(--bg); border-radius:12px; padding:12px 8px; text-align:center;}
.stat-grid b{display:block; font-size:20px; font-weight:800;}
.stat-grid span{font-size:11.5px; color:var(--muted);}
.refcode{display:flex; align-items:center; justify-content:space-between; gap:10px; border:2px dashed var(--pink); background:#fdf0f4; border-radius:14px; padding:14px 16px; margin:14px 0;}
.refcode b{font-size:22px; letter-spacing:2px; color:var(--pink);}
.hist-row{display:flex; justify-content:space-between; gap:10px; padding:11px 0; border-bottom:1px solid var(--line); font-size:13px;}
.hist-row .pts{font-weight:800;}
.hist-row .pts.pos{color:var(--green);} .hist-row .pts.neg{color:#c62828;}
.redeem-box{display:flex; gap:10px; align-items:center; background:#fffbea; border:1px solid #f5e1a4; border-radius:11px; padding:12px; font-size:13px; margin-top:12px; cursor:pointer;}
.redeem-box input{width:18px; height:18px;}
.print-only{display:none;}
@media print{
  header.top, .bottomnav, .site-footer, .cartpill, .no-print, .toast{display:none !important;}
  body{background:#fff; padding:0;}
  main{padding:0;}
}
.linklist a{display:block; padding:13px 4px; border-bottom:1px solid var(--line); font-size:14px; font-weight:600;}
.linklist a:last-child{border-bottom:none;}

/* ================= Light header & footer (so the colourful logo shows clearly) ================= */
header.top{background:#fff; box-shadow:0 2px 14px rgba(17,24,39,.08); border-bottom:1px solid var(--line);}
.logo img{height:44px; max-width:180px;}
.deliver:hover{background:#f3f4f6;}
.deliver .l1{color:#6B7280;}
.deliver .l2{color:var(--navy);}
.search-wrap input{background:#f3f4f6; border:1.5px solid transparent; transition:border-color .15s, background .15s;}
.search-wrap input:focus{background:#fff; border-color:var(--navy);}
.icon-btn{background:#eef2fb; color:var(--navy);}
.icon-btn:hover{background:#e0e8f8;}
.icon-btn svg{stroke:var(--navy);}
.icon-btn .lbl{color:var(--navy);}
.badge{border:2px solid #fff; min-width:18px; height:18px; top:-6px; right:-6px;}
nav.tabs{background:#fff; border-top:1px solid #f0f1f4;}
.tabs-inner{padding-top:8px;}
.tab{color:#374151;}
.tab:hover{background:#f3f4f6;}
.tab.active{background:var(--navy); color:#fff;}

.site-footer{background:#F3F5FA; color:#4B5563; border-top:1px solid var(--line);}
.footer-logo{color:var(--navy);}
.footer-about{color:#5b6472;}
.footer-col h5{color:var(--navy);}
.footer-col a{color:#4B5563;}
.footer-col a:hover{color:var(--pink);}
.footer-bottom{border-top:1px solid #dfe3ec; color:#6B7280;}
.footer-bottom a{color:var(--navy) !important; font-weight:700;}

/* ================= Category: sub-category filter ================= */
@media(min-width:820px){ .listing{grid-template-columns:250px 1fr;} }
.listing-main{min-width:0;}
.bar-right{display:flex; gap:8px; align-items:center;}
.mob-only{display:inline-block;}
@media(min-width:820px){ .mob-only{display:none !important;} }
.filters{max-height:calc(100vh - 120px); overflow-y:auto; scrollbar-width:thin;}
.subgroup{padding:12px 10px !important;}
.subgroup h4{padding:0 8px;}
.sub-item{display:flex; align-items:center; gap:12px; width:100%; padding:9px 8px; border-radius:11px; text-align:left; border-left:3px solid transparent; transition:background .12s;}
.sub-item:hover{background:#f4f6fb;}
.sub-item.on{background:#fdf0f4; border-left-color:var(--pink);}
.sub-item .sub-name{flex:1; font-size:13.5px; font-weight:600; color:#333; line-height:1.25;}
.sub-item.on .sub-name{color:var(--pink); font-weight:800;}
.sub-item .sub-count{font-size:11.5px; color:var(--muted); background:#f1f2f5; padding:2px 8px; border-radius:10px; font-weight:700;}
.sub-item.on .sub-count{background:#fbd5e1; color:var(--pink);}
.sub-img{width:44px; height:44px; border-radius:50%; overflow:hidden; background:#f1f2f5; display:flex; align-items:center; justify-content:center; flex-shrink:0; border:2px solid #fff; box-shadow:0 0 0 1px var(--line);}
.sub-img img{width:100%; height:100%; object-fit:cover;}
.sub-img .ph{font-weight:800; color:var(--navy); font-size:16px;}
.sub-img.all{color:var(--navy);}
.sub-item.on .sub-img, .sub-chip.on .sub-img{box-shadow:0 0 0 2px var(--pink);}
/* mobile / tablet: horizontal circular chips (like the app's side rail) */
.subrail{display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; padding:2px 2px 14px; margin-bottom:4px;}
.subrail::-webkit-scrollbar{display:none;}
@media(min-width:820px){ .subrail{display:none;} }
.sub-chip{display:flex; flex-direction:column; align-items:center; gap:6px; width:68px; flex-shrink:0;}
.sub-chip .sub-img{width:58px; height:58px;}
.sub-chip .sub-name{font-size:11.5px; font-weight:600; color:#444; text-align:center; line-height:1.2; max-height:28px; overflow:hidden;}
.sub-chip.on .sub-name{color:var(--pink); font-weight:800;}
/* sticky offsets now that the header is taller */
@media(min-width:820px){ .filters{top:170px; max-height:calc(100vh - 190px);} }
@media(min-width:900px){ .page-2col .side{top:170px;} .pdx-gallery{top:175px;} .buybox{top:170px;} }
html{scroll-padding-top:170px;}

/* ---- mobile overflow fix: long seller names must never widen the grid ---- */
.pcard{min-width:0;}
.pcard .body{min-width:0;}
.listing{min-width:0;}
.listing > *{min-width:0;}
@media(min-width:820px){ .listing{grid-template-columns:250px minmax(0,1fr);} }
.listing-bar{flex-wrap:wrap;}
.bar-right{flex-wrap:nowrap; max-width:100%;}
.bar-right select{min-width:0; max-width:50vw;}
@media(max-width:560px){
  .listing-bar{gap:8px;}
  .bar-right{width:100%;}
  .bar-right select{flex:1; padding:10px;}
}
.tipbox{background:#f6f9ff; box-shadow:none; border:1px solid #dbe5fa;}
.pdx-gallery .pdx-thumbs:empty{display:none !important;}

/* old item page extras */
.pdx-slide{background:#f4f5f8;}
.own-note{background:#eef2fb; color:var(--navy); font-size:12.5px; font-weight:600; padding:10px 14px; border-radius:11px; margin-bottom:14px; line-height:1.5;}
.pdx-cta .btn[disabled]{opacity:.45;}

/* nice empty state */
.empty-state{max-width:460px; margin:30px auto 20px; background:#fff; border-radius:18px; box-shadow:var(--shadow); padding:34px 24px; text-align:center;}
.empty-state .es-ic{width:72px; height:72px; margin:0 auto 14px; border-radius:50%; background:#fdf0f4; display:flex; align-items:center; justify-content:center; font-size:34px;}
.empty-state h3{font-size:18px; font-weight:800; margin-bottom:6px;}
.empty-state p{font-size:13.5px; color:var(--muted); line-height:1.6;}
.empty-state .es-actions{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:20px;}
.empty-state .es-actions .btn{padding:12px 20px; font-size:14px;}

/* ================= MARKET (shop directory) — append at the END of style.css ================= */
.mk-hero{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; background:linear-gradient(135deg,#1B3C74 0%,#2B5AA8 100%); color:#fff; border-radius:18px; padding:22px 22px; margin-bottom:16px; box-shadow:var(--shadow);}
.mk-hero h1{font-size:22px; font-weight:800; line-height:1.2;}
.mk-hero p{font-size:13px; opacity:.85; margin-top:4px;}
.mk-search{display:flex; align-items:center; gap:8px; background:#fff; border-radius:12px; padding:0 14px; height:46px; flex:1 1 280px; max-width:460px; min-width:0;}
.mk-search input{border:none; outline:none; background:none; flex:1; min-width:0; font-size:14px; color:var(--ink); height:100%;}
.mk-hero + .chips{margin-bottom:6px;}
.chip small{display:inline-block; margin-left:4px; font-size:11px; opacity:.7; font-weight:700;}
.mk-count{font-size:12.5px; color:var(--muted); font-weight:600;}
.mk-sec{margin-bottom:26px;}

.shop-grid{display:grid; gap:14px; grid-template-columns:minmax(0,1fr);}
@media(min-width:600px){ .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media(min-width:900px){ .shop-grid{grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px;} }
@media(min-width:1200px){ .shop-grid{grid-template-columns:repeat(4,minmax(0,1fr));} }

.shopc{background:#fff; border-radius:16px; box-shadow:var(--shadow); overflow:hidden; display:flex; flex-direction:column; min-width:0; transition:box-shadow .15s, transform .15s;}
.shopc:hover{box-shadow:0 10px 26px rgba(17,24,39,.12); transform:translateY(-2px);}
.shopc-media{position:relative; background:#f3f4f6;}
.shopc-track{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch;}
.shopc-track::-webkit-scrollbar{display:none;}
.shopc-slide{flex:0 0 100%; scroll-snap-align:center; aspect-ratio:16/10; display:block; overflow:hidden;}
.shopc-slide img{width:100%; height:100%; object-fit:cover; display:block;}
.shopc-ph{width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#eef2fa,#e3eaf7); font-size:46px;}
.shopc-cat{position:absolute; top:10px; left:10px; background:rgba(27,60,116,.92); color:#fff; font-size:11px; font-weight:800; padding:4px 10px; border-radius:20px; max-width:70%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.shopc-dots{position:absolute; bottom:8px; left:0; right:0; display:flex; justify-content:center; gap:5px; pointer-events:none;}
.shopc-dots span{width:6px; height:6px; border-radius:3px; background:rgba(255,255,255,.65); box-shadow:0 0 2px rgba(0,0,0,.35);}
.shopc-dots span.on{width:16px; background:#fff;}
.shopc-nav{position:absolute; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.92); color:var(--navy); font-size:22px; line-height:1; font-weight:700; box-shadow:0 2px 8px rgba(0,0,0,.2); display:none; align-items:center; justify-content:center; z-index:2;}
.shopc-nav.prev{left:8px;} .shopc-nav.next{right:8px;}
@media(hover:hover) and (min-width:900px){
  .shopc-nav{display:flex; opacity:0; transition:opacity .15s;}
  .shopc-media:hover .shopc-nav, .pdx-stage:hover .shopc-nav{opacity:1;}
}
.shopc-body{padding:12px 14px 14px; display:flex; flex-direction:column; gap:5px; flex:1;}
.shopc-name{font-size:15.5px; font-weight:800; line-height:1.3; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.shopc-owner,.shopc-loc{font-size:12.5px; color:var(--muted); line-height:1.45;}
.shopc-loc{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.shopc-actions{display:flex; gap:8px; margin-top:auto; padding-top:8px;}

.mk-btn,.mk-callbig,.mk-wabig{display:inline-flex; align-items:center; justify-content:center; gap:7px; font-weight:800; border-radius:10px; text-decoration:none;}
.mk-btn{flex:1; padding:10px 8px; font-size:13px; min-width:0;}
.mk-call{background:var(--navy); color:#fff;}
.mk-wa{background:#25D366; color:#fff;}
.mk-callbig{background:var(--navy); color:#fff;}
.mk-wabig{background:#25D366; color:#fff;}
.shop-cta .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; font-size:15px;}

.shop-slide{aspect-ratio:4/3 !important; background:#f3f4f6 !important;}
.shop-slide img{object-fit:cover !important;}
.pdx-stage .shopc-nav{display:none;}
@media(hover:hover) and (min-width:900px){ .pdx-stage .shopc-nav{display:flex;} }
.mk-row{text-decoration:none; color:inherit; padding:9px 0; border-bottom:1px solid #f1f2f4; display:flex;}
.mk-row:last-child{border-bottom:none;}
a.mk-row:hover .t{color:var(--navy);}

/* ===================== COMBO ===================== */
.pcard .off.combo-badge{background:#7B1FA2;}
.pcard.combo .combo-line{font-size:12px; font-weight:700; color:#7B1FA2; margin-top:4px;}
.pcard.picked{box-shadow:0 0 0 2px #7B1FA2;}
.cb-out{font-size:11px; font-weight:700; color:#c62828; background:#fff; padding:4px 8px; border-radius:8px;}
.cb-tag{display:inline-block; background:#7B1FA2; color:#fff; font-size:11px; font-weight:800; letter-spacing:.5px; padding:2px 8px; border-radius:6px;}
.cb-tag.sm{font-size:10px; padding:1px 6px; margin-right:4px;}
.cb-hero{display:flex; justify-content:space-between; align-items:center; gap:14px; background:linear-gradient(135deg,#f3e5f5,#fff7e6); border-radius:16px; padding:18px; margin-bottom:14px;}
.cb-hero h1{font-size:22px; margin:6px 0 4px;}
.cb-hero .cb-sub{font-size:13.5px; color:#444;}
.cb-hero .cb-price{font-size:28px; font-weight:800; color:#7B1FA2; text-align:right; white-space:nowrap;}
.cb-hero .cb-price small{display:block; font-size:12px; font-weight:600; color:#666;}
.cb-tabs{display:flex; gap:8px; margin-bottom:14px; overflow-x:auto;}
.cb-tabs a{flex-shrink:0; padding:8px 14px; border-radius:20px; background:#fff; border:1px solid var(--line); font-size:13px; font-weight:700; color:#333; text-decoration:none;}
.cb-tabs a.on{background:#7B1FA2; border-color:#7B1FA2; color:#fff;}
.cb-tabs a small{font-weight:600; opacity:.85;}
.cb-ok{background:#e8f5e9; color:#1b5e20; border-radius:12px; padding:12px 14px; margin-bottom:14px; font-size:14px; font-weight:600;}
.cb-ok a{color:#1b5e20; text-decoration:underline;}
#cbGrid{padding-bottom:110px;}
.cb-bar{position:fixed; left:0; right:0; bottom:0; background:#fff; box-shadow:0 -4px 18px rgba(0,0,0,.12); padding:10px 16px calc(10px + env(safe-area-inset-bottom)); z-index:60;}
.cb-prog{height:6px; background:#eee; border-radius:6px; overflow:hidden; margin-bottom:8px;}
.cb-prog-fill{height:100%; background:#7B1FA2; transition:width .2s;}
.cb-row{display:flex; justify-content:space-between; align-items:center; gap:12px; max-width:1200px; margin:0 auto;}
.cb-msg{font-size:14px;}
.cb-bar .btn[disabled]{opacity:.45; cursor:not-allowed;}
.cline.combo .cb-items{list-style:none; margin:6px 0 2px; padding:0; font-size:12.5px; color:#444;}
.cline.combo .cb-items li{display:flex; justify-content:space-between; gap:10px; padding:1px 0;}
.cb-sum-items{font-size:12px; color:var(--muted); padding:0 0 6px 10px;}
.ocombo{border-left:3px solid #7B1FA2; background:#faf5fc; border-radius:8px; padding:6px 8px; margin:6px 0;}
.ocombo-h{font-size:13px; margin-bottom:4px;}
.pdx-combo{background:#f6ecfa; border:1px solid #d9b8e6; border-radius:14px; padding:14px; margin:10px 0;}
.pdx-combo-tag{display:inline-block; background:#7B1FA2; color:#fff; font-size:11px; font-weight:800; padding:2px 8px; border-radius:6px; margin-bottom:6px;}
.pdx-combo-t{font-size:13px; color:#444; margin-bottom:8px;}
.pdx-combo-opt{display:flex; justify-content:space-between; align-items:center; background:#fff; border-radius:10px; padding:10px 12px; margin-top:8px; text-decoration:none; color:#222;}
.pdx-combo-opt small{display:block; font-size:12px; color:var(--muted);}
.pdx-combo-opt .pr{font-weight:800; color:#7B1FA2; font-size:16px;}
.sub-combo{display:block; font-size:11px; font-weight:700; color:#7B1FA2;}

.cb-tier{flex-shrink:0; padding:8px 14px; border-radius:20px; background:#fff; border:1px solid var(--line); font-size:13px; color:#333;}
.cb-tier small{font-weight:700; color:#7B1FA2; margin-left:4px;}
.cb-tier.on{background:#7B1FA2; border-color:#7B1FA2; color:#fff;}
.cb-tier.on small{color:#fff;}
.cline.combo.bad{background:#fff8f8;}
.cb-mini{display:inline-flex; align-items:center; gap:8px;}
.cb-mini button{width:24px; height:24px; border-radius:50%; border:1px solid #7B1FA2; color:#7B1FA2; font-weight:800; line-height:1;}
.cb-status{font-size:12.5px; font-weight:700; margin:6px 0 2px;}
.cb-status.ok{color:#1b5e20;}
.cb-status.warn{color:#c62828;}
.cb-block{background:#fdecea; color:#c62828; border-radius:10px; padding:10px 12px; font-size:12.5px; font-weight:600; margin-top:10px;}
.cb-msg.warn{color:#c62828; font-weight:600;}

/* Combo block in cart */
.cbx{border:1.5px solid #d9b8e6; background:#faf5fc; border-radius:14px; padding:14px; margin:12px 0;}
.cbx.bad{border-color:#f0b4b4; background:#fff8f8;}
.cbx-head{display:flex; justify-content:space-between; align-items:flex-start; gap:10px;}
.cbx-title{font-size:15px; font-weight:800; color:var(--ink);}
.cbx-sub{font-size:12px; color:var(--muted); margin-top:3px;}
.cbx-price{font-size:18px; font-weight:800; color:#7B1FA2; white-space:nowrap;}
.cbx-list{margin-top:10px; background:#fff; border-radius:10px; padding:2px 10px;}
.cbx-item{display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--line);}
.cbx-item:last-child{border-bottom:0;}
.cbx-item img{width:46px; height:46px; border-radius:8px; object-fit:cover; background:#f1f2f5; flex-shrink:0;}
.cbx-in{flex:1; min-width:0;}
.cbx-in a{display:block; font-size:13.5px; font-weight:600; line-height:1.3; color:var(--ink);}
.cbx-in small{display:block; font-size:11.5px; color:var(--muted); margin-top:1px;}
.cbx .cb-mini{gap:10px;}
.cbx .cb-mini b{min-width:16px; text-align:center; font-size:14px;}
.cbx .cb-status{margin:10px 0 0;}
.cbx-actions{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:10px;}
.cbx-more{font-size:12.5px; font-weight:700; color:#7B1FA2;}
.cbx-actions .rm{font-size:12px; color:#c62828; font-weight:700;}

/* Points history tags (referral / app download / redeemed) */
.hist-tag{display:inline-block; font-size:10.5px; font-weight:700; padding:1px 7px; border-radius:5px; margin-bottom:3px; background:#eceff3; color:#555;}
.hist-tag.referral_install{background:#e3ebf7; color:#1B3C74;}
.hist-tag.install_bonus{background:#ede7f6; color:#5e35b1;}
.hist-tag.redeem_discount{background:#fdecea; color:#c62828;}

/* ---- welcome scratch card ---- */
.scratch-banner{ display:flex; align-items:center; gap:12px; margin:0 0 16px; padding:12px 14px; border-radius:16px; cursor:pointer; color:#fff; background:linear-gradient(90deg,#7B2FF7,#E91E63,#FF9800); box-shadow:0 6px 16px rgba(233,30,99,.28); }
.scratch-banner .sb-ico{ width:52px; height:52px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:28px; background:linear-gradient(135deg,#FFF3C4,#FFC107); flex:none; }
.scratch-banner .sb-txt{ flex:1; display:flex; flex-direction:column; min-width:0; }
.scratch-banner .sb-txt b{ font-size:15.5px; font-weight:800; }
.scratch-banner .sb-txt span{ font-size:12px; opacity:.95; }
.scratch-banner .sb-btn{ background:#fff; color:#E91E63; font-weight:800; font-size:12.5px; padding:8px 14px; border-radius:20px; flex:none; }
.scratch-ov{ position:fixed; inset:0; z-index:120; background:rgba(0,0,0,.78); display:flex; align-items:center; justify-content:center; padding:16px; overflow:hidden; }
.scratch-box{ position:relative; width:100%; max-width:340px; padding:18px 20px 22px; border-radius:26px; text-align:center; color:#fff; background:linear-gradient(135deg,#5B1FA8,#E91E63); overflow:hidden; animation:scPop .3s ease-out; }
@keyframes scPop{ from{ transform:scale(.9); opacity:0; } to{ transform:scale(1); opacity:1; } }
.scratch-box h2{ margin:14px 0 4px; font-size:21px; font-weight:900; }
.scratch-box p{ margin:0 0 16px; font-size:13px; opacity:.8; }
.sc-x{ position:absolute; top:10px; right:14px; background:none; border:0; color:rgba(255,255,255,.7); font-size:18px; cursor:pointer; }
.sc-card{ position:relative; width:300px; max-width:100%; height:180px; margin:0 auto; border-radius:18px; overflow:hidden; }
.sc-card canvas{ position:absolute; inset:0; width:100%; height:100%; touch-action:none; cursor:grab; }
.sc-prize{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; background:linear-gradient(#FFF8E1,#FFE082); }
.sc-prize small{ letter-spacing:3px; font-size:13px; font-weight:800; color:#8D6E00; }
.sc-prize b{ font-size:64px; line-height:1.05; font-weight:900; color:#E91E63; }
.sc-prize em{ font-style:normal; letter-spacing:2px; font-size:14px; font-weight:800; color:#5B1FA8; }
.sc-foot{ margin-top:16px; font-size:13px; min-height:20px; }
.sc-done{ width:100%; height:46px; border:0; border-radius:24px; background:#fff; color:#E91E63; font-size:15px; font-weight:800; cursor:pointer; }
#scConfetti{ position:absolute; inset:0; pointer-events:none; overflow:hidden; }
#scConfetti i{ position:absolute; top:-12px; width:8px; height:5px; border-radius:1px; animation:scFall linear forwards; }
@keyframes scFall{ to{ transform:translateY(520px) rotate(720deg); opacity:.2; } }