/* «کتاب پاپ‌آپ» (popup.js): کتاب، صفحه‌ی /popup، قفسه‌ی فروشگاه و پنجره‌ی معرفی */
.pb{--w:200px;position:relative;width:var(--w);aspect-ratio:340/470;font-size:calc(var(--w) / 34);perspective:calc(var(--w) * 3.4);cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;flex:0 0 auto}
.pb.big{--w:300px}
.pb:focus-visible{box-shadow:0 0 0 3px #f6dc93;border-radius:12px}
.pb-tilt{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.8,.2,1);transform:rotateX(10deg)}
.pb-page{position:absolute;inset:0;border-radius:.3em .9em .9em .3em;transform-style:preserve-3d;background:#e9dfc9;box-shadow:0 2.4em 4em rgba(0,0,0,.55),inset 0 0 0 1px rgba(90,60,30,.18)}
.pb-page::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(120,90,50,.035) 0 1px,transparent 1px 3px),radial-gradient(ellipse at 50% 40%,transparent 52%,rgba(80,55,25,.24));transform:translateZ(.05em)}
.pb-sky{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:linear-gradient(var(--s1),var(--s2))}
.pb-sky svg{width:100%;height:100%;display:block}
.pb-ly{position:absolute;left:0;right:0;bottom:.4em;height:100%;transform-origin:50% 100%;transform-style:preserve-3d;pointer-events:none;
  transform:translateZ(calc(var(--z) * 2.4em)) scale(calc(1 - var(--z) * .032)) rotateX(-88deg);opacity:0;
  transition:transform .95s cubic-bezier(.3,1.35,.45,1) var(--d),opacity .35s var(--d)}
.pb-ly svg{position:absolute;left:0;bottom:0;width:100%;display:block;filter:drop-shadow(0 .35em .3em rgba(40,25,10,.38))}
.pb.open .pb-ly{transform:translateZ(calc(var(--z) * 2.4em)) scale(calc(1 - var(--z) * .032)) rotateX(0);opacity:1}
/* the hero: a die-cut paper window */
.pb-win{position:absolute;left:19%;right:19%;bottom:6%;height:70%;padding:.32em;background:#f4ead6;border-radius:48% 48% .5em .5em / 30% 30% .5em .5em;box-shadow:0 .6em .9em rgba(30,18,8,.45),inset 0 0 0 1px rgba(120,90,50,.25)}
.pb-win i{display:block;width:100%;height:100%;border-radius:inherit;background:#3a3040 center/cover no-repeat;box-shadow:inset 0 0 1.2em rgba(0,0,0,.35)}
.pb.t-rare .pb-win,.pb.t-legend .pb-win{background:linear-gradient(135deg,#8a6a2c,#f6dc93 30%,#b88a3a 50%,#fbe7a8 70%,#8a6a2c)}
.pb.t-rare .pb-page,.pb.t-legend .pb-page{box-shadow:0 2.4em 4em rgba(0,0,0,.55),inset 0 0 0 .25em #d8b86a,inset 0 0 0 .32em rgba(90,60,20,.4)}
.pb-tag{position:absolute;top:.8em;right:.8em;font-size:.75em;padding:.2em .7em;border-radius:99px;background:rgba(20,14,8,.62);color:#f6dc93;transform:translateZ(.3em);opacity:0;transition:opacity .5s 1.1s;white-space:nowrap}
.pb.open .pb-tag{opacity:1}
/* moving layer (legendary) */
.pb.open .pb-live .pb-wv{animation:pbWv 3.2s ease-in-out infinite}
.pb.open .pb-live .pb-wv.b{animation-delay:-1.6s}
.pb.open .pb-live .pb-bob{animation:pbBob 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 90%}
.pb.open .pb-live .pb-steam{animation:pbSteam 4s ease-in-out infinite}
.pb.open .pb-live .pb-spin{animation:pbSpin 9s linear infinite}
.pb.open .pb-live .pb-mote{animation:pbMote 5s ease-in-out infinite}
.pb.open .pb-live .pb-sway{animation:pbSway 4.5s ease-in-out infinite}
@keyframes pbWv{50%{transform:translateX(-8px)}}
@keyframes pbBob{50%{transform:translateY(3px) rotate(-2deg)}}
@keyframes pbSteam{50%{transform:translateY(-8px);opacity:.75}}
@keyframes pbSpin{to{transform:rotate(360deg)}}
@keyframes pbMote{50%{transform:translateY(-10px);opacity:.6}}
@keyframes pbSway{50%{transform:rotate(1.5deg)}}
/* the cover: cloth, gold foil */
.pb-cover{position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;transition:transform 1.05s cubic-bezier(.6,0,.2,1),opacity .5s 1s;z-index:5}
.pb.open .pb-cover{transform:rotateY(-168deg)}
.pb:not(.big).open .pb-cover{opacity:0;pointer-events:none}
.pb-f,.pb-b{position:absolute;inset:0;border-radius:.9em .3em .3em .9em;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.pb-f{border-radius:.3em .9em .9em .3em;background:repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 2px,transparent 2px 4px),repeating-linear-gradient(-45deg,rgba(0,0,0,.08) 0 2px,transparent 2px 4px),linear-gradient(160deg,var(--c1),var(--c2));
  box-shadow:inset 0 0 0 .6em rgba(0,0,0,.12),inset 0 0 0 .66em rgba(212,170,90,.55),inset 0 0 2.4em rgba(0,0,0,.5),0 1.8em 3.6em rgba(0,0,0,.5);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;padding:1em;text-align:center}
.pb-b{transform:rotateY(180deg);background:#e2d6bd;box-shadow:inset 0 0 1.8em rgba(80,55,25,.3);display:flex;align-items:center;justify-content:center;padding:2em}
.pb-b p{margin:0;font-size:1.05em;line-height:1.9;color:#5a4428}
.pb-orn{width:6.5em;height:.8em;fill:none;stroke:#e7c77a;stroke-width:1.5}
.pb-gold{background:linear-gradient(100deg,#8a6a2c,#f6dc93 30%,#b88a3a 50%,#fbe7a8 70%,#8a6a2c);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(0,0,0,.6))}
.pb-f b{font:400 2.5em/1.2 Lalezar,sans-serif}
.pb-f small{font-size:.95em;letter-spacing:.05em}
.pb-rib{position:absolute;bottom:-1.6em;left:2.4em;width:.9em;height:4em;background:linear-gradient(#b3261e,#7a1712);clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%);z-index:-1}
@media (prefers-reduced-motion:reduce){.pb-ly,.pb-cover,.pb-tilt{transition-duration:.01s!important}.pb .pb-live *{animation:none!important}}

/* ---------- page /popup ---------- */
.pbp-body{overflow-x:clip;background:radial-gradient(ellipse at 50% 0%,#2b2433,#110e17 70%) fixed;color:#efe5d3}
.pbp{max-width:1080px;margin:0 auto;padding:90px 16px 60px;overflow-x:clip}
.pbp-wait{text-align:center;opacity:.7;padding:80px 0}
.pbp-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;margin-bottom:40px}
.pbs-k{font-size:13px;color:#e7c77a}
.pbp-hero h1{font:400 46px/1.2 Lalezar,sans-serif;margin:6px 0 10px}
.pbp-hero p{line-height:1.9;opacity:.88;max-width:520px}
.pbp-tiers{list-style:none;padding:0;margin:14px 0;display:flex;gap:8px;flex-wrap:wrap}
.pbp-tiers li{padding:8px 12px;border-radius:12px;background:rgba(255,240,220,.06);border:1px solid rgba(255,240,220,.12);font-size:13px;display:flex;flex-direction:column;gap:2px}
.pbp-tiers li.r{border-color:rgba(216,184,106,.5)}.pbp-tiers li.l{border-color:rgba(246,220,147,.85);background:rgba(246,220,147,.08)}
.pbp-btn{display:inline-block;padding:10px 20px;border-radius:12px;background:linear-gradient(135deg,#f6dc93,#c79a3e);color:#2a1c08;font-weight:800;text-decoration:none}
.pbp-buy small{opacity:.7;margin-inline-start:8px}
.pbp-note{color:#ffb35c}
.pbp-big{padding:0 24px 30px 0}
.pbp-sec{margin:34px 0}
.pbp-sec h2{font:400 26px Lalezar,sans-serif;margin:0 0 6px}
.pbp-sec h2 small{font:13px inherit;opacity:.6}
.pbp-sub{margin:0 0 16px;opacity:.7;font-size:13px}
.pbp-grid{display:flex;flex-wrap:wrap;gap:30px 26px;justify-content:center}
.pbp-grid figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:22px}
.pbp-grid figcaption{font-size:13px;opacity:.85}
.pbp-grid.got figure{animation:pbIn .6s both;animation-delay:calc(var(--i) * .2s)}
@keyframes pbIn{from{opacity:0;transform:translateY(30px)}}
.pbt-legend{color:#f6dc93}.pbt-rare{color:#e7c77a}
.pbp-packs{display:flex;gap:14px;flex-wrap:wrap}
.pbp-pack{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 18px;border-radius:16px;border:1px solid rgba(246,220,147,.35);background:rgba(255,240,220,.05);color:inherit;font-family:inherit;cursor:pointer}
.pbp-pk{width:70px;height:92px;border-radius:4px 10px 10px 4px;background:linear-gradient(160deg,#5a1f22,#2e0f14);box-shadow:inset 0 0 0 4px rgba(0,0,0,.15),inset 0 0 0 5px rgba(212,170,90,.6),0 10px 20px rgba(0,0,0,.4)}
.pbp-pack small{opacity:.65;font-size:12px}
/* owner panel */
.pbl-jump{display:inline-block;margin-bottom:18px;padding:7px 14px;border-radius:99px;border:1px dashed rgba(246,220,147,.5);color:#f6dc93;font-size:13px;text-decoration:none}
.pbl{margin:44px 0 0;padding:18px;border-radius:18px;background:rgba(255,240,220,.05);border:1px dashed rgba(246,220,147,.4)}
.pbl h2{font:400 22px Lalezar,sans-serif;margin:0 0 8px}
.pbl-st{margin:0 0 10px}.pbl-st.on{color:#6ee7b7}
.pbl-launch{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-bottom:12px}
.pbl-launch label{display:flex;gap:6px;align-items:center;font-size:13px}
.pbl-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.pbl-b{padding:7px 14px;border-radius:10px;border:1px solid rgba(255,240,220,.3);background:rgba(255,240,220,.06);color:inherit;font-family:inherit;font-size:13px;cursor:pointer}
.pbl-b.go{background:linear-gradient(135deg,#f6dc93,#c79a3e);color:#2a1c08;font-weight:800;border:0}
.pbl-b:disabled{opacity:.4;cursor:not-allowed}
.pbl-c{padding:12px 0;border-top:1px solid rgba(255,240,220,.1)}
.pbl-h{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:8px;font-size:13px}
.pbl-h small{opacity:.6}.pbl-h label{display:flex;gap:6px;align-items:center;margin-inline-start:auto}
.pbl-cur i{display:block;width:120px;height:160px;border-radius:10px;background:#333 center/cover;margin-bottom:8px}
.pbl-cand{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px}
.pbl-cand button{flex:0 0 80px;height:104px;border-radius:8px;border:2px solid transparent;background:#2a2430 center/cover;position:relative;cursor:pointer;padding:0}
.pbl-cand button.on{border-color:#f6dc93}.pbl-cand button.used{opacity:.45}
.pbl-cand small{position:absolute;inset:auto 0 0;font-size:10px;background:rgba(0,0,0,.6);color:#fff;border-radius:0 0 6px 6px}
.pbl-paste{display:flex;gap:6px;margin-top:6px}
.pbl-paste input{flex:1;min-width:0;padding:7px 10px;border-radius:10px;border:1px solid rgba(255,240,220,.2);background:rgba(0,0,0,.3);color:inherit;direction:ltr}

/* ---------- shop shelf (#popup) ---------- */
.pbs{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center;padding:22px;border-radius:22px;background:radial-gradient(ellipse at 20% 30%,#3a2a2c,#16111a 70%);color:#efe5d3;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.pbs-books{display:flex;align-items:flex-end;padding:0 10px 22px}
.pbs-books span{margin-inline-start:-60px;transform:translateY(calc(var(--i) * var(--i) * 10px)) rotate(calc(var(--i) * -5deg))}
.pbs-books span:first-child{margin-inline-start:0}
.pbs-books .pb{--w:150px}
.pbs-books span:nth-child(2) .pb{--w:180px}
.pbs-tx h2{font:400 34px Lalezar,sans-serif;margin:4px 0 8px}
.pbs-tx p{line-height:1.9;opacity:.85;margin:0 0 14px;font-size:14px}
.pbs-buy{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- launch popup ---------- */
.pba{position:fixed;inset:0;z-index:9800;background:rgba(10,7,14,.78);display:flex;align-items:center;justify-content:center;padding:16px;animation:pbaIn .3s}
@keyframes pbaIn{from{opacity:0}}
.pba-in{position:relative;width:min(440px,100%);max-height:100%;overflow:auto;padding:24px 22px 22px;border-radius:24px;background:radial-gradient(ellipse at 50% 0%,#3a2a2c,#16111a 75%);color:#efe5d3;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 0 0 1px rgba(246,220,147,.25)}
.pba-x{position:absolute;top:10px;left:12px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,240,220,.08);color:inherit;font-size:22px;cursor:pointer}
.pba-k{font-size:13px;color:#e7c77a}
.pba-in h2{font:400 36px Lalezar,sans-serif;margin:2px 0 6px}
.pba-in p{margin:0 0 14px;line-height:1.9;font-size:14px;opacity:.88}
.pba-b{display:flex;justify-content:center;padding:4px 0 34px}
.pba-b .pb{--w:230px}
.pba-ac{display:flex;gap:10px;justify-content:center}
.pba-go{padding:10px 26px;border-radius:12px;background:linear-gradient(135deg,#f6dc93,#c79a3e);color:#2a1c08;font-weight:800;text-decoration:none}
.pba-no{padding:10px 18px;border-radius:12px;border:1px solid rgba(255,240,220,.3);background:none;color:inherit;font-family:inherit;cursor:pointer}

@media (max-width:760px){
  .pbp{padding-top:76px}
  .pbp-hero{grid-template-columns:minmax(0,1fr);gap:20px}
  .pbp-hero h1{font-size:36px}
  .pbp-big{justify-self:center;padding:0 0 28px}
  .pbp-big .pb{--w:260px}
  .pbp-grid .pb{--w:150px}
  .pbp-grid{gap:26px 14px}
  .pbs{grid-template-columns:minmax(0,1fr);padding:16px;gap:16px}
  .pbs-books{justify-content:center}
  .pbs-books .pb{--w:110px}.pbs-books span:nth-child(2) .pb{--w:136px}
  .pbs-books span{margin-inline-start:-44px}
}
/* 🔖 limited edition: foil on the cover, the stamp, gold dust when it opens, glowing edge on legendary */
.pb-f{position:relative;overflow:hidden}
.pb-foil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,236,170,.32) 47%,rgba(255,255,255,.5) 50%,rgba(255,236,170,.32) 53%,transparent 65%);background-size:260% 100%;background-position:120% 0;animation:pbFoil 5.5s ease-in-out infinite;mix-blend-mode:screen}
@keyframes pbFoil{0%,55%{background-position:120% 0}100%{background-position:-20% 0}}
.pb-ltd{position:absolute;bottom:.9em;left:50%;transform:translateX(-50%) rotate(-3deg);font-size:.7em;padding:.25em .8em;border:1.5px solid #e7c77a;border-radius:.3em;color:#f6dc93;background:rgba(30,10,10,.45);white-space:nowrap;letter-spacing:.02em}
.pb-dust{position:absolute;inset:0;pointer-events:none;transform:translateZ(5em)}
.pb-dust i{position:absolute;left:50%;top:55%;width:.32em;height:.32em;border-radius:50%;background:radial-gradient(#fff6d0,#e7b84a 60%,transparent 70%);opacity:0}
.pb.open .pb-dust i{animation:pbDust 1.6s cubic-bezier(.2,.7,.3,1) .9s both}
.pb-dust i:nth-child(1){--x:-7em;--y:-9em}.pb-dust i:nth-child(2){--x:6em;--y:-10em}.pb-dust i:nth-child(3){--x:-9em;--y:-3em}.pb-dust i:nth-child(4){--x:9em;--y:-4em}
.pb-dust i:nth-child(5){--x:-4em;--y:-12em}.pb-dust i:nth-child(6){--x:3em;--y:-13em}.pb-dust i:nth-child(7){--x:-10em;--y:2em}.pb-dust i:nth-child(8){--x:10em;--y:1em}
.pb-dust i:nth-child(9){--x:-2em;--y:-8em}.pb-dust i:nth-child(10){--x:5em;--y:-6em}.pb-dust i:nth-child(11){--x:-6em;--y:-14em}.pb-dust i:nth-child(12){--x:8em;--y:-12em}
.pb-dust i:nth-child(13){--x:0em;--y:-15em}.pb-dust i:nth-child(14){--x:-11em;--y:-7em}
.pb-dust i:nth-child(odd){animation-delay:1s!important}
@keyframes pbDust{0%{opacity:0;transform:translate(0,0) scale(.4)}15%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1.1)}}
.pb.t-legend.open .pb-page::before{content:"";position:absolute;inset:-.35em;border-radius:.6em 1.1em 1.1em .6em;pointer-events:none;background:conic-gradient(from var(--pba,0deg),#f6dc93,#b8862f,#fff3c4,#b8862f,#f6dc93);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:.22em;animation:pbEdge 4s linear infinite;opacity:.9}
@property --pba{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes pbEdge{to{--pba:360deg}}
.pba-ltd{margin:.4em 0 .6em;padding:.55em .8em;border-radius:.6em;border:1px dashed rgba(231,199,122,.6);color:#f6dc93;background:rgba(231,199,122,.08);font-size:.92em;line-height:1.7}
.pbx{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8em;margin:.5em 0 .8em;padding:.6em .8em;border-radius:.7em;background:rgba(0,0,0,.28);border:1px solid rgba(231,199,122,.35)}
.pbx-n b{font:400 1.9em/1 Lalezar,sans-serif;color:#f6dc93;display:block}.pbx-n small,.pbx-t small{font-size:.75em;opacity:.75;display:block}
.pbx-bar{height:.45em;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}.pbx-bar i{display:block;height:100%;background:linear-gradient(90deg,#b8862f,#f6dc93);border-radius:inherit}
.pbx-t{text-align:left}.pbx-t b{color:#fff;font-size:.95em}
.pbx.done{display:block;text-align:center}.pbx.done b{display:block;color:#f6dc93}.pbx.done span{font-size:.85em;opacity:.8}
@media (max-width:420px){.pbx{grid-template-columns:auto 1fr;}.pbx-t{grid-column:1/-1;text-align:right;display:flex;gap:.5em;align-items:baseline}}
html.lite .pb-foil,html.lite .pb.t-legend.open .pb-page::before{animation:none}
@media (prefers-reduced-motion:reduce){.pb-foil,.pb.open .pb-dust i,.pb.t-legend.open .pb-page::before{animation:none!important}}
/* in the profile showcase (ویترین) */
.vt-card.vt-pb{aspect-ratio:340/470;perspective:none;cursor:default;container-type:inline-size}
.vt-card.vt-pb .pb{--w:100cqw}
