@font-face{font-family:'Inter Var';src:url('assets/fonts/inter-variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/fonts/dm-sans-variable.woff2') format('woff2');font-weight:100 1000;font-style:normal;font-display:swap}
:root{--sf:'Inter Var',-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--dm:"DM Sans",var(--sf);font-family:var(--sf);color:#181818;background:#fff;font-synthesis:none;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:clip;overscroll-behavior-x:none}body{margin:0;min-width:320px;overflow-x:clip;overscroll-behavior-x:none}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ff9aa4;outline-offset:2px}img{display:block;max-width:100%}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--sf);letter-spacing:-.028em;font-weight:700}h1{font-size:clamp(2.4rem,5vw,4.4rem);line-height:1.05;margin-bottom:16px}h2{font-size:clamp(1.5rem,2.5vw,2.1rem);line-height:1.2;margin-bottom:0}h3{font-size:1.2rem;margin-bottom:6px}.muted{color:#858585}.eyebrow{text-transform:uppercase;font-size:.72rem;letter-spacing:.18em;font-weight:800;color:#ef1733}.app-shell{max-width:1440px;margin:auto;min-height:100vh;padding:0 clamp(20px,5vw,72px) 125px}.header{height:94px;display:flex;align-items:center;gap:24px;border-bottom:1px solid #f0eeee}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#171717;font:700 1.32rem var(--dm);letter-spacing:-.03em;font-variation-settings:'opsz' 32}.brand img{width:40px;height:40px;border-radius:12px}.header-center{margin:auto;display:flex;gap:30px}.header-center button{border:0;background:transparent;color:#747474;font-weight:700;padding:12px 2px}.header-center button.active{color:#ec1732}.header-actions{display:flex;gap:10px;align-items:center;margin-left:auto}.icon-button{border:1px solid #ececec;background:#fff;width:43px;height:43px;border-radius:50%;display:grid;place-items:center;position:relative;color:#222}.icon-button svg,.text-button svg,.dock svg,.menu-list svg,.back svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}.count{position:absolute;top:-5px;right:-5px;border-radius:20px;background:#ed1833;color:white;min-width:19px;height:19px;padding:1px 4px;font-size:11px;font-weight:800}.avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#171717;color:white;display:grid;place-items:center;font-weight:800;border:0;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.page{animation:pageIn .35s ease both}@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.home-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px, .95fr);gap:50px;align-items:center;padding:58px 0 44px}.home-copy p{font-size:1.07rem;line-height:1.65;max-width:470px;color:#747474}.delivery-line{display:inline-flex;gap:8px;align-items:center;border:1px solid #ededed;padding:9px 14px;border-radius:99px;margin-bottom:32px;font-size:.9rem;font-weight:700}.delivery-line b{color:#ed1732}.hero-visual{position:relative;height:360px;background:#f7f4f3;border-radius:30px;overflow:hidden;isolation:isolate}.hero-visual:after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(transparent,rgba(35,0,0,.25));pointer-events:none}.hero-visual img{width:100%;height:100%;object-fit:cover}.hero-visual canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}.hero-label{position:absolute;left:24px;bottom:22px;z-index:3;color:white;font-weight:800;font-family:var(--sf);font-size:1.25rem;letter-spacing:-.03em;text-shadow:0 2px 12px #3335}.search-row{display:flex;gap:12px;margin-top:30px;max-width:560px}.search-box{border:1px solid #e8e8e8;border-radius:16px;display:flex;align-items:center;gap:12px;flex:1;padding:0 17px;background:#fff}.search-box svg{width:21px;height:21px;stroke:#888;fill:none;stroke-width:2}.search-box input{width:100%;border:0;outline:0;padding:17px 0;background:transparent;color:#222}.search-row .primary{white-space:nowrap}.primary{background:#f20d2e;border:1px solid #f20d2e;color:white;padding:14px 21px;border-radius:14px;font-weight:800;box-shadow:0 10px 25px #f20d2e22;transition:transform .2s,background .2s}.primary:hover{transform:translateY(-2px);background:#d90c29}.secondary{background:#fff;border:1px solid #e7e7e7;color:#222;padding:13px 18px;border-radius:14px;font-weight:800}.text-button{border:0;background:transparent;color:#ed1732;font-weight:800;display:inline-flex;align-items:center;gap:7px;padding:8px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 0 23px}.section-head p{color:#898989;margin:6px 0 0}.section{margin-top:38px}.chips{display:flex;gap:8px;overflow:auto;padding:2px 0 5px;scrollbar-width:none}.svc,.fbar,.chips,.cat-tabs,.rail{overscroll-behavior-x:contain}.chip{white-space:nowrap;border:1px solid #ececec;background:#fff;border-radius:999px;padding:10px 17px;color:#626262;font-weight:700}.chip.active{background:#191919;border-color:#191919;color:#fff}.restaurant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.restaurant-card{border:1px solid #ededed;border-radius:23px;overflow:hidden;background:white;transition:transform .25s,box-shadow .25s}.restaurant-card:hover{transform:translateY(-4px);box-shadow:0 18px 45px #00000010}.card-media{height:210px;position:relative;overflow:hidden}.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.restaurant-card:hover img{transform:scale(1.045)}.heart{position:absolute;right:15px;top:15px;width:38px;height:38px;border-radius:50%;background:white;border:0;display:grid;place-items:center;color:#555;box-shadow:0 4px 12px #0002}.heart.active{color:#ed1732}.heart svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2}.heart.active svg{fill:#ed1732}.badge{position:absolute;left:15px;top:16px;background:white;border-radius:99px;padding:7px 10px;font-size:.75rem;font-weight:800}.card-body{padding:19px}.card-title{display:flex;justify-content:space-between;gap:8px;align-items:center}.card-title button{border:0;background:none;text-align:left;padding:0;font:700 1.17rem var(--sf);letter-spacing:-.03em}.rating{font-size:.87rem;font-weight:800;white-space:nowrap}.rating span{color:#e51b37}.card-meta{color:#848484;margin:8px 0 0;font-size:.88rem}.popular-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.dish-card{border:1px solid #ededed;border-radius:20px;padding:12px;background:white;position:relative}.dish-info{border:0;background:none;padding:0;margin:0;text-align:left;color:inherit;font:inherit;-webkit-text-fill-color:currentColor;display:block;width:100%}.dish-card>img{height:150px;width:100%;object-fit:cover;border-radius:13px}.dish-card h3{font-size:1rem;margin:12px 0 5px}.dish-card p{font-size:.82rem;color:#888;margin:0 0 10px}.dish-foot{display:flex;justify-content:space-between;align-items:center;font-weight:800}.add-btn{width:33px;height:33px;background:#f20d2e;color:white;border:0;border-radius:50%;font-size:1.5rem;line-height:1;display:grid;place-items:center;transition:transform .2s}.add-btn:hover{transform:scale(1.1)}.add-btn.pop{animation:pop .35s}@keyframes pop{50%{transform:scale(1.3) rotate(20deg)}}.promo-band{margin-top:34px;background:#ffeff1;border-radius:24px;padding:27px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;overflow:hidden}.promo-band:before{content:"";position:absolute;width:160px;height:160px;border:1px solid #f20d2e22;border-radius:50%;right:17%;top:-45px;box-shadow:0 0 0 24px #f20d2e08,0 0 0 48px #f20d2e08}.promo-band h3{font-size:1.55rem;margin:5px 0}.promo-band p{margin:0;color:#706468}.promo-band>*{position:relative}.subhead{padding:45px 0 23px}.subhead p{color:#888;margin:8px 0 0}.back{border:0;background:none;display:inline-flex;align-items:center;gap:9px;padding:0;margin-bottom:20px;font-weight:800;color:#777}.profile-hero{height:285px;border-radius:26px;overflow:hidden;position:relative}.profile-hero img{width:100%;height:100%;object-fit:cover}.profile-hero:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,#0007)}.profile-hero div{position:absolute;bottom:22px;left:26px;color:#fff;z-index:1}.profile-hero h1{margin:0;font-size:2.5rem}.profile-hero p{margin:6px 0 0}.restaurant-layout{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:28px;margin-top:26px}.menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.menu-item{border:1px solid #eee;border-radius:18px;padding:12px;display:flex;gap:15px;align-items:center}.menu-item img{width:96px;height:96px;border-radius:13px;object-fit:cover}.menu-item h3{font-size:1rem;margin:0}.menu-item p{font-size:.82rem;color:#888;margin:5px 0 10px}.menu-item .end{display:flex;align-items:center;justify-content:space-between;font-weight:800}.panel{border:1px solid #ececec;border-radius:22px;padding:23px;background:#fff}.panel h3{font-size:1.15rem}.promo-card{background:#fff4f5;border:1px solid #ffe0e5;border-radius:16px;padding:16px;margin:13px 0}.promo-card strong{display:block}.promo-card p{font-size:.86rem;color:#787070;margin:5px 0 12px}.split{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:25px}.list{display:grid;gap:12px}.line-item{display:flex;align-items:center;gap:14px;border:1px solid #ececec;border-radius:17px;padding:13px}.line-item img{width:75px;height:75px;object-fit:cover;border-radius:11px}.line-item .detail{flex:1}.line-item strong{display:block}.line-item small{display:block;color:#888;margin-top:4px}.quantity{display:flex;align-items:center;gap:12px}.quantity button{border:1px solid #ddd;border-radius:50%;width:27px;height:27px;background:#fff}.summary-line{display:flex;justify-content:space-between;margin:12px 0;color:#777}.summary-line.total{padding-top:16px;border-top:1px solid #eee;font-weight:800;color:#191919;font-size:1.15rem}.option{display:flex;align-items:center;gap:10px;border:1px solid #ececec;border-radius:14px;padding:13px;margin:9px 0;cursor:pointer}.option input{accent-color:#ed1732;width:18px;height:18px}.option small{color:#888;margin-left:auto}.tip-row{display:flex;gap:8px;flex-wrap:wrap}.tip-row button{border:1px solid #e9e9e9;background:#fff;border-radius:11px;padding:9px 13px;font-weight:800}.tip-row button.active{background:#191919;color:#fff}.slide-track{height:59px;background:#191919;border-radius:16px;position:relative;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;touch-action:none;user-select:none;overflow:hidden;margin-top:18px}.slide-track span{pointer-events:none}.slide-knob{position:absolute;left:5px;top:5px;width:49px;height:49px;background:#f20d2e;border-radius:12px;display:grid;place-items:center;font-size:1.4rem;transform:translateX(var(--slide,0px));z-index:2}.slide-track .progress{position:absolute;left:0;top:0;bottom:0;width:var(--fill,0%);background:#f20d2e77}.wallet-balance{background:#ed1230;color:white;border-radius:25px;padding:30px;min-height:185px;position:relative;overflow:hidden}.wallet-balance:before{content:"";position:absolute;border:1px solid #ffffff33;width:280px;height:280px;border-radius:50%;right:-80px;top:-130px;box-shadow:0 0 0 36px #ffffff10,0 0 0 72px #ffffff0c}.wallet-balance span{opacity:.82}.wallet-balance strong{display:block;font:700 3rem var(--sf);margin:22px 0 0;letter-spacing:-.04em}.form-row{display:flex;gap:10px;margin-top:14px}.field{width:100%;padding:13px 15px;border:1px solid #e5e5e5;border-radius:12px;background:#fff}.form-row .field{flex:1;min-width:0}.saved-card{padding:15px;border:1px solid #ececec;border-radius:15px;display:flex;justify-content:space-between;align-items:center;margin-top:10px}.saved-card button{border:0;background:none;color:#ed1732;font-weight:800}.history-row{border-bottom:1px solid #eee;padding:18px 0;display:flex;justify-content:space-between;gap:15px;align-items:center}.history-row:first-of-type{padding-top:6px}.history-row p{margin:4px 0 0;color:#888;font-size:.87rem}.history-row .amount{font-weight:800}.profile-box{display:flex;align-items:center;gap:20px}.profile-photo{width:90px;height:90px;border-radius:50%;background:#191919;color:white;display:grid;place-items:center;font:700 2rem var(--sf);overflow:hidden}.profile-photo img{width:100%;height:100%;object-fit:cover}.profile-box input{display:none}.empty{text-align:center;padding:70px 20px;border:1px dashed #ddd;border-radius:20px;color:#888}.empty h3{color:#222}.stars{display:flex;gap:3px}.stars button{border:0;background:none;color:#ddd;font-size:1.8rem;padding:0 3px}.stars button.on{color:#ed1732}.help-list details{border-bottom:1px solid #eee;padding:17px 0}.help-list summary{font-weight:800;cursor:pointer}.help-list p{color:#777;line-height:1.6;margin:10px 0 0}.dock-wrap{position:fixed;bottom:max(21px,env(safe-area-inset-bottom));left:0;right:0;display:flex;justify-content:center;z-index:20;pointer-events:none}.dock{position:relative;background:#171717;color:#fff;border-radius:28px;box-shadow:0 18px 50px #0004;pointer-events:auto;min-width:292px;transition:width .28s,height .28s,border-radius .28s;overflow:hidden;width:292px;height:58px}.dock.expanded{width:270px;height:auto;min-height:300px;border-radius:23px;padding:8px}.dock-bar{display:flex;align-items:center;justify-content:space-around;height:58px;padding:5px}.dock-bar button{background:none;border:0;color:#aaa;width:46px;height:46px;border-radius:17px;display:grid;place-items:center;position:relative}.dock-bar button.active{color:white;background:#303030}.dock-bar button:hover{background:#303030;color:white}.dock-bar button:after{content:attr(aria-label);position:absolute;bottom:calc(100% + 13px);left:50%;transform:translateX(-50%);background:#171717;color:white;font-size:.75rem;padding:6px 9px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s}.dock-bar button:hover:after{opacity:1}.dock.expanded .dock-bar{display:none}.menu-list{padding:4px}.menu-list button{width:100%;border:0;background:transparent;color:#eee;padding:11px 12px;display:flex;align-items:center;gap:14px;border-radius:13px;text-align:left;font-size:.95rem;font-weight:700}.menu-list button:hover{background:#333}.menu-list button svg{color:#aaa}.menu-list button .chev{margin-left:auto}.menu-title{padding:8px 12px;color:#aaa;font-size:.73rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800}.dock-expand{animation:menuIn .25s ease both}@keyframes menuIn{from{opacity:0;transform:translateY(14px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}#toast{position:fixed;z-index:40;top:25px;right:25px;background:#171717;color:#fff;border-radius:12px;padding:13px 17px;box-shadow:0 12px 35px #0003;opacity:0;transform:translateY(-10px);pointer-events:none;transition:.25s}#toast.show{opacity:1;transform:translateY(0)}.fly{position:fixed;width:35px;height:35px;border-radius:50%;background:#f20d2e;z-index:50;pointer-events:none;animation:fly .6s ease-in forwards}@keyframes fly{to{left:var(--to-x);top:var(--to-y);transform:scale(.25);opacity:.1}}@media(max-width:1000px){.home-top{grid-template-columns:1fr 1fr;gap:25px}.restaurant-grid{gap:13px}.popular-grid{grid-template-columns:repeat(2,1fr)}.restaurant-layout,.split{grid-template-columns:1fr}.header-center{gap:14px}}@media(max-width:700px){.app-shell{padding:0 18px 108px}.svc,.fbar{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}.header{height:75px}.header-center{display:none}.brand{font-size:1.1rem}.brand img{width:37px;height:37px}.home-top{grid-template-columns:1fr;padding:32px 0 25px;gap:25px}.home-copy p{font-size:.99rem}.hero-visual{height:250px;order:-1}.delivery-line{margin-bottom:19px}.search-row{margin-top:23px}.search-row .primary{padding:13px}.restaurant-grid{grid-template-columns:1fr}.card-media{height:215px}.popular-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.dish-card>img{height:115px}.dish-card{padding:9px}.dish-card p{font-size:.75rem}.promo-band{padding:22px;align-items:flex-start;flex-direction:column}.menu-grid{grid-template-columns:1fr}.profile-hero{height:230px}.subhead{padding-top:30px}.section{margin-top:30px}.form-row{flex-wrap:wrap}.form-row .primary{width:100%}.header-actions .avatar{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
.delivery-line{white-space:nowrap}.delivery-line svg{width:17px;height:17px;flex:none;fill:none;stroke:#ed1732;stroke-width:2}.restaurant-grid{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:1050px){.restaurant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.home-top{grid-template-columns:1fr}.hero-visual{height:300px;order:-1}}@media(max-width:700px){.restaurant-grid{grid-template-columns:1fr}.hero-visual{height:250px}}
.wing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.wing-card{border:1px solid #ececec;border-radius:19px;overflow:hidden;background:#fff}.wing-card>img{width:100%;height:185px;object-fit:cover;object-position:center 43%;background:#faf7f4}.wing-content{padding:17px}.wing-content h3{margin:0 0 13px;font-size:1.08rem}.wing-options{display:grid;gap:7px}.wing-options button{display:flex;justify-content:space-between;gap:10px;align-items:center;text-align:left;border:1px solid #eee;background:#fff;border-radius:10px;padding:9px 11px;color:#4b4b4b;font-size:.82rem}.wing-options button:hover{border-color:#f20d2e;background:#fff5f6;color:#1b1b1b}.wing-options strong{color:#e31a35;white-space:nowrap;font-size:.85rem}@media(max-width:700px){.wing-grid{grid-template-columns:1fr}.wing-card>img{height:185px}}

/* ---------- account page ---------- */
.account{max-width:720px}
.acct-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:26px}
.acct-id h1{font-size:clamp(34px,5vw,46px);line-height:1.05;margin:0 0 12px;letter-spacing:-.02em}
.verified{display:inline-flex;align-items:center;gap:7px;background:#f4f4f5;border-radius:999px;padding:7px 13px;font-size:.82rem;font-weight:600}
.verified svg{width:17px;height:17px;stroke:none;fill:#1f6fe5}
.verified svg circle{fill:#1f6fe5}
.verified svg path{stroke:#fff;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.acct-avatar{width:78px;height:78px;border-radius:50%;background:#8b8b90;color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.3rem;overflow:hidden;flex:none}
.acct-avatar img{width:100%;height:100%;object-fit:cover}
.acct-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.acct-tiles button{background:#f4f4f5;border:0;border-radius:16px;padding:22px 10px;display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;font-size:1rem;font-weight:600;transition:background .25s ease,transform .25s ease}
.acct-tiles button:hover{background:#ededef;transform:translateY(-2px)}
.acct-tiles svg{width:25px;height:25px;stroke:#111;fill:none;stroke-width:1.7}
.acct-list{margin-top:26px;display:flex;flex-direction:column}
.acct-row{display:flex;align-items:center;gap:18px;width:100%;background:none;border:0;border-bottom:1px solid #f0f0f1;padding:18px 4px;text-align:left;cursor:pointer;transition:background .2s ease}
.acct-row:hover{background:#fafafa}
.acct-row>svg{width:24px;height:24px;stroke:#111;fill:none;stroke-width:1.6;flex:none}
.acct-text{flex:1;display:flex;flex-direction:column;gap:3px}
.acct-text strong{font-size:1.02rem;font-weight:600}
.acct-text small{color:#6b6b70;font-size:.86rem}
.acct-badge{font-style:normal;background:#1f6fe5;color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.04em;padding:5px 10px;border-radius:7px}
.acct-chev{color:#b4b4b8;font-size:1.3rem;line-height:1}
.acct-edit{margin-top:30px}

/* ---------- wallet ---------- */
.wallet-page{max-width:620px}
.wallet-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}
.wallet-top h1{font-size:1.35rem;margin:0}
.wallet-close{background:none;border:0;cursor:pointer;padding:6px;border-radius:50%}
.wallet-close:hover{background:#f2f2f3}
.wallet-close svg{width:24px;height:24px;stroke:#111;stroke-width:1.8;fill:none}
.wallet-spacer{width:36px}
.cash-card{background:linear-gradient(135deg,#f6f6f7,#eeeeef);border-radius:22px;padding:26px 24px}
.cash-label{font-size:1.05rem;font-weight:600}
.cash-amount{font-size:clamp(38px,7vw,52px);font-weight:700;letter-spacing:-.03em;margin:8px 0 10px}
.cash-note{display:flex;align-items:center;gap:9px;color:#6b6b70;font-size:.95rem}
.cash-note svg{width:19px;height:19px;stroke:#8a8a8f;fill:none;stroke-width:1.7}
.cash-add{margin-top:22px;display:inline-flex;align-items:center;gap:9px;background:#111;color:#fff;border:0;border-radius:999px;padding:15px 26px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .25s ease,background .25s ease}
.cash-add:hover{background:#000;transform:translateY(-2px)}
.cash-add svg{width:19px;height:19px;stroke:#fff;stroke-width:2.1;fill:none}
.wallet-form{margin-top:16px;border:1px solid #ececed;border-radius:18px;padding:18px}
.wallet-form label{display:block;font-size:.85rem;font-weight:600;margin-bottom:9px}
.wallet-form .muted{margin:12px 0 0;font-size:.82rem}
.gift-card{margin-top:18px;border:1px solid #ececed;border-radius:22px;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.gift-card h3{margin:0 0 7px;font-size:1.25rem}
.gift-card p{margin:0 0 16px;color:#6b6b70;font-size:.95rem;max-width:330px}
.gift-art{width:64px;height:64px;border-radius:16px;background:#e9f6ee;display:grid;place-items:center;flex:none}
.gift-art svg{width:30px;height:30px;stroke:#1f9254;fill:none;stroke-width:1.6}
.pill{background:#f2f2f3;border:0;border-radius:999px;padding:12px 20px;font-weight:600;cursor:pointer}
.pill:hover{background:#e8e8ea}
.pay-section{margin-top:34px}
.pay-section h2{font-size:1.35rem;margin:0 0 16px}
.pay-list{display:flex;flex-direction:column}
.pay-row{display:flex;align-items:center;gap:16px;padding:16px 4px;border-bottom:1px solid #f0f0f1}
.pay-mark{width:44px;height:32px;border-radius:7px;background:#f4f4f5;display:grid;place-items:center;flex:none}
.pay-mark svg{width:22px;height:22px;stroke:#3a3a3f;fill:none;stroke-width:1.6}
.pay-label{flex:1;display:flex;flex-direction:column;gap:3px}
.pay-label small{color:#8a8a8f;font-size:.8rem}
.pay-remove{background:none;border:0;color:#ed1732;font-weight:600;font-size:.88rem;cursor:pointer;padding:6px 8px;border-radius:8px}
.pay-remove:hover{background:#fdeef0}
.pay-add{margin-top:18px;display:inline-flex;align-items:center;gap:10px;background:#ed1732;color:#fff;border:0;border-radius:999px;padding:15px 24px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease}
.pay-add:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(237,23,50,.28)}
.pay-add svg{width:19px;height:19px;stroke:#fff;stroke-width:2.1;fill:none}
@media(max-width:640px){
  .acct-tiles{gap:10px}
  .acct-tiles button{padding:18px 6px;font-size:.92rem}
  .gift-card{align-items:flex-start;gap:14px}
  .gift-art{width:48px;height:48px;border-radius:13px}
  .gift-art svg{width:24px;height:24px}
  .gift-card p{margin-bottom:14px}
}

/* ---------- morphing dock ---------- */
.mm{--mm-surface:#0d0d0d;--mm-ink:rgb(255 255 255 / 92%);--mm-hover:rgb(255 255 255 / 8%);--mm-button:44px;--mm-inset:4px;
  --mm-bar-height:calc(var(--mm-button) + 2 * var(--mm-inset));
  --mm-bar-width:min(calc(var(--mm-count) * var(--mm-button) + 2 * var(--mm-inset)),calc(100vw - 32px));
  --mm-panel-width:min(268px,calc(100vw - 32px));--mm-panel-padding:8px;--mm-radius:calc(var(--mm-bar-height) / 2);
  position:fixed;left:50%;transform:translateX(-50%);bottom:max(21px,env(safe-area-inset-bottom));z-index:30;
  width:var(--mm-bar-width);height:var(--mm-bar-height);font-family:inherit;-webkit-tap-highlight-color:transparent}
.mm *,.mm *::before,.mm *::after{box-sizing:border-box}
.mm__shell{position:absolute;bottom:0;left:50%;translate:-50% 0;width:var(--mm-bar-width);height:var(--mm-bar-height);
  border-radius:var(--mm-radius);background:var(--mm-surface);color:var(--mm-ink);
  box-shadow:inset 0 1px 1px rgb(255 255 255 / 8%),inset 0 -1px 2px rgb(0 0 0 / 50%),0 12px 40px rgb(0 0 0 / 22%),0 1px 2px rgb(0 0 0 / 12%);
  overflow:hidden;isolation:isolate}
.mm__bar{position:absolute;bottom:0;left:50%;translate:-50% 0;display:flex;align-items:center;padding:var(--mm-inset);
  width:var(--mm-bar-width);height:var(--mm-bar-height)}
.mm__shortcut,.mm__row{appearance:none;display:flex;align-items:center;flex:none;border:0;margin:0;background:transparent;color:inherit;
  font:inherit;font-size:15px;font-weight:500;line-height:20px;text-decoration:none;cursor:pointer;touch-action:manipulation;scale:1;
  transition:background 150ms ease,scale 180ms cubic-bezier(.22,1,.36,1)}
.mm__shortcut{justify-content:center;width:0;flex:1;height:var(--mm-button);padding:0;border-radius:999px}
.mm__panel{position:absolute;top:0;left:50%;translate:-50% 0;width:var(--mm-panel-width);padding:var(--mm-panel-padding);
  max-height:calc(100dvh - 64px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.mm [aria-hidden="true"]{pointer-events:none}
.mm__row{gap:8px;width:100%;min-height:40px;padding:10px 12px;border-radius:calc(var(--mm-radius) - var(--mm-panel-padding));text-align:left}
.mm__panel[aria-hidden="true"] .mm__row{opacity:0}
.mm__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm__icon{display:flex;flex:none}
.mm svg{width:20px;height:20px;flex-shrink:0;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}
.mm__chevron{margin-left:auto;opacity:.6}
.mm__shortcut:focus-visible,.mm__row:focus-visible{outline:2px solid currentColor;outline-offset:-3px}
.mm__tooltip{position:absolute;bottom:calc(100% + 8px);translate:-50% 0;padding:6px 10px;border-radius:14px;background:#fff;color:#111;
  box-shadow:0 0 0 1px rgb(0 0 0 / 6%),0 1px 2px -1px rgb(0 0 0 / 6%),0 2px 4px rgb(0 0 0 / 4%);
  font-size:14px;font-weight:500;line-height:20px;white-space:nowrap;pointer-events:none}
@media (hover:hover){.mm__shortcut:hover,.mm__row:hover{background:var(--mm-hover)}}
@media (pointer:coarse){.mm{--mm-button:48px;--mm-bar-width:min(296px,calc(100vw - 32px));--mm-panel-width:min(296px,calc(100vw - 32px));--mm-panel-padding:12px}
  .mm__row{min-height:44px;padding-block:12px}}
@media (prefers-reduced-motion:no-preference){
  .mm__shortcut:active,.mm__row:active{transition-duration:100ms;transition-timing-function:cubic-bezier(.4,0,.2,1)}
  .mm__shortcut:active{scale:.95}.mm__row:active{scale:.96}}
@media (prefers-reduced-motion:reduce){.mm__shortcut,.mm__row{transition:none;scale:1}}

/* ---------- compact restaurant cards ---------- */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(232px,1fr);gap:14px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x mandatory;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail .rcard{scroll-snap-align:start}
.rgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}
.rcard{position:relative;border-radius:16px;background:#fff;overflow:hidden}
.rcard-media{display:block;width:100%;border:0;padding:0;background:#f4f2f2;border-radius:14px;overflow:hidden;position:relative;aspect-ratio:16/10;cursor:pointer}
.rcard-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease,cubic-bezier(.16,1,.3,1))}
.rcard:hover .rcard-media img{transform:scale(1.04)}
.rcard-badge{position:absolute;left:8px;top:8px;background:#ed1732;color:#fff;border-radius:7px;padding:4px 8px;font-size:.68rem;font-weight:700;letter-spacing:.01em}
.rcard .heart{right:8px;top:8px;width:32px;height:32px}
.rcard .heart svg{width:17px;height:17px}
.rcard-body{padding:9px 2px 2px}
.rcard-name{border:0;background:none;padding:0;font-size:.9rem;line-height:1.25;font-weight:700;letter-spacing:-.012em;text-align:left;cursor:pointer}
.rcard-meta{margin:3px 0 0;font-size:.78rem;line-height:1.35;color:#6d6d72;overflow-wrap:anywhere}
.rcard-rating{font-weight:700;color:#191919}
.rcard-fee{margin:1px 0 0;font-size:.78rem;line-height:1.35;color:#8a8a8f}
.dot{color:#c3c3c7}

/* ---------- dish cards ---------- */
.dish-card{border:0;border-radius:16px;padding:0;background:transparent}
.dish-media{position:relative;display:block;width:100%;border:0;padding:0;background:#f4f2f2;border-radius:14px;overflow:hidden;aspect-ratio:1;cursor:pointer}
.dish-thumb{width:100%;height:100%;object-fit:cover}
.dish-info h3{font-size:.88rem;line-height:1.25;margin:9px 0 2px}
.dish-info p{font-size:.78rem;line-height:1.35;color:#6d6d72;margin:0}
.add-fab{position:absolute;right:8px;bottom:8px;width:34px;height:34px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;
  font-size:1.25rem;font-weight:600;line-height:1;box-shadow:0 6px 16px rgb(0 0 0 / 18%)}
.add-fab.has{background:#ed1732;color:#fff;font-size:.95rem;font-weight:800}

/* ---------- restaurant page ---------- */
.rpage{padding-bottom:40px}
.rhero{position:relative;height:clamp(180px,26vw,280px);border-radius:0 0 22px 22px;overflow:hidden;margin:0 calc(-1 * clamp(20px,5vw,72px))}
.rhero img{width:100%;height:100%;object-fit:cover}
.rhero-close,.rhero-fav{position:absolute;top:16px;width:38px;height:38px;border-radius:50%;border:0;display:grid;place-items:center;background:rgb(255 255 255 / 92%);backdrop-filter:blur(6px);box-shadow:0 4px 14px rgb(0 0 0 / 18%);cursor:pointer}
.rhero-close{left:16px}.rhero-fav{right:16px;position:absolute}
.rhero-close svg{width:20px;height:20px;stroke:#111;stroke-width:2;fill:none}
.rhead{padding:20px 0 14px}
.rhead h1{font-size:clamp(26px,4vw,38px);margin:0}
.rmeta{margin:8px 0 0;color:#6d6d72;font-size:.94rem}
.rflags{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.flag{font-size:.8rem;font-weight:600;padding:7px 12px;border-radius:9px;background:#f4f2f2;color:#4a4a4f}
.flag.good{background:#eaf7ee;color:#1c7a3d}
.cat-tabs{position:sticky;top:0;z-index:12;background:rgb(255 255 255 / 94%);backdrop-filter:blur(12px);border-bottom:1px solid #eee;
  margin:0 calc(-1 * clamp(20px,5vw,72px));padding:0 clamp(20px,5vw,72px)}
.cat-track{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:10px 0}
.cat-track::-webkit-scrollbar{display:none}
.cat-tab{white-space:nowrap;border:0;background:transparent;color:#77777c;font-weight:600;font-size:.87rem;padding:9px 14px;border-radius:999px;cursor:pointer;transition:background .25s,color .25s}
.cat-tab:hover{background:#f4f2f2;color:#191919}
.cat-tab.active{background:#111;color:#fff}
.menu-sections{padding-top:6px}
.menu-cat{scroll-margin-top:120px;padding-top:26px}
.menu-cat h2{font-size:1.15rem;margin:0 0 10px}
.mrows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mrow{display:flex;gap:14px;align-items:flex-start;border:1px solid #efefef;border-radius:16px;padding:14px;background:#fff;transition:border-color .25s,box-shadow .25s}
.mrow:hover{border-color:#e2e2e2;box-shadow:0 10px 26px rgb(0 0 0 / 5%)}
.mrow-text{flex:1;min-width:0;border:0;background:none;padding:0;margin:0;text-align:left;color:inherit;font:inherit;-webkit-text-fill-color:currentColor;display:block;align-self:stretch}
.mrow-text h3{font-size:.9rem;line-height:1.25;margin:0 0 3px}
.mrow-tag{font-style:normal;font-size:.7rem;font-weight:700;color:#1c7a3d;background:#eaf7ee;border-radius:6px;padding:3px 6px;margin-left:6px;vertical-align:middle}
.mrow-price{margin:0;font-size:.82rem;font-weight:600}
.mrow-desc{margin:5px 0 0;font-size:.78rem;line-height:1.45;color:#77777c;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mrow-media{position:relative;flex:none;width:92px;height:92px;border:0;padding:0;border-radius:12px;overflow:hidden;background:#f4f2f2;cursor:pointer}
.mrow-thumb{width:100%;height:100%;object-fit:cover}
.fallback{display:grid;place-items:center;width:100%;height:100%;background:linear-gradient(150deg,#fbeef0,#f4f2f2)}
.fallback svg{width:34%;height:34%;stroke:#c9737f;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mrow .add-fab{right:6px;bottom:6px;width:30px;height:30px;font-size:1.1rem}
.line-thumb{width:70px;height:70px;object-fit:cover;border-radius:11px;flex:none}
.line-opts{display:block;color:#8a8a8f;font-size:.78rem;margin-top:3px}

/* ---------- item sheet ---------- */
body.sheet-open{}
.sheet-scrim{position:fixed;inset:0;background:rgb(12 10 11 / 45%);z-index:60;animation:fadeIn .2s ease both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.sheet{position:fixed;z-index:61;left:50%;bottom:0;transform:translateX(-50%);width:min(560px,100%);max-height:92dvh;background:#fff;
  border-radius:22px 22px 0 0;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -20px 60px rgb(0 0 0 / 25%);animation:sheetUp .36s cubic-bezier(.16,1,.3,1) both}
@keyframes sheetUp{from{transform:translate(-50%,16px);opacity:.4}to{transform:translate(-50%,0);opacity:1}}
.sheet-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #f0f0f1}
.sheet-top strong{font-size:1rem;text-align:center;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sheet-top span{width:34px}
.sheet-close{width:34px;height:34px;border:0;border-radius:50%;background:#f4f2f2;display:grid;place-items:center;cursor:pointer}
.sheet-close svg{width:19px;height:19px;stroke:#111;stroke-width:2;fill:none}
.sheet-body{overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px}
.sheet-hero{height:clamp(160px,34vw,230px);background:#f4f2f2}
.sheet-img{width:100%;height:100%;object-fit:cover}
.sheet-intro{padding:20px 20px 4px}
.sheet-intro h2{font-size:1.45rem;margin:0 0 6px}
.sheet-price{margin:0;font-size:1.15rem;font-weight:700}
.sheet-cal{margin:4px 0 0;color:#8a8a8f;font-size:.88rem}
.sheet-desc{margin:10px 0 0;color:#6d6d72;line-height:1.55;font-size:.94rem}
.sheet-tag{display:inline-block;margin-top:12px;background:#f4f2f2;border-radius:8px;padding:6px 11px;font-size:.8rem;font-weight:600}
.sheet-group{padding:18px 20px 4px;border-top:8px solid #f6f5f5;margin-top:18px}
.sheet-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:6px}
.sheet-group-head h3{font-size:1.15rem;margin:0}
.sheet-group-head p{margin:4px 0 0;color:#8a8a8f;font-size:.85rem}
.req{display:inline-flex;align-items:center;gap:6px;background:#eaf7ee;color:#1c7a3d;border-radius:8px;padding:6px 10px;font-size:.8rem;font-weight:700;white-space:nowrap}
.req svg{width:15px;height:15px;stroke:#1c7a3d;stroke-width:2.2;fill:none}
.opt-row,.extra-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid #f2f2f3}
.opt-text{display:flex;flex-direction:column;gap:3px}
.opt-text small{color:#8a8a8f;font-size:.82rem}
.opt-row input[type=radio]{width:22px;height:22px;accent-color:#111;flex:none}
.extra-add{width:34px;height:34px;border-radius:50%;border:1px solid #e6e6e7;background:#fff;display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s}
.extra-add svg{width:18px;height:18px;stroke:#111;stroke-width:2;fill:none}
.extra-add.on{background:#111;border-color:#111}
.extra-add.on svg{stroke:#fff}
.qty-group{display:flex;justify-content:flex-start;padding-bottom:20px}
.qty-stepper{display:inline-flex;align-items:center;gap:20px;background:#f4f2f2;border-radius:999px;padding:8px 18px;font-weight:700}
.qty-stepper button{border:0;background:none;font-size:1.3rem;line-height:1;cursor:pointer;color:#111}
.sheet-foot{padding:14px 20px calc(14px + env(safe-area-inset-bottom));border-top:1px solid #f0f0f1;background:#fff}
.sheet-add{width:100%;border:0;border-radius:16px;padding:17px;background:#111;color:#fff;font-size:1rem;font-weight:700;cursor:pointer;transition:transform .2s,background .2s}
.sheet-add:hover{background:#000;transform:translateY(-1px)}
.sheet-add .dot{color:rgb(255 255 255 / 55%)}

@media(max-width:1000px){.rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
  .rgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .rail{grid-auto-columns:minmax(210px,1fr)}
  .mrows{grid-template-columns:1fr}
  .rcard-name{font-size:.9rem}
  .rcard-meta,.rcard-fee{font-size:.77rem}
  .menu-cat{padding-top:20px}
  .sheet{width:100%}
}

/* ---------- featured lead card ---------- */
.lead{position:relative;border-radius:20px;overflow:hidden;background:#fff;border:1px solid #efefef;margin-bottom:18px;box-shadow:0 14px 40px rgb(0 0 0 / 6%)}
.lead-media{position:relative;display:block;width:100%;border:0;padding:0;background:#f4f2f2;aspect-ratio:16/7;cursor:pointer;overflow:hidden}
.lead-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.lead:hover .lead-media img{transform:scale(1.03)}
.lead-flag{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;gap:6px;background:#ed1732;color:#fff;border-radius:9px;padding:6px 10px;font-size:.7rem;font-weight:700}
.lead-flag svg{width:14px;height:14px;stroke:#fff;stroke-width:1.8;fill:none}
.lead .heart{right:12px;top:12px;width:36px;height:36px}
.lead-body{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:16px 18px 18px;flex-wrap:wrap}
.lead-name{border:0;background:none;padding:0;font-size:1.02rem;line-height:1.25;font-weight:700;letter-spacing:-.018em;text-align:left;cursor:pointer}
.lead-meta{margin:4px 0 0;font-size:.79rem;line-height:1.35;color:#6d6d72}
.lead-desc{margin:5px 0 0;font-size:.79rem;line-height:1.4;color:#77777c;max-width:520px}
.lead-cta{white-space:nowrap;padding:13px 20px;border-radius:13px}
@media(max-width:700px){.lead-media{aspect-ratio:16/9}.lead-body{padding:14px}.lead-cta{width:100%}}

/* ---------- hero features the lead restaurant ---------- */
.hero-visual{display:block;width:100%;border:0;padding:0;text-align:left;cursor:pointer}
.hero-visual img{transition:transform .7s cubic-bezier(.16,1,.3,1)}
.hero-visual:hover img{transform:scale(1.04)}
.hero-flag{position:absolute;left:16px;top:16px;z-index:3;display:inline-flex;align-items:center;gap:7px;background:#ed1732;color:#fff;border-radius:10px;padding:8px 12px;font-size:.76rem;font-weight:700}
.hero-flag svg{width:16px;height:16px;stroke:#fff;stroke-width:1.8;fill:none}
.hero-card{position:absolute;left:18px;bottom:18px;z-index:3;display:flex;flex-direction:column;gap:5px;color:#fff;text-shadow:0 2px 14px rgb(0 0 0 / 45%)}
.hero-card-name{font-size:1.08rem;font-weight:700;letter-spacing:-.02em}
.hero-card-meta{font-size:.78rem;opacity:.92}
.hero-card-meta .dot{color:rgb(255 255 255 / 55%)}
.hero-card-cta{position:absolute;right:18px;bottom:18px;z-index:3;display:inline-flex;align-items:center;gap:8px;background:rgb(255 255 255 / 94%);color:#111;
  border-radius:999px;padding:11px 17px;font-size:.85rem;font-weight:700;backdrop-filter:blur(8px);box-shadow:0 8px 24px rgb(0 0 0 / 18%)}
.hero-card-cta svg{width:16px;height:16px;stroke:#111;stroke-width:2;fill:none}
@media(max-width:700px){.hero-card-cta{display:none}.hero-card{left:14px;bottom:14px}.hero-card-name{font-size:1rem}}

/* ---------- delivery / pickup ---------- */
.mode-toggle{display:inline-flex;gap:4px;background:#f4f2f2;border-radius:14px;padding:4px;margin-top:14px}
.mode-toggle button{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;color:#6d6d72;font-weight:600;font-size:.9rem;
  padding:10px 16px;border-radius:11px;cursor:pointer;transition:background .25s,color .25s,box-shadow .25s}
.mode-toggle button svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mode-toggle button.on{background:#fff;color:#111;box-shadow:0 2px 8px rgb(0 0 0 / 10%)}
.mode-home{margin:0 0 22px}
.mode-cart{display:flex;width:100%;margin:0 0 14px}
.mode-cart button{flex:1;justify-content:center}
#sheet-host:empty{display:none}

/* ---------- group order + account cleanup ---------- */
.mode-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.group-btn{display:inline-flex;flex-direction:column;align-items:center;gap:4px;border:0;background:#f4f2f2;border-radius:14px;padding:10px 18px;
  font-size:.8rem;font-weight:600;color:#3a3a3f;cursor:pointer;margin-top:14px;transition:background .25s,transform .25s}
.group-btn:hover{background:#ededee;transform:translateY(-1px)}
.group-btn svg{width:21px;height:21px;stroke:#111;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sheet-top .soon-pill{width:auto}
.soon-pill{background:#fdeef0;color:#ed1732;border-radius:999px;padding:6px 12px;font-size:.72rem;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.group-sheet .sheet-top strong{flex:1}
.group-art{display:grid;place-items:center;padding:26px 20px 6px}
.group-art svg{width:min(240px,70%);height:auto}
.group-intro{padding:6px 20px 0}
.group-intro h2{font-size:1.6rem;margin:0 0 8px;letter-spacing:-.02em}
.group-intro p{margin:0;color:#6d6d72;line-height:1.55}
.group-banner{display:flex;align-items:center;gap:14px;margin:20px 20px 4px;padding:14px;border-radius:16px;background:#f6f5f5}
.group-banner p{flex:1;margin:0;font-size:.9rem;line-height:1.4}
.group-banner-ico{width:34px;height:34px;border-radius:50%;background:#111;display:grid;place-items:center;flex:none}
.group-banner-ico svg{width:19px;height:19px;stroke:#fff;stroke-width:2.2;fill:none}
.group-row{display:flex;align-items:center;gap:14px;width:100%;border:0;background:none;padding:16px 20px;border-bottom:1px solid #f2f2f3;cursor:pointer;text-align:left}
.group-row:hover{background:#fafafa}
.group-row-ico{width:34px;height:34px;border-radius:10px;background:#f4f2f2;display:grid;place-items:center;flex:none}
.group-row-ico svg{width:19px;height:19px;stroke:#3a3a3f;stroke-width:1.7;fill:none}
.group-row-text{flex:1;display:flex;flex-direction:column;gap:3px}
.group-row-text small{color:#8a8a8f;font-size:.83rem}
.group-note{margin:18px 20px 6px;color:#8a8a8f;font-size:.85rem;line-height:1.55}
.acct-sub{display:block;color:#6d6d72;font-size:.92rem;margin-top:4px}
.acct-avatar.guest svg{width:34px;height:34px;stroke:#fff;stroke-width:1.7;fill:none}
.signup{margin:26px 0 4px;border:1px solid #efefef;border-radius:20px;padding:24px;background:linear-gradient(170deg,#fff6f7,#fff)}
.signup h2{font-size:1.35rem;margin:0 0 6px}
.signup>p{margin:0 0 18px;color:#6d6d72;font-size:.94rem}
.signup form{display:grid;gap:10px}
.signup .primary{width:100%;padding:15px}
.signup-note{margin:14px 0 0;font-size:.9rem;color:#6d6d72}
.signup-note .text-button{padding:0 2px}
.signup-demo{margin:12px 0 0;font-size:.78rem;line-height:1.5}

/* ---------- dock: cart badge + in-restaurant context bar ---------- */
.app-shell.quiet .page{animation:none}
.mm__badge{position:absolute;top:4px;right:4px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#ed1732;color:#fff;
  font-style:normal;font-size:11px;font-weight:800;line-height:18px;text-align:center;box-shadow:0 0 0 2px var(--mm-surface)}
.mm__shortcut{position:relative}
.mm[data-context="restaurant"]{--mm-bar-width:min(calc(100vw - 32px),340px)}
.mm__ctx-search{display:flex;align-items:center;gap:10px;flex:1;min-width:0;height:var(--mm-button);padding:0 14px;border:0;border-radius:999px;
  background:rgb(255 255 255 / 8%);color:var(--mm-ink);font:inherit;font-size:14px;font-weight:500;cursor:pointer;text-align:left}
.mm__ctx-search:hover{background:rgb(255 255 255 / 14%)}
.mm__ctx-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm__ctx-input{flex:1;min-width:0;height:var(--mm-button);padding:0 14px;border:0;border-radius:999px;background:rgb(255 255 255 / 12%);
  color:#fff;font:inherit;font-size:14px;outline:none}
.mm__ctx-input::placeholder{color:rgb(255 255 255 / 55%)}
.mm__ctx-cart{flex:none;width:var(--mm-button);margin-left:6px}

/* ---------- in-restaurant search panel ---------- */
body.rsearch-open{}
body.rsearch-open .mm{display:none}
#rsearch-host:empty{display:none}
.rs{position:fixed;inset:0;z-index:55;background:#fff;display:flex;flex-direction:column;animation:rsIn .22s cubic-bezier(.16,1,.3,1) both}
@keyframes rsIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.rs-bar{display:flex;align-items:center;gap:10px;padding:14px 16px calc(14px + env(safe-area-inset-top,0px));padding-top:max(14px,env(safe-area-inset-top,14px));background:#fff;border-bottom:1px solid #f0f0f1}
.rs-back,.rs-store{flex:none;width:44px;height:44px;border:0;border-radius:50%;background:#f4f2f2;display:grid;place-items:center;cursor:pointer}
.rs-back svg,.rs-store svg{width:21px;height:21px;stroke:#111;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.rs-field{flex:1;position:relative;display:flex;align-items:center;background:#f4f2f2;border-radius:999px;padding:0 44px 0 18px;height:48px}
.rs-field input{width:100%;height:100%;border:0;background:transparent;outline:none;font:inherit;font-size:1rem;color:#111}
.rs-field input::-webkit-search-cancel-button{display:none}
.rs-clear{position:absolute;right:6px;width:32px;height:32px;border:0;border-radius:50%;background:#dcd9d9;display:grid;place-items:center;cursor:pointer}
.rs-clear svg{width:15px;height:15px;stroke:#fff;stroke-width:2.6;fill:none}
.rs-results{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px clamp(16px,5vw,32px) 60px}
.rs-group{padding-top:20px}
.rs-group h2{font-size:1.3rem;margin:0 0 12px}
.rs-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rs-empty{padding:70px 10px;text-align:center;color:#8a8a8f}
.rs-empty h3{color:#191919;margin:0 0 8px;font-size:1.2rem}
@media(max-width:820px){.rs-rows{grid-template-columns:1fr}}

/* ---------- extras stepper + "anything else" upsell ---------- */
.extra-step{display:inline-flex;align-items:center;gap:14px;background:#f4f2f2;border-radius:999px;padding:6px 14px;font-weight:700}
.extra-step button{border:0;background:none;font-size:1.2rem;line-height:1;cursor:pointer;color:#111}
.extra-step button[disabled]{opacity:.3;cursor:default}
.extra-step b{min-width:12px;text-align:center}
.upsell{margin:0 0 18px;border:1px solid #efefef;border-radius:20px;padding:18px 18px 14px;background:linear-gradient(170deg,#fff7f8,#fff)}
.upsell-head h3{margin:0 0 4px;font-size:1.15rem}
.upsell-head p{margin:0 0 14px;color:#8a8a8f;font-size:.86rem}
.upsell-rail{display:grid;grid-auto-flow:column;grid-auto-columns:132px;gap:12px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
.upsell-rail::-webkit-scrollbar{display:none}
.up-card{position:relative;display:flex;flex-direction:column;gap:6px;border:0;background:none;padding:0;text-align:left;cursor:pointer}
.up-thumb{width:132px;height:110px;object-fit:cover;border-radius:13px;background:#f4f2f2}
.up-card .fallback{width:132px;height:110px;border-radius:13px}
.up-name{font-size:.86rem;font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.up-price{font-size:.82rem;color:#6d6d72}
.up-plus{position:absolute;right:7px;top:78px;width:28px;height:28px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 5px 14px rgb(0 0 0 / 18%)}
.up-plus svg{width:15px;height:15px;stroke:#111;stroke-width:2.4;fill:none}

/* ---------- slide to confirm, in Zuma colours ---------- */
.s2c{--s2c-track:#141115;--s2c-fill:#ed1732;--s2c-thumb:#fff;--s2c-icon:#ed1732;--s2c-height:58px;margin-top:18px}

/* ---------- complete your order ---------- */
body.complete-open{}
body.complete-open .mm{display:none}
#complete-host:empty{display:none}
.cc{position:fixed;inset:0;z-index:56;background:#fff;display:flex;flex-direction:column;animation:rsIn .26s cubic-bezier(.16,1,.3,1) both}
.cc-top{padding:max(14px,env(safe-area-inset-top,14px)) 16px 0}
.cc-back{width:44px;height:44px;border:0;border-radius:50%;background:#f4f2f2;display:grid;place-items:center;cursor:pointer}
.cc-back svg{width:21px;height:21px;stroke:#111;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cc-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:10px clamp(16px,5vw,32px) 24px}
.cc-body h1{font-size:clamp(21px,4.6vw,28px);margin:6px 0 4px;letter-spacing:-.022em}
.cc-sub{margin:0 0 16px;color:#6d6d72;font-size:.82rem;line-height:1.4}
.cc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
.cc-card{display:flex;flex-direction:column}
.cc-media{position:relative;display:block;width:100%;aspect-ratio:1;border:0;padding:0;border-radius:14px;overflow:hidden;background:#f4f2f2;cursor:pointer}
.cc-thumb{width:100%;height:100%;object-fit:cover}
.cc-badge{position:absolute;left:8px;top:8px;background:#1c7a3d;color:#fff;border-radius:7px;padding:4px 8px;font-size:.68rem;font-weight:700}
.cc-info h3{font-size:.88rem;margin:9px 0 3px;line-height:1.25}
.cc-price{margin:0;font-weight:700;font-size:.82rem}
.cc-cal{margin:2px 0 0;color:#8a8a8f;font-size:.76rem}
.cc-foot{padding:12px clamp(16px,5vw,32px) calc(14px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #f0f0f1}
.cc-skip{width:100%;border:0;border-radius:16px;padding:18px;background:#111;color:#fff;font-size:1.02rem;font-weight:700;cursor:pointer;transition:background .2s,transform .2s}
.cc-skip:hover{background:#000;transform:translateY(-1px)}
@media(min-width:900px){.cc-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.cc{padding-inline:0}}

/* ---------- slimmer numerals ---------- */
.mrow-price,.dish-info p,.up-price,.cc-price,.rcard-meta,.rcard-fee{font-weight:500;font-variant-numeric:tabular-nums}
.sheet-price{font-weight:600;font-variant-numeric:tabular-nums}
.summary-line,.summary-line.total,.line-item small{font-variant-numeric:tabular-nums}
.summary-line.total{font-weight:600}
.cash-amount{font-weight:600;font-variant-numeric:tabular-nums}

/* ---------- slide-to-confirm: never widen the layout ---------- */
.s2c{max-width:100%;min-width:0;width:100%}
.s2c-label{padding:0 64px;min-width:0;white-space:nowrap;overflow:hidden}
.panel,.split>*{min-width:0}

/* ---------- checkout ---------- */
body.checkout-open{}
body.checkout-open .mm{display:none}
#checkout-host:empty{display:none}
.ck{position:fixed;inset:0;z-index:57;background:#fff;display:flex;flex-direction:column;animation:rsIn .26s cubic-bezier(.16,1,.3,1) both}
.ck-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:max(14px,env(safe-area-inset-top,14px)) 16px 14px;border-bottom:1px solid #f2f2f3}
.ck-top strong{flex:1;text-align:center;font-size:1.05rem}
.ck-top span{width:44px}
.ck-back{width:44px;height:44px;border:0;border-radius:50%;background:#f4f2f2;display:grid;place-items:center;cursor:pointer}
.ck-back svg{width:21px;height:21px;stroke:#111;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.ck-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding-bottom:20px}
.ck-time{display:flex;align-items:center;gap:12px;padding:20px clamp(16px,5vw,28px) 14px}
.ck-time-ico{width:30px;height:30px;display:grid;place-items:center;flex:none}
.ck-time-ico svg{width:23px;height:23px;stroke:#111;stroke-width:1.7;fill:none}
.ck-time-label{flex:1;font-weight:700;font-size:1.05rem}
.ck-time-val{font-weight:500;font-variant-numeric:tabular-nums;color:#3a3a3f}
.ck-speeds{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(168px,1fr);gap:12px;overflow-x:auto;padding:4px clamp(16px,5vw,28px) 20px;scrollbar-width:none}
.ck-speeds::-webkit-scrollbar{display:none}
.ck-speed{position:relative;display:flex;flex-direction:column;gap:5px;align-items:flex-start;text-align:left;border:1.5px solid #ececed;border-radius:16px;background:#fff;padding:16px 14px;cursor:pointer;min-height:104px;transition:border-color .25s,box-shadow .25s}
.ck-speed.on{border-color:#111;border-width:2px;box-shadow:0 6px 18px rgb(0 0 0 / 6%)}
.ck-speed b{font-size:1rem}
.ck-speed .bolt{font-style:normal;font-size:.85rem}
.ck-speed small{color:#6d6d72;font-size:.85rem;font-variant-numeric:tabular-nums}
.ck-speed em{font-style:normal;color:#1c7a3d;font-size:.82rem;line-height:1.3}
.ck-speed-fee{font-size:.85rem;color:#3a3a3f;font-weight:500}
/* The courier's tip (delivery only). A chosen amount is filled black and
   says so to screen readers (aria-checked), so it never rests on colour. */
.ck-tip{border-top:8px solid #f6f5f5;padding:20px clamp(16px,5vw,28px) 18px}
.ck-tip h2{font-size:1.05rem;letter-spacing:-.02em;margin:0 0 4px}
.ck-tip-chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.ck-tip-chip{min-height:48px;padding:0 2px;border:1.5px solid #ececed;border-radius:14px;background:#fff;color:#111;font-weight:700;font-size:.9rem;cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s}
.ck-tip-chip.on{background:#111;border-color:#111;color:#fff}
.ck-tip-custom{display:flex;align-items:center;gap:8px;margin-top:12px;border:1.5px solid #ececed;border-radius:14px;padding:0 14px}
.ck-tip-custom[hidden]{display:none}
.ck-tip-custom span{font-weight:700;color:#3a3a3f}
.ck-tip-custom input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:14px 0;font-size:1rem;font-variant-numeric:tabular-nums}
.ck-tip-msg{margin:8px 0 0;color:#b3122a;font-size:.84rem;min-height:0}
.ck-tip-msg:empty{display:none}
.ck-sum{border-top:8px solid #f6f5f5;padding:20px clamp(16px,5vw,28px) 0}
.ck-sum h2{font-size:1.4rem;margin:0 0 14px}
.ck-place{display:flex;align-items:center;gap:14px;width:100%;border:0;background:none;padding:12px 0;cursor:pointer;text-align:left;border-bottom:1px solid #f2f2f3}
.ck-thumb{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none}
.ck-place .fallback{width:46px;height:46px;border-radius:50%}
.ck-place-text{flex:1;display:flex;flex-direction:column;gap:3px}
.ck-place-text small{color:#8a8a8f;font-size:.86rem}
.ck-chev{font-size:1.5rem;line-height:.6;color:#8a8a8f;transition:transform .3s}
.ck-chev.up{transform:rotate(180deg)}
.ck-lines{padding:6px 0 10px;border-bottom:1px solid #f2f2f3}
.ck-line{display:flex;align-items:flex-start;gap:12px;padding:10px 0}
.ck-qty{min-width:26px;height:26px;border-radius:7px;background:#f4f2f2;display:grid;place-items:center;font-size:.85rem;font-weight:600;flex:none}
.ck-line-text{flex:1;display:flex;flex-direction:column;gap:3px;font-size:.95rem}
.ck-line-text small{color:#8a8a8f;font-size:.82rem;line-height:1.35}
.ck-line-price{font-weight:500;font-variant-numeric:tabular-nums}
.ck-row{display:flex;align-items:center;gap:14px;width:100%;border:0;background:none;padding:15px 0;cursor:pointer;text-align:left;border-bottom:1px solid #f2f2f3}
.ck-row-ico{width:38px;height:38px;border-radius:11px;background:#f4f2f2;display:grid;place-items:center;flex:none}
.ck-row-ico.gift{background:#eaf7ee}
.ck-row-ico svg{width:20px;height:20px;stroke:#3a3a3f;stroke-width:1.7;fill:none}
.ck-row-ico.gift svg{stroke:#1c7a3d}
.ck-row-text{flex:1;display:flex;flex-direction:column;gap:3px}
.ck-row-text small{color:#8a8a8f;font-size:.85rem}
.ck-totals{padding:18px 0 4px}
.ck-t{display:flex;justify-content:space-between;gap:16px;padding:8px 0;font-size:.97rem;color:#3a3a3f;font-variant-numeric:tabular-nums}
.ck-t span:last-child{font-weight:500}
.ck-t.save span:last-child{color:#1c7a3d}
.ck-t.total{margin-top:8px;padding-top:14px;border-top:1px solid #efefef;font-size:1.15rem;color:#111;font-weight:700}
.ck-t.total span:last-child{font-weight:600}
.ck-note{margin:14px 0 0;color:#a0a0a5;font-size:.78rem;line-height:1.5}
.ck-save{display:flex;align-items:center;gap:10px;background:#ed1732;color:#fff;padding:14px clamp(16px,5vw,28px);font-weight:600;font-size:.95rem}
.ck-save svg{width:19px;height:19px;stroke:#fff;stroke-width:1.8;fill:none}
.ck-foot{padding:12px clamp(16px,5vw,28px) calc(14px + env(safe-area-inset-bottom));border-top:1px solid #f0f0f1;background:#fff}
.ck-next{width:100%;border:0;border-radius:16px;padding:18px;background:#111;color:#fff;font-size:1.02rem;font-weight:700;cursor:pointer;font-variant-numeric:tabular-nums;transition:background .2s,transform .2s}
.ck-next:hover{background:#000;transform:translateY(-1px)}
@media(min-width:900px){.ck-body{max-width:640px;margin:0 auto;width:100%}.ck-foot,.ck-save{max-width:640px;margin:0 auto;width:100%}}

/* cart: continue button replaces the slider */
.cart-next{width:100%;margin-top:18px;padding:17px;border-radius:16px;font-size:1rem;font-variant-numeric:tabular-nums}
.ck-foot .s2c{margin-top:0}

/* order summary numerals match the checkout weight */
.split .panel h3{font-weight:600}
.summary-line{font-weight:400;color:#3a3a3f}
.summary-line span:last-child{font-weight:500}
.summary-line.total{font-weight:600;font-size:1.1rem;color:#111}
.summary-line.total span:last-child{font-weight:600}
.tip-row button{font-weight:500;font-variant-numeric:tabular-nums}
.tip-row button.active{font-weight:600}
.line-item strong{font-weight:600}
.line-item small{font-weight:400}
.cart-next{font-weight:600}

/* ---------- listing type scale (matches the compact reference) ---------- */
.section-head h2{font-size:clamp(1.25rem,2.1vw,1.75rem)}
.chip{font-size:.85rem;padding:9px 15px}
.section-head p{font-size:.86rem;margin-top:4px}
@media(max-width:700px){
  .section-head h2{font-size:1.18rem}
  .section-head p{font-size:.8rem}
  .section{margin-top:26px}
  .lead-name{font-size:.98rem}
  .lead-meta,.lead-desc{font-size:.77rem}
  .mrow-text h3{font-size:.87rem}
  .mrow-desc,.mrow-price{font-size:.76rem}
  .dish-info h3{font-size:.85rem}
  .dish-info p{font-size:.76rem}
  .chip{font-size:.8rem;padding:8px 14px}
}

/* ---------- empty-the-cart ---------- */
.cart-bar{display:flex;justify-content:flex-start;padding:18px 0 0}
.cart-trash{width:40px;height:40px;border-radius:50%;border:1px solid #ececec;background:#fff;color:#8a8a8f;display:grid;place-items:center;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.cart-trash svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cart-trash:hover{color:#ed1732;border-color:#f6ccd3;background:#fff6f7}
.cart-bar + .subhead{padding-top:14px}
body.confirm-open{}
.cf-scrim{position:fixed;inset:0;z-index:80;border:0;padding:0;background:rgb(12 10 11 / 48%);animation:fadeIn .2s ease both;cursor:default}
.cf{position:fixed;z-index:81;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100% - 36px));
  background:#fff;border-radius:22px;padding:26px 24px 20px;text-align:center;box-shadow:0 26px 70px rgb(0 0 0 / 28%);
  animation:cfIn .32s cubic-bezier(.16,1,.3,1) both}
@keyframes cfIn{from{transform:translate(-50%,-46%) scale(.94);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
.cf-ico{width:52px;height:52px;border-radius:50%;background:#fff1f3;color:#ed1732;display:grid;place-items:center;margin:0 auto 14px}
.cf-ico svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cf h2{font-size:1.15rem;line-height:1.3;margin:0 0 6px;letter-spacing:-.02em}
.cf p{margin:0 0 20px;font-size:.87rem;line-height:1.45;color:#77777c}
.cf-acts{display:grid;gap:9px}
.cf-keep{border:1px solid #e7e7e7;background:#fff;color:#191919;border-radius:14px;padding:13px;font-weight:600;cursor:pointer}
.cf-keep:hover{background:#f7f5f5}
.cf-go{border:0;background:#ed1732;color:#fff;border-radius:14px;padding:13px;font-weight:600;cursor:pointer}
.cf-go:hover{background:#d5122b}

/* ---------- complete-your-order CTA ---------- */
.cc-go{width:100%;border-radius:14px;padding:15px;font-weight:600;font-variant-numeric:tabular-nums}

/* ---------- names render black on every platform (iOS paints bare buttons blue) ---------- */
.rcard-name,.lead-name,.cc-info h3,.mrow-text h3,.dish-info h3{color:#111;-webkit-text-fill-color:#111}

/* ---------- service tabs ---------- */
.svc{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid #f0eeee;margin:0 calc(-1 * clamp(20px,5vw,72px));padding:0 clamp(20px,5vw,72px)}
.svc::-webkit-scrollbar{display:none}
.svc-tab{position:relative;border:0;background:none;padding:16px 0 14px;white-space:nowrap;color:#77777c;font-size:.95rem;font-weight:600;cursor:pointer}
.svc-tab.on{color:#111}
.svc-tab.on:after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px 3px 0 0;background:#111}

/* ---------- filter bar ---------- */
.fbar{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:14px 0 4px;margin:0 calc(-1 * clamp(20px,5vw,72px));padding-left:clamp(20px,5vw,72px);padding-right:clamp(20px,5vw,72px)}
.fbar::-webkit-scrollbar{display:none}
.fchip{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border:1px solid #ececec;background:#f6f5f5;color:#3a3a3f;border-radius:999px;padding:9px 15px;font-size:.84rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.fchip:hover{background:#eeecec}
.fchip svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fchip.on{background:#111;border-color:#111;color:#fff}
.fcaret{font-style:normal;font-size:1rem;line-height:0;position:relative;top:-2px;opacity:.75}
.fres{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0 2px;font-size:.92rem;font-weight:600}
.fres-reset{border:0;background:#f4f2f2;color:#111;border-radius:999px;padding:9px 17px;font-size:.84rem;font-weight:600;cursor:pointer}
.fres-reset:hover{background:#eceaea}

/* ---------- filter sheet ---------- */
body.fsheet-open{}
.fs-scrim{position:fixed;inset:0;z-index:70;border:0;padding:0;background:rgb(12 10 11 / 45%);animation:fadeIn .2s ease both;cursor:default}
.fs{position:fixed;z-index:71;left:50%;bottom:0;transform:translateX(-50%);width:min(560px,100%);background:#fff;
  border-radius:20px 20px 0 0;box-shadow:0 -20px 60px rgb(0 0 0 / 22%);animation:sheetUp .34s cubic-bezier(.16,1,.3,1) both;
  padding-bottom:max(18px,env(safe-area-inset-bottom))}
.fs-top{text-align:center;padding:20px 20px 16px;border-bottom:1px solid #f0f0f1}
.fs-top strong{font-size:1.1rem;letter-spacing:-.02em}
.fs-body{padding:22px 22px 6px}
.fs-value{margin:0 0 20px;font-size:1.02rem;font-weight:600}
.fs-ticks{display:flex;justify-content:space-between;font-size:.86rem;font-weight:600;margin-bottom:6px}
.fs-ticks span{flex:1;text-align:left}
.fs-ticks span:last-child{flex:0;text-align:right}
.fs-range{-webkit-appearance:none;appearance:none;width:100%;height:26px;background:transparent;cursor:pointer}
.fs-range::-webkit-slider-runnable-track{height:2px;background:#111;border-radius:2px}
.fs-range::-moz-range-track{height:2px;background:#111;border-radius:2px}
.fs-range::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#111;margin-top:-12px;border:0}
.fs-range::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#111;border:0}
.fs-prices{display:flex;gap:10px;flex-wrap:wrap}
.fs-price{flex:1;min-width:66px;border:0;background:#f4f2f2;color:#111;border-radius:999px;padding:14px 10px;font-weight:600;cursor:pointer}
.fs-price.on{background:#111;color:#fff}
.fs-sorts{display:grid}
.fs-sort{display:flex;align-items:center;gap:16px;border:0;border-bottom:1px solid #f0f0f1;background:none;padding:16px 2px;font-size:.98rem;font-weight:500;color:#111;text-align:left;cursor:pointer}
.fs-sort:last-child{border-bottom:0}
.fs-radio{width:22px;height:22px;border-radius:50%;border:2px solid #c9c9ce;flex:none;display:grid;place-items:center}
.fs-sort.on .fs-radio{border-color:#111;background:#111;box-shadow:inset 0 0 0 4px #fff}
.fs-foot{padding:14px 22px 6px}
.fs-apply{width:100%;border:0;background:#111;color:#fff;border-radius:14px;padding:16px;font-size:1rem;font-weight:600;cursor:pointer}
.fs-apply:hover{background:#000}
.fs-reset{width:100%;border:0;background:none;color:#111;padding:16px;font-size:1rem;font-weight:500;cursor:pointer}

@media(max-width:700px){
  .svc{gap:20px}
  .svc-tab{font-size:.88rem;padding:14px 0 12px}
  .fchip{font-size:.8rem;padding:8px 13px}
  .fres{font-size:.86rem}
}

/* ---------- home top: search over a full-width hero ---------- */
.home-top{grid-template-columns:1fr;gap:16px;padding:20px 0 6px}
.home-copy .search-row{max-width:none;margin-top:0}
.hero-visual{height:clamp(220px,30vw,320px)}
@media(max-width:700px){
  .home-top{padding:16px 0 4px;gap:14px}
  .hero-visual{height:210px;order:0}
  .search-row{margin-top:0}
}

/* ---------- service tab icons ---------- */
.svc-tab{display:inline-flex;align-items:center;gap:7px}
.svc-tab svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;opacity:.9}
.svc-tab.on svg{opacity:1}
@media(max-width:700px){.svc-tab svg{width:17px;height:17px}.svc{gap:16px}}

/* ---------- quantity numerals stay light ---------- */
.add-fab.has{font-weight:500;font-variant-numeric:tabular-nums}
.qty-stepper{font-weight:400;font-variant-numeric:tabular-nums}
.qty-stepper span{min-width:18px;text-align:center;font-weight:500}
.qty-stepper button{font-weight:400}
.quantity{font-weight:500;font-variant-numeric:tabular-nums}
.quantity button{font-weight:400}
.ex-qty,.ex-step,.ex-step span{font-weight:500;font-variant-numeric:tabular-nums}
.mm__badge{font-weight:600;font-variant-numeric:tabular-nums}
.count{font-weight:600;font-variant-numeric:tabular-nums}
.sheet-add{font-weight:600}
.extra-step{font-weight:400;font-variant-numeric:tabular-nums}
.extra-step span{min-width:16px;text-align:center;font-weight:500}
.extra-step button{font-weight:400}

/* ---------- app-wide search results ---------- */
.gs-places{display:grid;gap:8px}
.gs-place{display:flex;align-items:center;gap:13px;width:100%;border:1px solid #efefef;background:#fff;border-radius:16px;padding:10px 13px 10px 10px;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.gs-place:hover{border-color:#e2e2e2;box-shadow:0 10px 26px rgb(0 0 0 / 5%)}
.gs-thumb{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none;background:#f4f2f2}
.gs-place .fallback{width:56px;height:56px;border-radius:12px;flex:none}
.gs-place-text{flex:1;min-width:0}
.gs-place-text strong{display:block;font-size:.9rem;color:#111;line-height:1.25}
.gs-place-text small{display:block;margin-top:3px;font-size:.78rem;color:#6d6d72}
.gs-place .acct-chev{color:#c3c3c7;font-size:1.25rem;flex:none}

/* ---------- live order tracking ---------- */
.lo-count{display:grid;place-items:center;min-width:26px;height:26px;padding:0 8px;border-radius:999px;background:#ed1732;color:#fff;font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums}
.lo{border:1px solid #efefef;border-radius:20px;background:#fff;padding:18px;margin-bottom:14px;box-shadow:0 14px 38px rgb(0 0 0 / 6%)}
.lo-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.lo-pulse{width:10px;height:10px;border-radius:50%;background:#1c7a3d;flex:none;box-shadow:0 0 0 0 rgb(28 122 61 / 45%);animation:loPulse 1.9s infinite}
@keyframes loPulse{70%{box-shadow:0 0 0 9px rgb(28 122 61 / 0)}100%{box-shadow:0 0 0 0 rgb(28 122 61 / 0)}}
.lo-head-text{flex:1;min-width:0}
.lo-head-text small{display:block;font-size:.75rem;color:#77777c}
.lo-head-text strong{display:block;font-size:1.18rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-weight:600}
.lo-badge{font-size:.66rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#1c7a3d;background:#eaf7ee;border-radius:7px;padding:5px 8px}
.lo-bar{height:5px;border-radius:5px;background:#f0eeee;overflow:hidden}
.lo-bar span{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#f6512c,#ed1732);transition:width .7s cubic-bezier(.16,1,.3,1)}
.lo-stage{margin:11px 0 0;font-size:.82rem;color:#6d6d72}
.lo-stage b{color:#111;font-weight:600}
.lo-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:0}
.lo-steps li{display:flex;align-items:center;gap:12px;font-size:.82rem;color:#9a9aa0;position:relative;padding:7px 0}
.lo-steps li:not(:last-child):before{content:'';position:absolute;left:10px;top:24px;bottom:-4px;width:2px;background:#eeecec}
.lo-steps li.done:not(:last-child):before{background:#1c7a3d}
.lo-dot{width:22px;height:22px;border-radius:50%;border:2px solid #e4e2e2;background:#fff;flex:none;display:grid;place-items:center;z-index:1}
.lo-dot svg{width:12px;height:12px;stroke:#fff;stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.lo-steps li.done .lo-dot{background:#1c7a3d;border-color:#1c7a3d}
.lo-steps li.done{color:#4a4a4f}
.lo-steps li.now .lo-dot{border-color:#ed1732;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 9px #ed1732}
.lo-steps li.now{color:#111;font-weight:600}
.lo-rider{display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px;border-radius:15px;background:#f8f6f6}
.lo-rider>svg{width:26px;height:26px;stroke:#111;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lo-rider-text{flex:1;min-width:0}
.lo-rider-text strong{display:block;font-size:.88rem;color:#111}
.lo-rider-text small{display:block;font-size:.76rem;color:#77777c;margin-top:2px}
.lo-call{width:36px;height:36px;border-radius:50%;border:0;background:#fff;display:grid;place-items:center;flex:none;cursor:pointer;box-shadow:0 3px 10px rgb(0 0 0 / 10%)}
.lo-call svg{width:18px;height:18px;stroke:#111;stroke-width:1.8;fill:none}
.lo-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid #f0eeee;flex-wrap:wrap}
.lo-foot strong{display:block;font-size:.9rem}
.lo-foot small{display:block;font-size:.78rem;color:#77777c;margin-top:2px;font-variant-numeric:tabular-nums}
.lo-foot .secondary{padding:10px 15px;font-size:.82rem;font-weight:600}
.mm__badge--live{background:#ed1732}
@media(max-width:700px){
  .lo{padding:15px;border-radius:18px}
  .lo-head-text strong{font-size:1.05rem}
  .lo-foot .secondary{width:100%}
}

/* ---------- LiveTrack, wearing Zuma colours (light card) ---------- */
#zuma-live{
  --lt-ink:#FFFFFF;           /* the card is white now */
  --lt-accent:#ED1732;        /* Zuma red drives the progress bar */
  --lt-accent-l:#ED1732;
  --lt-green:#1C7A3D;
  --lt-radius:20px;
  font-family:var(--sf);
  margin-bottom:14px;
}
#zuma-live .lt-card{color:#111;border:1px solid #efefef;box-shadow:0 14px 38px rgb(0 0 0 / 6%);padding:16px}
#zuma-live .lt-card::after{background:radial-gradient(circle,rgb(237 23 50 / 7%),transparent 68%)}
#zuma-live .lt-top{gap:13px}
/* the restaurant photo sits where the parcel icon was */
#zuma-live .lt-ico{width:54px;height:54px;border-radius:14px;background:#f4f2f2;overflow:hidden;padding:0}
#zuma-live .lt-shot{width:100%;height:100%;object-fit:cover;display:block}
#zuma-live .lt-ico>svg{stroke:#ED1732}
#zuma-live .lt-id{font-size:1rem;font-weight:700;letter-spacing:-.022em;color:#111}
#zuma-live .lt-meta{font-size:.76rem;color:#77777c;font-variant-numeric:tabular-nums}
#zuma-live .lt-eta{font-size:.82rem;color:#6d6d72;margin:14px 0 12px;font-variant-numeric:tabular-nums}
#zuma-live .lt-eta b{color:#111;font-weight:600}
#zuma-live .lt-chip{font-size:.68rem;font-weight:600;background:rgb(28 122 61 / 12%);color:#1C7A3D}
#zuma-live .lt-chip.is-waiting{background:rgb(196 126 12 / 12%);color:#A9700B}
#zuma-live .lt-chip.is-done{background:rgb(59 125 245 / 12%);color:#2C62CE}
#zuma-live .lt-chip.is-bad{background:rgb(228 72 60 / 12%);color:#C2352B}
/* the bar: light track, Zuma red fill */
#zuma-live .lt-seg{background:#f0eeee;height:5px}
#zuma-live .lt-seg.is-full{background:#ED1732}
#zuma-live .lt-seg.is-now{background:rgb(237 23 50 / 22%)}
#zuma-live .lt-seg.is-now::before{background:#ED1732}
#zuma-live .lt-seg.is-full::after,#zuma-live .lt-seg.is-now::after{background:linear-gradient(90deg,transparent,rgb(255 255 255 / 75%),transparent)}
#zuma-live .lt-stages>div{font-size:.66rem;font-weight:600;color:#a4a4aa}
#zuma-live .lt-stages>div.is-past{color:#111}
#zuma-live .lt-stages>div.is-now{color:#ED1732}
#zuma-live .lt-stages small{font-size:.62rem;color:#a4a4aa;font-variant-numeric:tabular-nums}
#zuma-live .lt-empty{font-family:var(--sf);border-color:#e6e4e4;color:#8b8b90}
#zuma-live .lt-card.lt-bumped{animation:ltBumpLight .8s cubic-bezier(.22,1,.36,1)}
@keyframes ltBumpLight{
  0%{box-shadow:0 0 0 0 rgb(237 23 50 / 45%),0 14px 38px rgb(0 0 0 / 6%)}
  100%{box-shadow:0 0 0 14px transparent,0 14px 38px rgb(0 0 0 / 6%)}
}
/* toasts keep the app's type and clear the header */
.lt-toasts{font-family:var(--sf);top:calc(84px + env(safe-area-inset-top,0px))}
.lt-toast b{font-size:.82rem}
.lt-toast p{font-size:.73rem}
.lt-toast-ico{background:rgb(237 23 50 / 20%);color:#FF6274}
.lt-toast-bar{background:#ED1732}
.lo-actions{display:grid;gap:8px;margin:4px 0 12px}
.lo-actions .secondary{width:100%;padding:11px 15px;font-size:.84rem;font-weight:600}
@media(max-width:700px){
  .lt-toasts[data-pos="top-right"]{right:14px;width:min(320px,calc(100vw - 28px))}
  #zuma-live .lt-card{padding:16px 16px 18px}
}
/* toasts clear the Zuma header */
.lt-toasts{top:calc(84px + env(safe-area-inset-top,0px))}
@media(max-width:700px){.lt-toasts{top:calc(92px + env(safe-area-inset-top,0px))}}

/* ---------- one scroll lock for every overlay ----------
   position:fixed instead of overflow:hidden, because mobile Safari drops the
   scroll offset on an overflow lock and lands you back at the top. */
body.locked{position:fixed;left:0;right:0;width:100%;overflow:hidden}
/* the checkout panel animates in once, not on every state change */
.ck.is-mounted,.cc.is-mounted{animation:none}

/* ---------- restaurants listed ahead of launch ----------
   Grey, readable, and plainly not orderable yet. */
.rcard.soon{filter:grayscale(1);opacity:.78;transition:opacity .25s,filter .25s}
.rcard.soon:hover{opacity:1}
.rcard.soon .rcard-media{background:#efedec;display:grid;place-items:center;position:relative}
.rmark{font:800 2.1rem var(--dm);letter-spacing:-.04em;color:#8d8a89;
  display:grid;place-items:center;width:100%;height:100%;background:#efedec}
.soon-badge{background:#2f2f2f;color:#fff;font-weight:700}
.rcard.soon .rcard-name{display:block;padding:14px 16px 0;text-align:left;border:0;background:none;
  font:700 1.02rem var(--sf);letter-spacing:-.02em;color:#111;-webkit-text-fill-color:#111}
.rcard.soon .rcard-body{padding-top:4px}
.rcard.soon .rcard-meta{font-size:.84rem;color:#7c7c7c;margin:0}
.rcard.soon .rcard-fee{font-size:.8rem;color:#9a9a9a;margin:4px 0 0}

.rpage-soon .rhero{background:#efedec;display:grid;place-items:center}
.rpage-soon .rhero .rmark{font-size:3.4rem}
.soon-note{background:#f6f4f4;border:1px solid #e9e6e6;border-radius:16px;padding:15px 17px;margin-top:14px}
.soon-note strong{display:block;font-size:.98rem;margin-bottom:6px;color:#111}
.soon-note p{margin:0;font-size:.89rem;line-height:1.55;color:#6d6d72}
.soon-hours{margin-top:8px!important;font-weight:600;color:#3a3a3f!important}

.mrow.soon{filter:grayscale(1);opacity:.85;padding-right:16px}
.mrow.soon .mrow-text{cursor:pointer}
.mrow.soon .mrow-price{color:#6d6d72}

.sheet-soon .sheet-body{padding-top:8px}
.sheet-add.is-soon{background:#8d8a89;cursor:default}
.sheet-add.is-soon:hover{background:#8d8a89}

/* The stock photo sits over the monogram, which shows through if it fails. */
.rcard.soon .rcard-media{position:relative;overflow:hidden}
.rcard.soon .rcard-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rpage-soon .rhero{position:relative;overflow:hidden}
.rpage-soon .rhero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.rhero-stock{position:absolute;right:12px;bottom:12px;z-index:2;background:rgb(0 0 0 / 55%);color:#fff;
  border-radius:99px;padding:5px 11px;font-size:.7rem;font-weight:600;letter-spacing:.02em}

/* An item the kitchen has switched off tonight. */
.mrow.gone{opacity:.55;background:#faf8f8}
.mrow.gone h3{text-decoration:line-through}
.gone-tag{flex:none;align-self:center;background:#f1efef;color:#6d6d72;border-radius:99px;
  padding:6px 12px;font-size:.76rem;font-weight:700}

/* ------------------------------------------- open / closed / kitchen busy */
.ostat{display:inline-flex;align-items:center;gap:5px;border-radius:99px;padding:3px 9px;
  font-size:.7rem;font-weight:800;letter-spacing:.02em;line-height:1.5;vertical-align:middle}
.ostat:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.ostat.open{background:#e7f5ed;color:#0f7a41}
.ostat.busy{background:#fdf1de;color:#96590a}
.ostat.shut{background:#f1efef;color:#6d6d72}

/* On a card the badge sits on the photo, so it reads before the name does. */
.rcard-media .ostat,.lead-media+.ostat,.lead .ostat{position:absolute;left:10px;bottom:10px;z-index:2;
  background:rgb(255 255 255 / 94%);backdrop-filter:blur(6px);box-shadow:0 1px 4px rgb(0 0 0 / 18%)}
.rcard-media .ostat.open,.lead .ostat.open{color:#0f7a41}
.rcard-media .ostat.busy,.lead .ostat.busy{color:#96590a}
.rcard-media .ostat.shut,.lead .ostat.shut{color:#4a4a4f}
.lead{position:relative}
/* .hero-card is a flex column, which stretches children across the cross
   axis by default - a text label absorbs that invisibly, but the pill's
   background and border-radius do not, so it silently stretched to the
   full card width instead of hugging "Open". */
.hero-card .ostat{margin-top:6px;align-self:flex-start}

/* A closed restaurant is dimmed, not hidden - the menu is still worth a look. */
.rcard.shut .rcard-media img{filter:saturate(.35) brightness(.94)}
.rcard.shut .rcard-name{color:#4a4a4f}

.shut-note,.busy-note{border-radius:14px;padding:13px 15px;margin:14px 0 4px}
.shut-note{background:#f6f4f4}
.busy-note{background:#fdf6ea}
.shut-note strong,.busy-note strong{display:block;font-size:.97rem;letter-spacing:-.02em;margin-bottom:4px}
.shut-note p,.busy-note p{margin:0;font-size:.87rem;line-height:1.5;color:#5b5b60}
.shut-hours{margin-top:6px !important;font-weight:600;color:#3f3f45 !important}
.rhead h1 .ostat{font-size:.62rem;transform:translateY(-3px)}

/* A cancelled order says why, in the restaurant's own customer-safe words. */
.eyebrow.cx{color:#a3283a}
.cx-why{margin:9px 0 0;font-size:.86rem;line-height:1.5;color:#5b5b60;
  background:#fff4f6;border-radius:10px;padding:9px 11px}
.ostat.info{background:#eaf0fb;color:#2b4f8f}

/* ----------------------------------------------------------- promo code */
.promo-panel h3{margin-bottom:12px}
.promo-form{display:flex;gap:8px}
.promo-form input{flex:1;min-width:0;border:1px solid #e9e6e6;border-radius:12px;padding:13px 14px;
  font:inherit;font-size:1rem;text-transform:uppercase;letter-spacing:.04em}
.promo-form input:focus{outline:0;border-color:#ED1732;box-shadow:0 0 0 4px rgb(237 23 50 / 10%)}
.promo-form button{flex:none;width:auto;padding:13px 18px}
.promo-err{margin:10px 0 0;font-size:.87rem;line-height:1.45;color:#a3283a}
.promo-on{display:flex;align-items:center;gap:12px;background:#eaf6ef;border-radius:12px;padding:13px 14px}
.promo-on b{display:block;font-size:.98rem;letter-spacing:.02em}
.promo-on small{display:block;color:#3d6b52;font-size:.83rem;margin-top:2px}
.promo-val{margin-left:auto;font-weight:800;color:#0f7a41}
.promo-x{border:0;background:none;padding:4px;color:#3d6b52;display:grid;place-items:center}
.promo-x svg{width:16px;height:16px}

/* ------------------------------------------------------- featured rail */
.featrail{margin:6px 0 20px}
.featrail-head{display:flex;align-items:center;gap:8px;padding:0 18px 10px}
.featrail-head h2{font-size:1.05rem;letter-spacing:-.03em;margin:0}
.featrail-head svg{width:17px;height:17px;stroke:#e0a41a;fill:none;stroke-width:1.8}
.featrail-track{display:flex;gap:12px;overflow-x:auto;padding:2px 18px 6px;
  scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.featrail-track::-webkit-scrollbar{display:none}
.featcard{flex:0 0 156px;scroll-snap-align:start;border:1px solid #e9e6e6;border-radius:16px;
  background:#fff;padding:0;overflow:hidden;text-align:left;position:relative;display:block}
.featcard:focus-visible{outline:2px solid #ED1732;outline-offset:2px}
.featcard-img{width:100%;height:104px;object-fit:cover;display:block;background:#f4f2f2}
.featcard-flag{position:absolute;top:8px;left:8px;display:inline-flex;align-items:center;gap:4px;
  background:rgb(255 255 255 / 94%);border-radius:99px;padding:4px 9px;font-size:.68rem;font-weight:800;
  color:#8a5a00;box-shadow:0 1px 4px rgb(0 0 0 / 14%)}
.featcard-flag svg{width:11px;height:11px;stroke:#e0a41a;fill:none;stroke-width:2}
.featcard-body{display:block;padding:10px 11px 12px}
.featcard-name{display:block;font-size:.9rem;font-weight:650;letter-spacing:-.02em;line-height:1.3;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.featcard-price{display:block;color:#6d6d72;font-size:.85rem;margin-top:3px}

/* -------------------------------------------------------- review sheet */
.rv-intro{color:#6d6d72;font-size:.9rem;margin:0 0 18px}
.starpick{display:flex;gap:6px;justify-content:center;margin:6px 0 22px}
.starbtn{border:0;background:none;font-size:2.3rem;line-height:1;color:#e2dede;padding:2px;transition:transform .12s,color .12s}
.starbtn.on{color:#e0a41a}
.starbtn:active{transform:scale(.9)}
.review-sheet textarea{width:100%;border:1px solid #e9e6e6;border-radius:14px;padding:13px 14px;
  font:inherit;font-size:.97rem;resize:vertical;margin-bottom:14px}
.review-sheet textarea:focus{outline:0;border-color:#ED1732;box-shadow:0 0 0 4px rgb(237 23 50 / 10%)}

/* --------------------------------------------------------- card payment */
.pay-sheet .sheet-body{padding-bottom:28px}
.pay-total{display:flex;align-items:baseline;justify-content:space-between;
  border-bottom:1px solid #eeebeb;padding-bottom:14px;margin-bottom:16px}
.pay-total span{color:#6d6d72;font-size:.92rem}
.pay-total b{font-size:1.6rem;letter-spacing:-.04em}
.pay-test{background:#fff8e8;border-radius:12px;padding:11px 13px;font-size:.83rem;
  line-height:1.5;color:#7a5a12;margin:0 0 16px}
/* The Stripe Card Element draws no border of its own - it is one row of
   inputs on a transparent background - so the box is ours. Focus and error
   states are driven by classes Stripe puts on the host. */
.pay-element{margin-bottom:8px;border:1px solid #e1dede;border-radius:14px;
  padding:16px 15px;background:#fbfafa;box-shadow:0 1px 2px rgba(20,20,20,.03);
  transition:border-color .12s,box-shadow .12s,background-color .12s}
.pay-element.StripeElement--focus{border-color:#141414;background:#fff;
  box-shadow:0 0 0 3px rgba(20,20,20,.07)}
.pay-element.StripeElement--invalid{border-color:#c8102e;background:#fff8f8}
.pay-err{background:#fff2f4;border-radius:12px;padding:11px 13px;font-size:.87rem;
  line-height:1.45;color:#a3283a;margin:12px 0 0}
.pay-go{margin-top:16px}

/* ------------------------------------------------------ coming-soon sheet */
button.sheet-scrim{border:0;padding:0;display:block;width:100%}
.soon-sheet{text-align:center}
.soon-body{padding:34px 26px 30px}
.soon-art{position:relative;width:96px;height:96px;margin:0 auto 20px;display:grid;place-items:center;
  border-radius:50%;background:linear-gradient(140deg,#ED1732,#ff6b52)}
.soon-art svg{width:46px;height:46px;stroke:#fff;fill:none;stroke-width:1.6;stroke-linecap:round;
  stroke-linejoin:round;position:relative;z-index:1}
.soon-pulse{position:absolute;inset:-8px;border-radius:50%;border:2px solid rgb(237 23 50 / 35%);
  animation:soonPulse 2.2s ease-out infinite}
@keyframes soonPulse{0%{transform:scale(.85);opacity:.9}100%{transform:scale(1.25);opacity:0}}
@media (prefers-reduced-motion:reduce){.soon-pulse{animation:none;opacity:.5}}
.soon-sheet h2{font-size:1.5rem;letter-spacing:-.03em;margin:0 0 6px}
.soon-tag{display:inline-block;background:#fff0f2;color:#b3172f;border-radius:99px;padding:5px 13px;
  font-size:.78rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;margin:0 0 16px}
.soon-copy{color:#5b5b60;font-size:.95rem;line-height:1.6;margin:0 0 24px;max-width:34ch;
  margin-left:auto;margin-right:auto}

/* ------------------------------------------------- saved cards (wallet) */
.pm-list{display:block;border-top:1px solid #efecec;margin-top:4px}
.pm-row{display:flex;align-items:center;gap:14px;width:100%;padding:16px 2px;
  border:0;border-bottom:1px solid #efecec;background:none;text-align:left;font:inherit}
button.pm-row{cursor:pointer}
button.pm-row:hover{background:#fbfafa}
.pm-name{flex:1;min-width:0;font-size:1rem;font-weight:500;letter-spacing:-.01em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pm-check{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;
  border:1.5px solid #141414;flex:none}
.pm-check svg{width:13px;height:13px;stroke:#141414;fill:none;stroke-width:2.6}
.pm-x{border:0;background:none;padding:6px;color:#b9b9bd;flex:none;border-radius:8px}
.pm-x:hover{color:#a3283a;background:#fff2f4}
.pm-x svg{width:15px;height:15px}
.pm-empty{color:#6d6d72;font-size:.92rem;line-height:1.55;margin:16px 2px;padding:0}
.pm-add{display:flex;align-items:center;gap:14px;width:100%;padding:17px 2px;border:0;
  background:none;font:inherit;font-size:1rem;font-weight:500;color:#141414;text-align:left}
.pm-add svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2}
.pm-add:hover{background:#fbfafa}

/* card brand marks, drawn rather than loaded */
.bmark{width:38px;height:26px;border-radius:5px;flex:none;display:grid;place-items:center;
  font-size:.62rem;font-weight:900;letter-spacing:.02em;color:#fff}
.bmark.visa{background:#1434cb}
.bmark.amex{background:#1f72cd}
.bmark.disc{background:#f07f1a}
.bmark.zuma{background:#ED1732;font-size:.9rem}
.bmark.mc{background:#1a1a1a;position:relative}
.bmark.mc i{position:absolute;width:13px;height:13px;border-radius:50%}
.bmark.mc i:first-child{background:#eb001b;left:7px}
.bmark.mc i:last-child{background:#f79e1b;right:7px;mix-blend-mode:screen}
.bmark.generic{background:#6d6d72}
.bmark.generic svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:1.8}

/* top-up */
.topup{border:1px solid #e9e6e6;border-radius:16px;padding:18px;margin:0 0 20px}
.topup-lead{margin:0 0 14px;font-size:.9rem;color:#6d6d72}
.topup-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.topup-amt{border:1px solid #e9e6e6;background:#fff;border-radius:12px;padding:13px 4px;
  font:inherit;font-size:1rem;font-weight:700;letter-spacing:-.02em}
.topup-amt.on{background:#141414;color:#fff;border-color:#141414}

/* the checkout row showing what the swipe will charge */
.ck-row-ico .bmark{width:34px;height:23px}

/* ---- paying, on the checkout screen -------------------------------------
   The whole payment flow sits here: Zuma Cash, the stack of saved cards,
   adding one, and a plain sentence saying what the swipe is about to do.
   Nothing here opens a sheet and nothing leaves the app. */
.ck-pay{border-top:1px solid #efecec;margin-top:18px;padding-top:18px}
.ck-pay h2{font-size:1.05rem;margin:0 0 12px;letter-spacing:-.01em}
.ck-pay .pm-list{border-top:0;margin-top:0}
.ck-pay .pm-row{padding:13px 2px}
.ck-pay .pm-add{padding:14px 2px;font-size:.95rem}

.ck-pay-cash{display:flex;align-items:center;gap:14px;padding:12px 2px;
  border-bottom:1px solid #efecec}
.ck-pay-cash-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.ck-pay-cash-t strong{font-size:.95rem;font-weight:650;letter-spacing:-.01em}
.ck-pay-cash-t small{color:#6d6d72;font-size:.8rem}

.ck-pay-note{margin:0 0 12px;color:#6d6d72;font-size:.87rem;line-height:1.55}
.ck-pay-note .au-link{font:inherit;font-weight:650;color:#ED1732;background:0;
  border:0;padding:0;cursor:pointer;text-decoration:underline}

/* The card form, in place. Boxed so it reads as one thing rather than a
   Stripe iframe that wandered onto the page. */
.ck-card-entry{border:1px solid #e9e6e6;border-radius:16px;padding:16px;margin:12px 0 4px}
.ck-card-entry .pay-element{margin-bottom:10px}
.ck-card-actions{display:flex;gap:10px;margin-top:6px}
.ck-card-actions button{flex:1;border-radius:12px;padding:13px 10px;font:inherit;
  font-size:.95rem;font-weight:650;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px}
.ck-card-actions .primary{background:#141414;color:#fff}
.ck-card-actions .primary[disabled]{opacity:.6;cursor:default}
.ck-card-actions .secondary{background:#f2f0f0;color:#141414}

/* What the swipe will do, said once, in words. */
.ck-pay-will{margin:14px 0 0;font-size:.87rem;font-weight:600;color:#141414;
  background:#f7f6f6;border-radius:12px;padding:12px 14px;line-height:1.45}

/* -------------------------------------------------- expanded live card */
/* One seamless card: ad on top, the existing live-tracker status card in
   the middle (untouched internally - only its own chrome is stripped so
   it reads as a section rather than a second floating card), the order
   summary on the bottom. */
.lo-expand{background:#fff;border:1px solid #efefef;border-radius:20px;box-shadow:0 14px 38px rgb(0 0 0 / 6%);overflow:hidden;margin-bottom:14px}
.lo-expand #zuma-live{margin-bottom:0}
.lo-expand #zuma-live .lt-card{border:0;border-radius:0;box-shadow:none;padding:16px}
.lo-expand #zuma-live .lt-card+.lt-card{margin-top:0;border-top:1px solid #f0eeee}
.lo-ad{position:relative;width:100%;aspect-ratio:16/9;background:#171717;overflow:hidden}
.lo-ad img,.lo-ad video{width:100%;height:100%;object-fit:cover;display:block}
.lo-ad-link{position:absolute;inset:0;display:block}
.lo-ad-empty{position:absolute;inset:0;display:grid;place-items:center;color:#8a8a8f;font-weight:700;font-size:.86rem;letter-spacing:.02em;background:repeating-linear-gradient(135deg,#f7f6f6,#f7f6f6 12px,#f2f0f0 12px,#f2f0f0 24px)}
.lo-ad-mute{position:absolute;right:10px;bottom:10px;width:34px;height:34px;border-radius:50%;border:0;background:rgb(0 0 0 / 55%);color:#fff;display:grid;place-items:center;backdrop-filter:blur(3px)}
.lo-ad-mute svg{width:17px;height:17px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* Every ad floats in one layer on <body> over a placeholder in the slot,
   so no repaint can reload an iframe or stop a video (order-history.js
   says more). The top corners are the card's 20px less its 1px border.
   Ads in a rotation are stacked; the one coming in fades in over the one
   going. YouTube's frame ignores the pointer, so a tap reaches the ad's
   own link and YouTube's title bar, pause overlay and end screen can never
   be brought up. The frame is shown whole, never scaled or cropped, so
   YouTube's own logo is left as YouTube draws it. */
.lo-adl{position:absolute;left:0;top:0;z-index:1;overflow:hidden;border-radius:19px 19px 0 0;background:#171717;transition:none!important}
.lo-adl.is-off{visibility:hidden;pointer-events:none}
.lo-adl-stage,.lo-adi{position:absolute;inset:0}
.lo-adi{opacity:0;transition:opacity .5s ease}
.lo-adi.is-cur{opacity:1}
.lo-adi .lo-ad-link,.lo-adi .lo-ad{position:absolute;inset:0;height:100%;aspect-ratio:auto}
.lo-ad-yt .lo-yt-poster,.lo-ad-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.lo-ad-yt iframe{pointer-events:none;opacity:0;transition:opacity .6s ease}
.lo-ad-yt iframe.is-on{opacity:1}
.lo-adl .lo-ad-mute{z-index:2}
.lo-adl .lo-ad-mute[hidden]{display:none}
/* Reduced motion keeps the fade between ads (nothing moves, the picture
   only changes), and beats the page wide rule that shortens every
   transition to nothing. */
@media (prefers-reduced-motion:reduce){.lo-ad-yt iframe{transition:none}.lo-adl .lo-adi{transition:opacity .45s ease!important}}
.lo-summary{padding:16px;border-top:1px solid #f0eeee}
.lo-summary h4{margin:0 0 8px;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#9a9aa0}
.lo-summary-line{display:flex;justify-content:space-between;gap:10px;font-size:.85rem;padding:5px 0;color:#3a3a3d}
.lo-summary-line b{font-weight:600;color:#111}
.lo-summary-pay{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid #f0eeee;font-size:.82rem;color:#6d6d72}

/* ------------------------------------------------ order history / receipt */
/* A past order's clickable top half. Not the whole card: the action row
   below has its own buttons, and buttons cannot nest inside buttons. */
.receipt-open{border:0;background:none;padding:0;margin:0;text-align:left;color:inherit;font:inherit;display:block;width:100%;cursor:pointer}
.receipt-page{padding-bottom:40px}
.receipt-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:6px}
.receipt-code{color:#888;font-size:.85rem;margin:4px 0 0}
.receipt-card{border:1px solid #ececec;border-radius:22px;padding:23px;background:#fff;margin-top:22px}
.receipt-card h3{font-size:1rem;margin:0 0 14px}
.receipt-line{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #f2f0f0}
.receipt-line:last-child{border-bottom:0}
.receipt-line-name{font-weight:700}
.receipt-line-opts{display:block;color:#888;font-size:.82rem;margin-top:2px}
.receipt-line-qty{color:#888;font-size:.85rem;margin-right:8px}
.receipt-totals .summary-line{margin:8px 0}
.receipt-pay{display:flex;align-items:center;gap:10px;margin-top:4px}

/* ---- establishments: one two-row rail per category ----
   Two cards stacked per column, swiped sideways, with the next column
   peeking so it is obvious there is more to the right. */
.rails2{margin-top:18px}
.rail2-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:22px 0 10px}
.rail2-head:first-child{margin-top:4px}
.rail2-head h3{margin:0;font-size:1.08rem}
.rail2-count{font-size:.8rem;color:#8a8a8f;font-weight:600}
.rail2{display:grid;grid-template-rows:repeat(2,auto);grid-auto-flow:column;grid-auto-columns:calc((100% - 14px)/2.2);gap:14px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.rail2.one{grid-template-rows:auto}
.rail2::-webkit-scrollbar{display:none}
.rail2 .rcard{scroll-snap-align:start;min-width:0}
@media (min-width:701px){.rail2{grid-auto-columns:minmax(220px,calc((100% - 42px)/4.25))}}
@media (max-width:700px){.rail2{margin-right:-18px;padding-right:18px;grid-auto-columns:calc((100% - 32px)/2.2)}}
.rcard-demand{margin:4px 0 0;font-size:.74rem;font-weight:700;color:#ed1732}
.rcard-demand::before{content:"\25B2 "}

/* ---- "Request this restaurant" demand meter ---- */
.demand{margin-top:14px;border:1px solid #efe7e8;border-radius:18px;padding:16px 17px 14px;background:linear-gradient(180deg,#fff6f7,#fff)}
.demand-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.demand-lvl{font-size:.74rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#ed1732}
.demand-lvl.up{animation:demandUp .6s cubic-bezier(.22,1.35,.36,1)}
.demand-num{font:800 1.5rem/1 var(--sf);letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:#111}
.demand-say{margin:8px 0 10px;font-size:.9rem;color:#55555a}
.demand-say b{color:#111}
.demand-bar{height:10px;border-radius:99px;background:#f1e3e5;overflow:hidden}
.demand-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff4d63,#ed1732);transition:width .35s cubic-bezier(.22,1,.36,1)}
.demand-next{margin:8px 0 0;font-size:.82rem;color:#6d6d72}
.demand-next b{color:#111;font-variant-numeric:tabular-nums}
.demand-btn{position:relative;width:100%;margin-top:14px;display:flex;align-items:center;justify-content:center;gap:9px;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overflow:visible}
.demand-btn svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2}
.demand-btn:active{transform:scale(.97)}
.demand-plus{position:absolute;top:-4px;font:800 .95rem var(--sf);color:#ed1732;pointer-events:none;animation:demandPlus .9s ease-out forwards}
.demand-foot{margin:9px 0 0;font-size:.76rem;color:#8a8a8f;text-align:center}
@keyframes demandPlus{0%{opacity:0;transform:translate(-50%,6px) scale(.7)}15%{opacity:1;transform:translate(-50%,-6px) scale(1.1)}100%{opacity:0;transform:translate(-50%,-44px) scale(1)}}
@keyframes demandUp{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.demand-plus{display:none}.demand-lvl.up{animation:none}.demand-bar i{transition:none}}

/* ---- live order: courier and delivery PIN ----
   The real courier's name and state in words (no map), and the PIN the
   customer reads out at the door. */
.lo-courier{display:flex;gap:12px;align-items:flex-start;border:1px solid #ececec;border-radius:16px;padding:13px 14px;background:#fff;margin:0 0 10px;text-align:left}
.lo-courier b{display:block;font-size:.98rem}
.lo-courier small{display:block;color:#6d6d72;font-size:.82rem;line-height:1.45}
.lo-courier .lo-courier-state{color:#111;font-weight:600;margin-top:2px}
.lo-courier.waiting{background:#fafafa}
.lo-courier-ic{width:38px;height:38px;border-radius:12px;background:#f3f1f1;display:grid;place-items:center;flex:none}
.lo-courier-ic svg{width:19px;height:19px;stroke:#333;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.lo-pin{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1.5px solid #f3c2ca;background:#fff6f7;border-radius:16px;padding:13px 14px;margin:0 0 10px;text-align:left}
.lo-pin b{display:block;font-size:.95rem}
.lo-pin small{display:block;color:#6d6d72;font-size:.8rem;line-height:1.4}
.lo-pin-code{font:700 1.7rem/1 var(--sf);letter-spacing:.18em;font-variant-numeric:tabular-nums;color:#111;flex:none}

/* ---- the app canvas is locked ----
   Jordan wants /order/ to behave like an app, not a web page: it scrolls up
   and down and nothing else. No pinch or double tap zoom (the viewport tag
   and a gesture guard in index.html do the rest), no sideways drift, and no
   text selection or long press callout on images and buttons. Anything a
   person types in stays selectable. Horizontal rails are scroll containers
   of their own, so they still swipe sideways inside themselves; the map
   canvas sets its own touch-action and handles pinch and pan itself.
   html gets overflow-x:hidden (it passes to the viewport). body keeps clip:
   hidden there would turn body into its own vertical scroller. */
html{overflow-x:hidden;touch-action:pan-y;overscroll-behavior-x:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
body{overflow-x:clip;touch-action:pan-y;overscroll-behavior-x:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
img,a,button{-webkit-touch-callout:none;-webkit-user-drag:none}
input,textarea,select,[contenteditable],[contenteditable] *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
a,button,label,summary,select,input,textarea,[role="button"],[tabindex]{touch-action:manipulation}
/* The full bleed strips pulled themselves out by the desktop gutter (20px
   at 390 wide) while the phone gutter is 18px, so each hung 2px past both
   edges. That is what let the page shift sideways. */
@media(max-width:700px){
  .svc,.fbar,.cat-tabs{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}
  .rhero{margin-left:-18px;margin-right:-18px}
}

/* No default blue text. iOS paints unstyled buttons and auto detected phone
   numbers, dates and addresses blue. :where() keeps specificity at zero, so
   every class colour still wins. */
:where(button,input,select,textarea,summary){color:inherit}
:where(a){color:inherit}
a[x-apple-data-detectors],a[href^="tel"],a[href^="sms"],a[href^="x-apple"]{color:inherit;text-decoration:none}
/* iOS can still tint button text through its own fill colour, which color
   alone does not reach (the ordering app's .dish-info hit this). Also stop
   the blue tap flash and blue text selection. */
:where(button,summary,[role="button"]){-webkit-text-fill-color:currentColor}
:where(a,button,label,summary,[role="button"]){-webkit-tap-highlight-color:transparent}
::selection{background:rgb(237 23 50 / 18%);color:inherit}
input:-webkit-autofill{-webkit-text-fill-color:currentColor}
