:root {
  --orange:#ff5a1f;
  --orange-light:#fff0e9;
  --ink:#202124;
  --muted:#777;
  --line:#eeeeee;
  --bg:#fafafa;
  --white:#fff;
  --green:#168a48;
  --red:#c43c38;
}
*{box-sizing:border-box}
body{margin:0;background:var(--white);color:var(--ink);font-family:Inter,Arial,sans-serif;font-size:15px}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.topbar{height:76px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:20}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.brand-logo{width:46px;height:46px;background:var(--orange);color:#fff;border-radius:15px;display:grid;place-items:center;font-size:26px;font-weight:900}
.brand b{display:block;font-size:20px}
.brand small{display:block;color:var(--muted);margin-top:3px}
.location{border:0;background:var(--orange-light);color:var(--orange);padding:11px 14px;border-radius:30px;font-weight:700}
main{max-width:1100px;margin:auto;padding:20px 5% 45px}
.hero{background:linear-gradient(115deg,#fff0e9,#fff8f3);border-radius:24px;padding:30px;display:flex;align-items:center;justify-content:space-between;min-height:190px;overflow:hidden}
.eyebrow{font-size:11px;letter-spacing:2px;color:var(--orange);font-weight:800}
.hero h1{font-size:clamp(29px,6vw,43px);line-height:1.12;margin:12px 0}
.hero p,.section-head p{color:var(--muted);margin:0}
.hero-art{font-size:90px;transform:rotate(-12deg);padding-right:15px}
.search-wrap{margin:22px 0;background:#f5f5f5;border:1px solid var(--line);border-radius:14px;padding:0 15px;height:52px;display:flex;align-items:center;gap:10px}
.search-wrap span{font-size:27px;color:#888}
.search-wrap input{border:0;background:transparent;outline:0;flex:1;min-width:0}
.search-wrap button{border:0;background:none}
.section{margin-top:30px}
.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.section-head h2{font-size:21px;margin:0 0 5px}
.section-head p{font-size:13px}
.text-btn{border:0;background:none;color:var(--orange);font-weight:700}
.categories{display:flex;gap:10px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}
.categories::-webkit-scrollbar{display:none}
.category{flex:0 0 auto;min-width:73px;border:1px solid var(--line);background:white;border-radius:15px;padding:12px 10px;display:flex;align-items:center;gap:6px;flex-direction:column;font-size:22px}
.category span{font-size:12px;font-weight:700}
.category.active{background:var(--orange-light);border-color:#ffc6ad;color:var(--orange)}
.restaurant-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.restaurant-card{border:1px solid var(--line);border-radius:17px;overflow:hidden;background:#fff;cursor:pointer;transition:.15s}
.restaurant-card:active{transform:scale(.99)}
.restaurant-cover{height:155px;width:100%;object-fit:cover;background:var(--orange-light);display:grid;place-items:center;font-size:48px}
.restaurant-info{padding:13px}
.restaurant-info h3{font-size:17px;margin:0 0 6px}
.restaurant-info p{color:var(--muted);font-size:13px;margin:5px 0}
.restaurant-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px}
.status{font-size:12px;font-weight:700;color:var(--green)}
.status.closed{color:var(--red)}
.minimum{font-size:11px;color:var(--muted)}
.track-banner{margin-top:30px;padding:20px;border-radius:17px;background:#202124;color:white;display:flex;justify-content:space-between;align-items:center;gap:12px}
.track-banner p{color:#ccc;margin:5px 0 0;font-size:13px}
.track-banner button{border:0;border-radius:10px;background:var(--orange);color:#fff;padding:12px;font-weight:700}
footer{text-align:center;padding:30px 10px;background:#fafafa;color:var(--muted)}
footer b{color:var(--orange);font-size:22px}
footer p{margin:6px}
.page{position:fixed;inset:0;background:#fff;z-index:30;overflow-y:auto;padding-bottom:35px}
.hidden{display:none!important}
.page-top{height:65px;position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:15px;padding:0 17px;z-index:4}
.page-top b{font-size:17px;flex:1}
.back-btn,.icon-btn{border:0;background:var(--orange-light);color:var(--orange);width:42px;height:42px;border-radius:50%;font-size:22px}
.icon-btn{font-size:18px}
.page-content{max-width:700px;margin:auto;padding:18px}
.restaurant-hero{padding:20px 18px 10px}
.restaurant-hero img{width:100%;height:180px;object-fit:cover;border-radius:17px;background:var(--orange-light)}
.restaurant-hero h1{font-size:27px;margin:17px 0 7px}
.restaurant-hero p{color:var(--muted);margin:6px 0}
.menu-heading{padding:15px 18px 5px;font-size:21px}
.food-list{padding:0 18px}
.food-card{display:flex;gap:13px;padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer}
.food-card img,.food-placeholder{width:105px;height:100px;border-radius:13px;object-fit:cover;background:var(--orange-light);flex-shrink:0}
.food-placeholder{display:grid;place-items:center;font-size:35px}
.food-details{flex:1;min-width:0}
.food-details h3{font-size:16px;margin:3px 0 7px}
.food-details p{font-size:13px;color:var(--muted);margin:0 0 9px}
.food-price{font-weight:800}
.add-label{float:right;color:var(--orange);font-size:12px;font-weight:800;border:1px solid #ffd0bd;padding:6px 12px;border-radius:8px}
.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px;margin-bottom:15px}
.panel h3{margin:0 0 15px;font-size:17px}
label{display:block;font-size:13px;font-weight:700;margin:13px 0;color:#444}
input,textarea,select{display:block;width:100%;margin-top:7px;border:1px solid #ddd;border-radius:11px;padding:13px;background:#fff;outline:none;color:var(--ink)}
input:focus,textarea:focus,select:focus{border-color:var(--orange);box-shadow:0 0 0 3px #ff5a1f18}
textarea{min-height:75px;resize:vertical}
.primary-btn{border:0;background:var(--orange);color:white;padding:15px;border-radius:12px;font-weight:800}
.primary-btn:disabled{opacity:.6}
.full{width:100%}
.cart-line{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}
.cart-line-info{flex:1}
.cart-line-info b{display:block}
.cart-line-info small{color:var(--muted)}
.qty{display:flex;align-items:center;gap:12px;margin-top:8px}
.qty button{border:1px solid #ffd0bd;background:var(--orange-light);color:var(--orange);border-radius:7px;width:29px;height:29px;font-weight:900}
.bill-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14px}
.bill-total{font-weight:900;font-size:18px;border-top:1px solid var(--line);margin-top:8px;padding-top:14px}
.coupon-row{display:flex;gap:8px}
.coupon-row input{margin:0}
.coupon-row button{border:0;background:var(--orange-light);color:var(--orange);font-weight:800;border-radius:10px;padding:0 16px}
.muted,.tiny{color:var(--muted);font-size:13px}
.center{text-align:center}
.payment-option{display:flex;gap:12px;align-items:center;background:#f7f7f7;padding:13px;border-radius:12px}
.payment-option span{flex:1}
.payment-option small{display:block;color:var(--muted);margin-top:4px}
.modal{position:fixed;inset:0;background:#0008;z-index:60;display:flex;align-items:flex-end;justify-content:center}
.modal-sheet{background:#fff;border-radius:22px 22px 0 0;padding:23px;width:100%;max-width:560px;max-height:88vh;overflow:auto;position:relative}
.modal-close{position:absolute;right:15px;top:14px;border:0;background:#f2f2f2;border-radius:50%;width:35px;height:35px}
.modal-sheet h2{padding-right:40px}
.option-group{border-top:1px solid var(--line);padding:13px 0}
.option-choice{display:flex;justify-content:space-between;align-items:center;padding:9px 0}
.option-choice input{width:auto;margin:0}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#202124;color:white;padding:12px 18px;border-radius:10px;opacity:0;pointer-events:none;z-index:100;transition:.2s;max-width:90%;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.cart-dock{position:fixed;bottom:12px;left:12px;right:12px;z-index:25;background:#202124;color:#fff;padding:13px 16px;border-radius:14px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 5px 25px #0003}
.cart-dock small{display:block;color:#ddd;margin-top:3px}
.cart-dock button{border:0;background:var(--orange);color:white;padding:12px 17px;border-radius:10px;font-weight:800}
.loading,.empty{text-align:center;padding:35px 15px;color:var(--muted);background:#fafafa;border-radius:13px}
.track-status{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.track-dot{width:13px;height:13px;border-radius:50%;background:#ddd;margin-top:4px;flex-shrink:0}
.track-dot.done{background:var(--green)}
@media(max-width:600px){
  .topbar{height:68px;padding:0 15px}
  main{padding:15px 15px 35px}
  .hero{padding:23px 19px;min-height:165px}
  .hero-art{font-size:66px;padding:0}
  .restaurant-grid{grid-template-columns:1fr}
  .restaurant-cover{height:175px}
  .track-banner{align-items:flex-start;flex-direction:column}
  .track-banner button{width:100%}
}