@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:200 1000;src:url('fonts/f1-714d40cf.woff2') format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Cairo';font-style:normal;font-display:swap;font-weight:200 1000;src:url('fonts/f2-caa2f572.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-display:swap;font-weight:100 900;src:url('fonts/f3-a5ec5492.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'DM Sans';font-style:normal;font-display:swap;font-weight:100 1000;src:url('fonts/f4-c57593e0.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --bg:#F4F7FB; --surface:#FFFFFF; --tile:#EAF2FE; --field:#F8FAFC;
  --text:#141B26; --muted:#5A6475; --line:#DDE3EC; --line-2:#B9C6D8; --head:#0D2D5C;
  --brand:#014CA7; --brand-h:#0D2D5C; --on-brand:#FFFFFF; --link:#014CA7; --accent:#338BF7;
  --deep:#0D2D5C; --deep-2:#014CA7; --on-deep:#FFFFFF; --on-deep-2:#EAF2FE;
  --sale:#C2410C; --sale-bg:#FFEDD5; --sale-ink:#C2410C; --ok:#15803D;
  --err:#B91C1C; --err-bg:#FEF2F2; --scrim:rgba(13,45,92,.45); --shadow:0 18px 40px rgba(13,45,92,.18);
  --r:18px; --r-sm:12px; --hdr:72px;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0A1526; --surface:#101F36; --tile:#172A49; --field:#0C1A2E;
    --text:#E7EDF6; --muted:#9DABC0; --line:#233753; --line-2:#36507A; --head:#F2F6FC;
    --brand:#1F6FD6; --brand-h:#338BF7; --on-brand:#FFFFFF; --link:#7DB4FF; --accent:#338BF7;
    --deep:#0B2550; --deep-2:#1450A8; --on-deep:#FFFFFF; --on-deep-2:#D6E5FB;
    --sale:#C2410C; --sale-bg:#3B1D0E; --sale-ink:#FDBA74; --ok:#4ADE80;
    --err:#FCA5A5; --err-bg:#2B1216; --scrim:rgba(2,8,20,.65); --shadow:0 18px 40px rgba(0,0,0,.45);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0A1526; --surface:#101F36; --tile:#172A49; --field:#0C1A2E;
  --text:#E7EDF6; --muted:#9DABC0; --line:#233753; --line-2:#36507A; --head:#F2F6FC;
  --brand:#1F6FD6; --brand-h:#338BF7; --on-brand:#FFFFFF; --link:#7DB4FF; --accent:#338BF7;
  --deep:#0B2550; --deep-2:#1450A8; --on-deep:#FFFFFF; --on-deep-2:#D6E5FB;
  --sale:#C2410C; --sale-bg:#3B1D0E; --sale-ink:#FDBA74; --ok:#4ADE80;
  --err:#FCA5A5; --err-bg:#2B1216; --scrim:rgba(2,8,20,.65); --shadow:0 18px 40px rgba(0,0,0,.45);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + var(--hdr) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Cairo',Tahoma,sans-serif;font-size:16px;line-height:1.7;overflow-x:clip;min-height:100%}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--surface)}
html[lang=en] body{font-family:'DM Sans',Verdana,sans-serif;line-height:1.55}
html[lang=en] .h{font-family:'Montserrat','Trebuchet MS',sans-serif;letter-spacing:-.01em}
html.locked,html.locked body{overflow:hidden}
a{color:inherit}
img{max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{color:var(--head)}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:24px}
.ic{display:block;flex-shrink:0}
html[dir=rtl] .flip{transform:scaleX(-1)}
.money{direction:ltr;unicode-bidi:isolate;white-space:nowrap}
.vh{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:8px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none !important;animation:none !important;scroll-behavior:auto !important}}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 22px;border-radius:999px;font-weight:700;font-size:16px;line-height:1.3;text-decoration:none;cursor:pointer;border:2px solid transparent;transition:background .15s,color .15s,border-color .15s;text-align:center}
.btn-primary{background:var(--brand);color:var(--on-brand)}
.btn-primary:hover{background:var(--brand-h)}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--head)}
.btn-ghost:hover{border-color:var(--link);color:var(--link)}
.btn-signal{background:var(--accent);color:#0D2D5C}
.btn-signal:hover{background:#fff}
.btn-outline{background:transparent;border-color:rgba(234,242,254,.5);color:var(--on-deep)}
.btn-outline:hover{border-color:var(--on-deep);background:rgba(255,255,255,.08)}
.btn-wa{background:#15803D;color:#fff}
.btn-wa:hover{background:#116A32}
.btn.wide{width:100%}
.btn.grow{flex:1;min-width:0}
.linkbtn{background:none;border:0;padding:6px 0;min-height:36px;color:var(--link);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-size:14.5px}
.iconbtn{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;background:transparent;cursor:pointer;color:var(--head);position:relative;flex-shrink:0}
.iconbtn:hover{background:var(--tile)}
.cnt{position:absolute;inset-block-start:2px;inset-inline-end:0;background:var(--accent);color:#0D2D5C;font-size:11.5px;font-weight:800;min-width:19px;height:19px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding-inline:4px;line-height:1;font-family:'Montserrat','Trebuchet MS',sans-serif}
.cnt[hidden]{display:none}

/* ---------- Top bar & header ---------- */
.topbar{background:var(--deep);color:var(--on-deep-2);font-size:13.5px}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;min-height:40px;gap:16px}
.topbar .tl{display:flex;gap:20px;align-items:center}
.topbar a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;min-height:32px}
.topbar a:hover{color:#fff}
.langbtn{border:1px solid rgba(234,242,254,.4);background:none;color:#fff;border-radius:999px;padding:3px 12px;min-height:32px;font-weight:700;font-size:13.5px;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.langbtn:hover{border-color:#fff}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--surface);border-bottom:1px solid var(--line)}
header.site .bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:28px;align-items:center;height:var(--hdr)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.logo img{height:46px;width:auto;display:block}
.logo .lg-w{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .logo .lg-n{display:none}:root:not([data-theme="light"]) .logo .lg-w{display:block}}
:root[data-theme="dark"] .logo .lg-n{display:none}
:root[data-theme="dark"] .logo .lg-w{display:block}
.logo .lt b{display:block;font-size:18px;color:var(--head);line-height:1.2}
.logo .lt small{display:block;color:var(--muted);font-size:12.5px;line-height:1.3}
.searchform{display:flex;align-items:center;gap:0;max-width:620px;width:100%;justify-self:center;background:var(--field);border:1.5px solid var(--line);border-radius:999px;padding:4px;transition:border-color .15s}
.searchform:focus-within{border-color:var(--accent);background:var(--surface)}
.searchform input{flex:1;min-width:0;border:0;background:transparent;padding:6px 16px;min-height:40px;font-size:16px;outline:none}
.searchform input::-webkit-search-cancel-button{cursor:pointer}
.searchform button{border:0;border-radius:999px;background:var(--brand);color:var(--on-brand);min-height:40px;padding-inline:18px;display:inline-flex;align-items:center;gap:8px;font-weight:700;cursor:pointer}
.searchform button:hover{background:var(--brand-h)}
.acts{display:flex;align-items:center;gap:4px}
.cartbtn{display:flex;align-items:center;gap:10px;text-decoration:none;padding:6px 12px 6px 10px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;min-height:48px}
.cartbtn:hover{border-color:var(--link)}
.cartbtn .cic{position:relative;color:var(--head);display:flex}
.cartbtn .cic .cnt{inset-block-start:-8px;inset-inline-end:-10px}
.cartbtn .ctx{display:flex;flex-direction:column;line-height:1.2;text-align:start}
.cartbtn small{color:var(--muted);font-size:12px}
.cartbtn strong{color:var(--head);font-size:15px;font-family:'Montserrat','Trebuchet MS',sans-serif}
.m-only{display:none !important}
.msearch{display:none;padding-block:0 12px}
.catnav{background:var(--surface);border-bottom:1px solid var(--line)}
.catnav .wrap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.catnav .wrap::-webkit-scrollbar{display:none}
.catnav a{flex-shrink:0;text-decoration:none;font-weight:700;font-size:15px;padding:12px 14px;white-space:nowrap;color:var(--text);border-bottom:3px solid transparent;display:inline-flex;align-items:center;gap:8px}
.catnav a:hover{color:var(--link)}
.catnav a.on{color:var(--link);border-bottom-color:var(--accent)}
.catnav a.deal{color:var(--sale-ink)}
.catnav a.deal.on{border-bottom-color:var(--sale)}

/* ---------- Sections ---------- */
.sec{padding-block:56px 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:20px}
.sec-head h2{margin:0;font-size:28px;line-height:1.3}
.sec-head p{margin:4px 0 0;color:var(--muted);font-size:15.5px;max-width:40em}
.sec-head .more{color:var(--link);font-weight:700;text-decoration:none;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}
.sec-head .more:hover{text-decoration:underline;text-underline-offset:3px}
.sec-head .side{display:flex;align-items:center;gap:8px;flex-shrink:0}
.railnav{display:flex;gap:6px}
.railnav button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);color:var(--head);display:flex;align-items:center;justify-content:center;cursor:pointer}
.railnav button:hover:not(:disabled){border-color:var(--link);color:var(--link)}
.railnav button:disabled{opacity:.4;cursor:default}

/* ---------- Hero ---------- */
.hero{padding-block:24px 0}
.hero-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:18px}
.banner{background:var(--deep);color:var(--on-deep);border-radius:28px;padding:44px 48px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:24px;min-height:420px;position:relative;overflow:hidden;isolation:isolate}
.banner::before{content:"";position:absolute;z-index:-1;width:520px;height:520px;border-radius:50%;background:var(--deep-2);inset-block-start:-200px;inset-inline-end:-160px}
.word{margin:0;font-weight:900;color:var(--on-deep);font-size:clamp(92px,10.5vw,150px);line-height:1.15;display:flex;align-items:baseline;gap:.04em}
html[lang=en] .word{font-size:clamp(76px,8.5vw,124px);letter-spacing:-.045em;line-height:1}
.word i{display:inline-block;width:.16em;height:.16em;border-radius:50%;background:var(--accent);flex-shrink:0}
.banner h1{color:var(--on-deep);margin:10px 0 12px;font-size:clamp(22px,2.2vw,30px);line-height:1.4;font-weight:800;max-width:20em}
html[lang=en] .banner h1{line-height:1.2;margin-top:18px}
.banner p.lead{margin:0 0 26px;color:var(--on-deep-2);font-size:17px;max-width:30em}
.ctas{display:flex;gap:12px;flex-wrap:wrap}
.bart{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:6px;align-self:end}
.bart .tvw{grid-column:1/-1;max-width:260px;justify-self:center;width:100%}
.bart .illus{width:100%;height:auto}
.promos{display:grid;grid-template-rows:1fr 1fr;gap:18px}
.promo{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:20px;display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:12px;align-items:center;text-decoration:none;transition:border-color .15s}
.promo:hover{border-color:var(--line-2)}
.promo .lbl{display:inline-block;background:var(--sale-bg);color:var(--sale-ink);font-weight:800;font-size:13px;padding:1px 10px;border-radius:999px}
.promo h3{margin:10px 0 8px;font-size:17px;line-height:1.45;color:var(--text)}
.promo .pp{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.promo .pa{background:var(--tile);border-radius:16px;padding:8px;aspect-ratio:1/1}
.promo .pa .illus{width:100%;height:100%}
.benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}
.benefit{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.bic{width:48px;height:48px;border-radius:14px;background:var(--tile);color:var(--link);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.benefit strong{display:block;color:var(--head);font-size:15.5px;line-height:1.35}
.benefit span{display:block;color:var(--muted);font-size:13.5px;line-height:1.45;margin-top:2px}

/* ---------- Category bento ---------- */
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:190px;gap:16px}
.tile{position:relative;overflow:hidden;border-radius:var(--r);background:var(--tile);text-decoration:none;padding:20px 22px;display:flex;flex-direction:column;transition:outline-color .15s;outline:2px solid transparent;outline-offset:2px}
.tile:hover{outline-color:var(--accent)}
.tile .tt b{display:block;font-size:19px;line-height:1.3;color:var(--head)}
.tile .tt span{display:block;color:var(--muted);font-size:14px;margin-top:2px}
.tile .ta{position:absolute;inset-block-end:10px;inset-inline-end:14px;width:46%;max-width:150px;aspect-ratio:1/1}
.tile .ta .illus{width:100%;height:100%}
.tile.t1{grid-column:span 2;grid-row:span 2;background:var(--deep-2)}
.tile.t1 .ta{width:58%;max-width:250px;left:50%;right:auto;transform:translateX(-50%);inset-block-end:16px}
.tile.t2{grid-column:span 2;background:var(--deep)}
.tile.t1 .tt b,.tile.t2 .tt b{color:var(--on-deep);font-size:22px}
.tile.t1 .tt span,.tile.t2 .tt span{color:var(--on-deep-2)}
.tile.w2{grid-column:span 2}
.tile.t2 .ta,.tile.w2 .ta{width:auto;height:84%;max-width:none}

/* ---------- Product cards ---------- */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}
.pgrid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;overflow:hidden;transition:border-color .15s;min-width:0}
.pcard:hover{border-color:var(--line-2)}
.pimg{position:relative;display:block;background:var(--tile);aspect-ratio:1/1;padding:16px}
.illus{width:100%;height:100%;display:block}
.badge{position:absolute;inset-block-start:12px;inset-inline-start:12px;background:var(--sale);color:#fff;font-weight:800;font-size:12.5px;padding:2px 10px;border-radius:999px;line-height:1.6;font-family:'Montserrat','Trebuchet MS',sans-serif}
.pbody{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.pcat{font-size:13px;color:var(--muted);font-weight:600}
.pname{margin:0;font-size:15px;line-height:1.5;font-weight:700;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3em}
.pname a{text-decoration:none}
.pname a:hover{color:var(--link)}
.prices{display:flex;align-items:baseline;gap:8px 10px;flex-wrap:wrap;margin-top:auto;padding-top:6px}
.price{font-family:'Montserrat','Trebuchet MS',sans-serif;font-weight:800;font-size:20px;color:var(--head);line-height:1.3}
.old{color:var(--muted);font-size:14px}
.padd{margin-top:10px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:999px;border:0;background:var(--brand);color:var(--on-brand);font-weight:700;cursor:pointer;font-size:15px;padding-inline:12px;transition:background .15s}
.padd:hover{background:var(--brand-h)}
.padd.done{background:var(--ok);color:#fff}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:236px;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;overscroll-behavior-x:contain}
.rail > *{scroll-snap-align:start}

/* ---------- Bundles ---------- */
.sets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.set{border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:16px;background:var(--surface);min-width:0}
.set-head h3{margin:0;font-size:19px;line-height:1.35}
.set-head .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.tag{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;background:var(--tile);color:var(--head);font-size:13px;font-weight:700}
.set-items{display:flex;flex-direction:column;gap:4px;flex:1}
.set-item{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;text-decoration:none;padding:6px;margin-inline:-6px;border-radius:12px}
.set-item:hover{background:var(--tile)}
.set-item .si{display:block;background:var(--tile);border-radius:10px;aspect-ratio:1/1;padding:4px}
.set-item .sn{font-size:14.5px;font-weight:600;line-height:1.45;min-width:0}
.set-item .money{font-weight:700;color:var(--head);font-size:14.5px}
.set-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px}
.set-foot .tl{color:var(--muted);font-size:13.5px;line-height:1.2}

/* ---------- Help band & footer ---------- */
.help{margin-top:64px;background:var(--tile)}
.help .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:28px;flex-wrap:wrap}
.help h2{margin:0;font-size:22px;line-height:1.35}
.help p{margin:4px 0 0;color:var(--muted)}
footer.site{background:var(--deep);color:var(--on-deep-2)}
footer.site .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding-block:48px 36px}
.fbrand img{height:56px;width:auto;display:block;margin-bottom:12px}
.fbrand p{margin:0;line-height:1.6}
.fbrand strong{color:#fff}
footer.site h4{color:#fff;margin:0 0 10px;font-size:16px}
footer.site ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
footer.site li a{text-decoration:none;display:inline-flex;align-items:center;min-height:36px}
footer.site li a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.fbottom{border-top:1px solid rgba(234,242,254,.15);padding-block:16px;font-size:14px}
.fbottom .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ---------- Listing ---------- */
.crumbs{display:flex;gap:8px;flex-wrap:wrap;font-size:14px;color:var(--muted);padding-block:20px 8px}
.crumbs a{color:var(--link);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.listing{padding-bottom:24px}
.list-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;align-items:start}
.list-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.list-head h1{margin:0;font-size:30px;line-height:1.3}
.count{color:var(--muted);font-size:15px}
.ltools{display:flex;align-items:center;gap:10px}
.sortlab{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--muted)}
.sortlab select{min-height:44px;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:6px 12px;background:var(--surface);color:var(--text);font-weight:600;font-size:15px}
.filters{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:6px 18px 16px;position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hdr) + 16px)}
.filters h2{font-size:18px;margin:12px 0 0}
.fgroup{padding-block:14px;border-bottom:1px solid var(--line)}
.fgroup h3{margin:0 0 6px;font-size:15px;color:var(--text)}
.radio,.check{display:flex;align-items:center;gap:10px;min-height:40px;cursor:pointer;font-size:15px}
.radio em{margin-inline-start:auto;font-style:normal;color:var(--muted);font-size:13px}
.radio input,.check input{width:18px;height:18px;accent-color:var(--brand);margin:0;flex-shrink:0}
.fgroup input[type=range]{width:100%;accent-color:var(--brand);min-height:32px}
.range-val{font-weight:700;color:var(--head)}
.fbtn{display:none}
.chips{display:none}
.chip{min-height:40px;padding:4px 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);font-weight:700;font-size:14px;cursor:pointer;white-space:nowrap;flex-shrink:0;color:var(--text)}
.chip[aria-pressed=true]{background:var(--head);border-color:var(--head);color:var(--surface)}
.empty{text-align:center;padding:48px 24px;background:var(--surface);border:1px dashed var(--line-2);border-radius:var(--r);display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted)}
.empty p{margin:0}
.empty strong{color:var(--text)}
.empty .btn{margin-top:12px}

/* ---------- Product page ---------- */
.pdp-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:44px;align-items:start;margin-top:8px}
.gallery{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hdr) + 16px);background:var(--tile);border-radius:24px;aspect-ratio:1/1;padding:44px}
.gallery .badge{font-size:14px;inset-block-start:18px;inset-inline-start:18px}
.pinfo h1{margin:4px 0 14px;font-size:28px;line-height:1.35}
.prices.big .price{font-size:32px}
.prices.big .old{font-size:17px}
.save{background:var(--sale-bg);color:var(--sale-ink);font-weight:700;font-size:14px;padding:2px 10px;border-radius:999px}
.stock{display:flex;align-items:center;gap:8px;color:var(--ok);font-weight:700;margin:12px 0 18px}
.sdot{width:9px;height:9px;border-radius:50%;background:var(--ok)}
.buyrow{display:flex;gap:12px;margin-bottom:12px}
.stepper{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);flex-shrink:0}
.stepper button{width:46px;height:48px;border:0;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--head);border-radius:999px}
.stepper button:disabled{opacity:.35;cursor:default}
.stepper output{min-width:28px;text-align:center;font-weight:800;font-family:'Montserrat','Trebuchet MS',sans-serif}
.stepper.sm button{width:36px;height:36px}
.walink{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;min-height:44px;color:var(--link);font-weight:700;text-decoration:none;border-radius:999px}
.walink:hover{background:var(--tile)}
.dnote{display:flex;gap:10px;align-items:center;background:var(--tile);color:var(--head);padding:12px 16px;border-radius:var(--r-sm);font-size:15px;margin:16px 0 0}
.spec-h{font-size:20px;margin:28px 0 10px}
.specs{width:100%;border-collapse:collapse;font-size:15px}
.specs th,.specs td{text-align:start;padding:10px 12px;border-bottom:1px solid var(--line)}
.specs th{color:var(--muted);font-weight:600;width:40%}
.related{margin-top:56px}
.related h2{font-size:24px;margin:0 0 18px}

/* ---------- Cart & checkout ---------- */
.page{padding-bottom:24px}
.page h1{font-size:30px;margin:24px 0 20px;line-height:1.3}
.cart-grid,.co-grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:28px;align-items:start}
.clines{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:4px 20px}
.cline{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:16px;align-items:center;padding-block:16px;border-bottom:1px solid var(--line)}
.cline:last-child{border-bottom:0}
.cimg{display:block;background:var(--tile);border-radius:var(--r-sm);aspect-ratio:1/1;padding:8px}
.cinfo{display:flex;flex-direction:column;gap:2px;min-width:0}
.cname{font-weight:700;text-decoration:none;line-height:1.45}
.cname:hover{color:var(--link)}
.cunit{color:var(--muted);font-size:14.5px}
.crow{display:flex;align-items:center;gap:16px;margin-top:6px;flex-wrap:wrap}
.cline-total{font-family:'Montserrat','Trebuchet MS',sans-serif;color:var(--head);font-size:17px}
.sumbox{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:14px;position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hdr) + 16px)}
.sumbox h2{margin:0;font-size:20px}
.totals{margin:0;display:flex;flex-direction:column;gap:10px}
.totals div{display:flex;justify-content:space-between;gap:12px}
.totals dt{color:var(--muted)}
.totals dd{margin:0;font-weight:700;text-align:end}
.totals .muted{color:var(--muted);font-weight:500;font-size:14.5px}
.totals .grand{border-top:1px solid var(--line);padding-top:12px;font-size:19px}
.totals .grand dt{color:var(--text);font-weight:800}
.totals .grand dd{font-family:'Montserrat','Trebuchet MS',sans-serif;color:var(--head);font-weight:800}
.co-main{display:flex;flex-direction:column;gap:20px;min-width:0}
fieldset{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:20px 22px;margin:0;min-width:0}
legend{font-weight:800;font-size:18px;color:var(--head);padding-inline:6px}
.frow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-bottom:14px}
.frow:last-child{margin-bottom:0}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-weight:700;font-size:14.5px}
.field input,.field select,.field textarea{min-height:48px;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:10px 14px;background:var(--field);font-size:16px;width:100%}
.field textarea{resize:vertical;min-height:48px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);background:var(--surface)}
.field.has-err input,.field.has-err select{border-color:var(--err);background:var(--err-bg)}
.err{color:var(--err);font-size:13.5px;font-weight:600}
.choices{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.choice{display:flex;gap:12px;align-items:flex-start;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:14px;cursor:pointer}
.choice:has(input:checked){border-color:var(--brand);background:var(--tile)}
.choice input{width:18px;height:18px;margin:5px 0 0;accent-color:var(--brand);flex-shrink:0}
.choice strong{display:block;line-height:1.4}
.choice small{display:block;color:var(--muted);font-size:13.5px;line-height:1.45;margin-top:2px}
.payrow{display:flex;gap:12px;align-items:center;border:1.5px solid var(--brand);background:var(--tile);border-radius:var(--r-sm);padding:14px}
.payrow .bic{background:var(--surface)}
.payrow strong{display:block}
.payrow small{color:var(--muted);font-size:13.5px}
.mini{display:flex;flex-direction:column;gap:12px;max-height:320px;overflow:auto;padding:8px 8px 4px 4px;margin:-8px -8px 0 -4px}
.mline{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;font-size:14.5px}
.mimg{position:relative;background:var(--tile);border-radius:10px;aspect-ratio:1/1;padding:4px}
.mimg em{position:absolute;inset-block-start:-6px;inset-inline-end:-6px;background:var(--head);color:var(--surface);font-style:normal;font-size:12px;font-weight:700;min-width:20px;height:20px;border-radius:10px;display:flex;align-items:center;justify-content:center;padding-inline:4px}
.mname{line-height:1.45}
.done{padding-block:40px 24px}
.done-card{max-width:580px;margin-inline:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:36px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center}
.done-card .mini{width:100%;text-align:start;margin-block:10px;max-height:none}
.done-ic{width:68px;height:68px;border-radius:50%;background:var(--tile);color:var(--link);display:flex;align-items:center;justify-content:center}
.done-card h1{margin:6px 0 0;font-size:28px;line-height:1.3}
.done-card p{margin:0;color:var(--muted)}
.ono{font-weight:800;color:var(--head) !important;font-size:18px}
.done-total{font-weight:800;color:var(--head) !important;font-size:18px}
.done-card .acts2{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:8px}

/* ---------- Sheets (cart drawer, mobile menu) ---------- */
#sheet{position:fixed;inset:0;z-index:80;visibility:hidden;transition:visibility 0s linear .3s}
#sheet.open{visibility:visible;transition:none}
#sheet .scrim{position:absolute;inset:0;background:var(--scrim);opacity:0;transition:opacity .3s}
#sheet.open .scrim{opacity:1}
.panel{position:absolute;inset-block:0;width:min(420px,92vw);background:var(--surface);display:flex;flex-direction:column;box-shadow:var(--shadow);transform:translateX(var(--shift));transition:transform .3s ease;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.panel.end{inset-inline-end:0;--shift:100%}
html[dir=rtl] .panel.end{--shift:-100%}
.panel.start{inset-inline-start:0;--shift:-100%}
html[dir=rtl] .panel.start{--shift:100%}
#sheet.open .panel{transform:none}
.dhead{display:flex;justify-content:space-between;align-items:center;padding:12px 12px 12px 20px;border-bottom:1px solid var(--line);gap:12px}
html[dir=rtl] .dhead{padding:12px 20px 12px 12px}
.dhead h2{margin:0;font-size:20px}
.dbody{flex:1;overflow-y:auto;padding:4px 20px;overscroll-behavior:contain}
.dbody .empty{border:0;background:none;padding-block:48px}
.dbody .cline{grid-template-columns:72px minmax(0,1fr)}
.dfoot{border-top:1px solid var(--line);padding:16px 20px 20px;display:flex;flex-direction:column;gap:12px}
.mmenu{display:flex;flex-direction:column;padding-block:8px}
.mmenu a{display:flex;align-items:center;gap:12px;min-height:52px;text-decoration:none;font-weight:700;font-size:16px;border-bottom:1px solid var(--line);color:var(--text)}
.mmenu a.deal{color:var(--sale-ink)}
.mmenu h3{margin:20px 0 4px;font-size:14px;color:var(--muted)}
.mmenu .mrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.mlang{min-height:44px;padding:4px 18px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);font-weight:700;cursor:pointer;color:var(--head)}

/* ---------- Toast ---------- */
#toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,24px);opacity:0;visibility:hidden;width:max-content;max-width:calc(100vw - 32px);background:var(--deep);color:#fff;padding:10px 10px 10px 16px;border-radius:999px;display:flex;align-items:center;gap:12px;z-index:90;transition:transform .25s,opacity .25s,visibility 0s linear .25s;box-shadow:var(--shadow);font-weight:600;font-size:15px}
html[dir=rtl] #toast{padding:10px 16px 10px 10px}
#toast.show{transform:translate(-50%,0);opacity:1;visibility:visible;transition:transform .25s,opacity .25s}
#toast .tic{width:28px;height:28px;border-radius:50%;background:var(--ok);display:flex;align-items:center;justify-content:center;flex-shrink:0}
#toast button{border:0;background:var(--accent);color:#0D2D5C;font-weight:800;border-radius:999px;padding:6px 14px;min-height:36px;cursor:pointer;white-space:nowrap;font-size:14px}

.padd.done,.padd.done:hover,.btn.done,.btn.done:hover{background:var(--ok);color:#fff}

/* ================= Responsive ================= */
@media (max-width:1100px){
  .logo .lt{display:none}
  .banner{padding:36px;grid-template-columns:minmax(0,1fr)}
  .bart{display:none}
  .banner{min-height:0}
}
@media (max-width:980px){
  .hero-grid{grid-template-columns:minmax(0,1fr)}
  .promos{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .list-layout,.cart-grid,.co-grid,.pdp-grid{grid-template-columns:minmax(0,1fr)}
  .gallery,.sumbox,.filters{position:static}
  .gallery{max-width:560px;width:100%;margin-inline:auto}
  footer.site .fgrid{grid-template-columns:1fr 1fr}
  .bento{grid-auto-rows:170px}
  .rail{grid-auto-columns:220px}
}
@media (max-width:880px){
  .pgrid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sets{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  :root{--hdr:62px}
  .wrap{padding-inline:16px}
  .topbar,.catnav,.d-only{display:none !important}
  .m-only{display:inline-flex !important}
  header.site .bar{grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .logo img{height:40px}
  body.search-open .msearch{display:block}
  .msearch .searchform{max-width:none}
  .msearch .stxt{display:none}
  .sec{padding-block:40px 0}
  .sec-head{margin-bottom:14px}
  .sec-head h2{font-size:21px}
  .sec-head p{font-size:14px}
  .railnav{display:none}
  .hero{padding-block:16px 0}
  .hero-grid{gap:12px}
  .banner{padding:28px 22px 30px;border-radius:24px}
  .banner::before{width:320px;height:320px;inset-block-start:-140px;inset-inline-end:-140px}
  .word{font-size:96px}
  html[lang=en] .word{font-size:72px}
  .banner h1{font-size:21px}
  .banner p.lead{font-size:15px;margin-bottom:20px}
  .ctas .btn{flex:1 1 140px}
  .promos{gap:12px}
  .promo{grid-template-columns:minmax(0,1fr);padding:12px;border-radius:18px;gap:8px;align-content:start}
  .promo .pa{order:-1;aspect-ratio:4/3;padding:6px}
  .promo h3{font-size:14px;margin:6px 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .promo .price{font-size:17px}
  .promo .old{font-size:12.5px}
  .promo .lbl{font-size:12px}
  .benefits{grid-template-columns:minmax(0,1fr);gap:0;margin-top:12px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding-inline:14px}
  .benefit{border:0;border-radius:0;padding:12px 0;background:none}
  .benefit + .benefit{border-top:1px solid var(--line)}
  .bic{width:42px;height:42px}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:150px;gap:10px}
  .tile{padding:14px 16px;border-radius:16px}
  .tile .tt b{font-size:16px}
  .tile .tt span{font-size:12.5px}
  .tile.t1,.tile.t2{grid-column:span 2;grid-row:span 1}
  .tile.w2{grid-column:span 1}
  .tile.t1 .tt b,.tile.t2 .tt b{font-size:19px}
  .tile.t1 .ta{width:auto;height:84%;max-width:none;transform:none;left:auto;right:auto;inset-inline-end:14px;inset-block-end:10px}
  .tile .ta{width:52%}
  .tile.w2 .ta{width:56%;height:auto}
  .rail{grid-auto-columns:46%;gap:10px;margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px}
  .pgrid,.pgrid.four{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pimg{padding:10px}
  .pbody{padding:10px 10px 12px;gap:2px}
  .pcat{font-size:12px}
  .pname{font-size:13.5px}
  .price{font-size:16.5px}
  .old{font-size:12.5px}
  .padd{min-height:40px;font-size:13.5px;gap:6px;margin-top:8px}
  .padd .ic{width:16px;height:16px}
  .badge{font-size:11px;padding:1px 7px;inset-block-start:8px;inset-inline-start:8px}
  .sets{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:86%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:0 16px 8px;scroll-padding-inline:16px;scrollbar-width:none}
  .sets::-webkit-scrollbar{display:none}
  .set{padding:16px;gap:12px;scroll-snap-align:start}
  .set-head h3{font-size:17px}
  .set-item{grid-template-columns:48px minmax(0,1fr) auto}
  .set-item .sn{font-size:13.5px}
  .set-foot .btn{flex:1 1 100%}
  .help{margin-top:48px}
  .help .wrap{padding-block:22px}
  .help h2{font-size:18px}
  .help .btn{width:100%}
  footer.site .fgrid{grid-template-columns:1fr 1fr;gap:24px 16px;padding-block:36px 24px}
  .fbrand{grid-column:1/-1}
  .fbrand img{height:48px}
  .crumbs{font-size:13px;padding-block:14px 4px}
  .list-head{margin-bottom:12px}
  .list-head h1{font-size:22px}
  .count{font-size:13.5px}
  .ltools{width:100%;justify-content:space-between}
  .sortlab{font-size:13.5px}
  .sortlab select{min-height:42px;font-size:16px}
  .fbtn{display:inline-flex;min-height:42px;padding:6px 16px;font-size:14.5px}
  .chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 12px;padding:2px 16px}
  .chips::-webkit-scrollbar{display:none}
  .list-layout{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .list-main{display:contents}
  .list-head{order:1}
  .filters{order:2;display:none;margin-bottom:12px;padding:0 14px 12px}
  .chips{order:3}
  .list-grid{order:4}
  .filters.open{display:block}
  .filters h2,.fg-cat{display:none}
  .pinfo h1{font-size:21px;margin:2px 0 10px}
  .prices.big .price{font-size:26px}
  .prices.big .old{font-size:14px}
  .gallery{padding:20px;aspect-ratio:4/3;border-radius:20px}
  .spec-h{font-size:18px}
  .specs{font-size:14px}
  .specs th,.specs td{padding:9px 8px}
  .related{margin-top:36px}
  .related h2{font-size:19px;margin-bottom:12px}
  .page h1{font-size:22px;margin:16px 0 14px}
  .clines{padding:0 12px}
  .cline{grid-template-columns:68px minmax(0,1fr);gap:12px;padding-block:12px}
  .cline-total{grid-column:2;font-size:15px}
  .cname{font-size:14.5px}
  .sumbox{padding:16px}
  .co-main{gap:14px}
  fieldset{padding:14px 14px 16px}
  legend{font-size:16px}
  .frow,.choices{grid-template-columns:minmax(0,1fr);gap:12px}
  .done{padding-block:20px}
  .done-card{padding:24px 18px}
  .done-card h1{font-size:22px}
  #toast{font-size:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px))}
}
@media (max-width:340px){
  .padd span{display:none}
}
@media (max-width:400px){
  .sortlab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .word{font-size:84px}
  html[lang=en] .word{font-size:62px}
  .tile .tt b{font-size:15px}
}

/* ---------- Fixed product colour (information only, not a choice) ---------- */
.pmeta{display:flex;justify-content:space-between;align-items:center;gap:4px 8px;flex-wrap:wrap;min-width:0}
.pcolor{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);font-weight:600;line-height:1.4;min-width:0}
.pcolor i{width:12px;height:12px;border-radius:50%;border:1px solid var(--line-2);flex-shrink:0;display:inline-block}
.pcolor.lg{font-size:15px;color:var(--text);font-weight:700;gap:8px}
.pcolor.lg i{width:18px;height:18px}
.pcolor-row{display:flex;align-items:center;gap:10px;margin:14px 0 0;color:var(--muted);font-size:15px}
.cinfo .pcolor,.mname .pcolor{display:flex;margin-top:2px}
@media (max-width:760px){.pcolor{font-size:11.5px}.pcolor i{width:10px;height:10px}.pcolor.lg{font-size:14.5px}.pcolor.lg i{width:16px;height:16px}}

/* ---------- QA fixes ---------- */
.crow .linkbtn{min-height:40px;padding-inline:8px;margin-inline:-8px}
.buyrow .btn{white-space:nowrap}
@media (max-width:400px){
  .buyrow{gap:8px}
  .buyrow .stepper button{width:38px}
  .buyrow .btn{padding-inline:12px;font-size:15px;gap:6px}
}

/* ---------- QA round 2 ---------- */
/* Long unbroken words (names, brand, categories typed in the admin) wrap instead of widening the page */
body{overflow-wrap:anywhere}
.money,.price,.badge,.btn,.chip,.stchip,.cnt,.langbtn{overflow-wrap:normal}
/* Signal-blue surfaces that carry navy text: lightened 12% to pass WCAG AA (4.66:1) */
:root{--signal-bg:#4B99F8}
.btn-signal,.cnt,#toast button{background:var(--signal-bg)}

/* ---------- Delivery fees ---------- */
.done-totals{width:100%;text-align:start;margin:6px 0 4px}

/* ================= Catalogue v2: photos, categories, banners ================= */
:root{--photo:#F4F6F9}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--photo:#E9EDF2}}
:root[data-theme="dark"]{--photo:#E9EDF2}
.pimg,.promo .pa,.cimg,.mimg,.set-item .si,.gallery,.cc-img{background:var(--photo)}
.pic{mix-blend-mode:multiply}
.ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;height:100%;color:#8A94A6;text-align:center}
.ph .ic{width:34%;max-width:64px;height:auto;opacity:.75}
.ph small{font-size:12px;font-weight:700;line-height:1.3;color:#6B7585}
.cimg .ph small,.mimg .ph small,.si .ph small,.cc-img .ph small,.promo .ph small{display:none}
.cimg .ph .ic,.mimg .ph .ic,.si .ph .ic{width:60%}

/* hero artwork */
.hero-img{max-width:100%;max-height:360px;object-fit:contain;display:block}
@media (max-width:1100px){.banner .bart.img{display:flex;order:2;margin-top:4px}.bart.img .hero-img{max-height:230px}}

/* category rail */
.rail.cats{grid-auto-columns:156px}
.ccard{display:flex;flex-direction:column;gap:8px;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px;min-width:0;transition:border-color .15s}
.ccard:hover{border-color:var(--line-2)}
.cc-img{display:block;aspect-ratio:1/1;border-radius:12px;padding:12px}
.ccard b{font-size:14.5px;line-height:1.35;color:var(--head);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.ccard small{color:var(--muted);font-size:12.5px;margin-top:-6px}
.railnav.none{visibility:hidden}

/* promo banners */
.sec-banners{padding-top:32px}
.pbanners{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pbanners.n1{grid-template-columns:minmax(0,1fr)}
.pbanners.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pbanner{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:6px;min-height:196px;border-radius:22px;padding:20px 20px 20px 22px;text-decoration:none;color:#fff;overflow:hidden;isolation:isolate;transition:transform .15s}
html[dir=rtl] .pbanner{padding:20px 22px 20px 20px}
.pbanner:hover{transform:translateY(-2px)}
.pbanner::before{content:"";position:absolute;z-index:-1;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.09);inset-block-end:-140px;inset-inline-end:-90px}
.th-blue{background:#014CA7}.th-navy{background:#0D2D5C}.th-sale{background:#B93D0B}
.pb-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.pb-text b{font-size:19px;line-height:1.35;color:#fff}
.pb-sub{font-size:13.5px;color:rgba(255,255,255,.88);line-height:1.45}
.pb-cta{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-weight:800;font-size:14px;background:#fff;color:#0D2D5C;border-radius:999px;padding:7px 14px;align-self:flex-start;white-space:nowrap}
.pb-art{display:flex;align-items:center;justify-content:center;min-width:0}
.pb-img{max-width:100%;max-height:160px;object-fit:contain;display:block}
@media (max-width:1100px){
  .pbanners,.pbanners.n2{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(330px,46%);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
  .pbanners::-webkit-scrollbar{display:none}
  .pbanner{scroll-snap-align:start}
}

/* desktop category navigation */
.catnav{position:relative;z-index:45}
.catnav .wrap.cn-row{display:flex;align-items:center;gap:6px;overflow:visible}
.cn-links{display:flex;flex-wrap:wrap;height:48px;overflow:hidden;gap:0 2px;flex:1;min-width:0}
.cn-all{position:relative;flex-shrink:0}
.cn-allbtn{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:6px 14px;border-radius:999px;border:0;background:var(--head);color:var(--surface);font-weight:700;font-size:14.5px;cursor:pointer;white-space:nowrap}
.cn-allbtn[aria-expanded=true]{background:var(--brand);color:var(--on-brand)}
.megamenu{position:absolute;top:calc(100% + 6px);inset-inline-start:0;width:min(780px,calc(100vw - 48px));background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:12px;z-index:60}
.megamenu[hidden]{display:none}
.mm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
.catnav .mm-grid a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;border:0;color:var(--text);min-height:54px;white-space:normal}
.catnav .mm-grid a:hover{background:var(--tile);color:var(--text)}
.mm-ic{width:38px;height:38px;border-radius:10px;background:var(--tile);color:var(--link);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mm-grid b{display:block;font-size:14.5px;line-height:1.3}
.mm-grid small{display:block;color:var(--muted);font-size:12.5px;font-weight:500}
.catnav .mm-all{display:flex;justify-content:center;margin-top:8px;padding:10px;border-radius:12px;background:var(--tile);color:var(--link);border:0}

/* listing paging + brand filter */
.more-row{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:24px;color:var(--muted);font-size:14px}
.fsel{width:100%;min-height:42px;border:1.5px solid var(--line);border-radius:10px;padding:6px 10px;background:var(--surface);color:var(--text);font-size:16px}
.fgroup h3 label{cursor:default}

/* product description: short on screen, full text in the page */
.pdesc{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.pdesc.open{display:block}
.pdesc-w .linkbtn{margin-top:4px}

/* WhatsApp button */
.wa-fab{position:fixed;inset-block-end:calc(18px + env(safe-area-inset-bottom,0px));inset-inline-end:18px;z-index:70;display:inline-flex;align-items:center;gap:8px;background:#15803D;color:#fff;text-decoration:none;font-weight:800;font-size:15px;border-radius:999px;padding:12px 18px 12px 14px;box-shadow:0 10px 24px rgba(21,128,61,.35);min-height:52px}
html[dir=rtl] .wa-fab{padding:12px 14px 12px 18px}
.wa-fab:hover{background:#116A32}

@media (max-width:760px){
  .rail.cats{grid-auto-columns:30%;gap:8px}
  .ccard{padding:7px;gap:6px;border-radius:14px}
  .cc-img{padding:8px;border-radius:10px}
  .ccard b{font-size:12.5px}
  .ccard small{font-size:11.5px}
  .sec-banners{padding-top:24px}
  .pbanners,.pbanners.n2{grid-auto-columns:86%;gap:10px;margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px}
  .pbanners.n1{margin:0;padding:0}
  .pbanner{min-height:148px;padding:16px;border-radius:18px;gap:4px}
  html[dir=rtl] .pbanner{padding:16px}
  .pb-text b{font-size:16px}
  .pb-sub{font-size:12.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pb-cta{font-size:13px;padding:6px 12px;margin-top:4px}
  .pb-img{max-height:116px}
  .banner .bart.img{display:flex}
  .bart.img .hero-img{max-height:150px}
  .benefits{grid-template-columns:repeat(3,minmax(0,1fr));padding:10px 4px;gap:0}
  .benefit{flex-direction:column;text-align:center;gap:6px;padding:4px 6px}
  .benefit + .benefit{border-top:0;border-inline-start:1px solid var(--line)}
  .benefit span{display:none}
  .benefit strong{font-size:12.5px;line-height:1.35}
  .bic{width:36px;height:36px}
  .pgrid.feat > .pcard:nth-child(n+5){display:none}
  .pdesc{-webkit-line-clamp:4;font-size:14.5px}
  .more-row .btn{width:100%}
  .wa-fab{width:54px;height:54px;min-height:0;padding:0;justify-content:center;inset-inline-end:14px;inset-block-end:calc(14px + env(safe-area-inset-bottom,0px))}
  html[dir=rtl] .wa-fab{padding:0}
  .wa-fab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  #toast{bottom:calc(80px + env(safe-area-inset-bottom,0px))}
  footer.site .fbottom{padding-bottom:76px}
}
/* category card image: fixed square, photo contained */
.cc-img{position:relative;overflow:hidden;flex-shrink:0;padding:0}
.cc-img > .pic,.cc-img > .ph{position:absolute;inset:9%;width:82%;height:82%;object-fit:contain}
.pimg,.pimg:hover{text-decoration:none}
.ph{color:#7A8496}
.ph small{color:#4B5563}

/* ---------- Whish deposit ---------- */
.depbox{border-color:var(--brand)}
.dep-d{margin:0 0 12px;color:var(--text);font-size:15px}
.dep-amt{display:flex;align-items:center;gap:12px;background:var(--tile);border-radius:var(--r-sm);padding:10px 14px;margin-bottom:12px;flex-wrap:wrap}
.dep-amt span{color:var(--muted);font-size:14px}
.dep-amt strong{font-family:'Montserrat','Trebuchet MS',sans-serif;font-size:22px;color:var(--head);margin-inline-end:auto}
.dep-pay{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.btn-whish{background:#E30613;color:#fff;min-height:52px;padding-inline:24px;font-size:16.5px}
.btn-whish:hover{background:#B8050F}
.dep-qr{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px}
.dep-qr .qr{width:150px;height:150px;display:block;background:#fff;border-radius:12px;padding:6px;border:1px solid var(--line);image-rendering:pixelated}
.dep-qr figcaption{font-size:12.5px;color:var(--muted);text-align:center}
.dep-under{margin:12px 0 6px;font-size:14px;color:var(--muted)}
.dep-ref{margin:0 0 12px;font-size:14px}
.dep-check{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;align-items:flex-start;min-height:0;font-weight:700}
.dep-check input{margin-top:4px}
.dep-check:has(input:checked){border-color:var(--ok);background:rgba(21,128,61,.08)}
.dep-check.has-err{border-color:var(--err);background:var(--err-bg)}
.dep-row dt,.dep-row dd{color:var(--link) !important;font-weight:800}
.dep-note{margin:2px 0 0;font-size:13px;color:var(--muted);line-height:1.5}
.totals .muted{font-weight:500}
button:disabled.btn-primary{opacity:.55;cursor:not-allowed}
@media (max-width:760px){
  .dep-pay{flex-direction:column;align-items:stretch}
  .btn-whish{width:100%}
  .dep-qr .qr{width:120px;height:120px}
}

/* ---------- Bundle special price ---------- */
.cset-items{display:block;color:var(--muted);font-size:13px;line-height:1.45;margin-top:2px}
.cset .cname .tag,.mname .tag{font-size:11.5px;min-height:20px;padding:0 8px;vertical-align:middle}
.set-foot .prices{padding-top:0;margin-top:0}
.set-foot .save{font-size:13px}

/* ---------- Photo frames: always square; a photo can never stretch its frame ---------- */
:root{--photo:#FFFFFF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--photo:#F3F5F8}}
:root[data-theme="dark"]{--photo:#F3F5F8}
.pimg,.promo .pa,.cimg,.mimg,.set-item .si{position:relative;overflow:hidden}
@media (max-width:980px){.gallery{position:relative}}
.gallery{overflow:hidden}
.pimg > .pic,.pimg > .ph,.gallery > .pic,.gallery > .ph,.promo .pa > .pic,.promo .pa > .ph,.cimg > .pic,.cimg > .ph,.mimg > .pic,.mimg > .ph,.set-item .si > .pic,.set-item .si > .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:inherit}
.pmeta{flex-wrap:nowrap}
.pmeta .pcat{flex-shrink:0}
.pmeta .pcolor{min-width:0}
.pcolor .pct{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* ---------- Server pages: content for search engines stays in the page but off screen; a loader shows until the store starts ---------- */
.ssr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.boot{min-height:70vh;display:flex;align-items:center;justify-content:center}
.boot-spin{width:42px;height:42px;border-radius:50%;border:4px solid var(--line);border-top-color:var(--brand);animation:bootspin .8s linear infinite}
@keyframes bootspin{to{transform:rotate(360deg)}}

/* ---------- Product page on phones/tablets: no offset, proper space under the photo ---------- */
@media (max-width:980px){
  .pdp .gallery,.gallery{top:auto}
  .pdp{row-gap:22px}
  .pinfo{padding-top:4px}
}

/* ---------- Compact hero on phones: logo word + art side by side, then text ---------- */
@media (max-width:640px){
  .banner{padding:22px 20px 24px;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"word art" "h1 h1" "lead lead" "ctas ctas";column-gap:12px;row-gap:0;align-items:center;min-height:0}
  .banner .bcopy{display:contents}
  .banner .word{grid-area:word;margin:0;font-size:58px;line-height:1}
  .banner h1{grid-area:h1;font-size:19px;line-height:1.5;margin:12px 0 6px}
  html[lang=en] .banner h1{margin-top:12px}
  .banner p.lead{grid-area:lead;font-size:14px;line-height:1.6;margin:0 0 16px}
  .banner .ctas{grid-area:ctas;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .banner .ctas .btn{min-height:46px;padding-inline:12px;font-size:15px;width:100%}
  .banner .bart.img{grid-area:art;display:flex;margin:0;justify-self:end;align-self:center}
  .bart.img .hero-img{max-height:92px;max-width:150px}
}

/* ---------- Footer on phones: compact ---------- */
@media (max-width:640px){
  footer.site .fgrid{grid-template-columns:1fr 1fr;gap:18px 16px;padding-block:24px 14px;font-size:14px}
  footer.site .fbrand{grid-column:1/-1;display:flex;align-items:center;gap:14px}
  footer.site .fbrand img{height:40px;width:auto;margin:0}
  footer.site .fbrand p{margin:0;font-size:13.5px;line-height:1.5}
  footer.site h4{font-size:14.5px;margin-bottom:4px}
  footer.site li a{min-height:30px;font-size:14px}
  footer.site .fshop li:nth-child(n+5):not(:last-child){display:none}
  footer.site .fcontact{grid-column:1/-1}
  footer.site .fcontact ul{flex-direction:row;flex-wrap:wrap;gap:4px 18px}
  footer.site .fbottom{font-size:12.5px}
  footer.site .fbottom .wrap{padding-block:10px}
}

/* ---------- Phone menu: quick links, category tiles with icons, contact buttons ---------- */
.mnav{padding:14px 16px 24px}
.mnav h3{font-size:14px;color:var(--muted);margin:20px 4px 10px;font-weight:700;letter-spacing:.01em}
.mquick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mquick a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:76px;border-radius:16px;background:var(--tile);color:var(--head);text-decoration:none;font-weight:700;font-size:13.5px;text-align:center;padding:8px 6px;line-height:1.3}
.mquick a .ic{color:var(--brand)}
.mquick a.deal{background:#FFF1E6;color:#9A3412}
.mquick a.deal .ic{color:#C2410C}
.mquick a:active{transform:scale(.97)}
.mcats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mcats a{display:flex;align-items:center;gap:10px;min-height:64px;padding:8px 10px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--text);text-decoration:none}
.mcats a:hover,.mcats a:active{border-color:var(--brand);background:var(--tile)}
.mcats .mm-ic{width:40px;height:40px;flex-shrink:0;border-radius:12px;background:var(--tile);color:var(--brand);display:flex;align-items:center;justify-content:center}
.mcats .mc-t{display:flex;flex-direction:column;min-width:0}
.mcats .mc-t b{font-size:13.5px;line-height:1.3;color:var(--head);overflow-wrap:anywhere}
.mcats .mc-t small{font-size:12px;color:var(--muted)}
.mcontact{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mc-btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;border-radius:999px;border:1.5px solid var(--line);color:var(--head);text-decoration:none;font-weight:700;font-size:14.5px;padding-inline:10px}
.mc-btn.wa{background:#15803D;border-color:#15803D;color:#fff}
.mnav .mrow{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
.mnav .mlang{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);background:none;color:var(--text);font:inherit;font-weight:700;font-size:14px;text-decoration:none;cursor:pointer}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mquick a.deal{background:#3B1D0B;color:#FDBA74}}
:root[data-theme="dark"] .mquick a.deal{background:#3B1D0B;color:#FDBA74}

/* ---------- Opening animation ---------- */
#splash{position:fixed;inset:0;z-index:300;background:var(--bg);display:flex;align-items:center;justify-content:center;animation:spOut .5s cubic-bezier(.6,0,.4,1) 1.05s forwards;pointer-events:none}
.sp-in{display:flex;flex-direction:column;align-items:center;gap:18px}
.sp-logo img{height:84px;width:auto;display:block}
.sp-logo{animation:spPop .7s cubic-bezier(.34,1.56,.64,1) both}
.sp-word{font-size:40px;color:var(--head);animation:spPop .7s cubic-bezier(.34,1.56,.64,1) both}
.sp-dots{display:flex;gap:8px;height:22px;align-items:flex-end}
.sp-dots i{width:10px;height:10px;border-radius:50%;background:#2F80ED;animation:spHop .55s ease-in-out infinite alternate}
.sp-dots i:nth-child(2){animation-delay:.12s;background:#014CA7}
.sp-dots i:nth-child(3){animation-delay:.24s}
@keyframes spPop{0%{opacity:0;transform:scale(.35) rotate(-10deg)}60%{opacity:1}100%{opacity:1;transform:none}}
@keyframes spHop{0%{transform:translateY(0) scale(1.1,.85)}100%{transform:translateY(-12px) scale(.95,1.05)}}
@keyframes spOut{to{opacity:0;transform:translateY(-16px) scale(1.02);visibility:hidden}}
body.intro{--d0:.05s}
body.intro.intro-late{--d0:1.05s}
@keyframes inUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes inArt{0%{opacity:0;transform:translateY(24px) rotate(-4deg) scale(.92)}70%{opacity:1}100%{opacity:1;transform:none}}
body.intro .banner .word{animation:inUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d0)}
body.intro .banner h1{animation:inUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d0) + .08s)}
body.intro .banner p.lead{animation:inUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d0) + .16s)}
body.intro .banner .ctas{animation:inUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d0) + .24s)}
body.intro .banner .bart{animation:inArt .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d0) + .14s)}
body.intro .promos > *{animation:inUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d0) + .3s)}
body.intro .promos > *:nth-child(2){animation-delay:calc(var(--d0) + .38s)}
body.intro .benefits > *{animation:inUp .5s ease both;animation-delay:calc(var(--d0) + .42s)}
body.intro .pgrid > .pcard:nth-child(-n+8),body.intro .rail > .pcard:nth-child(-n+6),body.intro .rail.cats > *:nth-child(-n+8){animation:inUp .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d0) + .2s)}
body.intro .pgrid > .pcard:nth-child(2),body.intro .rail > *:nth-child(2){animation-delay:calc(var(--d0) + .26s)}
body.intro .pgrid > .pcard:nth-child(3),body.intro .rail > *:nth-child(3){animation-delay:calc(var(--d0) + .32s)}
body.intro .pgrid > .pcard:nth-child(4),body.intro .rail > *:nth-child(4){animation-delay:calc(var(--d0) + .38s)}
body.intro .pgrid > .pcard:nth-child(n+5){animation-delay:calc(var(--d0) + .44s)}
@media (prefers-reduced-motion:reduce){#splash{display:none}body.intro *{animation:none!important}}

/* ---------- Server loading screen: logo instead of a plain spinner ---------- */
.boot{flex-direction:column;gap:18px}
.boot .logo img{height:72px;width:auto;display:block}
.boot .logo{animation:spPop .7s cubic-bezier(.34,1.56,.64,1) both}

/* ---------- Store additions ---------- */
.pic{width:100%;height:100%;object-fit:contain;display:block}
.pcard.out .pimg > .illus,.pcard.out .pimg > .pic{opacity:.55}
.oos{position:absolute;inset-block-end:10px;inset-inline-start:10px;background:var(--surface);color:var(--muted);font-weight:700;font-size:12.5px;padding:2px 10px;border-radius:999px;border:1px solid var(--line)}
.padd.ghost{background:transparent;border:1.5px solid var(--line);color:var(--muted);text-decoration:none}
.padd.ghost:hover{background:var(--tile);color:var(--head)}
.stock.no{color:var(--muted)}
.stock.no .sdot{background:var(--muted)}
.pdesc{margin:0;color:var(--text);white-space:pre-line;max-width:38em}
.hero-grid.solo{grid-template-columns:minmax(0,1fr)}
.banner.noart{grid-template-columns:minmax(0,1fr)}
.bart.img{display:flex;align-items:center;justify-content:center;align-self:center}
.bart.img img{max-width:100%;max-height:340px;object-fit:contain;display:block}
.promos.n1{grid-template-rows:1fr}
.cgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:190px;gap:16px}
.cgrid .tile{grid-column:span var(--span,3)}
.cgrid .tile.t1.flat{background:var(--deep-2)}
.cgrid .tile.t1.flat .ta{width:46%;max-width:150px;left:auto;right:auto;transform:none;inset-inline-end:14px;inset-block-end:10px}
.pgrid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.sets.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.sets.oddlast > .set:last-child{grid-column:1/-1}
.fspace{height:64px}
.fb-acts{display:flex;gap:8px;flex-wrap:wrap}
.fb-acts a.langbtn{text-decoration:none}
#toast.err .tic{background:#B91C1C}
.pvbar{background:#FEF3C7;color:#713F12;font-size:14px;font-weight:600}
.pvbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;flex-wrap:wrap;padding-block:6px}
.pvbar span{display:inline-flex;align-items:center;gap:8px}
.pvbar a,.pvbar button{color:#713F12;font-weight:800;background:none;border:1.5px solid rgba(113,63,18,.35);border-radius:999px;padding:4px 14px;min-height:34px;cursor:pointer;text-decoration:none;font-size:13.5px;display:inline-flex;align-items:center}
.pvbar button{background:#713F12;color:#FEF3C7;border-color:#713F12}
.pvacts{gap:8px}
@media (max-width:980px){.sets.three{grid-template-columns:repeat(2,minmax(0,1fr))}.sets.three > .set:last-child:nth-child(odd){grid-column:1/-1}.pgrid.three{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:880px){.sets.three{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .cgrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:150px;gap:10px}
  .cgrid .tile{grid-column:span 1}
  .cgrid.odd .tile:first-child{grid-column:span 2}
  .pgrid.three{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sets.three,.sets.oddlast{grid-template-columns:none}
  .sets.oddlast > .set:last-child,.sets.three > .set:last-child:nth-child(odd){grid-column:auto}
  .bart.img{display:none}
  .fspace{height:40px}
}

/* ---------- Admin ---------- */
body.is-admin{background:var(--bg)}
body.is-admin::before{background:var(--surface)}
.ad{--side:236px;min-height:100vh;display:grid;grid-template-columns:var(--side) minmax(0,1fr);grid-template-rows:auto 1fr}
.ad-top{grid-column:1/-1;position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 20px;min-height:64px}
.ad-logo{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.ad-logo .logo img{height:36px;width:auto}
.ad-logo .logo{display:flex}
.ad-logo b{display:block;color:var(--head);font-size:16px;line-height:1.2}
.ad-logo small{display:block;color:var(--muted);font-size:12.5px;line-height:1.2}
.ad-tacts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.stchip{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;padding:4px 12px;border-radius:999px;min-height:32px;white-space:nowrap}
.stchip i{width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}
.stchip.ok{background:rgba(21,128,61,.12);color:var(--ok)}
.stchip.warn{background:#FEF3C7;color:#92400E}
.stchip.busy{background:var(--tile);color:var(--link)}
.stchip.busy i{animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.25}}
.ad-nav{border-inline-end:1px solid var(--line);background:var(--surface);min-width:0}
.ad-nav-in{position:sticky;top:calc(env(safe-area-inset-top,0px) + 64px);display:flex;flex-direction:column;gap:2px;padding:16px 12px;max-height:calc(100vh - 64px - env(safe-area-inset-top,0px));overflow-y:auto}
.ad-nav a{display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 12px;border-radius:12px;text-decoration:none;font-weight:700;font-size:15px;color:var(--text)}
.ad-nav a:hover{background:var(--tile)}
.ad-nav a.on{background:var(--head);color:var(--surface)}
.ad-nav .show-s{display:none}
.ad-main{padding:24px 28px 80px;min-width:0;max-width:1120px;width:100%}
.ad-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.ad-head h1{margin:0;font-size:26px;line-height:1.3;flex:1;min-width:0}
.aback{display:inline-flex;align-items:center;gap:6px;color:var(--link);font-weight:700;text-decoration:none;min-height:40px;width:100%}
.abtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:12px;border:1.5px solid var(--brand);background:var(--brand);color:var(--on-brand);font-weight:700;font-size:15px;cursor:pointer;text-decoration:none;white-space:nowrap;position:relative}
.abtn:hover{background:var(--brand-h);border-color:var(--brand-h)}
.abtn.primary{background:var(--brand)}
.abtn.ghost{background:var(--surface);color:var(--head);border-color:var(--line)}
.abtn.ghost:hover{border-color:var(--link);color:var(--link)}
.abtn.danger{background:#B91C1C;border-color:#B91C1C;color:#fff}
.abtn.danger-ghost{background:var(--surface);color:var(--err);border-color:var(--line)}
.abtn.danger-ghost:hover{border-color:var(--err)}
.abtn.sm{min-height:38px;padding:6px 12px;font-size:14px}
.abtn.wide{width:100%}
.abtn:disabled{opacity:.55;cursor:default}
.aib{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--head);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;text-decoration:none}
.aib:hover:not(:disabled){border-color:var(--link);color:var(--link)}
.aib:disabled{opacity:.35;cursor:default}
.acard{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px 22px;margin-bottom:16px;min-width:0}
.acard.flush{padding:16px}
.acard.bad{border-color:var(--err)}
.acard-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.acard-h h2{margin:0;font-size:18px;line-height:1.35;min-width:0;overflow-wrap:anywhere}
.acard-h > div{display:flex;gap:6px;flex-shrink:0}
.acard hr{border:0;border-top:1px solid var(--line);margin:16px 0}
.h.sm{font-size:16px;margin:0 0 6px}
.muted{color:var(--muted);margin:0 0 10px;font-size:14.5px}
.hint{display:block;color:var(--muted);font-size:13px;margin-top:-4px}
.af{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;min-width:0}
.af label{font-weight:700;font-size:13.5px;color:var(--text)}
.af input,.af select,.af textarea,.atools select{width:100%;min-height:44px;border:1.5px solid var(--line);border-radius:10px;padding:8px 12px;background:var(--field);font-size:16px;color:var(--text)}
.af textarea{resize:vertical;line-height:1.6}
.af input:focus,.af select:focus,.af textarea:focus,.atools select:focus{outline:none;border-color:var(--accent);background:var(--surface)}
.af small,.afbi > small{color:var(--muted);font-size:13px;line-height:1.45}
.afbi{margin-bottom:6px;min-width:0}
.afl{display:block;font-weight:800;font-size:14.5px;color:var(--head);margin-bottom:8px}
.afbi > small{display:block;margin:-6px 0 12px}
.bi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.frow3{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:12px}
.w1{max-width:160px}
.tgl{display:flex;gap:14px;align-items:flex-start;padding-block:10px;cursor:pointer}
.tgl + .tgl{border-top:1px solid var(--line)}
.tgl input{position:absolute;opacity:0;width:1px;height:1px}
.tgl .sw{width:46px;height:28px;border-radius:999px;background:var(--line-2);position:relative;flex-shrink:0;transition:background .15s;margin-top:2px}
.tgl .sw::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.tgl input:checked + .sw{background:var(--ok)}
.tgl input:checked + .sw::after{transform:translateX(18px)}
html[dir=rtl] .tgl input:checked + .sw::after{transform:translateX(-18px)}
.tgl input:focus-visible + .sw{outline:3px solid var(--accent);outline-offset:2px}
.tgl b{display:block;font-size:15px}
.tgl small{display:block;color:var(--muted);font-size:13px;line-height:1.45}
.stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.stat{background:var(--tile);border-radius:14px;padding:14px}
.stat b{display:block;font-size:24px;color:var(--head);font-family:'Montserrat','Trebuchet MS',sans-serif;line-height:1.2;white-space:nowrap}
.stat span{color:var(--muted);font-size:13px}
.qlinks{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.agrid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.agrid2 .acard{margin-bottom:0}
.steps{margin:0;padding-inline-start:20px;display:flex;flex-direction:column;gap:6px;color:var(--text);font-size:14.5px}
.errlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.errlist a{display:flex;align-items:center;gap:8px;color:var(--err);font-weight:600;text-decoration:none;min-height:36px;font-size:14.5px}
.errlist a:hover{text-decoration:underline}
.anote{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;border-radius:14px;margin-bottom:16px;font-size:14.5px}
.anote.warn{background:#FEF3C7;color:#713F12}
.anote .ic{margin-top:2px}
.atools{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.atools select{width:auto;min-width:180px}
.asearch{flex:1;min-width:200px;display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;background:var(--field);margin-bottom:12px}
.atools .asearch{margin-bottom:0}
.asearch:focus-within{border-color:var(--accent);background:var(--surface)}
.asearch .ic{color:var(--muted)}
.asearch input{flex:1;min-width:0;border:0;background:transparent;min-height:44px;font-size:16px;outline:none}
.plist{display:flex;flex-direction:column}
.prow{display:grid;grid-template-columns:56px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:10px 4px;border-top:1px solid var(--line)}
.prow[hidden]{display:none}
.prow .th,.idrow .th{display:block;width:56px;height:56px;background:var(--tile);border-radius:10px;padding:4px}
.prow .pi{display:flex;flex-direction:column;min-width:0;line-height:1.4}
.prow .pi a{text-decoration:none;color:var(--text)}
.prow .pi a:hover b{color:var(--link)}
.prow .pi > span{color:var(--muted);font-size:13px}
.prow .pp{display:flex;flex-direction:column;align-items:flex-end;font-weight:800;color:var(--head);font-family:'Montserrat','Trebuchet MS',sans-serif}
html[dir=rtl] .prow .pp{align-items:flex-start}
.prow .pp s{color:var(--muted);font-weight:500;font-size:13px}
.acts{display:flex;gap:6px;align-items:center;flex-shrink:0}
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
.pill{font-style:normal;font-size:12px;font-weight:700;padding:1px 8px;border-radius:999px;background:var(--tile);color:var(--head);white-space:nowrap}
.pill.sale{background:var(--sale-bg);color:var(--sale-ink)}
.pill.amber{background:#FEF3C7;color:#92400E}
.pill.gray{background:var(--line);color:var(--muted)}
.peditor{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.pe-side .sticky{position:sticky;top:calc(env(safe-area-inset-top,0px) + 80px)}
.pvcard{max-width:260px;margin:0 auto 12px}
.pvcard .pcard{pointer-events:none}
.pe-danger{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-bottom:16px}
.imgpick{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;align-items:start}
.imgpick.solo{grid-template-columns:110px minmax(0,1fr);margin-bottom:12px}
.ip-prev{aspect-ratio:1/1;background:var(--tile);border-radius:14px;padding:10px;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.ip-prev.logo{background:repeating-conic-gradient(var(--tile) 0 25%,var(--surface) 0 50%) 0 0/16px 16px}
.ip-ctl{display:flex;flex-direction:column;gap:8px;min-width:0}
.ip-ctl > small{color:var(--muted);font-size:13px}
.ip-row{display:flex;gap:8px;flex-wrap:wrap}
.ip-ill summary{cursor:pointer;font-weight:700;color:var(--link);min-height:36px;display:flex;align-items:center;font-size:14px}
.ill-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:6px;margin:6px 0 10px}
.ill{aspect-ratio:1/1;border:1.5px solid var(--line);border-radius:10px;background:var(--tile);padding:4px;cursor:pointer}
.ill.on{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand)}
.seg{display:inline-flex;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;flex-wrap:wrap}
.seg button{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--surface);min-height:38px;padding:4px 12px;cursor:pointer;font-weight:600;font-size:14px}
.seg button + button{border-inline-start:1.5px solid var(--line)}
.seg button[aria-pressed=true]{background:var(--head);color:var(--surface)}
.seg i{width:14px;height:14px;border-radius:50%;border:1px solid var(--line-2)}
.sw-silver{background:#D3DAE3}.sw-white{background:#F4F6F9}.sw-black{background:#2B3341}
.specs-ed{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.specrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;padding-bottom:10px;border-bottom:1px solid var(--line)}
.specrow .af{margin-bottom:0}
.specrow .acts{padding-bottom:3px}
.bi4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.catgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:20px}
.idlist{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.idrow{display:grid;grid-template-columns:56px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:6px;border:1px solid var(--line);border-radius:12px}
.idrow .nm{font-weight:600;font-size:14.5px;line-height:1.4;min-width:0}
.idrow .money{font-weight:700;color:var(--head);font-size:14.5px}
.addsel{min-height:44px;border:1.5px dashed var(--line-2);border-radius:10px;padding:8px 12px;background:var(--surface);font-size:16px;color:var(--link);font-weight:700;cursor:pointer;width:100%}
.settotal{margin:4px 0 0;color:var(--muted)}
.settotal b{color:var(--head)}
.lrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
.lrow .af{margin-bottom:10px}
.lrow .acts{padding-bottom:13px}
.benrow{padding-block:6px 4px}
.benrow + .benrow{border-top:1px solid var(--line);padding-top:16px}
.benrow > .af{max-width:240px}
.tlist{display:flex;flex-direction:column}
.trow{display:grid;grid-template-columns:170px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.trow[hidden]{display:none}
.trow .afbi{margin:0}
.trow .afl{display:none}
.trow .af{margin-bottom:0}
.trow .af label{font-size:12px;color:var(--muted)}
.tk code{font-size:12.5px;color:var(--head);background:var(--tile);padding:2px 6px;border-radius:6px;overflow-wrap:anywhere}
.tk small{display:block;color:var(--muted);font-size:12px;margin-top:4px;line-height:1.4}
.ad-gate{min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:24px}
.ad-gate h1{margin:0;font-size:24px}
.ad-gate p{margin:0;color:var(--muted);max-width:30em}
.gate-ic{width:68px;height:68px;border-radius:50%;background:var(--tile);color:var(--link);display:flex;align-items:center;justify-content:center}
.spin{width:36px;height:36px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--brand);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.amodal{position:fixed;inset:0;z-index:95;display:flex;align-items:center;justify-content:center;padding:20px}
.am-scrim{position:absolute;inset:0;background:var(--scrim)}
.am-box{position:relative;background:var(--surface);border-radius:20px;padding:24px;max-width:440px;width:100%;box-shadow:var(--shadow)}
.am-box h2{margin:0 0 8px;font-size:20px}
.am-box p{margin:0 0 20px;color:var(--muted)}
.am-acts{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.show-s{display:none}
@media (max-width:1100px){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .peditor{grid-template-columns:minmax(0,1fr)}
  .pe-side{order:-1}
  .pe-side .sticky{position:static}
  .pvcard{max-width:220px}
}
@media (max-width:900px){
  .ad{grid-template-columns:minmax(0,1fr)}
  .ad-nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 64px);z-index:39;border-inline-end:0;border-bottom:1px solid var(--line)}
  .ad-nav-in{position:static;flex-direction:row;max-height:none;overflow-x:auto;padding:8px 12px;scrollbar-width:none;gap:4px}
  .ad-nav-in::-webkit-scrollbar{display:none}
  .ad-nav a{flex-shrink:0;min-height:40px;padding:6px 12px;font-size:14px;gap:8px}
  .ad-main{padding:18px 16px 64px}
  .agrid2,.catgrid{grid-template-columns:minmax(0,1fr)}
  .bi4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .ad-top{padding:8px 12px;min-height:60px}
  .ad-nav{top:calc(env(safe-area-inset-top,0px) + 60px)}
  .ad-logo small{display:none}
  .ad-logo b{font-size:15px}
  .hide-s{display:none !important}
  .ad-nav .show-s{display:flex}
  .ad-tacts{gap:6px}
  .ad-tacts .stchip{width:32px;padding:0;justify-content:center}
  .ad-tacts .stchip .stt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ad-tacts .stchip i{width:10px;height:10px}
  .ad-tacts .abtn{padding:8px 12px;min-height:42px}
  .ad-head h1{font-size:21px}
  .acard{padding:16px;border-radius:16px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bi,.frow3{grid-template-columns:minmax(0,1fr);gap:0}
  .imgpick{grid-template-columns:96px minmax(0,1fr);gap:12px}
  .imgpick.solo{grid-template-columns:80px minmax(0,1fr)}
  .prow{grid-template-columns:48px minmax(0,1fr) auto;gap:10px}
  .prow .th{width:48px;height:48px}
  .prow .acts{grid-column:2/-1;justify-content:flex-start}
  .idrow{grid-template-columns:44px minmax(0,1fr) auto}
  .idrow .th{width:44px;height:44px}
  .idrow .acts{grid-column:2/-1}
  .specrow{grid-template-columns:minmax(0,1fr)}
  .specrow .acts{justify-content:flex-end}
  .bi4{grid-template-columns:minmax(0,1fr);gap:0}
  .bi4 .af{margin-bottom:10px}
  .trow{grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .trow .tk{grid-column:1/-1}
  .trow .bi{grid-template-columns:minmax(0,1fr);gap:8px}
  .atools select{flex:1}
  .w1{max-width:none}
  .benrow > .af{max-width:none}
}

/* ---------- Product colour editor ---------- */
.cpresets{display:flex;flex-wrap:wrap;gap:6px}
.cpresets button{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:4px 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);cursor:pointer;font-weight:600;font-size:14px;color:var(--text)}
.cpresets button:hover{border-color:var(--link)}
.cpresets button[aria-pressed=true]{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand)}
.cpresets i{width:16px;height:16px;border-radius:50%;border:1px solid var(--line-2)}
.crow2{display:grid;grid-template-columns:minmax(0,1fr) 140px;gap:12px;align-items:start;margin-top:12px}
.hexf input[type=color]{padding:4px;height:44px;cursor:pointer}
.pi-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
@media (max-width:640px){.crow2{grid-template-columns:minmax(0,1fr)}.hexf{max-width:140px}}

/* ---------- QA fixes ---------- */
.ad-top{flex-wrap:nowrap}
.ad-tacts{flex-wrap:nowrap}
@media (max-width:420px){
  .ad-logo > span:last-child{display:none}
  .ad-top{gap:8px}
  .ad-tacts .abtn.primary{padding-inline:10px;font-size:14px}
}
@media (max-width:340px){
  .ad-tacts .abtn.primary span{display:none}
  .ad-tacts .abtn.primary{width:44px;padding:0}
}

/* ---------- Delivery areas with fees ---------- */
.govrow .gfields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 130px;gap:12px}
.hint.gh{margin:-4px 0 12px}
.govrow + .govrow{border-top:1px solid var(--line);padding-top:12px}
@media (max-width:640px){
  .govrow{grid-template-columns:minmax(0,1fr);gap:0}
  .govrow .gfields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 10px}
  .govrow .gfields .af:last-child{grid-column:1/-1}
  .govrow .acts{justify-content:flex-end;padding-bottom:12px}
}

.ip-prev.icon .pic{border-radius:22%}
.ip-prev.logo.onDark{background:#0D2D5C}

/* ---------- Banner editor ---------- */
.bnrow{padding-block:14px}
.bnrow + .bnrow{border-top:1px solid var(--line)}
.bn-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.bn-head b{color:var(--head);font-size:15.5px;min-width:0;overflow-wrap:anywhere}
.ip-prev .ph small{display:none}
.prow .th .ph small,.idrow .th .ph small{display:none}
.prow .th,.idrow .th,.ip-prev{background:var(--photo)}
@media (max-width:900px){.ad{grid-template-rows:auto auto 1fr}}
.mig{font-weight:700;color:var(--link);margin:0}
.agrid2 > .acard:nth-child(3){grid-column:1/-1}

/* ---------- Server mode: sign-in, orders, team ---------- */
.login-card{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:4px;text-align:start}
.login-card .logo{display:flex;justify-content:center;margin-bottom:6px}
.login-card .logo img{height:48px;width:auto}
.login-card .logo .lg-w{display:none}
.login-card h1{font-size:20px;margin:0 0 10px;text-align:center}
.login-card .err{margin:0 0 8px}
.login-card .aback{justify-content:center}
.ad-gate.sm{min-height:120px}
.ochips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-bottom:12px;padding-bottom:2px}
.ochips::-webkit-scrollbar{display:none}
.olist{display:flex;flex-direction:column;gap:12px}
.ocard{border:1px solid var(--line);border-radius:16px;padding:14px 16px;border-inline-start:5px solid var(--line-2);background:var(--surface)}
.ocard.st-new{border-inline-start-color:#D97706}.ocard.st-verified{border-inline-start-color:var(--accent)}.ocard.st-confirmed{border-inline-start-color:var(--brand)}
.ocard.st-delivered{border-inline-start-color:var(--ok)}.ocard.st-cancelled{border-inline-start-color:var(--muted);opacity:.8}
.oc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.oc-head b{display:block;font-size:16px;color:var(--head)}
.oc-head small{color:var(--muted);font-size:12.5px}
.ostat{min-height:40px;border:1.5px solid var(--line);border-radius:10px;padding:4px 8px;background:var(--surface);color:var(--text);font-size:16px;font-weight:700;max-width:52%}
.oc-cust{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:15px}
.oc-addr,.oc-notes{margin:6px 0 0;color:var(--muted);font-size:14px}
.oc-notes{font-style:italic}
.oc-items{margin-top:8px}
.oc-items summary{cursor:pointer;font-weight:700;color:var(--link);min-height:36px;display:flex;align-items:center}
.oc-items ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14px}
.oc-items li{display:flex;justify-content:space-between;gap:10px}
.oc-tot{margin:8px 0 0;font-size:14.5px;gap:6px}
.oc-tot .grand{font-size:16px;padding-top:8px}
.oc-dep{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0 0;font-size:13.5px;color:var(--ok);font-weight:600}
.oc-note{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.oc-note label{font-size:13px;font-weight:700}
.oc-note textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--field);font-size:16px;color:var(--text);resize:vertical}
.oc-note .abtn{align-self:flex-start}
.oc-acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.abtn.wa{background:#15803D;border-color:#15803D;color:#fff}
.abtn.wa:hover{background:#116A32;border-color:#116A32}
.oempty{padding:20px 4px}
.tlist2{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:6px}
.tlist2 li{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:12px;padding:6px 10px;min-height:48px}
@media (max-width:640px){.oc-acts .abtn{flex:1}}

.ad-nav .nav-btn{display:none;align-items:center;gap:8px;min-height:40px;padding:6px 12px;border-radius:12px;border:0;background:none;font:inherit;font-weight:700;font-size:14px;color:var(--text);cursor:pointer;flex-shrink:0}
.ad-nav .nav-btn:hover{background:var(--tile)}
@media (max-width:640px){.ad-nav .nav-btn.show-s{display:flex}}
.setprice{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
.setprice .af{max-width:260px;margin-bottom:6px}
.ip-prev,.prow .th,.idrow .th{position:relative;overflow:hidden}
.ip-prev > .pic,.ip-prev > .ph,.prow .th > .pic,.prow .th > .ph,.idrow .th > .pic,.idrow .th > .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:inherit}

/* ---------- Orders: collapsed summary line, details on click ---------- */
.ocard{padding:0}
.ocard .oc-head{display:flex;align-items:center;gap:10px;margin:0;padding:10px 12px 10px 10px}
html[dir=rtl] .ocard .oc-head{padding:10px 10px 10px 12px}
.oc-sum{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) auto auto;align-items:center;gap:6px 14px;background:none;border:0;padding:6px;border-radius:12px;cursor:pointer;text-align:start;font:inherit;color:var(--text)}
.oc-sum:hover{background:var(--tile)}
.oc-l1,.oc-l2,.oc-l3{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.oc-l1{flex-direction:column;align-items:flex-start;gap:0}
.oc-l1 b{font-size:15.5px;color:var(--head)}
.oc-l1 small{color:var(--muted);font-size:12.5px}
.oc-l2 b{font-size:15px}
.oc-l2 bdi{color:var(--muted);font-size:14px}
.oc-l3 b{font-family:'Montserrat','Trebuchet MS',sans-serif;color:var(--head);font-size:16px}
.pill.blue{background:var(--tile);color:var(--link)}
.oc-chev{display:flex;color:var(--muted);transition:transform .2s}
.ocard.open .oc-chev{transform:rotate(180deg)}
.ocard .ostat{max-width:none;width:160px;flex-shrink:0}
.oc-body{padding:0 18px 16px;border-top:1px solid var(--line)}
.oc-body .oc-addr{display:flex;align-items:center;gap:6px;margin-top:12px}
.oc-body h3{margin:14px 0 6px}
.oc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14.5px}
.oc-list li{display:flex;justify-content:space-between;gap:12px}
.oc-list a{color:var(--link);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.oc-list a:hover{text-decoration-thickness:2px}
@media (max-width:760px){
  .ocard .oc-head{flex-wrap:wrap;align-items:stretch}
  .oc-sum{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px}
  .oc-l2{grid-column:1/-1;grid-row:2}
  .oc-l3{grid-column:1;grid-row:3}
  .oc-chev{grid-column:2;grid-row:1}
  .ocard .ostat{width:100%}
  .oc-body{padding:0 12px 14px}
}