:root{font-family:Inter,system-ui,Arial,sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;--bg:#0d1012;--panel:#191d20;--panel2:#23282b;--text:#f8f9fa;--muted:#a4a7a9;--line:#34383b;--accent:#ff672b;background:var(--bg);color:var(--text)}body.light{--bg:#f7f7f7;--panel:#fff;--panel2:#f2f2f2;--text:#191b1c;--muted:#777;--line:#e1e1e1}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}.shell{max-width:1280px;margin:auto;padding:0 24px}.top{height:74px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line)}.brand{font-size:23px;font-weight:1000;letter-spacing:-1px;white-space:nowrap}.brand span,.orange{color:var(--accent)}.links{display:flex;align-items:center;gap:18px}.links button,.plain{background:none;color:var(--text);border:0;font-weight:750;font-size:13px}.links button:hover,.plain:hover{color:var(--accent)}.search{background:var(--panel2);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:11px 13px;min-width:160px;width:100%}.iconbtn{border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);padding:10px 12px;white-space:nowrap}.btn{background:var(--accent);color:#fff;border:0;border-radius:10px;padding:12px 18px;font-weight:850;font-size:13px}.btn:hover{filter:brightness(1.09)}.outline{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-weight:750;font-size:13px}.layout{padding-top:25px;padding-bottom:60px}.hero{min-height:365px;background:linear-gradient(90deg,rgba(6,8,9,.97) 3%,rgba(6,8,9,.82) 45%,rgba(6,8,9,.05) 100%),url('https://images.unsplash.com/photo-1568901346375-23c9450c58f1?w=1500') center 48%/cover;border-radius:18px;padding:54px 6%;display:flex;align-items:center;color:white;overflow:hidden}.hero h1{font-size:clamp(36px,5vw,66px);line-height:1.03;letter-spacing:-2.5px;margin:16px 0}.hero p{font-size:14px;color:#d6d6d6}.features{display:flex;justify-content:space-around;gap:15px;background:var(--panel);border-radius:0 0 14px 14px;padding:19px 10px;margin-top:0;color:var(--muted);font-size:12px;font-weight:750}.features b{color:var(--accent)}.heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:32px 0 17px}.heading h2{font-size:25px;margin:0;letter-spacing:-.7px}.sub{font-size:13px;color:var(--muted);margin:5px 0}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.product{border:1px solid var(--line);background:var(--panel);border-radius:14px;overflow:hidden}.product>img{width:100%;height:175px;object-fit:cover;background:var(--panel2)}.product .body{padding:14px}.product h3{font-size:14px;margin:0 0 7px}.product .price{font-size:16px;color:var(--accent);font-weight:900}.old{color:var(--muted);font-size:12px;text-decoration:line-through;margin-left:7px}.pill{font-size:10px;font-weight:900;color:#fff;background:var(--accent);border-radius:5px;padding:4px 7px}.cats{display:flex;gap:9px;overflow-x:auto;padding:5px 0 16px}.cats button{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:10px;padding:13px 17px;white-space:nowrap}.cats .selected{background:var(--accent);color:white;border-color:var(--accent)}.split{display:grid;grid-template-columns:1.05fr 1fr;gap:18px}.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px}.card h3{margin:0 0 18px}.stack{display:grid;gap:12px}.field{display:grid;gap:7px;font-size:12px;font-weight:750}.field input,.field select,.field textarea,.card input,.card select,.card textarea{background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:9px;padding:11px;width:100%}.field input[type=checkbox],input[type=checkbox]{width:auto;accent-color:var(--accent)}.flex{display:flex;align-items:center;gap:10px}.between{display:flex;align-items:center;justify-content:space-between;gap:10px}.muted{color:var(--muted)}.small{font-size:12px}.divider{height:1px;background:var(--line);margin:16px 0}.lineitem{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.lineitem img{width:68px;height:62px;object-fit:cover;border-radius:9px}.lineitem>div:nth-child(2){flex:1}.counter{display:flex;align-items:center;gap:10px}.counter button{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:8px;padding:5px 10px}.status{display:inline-block;background:#ff672b26;color:var(--accent);padding:6px 10px;border-radius:7px;font-weight:850;font-size:11px}.steps{display:flex;justify-content:space-between;gap:5px;margin:20px 0}.steps span{font-size:11px;color:var(--muted);text-align:center;flex:1;border-top:3px solid var(--line);padding-top:12px}.steps .done{color:var(--accent);border-color:var(--accent)}.modalback{position:fixed;inset:0;background:#000b;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px}.modal{width:min(650px,100%);max-height:90vh;overflow-y:auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:23px}.modalpic{width:100%;height:205px;object-fit:cover;border-radius:10px}.options{display:flex;flex-wrap:wrap;gap:9px}.option{display:flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:10px;font-size:12px}.option input{accent-color:var(--accent)}.adminlayout{display:grid;grid-template-columns:210px 1fr;gap:24px;padding-top:24px}.sidebar{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:15px;align-self:start}.sidebar button{display:block;width:100%;text-align:left;border:0;border-radius:9px;padding:12px;background:transparent;color:var(--text);font-size:13px;font-weight:750}.sidebar button.active{background:var(--accent);color:#fff}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric{padding:19px;border:1px solid var(--line);background:var(--panel);border-radius:12px}.metric strong{display:block;font-size:26px;margin-top:10px}.tablewrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:12px}.table th,.table td{padding:13px 9px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}.table th{color:var(--muted)}.table img{width:48px;height:42px;object-fit:cover;border-radius:7px}.login{max-width:410px;margin:65px auto}.notice{background:#ff672b15;border:1px solid #ff672b55;border-radius:12px;padding:13px;color:var(--accent);font-size:13px}.map{width:100%;height:300px;border:0;border-radius:12px;background:var(--panel2)}#toast{position:fixed;right:20px;bottom:20px;background:#272b2c;color:#fff;padding:14px 20px;border-radius:11px;display:none;z-index:50;box-shadow:0 8px 40px #0005}.uploadpreview{width:80px;height:70px;object-fit:cover;border-radius:8px}.footer{padding:30px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}@media(max-width:950px){.grid{grid-template-columns:repeat(3,1fr)}.top{height:auto;padding:14px 0;flex-wrap:wrap}.search{order:3;max-width:none}.adminlayout{grid-template-columns:1fr}.sidebar{display:flex;flex-wrap:wrap}.sidebar button{width:auto}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.shell{padding-left:14px;padding-right:14px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product>img{height:125px}.product .body{padding:10px}.split{grid-template-columns:1fr}.hero{min-height:300px;padding:30px 22px}.hero h1{font-size:36px}.features{font-size:10px;flex-wrap:wrap}.links{gap:10px}.links button{font-size:11px}.heading h2{font-size:21px}.card{padding:15px}}

/* Reference-inspired premium storefront */
.top{gap:15px}.top .search{max-width:295px;flex:1;min-width:120px}.header-actions{margin-left:auto}.header-actions .iconbtn{padding:10px}.cart-count{display:inline-flex;min-width:17px;height:17px;align-items:center;justify-content:center;background:var(--accent);color:#fff;border-radius:99px;font-size:10px}.hero{position:relative;background:#0b0d0e;min-height:390px;padding:45px 5%;isolation:isolate}.hero-slides{position:absolute;inset:0;z-index:-1}.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;background-position:center 48%;background-size:cover}.hero-slide.show{opacity:1}.hero:before{content:'';position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,#090b0df7 0%,#090b0de8 34%,#090b0d66 63%,#090b0d00 100%)}.hero-copy{position:relative;z-index:1;max-width:550px}.hero-dots{position:absolute;z-index:2;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px}.hero-dot{width:7px;height:7px;border-radius:100%;border:0;background:#ffffff80;padding:0}.hero-dot.on{background:var(--accent);width:20px;border-radius:9px}.hero h1{font-size:clamp(37px,5vw,70px)}.product .food-photo{display:block;width:100%;height:195px;object-fit:cover;object-position:center}.product .body{padding:12px}.product .body h3{min-height:33px}.product .body .btn{min-width:39px;height:39px;padding:7px;font-size:20px}.product:hover{border-color:#ff672b80;transform:translateY(-2px);transition:transform .2s,border-color .2s}.product .price{font-size:16px}.grid{gap:14px}.cats button{min-width:90px}.cats .selected{box-shadow:0 4px 20px #ff672b30}.modalpic{height:230px;object-fit:cover}.option{background:var(--panel2)}.option:has(input:checked){border-color:var(--accent);background:#ff672b17}.lineitem img{width:86px;height:76px}.features{border:1px solid var(--line);border-top:0}.hero + .features{margin-top:-1px}.top .links{flex-shrink:0}@media(max-width:950px){.top .search{max-width:none;order:3;flex-basis:100%}.header-actions{margin-left:auto}}@media(max-width:640px){.hero{min-height:335px}.hero:before{background:linear-gradient(90deg,#090b0df5,#090b0dc0 70%,#090b0d44)}.product .food-photo{height:145px}.top .brand{font-size:19px}.header-actions{gap:5px}.header-actions .iconbtn{padding:8px 7px;font-size:12px}.top .links{gap:10px}}

/* Product detail: mobile-first full-height customization, inspired by the supplied example. */
.custom-back{padding:0;align-items:center}
.custom-modal{width:min(690px,100%);max-height:96dvh;padding:0;border-radius:20px;overflow-y:auto;background:var(--bg)}
.custom-modal>.between{position:sticky;top:0;z-index:6;margin:0!important;padding:12px 18px;background:var(--bg);border-bottom:1px solid var(--line)}
.custom-modal>.between h2{font-size:14px;max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.custom-image-wrap{height:245px;position:relative;background:var(--panel2)}
.custom-image{width:100%;height:100%;object-fit:contain;display:block}
.custom-image-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,var(--bg),transparent 22%)}
.custom-content{padding:12px 18px 5px}
.custom-info,.custom-section{padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:17px;margin-bottom:14px}
.custom-info h2{font-size:25px;letter-spacing:-.5px;margin:0 0 8px}.custom-base-price{color:var(--accent);font-size:19px}.custom-info p{color:var(--muted);font-size:13px;line-height:1.6}
.custom-section h3{font-size:18px;margin:0 0 15px}.custom-choices{display:grid;gap:6px}
.custom-choice{display:flex;align-items:center;gap:14px;padding:12px 8px;font-size:15px;cursor:pointer;border-bottom:1px solid var(--line)}
.custom-choice:last-child{border-bottom:0}.custom-choice input{width:20px;height:20px;accent-color:var(--accent);flex-shrink:0}.custom-choice span{flex:1}.custom-choice b{font-size:13px;color:var(--accent)}
.custom-section textarea{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:12px;width:100%;padding:14px;resize:vertical;min-height:90px}
.custom-count{text-align:right;color:var(--muted);font-size:12px;margin-top:5px}
.custom-footer{position:sticky;bottom:0;z-index:5;display:flex;gap:12px;align-items:center;padding:14px 18px;background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -8px 30px #0002}
.custom-qty{flex-shrink:0;gap:12px}.custom-qty button{font-size:20px;min-width:40px;height:44px}.custom-qty b{min-width:15px;text-align:center}.custom-add{flex:1;min-height:48px;font-size:14px}
/* Keep the hero's first food image visible immediately; reduce black overlay on right. */
.hero{background-position:center;background-size:cover;background-repeat:no-repeat}
.hero:before{background:linear-gradient(90deg,rgba(5,7,8,.95) 0%,rgba(5,7,8,.84) 30%,rgba(5,7,8,.15) 70%,rgba(5,7,8,0) 100%)}
@media(max-width:640px){.custom-back{padding:0}.custom-modal{width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0}.custom-image-wrap{height:260px}.custom-content{padding:10px 12px}.custom-info,.custom-section{padding:19px}.custom-footer{padding:12px}.custom-qty{gap:7px}.custom-qty button{min-width:34px}.custom-add{font-size:12px;padding:11px 9px}.hero:before{background:linear-gradient(90deg,rgba(5,7,8,.9) 0%,rgba(5,7,8,.66) 45%,rgba(5,7,8,.08) 100%)}}

/* The opening frame is a bundled local food image, including on offline launches. */
.hero{background-image:url('/hero-first.jpg')!important;background-color:#211713!important;background-position:right center!important;background-size:cover!important}
.hero-slide:first-child{background-image:url('/hero-first.jpg')!important;opacity:1}
.hero-slide.show{opacity:1}
.hero:before{background:linear-gradient(90deg,rgba(5,7,8,.96) 0%,rgba(5,7,8,.82) 29%,rgba(5,7,8,.12) 70%,rgba(5,7,8,0) 100%)!important}
@media(max-width:640px){.hero{background-position:64% center!important}.hero:before{background:linear-gradient(90deg,rgba(5,7,8,.91),rgba(5,7,8,.45) 68%,rgba(5,7,8,.06))!important}}
