/* Phase 9A-9D: mobile app-like customer shell */
@media (max-width: 768px){
  :root{--mobile-nav-h:64px;--mobile-safe:env(safe-area-inset-bottom,0px)}
  body{padding-bottom:calc(var(--mobile-nav-h) + var(--mobile-safe) + 10px);background:#fffaf4}
  .top{position:sticky;top:0;z-index:50;background:rgba(255,250,244,.96);backdrop-filter:blur(10px);box-shadow:0 4px 18px rgba(67,39,23,.08)}
  .top .nav{gap:10px;padding:10px 12px}.top .brand{font-size:17px;white-space:nowrap}.top .brand span{display:none}
  .top .links{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.top .links a{font-size:12px;padding:7px 9px;border-radius:999px;background:#fff;border:1px solid #efd9c7;white-space:nowrap}.top .links a[href='/tin-tuc'],.top .links a[href='/quay-thuong'],.top .links a[href='/admin']{display:none}
  .shop-head{position:sticky;top:0;z-index:60;background:rgba(255,250,244,.97);backdrop-filter:blur(10px);padding:10px 12px;box-shadow:0 4px 16px rgba(67,39,23,.08);gap:8px}.shop-head .back,.shop-head .admin,.head-cart{font-size:12px;padding:8px 10px;border-radius:999px}.shop-head div b{font-size:16px}.shop-head div span{font-size:12px}
  .container,.shop-layout,.customer-page{width:100%;max-width:100%;padding-left:12px!important;padding-right:12px!important;box-sizing:border-box}.shop-layout{display:block}.shop-title h1,.customer-hero h1{font-size:25px;line-height:1.12}.shop-title p,.customer-hero p{font-size:14px}
  .mobile-order-search{position:sticky;top:58px;z-index:45;background:#fffaf4;padding:8px 0 10px;border-bottom:1px solid rgba(111,69,39,.1)}.mobile-order-search .search-row{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #edd8c5;border-radius:16px;padding:10px 12px;box-shadow:0 8px 24px rgba(70,39,20,.06)}.mobile-order-search input{border:0;outline:0;flex:1;font-size:15px;background:transparent}.mobile-order-search button{border:0;background:#7b4a2b;color:#fff;border-radius:999px;width:28px;height:28px}.mobile-search-chips{display:flex;gap:8px;overflow-x:auto;margin-top:8px}.mobile-search-chips button{border:1px solid #e7cfbb;background:#fff;border-radius:999px;padding:7px 11px;color:#5a3320;white-space:nowrap}
  .category-bar{position:sticky;top:122px;z-index:40;background:#fffaf4;display:flex;gap:8px;overflow-x:auto;padding:9px 0}.category-bar button{border-radius:999px;padding:9px 12px;white-space:nowrap;font-size:13px}.category-bar button.active{background:#7b4a2b;color:#fff}
  .product-list,.special-list{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.product{display:grid!important;grid-template-columns:88px 1fr auto;gap:10px;align-items:center;min-height:112px;padding:12px;border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(67,39,23,.08);position:relative}.product picture,.product img,.product .noimg{grid-row:1/6;width:88px!important;height:88px!important;border-radius:16px;object-fit:cover}.product h3{font-size:16px;margin:2px 0 3px}.product p{font-size:13px;line-height:1.35;max-height:36px;overflow:hidden;margin:0}.product small{font-size:11px;color:#8a624b}.product .pricebox{font-weight:800;color:#8a3e15}.product .btn.primary[data-add]{grid-column:3;grid-row:4/6;width:42px;height:42px;border-radius:50%;font-size:0;padding:0}.product .btn.primary[data-add]::after{content:'+';font-size:24px;line-height:1}.product .fav-btn{right:10px;top:8px}.product .badge{left:12px;top:8px}
  .mini-cart{bottom:calc(var(--mobile-nav-h) + var(--mobile-safe) + 12px)!important;left:12px!important;right:12px!important;border-radius:18px;padding:12px 14px;z-index:70}.option-modal{align-items:flex-end}.option-card{width:100%;max-height:88vh;overflow:auto;border-radius:24px 24px 0 0;padding:18px 16px calc(22px + var(--mobile-safe));animation:mobileSheet .18s ease-out}.choice-list label{border:1px solid #e7cfbb;border-radius:999px;padding:9px 12px;margin:4px;background:#fff}.option-actions{position:sticky;bottom:0;background:#fff;padding-top:10px}.option-actions .btn.primary{flex:1.5;font-weight:800}
  @keyframes mobileSheet{from{transform:translateY(40px);opacity:.5}to{transform:translateY(0);opacity:1}}
  .cart-page-panel,.customer-card{border-radius:20px;background:#fff;box-shadow:0 8px 28px rgba(67,39,23,.08);padding:14px}.cart-line{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;border:1px solid #f0dccb;border-radius:16px;padding:10px;margin-bottom:9px;background:#fff}.cart-line input{width:58px;text-align:center;border-radius:12px;border:1px solid #e7cfbb;padding:8px}.cart-line button{border:0;background:#f4e3d5;border-radius:12px;padding:8px 10px}.discount-box,.customer-form .checkout-card,.upsell-box,.ship-box{border:1px solid #edd8c5;border-radius:18px;padding:12px;background:#fffdf9;margin:10px 0}.fulfillment-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.fulfillment-grid label{border:1px solid #e2c8b3;border-radius:16px;padding:12px;background:#fff}.customer-form input,.customer-form textarea,.customer-form select{width:100%;box-sizing:border-box;border:1px solid #e2c8b3;border-radius:15px;padding:12px;margin:6px 0;font-size:15px}.customer-form .btn.primary,#submitOrder{width:100%;border-radius:16px;padding:14px;font-size:16px;font-weight:900}
  .customer-tabs{display:flex;overflow-x:auto;gap:8px;position:sticky;top:58px;background:#fffaf4;z-index:20;padding:8px 0}.customer-tabs button{white-space:nowrap;border-radius:999px;padding:9px 12px}.app-quick-row{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}.member-overview,.member-card,.offer-card,.order-card{border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(67,39,23,.08);padding:14px;margin:10px 0}
  .rancafe-mobile-nav{position:fixed;left:0;right:0;bottom:0;z-index:999;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);box-shadow:0 -8px 28px rgba(67,39,23,.14);padding:7px 6px calc(7px + var(--mobile-safe));display:flex;justify-content:space-around}.rancafe-mobile-nav a{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none;color:#6a4937;font-size:11px;font-weight:700;min-width:52px}.rancafe-mobile-nav .ico{font-size:20px}.rancafe-mobile-nav a.active{color:#8a3e15}.rancafe-mobile-nav .cart-badge{position:absolute;top:-2px;right:10px;background:#d6452e;color:#fff;border-radius:999px;font-size:10px;min-width:16px;height:16px;display:none;align-items:center;justify-content:center}.rancafe-mobile-nav .cart-badge.show{display:flex}
}
@media (min-width: 769px){.rancafe-mobile-nav,.mobile-order-search{display:none!important}}

/* Phase 9I: PWA install/update UI */
.pwa-install-banner{position:fixed;left:12px;right:12px;bottom:78px;z-index:9998;display:flex;justify-content:space-between;align-items:center;gap:10px;background:#2a140b;color:#fff;border-radius:20px;padding:12px 14px;box-shadow:0 18px 50px rgba(0,0,0,.24)}.pwa-install-banner b{display:block}.pwa-install-banner span{display:block;font-size:12px;color:#ffe7bd}.pwa-install-actions{display:flex;gap:8px;align-items:center}.pwa-install-actions button{border:0;border-radius:999px;padding:9px 12px;font-weight:1000;background:#ffd245;color:#2a140b}.pwa-install-actions [data-pwa-close]{width:34px;height:34px;padding:0;background:rgba(255,255,255,.16);color:#fff}.pwa-update-toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%);z-index:9999;background:#2a140b;color:#fff;border-radius:999px;padding:10px 12px;box-shadow:0 18px 50px rgba(0,0,0,.25);font-weight:900}.pwa-update-toast button{border:0;border-radius:999px;background:#ffd245;color:#2a140b;margin-left:8px;padding:6px 10px;font-weight:1000}@media(min-width:900px){.pwa-install-banner{max-width:420px;left:auto;right:22px;bottom:22px}}