/* ==========================================================================
   themes.css : رنگ و دکور هر آپدیت پابجی موبایل
   هر آپدیت یک بلوک توکن دارد؛ دکورها مشترک اند و رنگشان از توکن ها می آید.
   راهنما: SEASON-THEME-GUIDE.md
   ========================================================================== */

/* ---------- آپدیت ۴.۶ — Midnight Hunters (ماه خونین، خون آشام ها) ---------- */
body.t-v46{
  --bg:#0a070d;
  --panel:#150d17;
  --panel-2:#211321;
  --text:#fff4f3;
  --text-2:#f0d9dc;
  --muted:#bf9ca4;
  --line:rgba(255,255,255,.12);
  --grid:rgba(255,255,255,.025);
  --pill-line:rgba(255,46,77,.45);
  --accent:#ff2e4d;
  --accent-2:#b04bff;
  --glow-1:rgba(255,46,77,.26);
  --glow-2:rgba(176,75,255,.14);
  --zone:rgba(255,46,77,.55);
  --zone-fill:rgba(255,46,77,.06);
  --smoke:rgba(255,46,77,.42);
  --unit-1:#2a1424;
  --unit-2:#120910;
  --today-bg:rgba(242,169,0,.12);
  --today-ring:rgba(242,169,0,.2);
  --c-season:#4fd1ff;
  --c-rank:#ff2e4d;
  --c-event:#b04bff;
  --hero-pos:58% 38%;
  --hero-pos-m:50% 18%;
  --band-pos:50% 30%;
}

/* ---------- تم پیش فرض پابجی (وقتی تم آپدیت تازه هنوز گذاشته نشده) ---------- */
body.t-classic{
  --bg:#0b0c0f;
  --panel:#14161b;
  --panel-2:#1d2027;
  --text:#f6f6f1;
  --text-2:#dcdcd2;
  --muted:#a3a59a;
  --line:rgba(255,255,255,.12);
  --grid:rgba(255,255,255,.025);
  --pill-line:rgba(242,169,0,.45);
  --accent:#2f8cff;
  --accent-2:#2f8cff;
  --glow-1:rgba(242,169,0,.16);
  --glow-2:rgba(47,140,255,.14);
  --zone:rgba(47,140,255,.6);
  --zone-fill:rgba(47,140,255,.07);
  --smoke:rgba(255,72,48,.4);
  --unit-1:#22252c;
  --unit-2:#101115;
  --today-bg:rgba(242,169,0,.12);
  --today-ring:rgba(242,169,0,.2);
  --c-season:#7bd63a;
  --c-rank:#ff5a3c;
  --c-event:#2f8cff;
  --hero-pos:60% 35%;
  --hero-pos-m:55% 30%;
  --band-pos:60% 35%;
}

/* ---------- دکورهای مشترک هدر ---------- */
/* شبکه نقشه */
.hero-decor .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:120px 120px;-webkit-mask-image:radial-gradient(70% 70% at 70% 40%,#000 30%,transparent 80%);mask-image:radial-gradient(70% 70% at 70% 40%,#000 30%,transparent 80%)}

/* حلقه زون (منطقه امن) */
.hero-decor .zone{position:absolute;top:8%;inset-inline-end:6%;width:min(54vw,620px);aspect-ratio:1;border-radius:50%;background:var(--zone-fill);box-shadow:inset 0 0 0 2px var(--zone),0 0 40px var(--zone-fill);animation:zone 9s ease-in-out infinite}
.hero-decor .zone::after{content:"";position:absolute;inset:22%;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55);animation:zone 9s ease-in-out infinite reverse}

/* مسیر پرواز و هواپیما */
.hero-decor .flight{position:absolute;top:-10%;inset-inline-start:38%;width:2px;height:140%;background:repeating-linear-gradient(180deg,rgba(255,255,255,.55) 0 10px,transparent 10px 22px);transform:rotate(38deg);transform-origin:top center;opacity:.55}
.hero-decor .plane{position:absolute;top:0;left:0;width:34px;height:34px;background:#fff;opacity:.85;filter:drop-shadow(0 0 6px rgba(0,0,0,.6));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M30 4h4l3 20 21 12v5l-21-6-2 15 7 5v4l-10-3-10 3v-4l7-5-2-15-21 6v-5l21-12z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M30 4h4l3 20 21 12v5l-21-6-2 15 7 5v4l-10-3-10 3v-4l7-5-2-15-21 6v-5l21-12z'/%3E%3C/svg%3E") center/contain no-repeat;
  animation:fly 22s linear infinite}

/* دود قرمز ساپلای */
.hero-decor .smoke{position:absolute;bottom:4%;inset-inline-start:-4%;width:460px;height:360px;background:radial-gradient(closest-side,var(--smoke),rgba(0,0,0,0));filter:blur(18px);animation:smoke 7s ease-in-out infinite alternate}

/* خفاش ها (فقط تم ۴.۶) */
.hero-decor .bat{position:absolute;top:var(--y,20%);left:-60px;width:var(--s,30px);height:calc(var(--s,30px) * .5);background:#0d0610;opacity:.85;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50'%3E%3Cpath d='M50 18c3-6 6-8 9-8-2 3-2 6 0 8 6-10 18-14 30-10-7 2-11 7-12 14 6-2 12-1 18 3-10 0-17 4-22 11-4-5-10-7-17-5-2-5-4-8-6-8s-4 3-6 8c-7-2-13 0-17 5C22 29 15 25 5 25c6-4 12-5 18-3-1-7-5-12-12-14 12-4 24 0 30 10 2-2 2-5 0-8 3 0 6 2 9 8z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50'%3E%3Cpath d='M50 18c3-6 6-8 9-8-2 3-2 6 0 8 6-10 18-14 30-10-7 2-11 7-12 14 6-2 12-1 18 3-10 0-17 4-22 11-4-5-10-7-17-5-2-5-4-8-6-8s-4 3-6 8c-7-2-13 0-17 5C22 29 15 25 5 25c6-4 12-5 18-3-1-7-5-12-12-14 12-4 24 0 30 10 2-2 2-5 0-8 3 0 6 2 9 8z'/%3E%3C/svg%3E") center/contain no-repeat;
  animation:bat var(--t,14s) linear infinite;animation-delay:var(--d,0s)}

/* جرقه ها و خاکستر */
.hero-decor .ember{position:absolute;bottom:-10px;left:var(--x,50%);width:var(--s,4px);height:var(--s,4px);border-radius:50%;background:var(--c,#ff7a3c);box-shadow:0 0 8px var(--c,#ff7a3c);opacity:0;animation:ember var(--t,7s) linear infinite;animation-delay:var(--d,0s)}

@keyframes zone{0%,100%{transform:scale(1)}50%{transform:scale(.94)}}
@keyframes fly{0%{transform:translate(var(--fx,62vw),-60px) rotate(218deg)}100%{transform:translate(calc(var(--fx,62vw) - 94vh),120vh) rotate(218deg)}}
@keyframes smoke{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(30px,-24px,0) scale(1.15)}}
@keyframes bat{0%{transform:translate3d(0,0,0) scaleY(1)}25%{transform:translate3d(30vw,-18px,0) scaleY(.6)}50%{transform:translate3d(60vw,8px,0) scaleY(1)}75%{transform:translate3d(90vw,-12px,0) scaleY(.6)}100%{transform:translate3d(120vw,0,0) scaleY(1)}}
@keyframes ember{0%{transform:translate3d(0,0,0);opacity:0}10%{opacity:.95}100%{transform:translate3d(var(--dx,20px),-90vh,0);opacity:0}}

@media (max-width:760px){
  .hero-decor .zone{top:4%;inset-inline-end:-30%;width:110vw}
  .hero-decor .flight{inset-inline-start:20%}
  .hero-decor .plane{--fx:80vw}
  .hero-decor .smoke{width:300px;height:260px}
}