:root{--bg:#fbf6ee;--card:#fff;--tx:#2a1f16;--mut:#7a6a5b;--ac:#c2410c;--ln:#eadfce;--wa:#25d366;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#1c1712;--card:#2a231c;--tx:#f5ece0;--mut:#b5a493;--ac:#f97316;--ln:#3b3128}}
:root[data-theme="dark"]{--bg:#1c1712;--card:#2a231c;--tx:#f5ece0;--mut:#b5a493;--ac:#f97316;--ln:#3b3128}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tx);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.4}
.wrap{max-width:720px;margin:0 auto;padding:16px}
.hero{background:linear-gradient(135deg,#c2410c,#f59e0b);color:#fff;border-radius:18px;padding:22px}
.hero h1{margin:0 0 4px;font-size:1.7rem}
.hero p{margin:0;opacity:.95}
.info{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin:12px 0}
.info div{background:var(--card);border:1px solid var(--ln);border-radius:12px;padding:10px 12px;font-size:.9rem}
.info b{display:block;color:var(--mut);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}
.gal{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px}
.gal .ph{flex:0 0 150px;height:100px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:3rem;color:#fff}
h2{font-size:1.1rem;margin:20px 0 8px}
.item{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--ln);border-radius:14px;padding:10px;margin-bottom:8px}
.item .ph{width:64px;height:64px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:2rem;flex:none}
.item .t{flex:1}
.item .t small{color:var(--mut);display:block}
.price{font-weight:700;color:var(--ac)}
.qty{display:flex;align-items:center;gap:8px}
.qty button{width:32px;height:32px;border-radius:50%;border:1px solid var(--ln);background:var(--bg);color:var(--tx);font-size:1.1rem;cursor:pointer}
.qty button.add{background:var(--ac);color:#fff;border:0}
.cart{background:var(--card);border:1px solid var(--ln);border-radius:14px;padding:14px}
.row{display:flex;justify-content:space-between;padding:4px 0}
input,textarea,select{width:100%;padding:10px;margin-top:8px;border:1px solid var(--ln);border-radius:10px;background:var(--bg);color:var(--tx);font:inherit}
.send{display:block;width:100%;margin-top:12px;padding:14px;border:0;border-radius:12px;background:var(--wa);color:#063;font-weight:700;font-size:1rem;cursor:pointer}
.send:disabled{opacity:.5;cursor:not-allowed}
.empty{color:var(--mut);text-align:center;padding:8px}
[hidden]{display:none!important}
.mini{padding:8px 12px;border:1px solid var(--ln);border-radius:10px;background:var(--bg);color:var(--tx);cursor:pointer;margin-top:8px}
.item .ph{overflow:hidden}
.item .ph img{width:100%;height:100%;object-fit:cover}
#zoom{position:fixed;inset:0;z-index:10;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;padding:calc(16px + env(safe-area-inset-top,0px)) 16px calc(16px + env(safe-area-inset-bottom,0px));cursor:zoom-out}
#zb{text-align:center;color:#fff;max-width:100%}
#zb img{max-width:100%;max-height:72vh;border-radius:14px;object-fit:contain}
#zb .big{font-size:9rem;line-height:1.1}
#zb p{margin:10px 0 0;font-size:1.1rem}
#zb small{display:block;opacity:.8}
#aviso{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:12;background:#991b1b;color:#fff;padding:12px;border-radius:12px;text-align:center;font-weight:700;box-shadow:0 4px 16px rgba(0,0,0,.3)}
.nav{display:flex;gap:8px;overflow-x:auto;position:sticky;top:env(safe-area-inset-top,0px);z-index:4;background:var(--bg);padding:10px 0}
.nav button{white-space:nowrap;padding:9px 16px;border-radius:22px;border:1px solid var(--ln);background:var(--card);color:var(--tx);font-weight:700;cursor:pointer}
.nav button.on{background:var(--ac);color:#fff;border-color:var(--ac)}
body.v-ped .sec{display:none}
body:not(.v-ped) #cartTitle,body:not(.v-ped) .cart{display:none}