:root{
  --bg:var(--tg-theme-bg-color,#fff);
  --fg:var(--tg-theme-text-color,#111);
  --hint:var(--tg-theme-hint-color,#777);
  --link:var(--tg-theme-link-color,#0a84ff);
  --btn:var(--tg-theme-button-color,#0a84ff);
  --btn-fg:var(--tg-theme-button-text-color,#fff);
  --card:var(--tg-theme-secondary-bg-color,#f3f4f6);
  --accent:#47993f;--accent-dark:#287a37;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font:15px/1.4 -apple-system,Roboto,"Segoe UI",sans-serif;-webkit-text-size-adjust:100%}
header{position:sticky;top:0;z-index:2;display:flex;gap:8px;align-items:center;padding:9px 10px;background:var(--bg);border-bottom:1px solid rgba(71,153,63,.18)}
.brand{width:38px;height:38px;flex:none;border:0;border-radius:12px;background:var(--accent);color:#fff;font-size:21px;font-weight:900}
#offline{padding:8px 12px;background:#8a5200;color:#fff;font-size:13px;text-align:center}
#search{flex:1;display:flex;gap:6px}
#q{flex:1;min-width:0;padding:9px 12px;border:1px solid rgba(128,128,128,.35);border-radius:10px;background:var(--card);color:var(--fg);font-size:15px}
#search button,.icon{padding:8px 12px;border:0;border-radius:10px;background:var(--card);color:var(--fg);font-size:17px}
#filterbar{padding:12px;background:var(--bg);border-bottom:1px solid rgba(128,128,128,.18);box-shadow:0 8px 20px rgba(0,0,0,.06)}
#filterbar label{display:block;font-size:12px;font-weight:700;color:var(--hint);margin-bottom:9px}
#filterbar select{display:block;width:100%;margin-top:4px;padding:10px;border:1px solid rgba(128,128,128,.3);border-radius:10px;background:var(--card);color:var(--fg);font:inherit}
.filter-actions{display:flex;gap:8px}.filter-actions button{flex:1;border:0;border-radius:10px;padding:10px;background:var(--accent);color:#fff;font-weight:700}.filter-actions .quiet{background:var(--card);color:var(--fg)}
main{padding:10px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.card{display:block;background:var(--bg);border:1px solid rgba(128,128,128,.14);border-radius:16px;overflow:hidden;color:inherit;text-decoration:none;cursor:pointer;box-shadow:0 5px 18px rgba(25,70,31,.09)}
.card .ph{width:100%;aspect-ratio:1;background:rgba(128,128,128,.15);object-fit:cover;display:block}
.card .b{padding:9px 10px 11px}
.card .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;min-height:2.6em}
.card .p{font-weight:800;color:var(--accent-dark);margin:3px 0}
.card .m{font-size:12px;color:var(--hint);display:flex;justify-content:space-between;gap:6px}
.badge{color:var(--accent);font-size:12px}
.more,.btn{display:block;width:100%;margin:14px 0;padding:12px;border:0;border-radius:12px;background:var(--btn);color:var(--btn-fg);font-size:16px;font-weight:600}
.btn.sec{background:var(--card);color:var(--fg)}
.row{display:flex;gap:8px}
.row .btn{margin:8px 0}
.empty,.err{padding:40px 10px;text-align:center;color:var(--hint)}
.hero{position:relative;background:var(--card);border-radius:14px;overflow:hidden}
.hero img{width:100%;max-height:60vh;object-fit:contain;display:block;background:#000}
.thumbs{display:flex;gap:6px;overflow-x:auto;padding:8px 0}
.thumbs img{width:64px;height:64px;object-fit:cover;border-radius:8px;flex:none;opacity:.7}
.thumbs img.on{opacity:1;outline:2px solid var(--btn)}
h1{font-size:20px;margin:12px 0 4px}
.price{font-size:22px;font-weight:800;color:var(--accent)}
.meta{color:var(--hint);font-size:13px;margin:4px 0 10px}
.desc{white-space:pre-wrap;margin:10px 0}
.seller{display:flex;align-items:center;gap:10px;padding:10px;background:var(--card);border-radius:12px;margin:12px 0}
.seller img,.avatar{width:44px;height:44px;border-radius:50%;object-fit:cover;background:rgba(128,128,128,.2)}
.avatar{display:grid;place-items:center;flex:none;background:linear-gradient(145deg,var(--accent),var(--accent-dark));color:#fff;font-size:18px;font-weight:800}
.seller .n{font-weight:600}
.src{font-size:12px;color:var(--hint);margin-top:6px}
.retry{display:inline-block;margin-left:8px;border:0;border-radius:8px;padding:4px 8px;background:rgba(255,255,255,.2);color:inherit}
.skel .card .ph{animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#222;color:#fff;padding:10px 16px;border-radius:20px;font-size:14px;z-index:9}
.fav{position:absolute;top:8px;right:8px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:20px}
.fav.on{color:#ff4d6d}
.destinations{position:absolute;left:10px;bottom:10px;display:flex;gap:6px}.destinations a{padding:8px 11px;border-radius:18px;background:#222;color:#fff;text-decoration:none;font-size:12px;font-weight:700}.destinations a:first-child{background:var(--accent)}