:root{
  --ink:#0A0A0A;          /* all text, primary buttons, footer background */
  --paper:#FFFFFF;        /* main page background */
  --brand-yellow:#FFDB00; /* announcement bar, Order Now button, NEW badge */
  --brand-red:#C8102E;    /* sale price, discount/SALE badge, error messages, SALE menu link */
  --surface:#F5F5F4;      /* section backgrounds */
  --line:#E5E5E5;         /* borders, dividers, input borders */
  --muted:#5C5C5C;        /* secondary text, small descriptions */
  --ink-hover:#2A2A2A;    /* hover on black buttons */
  --success:#1E7B3A;      /* "order placed", "in stock" messages */
  --footer-muted:#A3A3A3; /* secondary text inside the black footer */
}
/* Storefront theme: black / white / red. Change --red here to retheme. No gradients. */
:root{--black:#0a0a0a;--white:#fff;--red:#E10600;--g1:#f5f5f5;--g2:#e6e6e6;--g3:#5f5f5f;--hd:4rem;--fd:"Barlow Condensed","Noto Sans Bengali","Arial Narrow",Impact,sans-serif;--r:2px;--ok:#0a7a3a}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:1rem/1.55 Barlow,"Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--black);background:var(--white)}
img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}
:focus-visible{outline:0.1875rem solid var(--red);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
svg.ic{width:1.5rem;height:1.5rem;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.wrap{max-width:80rem;margin:0 auto;padding:1.25rem 1rem}
.err{color:var(--black);border-left:0.25rem solid var(--red);padding-left:0.75rem}

/* announcement + header */
.ann{background:var(--red);color:var(--white);text-align:center;font-size:0.875rem;font-weight:600;letter-spacing:.3px;padding:0.5625rem 1rem}.ann a{color:var(--white);text-decoration:underline;text-underline-offset:0.1875rem}.ann a:hover{color:var(--black)}
.hd{position:sticky;top:0;z-index:20;background:var(--white);border-bottom:1px solid var(--g2);display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:0.25rem;padding:0 0.5rem;min-height:var(--hd)}
.logo{justify-self:center;min-width:0;display:flex;align-items:center}.logo img{height:2.125rem;width:auto;max-width:100%;object-fit:contain}
.nav{display:none}.act{display:flex;align-items:center}
.ib{background:none;border:0;font:inherit;min-height:2.75rem;min-width:2.75rem;cursor:pointer;color:inherit;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;position:relative;padding:0 0.375rem;font-size:0.6875rem;font-weight:600}
.ib small{display:none;white-space:nowrap}.ib:hover{color:var(--red)}
.cn{position:absolute;top:2px;right:0;background:var(--red);color:var(--white);border-radius:0.625rem;font-size:0.6875rem;font-weight:700;line-height:1;padding:0.1875rem 0.3125rem;min-width:1.125rem;text-align:center}
.sf{display:none}.hd.sopen .sf{display:block;position:absolute;left:0;right:0;top:100%;background:var(--white);padding:0.625rem 0.75rem;border-bottom:1px solid var(--g2)}
.sf input{border:0;background:var(--g1);border-radius:62.4375rem;padding:0.5rem 1.125rem;min-height:2.75rem;width:100%}
.dr{position:fixed;inset:0 auto 0 0;width:86%;max-width:21.25rem;background:var(--white);transform:translateX(-100%);transition:transform .2s;z-index:60;padding:0.75rem 1.25rem;display:flex;flex-direction:column;visibility:hidden;overflow:auto}
.dr.open{transform:none;visibility:visible}.dr a{padding:0.875rem 0;font-weight:700;font-size:1.0625rem;border-bottom:1px solid var(--g2)}.dr a:hover{color:var(--red)}.dr .ib{align-self:flex-end;flex-direction:row;font-size:1.25rem}
.dr h4{margin:1.125rem 0 0;font-family:var(--fd);font-size:1.25rem;letter-spacing:.5px}
.ov{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:55;display:none}.ov.open{display:block}
@media(min-width:900px){
  .hd{grid-template-columns:auto auto 1fr auto;padding:0 2.5rem;gap:2.5rem;min-height:5.25rem}.logo img{height:3rem}.hd .menu,.hd .sbtn{display:none}.logo{justify-self:start}
  .nav{display:flex;gap:2rem;align-self:stretch}.nav a{display:flex;align-items:center;font-weight:600;font-size:1rem;text-transform:uppercase;letter-spacing:.8px;border-bottom:0.1875rem solid transparent;margin-bottom:-1px}.nav a:hover{border-color:var(--red)}
  .sf,.hd.sopen .sf{display:block;position:static;padding:0;border:0;max-width:35rem;width:100%;justify-self:center}.sf input{min-height:3rem}
  .act{gap:0.375rem}.ib small{display:block;font-size:0.6875rem;font-weight:600}
}

/* section headings */
.bn{margin:0;padding:1.75rem 1rem 0.25rem;max-width:80rem;margin-inline:auto;font-family:var(--fd);font-size:clamp(2.375rem,6vw,3.75rem);line-height:1;font-weight:800;letter-spacing:.5px;text-transform:uppercase}
.sh{max-width:80rem;margin:4rem auto 0;padding:0 1rem;display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}
.sh h2{margin:0;font-family:var(--fd);font-size:clamp(2.125rem,6vw,3.5rem);font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:.3px}.sh em{font-style:normal;color:var(--red)}
.va{font-weight:700;font-size:0.8125rem;letter-spacing:1px;text-transform:uppercase;border-bottom:2px solid var(--black);padding-bottom:2px;white-space:nowrap}.va:hover{color:var(--red);border-color:var(--red)}
.ct{font-family:var(--fd);font-size:1.75rem;margin:1.875rem 0 0.75rem;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid var(--black);padding-bottom:0.375rem}

/* hero + trust strip + promo */
.herow{position:relative;background:var(--black)}
.hero{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.hero::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:start;position:relative}
.slide img{width:100%;max-height:min(72vh,42.5rem);min-height:16.25rem;object-fit:cover}
.hcta{position:absolute;left:1rem;bottom:2.5rem;text-transform:uppercase;letter-spacing:1px;padding:0.875rem 2rem}@media(min-width:900px){.hcta{left:max(2.5rem,calc((100% - 80rem)/2 + 1rem));bottom:4rem;padding:1.125rem 2.75rem;font-size:1.0625rem}}
.hnav{position:absolute;top:50%;transform:translateY(-50%);width:3rem;height:3rem;border:0;background:rgba(255,255,255,.92);color:var(--black);display:none;place-items:center;cursor:pointer}.hnav:hover{background:var(--red);color:var(--white)}
.hnav.prev{left:1rem}.hnav.next{right:1rem}@media(min-width:900px){.hnav{display:grid}}
.dots{position:absolute;left:0;right:0;bottom:0.875rem;display:flex;justify-content:center;gap:0.5rem}
.dots button{width:1.875rem;height:0.25rem;border:0;padding:0;background:rgba(255,255,255,.45);cursor:pointer;position:relative}.dots button::after{content:"";position:absolute;inset:-12px 0}.dots button[aria-current=true]{background:var(--white)}
.trust{background:var(--black);color:var(--white);display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.trust::-webkit-scrollbar{display:none}
.trust>div{flex:0 0 78%;scroll-snap-align:start;display:flex;gap:0.875rem;align-items:center;padding:1.125rem 1.25rem;border-right:1px solid #2a2a2a}
.trust .ic{width:2rem;height:2rem;color:var(--red);stroke-width:1.6}.trust b{display:block;font-size:0.9375rem;text-transform:uppercase;letter-spacing:.5px}.trust span{display:block;font-size:0.8125rem;color:#a8a8a2}
@media(min-width:900px){.trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));padding:0 max(1.5rem,calc((100% - 80rem)/2))}.trust>div{flex:none;padding:1.625rem 1.5rem}.trust>div:last-child{border-right:0}.trust b{font-size:1.0625rem}.trust span{font-size:0.875rem}}
.promo img{width:100%;max-height:26.25rem;object-fit:cover;border-radius:0}

/* product grid */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.375rem 0.625rem}
@media(min-width:700px){.grid{grid-template-columns:repeat(3,1fr);gap:1.75rem 0.875rem}}@media(min-width:1000px){.grid{grid-template-columns:repeat(4,1fr)}}@media(min-width:1180px){.grid.dense{grid-template-columns:repeat(5,1fr)}}
.card{position:relative;display:flex;flex-direction:column}
.ci{position:relative;display:block;background:var(--g1);overflow:hidden;border-radius:var(--r)}.ci img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .35s}
@media(hover:hover){.card:hover .ci img{transform:scale(1.04)}}
.noimg{aspect-ratio:1/1;background:var(--g1)}.tile .noimg{aspect-ratio:4/5}
.cbody{display:flex;flex-direction:column;gap:2px;margin-top:0.75rem}@media(min-width:700px){.cbody{flex-direction:row;justify-content:space-between;align-items:baseline;gap:0.75rem}.cbody .pr{flex:none}}
.card h3{font-size:0.9375rem;margin:0;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card h3 a:hover{color:var(--red)}
.pr{margin:0;display:flex;align-items:baseline;gap:0.4375rem;flex-wrap:wrap}.pr b{font-size:1.0625rem;font-weight:800}.pr s{color:var(--g3);font-size:0.8125rem}.pr.sale b{color:var(--red)}
.qa{position:absolute;left:0.75rem;right:0.75rem;bottom:0.75rem;background:var(--black);color:var(--white);text-align:center;font-weight:700;font-size:0.875rem;letter-spacing:1px;text-transform:uppercase;padding:0.75rem 0;opacity:0;transform:translateY(0.5rem);transition:opacity .2s,transform .2s;display:none}
@media(hover:hover) and (min-width:900px){.qa{display:block}.card:hover .qa{opacity:1;transform:none}}
.badge{position:absolute;top:0.625rem;left:0.625rem;background:var(--red);color:var(--white);font-size:0.8125rem;font-weight:700;letter-spacing:.3px;padding:0.25rem 0.625rem}
.soldout{position:absolute;left:0;right:0;bottom:0;background:var(--black);color:var(--white);text-align:center;font-weight:700;font-size:0.8125rem;padding:0.375rem}
.wl{position:absolute;top:0.5rem;right:0.5rem;z-index:2;background:var(--white);border:0;border-radius:50%;width:2.375rem;height:2.375rem;font-size:1.1875rem;line-height:1;cursor:pointer;color:var(--red);display:flex;align-items:center;justify-content:center}
.wl[aria-pressed=true]{background:var(--red);color:var(--white)}

/* buttons + fields */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;background:var(--black);color:var(--white);border:2px solid var(--black);border-radius:0;padding:0.6875rem 1.75rem;font:inherit;font-weight:700;letter-spacing:.8px;text-transform:uppercase;min-height:3.125rem;cursor:pointer;text-align:center;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--red);border-color:var(--red)}.btn.alt{background:var(--white);color:var(--black)}.btn.alt:hover{background:var(--black);color:var(--white);border-color:var(--black)}.btn[disabled]{opacity:.5;cursor:not-allowed}
.btn.red{background:var(--red);border-color:var(--red)}.btn.red:hover{background:var(--black);border-color:var(--black)}
select,input,textarea{font:inherit;padding:0.6875rem 0.875rem;border:1.5px solid var(--g2);border-radius:0.25rem;width:100%;min-height:3rem;background:var(--white);color:var(--black)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--black);box-shadow:0 0 0 0.1875rem rgba(0,0,0,.08)}
.f label{display:block;font-weight:600;margin:0.875rem 0 0.375rem;font-size:0.875rem}.f label.ck{font-weight:400}
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:0.75rem}@media(min-width:800px){.tiles{grid-template-columns:repeat(4,1fr);gap:1.25rem}}
.tile{position:relative;background:var(--g1);overflow:hidden}.tile img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .35s}
@media(hover:hover){.tile:hover img{transform:scale(1.05)}}
.tile span{position:absolute;left:0;right:0;bottom:0;background:var(--white);color:var(--black);padding:0.75rem 0.875rem;font-weight:700;font-size:0.9375rem;text-transform:uppercase;letter-spacing:.5px;display:flex;justify-content:space-between;align-items:center;gap:0.5rem}.tile span .ic{width:1.25rem;height:1.25rem;color:var(--red)}.tile:hover span{color:var(--red)}@media(min-width:800px){.tile span{font-size:1.1875rem;padding:1rem 1.25rem}}

/* shop layout */
.shop{display:grid;gap:1.5rem}@media(min-width:900px){.shop{grid-template-columns:14.375rem 1fr;align-items:start}}
.side{display:none}@media(min-width:900px){.side{display:block;position:sticky;top:5.625rem}}
.side h2{font-family:var(--fd);font-size:1.5rem;text-transform:uppercase;margin:0 0 0.625rem;border-bottom:2px solid var(--black);padding-bottom:0.375rem}
.side a{display:block;padding:0.5rem 0;border-bottom:1px solid var(--g2);font-weight:500}.side a:hover{color:var(--red)}.side a.on{font-weight:800;color:var(--red)}
.bar{display:flex;gap:0.5rem;align-items:center;margin:0.25rem 0 0.875rem;overflow-x:auto;scrollbar-width:none;padding-bottom:0.25rem}.bar::-webkit-scrollbar{display:none}
@media(min-width:900px){.bar .chip{display:none}}
.chip{flex:0 0 auto;border:1.5px solid var(--g2);border-radius:62.4375rem;padding:0.5rem 1rem;font-weight:600;min-height:2.75rem;display:inline-flex;align-items:center}.chip:hover{border-color:var(--black)}.chip.on{background:var(--black);border-color:var(--black);color:var(--white)}
.bar select{width:auto;flex:0 0 auto;margin-left:auto;min-height:2.75rem;border-radius:62.4375rem}
.count{color:var(--g3);margin:0 0 0.875rem}

/* product page */
.pd{display:grid;gap:1.375rem;padding-bottom:6.875rem;align-items:start}@media(min-width:900px){.pd{grid-template-columns:1.15fr 1fr;gap:2.25rem;padding-bottom:1.25rem}}
@media(min-width:900px){.gal{position:sticky;top:6.5rem}.gal.has-th{display:grid;grid-template-columns:5.5rem 1fr;gap:0.875rem;align-items:start}.th{order:-1;flex-direction:column;margin-top:0!important;overflow:visible!important}.th button{flex:none!important;width:100%}}
.th{display:flex;gap:0.5rem;margin-top:0.625rem;overflow-x:auto;scrollbar-width:thin}.th button{border:2px solid transparent;border-radius:0;overflow:hidden;background:none;padding:0;cursor:pointer;flex:0 0 4.5rem}.th button[aria-current=true]{border-color:var(--black)}
.pnl{padding:0.25rem 0}.ctg{display:inline-block;font-weight:600;font-size:0.875rem;letter-spacing:2px;text-transform:uppercase;color:var(--g3)}.ctg:hover{color:var(--red)}
.ptop{display:flex;justify-content:space-between;gap:0.75rem;align-items:flex-start}.ptop h1{margin:0.25rem 0 0;font-family:var(--fd);font-size:clamp(2.375rem,6vw,3.75rem);line-height:.98;font-weight:800;text-transform:uppercase}
.pwl{flex:none;width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--g2);background:var(--white);font-size:1.25rem;cursor:pointer;color:var(--red)}.pwl[aria-pressed=true]{background:var(--red);color:var(--white);border-color:var(--red)}
.price{font-size:2.375rem;font-weight:800;line-height:1;color:var(--red);display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap;margin:1rem 0 0;padding:1.125rem 0 0.875rem;border-top:1px solid var(--g2)}.price s{font-size:1.25rem;color:var(--g3);font-weight:400}.price .badge{position:static}
.stock{margin:0 0 1.125rem;padding-bottom:1rem;border-bottom:1px solid var(--g2);color:var(--ok);font-size:0.9375rem;font-weight:700}
.optl{font-weight:700;display:block;text-transform:uppercase;letter-spacing:1px;font-size:0.875rem}
.opt{display:flex;flex-wrap:wrap;gap:0.5rem;margin:0.5rem 0 1.125rem}.opt button{min-width:3.5rem;min-height:3.25rem;border:2px solid var(--g2);border-radius:0;background:var(--white);font:inherit;font-weight:700;cursor:pointer;padding:0 1rem}
.opt button:hover:not([disabled]){border-color:var(--black)}
.opt button[aria-pressed=true]{background:var(--black);border-color:var(--black);color:var(--white)}.opt button[disabled]{color:#aaa;text-decoration:line-through;border-color:var(--g2);cursor:not-allowed}
.row{display:flex;gap:0.75rem;flex-wrap:wrap;margin:1rem 0}.row .btn{flex:1 1 9.375rem}.inline .btn.red{width:100%;min-height:3.625rem;font-size:1.0625rem}
.q{display:inline-flex;align-items:center;border:2px solid var(--black);border-radius:0;overflow:hidden}.q button{width:2.75rem;height:2.75rem;border:0;background:none;font-size:1.25rem;cursor:pointer}.q button:hover{color:var(--red)}.q span{min-width:2.125rem;text-align:center;font-weight:700}
.note{background:var(--g1);padding:1rem 1.125rem;margin:1.125rem 0;font-size:0.9375rem;display:grid;gap:0.75rem}.note>div{display:flex;gap:0.75rem;align-items:center}.note .ic{width:1.375rem;height:1.375rem;color:var(--red)}
.buybar{display:none}
@media(max-width:899px){
  .row.inline,.pnl .inline{display:none}
  .buybar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:18;gap:0.5rem;background:var(--white);border-top:1px solid var(--g2);padding:0.625rem 0.75rem calc(0.625rem + env(safe-area-inset-bottom))}
  .buybar .btn{flex:1;padding:0.625rem}
}
.desc{white-space:pre-line;margin:1.125rem 0}
table{border-collapse:collapse;width:100%}th,td{border:1px solid var(--g2);padding:0.625rem;text-align:left}th{background:var(--g1);font-weight:600}
details{border-bottom:1px solid var(--g2);padding:0.375rem 0}.acc{border-top:1px solid var(--g2);margin-top:1.25rem}summary{cursor:pointer;font-weight:700;min-height:3rem;display:flex;align-items:center;justify-content:space-between;text-transform:uppercase;letter-spacing:1px;font-size:0.9375rem;list-style:none}summary::-webkit-details-marker{display:none}summary::after{content:"+";font-size:1.375rem;font-weight:400}details[open]>summary::after{content:"−"}
.rv{border-bottom:1px solid var(--g2);padding:0.625rem 0}.st{color:var(--red)}.sc{overflow-x:auto}

/* cart + checkout */
.ck{display:grid;gap:1.5rem;align-items:start}@media(min-width:900px){.ck{grid-template-columns:3fr 2fr}.ck>.stk{position:sticky;top:5.625rem}}
.box{border:1px solid var(--g2);border-radius:var(--r);padding:1.25rem;background:var(--white)}.box+.box{margin-top:1rem}
.box h2{display:flex;align-items:center;gap:0.625rem;font-size:1.0625rem;margin:0 0 0.25rem;padding-bottom:0.75rem;border-bottom:1px solid var(--g2)}.box h2 .ic{width:1.375rem;height:1.375rem}
.ln{display:grid;grid-template-columns:5.25rem 1fr auto;gap:0.875rem;padding:1rem 0;border-bottom:1px solid var(--g2);align-items:start}.ln img{aspect-ratio:1/1;object-fit:cover;width:5.25rem;border-radius:0.5rem}.ln .q{margin-top:0.5rem}
.ln .rm{background:none;border:0;font:inherit;font-weight:600;text-decoration:underline;margin-left:0.625rem;min-height:2.75rem;cursor:pointer;color:var(--g3)}.ln .rm:hover{color:var(--red)}
.sum div{display:flex;justify-content:space-between;padding:0.375rem 0}.sum .tot{font-weight:800;font-size:1.3125rem;border-top:2px solid var(--black);margin-top:0.5rem;padding-top:0.75rem}
.cpn{display:flex;gap:0.5rem;margin:0.75rem 0}.cpn .btn{min-height:3rem;padding:0 1.25rem}
.pm{display:flex;gap:0.75rem;align-items:center;border:1.5px solid var(--g2);border-radius:0.625rem;padding:0.75rem 0.875rem;margin:0 0 0.625rem;min-height:3.5rem;cursor:pointer;font-weight:600}
.pm:has(input:checked){border-color:var(--black);box-shadow:inset 0 0 0 1px var(--black)}.pm input{width:auto;min-height:0;accent-color:var(--black)}.pm span{display:block;font-weight:400;color:var(--g3);font-size:0.8125rem}
.pm.off{opacity:.55;cursor:not-allowed}
.f .ck,label.ck{display:flex;gap:0.5rem;align-items:center;font-weight:400}label.ck input{width:auto;min-height:0}
.stick{margin:0}
@media(max-width:899px){.stick{position:sticky;bottom:4rem;background:var(--white);padding:0.625rem 0;z-index:5}}
.stick .btn{width:100%;font-size:1rem}
.mini{display:grid;grid-template-columns:3.25rem 1fr auto;gap:0.625rem;align-items:center;padding:0.5rem 0;font-size:0.875rem}.mini img{width:3.25rem;height:4rem;object-fit:cover;border-radius:0.375rem}.mini small{display:block;color:var(--g3)}
.ok{text-align:center;padding:3.5rem 1rem;max-width:35rem;margin:0 auto}.ok h1{font-family:var(--fd);font-size:2.75rem;text-transform:uppercase;margin:0 0 0.75rem}.ok b{color:var(--red)}
.empty{text-align:center;padding:3rem 1rem}.empty p{font-size:1.125rem}

/* cart drawer */
.cd{position:fixed;top:0;right:0;bottom:0;width:min(26.25rem,100%);background:var(--white);z-index:70;transform:translateX(100%);transition:transform .22s;display:flex;flex-direction:column;visibility:hidden}
.cd.open{transform:none;visibility:visible}
.cdh{background:var(--black);color:var(--white);display:flex;align-items:center;justify-content:space-between;padding:0.375rem 0.5rem 0.375rem 1rem;font-family:var(--fd);font-size:1.5rem;letter-spacing:1px;text-transform:uppercase}
.cdh .ib{color:var(--white);flex-direction:row;font-size:1.25rem}
.cdb{flex:1;overflow:auto;padding:0.75rem;background:var(--g1)}
.cdl{background:var(--white);border-radius:0.625rem;margin-bottom:0.75rem;overflow:hidden}
.cdt{display:grid;grid-template-columns:1fr 5.25rem;gap:0.75rem;padding:0.75rem;align-items:start;font-weight:600}.cdt img{aspect-ratio:1/1;object-fit:cover;border-radius:0.5rem;width:5.25rem}
.cdr{display:flex;justify-content:space-between;align-items:center;padding:0.5rem 0.75rem;border-top:1px solid var(--g2);font-size:0.875rem}
.cdr button.ib{min-height:2.25rem;min-width:2.25rem;color:var(--red);flex-direction:row;font-size:0.875rem}
.cdf{display:grid;grid-template-columns:1fr 1.2fr;border-top:1px solid var(--g2);align-items:stretch}
.cdf div{padding:0.75rem 1rem;text-align:center;font-size:0.8125rem;color:var(--g3);font-weight:600}.cdf div b{display:block;color:var(--black);font-size:1.25rem}
.cdf a{background:var(--red);color:var(--white);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:1.0625rem;min-height:4rem}.cdf a:hover{background:var(--black)}
@media(max-width:899px){.cdf{margin-bottom:4rem}}

/* skeleton */
.sk{background:var(--g2);aspect-ratio:1/1;border-radius:0.625rem;animation:p 1s infinite alternate}@keyframes p{to{opacity:.45}}

/* footer */
.ft{background:var(--black);color:var(--white);margin-top:4.5rem}.ft .wrap{display:grid;gap:2rem;padding:3rem 1rem 2.25rem}@media(min-width:900px){.ft .wrap{grid-template-columns:1.6fr 1fr 1.2fr 1fr;gap:3rem;padding:4.5rem 2.5rem 3rem}}
.ft img.ph{filter:brightness(0) invert(1)}.ft img{height:2.75rem;width:auto;max-width:100%;object-fit:contain}.ft a:hover{color:#ff8a85}
.ft h4{margin:0 0 1rem;font-family:var(--fd);font-size:1.5rem;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.ft li{list-style:none;padding:0.3125rem 0}.ft ul{margin:0;padding:0}.ft a{display:inline-block;min-height:1.5rem;color:#d6d6d1}.ft p{margin:0 0 0.625rem;color:#d6d6d1}
.soc{display:flex;gap:0.625rem;flex-wrap:wrap}.soc a{width:2.875rem;height:2.875rem;border:1px solid #3a3a3a;display:grid;place-items:center;color:var(--white)}.soc a:hover{border-color:var(--red);background:var(--red);color:var(--white)}
.fbar{border-top:1px solid #2a2a2a}.fbar .wrap{display:flex;justify-content:space-between;gap:0.75rem;flex-wrap:wrap;padding-top:1.25rem;padding-bottom:1.25rem;grid-template-columns:none}.fbar small{color:#8a8a84;font-size:0.875rem}
@media(max-width:899px){.ft{padding-bottom:4rem}}

/* dialog */
.dov{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:80;display:flex;align-items:center;justify-content:center;padding:1rem}.dlg{background:var(--white);padding:1.5rem;max-width:26.25rem;width:100%;max-height:92vh;overflow:auto;position:relative;border-radius:var(--r);border-top:0.3125rem solid var(--red)}.x{position:absolute;top:0.25rem;right:0.25rem;font-size:1.25rem;flex-direction:row}

/* mobile tab bar */
.tabs{display:none}
@media(max-width:899px){
  .tabs{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:19;background:var(--white);border-top:1px solid var(--g2);padding:0.25rem 0 calc(0.25rem + env(safe-area-inset-bottom))}
  .tabs a,.tabs button{background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:1px;font:inherit;font-size:0.6875rem;font-weight:600;padding:0.3125rem 0;cursor:pointer;color:var(--g3);position:relative;min-height:3rem;justify-content:center}
  .tabs .on{color:var(--black)}.tabs .ic{width:1.4375rem;height:1.4375rem}.tabs .cn{top:0;right:calc(50% - 1.375rem)}
  body{padding-bottom:4rem}
  body[data-page=product]{padding-bottom:0}body[data-page=product] .tabs{display:none}
}

/* desktop help button */
.fab{position:fixed;right:1.125rem;bottom:1.125rem;z-index:15;width:3.375rem;height:3.375rem;border-radius:50%;background:var(--red);color:var(--white);display:grid;place-items:center;box-shadow:0 0.25rem 0.875rem rgba(0,0,0,.25)}.fab:hover{background:#b80500}
@media(max-width:899px){.fab{display:none}}
@media(max-width:899px){.dsk{display:none!important}}

/* ===== Soft look: the same style as the dashboard (Settings > Website look). Only applies when data-theme="soft". ===== */
:root[data-theme=soft]{--black:#13201b;--white:#fff;--red:#0a8f58;--g1:#f3f5f4;--g2:#e4e9e6;--g3:#66736d;--r:1rem;--fd:Inter,"Noto Sans Bengali",system-ui,sans-serif;--ok:#0a8f58;--dg:#d92d20;--ac2:#e6f6ee}
[data-theme=soft] body{background:#f3f5f4;font-family:Inter,"Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:0.9375rem}
[data-theme=soft] .ann{font-size:0.8125rem}
[data-theme=soft] .hd{border-bottom:1px solid var(--g2)}
[data-theme=soft] .nav a{text-transform:none;font-size:0.9375rem;letter-spacing:0;font-weight:600;border:0;margin:0;align-self:center;padding:0.5625rem 1rem;border-radius:62.4375rem}
[data-theme=soft] .nav a:hover{background:var(--ac2);color:var(--red)}
[data-theme=soft] .sf input{background:var(--g1);border:1px solid var(--g2)}
[data-theme=soft] .ib:hover{color:var(--red)}
[data-theme=soft] .cn{background:var(--red)}
/* headings */
[data-theme=soft] .sh h2,[data-theme=soft] .bn,[data-theme=soft] .ptop h1,[data-theme=soft] .ct,[data-theme=soft] .side h2,[data-theme=soft] .ft h4,[data-theme=soft] .cdh,[data-theme=soft] .ok h1{font-family:Inter,"Noto Sans Bengali",system-ui,sans-serif;text-transform:none;letter-spacing:-.02em;font-weight:800}
[data-theme=soft] .sh h2{font-size:clamp(1.5rem,4vw,2.125rem)}[data-theme=soft] .bn{font-size:clamp(1.625rem,4vw,2.25rem)}[data-theme=soft] .sh{margin-top:3rem}
[data-theme=soft] .va{border:0;background:var(--ac2);color:var(--red);padding:0.5rem 1rem;border-radius:62.4375rem;text-transform:none;letter-spacing:0;font-size:0.875rem}.soft .va:hover{background:var(--red)}
[data-theme=soft] .va:hover{background:var(--red);color:#fff}
/* hero + trust */
[data-theme=soft] .herow{max-width:80rem;margin:1rem auto 0;border-radius:1.25rem;overflow:hidden}
@media(max-width:1312px){[data-theme=soft] .herow{margin:0.75rem 0.75rem 0}}
[data-theme=soft] .hcta{border-radius:0.75rem;text-transform:none;letter-spacing:0}
[data-theme=soft] .hnav{border-radius:50%}
[data-theme=soft] .trust{background:transparent;color:var(--black);max-width:80rem;margin:1rem auto 0;padding:0 0.75rem;gap:0.75rem}
[data-theme=soft] .trust>div{background:#fff;border:1px solid var(--g2);border-radius:1rem;border-right:1px solid var(--g2);flex:0 0 78%}
[data-theme=soft] .trust span{color:var(--g3)}
@media(min-width:900px){[data-theme=soft] .trust{display:grid;padding:0 1rem;margin-top:1rem}[data-theme=soft] .trust>div{flex:none;padding:1.25rem 1.375rem}}
[data-theme=soft] .trust .ic{background:var(--ac2);padding:0.5rem;border-radius:0.75rem;width:2.75rem;height:2.75rem}
[data-theme=soft] .trust b{text-transform:none;letter-spacing:0}
[data-theme=soft] .promo img{border-radius:1.25rem}
/* cards */
[data-theme=soft] .card{background:#fff;border:1px solid var(--g2);border-radius:1rem;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,20,.04);transition:box-shadow .2s,transform .2s}
@media(hover:hover){[data-theme=soft] .card:hover{box-shadow:0 0.625rem 1.75rem rgba(16,24,20,.1);transform:translateY(-2px)}}
[data-theme=soft] .ci{border-radius:0}
[data-theme=soft] .cbody{padding:0.75rem 0.875rem 0.875rem;margin:0}
[data-theme=soft] .badge{border-radius:62.4375rem;top:0.625rem;left:0.625rem;background:var(--red)}
[data-theme=soft] .qa{border-radius:0.75rem;text-transform:none;letter-spacing:0;background:var(--black)}
[data-theme=soft] .wl{box-shadow:0 1px 0.25rem rgba(0,0,0,.15)}
[data-theme=soft] .soldout{background:var(--black)}
[data-theme=soft] .tile{border-radius:1rem;border:1px solid var(--g2)}
[data-theme=soft] .tile span{text-transform:none;letter-spacing:0;font-size:0.9375rem}
/* buttons and fields */
[data-theme=soft] .btn{border-radius:0.75rem;text-transform:none;letter-spacing:0;border-color:var(--red);background:var(--red);color:#fff}
[data-theme=soft] .btn:hover{background:#087a4a;border-color:#087a4a}
[data-theme=soft] .btn.alt{background:#fff;color:var(--black);border-color:var(--g2)}[data-theme=soft] .btn.alt:hover{background:var(--ac2);color:var(--red);border-color:var(--red)}
[data-theme=soft] .btn.red{background:var(--black);border-color:var(--black)}[data-theme=soft] .btn.red:hover{background:#000;border-color:#000}
[data-theme=soft] select,[data-theme=soft] input,[data-theme=soft] textarea{border-radius:0.75rem;border:1px solid var(--g2)}
[data-theme=soft] input:focus,[data-theme=soft] select:focus,[data-theme=soft] textarea:focus{border-color:var(--red);box-shadow:0 0 0 0.1875rem rgba(15,174,107,.18)}
[data-theme=soft] .chip{background:#fff}[data-theme=soft] .chip.on{background:var(--red);border-color:var(--red)}
/* shop sidebar */
[data-theme=soft] .side{background:#fff;border:1px solid var(--g2);border-radius:1rem;padding:1.125rem}
[data-theme=soft] .side h2{font-size:1.125rem;border:0;padding:0 0 0.5rem}
[data-theme=soft] .side a{border:0;padding:0.5625rem 0.75rem;border-radius:0.625rem;margin:0 -12px}[data-theme=soft] .side a:hover{background:var(--ac2)}[data-theme=soft] .side a.on{background:var(--ac2);color:var(--red)}
/* product page */
[data-theme=soft] .pnl{background:#fff;border:1px solid var(--g2);border-radius:1.25rem;padding:1.625rem}
[data-theme=soft] .gal .ci{border-radius:1.25rem}
[data-theme=soft] .ptop h1{font-size:clamp(1.625rem,4vw,2.375rem);line-height:1.12}
[data-theme=soft] .ctg{text-transform:none;letter-spacing:0;font-size:0.875rem;color:var(--red);background:var(--ac2);padding:0.25rem 0.75rem;border-radius:62.4375rem}
[data-theme=soft] .price{font-size:2rem}[data-theme=soft] .price .badge{border-radius:62.4375rem}
[data-theme=soft] .optl,[data-theme=soft] summary{text-transform:none;letter-spacing:0;font-size:0.9375rem}
[data-theme=soft] .opt button{border-radius:0.75rem;border:1px solid var(--g2)}[data-theme=soft] .opt button[aria-pressed=true]{background:var(--red);border-color:var(--red)}
[data-theme=soft] .q{border:1px solid var(--g2);border-radius:0.75rem}
[data-theme=soft] .th button{border-radius:0.75rem}[data-theme=soft] .th button[aria-current=true]{border-color:var(--red)}
[data-theme=soft] .note{background:var(--ac2);border-radius:0.875rem}
[data-theme=soft] .pwl{border-radius:50%}
[data-theme=soft] .box{border-radius:1rem}
[data-theme=soft] .cd{border-radius:1.25rem 0 0 1.25rem}[data-theme=soft] .cdh{background:#fff;color:var(--black);border-bottom:1px solid var(--g2);font-size:1.25rem}[data-theme=soft] .cdh .ib{color:var(--black)}
[data-theme=soft] .cdb{background:var(--g1)}[data-theme=soft] .cdl{border-radius:0.875rem}[data-theme=soft] .cdf a{background:var(--red)}[data-theme=soft] .cdf a:hover{background:#087a4a}
/* footer */
[data-theme=soft] .ft{background:var(--black);margin:4rem 0.75rem 0.75rem;border-radius:1.5rem}
[data-theme=soft] .ft h4{font-size:1.125rem}[data-theme=soft] .soc a{border-radius:0.75rem}
@media(min-width:1312px){[data-theme=soft] .ft{margin:4.5rem auto 1rem;max-width:80rem}}
[data-theme=soft] .tabs{background:#fff}[data-theme=soft] .tabs .on{color:var(--red)}
[data-theme=soft] .buybar{background:#fff}
[data-theme=soft] .dlg{border-radius:1.25rem;border-top:0}
[data-theme=soft] .fab{background:var(--red)}

/* ===== modern theme (final design): black + warm sand + coral ===== */
:root[data-theme=modern]{--black:#111111;--white:#fff;--red:#111111;--bg:#ffffff;--ft:#111111;--g1:#F5F5F5;--g2:#E4E4E4;--g3:#6a6a6a;--r:0.375rem;--fd:Inter,"Noto Sans Bengali",system-ui,sans-serif;--ok:#1f7a4d;--dg:#d92d20;--ac2:#EDEDED}
[data-theme=modern] body{background:var(--bg);font-family:Inter,"Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:0.9375rem}
[data-theme=modern] .ann{font-size:0.8125rem}
[data-theme=modern] .hd{border-bottom:1px solid var(--g2)}
[data-theme=modern] .nav a{text-transform:none;font-size:0.9375rem;letter-spacing:0;font-weight:600;border:0;margin:0;align-self:center;padding:0.5625rem 1rem;border-radius:0.375rem}
[data-theme=modern] .nav a:hover{background:var(--ac2);color:var(--red)}
[data-theme=modern] .sf input{background:var(--g1);border:1px solid var(--g2)}
[data-theme=modern] .ib:hover{color:var(--red)}
[data-theme=modern] .cn{background:var(--red)}
/* headings */
[data-theme=modern] .sh h2,[data-theme=modern] .bn,[data-theme=modern] .ptop h1,[data-theme=modern] .ct,[data-theme=modern] .side h2,[data-theme=modern] .ft h4,[data-theme=modern] .cdh,[data-theme=modern] .ok h1{font-family:Inter,"Noto Sans Bengali",system-ui,sans-serif;text-transform:none;letter-spacing:-.02em;font-weight:800}
[data-theme=modern] .sh h2{font-size:clamp(1.5rem,4vw,2.125rem)}[data-theme=modern] .bn{font-size:clamp(1.625rem,4vw,2.25rem)}[data-theme=modern] .sh{margin-top:3rem}
[data-theme=modern] .va{border:0;background:var(--ac2);color:var(--red);padding:0.5rem 1rem;border-radius:0.375rem;text-transform:none;letter-spacing:0;font-size:0.875rem}
[data-theme=modern] .va:hover{background:var(--red);color:#fff}
/* hero + trust */
[data-theme=modern] .herow{max-width:80rem;margin:1rem auto 0;border-radius:0.5rem;overflow:hidden}
@media(max-width:1312px){[data-theme=modern] .herow{margin:0.75rem 0.75rem 0}}
[data-theme=modern] .hcta{border-radius:0.375rem;text-transform:none;letter-spacing:0}
[data-theme=modern] .hnav{border-radius:50%}
[data-theme=modern] .trust{background:transparent;color:var(--black);max-width:80rem;margin:1rem auto 0;padding:0 0.75rem;gap:0.75rem}
[data-theme=modern] .trust>div{background:#fff;border:1px solid var(--g2);border-radius:0.5rem;border-right:1px solid var(--g2);flex:0 0 78%}
[data-theme=modern] .trust span{color:var(--g3)}
@media(min-width:900px){[data-theme=modern] .trust{display:grid;padding:0 1rem;margin-top:1rem}[data-theme=modern] .trust>div{flex:none;padding:1.25rem 1.375rem}}
[data-theme=modern] .trust .ic{background:var(--ac2);padding:0.5rem;border-radius:0.375rem;width:2.75rem;height:2.75rem}
[data-theme=modern] .trust b{text-transform:none;letter-spacing:0}
[data-theme=modern] .promo img{border-radius:0.5rem}
/* cards */
[data-theme=modern] .card{background:#fff;border:1px solid var(--g2);border-radius:0.5rem;overflow:hidden;box-shadow:0 1px 2px rgba(27,23,19,.04);transition:box-shadow .2s,transform .2s}
@media(hover:hover){[data-theme=modern] .card:hover{box-shadow:0 0.625rem 1.75rem rgba(27,23,19,.1);transform:translateY(-2px)}}
[data-theme=modern] .ci{border-radius:0}
[data-theme=modern] .cbody{padding:0.75rem 0.875rem 0.875rem;margin:0}
[data-theme=modern] .badge{border-radius:0.25rem;top:0.625rem;left:0.625rem;background:var(--red)}
[data-theme=modern] .qa{border-radius:0.375rem;text-transform:none;letter-spacing:0;background:var(--black)}
[data-theme=modern] .wl{box-shadow:0 1px 0.25rem rgba(0,0,0,.15)}
[data-theme=modern] .soldout{background:var(--black)}
[data-theme=modern] .tile{border-radius:0.5rem;border:1px solid var(--g2)}
[data-theme=modern] .tile span{text-transform:none;letter-spacing:0;font-size:0.9375rem}
/* buttons and fields */
[data-theme=modern] .btn{border-radius:0.375rem;text-transform:none;letter-spacing:0;border-color:var(--black);background:var(--black);color:#fff}
[data-theme=modern] .btn:hover{background:var(--red);border-color:var(--red)}
[data-theme=modern] .btn.alt{background:#fff;color:var(--black);border-color:var(--black)}[data-theme=modern] .btn.alt:hover{background:var(--black);color:#fff;border-color:var(--black)}
[data-theme=modern] .btn.red{background:var(--red);border-color:var(--red)}[data-theme=modern] .btn.red:hover{background:var(--black);border-color:var(--black)}
[data-theme=modern] select,[data-theme=modern] input,[data-theme=modern] textarea{border-radius:0.375rem;border:1px solid var(--g2)}
[data-theme=modern] input:focus,[data-theme=modern] select:focus,[data-theme=modern] textarea:focus{border-color:var(--red);box-shadow:0 0 0 0.1875rem rgba(17,17,17,.1)}
[data-theme=modern] .chip{background:#fff}[data-theme=modern] .chip.on{background:var(--black);border-color:var(--black)}
/* shop sidebar */
[data-theme=modern] .side{background:#fff;border:1px solid var(--g2);border-radius:0.5rem;padding:1.125rem}
[data-theme=modern] .side h2{font-size:1.125rem;border:0;padding:0 0 0.5rem}
[data-theme=modern] .side a{border:0;padding:0.5625rem 0.75rem;border-radius:0.375rem;margin:0 -12px}[data-theme=modern] .side a:hover{background:var(--ac2)}[data-theme=modern] .side a.on{background:var(--ac2);color:var(--red)}
/* product page */
[data-theme=modern] .pnl{background:#fff;border:1px solid var(--g2);border-radius:0.5rem;padding:1.625rem}
[data-theme=modern] .gal .ci{border-radius:0.5rem}
[data-theme=modern] .ptop h1{font-size:clamp(1.625rem,4vw,2.375rem);line-height:1.12}
[data-theme=modern] .ctg{text-transform:none;letter-spacing:0;font-size:0.875rem;color:var(--red);background:var(--ac2);padding:0.25rem 0.75rem;border-radius:0.375rem}
[data-theme=modern] .price{font-size:2rem}[data-theme=modern] .price .badge{border-radius:0.375rem}
[data-theme=modern] .optl,[data-theme=modern] summary{text-transform:none;letter-spacing:0;font-size:0.9375rem}
[data-theme=modern] .opt button{border-radius:0.375rem;border:1px solid var(--g2)}[data-theme=modern] .opt button[aria-pressed=true]{background:var(--black);border-color:var(--black)}
[data-theme=modern] .q{border:1px solid var(--g2);border-radius:0.375rem}
[data-theme=modern] .th button{border-radius:0.375rem}[data-theme=modern] .th button[aria-current=true]{border-color:var(--black)}
[data-theme=modern] .note{background:var(--ac2);border-radius:0.375rem}
[data-theme=modern] .pwl{border-radius:50%}
[data-theme=modern] .box{border-radius:0.5rem}
[data-theme=modern] .cd{border-radius:0.5rem 0 0 1.25rem}[data-theme=modern] .cdh{background:#fff;color:var(--black);border-bottom:1px solid var(--g2);font-size:1.25rem}[data-theme=modern] .cdh .ib{color:var(--black)}
[data-theme=modern] .cdb{background:var(--g1)}[data-theme=modern] .cdl{border-radius:0.375rem}[data-theme=modern] .cdf a{background:var(--black)}[data-theme=modern] .cdf a:hover{background:var(--red)}
/* footer */
[data-theme=modern] .ft{background:var(--ft);margin:4rem 0.75rem 0.75rem;border-radius:0.5rem}
[data-theme=modern] .ft h4{font-size:1.125rem}[data-theme=modern] .soc a{border-radius:0.375rem}
@media(min-width:1312px){[data-theme=modern] .ft{margin:4.5rem auto 1rem;max-width:80rem}}
[data-theme=modern] .tabs{background:#fff}[data-theme=modern] .tabs .on{color:var(--red)}
[data-theme=modern] .buybar{background:#fff}
[data-theme=modern] .dlg{border-radius:0.5rem;border-top:0}
[data-theme=modern] .fab{background:var(--black)}

.hd{position:sticky;top:0;z-index:30}

/* promo popup */
.pop{display:grid;place-items:center;padding:0.875rem;z-index:70}
.popbox{position:relative;background:var(--white);width:min(53.75rem,100%);max-height:calc(100vh - 1.75rem);overflow:auto;display:flex;flex-direction:column;border-radius:var(--r,0.375rem);box-shadow:0 1.5rem 3.75rem rgba(0,0,0,.35)}
.popi{display:block}.popi img{width:100%;height:13.75rem;object-fit:cover;display:block;background:var(--g2)}.popbox.only{width:min(32.5rem,100%)}.popbox.only .popi img{height:auto;max-height:calc(100vh - 1.75rem);min-height:0}
.popt{padding:1.375rem;display:flex;flex-direction:column;gap:0.75rem;justify-content:center}
.popt h2{margin:0;font-size:1.5rem;line-height:1.15;font-weight:800}.popt p{margin:0;color:var(--g3);line-height:1.6;font-size:0.875rem}
.popl{color:var(--red);font-weight:700;font-size:0.75rem;letter-spacing:1px;text-transform:uppercase}
.popc{border:1.5px dashed var(--red);color:var(--red);border-radius:0.375rem;padding:0.625rem 0.875rem;font-weight:800;letter-spacing:2px;text-align:center}
.pops{background:none;border:0;color:var(--g3);font:inherit;font-size:0.8125rem;cursor:pointer;min-height:2.75rem}
.popx{position:absolute;top:0.625rem;right:0.625rem;width:2.5rem;height:2.5rem;border-radius:50%;border:0;background:var(--white);font-size:1.625rem;line-height:1;cursor:pointer;color:var(--black);box-shadow:0 1px 0.375rem rgba(0,0,0,.25)}
@media(min-width:760px){.popbox{flex-direction:row}.popi{width:52%}.popi img{height:100%;min-height:28.75rem}.popbox.only .popi{width:100%}.popbox.only .popi img{min-height:0}.popt{flex:1;padding:2.75rem 2.5rem}.popt h2{font-size:2rem;letter-spacing:-.02em}}

.catd{margin:-4px auto 0.5rem;color:var(--g3);max-width:53.75rem;line-height:1.7;font-size:0.9375rem}

/* header: always fixed at the top while scrolling, and aligned in one row */
#hdr{display:contents}
.hd{position:sticky;top:0;z-index:30}
@media(min-width:900px){
  .hd{grid-template-columns:auto auto 1fr;gap:2rem;align-items:center}
  .hd .logo{justify-self:start}.hd .nav{align-self:center;gap:0.375rem}
  .hd .act{justify-self:stretch;justify-content:flex-end;align-items:center;gap:0.375rem}
  .hd .sf,.hd.sopen .sf{flex:none;width:21.25rem;max-width:21.25rem;margin-right:0.875rem;justify-self:auto}
  .hd .ib{min-width:3.5rem}
}

/* product details are always open; size is required before buying */
.sec{border-top:1px solid var(--g2);padding:1.125rem 0 0.375rem}.sec h2{margin:0 0 0.5rem;font-size:1rem;font-weight:800;letter-spacing:.2px}
.sec table{width:100%;border-collapse:collapse;font-size:0.875rem}.sec th,.sec td{text-align:left;padding:0.5625rem 0.625rem;border-bottom:1px solid var(--g2)}.sec th{font-weight:700;width:38%}
.sc th{background:var(--g1)}
.sec .desc{margin:0 0 0.75rem}
.optr{display:flex;justify-content:space-between;align-items:baseline;gap:0.75rem}.szl{font-size:0.8125rem;font-weight:600;text-decoration:underline;text-underline-offset:0.1875rem;color:var(--black)}.szl:hover{color:var(--red)}
.opt.need{outline:2px solid var(--red);outline-offset:0.375rem;border-radius:0.375rem}
:root[data-theme=modern][data-palette=navy]{--red:#1E3A8A;--bg:#ffffff;--g1:#F3F5FA;--ft:#0F1B3D;--g2:#E1E6F0;--ac2:#E8EDF8;--g3:#5d6680}
:root[data-theme=modern][data-palette=green]{--red:#0F6B4F;--bg:#ffffff;--g1:#F3F6F4;--ft:#0E2A21;--g2:#E0E8E3;--ac2:#E6F0EB;--g3:#5f6d66}
:root[data-theme=modern][data-palette=wine]{--red:#8B1E3F;--bg:#ffffff;--g1:#F8F4F5;--ft:#2A0F18;--g2:#EADFE2;--ac2:#F3E8EB;--g3:#75646a}
:root[data-theme=modern][data-palette=gold]{--red:#9A6B0B;--bg:#ffffff;--g1:#FAF7F0;--ft:#1C1810;--g2:#EAE3D2;--ac2:#F3EDDD;--g3:#756d5c}
:root[data-theme=modern][data-palette=coral]{--red:#D9381E;--bg:#ffffff;--g1:#F7F3EC;--ft:#1B1713;--g2:#E8E1D5;--ac2:#F0E8DA;--g3:#6f675b}
[data-theme=modern][data-palette=mono] .btn:hover,[data-theme=modern]:not([data-palette]) .btn:hover{background:#333;border-color:#333}

/* yellow palette: yellow fills carry dark text; yellow text on white would be unreadable, so text uses a dark amber */
:root[data-theme=modern][data-palette=yellow]{--red:#F5B800;--ay:#8A5F00;--bg:#ffffff;--g1:#FFFBEF;--ft:#161205;--g2:#EFE6C8;--ac2:#FFF3CC;--g3:#6f6a58}
[data-palette=yellow] .ann,[data-palette=yellow] .ann a,[data-palette=yellow] .badge,[data-palette=yellow] .cn,[data-palette=yellow] .btn.red,[data-palette=yellow] .btn:hover,[data-palette=yellow] .wl[aria-pressed=true],[data-palette=yellow] .pwl[aria-pressed=true]{color:#111}
[data-palette=yellow] .btn:hover{background:#F5B800;border-color:#F5B800}
[data-palette=yellow] .price,[data-palette=yellow] .pr.sale b,[data-palette=yellow] .sh em,[data-palette=yellow] .st,[data-palette=yellow] .ctg,[data-palette=yellow] .wl,[data-palette=yellow] .pwl,[data-palette=yellow] .popl,[data-palette=yellow] .popc,[data-palette=yellow] .va,[data-palette=yellow] .trust .ic,[data-palette=yellow] .tile span .ic,[data-palette=yellow] .nav a:hover,[data-palette=yellow] .ib:hover,[data-palette=yellow] .szl:hover,[data-palette=yellow] .card h3 a:hover{color:var(--ay)}
[data-palette=yellow] .popc{border-color:var(--ay)}
[data-palette=yellow] .ft a:hover{color:#F5B800}
[data-palette=yellow] :focus-visible{outline-color:#111}

/* ---- phase 28: quick add, zoom, search suggestions, cart + checkout upgrades ---- */
.card{position:relative}
.qab{display:flex;align-items:center;justify-content:center;gap:0.375rem;width:calc(100% - 1rem);margin:0 0.5rem 0.625rem;padding:0.5625rem 0;border:1px solid var(--black);background:var(--white);color:var(--black);font-weight:700;font-size:0.8125rem;min-height:2.5rem;cursor:pointer}.qab:hover{background:var(--black);color:var(--white)}.qab .ic{width:1rem;height:1rem}
.save{display:block;width:fit-content;margin:2px 0 0;font-size:0.75rem;font-weight:700;color:var(--ay,var(--black));border:1px solid currentColor;padding:1px 0.375rem}
.qm,.zm{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;padding:1rem}
.qmb{position:relative;background:var(--white);color:var(--black);width:min(32.5rem,100%);max-height:90vh;overflow:auto;padding:1.25rem}
.qmx{position:absolute;top:0.375rem;right:0.375rem}
.qmc{display:grid;grid-template-columns:7.5rem 1fr;gap:1rem}.qmc img,.qmc .noimg{width:7.5rem;aspect-ratio:1/1;object-fit:cover;background:var(--g1)}
.qmc h3{font-size:1rem;margin:0 1.5rem 0.375rem 0}.qmr{display:flex;gap:0.5rem;margin:0.75rem 0}.qmr .btn{flex:1;padding:0.625rem}
@media(max-width:480px){.qmc{grid-template-columns:5.625rem 1fr}.qmc img,.qmc .noimg{width:5.625rem}.qmb{align-self:flex-end}}
.zoomable{cursor:zoom-in}
.zm{background:rgba(0,0,0,.92)}.zm img{max-width:92vw;max-height:88vh;object-fit:contain}
.zx{position:absolute;top:0.75rem;right:0.875rem;background:none;border:0;color:#fff;font-size:1.75rem;min-width:2.75rem;min-height:2.75rem;cursor:pointer}
.zn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.15);border:0;color:#fff;font-size:2.25rem;width:3rem;height:4rem;cursor:pointer}.zp{left:0.5rem}.zq{right:0.5rem}
.zc{position:absolute;bottom:0.875rem;left:0;right:0;text-align:center;color:#fff;font-size:0.8125rem}
.sf{position:relative}
.sug{position:absolute;left:0;right:0;top:calc(100% + 0.25rem);background:var(--white);color:var(--black);border:1px solid var(--g2);z-index:40;max-height:70vh;overflow:auto;text-align:left}
.sug h5{margin:0;padding:0.625rem 0.875rem 0.25rem;font-size:0.75rem;text-transform:uppercase;letter-spacing:.5px;color:#666}
.sug a{display:flex;align-items:center;gap:0.625rem;padding:0.5625rem 0.875rem;min-height:2.75rem;border-top:1px solid var(--g1)}.sug a:hover{background:var(--g1)}
.sug a img,.sug a .noimg{width:2.25rem;height:2.75rem;object-fit:cover;background:var(--g1)}.sug a span{flex:1;font-size:0.875rem}.sug p{padding:0.75rem 0.875rem;margin:0}
.hd.sopen .sf .sug{top:calc(100% - 0.375rem)}
.qsel{display:inline-flex;align-items:center;gap:0.375rem;font-size:0.875rem;margin:0.375rem 0}.qsel select{min-height:2.25rem;padding:0.25rem 0.5rem;border:1px solid var(--g2);background:var(--white)}
.cact{display:flex;gap:1rem;margin-top:0.25rem}
.terms{display:flex;gap:0.625rem;align-items:flex-start;margin:0.875rem 0 0.5rem;font-size:0.875rem;cursor:pointer}.terms input{width:1.25rem;height:1.25rem;margin-top:1px;flex:none;accent-color:var(--black)}.terms a{text-decoration:underline}
.ck .f input,.ck .f select,.ck .f textarea{width:100%}
.ck .box input[type=checkbox],.ck .box input[type=radio]{width:auto}
.ck .cpn input{width:auto;flex:1;min-width:0}
.ck>.f{display:grid;gap:1rem;align-content:start}.ck>.f>.box{margin:0}
.ck .note>*,.ck .note{display:flex;align-items:center;gap:0.625rem}.ck .note{padding:0.75rem 0.875rem}.ck .note .ic{flex:none}

/* ---- phase 31: organised shop page ---- */
.shop{gap:1.25rem}
@media(min-width:900px){.shop{grid-template-columns:13.125rem minmax(0,1fr);gap:1.75rem}}
.shm{min-width:0}
.shm .bar{margin:0 0 0.625rem}
.tb{display:none;align-items:center;justify-content:space-between;gap:0.75rem;padding:0 0 0.75rem;margin:0 0 1rem;border-bottom:1px solid var(--g2)}
.tb .count{margin:0;font-size:0.875rem}
.tb select{width:auto;min-height:2.5rem;padding:0.375rem 2rem 0.375rem 0.75rem;border:1px solid var(--g2);background-color:var(--white)}
.shop .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 0.625rem}
@media(min-width:640px){.shop .grid{grid-template-columns:repeat(auto-fill,minmax(11.875rem,1fr));gap:1.25rem 0.875rem}}
@media(min-width:1100px){.shop .grid{grid-template-columns:repeat(auto-fill,minmax(13.125rem,1fr))}}
.cbody,[data-theme=modern] .cbody{display:flex;flex-direction:column;align-items:stretch;gap:0.25rem;padding:0.625rem 0.75rem 0.75rem}
@media(min-width:700px){.cbody{flex-direction:column;align-items:stretch;gap:0.25rem}}
.card h3{min-height:2.7em}
.cbody .pr{flex-wrap:wrap;gap:0.25rem 0.5rem}
.cbody .save{margin:0;font-size:0.6875rem;padding:1px 0.3125rem;border-width:1px}
.qab{margin:auto 0.625rem 0.625rem;width:auto;min-height:2.375rem;font-size:0.8125rem}
.side{border:1px solid var(--g2);border-radius:0.5rem;padding:0.875rem 1rem;background:var(--white)}
.side h2{font-size:0.9375rem;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--g2);padding-bottom:0.625rem;margin:0 0 0.25rem}
.side a{padding:0.625rem 0.5rem;margin:0 -8px;border-bottom:0;border-radius:0.375rem}.side a.on{background:var(--g1);color:var(--black)}.side a:hover{background:var(--g1);color:var(--black)}
.shop .empty{grid-column:1/-1;text-align:center;padding:3rem 0}
.qab{margin-top:0.625rem}.card h3{min-height:0}.cbody .pr{margin-top:2px}

/* ---- phase 32: product card (image + zoom + wishlist, details, cart button) ---- */
.qab{display:none!important}
.card .ci{display:block;position:relative}
.card .zb{position:absolute;right:0.625rem;top:3.375rem}
.card .wl{top:0.5rem;right:0.5rem}
.card .zb{display:flex;align-items:center;justify-content:center;width:2.125rem;height:2.125rem;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--black);cursor:pointer;z-index:3;box-shadow:0 1px 0.25rem rgba(0,0,0,.15)}
.card .zb .ic{width:1.0625rem;height:1.0625rem}
.card .soldout{position:absolute;left:0;right:0;bottom:0;background:rgba(17,17,17,.82);color:#fff;text-align:center;font-weight:700;font-size:0.75rem;padding:0.375rem 0;letter-spacing:.3px}
.cbody{gap:0.375rem}
.card h3{font-size:0.875rem;line-height:1.35}
.cbody .save{display:inline-flex;align-items:center;gap:0.25rem;width:fit-content;font-size:0.75rem;font-weight:700;border:0;background:var(--g1);color:var(--black);padding:0.1875rem 0.5rem;border-radius:0.25rem}
.cbody .save .ic{width:0.75rem;height:0.75rem}
.cfoot{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-top:2px}
.cfoot .pr{flex:1;min-width:0;flex-wrap:wrap;gap:2px 0.5rem}
.cfoot .pr b{font-size:1.0625rem}.cfoot .pr em{font-style:normal;font-size:0.75rem;font-weight:700;color:var(--ay,var(--red))}
.cbtn{flex:none;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border:0;border-radius:50%;background:var(--black);color:var(--white);cursor:pointer}
.cbtn:hover{background:#333}.cbtn .ic{width:1.125rem;height:1.125rem}
.cfoot .pr em{display:none}@media(min-width:1100px){.cfoot .pr em{display:inline}}

/* ---- phase 33: shop without banner / sidebar ---- */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.shop,.shop.wrap{display:block;padding-top:1.25rem}
.shop .catd{margin:0 0 0.875rem;color:var(--g3);max-width:45rem}
.shop .bar{flex-wrap:wrap;overflow:visible;gap:0.5rem;margin:0 0 0.875rem}
.shop .bar .chip{display:inline-flex!important;min-height:2.5rem;padding:0.375rem 1.125rem;font-size:0.875rem}
@media(max-width:639px){.shop .bar{flex-wrap:nowrap;overflow-x:auto;margin-right:-16px;padding-right:1rem}}
.shop .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:640px){.shop .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem 1rem}}
@media(min-width:1000px){.shop .grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1400px){.shop .grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.shop .tb{margin-bottom:1.25rem}

/* ---- phase 34: functional colours (same in every theme/palette) ----
   green = good/saved/in stock, red = delete/error/out of stock, amber = pending/warning */
:root{--ok:#1B7F3B;--ok2:#E7F5EC;--dg:#D92D20;--dg2:#FDECEA;--wn:#B26A00;--wn2:#FFF4DB}
.err{color:var(--dg);border-left:0.25rem solid var(--dg);background:var(--dg2);padding:0.625rem 0.75rem;border-radius:0.25rem;font-weight:500}
.err[hidden]{display:none}
.ln .rm,.cdr .ib{color:var(--dg)}.ln .rm:hover,.cdr .ib:hover{color:#a31d13}
.cdr .ib{border-color:transparent}
.stock.in{color:var(--ok)}.stock.out{color:var(--dg)}
.cbody .save{background:var(--ok2);color:var(--ok)}
.sum .disc,.sum .disc span{color:var(--ok);font-weight:600}
.card .soldout{background:rgba(185,28,28,.92);color:#fff}
.wl[aria-pressed=true],.pwl[aria-pressed=true]{color:var(--dg)}
.opt.need{outline:2px solid var(--dg);outline-offset:0.1875rem;border-radius:0.25rem}
.optr .optl{color:inherit}
.f input:user-invalid,.f textarea:user-invalid{border-color:var(--dg)}
.ok::before{content:"✓";display:flex;align-items:center;justify-content:center;width:4rem;height:4rem;margin:0 auto 1rem;border-radius:50%;background:var(--ok);color:#fff;font-size:2.125rem;font-weight:700}
.ok b{color:var(--ok)}
.stt{text-transform:capitalize}.stt.s-delivered,.stt.s-completed,.stt.s-paid{color:var(--ok)}.stt.s-cancelled,.stt.s-failed,.stt.s-returned,.stt.s-refunded,.stt.s-rejected{color:var(--dg)}.stt.s-pending,.stt.s-processing,.stt.s-confirmed,.stt.s-shipped,.stt.s-onhold{color:var(--wn)}
.nt{position:fixed;left:50%;bottom:5.25rem;transform:translate(-50%,0.75rem);z-index:95;opacity:0;pointer-events:none;color:#fff;padding:0.6875rem 1.125rem;border-radius:0.5rem;font-weight:600;font-size:0.875rem;box-shadow:0 0.375rem 1.25rem rgba(0,0,0,.2);transition:opacity .18s,transform .18s;max-width:calc(100% - 2rem)}
.nt.show{opacity:1;transform:translate(-50%,0)}.nt.ok{background:var(--ok)}.nt.bad{background:var(--dg)}
@media(min-width:900px){.nt{bottom:1.75rem}}
.terms input:focus-visible{outline:2px solid var(--ok)}
.ln .rm.neu{color:var(--g3)}.ln .rm.neu:hover{color:var(--black)}

/* ---- phase 35: page builder blocks ---- */
.blks{display:block}
.blk-in{max-width:73.75rem;margin:0 auto;padding:0.75rem 1rem}.blk-in.full{max-width:none;padding-left:0;padding-right:0}
.blk.hasbg .blk-in{padding-top:1.5rem;padding-bottom:1.5rem}
@media(max-width:639px){.hide-m{display:none!important}}@media(min-width:640px){.hide-d{display:none!important}}
.bh{margin:0 0 0.75rem;line-height:1.2}h1.bh{font-size:clamp(1.75rem,5vw,2.75rem)}h2.bh{font-size:clamp(1.375rem,3.6vw,2rem)}h3.bh{font-size:1.375rem}h4.bh{font-size:1.125rem}
.bt{line-height:1.7}.bt p{margin:0 0 1em}.bt-s{font-size:0.875rem}.bt-l{font-size:1.1875rem}.bt a{text-decoration:underline}
.bi{margin:0}.bi img{width:100%;height:auto;display:block}.bi-l{max-width:56.25rem}.bi-m{max-width:37.5rem}.bi-s{max-width:20rem}
.blk-in[style*="center"] .bi,.blk-in[style*="center"] .bi-l,.blk-in[style*="center"] .bi-m,.blk-in[style*="center"] .bi-s{margin-left:auto;margin-right:auto}.blk-in[style*="right"] .bi{margin-left:auto}
.bg{display:grid;grid-template-columns:repeat(2,1fr);gap:0.625rem}@media(min-width:700px){.bg{grid-template-columns:repeat(var(--c),1fr)}}.bg figure{margin:0}.bg img{width:100%;height:100%;aspect-ratio:1;object-fit:cover;display:block}
.bb.bl{padding:1rem 2.25rem;font-size:1.0625rem}.bsp{display:block}.bd{border:0;border-top:1px solid var(--g2);margin:0.5rem 0}
.bnr{position:relative;overflow:hidden;display:flex;align-items:center;background:var(--g2)}.bnr picture,.bnr img{display:block;width:100%}.bnr img{object-fit:cover;height:100%;position:absolute;inset:0}
.bnr-s{min-height:12.5rem}.bnr-m{min-height:20rem}.bnr-l{min-height:30rem}@media(max-width:639px){.bnr-m{min-height:16.25rem}.bnr-l{min-height:22.5rem}}
.bov{position:absolute;inset:0;background:#000;pointer-events:none}.bnt{position:relative;z-index:1;color:#fff;padding:1.5rem 2rem;max-width:40rem}.bnt h2{font-size:clamp(1.625rem,5vw,3rem);margin:0 0 0.625rem;line-height:1.1}.bnt p{margin:0 0 1rem;font-size:1.0625rem}
.blk-in[style*="center"] .bnr{justify-content:center;text-align:center}.blk-in[style*="right"] .bnr{justify-content:flex-end;text-align:right}
.bgrid{grid-template-columns:repeat(2,minmax(0,1fr))}@media(min-width:700px){.bgrid{grid-template-columns:repeat(min(var(--c),3),minmax(0,1fr))}}@media(min-width:1000px){.bgrid{grid-template-columns:repeat(var(--c),minmax(0,1fr))}}
.bcat{display:grid;grid-template-columns:repeat(2,1fr);gap:0.75rem}@media(min-width:700px){.bcat{grid-template-columns:repeat(auto-fill,minmax(11.25rem,1fr))}}
.bcl{display:block;text-align:center;font-weight:600}.bcl img,.bcl .noimg{width:100%;aspect-ratio:1;object-fit:cover;background:var(--g1);display:block;margin-bottom:0.5rem;border-radius:var(--r)}
.bfaq{max-width:51.25rem}.bfaq details{border-bottom:1px solid var(--g2)}.bfaq summary{cursor:pointer;font-weight:600;padding:0.875rem 1.75rem 0.875rem 0;list-style:none;position:relative;min-height:2.75rem}.bfaq summary::-webkit-details-marker{display:none}.bfaq summary::after{content:"+";position:absolute;right:0.25rem;top:0.625rem;font-size:1.375rem}.bfaq details[open] summary::after{content:"−"}.bfaq details>div{padding:0 0 0.875rem;line-height:1.7}.bfaq p{margin:0 0 .8em}
.bfe{display:grid;grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));gap:1.25rem}.bfe>div{display:flex;flex-direction:column;gap:0.375rem}.bfe .ic{width:1.875rem;height:1.875rem;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.bfe p{margin:0;color:var(--g3)}
.bvid{position:relative;aspect-ratio:16/9;max-width:56.25rem;background:#000}.bvid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.blk-in[style*="center"] .bvid{margin:0 auto}
.bco{list-style:none;margin:0;padding:0;display:grid;gap:0.625rem}.bco li{display:flex;gap:0.625rem;align-items:center}.bco .ic{width:1.25rem;height:1.25rem;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.bcols{display:grid;gap:var(--gap,1.5rem);grid-template-columns:1fr}@media(min-width:760px){.bcols{grid-template-columns:repeat(var(--n),minmax(0,1fr))}}.bcols.nostack{grid-template-columns:repeat(var(--n),minmax(0,1fr))}
.bcol>.blk>.blk-in{padding-left:0;padding-right:0}.bcol{min-width:0}
.bph{border:1px dashed var(--g2);color:var(--g3);padding:1.375rem;text-align:center;font-size:0.875rem;background:var(--g1)}.bph.big{padding:4.375rem 1rem;font-size:1rem}

/* ---- phase 37: one layout system (header, content and footer share the same container) ----
   Container = 80rem wide, side padding 1rem (phone) / 2rem (desktop). Header and footer backgrounds run edge to edge. */
:root{--w:80rem;--gx:1rem}
@media(min-width:900px){:root{--gx:2rem}}
html,body{min-height:100%}
body{min-height:100vh;display:flex;flex-direction:column;padding-bottom:0!important}
#app{flex:1 0 auto;width:100%}
#ftr{flex:none}
.wrap{max-width:var(--w);padding-left:var(--gx);padding-right:var(--gx)}
.sh{max-width:var(--w);padding-left:var(--gx);padding-right:var(--gx)}
.blk-in{max-width:var(--w);padding-left:var(--gx);padding-right:var(--gx)}.blk-in.full{max-width:none;padding-left:0;padding-right:0}
.bcol>.blk>.blk-in{padding-left:0;padding-right:0}
[data-theme] .herow,[data-theme=modern] .herow,[data-theme=soft] .herow{width:calc(100% - 2 * var(--gx));max-width:calc(var(--w) - 2 * var(--gx));margin:1rem auto 0}
@media(min-width:900px){
  [data-theme] .hd{padding-left:max(var(--gx),calc((100% - var(--w)) / 2 + var(--gx)));padding-right:max(var(--gx),calc((100% - var(--w)) / 2 + var(--gx)));min-height:4.75rem}
  .hd .logo img{height:2.75rem}
}
@media(max-width:899px){[data-theme] .hd{padding-left:0.5rem;padding-right:0.75rem}}
/* footer: edge to edge band, no box, nothing below it */
[data-theme] .ft,[data-theme=modern] .ft,[data-theme=soft] .ft{margin:3.5rem 0 0;border-radius:0;max-width:none}
.ft .wrap{padding-top:3rem;padding-bottom:2.25rem}
@media(min-width:900px){.ft .wrap{padding-top:3.5rem;padding-bottom:2.5rem;gap:3rem}}
.fbar{border-top:1px solid rgba(255,255,255,.14)}
.fbar .wrap{display:flex;flex-direction:column;align-items:flex-start;gap:0.375rem;padding-top:1.125rem;padding-bottom:1.125rem}
.fbar small{color:#a3a39d;font-size:0.8125rem;line-height:1.5}
@media(min-width:700px){.fbar .wrap{flex-direction:row;align-items:center;justify-content:space-between;gap:1rem}}
@media(max-width:899px){[data-theme] .ft{padding-bottom:calc(4rem + env(safe-area-inset-bottom))}body[data-page=product] .ft{padding-bottom:calc(4.5rem + env(safe-area-inset-bottom))}}
.ft .wrap,.fbar .wrap{padding-left:var(--gx);padding-right:var(--gx)}

/* ---- phase 38: the whole site scales with the screen (no browser zoom needed) ----
   Every size is in rem; the root size follows the display: a little smaller on small phones and small laptops,
   16px on a typical laptop, and gently larger on Full HD, 2K and 4K screens so nothing looks tiny. */
html{font-size:clamp(14.5px,calc(14.5px + (100vw - 320px) * 0.0214),16px)}
@media(min-width:900px){html{font-size:clamp(14.5px,calc(14.5px + (100vw - 900px) * 0.0032),16px)}}
@media(min-width:1366px){html{font-size:clamp(16px,calc(16px + (100vw - 1366px) * 0.0045),22px)}}
.narrow{max-width:60rem;margin-left:auto;margin-right:auto}
/* nothing may push the page sideways */
html,body{overflow-x:clip;max-width:100%}
.ck>*,.pd>*,.shop>*,.grid>*,.bcols>*,.ln>*,.mini>*,.cdl>*{min-width:0}
.f input,.f select,.f textarea,.box input,.box select,.box textarea{max-width:100%;min-width:0}
input,select,textarea{max-width:100%}

/* ---- keyboard-safe overlays + mobile quick-add (ph39) ---- */
.qm,.dov,.pop,.zm{top:var(--vvt,0);bottom:auto;height:var(--vvh,100dvh);overscroll-behavior:contain}
.qmb,.dlg,.popbox{max-height:calc(var(--vvh,100dvh) - 2rem);overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.cd.open{top:var(--vvt,0);bottom:auto;height:var(--vvh,100dvh)}
body.ovl{overflow:hidden}
.noimg{display:grid;place-items:center;font-size:2rem;background:var(--g1);color:var(--g3)}
.qmr .btn{white-space:nowrap;min-width:0}
@media(max-width:600px){
 .qm{align-items:flex-end;padding:0}
 .qmb{width:100%;align-self:auto;border-radius:1.25rem 1.25rem 0 0;padding:1.5rem 1rem calc(1rem + env(safe-area-inset-bottom));max-height:calc(var(--vvh,100dvh) - 1rem);animation:qup .22s ease-out}
 .qmb::before{content:"";position:absolute;top:.5rem;left:50%;width:2.5rem;height:.3rem;margin-left:-1.25rem;border-radius:1rem;background:var(--g2)}
 .qmx{top:.75rem;right:.75rem}
 .qmc{grid-template-columns:6.5rem 1fr;gap:.875rem;margin-top:.5rem}
 .qmc img,.qmc .noimg{width:6.5rem;border-radius:.5rem}
 .qmr{flex-direction:row;gap:.5rem}.qmr .btn{padding:.75rem .5rem;font-size:.9375rem}
 .dov,.pop{padding:.5rem}
 .dlg{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom))}
}
.kb .dov,.kb .pop{align-items:flex-start;padding-top:.5rem}
.kb .qm{align-items:flex-end}
@keyframes qup{from{transform:translateY(40%);opacity:.4}to{transform:none;opacity:1}}

/* ---- quick view redesign (ph40) ---- */
.qmb.qmw{width:min(54rem,100%);padding:1.5rem}
.qv{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}
.qvg{position:relative;min-width:0}
.qvm{background:var(--g1);border-radius:.5rem;overflow:hidden;aspect-ratio:1/1.05;display:grid}
.qvm img,.qvm .noimg{width:100%;height:100%;object-fit:cover;aspect-ratio:auto;display:block}
.qvw{position:absolute;top:.625rem;left:.625rem;width:2.5rem;height:2.5rem;border-radius:50%;background:#fff;color:var(--black);border:1px solid var(--g2);font-size:1.25rem;display:grid;place-items:center;cursor:pointer;padding:0}
.qvw[aria-pressed=true]{color:var(--dg)}
.qvd{position:absolute;top:3.5rem;left:.625rem;font-size:.875rem;padding:.25rem .625rem}
.qvt{display:flex;gap:.5rem;margin-top:.625rem;overflow-x:auto;padding-bottom:.125rem}
.qvt button{flex:0 0 4rem;height:4.75rem;padding:0;border:2px solid transparent;border-radius:.375rem;overflow:hidden;background:var(--g1);cursor:pointer}
.qvt button[aria-current=true]{border-color:var(--red)}
.qvt img{width:100%;height:100%;object-fit:cover;display:block}
.qvi{min-width:0}
.qvi h3{font-size:1.5rem;margin:0 2rem .5rem 0;line-height:1.2;padding-bottom:.75rem;border-bottom:1px solid var(--g2)}
.qvp{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap;margin:.5rem 0 1rem}.qvp b{font-size:2rem;line-height:1}.qvp s{color:var(--g3);font-size:1.125rem}
.qvo{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.375rem 0 1rem}
.qvo button{min-width:0;width:100%;padding:.75rem .25rem}
.qvq{display:inline-flex;align-items:stretch;border:1px solid var(--g2);border-radius:.375rem;margin:0 0 1rem}
.qvq button{width:2.75rem;font-size:1.25rem;background:none;border:0;cursor:pointer;color:var(--black)}.qvq span{min-width:2.75rem;display:grid;place-items:center;font-weight:700;border:solid var(--g2);border-width:0 1px}
.qmw .qmr{margin:0 0 .5rem}.qmw .qmr .btn{padding:.9rem .5rem}
.qmw .mu{display:block;text-align:center;margin:.5rem 0 1rem;font-weight:600}
.qvtr{display:grid;grid-template-columns:repeat(auto-fit,minmax(4.5rem,1fr));gap:.5rem;border-top:1px solid var(--g2);padding-top:1rem;margin:0;text-align:center}
.qvtr>div{display:flex;flex-direction:column;align-items:center;gap:.25rem;font-size:.75rem}.qvtr b{font-size:.75rem;font-weight:600}.qvtr span{display:none}.qvtr svg{width:1.5rem;height:1.5rem}
.qmw .qmx{top:.75rem;right:.75rem;z-index:2}
@media(max-width:700px){
 .qv{grid-template-columns:1fr;gap:1rem}
 .qmb.qmw{padding:1.5rem 1rem calc(1rem + env(safe-area-inset-bottom))}
 .qvm{aspect-ratio:1/.9}
 .qvi h3{font-size:1.375rem;margin:0;border:0;padding:0}
 .qvp{margin:.375rem 0 .875rem}.qvp b{font-size:1.875rem}
 .qvtr{display:none}
 .qvd{display:none}
}
.qmw .qmx{background:#fff;color:#111;border-radius:50%;width:2.25rem;height:2.25rem;display:grid;place-items:center;box-shadow:0 .125rem .5rem rgba(0,0,0,.25);padding:0;font-size:1rem}
.qvg .qvd{top:auto;bottom:.625rem;left:.625rem;right:auto;margin:0}
.qvi h3{margin-right:0;padding-right:2.5rem}
.qvtr{background:none;border-width:1px 0 0;border-radius:0;box-shadow:none;display:grid}
.qvtr>div{background:none;border:0;box-shadow:none;padding:0}
.qvtr svg{background:none}
.qvtr>div>svg,.qvtr>div>span:first-child{background:none}
@media(max-width:700px){.qvg .qvd{display:block}.qvi h3{padding-right:0}}
.qmw .qvi .qvp{border:0;padding:0}
.qmw .qvtr{border:0;border-top:1px solid var(--g2);border-radius:0;background:none;box-shadow:none;padding:1rem 0 0;gap:.5rem;margin:.5rem 0 0}
.qmw .qvtr>div{border:0;background:none;box-shadow:none;border-radius:0;padding:0;min-width:0}
.qmw .qvtr svg{background:none;padding:0;width:1.5rem;height:1.5rem;border-radius:0}
.qmw .qvtr>div>svg:first-child{background:none}
/* ---- product gallery: square main image, thumbnails underneath (ph41) ---- */
.gal .ci img,.gal .ci .noimg{aspect-ratio:1/1;width:100%;height:auto;object-fit:cover}
.gal .ci .noimg{display:grid;place-items:center}
@media(min-width:900px){.gal.has-th{display:block}.gal .th{order:0;flex-direction:row;margin-top:.75rem!important;overflow-x:auto!important}.gal .th button{flex:0 0 5rem!important;width:5rem}}
.gal .th{display:flex;flex-direction:row;gap:.5rem;margin-top:.625rem;overflow-x:auto}
.gal .th button{flex:0 0 4.5rem;width:4.5rem;aspect-ratio:1/1}
.gal .th img{width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;display:block}
/* ---- bigger product gallery (ph42) ---- */
@media(min-width:900px){.pd{grid-template-columns:1.45fr 1fr;gap:2rem}.gal{position:static}.gal .th{gap:.75rem;margin-top:.875rem!important}.gal .th button{flex:0 0 6.5rem!important;width:6.5rem}}
@media(min-width:1366px){.pd{grid-template-columns:1.55fr 1fr}}
@media(max-width:899px){.gal .th button{flex:0 0 5rem;width:5rem}}
.gal .th button{border-radius:.25rem;border-width:2px}
.gal .th button[aria-current=true]{border-color:var(--black)}
.gal .ci{box-shadow:0 .125rem .75rem rgba(0,0,0,.12);cursor:zoom-in}
@media(hover:hover){.gal .ci::after{content:"Click to zoom";position:absolute;right:.75rem;bottom:.75rem;background:rgba(0,0,0,.55);color:#fff;font-size:.8125rem;padding:.4rem .875rem;border-radius:2rem;pointer-events:none}}
/* ---- compact, professional product gallery (ph43, overrides ph42) ---- */
@media(min-width:900px){.pd{grid-template-columns:minmax(0,34rem) minmax(0,1fr);gap:2.5rem}.gal{position:sticky;top:6.5rem;max-width:34rem}.gal .th{gap:.625rem;margin-top:.75rem!important}.gal .th button{flex:0 0 4.25rem!important;width:4.25rem}}
@media(min-width:1366px){.pd{grid-template-columns:minmax(0,34rem) minmax(0,1fr)}}
@media(max-width:899px){.gal{max-width:26rem;margin:0 auto}.gal .th button{flex:0 0 4rem;width:4rem}}

/* ---- product card: full-width Add to Cart button (ph44) ---- */
.cfoot{flex-direction:column;align-items:stretch;gap:.625rem;margin-top:.25rem}
.cfoot .pr{flex:none}
.cbtn{width:100%;height:auto;min-height:2.5rem;border-radius:var(--r,.375rem);gap:.5rem;padding:.55rem .75rem;background:transparent;color:var(--black);border:1.5px solid var(--black);font-weight:700;font-size:.875rem;white-space:nowrap;transition:background .15s,color .15s}
.cbtn span{line-height:1}
.cbtn:hover,.cbtn:focus-visible{background:var(--black);color:var(--white)}
.cbtn .ic{width:1.125rem;height:1.125rem;flex:none}
@media(max-width:380px){.cbtn{font-size:.8125rem;padding:.5rem}}
/* ---- mobile gallery full width + square cards (ph45) ---- */
.gal{width:100%}
@media(max-width:899px){.gal{max-width:30rem;margin-left:auto;margin-right:auto}}
.gal .ci{width:100%;aspect-ratio:1/1}
.gal .ci img,.gal .ci .noimg{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.card .ci,.card .ci img,.card .ci .noimg{aspect-ratio:1/1}
.card .ci img{width:100%;height:100%;object-fit:cover}
.card .ci{background:var(--g1)}
.sk{aspect-ratio:1/1}

/* ---- mobile menu drawer redesign (ph46) ---- */
.dr{padding:0;width:88%;max-width:22rem;overflow:hidden;border-radius:0 1rem 1rem 0}
.drh{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1.125rem;border-bottom:1px solid var(--g2);flex:none}
.drlogo{padding:0!important;border:0!important;display:flex}.drlogo img{height:1.875rem;width:auto;max-width:11rem;object-fit:contain}
.dr .drx{align-self:auto;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--g1);display:grid;place-items:center;font-size:1rem;padding:0}
.drb{flex:1;overflow-y:auto;padding:.5rem 1.125rem 1rem;overscroll-behavior:contain}
.drl{display:flex;flex-direction:column}
.dr .drl a{display:flex;align-items:center;justify-content:space-between;padding:1rem .125rem;font-size:1.0625rem;font-weight:600;border-bottom:1px solid var(--g2)}
.dr .drl a .ic{width:1.125rem;height:1.125rem;color:var(--g3)}
.dr .drt{margin:1.25rem 0 .625rem;font:700 .8125rem/1 var(--fb,inherit);text-transform:uppercase;letter-spacing:.08em;color:var(--g3)}
.drc{display:flex;flex-wrap:wrap;gap:.5rem}
.dr .drc a{padding:.55rem 1rem;border:1px solid var(--g2);border-radius:2rem;font-size:.9375rem;font-weight:600;background:var(--g1)}
.dr .drc a:hover{background:var(--black);color:var(--white);border-color:var(--black)}
.drf{flex:none;padding:.875rem 1.125rem calc(.875rem + env(safe-area-inset-bottom));border-top:1px solid var(--g2);background:var(--white)}
.dr a.drcall{display:flex;align-items:center;gap:.875rem;padding:.75rem 1rem;border:0;border-radius:.75rem;background:var(--ok,#16a34a);color:#fff;font-weight:600}
.dr a.drcall:hover{color:#fff;filter:brightness(.92)}
.drcall .ic{width:1.5rem;height:1.5rem;flex:none}
.drcall span{display:flex;flex-direction:column;line-height:1.25}.drcall small{font-size:.75rem;opacity:.9;font-weight:500}.drcall b{font-size:1.125rem;letter-spacing:.02em}

/* ---- drop-down menus (ph47) ---- */
.dd{position:relative;display:flex;align-self:stretch;align-items:center}
.nav .dd>a,.nav .ddb{display:flex;align-items:center;gap:.25rem}
.ddb{background:none;border:0;font:inherit;font-weight:600;text-transform:inherit;letter-spacing:inherit;color:inherit;cursor:pointer;padding:0}
.nav .dd>a .ic,.ddb .ic{width:.875rem;height:.875rem;transform:rotate(90deg);transition:transform .15s}
.dd.open>a .ic,.dd.open>.ddb .ic,.dd:hover>a .ic{transform:rotate(-90deg)}
.ddm{position:absolute;top:100%;left:0;min-width:13rem;background:var(--white);border:1px solid var(--g2);border-radius:.5rem;box-shadow:0 .75rem 2rem rgba(0,0,0,.14);padding:.375rem;display:none;z-index:50;flex-direction:column}
.dd:hover>.ddm,.dd.open>.ddm{display:flex}
.nav .ddm a{padding:.65rem .875rem;border:0;margin:0;border-radius:.375rem;text-transform:none;letter-spacing:0;font-size:.9375rem;font-weight:600;align-self:auto;white-space:nowrap}
.nav .ddm a:hover{background:var(--g1);color:var(--red)}
.dr .drd{border-bottom:1px solid var(--g2)}
.dr .drd summary{display:flex;align-items:center;justify-content:space-between;padding:1rem .125rem;font-size:1.0625rem;font-weight:600;cursor:pointer;list-style:none}
.dr .drd summary::-webkit-details-marker{display:none}
.dr .drd summary .ic{width:1.125rem;height:1.125rem;color:var(--g3);transition:transform .15s}
.dr .drd[open] summary .ic{transform:rotate(90deg)}
.dr .drd>div{display:flex;flex-direction:column;padding:0 0 .5rem .875rem;border-left:2px solid var(--g2);margin:0 0 .75rem .25rem}
.dr .drl .drd>div a{padding:.7rem .25rem;font-size:1rem;font-weight:500;border-bottom:0}
.dr .drd summary::after,.dr .drd[open] summary::after{content:none!important;display:none!important}

/* ---- cart drawer redesign (ph48) ---- */
.cd{width:min(25rem,100%)}
.cdh,[data-theme=soft] .cdh,[data-theme=modern] .cdh{background:var(--white);color:var(--black);border-bottom:1px solid var(--g2);padding:.875rem 1rem;font-family:inherit;text-transform:none;letter-spacing:0;font-size:1.125rem;font-weight:700}
.cdh .ib,[data-theme=soft] .cdh .ib,[data-theme=modern] .cdh .ib{color:var(--black);background:var(--g1);width:2.25rem;height:2.25rem;border-radius:50%;display:grid;place-items:center;font-size:1rem;padding:0;min-height:0;min-width:0}
.cdhh{display:flex;align-items:center;gap:.5rem}.cdhh .ic{width:1.25rem;height:1.25rem}
.cdhh em{font-style:normal;background:var(--black);color:var(--white);font-size:.75rem;font-weight:700;min-width:1.375rem;height:1.375rem;border-radius:1rem;display:grid;place-items:center;padding:0 .4rem}
.cdb{padding:.75rem}
.cdl{display:grid;grid-template-columns:5.5rem 1fr;gap:.875rem;padding:.75rem;margin-bottom:.625rem;border:1px solid var(--g2)}
.cdi{display:block;border-radius:.5rem;overflow:hidden;background:var(--g1);align-self:start}
.cdi img,.cdi .noimg{width:100%;aspect-ratio:1/1;object-fit:cover;display:grid;place-items:center;font-size:1.5rem}
.cdn{min-width:0;display:flex;flex-direction:column;gap:.3rem}
.cdtop{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}
.cdname{font-weight:700;font-size:.9375rem;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cdrm{flex:none;border:0;background:none;color:var(--dg);width:2rem;height:2rem;margin:-.25rem -.25rem 0 0;border-radius:50%;display:grid;place-items:center;cursor:pointer;padding:0}
.cdrm:hover{background:var(--dg2,#fde8e6)}.cdrm .ic{width:1.125rem;height:1.125rem}
.cdopt{align-self:flex-start;background:var(--g1);border:1px solid var(--g2);border-radius:.25rem;padding:.125rem .5rem;font-size:.8125rem;font-weight:600}
.cdunit{font-size:.875rem;color:var(--g3);font-weight:600}.cdunit small{font-weight:400}
.cdrow{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:auto;padding-top:.375rem}
.cdtot{font-size:1.0625rem}
.cdl .q{border:1px solid var(--g2);border-radius:.375rem}
.cdf{display:flex;flex-direction:column;gap:.5rem;padding:1rem 1rem calc(1rem + env(safe-area-inset-bottom));border-top:1px solid var(--g2);background:var(--white);grid-template-columns:none}
.cdsum{display:flex;justify-content:space-between;align-items:baseline;font-size:.9375rem;font-weight:600;padding:0;text-align:left;color:var(--black)}
.cdf .cdsum b{display:inline;font-size:1.375rem}
.cdf .cdnote{margin:0;font-size:.8125rem;color:var(--g3)}
.cdf a.cdgo{min-height:3.25rem;border-radius:var(--r,.375rem);background:var(--black);color:var(--white);font-size:1rem}
.cdf a.cdgo:hover{background:var(--red)}
.cdf a.cdmore{background:none;color:var(--black);min-height:2.25rem;font-size:.9375rem;font-weight:600;text-decoration:underline}
.cdf a.cdmore:hover{background:none;color:var(--red)}
@media(max-width:899px){.cdf{margin-bottom:0}}
.cdf div.cdsum{padding:0;text-align:left;font-size:.9375rem;color:var(--black)}
/* ---- hero: full-bleed, flush under header, slightly shorter (ph49) ---- */
[data-theme] .herow,[data-theme=modern] .herow,[data-theme=soft] .herow,.herow{width:100%;max-width:none;margin:0;border-radius:0;overflow:hidden}
.herow .hero,.herow .slide{border-radius:0}
.slide img{display:block;width:100%;max-height:min(68vh,34rem);min-height:12rem;object-fit:cover;object-position:center}
@media(max-width:600px){.slide img{height:17rem;min-height:17rem;max-height:17rem;object-fit:cover;object-position:center}}
.blk-hero .blk-in,.blk-trust .blk-in{padding:0!important;max-width:none}.blk-hero,.blk-trust{padding:0!important}.bhero .herow{margin:0!important}

/* ph56 — category tiles: name overlaid on image */
.tile,[data-theme] .tile{border-radius:0.75rem;border:0;overflow:hidden;isolation:isolate}
.tile img{aspect-ratio:1/1;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.tile::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(0,0,0,.78) 0%,rgba(0,0,0,.35) 38%,rgba(0,0,0,0) 68%)}
.tile span,[data-theme] .tile span{z-index:2;background:transparent;color:#fff;border:0;padding:1rem 1rem 0.9rem;font-size:1.0625rem;font-weight:700;letter-spacing:.2px;text-transform:none;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.tile span .ic{width:2rem;height:2rem;padding:0.4rem;border-radius:50%;background:rgba(255,255,255,.2);backdrop-filter:blur(4px);color:#fff;flex:none;transition:transform .25s,background .25s}
@media(hover:hover){.tile:hover span{color:#fff}.tile:hover span .ic{background:#fff;color:#111;transform:translateX(3px)}}
@media(min-width:800px){.tile span,[data-theme] .tile span{font-size:1.25rem;padding:1.25rem 1.25rem 1.1rem}}
/* ph58 — square category images */
.tile img,[data-theme] .tile img{aspect-ratio:1/1!important;object-fit:cover}

/* ===== ph61: customer dashboard (simple, modern), order panel, duplicate-order help ===== */
.btn.sm{min-height:2.5rem;padding:.4rem 1rem;font-size:.8125rem;letter-spacing:.4px}
.acd{--an:#0f172a;--ac:#3b82f6;--ab:#e2e8f0;--am:#64748b;--ag:#10b981;font-family:Inter,"Noto Sans Bengali",system-ui,-apple-system,sans-serif;background:transparent;color:#1e293b;max-width:34rem;margin:0 auto;padding:1rem 1rem 3rem;border-radius:0}
.acd svg.ic{width:1.125rem;height:1.125rem}
.acd .btn{text-transform:none;letter-spacing:0;font-weight:600;border-radius:.75rem;min-height:2.5rem;padding:.4rem 1.1rem;font-size:.875rem;background:#3b82f6;border-color:#3b82f6;color:#fff}
.acd .btn:hover{background:#1d4ed8;border-color:#1d4ed8}
.acd .btn.alt{background:#fff;color:#1e293b;border-color:var(--ab)}.acd .btn.alt:hover{background:#f1f5f9;color:#1e293b;border-color:var(--ab)}
.ahd{background:linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);color:#fff;border-radius:1.25rem;padding:1.25rem;margin-bottom:1rem;box-shadow:0 10px 25px -5px rgba(59,130,246,.3);display:block}
.ahu{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.ahu h2{margin:0;font-size:1.125rem;font-weight:600;color:#fff;text-transform:none;font-family:inherit}.ahu p{margin:.15rem 0 0;font-size:.75rem;opacity:.85;color:#fff}
.aav{flex:none;width:3rem;height:3rem;background:#ffffff33;backdrop-filter:blur(8px);border-radius:50%;display:grid;place-items:center;font:700 1.25rem Inter,system-ui,sans-serif;color:#fff}
.atier{background:#ffffff1a;padding:.75rem;border-radius:.75rem;margin-bottom:1rem;display:block;font-size:inherit;color:#fff}
.abd{display:inline-flex;align-items:center;gap:.3rem;background:#f59e0b;color:#fff;font-size:.6875rem;font-weight:600;padding:.125rem .5rem;border-radius:99px;margin-bottom:.5rem}
.abd.t-silver{background:#94a3b8}.abd.t-gold{background:#eab308}.abd.t-platinum{background:#8b5cf6}
.apb{width:100%;height:.375rem;background:#ffffff33;border-radius:99px;overflow:hidden;margin-bottom:.375rem;flex:none}.apb i{display:block;height:100%;background:#f59e0b;border-radius:99px;transition:width .3s}
.atier small{font-size:.6875rem;opacity:.9;display:block;color:#fff}
.ast{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;text-align:center;background:#ffffff1a;padding:.75rem;border-radius:.75rem}
.ast div{text-align:center}.ast b{display:block;font-size:1rem;font-weight:700;color:#fff}.ast small{font-size:.6875rem;opacity:.8;color:#fff}
.atab{display:flex;background:#fff;padding:.25rem;border-radius:.75rem;margin-bottom:1rem;box-shadow:0 1px 3px #0000000d;gap:.25rem;border-bottom:0;overflow-x:auto;scrollbar-width:none}.atab::-webkit-scrollbar{display:none}
.atab button{flex:1;background:transparent;border:0;margin:0;padding:.625rem;font:inherit;font-size:.8125rem;font-weight:500;color:var(--am);border-radius:.5rem;cursor:pointer;transition:all .2s;min-height:2.5rem;white-space:nowrap}
.atab button.on{background:#3b82f6;color:#fff;font-weight:600}
.ash{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin:0 0 .75rem .25rem}.ash h2{margin:0;font-size:1rem;font-weight:600;color:#1e293b;text-transform:none;font-family:inherit}
.ala{display:inline-flex;align-items:center;gap:.35rem;background:none;border:0;color:#3b82f6;font:inherit;font-weight:600;font-size:.8125rem;cursor:pointer;min-height:2.5rem}
.aol{display:grid;gap:1rem}
.aoc{background:#fff;border:1px solid var(--ab);border-radius:1rem;padding:1rem;display:grid;gap:.75rem;min-width:0;box-shadow:0 4px 6px -1px #00000005}
.aoc.x{opacity:.85}
.aoh{display:flex;justify-content:space-between;align-items:center;gap:.75rem;font-size:.8125rem}.aoh b{display:block;color:#0f172a;font-size:.9375rem}.aoh small{color:var(--am);font-size:.75rem}
.sp{padding:.25rem .7rem;border-radius:99px;font-size:.6875rem;font-weight:600;background:#fef3c7;color:#b45309;white-space:nowrap}
.sp.s-processing,.sp.s-confirmed,.sp.s-shipped{background:#dbeafe;color:#1d4ed8}.sp.s-delivered{background:#d1fae5;color:#047857}.sp.s-cancelled{background:#fee2e2;color:#b91c1c}
.aob{display:flex;gap:.75rem;align-items:center;background:#f8fafc;padding:.75rem;border-radius:.625rem}
.aoi{position:relative;flex:none;width:4rem;height:4rem;border-radius:.625rem;overflow:hidden;background:#e2e8f0}.aoi img,.aoi i{width:100%;height:100%;object-fit:cover;display:block}.aoi b{position:absolute;right:.2rem;bottom:.2rem;background:#0f172ad9;color:#fff;font-size:.625rem;padding:.05rem .35rem;border-radius:99px}
.aom{min-width:0}.aom h3{margin:0 0 .25rem;font-size:.875rem;color:#0f172a;text-transform:none;font-family:inherit;line-height:1.3}.aom p{margin:0;color:var(--am);font-size:.75rem}.aom .aeta{color:#047857;font-weight:600}
.stp{list-style:none;margin:.25rem 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr)}
.stp li{display:grid;justify-items:center;gap:.25rem;text-align:center;position:relative;color:var(--am);font-size:.625rem;line-height:1.2}
.stp li i{position:relative;z-index:1;width:1.5rem;height:1.5rem;border-radius:50%;border:0;background:#e2e8f0;color:#64748b;font-style:normal;font-size:.6875rem;display:grid;place-items:center}
.stp li::before{content:"";position:absolute;top:.6875rem;left:-50%;right:50%;height:2px;background:#e2e8f0}.stp li:first-child::before{display:none}
.stp li.done i{background:#10b981;color:#fff}.stp li.done::before{background:#10b981}.stp li span{font-weight:500}.stp li.done span,.stp li.cur span{color:#0f172a;font-weight:600}
.stp li.cur i{box-shadow:0 0 0 4px #10b9812e}.stp li small{display:none}
.stp.off{display:flex;gap:.75rem;align-items:center;background:#fee2e2;border-radius:.75rem;padding:.75rem}.stp.off small{display:block;color:var(--am)}
.stx{width:1.75rem;height:1.75rem;border-radius:50%;background:#dc2626;color:#fff;display:grid;place-items:center;flex:none}
.acr{background:#eff6ff;border-radius:.75rem;padding:.75rem;display:grid;gap:.6rem}
.acrh{display:flex;gap:.6rem;align-items:flex-start;font-size:.875rem}.acrh svg{width:1.25rem;height:1.25rem;flex:none;margin-top:.1rem;color:#3b82f6}.acrh small{display:block;color:var(--am);word-break:break-all;font-size:.75rem}
.ard{display:flex;align-items:center;gap:.65rem;background:#fff;border-radius:.625rem;padding:.55rem}.ard>div{flex:1;min-width:0;font-size:.875rem}.ard small{display:block;color:var(--am);font-size:.75rem}
.arav{flex:none;width:2.25rem;height:2.25rem;border-radius:50%;background:#10b981;color:#fff;display:grid;place-items:center;font-weight:700}
.alink{font-weight:600;text-decoration:underline;font-size:.75rem;color:#1d4ed8}
.ado summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;min-height:2.5rem;font-weight:600;font-size:.8125rem;color:#1e293b;border-top:1px solid var(--ab);padding-top:.25rem}.ado summary::-webkit-details-marker{display:none}
.ado summary::after,.ado[open] summary::after{content:none!important;display:none!important}
.ado summary .ic{transition:transform .2s}.ado[open] summary .ic{transform:rotate(180deg)}
.ali{display:grid;gap:.6rem;margin:.5rem 0}.ali1{display:flex;gap:.65rem;align-items:center;font-size:.875rem}.ali1 img,.ali1>i{width:2.75rem;height:2.75rem;object-fit:cover;border-radius:.5rem;background:#f1f5f9;flex:none}.ali1>div{flex:1;min-width:0}.ali1 small{display:block;color:var(--am)}.ali1 a{font-weight:600;color:#0f172a}
.apr{display:grid;gap:.3rem;border-top:1px solid var(--ab);padding-top:.6rem;font-size:.8125rem}.apr div{display:flex;justify-content:space-between}.apr span{color:var(--am)}.apr .dc{color:#047857}.apr .tt{font-weight:700;color:#0f172a}
.aad{display:flex;gap:.4rem;margin:.6rem 0 0;color:var(--am);font-size:.8125rem}.aad svg{flex:none}
.atl{list-style:none;margin:.75rem 0 0;padding:0 0 0 1rem;border-left:2px solid var(--ab);display:grid;gap:.6rem;font-size:.8125rem}.atl li{position:relative}.atl li::before{content:"";position:absolute;left:-1.35rem;top:.35rem;width:.6rem;height:.6rem;border-radius:50%;background:#3b82f6}.atl small{display:block;color:var(--am)}
.aft{display:flex;gap:.5rem;flex-wrap:wrap}.aft:empty{display:none}.aft .btn svg{width:1rem;height:1rem}
.ahelp{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;color:var(--g3);font-size:.875rem}
.aem{text-align:center;background:#fff;border:1px dashed var(--ab);border-radius:1rem;padding:2rem 1rem;display:grid;gap:.5rem;justify-items:center}.aem p{margin:0;color:var(--am)}
.afl{display:flex;gap:.5rem;overflow-x:auto;margin-bottom:1rem;scrollbar-width:none}.afl::-webkit-scrollbar{display:none}
.afl button{flex:none;background:#fff;border:1px solid var(--ab);border-radius:99px;padding:.4rem .9rem;font:inherit;font-weight:500;font-size:.8125rem;color:var(--am);cursor:pointer;min-height:2.25rem}.afl button.on{background:#3b82f6;border-color:#3b82f6;color:#fff;font-weight:600}
.acf{max-width:none}
.dupx{max-width:30rem;margin:2rem auto;padding:0 1rem;text-align:center}.dupi{width:4rem;height:4rem;border-radius:50%;background:var(--g1);display:grid;place-items:center;margin:0 auto 1rem}.dupi svg{width:1.75rem;height:1.75rem}
.dupb{display:grid;gap:.6rem;margin:1rem 0}.btn.wa{background:#1fa855;border-color:#1fa855;color:#fff}.btn.wa:hover{background:#168a45;border-color:#168a45}
@media (prefers-reduced-motion:reduce){.apb i,.ado summary .ic{transition:none}}

/* ===== Blue app look (Theme colour option "app"): soft slate background, blue accent, rounded cards ===== */
:root[data-palette=app]{--black:#1e293b;--red:#2563eb;--bg:#f8fafc;--ft:#0f172a;--g1:#f1f5f9;--g2:#e2e8f0;--g3:#64748b;--ac2:#eaf1ff;--r:.75rem}
[data-palette=app] body{background:#f8fafc;color:#1e293b}
[data-palette=app] .hd,[data-palette=app] .tabs,[data-palette=app] .buybar{background:#fff}
[data-palette=app] .ann{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}[data-palette=app] .ann,[data-palette=app] .ann a{color:#fff}
[data-palette=app] .btn,[data-palette=app] .btn.red{background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-color:#1d4ed8;color:#fff;border-radius:.75rem}
[data-palette=app] .btn:hover,[data-palette=app] .btn.red:hover{background:#1d4ed8;border-color:#1d4ed8}
[data-palette=app] .btn.alt{background:#fff;color:#1e293b;border-color:#e2e8f0}[data-palette=app] .btn.alt:hover{background:#f1f5f9;color:#1e293b;border-color:#e2e8f0}
[data-palette=app] .card,[data-palette=app] .box,[data-palette=app] .pnl,[data-palette=app] .side,[data-palette=app] .tile,[data-palette=app] .trust>div,[data-palette=app] .herow,[data-palette=app] .promo img,[data-palette=app] .gal .ci,[data-palette=app] .ft{border-radius:1rem}
[data-palette=app] .card,[data-palette=app] .box,[data-palette=app] .pnl,[data-palette=app] .side{border-color:#e2e8f0;box-shadow:0 4px 6px -1px #00000005}
[data-palette=app] .badge,[data-palette=app] .cn{background:#2563eb}
[data-palette=app] .qa{background:#2563eb;border-radius:.625rem}
[data-palette=app] select,[data-palette=app] input,[data-palette=app] textarea{border-radius:.75rem;border-color:#e2e8f0}
[data-palette=app] input:focus,[data-palette=app] select:focus,[data-palette=app] textarea:focus{border-color:#3b82f6;box-shadow:0 0 0 .1875rem #3b82f633}
[data-palette=app] .chip.on,[data-palette=app] .opt button[aria-pressed=true]{background:#2563eb;border-color:#2563eb}
[data-palette=app] .opt button,[data-palette=app] .q,[data-palette=app] .chip,[data-palette=app] .note,[data-palette=app] .dlg,[data-palette=app] .cdl,[data-palette=app] .th button{border-radius:.75rem}
[data-palette=app] .nav a{border-radius:.75rem}
[data-palette=app] .price,[data-palette=app] .sh em{color:#2563eb}
[data-palette=app] .cdf a{background:#2563eb}[data-palette=app] .cdf a:hover{background:#1d4ed8}
[data-palette=app] .ft{background:#0f172a}

/* Stock Out overlay: dims the whole picture with a centred label */
.ci .soldout,.card .soldout,[data-theme=modern] .soldout,[data-theme=soft] .soldout{position:absolute;inset:0;left:0;right:0;top:0;bottom:0;display:grid;place-items:center;background:rgba(255,255,255,.62);backdrop-filter:grayscale(1);-webkit-backdrop-filter:grayscale(1);padding:0;pointer-events:none;color:#fff}
.ci .soldout b{background:rgba(17,17,17,.88);color:#fff;font-weight:700;font-size:.8125rem;letter-spacing:.8px;text-transform:uppercase;padding:.5rem 1.1rem;border-radius:99px;transform:rotate(-8deg);box-shadow:0 2px 10px rgba(0,0,0,.25)}
.gal .ci .soldout b{font-size:1.125rem;padding:.7rem 1.75rem}

/* account dashboard on tablets and desktops: wider, hero in one row */
@media (min-width:48rem){
.acd{max-width:62rem;padding:1.5rem 1.5rem 4rem}
.ahd{display:grid;grid-template-columns:1.1fr 1.2fr 1fr;gap:1rem;align-items:stretch;padding:1.25rem 1.5rem}
.ahd .ahu,.ahd .atier,.ahd .ast{margin:0}.ahd .ahu{align-self:center}.ahd .atier{align-self:center}.ahd .ast{align-self:center}
.ahu h2{font-size:1.375rem}.aav{width:3.5rem;height:3.5rem;font-size:1.5rem}
.ast b{font-size:1.25rem}.ast small,.atier small,.abd{font-size:.75rem}
.atab{max-width:36rem}.atab button{font-size:.9375rem;padding:.75rem}
.ash h2{font-size:1.25rem}.ala{font-size:.9375rem}
.aoc{padding:1.5rem;gap:1rem}.aoh b{font-size:1.0625rem}.aoh small{font-size:.875rem}.sp{font-size:.8125rem;padding:.3rem .85rem}
.aob{padding:1rem;gap:1rem}.aoi{width:5.5rem;height:5.5rem}.aom h3{font-size:1.0625rem}.aom p{font-size:.875rem}
.stp li{font-size:.8125rem}.stp li i{width:1.75rem;height:1.75rem;font-size:.8125rem}.stp li::before{top:.8125rem}
.ado summary,.apr,.ali1,.acrh,.ard>div{font-size:.9375rem}
.aft .btn{min-height:2.75rem;font-size:.9375rem}
.acr{padding:1rem}
}
[data-palette=app] .pm,[data-palette=app] .mini .noimg{border-radius:.75rem}
[data-palette=app] .pm:has(input:checked){border-color:#3b82f6;background:#eff6ff;outline:0}
[data-palette=app] input[type=checkbox],[data-palette=app] input[type=radio]{accent-color:#2563eb}
[data-palette=app] .sum .tot{border-top-color:#e2e8f0}

/* ===== STANDARD SIZING (one scale for the whole storefront) =====
   Text:   small 13px · body 15px · input 16px · card title 15px · section 20/24px · page title 24/30px
   Boxes:  radius 12px · card padding 16px · section gap 40px
   Click:  button 44px (primary action 48px, small 36px) · input 44px · icon button 44px · size chip 40px
   Fixed 16px root: nothing grows on big monitors (the old scaling past 1366px made everything look large). */
html:root{font-size:16px}
:root:root body{font-size:.9375rem;line-height:1.5}
/* titles */
:root:root #app h1:not(.vh),:root:root .bn,:root:root .ptop h1,:root:root .ok h1{font-family:Inter,"Noto Sans Bengali",system-ui,sans-serif;font-size:1.5rem;line-height:1.25;font-weight:700;letter-spacing:0;text-transform:none}
:root:root .bn{padding-top:1.5rem}
:root:root .sh h2,:root:root h2.ct,:root:root .side h2{font-family:Inter,"Noto Sans Bengali",system-ui,sans-serif;font-size:1.25rem;line-height:1.3;font-weight:700;letter-spacing:0;text-transform:none}
:root:root h1.bh{font-size:1.5rem}:root:root h2.bh{font-size:1.25rem}:root:root h3.bh{font-size:1.125rem}:root:root h4.bh{font-size:1rem}
:root:root .bnt h2{font-size:clamp(1.5rem,4vw,2rem)}
:root:root .sh{margin-top:2.5rem}
:root:root .box h2,:root:root .sec h2,:root:root .cdh{font-size:1.0625rem;line-height:1.3}
:root:root .ft h4{font-size:1rem}
:root:root .tile span{font-size:1rem}
:root:root .trust b{font-size:.9375rem}:root:root .trust span{font-size:.8125rem}
/* buttons */
:root:root .btn,:root:root .hcta{min-height:2.75rem;padding:.5rem 1.25rem;font-size:.9375rem;font-weight:600;line-height:1.2}
:root:root .inline .btn.red,:root:root .buybar .btn,:root:root .stick .btn{min-height:3rem;font-size:1rem}
:root:root .cbtn{min-height:2.5rem;font-size:.875rem}
:root:root .va{min-height:2.25rem;padding:.4rem 1rem;font-size:.875rem}
:root:root .qa{font-size:.8125rem}
:root:root .chip{min-height:2.25rem;font-size:.8125rem}
:root:root .opt button{min-height:2.5rem;min-width:2.5rem;padding:.4rem .875rem;font-size:.875rem}
:root:root .q button{font-size:1.125rem}
/* fields */
:root:root input:not([type=checkbox]):not([type=radio]),:root:root select{min-height:2.75rem;padding:.5rem .75rem;font-size:1rem}
:root:root textarea{padding:.625rem .75rem;font-size:1rem}
/* price */
:root:root .price{font-size:1.5rem}:root:root .card .pr{font-size:1rem}
/* header */
:root:root .hd{min-height:4rem}
:root:root .logo img{height:2.25rem}
:root:root .nav a{font-size:.9375rem}
:root:root .ann{font-size:.8125rem}
@media(min-width:48rem){
:root:root #app h1:not(.vh),:root:root .bn,:root:root .ok h1{font-size:1.875rem}
:root:root .ptop h1{font-size:1.75rem}
:root:root .sh h2,:root:root h2.ct{font-size:1.5rem}
:root:root h1.bh{font-size:1.875rem}:root:root h2.bh{font-size:1.5rem}
:root:root .hd{min-height:4.5rem}
:root:root .logo img{height:2.5rem}
:root:root .hd .logo img{height:2.5rem}
:root:root .price{font-size:1.75rem}
}
:root:root .herow,:root:root[data-palette] .herow,:root:root[data-theme] .herow{width:100%;max-width:none;margin:0;border-radius:0;overflow:hidden}
:root:root .herow .hero,:root:root .herow .slide,:root:root .herow .slide img{border-radius:0}
@media(min-width:900px) and (max-width:79rem){:root:root .trust{padding-inline:2rem}}
@media(min-width:79.0625rem){:root:root .trust{padding-inline:0;box-sizing:border-box;max-width:76rem}}
@media(max-width:899px){:root:root .trust{padding-inline:1rem}}

/* ===== ph64: professional polish (storefront) — one calm, consistent layer on top of everything above ===== */
:root:root{--soft:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);--rad:.875rem}
:root:root .ann{background:#0f172a;background-image:none;color:#cbd5e1;font-size:.8125rem;font-weight:500;padding:.5rem 1rem;letter-spacing:.01em}
:root:root .ann a{color:#fff;font-weight:600;text-decoration:none}:root:root .ann a:hover{text-decoration:underline}
:root:root .hd{background:#fff;border-bottom:1px solid var(--line);box-shadow:none}
:root:root .nav a{font-weight:500;font-size:.9375rem;position:relative}
:root:root .nav a::after{content:"";position:absolute;left:0;right:0;bottom:-.25rem;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .2s}
:root:root .nav a:hover::after{transform:scaleX(1)}
/* section headings: plain, even, no loud highlight word */
:root:root .sh{margin-block:3rem 1.25rem;align-items:flex-end}
:root:root .sh h2{font-family:inherit;text-transform:none;font-size:1.5rem;line-height:1.2;font-weight:700;letter-spacing:-.015em}
:root:root .sh em{color:inherit}
:root:root .sh a{background:none;padding:0;font-size:.875rem;font-weight:600;color:var(--red)}:root:root .sh a:hover{text-decoration:underline}
@media(min-width:48rem){:root:root .sh h2{font-size:1.875rem}}
/* trust strip: one quiet bar instead of three boxes */
:root:root .trust{gap:0;background:#fff;border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;padding-inline:0;margin:1.25rem 1rem 0;width:auto;max-width:none}
:root:root .trust>div{background:transparent;border:0;border-radius:0;box-shadow:none;padding:1rem 1.25rem}
:root:root .trust>div+div{border-top:1px solid var(--line)}
@media(min-width:900px){:root:root .trust{margin:1.25rem 2rem 0}:root:root .trust>div+div{border-top:0;border-left:1px solid var(--line)}}
@media(min-width:79.0625rem){:root:root .trust{max-width:76rem;margin:1.25rem auto 0}}
/* product cards: image first, one price line, one action */
:root:root .card{background:transparent;border:0;box-shadow:none;border-radius:0;overflow:visible}
:root:root .card .ci{border-radius:var(--rad);overflow:hidden;aspect-ratio:1/1;background:#e2e8f0}
:root:root .card .ci img{width:100%;height:100%;max-height:none;min-height:0;object-fit:cover;transition:transform .45s ease}
:root:root .card:hover .ci img{transform:scale(1.03)}
:root:root .card .badge{border-radius:999px;background:#fff;color:var(--red);font-weight:700;font-size:.75rem;padding:.1875rem .5rem;box-shadow:0 1px 3px rgba(15,23,42,.12)}
:root:root .card .cbody{padding:.75rem .125rem 0}
:root:root .card h3{font-size:.9375rem;font-weight:500;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0}
:root:root .card{display:flex;flex-direction:column;position:relative}:root:root .card .cbody{display:flex;flex-direction:column;flex:1}:root:root .card .cfoot{margin-top:auto;padding-top:.5rem}
:root:root .card .save,:root:root .card .pr em{display:none}
:root:root .card .pr{display:flex;align-items:baseline;gap:.5rem;margin:.375rem 0 0}
:root:root .card .pr b{font-size:1.0625rem;font-weight:700;letter-spacing:-.01em;color:var(--black)}
:root:root .card .pr s{font-size:.8125rem;color:#94a3b8}
:root:root .card .cbtn{width:100%;margin-top:.75rem;height:2.5rem;border-radius:.625rem;background:var(--black);color:#fff;border:0;font-weight:600;font-size:.875rem;justify-content:center;transition:background .2s}
:root:root .card .cbtn:hover{background:var(--red)}
:root:root .grid{gap:1.75rem 1rem}
@media(min-width:48rem){:root:root .grid{gap:2rem 1.25rem}}
/* buttons */
:root:root .btn{border-radius:.75rem;font-weight:600;letter-spacing:0}
:root:root .btn:not(.alt):not(.wa){background:var(--red);background-image:none;color:#fff;border-color:transparent;box-shadow:none}:root:root .btn:not(.alt):not(.wa):hover{filter:brightness(.92)}
/* product page */
:root:root .pnl{background:#fff;border:1px solid var(--line);border-radius:1rem;box-shadow:var(--soft)}
:root:root .gal .ci,:root:root .gal .zoomable{border-radius:1rem;overflow:hidden}
:root:root .price{font-weight:800;letter-spacing:-.02em}
:root:root .note{background:#f1f5f9;border:0;border-radius:.75rem;color:var(--black)}
:root:root .pnl table{border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:.625rem;overflow:hidden;width:100%}
:root:root .pnl th,:root:root .pnl td{padding:.625rem .875rem;border:0;text-align:left}
:root:root .pnl th{background:#f8fafc;font-weight:600}
:root:root .pnl tr+tr th,:root:root .pnl tr+tr td{border-top:1px solid var(--line)}
:root:root .ct{font-family:inherit;text-transform:none;font-size:1.25rem;font-weight:700;letter-spacing:-.01em;border-bottom:1px solid var(--line)}
/* footer */
:root:root #ftr,:root:root .ft{border-radius:0}
:root:root .ft h4{font-size:.875rem;font-weight:600;color:#94a3b8;margin-bottom:.75rem}
:root:root .ft a{color:#e2e8f0;transition:color .15s}:root:root .ft a:hover{color:#fff}

/* ph64: every product picture is square (1:1): cards, product page, gallery, cart, quick view, suggestions */
:root:root .card .ci img,:root:root .card .ci .noimg,:root:root .gal .ci img,:root:root .gal .ci .noimg,:root:root .th img,:root:root .qmc img,:root:root .qmc .noimg,:root:root .ln img,:root:root .qvm img{aspect-ratio:1/1;object-fit:cover}
:root:root .sug a img,:root:root .sug a .noimg{width:2.5rem;height:2.5rem}

/* ph66 less rounded: small, clean corners */
:root:root,:root:root[data-palette],:root:root[data-theme]{--rad:4px;--r:4px}
:root:root .card,:root:root .card .ci,:root:root .card .ci img,:root:root .card .ci .noimg,:root:root .cbtn,:root:root .btn,:root:root .trust,:root:root .pnl,:root:root .tile,:root:root .tile img,:root:root .gal .ci,:root:root .gal .ci img,:root:root .th,:root:root .th img,:root:root .qmc,:root:root .qvm,:root:root .qvm img,:root:root .note,:root:root .sk,:root:root .ln img,:root:root input:not([type=checkbox]):not([type=radio]),:root:root select,:root:root textarea,:root:root .box,:root:root .sg,:root:root .opt,:root:root .chip{border-radius:4px}
:root:root .card .badge,:root:root .card .tag,:root:root .card .bd{border-radius:2px}

/* ph67 product card: image slider + info row with cart icon */
:root:root .card .ci{overflow:hidden;position:relative;display:block}
:root:root .card .cs{display:flex;width:100%;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
:root:root .card .cs::-webkit-scrollbar{display:none}
:root:root .card .csl{flex:0 0 100%;scroll-snap-align:start;aspect-ratio:1/1}
:root:root .card .csl img{width:100%;height:100%;object-fit:cover;display:block}
:root:root .card .cdots{position:absolute;left:0;right:0;bottom:.5rem;display:flex;justify-content:center;gap:.3rem;z-index:2;pointer-events:none}
:root:root .card .cdots i{width:.4rem;height:.4rem;border-radius:50%;background:rgba(255,255,255,.7);box-shadow:0 0 0 1px rgba(0,0,0,.15);pointer-events:auto;cursor:pointer;transition:width .2s,background .2s}
:root:root .card .cdots i.on{background:#fff;width:.9rem;border-radius:.4rem}
:root:root .card .badge{position:absolute;left:.5rem;top:.5rem;z-index:2;background:var(--red);color:#fff;font-size:.75rem;font-weight:700;padding:.2rem .45rem;border-radius:3px;line-height:1.2}
:root:root .card .soldout{position:absolute;left:0;right:0;bottom:0;z-index:2}
:root:root .card .cbody{padding:.6rem .15rem 0;display:flex;flex-direction:column;gap:.4rem;flex:1}
:root:root .card .cfoot{display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem;margin-top:auto}
:root:root .card .cinfo{display:flex;flex-direction:column;gap:.3rem;min-width:0}
:root:root .card .save{display:inline-flex!important;align-items:center;gap:.25rem;align-self:flex-start;background:#ecfdf3;color:#067647;font-size:.72rem;font-weight:600;padding:.15rem .45rem;border-radius:3px}
:root:root .card .save .ic{width:.8rem;height:.8rem}
:root:root .card .pr{display:flex;flex-wrap:wrap;align-items:baseline;gap:.1rem .45rem;margin:0}
:root:root .card .pr b{font-size:1.05rem;font-weight:700}
:root:root .card .pr s{font-size:.8rem;color:#94a3b8}
:root:root .card .pr em{display:inline!important;font-style:normal;font-size:.75rem;font-weight:700;color:#dc2626}
:root:root .card .cbtn{flex:0 0 auto;width:2.5rem;height:2.5rem;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--black);color:#fff;border:0}
:root:root .card .cbtn .ic{width:1.2rem;height:1.2rem}
:root:root .card .cbtn span{display:none}
:root:root .card .cfoot{flex-direction:row;align-items:flex-end;padding-top:0}
:root:root .card .ci .soldout{inset:auto 0 0 0;display:block;background:rgba(17,17,17,.82);backdrop-filter:none;-webkit-backdrop-filter:none;padding:.35rem 0}
:root:root .card .ci .soldout b{transform:none;background:none;box-shadow:none;border-radius:0;padding:0;font-size:.75rem;letter-spacing:.3px;text-transform:none}
:root:root .card .wl{width:2rem;height:2rem;font-size:1.05rem;top:.5rem;right:.5rem}
:root:root .card .zb{width:2rem;height:2rem;top:2.9rem;right:.5rem}

/* ph68 card = reference layout (bordered card, zoom top-right, heart bottom-right, free-delivery badge bottom-left) */
:root:root .grid{gap:.5rem}
@media(min-width:48rem){:root:root .grid{gap:1rem}}
:root:root .card{background:#fff;border:1px solid #e5e7eb;border-radius:8px;overflow:hidden;padding:0}
:root:root .card .ci,:root:root .card .ci img,:root:root .card .ci .noimg{border-radius:0}
:root:root .card .badge{left:.4rem;top:.4rem;background:#e11d48;border-radius:4px;font-size:.7rem;padding:.15rem .4rem}
:root:root .card .zb{top:.4rem;right:.4rem;width:1.75rem;height:1.75rem;background:rgba(15,23,42,.55);color:#fff;box-shadow:none}
:root:root .card .zb .ic{width:.95rem;height:.95rem}

:root:root .card .cmedia{position:relative}
:root:root .card .wl{top:auto;bottom:.4rem;right:.4rem;width:1.9rem;height:1.9rem;box-shadow:0 1px 3px rgba(0,0,0,.2)}
:root:root .card .fdel{position:absolute;left:.4rem;bottom:.4rem;z-index:2;display:inline-flex;align-items:center;gap:.2rem;background:#16a34a;color:#fff;font-size:.65rem;font-weight:700;padding:.18rem .4rem;border-radius:4px;line-height:1.2}
:root:root .card .fdel .ic{width:.7rem;height:.7rem}
:root:root .card .cdots{bottom:.65rem}
:root:root .card.oos .wl{bottom:2.1rem}
:root:root .card .cbody{padding:.5rem .55rem .6rem;gap:.35rem}
:root:root .card h3{font-size:.8rem;font-weight:600;line-height:1.3;min-height:2.6em}
:root:root .card .save{background:#16a34a;color:#fff;font-weight:700;font-size:.7rem;border-radius:4px;padding:.18rem .45rem}
:root:root .card .save .ic{width:.75rem;height:.75rem;stroke:#fff}
:root:root .card .pr b{font-size:1rem}
:root:root .card .pr s{font-size:.75rem}
:root:root .card .pr em{font-size:.7rem}
:root:root .card .cbtn{width:2.4rem;height:2.4rem;border-radius:8px;background:#1e293b}
:root:root .card.multi .fdel{bottom:1.05rem}:root:root .card .cdots{bottom:.4rem}

/* ph69 clean + sharp look sitewide: small uniform corners, flat surfaces, thin borders */
:root:root{--rad:6px;--r:6px}
:root:root .btn,:root:root .pnl,:root:root .box,:root:root .note,:root:root .nt,:root:root .tile,:root:root .tile img,:root:root .trust>div,:root:root .trust,:root:root .side,:root:root .side a,:root:root .qvm,:root:root .qmb,:root:root .cd,:root:root .cdi,:root:root .cdl,:root:root .cdt img,:root:root .dlg,:root:root .ddm,:root:root .promo img,:root:root .pm,:root:root .q,:root:root .qa,:root:root .sp,:root:root .opt button,:root:root .th button,:root:root .nav a,:root:root .bi,:root:root .bi img,:root:root .bg figure,:root:root .bg img,:root:root .hcta,:root:root .mini .noimg,:root:root .gal .zoomable,:root:root .gal .ci,:root:root .gal .ci img,:root:root .pnl table,:root:root .stp.off,:root:root .soc a,:root:root .trust .ic{border-radius:6px}
:root:root .ft,:root:root #ftr,:root:root .herow,:root:root .herow .hero,:root:root .slide img{border-radius:0}
:root:root .pnl,:root:root .card,:root:root .tile,:root:root .trust,:root:root .side,:root:root .qvm,:root:root .box{box-shadow:none}
:root:root .pnl,:root:root .side,:root:root .box{border:1px solid #e5e7eb;background:#fff}
:root:root .trust{border:1px solid #e5e7eb}
:root:root .sh{margin-block:2rem .9rem}
:root:root .sh h2{font-size:1.2rem;font-weight:700;letter-spacing:0}
:root:root .sh a{font-size:.85rem;font-weight:600}
:root:root .btn{font-weight:600;letter-spacing:0;text-transform:none}
:root:root input:not([type=checkbox]):not([type=radio]),:root:root select,:root:root textarea{border:1px solid #d1d5db;background:#fff;border-radius:6px}
:root:root input:focus,:root:root select:focus,:root:root textarea:focus{outline:2px solid var(--red);outline-offset:0;border-color:var(--red)}
:root:root .hd{box-shadow:none;border-bottom:1px solid #e5e7eb}
@media(max-width:47.99rem){:root:root .sh{margin-block:1.5rem .75rem}:root:root .sh h2{font-size:1.1rem}}
:root:root .sh{display:flex;align-items:center;justify-content:space-between;gap:1rem}:root:root .sh h2{margin:0}
:root:root .card .cbtn{width:2.9rem;height:2.9rem;flex-direction:column;gap:.1rem;font-size:.62rem;font-weight:700}
:root:root .card .cbtn span{display:block;line-height:1}
:root:root .card .cbtn .ic{width:1.15rem;height:1.15rem}
:root:root .card .cfoot{flex-direction:column;align-items:stretch;gap:.5rem}
:root:root .card .cbtn{width:100%;height:2.25rem;flex-direction:row;gap:.4rem;font-size:.8rem;font-weight:700;border-radius:6px}
:root:root .card .cbtn .ic{width:1.1rem;height:1.1rem}
:root:root .card .cfoot{flex-direction:row;align-items:flex-end;gap:.5rem}
:root:root .card .cbtn{width:2.6rem;height:2.6rem;flex:0 0 auto;border-radius:8px;gap:0}
:root:root .card .cbtn .ic{width:1.75rem;height:1.75rem;stroke-width:1.8}

/* ph70 tighter product page spacing */
:root:root .pd{padding-bottom:0}
:root:root .wrap:has(> h2.ct){padding-top:0}
:root:root h2.ct{margin-top:1.25rem}
:root:root .wrap>.sh{padding-inline:0;margin-block:1.25rem .75rem}
:root:root .pnl{margin-bottom:0}
:root:root .gal .th{display:flex;justify-content:center;align-items:center;flex-wrap:wrap}

/* ph71 colour by context (not one theme colour everywhere) */
:root:root{--h-blue:#2563eb;--h-blue-t:#e8f0ff;--h-orange:#ea580c;--h-orange-t:#fff1e6;--h-violet:#7c3aed;--h-violet-t:#f1eaff;--h-teal:#0d9488;--h-teal-t:#e0f7f4;--h-rose:#e11d48;--h-rose-t:#ffe8ee;--h-green:#16a34a;--h-green-t:#e6f7ec}
/* section headings: coloured accent bar + matching "View all" */
:root:root [data-hue=blue]{--hc:var(--h-blue);--ht:var(--h-blue-t)}
:root:root [data-hue=orange]{--hc:var(--h-orange);--ht:var(--h-orange-t)}
:root:root [data-hue=violet]{--hc:var(--h-violet);--ht:var(--h-violet-t)}
:root:root [data-hue=teal]{--hc:var(--h-teal);--ht:var(--h-teal-t)}
:root:root [data-hue=rose]{--hc:var(--h-rose);--ht:var(--h-rose-t)}
:root:root [data-hue=green]{--hc:var(--h-green);--ht:var(--h-green-t)}
:root:root .sh[data-hue] h2,:root:root h2.bh[data-hue]{border-left:4px solid var(--hc);padding-left:.6rem;line-height:1.2}
:root:root .sh[data-hue] a,:root:root .sh[data-hue] .va{color:var(--hc);background:var(--ht);padding:.3rem .7rem;border-radius:6px;font-weight:700;font-size:.8rem}
/* trust bar icons: a different colour each */
:root:root .trust>div:nth-child(1) .ic{color:var(--h-green);background:var(--h-green-t)}
:root:root .trust>div:nth-child(2) .ic{color:var(--h-blue);background:var(--h-blue-t)}
:root:root .trust>div:nth-child(3) .ic{color:var(--h-orange);background:var(--h-orange-t)}
:root:root .trust>div:nth-child(4) .ic{color:var(--h-violet);background:var(--h-violet-t)}
/* category tiles: tinted overlay per tile */
:root:root .tile:nth-child(6n+1) span{background:linear-gradient(transparent,rgba(37,99,235,.82))}
:root:root .tile:nth-child(6n+2) span{background:linear-gradient(transparent,rgba(234,88,12,.82))}
:root:root .tile:nth-child(6n+3) span{background:linear-gradient(transparent,rgba(124,58,237,.82))}
:root:root .tile:nth-child(6n+4) span{background:linear-gradient(transparent,rgba(13,148,136,.82))}
:root:root .tile:nth-child(6n+5) span{background:linear-gradient(transparent,rgba(225,29,72,.82))}
:root:root .tile:nth-child(6n+6) span{background:linear-gradient(transparent,rgba(22,163,74,.82))}
/* product page: discount in red, stars amber, info rows tinted */
:root:root .pnl .badge,:root:root .price .badge{background:var(--h-rose);color:#fff}
:root:root .st,:root:root .rv .st{color:#f59e0b}
:root:root .note>div:nth-child(1),:root:root .note>.ic+span{color:inherit}
:root:root .note{background:var(--h-blue-t);border:1px solid #cfe0ff}
:root:root .note .ic{color:var(--h-blue)}
:root:root .note>div:nth-child(2) .ic{color:var(--h-green)}
:root:root .cn{background:var(--h-rose);color:#fff}
/* card: price stays ink, discount % rose, add-to-cart in ink, hover lifts border in section colour */
:root:root .card .pr em{color:var(--h-rose)}
:root:root .card:hover{border-color:#cbd5e1}
:root:root .card .cbtn{background:#0f172a}
:root:root .card .cbtn:hover{background:var(--h-blue)}
/* round icon buttons stay perfect circles */
:root:root .wl,:root:root .zb,:root:root .pwl,:root:root .qvw{box-sizing:border-box;padding:0;flex:none;aspect-ratio:1/1;min-width:0;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;overflow:hidden}
:root:root .card .wl{width:2rem;height:2rem;font-size:1.1rem}
:root:root .card .zb{width:1.75rem;height:1.75rem}

/* ph72 HOME page only: clean editorial look (cards are image + name + price, nothing else) */
:root:root .home .hgrid,:root:root .home .bgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem .75rem}
@media(min-width:48rem){:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:2.25rem 1.25rem}}
@media(min-width:70rem){:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
:root:root .hc{display:flex;flex-direction:column;gap:.55rem;background:none;border:0;padding:0}
:root:root .hc .hci{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:#f1f3f5;border-radius:2px}
:root:root .hc .hci img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:opacity .35s ease,transform .6s ease}
:root:root .hc .hci .hci2{opacity:0}
@media(hover:hover){:root:root .hc:hover .hci .hci2{opacity:1}:root:root .hc:hover .hci img:first-child:last-child{transform:scale(1.04)}}
:root:root .hc .noimg{position:absolute;inset:0;aspect-ratio:auto}
:root:root .hc h3{font-size:.875rem;font-weight:500;line-height:1.35;margin:.15rem 0 0;color:#334155;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:0}
:root:root .hc h3 a:hover{color:#0f172a}
:root:root .hc .hpr{margin:0;display:flex;align-items:baseline;gap:.5rem;font-size:.95rem}
:root:root .hc .hpr b{font-weight:700;color:#0f172a}
:root:root .hc .hpr s{color:#94a3b8;font-size:.8rem}
:root:root .hc .hpr em{font-style:normal;font-size:.75rem;color:#94a3b8;margin-left:auto}
:root:root .hc.oos .hci{opacity:.55}
/* home headings: centred, quiet, no coloured bar or buttons */
:root:root .home .sh{display:block;text-align:center;margin-block:3rem 1.5rem;position:relative}
:root:root .home .sh h2,:root:root .home h2.bh{border:0;padding:0;font-size:1.05rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;text-align:center;color:#0f172a;margin:3rem 0 1.5rem}
:root:root .home .sh h2{margin:0}
:root:root .home .sh h2 em{color:inherit}
:root:root .home .sh a,:root:root .home .sh .va{display:inline-block;margin-top:.5rem;background:none;padding:0;color:#64748b;font-size:.8rem;font-weight:500;text-decoration:underline;text-underline-offset:3px}
:root:root .home .tile:nth-child(n) span{background:linear-gradient(transparent,rgba(15,23,42,.7))}
:root:root .home .trust .ic{background:#f1f5f9;color:#0f172a}
:root:root .home .sh{margin-block:2.5rem .25rem}:root:root .home .sh+.wrap{padding-top:.75rem}

/* ph73 home = image-only tight grid (no names, prices or buttons) */
:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
@media(min-width:48rem){:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}}
@media(min-width:70rem){:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(5,minmax(0,1fr))}}
:root:root .home .wrap:has(> .hgrid),:root:root .home .wrap:has(> .bgrid){max-width:none;padding-inline:2px}
:root:root .hc{gap:0}
:root:root .hc .hci{border-radius:0}
:root:root .hc .hso{position:absolute;left:.4rem;top:.4rem;z-index:2;background:rgba(15,23,42,.8);color:#fff;font-size:.7rem;font-weight:600;padding:.15rem .45rem;border-radius:3px}
:root:root .home .tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
@media(min-width:48rem){:root:root .home .tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}}
:root:root .home .tile,:root:root .home .tile img{border-radius:0}
:root:root .home .wrap:has(> .tiles){max-width:none;padding-inline:2px}
:root:root .home .wrap.promo{max-width:none;padding-inline:2px}
:root:root .home .promo img{border-radius:0;width:100%}

/* ph74 brand colours. Colours only. The product card (.card / .hc) is deliberately NOT touched. */
:root:root body{background:var(--paper);color:var(--ink)}
:root:root .mu,:root:root .nt-muted{color:var(--muted)}
/* announcement bar */
:root:root .ann{background:var(--brand-yellow);background-image:none;color:var(--ink)}
:root:root .ann a{color:var(--ink)}
/* header */
:root:root .hd{background:var(--paper);border-bottom-color:var(--line)}
:root:root .hd .nav a,:root:root .hd .ib,:root:root .hd .menu,:root:root .hd .sbtn{color:var(--ink)}
:root:root .hd .nav a.nav-sale,:root:root a.nav-sale{color:var(--brand-red)}
/* buttons: primary = ink */
:root:root .btn:not(.alt):not(.wa):not(.red),:root:root .btn.red.hcta{background:var(--ink);background-image:none;color:var(--paper);border-color:var(--ink)}
:root:root .btn:not(.alt):not(.wa):not(.red):hover,:root:root .btn.red.hcta:hover{background:var(--ink-hover);border-color:var(--ink-hover);color:var(--paper)}
/* Order Now / Buy Now / Checkout / Place order = the one yellow button on a page */
:root:root .btn.red:not(.hcta){background:var(--brand-yellow);background-image:none;color:var(--ink);border-color:var(--brand-yellow)}
:root:root .btn.red:not(.hcta):hover{filter:brightness(.94);color:var(--ink)}
/* secondary button: white, 2px ink border */
:root:root .btn.alt{background:var(--paper);background-image:none;color:var(--ink);border:2px solid var(--ink)}
:root:root .btn.alt:hover{background:var(--surface);color:var(--ink)}
/* footer */
:root:root .ft,:root:root #ftr{background:var(--ink);color:var(--paper)}
:root:root .ft h4,:root:root .ft .fb{color:var(--paper)}
:root:root .ft a,:root:root .ft p,:root:root .ft li{color:var(--paper)}
:root:root .ft a:hover{color:var(--paper);text-decoration:underline}
:root:root .ft small,:root:root .fbar small{color:var(--footer-muted)}
:root:root .fbar{background:var(--ink)}
/* sections, borders, dividers */
:root:root .note,:root:root .pnl table th,:root:root .bfe>div,:root:root .sg{background:var(--surface)}
:root:root .note{border-color:var(--line)}
:root:root .pnl,:root:root .side,:root:root .box,:root:root .trust,:root:root .trust>div+div,:root:root .pnl table,:root:root .pnl tr+tr th,:root:root .pnl tr+tr td,:root:root .ct{border-color:var(--line)}
:root:root hr{border-color:var(--line)}
:root:root input:not([type=checkbox]):not([type=radio]),:root:root select,:root:root textarea{border-color:var(--line)}
/* messages */
:root:root .stock,:root:root .stock.in,:root:root .ok b{color:var(--success)}
:root:root .nt.ok{background:var(--success)}
:root:root .err,:root:root .stock.out{color:var(--brand-red)}
:root:root .err{border-left-color:var(--brand-red)}
:root:root .nt.bad{background:var(--brand-red)}
/* product page price: sale price + discount badge in red */
:root:root .price,:root:root .price b{color:var(--ink)}
:root:root .price:has(s),:root:root .price:has(s) b{color:var(--brand-red)}
:root:root .price s{color:var(--muted)}
:root:root .price .badge,:root:root .qvd.badge{background:var(--brand-red);color:var(--paper)}
/* logos */
:root:root .hd .logo img{height:2.5rem;min-height:2rem}
:root:root .ft img{height:2.25rem;min-height:2rem}
/* product card is frozen: pin what it used to inherit from the page, so the new page colours cannot reach it */
:root:root .card,:root:root .hc{--line:rgba(15,23,42,.09);color:#1e293b}
/* ph75 home = contained grid like the reference: 6 columns, even gaps, soft corners, tinted heading band, quick-link bar */
:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
@media(min-width:48rem){:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}}
@media(min-width:70rem){:root:root .home .hgrid,:root:root .home .bgrid{grid-template-columns:repeat(6,minmax(0,1fr));gap:.9rem}}
:root:root .home .wrap:has(> .hgrid),:root:root .home .wrap:has(> .bgrid),:root:root .home .wrap:has(> .tiles),:root:root .home .wrap.promo{max-width:87.5rem;padding-inline:.75rem}
@media(min-width:70rem){:root:root .home .wrap:has(> .hgrid),:root:root .home .wrap:has(> .bgrid),:root:root .home .wrap:has(> .tiles),:root:root .home .wrap.promo{padding-inline:1rem}}
:root:root .hc .hci{border-radius:6px;background:#eceff1}
:root:root .home .tiles{gap:.5rem}@media(min-width:48rem){:root:root .home .tiles{gap:.9rem}}
:root:root .home .tile,:root:root .home .tile img,:root:root .home .promo img{border-radius:6px}
/* heading band */
:root:root .home .sh{display:block;position:relative;max-width:87.5rem;margin:1.5rem auto .75rem;padding:.7rem 3.5rem;text-align:center;background:var(--ht,#eef2ff);border-radius:6px}
:root:root .home .sh h2{font-size:1.35rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--hc,#1d4ed8);border:0;padding:0;margin:0}
:root:root .home .sh a,:root:root .home .sh .va{position:absolute;right:1rem;top:50%;transform:translateY(-50%);margin:0;color:var(--hc,#1d4ed8);font-weight:700;font-size:.8rem;text-decoration:none}
:root:root .home .sh a:hover{text-decoration:underline}
:root:root .home h2.bh{max-width:87.5rem;margin:1.5rem auto .75rem;padding:.7rem 1rem;text-align:center;background:var(--ht,#eef2ff);color:var(--hc,#1d4ed8);border-radius:6px;font-size:1.35rem;font-weight:800;letter-spacing:.04em}
@media(max-width:47.99rem){:root:root .home .sh{margin-inline:.75rem}:root:root .home h2.bh{margin-inline:.75rem}:root:root .home .sh h2,:root:root .home h2.bh{font-size:1.1rem}:root:root .home .sh{padding-inline:3rem}}
/* quick links under hero */
:root:root .hqb{display:flex;justify-content:space-around;align-items:center;gap:.25rem;background:#f4f4f5;padding:.2rem .5rem;overflow-x:auto;scrollbar-width:none}
:root:root .hqb::-webkit-scrollbar{display:none}
:root:root .hqb a{flex:1 0 auto;text-align:center;padding:.85rem 1rem;font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:inherit;white-space:nowrap}
:root:root .hqb a:hover{text-decoration:underline}
:root:root .home .sh,:root:root .home h2.bh{width:calc(100% - 2rem);box-sizing:border-box}@media(max-width:47.99rem){:root:root .home .sh,:root:root .home h2.bh{width:calc(100% - 1.5rem);margin-inline:auto}}

/* ph76 bigger header logo; on mobile the logo sits exactly in the centre of the screen */
:root:root .hd .logo img{height:3.25rem;max-height:3.25rem;width:auto}
@media(min-width:900px){:root:root .hd .logo img{height:4rem;max-height:4rem}}
@media(max-width:899.98px){
  :root:root .hd{grid-template-columns:3rem 1fr auto;min-height:4.25rem}
  :root:root .hd .logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:calc(100% - 11rem);justify-self:auto}
  :root:root .hd .logo img{max-width:100%}
  :root:root .hd .act{grid-column:3;justify-self:end}
}

/* ph77: dashboard-controlled heading band colour + height */
:root:root .home .sh{background:var(--hbg,var(--ht,#eef2ff));min-height:var(--hh,0);display:flex;align-items:center;justify-content:center;padding-top:.7rem;padding-bottom:.7rem}
:root:root .home .sh h2{color:var(--hfg,var(--hc,#1d4ed8))}

/* ph78: image tiles + category/products showcase (page builder) */
.btl{display:grid;grid-template-columns:repeat(var(--mc,1),1fr);gap:var(--gap,12px)}
@media(min-width:700px){.btl{grid-template-columns:repeat(var(--c,2),1fr)}}
.bti{position:relative;display:block;overflow:hidden;border-radius:6px;background:var(--surface,#f5f5f4);aspect-ratio:var(--ar,16/9)}
.bti img,.bti .noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.btt{position:absolute;left:0;right:0;bottom:0;padding:1.6rem .75rem .6rem;text-align:center;color:#fff;font-weight:700;font-size:1.05rem;line-height:1.2;background:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,0))}
.btl-center .btt{top:0;display:flex;align-items:center;justify-content:center;padding:1rem;background:rgba(0,0,0,.18);font-size:1.4rem}
.bscb{display:grid;gap:1rem}
.bscr{display:grid;gap:.5rem;grid-template-columns:repeat(2,1fr)}
.bscr .bsck{grid-column:1/-1}.bscr .bsck .bti{aspect-ratio:16/9}
.bscp{display:contents}
@media(min-width:700px){
.bscr-left,.bscr-right{grid-template-columns:repeat(calc(var(--pc) + var(--pr)),1fr)}
.bscr-left .bsck{grid-column:1/span var(--pr);grid-row:1/span var(--pr)}.bscr-right .bsck{grid-column:calc(var(--pc) + 1)/span var(--pr);grid-row:1/span var(--pr)}
.bscr-left .bsck .bti,.bscr-right .bsck .bti{aspect-ratio:auto;height:100%}
.bscr-top,.bscr-bottom{grid-template-columns:repeat(var(--pc),1fr)}
.bscr-top .bsck .bti,.bscr-bottom .bsck .bti{aspect-ratio:4/1}
.bscr-top .bsck{order:-1}.bscr-bottom .bsck{order:99}}

/* ph79: category + products showcase (homepage section) */
.sc{display:grid;gap:.5rem;grid-template-columns:repeat(3,1fr)}
.sck{position:relative;display:block;overflow:hidden;border-radius:6px;background:var(--surface,#f5f5f4);grid-column:1/-1;aspect-ratio:16/10}
.sck img,.sck .noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sct{position:absolute;left:0;right:0;bottom:0;padding:2rem .9rem .8rem;color:#fff;font-weight:800;font-size:1.15rem;line-height:1.2;background:linear-gradient(to top,rgba(0,0,0,.65),rgba(0,0,0,0))}
.scc{position:relative;display:block;overflow:hidden;border-radius:6px;background:var(--surface,#f5f5f4);aspect-ratio:1/1}
.scc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.scp{position:absolute;left:50%;bottom:.35rem;transform:translateX(-50%);white-space:nowrap;background:#fff;color:var(--ink,#0a0a0a);border-radius:5px;padding:.1rem .5rem;font-size:.7rem;font-weight:800}
.scp s{margin-left:.3rem;color:var(--muted,#5c5c5c);font-weight:500}
.scm::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.55)}
.scv{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;font-weight:700;font-size:1.1rem;line-height:1.3;letter-spacing:.04em}
@media(min-width:700px){
.sc{grid-template-columns:repeat(calc(var(--pc) + var(--pr)),1fr)}
.sck{aspect-ratio:auto;height:100%;grid-row:1/span var(--pr);grid-column:1/span var(--pr)}
.sc-right .sck{grid-column:calc(var(--pc) + 1)/span var(--pr)}
.scp{font-size:.8rem;bottom:.5rem}.scv{font-size:1.4rem}.sct{font-size:1.35rem}}

/* ph80: one common content width on the homepage (same as the New Arrival section) */
:root:root .home{--cw:87.5rem}
:root:root .home .wrap,:root:root .home .trust,:root:root .home .blk:not(.blk-hero):not(.blk-trust) > .blk-in:not(.full){box-sizing:border-box;width:calc(100% - 2rem);max-width:var(--cw);margin-inline:auto;padding-inline:0}
:root:root .home .trust{margin-top:1.25rem}
:root:root .home .wrap.promo,:root:root .home .wrap:has(> .hgrid),:root:root .home .wrap:has(> .bgrid),:root:root .home .wrap:has(> .tiles){max-width:var(--cw);padding-inline:0}
:root:root .home .bcol > .blk > .blk-in{width:auto;max-width:none}
@media(max-width:47.99rem){:root:root .home .wrap,:root:root .home .trust,:root:root .home .blk:not(.blk-hero):not(.blk-trust) > .blk-in:not(.full){width:calc(100% - 1.5rem)}}

/* ph81: products-per-line control + "View all" last picture */
@media(min-width:48rem){:root:root .home .hgrid[style*="--hc"]{grid-template-columns:repeat(var(--hc),minmax(0,1fr))}}
:root:root .home .hva{position:relative;display:block;overflow:hidden;border-radius:6px;background:var(--surface,#f5f5f4);min-height:100%;aspect-ratio:1/1}
:root:root .home .hva img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
:root:root .home .hva::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.55)}
:root:root .home .hva span{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;font-weight:700;font-size:1.2rem;line-height:1.3;letter-spacing:.04em}

/* ph82: homepage spacing never above 5px */
:root:root .home{--sp:5px}
:root:root .home .wrap,:root:root .home .wrap.promo,:root:root .home .wrap:has(> .hgrid),:root:root .home .wrap:has(> .bgrid),:root:root .home .wrap:has(> .tiles){padding-top:var(--sp);padding-bottom:var(--sp)}
:root:root .home .wrap,:root:root .home .trust,:root:root .home .sh,:root:root .home h2.bh,:root:root .home .blk:not(.blk-hero):not(.blk-trust) > .blk-in:not(.full){width:calc(100% - 10px)}
:root:root .home .hgrid,:root:root .home .bgrid,:root:root .home .tiles,:root:root .home .btl,:root:root .home .sc,:root:root .home .bcat,:root:root .home .bg,:root:root .home .bscr,:root:root .home .bcols{gap:var(--sp)}
:root:root .home .sh{margin:var(--sp) auto;padding:var(--sp);row-gap:var(--sp);column-gap:var(--sp)}
:root:root .home h2.bh{margin:var(--sp) auto;padding:var(--sp)}
:root:root .home .sh .va,:root:root .home .sh a{position:absolute;right:var(--sp);top:50%;transform:translateY(-50%)}
:root:root .home .trust{margin-top:var(--sp);gap:var(--sp)}
:root:root .home .trust>div{padding:var(--sp);gap:var(--sp)}
:root:root .home .hqb{padding-inline:var(--sp)}
:root:root .home .hqb a{padding:var(--sp);min-height:2.75rem;display:inline-flex;align-items:center;justify-content:center}
:root:root .home .tile span{padding:var(--sp);gap:var(--sp)}
:root:root .home .btt,:root:root .home .sct{padding:var(--sp);background:rgba(0,0,0,.45)}
:root:root .home .btl-center .btt{padding:var(--sp)}
:root:root .home .scp{padding-inline:var(--sp)}
:root:root .home .blk > .blk-in{padding-top:var(--sp);padding-bottom:var(--sp)}
@media(max-width:47.99rem){:root:root .home .wrap,:root:root .home .trust,:root:root .home .sh,:root:root .home h2.bh,:root:root .home .blk:not(.blk-hero):not(.blk-trust) > .blk-in:not(.full){width:calc(100% - 10px)}}

/* ph83: same wide content box on every page (shop, category, product ...) */
:root:root{--w:87.5rem}
:root:root #app > .wrap,:root:root #app > .shop,:root:root #app > div > .wrap{box-sizing:border-box;width:calc(100% - 10px);max-width:var(--w);margin-inline:auto;padding-inline:0;padding-top:5px;padding-bottom:5px}
:root:root #app .grid{gap:5px}

/* ph84: category name centred on the big category picture */
:root:root .home .sct{inset:0;top:0;bottom:0;display:flex;align-items:center;justify-content:center;text-align:center;background:rgba(0,0,0,.3);font-size:1.5rem;letter-spacing:.03em}

/* ph85: category name centred near the bottom with a soft gradient; a little more space between homepage items */
:root:root .home .sct{inset:auto 0 0 0;display:block;padding:3.5rem .75rem 1rem;background:linear-gradient(to top,rgba(0,0,0,.78) 0%,rgba(0,0,0,.45) 45%,rgba(0,0,0,0) 100%);text-align:center;font-size:1.5rem;text-shadow:0 2px 8px rgba(0,0,0,.5)}
:root:root .home{--sp:8px}

/* ph86: homepage corner radius 1px everywhere */
:root:root .home *:not(.dot):not(.hso):not(.sdot):not(.fab):not(.ic){border-radius:1px}
:root:root .home .card,:root:root .home .card *,:root:root .home .sh,:root:root .home .bti,:root:root .home .sck,:root:root .home .scc,:root:root .home .scp,:root:root .home .hva,:root:root .home .tile,:root:root .home .tile img,:root:root .home .trust,:root:root .home .trust>div,:root:root .home .badge,:root:root .home .cbtn{border-radius:1px}

/* ph87: shop page banner (dashboard: Settings > Logo and images / Shop banner) */
.sbn{position:relative;display:block;overflow:hidden;border-radius:1px;margin:0 0 8px;background:var(--surface,#f5f5f4)}
.sbn picture,.sbn img{display:block;width:100%}
.sbn img{height:clamp(9rem,24vw,22rem);object-fit:cover}
.sbt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.35rem;padding:8px;color:#fff;background:rgba(0,0,0,.3)}
.sbt b{font-size:clamp(1.3rem,3.4vw,2.4rem);font-weight:800;line-height:1.15;letter-spacing:.02em;text-shadow:0 2px 8px rgba(0,0,0,.45)}
.sbt span{font-size:clamp(.85rem,1.6vw,1.1rem);text-shadow:0 1px 6px rgba(0,0,0,.45)}

/* ph88: text-only banner boxes (no image) */
.bto{display:flex;align-items:center;justify-content:center;text-align:center}
.btx{padding:var(--sp,8px) 1rem;font-weight:800;font-size:clamp(1.1rem,2.6vw,1.9rem);line-height:1.2;letter-spacing:.02em}

/* ph89: shop banner = same boxes as the promo section */
.shb{margin:0 0 8px}
.shb > img,.shb > a > img{display:block;width:100%;height:auto;max-height:24rem;object-fit:cover;border-radius:1px}

/* ph90: checkout - quantity/remove in the summary, brand-colour payment names, a little colour */
.mq{display:flex;align-items:center;gap:6px;margin-top:6px}
.mq button{min-width:28px;height:28px;border:1px solid var(--line,#e5e5e5);background:#fff;color:var(--ink,#0a0a0a);font-weight:700;font-size:1rem;line-height:1;cursor:pointer;border-radius:1px;padding:0 6px}
.mq button:hover:not(:disabled){background:var(--surface,#f5f5f4)}.mq button:disabled{opacity:.4;cursor:default}
.mq span{min-width:1.6rem;text-align:center;font-weight:700}
.mq .mrm{margin-left:auto;border-color:transparent;background:transparent;color:var(--brand-red,#c8102e);font-weight:600;font-size:.8rem;text-decoration:underline}
.mq .mrm:hover{background:transparent!important;opacity:.8}
.pm-bkash > div{color:#e2136e;font-weight:800}.pm-bkash input{accent-color:#e2136e!important}.pm-bkash:has(input:checked){border-color:#e2136e;box-shadow:inset 0 0 0 1px #e2136e}.pm-bkash > div span{color:var(--muted,#5c5c5c);font-weight:400}
.pm-cod > div{color:#1e7b3a;font-weight:800}.pm-cod input{accent-color:#1e7b3a!important}.pm-cod:has(input:checked){border-color:#1e7b3a;box-shadow:inset 0 0 0 1px #1e7b3a;background:#f2faf4}.pm-cod > div span{color:var(--muted,#5c5c5c);font-weight:400}
.ck h2.ckh .ic{box-sizing:content-box;padding:6px;border-radius:50%}
.ckh1 .ic{background:#e8f0ff;color:#2563eb}.ckh2 .ic{background:#e6f6ec;color:#1e7b3a}.ckh3 .ic{background:#fff3e0;color:#e65100}.ckh4 .ic{background:#fde7f1;color:#e2136e}
.ck .sum .disc{color:#1e7b3a}

/* ph91: banner box height set in the dashboard */
.btl[style*="--bh"] .bti{aspect-ratio:auto;height:var(--bh)}
.shb > img,.shb > a > img{max-height:none}

/* ph92: missing-field marks (red) with a notice beside them */
.fe{margin:4px 0 8px;color:var(--brand-red,#c8102e);font-size:.875rem;font-weight:600;line-height:1.4}
.bad,input.bad,select.bad,textarea.bad{border-color:var(--brand-red,#c8102e)!important;box-shadow:0 0 0 1px var(--brand-red,#c8102e)}
label.terms.bad{box-shadow:none;border:0}label.terms.bad input{outline:2px solid var(--brand-red,#c8102e)}
.opt.need{outline:2px solid var(--brand-red,#c8102e)!important;outline-offset:4px;border-radius:2px}

/* ph93: no more blue - brand yellow / red / ink accents everywhere */
:root:root[data-palette=app]{--red:#C8102E;--ac2:#FFF6BF}
:root:root .ann{background:var(--brand-yellow)}
:root:root :focus-visible{outline:2px solid var(--ink);outline-offset:2px}
:root:root[data-palette=app] input:focus,:root:root[data-palette=app] select:focus,:root:root[data-palette=app] textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(255,219,0,.55)}
:root:root[data-palette=app] .chip.on,:root:root[data-palette=app] .opt button[aria-pressed=true]{background:var(--brand-yellow);border-color:var(--ink);color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
:root:root[data-palette=app] .qa,:root:root[data-palette=app] .cdf a{background:var(--ink);color:#fff}
:root:root[data-palette=app] .cdf a:hover{background:var(--ink-hover)}
:root:root[data-palette=app] .cn{background:var(--brand-red);color:#fff}
:root:root[data-palette=app] .price,:root:root[data-palette=app] .sh em{color:var(--brand-red)}
:root:root[data-palette=app] .pm:has(input:checked){border-color:var(--ink);background:#fffbe0}
:root:root[data-palette=app] .pm-cod:has(input:checked){border-color:#1e7b3a;background:#f2faf4}
:root:root[data-palette=app] .pm-bkash:has(input:checked){border-color:#e2136e;background:#fff0f7}
:root:root[data-palette=app] input[type=checkbox],:root:root[data-palette=app] input[type=radio]{accent-color:var(--ink)}
:root:root[data-palette=app] .pm-cod input{accent-color:#1e7b3a}:root:root[data-palette=app] .pm-bkash input{accent-color:#e2136e}
/* hearts and icon chips */
:root:root .wl,:root:root .wl .ic,:root:root .cwl .ic{color:var(--brand-red)}
:root:root .trust .ic,:root:root .note .ic{color:var(--ink)}
:root:root .trust>div:nth-child(1) .ic{background:#fff6bf}:root:root .trust>div:nth-child(2) .ic{background:#fde7ea}:root:root .trust>div:nth-child(3) .ic{background:#e6f6ec}:root:root .trust>div:nth-child(4) .ic{background:#fff0d9}
:root:root .home .trust .ic{color:var(--ink)}
:root:root .bn a.on,:root:root .bn a[aria-current] {color:var(--ink)}
/* "new" heading band was blue: now brand yellow */
:root:root [data-hue=blue]{--hc:#0A0A0A;--ht:#FFF1A8}
:root:root .home .trust>div:nth-child(1) .ic,:root:root .trust>div:nth-child(1) .ic{background:#fff6bf;color:#0a0a0a}
:root:root .home .trust>div:nth-child(2) .ic,:root:root .trust>div:nth-child(2) .ic{background:#fde7ea;color:#c8102e}
:root:root .home .trust>div:nth-child(3) .ic,:root:root .trust>div:nth-child(3) .ic{background:#e6f6ec;color:#1e7b3a}
:root:root .home .trust>div:nth-child(4) .ic,:root:root .trust>div:nth-child(4) .ic{background:#fff0d9;color:#b45309}
.ckh1 .ic{background:#fff6bf!important;color:#0a0a0a!important}
/* neutral greys instead of slate-blue */
:root:root[data-palette=app]{--g3:#5c5c5c;--g2:#e5e5e5;--g1:#f5f5f4;--bg:#ffffff}
:root:root[data-palette=app] body{background:#fff;color:#0a0a0a}
:root:root .drt,:root:root .noimg,:root:root .rm,:root:root small,:root:root .mu{color:#5c5c5c}
:root:root s{color:#8a8a8a}
:root:root[data-palette=app]{--black:#0a0a0a;--ft:#0a0a0a}:root:root[data-palette=app] .ft{background:#0a0a0a}

/* ph94: page-builder heading band colour/height (set per block in the dashboard) */
:root:root .home h2.bh{background:var(--hbg,var(--ht,#eef2ff));color:var(--hfg,var(--hc,#1d4ed8))}
:root:root h2.bh[style*="--hbg"]{background:var(--hbg);padding:.5rem 1rem}:root:root h2.bh[style*="--hfg"]{color:var(--hfg)}
:root:root h2.bh[style*="--hh"]{min-height:var(--hh);display:flex;align-items:center;justify-content:center;text-align:center}

/* ph95: shop, product, cart, checkout and other pages - tight spacing (max 8px) and 1px corners */
:root:root #app{--sp:8px}
:root:root #app .wrap.shop,:root:root #app .wrap.pd,:root:root #app .wrap.ck,:root:root #app .stk,:root:root #app form.f,:root:root #app .ptop,:root:root #app .optr,:root:root #app .row.inline,:root:root #app .note,:root:root #app .cact,:root:root #app .ln,:root:root #app .mini,:root:root #app .price,:root:root #app .grid,:root:root #app .shm,:root:root #app .acc{gap:var(--sp);row-gap:var(--sp);column-gap:var(--sp)}
:root:root #app .pnl,:root:root #app .box,:root:root #app .box.sum,:root:root #app .note,:root:root #app .side{padding:var(--sp)}
:root:root #app .price{padding-top:var(--sp);padding-bottom:var(--sp);margin-top:var(--sp)}
:root:root #app .opt,:root:root #app .bar,:root:root #app .acc,:root:root #app .row.inline,:root:root #app .note,:root:root #app .cpn{margin-top:var(--sp);margin-bottom:var(--sp)}
:root:root #app .ln{padding-top:var(--sp);padding-bottom:var(--sp)}:root:root #app .tot{padding-top:var(--sp)}
:root:root #app section.sec{padding-top:var(--sp)}:root:root #app .rv{padding-top:6px;padding-bottom:6px}
:root:root #app th,:root:root #app td{padding:6px 8px}
:root:root #app .cbody{padding:6px}
:root:root #app *:not(.dot):not(.hso):not(.sdot):not(.fab):not(.ic):not(.noimg){border-radius:1px}
:root:root #app .card,:root:root #app .card *,:root:root #app .btn,:root:root #app .box,:root:root #app .pnl,:root:root #app .chip,:root:root #app .opt button,:root:root #app input,:root:root #app select,:root:root #app textarea,:root:root #app .pm,:root:root #app .badge,:root:root #app .qvm,:root:root #app img{border-radius:1px}

/* ph96: a little colour across the whole site (brand yellow / red, soft tints) - no more plain black & white */
:root:root .hd{border-bottom:3px solid var(--brand-yellow)}
:root:root .nav a:hover,:root:root .hd nav a:hover{box-shadow:inset 0 -3px 0 var(--brand-yellow)}
:root:root #app > h1.bn,:root:root #app > div > h1.bn{background:#fff1a8;border-left:6px solid var(--brand-red);margin:5px auto;padding:.6rem 1rem;max-width:87.5rem;width:calc(100% - 10px);box-sizing:border-box;font-size:clamp(1.4rem,3.5vw,2rem)}
:root:root .ft h4{color:var(--brand-yellow)}
:root:root .ft a:hover{color:var(--brand-yellow);text-decoration:none}
:root:root .ft .fb,:root:root .ft .flogo{color:#fff}
:root:root .ft li a,:root:root .ft p a{border-bottom:1px solid transparent}:root:root .ft li a:hover{border-bottom-color:var(--brand-yellow)}
:root:root .ft button,:root:root .ft .soc a{border-color:var(--brand-yellow);color:var(--brand-yellow)}
:root:root #app .note{background:#fff8d6;border:1px solid #f0dc7a;border-left:4px solid var(--brand-yellow)}
:root:root #app .acc .sec h2{border-left:4px solid var(--brand-red);padding-left:.6rem}
:root:root #app .acc table th{background:#fff6bf;color:var(--ink)}
:root:root #app .acc .sec:nth-of-type(2) h2{border-left-color:#1e7b3a}:root:root #app .acc .sec:nth-of-type(3) h2{border-left-color:#e65100}:root:root #app .acc .sec:nth-of-type(4) h2{border-left-color:#e2136e}
:root:root #app .box.sum,:root:root #app .stk > .box{border-top:4px solid var(--brand-yellow)}
:root:root #app .ck > form .box:nth-of-type(1){border-top:4px solid #2a2a2a}:root:root #app .ck > form .box:nth-of-type(2){border-top:4px solid #1e7b3a}
/* shop category chips: soft tints */
:root:root #app .bar .chip:nth-child(5n+2){background:#fff6bf}:root:root #app .bar .chip:nth-child(5n+3){background:#fde7ea}:root:root #app .bar .chip:nth-child(5n+4){background:#e6f6ec}:root:root #app .bar .chip:nth-child(5n+5){background:#fff0d9}:root:root #app .bar .chip:nth-child(5n+6){background:#f3e8ff}
:root:root #app .bar .chip.on{background:var(--brand-yellow)!important}
/* cart & misc */
:root:root #app .ln .rm{color:var(--brand-red)}
:root:root .btn.alt:hover{background:#fff6bf;border-color:var(--ink)}
:root:root #app .ok h1{color:var(--success)}
:root:root #app .empty{background:#fff8d6;border:1px dashed #f0dc7a;padding:2rem 1rem;margin:5px}
:root:root .tabs a.on,:root:root .bn a.on{color:var(--ink)}

/* ph97 size chart tabs + frequently bought together */
#app .szt{display:flex;gap:0;margin:6px 0}
#app .szt button{padding:5px 14px;border:1px solid #d9d9d9;background:#fff;font-weight:700;cursor:pointer;border-radius:1px}
#app .szt button[aria-selected=true]{background:#FFD500;border-color:#e0b800;color:#0a0a0a}
#app .fbt{margin:8px 0;padding:8px;border:1px solid #f0e3a0;border-top:4px solid #FFD500;background:#fffdf0;border-radius:1px}
#app .fbl{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
#app .fbi{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid #eee;padding:6px;border-radius:1px}
#app .fbi img,#app .fbi .noimg{width:64px;height:80px;object-fit:cover;flex:none}
#app .fbn{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
#app .fbn select{max-width:100%;padding:4px}
#app .fbs{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}
:root:root #app .fbt .fbi{display:flex;flex-wrap:nowrap;align-items:center;gap:8px}
:root:root #app .fbt .fbi input[type=checkbox]{width:18px;height:18px;min-height:0;flex:none;padding:0;margin:0;accent-color:#C8102E}
:root:root #app .fbt .fbi img,:root:root #app .fbt .fbi .noimg{width:56px;height:70px;flex:none;object-fit:cover;display:block}
:root:root #app .fbt .fbn{flex:1;min-width:0}
:root:root #app .fbt .fbn select{width:100%;height:auto;min-height:0;padding:4px 6px;font-size:13px}
:root:root #app .fbt .sec,:root:root #app .fbt h2{margin-top:0}

/* ph98 footer: payment badges, newsletter, extra columns */
:root:root .fbar .pmbs{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
:root:root .pmb{display:inline-block;padding:3px 10px;border-radius:1px;font-size:12px;font-weight:800;line-height:1.4;background:#fff;border:1px solid #fff}
:root:root .pmb-cod{color:#0a0a0a;background:#FFD500;border-color:#FFD500}
:root:root .pmb-bkash{color:#fff;background:#E2136E;border-color:#E2136E}
:root:root .ftn{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.18);width:100%;grid-column:1/-1}
:root:root .ftn h4{margin:0 0 2px}:root:root .ftn p{margin:0}
:root:root .nlf{display:flex;gap:6px;min-width:min(100%,24rem)}
:root:root .nlf input{flex:1;min-width:0;padding:8px 10px;border:1px solid #fff;border-radius:1px;background:#fff;color:#0a0a0a}
:root:root .nlf .btn{background:#FFD500;color:#0a0a0a;border-color:#FFD500;white-space:nowrap}
:root:root .nlm{min-height:1.2em;font-size:13px;margin-top:4px!important}
@media(min-width:900px){:root:root .ft .wrap{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}:root:root .ft .wrap>.fb{grid-column:span 1}}
@media(min-width:1100px){:root:root .ft .wrap{grid-template-columns:1.3fr repeat(5,1fr);gap:2rem}}
:root:root .ft .wrap:has(.ftn){padding-top:2rem;padding-bottom:0}
:root:root .ft .wrap:has(.ftn)+.wrap{padding-top:2rem}
:root:root .ft .nlf button.btn{background:#FFD500;color:#0a0a0a;border:1px solid #FFD500;font-weight:800}
:root:root .ft .nlf button.btn{background:#FFD500!important;color:#0a0a0a!important;border-color:#FFD500!important}

/* ph99 free-delivery offer message */
#app .offr{display:flex;align-items:center;gap:8px;margin:8px 0;padding:8px 10px;background:#fff6bf;border:1px solid #f0e3a0;border-left:4px solid #C8102E;font-weight:700;border-radius:1px}
#app .offr.ok{background:#e8f7ec;border-color:#bfe3c8;border-left-color:#1f9d4d;color:#14532d}
#app .offr svg{width:20px;height:20px;flex:none}

/* ph100 footer: small gap above, much tighter inside */
:root:root #ftr{margin-top:16px}
:root:root .ft{margin-top:0}
:root:root .ft .wrap,:root:root .ft .wrap:has(.ftn),:root:root .ft .wrap:has(.ftn)+.wrap{padding-top:14px;padding-bottom:10px;gap:14px 24px}
:root:root .ft .wrap:has(.ftn){padding-bottom:8px}
:root:root .ft .ftn{padding:0 0 10px}
:root:root .ft .wrap:has(.ftn)+.wrap{padding-top:16px;padding-bottom:14px}
:root:root .ft h4{margin:0 0 6px}
:root:root .ft li{margin:0}:root:root .ft li a,:root:root .ft p{padding:2px 0;line-height:1.5}
:root:root .ft p{margin:0 0 4px}
:root:root .ft .fb{margin:0}
:root:root .fbar .wrap{padding-top:8px;padding-bottom:8px}
@media(max-width:899px){:root:root .ft .wrap{gap:12px}}
/* ph101 footer separator */
:root:root .ft{border-top:4px solid #FFD500;box-shadow:0 -1px 0 #e6e6e6}
:root:root #ftr{margin-top:20px}

/* ph102 quieter "frequently bought together" */
:root:root #app .fbt{margin:6px 0;padding:8px 10px;border:1px solid #ececec;border-top:1px solid #ececec;background:#fafafa}
:root:root #app .fbh{margin:0 0 6px;font-size:14px;font-weight:700}
:root:root #app .fbh small{font-weight:400;color:#777}
:root:root #app .fbt .fbi{padding:4px 6px;background:#fff;border-color:#eee}
:root:root #app .fbt .fbi img,:root:root #app .fbt .fbi .noimg{width:40px;height:50px}
:root:root #app .fbt .fbn b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root:root #app .fbt .fbn select{font-size:12px;padding:2px 4px}
:root:root #app .fbt .fbl{gap:6px}
:root:root #app .fbs{margin-top:6px}
:root:root #app .fbs[hidden],:root:root #app .fbs [hidden]{display:none}
:root:root #app .fbs .btn{padding:6px 14px;min-height:0;font-size:13px}

/* ph103 product gallery: thumbnail rail + arrows + counter */
:root:root .gal .gm{position:relative;min-width:0}
:root:root .gal .gm .ci{border-radius:1px;border:1px solid #ececec;background:#f5f5f5}
:root:root .gal .gar{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:1px;background:rgba(255,255,255,.92);color:#0a0a0a;font-size:26px;line-height:1;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.25);padding:0}
:root:root .gal .gpv{left:8px}:root:root .gal .gnx{right:8px}
:root:root .gal .gar:hover{background:#FFD500}
:root:root .gal .gcn{position:absolute;right:8px;bottom:8px;z-index:3;background:rgba(10,10,10,.78);color:#fff;font-size:12px;font-weight:700;padding:2px 8px;border-radius:1px;pointer-events:none}
:root:root .gal .th{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:8px;overflow-x:auto;padding:8px 0 2px;scrollbar-width:thin}
:root:root .gal .th button{flex:none;width:64px;height:64px;padding:0;border:2px solid transparent;border-radius:1px;background:#f5f5f5;opacity:.6;overflow:hidden;cursor:pointer;transition:opacity .15s,border-color .15s}
:root:root .gal .th button img{width:100%;height:100%;object-fit:cover;display:block}
:root:root .gal .th button:hover{opacity:1}
:root:root .gal .th button[aria-current=true]{opacity:1;border-color:#0a0a0a;box-shadow:0 2px 0 #FFD500}
@media(min-width:900px){
  :root:root .gal.has-th{display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px;align-items:start}
  :root:root .gal.has-th .gm{grid-column:2;grid-row:1}
  :root:root .gal.has-th .th{grid-column:1;grid-row:1;flex-direction:column;overflow-x:hidden;overflow-y:auto;max-height:min(640px,70vh);padding:0 2px 0 0}
  :root:root .gal.has-th .th button{width:72px;height:72px}
  :root:root .gal .gar{opacity:0;transition:opacity .15s}:root:root .gal .gm:hover .gar{opacity:1}
}
:root:root .gal .gcn{bottom:auto;top:8px}

/* ph104 product page: information + size chart sit under the gallery (no empty column) */
@media(min-width:900px){
  :root:root .pd{grid-auto-flow:row;grid-template-rows:auto 1fr}
  :root:root .pd>.gal{grid-column:1;grid-row:1;position:static}
  :root:root .pd>.pnl{grid-column:2;grid-row:1 / span 2}
  :root:root .pd>.accx{grid-column:1;grid-row:2;align-self:start;min-width:0}
}
@media(max-width:899px){:root:root .pd>.accx{margin-top:0}}
:root:root .accx:empty{display:none}

/* ph105 gallery: thumbnails back under the main image, centred (desktop and mobile) */
@media(min-width:900px){
  :root:root .gal.has-th{display:block}
  :root:root .gal.has-th .th{flex-direction:row;justify-content:center;overflow-x:auto;overflow-y:hidden;max-height:none;padding:8px 0 2px}
  :root:root .gal.has-th .th button{width:64px;height:64px}
}
:root:root .gal .th{justify-content:center}

/* ph106 product page polish: calmer, more premium (one accent, neutral surfaces, clean tables) */
:root:root #app .pd .ctg{background:none;color:#6b6b6b;padding:0;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
:root:root #app .pd .pnl{border:1px solid #ececec;box-shadow:none}
:root:root #app .pd .ptop h1{font-weight:800;letter-spacing:-.01em}
:root:root #app .pd .price{margin:6px 0}
:root:root #app .pd .stock.in{font-weight:600}
:root:root #app .pd .optl{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#0a0a0a}
:root:root #app .pd .opt button{border:1px solid #cfcfcf;background:#fff;color:#0a0a0a;min-width:44px}
:root:root #app .pd .opt button[aria-pressed=true]{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
:root:root #app .pd .note{background:#fafafa;border:1px solid #ececec;border-left:1px solid #ececec}
:root:root #app .pd .note svg{color:#0a0a0a}
:root:root #app .pd .offr{background:#fafafa;border:1px solid #ececec;border-left:3px solid #0a0a0a;font-weight:600;font-size:14px}
:root:root #app .pd .offr.ok{background:#f3faf5;border-color:#cfe8d6;border-left-color:#1f9d4d}
:root:root #app .pd .acc .sec h2{border:0;padding:0;margin:0 0 8px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#0a0a0a}
:root:root #app .pd .acc .sec h2::before{display:none}
:root:root #app .pd .acc .sec{border-top:1px solid #ececec;padding-top:14px;margin-top:14px}
:root:root #app .pd .acc table{border:0;border-collapse:collapse;width:100%}
:root:root #app .pd .acc table th{background:none;color:#6b6b6b;font-weight:600;text-align:left;width:38%;border:0;border-bottom:1px solid #f0f0f0;padding:8px 4px}
:root:root #app .pd .acc table td{border:0;border-bottom:1px solid #f0f0f0;padding:8px 4px}
:root:root #app .pd .sc table th{background:#0a0a0a;color:#fff;font-weight:700;width:auto;border:0;padding:8px 10px}
:root:root #app .pd .sc table td{padding:8px 10px}
:root:root #app .pd .szt{margin:0 0 8px}
:root:root #app .pd .szt button{border:1px solid #cfcfcf;background:#fff;color:#0a0a0a;font-size:12px;padding:5px 16px}
:root:root #app .pd .szt button[aria-selected=true]{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
:root:root #app .pd .gal .gm .ci{border:0;background:#f4f4f4}
:root:root #app .pd .gal .th button[aria-current=true]{box-shadow:none;border-color:#0a0a0a}
:root:root #app .pd .gal .th button{opacity:.55}
:root:root body[data-page=product] [data-hue]{--hc:#C8102E;--ht:#fff1a8}

/* ph107 all product info together on the right; the gallery follows while scrolling (no dead space) */
@media(min-width:900px){
  :root:root .pd{grid-template-rows:auto}
  :root:root .pd>.gal{grid-row:1;position:sticky;top:96px;align-self:start}
  :root:root .pd>.pnl{grid-row:1}
}

/* ph108 smaller, tidier buttons on the product page */
:root:root #app .pd .row.inline{display:flex;gap:8px;align-items:stretch;flex-wrap:nowrap}
:root:root #app .pd .row.inline .btn{flex:1 1 0;min-height:0;height:42px;padding:0 10px;font-size:14px;font-weight:700;letter-spacing:0}
:root:root #app .pd .row.inline .q{flex:none;height:42px}
:root:root #app .pd .row.inline .q button{width:34px;height:40px;min-height:0}
:root:root #app .buybar{padding:8px 12px;gap:8px}
:root:root #app .buybar .btn{height:40px;min-height:0;padding:0 10px;font-size:14px;font-weight:700;flex:1}
:root:root #app .pd .btn.red{background:#FFD500;color:#0a0a0a;border-color:#FFD500}

/* ph109 inner pages (product, shop, cart, checkout, track…) use the soft dashboard look: rounded, green accent, calm surfaces; yellow stays only in the top strip and footer. Home page is untouched. */
:root:root body:not([data-page=home]):not(#z){background:#f3f5f4;--hc:#0fae6b;--ht:#e6f6ee}
:root:root body:not([data-page=home]):not(#z) [data-hue]{--hc:#0fae6b;--ht:#e6f6ee}
:root:root body:not([data-page=home]):not(#z) #app{--r:12px;color:#13201b}
:root:root body:not([data-page=home]):not(#z) #app h1.bn,:root:root body:not([data-page=home]):not(#z) #app>div>h1.bn{background:none;border:0;padding:0;margin:12px 0 8px;font-size:24px;font-weight:800;letter-spacing:-.01em;color:#13201b;max-width:none}
:root:root body:not([data-page=home]):not(#z) #app :is(.box,.pnl,.card,.fbt){background:#fff;border:1px solid #e4e9e6;border-top:1px solid #e4e9e6;border-radius:16px;box-shadow:0 1px 2px rgba(16,24,20,.04)}
:root:root body:not([data-page=home]):not(#z) #app .card.multi .cmedia,:root:root body:not([data-page=home]):not(#z) #app .card .cmedia{border-radius:16px 16px 0 0;overflow:hidden}
:root:root body:not([data-page=home]):not(#z) #app :is(input,select,textarea){border:1px solid #e4e9e6;border-radius:12px;background:#fff;color:#13201b}
:root:root body:not([data-page=home]):not(#z) #app :is(input,select,textarea):focus{outline:2px solid #0fae6b;border-color:#0fae6b}
:root:root body:not([data-page=home]):not(#z) #app .btn{background:#0fae6b;color:#fff;border:1px solid #0fae6b;border-radius:999px;font-weight:700}
:root:root body:not([data-page=home]):not(#z) #app .btn:hover{filter:brightness(.95)}
:root:root body:not([data-page=home]):not(#z) #app .btn.alt{background:#fff;color:#13201b;border:1px solid #cfd8d3}
:root:root body:not([data-page=home]):not(#z) #app .btn.alt:hover{border-color:#0fae6b;color:#0a7a4d}
:root:root body:not([data-page=home]):not(#z) #app .btn.red,:root:root body:not([data-page=home]):not(#z) #app .pd .btn.red{background:#0fae6b;color:#fff;border-color:#0fae6b}
:root:root body:not([data-page=home]):not(#z) #app .btn[disabled]{opacity:.5}
:root:root body:not([data-page=home]):not(#z) #app :is(.offr,.pd .offr){background:#e6f6ee;border:1px solid #cfeadb;border-left:1px solid #cfeadb;border-radius:12px;color:#13201b}
:root:root body:not([data-page=home]):not(#z) #app :is(.note,.pd .note){background:#f6f8f7;border:1px solid #e4e9e6;border-radius:12px}
:root:root body:not([data-page=home]):not(#z) #app .pd .offr.ok{background:#e6f6ee;border-color:#cfeadb}
:root:root body:not([data-page=home]):not(#z) #app .chip{background:#fff;border:1px solid #e4e9e6;border-radius:999px;color:#13201b}
:root:root body:not([data-page=home]):not(#z) #app .chip.on{background:#e6f6ee;border-color:#0fae6b;color:#0a7a4d}
:root:root body:not([data-page=home]):not(#z) #app .pm{border:1px solid #e4e9e6;border-radius:12px;background:#fff}
:root:root body:not([data-page=home]):not(#z) #app .pm:has(input:checked){border-color:#0fae6b;background:#e6f6ee}
:root:root body:not([data-page=home]):not(#z) #app .cbtn{background:#0fae6b;color:#fff;border-radius:999px}
:root:root body:not([data-page=home]):not(#z) #app .badge,:root:root body:not([data-page=home]):not(#z) #app .fdel,:root:root body:not([data-page=home]):not(#z) #app .save{border-radius:6px}
:root:root body:not([data-page=home]):not(#z) #app .pd .gal .gm{border-radius:16px;overflow:hidden}
:root:root body:not([data-page=home]):not(#z) #app .pd .gal .th button{border-radius:10px;overflow:hidden}
:root:root body:not([data-page=home]):not(#z) #app .pd .gal .th button[aria-current=true]{border-color:#0fae6b;box-shadow:none}
:root:root body:not([data-page=home]):not(#z) #app .pd .gal .gar:hover{background:#0fae6b;color:#fff}
:root:root body:not([data-page=home]):not(#z) #app .pd .opt button{border:1px solid #cfd8d3;border-radius:10px;background:#fff;color:#13201b}
:root:root body:not([data-page=home]):not(#z) #app .pd .opt button[aria-pressed=true],:root:root body:not([data-page=home]):not(#z) #app .pd .szt button[aria-selected=true]{background:#0fae6b;color:#fff;border-color:#0fae6b}
:root:root body:not([data-page=home]):not(#z) #app .pd .szt button{border-radius:999px;border:1px solid #cfd8d3}
:root:root body:not([data-page=home]):not(#z) #app .pd .row.inline .q{border:1px solid #cfd8d3;border-radius:999px;background:#fff;overflow:hidden}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table th{background:#13201b;border-radius:0}
:root:root body:not([data-page=home]):not(#z) #app .pd .pnl{padding:16px}
:root:root body:not([data-page=home]):not(#z) #app .buybar{background:#fff;border-top:1px solid #e4e9e6}
:root:root body:not([data-page=home]):not(#z) #app .fbt{border-top:1px solid #e4e9e6;background:#fff}
:root:root body:not([data-page=home]):not(#z) #app .ln{border-color:#e4e9e6}
:root:root body:not([data-page=home]):not(#z) #app a.rm,:root:root body:not([data-page=home]):not(#z) #app button.rm{color:#d92d20}
:root:root body:not([data-page=home]):not(#z) #app .bar .chip{background:#fff!important}
:root:root body:not([data-page=home]):not(#z) #app .bar .chip.on{background:#e6f6ee!important;border-color:#0fae6b;color:#0a7a4d}
:root:root body:not([data-page=home]):not(#z) #app :is(.box,.pnl,.card,.fbt) :is(.sum,.stk,.mini,.cpn,.tot){border-radius:0}
:root:root body:not([data-page=home]):not(#z) #app .box .tot{border-top:1px solid #e4e9e6}
:root:root body:not([data-page=home]):not(#z) #app h1.bn{padding:0 8px;margin:14px 0 4px}
:root:root body:not([data-page=home]):not(#z) #app .ln{border:0;border-bottom:1px solid #e4e9e6;border-radius:0;box-shadow:none;background:none}
:root:root body:not([data-page=home]):not(#z) #app .box :is(.sum,.stk){border:0;box-shadow:none;background:none}
:root:root body:not([data-page=home]):not(#z) #app .btn.alt,:root:root body:not([data-page=home]):not(#z) #app a.btn.alt{background:#fff}
:root:root body:not([data-page=home]):not(#z) #app :is(.ln,.mini,.ci) img{border-radius:12px}
:root:root body:not([data-page=home]):not(#z) #app h2.ckh .ic{background:#e6f6ee!important;color:#0a7a4d!important}

/* ph110 buttons are black (not green) */
:root:root body:not([data-page=home]):not(#z) #app :is(.btn,.btn.red,.pd .btn.red,.cbtn){background:#0a0a0a;color:#fff;border-color:#0a0a0a}
:root:root body:not([data-page=home]):not(#z) #app .btn.alt,:root:root body:not([data-page=home]):not(#z) #app a.btn.alt{background:#fff;color:#0a0a0a;border:1px solid #cfd8d3}
:root:root body:not([data-page=home]):not(#z) #app .btn.alt:hover{border-color:#0a0a0a;color:#0a0a0a}
:root:root body:not([data-page=home]):not(#z) #app .pd .opt button[aria-pressed=true],:root:root body:not([data-page=home]):not(#z) #app .pd .szt button[aria-selected=true]{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
:root:root body:not([data-page=home]):not(#z) #app .pd .gal .gar:hover{background:#0a0a0a;color:#fff}
:root:root body:not([data-page=home]):not(#z) #app .pd .gal .th button[aria-current=true]{border-color:#0a0a0a}
:root:root body:not([data-page=home]):not(#z) #app .bar .chip.on{background:#0a0a0a!important;border-color:#0a0a0a;color:#fff}
:root:root body:not([data-page=home]):not(#z) #app :is(input,select,textarea):focus{outline-color:#0a0a0a;border-color:#0a0a0a}
:root:root body:not([data-page=home]):not(#z) #app .pd .btn.btn.alt,:root:root body:not([data-page=home]):not(#z) #app .btn.btn.alt{background:#fff;color:#0a0a0a;border:1px solid #cfd8d3}

/* ph111 size chart: full width, soft and easy on the eye */
:root:root body:not([data-page=home]):not(#z) #app .pd .sc{display:block;overflow:hidden;border:1px solid #e4e9e6;border-radius:12px;background:#fff;grid-template-columns:none;max-width:100%}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table{width:100%;table-layout:fixed;border-collapse:collapse;border:0;margin:0}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table th{background:#f3f5f4;color:#4a5750;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;text-align:center;white-space:nowrap;padding:10px 8px;border:0;border-bottom:1px solid #e4e9e6}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table td{text-align:center;font-size:14px;font-weight:500;color:#13201b;padding:11px 8px;border:0;border-bottom:1px solid #eef1ef;background:#fff}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table tr:last-child td{border-bottom:0}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table tr:nth-child(even) td{background:#fafbfa}
:root:root body:not([data-page=home]):not(#z) #app .pd .sc table td:first-child{font-weight:800}
:root:root body:not([data-page=home]):not(#z) #app .pd .szt{display:inline-flex;gap:0;margin:0 0 10px;padding:3px;background:#f3f5f4;border:1px solid #e4e9e6;border-radius:999px}
:root:root body:not([data-page=home]):not(#z) #app .pd .szt button{border:0;background:transparent;color:#4a5750;padding:5px 18px;font-size:12px;font-weight:700;border-radius:999px}
:root:root body:not([data-page=home]):not(#z) #app .pd .szt button[aria-selected=true]{background:#0a0a0a;color:#fff}

/* ph112 one corner radius everywhere: 5px (dots and tiny round markers excluded) */
:root:root body:not(#z) :is(.card,.card .ci,.card .cmedia,.card .ci img,.card .noimg,.btn,.cbtn,.chip,input:not([type=checkbox]):not([type=radio]),select,textarea,.box,.pnl,.note,.offr,.pm,.fbt,.q,.opt button,.szt,.szt button,.sc,.th button,.th img,.gm,.gal .ci,.gal .ci img,.tile,.tile img,.trust,.badge,.save,.fdel,.ln img,.mini img,.dlg,.cdl,.qvm,.qvm img,.ft button,.ft input,.nlf .btn,.hd input,.sug,.wl,.zb,.gar,.pwl,.ptop .pwl,.sk,.ckh .ic,.acc,.tabs a,.drawer,.cd,.dr){border-radius:5px}
:root:root body:not(#z) #app :is(.card,.card .ci,.card .cmedia,.btn,.cbtn,.chip,.box,.pnl,.note,.offr,.pm,.fbt,.q,.opt button,.szt,.szt button,.sc,.th button,.gm,.ln img,.mini img,input,select,textarea,.pd .gal .gm,.pd .gal .th button,.pd .row.inline .q,.pd .sc){border-radius:5px}
:root:root body:not(#z) #app .pd .sc table{border-radius:0}
:root:root body:not(#z) #app :is(.card,.card .cmedia){overflow:hidden}
:root:root body:not(#z) #app .bar .chip,:root:root body:not(#z) #app .btn,:root:root body:not(#z) #app .cbtn{border-radius:5px}

/* ph113 home page gets the same soft look */
:root:root body[data-page=home]:not(#z){background:#f3f5f4;--hc:#0fae6b;--ht:#e6f6ee}
:root:root body[data-page=home]:not(#z) [data-hue]{--hc:#0fae6b;--ht:#e6f6ee}
:root:root body[data-page=home]:not(#z) #app{--r:12px;color:#13201b}
:root:root body[data-page=home]:not(#z) #app h1.bn,:root:root body[data-page=home]:not(#z) #app>div>h1.bn{background:none;border:0;padding:0;margin:12px 0 8px;font-size:24px;font-weight:800;letter-spacing:-.01em;color:#13201b;max-width:none}
:root:root body[data-page=home]:not(#z) #app :is(.box,.pnl,.card,.fbt){background:#fff;border:1px solid #e4e9e6;border-top:1px solid #e4e9e6;border-radius:16px;box-shadow:0 1px 2px rgba(16,24,20,.04)}
:root:root body[data-page=home]:not(#z) #app .card.multi .cmedia,:root:root body[data-page=home]:not(#z) #app .card .cmedia{border-radius:16px 16px 0 0;overflow:hidden}
:root:root body[data-page=home]:not(#z) #app :is(input,select,textarea){border:1px solid #e4e9e6;border-radius:12px;background:#fff;color:#13201b}
:root:root body[data-page=home]:not(#z) #app :is(input,select,textarea):focus{outline:2px solid #0fae6b;border-color:#0fae6b}
:root:root body[data-page=home]:not(#z) #app .btn{background:#0fae6b;color:#fff;border:1px solid #0fae6b;border-radius:999px;font-weight:700}
:root:root body[data-page=home]:not(#z) #app .btn:hover{filter:brightness(.95)}
:root:root body[data-page=home]:not(#z) #app .btn.alt{background:#fff;color:#13201b;border:1px solid #cfd8d3}
:root:root body[data-page=home]:not(#z) #app .btn.alt:hover{border-color:#0fae6b;color:#0a7a4d}
:root:root body[data-page=home]:not(#z) #app .btn[disabled]{opacity:.5}
:root:root body[data-page=home]:not(#z) #app .chip{background:#fff;border:1px solid #e4e9e6;border-radius:999px;color:#13201b}
:root:root body[data-page=home]:not(#z) #app .chip.on{background:#e6f6ee;border-color:#0fae6b;color:#0a7a4d}
:root:root body[data-page=home]:not(#z) #app .pm{border:1px solid #e4e9e6;border-radius:12px;background:#fff}
:root:root body[data-page=home]:not(#z) #app .pm:has(input:checked){border-color:#0fae6b;background:#e6f6ee}
:root:root body[data-page=home]:not(#z) #app .cbtn{background:#0fae6b;color:#fff;border-radius:999px}
:root:root body[data-page=home]:not(#z) #app .badge,:root:root body[data-page=home]:not(#z) #app .fdel,:root:root body[data-page=home]:not(#z) #app .save{border-radius:6px}
:root:root body[data-page=home]:not(#z) #app .fbt{border-top:1px solid #e4e9e6;background:#fff}
:root:root body[data-page=home]:not(#z) #app .ln{border-color:#e4e9e6}
:root:root body[data-page=home]:not(#z) #app a.rm,:root:root body[data-page=home]:not(#z) #app button.rm{color:#d92d20}
:root:root body[data-page=home]:not(#z) #app .bar .chip{background:#fff!important}
:root:root body[data-page=home]:not(#z) #app .bar .chip.on{background:#e6f6ee!important;border-color:#0fae6b;color:#0a7a4d}
:root:root body[data-page=home]:not(#z) #app :is(.box,.pnl,.card,.fbt) :is(.sum,.stk,.mini,.cpn,.tot){border-radius:0}
:root:root body[data-page=home]:not(#z) #app .box .tot{border-top:1px solid #e4e9e6}
:root:root body[data-page=home]:not(#z) #app h1.bn{padding:0 8px;margin:14px 0 4px}
:root:root body[data-page=home]:not(#z) #app .ln{border:0;border-bottom:1px solid #e4e9e6;border-radius:0;box-shadow:none;background:none}
:root:root body[data-page=home]:not(#z) #app .box :is(.sum,.stk){border:0;box-shadow:none;background:none}
:root:root body[data-page=home]:not(#z) #app .btn.alt,:root:root body[data-page=home]:not(#z) #app a.btn.alt{background:#fff}
:root:root body[data-page=home]:not(#z) #app :is(.ln,.mini,.ci) img{border-radius:12px}
:root:root body[data-page=home]:not(#z) #app h2.ckh .ic{background:#e6f6ee!important;color:#0a7a4d!important}

:root:root body[data-page=home]:not(#z) #app .btn.alt,:root:root body[data-page=home]:not(#z) #app a.btn.alt{background:#fff;color:#0a0a0a;border:1px solid #cfd8d3}
:root:root body[data-page=home]:not(#z) #app .btn.alt:hover{border-color:#0a0a0a;color:#0a0a0a}
:root:root body[data-page=home]:not(#z) #app .bar .chip.on{background:#0a0a0a!important;border-color:#0a0a0a;color:#fff}
:root:root body[data-page=home]:not(#z) #app :is(input,select,textarea):focus{outline-color:#0a0a0a;border-color:#0a0a0a}



/* ph114 whole site eye-soothing: soft top strip, neutral section bars, calm footer */
:root:root body:not(#z){background:#f3f5f4}
:root:root body:not(#z) .ann{background:#fff4c2;color:#3d3200;font-weight:600}
:root:root body:not(#z) .hd{border-bottom:1px solid #e4e9e6;box-shadow:none}
:root:root body:not(#z) #app .home .trust>*,:root:root body:not(#z) #app .home .trust .it{background:#fff;border:1px solid #e4e9e6;border-radius:5px}
:root:root body:not(#z) #app .home :is(.hc,.tile){border:1px solid #e4e9e6;border-radius:5px;overflow:hidden;background:#fff}
:root:root body:not(#z) .ft{background:#13201b;color:#dfe8e3;border-top:0;box-shadow:none}
:root:root body:not(#z) .ft :is(h4,h3,h5,strong,.ftt,.fh){color:#cfe8d6}
:root:root body:not(#z) .ft a{color:#dfe8e3}
:root:root body:not(#z) .ft .nlf button.btn,:root:root body:not(#z) .ft .nlf .btn{background:#fff!important;color:#13201b!important;border:1px solid #fff!important;border-radius:5px}
:root:root body:not(#z) .ft :is(.soc a,.soc button){border-color:#3a4a42;color:#cfe8d6}
:root:root body:not(#z) .ft .pmb{border-radius:5px;background:#e4e9e6;color:#13201b}
:root:root body:not(#z) .ft .pmb-bkash{background:#e2136e;color:#fff}
:root:root body[data-page=home]:not(#z) #app :is(.btn,.btn.red,.hcta,.cbtn){background:#0a0a0a;color:#fff;border-color:#0a0a0a;border-radius:5px}
:root:root body[data-page=home]:not(#z) #app .btn.btn.alt{background:#fff;color:#0a0a0a;border:1px solid #cfd8d3}
:root:root body[data-page=home]:not(#z) #app .bar .chip.on{background:#0a0a0a!important;color:#fff}

/* ph115 product card: image meets the text area with square bottom corners (no grey notches) */
:root:root body:not(#z) :is(.card .ci,.card .cmedia,.card .ci img,.card .noimg,.card .cmedia img,.card .cmedia a){border-radius:2px}
:root:root body:not(#z) #app :is(.card .ci,.card .cmedia,.card .ci img,.card .noimg,.card .cmedia img,.card .cmedia a){border-radius:2px}
:root:root body:not(#z) #app .card :is(.cmedia,.ci){overflow:hidden;background:#fff}
:root:root body:not(#z) #app article.card.card :is(.cmedia,.ci,.cs,.csl,img,.noimg){border-radius:2px}
:root:root body:not(#z) #app article.card.card :is(.cmedia,.ci){border-radius:2px!important}

/* ph116 centered section headings and quick links on the home page */
:root:root body:not(#z) #app .home .sh h2{margin:0;padding:0;text-align:center;font-size:clamp(1.25rem,3.5vw,1.75rem)}

/* ph117 home headings: soft default, but every colour/height the dashboard sets (--hbg, --hfg, --hh) still wins */
:root:root body:not(#z) #app .home .sh{background:var(--hbg,transparent);min-height:var(--hh,0);border:0;box-shadow:none}
:root:root body:not(#z) #app .home .sh h2{color:var(--hfg,#13201b);background:none;border:0;padding:0;margin:0;letter-spacing:.06em}
:root:root body:not(#z) #app .home h2.bh{background:var(--hbg,transparent);color:var(--hfg,#13201b);border:0;text-align:center}
:root:root body:not(#z) #app .home .sh[style*="--hbg"]{padding-top:.7rem;padding-bottom:.7rem}

/* ph118 desktop: every home section sits in the same centered box (same width as the product grid) */
:root:root body:not(#z) #app .home{--cw:87.5rem}
:root:root body:not(#z) #app .home .sh,:root:root body:not(#z) #app .home h2.bh{box-sizing:border-box;width:calc(100% - 2rem);max-width:var(--cw);margin-inline:auto;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:5px}
:root:root body:not(#z) #app .home .sh{margin-block:28px 10px}
:root:root body:not(#z) #app .home .hqb,:root:root body:not(#z) #app .home .trust{box-sizing:border-box;width:calc(100% - 2rem);max-width:var(--cw);margin-inline:auto}
@media(max-width:47.99rem){:root:root body:not(#z) #app .home :is(.sh,h2.bh,.hqb,.trust){width:calc(100% - 1.5rem)}}
.bapp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:1.5rem;align-items:center;border:1px solid var(--line,#e5e5e5);padding:1rem}.bapp__i img{width:100%;height:auto;display:block}.bapp__t h2{margin:0 0 .5rem}.bapp__t p{margin:0 0 1rem}.bapp__b{display:flex;gap:.75rem;flex-wrap:wrap}
@media(max-width:700px){.bapp{grid-template-columns:1fr}}
/* Size Guide drawer */
.szl{display:inline-flex;align-items:center;gap:.375rem;border:1px solid #0a0a0a;background:#fff;color:#0a0a0a;font-size:.8125rem;font-weight:700;padding:.375rem .75rem;border-radius:2px;cursor:pointer;text-decoration:none}.szl .ic{width:1rem;height:1rem}.szl:hover{background:#0a0a0a;color:#fff}
body.sg-on{overflow:hidden}.sgov{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.45);display:flex;justify-content:flex-end}
.sgd{background:#fff;color:#0a0a0a;width:min(26rem,100%);height:100%;overflow-y:auto;padding:1.25rem;animation:sgin .2s ease-out}@keyframes sgin{from{transform:translateX(100%)}to{transform:none}}
.sgh{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.sgh h2{margin:0;font-size:1.25rem}.sgx{border:0;background:none;font-size:1.75rem;line-height:1;cursor:pointer}
.sgd .szt{display:inline-flex;margin:0 0 .75rem}.sgd .szt button{border:1px solid #cfcfcf;background:#fff;color:#0a0a0a;font-weight:700;font-size:.75rem;padding:.375rem 1rem;cursor:pointer;border-radius:2px}.sgd .szt button[aria-selected=true]{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
.sgn{margin:.25rem 0 .5rem;font-weight:600}.sgt table{width:100%;border-collapse:collapse}.sgt th,.sgt td{padding:.625rem .5rem;text-align:left;border-bottom:1px solid #e5e5e5}.sgt th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:#555}.sgt tr.on td{background:#0a0a0a;color:#fff;font-weight:700}
.sgnote{color:#555;font-size:.875rem}.sgm{margin-top:1.25rem;padding:1rem;background:#f5f5f5}.sgm h3{margin:0 0 .5rem;font-size:1rem}.sgm p{margin:.375rem 0;font-size:.875rem}
/* Reviews */
.rvw{margin-top:2rem}.rvs__in{display:flex;gap:2rem;flex-wrap:wrap;align-items:center;margin-bottom:1rem}.rvs__a{display:grid;gap:.125rem}.rvs__a b{font-size:2.25rem;line-height:1}.rvs__d{display:grid;gap:.25rem;min-width:12rem;flex:1;max-width:22rem}.rvs__d div{display:grid;grid-template-columns:2rem 1fr 2rem;gap:.5rem;align-items:center;font-size:.8125rem}.rvs__d i{height:.5rem;background:#e5e5e5;display:block}.rvs__d u{display:block;height:100%;background:#0a0a0a}
.rvc{display:flex;gap:.75rem;flex-wrap:wrap;margin:.75rem 0}.rvc input,.rvc select{padding:.5rem .75rem;border:1px solid #cfcfcf;border-radius:2px;font:inherit}.rvc input{flex:1;min-width:10rem}
.rv{padding:1rem 0;border-bottom:1px solid #e5e5e5}.rv__h{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.rv p{margin:.375rem 0}.vb{display:inline-flex;align-items:center;gap:.25rem;font-size:.8125rem;color:#1d9bf0;font-weight:600}.vb svg{vertical-align:middle}
.rv__f{display:flex;gap:.5rem;align-items:center;font-size:.8125rem;flex-wrap:wrap}.rvb{border:1px solid #cfcfcf;background:#fff;padding:.25rem .625rem;border-radius:2px;cursor:pointer;font:inherit;font-size:.8125rem}.rvb:disabled{opacity:.6;cursor:default}.rvb--r{margin-left:auto;border-color:transparent;color:#777}
.rvm{text-align:center;margin:1rem 0}.rvt{display:flex;gap:.5rem;margin:1.5rem 0 .75rem}.rvt button{padding:.5rem 1rem;border:1px solid #cfcfcf;background:#fff;border-radius:2px;cursor:pointer;font:inherit;font-weight:600}.rvt button[aria-selected=true]{background:#0a0a0a;color:#fff;border-color:#0a0a0a}
.rvl{display:grid;gap:.25rem;margin:.625rem 0}.rvl--c{display:flex;gap:.5rem;align-items:center}.rvl input[type=text],.rvl textarea{padding:.625rem .75rem;border:1px solid #cfcfcf;border-radius:2px;font:inherit;width:100%;box-sizing:border-box}
.rpick{display:flex;gap:.25rem}.rpick button{border:0;background:none;font-size:1.75rem;color:#c8c8c8;cursor:pointer;padding:0 .125rem}.rpick button.on{color:#f5a300}.ok2{padding:.75rem 1rem;background:#eaf7ef;border-left:3px solid #16a34a}
.rvq{margin-top:2rem}.qa{padding:.75rem 0;border-bottom:1px solid #eee}.qa p{margin:.25rem 0}
/* Order alerts card and first-open popup */
.pcard{border:1px solid #e5e5e5;background:#fafafa;padding:1rem;margin:1rem 0}.pcard p{margin:.375rem 0 .75rem}.pcard__b{display:flex;gap:.5rem;flex-wrap:wrap}.pcard__ok{color:#15803d;font-weight:600;margin:0}
.apm{position:fixed;inset:0;z-index:300;display:flex;align-items:flex-end;justify-content:center}.apm__bg{position:absolute;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:1;transition:opacity .25s}
.apm__box{position:relative;background:#fff;color:#0a0a0a;width:100%;max-width:26rem;padding:1.5rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom));border-radius:1rem 1rem 0 0;text-align:center;display:grid;gap:.75rem;max-height:92vh;overflow-y:auto}
.apm--perm .apm__bg{opacity:0}.apm--perm.on .apm__bg{opacity:1}.apm--perm .apm__box{transform:translateY(100%);transition:transform .3s ease-out}.apm--perm.on .apm__box{transform:none}
.apm__box h2{margin:0;font-size:1.25rem}.apm__box p{margin:0;color:#444}.apm__ic{margin:0 auto;border-radius:.75rem;border:1px solid #eee}
.apm__tk{list-style:none;margin:0;padding:.875rem;background:#f5f5f5;text-align:left;display:grid;gap:.5rem;font-size:.9375rem}.apm__v{display:inline-grid;place-items:center;width:1.25rem;height:1.25rem;border-radius:50%;background:#16a34a;color:#fff;font-size:.75rem;margin-right:.5rem}
.apm__lk{font-size:.8125rem;display:flex;gap:.375rem;align-items:center;justify-content:center;color:#666}.apm__lk .ic{width:.875rem;height:.875rem}
.apm__go{width:100%;background:#0a0a0a;color:#fff;border:0;border-radius:2px;padding:.9375rem;font:inherit;font-weight:700;cursor:pointer}.apm__no{background:none;border:0;color:#666;font:inherit;cursor:pointer;padding:.5rem}
.apm__box ol{text-align:left;margin:0;padding-left:1.25rem;display:grid;gap:.375rem}
@media(min-width:700px){.apm{align-items:center}.apm__box{border-radius:.5rem}.apm--perm .apm__box{transform:translateY(1rem);opacity:0;transition:transform .25s,opacity .25s}.apm--perm.on .apm__box{transform:none;opacity:1}}
/* Track page: now marker, courier updates, rider card */
.stp .now{display:inline-block;margin-left:.5rem;padding:.0625rem .4375rem;font-size:.6875rem;font-style:normal;font-weight:700;background:#0a0a0a;color:#fff;border-radius:2px;vertical-align:middle}
.stsub{list-style:none;margin:.375rem 0 0;padding:0 0 0 .75rem;border-left:2px solid #e5e5e5;display:grid;gap:.375rem;font-size:.8125rem}.stsub li{display:grid}.stsub small{color:#777}
.adue{color:#b45309;font-weight:700}.amore{margin-top:.75rem}
.tbn{margin:0 0 1rem}.tbn__i{width:100%;height:auto;display:block;max-height:11rem;object-fit:cover}.pf{display:flex;gap:.5rem;align-items:center;margin:.5rem 0;flex-wrap:wrap}.pf input{width:6rem;padding:.5rem;border:1px solid #cfcfcf;border-radius:2px;font:inherit}
/* Storefront header extras: utility bar, mega menu, app strip, swipeable product rows */
.ub{display:none;background:#f5f5f5;border-bottom:1px solid #e5e5e5;font-size:.8125rem}.ub__in{max-width:80rem;margin:0 auto;padding:.375rem 1rem;display:flex;justify-content:space-between;gap:1rem}.ub span{display:flex;gap:1.25rem;align-items:center}
.ub a,.ub button{display:inline-flex;align-items:center;gap:.375rem;background:none;border:0;padding:0;color:#222;font:inherit;cursor:pointer;text-decoration:none}.ub a:hover,.ub button:hover{text-decoration:underline}.ub .ic{width:.9rem;height:.9rem}
@media(min-width:62rem){.ub{display:block}}
.ddm.mega{display:none;grid-template-columns:minmax(12rem,1fr) minmax(14rem,1.2fr);gap:1rem 1.5rem;min-width:30rem;padding:1rem}.dd:hover>.ddm.mega,.dd.open>.ddm.mega{display:grid}
.ddl{display:grid;gap:.125rem;align-content:start}.ddn{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;align-content:start}.ddn h5{grid-column:1/-1;margin:0;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:#666}.ddn a{display:grid;gap:.25rem;font-size:.75rem;padding:0!important}.ddn img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}.dda{font-weight:700!important;text-decoration:underline}
.ast2{display:flex;gap:.75rem;align-items:center;justify-content:center;background:#0a0a0a;color:#fff;padding:.5rem 2.5rem .5rem 1rem;font-size:.8125rem;position:relative;flex-wrap:wrap;text-align:center}.ast2__b{background:#fff;color:#0a0a0a;border:0;border-radius:2px;padding:.3125rem .75rem;font:inherit;font-weight:700;cursor:pointer}.ast2__x{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;font-size:1.25rem;cursor:pointer}
@media(max-width:47.99rem){:root:root .home .hgrid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:44%;gap:.75rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.5rem;-webkit-overflow-scrolling:touch}:root:root .home .hgrid>*{scroll-snap-align:start}}