/* =====================================================================
   Магазин за монети (#coins) и демо плащане.
   ===================================================================== */
.py-wrap{display:flex; flex-direction:column; gap:20px; max-width:860px}
.py-head .ph1{margin:4px 0 6px}
.py-head .plead{margin:0}
.py-packs{display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(min(100%, 180px), 1fr))}
.py-pack{position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; padding:22px 14px 16px; cursor:pointer; font:inherit; color:var(--ptext); text-align:center; border:2px solid var(--pline); transition:border-color .2s, transform .2s var(--pease)}
.py-pack:hover{transform:translateY(-2px)}
.py-pack.on{border-color:var(--paccent); box-shadow:0 0 0 4px rgba(255,197,61,.15)}
.py-pack:focus-visible{outline:3px solid var(--paccent); outline-offset:2px}
.py-best{position:absolute; top:-11px; left:50%; transform:translateX(-50%)}
.py-coin .pi{width:38px; height:38px; color:var(--paccent)}
.py-n{font-size:28px; color:var(--paccent)}
.py-bonus{color:var(--pgood); font-weight:700}
.py-price{margin-top:6px; padding:5px 14px; border-radius:99px; background:rgba(255,255,255,.08); font-weight:700}
.py-pay{display:flex; flex-direction:column; gap:14px}
.py-sum{display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap}
.py-total{font-size:24px}
.py-btns{display:grid; gap:10px; grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr))}
.py-btns .pmuted, .py-btns .py-none{grid-column:1 / -1; margin:0}
.py-none{padding:12px 14px; border-radius:12px; background:rgba(255,255,255,.05); border:1px dashed var(--pline2); color:var(--pmuted); line-height:1.5}
.py-wallet{display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:50px; padding:0 18px; border-radius:12px; cursor:pointer; font:600 17px var(--body); transition:transform .15s, opacity .2s}
.py-wallet:active{transform:scale(.98)}
.py-wallet:focus-visible{outline:3px solid var(--paccent); outline-offset:3px}
.py-wallet.busy{opacity:.6; pointer-events:none}
.py-apple{background:#000; color:#fff; border:1px solid #000}
.py-google{background:#fff; color:#3c4043; border:1px solid #dadce0}
.py-mark{width:20px; height:20px; margin-left:4px}
.py-apple .py-mark{margin-top:-3px}
.py-legal{margin:0; font-size:13px; line-height:1.5}
.py-adf{gap:10px; margin:16px 0}
.py-adf .pinput{max-width:280px}
.py-demo{display:flex; flex-direction:column; gap:14px}
.py-demo-amt{display:flex; flex-direction:column; align-items:center; gap:2px; margin:0}
.py-demo-amt b{font-size:32px}
.py-demo-note{margin:0; font-size:13px; line-height:1.5}
.py-demo-btns{display:flex; flex-direction:column; gap:8px}
.py-tabs{display:inline-flex; margin:6px 0 10px}
.py-tabs a{display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:99px; color:var(--pmuted); text-decoration:none; font-weight:600; font-size:14px}
.py-tabs a.on{background:var(--paccent); color:var(--pacc-ink)}
