@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--primary-color:#2d5a27;--primary-dark:#1e3d1a;--secondary-color:#d4a373;--accent-color:#bc6c25;--bg-color:#fcfaf7;--card-bg:#fff;--text-main:#1a1a1a;--text-muted:#6c757d;--transition:all .3s cubic-bezier(.4, 0, .2, 1);--shadow:0 4px 20px #0000000d;--shadow-hover:0 10px 30px #0000001a;--radius:16px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);-webkit-font-smoothing:antialiased;font-family:Outfit,sans-serif;line-height:1.6}#app{max-width:600px;min-height:100vh;margin:0 auto;padding-bottom:40px}.header{text-align:center;background:linear-gradient(135deg, var(--primary-color), var(--primary-dark));color:#fff;box-shadow:var(--shadow);border-bottom-right-radius:40px;border-bottom-left-radius:40px;margin-bottom:25px;padding:50px 20px 40px}.logo-container{margin-bottom:5px}.main-logo{object-fit:contain;background:#fff;border-radius:12px;width:100%;max-width:240px;height:auto;max-height:90px;padding:8px 15px;box-shadow:0 4px 12px #00000014}.slogan{opacity:.8;letter-spacing:1px;margin-top:10px;font-size:1rem;font-weight:300}.nav-container{z-index:100;background:var(--bg-color);margin-bottom:20px;position:sticky;top:0}.nav-container:after{content:"";background:linear-gradient(to right, #fcfaf700, var(--bg-color));pointer-events:none;z-index:2;width:50px;height:100%;position:absolute;top:0;right:0}.categories-nav{scrollbar-width:none;-ms-overflow-style:none;gap:12px;padding:15px 20px;display:flex;position:relative;overflow-x:auto}.categories-nav::-webkit-scrollbar{display:none}.category-pill{white-space:nowrap;color:var(--text-muted);cursor:pointer;transition:var(--transition);box-shadow:var(--shadow);background:#fff;border:1px solid #0000000d;border-radius:100px;padding:10px 20px;font-size:.9rem;font-weight:500}.category-pill.active{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.menu-section{padding:0 20px}.category-title{color:var(--primary-color);align-items:center;gap:10px;margin:30px 0 15px;font-size:1.4rem;font-weight:700;display:flex}.category-title:after{content:"";background:#0000000d;flex:1;height:1px}.products-grid{flex-direction:column;gap:16px;display:flex}.product-card{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);transition:var(--transition);cursor:pointer;border:1px solid #00000005;gap:16px;padding:16px;display:flex;position:relative;overflow:hidden}.product-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}.product-image{object-fit:cover;cursor:zoom-in;background-color:#eee;border-radius:12px;flex-shrink:0;width:100px;height:100px;transition:transform .2s}.product-image:hover{transform:scale(1.03)}.product-info{flex-direction:column;flex:1;justify-content:space-between;display:flex}.product-name{color:var(--text-main);margin-bottom:4px;font-size:1.1rem;font-weight:600}.product-description{color:var(--text-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:8px;font-size:.85rem;display:-webkit-box;overflow:hidden}.product-footer{justify-content:space-between;align-items:center;display:flex}.product-price{color:var(--accent-color);font-size:1.2rem;font-weight:700}.skeleton{background:linear-gradient(110deg,#ececec 8%,#f5f5f5 18%,#ececec 33%) 0 0/200% 100%;border-radius:5px;animation:1.5s linear infinite shine}@keyframes shine{to{background-position-x:-200%}}.footer{text-align:center;background:#fff;border-top:1px solid #0000000d;margin-top:50px;padding:40px 20px}.footer-content p{color:var(--text-muted);font-size:.85rem}.developer-credit{opacity:.7;margin-top:10px;font-size:.75rem!important}.developer-credit strong{color:var(--primary-color)}.lightbox{z-index:2000;cursor:zoom-out;background:#000000e6;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.lightbox img{border-radius:12px;max-width:90%;max-height:80%;transition:transform .3s cubic-bezier(.4,0,.2,1);transform:scale(.9);box-shadow:0 0 30px #00000080}.lightbox.active{display:flex}.lightbox.active img{transform:scale(1)}