/* Mini App (/app/): mobile-first, no WebGL, glow in CSS only. Tokens and Telegram UI kit come from base.css / tg.css. */
body.app{min-height:100vh;min-height:calc(var(--vh,1vh) * 100);padding-bottom:calc(88px + env(safe-area-inset-bottom));font-size:16px;
  background:radial-gradient(800px 500px at 90% -10%,#2a0f55 0,transparent 60%),radial-gradient(700px 500px at -20% 20%,#10285c 0,transparent 55%),#0c0420}
body.app.embed{padding-bottom:20px}
body.app.embed .ribbon{padding-top:28px}
.ribbon{padding:7px 14px;text-align:center;font:700 12.5px/1.4 var(--font);background:linear-gradient(90deg,#9e1eb0,#ff5fd2);color:#1a0630}
.ah{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(12,4,32,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.ah .ava{width:36px;height:36px;flex:none}.ah .tt{min-width:0}.ah .tt b{display:block;font:800 16px/1.25 var(--font)}.ah .tt small{color:var(--cyan-soft);font-size:12px}
.ah .tag{margin-left:auto;flex:none;padding:4px 10px;border-radius:999px;font:700 11px/1.4 var(--font);background:rgba(255,95,210,.18);color:var(--pink-pale);border:1px solid rgba(255,95,210,.4)}
#view{padding:14px 16px 24px;max-width:640px;margin:0 auto}
.search{display:flex;align-items:center;gap:10px;padding:0 14px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid var(--line)}
.search:focus-within{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(77,214,234,.18)}
.search input{flex:1;min-width:0;padding:13px 0;background:none;border:0;color:var(--ink);font:16px var(--font);outline:0}
.search svg{width:20px;height:20px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;flex:none}
.chips{display:flex;gap:8px;overflow-x:auto;padding:12px 0 4px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}
.chip{flex:none;padding:9px 15px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid var(--line);font:600 14px/1 var(--font);color:var(--muted);transition:background .2s,color .2s,transform .2s var(--spring)}
.chip:active{transform:scale(.95)}
.chip.on{background:var(--grad);color:#1a0630;border-color:transparent}
.sec{display:flex;align-items:baseline;justify-content:space-between;margin:20px 0 10px}.sec h2{font:800 18px/1.3 var(--font)}.sec a{color:var(--cyan);font-size:13.5px}
.feat{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}.feat::-webkit-scrollbar{display:none}
.feat .pc{flex:none;width:64%;scroll-snap-align:start}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.pc{display:block;border-radius:18px;background:linear-gradient(160deg,rgba(41,48,126,.42),rgba(23,7,50,.72));border:1px solid var(--line);overflow:hidden;transition:transform .25s var(--spring),border-color .3s}
.pc:active{transform:scale(.97)}.pc:hover{border-color:rgba(255,95,210,.45)}
.pi{position:relative;display:block;aspect-ratio:1/1;background:linear-gradient(135deg,#29307e,#9e1eb0 70%,#ff5fd2);overflow:hidden}
.pi img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .35s}.pi.has img{opacity:1}   /* shown only once loaded: no broken-image icon */
.pi .emo{position:absolute;inset:0;display:grid;place-items:center;font-style:normal}.pi .fb{width:42%;height:auto;opacity:.9}.cic{display:inline-block;width:22px;height:22px;margin:-5px 6px -5px -4px;vertical-align:middle}
.pi.has .emo{display:none}
.pc b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding:10px 12px 0;font:700 14.5px/1.4 var(--font);min-height:calc(2 * 1.4em + 10px)}
.pc em{display:block;padding:2px 12px 12px;font:700 15px/1.4 var(--font);font-style:normal;color:var(--pink-pale)}
.empty{display:grid;justify-items:center;gap:10px;padding:34px 10px;color:var(--muted);text-align:center}
.empty .spr{display:block;width:110px;height:110px;background-repeat:no-repeat}
.empty .sticker{width:130px;height:130px;background-repeat:no-repeat;animation:float 3s ease-in-out infinite}
.hubcard{display:flex;align-items:center;gap:14px;margin-top:22px;padding:16px;border-radius:18px;border:1px solid var(--line-2);background:linear-gradient(135deg,rgba(77,214,234,.12),rgba(158,30,176,.18))}
.hubcard .ico{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--violet),var(--pink))}
.hubcard .ico svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hubcard b{display:block;font:800 16px/1.3 var(--font)}.hubcard small{color:var(--muted);font-size:13.5px}
/* product page */
.pd .big{position:relative;aspect-ratio:1/1;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#29307e,#9e1eb0 70%,#ff5fd2);box-shadow:0 24px 60px -24px rgba(255,95,210,.6)}
.pd .big img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .35s}.pd .big.has img{opacity:1}.pd .big .emo{position:absolute;inset:0;display:grid;place-items:center}.pd .big .fb{width:34%;height:auto}.pd .big.has .emo{display:none}
.pd h1{font:800 22px/1.35 var(--font);margin:16px 0 4px}
.pd .price{font:800 20px/1.3 var(--font);color:var(--pink-pale)}.pd .price small{font:600 13px var(--font);color:var(--cyan-soft);margin-left:8px}
.pd .tags{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.pd p.d{color:var(--muted);font-size:15.5px;line-height:1.75}
.pd .var{margin:16px 0 4px}.pd .var b{display:block;font:700 14px var(--font);color:var(--cyan-soft);margin-bottom:8px}.pd .var .chips{padding:0}
.btnrow{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.abtn{flex:1;min-width:140px;padding:14px 16px;border-radius:14px;text-align:center;font:800 15.5px/1.2 var(--font);background:var(--grad);color:#1a0630}
.abtn.g{background:rgba(255,255,255,.08);color:var(--ink);border:1px solid var(--line-2);font-weight:700}
/* links page */
.lk{display:grid;gap:10px}.lk a,.lk .row{display:flex;align-items:center;gap:12px;padding:15px 16px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid var(--line)}
.lk b{display:block;font:700 16px/1.3 var(--font)}.lk small{color:var(--muted);font-size:13px;word-break:break-all}.lk .go{margin-left:auto;color:var(--cyan)}
.help{margin-top:18px;padding:16px;border-radius:16px;background:rgba(41,48,126,.35);border:1px solid var(--line)}
.help h3{font:800 16px var(--font);margin-bottom:8px}.help ol{margin-left:20px;color:var(--muted);font-size:15px;line-height:1.8}
.back{display:inline-flex;margin:2px 0 10px;color:var(--cyan);font:700 14px var(--font)}
/* fallback main button (browser) */
.mainbtn{position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:30;max-width:608px;margin-inline:auto;padding:16px;border-radius:16px;background:#ff5fd2;color:#06020d;font:800 16px/1 var(--font);box-shadow:0 14px 40px -10px rgba(255,95,210,.8)}
.mainbtn:active{transform:scale(.98)}
.toast{position:fixed;left:50%;bottom:92px;z-index:100;transform:translate(-50%,16px);padding:11px 16px;border-radius:14px;background:rgba(23,7,50,.95);border:1px solid var(--line-2);font:600 14px var(--font);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s var(--ease);max-width:86vw;text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}
@media(prefers-reduced-motion:reduce){.pc,.chip{transition:none}.empty .spr{display:block;width:110px;height:110px;background-repeat:no-repeat}
.empty .sticker{animation:none}}
