/* Хэллоуин «Ночь масок» (08.10.2026): тема поверх любой игры и экраны
   события. Включается атрибутом html[data-hw] (halloween.js), снять -
   удалить файл и точки VB_HW в app.js. Движение только transform и
   opacity, под общий блок prefers-reduced-motion в styles.css. */

/* ---------- тема поверх всего: тлеющий оранжевый и призрачный фиолетовый ---------- */
html[data-hw]{
  --accent:#FF7A1A;
  --accent-rgb:255,122,26;
  --accent-deep:#C2520A;
  --accent-soft:rgba(255,122,26,.16);
  --accent-grad:linear-gradient(180deg,#FF8F3A 0%,#FF7A1A 55%,#C2520A 100%);
  --live:#B07CFF;
  --live-wash:rgba(176,124,255,.14);
  --warn:#FFB347;
}
html[data-hw] .btn.primary,html[data-hw] .act.like,html[data-hw] .livebar .nbtn.primary{color:#1A0E05}
html[data-hw] .feedtop{box-shadow:inset 0 -1px 0 rgba(255,122,26,.35)}
html[data-hw] .nav button.on{color:#FF9A4D}
html[data-hw] .pcard{box-shadow:0 0 0 1px rgba(176,124,255,.25),0 18px 44px rgba(0,0,0,.55)}
/* Паутина в углу и три летучие мыши над лентой. */
/* Мыши летают только в верхней полосе (11.10.2026): ниже они садились на
   текст вкладок и выглядели как грязь на экране. */
#hwdeco{position:fixed;top:0;left:0;right:0;height:64px;pointer-events:none;z-index:4;overflow:hidden}
#hwdeco .hwweb{position:absolute;top:0;right:0;width:118px;height:118px;color:#D9DDE3;opacity:.22}
#hwdeco .hwbat{position:absolute;top:26px;left:-40px;width:26px;height:12px;opacity:0;
  background:radial-gradient(ellipse 7px 5px at 7px 6px,#2A1A40 60%,transparent 62%),
             radial-gradient(ellipse 7px 5px at 19px 6px,#2A1A40 60%,transparent 62%),
             radial-gradient(ellipse 4px 6px at 13px 7px,#1B1230 60%,transparent 62%);
  animation:hwfly 14s linear infinite}
#hwdeco .hwbat.b2{top:44px;width:20px;animation-duration:19s;animation-delay:5s}
#hwdeco .hwbat.b3{top:12px;width:16px;animation-duration:23s;animation-delay:9s}
@keyframes hwfly{0%{transform:translate(0,0) scaleY(1);opacity:0}5%{opacity:.75}50%{transform:translate(50vw,-22px) scaleY(.4)}
  95%{opacity:.75}100%{transform:translate(110vw,8px) scaleY(1);opacity:0}}

/* ---------- приветствие на весь экран ---------- */
.hwgreet{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:20px 16px;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,122,26,.22),transparent 55%),rgba(7,5,12,.96);
  opacity:0;transition:opacity .3s ease}
.hwgreet.on{opacity:1}
.hwgreetbox{width:100%;max-width:420px;max-height:100%;overflow:auto;display:flex;flex-direction:column;gap:10px;padding:22px 20px 20px;
  background:var(--surface);border-radius:var(--r,14px);box-shadow:0 0 0 1px rgba(255,122,26,.5),0 0 0 5px var(--ground),0 0 0 6px rgba(176,124,255,.3),0 24px 60px rgba(0,0,0,.6);
  transform:translateY(16px);transition:transform .35s ease}
.hwgreet.on .hwgreetbox{transform:none}
.hwgreetart{display:flex;justify-content:center;margin-bottom:4px}
.hwgreetart svg{filter:drop-shadow(0 0 18px rgba(255,122,26,.6))}
.hwgreetbox h2{margin:0;text-align:center;font-size:30px;line-height:1.05;color:#FFB347}
.hwgk{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#B07CFF;margin-top:6px}
.hwgreetbox p{margin:0;font-size:14px;line-height:1.5;color:var(--ink)}
.hwgreetbox .btn{margin-top:6px}

/* ---------- Хеллоуинский магазинчик ---------- */
.btn.hwmine{color:#F6A531;box-shadow:inset 0 0 0 1px rgba(246,165,49,.45)}
.hwshop{position:relative;margin:12px 16px 4px;padding:14px 14px 12px;border-radius:var(--r,12px);overflow:hidden;
  background:radial-gradient(ellipse at 100% 0%,rgba(176,124,255,.22),transparent 55%),linear-gradient(160deg,#1B1230 0%,#12080C 60%,#0B0712 100%);
  box-shadow:inset 0 0 0 1px rgba(255,122,26,.55),0 0 0 4px rgba(255,122,26,.08),0 18px 44px rgba(0,0,0,.5)}
.hwshop::before{content:"";position:absolute;right:-6px;top:-6px;width:110px;height:110px;opacity:.18;pointer-events:none;
  background:radial-gradient(circle,transparent 0 34%,rgba(217,221,227,.9) 34% 35%,transparent 35% 52%,rgba(217,221,227,.9) 52% 53%,transparent 53% 70%,rgba(217,221,227,.9) 70% 71%,transparent 71%),
    linear-gradient(45deg,transparent 49%,rgba(217,221,227,.9) 49% 51%,transparent 51%),linear-gradient(-45deg,transparent 49%,rgba(217,221,227,.9) 49% 51%,transparent 51%),
    linear-gradient(0deg,transparent 49%,rgba(217,221,227,.9) 49% 51%,transparent 51%),linear-gradient(90deg,transparent 49%,rgba(217,221,227,.9) 49% 51%,transparent 51%)}
.hwshophead{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.hwshopart{position:relative;flex:none;width:64px;height:64px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:radial-gradient(circle,rgba(255,122,26,.35),transparent 70%)}
.hwshopart .hwbat{position:absolute;width:16px;height:8px;opacity:.9;
  background:radial-gradient(ellipse 4px 3px at 4px 4px,#C9B3FF 60%,transparent 62%),radial-gradient(ellipse 4px 3px at 12px 4px,#C9B3FF 60%,transparent 62%),radial-gradient(ellipse 2.5px 4px at 8px 4.5px,#B8A2FF 60%,transparent 62%);
  animation:hwbatflap .45s ease-in-out infinite alternate}
.hwshopart .hwbat.b1{top:4px;right:-2px}
.hwshopart .hwbat.b2{bottom:6px;left:-4px;width:12px;height:6px;animation-delay:-.2s}
.hwshoptxt{display:flex;flex-direction:column;gap:3px;min-width:0}
.hwshopk{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#B07CFF}
.hwshoptxt b{font-family:var(--display);font-size:24px;line-height:1;letter-spacing:.04em;text-transform:uppercase;color:#FFB347}
.hwshopsub{font-size:12px;line-height:1.4;color:var(--muted)}
.hwshoplabel{display:block;margin:12px 0 2px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#FF9A4D}
.hwshopnote{margin:0 0 4px;font-size:12px;line-height:1.4;color:var(--muted)}
.hwshop .shopcard.hwcard{background:rgba(0,0,0,.35);box-shadow:inset 0 0 0 1px rgba(255,122,26,.35)}
.hwshop .shopcard.hwcard .titlesw{padding:16px 6px}
.hwshop .shopcard.hwcard .title{font-size:14px}
.hwshopgift{display:flex;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;background:rgba(0,0,0,.35);border-radius:var(--r,8px);
  box-shadow:inset 0 0 0 1px rgba(176,124,255,.35)}
.hwshopgiftl{flex:none;display:flex}
.hwshopgift .hwitxt b{font-size:14px}
.hwshopgift .hwitxt small{font-size:11.5px;line-height:1.35;color:var(--muted)}
.hwshopgift .shopbtn{flex:none;width:auto;padding:9px 14px}

/* ---------- значок тыкв в шапке ---------- */
.hwbadge{display:inline-flex;align-items:center;gap:5px;padding:5px 9px 5px 6px;border-radius:999px;
  background:rgba(255,122,26,.14);color:#FFB347;box-shadow:inset 0 0 0 1px rgba(255,122,26,.45);
  font-family:var(--mono);font-size:12px;font-weight:600}
.hwbadge.soon{color:var(--muted);background:rgba(0,0,0,.25);box-shadow:inset 0 0 0 1px var(--edge-soft)}
.hwbadge svg{display:block}

/* ---------- лист события ---------- */
.hwh{display:flex;align-items:center;gap:8px}
.hwh svg{flex:none}
.hwtimer{font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:#FFB347;padding:8px 12px;
  background:rgba(255,122,26,.1);border-radius:var(--r,6px);box-shadow:inset 0 0 0 1px rgba(255,122,26,.3)}
.hwcount{display:flex;align-items:center;gap:8px;padding:6px 0}
.hwcount b{font-family:var(--display);font-size:30px;line-height:1;color:#FF9A4D}
.hwcount span{color:var(--muted);font-size:13px}
.hwcal{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.hwday{display:flex;flex-direction:column;gap:4px;padding:10px 10px 9px;background:rgba(0,0,0,.3);border-radius:var(--r,6px);
  box-shadow:inset 0 0 0 1px var(--edge-soft);min-height:84px}
.hwday b{font-family:var(--display);font-size:22px;line-height:1;color:var(--dim)}
.hwday span{font-size:12px;line-height:1.3;color:var(--ink)}
.hwday.open{box-shadow:inset 0 0 0 1px rgba(255,122,26,.6);background:rgba(255,122,26,.08)}
.hwday.open b{color:#FF9A4D}
.hwday.done{opacity:.72}
.hwday.done b{color:#B07CFF}
.hwday:nth-child(7){grid-column:1 / -1}
.hwok{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#B07CFF;font-style:normal}
.btn.small{padding:8px 10px;font-size:13px;margin-top:auto}
.hwlavka{display:flex;flex-direction:column;gap:6px}
.hwitem{display:flex;align-items:center;gap:10px;padding:9px 10px;background:rgba(0,0,0,.3);border-radius:var(--r,6px);
  box-shadow:inset 0 0 0 1px var(--edge-soft)}
.hwitem.owned{opacity:.7}
.hwsw{width:26px;height:26px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(0,0,0,.35)}
.hwitxt{flex:1;display:flex;flex-direction:column;min-width:0}
.hwitxt b{font-size:14px}
.hwitxt small{font-size:11px;color:var(--dim)}
.hwitem .btn{flex:none;display:inline-flex;align-items:center;gap:4px;padding:7px 10px;font-size:13px}
.hwitem .btn.dim{opacity:.5}
.hwearn{display:flex;flex-direction:column;gap:4px}
.hwearnrow{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted);padding:4px 0;border-bottom:1px solid var(--edge-soft)}
.hwearnrow b{color:#FF9A4D;font-family:var(--mono);font-weight:600}
.hwpromo{display:flex;align-items:center;gap:12px;margin:12px 16px 4px;padding:12px 14px;border-radius:var(--r,10px);cursor:pointer;
  background:linear-gradient(135deg,rgba(255,122,26,.16),rgba(176,124,255,.14));box-shadow:inset 0 0 0 1px rgba(255,122,26,.4)}
.hwpromol{flex:none;display:flex}
.hwpromot{display:flex;flex-direction:column;gap:3px;min-width:0}
.hwpromot b{font-family:var(--display);font-size:18px;letter-spacing:.03em;text-transform:uppercase}
.hwpromot span{font-size:12.5px;color:var(--muted)}

/* ---------- Кладбище ---------- */
.hwprog{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.hwbar{height:8px;border-radius:4px;background:rgba(0,0,0,.4);overflow:hidden;box-shadow:inset 0 0 0 1px var(--edge-soft)}
.hwbar i{display:block;height:100%;background:linear-gradient(90deg,#B07CFF,#FF7A1A);transform-origin:left center;transform:scaleX(0);
  transition:transform .6s ease}
.hwprog span{font-size:12px;color:var(--muted)}
.hwnext{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px;background:rgba(0,0,0,.3);border-radius:var(--r,8px);
  box-shadow:inset 0 0 0 1px rgba(176,124,255,.35)}
.hwnext.boss{box-shadow:inset 0 0 0 1px rgba(255,122,26,.6);background:rgba(255,122,26,.08)}
.hwnexttxt{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.hwnexttxt b{font-family:var(--display);font-size:18px;letter-spacing:.03em;text-transform:uppercase}
.hwnexttxt span{font-size:12px;color:var(--muted)}
.hwnext .btn{flex:none;padding:11px 16px}
.hwcase{display:flex;flex-direction:column;gap:8px;margin-top:12px;padding:14px;border-radius:var(--r,8px);
  background:linear-gradient(135deg,rgba(255,122,26,.18),rgba(176,124,255,.18));box-shadow:inset 0 0 0 1px rgba(255,179,71,.6)}
.hwcase b{font-family:var(--display);font-size:22px;letter-spacing:.04em;text-transform:uppercase;color:#FFB347}
.hwcase span{font-size:13px;line-height:1.45;color:var(--ink)}
.hwcase.opened{opacity:.75}
.hwroad{display:flex;flex-direction:column;gap:6px;margin-top:14px;position:relative;padding-left:14px}
.hwroad::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:rgba(176,124,255,.3)}
.hwstone{display:flex;align-items:center;gap:10px;padding:9px 10px;background:rgba(0,0,0,.28);border-radius:var(--r,6px);
  box-shadow:inset 0 0 0 1px var(--edge-soft);opacity:.75}
.hwstone.next{opacity:1;box-shadow:inset 0 0 0 1px rgba(255,122,26,.6)}
.hwstone.done{opacity:1;box-shadow:inset 0 0 0 1px rgba(176,124,255,.5)}
.hwfloor{flex:none;min-width:40px;font-family:var(--mono);font-size:12px;font-weight:600;color:#B07CFF;font-style:normal;text-align:center}
.hwstone.next .hwfloor{color:#FF9A4D}
.hwstonetxt{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.hwstonetxt b{font-size:14px}
.hwstonetxt span{font-size:11.5px;color:var(--muted);line-height:1.3}
.hwstone em{flex:none}
.hwitems{margin-top:14px}
.hwitemrow{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--edge-soft);font-size:13px}
.hwitemrow span{color:var(--dim)}
.gaterun.tfight.m-grave{background:radial-gradient(ellipse at 50% 20%,rgba(176,124,255,.18),transparent 55%),
  linear-gradient(180deg,#120B1E 0%,#07050C 100%)}
.hwopen .hwloot .itcell.drop{animation-duration:.8s}

/* ---------- маска в ленте и тыква в подарок ---------- */
.avatar.masked{display:flex;align-items:center;justify-content:center;background:#120B1E}
.avatar.masked .hwmask{width:78%;height:78%}
.hwgift{color:#FF9A4D}
.hwgiftico{display:inline-flex;margin-right:3px}

/* Косметика набора (рамки, цвета ника, появления) лежит в styles.css: у
   купивших она остаётся после события. */