:root{--maroon:#7a1626;--maroon-700:#5f0e1c;--maroon-100:#f5d9df;--saffron:#f2a03d;--saffron-600:#d97e18;--saffron-100:#ffe6c4;--pistachio:#7a9d3e;--cream:#fff6ec;--cream-2:#fbeedb;--ink:#221913;--ink-2:#4b3b30;--muted:#8a7568;--line:#efe1cf;--danger:#c53f2e;--success:#2e7d4f;--bg:var(--cream);--surface:#ffffff;--surface-2:var(--cream-2);--overlay:rgba(34,25,19,.55);--r-xs:6px;--r-sm:10px;--r-md:16px;--r-lg:22px;--r-xl:30px;--r-pill:999px;--sh-1:0 1px 2px rgba(34,25,19,.06),0 2px 8px rgba(34,25,19,.05);--sh-2:0 8px 24px rgba(34,25,19,.10);--sh-3:0 18px 40px rgba(34,25,19,.14);--font-display:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--font-body:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--font-serif:'Fraunces','Georgia',serif;--appbar-h:48px;--bottomnav-h:68px;--max-w:520px;--fc-h:0px;--page-cta-h:0px;--bottom-inset:calc(env(safe-area-inset-bottom) + var(--bottomnav-h) + var(--fc-h) + var(--page-cta-h));--ease:cubic-bezier(.22,.9,.28,1)}@media (prefers-color-scheme:dark){:root{--bg:#17110d;--surface:#221913;--surface-2:#2b201a;--ink:#f7ecdf;--ink-2:#d8c6b3;--muted:#a08977;--line:#3a2b22;--cream:#17110d;--cream-2:#221913;--maroon-100:#45161e;--overlay:rgba(0,0,0,.65)}}*,*::before,*::after{box-sizing:border-box}html,body{margin:0;padding:0}html{-webkit-tap-highlight-color:transparent}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.45;min-height:100dvh;padding-bottom:var(--bottom-inset);overflow-x:hidden;transition:padding-bottom .28s var(--ease)}h1,h2,h3,h4{font-family:var(--font-display);color:var(--ink);margin:0;letter-spacing:-.01em}h1{font-weight:700;font-size:24px}h2{font-weight:700;font-size:18px}h3{font-weight:600;font-size:15px}p{margin:0}a{color:var(--maroon);text-decoration:none}button{font-family:inherit;font-size:15px;border:0;background:none;color:inherit;cursor:pointer}.splash{position:fixed;inset:0;background:linear-gradient(160deg,var(--maroon),var(--maroon-700) 60%,#390810);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--cream);z-index:9999;transition:opacity .35s var(--ease),visibility .35s}.splash.hidden{opacity:0;visibility:hidden}.splash-logo{text-align:center}.splash-badge{width:88px;height:88px;border-radius:50%;margin:0 auto 16px;background:linear-gradient(145deg,var(--saffron),var(--saffron-600));color:var(--maroon-700);font-family:var(--font-display);font-weight:800;font-size:44px;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.35),inset 0 0 20px rgba(255,255,255,.25)}.splash-name{font-family:var(--font-display);font-size:30px;font-weight:800}.splash-tag{color:var(--saffron-100);margin-top:4px;font-size:14px}.splash-loader{margin-top:36px;width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--saffron);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.appbar{position:sticky;top:0;z-index:40;background:var(--surface);padding:6px 14px calc(6px + env(safe-area-inset-top)) 14px;padding-top:calc(6px + env(safe-area-inset-top));display:flex;align-items:center;gap:8px;min-height:var(--appbar-h)}.appbar-address{flex:1;text-align:left;padding:2px 4px;min-height:44px;display:flex;flex-direction:column;justify-content:center}.appbar-label{font-size:10.5px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;line-height:1;font-weight:600}.appbar-value{display:flex;align-items:center;gap:6px;font-weight:600;color:var(--ink);font-size:15px;margin-top:3px;line-height:1.15}.appbar-value .chev{width:14px;height:14px;color:var(--maroon)}.appbar-actions{display:flex;gap:4px}.icon-btn{position:relative;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--ink-2);transition:background .2s var(--ease)}.icon-btn:hover,.icon-btn:active{background:var(--surface-2)}.icon-btn svg{width:22px;height:22px}.icon-btn .dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--saffron);border:2px solid var(--surface)}.delivering-from{position:sticky;top:var(--appbar-h);z-index:30;background:var(--maroon);color:#fff;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px}.df-left{display:flex;flex-direction:column}.df-label{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.78;line-height:1;font-weight:600}.df-branch{color:#fff;font-weight:600;display:flex;align-items:center;gap:4px;font-size:15px;line-height:1.15;margin-top:4px}.df-branch .chev{width:14px;height:14px}.df-right{font-size:12px;background:rgba(255,255,255,.16);border-radius:var(--r-pill);padding:6px 12px;font-weight:500;white-space:nowrap}.view{max-width:var(--max-w);margin:0 auto;padding:12px 14px 24px}.section-title{display:flex;align-items:baseline;justify-content:space-between;margin:20px 4px 10px}.section-title h2{font-size:20px}.section-title a{font-size:13px;font-weight:600}.bottom-container{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;flex-direction:column;pointer-events:none;padding-bottom:env(safe-area-inset-bottom)}.bottom-container>*{pointer-events:auto}.bottomnav{position:relative;background:var(--surface);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);height:var(--bottomnav-h);padding-top:4px}.bn-item span:not(.cart-badge){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.bn-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--muted);position:relative;font-size:11px;font-weight:500;transition:color .2s var(--ease)}.bn-item svg{width:22px;height:22px;padding:4px 14px;box-sizing:content-box;border-radius:999px;transition:background .2s var(--ease)}.bn-item:hover{color:var(--ink)}.bn-item.active{color:var(--maroon);font-weight:600}.bn-item.active svg{color:var(--maroon);background:color-mix(in srgb,var(--maroon) 13%,transparent)}.cart-badge{position:absolute;top:4px;right:calc(50% - 22px);background:var(--maroon);color:white;font-size:10px;font-weight:700;padding:2px 5px;border-radius:999px;min-width:16px;text-align:center}.btn-primary,.btn-secondary,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:12px 18px;border-radius:var(--r-pill);font-weight:700;font-size:15px;transition:transform .12s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease)}.btn-primary{background:linear-gradient(135deg,var(--maroon),var(--maroon-700));color:white;box-shadow:0 8px 20px rgba(122,22,38,.35)}.btn-primary:active{transform:translateY(1px) scale(.98)}.btn-secondary{background:var(--saffron);color:var(--maroon-700);box-shadow:0 6px 16px rgba(217,126,24,.25)}.btn-ghost{background:transparent;color:var(--maroon);border:1px solid var(--maroon)}.btn-block{display:flex;width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.hidden{display:none !important}.center{text-align:center}.flex{display:flex}.gap-8{gap:8px}.gap-12{gap:12px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}:root{--bottom-container-h:calc(env(safe-area-inset-bottom) + var(--bottomnav-h) + var(--fc-h))}html[data-route="product"]{--page-cta-h:84px}html[data-route="checkout"]{--page-cta-h:96px}
.card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden}.card-p{padding:14px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);padding:6px 12px;border-radius:var(--r-pill);font-size:12px;font-weight:600;color:var(--ink-2);white-space:nowrap}.chip.active{background:var(--maroon);color:white;border-color:var(--maroon)}.chip.saffron{background:var(--saffron-100);color:var(--maroon-700);border-color:var(--saffron-100)}.chip.veg::before{content:'';width:10px;height:10px;border:1.5px solid var(--pistachio);display:inline-block;position:relative}.chip.veg::before{border-radius:2px}.chip.veg::after{content:'';width:5px;height:5px;background:var(--pistachio);border-radius:50%;display:inline-block;margin-left:-8px}.hstack-scroll{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 8px;margin:0 -2px}.hstack-scroll::-webkit-scrollbar{display:none}.hstack-scroll>*{scroll-snap-align:start;flex-shrink:0}.cat-card{width:88px;text-align:center;color:var(--ink)}.cat-card .thumb{width:76px;height:76px;border-radius:50%;background:linear-gradient(180deg,var(--saffron-100),var(--cream-2));display:grid;place-items:center;overflow:hidden;box-shadow:var(--sh-1);border:2px solid var(--surface);transition:transform .25s var(--ease)}.cat-card:hover .thumb,.cat-card:active .thumb{transform:scale(1.05) rotate(-2deg)}.cat-card img{width:100%;height:100%;object-fit:cover}.cat-card .thumb .letter{font-family:var(--font-display);font-size:30px;font-weight:800;color:var(--maroon)}.cat-card .name{font-size:12px;font-weight:600;margin-top:6px;line-height:1.2}.prod-card{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:12px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--sh-1);margin-bottom:12px;position:relative;transition:transform .12s var(--ease)}.prod-card:active{transform:scale(.99)}.prod-card .thumb{width:96px;height:96px;border-radius:var(--r-sm);overflow:hidden;background:var(--surface-2);display:grid;place-items:center}.prod-card .thumb img{width:100%;height:100%;object-fit:cover}.prod-card .thumb .placeholder{font-family:var(--font-display);font-weight:800;color:var(--maroon);font-size:30px}.prod-card h3{font-size:16px}.prod-card .desc{font-size:12px;color:var(--muted);margin-top:2px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.prod-card .price{margin-top:6px;font-weight:800;color:var(--ink);font-size:15px}.prod-card .price .mrp{color:var(--muted);text-decoration:line-through;font-weight:500;font-size:12px;margin-left:6px}.prod-card .meta{margin-top:6px;font-size:11px;color:var(--muted);display:flex;gap:8px}.prod-card .add-btn{position:absolute;right:14px;bottom:14px;background:var(--surface);color:var(--maroon-700);border:1px solid var(--maroon);font-weight:800;padding:6px 18px;border-radius:var(--r-pill);text-transform:uppercase;font-size:12px;letter-spacing:.05em;box-shadow:var(--sh-1)}.prod-card .add-btn:active{transform:translateY(1px)}.banner{border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(135deg,var(--maroon),#a11c30);color:white;padding:18px;position:relative;min-height:132px;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--sh-2)}.banner::before{content:"";position:absolute;right:-30px;top:-30px;width:160px;height:160px;background:radial-gradient(circle,var(--saffron) 0%,transparent 65%);opacity:.35}.banner h3{color:white;font-size:22px}.banner p{margin-top:4px;opacity:.9;font-size:13px}.banner .badge{display:inline-block;margin-top:10px;padding:6px 12px;background:var(--saffron);color:var(--maroon-700);font-weight:800;border-radius:var(--r-pill);font-size:12px}.banner.shipping{background:linear-gradient(135deg,#5f0e1c,var(--saffron-600))}.skel{background:linear-gradient(90deg,var(--surface-2) 0%,var(--line) 50%,var(--surface-2) 100%);background-size:200% 100%;animation:shimmer 1.1s infinite;border-radius:var(--r-sm)}@keyframes shimmer{to{background-position:-200% 0}}.skel-line{height:12px;margin:6px 0}.skel-card{display:grid;grid-template-columns:96px 1fr;gap:12px;background:var(--surface);padding:12px;border-radius:var(--r-md);margin-bottom:12px;box-shadow:var(--sh-1)}.skel-thumb{width:96px;height:96px}.empty{padding:60px 20px;text-align:center;color:var(--muted)}.empty .emoji{font-family:var(--font-display);font-size:44px;font-weight:800;color:var(--maroon);margin-bottom:10px}.empty h3{color:var(--ink);font-family:var(--font-display);font-size:20px}.empty p{margin-top:6px}.sheet-backdrop{position:fixed;inset:0;background:var(--overlay);z-index:90;opacity:0;transition:opacity .25s var(--ease)}.sheet-backdrop.on{opacity:1}.sheet{position:fixed;left:0;right:0;bottom:0;z-index:95;background:var(--surface);border-top-left-radius:var(--r-xl);border-top-right-radius:var(--r-xl);padding:8px 0 calc(20px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .35s var(--ease);max-height:88vh;overflow-y:auto;box-shadow:0 -10px 40px rgba(0,0,0,.2)}.sheet.on{transform:translateY(0)}.sheet-handle{width:40px;height:4px;background:var(--line);border-radius:4px;margin:8px auto 12px}.sheet-header{padding:4px 20px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.sheet-header h2{font-family:var(--font-display)}.sheet-body{padding:12px 20px}.sheet-close{width:34px;height:34px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center}.sheet-close svg{width:18px;height:18px}.toast-host{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--bottomnav-h) + env(safe-area-inset-bottom) + 12px);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center}.toast{background:var(--ink);color:var(--cream);padding:10px 16px;border-radius:var(--r-pill);font-size:13px;font-weight:600;box-shadow:var(--sh-2);animation:toastIn .25s var(--ease)}.toast.success{background:var(--success)}.toast.error{background:var(--danger)}@keyframes toastIn{from{transform:translateY(20px);opacity:0}}.sticky-bar{position:fixed;left:0;right:0;bottom:calc(var(--bottomnav-h) + env(safe-area-inset-bottom));padding:12px 14px;z-index:45;pointer-events:none}.sticky-bar .inner{pointer-events:auto;max-width:var(--max-w);margin:0 auto;background:var(--maroon);color:white;border-radius:var(--r-pill);padding:10px 16px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--sh-3)}.sticky-bar .count{font-weight:700}.sticky-bar .cta{font-weight:800;display:flex;align-items:center;gap:4px}.field{display:block;margin:10px 0}.field label{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;font-weight:600}.field input,.field textarea,.field select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-family:inherit;font-size:15px;transition:border-color .2s var(--ease)}.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--maroon)}.otp-inputs{display:flex;gap:10px;justify-content:center;margin:20px 0}.otp-inputs input{width:44px;height:54px;text-align:center;font-size:22px;font-weight:700;font-family:var(--font-display)}.row-list .row{display:flex;align-items:center;justify-content:space-between;padding:14px 4px;border-bottom:1px solid var(--line)}.row-list .row:last-child{border-bottom:0}.addr-item{padding:14px;border-radius:var(--r-md);background:var(--surface-2);margin-bottom:10px;border:2px solid transparent}.addr-item.current{border-color:var(--maroon);background:var(--surface)}.addr-item .label{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--ink)}.addr-item .full{color:var(--ink-2);font-size:13px;margin-top:4px}.addr-item .status{color:var(--maroon);font-size:12px;font-weight:600;margin-top:6px;display:flex;align-items:center;gap:6px}.addr-item .actions{display:flex;gap:6px;margin-top:10px}.addr-item .actions button{font-size:12px;padding:6px 12px}#map{height:340px;width:100%;border-radius:var(--r-md);overflow:hidden}.sticky-add{position:fixed;left:0;right:0;bottom:var(--bottom-container-h,calc(env(safe-area-inset-bottom) + 68px));z-index:60;padding:12px 14px;background:linear-gradient(180deg,transparent,var(--bg) 30%);pointer-events:none}.sticky-add>*{pointer-events:auto}.sticky-add .inner{max-width:var(--max-w);margin:0 auto;background:var(--surface);border-radius:var(--r-pill);padding:8px 8px 8px 20px;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:var(--sh-3)}.stepper{display:inline-flex;align-items:center;gap:0;background:var(--surface);border:1px solid var(--maroon);border-radius:var(--r-pill);overflow:hidden}.stepper button{width:36px;height:36px;color:var(--maroon);font-weight:800;font-size:18px}.stepper .val{min-width:28px;text-align:center;font-weight:800;color:var(--ink)}.timeline{padding:6px 4px}.timeline .step{display:flex;gap:12px;padding:8px 0;position:relative}.timeline .step::before{content:'';position:absolute;left:11px;top:24px;bottom:-8px;width:2px;background:var(--line)}.timeline .step:last-child::before{display:none}.timeline .dot{width:24px;height:24px;border-radius:50%;background:var(--surface);border:2px solid var(--line);display:grid;place-items:center;flex-shrink:0;margin-top:2px}.timeline .step.done .dot{background:var(--pistachio);border-color:var(--pistachio)}.timeline .step.done .dot::after{content:'';width:8px;height:8px;border-radius:50%;background:white}.timeline .step.current .dot{background:var(--saffron);border-color:var(--saffron);animation:pulse 1.4s infinite}@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(242,160,61,.25)}}.timeline .step .title{font-weight:700}.timeline .step .time{color:var(--muted);font-size:12px}.floating-cart{position:relative;margin:0 10px 6px 10px;background:linear-gradient(135deg,var(--maroon),var(--maroon-700));color:white;border-radius:var(--r-lg);box-shadow:0 4px 12px rgba(122,22,38,.22),0 12px 32px rgba(122,22,38,.28);display:flex;align-items:center;gap:10px;cursor:pointer;max-height:0;padding-top:0;padding-bottom:0;padding-left:18px;padding-right:14px;opacity:0;overflow:hidden;transform:translateY(10px) scale(.98);transition:max-height .32s var(--ease),padding .32s var(--ease),opacity .28s var(--ease),margin-bottom .32s var(--ease),transform .32s var(--ease),box-shadow .28s var(--ease)}.floating-cart.visible{max-height:76px;padding-top:12px;padding-bottom:12px;opacity:1;transform:translateY(0) scale(1);margin-bottom:6px}.floating-cart:active{transform:translateY(0) scale(0.99)}.fc-left{flex:1;min-width:0}.fc-branch{font-size:13px;font-weight:700;opacity:.92;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fc-info{font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px;white-space:nowrap}.fc-dot{opacity:.55}.fc-total{font-family:var(--font-display);font-weight:800;font-size:17px;color:var(--saffron)}.fc-cta{background:white;color:var(--maroon-700);font-weight:800;font-size:13px;padding:10px 16px;border-radius:var(--r-pill);text-transform:uppercase;letter-spacing:.04em;box-shadow:0 2px 8px rgba(0,0,0,.15);display:inline-flex;align-items:center;gap:4px;flex-shrink:0;transition:transform .12s var(--ease)}.fc-cta svg{width:14px;height:14px}.fc-cta:active{transform:scale(0.96)}
html[data-route="checkout"] #appbar,html[data-route="checkout"] #delivering-from{display:none !important}.hero-strip{padding:8px 4px 4px}.hero-strip .hi{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--ink)}.hero-strip .sub{color:var(--muted);font-size:13px;margin-top:2px}.search-bar{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);padding:10px 14px;margin:14px 2px;box-shadow:var(--sh-1)}.search-bar svg{color:var(--muted);width:20px;height:20px;flex-shrink:0}.search-bar input{flex:1;border:0;background:transparent;outline:0;font:inherit;color:var(--ink);min-width:0}.search-bar.with-mic{padding-right:6px}.sb-mic{position:relative;flex:0 0 auto;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--cream-2,#f4e7d3);color:var(--maroon);border:1px solid transparent;cursor:pointer;transition:background .18s var(--ease),color .18s var(--ease),transform .18s var(--ease),box-shadow .2s var(--ease);-webkit-tap-highlight-color:transparent}.sb-mic svg{width:18px;height:18px;color:currentColor}.sb-mic:hover{background:var(--saffron-100,#ffe7c2)}.sb-mic:active{transform:scale(.92)}.sb-mic:focus-visible{outline:2px solid var(--maroon);outline-offset:2px}.sb-mic .sb-mic-pulse{position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--maroon);opacity:0;pointer-events:none}.sb-mic.listening{background:var(--maroon);color:#fff;box-shadow:0 0 0 4px rgba(122,22,38,.14)}.sb-mic.listening .sb-mic-pulse{animation:sbMicPulse 1.15s ease-out infinite}@keyframes sbMicPulse{0%{opacity:.55;transform:scale(1)}100%{opacity:0;transform:scale(1.55)}}@media (prefers-reduced-motion:reduce){.sb-mic.listening .sb-mic-pulse{animation:none}}html[data-route="search"]{--bottomnav-h:0px}html[data-route="search"] #appbar,html[data-route="search"] #delivering-from,html[data-route="search"] .bottomnav{display:none !important}html[data-route="search"] .view{padding:0 0 24px}.search-shell{position:sticky;top:0;z-index:60;background:var(--surface);padding:10px 12px 12px;border-bottom:1px solid var(--line);box-shadow:0 2px 8px rgba(0,0,0,.03);padding-top:calc(10px + env(safe-area-inset-top))}.search-bar.focus-bar{margin:0;border-radius:var(--r-pill);padding:6px 8px 6px 6px;gap:6px;background:var(--surface);border:1px solid var(--line);box-shadow:none;transition:border-color .18s var(--ease),box-shadow .18s var(--ease)}.search-bar.focus-bar:focus-within{border-color:var(--maroon);box-shadow:0 0 0 3px var(--maroon-100,rgba(122,22,38,.14))}.sb-back{flex:0 0 auto;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:transparent;color:var(--ink);border:0;cursor:pointer;transition:background .18s var(--ease)}.sb-back:hover{background:var(--surface-2)}.sb-back svg{width:22px;height:22px}.search-bar.focus-bar .sb-search-ico{margin-left:2px}.search-bar.focus-bar input{font-size:15px;font-weight:500;padding:6px 4px}.voice-hint{display:flex;align-items:center;gap:8px;padding:8px 6px 0;color:var(--maroon);font-size:13px;font-weight:600;animation:vh-in .18s var(--ease)}.voice-hint .vh-text{letter-spacing:.01em}.voice-hint .vh-dot{width:6px;height:6px;border-radius:50%;background:var(--maroon);animation:vh-bounce 1s ease-in-out infinite}.voice-hint .vh-dot:nth-child(2){animation-delay:.15s}.voice-hint .vh-dot:nth-child(3){animation-delay:.3s}@keyframes vh-bounce{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-3px);opacity:1}}@keyframes vh-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.voice-hint .vh-dot,.voice-hint{animation:none}}html[data-route="search"] #s-empty,html[data-route="search"] #sr{padding:0 14px}.sr-list{padding-top:6px}.sr-card{position:relative;display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;padding:10px 12px 10px 10px;background:var(--surface);border:1px solid var(--line);border-radius:14px;margin-bottom:10px;color:inherit;text-decoration:none;transition:transform .16s var(--ease),border-color .16s var(--ease),box-shadow .18s var(--ease)}.sr-card:hover{border-color:var(--maroon-100,rgba(122,22,38,.35));box-shadow:0 6px 14px rgba(122,22,38,.08)}.sr-card:active{transform:scale(.995)}.sr-thumb{width:96px;height:96px;border-radius:12px;overflow:hidden;background:var(--surface-2);display:grid;place-items:center;flex-shrink:0}.sr-thumb img{width:100%;height:100%;object-fit:cover;display:block}.sr-thumb-fallback{width:100%;height:100%;display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:30px;color:var(--maroon);background:linear-gradient(180deg,var(--saffron-100),var(--cream-2))}.sr-body{min-width:0;display:flex;flex-direction:column;gap:3px}.sr-veg{width:14px;height:14px;border-radius:3px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid #16a34a;margin-bottom:2px}.sr-veg.is-nv{border-color:#dc2626}.sr-veg-dot{width:6px;height:6px;border-radius:50%;background:#16a34a}.sr-veg.is-nv .sr-veg-dot{background:#dc2626}.sr-name{font-family:var(--font-display);font-size:15px;font-weight:700;color:var(--ink);margin:0;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.sr-meta{font-size:12px;color:var(--muted)}.sr-meta .sr-cat{text-transform:capitalize}.sr-price{display:flex;align-items:baseline;gap:8px;margin-top:2px}.sr-price-now{font-weight:800;color:var(--ink);font-size:15px}.sr-mrp{color:var(--muted);text-decoration:line-through;font-size:12px}.sr-add{flex:0 0 auto;align-self:center;min-width:72px;padding:7px 14px;background:var(--surface);color:var(--maroon);border:1.5px solid var(--maroon);border-radius:10px;font-family:var(--font-display);font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:background .18s var(--ease),color .18s var(--ease),transform .12s var(--ease);-webkit-tap-highlight-color:transparent}.sr-add:hover{background:var(--maroon);color:var(--surface)}.sr-add:active{transform:scale(.95)}@media (max-width:380px){.sr-card{grid-template-columns:80px 1fr auto;padding:8px;gap:10px}.sr-thumb{width:80px;height:80px}.sr-add{min-width:60px;padding:6px 10px;font-size:12px}}.rs-block{margin:14px 2px 6px;animation:rs-fade .25s var(--ease)}.rs-head{display:flex;align-items:center;justify-content:space-between;padding:0 4px 8px}.rs-title{font-family:var(--font-display);font-size:13px;font-weight:700;color:var(--ink);letter-spacing:.04em;text-transform:uppercase}.rs-clear{font-size:12px;font-weight:600;color:var(--maroon);background:transparent;border:0;padding:4px 8px;cursor:pointer;border-radius:var(--r-pill)}.rs-clear:hover{background:var(--surface-2)}.rs-wrap{display:flex;flex-wrap:wrap;gap:8px 8px}.rs-chip{display:inline-flex;align-items:stretch;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-pill);overflow:hidden;transition:border-color .18s var(--ease),box-shadow .2s var(--ease),transform .18s var(--ease)}.rs-chip:hover{border-color:var(--maroon-100);box-shadow:0 2px 8px rgba(122,22,38,.08)}.rs-chip:active{transform:scale(.97)}.rs-chip-btn{background:transparent;border:0;cursor:pointer;padding:7px 12px;font-size:13px;font-weight:600;color:var(--ink);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rs-del{background:transparent;border:0;padding:4px 10px 4px 4px;color:var(--muted);font-size:16px;line-height:1;cursor:pointer;border-left:1px solid var(--line);transition:color .18s var(--ease),background .18s var(--ease)}.rs-del:hover{color:var(--maroon);background:var(--surface-2)}@keyframes rs-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.rs-block{animation:none}}.offer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:8px}.offer-card{padding:14px;border-radius:var(--r-md);color:white;background:linear-gradient(135deg,var(--maroon),var(--maroon-700));min-height:96px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--sh-1)}.offer-card.saffron{background:linear-gradient(135deg,var(--saffron-600),var(--saffron));color:var(--maroon-700)}.offer-card .title{font-family:var(--font-display);font-weight:800;font-size:18px;line-height:1.15}.offer-card .sub{font-size:12px;opacity:.9}.pd-hero{position:relative}.pd-hero img{width:100%;height:280px;object-fit:cover;border-radius:var(--r-lg)}.pd-hero .placeholder{width:100%;height:280px;border-radius:var(--r-lg);background:linear-gradient(135deg,var(--saffron-100),var(--cream-2));display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:60px;color:var(--maroon)}.pd-back{position:absolute;left:14px;top:14px;background:var(--surface);border-radius:50%;width:40px;height:40px;display:grid;place-items:center;box-shadow:var(--sh-1)}.pd-title{margin-top:16px}.pd-title h1{font-size:26px}.pd-meta{display:flex;align-items:center;gap:8px;margin-top:6px;flex-wrap:wrap}.pd-desc{color:var(--ink-2);margin-top:10px;font-size:14px}.pd-group{margin-top:20px;padding:14px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--sh-1)}.pd-group h3{margin-bottom:8px}.opt-row{display:flex;align-items:center;justify-content:space-between;padding:10px 4px;border-bottom:1px solid var(--line)}.opt-row:last-child{border-bottom:0}.opt-row label{display:flex;align-items:center;gap:10px;cursor:pointer}.opt-row .price{font-weight:700}input[type="radio"],input[type="checkbox"]{accent-color:var(--maroon);width:18px;height:18px}.summary{padding:14px;background:var(--surface);border-radius:var(--r-md);box-shadow:var(--sh-1)}.summary .row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;color:var(--ink-2)}.summary .row.total{border-top:1px dashed var(--line);padding-top:10px;margin-top:6px;font-weight:800;color:var(--ink);font-size:16px}.summary .row.saved{color:var(--success);font-weight:600}.ci{display:grid;grid-template-columns:60px 1fr auto;gap:12px;padding:12px;border-radius:var(--r-md);background:var(--surface);margin-bottom:10px;box-shadow:var(--sh-1);align-items:center}.ci .thumb{width:60px;height:60px;border-radius:var(--r-sm);overflow:hidden;background:var(--surface-2)}.ci .thumb img{width:100%;height:100%;object-fit:cover}.ci .name{font-weight:700;font-size:14px}.ci .variant{font-size:12px;color:var(--muted)}.ci .line-total{font-weight:800;color:var(--ink);font-size:14px;margin-top:4px}.coupon-row{display:flex;gap:8px;align-items:center;margin-top:10px}.coupon-row input{flex:1;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);font:inherit;text-transform:uppercase}.pay-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.pay-choice label{padding:14px;border-radius:var(--r-md);border:2px solid var(--line);background:var(--surface);text-align:center;font-weight:700;cursor:pointer;transition:all .2s var(--ease)}.pay-choice label.on{border-color:var(--maroon);background:var(--surface-2)}.pay-choice input{display:none}.order-card{padding:14px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--sh-1);margin-bottom:10px}.order-card .top{display:flex;justify-content:space-between;align-items:center}.order-card .code{font-family:var(--font-display);font-weight:700}.order-card .status{padding:4px 10px;border-radius:var(--r-pill);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;background:var(--saffron-100);color:var(--maroon-700)}.order-card .status.done{background:#dceee2;color:var(--success)}.order-card .status.cancel{background:#fadbd6;color:var(--danger)}.order-card .meta{color:var(--muted);font-size:12px;margin-top:4px}.order-card .amount{font-weight:800;margin-top:8px}.profile-hero{padding:24px 14px 16px;text-align:center;background:linear-gradient(180deg,var(--maroon),var(--maroon-700));color:white;margin:-12px -14px 12px;border-bottom-left-radius:var(--r-xl);border-bottom-right-radius:var(--r-xl)}.profile-hero .name{font-family:var(--font-display);font-size:22px;font-weight:800}.profile-hero .phone{opacity:.8;font-size:13px}.profile-hero .points-badge{display:inline-flex;align-items:center;gap:6px;margin-top:10px;background:var(--saffron);color:var(--maroon-700);padding:6px 14px;border-radius:var(--r-pill);font-weight:800;font-size:13px}.menu-list .item{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--r-md);background:var(--surface);margin-bottom:8px;box-shadow:var(--sh-1)}.menu-list .item svg{width:20px;height:20px;color:var(--maroon)}.menu-list .item .caret{margin-left:auto;color:var(--muted)}.filter-chips{display:flex;gap:8px;overflow-x:auto;padding:6px 2px;margin:8px 0}.filter-chips::-webkit-scrollbar{display:none}.ck-page{animation:ck-fade .3s var(--ease)}.ck-title{font-size:28px;margin:6px 2px 4px}.ck-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:18px;margin-top:16px;width:100%;text-align:left;display:block}.ck-card-head{display:flex;align-items:center;gap:10px}.ck-ic{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:12px;background:var(--maroon-100);color:var(--maroon)}.ck-ic svg{width:19px;height:19px}.ck-ic-success{background:rgba(46,125,79,.12);color:var(--success)}.ck-card-label{font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--ink)}.ck-change{margin-left:auto;color:var(--maroon);font-weight:700;font-size:13px;padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--maroon-100);transition:background .2s var(--ease)}.ck-change:active{background:var(--maroon-100)}.ck-addr-name{font-weight:700;margin:12px 0 2px;font-size:15px}.ck-addr-text{color:var(--ink-2);font-size:13.5px;line-height:1.5}.ck-addr-branch{display:flex;align-items:center;gap:6px;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line);color:var(--maroon);font-weight:700;font-size:13px}.ck-branch-ic{width:20px;height:20px;display:grid;place-items:center;color:var(--maroon)}.ck-branch-ic svg{width:18px;height:18px}.ck-dot{color:var(--muted)}.ck-eta{color:var(--ink-2);font-weight:600}.ck-coupon{display:flex;align-items:center;gap:12px}.ck-tap{cursor:pointer;transition:transform .12s var(--ease),box-shadow .2s var(--ease)}.ck-tap:active{transform:scale(.99);box-shadow:var(--sh-2)}.ck-coupon-main{flex:1}.ck-coupon-title{font-weight:700;font-size:15px}.ck-coupon-sub{color:var(--muted);font-size:12.5px;margin-top:2px}.ck-coupon.applied{border-color:rgba(46,125,79,.35);background:rgba(46,125,79,.05);animation:ck-pop .32s var(--ease)}.ck-chev{color:var(--muted);display:grid;place-items:center}.ck-chev svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.ck-remove{margin-left:auto;color:var(--danger);font-weight:700;font-size:13px;padding:6px 10px}.ck-reward-avail{margin-left:auto;font-size:12px;font-weight:700;color:var(--saffron-600);background:var(--saffron-100);padding:4px 10px;border-radius:var(--r-pill)}.ck-reward-row{display:flex;gap:10px;margin-top:14px}.ck-reward-row input{flex:1;min-width:0;padding:12px 14px;font-size:15px;font-weight:600;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--ink);transition:border-color .2s var(--ease)}.ck-reward-row input:focus{outline:none;border-color:var(--maroon)}.ck-max{flex:none;padding:10px 16px}.ck-reward-applied{margin-top:10px;color:var(--success);font-weight:700;font-size:13.5px;animation:ck-pop .32s var(--ease)}.ck-reward-hint{margin-top:10px;color:var(--muted);font-size:12.5px}.ck-pay{display:flex;align-items:center;gap:12px;padding:14px;margin-top:12px;border:1.5px solid var(--line);border-radius:var(--r-md);cursor:pointer;transition:border-color .2s var(--ease),background .2s var(--ease)}.ck-pay input{display:none}.ck-pay-dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--muted);flex:none;position:relative;transition:border-color .2s var(--ease)}.ck-pay.on{border-color:var(--maroon);background:var(--maroon-100)}.ck-pay.on .ck-pay-dot{border-color:var(--maroon)}.ck-pay.on .ck-pay-dot::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--maroon);animation:ck-pop .25s var(--ease)}.ck-pay-main{display:flex;flex-direction:column}.ck-pay-title{font-weight:700;font-size:14.5px}.ck-pay-sub{color:var(--muted);font-size:12px;margin-top:1px}.ck-pay-reason{color:var(--danger);font-size:12px;margin-top:2px;font-weight:600}.ck-pay.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.ck-bill{margin-top:14px}.ck-bill-row{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--ink-2);padding:7px 0}.ck-bill-row.ck-saved span:last-child{color:var(--success);font-weight:700}.ck-free{color:var(--success);font-weight:800;letter-spacing:.04em}.ck-bill-sep{height:1px;background:var(--line);margin:8px 0;border-top:1px dashed var(--line)}.ck-bill-total{display:flex;justify-content:space-between;align-items:center;margin-top:4px}.ck-bill-total span:first-child{font-family:var(--font-display);font-weight:800;font-size:18px;color:var(--ink)}.ck-bill-total span:last-child{font-family:var(--font-display);font-weight:800;font-size:22px;color:var(--maroon)}.ck-notice{margin-top:16px;padding:12px 14px;border-radius:var(--r-md);background:rgba(197,63,46,.08);border:1px solid rgba(197,63,46,.3);color:var(--danger);font-weight:600;font-size:13.5px}.ck-sticky-spacer{height:0}.ck-sticky{position:fixed;left:0;right:0;bottom:var(--bottom-container-h,calc(env(safe-area-inset-bottom) + 68px));z-index:60;max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;gap:14px;padding:12px 16px 12px 16px;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(34,25,19,.10);animation:ck-slide-up .32s var(--ease)}.ck-sticky-total{display:flex;flex-direction:column;line-height:1.2}.ck-sticky-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.ck-sticky-amt{font-family:var(--font-display);font-weight:800;font-size:22px;color:var(--ink)}.ck-place{flex:1;padding:15px 20px;font-size:16px}.ck-place[disabled]{opacity:.5;box-shadow:none;filter:grayscale(.3)}.ck-place-arrow{width:20px;height:20px;transition:transform .2s var(--ease)}.ck-place:active .ck-place-arrow{transform:translateX(3px)}.ck-place.loading{pointer-events:none}.cp-sheet{padding-bottom:8px}.cp-row{display:flex;gap:10px}.cp-row input{flex:1;min-width:0;padding:13px 14px;font-size:15px;border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--ink);text-transform:uppercase}.cp-row input:focus{outline:none;border-color:var(--maroon)}.cp-list{margin-top:16px;display:flex;flex-direction:column;gap:10px}.cp-offer{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:14px;border:1px dashed var(--maroon-100);border-radius:var(--r-md);background:var(--surface);transition:background .2s var(--ease)}.cp-offer:active{background:var(--maroon-100)}.cp-offer-ic{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--saffron-100);color:var(--saffron-600)}.cp-offer-ic svg{width:18px;height:18px}.cp-offer-main{flex:1}.cp-offer-code{font-weight:800;font-size:14px;letter-spacing:.03em}.cp-offer-title{color:var(--muted);font-size:12.5px;margin-top:1px}.cp-offer-apply{color:var(--maroon);font-weight:800;font-size:12px}.cp-empty{color:var(--muted);text-align:center;padding:16px}.ck-anim{animation:ck-rise .38s var(--ease) both}.ck-anim:nth-child(1){animation-delay:.02s}.ck-anim:nth-child(2){animation-delay:.06s}.ck-anim:nth-child(3){animation-delay:.10s}.ck-anim:nth-child(4){animation-delay:.14s}.ck-anim:nth-child(5){animation-delay:.18s}@keyframes ck-fade{from{opacity:0}to{opacity:1}}@keyframes ck-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes ck-pop{from{transform:scale(.8);opacity:.4}to{transform:scale(1);opacity:1}}@keyframes ck-slide-up{from{transform:translateY(100%)}to{transform:none}}@media (prefers-reduced-motion:reduce){.ck-anim,.ck-page,.ck-sticky{animation:none !important}}.home-top{padding-top:2px;padding-bottom:2px}.hero-strip.compact{padding:6px 4px 2px}.hero-strip.compact .hi{font-family:var(--font-display);font-size:22px;font-weight:800;color:var(--ink);letter-spacing:-.01em;display:inline-flex;align-items:center;gap:6px}.hero-strip.compact .hi .wave{display:inline-block;animation:wave 2.4s ease-in-out infinite;transform-origin:70% 70%}@keyframes wave{0%,60%,100%{transform:rotate(0deg)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}}.hero-strip.compact .sub{color:var(--muted);font-size:12.5px;margin-top:2px}.search-bar.premium{margin:10px 2px 6px;padding:10px 14px;border:1px solid var(--line);box-shadow:0 1px 2px rgba(34,25,19,.04),0 8px 22px rgba(122,22,38,.06);transition:box-shadow .25s var(--ease),border-color .25s var(--ease),transform .2s var(--ease)}.search-bar.premium:hover,.search-bar.premium:focus-within{border-color:var(--maroon-100);box-shadow:0 2px 4px rgba(34,25,19,.05),0 14px 30px rgba(122,22,38,.12);transform:translateY(-1px)}.search-bar.premium svg{color:var(--maroon)}.search-bar.premium .sb-mic svg{color:currentColor}.search-bar.premium input{font-size:14px;transition:opacity .2s var(--ease),transform .2s var(--ease)}.search-bar.premium input.sb-fade{opacity:0;transform:translateY(-4px)}.search-bar.premium input::placeholder{color:var(--muted);font-weight:500}.hero-banner{display:block;position:relative;margin:10px 2px 8px;padding:18px 20px;border-radius:var(--r-lg);color:white;background:linear-gradient(135deg,#8a1a2c 0%,var(--maroon) 45%,#4a0812 100%);overflow:hidden;box-shadow:0 10px 28px rgba(122,22,38,.28);text-decoration:none;min-height:128px;isolation:isolate;animation:hbFloat 5.5s ease-in-out infinite;transition:transform .18s var(--ease),box-shadow .25s var(--ease)}.hero-banner:hover,.hero-banner:active{transform:translateY(-2px);box-shadow:0 16px 36px rgba(122,22,38,.36)}.hero-banner::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% -10%,rgba(242,160,61,.55) 0%,transparent 55%),radial-gradient(circle at -10% 110%,rgba(255,246,236,.14) 0%,transparent 55%);z-index:0;pointer-events:none}.hero-banner::after{content:"";position:absolute;right:-30px;top:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,var(--saffron) 0%,transparent 65%);opacity:.35;z-index:0;pointer-events:none}.hero-banner.shipping{background:linear-gradient(135deg,#5f0e1c 0%,#a94420 60%,var(--saffron-600) 100%)}.hero-banner .hb-content{position:relative;z-index:1;display:flex;flex-direction:column;gap:6px}.hero-banner .hb-eyebrow{display:inline-block;align-self:flex-start;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;padding:4px 10px;border-radius:var(--r-pill);background:rgba(255,255,255,.14);color:var(--saffron-100);font-weight:700;backdrop-filter:blur(4px)}.hero-banner h3{color:white;font-family:var(--font-display);font-size:22px;font-weight:800;line-height:1.15;letter-spacing:-.01em;margin:4px 0 0}.hero-banner p{color:rgba(255,246,236,.9);font-size:13px;margin:2px 0 0;max-width:82%}.hero-banner .hb-cta{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;margin-top:10px;background:var(--saffron);color:var(--maroon-700);font-weight:800;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;padding:8px 14px;border-radius:var(--r-pill);box-shadow:0 6px 14px rgba(217,126,24,.35);transition:transform .15s var(--ease),box-shadow .2s var(--ease)}.hero-banner:hover .hb-cta,.hero-banner:active .hb-cta{transform:translateY(-1px);box-shadow:0 10px 20px rgba(217,126,24,.45)}.hero-banner .hb-cta svg{width:14px;height:14px}@keyframes hbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@media (prefers-reduced-motion:reduce){.hero-banner,.hero-strip.compact .hi .wave{animation:none}}.section-header{margin:20px 2px 10px;display:flex;flex-direction:column;gap:2px}.section-header .sh-title{display:flex;align-items:center;gap:8px}.section-header .sh-title h2{font-family:var(--font-display);font-size:18px;font-weight:800;color:var(--ink);letter-spacing:-.01em}.section-header .sh-badge{font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:var(--r-pill);background:var(--maroon);color:white;font-weight:800}.section-header .sh-badge.saffron{background:var(--saffron);color:var(--maroon-700)}.section-header .sh-sub{color:var(--muted);font-size:12px}.cats-rail{display:flex;flex-wrap:nowrap;gap:14px;padding:10px 14px 12px;margin:2px -14px 6px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:none;scroll-padding-inline:14px;overscroll-behavior-x:contain}.cats-rail::-webkit-scrollbar{display:none;height:0;width:0}.cat-chip{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:var(--ink);width:64px;scroll-snap-align:start;transition:transform .18s var(--ease)}.cat-chip:active{transform:scale(.94)}.cat-chip .ct-thumb{width:52px;height:52px;border-radius:50%;background:linear-gradient(180deg,var(--saffron-100),var(--cream-2));display:grid;place-items:center;overflow:hidden;box-shadow:0 3px 8px rgba(122,22,38,.08);border:2px solid var(--surface);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .2s var(--ease)}.cat-chip:hover .ct-thumb{transform:translateY(-2px) scale(1.04);box-shadow:0 8px 16px rgba(122,22,38,.16)}.cat-chip.is-active .ct-thumb,.cat-chip:active .ct-thumb{border-color:var(--maroon);box-shadow:0 0 0 3px var(--maroon-100),0 6px 14px rgba(122,22,38,.22)}.cat-chip .ct-thumb img{width:100%;height:100%;object-fit:cover}.cat-chip .ct-letter{font-family:var(--font-display);font-size:20px;font-weight:800;color:var(--maroon)}.cat-chip .ct-name{font-size:11px;font-weight:600;line-height:1.15;text-align:center;color:var(--ink-2);max-width:100%;letter-spacing:.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cat-chip.is-active .ct-name{color:var(--maroon);font-weight:700}.cats-rail .cat-skel{flex:0 0 auto;width:52px;height:52px;border-radius:50%;background:linear-gradient(90deg,var(--surface-2) 0%,var(--line) 50%,var(--surface-2) 100%);background-size:200% 100%;animation:shimmer 1.1s infinite}.prod-card.premium{grid-template-columns:104px 1fr;padding:12px;border-radius:18px;background:var(--surface);box-shadow:0 1px 2px rgba(34,25,19,.04),0 8px 22px rgba(34,25,19,.06);border:1px solid rgba(239,225,207,.6);transition:transform .16s var(--ease),box-shadow .24s var(--ease);overflow:hidden;min-height:128px}.prod-card.premium:hover{transform:translateY(-2px);box-shadow:0 3px 6px rgba(34,25,19,.05),0 16px 32px rgba(34,25,19,.10)}.prod-card.premium:active{transform:translateY(0) scale(.995)}.prod-card.premium>.thumb{position:relative;width:104px;height:104px;border-radius:14px;background:linear-gradient(180deg,var(--cream-2),var(--surface-2));overflow:hidden}.prod-card.premium>.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s var(--ease)}.prod-card.premium:hover>.thumb img{transform:scale(1.06)}.prod-card.premium .pc-off{position:absolute;left:6px;top:6px;background:var(--pistachio);color:white;font-size:10px;font-weight:800;letter-spacing:.04em;padding:3px 7px;border-radius:var(--r-pill);box-shadow:0 3px 8px rgba(122,157,62,.35)}.prod-card.premium .pc-body{min-width:0;padding-right:60px}.prod-card.premium h3{font-family:var(--font-display);font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.2;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.prod-card.premium .desc{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.prod-card.premium .price-row{margin-top:8px;display:flex;align-items:baseline;gap:8px}.prod-card.premium .price{font-family:var(--font-display);font-weight:800;font-size:17px;color:var(--ink);letter-spacing:-.01em}.prod-card.premium .mrp{color:var(--muted);text-decoration:line-through;font-weight:500;font-size:12px}.prod-card.premium .meta{margin-top:6px;font-size:11px;color:var(--muted);display:flex;align-items:center;gap:8px}.prod-card.premium .meta .meta-eta{display:inline-flex;align-items:center;gap:4px}.prod-card.premium .add-btn.premium{position:absolute;right:12px;bottom:12px;background:linear-gradient(135deg,#ffffff 0%,#fff6ec 100%);color:var(--maroon-700);border:1.5px solid var(--maroon);font-weight:800;letter-spacing:.06em;padding:7px 16px;border-radius:var(--r-pill);text-transform:uppercase;font-size:11.5px;box-shadow:0 4px 10px rgba(122,22,38,.15);transition:transform .12s var(--ease),background .2s var(--ease),color .2s var(--ease)}.prod-card.premium .add-btn.premium:hover{background:linear-gradient(135deg,var(--maroon),var(--maroon-700));color:white}.prod-card.premium .add-btn.premium:active{transform:translateY(1px) scale(.97)}.prod-list{display:flex;flex-direction:column;gap:12px}.empty.premium{padding:40px 20px;text-align:center;color:var(--muted)}.empty.premium .empty-icon{width:88px;height:88px;margin:0 auto 14px;border-radius:50%;background:linear-gradient(180deg,var(--saffron-100),var(--cream-2));display:grid;place-items:center;box-shadow:0 8px 20px rgba(217,126,24,.15);border:2px solid var(--surface);position:relative}.empty.premium .empty-icon::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px dashed var(--maroon-100);opacity:.8;animation:emptySpin 14s linear infinite}.empty.premium .ei-letter{font-family:var(--font-display);font-size:40px;font-weight:800;color:var(--maroon)}.empty.premium h3{color:var(--ink);font-family:var(--font-display);font-size:18px;font-weight:800}.empty.premium p{margin-top:4px;font-size:13px;color:var(--muted);max-width:320px;margin-left:auto;margin-right:auto}.empty.premium .empty-cta{display:inline-flex;align-items:center;gap:6px;margin-top:16px;background:linear-gradient(135deg,var(--maroon),var(--maroon-700));color:white;font-weight:800;font-size:13.5px;padding:10px 20px;border-radius:var(--r-pill);box-shadow:0 8px 18px rgba(122,22,38,.28);transition:transform .12s var(--ease),box-shadow .2s var(--ease);text-decoration:none}.empty.premium .empty-cta:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(122,22,38,.34)}.empty.premium .empty-cta:active{transform:translateY(1px) scale(.98)}@keyframes emptySpin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.empty.premium .empty-icon::before{animation:none}}.reveal{opacity:0;transform:translateY(10px);transition:opacity .45s var(--ease),transform .45s var(--ease);will-change:opacity,transform}.reveal.shown{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}.festival-greeting,.festival-countdown,.festival-section,.hero-banner.festival{--festival-color:var(--maroon);--festival-bg:color-mix(in srgb,var(--festival-color) 10%,var(--surface));--festival-border:color-mix(in srgb,var(--festival-color) 35%,transparent)}.festival-greeting{display:flex;align-items:center;gap:10px;margin:8px 0 12px;padding:10px 14px;border-radius:999px;background:var(--festival-bg);border:1px solid var(--festival-border);color:color-mix(in srgb,var(--festival-color) 75%,#1a1a1a);font-weight:600;font-size:14px;box-shadow:0 2px 10px color-mix(in srgb,var(--festival-color) 12%,transparent)}.festival-greeting .fg-icon{font-size:20px;line-height:1}.festival-greeting .fg-text{flex:1;min-width:0}.festival-countdown{margin:8px 0 16px;padding:14px 16px 16px;border-radius:18px;background:radial-gradient(120% 100% at 0% 0%,color-mix(in srgb,var(--festival-color) 22%,transparent),transparent 60%),linear-gradient(135deg,var(--festival-color),color-mix(in srgb,var(--festival-color) 60%,#1a0a10));color:#fff;box-shadow:0 10px 24px color-mix(in srgb,var(--festival-color) 25%,transparent);position:relative;overflow:hidden}.festival-countdown::after{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 90% 20%,rgba(255,255,255,.18),transparent 40%);pointer-events:none}.festival-countdown .fc-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}.festival-countdown .fc-icon{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:22px;backdrop-filter:blur(6px)}.festival-countdown .fc-name{font-family:var(--font-display,inherit);font-weight:800;font-size:20px;letter-spacing:.2px}.festival-countdown .fc-sub{font-size:12px;opacity:.85;text-transform:uppercase;letter-spacing:1px}.festival-countdown .fc-cells{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.festival-countdown .fc-cell{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:10px 6px 8px;text-align:center;backdrop-filter:blur(4px)}.festival-countdown .fc-num{display:block;font-family:var(--font-display,inherit);font-variant-numeric:tabular-nums;font-weight:800;font-size:24px;line-height:1}.festival-countdown .fc-unit{display:block;margin-top:4px;font-size:10px;letter-spacing:1px;opacity:.85;text-transform:uppercase}.hero-banner.festival{background:linear-gradient(135deg,color-mix(in srgb,var(--festival-color) 92%,#000) 0%,color-mix(in srgb,var(--festival-color) 60%,#1a0a10) 100%);color:#fff;border:1px solid var(--festival-border);box-shadow:0 10px 28px color-mix(in srgb,var(--festival-color) 22%,transparent)}.hero-banner.festival .hb-eyebrow{background:rgba(255,255,255,.18);color:#fff}.hero-banner.festival .hb-cta{background:#fff;color:var(--festival-color)}.festival-section{margin-top:8px;padding:12px 0 4px}.festival-section .festival-header .sh-title h2{color:color-mix(in srgb,var(--festival-color) 80%,#1a1a1a)}.festival-section .festival-badge{background:var(--festival-color);color:#fff;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:700;letter-spacing:.3px}@media (max-width:380px){.festival-countdown .fc-num{font-size:20px}.festival-countdown .fc-icon{width:36px;height:36px;font-size:20px}.festival-countdown .fc-name{font-size:18px}}.festival-page{--festival-color:var(--maroon);--festival-bg:color-mix(in srgb,var(--festival-color) 10%,var(--surface));--festival-border:color-mix(in srgb,var(--festival-color) 35%,transparent);padding-bottom:32px}.festival-cta{display:inline-flex;align-items:center;gap:8px;margin:12px auto 4px;padding:11px 22px;border-radius:999px;background:var(--festival-color,var(--maroon));color:#fff !important;font-weight:700;font-size:14px;letter-spacing:.2px;box-shadow:0 8px 20px color-mix(in srgb,var(--festival-color) 30%,transparent);transition:transform .15s ease,box-shadow .15s ease}.festival-cta:active{transform:translateY(1px)}.festival-cta:hover{box-shadow:0 10px 24px color-mix(in srgb,var(--festival-color) 40%,transparent)}#festival-section{display:flex;flex-direction:column}#festival-section>.festival-cta{align-self:center}.festival-carousel{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 16px 8px;margin:0 -16px;scrollbar-width:none;scroll-padding-left:16px}.festival-carousel::-webkit-scrollbar{display:none}.festival-carousel>.skel,.festival-carousel>.skel-card{flex:0 0 44%;max-width:170px;scroll-snap-align:start}.fest-card{flex:0 0 44%;max-width:170px;min-width:140px;scroll-snap-align:start;background:var(--surface,#fff);border:1px solid var(--hp-line,#EEEDEA);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 2px 6px rgba(15,15,15,.04);transition:transform .18s ease,box-shadow .18s ease;cursor:pointer}.fest-card:hover{transform:translateY(-2px);box-shadow:0 8px 16px rgba(15,15,15,.08)}.fest-card:active{transform:translateY(0) scale(.995)}.fest-card .fc-thumb{position:relative;aspect-ratio:1 / 1;background:var(--surface-2,#f7f4ee);overflow:hidden}.fest-card .fc-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.fest-card:hover .fc-thumb img{transform:scale(1.05)}.fest-card .fc-ph{width:100%;height:100%;display:grid;place-items:center;font-weight:700;font-size:32px;color:var(--hp-maroon,#8B1E3F);background:linear-gradient(135deg,#fef3c7,#fde68a)}.fest-card .fc-off{position:absolute;top:6px;left:6px;background:var(--hp-red,#DC2626);color:#fff;font-size:9.5px;font-weight:700;letter-spacing:.3px;padding:3px 6px;border-radius:4px;line-height:1}.fest-card .fc-body{padding:8px 10px 10px;display:flex;flex-direction:column;gap:6px;flex:1}.fest-card .fc-name{font-size:12.5px;font-weight:600;color:var(--hp-ink,#1c1917);line-height:1.25;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}.fest-card .fc-price-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto}.fest-card .fc-price-wrap{display:flex;flex-direction:column;line-height:1.1}.fest-card .fc-price{font-size:13.5px;font-weight:700;color:var(--hp-ink,#1c1917)}.fest-card .fc-mrp{font-size:10.5px;font-weight:500;color:var(--hp-ink-3,#9ca3af);text-decoration:line-through}.fest-card .fc-add{border:1px solid var(--hp-maroon,#8B1E3F);color:var(--hp-maroon,#8B1E3F);background:#fff;border-radius:8px;padding:5px 10px;font-size:11px;font-weight:700;letter-spacing:.3px;cursor:pointer;transition:background .15s ease,color .15s ease,transform .1s ease}.fest-card .fc-add:hover{background:var(--hp-maroon,#8B1E3F);color:#fff}.fest-card .fc-add:active{transform:translateY(1px) scale(.97)}.festival-carousel>.empty{flex:0 0 100%;scroll-snap-align:none}@media (min-width:640px){.fest-card{flex-basis:32%}}@media (min-width:900px){.fest-card{flex-basis:200px;max-width:200px}}.fp-hero{position:relative;border-radius:24px;overflow:hidden;margin:8px 12px 20px;min-height:340px;color:#fff;isolation:isolate;box-shadow:0 12px 32px color-mix(in srgb,var(--festival-color) 22%,transparent)}.fp-hero-media{position:absolute;inset:0;z-index:0}.fp-hero-media img{width:100%;height:100%;object-fit:cover}.fp-hero-placeholder{width:100%;height:100%;display:grid;place-items:center;font-size:96px;background:linear-gradient(135deg,var(--festival-color),color-mix(in srgb,var(--festival-color) 55%,#1a0a10))}.fp-hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.55) 55%,rgba(0,0,0,.85) 100%),radial-gradient(120% 100% at 0% 100%,color-mix(in srgb,var(--festival-color) 55%,transparent) 0%,transparent 55%)}.fp-hero-body{position:relative;z-index:2;padding:22px 18px 20px;min-height:340px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px}.fp-hero-chip{align-self:flex-start;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}.fp-hero-title{font-family:var(--font-display,inherit);font-weight:800;font-size:34px;line-height:1.05;margin:4px 0 2px;text-shadow:0 2px 14px rgba(0,0,0,.35)}.fp-hero-greet{font-size:14px;opacity:.95;max-width:380px;margin:0}.fp-countdown{margin-top:8px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(6px)}.fp-cd-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;opacity:.9;margin-bottom:6px}.fp-cd-cells{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.fp-cd-cell{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:8px 4px 6px;text-align:center}.fp-cd-num{display:block;font-family:var(--font-display,inherit);font-variant-numeric:tabular-nums;font-weight:800;font-size:20px;line-height:1}.fp-cd-unit{display:block;margin-top:3px;font-size:10px;letter-spacing:.8px;opacity:.85;text-transform:uppercase}.fp-hero-cta{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:12px 22px;border-radius:999px;background:#fff;color:color-mix(in srgb,var(--festival-color) 80%,#1a1a1a) !important;font-weight:800;font-size:14px;box-shadow:0 8px 20px rgba(0,0,0,.25);transition:transform .15s ease,box-shadow .15s ease}.fp-hero-cta:hover{box-shadow:0 10px 24px rgba(0,0,0,.32)}.fp-hero-cta:active{transform:translateY(1px)}.fp-description{margin:8px 16px 20px;padding:18px 18px 16px;border-radius:18px;background:var(--festival-bg);border:1px solid var(--festival-border)}.fp-h2{font-family:var(--font-display,inherit);font-weight:800;font-size:20px;margin:0 0 8px;color:color-mix(in srgb,var(--festival-color) 80%,#1a1a1a)}.fp-description p{margin:0;color:var(--ink-2,#4a4a4a);font-size:14.5px;line-height:1.55}.fp-toolbar{margin:0 12px 12px;padding:12px;border-radius:16px;background:var(--surface,#fff);border:1px solid var(--surface-2,#f2ede4);display:flex;flex-direction:column;gap:10px;box-shadow:0 2px 10px rgba(0,0,0,.03)}.fp-tb-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.fp-tb-field{flex:1 1 45%;min-width:140px;display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:var(--ink-2,#4a4a4a);text-transform:uppercase;letter-spacing:.5px}.fp-tb-field select,.fp-tb-field input[type=number]{padding:9px 10px;border:1.5px solid var(--surface-2,#eee);border-radius:10px;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink,#1a1a1a);background:#fff;transition:border-color .15s ease}.fp-tb-field select:focus,.fp-tb-field input:focus{outline:none;border-color:var(--festival-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--festival-color) 20%,transparent)}.fp-tb-range{flex-direction:row;align-items:center;gap:6px;flex:1 1 100%}.fp-tb-range span:first-child{min-width:46px}.fp-tb-range input{width:90px;flex:1}.fp-tb-dash{color:var(--ink-2,#999);font-weight:400}.fp-tb-check{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--ink,#1a1a1a);cursor:pointer}.fp-tb-check input{accent-color:var(--festival-color);width:18px;height:18px}.fp-section{margin:6px 0 14px}.fp-section .festival-header{padding:4px 12px 6px}.fp-section .sh-title h2{display:flex;align-items:center;gap:8px;color:color-mix(in srgb,var(--festival-color) 80%,#1a1a1a)}.fp-sec-icon{font-size:20px}.fp-empty-inline{padding:20px 16px;text-align:center;color:var(--ink-2,#666);font-size:14px;background:var(--surface-2,#f7f2ea);border-radius:12px;margin:0 12px}.fp-order-cta-wrap{display:flex;justify-content:center;margin:24px 12px 8px}.fp-order-cta{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:999px;background:linear-gradient(135deg,var(--festival-color),color-mix(in srgb,var(--festival-color) 65%,#1a0a10));color:#fff !important;font-weight:800;font-size:15px;letter-spacing:.3px;box-shadow:0 12px 28px color-mix(in srgb,var(--festival-color) 32%,transparent);transition:transform .15s ease,box-shadow .15s ease}.fp-order-cta:hover{box-shadow:0 14px 32px color-mix(in srgb,var(--festival-color) 42%,transparent)}.fp-order-cta:active{transform:translateY(1px)}.fp-related{margin:12px 12px 8px}.fp-related-inner{border-radius:20px;padding:18px 18px;background:linear-gradient(135deg,color-mix(in srgb,var(--festival-color) 92%,#000) 0%,color-mix(in srgb,var(--festival-color) 60%,#1a0a10) 100%);color:#fff;box-shadow:0 10px 24px color-mix(in srgb,var(--festival-color) 22%,transparent)}.fp-related-eyebrow{display:inline-block;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.18);font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase}.fp-related h3{font-family:var(--font-display,inherit);font-size:22px;font-weight:800;margin:8px 0 4px}.fp-related p{margin:0 0 12px;opacity:.92;font-size:13.5px}.fp-related-cta{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border-radius:999px;background:#fff;color:color-mix(in srgb,var(--festival-color) 80%,#1a1a1a) !important;font-weight:700;font-size:13px}.fp-loading{padding:12px}.reveal{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}.reveal.shown{opacity:1;transform:none}@media (max-width:380px){.fp-hero-title{font-size:28px}.fp-cd-num{font-size:18px}.fp-tb-field{flex-basis:100%}}.fp-hero-chips{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start}.fp-mode-chip{padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);font-size:11px;font-weight:700;letter-spacing:.3px}.hp-root{padding:4px 0 24px}.hp-top{padding:12px 16px 4px}.hp-greet{margin-bottom:12px}.hp-greet .hi{font-family:var(--font-display,inherit);font-weight:800;font-size:22px;line-height:1.2;color:var(--ink,#1a1a1a)}.hp-greet .sub{color:var(--ink-2,#666);font-size:13px;margin-top:2px}.hp-search{border-radius:999px !important;padding:11px 14px !important;background:var(--surface,#fff) !important;border:1px solid var(--surface-2,#f0e9dc) !important;box-shadow:0 4px 14px rgba(0,0,0,.04) !important}.hp-quick-chips{display:flex;gap:10px;overflow-x:auto;padding:12px 16px 4px;scrollbar-width:none}.hp-quick-chips::-webkit-scrollbar{display:none}.hp-qchip{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;background:var(--surface,#fff);border:1px solid var(--surface-2,#f0e9dc);color:var(--ink,#1a1a1a) !important;font-weight:700;font-size:13px;box-shadow:0 2px 8px rgba(0,0,0,.03);transition:transform .15s ease,box-shadow .15s ease,background .15s ease;white-space:nowrap}.hp-qchip .qi{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--saffron,#f2a03d) 22%,transparent);font-size:15px}.hp-qchip:active{transform:translateY(1px)}.hp-qchip.highlight{background:color-mix(in srgb,var(--maroon,#7a1626) 8%,#fff);border-color:color-mix(in srgb,var(--maroon,#7a1626) 30%,transparent);color:var(--maroon,#7a1626) !important}.hp-qchip.highlight .qi{background:color-mix(in srgb,var(--maroon,#7a1626) 18%,transparent)}.hp-offer-strip{display:flex;gap:10px;overflow-x:auto;padding:12px 16px 6px;scrollbar-width:none}.hp-offer-strip::-webkit-scrollbar{display:none}.hp-offer-card{flex:1 1 auto;min-width:180px;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:var(--surface,#fff);border:1px solid var(--surface-2,#f0e9dc);color:var(--ink,#1a1a1a) !important;box-shadow:0 2px 8px rgba(0,0,0,.03);text-decoration:none}.hp-offer-card .oc-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--saffron,#f2a03d) 22%,transparent);font-size:18px;flex:0 0 38px}.hp-offer-card .oc-body{display:flex;flex-direction:column;line-height:1.15}.hp-offer-card .oc-body b{font-size:13px;font-weight:700}.hp-offer-card .oc-body span{font-size:11px;color:var(--ink-2,#6b6b6b)}.hp-section-head{display:flex;align-items:center;justify-content:space-between;padding:18px 16px 8px}.hp-h2{font-family:var(--font-display,inherit);font-weight:800;font-size:18px;margin:0;color:var(--ink,#1a1a1a);letter-spacing:-.1px}.hp-view-all{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;color:var(--maroon,#7a1626) !important;text-decoration:none}.hp-cats-rail{display:flex !important;gap:14px !important;padding:4px 16px 6px !important;overflow-x:auto !important;scrollbar-width:none;scroll-snap-type:x mandatory}.hp-cats-rail::-webkit-scrollbar{display:none}.hp-cat-chip{flex:0 0 auto;display:flex !important;flex-direction:column;align-items:center;gap:6px !important;width:78px !important;scroll-snap-align:start;text-decoration:none}.hp-cat-chip .ct-thumb{width:68px !important;height:68px !important;border-radius:50% !important;overflow:hidden;background:color-mix(in srgb,var(--saffron,#f2a03d) 18%,#fff);display:grid;place-items:center;border:1.5px solid var(--surface-2,#f0e9dc);box-shadow:0 4px 12px rgba(0,0,0,.05);transition:transform .18s ease,box-shadow .18s ease}.hp-cat-chip:active .ct-thumb{transform:scale(.96)}.hp-cat-chip .ct-thumb img{width:100%;height:100%;object-fit:cover}.hp-cat-chip .ct-thumb .ct-letter{font-family:var(--font-display,inherit);font-weight:800;font-size:26px;color:var(--maroon,#7a1626)}.hp-cat-chip .ct-name{font-size:12px;font-weight:700;color:var(--ink,#1a1a1a);text-align:center;line-height:1.15;max-width:78px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.prod-rail.hp-rail{display:flex !important;gap:12px !important;padding:4px 16px 8px !important;overflow-x:auto !important;scrollbar-width:none;scroll-snap-type:x mandatory}.prod-rail.hp-rail::-webkit-scrollbar{display:none}.hp-card{background:var(--surface,#fff);border:1px solid var(--surface-2,#f0e9dc);border-radius:16px;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.04);transition:transform .15s ease,box-shadow .18s ease;scroll-snap-align:start}.hp-card:active{transform:translateY(1px)}.hp-card.v{flex:0 0 168px;width:168px;display:flex;flex-direction:column}.hp-card.v.mini{flex-basis:148px;width:148px}.hp-thumb{position:relative;width:100%;aspect-ratio:1 / 1;background:color-mix(in srgb,var(--saffron,#f2a03d) 12%,#fff);display:grid;place-items:center;overflow:hidden}.hp-thumb img{width:100%;height:100%;object-fit:cover}.hp-thumb-ph{font-family:var(--font-display,inherit);font-weight:800;font-size:42px;color:var(--maroon,#7a1626)}.hp-badge{position:absolute;top:8px;left:8px;padding:3px 8px;border-radius:6px;font-size:10px;font-weight:800;letter-spacing:.3px;color:#fff;text-transform:none}.hp-badge-best{background:linear-gradient(135deg,#d97e18,#f2a03d);color:#fff}.hp-badge-top{background:linear-gradient(135deg,#f2b53d,#f2a03d);color:#4d2b00}.hp-badge-ord{background:linear-gradient(135deg,#7a1626,#5f0e1c);color:#fff}.hp-badge-new{background:linear-gradient(135deg,#0f7a3a,#2ba95a);color:#fff}.hp-off{position:absolute;top:8px;right:8px;padding:3px 7px;border-radius:6px;font-size:10px;font-weight:800;letter-spacing:.3px;background:rgba(255,255,255,.94);color:var(--maroon,#7a1626);border:1px solid rgba(0,0,0,.05)}.hp-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:6px}.hp-name{margin:0;font-family:var(--font-display,inherit);font-weight:700;font-size:14px;color:var(--ink,#1a1a1a);line-height:1.2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;min-height:34px}.hp-meta{font-size:11px;color:var(--ink-2,#6b6b6b);display:flex;gap:6px;align-items:center}.hp-eta{font-weight:600}.hp-price-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto}.hp-price-wrap{display:flex;align-items:baseline;gap:6px;min-width:0}.hp-price{font-family:var(--font-display,inherit);font-weight:800;font-size:15px;color:var(--ink,#1a1a1a)}.hp-mrp{font-size:11px;color:var(--ink-2,#9a9a9a);text-decoration:line-through}.hp-add{flex:0 0 auto;width:32px;height:32px;border-radius:10px;border:0;background:var(--maroon,#7a1626);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 12px color-mix(in srgb,var(--maroon,#7a1626) 30%,transparent);transition:transform .12s ease,box-shadow .18s ease}.hp-add:active{transform:scale(.94)}.hp-add:hover{box-shadow:0 6px 16px color-mix(in srgb,var(--maroon,#7a1626) 45%,transparent)}.hp-add.pill{width:auto;height:auto;padding:8px 18px;border-radius:999px;font-weight:800;font-size:12px;letter-spacing:.3px;background:color-mix(in srgb,var(--maroon,#7a1626) 8%,#fff);color:var(--maroon,#7a1626);border:1.5px solid color-mix(in srgb,var(--maroon,#7a1626) 30%,transparent);box-shadow:none}.hp-add.pill:hover{background:var(--maroon,#7a1626);color:#fff}.hp-card.h{flex:0 0 260px;width:260px;display:grid;grid-template-columns:72px 1fr auto;gap:10px;align-items:center;padding:10px}.hp-card.h .hp-thumb.sm{width:72px;height:72px;aspect-ratio:auto;border-radius:12px}.hp-h-body{min-width:0;display:flex;flex-direction:column;gap:2px}.hp-variant{font-size:11px;color:var(--ink-2,#7a7a7a)}.hp-banner{margin:8px 16px 4px !important;border-radius:20px !important;overflow:hidden}.prod-rail.hp-rail .skel-card{flex:0 0 168px;width:168px;border-radius:16px;padding:10px;display:flex;flex-direction:column;gap:8px;background:var(--surface,#fff);border:1px solid var(--surface-2,#f0e9dc);align-items:stretch}.prod-rail.hp-rail .skel-card .skel-thumb{width:100%;height:120px;border-radius:12px}.reveal{opacity:0;transform:translateY(6px);transition:opacity .5s ease,transform .5s ease}.reveal.shown{opacity:1;transform:none}@media (max-width:380px){.hp-card.v{flex-basis:152px;width:152px}.hp-cat-chip{width:72px !important}.hp-cat-chip .ct-thumb{width:60px !important;height:60px !important}.hp-greet .hi{font-size:20px}}.hs-root{--slide-color:var(--maroon,#7a1626);margin:8px 16px 4px;border-radius:22px;overflow:hidden;position:relative;background:#111;box-shadow:0 12px 28px rgba(0,0,0,.08)}.hs-viewport{overflow:hidden;border-radius:22px;aspect-ratio:16 / 9}.hs-track{display:flex;width:100%;height:100%;transition:transform .45s cubic-bezier(.22,.9,.28,1);will-change:transform}.hs-track.dragging{transition:none}.hs-slide{flex:0 0 100%;width:100%;height:100%;position:relative;overflow:hidden;color:#fff !important;text-decoration:none;isolation:isolate;user-select:none;-webkit-user-drag:none}.hs-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 6s ease-out}.hs-slide:hover .hs-bg{transform:scale(1.09)}.hs-bg-solid{background:linear-gradient(135deg,var(--slide-color,#7a1626) 0%,color-mix(in srgb,var(--slide-color,#7a1626) 55%,#1a0a10) 100%)}.hs-bg-solid.promo{background:linear-gradient(135deg,#c56814 0%,#7a1626 100%)}.hs-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.55) 60%,rgba(0,0,0,.82) 100%),radial-gradient(120% 100% at 0% 100%,color-mix(in srgb,var(--slide-color) 55%,transparent) 0%,transparent 55%)}.hs-overlay.light{background:linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.45) 60%,rgba(0,0,0,.7) 100%)}.hs-body{position:relative;z-index:2;padding:16px 18px 14px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:6px}.hs-chip{align-self:flex-start;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);font-size:10.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}.hs-title{font-family:var(--font-display,inherit);font-weight:800;font-size:24px;line-height:1.05;margin:4px 0 0;text-shadow:0 2px 12px rgba(0,0,0,.35);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.hs-greet{margin:0;font-size:12.5px;opacity:.92;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.hs-countdown{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(6px);align-self:flex-start}.hs-cd-label{font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;opacity:.85}.hs-cd-cells{display:flex;gap:6px}.hs-cd-cell{display:flex;align-items:baseline;gap:2px;padding:3px 6px;border-radius:8px;background:rgba(255,255,255,.16)}.hs-cd-cell b{font-family:var(--font-display,inherit);font-variant-numeric:tabular-nums;font-weight:800;font-size:14px;line-height:1}.hs-cd-cell i{font-style:normal;font-size:9px;opacity:.8}.hs-cta{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:8px 14px;border-radius:999px;background:#fff;color:var(--slide-color,#1a1a1a) !important;font-weight:800;font-size:12px;box-shadow:0 6px 16px rgba(0,0,0,.2);transition:transform .15s ease,box-shadow .18s ease}.hs-slide:active .hs-cta{transform:translateY(1px)}.hs-dots{display:flex;justify-content:center;gap:6px;padding:8px 0 4px}.hs-dot{width:6px;height:6px;padding:0;border:0;border-radius:999px;background:color-mix(in srgb,var(--maroon,#7a1626) 22%,transparent);transition:width .25s ease,background .25s ease;cursor:pointer}.hs-dot.active{width:18px;background:var(--maroon,#7a1626)}@media (prefers-reduced-motion:reduce){.hs-track{transition:none}.hs-bg{transition:none;transform:none}}@media (max-width:380px){.hs-title{font-size:21px}.hs-cd-cell b{font-size:12px}}

/* --- Premium Orders redesign --- */
/* =============================================================
 *  Bam Sweets — My Orders & Order Details (Premium UI)
 * -------------------------------------------------------------
 *  All rules are scoped under .bo-page / .od-page. Non-orders
 *  screens are not affected. Uses existing design tokens
 *  (var(--maroon), var(--saffron), var(--cream), ...).
 * ============================================================= */

/* Hide the global chrome on the Order Details route so the
 * custom back-header + sticky action bar own the screen.        */
html[data-route="order"] #appbar,
html[data-route="order"] #delivering-from,
html[data-route="order"] #bottom-container,
html[data-route="order"] #bottomnav {
  display: none !important;
}
html[data-route="order"] { --page-cta-h: 88px; }
html[data-route="order"] body { padding-bottom: calc(env(safe-area-inset-bottom) + var(--page-cta-h)); }

/* On My Orders list we hide only the global appbar + branch strip
 * (the in-view header replaces them). Bottom nav stays visible.  */
html[data-route="orders"] #appbar,
html[data-route="orders"] #delivering-from {
  display: none !important;
}

/* =============================================================
 *  Semantic status / payment tones — used on badges and dots
 * ============================================================= */
.bo-badge {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase;
  border: 1px solid transparent;
  line-height: 1;
  white-space: nowrap;
}
.bo-badge.is-sm { font-size: 10px; padding: 3px 8px; letter-spacing: .05em; }
.bo-badge.is-orange { background: #fff1e0; color: #b1590d; border-color: #f6d3a1; }
.bo-badge.is-blue   { background: #e5efff; color: #1f4bd8; border-color: #c9d8ff; }
.bo-badge.is-yellow { background: #fff5c8; color: #8a6300; border-color: #f4e19a; }
.bo-badge.is-purple { background: #efe6ff; color: #6529d0; border-color: #dbc6ff; }
.bo-badge.is-green  { background: #dff5e5; color: #1f7a3d; border-color: #b7e2c1; }
.bo-badge.is-red    { background: #fde3df; color: #b53222; border-color: #f5c1b8; }
.bo-badge.is-grey   { background: #ece3d6; color: #4b3b30; border-color: #e0d3bf; }

/* =============================================================
 *  Reveal animation (staggered card entry)
 * ============================================================= */
.bo-reveal {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .35s var(--ease), transform .35s var(--ease);
}
.bo-reveal.on { opacity: 1; transform: none; }

/* Skeletons */
.skel-line, .skel-block { background: linear-gradient(90deg, #f2e6d5 0%, #fff1de 50%, #f2e6d5 100%); background-size: 200% 100%; animation: bo-skel 1.4s linear infinite; border-radius: 8px; }
.skel-line { height: 12px; margin: 8px 0; }
@keyframes bo-skel { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.bo-skel { border: 1px solid var(--line); background: var(--surface); border-radius: 16px; padding: 14px; box-shadow: var(--sh-1); margin-bottom: 12px; }

/* =============================================================
 *  MY ORDERS — page shell
 * ============================================================= */
.bo-page {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0;
}

.bo-head {
  position: sticky; top: 0; z-index: 20;
  background: var(--surface);
  display: flex; align-items: center; gap: 8px;
  padding: calc(10px + env(safe-area-inset-top)) 12px 10px;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 1px 0 rgba(34,25,19,.02);
}
.bo-title {
  flex: 1;
  font-family: var(--font-display);
  font-size: 20px; font-weight: 800;
  color: var(--ink);
  letter-spacing: -.01em;
  margin: 0 6px;
}
.bo-icon-btn {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center;
  background: var(--cream-2);
  color: var(--maroon-700);
  border: 0;
  transition: background .18s var(--ease), transform .12s var(--ease);
}
.bo-icon-btn:hover  { background: var(--maroon-100); }
.bo-icon-btn:active { transform: scale(.94); }

/* Search bar (collapsible) */
.bo-search {
  display: flex; align-items: center; gap: 10px;
  max-height: 0; overflow: hidden;
  padding: 0 14px;
  transition: max-height .3s var(--ease), padding .3s var(--ease);
}
.bo-search.on { max-height: 68px; padding: 10px 14px 4px; }
.bo-search-ic { color: var(--muted); display: grid; place-items: center; }
.bo-search input {
  flex: 1; min-width: 0;
  padding: 10px 12px; font: inherit; font-size: 14.5px;
  background: var(--cream-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--ink);
  outline: none;
  transition: border-color .18s var(--ease), background .18s var(--ease);
}
.bo-search input:focus { border-color: var(--maroon); background: var(--surface); }
.bo-search-clear {
  width: 34px; height: 34px; display: grid; place-items: center;
  color: var(--muted); background: transparent; border: 0;
}
.bo-search-clear:hover { color: var(--maroon); }

/* Filter chips */
.bo-chips {
  display: flex; gap: 8px; overflow-x: auto;
  padding: 12px 14px 6px;
  scrollbar-width: none;
}
.bo-chips::-webkit-scrollbar { display: none; }
.bo-chip {
  flex: none;
  padding: 8px 16px; border-radius: 999px;
  background: var(--surface); color: var(--ink-2);
  border: 1px solid var(--line);
  font-size: 13px; font-weight: 600;
  white-space: nowrap;
  transition: background .18s var(--ease), color .18s var(--ease),
              border-color .18s var(--ease), transform .12s var(--ease),
              box-shadow .18s var(--ease);
}
.bo-chip:hover { border-color: var(--maroon-100); }
.bo-chip:active { transform: scale(.96); }
.bo-chip.is-on {
  background: var(--maroon);
  color: #fff;
  border-color: var(--maroon);
  box-shadow: 0 6px 16px rgba(122,22,38,.24);
}

/* Body area */
.bo-body {
  padding: 12px 14px 24px;
}

/* =============================================================
 *  Order Card
 * ============================================================= */
.bo-card {
  display: block;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
  margin-bottom: 12px;
  color: inherit;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(34,25,19,.04);
  transition: transform .16s var(--ease), box-shadow .2s var(--ease),
              border-color .18s var(--ease);
}
.bo-card:hover  { border-color: var(--maroon-100); box-shadow: 0 8px 24px rgba(122,22,38,.08); }
.bo-card:active { transform: scale(.985); }

.bo-card-top {
  display: flex; align-items: center; gap: 12px;
}
.bo-card-icn {
  width: 44px; height: 44px; border-radius: 12px;
  display: grid; place-items: center;
  flex: none;
  color: var(--maroon-700);
  background: var(--saffron-100);
}
.bo-card-icn.is-ship  { background: var(--maroon-100); color: var(--maroon); }
.bo-card-icn.is-local { background: var(--saffron-100); color: var(--saffron-600); }

.bo-card-main { flex: 1; min-width: 0; }
.bo-card-code {
  font-family: var(--font-display);
  font-weight: 800; font-size: 15px; color: var(--ink);
  letter-spacing: -.01em;
}
.bo-card-meta {
  display: flex; align-items: center; gap: 6px;
  color: var(--muted); font-size: 12px;
  margin-top: 4px;
  flex-wrap: wrap;
}
.bo-card-meta span { display: inline-flex; align-items: center; gap: 4px; }
.bo-card-meta em { font-style: normal; font-weight: 600; color: var(--ink-2); }
.bo-card-meta svg { width: 14px; height: 14px; color: var(--muted); }
.bo-sep { color: var(--line); }

.bo-card-mid {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-top: 12px; padding-top: 12px;
  border-top: 1px dashed var(--line);
}
.bo-tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: 999px;
  background: var(--cream-2);
  color: var(--ink-2);
  font-size: 12px; font-weight: 600;
}
.bo-tag svg { width: 14px; height: 14px; color: var(--maroon); }
.bo-tag em { font-style: normal; }
.bo-tag.is-pay.is-green  { background: #eaf7ee; color: #1f7a3d; }
.bo-tag.is-pay.is-green svg  { color: #1f7a3d; }
.bo-tag.is-pay.is-yellow { background: #fff5c8; color: #8a6300; }
.bo-tag.is-pay.is-yellow svg { color: #8a6300; }
.bo-tag.is-pay.is-red    { background: #fde3df; color: #b53222; }
.bo-tag.is-pay.is-red svg    { color: #b53222; }
.bo-tag.is-pay.is-blue   { background: #e5efff; color: #1f4bd8; }
.bo-tag.is-pay.is-blue svg   { color: #1f4bd8; }

.bo-card-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 12px; padding-top: 12px;
  border-top: 1px dashed var(--line);
  gap: 12px;
}
.bo-foot-label { color: var(--muted); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; }
.bo-foot-total { font-family: var(--font-display); font-weight: 800; font-size: 20px; color: var(--maroon); margin-top: 2px; }
.bo-view {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--maroon);
  color: #fff;
  font-size: 13px; font-weight: 700;
  transition: background .18s var(--ease);
}
.bo-view svg { width: 16px; height: 16px; }
.bo-card:hover .bo-view { background: var(--maroon-700); }

/* Empty state */
.bo-empty {
  padding: 44px 20px;
  text-align: center;
  border-radius: 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  margin-top: 12px;
}
.bo-empty-ic {
  width: 68px; height: 68px; border-radius: 20px;
  background: var(--saffron-100);
  color: var(--maroon);
  display: grid; place-items: center;
  margin: 0 auto 16px;
}
.bo-empty-ic svg { width: 32px; height: 32px; }
.bo-empty h3 { font-family: var(--font-display); font-size: 18px; font-weight: 800; margin-bottom: 6px; color: var(--ink); }
.bo-empty p  { color: var(--muted); font-size: 13.5px; line-height: 1.5; max-width: 300px; margin: 0 auto; }
.bo-empty-cta {
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 20px;
  padding: 12px 24px;
  border-radius: 999px;
  background: var(--maroon);
  color: #fff;
  font-weight: 700; font-size: 14px;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(122,22,38,.28);
  transition: transform .12s var(--ease);
}
.bo-empty-cta:active { transform: scale(.97); }

/* =============================================================
 *  ORDER DETAILS
 * ============================================================= */
.od-page {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0;
  animation: bo-fade .3s var(--ease);
}
@keyframes bo-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.od-head {
  position: sticky; top: 0; z-index: 20;
  background: var(--surface);
  display: flex; align-items: center; gap: 8px;
  padding: calc(10px + env(safe-area-inset-top)) 12px 10px;
  border-bottom: 1px solid var(--line);
}
.od-icon-btn {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center;
  background: var(--cream-2);
  color: var(--maroon-700);
  border: 0;
  transition: background .18s var(--ease), transform .12s var(--ease);
}
.od-icon-btn:hover { background: var(--maroon-100); }
.od-icon-btn:active { transform: scale(.94); }
.od-head-main { flex: 1; min-width: 0; text-align: left; padding: 0 4px; }
.od-head-t1 { font-size: 11px; font-weight: 600; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; line-height: 1; }
.od-head-t2 { font-family: var(--font-display); font-weight: 800; font-size: 17px; color: var(--ink); margin-top: 3px; letter-spacing: -.01em; }

.od-body {
  padding: 14px 14px 24px;
  display: flex; flex-direction: column; gap: 14px;
}

.od-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 1px 2px rgba(34,25,19,.04);
}

.od-sec-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.od-sec-head h3 { font-family: var(--font-display); font-size: 15px; font-weight: 800; color: var(--ink); letter-spacing: -.005em; }
.od-sec-count { font-size: 12px; font-weight: 600; color: var(--muted); }
.od-sec-tag { display: inline-flex; align-items: center; gap: 4px; color: var(--maroon); font-size: 12.5px; font-weight: 700; }
.od-sec-tag svg { width: 14px; height: 14px; }
.od-sec-tag em { font-style: normal; }
.od-sep { color: var(--line); margin: 0 4px; }

/* Summary */
.od-summary {
  background: linear-gradient(180deg, #fff8ee 0%, #ffffff 100%);
  border-color: var(--saffron-100);
}
.od-sum-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.od-sum-code { font-family: var(--font-display); font-size: 18px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; }
.od-sum-when { display: flex; align-items: center; gap: 4px; color: var(--muted); font-size: 12.5px; margin-top: 4px; font-weight: 500; }
.od-sum-when svg { width: 14px; height: 14px; margin-right: 2px; }
.od-sum-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-top: 16px;
}
.od-cell {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px 12px;
}
.od-cell-l { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.od-cell-v { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 700; font-size: 13.5px; color: var(--ink); }
.od-cell-v svg { width: 16px; height: 16px; color: var(--maroon); flex: none; }

/* Timeline */
.od-timeline .od-steps {
  list-style: none; padding: 0; margin: 4px 0 0;
  display: flex; align-items: flex-start; justify-content: space-between;
  position: relative;
  gap: 4px;
}
.od-timeline .od-steps::before {
  content: '';
  position: absolute;
  left: 24px; right: 24px; top: 20px;
  height: 3px;
  background: var(--line);
  border-radius: 3px;
  z-index: 0;
}
.od-timeline .od-steps::after {
  content: '';
  position: absolute;
  left: 24px; top: 20px;
  height: 3px;
  width: calc((100% - 48px) * var(--od-progress, 0) / 100);
  background: linear-gradient(90deg, var(--maroon), var(--saffron));
  border-radius: 3px;
  z-index: 0;
  transition: width .6s var(--ease);
}
.od-step {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; align-items: center;
  gap: 8px; position: relative; z-index: 1;
}
.od-step-node {
  width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--cream-2);
  border: 2px solid var(--line);
  color: var(--muted);
  transition: background .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease), box-shadow .3s var(--ease);
}
.od-step-ic { display: grid; place-items: center; }
.od-step-ic svg { width: 18px; height: 18px; }
.od-step-label {
  font-size: 10.5px; font-weight: 700; color: var(--muted);
  text-align: center; line-height: 1.2;
  max-width: 68px;
}

.od-step.is-done .od-step-node {
  background: #eaf7ee; border-color: #1f7a3d; color: #1f7a3d;
}
.od-step.is-done .od-step-label { color: #1f7a3d; }
.od-step.is-current .od-step-node {
  background: #fff;
  border-color: var(--maroon);
  color: var(--maroon);
  box-shadow: 0 0 0 6px rgba(122,22,38,.10), 0 6px 14px rgba(122,22,38,.18);
  animation: od-pulse 1.8s var(--ease) infinite;
}
.od-step.is-current .od-step-label { color: var(--maroon); }
@keyframes od-pulse {
  0%,100% { box-shadow: 0 0 0 6px rgba(122,22,38,.10), 0 6px 14px rgba(122,22,38,.18); }
  50%     { box-shadow: 0 0 0 10px rgba(242,160,61,.16), 0 6px 20px rgba(122,22,38,.24); }
}

/* Cancelled timeline */
.od-timeline.is-cancelled { border-color: #f5c1b8; background: #fff8f6; }
.od-timeline.is-cancelled .od-sec-head h3 { color: #b53222; }
.od-cancel-box {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 12px;
  background: #fde3df;
  border-radius: 14px;
  color: #7a1c14;
}
.od-cancel-ic {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center;
  background: #f9c8c1;
  color: #b53222;
  flex: none;
}
.od-cancel-t { font-weight: 800; font-size: 14px; margin-bottom: 2px; }
.od-cancel-s { color: #7a1c14; font-size: 12.5px; line-height: 1.5; opacity: .85; }

/* Items */
.od-item-list { list-style: none; margin: 0; padding: 0; }
.od-item-list.is-open { animation: od-slide .3s var(--ease); }
@keyframes od-slide { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.od-item {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 0;
  border-bottom: 1px dashed var(--line);
}
.od-item:last-child { border-bottom: 0; }
.od-item-thumb {
  width: 48px; height: 48px; border-radius: 12px; flex: none;
  display: grid; place-items: center;
  background: linear-gradient(135deg, var(--saffron-100), var(--maroon-100));
  color: var(--maroon-700);
  font-family: var(--font-display); font-weight: 800; font-size: 20px;
}
.od-item-main { flex: 1; min-width: 0; }
.od-item-name { font-weight: 700; color: var(--ink); font-size: 14px; }
.od-item-var { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; color: var(--muted); font-size: 12px; margin-top: 3px; }
.od-item-total { font-weight: 800; color: var(--ink); font-size: 14.5px; }

.od-view-all {
  margin-top: 12px;
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--cream-2);
  color: var(--maroon);
  font-weight: 700; font-size: 13px;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 1px dashed var(--maroon-100);
  transition: background .18s var(--ease);
}
.od-view-all:hover { background: var(--maroon-100); }
.od-view-all svg { width: 16px; height: 16px; }

/* Address */
.od-addr-body { display: flex; gap: 12px; align-items: flex-start; }
.od-addr-pin {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center;
  background: var(--maroon-100);
  color: var(--maroon);
  flex: none;
}
.od-addr-name { font-weight: 800; font-size: 14.5px; color: var(--ink); }
.od-addr-phone {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--maroon); font-weight: 700; font-size: 13px; margin-top: 3px;
}
.od-addr-phone svg { width: 14px; height: 14px; }
.od-addr-full { color: var(--ink-2); font-size: 13px; line-height: 1.5; margin-top: 6px; }
.od-addr-note { color: var(--muted); font-size: 12px; margin-top: 4px; font-style: italic; }

/* Bill */
.od-bill-rows { padding-bottom: 8px; border-bottom: 1px dashed var(--line); }
.od-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 0;
  color: var(--ink-2); font-size: 13.5px;
}
.od-row span:last-child { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.od-row.is-save span:last-child { color: #1f7a3d; }
.od-row.is-save span:first-child { color: #1f7a3d; }
.od-total {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--maroon), var(--maroon-700));
  color: #fff;
  box-shadow: 0 10px 22px rgba(122,22,38,.28);
}
.od-total-l { font-family: var(--font-display); font-weight: 800; font-size: 15px; }
.od-total-s { color: rgba(255,255,255,.75); font-size: 11.5px; margin-top: 2px; }
.od-total-v { font-family: var(--font-display); font-weight: 800; font-size: 22px; color: #fff; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }

.od-foot-note {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--cream-2);
  color: var(--muted);
  font-size: 12.5px;
}
.od-foot-note svg { width: 18px; height: 18px; color: var(--maroon); flex: none; }

/* Sticky bottom action bar */
.od-sticky {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 30;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
  background: var(--surface);
  border-top: 1px solid var(--line);
  box-shadow: 0 -8px 24px rgba(34,25,19,.06);
  display: flex; gap: 10px;
  max-width: var(--max-w);
  margin: 0 auto;
}
.od-btn {
  flex: 1; min-width: 0;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 12px 12px;
  border-radius: 14px;
  font-weight: 700; font-size: 13.5px;
  border: 0;
  transition: background .18s var(--ease), transform .12s var(--ease), box-shadow .2s var(--ease);
  position: relative; overflow: hidden;
}
.od-btn:active { transform: scale(.97); }
.od-btn svg { width: 16px; height: 16px; flex: none; }
.od-btn.is-ghost {
  background: var(--cream-2);
  color: var(--maroon-700);
}
.od-btn.is-ghost:hover { background: var(--maroon-100); }
.od-btn.is-primary {
  flex: 1.4;
  background: linear-gradient(135deg, var(--maroon), var(--maroon-700));
  color: #fff;
  box-shadow: 0 8px 20px rgba(122,22,38,.30);
}
/* Ripple */
.od-btn::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle at var(--x,50%) var(--y,50%), rgba(255,255,255,.35) 0%, transparent 45%);
  opacity: 0; transition: opacity .35s var(--ease);
  pointer-events: none;
}
.od-btn:active::after { opacity: 1; }

/* =============================================================
 *  Small screen tweaks
 * ============================================================= */
@media (max-width: 380px) {
  .od-step-label { font-size: 9.5px; max-width: 58px; }
  .od-step-node  { width: 36px; height: 36px; }
  .od-timeline .od-steps::before,
  .od-timeline .od-steps::after { left: 20px; right: 20px; top: 17px; }
  .od-sum-grid   { grid-template-columns: 1fr; }
  .bo-foot-total { font-size: 18px; }
}

/* =========================================================================
   Bam Sweets — Premium Home Screen v2 (Swiggy/Blinkit-inspired)
   Pixel-match to the attached Figma mockup + design-system panel:
     Maroon  #8B1E3F   Orange #FF8A00   Green #27AE60
     Cream   #FFF5E6   Gray   #F3F4F6   Ink    #1F1F1F
     Font    Poppins   H1 20 / H2 16 / H3 14 / Body 13 / Caption 11
   ========================================================================= */

:root {
  --hp-bg:       #F7F7F8;
  --hp-page:     #FFFFFF;
  --hp-surface:  #FFFFFF;
  --hp-line:     #EEEDEA;
  --hp-line-2:   #F3F4F6;
  --hp-ink:      #1F1F1F;
  --hp-ink-2:    #6B6B6B;
  --hp-ink-3:    #9A9A9A;
  --hp-maroon:   #8B1E3F;
  --hp-maroon-2: #6E162F;
  --hp-orange:   #FF8A00;
  --hp-green:    #27AE60;
  --hp-green-2:  #1F8F4E;
  --hp-cream:    #FFF5E6;
  --hp-red:      #DC2626;
  --hp-yellow:   #F5B301;

  --hp-r-sm: 8px;
  --hp-r-md: 12px;
  --hp-r-lg: 16px;
  --hp-r-xl: 20px;

  --hp-shadow-1: 0 2px 6px rgba(15,15,15,.05);
  --hp-shadow-2: 0 4px 14px rgba(15,15,15,.06);
  --hp-shadow-3: 0 8px 24px rgba(15,15,15,.08);
  --hp-shadow-maroon: 0 8px 22px rgba(139,30,63,.24);
}

/* ---------- Body / page shell ---------- */
body {
  background: var(--hp-bg);
  font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--hp-ink);
  -webkit-font-smoothing: antialiased;
}
.view {
  max-width: 480px;
  background: var(--hp-page);
  padding: 0 0 32px;
}
@media (min-width: 481px) {
  .view { margin: 0 auto; }
}

/* ---------- App bar / header ---------- */
.appbar {
  background: var(--hp-page);
  padding: calc(6px + env(safe-area-inset-top)) 14px 8px 14px;
  min-height: var(--appbar-h, 56px);
}
.appbar-label {
  font-size: 10px; letter-spacing: .16em;
  color: var(--hp-ink-3);
  text-transform: uppercase; font-weight: 600;
}
.appbar-value {
  font-weight: 600; color: var(--hp-ink); font-size: 15px;
  margin-top: 3px;
}
.appbar-value .chev { color: var(--hp-maroon); }
.icon-btn { color: var(--hp-ink-2); }
.icon-btn:hover { background: var(--hp-line-2); }
.icon-btn .dot { background: var(--hp-orange); }

/* Delivering-from strip */
.delivering-from {
  background: var(--hp-maroon);
  padding: 10px 16px;
  min-height: 52px;
}
.df-label {
  font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  opacity: .82; font-weight: 600;
}
.df-branch { font-weight: 600; font-size: 15px; margin-top: 4px; }
.df-right {
  font-size: 12px; font-weight: 500;
  background: rgba(255,255,255,.18);
  border-radius: 999px;
  padding: 6px 12px;
  display: inline-flex; align-items: center; gap: 5px;
}
.df-right svg { width: 12px; height: 12px; }

/* ---------- Greeting ---------- */
.hp-greet { margin: 14px 16px 12px; }
.hp-greet .hi {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.2;
  color: var(--hp-ink);
  display: inline-flex; align-items: center; gap: 8px;
  letter-spacing: -0.01em;
}
.hp-greet .hi .wave {
  display: inline-block; font-size: 18px;
  animation: hp-wave 2.4s ease-in-out infinite;
  transform-origin: 70% 70%;
}
@keyframes hp-wave {
  0%,60%,100% { transform: rotate(0); }
  10% { transform: rotate(14deg); }
  20% { transform: rotate(-8deg); }
  30% { transform: rotate(14deg); }
}
.hp-greet .sub {
  color: var(--hp-ink-2);
  font-size: 12.5px;
  font-weight: 400;
  margin-top: 3px;
}

/* ---------- Search bar (large rounded + premium shadow) ---------- */
.search-bar.premium.hp-search {
  margin: 14px 16px 4px !important;
  padding: 14px 18px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  border: 1px solid var(--hp-line) !important;
  box-shadow: 0 4px 14px rgba(15,15,15,.06) !important;
  transform: none !important;
  display: flex; align-items: center; gap: 10px;
}
.hp-search .sb-search-ico { color: var(--hp-maroon) !important; width: 20px; height: 20px; }
.hp-search input {
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
  color: var(--hp-ink);
  font-weight: 400;
  background: transparent;
  border: 0; width: 100%;
}
.hp-search input::placeholder { color: var(--hp-ink-3); font-weight: 400; }
.hp-search .sb-mic {
  color: var(--hp-maroon) !important;
  background: transparent !important;
  border-radius: 50%; padding: 4px;
  display: grid; place-items: center;
}
.hp-search .sb-mic:hover { background: rgba(139,30,63,.08) !important; }

/* ---------- Section header ---------- */
.hp-section-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 16px 6px;
  gap: 10px;
}
.hp-h2 {
  font-weight: 600 !important;
  font-size: 16px !important;
  color: var(--hp-ink) !important;
  letter-spacing: -0.01em;
  margin: 0;
  display: inline-flex; align-items: center; gap: 8px;
}
.hp-h2-badge {
  display: inline-flex; align-items: center;
  background: var(--hp-red);
  color: #fff;
  font-size: 9.5px; font-weight: 700;
  letter-spacing: .5px;
  padding: 2px 7px;
  border-radius: 4px;
  line-height: 1.4;
}
.hp-h2-badge-new { background: var(--hp-green); }
.hp-h2-badge-fest { background: var(--hp-orange); }
.hp-section-sub {
  font-size: 11.5px;
  color: var(--hp-ink-2);
  font-weight: 400;
  padding: 0 16px 6px;
}
.hp-view-all {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12.5px; font-weight: 500;
  color: var(--hp-maroon) !important;
  text-decoration: none;
}
.hp-view-all svg { width: 12px; height: 12px; }

/* ---------- Categories ---------- */
.hp-cats-sticky {
  position: sticky;
  top: calc(var(--appbar-h, 48px) + 52px);
  z-index: 25;
  background: var(--surface, #fff);
  border-bottom: 1px solid transparent;
  transition: box-shadow .18s ease, border-color .18s ease;
}
.hp-cats-sticky.is-stuck {
  box-shadow: 0 6px 12px -8px rgba(15,15,15,.18);
  border-bottom-color: var(--hp-line, #eee);
}
.hp-cats-rail {
  display: flex !important;
  gap: 10px !important;
  padding: 6px 16px 10px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}
.hp-cats-rail::-webkit-scrollbar { display: none; }
.hp-cat-chip {
  flex: 0 0 auto;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 5px !important;
  width: 54px !important;
  scroll-snap-align: start;
  text-decoration: none;
}
.hp-cat-chip .ct-thumb {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), transparent 55%),
    radial-gradient(circle at 65% 65%, color-mix(in srgb, var(--ct-color, #FF8A00) 70%, #fff) 0%, color-mix(in srgb, var(--ct-color, #FF8A00) 25%, #fff) 60%, #fff 100%);
  display: grid; place-items: center;
  border: 0 !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.06) !important;
  transition: transform .18s ease, box-shadow .18s ease;
  position: relative;
}
.hp-cat-chip:hover .ct-thumb {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(0,0,0,.09) !important;
}
.hp-cat-chip:active .ct-thumb { transform: scale(.96); }
.hp-cat-chip .ct-thumb img { width: 100%; height: 100%; object-fit: cover; }
.hp-cat-chip .ct-thumb .ct-letter {
  font-weight: 700; font-size: 18px; color: var(--hp-maroon);
}
.hp-cat-chip .ct-name {
  font-size: 10px;
  font-weight: 500;
  color: var(--hp-ink);
  text-align: center; line-height: 1.15;
  max-width: 60px;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
}

/* Categories view-all row */
.hp-cats-viewall {
  display: flex; justify-content: flex-end;
  padding: 0 16px 4px;
}

/* ---------- Hero Slider (festival + promo) ---------- */
.hs-root {
  margin: 12px 16px 4px;
  border-radius: 20px;
  overflow: visible;
  background: transparent;
  position: relative;
}
.hs-viewport {
  overflow: hidden;
  border-radius: 20px;
  aspect-ratio: auto;
  height: 240px;
  box-shadow: 0 12px 26px rgba(139,30,63,.18);
}
.hs-track { height: 100%; transition: transform .4s cubic-bezier(.4,0,.2,1); display: flex; }
.hs-track.dragging { transition: none; }
.hs-slide {
  flex: 0 0 100%;
  color: #fff !important;
  text-decoration: none;
  padding: 0;
  position: relative;
  height: 100%;
}
.hs-slide.festival { background: #4a0812; }
.hs-slide .hs-bg {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: .35;
  transform: scale(1.05);
  transition: transform 6s ease-out, opacity .4s ease;
}
.hs-slide:hover .hs-bg { transform: scale(1.1); }
.hs-bg-solid {
  background: linear-gradient(135deg,
    var(--slide-color, var(--hp-maroon)) 0%,
    color-mix(in srgb, var(--slide-color, var(--hp-maroon)) 55%, #1a0000) 100%);
}
.hs-bg-solid.promo {
  background: linear-gradient(135deg, #c56814 0%, var(--hp-maroon) 100%);
}
.hs-overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(115deg, rgba(74,8,18,.86) 0%, rgba(74,8,18,.55) 45%, rgba(139,30,63,.3) 100%),
    radial-gradient(80% 90% at 100% 20%, rgba(255,180,80,.18) 0%, transparent 60%);
}
.hs-overlay.light {
  background:
    linear-gradient(180deg, rgba(0,0,0,.02) 0%, rgba(0,0,0,.4) 55%, rgba(0,0,0,.65) 100%);
}
.hs-body {
  position: relative; z-index: 2;
  padding: 18px 20px 14px;
  height: 100%;
  display: flex; flex-direction: column; justify-content: space-between;
  gap: 8px;
}

/* Festival layout */
.hs-slide.festival .hs-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: 1fr;
  gap: 10px;
  align-content: stretch;
}
.hs-slide.festival .hs-fest-left {
  grid-column: 1; grid-row: 1;
  display: flex; flex-direction: column;
  justify-content: center;
  gap: 6px;
  min-width: 0;
}
.hs-slide.festival .hs-fest-right {
  grid-column: 2; grid-row: 1;
  display: flex; align-items: center; justify-content: flex-end;
}

.hs-chip {
  align-self: flex-start;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(6px);
  font-size: 10px; font-weight: 600; letter-spacing: .4px;
  text-transform: uppercase;
  color: #fff;
}
.hs-chip.promo { background: rgba(255,255,255,.2); }
.hs-title {
  font-weight: 700 !important;
  font-size: 26px !important;
  line-height: 1.08 !important;
  margin: 4px 0 0 !important;
  color: #fff !important;
  letter-spacing: -0.01em;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
  overflow: hidden;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.hs-title .hs-emoji { font-size: 20px; display: inline-block; margin-left: 4px; vertical-align: middle; }
.hs-greet {
  margin: 0;
  font-size: 12px; font-weight: 400;
  color: rgba(255,255,255,.9);
  line-height: 1.35;
  overflow: hidden;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.hs-cta {
  align-self: flex-start;
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 10px;
  padding: 9px 18px;
  border-radius: 999px;
  background: #FBBF24 !important;
  color: var(--hp-maroon) !important;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .04em;
  box-shadow: 0 8px 18px rgba(251,191,36,.36);
  border: 0;
  transition: transform .15s ease, box-shadow .18s ease;
}
.hs-cta:hover { transform: translateY(-1px); }

/* Countdown */
.hs-countdown {
  display: flex; flex-direction: column;
  align-items: center; gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(8px);
  min-width: 156px;
}
.hs-cd-label {
  font-size: 9.5px; font-weight: 700; letter-spacing: .5px;
  text-transform: uppercase; opacity: .95;
  color: #fff; white-space: nowrap;
}
.hs-cd-cells { display: flex; gap: 3px; }
.hs-cd-cell {
  display: flex; flex-direction: column; align-items: center;
  padding: 4px 6px;
  border-radius: 6px;
  background: rgba(255,255,255,.14);
  min-width: 30px;
}
.hs-cd-cell b {
  font-variant-numeric: tabular-nums;
  font-weight: 700; font-size: 18px; line-height: 1; color: #fff;
}
.hs-cd-cell i {
  font-style: normal;
  font-size: 8.5px; font-weight: 500; margin-top: 3px;
  opacity: .85; color: #fff; letter-spacing: .3px;
}

/* Trust row (hidden by default so it doesn't cramp — festival slide only if configured) */
.hs-trust-row { display: none; }

/* Promo slide layout */
.hs-slide.promo .hs-body {
  justify-content: flex-end;
  gap: 6px;
}
.hs-slide.promo .hs-title { font-size: 22px !important; }

/* Dots */
.hs-dots {
  display: flex; justify-content: center; gap: 6px;
  padding: 10px 0 4px;
}
.hs-dot {
  width: 6px; height: 6px; padding: 0;
  border: 0; border-radius: 999px;
  background: color-mix(in srgb, var(--hp-maroon) 22%, transparent);
  transition: width .25s ease, background .25s ease;
  cursor: pointer;
}
.hs-dot.active { width: 18px; background: var(--hp-maroon); }

/* ---------- Quick Chips (top-of-page) ---------- */
.hp-quick-chips {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 10px 16px 4px;
  scrollbar-width: none;
}
.hp-quick-chips::-webkit-scrollbar { display: none; }
.hp-qchip {
  flex: 0 0 auto;
  display: flex !important;
  flex-direction: column;
  align-items: center; justify-content: center;
  gap: 5px;
  width: 72px;
  min-height: 78px;
  padding: 8px 6px !important;
  border-radius: 12px !important;
  background: #fff !important;
  border: 1px solid var(--hp-line) !important;
  color: var(--hp-ink) !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  line-height: 1.2; text-align: center;
  box-shadow: var(--hp-shadow-1);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  white-space: normal;
}
.hp-qchip .qi {
  width: 32px; height: 32px;
  background: transparent !important;
  display: grid; place-items: center;
  font-size: 20px;
}
.hp-qchip .qi svg { width: 24px; height: 24px; }
.hp-qchip .ql {
  font-weight: 500;
  font-size: 11px;
  color: var(--hp-ink);
  max-width: 64px;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.hp-qchip:hover {
  border-color: color-mix(in srgb, var(--hp-maroon) 40%, transparent) !important;
  box-shadow: var(--hp-shadow-2);
}
.hp-qchip:active { transform: translateY(1px); }
.hp-qchip.highlight {
  background: color-mix(in srgb, var(--hp-maroon) 6%, #fff) !important;
  border-color: color-mix(in srgb, var(--hp-maroon) 35%, transparent) !important;
  color: var(--hp-maroon) !important;
}
.hp-qchip .qi-new-badge {
  padding: 3px 6px;
  background: #86efac; color: #14532d;
  font-size: 9px; font-weight: 700;
  letter-spacing: .5px;
  border-radius: 4px; line-height: 1;
}

/* ---------- Offer Strip ---------- */
.hp-offer-strip {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 12px 16px 6px;
  scrollbar-width: none;
}
.hp-offer-strip::-webkit-scrollbar { display: none; }
.hp-offer-card {
  flex: 0 0 auto;
  min-width: 208px;
  display: flex !important;
  align-items: center;
  gap: 12px !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1px solid var(--hp-line) !important;
  color: var(--hp-ink) !important;
  box-shadow: var(--hp-shadow-1);
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.hp-offer-card:hover {
  border-color: color-mix(in srgb, var(--hp-maroon) 30%, transparent) !important;
  box-shadow: var(--hp-shadow-2);
}
.hp-offer-card .oc-icon {
  width: 40px; height: 40px;
  display: grid; place-items: center;
  border-radius: 10px;
  background: color-mix(in srgb, var(--oc-color, var(--hp-orange)) 14%, #fff);
  color: var(--oc-color, var(--hp-orange));
  font-size: 20px;
  flex: 0 0 40px;
}
.hp-offer-card .oc-icon svg { width: 22px; height: 22px; }
.hp-offer-card .oc-body {
  display: flex; flex-direction: column;
  line-height: 1.2; gap: 1px; min-width: 0;
}
.hp-offer-card .oc-title {
  font-size: 11px; font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--hp-ink);
}
.hp-offer-card .oc-sub {
  font-size: 11.5px;
  color: var(--hp-ink-2);
  font-weight: 400;
}
.hp-offer-card .oc-code {
  font-size: 11.5px;
  font-weight: 500;
  color: var(--hp-ink-2);
  margin-top: 2px;
}
.hp-offer-card .oc-code b { color: var(--hp-maroon); font-weight: 700; }

/* ---------- Product Rails ---------- */
.prod-rail.hp-rail {
  display: flex !important;
  gap: 12px !important;
  padding: 4px 16px 10px !important;
  overflow-x: auto !important;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}
.prod-rail.hp-rail::-webkit-scrollbar { display: none; }
.prod-rail.hp-rail .skel-card {
  flex: 0 0 160px; width: 160px;
  border-radius: 14px; padding: 10px;
  display: flex; flex-direction: column; gap: 8px;
  background: #ffffff;
  border: 1px solid var(--hp-line);
}
.prod-rail.hp-rail .skel-card .skel-thumb {
  width: 100%; aspect-ratio: 1/1; border-radius: 10px;
  background: linear-gradient(90deg, #f2f2f2 0%, #ececec 50%, #f2f2f2 100%);
  background-size: 200% 100%;
  animation: hp-skel 1.4s linear infinite;
}
@keyframes hp-skel { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ---------- Product Card (Vertical — for rails & grid) ---------- */
.hp-card {
  background: #fff !important;
  border: 1px solid var(--hp-line) !important;
  border-radius: 14px !important;
  overflow: hidden;
  box-shadow: var(--hp-shadow-1) !important;
  transition: transform .15s ease, box-shadow .18s ease, border-color .18s ease;
  scroll-snap-align: start;
  cursor: pointer;
  position: relative;
}
.hp-card:hover {
  border-color: color-mix(in srgb, var(--hp-maroon) 25%, transparent) !important;
  box-shadow: var(--hp-shadow-2) !important;
  transform: translateY(-1px);
}
.hp-card:active { transform: translateY(1px); }
.hp-card.v { flex: 0 0 158px; width: 158px; display: flex; flex-direction: column; }

.hp-thumb {
  position: relative;
  width: 100%; aspect-ratio: 1 / 1;
  background: var(--hp-cream);
  display: grid; place-items: center;
  overflow: hidden;
}
.hp-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.hp-card:hover .hp-thumb img { transform: scale(1.04); }
.hp-thumb-ph { font-weight: 700; font-size: 40px; color: var(--hp-maroon); }

/* Discount badge — green pill top-left */
.hp-off {
  position: absolute; top: 8px; left: 8px;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .2px;
  background: linear-gradient(180deg, #34c96b, var(--hp-green-2)) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 2px 6px rgba(31,143,78,.28);
}

/* Veg/Non-veg badge — small square top-right */
.hp-veg {
  position: absolute; top: 8px; right: 8px;
  width: 16px; height: 16px;
  border-radius: 3px;
  background: #fff;
  border: 1.5px solid var(--hp-green);
  display: grid; place-items: center;
  box-shadow: 0 2px 4px rgba(0,0,0,.08);
}
.hp-veg::after {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--hp-green);
}
.hp-veg.non-veg { border-color: #A83232; }
.hp-veg.non-veg::after { background: #A83232; }

/* Kind-based badge (bottom-left of thumb when set) */
.hp-badge {
  position: absolute;
  bottom: 8px; left: 8px;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 10px; font-weight: 700; letter-spacing: .3px;
  color: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}
.hp-badge-best { background: linear-gradient(180deg, #16a34a, #15803d); }
.hp-badge-top  { background: linear-gradient(180deg, #f5b301, #d97e18); color: #4d2b00; }
.hp-badge-ord  { background: linear-gradient(180deg, var(--hp-maroon), var(--hp-maroon-2)); }
.hp-badge-new  { background: #D1FAE5 !important; color: #065F46 !important; }

.hp-body {
  padding: 10px 12px 12px;
  display: flex; flex-direction: column; gap: 3px;
}
.hp-name {
  margin: 0;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  color: var(--hp-ink);
  line-height: 1.25;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
}
.hp-desc {
  font-size: 11px;
  font-weight: 400;
  color: var(--hp-ink-2);
  line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
  min-height: 14px;
}
.hp-variant-weight {
  font-size: 11px;
  color: var(--hp-ink-3);
  font-weight: 400;
}

.hp-price-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 6px;
  margin-top: 4px;
}
.hp-price-wrap {
  display: flex; align-items: baseline; gap: 6px;
  min-width: 0; flex-wrap: wrap;
}
.hp-price {
  font-weight: 700 !important;
  font-size: 14px !important;
  color: var(--hp-ink) !important;
}
.hp-mrp {
  font-size: 11.5px;
  color: var(--hp-ink-3);
  text-decoration: line-through;
  font-weight: 400;
}
.hp-rating {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 11px; font-weight: 500;
  color: var(--hp-ink-2);
  margin-top: 3px;
}
.hp-rating svg { width: 12px; height: 12px; color: var(--hp-yellow); fill: var(--hp-yellow); }

/* Beautiful add button */
.hp-add {
  flex: 0 0 auto;
  width: 30px; height: 30px;
  border-radius: 8px;
  border: 0;
  background: var(--hp-maroon) !important;
  color: #fff;
  display: grid; place-items: center;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(139,30,63,.28);
  transition: transform .12s ease, box-shadow .18s ease, background .18s ease;
}
.hp-add:hover {
  background: var(--hp-maroon-2) !important;
  box-shadow: 0 6px 14px rgba(139,30,63,.4);
}
.hp-add:active { transform: scale(.94); }
.hp-add.pill {
  width: auto; height: auto;
  padding: 7px 20px;
  border-radius: 8px;
  font-weight: 600; font-size: 12px;
  background: #ffffff !important;
  color: var(--hp-maroon) !important;
  border: 1.5px solid color-mix(in srgb, var(--hp-maroon) 30%, transparent) !important;
  box-shadow: none;
}
.hp-add.pill:hover {
  background: var(--hp-maroon) !important;
  color: #fff !important;
  border-color: var(--hp-maroon) !important;
}

/* Horizontal card (Order Again) */
.hp-card.h {
  flex: 0 0 240px;
  width: 240px;
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  box-shadow: var(--hp-shadow-1);
}
.hp-card.h .hp-thumb.sm {
  width: 64px; height: 64px;
  aspect-ratio: auto;
  border-radius: 10px;
  background: var(--hp-cream);
}
.hp-h-body {
  min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.hp-h-body .hp-name { font-size: 13px; -webkit-line-clamp: 1; }
.hp-h-body .hp-price { font-size: 13px; }
.hp-h-body .hp-variant { font-size: 11px; color: var(--hp-ink-2); }

/* ---------- All Products — 2-col infinite grid ---------- */
.hp-all-wrap {
  margin-top: 24px;
  padding: 16px 16px 8px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfbfb 100%);
  border-top: 6px solid var(--hp-line-2);
  border-radius: 20px 20px 0 0;
}
.hp-all-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}
.hp-all-title {
  font-weight: 700; font-size: 18px;
  color: var(--hp-ink);
  letter-spacing: -0.01em;
  display: flex; align-items: center; gap: 8px;
}
.hp-all-title::before {
  content: '';
  display: inline-block;
  width: 4px; height: 20px;
  background: var(--hp-maroon);
  border-radius: 2px;
}
.hp-all-sub {
  font-size: 12px; color: var(--hp-ink-2);
  font-weight: 400;
  margin: 2px 0 12px;
}
.hp-all-filter {
  font-size: 11.5px; font-weight: 500;
  color: var(--hp-ink-2);
  padding: 6px 10px;
  border: 1px solid var(--hp-line);
  border-radius: 999px;
  background: #fff;
  display: inline-flex; align-items: center; gap: 4px;
}
.hp-all-filter svg { width: 12px; height: 12px; }

.hp-all-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding-top: 4px;
}
.hp-all-grid .hp-card.v {
  flex: 0 1 auto; width: 100%;
}
.hp-all-grid .hp-thumb { aspect-ratio: 1 / 1; }

/* Loader sentinel */
.hp-all-more {
  text-align: center;
  padding: 20px 0 8px;
  font-size: 12px; color: var(--hp-ink-3);
  font-weight: 500;
}
.hp-all-more.loading::after {
  content: '';
  display: inline-block; margin-left: 8px;
  width: 12px; height: 12px;
  border: 2px solid var(--hp-line);
  border-top-color: var(--hp-maroon);
  border-radius: 50%;
  animation: hp-spin .8s linear infinite;
  vertical-align: middle;
}
@keyframes hp-spin { to { transform: rotate(360deg); } }
.hp-all-end {
  text-align: center;
  padding: 24px 0 8px;
  font-size: 12px; color: var(--hp-ink-3);
  font-weight: 500;
}
.hp-all-end::before, .hp-all-end::after {
  content: ''; display: inline-block;
  width: 20px; height: 1px;
  background: var(--hp-line);
  vertical-align: middle;
  margin: 0 10px;
}

/* ---------- Bottom Nav ---------- */
.bottomnav {
  background: #fff;
  border-top: 1px solid var(--hp-line);
  padding-top: 4px;
}
.bn-item {
  color: var(--hp-ink-3);
  font-size: 11px; font-weight: 500;
}
.bn-item svg {
  width: 22px; height: 22px;
  padding: 4px 14px;
  box-sizing: content-box;
  border-radius: 999px;
  transition: background .2s ease;
}
.bn-item:hover { color: var(--hp-ink-2); }
.bn-item.active { color: var(--hp-maroon); font-weight: 600; }
.bn-item.active svg {
  color: var(--hp-maroon);
  background: color-mix(in srgb, var(--hp-maroon) 14%, transparent);
}

/* ---------- Reveal animation ---------- */
.reveal { opacity: 0; transform: translateY(6px); transition: opacity .45s ease, transform .45s ease; }
.reveal.shown { opacity: 1; transform: none; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hs-track, .hp-thumb img, .hs-bg { transition: none !important; }
  .hp-greet .hi .wave { animation: none !important; }
}

/* ---------- Small screens ---------- */
@media (max-width: 380px) {
  .hs-viewport { height: 220px; }
  .hs-title { font-size: 22px !important; }
  .hs-countdown { min-width: 140px; padding: 8px 10px; }
  .hs-cd-cell { min-width: 28px; padding: 3px 4px; }
  .hs-cd-cell b { font-size: 16px; }
  .hs-cta { padding: 8px 14px; font-size: 11px; }
  .hp-card.v { flex-basis: 148px; width: 148px; }
  .hp-cat-chip { width: 64px !important; }
  .hp-cat-chip .ct-thumb { width: 58px !important; height: 58px !important; }
  .hp-all-grid { gap: 10px; }
}

/* ==========================================================
   Product Details — Bottom Sheet
   Native-app style overlay used by every product card click.
   The underlying page (Home / Menu / Search / …) stays mounted
   behind so its scroll position and DOM state are preserved.
   ========================================================== */
.pd-sheet-backdrop {
  position: fixed; inset: 0; z-index: 120;
  background: rgba(20, 12, 8, 0.55);
  opacity: 0;
  transition: opacity .28s cubic-bezier(.22,.9,.28,1);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.pd-sheet-backdrop.on { opacity: 1; }

.pd-sheet {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 125;
  height: 90vh; max-height: 90dvh;
  background: var(--surface);
  border-top-left-radius: 22px;
  border-top-right-radius: 22px;
  box-shadow: 0 -14px 44px rgba(0,0,0,.28);
  display: flex; flex-direction: column;
  transform: translateY(100%);
  transition: transform .36s cubic-bezier(.22,.9,.28,1);
  overflow: hidden;
  padding-bottom: env(safe-area-inset-bottom);
}
.pd-sheet.on { transform: translateY(0); }

.pd-sheet-drag {
  flex: 0 0 auto;
  padding: 10px 20px 6px;
  display: flex; justify-content: center;
  cursor: grab;
  touch-action: pan-y;
}
.pd-sheet-drag:active { cursor: grabbing; }
.pd-sheet-handle {
  width: 44px; height: 5px;
  background: color-mix(in srgb, var(--muted) 45%, transparent);
  border-radius: 999px;
}

.pd-sheet-close {
  position: absolute; top: 12px; right: 14px; z-index: 4;
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: #221913;
  display: grid; place-items: center;
  border: 1px solid rgba(0,0,0,.05);
  box-shadow: 0 4px 10px rgba(0,0,0,.14);
  cursor: pointer;
  transition: transform .12s cubic-bezier(.22,.9,.28,1);
}
.pd-sheet-close:active { transform: scale(.94); }

.pd-sheet-body {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 8px 14px 0;
  position: relative;
}
.pd-sheet-body .pd-hero img,
.pd-sheet-body .pd-hero .placeholder {
  height: 240px;
  border-radius: 16px;
}

/* Sticky Add-to-Cart footer INSIDE the sheet.
   The generic .sticky-add is `position:fixed` (relative to the
   viewport) — inside the sheet we anchor it to the sheet bottom
   with position:sticky so it always sits on the sheet footer,
   whatever the viewport height. */
.pd-sheet-body .sticky-add.sticky-add--sheet {
  position: sticky;
  left: 0; right: 0;
  bottom: 0;
  margin: 0 -14px;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, transparent, var(--surface) 30%);
  z-index: 3;
  pointer-events: none;
}
.pd-sheet-body .sticky-add.sticky-add--sheet .inner {
  pointer-events: auto;
  max-width: none;
  margin: 0;
  background: var(--surface);
  border-radius: 999px;
  padding: 8px 8px 8px 20px;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  box-shadow: 0 6px 18px rgba(34,25,19,.16), 0 1px 0 rgba(0,0,0,.04) inset;
  border: 1px solid var(--line);
}
.pd-sheet-body .sticky-add.sticky-add--sheet .btn-primary {
  padding: 12px 22px;
  font-size: 14.5px;
}

/* Prevent background page from scrolling while the sheet is open
   (avoids double-scroll on iOS Safari). Scroll position is preserved
   because we only toggle overflow — no reflow that moves the body. */
body.pd-sheet-lock {
  overflow: hidden;
}

@media (max-width: 380px) {
  .pd-sheet-body .pd-hero img,
  .pd-sheet-body .pd-hero .placeholder { height: 200px; }
}

@media (prefers-reduced-motion: reduce) {
  .pd-sheet, .pd-sheet-backdrop { transition: none !important; }
}