
@font-face{font-family:'Cairo';font-weight:400 900;src:url(/assets/comayt_theme/fonts/cairo-arabic-var.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFC,U+200C-200E}
@font-face{font-family:'Lat';src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Times');unicode-range:U+0020-007E,U+00A0-024F,U+2000-206F,U+20A0-20CF,U+2190-21FF}
:root{--b:#6B3F7A;--b2:color-mix(in srgb,var(--b) 72%,#000);--rose:#D94B7B;--gold:#C79A55;--ink:#1F1517;--mut:#7A6763;--paper:#F5EDE5;--glass:rgba(255,253,250,.82);--line:rgba(60,20,25,.1);--grn:#2F7A4D;--amb:#B26A00;--red:#B3261E;
--tint:#F5EDE5;--glow:107,63,122;--sh:0 1px 1px rgba(60,20,25,.04),0 10px 24px -12px rgba(60,20,25,.16),0 36px 60px -36px rgba(60,20,25,.28)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%}

.num{direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums;white-space:nowrap}
svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}


.bgfx{position:absolute;inset:0;pointer-events:none;background:radial-gradient(520px 380px at 92% -6%,rgba(var(--glow),.22),transparent 62%),radial-gradient(420px 360px at 0% 10%,rgba(217,75,123,.14),transparent 58%);transition:background .5s}
.scr{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;padding:0 0 14px;transform:translateX(0);opacity:1;transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .3s;scrollbar-width:none}
.scr::-webkit-scrollbar{display:none}.scr.hide{opacity:0;pointer-events:none;transform:translateX(-40px)}.scr.right{transform:translateX(40px)}
.ann{background:var(--b);color:#fff;font-size:11.5px;font-weight:800;text-align:center;padding:7px 10px}
.bar{display:flex;align-items:center;gap:10px;padding:12px 18px 8px;position:relative;z-index:2}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:20px}.logo img{height:30px;width:auto}
.sp{margin-inline-start:auto;display:flex;gap:8px}
.ib{width:42px;height:42px;border-radius:15px;background:var(--glass);border:1px solid var(--line);display:grid;place-items:center;position:relative;box-shadow:0 8px 16px -12px rgba(60,20,25,.5)}
.ib em{position:absolute;top:-5px;inset-inline-start:-5px;min-width:19px;height:19px;border-radius:99px;background:var(--b);color:#fff;font-size:11px;font-style:normal;font-weight:700;display:grid;place-items:center;padding:0 5px;font-family:'Lat';transition:transform .25s}
.ib em.pop{transform:scale(1.5)}.ib em:empty{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800;border-radius:99px;padding:14px 22px;background:#fff;color:var(--b);box-shadow:0 12px 22px -14px rgba(0,0,0,.6);transition:transform .15s}
.btn:active{transform:scale(.97)}.btn.pri{background:linear-gradient(145deg,var(--b),var(--b2));color:#fff}.btn[disabled]{opacity:.5}
.hero{margin:10px 18px 0;border-radius:32px;overflow:hidden;position:relative;aspect-ratio:1/1.05;box-shadow:var(--sh)}
.hero img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,21,23,0) 38%,rgba(52,26,60,.8) 100%)}
.hero .tx{position:absolute;inset-inline:20px;bottom:20px;color:#fff;z-index:1}.hero h2{margin:0;font-size:26px;line-height:1.3;font-weight:800}.hero h2 em{font-style:normal;background:linear-gradient(transparent 64%,rgba(199,154,85,.6) 64%)}
.hero p{margin:6px 0 12px;font-size:13px;font-weight:600;opacity:.92}
.sec{display:flex;align-items:baseline;justify-content:space-between;padding:22px 20px 0}.sec b{font-size:17px}.sec span{color:var(--b);font-weight:800;font-size:12.5px}
.tabs{display:flex;gap:8px;overflow:auto;padding:12px 18px 2px;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}
.tb{padding:10px 17px;border-radius:99px;background:var(--glass);border:1px solid var(--line);font-weight:800;font-size:13.5px;white-space:nowrap;transition:all .2s}
.tb.on{background:var(--b);color:#fff;border-color:transparent;box-shadow:0 10px 18px -10px rgba(var(--glow),.8)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px 18px}
.card{background:var(--glass);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 14px 28px -20px rgba(60,20,25,.55);text-align:start;animation:in .4s both}
@keyframes in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.pic{aspect-ratio:1/1.2;overflow:hidden;background:#e9ddd2;position:relative}.pic img{width:100%;height:100%;object-fit:cover}
.lowt{position:absolute;top:10px;inset-inline-start:10px;background:#fff;color:var(--amb);font-size:11px;font-weight:800;padding:4px 9px;border-radius:99px}
.card .t{padding:10px 12px 12px}.card b{display:block;font-size:13.5px;line-height:1.35}.card .pr{display:flex;align-items:center;justify-content:space-between;margin-top:6px}.card .pr span{font-size:16px;font-weight:700}
.dots{display:flex;gap:4px}.dots i{width:13px;height:13px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:6px 18px 0}.trust div{background:var(--glass);border:1px solid var(--line);border-radius:18px;padding:10px 6px;text-align:center;font-size:11px;font-weight:800;line-height:1.4}.trust svg{display:block;margin:0 auto 4px;color:var(--b)}
.big{margin:0 18px;border-radius:32px;aspect-ratio:1/1.16;position:relative;overflow:hidden;box-shadow:var(--sh);background:#e9ddd2}.big img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s}
.thumbs{display:flex;gap:9px;padding:12px 18px 0}.th{width:58px;height:58px;border-radius:18px;border:2px solid transparent;overflow:hidden;box-shadow:0 8px 14px -10px rgba(60,20,25,.5);transition:border-color .2s}.th.on{border-color:var(--b)}.th img{width:100%;height:100%;object-fit:cover}
.pd{padding:16px 18px 0}.pd h3{margin:0;font-size:22px;line-height:1.3}.price{display:flex;align-items:baseline;gap:7px;margin-top:4px}.price b{font-size:25px;font-weight:700}.price small{color:var(--mut);font-weight:700}
.lab{font-size:12.5px;font-weight:800;color:var(--mut);margin:18px 0 9px;display:flex;justify-content:space-between}.lab b{color:var(--ink)}
.sw{display:flex;gap:11px}.sw button{width:46px;height:46px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px var(--line),0 8px 14px -8px rgba(60,20,25,.5);overflow:hidden;position:relative;transition:box-shadow .2s,transform .2s}.sw button.on{box-shadow:0 0 0 2.5px var(--b),0 8px 14px -8px rgba(60,20,25,.5);transform:scale(1.06)}.sw img{width:100%;height:100%;object-fit:cover}
.help{margin-top:14px;padding:14px;border-radius:22px;background:rgba(255,255,255,.7);border:1px solid var(--line)}.help>b{font-size:13.5px;display:block;margin-bottom:9px}
.ages{display:flex;gap:7px;flex-wrap:wrap}.ages button{padding:8px 13px;border-radius:99px;background:#fff;border:1px solid var(--line);font-weight:800;font-size:12.5px;transition:all .2s}.ages button.on{background:var(--b);color:#fff;border-color:transparent}
.hmsg{margin:10px 0 0;font-size:12.5px;font-weight:800;color:var(--b);min-height:20px}
.sz{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.s{padding:10px 4px;border-radius:17px;border:1.5px solid var(--line);background:var(--glass);text-align:center;position:relative;transition:all .2s}
.s b{display:block;font-size:16px;font-family:'Lat'}.s small{display:block;font-size:10.5px;color:var(--mut);font-weight:700;line-height:1.3}
.s.on{border-color:var(--b);background:color-mix(in srgb,var(--b) 9%,#fff);box-shadow:0 10px 18px -12px rgba(var(--glow),.9)}
.s.low:after{content:attr(data-low);position:absolute;top:-8px;inset-inline-end:6px;background:var(--amb);color:#fff;font-size:10px;font-weight:800;padding:2px 7px;border-radius:99px}
.s.out{opacity:.5;background:repeating-linear-gradient(135deg,transparent 0 7px,rgba(60,20,25,.07) 7px 8px)}.s.out small{text-decoration:line-through}
.s.rec:before{content:"مقترح";position:absolute;top:-8px;inset-inline-start:6px;background:var(--grn);color:#fff;font-size:10px;font-weight:800;padding:2px 7px;border-radius:99px}
.shake{animation:sh .4s}@keyframes sh{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.qty{display:flex;align-items:center;gap:14px}.qty button{width:40px;height:40px;border-radius:14px;background:var(--glass);border:1px solid var(--line);font-weight:800;font-size:18px}.qty b{min-width:20px;text-align:center;font-size:18px;font-family:'Lat'}
.notify{display:flex;align-items:center;gap:8px;margin-top:12px;padding:12px 14px;border-radius:16px;background:#fff;border:1px dashed var(--b);font-size:12.5px;font-weight:800;color:var(--b);width:100%;text-align:start}
.acc{margin-top:14px;border-top:1px solid var(--line)}.acc>div{border-bottom:1px solid var(--line)}.acc button{display:flex;justify-content:space-between;width:100%;padding:13px 2px;font-weight:800;font-size:13.5px}.acc p{margin:0;overflow:hidden;max-height:0;transition:max-height .3s;font-size:12.5px;color:var(--mut);font-weight:700}.acc .open p{max-height:120px;padding-bottom:12px}
.dock{position:sticky;bottom:14px;margin:18px 14px 0;display:flex;gap:10px;align-items:center;padding:10px 10px 10px 14px;border-radius:26px;background:rgba(255,253,250,.94);backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:0 20px 40px -18px rgba(60,20,25,.5);z-index:5}.dock .btn{flex:1}
.h{padding:22px 18px 4px;font-size:22px;font-weight:800}
.free{margin:10px 18px 0;padding:12px 14px;border-radius:20px;background:color-mix(in srgb,var(--gold) 15%,transparent);font-size:12.5px;font-weight:800}.pbar{height:7px;border-radius:99px;background:rgba(60,20,25,.09);overflow:hidden;margin:7px 0 0}.pbar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--b),var(--rose));transition:width .5s}
.li{display:flex;gap:12px;align-items:center;margin:10px 18px 0;padding:10px;border-radius:22px;background:var(--glass);border:1px solid var(--line);animation:in .3s both}
.li .im{width:68px;height:80px;border-radius:16px;flex:0 0 auto;overflow:hidden}.li .im img{width:100%;height:100%;object-fit:cover}.li b{display:block;font-size:14px}.li small{color:var(--mut);font-weight:700;font-size:12px}.li .p{margin-inline-start:auto;font-weight:700;font-size:15px;text-align:end}
.mini{display:inline-flex;align-items:center;gap:8px;margin-top:6px}.mini button{width:28px;height:28px;border-radius:10px;background:#fff;border:1px solid var(--line);font-weight:800}.mini b{font-size:13px;font-family:'Lat'}
.empty{text-align:center;padding:70px 30px}.empty svg{width:56px;height:56px;color:var(--b);opacity:.5}.empty h3{margin:12px 0 4px}.empty p{color:var(--mut);font-weight:700;margin:0 0 18px}
.form{margin:14px 18px 0;padding:16px;border-radius:26px;background:var(--glass);border:1px solid var(--line);display:grid;gap:10px}
.fld{position:relative}.fld input,.fld select{width:100%;padding:13px 15px;border-radius:15px;background:#fff;border:1.5px solid var(--line);font:inherit;font-weight:700;font-size:14px;color:var(--ink);outline:none;transition:border-color .2s}.fld input:focus,.fld select:focus{border-color:var(--b)}
.fld.bad input,.fld.bad select{border-color:var(--red)}.fld small{display:none;color:var(--red);font-weight:800;font-size:11.5px;margin:4px 4px 0}.fld.bad small{display:block}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pay{display:flex;align-items:center;gap:12px;margin:12px 18px 0;padding:14px;border-radius:22px;border:2px solid var(--b);background:color-mix(in srgb,var(--b) 7%,#fff)}.pay i{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,var(--b),var(--b2));display:grid;place-items:center;color:#fff}.pay b{display:block;font-size:14px}.pay small{color:var(--mut);font-weight:700;font-size:12px}
.chk{display:flex;gap:10px;align-items:flex-start;margin:12px 20px 0;font-size:12.5px;font-weight:700;color:var(--mut)}.chk input{width:20px;height:20px;accent-color:var(--b);margin-top:2px}
.sum{margin:14px 18px 0;padding:14px 16px;border-radius:24px;background:var(--glass);border:1px solid var(--line)}.sum div{display:flex;justify-content:space-between;padding:4px 0;font-weight:700;font-size:13.5px}.sum .tot{border-top:1px dashed var(--line);margin-top:6px;padding-top:9px;font-size:16px}.sum .tot span:last-child{font-size:20px}
.ok{margin:46px 18px 0;text-align:center}.ck{width:64px;height:64px;border-radius:50%;margin:0 auto 10px;display:grid;place-items:center;background:linear-gradient(145deg,var(--grn),#1f5a3a);color:#fff;box-shadow:0 16px 26px -14px var(--grn);animation:pp .5s}.ck svg{width:30px;height:30px;stroke-width:2.6}@keyframes pp{from{transform:scale(.3);opacity:0}to{transform:none;opacity:1}}
.ok h3{margin:0;font-size:21px}.ok p{margin:4px 0 0;color:var(--mut);font-weight:700;font-size:13px}
.jr{margin:16px 18px 0;padding:20px 18px 18px;border-radius:30px;background:var(--glass);border:1px solid var(--line);box-shadow:var(--sh)}.jr h4{margin:0 0 4px;font-size:15px}.eta{color:var(--mut);font-weight:700;font-size:12.5px;margin-bottom:16px}
.road{position:relative;padding-inline-start:46px}.road:before{content:"";position:absolute;inset-inline-start:17px;top:14px;bottom:20px;width:4px;border-radius:4px;background:repeating-linear-gradient(180deg,rgba(60,20,25,.16) 0 6px,transparent 6px 12px)}
.road .done{position:absolute;inset-inline-start:17px;top:14px;width:4px;border-radius:4px;background:linear-gradient(180deg,var(--grn),var(--b));transition:height .8s}
.st{position:relative;padding:0 0 22px}.st:last-child{padding-bottom:0}.st i{position:absolute;inset-inline-start:-46px;top:0;width:38px;height:38px;border-radius:50%;background:#fff;border:3px solid rgba(60,20,25,.16);display:grid;place-items:center;color:var(--mut);transition:all .4s}
.st.dn i{background:var(--grn);border-color:var(--grn);color:#fff}.st.now i{background:linear-gradient(145deg,var(--b),var(--b2));border-color:#fff;color:#fff;box-shadow:0 0 0 5px rgba(var(--glow),.22),0 12px 20px -10px var(--b);animation:pl 1.6s infinite}
@keyframes pl{50%{box-shadow:0 0 0 9px rgba(var(--glow),.08),0 12px 20px -10px var(--b)}}.st b{display:block;font-size:14.5px}.st small{color:var(--mut);font-weight:700;font-size:12px}.st.now b{color:var(--b)}
.wa{margin:14px 18px 0;padding:14px;border-radius:22px;background:#E8F5EC;border:1px solid #cfe7d6;font-size:12.5px;font-weight:700;line-height:1.7}.wa b{display:block;color:var(--grn);margin-bottom:4px;font-size:12px}
.demo{margin:12px 18px 0;text-align:center;font-size:11.5px;color:var(--mut);font-weight:700}.demo button{color:var(--b);font-weight:800;text-decoration:underline}
.sheet{position:absolute;inset:0;background:rgba(31,21,23,.45);z-index:20;display:flex;align-items:flex-end;opacity:0;pointer-events:none;transition:opacity .25s}.sheet.show{opacity:1;pointer-events:auto}
.sheet .in{width:100%;background:#fff;border-radius:30px 30px 0 0;padding:22px 18px 28px;transform:translateY(100%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}.sheet.show .in{transform:none}.sheet h4{margin:0 0 4px;font-size:17px}.sheet p{margin:0 0 14px;color:var(--mut);font-weight:700;font-size:13px}
.toast{position:absolute;top:70px;inset-inline:18px;background:var(--ink);color:#fff;border-radius:16px;padding:12px 16px;font-weight:800;font-size:13px;z-index:30;transform:translateY(-20px);opacity:0;transition:all .3s;pointer-events:none}.toast.show{transform:none;opacity:1}
.skel .card{animation:none;background:linear-gradient(100deg,#eee3d8 30%,#f7efe6 50%,#eee3d8 70%);background-size:200% 100%;animation:sk 1.2s infinite;height:240px}@keyframes sk{to{background-position:-200% 0}}
.fly{position:absolute;width:26px;height:26px;border-radius:50%;background:var(--b);z-index:40;pointer-events:none;transition:all .65s cubic-bezier(.5,0,.8,.4)}

/* v3 */
.pf{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;border-radius:99px;background:var(--glass);border:1px solid var(--line);font-weight:800;font-size:13px;box-shadow:0 8px 16px -12px rgba(60,20,25,.5)}
.av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:13px;background:linear-gradient(145deg,var(--b),var(--rose))}
.pf small{display:block;color:var(--mut);font-size:10.5px;font-weight:700;line-height:1.1}
.hello{margin:10px 18px 0;padding:20px 20px 18px;border-radius:32px;background:linear-gradient(150deg,var(--b),var(--b2));color:#fff;position:relative;overflow:hidden;box-shadow:var(--sh)}
.hello:before{content:"";position:absolute;inset-inline-start:-50px;bottom:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(217,75,123,.5),transparent 66%)}
.hello h2{margin:0;font-size:25px;line-height:1.3;font-weight:800;position:relative}.hello h2 em{font-style:normal;background:linear-gradient(transparent 64%,rgba(199,154,85,.6) 64%)}
.hello p{margin:6px 0 0;font-size:13px;font-weight:600;opacity:.9;position:relative}
.hello .sizebadge{position:absolute;top:16px;inset-inline-end:18px;width:58px;height:58px;border-radius:20px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;font-size:26px;font-weight:700;font-family:'Lat'}
.hello .sizebadge small{position:absolute;bottom:-9px;background:#fff;color:var(--b);font-size:10px;font-weight:800;padding:1px 8px;border-radius:99px;font-family:'Cairo'}
.cardx{margin:12px 18px 0;padding:14px 16px;border-radius:24px;background:var(--glass);border:1px solid var(--line);display:flex;gap:12px;align-items:center;text-align:start;width:calc(100% - 36px)}
.cardx i{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--b),var(--b2));flex:0 0 auto}.cardx b{display:block;font-size:13.5px}.cardx small{color:var(--mut);font-weight:700;font-size:12px}
.cardx.bd i{background:linear-gradient(145deg,var(--rose),#a83a63)}.cardx.gr svg.sp{margin-inline-start:auto;width:70px;height:34px;color:var(--b)}
.occ{display:flex;gap:9px;overflow:auto;padding:12px 18px 0;scrollbar-width:none}.occ::-webkit-scrollbar{display:none}.occ div{flex:0 0 auto;padding:11px 14px;border-radius:20px;background:var(--glass);border:1px solid var(--line);min-width:150px}.occ b{display:block;font-size:13px}.occ small{color:var(--mut);font-weight:700;font-size:11.5px;line-height:1.4;display:block}
.dep{display:flex;gap:8px;overflow:auto;padding:14px 18px 0;scrollbar-width:none}.dep::-webkit-scrollbar{display:none}
.dp{padding:9px 16px;border-radius:14px;font-weight:800;font-size:14px;color:var(--mut);border-bottom:3px solid transparent;white-space:nowrap}.dp.on{color:var(--b);border-color:var(--b)}
.fitb{position:absolute;bottom:8px;inset-inline:8px;background:rgba(255,253,250,.92);border-radius:10px;font-size:10.5px;font-weight:800;padding:3px 8px;color:var(--grn);text-align:center}.fitb.low{color:var(--amb)}
.hid{margin:6px 18px 0;padding:11px 14px;border-radius:18px;background:rgba(255,255,255,.6);border:1px dashed var(--line);font-size:12.5px;font-weight:700;color:var(--mut);width:calc(100% - 36px);text-align:start}
.fit{margin-top:14px;padding:14px;border-radius:22px;background:rgba(255,255,255,.7);border:1px solid var(--line)}.fit .bar2{display:flex;height:8px;border-radius:99px;overflow:hidden;margin:9px 0 6px}.fit .bar2 i{display:block}.fit small{color:var(--mut);font-weight:700;font-size:12px}
.forme{display:flex;align-items:center;gap:10px;margin-top:14px;padding:12px 14px;border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--grn) 12%,#fff),#fff);border:1px solid color-mix(in srgb,var(--grn) 30%,transparent);font-weight:800;font-size:13px}.forme svg{color:var(--grn)}
.gift{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px 14px;border-radius:18px;background:#fff;border:1px solid var(--line);font-weight:800;font-size:13px;width:100%;text-align:start}.gift.on{border-color:var(--rose);background:color-mix(in srgb,var(--rose) 8%,#fff)}
.chips{display:flex;gap:8px;flex-wrap:wrap}.chips button{padding:10px 15px;border-radius:99px;background:#fff;border:1.5px solid var(--line);font-weight:800;font-size:13px}.chips button.on{background:var(--b);color:#fff;border-color:transparent}
.plist{display:grid;gap:8px;margin-bottom:12px}.plist button{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;background:#fff;border:1.5px solid var(--line);text-align:start;width:100%}.plist button.on{border-color:var(--b);background:color-mix(in srgb,var(--b) 7%,#fff)}.plist b{display:block;font-size:14px}.plist small{color:var(--mut);font-weight:700;font-size:12px}
.chart{margin:14px 18px 0;padding:16px;border-radius:26px;background:var(--glass);border:1px solid var(--line)}.chart svg{width:100%;height:170px;display:block}.chart .pred{margin-top:10px;padding:11px 13px;border-radius:16px;background:color-mix(in srgb,var(--gold) 16%,transparent);font-weight:800;font-size:13px}
.row2{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:10px}
.cartl{display:block;margin-top:4px;color:var(--b);font-weight:800;font-size:11.5px}
.sheet .in{max-height:85%;overflow:auto}
.pf2{display:flex;gap:8px;margin:12px 18px 0}

.hello.k p{padding-inline-end:76px}.hello .sizebadge small{white-space:nowrap}

.pr2{display:flex;gap:8px;align-items:stretch}.pr2 .pk{flex:1;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;background:#fff;border:1.5px solid var(--line);text-align:start}.pr2 .pk.on{border-color:var(--b);background:color-mix(in srgb,var(--b) 7%,#fff)}.pr2 .pk b{display:block;font-size:14px}.pr2 .pk small{color:var(--mut);font-weight:700;font-size:12px}.pr2 .ed{width:46px;border-radius:16px;background:#fff;border:1.5px solid var(--line);display:grid;place-items:center;color:var(--b)}
.sheet .in{overscroll-behavior:contain}

.occb{padding:0 18px}.occb .hid{text-align:center}

body.ci-on{overflow:hidden}
#ciBack{position:fixed;inset:0;z-index:99989;background:#E4DACF}
#app{position:fixed;z-index:99990;left:50%;top:0;bottom:0;width:100%;max-width:440px;transform:translateX(-50%);overflow:hidden;background:var(--tint);transition:background .5s;font-family:'Lat','Cairo','Segoe UI',Tahoma,sans-serif;color:var(--ink);line-height:1.55;font-size:14px}
#app *{box-sizing:border-box}
@media(min-width:520px){#app{top:18px;bottom:18px;border-radius:34px;box-shadow:0 30px 70px -30px rgba(0,0,0,.45)}}
@media(min-width:900px){#app{max-width:760px}.grid{grid-template-columns:1fr 1fr 1fr}}
.noimg{display:grid;place-items:center;width:100%;height:100%;min-height:140px;font-size:44px;font-weight:800;color:var(--mut);opacity:.8}
.pic{position:relative}.pic img,.big img{width:100%;height:100%;object-fit:cover;display:block}
.big .noimg{min-height:0;height:100%}
#app a{color:inherit}
.hello.k h2{padding-inline-end:76px;font-size:22px}
#app h1,#app h2,#app h3,#app h4{color:inherit;font-family:inherit;letter-spacing:0}
#app .hello,#app .hello h2,#app .hello h2 em,#app .hello p{color:#fff}
.chk{position:relative;align-items:center;gap:12px;margin:14px 18px 0;padding:14px 16px;background:#fff;border:1.5px solid var(--line);border-radius:20px;cursor:pointer;font-size:13px;line-height:1.7;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.chk input{position:absolute;opacity:0;width:1px;height:1px}
.chk .bx{flex:0 0 28px;width:28px;height:28px;border-radius:9px;border:2.5px solid var(--b);background:#fff;display:grid;place-items:center;transition:background .15s}
.chk input:checked+.bx{background:var(--b)}
.chk input:checked+.bx:after{content:"";width:7px;height:13px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg) translate(-1px,-1px)}
.chk input:focus-visible+.bx{box-shadow:0 0 0 4px rgba(107,63,122,.25)}
.chk.bad{border-color:var(--red);box-shadow:0 0 0 4px rgba(179,38,30,.12)}.chk.bad .bx{border-color:var(--red)}
.added{display:flex;gap:14px;align-items:center}.added .im{width:68px;height:68px;border-radius:18px;overflow:hidden;flex:0 0 68px;background:#eee}.added .im img{width:100%;height:100%;object-fit:cover}.added b{display:block;font-size:17px}.added small{color:var(--mut);font-weight:700}
.loc{display:flex;gap:12px;align-items:center;margin:10px 18px 0;padding:12px 14px;border:1.5px dashed var(--b);border-radius:20px;background:rgba(255,255,255,.7)}.loc i{width:38px;height:38px;border-radius:13px;background:var(--b);color:#fff;display:grid;place-items:center;flex:0 0 38px}.loc div{flex:1;min-width:0}.loc b{display:block;font-size:13.5px}.loc small{display:block;color:var(--mut);font-weight:700;font-size:11.5px;line-height:1.5}.loc button{border-radius:99px;padding:9px 16px;background:var(--b);color:#fff;font-weight:800;font-size:12.5px}.loc.ok{border-style:solid;border-color:var(--grn);background:#f2faf5}.loc.ok i{background:var(--grn)}.loc.ok button{background:#fff;color:var(--red);border:1px solid var(--line)}
.sub{margin:0;padding:0 20px 12px;color:var(--mut);font-weight:700;font-size:13px}
.soc{display:grid;gap:10px;padding:0 18px}
.sb{display:flex;align-items:center;justify-content:center;gap:10px;height:50px;border-radius:99px;font-weight:800;font-size:14.5px;text-decoration:none;border:1px solid var(--line);background:#fff;color:var(--ink);box-shadow:0 8px 16px -12px rgba(60,20,25,.45)}
.sb.f{background:#1877F2;color:#fff;border-color:transparent}
.sb svg{width:20px;height:20px}
.or{display:flex;align-items:center;gap:10px;margin:16px 22px 8px;color:var(--mut);font-weight:700;font-size:12px}.or:before,.or:after{content:"";flex:1;height:1px;background:var(--line)}
.tabs2{display:flex;gap:6px;margin:0 18px 6px;padding:4px;border-radius:99px;background:rgba(255,255,255,.6);border:1px solid var(--line)}
.tabs2 button{flex:1;padding:10px;border-radius:99px;font-weight:800;font-size:13.5px;color:var(--mut)}.tabs2 button.on{background:var(--b);color:#fff}
.aerr{min-height:20px;color:var(--red);font-weight:800;font-size:12.5px;margin:6px 2px}
.fine{color:var(--mut);font-weight:700;font-size:11.5px;line-height:1.7}.fine a{color:var(--b);font-weight:800}
#acct .form{padding-bottom:30px}
.mini{gap:10px}.mini button{width:36px;height:36px;border-radius:12px;font-size:17px}
.mini .rmb{width:auto;padding:0 12px;display:inline-flex;gap:6px;align-items:center;color:var(--red);font-size:12.5px;font-weight:800;margin-inline-start:6px}.mini .rmb svg{width:16px;height:16px}
.hero2{display:flex;flex-direction:column;justify-content:flex-end;min-height:150px;margin:0 18px 12px;padding:60px 20px 16px;border-radius:26px;background-size:cover;background-position:center;background-color:var(--b);color:#fff;text-decoration:none;box-shadow:var(--sh)}.hero2 b{font-size:22px;line-height:1.4}.hero2 small{opacity:.92;font-weight:700}
.foot{padding:24px 18px 34px;text-align:center;color:var(--mut);font-weight:700;font-size:12.5px;line-height:2}.foot .fl{display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:center;margin-bottom:10px}.foot .fl button{color:var(--b);font-weight:800;text-decoration:underline;text-underline-offset:3px}.foot .fs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:10px}.foot .fs a{padding:6px 14px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink);text-decoration:none;font-weight:800}
.pgb{padding:0 22px 40px;font-size:14.5px;line-height:2;color:var(--ink)}.pgb h3{font-size:16px;margin:20px 0 6px;color:var(--b)}.pgb table{border-collapse:collapse;width:100%;margin:8px 0}.pgb td,.pgb th{border:1px solid var(--line);padding:8px 10px;text-align:start}.pgb th{background:rgba(107,63,122,.08)}.pgb ul,.pgb ol{padding-inline-start:22px}.pgb small{color:var(--mut)}
.lnk{display:inline;color:var(--b);font-weight:800;text-decoration:underline;text-underline-offset:3px}
@media(min-width:900px){
#app{max-width:1120px}
.grid{grid-template-columns:repeat(4,1fr);gap:18px;padding:16px 28px}
.bar{padding:16px 28px 8px}
.hello{margin:12px 28px 0;padding:30px 34px}.hello h2{font-size:34px}.hello p{font-size:15px;max-width:640px}
.dep,.tabs{padding-inline:28px}.occb,.hero2{margin-inline:28px}.cardx{margin-inline:28px;width:auto}.hid,.demo{margin-inline:28px}.foot{padding-inline:28px}.trust{margin-inline:28px}
#prod{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-auto-rows:min-content;column-gap:34px;align-content:start;padding-bottom:30px}
#prod>.bar{grid-column:1/-1}
#prod>.big{grid-column:1;grid-row:2;margin:0 28px 0 0;aspect-ratio:1/1.05}
#prod>.thumbs{grid-column:1;grid-row:3;padding-inline:0 28px}
#prod>.pd{grid-column:2;grid-row:2/span 3;padding-inline:0 28px}
#prod>.dock{grid-column:2;grid-row:5;margin:18px 0 0;position:sticky;bottom:14px}
#cart>*:not(.bar),#acct>*:not(.bar),#pg>*:not(.bar),#done>*:not(.bar),#grow>*:not(.bar){max-width:680px;margin-inline:auto}
#cart>.dock{max-width:680px}
}
.stars{letter-spacing:1px;font-size:13px}.stars.big{font-size:18px}.rt{margin-top:2px}.rt .num{color:var(--mut);font-weight:700}
.rvw{margin:14px 0 0}.rvh{display:flex;align-items:center;gap:8px;font-size:15px}.rvh small{color:var(--mut);font-weight:700}
.rv1{padding:10px 0;border-top:1px solid var(--line)}.rv1 p{margin:4px 0 0;font-weight:700;font-size:13.5px;color:var(--ink)}.rv1 small{color:var(--mut);font-weight:700;margin-inline-start:6px}
.stp{display:flex;gap:6px;direction:ltr;justify-content:center;margin:10px 0}.stp button{font-size:34px;color:#D9CFC6;line-height:1}.stp button.on{color:#C79A55}
.fam{display:flex;align-items:center;gap:10px;margin:0 18px 8px;padding:10px 12px;background:var(--glass);border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 16px -14px rgba(60,20,25,.45)}
.fam .av{width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,var(--b),var(--rose));color:#fff;display:grid;place-items:center;font-weight:800;flex:0 0 42px}
.fam .fi{flex:1;min-width:0}.fam .fi b{display:block}.fam .fi small{display:block;color:var(--mut);font-weight:700;font-size:12px;line-height:1.6}

.fstrip{margin:12px 0 2px}.fstrip>small{display:block;padding:0 22px 7px;font-weight:800;font-size:12px;color:var(--mut)}
.fstrip .fs{display:flex;gap:8px;overflow-x:auto;padding:2px 18px 6px;scrollbar-width:none}.fstrip .fs::-webkit-scrollbar{display:none}
.fstrip .fs button{flex:none;display:flex;align-items:center;gap:9px;padding:7px 14px 7px 8px;border-radius:99px;background:#fff;box-shadow:0 1px 2px rgba(60,30,60,.05),0 6px 16px rgba(60,30,60,.07);text-align:start}
.fstrip .fs .av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(150deg,var(--b),var(--b2));color:#fff;font-weight:800;font-size:13px}
.fstrip .fs span:last-child{display:flex;flex-direction:column;font-weight:800;font-size:13px;line-height:1.25}.fstrip .fs em{font-style:normal;font-weight:700;font-size:11px;color:var(--mut)}
.alsofit{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 0;font-weight:700;font-size:12px;color:var(--mut)}
.alsofit button{padding:5px 12px;border-radius:99px;background:rgba(255,255,255,.8);border:1.5px solid var(--line);font-weight:800;font-size:12px;color:var(--b)}

.addfm{display:inline-flex;align-items:center;gap:6px;padding:8px 15px;border-radius:99px;background:linear-gradient(135deg,var(--b),var(--b2));color:#fff;font-weight:800;font-size:12.5px;box-shadow:0 6px 16px rgba(107,63,122,.22)}
.addfm svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
