:root{font-family:Manrope,Arial,sans-serif;color:#1b1b1b;background:#eee9e3;font-synthesis:none;--accent:#ff5b36;--dark:#171717;--soft:#f4f1ed;--green:#16865c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:#eee9e3}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.app-shell{width:min(100%,560px);margin:auto;min-height:100dvh;background:#fff;box-shadow:0 0 50px #00000012}.app-shell main{padding-bottom:calc(92px + env(safe-area-inset-bottom))}.page{min-height:100dvh;padding:calc(24px + env(safe-area-inset-top)) 18px calc(32px + env(safe-area-inset-bottom));background:#fff}.home-page{padding-bottom:20px}.home-header,.page-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.home-header p,.page-title p{margin:0 0 4px;font-size:12px;color:#888}.home-header h1,.page-title h1{font-size:21px;margin:0;letter-spacing:-.7px}.brand-mark{background:var(--accent);color:#fff;border-radius:15px;width:56px;height:56px;display:grid;place-items:center;text-align:center;font-weight:800;font-size:11px;line-height:1.05;transform:rotate(-3deg)}.search{height:52px;border-radius:16px;background:var(--soft);display:flex;align-items:center;padding:0 15px;gap:10px}.search span{font-size:25px}.search input{border:0;outline:0;background:transparent;flex:1;min-width:0}.search kbd{font-size:10px;color:#999;background:#fff;padding:4px 6px;border-radius:6px}.categories{display:flex;overflow:auto;gap:9px;margin:16px -18px 18px;padding:0 18px;scrollbar-width:none}.categories::-webkit-scrollbar,.popular-row::-webkit-scrollbar{display:none}.categories button{border:0;border-radius:14px;padding:9px 13px;background:var(--soft);white-space:nowrap;min-height:44px;font-weight:700}.categories button span{margin-right:6px}.categories button.active{background:var(--dark);color:#fff}.banner{height:176px;border-radius:26px;background:linear-gradient(135deg,#ff5b36,#ff8c45);color:#fff;padding:22px;display:flex;justify-content:space-between;align-items:center;overflow:hidden;margin-bottom:28px}.banner div span{font-size:10px;font-weight:800;letter-spacing:1px;background:#ffffff32;padding:6px 9px;border-radius:20px}.banner h2{font-size:27px;line-height:1.04;max-width:230px;margin:18px 0 8px;letter-spacing:-1px}.banner p{margin:0;font-weight:700}.banner>b{font-size:82px;transform:rotate(10deg) translateX(15px);filter:drop-shadow(0 12px 10px #8e220959)}.section-head{display:flex;align-items:baseline;justify-content:space-between;margin:25px 0 14px}.section-head h2{margin:0;font-size:24px;letter-spacing:-.8px}.section-head span{font-size:12px;color:#999}.popular-row{display:grid;grid-auto-flow:column;grid-auto-columns:72%;overflow:auto;gap:12px;margin:0 -18px;padding:0 18px}.popular-row .product-card{display:block}.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.catalog-section{scroll-margin-top:10px}.product-card{background:#fff;border:1px solid #eee;border-radius:20px;overflow:hidden;min-width:0}.product-visual{height:142px;background:linear-gradient(145deg,#f7f2ea,#f1e8dc);display:grid;place-items:center;text-decoration:none;position:relative}.product-visual span{font-size:68px;filter:drop-shadow(0 11px 8px #0002)}.product-visual b{position:absolute;top:10px;left:10px;background:var(--accent);color:#fff;border-radius:8px;padding:5px 7px;font-size:10px}.product-body{padding:13px}.product-title{text-decoration:none;color:var(--dark);font-weight:800;font-size:15px;display:block}.product-body p{font-size:11px;line-height:1.45;color:#777;margin:6px 0;height:32px;overflow:hidden}.product-body small{font-size:10px;color:#aaa}.product-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:9px}.product-bottom strong{display:block}.product-bottom del{font-size:10px;color:#aaa}.add-btn{width:42px;height:42px;border:0;border-radius:14px;background:var(--dark);color:#fff;font-size:23px}.stepper{display:flex;align-items:center;gap:7px;background:var(--soft);border-radius:13px;padding:3px}.stepper button{border:0;background:#fff;border-radius:10px;width:34px;height:34px;font-size:20px}.stepper b{min-width:18px;text-align:center;font-size:13px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,560px);height:calc(74px + env(safe-area-inset-bottom));padding:8px 28px env(safe-area-inset-bottom);display:flex;justify-content:space-between;background:#ffffffed;backdrop-filter:blur(18px);border-top:1px solid #eee;z-index:20}.bottom-nav a{min-width:70px;min-height:54px;text-decoration:none;color:#aaa;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px}.bottom-nav a.active{color:var(--accent)}.bottom-nav span{font-size:24px;line-height:1}.bottom-nav small{font-size:10px;font-weight:700}.nav-cart{position:relative}.nav-cart b{position:absolute;top:-7px;right:-12px;min-width:18px;height:18px;background:var(--accent);color:#fff;border-radius:20px;font-size:10px;display:grid;place-items:center}.detail-page{padding:0;background:#fff}.detail-hero{height:330px;background:linear-gradient(150deg,#f7efe4,#eadcc8);display:grid;place-items:center;position:relative}.detail-hero>span{font-size:150px;filter:drop-shadow(0 20px 15px #0002)}.back{position:absolute;top:calc(16px + env(safe-area-inset-top));left:16px;width:46px;height:46px;border:0;border-radius:15px;background:#ffffffdc;font-size:32px}.detail-content{margin-top:-25px;background:#fff;border-radius:28px 28px 0 0;position:relative;padding:25px 18px 120px}.detail-content>small{color:#999}.detail-content h1{font-size:30px;margin:6px 0}.detail-content>p,.composition p{color:#777;line-height:1.5}.composition{padding:15px;background:var(--soft);border-radius:16px;margin:18px 0}.composition p{font-size:12px;margin:6px 0 0}.detail-content fieldset{border:0;padding:0;margin:24px 0}.detail-content legend{font-weight:800;font-size:18px;margin-bottom:10px;width:100%}.detail-content legend small{color:var(--accent);font-size:10px}.detail-content fieldset label,.radio-row{display:flex;align-items:center;gap:10px;min-height:48px;border-bottom:1px solid #eee}.detail-content fieldset label span,.radio-row span{flex:1}.detail-content fieldset label b{font-size:12px}.detail-action{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,560px);display:flex;gap:10px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #eee;z-index:30}.primary{border:0;background:var(--accent);color:#fff;border-radius:16px;min-height:52px;padding:0 20px;font-weight:800;flex:1}.link-btn{display:flex;align-items:center;justify-content:center;text-decoration:none}.page-title>span{background:var(--soft);border-radius:20px;padding:8px 12px;font-size:12px}.cart-list{display:flex;flex-direction:column;gap:11px}.cart-item{display:flex;gap:12px;padding:12px;border:1px solid #eee;border-radius:18px}.cart-emoji{width:74px;height:74px;border-radius:15px;background:var(--soft);display:grid;place-items:center;font-size:41px}.cart-info{flex:1;min-width:0}.cart-info h3{margin:3px 0;font-size:14px}.cart-info p{font-size:10px;color:#888;margin:5px 0;line-height:1.35}.cart-info strong{font-size:14px}.cart-controls{display:flex;flex-direction:column;align-items:end;justify-content:space-between}.remove{border:0;background:transparent;font-size:23px;color:#aaa}.cart-controls .stepper button{width:29px;height:29px}.summary{margin-top:18px;padding:18px;background:var(--soft);border-radius:20px}.summary div{display:flex;justify-content:space-between;margin:9px 0;font-size:13px}.summary small{display:block;color:var(--green);margin-top:10px}.summary hr{border:0;border-top:1px solid #ddd;margin:16px 0}.summary .total{font-size:20px}.sticky-action{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom));width:100%;margin-top:16px;box-shadow:0 12px 35px #ff5b3650}.empty-state{text-align:center;padding:90px 20px}.empty-state>span{font-size:70px}.empty-state h2{margin:15px 0 7px}.empty-state p{color:#888;line-height:1.5;margin-bottom:20px}.checkout{background:#f7f5f2}.form-card{background:#fff;border-radius:20px;padding:17px;margin-bottom:12px}.form-card h2{font-size:18px;margin:0 0 14px}.form-card>label:not(.radio-row),.address-grid label{font-size:11px;color:#777;display:block;margin-top:11px}.form-card input,.form-card textarea,.form-card select{width:100%;border:1px solid #e6e3de;background:#faf9f7;border-radius:13px;padding:13px;outline:0;margin-top:5px;min-height:46px}.segmented{display:grid;grid-template-columns:1fr 1fr;background:var(--soft);padding:4px;border-radius:14px}.segmented button{border:0;background:transparent;min-height:43px;border-radius:11px}.segmented button.active{background:#fff;box-shadow:0 3px 12px #00000012;font-weight:800}.address-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}.address-grid .wide{grid-column:1/-1}.radio-row.disabled{opacity:.45}.radio-row small{background:#eee;padding:3px 6px;border-radius:6px}.form-error{background:#ffe9e4;color:#b52d0c;border-radius:12px;padding:12px;margin-bottom:10px}.checkout .sticky-action{position:sticky}.success{text-align:center;background:#fff8f4;padding-top:calc(70px + env(safe-area-inset-top))}.success-icon{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:#dff6eb;color:var(--green);font-size:48px;margin:0 auto 25px}.success>p{color:var(--green);font-weight:800}.success h1{font-size:31px;line-height:1.1;max-width:330px;margin:10px auto 30px}.success>span{display:block;color:#999;font-size:12px}.success>strong{font-size:28px}.success .summary{text-align:left;margin:30px 0}.profile-card{display:flex;align-items:center;gap:14px;padding:18px;background:var(--dark);color:#fff;border-radius:22px}.avatar{width:56px;height:56px;border-radius:18px;background:var(--accent);display:grid;place-items:center;font-size:25px;font-weight:800}.profile-card h2,.profile-card p{margin:3px 0}.profile-card p{color:#bbb;font-size:12px}.order-card{display:flex;justify-content:space-between;padding:15px;border:1px solid #eee;border-radius:15px;margin-bottom:9px}.order-card small{display:block;color:#999;margin-top:4px}.empty-inline{background:var(--soft);padding:30px;text-align:center;border-radius:17px;color:#888}.danger-btn{margin-top:25px;width:100%;min-height:50px;border:1px solid #ffd2c7;color:#c0391b;background:#fff5f2;border-radius:15px}.offline{position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:100;width:min(100%,560px);text-align:center;padding:9px;background:#222;color:#fff;font-size:12px;padding-top:calc(9px + env(safe-area-inset-top))}@media(max-width:360px){.popular-row{grid-auto-columns:82%}.home-header h1{font-size:18px}}@media(min-width:700px){body{padding:20px 0}.app-shell{border-radius:28px;overflow:hidden;min-height:calc(100dvh - 40px)}.bottom-nav{bottom:20px;border-radius:0 0 28px 28px}}

/* Native-like interaction layer */
html, body, #root { min-height: 100%; }
body { overscroll-behavior-y: none; }
button, a, label, input, textarea, select { touch-action: manipulation; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .62; }

.pressable {
  transform: translateZ(0) scale(1);
  transition: transform 140ms cubic-bezier(.2,.8,.2,1), opacity 140ms ease, background-color 180ms ease, box-shadow 180ms ease;
  will-change: transform;
}
.pressable:active { transform: translateZ(0) scale(.965); opacity: .86; }

55% { opacity: 1; }
  to { opacity: 1; transform: translate3d(0,0,0) scale(1); filter: blur(0); }
}

.app-main { min-height: 100dvh; padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
.app-shell main { padding-bottom: 0; }
.page { width: 100%; overflow-x: clip; }

.product-card {
  box-shadow: 0 8px 24px rgba(24,24,24,.035);
  transition: transform 180ms cubic-bezier(.2,.8,.2,1), box-shadow 180ms ease;
}
.product-card:active { transform: scale(.985); box-shadow: 0 4px 14px rgba(24,24,24,.03); }
.product-title { overflow-wrap: anywhere; }
.product-bottom { gap: 8px; }
.product-bottom > div { min-width: 0; }

.bottom-nav {
  padding-left: max(18px, env(safe-area-inset-left));
  padding-right: max(18px, env(safe-area-inset-right));
  box-shadow: 0 -10px 30px rgba(30,30,30,.055);
}
.bottom-nav a { border-radius: 16px; transition: color 180ms ease, background-color 180ms ease, transform 140ms ease; }
.bottom-nav a:active { transform: scale(.92); background: rgba(255,91,54,.07); }
.bottom-nav a.active span { animation: nav-pop 300ms cubic-bezier(.2,1.4,.4,1); }
@keyframes nav-pop { 0% { transform: scale(.75); } 65% { transform: scale(1.14); } 100% { transform: scale(1); } }

.detail-hero, .banner { isolation: isolate; }
.detail-hero > span, .banner > b { animation: food-float 3.8s ease-in-out infinite; }
@keyframes food-float { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-6px) rotate(1deg); } }
.banner > b { animation-name: banner-float; }
@keyframes banner-float { 0%,100% { transform: rotate(10deg) translate(15px,0); } 50% { transform: rotate(7deg) translate(15px,-6px); } }

.primary { box-shadow: 0 10px 24px rgba(255,91,54,.2); }
.primary:active { box-shadow: 0 5px 14px rgba(255,91,54,.16); }
.form-card input:focus, .form-card textarea:focus, .form-card select:focus {
  border-color: rgba(255,91,54,.65);
  box-shadow: 0 0 0 4px rgba(255,91,54,.1);
}

@media (max-width: 390px) {
  .page { padding-left: 14px; padding-right: 14px; }
  .categories { margin-left: -14px; margin-right: -14px; padding-left: 14px; padding-right: 14px; }
  .popular-row { margin-left: -14px; margin-right: -14px; padding-left: 14px; padding-right: 14px; }
  .product-grid { gap: 10px; }
  .product-body { padding: 11px; }
  .product-visual { height: 126px; }
  .product-visual span { font-size: 58px; }
  .product-title { font-size: 14px; line-height: 1.2; min-height: 34px; }
  .product-body p { height: 31px; }
  .add-btn { width: 38px; height: 38px; border-radius: 12px; }
  .banner { padding: 18px; height: 166px; }
  .banner h2 { font-size: 23px; max-width: 195px; }
  .banner > b { font-size: 68px; }
  .home-header h1 { max-width: 230px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .cart-emoji { flex: 0 0 64px; width: 64px; height: 64px; }
  .detail-action { padding-left: 12px; padding-right: 12px; }
}

@media (max-width: 340px) {
  .product-grid { grid-template-columns: 1fr; }
  .product-visual { height: 185px; }
  .product-title { min-height: 0; }
  .address-grid { grid-template-columns: 1fr; }
  .address-grid .wide { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* v1.3: animate only content opacity; fixed navigation and viewport stay still */
.page, .detail-content, .checkout-content, .success {
  animation: content-reveal 180ms ease-out both;
}
@keyframes content-reveal {
  from { opacity: .72; }
  to { opacity: 1; }
}

76% { opacity: 1; transform: translate3d(2px,0,0) scale(1); }
  100% { opacity: 1; transform: translate3d(0,0,0) scale(1); }
}

.checkout-shell {
  width: min(100%, 560px);
  min-height: 100dvh;
  margin: 0 auto;
  padding: 0;
  background: #f4f2ef;
  color: var(--dark);
}
.checkout-header {
  position: sticky;
  top: 0;
  z-index: 15;
  min-height: calc(86px + env(safe-area-inset-top));
  padding: calc(14px + env(safe-area-inset-top)) 18px 14px;
  display: flex;
  align-items: center;
  gap: 13px;
  background: rgba(255,255,255,.93);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0,0,0,.055);
}
.checkout-header span { display: block; margin-bottom: 2px; color: #999; font-size: 11px; font-weight: 700; }
.checkout-header h1 { margin: 0; font-size: 23px; line-height: 1.15; letter-spacing: -.7px; }
.checkout-back {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 15px;
  background: #f1efec;
  color: #222;
  font-size: 34px;
  line-height: 1;
}
.checkout-content { padding: 14px 14px 154px; }
.checkout-card {
  margin: 0 0 12px;
  padding: 17px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.045);
  border-radius: 24px;
  box-shadow: 0 8px 25px rgba(25,25,25,.035);
}
.checkout-card__title { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.checkout-card__title--compact { margin-bottom: 10px; }
.checkout-card__icon {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #fff0eb;
  color: var(--accent);
  font-size: 13px;
  font-weight: 900;
}
.checkout-card__title h2 { margin: 0; font-size: 17px; line-height: 1.2; letter-spacing: -.3px; }
.checkout-card__title p { margin: 3px 0 0; color: #999; font-size: 11px; line-height: 1.3; }
.checkout-fields { display: grid; grid-template-columns: 1fr; gap: 11px; }
.field { display: block; min-width: 0; margin: 0; }
.field > span { display: block; margin: 0 0 6px; color: #777; font-size: 11px; font-weight: 700; }
.field input, .field textarea, .field select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 50px;
  margin: 0;
  padding: 13px 14px;
  border: 1px solid #e5e1dc;
  border-radius: 15px;
  outline: 0;
  background: #f9f8f6;
  color: #222;
  font-size: 16px;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.field textarea { min-height: 92px; resize: vertical; line-height: 1.45; }
.field input:focus, .field textarea:focus, .field select:focus {
  border-color: rgba(255,91,54,.72);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255,91,54,.10);
}
.delivery-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.delivery-switch button {
  min-width: 0;
  min-height: 92px;
  padding: 11px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: 1px solid #e8e4df;
  border-radius: 17px;
  background: #faf9f7;
  color: #222;
}
.delivery-switch button > span { font-size: 24px; line-height: 1; }
.delivery-switch button b { font-size: 13px; }
.delivery-switch button small { color: #999; font-size: 10px; }
.delivery-switch button.active {
  border-color: rgba(255,91,54,.5);
  background: #fff4ef;
  color: #b73718;
  box-shadow: inset 0 0 0 1px rgba(255,91,54,.12);
}
.address-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 10px; margin-top: 14px; }
.address-fields .field--wide { grid-column: 1 / -1; }
.restaurant-field { margin-top: 14px; }
.payment-list { display: grid; gap: 9px; }
.payment-option {
  position: relative;
  min-height: 68px;
  padding: 10px 12px;
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) 22px;
  align-items: center;
  gap: 10px;
  border: 1px solid #e8e4df;
  border-radius: 16px;
  background: #faf9f7;
  overflow: hidden;
}
.payment-option input { position: absolute; opacity: 0; pointer-events: none; }
.payment-option__icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: #fff; font-size: 21px; }
.payment-option > span:nth-child(3) { min-width: 0; }
.payment-option b, .payment-option small { display: block; }
.payment-option b { font-size: 13px; line-height: 1.2; }
.payment-option small { margin-top: 3px; color: #999; font-size: 10px; line-height: 1.25; }
.payment-option i { width: 20px; height: 20px; border: 2px solid #d7d2cc; border-radius: 50%; background: #fff; }
.payment-option:has(input:checked) { border-color: rgba(255,91,54,.55); background: #fff5f1; }
.payment-option:has(input:checked) i { border: 6px solid var(--accent); }
.payment-option--disabled { opacity: .55; grid-template-columns: 40px minmax(0,1fr) auto; }
.payment-option em { padding: 5px 7px; border-radius: 8px; background: #ece9e5; color: #777; font-size: 9px; font-style: normal; font-weight: 800; text-transform: uppercase; }
.checkout-total { margin: 0 0 12px; padding: 17px; border-radius: 22px; background: #171717; color: #fff; }
.checkout-total > div { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 10px; color: #bbb; font-size: 12px; }
.checkout-total b { color: #fff; }
.checkout-total .free { color: #6ed7a8; }
.checkout-total__main { margin: 15px 0 0 !important; padding-top: 15px; border-top: 1px solid #333; align-items: end; color: #fff !important; }
.checkout-total__main span { font-size: 15px; font-weight: 800; }
.checkout-total__main strong { font-size: 24px; letter-spacing: -.5px; }
.checkout-footer {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 30;
  width: min(100%,560px);
  transform: translateX(-50%);
  padding: 12px 14px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(20px);
  border-top: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 -12px 32px rgba(25,25,25,.07);
}
.checkout-submit { width: 100%; min-height: 56px; font-size: 15px; }
.checkout-footer > small { display: block; max-width: 380px; margin: 7px auto 0; color: #aaa; font-size: 9px; line-height: 1.3; text-align: center; }
.checkout-shell .form-error { margin: 0 0 12px; }

@media (max-width: 360px) {
  .checkout-header { padding-left: 12px; padding-right: 12px; }
  .checkout-header h1 { font-size: 20px; }
  .checkout-content { padding-left: 10px; padding-right: 10px; }
  .checkout-card { padding: 14px; border-radius: 20px; }
  .address-fields { grid-template-columns: 1fr 1fr; gap: 9px 8px; }
  .delivery-switch button { min-height: 84px; }
  .payment-option { grid-template-columns: 36px minmax(0,1fr) 20px; padding-left: 10px; padding-right: 10px; }
  .payment-option__icon { width: 36px; height: 36px; font-size: 19px; }
}

@media (max-width: 330px) {
  .address-fields { grid-template-columns: 1fr; }
  .address-fields .field--wide { grid-column: auto; }
  .delivery-switch { gap: 7px; }
  .delivery-switch button b { font-size: 12px; }
}


/* v1.4: WebView-safe press feedback. JS keeps .is-pressed for at least one painted frame. */
.pressable,
button,
a[href] {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-transition: -webkit-transform 90ms cubic-bezier(.2,.8,.2,1), box-shadow 90ms ease, filter 90ms ease, opacity 90ms ease;
  transition: transform 90ms cubic-bezier(.2,.8,.2,1), box-shadow 90ms ease, filter 90ms ease, opacity 90ms ease;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform-origin: center center;
}
.pressable.is-pressed,
.pressable:active,
button.is-pressed,
button:active,
a[href].is-pressed,
a[href]:active {
  -webkit-transform: translate3d(0,2px,0) scale(.955) !important;
  transform: translate3d(0,2px,0) scale(.955) !important;
  filter: brightness(.94);
  opacity: .96;
}
.primary.is-pressed,
.primary:active {
  box-shadow: 0 3px 8px rgba(255,91,54,.18) !important;
}
.add-btn.is-pressed,
.add-btn:active,
.stepper button.is-pressed,
.stepper button:active {
  -webkit-transform: translate3d(0,2px,0) scale(.90) !important;
  transform: translate3d(0,2px,0) scale(.90) !important;
}
.bottom-nav a.is-pressed,
.bottom-nav a:active {
  -webkit-transform: translate3d(0,2px,0) scale(.88) !important;
  transform: translate3d(0,2px,0) scale(.88) !important;
}

/* v1.5: fast-tap feedback is painted before the action is executed. */
.pressable{touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform 55ms ease-out,box-shadow 55ms ease-out,filter 55ms ease-out!important}
.pressable.is-pressed{transition-duration:35ms!important;-webkit-transform:translate3d(0,2px,0) scale(.94)!important;transform:translate3d(0,2px,0) scale(.94)!important}
.add-btn.pressable.is-pressed,.stepper button.pressable.is-pressed{-webkit-transform:translate3d(0,2px,0) scale(.86)!important;transform:translate3d(0,2px,0) scale(.86)!important}

/* v1.6 production WebView press feedback */
.pressable{touch-action:manipulation;-webkit-tap-highlight-color:transparent;transform-origin:center;will-change:transform,filter}
.pressable.is-pressed-fallback{transform:translate3d(0,2px,0) scale(.92)!important;filter:brightness(.86)!important}
.add-btn.pressable.is-pressed-fallback,.stepper .pressable.is-pressed-fallback,.bottom-nav .pressable.is-pressed-fallback{transform:translate3d(0,2px,0) scale(.84)!important}

/* v1.7: the entire product card is the press target in WebView */
.product-card[data-product]{cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;transform-origin:center center;will-change:transform,filter,box-shadow;}
.product-card[data-product]:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.product-card[data-product] .product-visual,.product-card[data-product] .product-title{pointer-events:none;}
.product-card[data-product] .add-btn,.product-card[data-product] .stepper{pointer-events:auto;}

/* v1.8 — soft native press feedback and product bottom sheet */
body.sheet-open { overflow: hidden; overscroll-behavior: none; }
.sheet-layer { position: fixed; inset: 0; z-index: 120; pointer-events: none; }
.sheet-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(18,18,18,0); backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0); transition: background 260ms ease, backdrop-filter 260ms ease; }
.product-sheet { position: absolute; left: 50%; bottom: 0; width: min(100%,560px); max-height: min(92dvh,860px); transform: translate3d(-50%,104%,0); border-radius: 28px 28px 0 0; background: #fff; box-shadow: 0 -20px 60px rgba(0,0,0,.18); overflow: hidden; display: flex; flex-direction: column; transition: transform 320ms cubic-bezier(.22,.86,.28,1); will-change: transform; }
.sheet-layer.is-open { pointer-events: auto; }
.sheet-layer.is-open .sheet-backdrop { background: rgba(18,18,18,.34); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
.sheet-layer.is-open .product-sheet { transform: translate3d(-50%,0,0); }
.sheet-grabber { width: 42px; height: 5px; border-radius: 10px; background: #d8d8d8; margin: 9px auto 5px; flex: 0 0 auto; }
.sheet-close { position: absolute; top: 15px; right: 15px; z-index: 3; width: 40px; height: 40px; border: 0; border-radius: 14px; background: rgba(255,255,255,.9); font-size: 25px; box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.sheet-scroll { overflow: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding-bottom: 96px; }
.sheet-hero { height: 250px; display: grid; place-items: center; background: linear-gradient(145deg,#f7f2ea,#eee0ce); }
.sheet-hero span { font-size: 118px; filter: drop-shadow(0 18px 13px rgba(0,0,0,.16)); }
.sheet-content { padding: 22px 18px 26px; }
.sheet-content > small { color: #999; }
.sheet-content h2 { margin: 5px 0 8px; font-size: 28px; letter-spacing: -.8px; }
.sheet-content > p { color: #777; line-height: 1.5; }
.sheet-content fieldset { border: 0; padding: 0; margin: 23px 0 0; }
.sheet-content legend { width: 100%; font-size: 18px; font-weight: 800; margin-bottom: 8px; }
.sheet-content legend small { color: var(--accent); font-size: 10px; }
.sheet-content fieldset label { min-height: 50px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #eee; }
.sheet-content fieldset label span { flex: 1; }
.sheet-content fieldset label b { font-size: 12px; }
.sheet-action { position: absolute; left: 0; right: 0; bottom: 0; padding: 12px 18px calc(12px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.95); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border-top: 1px solid rgba(0,0,0,.06); }
.sheet-action .primary { width: 100%; min-height: 56px; }
.pressable { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
@media (max-width:360px){.sheet-hero{height:210px}.sheet-hero span{font-size:98px}.sheet-content h2{font-size:25px}}
@media (prefers-reduced-motion:reduce){.product-sheet,.sheet-backdrop{transition-duration:180ms!important}}

/* v1.9: forced WebView sheet animation and product skeleton */
.sheet-layer{opacity:1}.sheet-backdrop{opacity:0;background:rgba(18,18,18,.34);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.product-sheet{transition:none;transform:translate3d(-50%,105%,0);contain:layout paint}.sheet-layer.is-open .product-sheet{transform:translate3d(-50%,0,0)}
.sheet-loaded-content{animation:sheetContentIn 220ms ease-out both}@keyframes sheetContentIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.skeleton{position:relative;overflow:hidden;background:#eeeae5;border-radius:12px}.skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);animation:skeletonShimmer 1.15s infinite}@keyframes skeletonShimmer{to{transform:translateX(100%)}}
.skeleton-hero{height:250px;border-radius:0}.skeleton-line{height:14px;margin:12px 0;width:100%}.skeleton-line-short{width:28%;height:11px}.skeleton-line-medium{width:72%}.skeleton-title{width:66%;height:30px;margin:12px 0 16px}.skeleton-block{height:76px;margin:24px 0}.skeleton-option{height:52px;margin-top:8px}.skeleton-button{height:56px;width:100%;border-radius:17px}@media(max-width:360px){.skeleton-hero{height:210px}}

/* v20 link-based haptics */
a[data-action-link]{text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent}
.product-card{display:flex}
.categories a{flex:0 0 auto}
.stepper a,.remove,.checkout-back,.sheet-close,.delivery-switch a,.checkout-submit,.danger-btn{cursor:pointer}

/* v2.1: link controls keep button appearance inside WebView */
a{color:inherit}
a[data-action-link]{cursor:pointer;-webkit-user-select:none;user-select:none}
.categories a{border:0;border-radius:14px;padding:9px 13px;background:var(--soft);white-space:nowrap;min-height:44px;font-weight:700;text-decoration:none;color:var(--dark);display:inline-flex;align-items:center;justify-content:center}
.categories a span{margin-right:6px}
.categories a.active{background:var(--dark);color:#fff}
.add-btn{display:grid;place-items:center;text-decoration:none;flex:0 0 auto}
.stepper a{border:0;background:#fff;border-radius:10px;width:34px;height:34px;font-size:20px;text-decoration:none;color:var(--dark);display:grid;place-items:center;line-height:1}
.cart-controls .stepper a{width:29px;height:29px}
.remove{display:grid;place-items:center;text-decoration:none;line-height:1}
.segmented a{border:0;background:transparent;min-height:43px;border-radius:11px;text-decoration:none;color:var(--dark);display:flex;align-items:center;justify-content:center}
.segmented a.active{background:#fff;box-shadow:0 3px 12px #00000012;font-weight:800}
.delivery-switch a{text-decoration:none;color:inherit}
.checkout-back,.sheet-close{display:grid;place-items:center;text-decoration:none;color:var(--dark);line-height:1}
.primary,.danger-btn{display:flex;align-items:center;justify-content:center;text-decoration:none}
.danger-btn{color:#c0391b}
.product-card{text-decoration:none;color:inherit;display:block}
.product-card:visited,.categories a:visited,.stepper a:visited,.delivery-switch a:visited,.primary:visited,.checkout-back:visited,.sheet-close:visited,.remove:visited{color:inherit}
@media (hover:hover){.categories a:hover{filter:brightness(.98)}.stepper a:hover,.add-btn:hover{filter:brightness(.96)}}