/* ══ الباتل باس داخل الموقع — زرّ الشريط وإعلان الارتقاء (pass-hooks.js) ══ */
.bp-emb{display:block}

/* ① زرّ الشريط: ذهبيٌّ بحلقة المستوى */
.btn-pass-top{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;padding:5px 14px 5px 6px;border-radius:13px;text-decoration:none;white-space:nowrap;
  font-weight:900;font-size:14px;color:#2a1600;background:linear-gradient(135deg,#fff3c4,#ffcf5a 45%,#ff9a2e);
  box-shadow:0 4px 14px rgba(255,160,40,.35),inset 0 -3px 0 rgba(0,0,0,.14);transition:transform .15s,filter .15s}
.btn-pass-top.hidden{display:none}
.btn-pass-top:hover{transform:translateY(-1px);filter:brightness(1.07)}
.pt-ring{position:relative;width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto}
.pt-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.pt-ring circle{fill:none;stroke-width:3.4}
.pt-ring .bg{stroke:rgba(42,22,0,.2);fill:#1b1030}
.pt-ring .fg{stroke:#fff;stroke-linecap:round;transition:stroke-dashoffset 1s}
.pt-ring b{position:relative;font-weight:900;font-size:13px;color:#ffe08a}
.btn-pass-top.slim{width:42px;height:42px;padding:0;justify-content:center;border-radius:12px}
.btn-pass-top.slim .pt-txt{display:none}
body.playing #toolrail .btn-pass-top:not(.slim){padding:3px 10px 3px 4px;font-size:12.5px;border-radius:10px}
body.playing #toolrail .btn-pass-top .pt-ring{width:26px;height:26px}
body.playing #toolrail .btn-pass-top.slim{width:30px;height:30px;border-radius:9px}

/* ② إعلان الارتقاء في البثّ */
.pl-toast{position:fixed;left:20px;bottom:96px;z-index:9550;display:flex;align-items:center;gap:14px;min-width:320px;max-width:min(520px,calc(100vw - 40px));
  padding:12px 16px 12px 14px;border-radius:22px;overflow:hidden;color:#fff;font-family:'Tajawal',system-ui,sans-serif;pointer-events:none;
  background:radial-gradient(120% 140% at 0% 50%,color-mix(in srgb,var(--rc) 35%,transparent),transparent 60%),linear-gradient(135deg,rgba(20,24,60,.96),rgba(10,12,30,.96));
  border:2px solid var(--rc);box-shadow:0 18px 50px rgba(0,0,0,.5),0 0 30px color-mix(in srgb,var(--rc) 45%,transparent);
  transform:translateX(-120%) skewX(-6deg);opacity:0;transition:transform .55s cubic-bezier(.2,1.3,.4,1),opacity .3s}
.pl-toast.on{transform:none;opacity:1}
.pl-toast.out{transform:translateX(-30px);opacity:0;transition-duration:.4s}
.pl-av{position:relative;flex:0 0 auto;width:58px;height:58px}
.pl-av img,.pl-av i{width:100%;height:100%;border-radius:50%;object-fit:cover;display:grid;place-items:center;font-style:normal;font-weight:900;font-size:24px;background:#243066;border:3px solid var(--rc)}
.pl-av em{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);min-width:28px;padding:1px 7px;border-radius:999px;font-style:normal;font-weight:900;font-size:13px;text-align:center;
  background:var(--rc);color:#170d00;box-shadow:0 4px 10px rgba(0,0,0,.4)}
.pl-tx{flex:1;min-width:0;line-height:1.25}
.pl-tx small{display:block;font-weight:900;font-size:12px;color:var(--rc);letter-spacing:.5px}
.pl-tx b{display:block;font-weight:900;font-size:22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-tx span{display:block;font-weight:800;font-size:14.5px;color:#d6def5}
.pl-tx strong{color:#fff}
.pl-emb{flex:0 0 auto;width:70px;height:70px;filter:drop-shadow(0 6px 16px color-mix(in srgb,var(--rc) 60%,transparent));animation:plEmb .9s .3s cubic-bezier(.2,1.6,.4,1) both}
.pl-emb .bp-emb{width:100%;height:100%}
@keyframes plEmb{from{transform:scale(0) rotate(-30deg)}}
.pl-shine{position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.25) 50%,transparent 65%) -150% 0/250% 100% no-repeat;animation:plShine 1.6s .4s ease-out both}
@keyframes plShine{to{background-position:150% 0}}
@media (max-width:640px){.pl-toast{left:10px;right:10px;min-width:0;bottom:70px}.pl-emb{width:54px;height:54px}.pl-tx b{font-size:18px}}
@media (prefers-reduced-motion:reduce){.pl-toast{transition:opacity .2s}.pl-emb,.pl-shine{animation:none}}

/* ③ رابط الباس في نافذة عدّاد الموسم */
.se-pass{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;padding:10px;border-radius:12px;text-decoration:none;font-weight:900;font-size:14px;
  color:#2a1600;background:linear-gradient(135deg,#fff3c4,#ffcf5a 45%,#ff9a2e)}

/* ④ تبويب «الباتل باس» في صفحة الحساب */
.mp-pass{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;padding:22px;border-radius:24px;
  background:radial-gradient(80% 90% at 0% 0%,rgba(255,190,70,.2),transparent 60%),linear-gradient(150deg,rgba(40,60,150,.45),rgba(14,18,46,.8));border:1px solid rgba(255,207,90,.3)}
.mp-pass-lv{position:relative;width:120px;aspect-ratio:1;display:grid;place-items:center}
.mp-pass-lv svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.mp-pass-lv circle{fill:none;stroke-width:8}
.mp-pass-lv .bg{stroke:rgba(255,255,255,.1)}
.mp-pass-lv .fg{stroke:#ffcf5a;stroke-linecap:round}
.mp-pass-lv div{position:relative;text-align:center;line-height:1}
.mp-pass-lv small{display:block;font-weight:800;font-size:12px;opacity:.7}
.mp-pass-lv b{display:block;font-weight:900;font-size:44px;color:#ffe08a}
.mp-pass h3{margin:0 0 6px;font-weight:900;font-size:22px}
.mp-pass p{margin:0 0 12px;font-weight:700;opacity:.8}
.mp-pass-next{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;background:rgba(0,0,0,.25);margin-bottom:14px}
.mp-pass-next .bp-emb{width:56px;height:56px;flex:0 0 auto}
.mp-pass-next b{display:block;font-weight:900;font-size:16px}
.mp-pass-next span{display:block;font-weight:700;font-size:13px;opacity:.75}
.mp-pass-go{display:inline-flex;padding:11px 20px;border-radius:14px;font-weight:900;text-decoration:none;color:#2a1600;background:linear-gradient(135deg,#fff3c4,#ffcf5a 45%,#ff9a2e)}
@media (max-width:640px){.mp-pass{grid-template-columns:1fr;justify-items:center;text-align:center}}
/* الشريط يضيق على الشاشات المتوسّطة: الحلقة وحدها والاسم عند المرور — وإلّا غطّت الأدواتُ خانةَ الاتصال */
@media (max-width:1600px){
  .btn-pass-top:not(.slim){padding:4px;border-radius:12px}
  .btn-pass-top .pt-txt{display:none}
}

/* ⑤ طقم الباتل باس في لوحة البنرات (account.js) */
.tb-combo-btn{display:inline-flex;align-items:center;gap:5px}
.tb-combo-btn.on{background:linear-gradient(135deg,#fff3c4,#ffcf5a 45%,#ff9a2e);color:#2a1600;border-color:transparent}
.tb-combo-av{width:18px;height:18px;border-radius:50%;object-fit:cover}
.tb-combo{display:flex;align-items:center;gap:16px;margin:8px 0 4px;padding:12px;border-radius:14px;
  background:linear-gradient(135deg,rgba(255,207,90,.1),rgba(255,255,255,.03));border:1px dashed rgba(255,207,90,.45)}
.tb-combo.hidden{display:none}
.tb-combo-pv{position:relative;flex:0 0 auto;width:190px;height:78px}
.tb-combo-ban{position:absolute;inset:14px 0 0 30px;border-radius:12px;background:var(--lbg,linear-gradient(135deg,#3d5bff,#b46bff)) center var(--lby,50%)/cover;box-shadow:0 6px 16px rgba(0,0,0,.35)}
.tb-combo-ava{position:absolute;right:0;top:0;z-index:1;width:64px;height:64px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  background:#1b2250;border:3px solid #ffcf5a;box-shadow:0 6px 16px rgba(0,0,0,.45)}
.tb-combo-ava img{width:100%;height:100%;object-fit:cover}
.tb-combo-ava i{font-style:normal;font-size:11px;font-weight:800;opacity:.7}
.tb-combo-f{flex:1;min-width:0;display:grid;gap:8px}
.tb-combo-f label{display:grid;gap:4px;font-size:13px;font-weight:800}
.tb-combo-f input{max-width:140px}
.tb-combo-row{display:flex;flex-wrap:wrap;gap:6px}
.tb-combo-f small{font-size:12px;opacity:.7;line-height:1.6}
@media (max-width:640px){.tb-combo{flex-direction:column;align-items:stretch}.tb-combo-pv{margin:0 auto}}

/* ⑥ الأطقم في الحقيبة (viewer.js) */
.vw-bgroup.combo h3{color:#ffcf5a}
.vw-bcard.combo .vw-ban{position:relative;overflow:visible}
.vw-bcard.combo{border-color:rgba(255,207,90,.45)}
.vw-cav{position:absolute;right:-8px;bottom:-14px;z-index:2;width:58px;height:58px;border-radius:50%;overflow:hidden;display:block;
  background:#1b2250;border:3px solid #ffcf5a;box-shadow:0 8px 18px rgba(0,0,0,.45)}
.vw-cav img{width:100%;height:100%;object-fit:cover;display:block}
.vw-clvl{position:absolute;top:6px;left:6px;z-index:2;font-style:normal;font-weight:900;font-size:11px;padding:2px 9px;border-radius:999px;
  background:linear-gradient(90deg,#ff9a2e,#ffcf5a);color:#2a1600}
.vw-bcard.combo.lock .vw-cav{filter:grayscale(.6) brightness(.7)}
.vw-bcard.combo .vw-bfoot{padding-top:16px}
a.vw-need{text-decoration:none;color:inherit}
.vw-comboav{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0 12px;padding:10px 12px;border-radius:14px;background:rgba(255,207,90,.08);border:1px solid rgba(255,207,90,.3)}
.vw-comboav span{font-weight:800;font-size:13px}
.vw-comboav button{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:999px;border:1.5px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.05);color:inherit;font:800 13px 'Tajawal',sans-serif;cursor:pointer}
.vw-comboav button img{width:26px;height:26px;border-radius:50%;object-fit:cover}
.vw-comboav button.on{border-color:#ffcf5a;background:rgba(255,207,90,.18);box-shadow:0 0 12px rgba(255,207,90,.3)}

/* زرّ «شخصيتي» جنب الباتل باس */
.btn-char-top{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;padding:8px 14px;border-radius:13px;text-decoration:none;white-space:nowrap;
  font-weight:900;font-size:14px;color:#06101f;background:linear-gradient(135deg,#9fe8ff,#31e1ff 50%,#7b8cff);
  box-shadow:0 4px 14px rgba(49,225,255,.3),inset 0 -3px 0 rgba(0,0,0,.14);transition:transform .15s,filter .15s}
.btn-char-top.hidden{display:none}
.btn-char-top:hover{transform:translateY(-1px);filter:brightness(1.07)}
.btn-char-top svg{width:19px;height:19px;flex:0 0 auto}
.btn-char-top.slim{width:42px;height:42px;padding:0;justify-content:center;border-radius:12px}
.btn-char-top.slim span{display:none}
/* (٢٠٢٦/١٠/٠٤ المالك: «علامة اليد تنكتب شخصيتي بشكل واضح») الاسم ظاهر — ويختفي فقط في الشاشات الضيّقة جداً */
@media (max-width:1180px){.btn-char-top:not(.slim){padding:9px}.btn-char-top span{display:none}}
body.playing #toolrail .btn-char-top.slim{width:30px;height:30px;border-radius:9px}

/* ══════════ جوائز الباتل باس داخل الألعاب (٢٠٢٦/١٠/٠١) ══════════ */
/* ① إطار الأفتار: حلقةٌ معدنيّة أعرض من حلقة اللون، بندرتها */
.av.pf{--pf1:#fff;--pf2:#c9d3e6;--pf3:#6f7d99}
.av.pf-sky{--pf1:#d9f3ff;--pf2:#4fb2ff;--pf3:#1c4fa8}
.av.pf-violet{--pf1:#f3dcff;--pf2:#b46bff;--pf3:#5a1fa0}
.av.pf-ember{--pf1:#ffe2b8;--pf2:#ff7a2f;--pf3:#9c2a0c}
.av.pf-royal{--pf1:#fff6cf;--pf2:#ffc94a;--pf3:#b86a10}
.av.pf .av-ring{opacity:1;inset:-4px;animation-duration:4s;
  background:conic-gradient(from 0deg,var(--pf1),var(--pf2),var(--pf3),var(--pf2),var(--pf1),var(--pf2),var(--pf3),var(--pf2),var(--pf1));
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px))}
.av.pf{box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 14px color-mix(in srgb,var(--pf2) 55%,transparent)}
.av.lg.pf .av-ring,.av.xl.pf .av-ring{inset:-6px;
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5.5px),#000 calc(100% - 5.5px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 5.5px),#000 calc(100% - 5.5px))}
.av.pf-royal::after,.av.pf-ember::after{content:"";position:absolute;inset:-9px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,transparent 58%,color-mix(in srgb,var(--pf2) 40%,transparent) 70%,transparent 74%);
  animation:pfPulse 2.2s ease-in-out infinite}
@keyframes pfPulse{50%{opacity:.35;transform:scale(1.06)}}
.av-stack .av.pf .av-ring{display:block;inset:-2px}

/* ② لقب الموسم بجانب الاسم: شعارُه المرسوم واسمُه بلون ندرته */
.mark.mark-pt{--r1:#c9d3e6;--r2:#6f7d99;gap:.3em;padding:.1em .62em .1em .22em;color:#fff;
  background:linear-gradient(180deg,#141a33,#090d1f) padding-box,
             linear-gradient(120deg,var(--r1),var(--r2),var(--r1)) border-box;
  border:1.5px solid transparent;animation:none;box-shadow:0 2px 10px color-mix(in srgb,var(--r1) 30%,transparent)}
.mark.mark-pt.r-r{--r1:#4fb2ff;--r2:#1c4fa8}
.mark.mark-pt.r-e{--r1:#b46bff;--r2:#5a1fa0}
.mark.mark-pt.r-l{--r1:#ffc94a;--r2:#b86a10}
.mark.mark-pt > .mark-t{color:var(--r1)}
.mark-pt .pt-emb{display:inline-grid;width:1.45em;height:1.45em;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.mark-pt .pt-emb svg{width:100%;height:100%}
/* الذهبيّ للمشتركين: رقائق ذهبٍ تجري على اللقب كلّه */
.mark.mark-pt.gold{background:linear-gradient(100deg,#7a4a06,#ffd76e 30%,#fff3c4 45%,#ffc94a 60%,#7a4a06) padding-box,
  linear-gradient(120deg,#fff6cf,#ffc94a,#b86a10,#ffc94a) border-box;background-size:260% 100%,100% 100%;
  animation:ptGold 3.2s linear infinite;box-shadow:0 0 14px rgba(255,201,74,.55)}
.mark.mark-pt.gold > .mark-t{color:#2a1700;text-shadow:0 1px 0 rgba(255,255,255,.4)}
@keyframes ptGold{to{background-position:-260% 0,0 0}}

/* ③ الدخلة الذهبيّة: بطاقة الانضمام تلمع ويعبرها شعاعٌ ذهبيّ */
.joincard.pt-entry{box-shadow:0 0 0 2px #ffc94a,0 0 34px rgba(255,201,74,.65) !important}
.joincard.pt-entry::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
  background:linear-gradient(105deg,transparent 30%,rgba(255,236,170,.85) 48%,transparent 62%);
  background-size:250% 100%;animation:ptSweep 1.1s ease-out 2 both}
@keyframes ptSweep{from{background-position:120% 0}to{background-position:-120% 0}}
.jl-p.pt-entry,.lb-p.pt-entry{box-shadow:0 0 0 2px #ffc94a,0 0 26px rgba(255,201,74,.6)}
@media (prefers-reduced-motion:reduce){.mark.mark-pt.gold,.av.pf .av-ring,.av.pf::after{animation:none}}

/* «حسابي» (٢٠٢٦/١٠/٠٤ المالك: «علامة اليد اللي تدخل البروفايل — خلها نفس زرّ شخصيتي وسمّها حسابي»)
   في شريط الصفحة الرئيسيّة: حبّةٌ بنصّها مثل «شخصيتي». وأثناء اللعب يبقى الأفتار المدوّر كما كان */
#btnAcct .acct-ic{display:none}
@media (min-width:861px){
  body:not(.playing):has(#stage[data-game="home"]) #toolrail #btnAcct{
    display:inline-flex;align-items:center;gap:7px;width:auto;height:auto;padding:8px 14px;border:0;border-radius:13px;white-space:nowrap;
    font-weight:900;font-size:14px;color:#06101f;background:linear-gradient(135deg,#9fe8ff,#31e1ff 50%,#7b8cff);
    box-shadow:0 4px 14px rgba(49,225,255,.3),inset 0 -3px 0 rgba(0,0,0,.14);transition:transform .15s,filter .15s}
  body:not(.playing):has(#stage[data-game="home"]) #toolrail #btnAcct:hover{transform:translateY(-1px);filter:brightness(1.07)}
  body:not(.playing):has(#stage[data-game="home"]) #toolrail #btnAcct .acct-ic{display:block;width:19px;height:19px;flex:0 0 auto}
  body:not(.playing):has(#stage[data-game="home"]) #toolrail #btnAcct #acctAv{display:none}
  body:not(.playing):has(#stage[data-game="home"]) #toolrail #btnAcct #acctName{display:inline;font-weight:900;max-width:none}
}
/* مكانُ «حسابي» على اللابتوب: الحبّات أرصّ، وزرّ المنصّة أيقونة، وخانة الاسم أضيق */
@media (min-width:861px) and (max-width:1440px){
  body:not(.playing):has(#stage[data-game="home"]) #toolrail #btnAcct,
  .btn-char-top:not(.slim){padding:8px 10px;font-size:13px;gap:5px}
  #btnDrawTop{padding-inline:10px}
  #topbar .plat-btn span{display:none}
  #topbar .plat-btn{padding:4px 7px}
  #topbar #ttUser{width:60px}
}
@media (min-width:861px) and (max-width:1300px){
  body:not(.playing):has(#stage[data-game="home"]) #toolrail .btn-icon{width:35px !important;height:35px !important}
  #topbar #ttUser{width:46px}
}

/* ── شريط تقدّم الباتل باس في صفحة الألعاب (٢٠٢٦/١٠/١٩) ── */
.bpb{display:flex;align-items:center;gap:14px;margin:0 4px 18px;padding:8px 16px 8px 12px;border-radius:16px;text-decoration:none;white-space:nowrap;overflow:hidden;
  color:#fff3d6;background:linear-gradient(100deg,rgba(255,180,60,.16),rgba(40,22,4,.55) 45%,rgba(255,150,40,.12));
  border:1.5px solid rgba(255,201,74,.45);box-shadow:0 6px 18px rgba(255,150,40,.12),inset 0 1px 0 rgba(255,240,200,.12);transition:transform .15s,filter .15s}
.bpb:hover{transform:translateY(-1px);filter:brightness(1.08)}
.bpb.hidden{display:none}
.bpb-emb{flex:none;width:46px;height:46px;display:grid;place-items:center}
.bpb-emb .bp-emb{width:46px;height:46px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.45))}
.bpb-emb.dim{opacity:.45;filter:grayscale(.6)}
.bpb-l{flex:none;display:flex;flex-direction:column;line-height:1.15}
.bpb-l small{font-size:12px;font-weight:800;color:#ffd98a;opacity:.85}
.bpb-l b{font-size:19px;font-weight:900;color:#fff}
.bpb-track{position:relative;flex:1 1 auto;min-width:160px;height:28px;border-radius:999px;background:rgba(0,0,0,.42);border:1px solid rgba(255,201,74,.3);overflow:hidden}
.bpb-track i{position:absolute;inset-block:0;inset-inline-start:0;border-radius:999px;background:linear-gradient(90deg,#ff9a2e,#ffcf5a 60%,#fff3c4);box-shadow:0 0 14px rgba(255,190,70,.55);transition:width .6s}
.bpb-track em{position:relative;display:grid;place-items:center;height:100%;font-style:normal;font-size:13.5px;font-weight:900;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.75)}
.bpb-next{flex:none;display:flex;flex-direction:column;align-items:center;line-height:1.15}
.bpb-next small{font-size:11.5px;font-weight:800;color:#ffd98a;opacity:.85}
.bpb-next b{font-size:15px;font-weight:900;color:#ffcf5a}
.bpb-next em{font-style:normal;font-size:11.5px;font-weight:800;color:#e9dcc0}
.bpb-go{flex:none;padding:7px 14px;border-radius:11px;font-size:14px;font-weight:900;color:#2a1600;background:linear-gradient(135deg,#fff3c4,#ffcf5a 45%,#ff9a2e);box-shadow:inset 0 -3px 0 rgba(0,0,0,.14)}
.bpb.max .bpb-track i{width:100%!important}
@media (max-width:1180px){.bpb-next{display:none}}
@media (max-width:760px){.bpb{flex-wrap:wrap;white-space:normal}.bpb-track{order:5;flex-basis:100%}.bpb-go{margin-inline-start:auto}}
