body.ml{--bg:#FFFCF7;--surface:#FFFFFF;--peach:#FFF1E6;--mint:#EAF7F0;--butter:#FFF8E1;--coral:#E4572E;--coral-d:#D2491F;--coral-soft:#FDE6DC;--ink:#4A3F3A;--muted:#8E8079;--line:#F2E7DC;--sun:#F4B23E;--leaf:#3FA96B;--red:var(--coral);
 background:var(--bg);color:var(--ink);font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;line-height:1.7;margin:0;padding-bottom:110px}
html,body.ml{overflow-x:clip!important}
body.ml h1,body.ml h2,body.ml h3{font-family:'El Messiri','IBM Plex Sans Arabic',serif;font-weight:600;margin:0;color:var(--ink)}
body.ml a{color:inherit;text-decoration:none}
body.ml svg{width:20px;height:20px;flex:none}
.mw{width:min(980px,100% - 28px);margin-inline:auto}
.mtop{position:sticky;top:0;z-index:40;background:rgba(255,241,230,.93);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mtop .mw{display:flex;align-items:center;justify-content:space-between;height:60px}
.mlogo img{height:38px;width:auto}
.cartbtn{position:relative;width:44px;height:44px;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--coral);box-shadow:0 6px 16px -10px rgba(228,87,46,.6)}
.cartbtn span{position:absolute;top:-4px;left:-4px;min-width:20px;height:20px;border-radius:10px;background:var(--coral);color:#fff;font-size:.72rem;font-weight:600;display:none;place-items:center;padding:0 5px;border:2px solid #fff}
.cartbtn.has span{display:grid}
.hero{position:relative;background:var(--peach);padding:8px 0 34px}
.hero h1{font-size:2.2rem;line-height:1.3}
.wave-hand{display:inline-block;font-size:1.7rem;animation:wob 2.6s ease-in-out infinite;transform-origin:50% 80%}
@keyframes wob{0%,70%,100%{transform:rotate(0)}78%{transform:rotate(-12deg)}86%{transform:rotate(10deg)}}
.hero p{color:var(--muted);margin:0 0 14px}
.wave{position:absolute;bottom:-1px;left:0;width:100%;height:22px;fill:var(--bg)}
.search{display:flex;align-items:center;gap:10px;background:#fff;border:2px solid transparent;border-radius:999px;padding:0 18px;color:var(--coral);box-shadow:0 10px 24px -18px rgba(228,87,46,.55);transition:border-color .2s}
.search:focus-within{border-color:#F7C1AE}
.search svg{width:18px;height:18px}
.search input{flex:1;border:0;background:none;font:inherit;font-size:16px;padding:12px 0;color:var(--ink);outline:0}
.tabs{position:sticky;top:60px;z-index:35;background:rgba(255,252,247,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.tabs-in{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:10px 2px;scroll-padding-inline:14px}
.tabs-in::-webkit-scrollbar{display:none}
.tab{flex:none;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;font-weight:500;font-size:.92rem;color:var(--ink);background:#fff;border:1.5px solid var(--line);transition:background .25s,color .25s,border-color .25s,transform .2s}
.tab .ti{font-size:1rem;line-height:1}
.tab.on{background:var(--coral);border-color:var(--coral);color:#fff!important;transform:scale(1.03)}
body.ml section.sec{margin:18px 0 0;padding:18px 14px 16px;border-radius:28px;scroll-margin-top:122px}
.tone0{background:var(--peach)}.tone1{background:var(--mint)}.tone2{background:var(--butter)}
.offer{background:linear-gradient(180deg,#FFE9DD,#FFF4EC)}
.sec-h{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.si{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:1.25rem;box-shadow:0 6px 14px -10px rgba(74,63,58,.4)}
.sec-h h2{font-size:1.35rem;flex:1}
.cnt{color:var(--muted);font-size:.8rem;background:rgba(255,255,255,.75);padding:2px 10px;border-radius:999px}
/* reveal */
html.anim .sec{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.3,1)}
html.anim .sec.in{opacity:1;transform:none}
/* photo cards */
body.ml .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:10px}
@media(min-width:720px){body.ml .grid{grid-template-columns:repeat(3,1fr);gap:14px}}
@media(min-width:980px){body.ml .grid{grid-template-columns:repeat(4,1fr)}}
body.ml .offer .grid{grid-template-columns:1fr}
@media(min-width:620px){body.ml .offer .grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){body.ml .offer .grid{grid-template-columns:repeat(3,1fr)}}
body.ml .card{background:#fff;border-radius:22px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;padding:0;border:0;box-shadow:0 10px 24px -20px rgba(74,63,58,.45);transition:transform .2s ease}
body.ml .card:active,.row:active{transform:scale(.98)}
@media(hover:hover){body.ml .card:hover{transform:translateY(-3px)}}
.ph{position:relative;aspect-ratio:1;background:var(--peach)}
.ph>img{width:100%;height:100%;object-fit:cover;display:block}
.flag{position:absolute;top:10px;right:10px;font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:999px;background:#fff;color:var(--ink)}
.flag.sun{background:var(--sun);color:#fff}
.flag.in{position:static;display:inline-block;background:#F3EDE8;color:var(--muted);font-family:'IBM Plex Sans Arabic',sans-serif;font-size:.7rem;padding:1px 8px;vertical-align:middle}
.cb{padding:10px 12px 12px;display:flex;flex-direction:column;flex:1}
.cb h3,.rt h3{font-size:1rem;line-height:1.45;font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:600}
.cb p,.rt p{color:var(--muted);font-size:.8rem;line-height:1.55;margin:2px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pr{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:8px}
.pr b{color:var(--coral);font-weight:700;font-size:.98rem}
.pr s{color:var(--muted);font-size:.8rem}
.plus{margin-inline-start:auto;width:32px;height:32px;border-radius:50%;background:var(--coral-soft);color:var(--coral);display:grid;place-items:center;font-size:1.25rem;font-weight:600;line-height:1;flex:none;transition:transform .2s,background .2s,color .2s}
.it:hover .plus{background:var(--coral);color:#fff;transform:rotate(90deg)}
.offer .cb h3{font-size:1.06rem}.offer .pr b{font-size:1.15rem}
/* compact list rows */
.list{background:#fff;border-radius:22px;box-shadow:0 10px 24px -22px rgba(74,63,58,.45);overflow:hidden}
.row{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;transition:background .2s,transform .2s}
.row+.row{border-top:1px dashed var(--line)}
@media(hover:hover){.row:hover{background:#FFFBF6}}
.rt{flex:1;min-width:0}
.rp{display:flex;align-items:center;gap:10px;flex:none}
.rp b{color:var(--coral);font-weight:700;font-size:.98rem;white-space:nowrap}
.sz{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.sz span{font-size:.76rem;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:1px 9px;white-space:nowrap}
.sz b{color:var(--ink);font-weight:600}
.card .sz{margin:6px 0 0}
.row.out,.card.out .cb{opacity:.55}.card.out .ph>img{filter:grayscale(.7);opacity:.7}.out .plus{display:none}
.nores{text-align:center;color:var(--muted);padding:30px 0}
.empty{text-align:center;padding:60px 10px}.empty p{color:var(--muted);margin:6px 0 18px}
.mfoot{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:34px 0 10px}
.b-mini{display:inline-flex;align-items:center;gap:6px;font-size:.88rem;font-weight:500;padding:8px 14px;border-radius:999px;border:1.5px solid var(--line);background:#fff}
.b-mini svg{width:16px!important;height:16px!important;color:var(--coral)}
/* buttons */
.b{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 20px;border-radius:999px;border:0;font:inherit;font-weight:600;font-size:1rem;cursor:pointer;background:var(--peach);color:var(--ink)}
.b-red{background:var(--coral);color:#fff!important;box-shadow:0 12px 24px -14px rgba(228,87,46,.8)}
.b-wa{background:#25B868;color:#fff;box-shadow:0 12px 24px -14px rgba(37,184,104,.8)}
.b:disabled{opacity:.6}
.grow{flex:1}
/* cart pill */
.pill{visibility:hidden;position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));z-index:45;width:min(460px,calc(100% - 28px));transform:translate(-50%,150%);transition:transform .45s cubic-bezier(.2,.9,.3,1)}
.pill.on{visibility:visible;transform:translate(-50%,0)}
.pill button{width:100%;display:flex;align-items:center;gap:12px;border:0;cursor:pointer;font:inherit;background:var(--coral);color:#fff;border-radius:999px;padding:11px 18px;box-shadow:0 14px 30px -12px rgba(228,87,46,.7)}
.pc{min-width:28px;height:28px;border-radius:50%;background:#fff;color:var(--coral);display:grid;place-items:center;font-weight:700;font-size:.9rem}
.pl{flex:1;text-align:right;font-weight:600}
.pt{font-weight:600}
.pill.pop button{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{40%{transform:scale(1.06)}}
/* sheets */
.scrim{position:fixed;inset:0;z-index:60;background:rgba(255,236,224,.6);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .3s}
.scrim.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;z-index:70;left:0;right:0;bottom:0;max-height:90vh;max-height:90dvh;background:#fff;border-radius:28px 28px 0 0;display:flex;flex-direction:column;transform:translateY(105%);transition:transform .45s cubic-bezier(.2,.9,.3,1);box-shadow:0 -16px 40px -20px rgba(74,63,58,.35)}
.sheet.on{transform:none}
@media(min-width:760px){.sheet{left:50%;right:auto;bottom:auto;top:50%;width:520px;border-radius:28px;opacity:0;pointer-events:none;transform:translate(-50%,-46%) scale(.97);transition:opacity .3s,transform .35s}.sheet.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}}
.sheet .x{position:absolute;top:12px;left:12px;z-index:3;width:36px;height:36px;border-radius:50%;border:0;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.08);cursor:pointer;font-size:1rem;color:var(--ink)}
.sc{overflow-y:auto;overscroll-behavior:contain;flex:1;border-radius:inherit}
.sh-ph{aspect-ratio:4/3;background:var(--peach)}.sh-ph img{width:100%;height:100%;object-fit:cover;display:block}
.sh-b{padding:18px 20px 10px}
.sh-b h2{font-size:1.45rem;line-height:1.35;padding-left:40px}
.shp{display:flex;gap:10px;align-items:baseline;margin-top:4px}.shp b{color:var(--coral);font-size:1.2rem;font-weight:700}.shp s{color:var(--muted)}
.d{color:var(--muted);margin:6px 0 0}
.sh-b h4{font-size:.95rem;font-weight:600;margin:18px 0 8px}
.sh-b h4 small{color:var(--muted);font-weight:400}
.opt{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:16px;padding:11px 14px;margin-bottom:8px;cursor:pointer;background:#fff;transition:border-color .2s,background .2s}
.opt input{position:absolute;opacity:0}
.opt .dot{width:20px;height:20px;border-radius:50%;border:2px solid #E3D3C5;flex:none;transition:border .2s}
.opt.cb .dot{border-radius:6px}
.opt .on{flex:1}.opt .op{color:var(--muted);font-size:.92rem}
.opt:has(input:checked){border-color:var(--coral);background:#FFF7F2}
.opt:has(input:checked) .dot{border:6px solid var(--coral)}
.opt.cb:has(input:checked) .dot{border:0;background:var(--coral) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat}
body.ml .inp{width:100%;font:inherit;font-size:16px;padding:12px 14px;border-radius:16px;border:1.5px solid var(--line);background:#fff;color:var(--ink);box-sizing:border-box}
body.ml .inp:focus{outline:0;border-color:#F7B9A3;box-shadow:0 0 0 4px #FFF1E6}
.sh-f{display:flex;gap:10px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff;border-radius:0 0 28px 28px}
.qty{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;background:#fff}
.qty button{width:42px;height:50px;border:0;background:none;font-size:1.3rem;cursor:pointer;color:var(--coral)}
.qty span{min-width:22px;text-align:center;font-weight:600}
.qty.sm button{width:32px;height:36px;font-size:1.1rem}
.ln{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line)}
.li{flex:1;min-width:0}.li b{display:block;font-weight:600}.li small{display:block;color:var(--muted);font-size:.82rem}.li span{color:var(--coral);font-weight:700;font-size:.92rem}
.tot{display:flex;justify-content:space-between;padding-top:14px;font-size:1.1rem}.tot b{font-weight:700;color:var(--coral)}
.note{color:var(--muted);font-size:.8rem;margin:0}
body.ml .seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
body.ml .seg.two{grid-template-columns:repeat(2,1fr)}
body.ml .seg label{position:relative;margin:0;text-align:center;padding:10px 4px;border-radius:999px;border:1.5px solid var(--line);cursor:pointer;font-weight:500;background:#fff;font-size:.95rem;transition:all .2s}
body.ml .seg input{position:absolute;opacity:0}
body.ml .seg label:has(input:checked){border-color:var(--coral);background:var(--coral-soft);color:var(--coral-d)}
.f{margin-bottom:10px}.f em{display:none;color:var(--coral);font-style:normal;font-size:.82rem}.f.bad em{display:block}.f.bad .inp{border-color:var(--coral)}
.ipn{font-size:.88rem;color:var(--ink);background:var(--butter);border-radius:16px;padding:10px 12px;margin:0 0 10px}
.ipn a{color:var(--coral);font-weight:600}
.rem{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:.88rem;margin:6px 0 4px}
.rem input{accent-color:var(--coral)}
.ce{text-align:center;padding:50px 20px}.ce h2{padding:0}.ce p{color:var(--muted)}
.toast{position:fixed;top:14px;left:50%;z-index:90;transform:translate(-50%,-160%);background:#fff;color:var(--ink);padding:8px 18px;border-radius:999px;font-weight:500;box-shadow:0 10px 24px -12px rgba(228,87,46,.45);transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
.toast.on{transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
[hidden]{display:none!important}
.ch-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-left:44px}
.ch-h h2{padding-left:0!important}
.clr{display:inline-flex;align-items:center;gap:5px;border:0;background:var(--coral-soft);color:var(--coral-d);font:inherit;font-size:.82rem;font-weight:600;padding:6px 12px;border-radius:999px;cursor:pointer;transition:transform .2s,background .2s}
.clr svg{width:15px!important;height:15px!important}
.clr:active{transform:scale(.95)}
@media(hover:hover){.clr:hover{background:#FBD5C6}}
.cfm{display:flex;align-items:center;flex-wrap:wrap;gap:8px;background:var(--peach);border-radius:16px;padding:10px 12px;margin-top:10px;font-size:.9rem;animation:cfmIn .3s cubic-bezier(.3,1.4,.5,1)}
.cfm span{flex:1 1 100%;font-weight:500}
@media(min-width:420px){.cfm span{flex:1}}
.cfm button{border:0;font:inherit;font-weight:600;font-size:.86rem;padding:7px 16px;border-radius:999px;cursor:pointer}
.cfm .yes{background:var(--coral);color:#fff}
.cfm .no{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
@keyframes cfmIn{from{opacity:0;transform:translateY(-6px)}}
.qty .rm{color:var(--coral)}
.qty .rm svg{width:16px!important;height:16px!important}
.ce-ic{font-size:2.6rem;width:84px;height:84px;margin:0 auto 10px;border-radius:50%;background:var(--peach);display:grid;place-items:center}
.ce .b{margin-top:16px;min-width:200px}
.hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;padding:0}
.spin{width:16px;height:16px;border-radius:50%;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;display:inline-block;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ce-ic.ok{background:#EAF7F0;color:#2E8F57;font-weight:700;animation:popok .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes popok{from{transform:scale(.4);opacity:0}}
.ocode{display:inline-block;background:var(--butter);color:var(--ink);padding:2px 12px;border-radius:999px;margin:4px 0;direction:ltr;font-size:1.05rem}
.ce .b-wa{display:flex;margin:16px auto 0;max-width:280px}.ce .b-wa svg{width:20px;height:20px}
.ce .b:not(.b-wa){margin-top:10px;background:var(--peach)}

/* per-item notes */
.nbox h4{margin-bottom:8px}
.nchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.nch{border:1.5px solid var(--line,#F0E2D6);background:#fff;border-radius:999px;padding:5px 12px;font:inherit;font-size:.84rem;color:var(--ink,#4A3F3A);cursor:pointer;transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .2s,border-color .2s}
.nch:active{transform:scale(.93)}.nch.on{background:#FFF8E1;border-color:#F4C84A;font-weight:600}.nch.on:before{content:"✓ ";color:#B7791F}
.nin{position:relative}.nin .inp{width:100%;box-sizing:border-box;padding-left:52px}.ncnt{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:.72rem;color:var(--muted,#8C7F78);direction:ltr}
.lnw{margin:3px 0 2px}
.lnote{display:inline-flex;align-items:baseline;gap:4px;max-width:100%;text-align:right;border:0;background:#FFF8E1;color:#7a5200;border-radius:10px;padding:3px 9px;font:inherit;font-size:.8rem;cursor:pointer;line-height:1.5}
.lnote span{white-space:normal;overflow-wrap:anywhere}.lnote u{color:var(--coral,#E4572E);text-decoration:none;font-weight:600;flex:none;margin-inline-start:4px}
.lnote.add{background:none;color:var(--coral,#E4572E);padding:2px 0;font-weight:600}
.ced{background:#FFFCF5;border:1.5px dashed #F6DFA6;border-radius:16px;padding:10px;margin:4px 0}
.ced .nch{font-size:.78rem;padding:4px 10px}.ced .inp{font-size:16px;padding-top:9px;padding-bottom:9px}
.nact{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}.nact button{border:0;border-radius:999px;padding:6px 14px;font:inherit;font-size:.84rem;font-weight:600;cursor:pointer;background:#F6F1EC;color:var(--ink,#4A3F3A)}
.nact .nsv{background:var(--coral,#E4572E);color:#fff}.nact .ndel{background:#FDE6DC;color:#C2401A}
.li .lp{color:var(--coral);font-weight:700;font-size:.92rem}
.li .lnote span{color:inherit;font-weight:inherit;font-size:inherit}.li .ncnt{color:var(--muted,#8C7F78);font-weight:400;font-size:.72rem}

/* search fix: old style.css .hero:before blob covered the box on phones */
.ml .hero:before,.ml .hero:after{content:none!important;display:none!important}
.ml .hero .mw{position:relative;z-index:2}
.search{position:relative;z-index:3}
.search .sr{display:flex;align-items:center;color:var(--coral);cursor:text}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.search input{min-width:0;-webkit-appearance:none;appearance:none;touch-action:manipulation}
.search input::-webkit-search-cancel-button,.search input::-webkit-search-decoration{-webkit-appearance:none;display:none}
.qx{flex:none;width:30px;height:30px;border-radius:50%;border:0;background:#FDE6DC;color:var(--coral);font:inherit;font-size:.85rem;font-weight:700;cursor:pointer;display:grid;place-items:center;margin-inline-start:-6px;animation:qxin .25s cubic-bezier(.3,1.6,.5,1)}
@keyframes qxin{from{transform:scale(.4);opacity:0}}
.nores{text-align:center;color:var(--muted);padding:34px 16px 40px;background:#fff;border-radius:24px;margin:16px 0}
.nores .ne{font-size:2.4rem;line-height:1.2}.nores p{margin:6px 0 2px;color:var(--ink);font-weight:600}.nores small{display:block;margin-bottom:14px}
.nores .b{display:inline-flex;background:#FDE6DC;color:#C2401A;border:0;border-radius:999px;padding:10px 20px;font:inherit;font-weight:600;cursor:pointer}
.tab[hidden]{display:none!important}