/* ============================================================
   АРЕНА ГАБЕНА — оформление страницы (шапка/панель/лидерборд)
   Палитра — золото/кровь/дерево, как у подстраниц сайта.
   ============================================================ */
:root{
  --wood:#2a1d12; --wood-light:#3d2a18;
  --gold:#c9a24a; --gold-bright:#f0d080;
  --paper:#efe6d2; --ink:#241c12; --ink-light:#5e5240;
  --red:#b22222; --red-bright:#e23b2e; --green:#2e7d32;
}
*{margin:0; padding:0; box-sizing:border-box;}
body{
  background:
    radial-gradient(ellipse 100% 70% at 50% -10%, rgba(180,40,30,0.10), transparent 60%),
    radial-gradient(ellipse 120% 100% at 50% 120%, rgba(40,20,10,0.4), transparent 70%),
    #0c0a08;
  color:#ddd; font-family:'Exo 2',sans-serif; min-height:100vh;
  display:flex; flex-direction:column; align-items:center; padding:15px;
}

/* ── ПАНЕЛЬ ВВОДА ── */
.panel{
  position:relative; z-index:10;
  background:rgba(20,14,9,0.95); backdrop-filter:blur(20px);
  border:1px solid var(--gold); border-radius:20px;
  padding:25px 30px; width:90%; max-width:760px; margin-bottom:15px;
  box-shadow:0 0 50px rgba(201,162,74,0.15); text-align:center;
}
.panel h1{
  font-family:'Cinzel',serif; font-size:2.1rem; font-weight:900;
  background:linear-gradient(135deg, var(--gold-bright), var(--gold));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  letter-spacing:3px; margin-bottom:5px;
}
.subtitle{ color:#998; font-size:0.92rem; margin-bottom:20px; font-style:italic; }

.input-row{ display:flex; justify-content:center; margin-bottom:8px; }
.input-row input{
  background:#0e0b08; border:2px solid #4a3a22; color:#fff;
  padding:11px 18px; border-radius:8px; font-size:0.9rem; outline:none;
  flex:1 1 200px; max-width:520px; font-family:'Exo 2',sans-serif; transition:0.3s;
}
.input-row input:focus{ border-color:var(--gold); box-shadow:0 0 15px rgba(201,162,74,0.35); }

/* строка опции под полем (галочка / кнопка рандома) */
.opt-row{ display:flex; align-items:center; gap:9px; max-width:520px; margin:0 auto 14px;
  color:#bba; font-size:0.82rem; cursor:pointer; }
.opt-row.opt-center{ justify-content:center; }
.opt-row input[type=checkbox]{ width:17px; height:17px; accent-color:var(--gold); cursor:pointer; flex-shrink:0; }
.mini-btn{
  background:rgba(201,162,74,0.10); border:1px solid var(--gold); color:var(--gold-bright);
  padding:7px 16px; border-radius:8px; cursor:pointer; font-family:'Cinzel',serif;
  font-size:0.82rem; font-weight:700; letter-spacing:1px; transition:0.25s;
}
.mini-btn:hover{ background:rgba(201,162,74,0.22); box-shadow:0 0 14px rgba(201,162,74,0.35); }

#prepareBtn{
  margin-top:6px; background:linear-gradient(135deg,#6b1a14,#a02820);
  color:var(--paper); border:2px solid #7a2018; padding:12px 30px; border-radius:8px;
  cursor:pointer; font-family:'Cinzel',serif; font-size:1.05rem; font-weight:700;
  letter-spacing:2px; transition:0.3s; text-transform:uppercase;
}
#prepareBtn:hover:not(:disabled){ background:linear-gradient(135deg,#8a221a,#c43228); box-shadow:0 0 25px rgba(196,50,40,0.5); transform:translateY(-2px); }
#prepareBtn:disabled{ opacity:0.45; cursor:not-allowed; }
#prepareBtn.ready{ background:linear-gradient(135deg,#7a5a16,#c9a24a); border-color:#caa44d; color:#1a1008; }
#prepareBtn.ready:hover{ background:linear-gradient(135deg,#9a7420,#f0d080); box-shadow:0 0 26px rgba(201,162,74,0.55); }
/* музыка боя: кнопка-иконка рядом с «В бой» */
.prepare-row{ display:flex; gap:8px; align-items:stretch; justify-content:center; margin-top:6px; }
.prepare-row #prepareBtn{ margin-top:0; }
.music-btn{ flex:0 0 auto; width:52px; padding:0; border:2px solid #7a2018; border-radius:8px; cursor:pointer; transition:.2s;
  background:linear-gradient(135deg,#3a1410,#5a1c14); color:#e7c9a0; font-size:1.35rem; line-height:1; }
.music-btn:hover{ background:linear-gradient(135deg,#5a1c14,#7a2820); box-shadow:0 0 14px rgba(196,50,40,.4); }
.music-btn.on{ border-color:#caa44d; color:#ffd97a; background:linear-gradient(135deg,#3a2a10,#5a4416); box-shadow:0 0 14px rgba(201,162,74,.45); }
.music-vol-row{ display:flex; align-items:center; justify-content:center; gap:9px; margin-top:9px; }
.music-vol-ico{ font-size:.95rem; opacity:.75; }
.music-vol{ width:190px; max-width:60%; height:5px; cursor:pointer; accent-color:#caa44d; }

.progress{ display:none; margin:14px 0 0; color:#aa9; font-family:'Cinzel',serif; justify-content:center; align-items:center; gap:12px; }
.sword-spin{ font-size:1.5rem; display:inline-block; animation:swSpin 1.5s linear infinite; }
@keyframes swSpin{ from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
.error{ display:none; color:#ff5544; margin-top:12px; font-weight:bold; }

/* ── НАВИГАЦИОННЫЕ ВКЛАДКИ ── */
.nav-side-btn{ position:absolute; top:25px; display:flex; align-items:center; height:46px;
  text-decoration:none; white-space:nowrap; overflow:hidden;
  transition:all 0.4s cubic-bezier(0.25,0.8,0.25,1); z-index:0; color:var(--paper); }
.nav-left{ background:rgba(20,14,9,0.95); backdrop-filter:blur(10px);
  font-family:'Cinzel',serif; font-size:0.85rem; font-weight:bold; letter-spacing:1px;
  left:-46px; width:46px; border:1px solid var(--gold); border-right:none;
  border-radius:12px 0 0 12px; box-shadow:-5px 0 15px rgba(201,162,74,0.3); flex-direction:row-reverse; }
.nav-left:hover{ width:190px; left:-190px; background:rgba(201,162,74,0.12); border-color:var(--gold-bright); }
.nav-right{ background:rgba(20,14,9,0.95); backdrop-filter:blur(10px);
  font-family:'Cinzel',serif; font-size:0.85rem; font-weight:bold; letter-spacing:1px;
  right:-46px; width:46px; border:1px solid var(--gold); border-left:none;
  border-radius:0 12px 12px 0; box-shadow:5px 0 15px rgba(201,162,74,0.3); flex-direction:row; }
.nav-right:hover{ width:190px; right:-190px; background:rgba(201,162,74,0.12); border-color:var(--gold-bright); }
.nav-right2{ top:81px; background:rgba(20,14,9,0.95); backdrop-filter:blur(10px);
  font-family:'Cinzel',serif; font-size:0.85rem; font-weight:bold; letter-spacing:1px;
  right:-46px; width:46px; border:1px solid var(--gold); border-left:none;
  border-radius:0 12px 12px 0; box-shadow:5px 0 15px rgba(201,162,74,0.3); flex-direction:row; }
.nav-right2:hover{ width:190px; right:-190px; background:rgba(201,162,74,0.12); border-color:var(--gold-bright); }
.nav-right2.nav-w{ top:137px; }
.nav-icon{ width:46px; display:flex; justify-content:center; align-items:center; font-size:1.3rem; flex-shrink:0; }
.nav-text{ opacity:0; transition:opacity 0.3s; text-transform:none; }
.nav-side-btn:hover .nav-text{ opacity:1; transition-delay:0.1s; }

/* ── КОНТЕЙНЕР АРЕНЫ (во всю ширину) ── */
.arena-layout{ width:70vw; margin:0 auto; }
.arena-wrap{ width:100%; }
.arena-placeholder{ border:1px dashed rgba(201,162,74,0.5); border-radius:20px; padding:60px 24px;
  text-align:center; color:#998; background:rgba(20,14,9,0.5); }
.arena-placeholder .ph-emoji{ font-size:2.4rem; margin-bottom:10px; opacity:.8; }
.arena-placeholder .ph-text{ font-size:0.95rem; max-width:440px; margin:0 auto; line-height:1.5; }
@keyframes arenaIn{ from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none} }
#arenaApp{ animation:arenaIn .5s ease-out; }
.arena-app{
  background:radial-gradient(120% 90% at 50% 8%, rgba(255,157,46,.10), transparent 55%), rgba(14,10,8,0.96);
  border:1px solid var(--gold); border-radius:20px; padding:18px 18px 8px;
  box-shadow:0 0 50px rgba(201,162,74,0.12);
}

/* ── ЛИДЕРБОРД: фиксированный, плавает справа под сменой языка (компактный) ── */
.lb-side{
  position:fixed; right:14px; top:60px; width:150px; z-index:90;
  background:rgba(20,14,9,0.96); backdrop-filter:blur(12px);
  border:1px solid var(--gold); border-radius:11px; padding:7px 7px 8px;
  box-shadow:0 0 26px rgba(201,162,74,0.18); max-height:calc(100vh - 76px); overflow:auto;
}
.lb-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; gap:4px;
  font-family:'Cinzel',serif; font-weight:900; color:var(--gold-bright); letter-spacing:.5px; font-size:0.66rem; }
.lb-more{ background:none; border:1px solid var(--gold); color:var(--gold); border-radius:6px;
  padding:2px 5px; font-size:0.55rem; font-family:'Exo 2'; cursor:pointer; font-weight:700; white-space:nowrap; }
.lb-more:hover{ background:rgba(201,162,74,0.15); }
.lb-list{ list-style:none; display:flex; flex-direction:column; gap:3px; }
/* строка свёрнутого списка (минимальная) */
.lb-row{ display:flex; align-items:center; gap:5px; padding:3px 4px; border-radius:7px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); }
.lb-row .rk{ width:12px; text-align:center; font-family:'Anton'; color:var(--gold); font-size:0.62rem; flex-shrink:0; }
.lb-row .av{ width:18px; height:18px; border-radius:50%; flex-shrink:0; background-size:cover; border:1px solid #3a2a18; }
.lb-row .meta{ flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.05; }
.lb-row .nk{ font-size:0.6rem; color:#ece0c4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:700; }
.lb-row .pt{ font-size:0.54rem; color:#caa44d; }
.lb-row .duel{ flex-shrink:0; background:linear-gradient(135deg,#6b1a14,#a02820); color:#efe6d2;
  border:1px solid #7a2018; border-radius:6px; cursor:pointer; font-family:'Cinzel',serif; font-weight:700;
  white-space:nowrap; padding:3px 5px; font-size:0.55rem; }
.lb-row .duel.mini{ padding:3px 5px; font-size:0.66rem; line-height:1; }
.lb-row .duel:hover{ background:linear-gradient(135deg,#8a221a,#c43228); }
.lb-openfull{ display:none; }

/* ── МОДАЛКА ТОП-100 ── */
.lb-modal-card{
  background:linear-gradient(180deg, rgba(28,20,12,0.97), rgba(16,11,8,0.97));
  border:1px solid var(--gold); border-radius:18px; max-width:600px; width:100%;
  padding:24px 24px; box-shadow:0 20px 60px rgba(0,0,0,0.6), 0 0 30px rgba(201,162,74,0.2);
  position:relative; max-height:88vh; overflow-y:auto;
}
.lb-modal-close{ position:absolute; top:14px; right:18px; background:none; border:none; color:#999; font-size:26px; line-height:1; cursor:pointer; }
.lb-modal-title{ font-family:'Cinzel',serif; font-size:1.3rem; font-weight:900; color:var(--gold-bright);
  text-align:center; letter-spacing:2px; margin-bottom:4px; }
.lb-modal-sub{ text-align:center; color:#998; font-size:0.85rem; margin-bottom:18px; font-style:italic; }
/* единая сетка: # / игрок / очки / дуэль — одинаковая у шапки и строк */
.lb-cols{ display:grid; grid-template-columns:36px 1fr 64px 104px; gap:10px; padding:0 10px 8px; align-items:center;
  font-size:0.72rem; color:#998; letter-spacing:1px; text-transform:uppercase; border-bottom:1px solid rgba(201,162,74,0.25); }
.lb-list.full{ gap:6px; margin-top:8px; }
.lb-list.full .lb-row{ display:grid; grid-template-columns:36px 1fr 64px 104px; align-items:center; gap:10px; padding:6px 10px; }
.lb-list.full .lb-row .player{ display:flex; align-items:center; gap:9px; min-width:0; }
.lb-list.full .lb-row .av{ width:30px; height:30px; }
.lb-list.full .lb-row .nk{ font-size:0.85rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lb-list.full .lb-row .pt{ font-size:0.88rem; color:#caa44d; font-weight:700; text-align:right; }
.lb-list.full .lb-row .duel{ justify-self:end; padding:6px 12px; font-size:0.7rem; }

@media (max-width:1100px){
  .arena-layout{ width:92vw; max-width:1000px; }
  .lb-side{ position:static; width:96%; max-width:760px; margin:6px auto 14px; max-height:none; }
}
@media (max-width:560px){
  .lb-cols{ grid-template-columns:28px 1fr 50px 64px; gap:6px; }
  .lb-list.full .lb-row{ grid-template-columns:28px 1fr 50px 64px; gap:6px; padding:6px; }
  .lb-list.full .lb-row .duel{ padding:5px 7px; font-size:0.62rem; }
}
@media (max-width:768px){
  .panel .nav-side-btn{ display:none !important; }
}
/* ===== АРЕНА: визуальный слой (scoped .arena-app) ===== */
.arena-app{
--gold:#ffc44d; --bone:#ece0c4; --bone-d:#b7a888;
  --torch:#ff9d2e; --ember:#ff5a14;
  --blood:#9a0a0a; --blood-b:#d11414; --danger:#e02329;
  --mag:#a45cff; --heal:#46e08a; --curse:#8a3ad0; --shield:#3ad0e0;
}

.arena-app .hpbar{display:flex; align-items:flex-end; gap:12px; margin:0 0 8px}
.arena-app .hp{flex:1; min-width:0}
.arena-app .hp .name{display:flex; align-items:baseline; gap:8px; margin-bottom:5px}
.arena-app .hp.right .name{flex-direction:row-reverse}
.arena-app .hp .name .nm{font-family:'Anton'; font-size:clamp(1rem,2.4vw,1.4rem); letter-spacing:1px; text-transform:uppercase;
  color:var(--bone); text-shadow:0 2px 0 #000; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:55%; min-width:0}
.arena-app .hp .name .cls{font-weight:700; font-size:.72rem; color:var(--gold); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; flex:0 1 auto}
.arena-app .hp .track{height:20px; background:linear-gradient(#1a0303,#0c0101); border:2px solid #000; border-radius:11px;
  position:relative; overflow:hidden; box-shadow:inset 0 0 14px rgba(0,0,0,.9), 0 0 0 1px rgba(255,196,77,.25)}
.arena-app .hp .fill{position:absolute; top:0; bottom:0; left:0; width:100%; border-radius:11px;
  background:linear-gradient(180deg,#ff7a7a 0%,#e23b2e 45%,#9a0a0a 100%);
  box-shadow:inset 0 2px 5px rgba(255,255,255,.4), inset 0 -3px 6px rgba(0,0,0,.35), 0 0 16px rgba(226,59,46,.55);
  transition:width .6s cubic-bezier(.22,.61,.36,1)}
.arena-app .hp .fill::after{content:''; position:absolute; left:0; right:0; top:2px; height:6px; border-radius:6px;
  background:linear-gradient(90deg, rgba(255,255,255,.45), rgba(255,255,255,.05)); opacity:.7}
.arena-app .hp.right .fill{left:auto; right:0}
.arena-app .hp .shieldfill{position:absolute; top:0; bottom:0; left:0; width:0; border-radius:11px;
  background:linear-gradient(180deg,#9af0ff,#3ad0e0 60%,#1a8a9a); opacity:.85; transition:width .5s cubic-bezier(.22,.61,.36,1)}
.arena-app .hp.right .shieldfill{left:auto; right:0}
.arena-app .hp .track .grid{display:none}
.arena-app .skull{width:30px;height:30px; flex:0 0 30px; align-self:center; margin-bottom:1px}
.arena-app .stage{position:relative; aspect-ratio:16/8.6; border-radius:6px; overflow:hidden; border:2px solid #000;
  box-shadow:0 22px 60px rgba(0,0,0,.7), inset 0 0 120px rgba(0,0,0,.8);
  background:radial-gradient(120% 90% at 50% 8%, rgba(255,157,46,.16), transparent 55%),
    radial-gradient(90% 70% at 50% 120%, rgba(154,10,10,.22), transparent 60%),
    linear-gradient(180deg,#241a12 0%, #1a130d 46%, #0e0a07 100%)}
.arena-app .stage svg.scene{position:absolute; inset:0; width:100%; height:100%}
.arena-app .fx, .arena-app .gore{position:absolute; inset:0; width:100%; height:100%; pointer-events:none}
.arena-app .gore{z-index:2}
.arena-app .fx{z-index:8}
.arena-app .stage.shake{animation:shk .3s}
.arena-app .stage.shake.big{animation:shk .5s}
@keyframes shk{0%,100%{transform:translate(0,0)}15%{transform:translate(-9px,5px)}30%{transform:translate(8px,-6px)}
  45%{transform:translate(-7px,-4px)}60%{transform:translate(6px,7px)}75%{transform:translate(-5px,3px)}90%{transform:translate(4px,-2px)}}
.arena-app .torch{position:absolute; width:16px; height:54px; z-index:3}
.arena-app .torch .stick{position:absolute; bottom:0; left:50%; width:7px; height:54px; margin-left:-3.5px; z-index:1;
  background:linear-gradient(#4a3420,#2a1d12 60%,#1c140c); border-radius:3px; box-shadow:0 2px 4px rgba(0,0,0,.5)}
.arena-app .torch .stick::after{content:''; position:absolute; top:-6px; left:50%; width:18px; height:9px; margin-left:-9px;
  background:linear-gradient(#5a4226,#2a1d12); border-radius:3px 3px 6px 6px; box-shadow:inset 0 1px 1px rgba(255,200,120,.2)}
/* свечение — мягкая пульсация */
.arena-app .torch .glow{position:absolute; top:-58px; left:50%; width:170px; height:170px; margin-left:-85px; z-index:0;
  background:radial-gradient(circle, rgba(255,150,50,.28), rgba(255,120,30,.10) 45%, transparent 68%);
  animation:torchGlow 3.2s ease-in-out infinite; will-change:opacity,transform}
/* внешнее пламя (ember) — поверх палки */
.arena-app .torch .flame{position:absolute; top:-30px; left:50%; width:30px; height:52px; margin-left:-15px; z-index:2;
  background:radial-gradient(ellipse at 50% 78%, #ffd070 0%, var(--torch) 40%, var(--ember) 68%, rgba(180,40,10,0) 78%);
  border-radius:50% 50% 48% 48%/62% 62% 40% 40%; transform-origin:50% 100%;
  animation:torchSway 2.6s ease-in-out infinite; filter:blur(.4px)}
/* внутреннее ядро (горячее) */
.arena-app .torch .flame::before{content:''; position:absolute; left:50%; bottom:2px; width:14px; height:30px; margin-left:-7px;
  background:radial-gradient(ellipse at 50% 80%, #fff3d0 0%, #ffd070 45%, rgba(255,170,60,0) 75%);
  border-radius:50% 50% 46% 46%/64% 64% 40% 40%; transform-origin:50% 100%;
  animation:torchCore 1.9s ease-in-out infinite}
.arena-app .torch.l1{left:6%; bottom:30%}
.arena-app .torch.l2{left:22%; bottom:42%}
.arena-app .torch.r1{right:6%; bottom:30%}
.arena-app .torch.r2{right:22%; bottom:42%}
.arena-app .torch.l2 .flame, .arena-app .torch.r1 .flame{animation-duration:2.9s}
.arena-app .torch.r2 .flame{animation-duration:2.4s}
.arena-app .torch.l2 .glow{animation-duration:3.6s}
@keyframes torchSway{
  0%,100%{transform:scaleY(1) scaleX(1) rotate(-2deg)}
  35%{transform:scaleY(1.08) scaleX(.95) rotate(1.5deg)}
  65%{transform:scaleY(1.04) scaleX(.97) rotate(-1deg)}}
@keyframes torchCore{0%,100%{transform:scaleY(1) translateY(0); opacity:.95}50%{transform:scaleY(1.12) translateY(-2px); opacity:1}}
@keyframes torchGlow{0%,100%{opacity:.85; transform:scale(1)}50%{opacity:1; transform:scale(1.07)}}
@keyframes flick{0%,100%{transform:scaleY(1) scaleX(1) rotate(-1deg); opacity:1}50%{transform:scaleY(1.14) scaleX(.9) rotate(2deg); opacity:.85}}
.arena-app .fighter{position:absolute; bottom:11%; z-index:4; text-align:center; display:flex; flex-direction:column; align-items:center; transition:transform .14s ease, filter .14s}
.arena-app .fighter.A{left:11%}
.arena-app .fighter.B{right:11%}
.arena-app .medallion{position:relative; width:clamp(100px,9vw,200px); height:clamp(100px,9vw,200px)}
.arena-app .medallion .ring{position:absolute; inset:-9px; border-radius:50%;
  background:conic-gradient(from 0deg,#6b5230,#caa45a,#5a4326,#caa45a,#6b5230); box-shadow:0 0 0 3px #000, 0 10px 26px rgba(0,0,0,.6)}
.arena-app .medallion .ava{position:absolute; inset:0; border-radius:50%; border:4px solid #1a130d; background:#1a130d; background-size:cover}
.arena-app .fighter .plate{margin-top:11px; font-family:'Anton'; font-size:clamp(1rem,1.3vw,1.5rem); letter-spacing:1px; color:var(--bone); text-transform:uppercase; text-shadow:0 2px 0 #000}
.arena-app .fighter .pcls{font-weight:700; font-size:.74rem; color:var(--gold); margin-top:2px; text-transform:uppercase; letter-spacing:1px}
.arena-app .fighter .shadow{position:absolute; left:50%; bottom:-14px; width:80%; height:18px; margin-left:-40%;
  background:radial-gradient(closest-side, rgba(0,0,0,.65), transparent); z-index:-1}
.arena-app .fighter.hurt{animation:hurt .3s}
@keyframes hurt{0%,100%{filter:none}40%{filter:brightness(2.4)}}
.arena-app .fighter.dead{transition:transform .7s, opacity .7s; transform:translateY(34px) rotate(-16deg); opacity:.25; filter:grayscale(.7) brightness(.5)}
.arena-app .fxrow{position:absolute; left:50%; top:-26px; transform:translateX(-50%); display:flex; gap:5px; z-index:6}
.arena-app .fxbadge{font-weight:700; font-size:.66rem; padding:2px 6px; border-radius:10px; border:1px solid #000; color:#fff;
  display:flex; align-items:center; gap:2px; box-shadow:0 2px 6px rgba(0,0,0,.5)}
.arena-app .fxbadge.shield{background:#1a8a9a}
.arena-app .fxbadge.power{background:#b03a3a}
.arena-app .fxbadge.regen{background:#1f8a4a}
.arena-app .fxbadge.curse{background:#6a2aa0}
.arena-app .fxbadge.weak{background:#555}
.arena-app /* транзиентные SVG-эффекты/оружие */
.spawned{position:absolute; pointer-events:none}
.arena-app .weap{z-index:6; transform-origin:50% 85%}
.arena-app .efx{z-index:7}
@keyframes spin360{to{transform:rotate(360deg)}}
@keyframes swExpand{0%{transform:scale(.2);opacity:.95}100%{transform:scale(1.7);opacity:0}}
@keyframes sparkOut{0%{transform:scale(.3) rotate(var(--rr,0deg));opacity:1}100%{transform:scale(1.5) rotate(var(--rr,0deg));opacity:0}}
@keyframes slashIn{0%{opacity:0;transform:scale(.5) rotate(var(--rr,0deg))}25%{opacity:1}100%{opacity:0;transform:scale(1.2) rotate(var(--rr,0deg))}}
@keyframes riseFade{0%{opacity:0;transform:translateY(10px) scale(.6)}25%{opacity:1}100%{opacity:0;transform:translateY(-70px) scale(1)}}
@keyframes descend{0%{opacity:0;transform:translateY(-50px) scale(.6)}40%{opacity:.95;transform:translateY(0) scale(1)}100%{opacity:.8;transform:translateY(8px) scale(1.05)}}
@keyframes pulseFade{0%{transform:scale(.4);opacity:0}35%{transform:scale(1.1);opacity:1}100%{transform:scale(1.25);opacity:0}}
.arena-app /* idle-дыхание во время отсчёта */
.fighter.idle .medallion{animation:breathe 2.4s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-6px) scale(1.02)}}
.arena-app /* имя приёма над головой */
.skillname{position:absolute; z-index:12; pointer-events:none; font-family:'Anton'; text-transform:uppercase;
  letter-spacing:1px; text-align:center; white-space:nowrap; text-shadow:2px 2px 0 #000,-1px -1px 0 #000,0 0 18px rgba(0,0,0,.9);
  font-size:clamp(1.1rem,2.6vw,1.8rem)}
.minilabel{position:absolute; z-index:12; pointer-events:none; font-family:'Anton'; text-transform:uppercase;
  letter-spacing:1px; text-align:center; white-space:nowrap; color:#fff;
  text-shadow:2px 2px 0 #000,-1px -1px 0 #000,0 0 14px rgba(0,0,0,.85);
  font-size:clamp(.85rem,2vw,1.25rem)}
.minilabel.miss{color:#eaf0ff; text-shadow:2px 2px 0 #000,-1px -1px 0 #000,0 0 16px rgba(120,170,255,.95)}
.minilabel.block{color:#9af2ff; text-shadow:2px 2px 0 #000,-1px -1px 0 #000,0 0 16px rgba(58,208,224,.95)}
.minilabel.heal{color:var(--heal); text-shadow:2px 2px 0 #000,-1px -1px 0 #000,0 0 16px rgba(120,230,140,.9)}
.arena-app /* сфера щита вокруг иконки */
.shieldorb{position:absolute; z-index:5; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle at 40% 35%, rgba(255,220,120,.4), rgba(255,196,77,.12) 55%, transparent 72%);
  border:2px solid rgba(255,210,90,.6); box-shadow:0 0 30px rgba(255,196,77,.5), inset 0 0 24px rgba(255,220,120,.4); animation:shorb 1.5s ease-out}
@keyframes shorb{0%{transform:scale(.3);opacity:0}25%{transform:scale(1.18);opacity:1}45%{transform:scale(.95)}100%{transform:scale(1.05);opacity:.85}}
/* энергия вверх (ярость/аура) */
@keyframes flameUp{0%{opacity:0;transform:translateY(0) scaleY(.5)}25%{opacity:1}100%{opacity:0;transform:translateY(-60px) scaleY(1.4)}}
@keyframes coinFall{0%{opacity:0;transform:translateY(-40px) rotate(0)}15%{opacity:1}100%{opacity:1;transform:translateY(var(--fall,200px)) rotate(var(--spin,180deg))}}
@keyframes fatDrop{0%{transform:translateY(var(--from,-520px))}70%{transform:translateY(0)}82%{transform:translateY(-22px)}100%{transform:translateY(0)}}
@keyframes coinDrop{0%{opacity:0;transform:translateY(var(--from,-560px)) rotate(0)}10%{opacity:1}100%{opacity:1;transform:translateY(0) rotate(var(--spin,180deg))}}
.shake-fear{animation:fear .8s ease-in-out infinite}
@keyframes fear{0%,100%{transform:translate(0,0) rotate(0)}25%{transform:translate(-2px,1px) rotate(-1deg)}50%{transform:translate(2px,-1px) rotate(1deg)}75%{transform:translate(-1px,1px) rotate(-.6deg)}}
@keyframes glitchy{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}50%{transform:translateX(5px)}75%{transform:translateX(-3px)}}
.arena-app /* всплывающий текст */
.shout{position:absolute; z-index:9; pointer-events:none; text-align:center; font-family:'Anton';
  text-transform:uppercase; letter-spacing:1px; opacity:0; line-height:.95;
  text-shadow:2px 2px 0 #000, -1px -1px 0 #000, 0 0 18px rgba(0,0,0,.9)}
.arena-app .shout .big{display:block; font-size:clamp(1rem,2.5vw,1.7rem); color:var(--bone)}
.arena-app .shout .crit{color:var(--gold); text-shadow:2px 2px 0 #000,0 0 26px rgba(255,196,77,.9)}
.arena-app .shout .miss{color:#eaf0ff; font-size:clamp(1.15rem,3vw,2rem); font-weight:700; text-shadow:2px 2px 0 #000,-1px -1px 0 #000,0 0 22px rgba(120,170,255,1)}
.arena-app .shout .block{color:#7fe9ff; text-shadow:2px 2px 0 #000,0 0 24px rgba(58,208,224,.9)}
.arena-app .shout .heal{color:var(--heal)}
.arena-app .shout .curse{color:#c79aff}
.arena-app .shout .mag{color:#c79aff}
.arena-app .shout.go{animation:shoutA 1.43s ease-out forwards}
@keyframes shoutA{0%{opacity:0; transform:translateY(8px) scale(.6)}14%{opacity:1; transform:translateY(-6px) scale(1.12)}
  80%{opacity:1; transform:translateY(-22px) scale(1)}100%{opacity:0; transform:translateY(-54px) scale(.96)}}
.arena-app .banner{position:absolute; inset:0; z-index:11; display:flex; align-items:center; justify-content:flex-start; flex-direction:column; padding-top:2%; pointer-events:none}
.arena-app .banner .word{font-family:'Anton'; text-transform:uppercase; letter-spacing:2px; text-align:center; color:var(--bone); text-shadow:3px 3px 0 #000, 0 0 40px rgba(0,0,0,.8)}
.arena-app .count .word{font-size:clamp(4rem,16vw,11rem); color:var(--blood-b); text-shadow:4px 4px 0 #000, 0 0 60px rgba(209,20,20,.7)}
@keyframes cnt{0%{opacity:0; transform:scale(2.4)}30%{opacity:1; transform:scale(1)}100%{opacity:0; transform:scale(.6)}}
.arena-app .cry .word{font-size:clamp(1.6rem,5.5vw,3.6rem); color:var(--gold); max-width:90%; line-height:1.05; text-shadow:3px 3px 0 #000,0 0 50px rgba(255,196,77,.7)}
.arena-app .fightb .word{font-size:clamp(1.6rem,6vw,4rem); color:var(--blood-b); text-shadow:4px 4px 0 #000,0 0 70px rgba(209,20,20,.9); letter-spacing:6px}
@keyframes popA{0%{opacity:0;transform:scale(.2) rotate(-6deg)}40%{opacity:1;transform:scale(1.13) rotate(2deg)}100%{transform:scale(1)}}
@keyframes revealBig{0%{opacity:0;transform:scale(1.5);letter-spacing:26px;filter:blur(10px)}55%{opacity:1;filter:blur(0)}100%{opacity:1;transform:scale(1);letter-spacing:6px}}
@keyframes revealSoft{0%{opacity:0;transform:translateY(16px) scale(.92);filter:blur(6px)}60%{opacity:1;filter:blur(0)}100%{opacity:1;transform:translateY(0) scale(1)}}
.arena-app .finish .word{font-size:clamp(2.6rem,9vw,6.5rem); color:var(--danger); text-shadow:3px 3px 0 #000,0 0 50px rgba(224,35,41,.9)}
@keyframes fpA{0%,100%{transform:scale(1); filter:brightness(1)}50%{transform:scale(1.07); filter:brightness(1.5)}}
.arena-app .fatname .word{font-size:clamp(1.7rem,6vw,4.2rem); color:var(--gold); text-shadow:3px 3px 0 #000,0 0 50px rgba(255,196,77,.8)}
.arena-app .fatname .sub{font-weight:700; letter-spacing:4px; font-size:.8rem; color:var(--bone-d); margin-top:14px; text-transform:uppercase}
.arena-app .flash{position:absolute; inset:0; z-index:10; background:var(--blood-b); opacity:0; pointer-events:none}
.arena-app .flash.go{animation:flA .35s ease-out}
.arena-app .flash.white.go{animation:flwA .3s ease-out}
@keyframes flA{0%{opacity:.5}100%{opacity:0}}
@keyframes flwA{0%{opacity:.85; background:#fff}100%{opacity:0; background:#fff}}
.arena-app .caster{margin:10px 0 0; min-height:30px; text-align:center; font-weight:600; font-size:1.02rem; color:var(--bone);
  display:flex; align-items:center; justify-content:center; gap:9px}
.arena-app .caster .g{font-size:1.4rem}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001s!important}}

/* ── КНОПКИ СОХРАНЕНИЯ (в шапке) ── */
.save-row{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:14px; }
.download-btn{ background:linear-gradient(135deg,#7a5a16,#c9a24a); color:#1a1008; border:2px solid #caa44d;
  padding:11px 22px; border-radius:8px; cursor:pointer; font-family:'Cinzel',serif; font-weight:700;
  font-size:0.92rem; letter-spacing:1px; transition:0.25s; }
.download-btn:hover:not(:disabled){ background:linear-gradient(135deg,#9a7420,#f0d080); box-shadow:0 0 22px rgba(201,162,74,0.5); transform:translateY(-2px); }
.download-btn.off, .download-btn:disabled{ opacity:0.45; cursor:not-allowed; filter:grayscale(.4); }

/* ── КАРТОЧКА-ПОСТЕР (киноплакат фаталити) ── */
.result-wrap{ display:none; }
.result-overlay{ position:absolute; inset:0; z-index:14; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(120% 100% at 50% 40%, rgba(0,0,0,.55), rgba(0,0,0,.94)); padding:1.5% 2%; }
.result-card.po{ position:relative; height:97%; aspect-ratio:2/3; max-width:94%; overflow:hidden; border-radius:10px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:clamp(8px,1.6vw,16px) clamp(10px,2vw,20px) clamp(6px,1.2vw,12px);
  background:
    radial-gradient(80% 42% at 50% 30%, rgba(120,16,12,.4), transparent 70%),
    linear-gradient(180deg,#1a0d09 0%,#0e0807 55%,#070403 100%);
  border:1px solid #3a241a; box-shadow:0 30px 90px rgba(0,0,0,.85), inset 0 0 80px rgba(0,0,0,.7); color:#e9dcc4; }
.po-spot{ position:absolute; left:50%; top:-12%; width:80%; height:60%; transform:translateX(-50%);
  background:radial-gradient(closest-side, rgba(255,210,120,.16), transparent 75%); pointer-events:none; }
.po-present{ position:relative; font-family:'Cormorant','Cinzel',serif; font-style:italic; letter-spacing:2px;
  font-size:clamp(.6rem,1.6vw,.82rem); color:#c9a86a; opacity:.85; margin-bottom:2px; }

/* сцена казни */
.po-scene{ position:relative; width:100%; flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center; }
.po-blood{ position:absolute; left:8%; top:8%; width:84%; height:84%; opacity:.5; mix-blend-mode:screen; filter:blur(.4px); pointer-events:none; }
.po-win{ position:absolute; top:6%; left:50%; transform:translateX(-50%);
  width:clamp(96px,40%,150px); aspect-ratio:1; border-radius:50%; background-size:cover; background-position:center;
  border:5px solid var(--gold); z-index:2; }
.po-lose{ position:absolute; bottom:6%; left:50%; transform:translateX(-50%) rotate(-9deg);
  width:clamp(64px,28%,104px); aspect-ratio:1; border-radius:50%; background-size:cover; background-position:center;
  border:3px solid #5a4226; filter:grayscale(.85) brightness(.5); z-index:1; }
.po-emblem{ position:absolute; bottom:2%; left:50%; transform:translateX(-50%);
  font-size:clamp(2.4rem,9vw,4rem); z-index:3; filter:drop-shadow(0 3px 6px rgba(0,0,0,.8)); }

.po-tagline{ position:relative; font-family:'Cormorant','Oswald',serif; font-style:italic;
  font-size:clamp(.78rem,2.4vw,1.06rem); color:#d9b36a; margin:clamp(4px,1vw,10px) 0 clamp(2px,.6vw,6px); }
/* название-фаталити как тайтл фильма (без background-clip — чтобы PNG не ломался) */
.po-title{ position:relative; font-family:'Anton','Cinzel',serif; text-transform:uppercase; line-height:.92;
  font-size:clamp(1.6rem,7vw,3.1rem); letter-spacing:1px; color:#f4e6c2;
  text-shadow:0 2px 0 #000, 0 0 1px #000, -2px 0 #2a0a08, 2px 0 #2a0a08, 0 0 26px rgba(224,35,41,.55);
  padding:0 4px; }
.po-credits{ position:relative; font-family:'Oswald','Exo 2',sans-serif; text-transform:uppercase; letter-spacing:1px;
  font-size:clamp(.5rem,1.5vw,.66rem); color:#b7a888; line-height:1.5; margin-top:clamp(6px,1.4vw,12px); }
.po-credits b{ color:#e9dcc4; font-weight:700; }
.po-foot{ position:relative; width:100%; display:flex; justify-content:space-between; align-items:center; gap:6px;
  margin-top:clamp(6px,1.2vw,10px); padding-top:7px; border-top:1px solid rgba(201,162,74,.22);
  font-family:'Orbitron',sans-serif; letter-spacing:1px; font-size:clamp(.46rem,1.3vw,.6rem); color:#a98f5a; }
.po-rated{ border:1px solid #a98f5a; border-radius:3px; padding:2px 6px; color:#d9b36a; }

/* ════════ НОВЫЕ ФАТАЛИТИ ════════ */
.arena-app .morph-emoji{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; text-align:center;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.6)); will-change:transform; }
.arena-app .puddle{ width:100%; height:100%; border-radius:50%;
  background:radial-gradient(circle at 50% 38%, #ffe27a, #e0a81e 72%); box-shadow:inset 0 4px 10px rgba(0,0,0,.35); }

/* свернули окно */
.arena-app .wintb{ z-index:13; display:flex; align-items:center; justify-content:space-between; gap:8px;
  background:linear-gradient(180deg,#2b2f3a,#1b1f28); border:1px solid #000; border-radius:5px 5px 0 0; padding:0 7px;
  font-family:'Exo 2',sans-serif; color:#cfd6e4; box-shadow:0 6px 16px rgba(0,0,0,.5); }
.arena-app .wintb .tb-title{ font-size:.74rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.arena-app .wintb .tb-btns{ display:flex; gap:5px; }
.arena-app .wintb .tb-btns i{ font-style:normal; font-size:.66rem; width:17px; height:17px; line-height:17px; text-align:center; border-radius:2px; }
.arena-app .wintb .tb-x.hit{ background:#e02329; color:#fff; box-shadow:0 0 10px rgba(224,35,41,.7); }

/* ушёл в оффлайн */
.arena-app .statuschip{ z-index:13; display:flex; align-items:center; justify-content:center; gap:7px;
  font-family:'Exo 2',sans-serif; font-size:.74rem; color:#9aa0b0; text-shadow:0 1px 2px #000; }
.arena-app .statuschip .sdot{ width:11px; height:11px; border-radius:50%; background:#5a5a5a; box-shadow:0 0 0 2px rgba(0,0,0,.4); transition:background .5s,box-shadow .5s; }
.arena-app .statuschip .sdot.online{ background:#57d957; box-shadow:0 0 9px #57d957; }

/* разобран на DLC */
.arena-app .dlcchip{ z-index:13; display:flex; align-items:center; justify-content:center; }
.arena-app .dlcchip span{ font-family:'Anton',sans-serif; letter-spacing:1px; font-size:.74rem; color:#1a1008; white-space:nowrap;
  background:linear-gradient(135deg,#f0d080,#c9a24a); border:1px solid #6b5320; border-radius:4px; padding:3px 9px; box-shadow:0 3px 8px rgba(0,0,0,.4); }

/* блокировка по региону */
.arena-app .regionsign{ z-index:13; }
.arena-app .regionsign .rs-glass{ position:absolute; inset:0; background:rgba(120,140,170,.18);
  border:1px solid rgba(255,255,255,.14); border-radius:10px; -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
.arena-app .regionsign .rs-text{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-family:'Anton',sans-serif; letter-spacing:1px; color:#e7d8c0; text-align:center; font-size:.72rem; text-shadow:0 2px 3px #000; }
.arena-app .regionsign .rs-text b{ color:#e02329; font-size:1.05rem; margin-top:3px; }

/* разрыв соединения */
.arena-app .pixbit{ z-index:12; background:#5fc85f; border-radius:1px; }
.arena-app .medallion.glitch{ animation:glitchRGB .1s steps(2) infinite; }
@keyframes glitchRGB{
  0%{ transform:translate(0,0); filter:none; }
  25%{ transform:translate(-4px,1px); filter:hue-rotate(70deg) saturate(2); }
  50%{ transform:translate(4px,-1px); filter:hue-rotate(-70deg) saturate(2); }
  75%{ transform:translate(-2px,2px); filter:contrast(1.7); }
  100%{ transform:translate(2px,0); filter:none; }
}

/* ── свернули окно: подсветка кнопки «свернуть» ── */
.arena-app .wintb .tb-min.hit{ background:#3aa0e0; color:#fff; box-shadow:0 0 10px rgba(58,160,224,.7); }

/* ── разобран на DLC: ярлык base game остаётся ── */
.arena-app .basegame{ z-index:13; display:flex; align-items:center; justify-content:center;
  font-family:'Oswald',sans-serif; font-weight:700; font-size:.74rem; letter-spacing:.5px; color:#cdd3df;
  text-transform:lowercase; text-shadow:0 1px 2px #000; }

/* ── капча ── */
.arena-app .capbox{ z-index:14; background:#f4f6fb; color:#2a2f3a; border:1px solid #c4ccdb; border-radius:8px;
  box-shadow:0 10px 26px rgba(0,0,0,.5); padding:8px 9px; display:flex; flex-direction:column; gap:6px; overflow:hidden; }
.arena-app .cap-head{ display:flex; align-items:center; gap:7px; font-family:'Exo 2',sans-serif; font-size:.7rem; font-weight:700; }
.arena-app .cap-check{ display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px;
  border:2px solid #4a8; border-radius:3px; font-size:.8rem; color:#1a8f4a; }
.arena-app .cap-check.fail{ border-color:#e02329; color:#e02329; }
.arena-app .cap-task{ font-family:'Exo 2',sans-serif; font-size:.6rem; color:#5a6275; }
.arena-app .cap-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:3px; }
.arena-app .cap-grid i{ font-style:normal; display:flex; align-items:center; justify-content:center; aspect-ratio:1;
  background:#dfe5f0; border-radius:3px; font-size:1.1rem; }
.arena-app .cap-deny{ display:none; text-align:center; font-family:'Anton',sans-serif; letter-spacing:1px; color:#fff;
  background:#e02329; border-radius:4px; padding:3px; font-size:.78rem; }
.arena-app .cap-deny.show{ display:block; }

/* ── лутбокс ── */
.arena-app .lootcase{ z-index:13; display:flex; align-items:center; justify-content:center; }
.arena-app .lootcase .lc-case{ font-size:2.4rem; filter:drop-shadow(0 4px 8px rgba(0,0,0,.6)); }
.arena-app .lootroul{ z-index:14; overflow:hidden; border:2px solid #c9a24a; border-radius:6px; background:#0c0805;
  box-shadow:0 6px 16px rgba(0,0,0,.6); }
.arena-app .lootroul .lr-strip{ display:flex; height:100%; }
.arena-app .lootroul .lr-strip span{ flex:0 0 28px; height:100%; }
.arena-app .lootroul .lr-marker{ position:absolute; left:50%; top:0; width:3px; height:100%; background:#fff;
  box-shadow:0 0 8px #fff; transform:translateX(-50%); }
.arena-app .loottag{ z-index:14; display:flex; align-items:center; justify-content:center;
  font-family:'Oswald',sans-serif; font-weight:700; font-size:.78rem; color:#1a1008;
  background:linear-gradient(135deg,#f0d080,#c9a24a); border:1px solid #6b5320; border-radius:4px;
  box-shadow:0 3px 8px rgba(0,0,0,.4); }

/* ── сигнатурки новых классов ── */
.arena-app .wh-box{ width:100%; height:100%; border:2px solid #e02329; border-radius:4px;
  box-shadow:0 0 14px rgba(224,35,41,.6), inset 0 0 14px rgba(224,35,41,.3); position:relative; }
.arena-app .wh-box::before, .arena-app .wh-box::after{ content:''; position:absolute; background:#e02329; }
.arena-app .wh-box::before{ left:50%; top:-6px; width:1px; height:calc(100% + 12px); transform:translateX(-50%); opacity:.7; }
.arena-app .wh-box::after{ top:50%; left:-6px; height:1px; width:calc(100% + 12px); transform:translateY(-50%); opacity:.7; }
.arena-app .flashbang{ width:100%; height:100%; border-radius:50%;
  background:radial-gradient(circle at 40% 35%, #fff, #b9c4d2 55%, #6b7585); box-shadow:0 0 6px rgba(255,255,255,.6); }

/* ── уникальные пропы навыков ── */
.arena-app .coin-fx{ width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font:700 15px Orbitron,monospace; color:#3a2a00; background:radial-gradient(circle at 40% 35%,#ffe89a,#f0c040 60%,#b8860b); border-radius:50%; box-shadow:0 0 6px rgba(240,200,80,.7); }
.arena-app .review-stamp{ width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font:900 22px Anton,Oswald,sans-serif; letter-spacing:1px; color:#e02329; border:3px solid #e02329; border-radius:6px;
  background:rgba(224,35,41,.08); text-shadow:0 0 6px rgba(224,35,41,.5); }
.arena-app .plat-badge{ width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font-size:36px; color:#e8eef5; text-shadow:0 0 12px #cfe0f0,0 0 4px #fff; filter:drop-shadow(0 0 6px #aebccf); }
.arena-app .chat-bubble{ display:flex; align-items:center; justify-content:center; padding:2px 8px;
  font:700 12px Oswald,sans-serif; color:#eaf2ff; background:rgba(40,70,110,.9); border:1px solid #5aa0e0; border-radius:11px; white-space:nowrap; box-shadow:0 0 6px rgba(58,160,224,.5); }
.arena-app .ach-wall{ width:100%; height:100%; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,1fr); gap:6%; padding:4%; box-sizing:border-box; }
.arena-app .ach-wall i{ background:radial-gradient(circle at 40% 35%,#ffe9a0,#f0c040 60%,#9a7416); border-radius:5px; box-shadow:0 0 5px rgba(240,200,80,.6), inset 0 0 4px rgba(255,255,255,.4); }
.arena-app .tut-tip{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:2px 8px;
  font:600 12px Oswald,sans-serif; color:#dce8ff; background:rgba(30,50,80,.92); border:1px dashed #8fb6ff; border-radius:6px; white-space:nowrap; }
.arena-app .sale-tag{ width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font:900 20px Anton,sans-serif; color:#0a2a0a; background:linear-gradient(135deg,#7af07a,#3aa83a); border-radius:6px; transform:rotate(-6deg); box-shadow:0 3px 8px rgba(0,0,0,.4); }
.arena-app .clock-fx,.arena-app .die-fx,.arena-app .pad-fx{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.arena-app .clock-fx{ font-size:42px; } .arena-app .die-fx{ font-size:26px; } .arena-app .pad-fx{ font-size:22px; }
.arena-app .card-fx{ width:100%; height:100%; border-radius:3px; background:linear-gradient(135deg,#2a3f6a,#1b2842); border:1.5px solid #5fc85f; box-shadow:0 0 5px rgba(95,200,95,.6); }
.arena-app .cross-fx{ width:100%; height:100%; border:2px solid #8a9bb0; border-radius:50%; position:relative; box-shadow:0 0 8px rgba(138,155,176,.7); }
.arena-app .cross-fx::before,.arena-app .cross-fx::after{ content:''; position:absolute; background:#cfd6e4; }
.arena-app .cross-fx::before{ left:50%; top:-8px; width:1.5px; height:calc(100% + 16px); transform:translateX(-50%); }
.arena-app .cross-fx::after{ top:50%; left:-8px; height:1.5px; width:calc(100% + 16px); transform:translateY(-50%); }

/* ── пропы новых фаталити ── */
.arena-app .bsod{ background:#0a4fc4; color:#dce8ff; border-radius:6px; padding:10px 14px; box-sizing:border-box;
  display:flex; flex-direction:column; gap:6px; font:500 12px Oswald,sans-serif; box-shadow:0 0 24px rgba(10,79,196,.6); }
.arena-app .bsod-face{ font:700 40px Consolas,monospace; line-height:1; }
.arena-app .bsod-txt{ opacity:.92; line-height:1.3; } .arena-app .bsod-pct{ margin-top:4px; font-weight:700; } .arena-app .bsod-code{ opacity:.6; font:11px Consolas,monospace; }
.arena-app .review-card{ display:flex; align-items:center; gap:5px; padding:2px 8px; white-space:nowrap;
  font:700 11px Oswald,sans-serif; color:#fff; background:rgba(150,20,20,.95); border:1px solid #e02329; border-radius:4px; box-shadow:0 0 6px rgba(224,35,41,.5); }
.arena-app .rc-thumb{ font-size:14px; }
.arena-app .ach-toast{ display:flex; align-items:center; gap:10px; padding:8px 12px;
  background:linear-gradient(180deg,#3a4350,#1b2129); border:1px solid #5a6a78; border-left:3px solid #ffd24a; border-radius:6px; box-shadow:0 4px 14px rgba(0,0,0,.5); }
.arena-app .at-ico{ font-size:26px; } .arena-app .at-h{ font:700 12px Oswald,sans-serif; color:#ffd24a; } .arena-app .at-n{ font:600 11px Oswald,sans-serif; color:#cfe0f0; }
.arena-app .shader-box,.arena-app .disk-box{ background:rgba(15,20,28,.95); border:1px solid #3a4350; border-radius:6px; padding:8px 10px; box-sizing:border-box;
  display:flex; flex-direction:column; gap:6px; font:600 11px Oswald,sans-serif; color:#cfe0f0; box-shadow:0 0 14px rgba(0,0,0,.5); }
.arena-app .sh-bar,.arena-app .db-bar{ height:8px; background:#1b222c; border-radius:4px; overflow:hidden; }
.arena-app .sh-bar i,.arena-app .db-bar i{ display:block; height:100%; width:0; background:linear-gradient(90deg,#3aa0e0,#5fc8ff); transition:width .3s; }
.arena-app .db-bar.full i{ background:linear-gradient(90deg,#e0552a,#ff6a3a); }
.arena-app .sh-cnt,.arena-app .db-kb{ opacity:.7; font-size:10px; }
.arena-app .missing-tex{ background-image:linear-gradient(45deg,#d800d8 25%,#000 25%,#000 50%,#d800d8 50%,#d800d8 75%,#000 75%); background-size:24px 24px; }
.arena-app .tex-lbl{ display:flex; align-items:center; justify-content:center; font:700 13px Consolas,monospace; color:#ff4dff; text-shadow:0 0 6px #d800d8; }
.arena-app .temp-lbl .tl{ display:flex; align-items:center; justify-content:center; font:800 18px Anton,sans-serif; color:#ff6a2a; text-shadow:0 0 8px rgba(255,106,42,.7); }
.arena-app .maint-box{ display:flex; flex-direction:column; align-items:center; gap:6px; padding:10px; box-sizing:border-box;
  background:rgba(20,18,12,.95); border:2px dashed #e0a93a; border-radius:8px; }
.arena-app .mt-ico{ font-size:30px; } .arena-app .mt-txt{ font:700 12px Oswald,sans-serif; color:#ffce6b; text-align:center; line-height:1.25; }
.arena-app .ea-stamp{ display:flex; align-items:center; justify-content:center; transform:rotate(-8deg);
  font:900 17px Anton,sans-serif; letter-spacing:1px; color:#ffce3a; border:3px solid #ffce3a; border-radius:6px; background:rgba(120,90,0,.2); text-shadow:0 0 6px rgba(255,206,58,.5); }
.arena-app .gp-box{ display:flex; flex-direction:column; align-items:center; gap:4px; }
.arena-app .gp-ico{ font-size:26px; } .arena-app .gp-txt{ font:600 11px Oswald,sans-serif; color:#cfe0f0; }
.arena-app .gp-bat{ width:42px; height:16px; border:2px solid #cfe0f0; border-radius:3px; position:relative; opacity:.5; transition:opacity .15s; }
.arena-app .gp-bat::after{ content:''; position:absolute; right:-5px; top:4px; width:3px; height:6px; background:#cfe0f0; border-radius:0 2px 2px 0; }
.arena-app .gp-bat.blink{ opacity:1; box-shadow:0 0 8px #ff4d4d; border-color:#ff4d4d; }
.arena-app .fw-box{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px; box-sizing:border-box;
  background:rgba(15,20,28,.95); border:1px solid #3aa0e0; border-radius:6px; }
.arena-app .fw-txt{ font:700 12px Oswald,sans-serif; color:#5fc8ff; letter-spacing:1px; } .arena-app .fw-time{ font:900 22px Anton,sans-serif; color:#fff; } .arena-app .fw-sub{ font:11px Oswald,sans-serif; color:#9ab; }
.arena-app .mod-err{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 10px; box-sizing:border-box;
  background:rgba(40,15,15,.95); border:1px solid #e0a93a; border-radius:6px; }
.arena-app .me-h{ font:700 12px Oswald,sans-serif; color:#ffce6b; } .arena-app .me-l{ font:11px Consolas,monospace; color:#ff9a6b; }
.arena-app .mod-tag{ display:flex; align-items:center; justify-content:center; font-size:18px; }
.arena-app .fw-time.zero{ color:#ff5a4a; text-shadow:0 0 8px rgba(255,90,74,.6); }
.arena-app .fw-lock{ display:flex; align-items:center; justify-content:center; font-size:42px; filter:drop-shadow(0 0 8px rgba(0,0,0,.6)); }

/* ── пропы игро-навыков (батч 1) ── */
.arena-app .gs-emoji{ display:flex; align-items:center; justify-content:center; font-size:clamp(20px,4vw,40px); }
.arena-app .c4-fx{ display:flex; align-items:center; gap:5px; padding:3px 6px; background:#1c2230; border:1px solid #555; border-radius:4px; box-shadow:0 0 8px rgba(0,0,0,.5); }
.arena-app .c4-led{ width:8px; height:8px; border-radius:50%; background:#3a0a0a; }
.arena-app .c4-led.beep{ background:#ff2020; box-shadow:0 0 8px #ff2020; }
.arena-app .c4-num{ font:800 18px Orbitron,monospace; color:#ff4040; }
.arena-app .ult-meter{ height:14px; background:#1b222c; border:1px solid #f0a030; border-radius:7px; overflow:hidden; box-shadow:0 0 8px rgba(240,160,48,.4); }
.arena-app .ult-meter i{ display:block; height:100%; width:0; background:linear-gradient(90deg,#f0a030,#ffd86b); }
.arena-app .tank-fx{ filter:drop-shadow(0 0 14px rgba(192,57,43,.7)); }
.arena-app .beacon-fx{ border-radius:50%; background:#3aa0e0; box-shadow:0 0 14px #3aa0e0; }
.arena-app .zed-ov,.arena-app .dark-ov{ border-radius:50%; pointer-events:none; }
.arena-app .zed-ov{ background:radial-gradient(circle,rgba(150,160,176,.35),transparent 70%); }
.arena-app .dark-ov{ background:radial-gradient(circle,rgba(0,0,0,.72),transparent 72%); }
.arena-app .deck-card{ border-radius:4px; background:linear-gradient(135deg,#2a2f6a,#181c40); border:1.5px solid #9a7cff; box-shadow:0 0 8px rgba(154,124,255,.6); }
.arena-app .rapier-fx{ border-radius:2px; background:linear-gradient(180deg,#fff,#ffd24a); box-shadow:0 0 14px #ffd24a; }
.arena-app .breach-fx{ border-radius:3px; background:#e08a2a; box-shadow:0 0 10px #e08a2a; }

.arena-app .breach-wall{ background:repeating-linear-gradient(0deg,#6a6a72,#6a6a72 9px,#565660 9px,#565660 11px); border:2px solid #3a3a40; border-radius:3px; position:relative; box-shadow:0 0 10px rgba(0,0,0,.4); }
.arena-app .breach-wall .bw-charge{ position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); width:18px; height:14px; background:#c0392b; border-radius:2px; box-shadow:0 0 8px #c0392b; }
.arena-app .breach-wall .bw-charge::after{ content:''; position:absolute; right:3px; top:4px; width:5px; height:5px; border-radius:50%; background:#ffce3a; box-shadow:0 0 6px #ffce3a; }
.arena-app .breach-wall.breached{ -webkit-mask:radial-gradient(circle at 50% 50%, transparent 0 36%, #000 41%); mask:radial-gradient(circle at 50% 50%, transparent 0 36%, #000 41%); }
.arena-app .hunger-bar{ height:12px; background:#2a1f2a; border:1px solid #6a4a7a; border-radius:6px; overflow:hidden; }
.arena-app .hunger-bar i{ display:block; height:100%; width:100%; background:linear-gradient(90deg,#8a5aa0,#5a3a6a); transition:width .8s; }
.arena-app .conveyor{ display:flex; gap:8px; align-items:center; justify-content:center; height:14px; background:#1b2a38; border:1px solid #3aa0e0; border-radius:4px; overflow:hidden; }
.arena-app .conveyor i{ width:10px; height:8px; background:#5fc8ff; border-radius:2px; box-shadow:0 0 5px #3aa0e0; }
.arena-app .traffic{ display:flex; align-items:center; justify-content:center; font-size:18px; letter-spacing:2px; }
.arena-app .water-fx{ border-radius:50% 50% 8px 8px / 30% 30% 8px 8px; background:linear-gradient(180deg,rgba(58,138,208,.5),rgba(20,60,110,.7)); box-shadow:0 0 18px rgba(58,138,208,.5); border-top:2px solid rgba(180,225,255,.6); }
.arena-app .sande-ov{ border-radius:50%; background:radial-gradient(circle,rgba(255,58,106,.18),transparent 70%); }
.arena-app .totem-fx{ background:linear-gradient(180deg,#8a6ad0,#4a3a6a); border-radius:3px; box-shadow:0 0 8px rgba(138,106,208,.6); }
.arena-app .shout-cone{ background:radial-gradient(ellipse at 0% 50%,rgba(154,208,255,.5),transparent 70%); border-radius:50%; }
.arena-app .vats-ov{ border-radius:50%; border:2px solid #5fff7a; background:radial-gradient(circle,transparent 55%,rgba(95,255,122,.12)); box-shadow:0 0 12px rgba(95,255,122,.4); }
.arena-app .d20-fx{ display:flex; align-items:center; justify-content:center; font:800 17px Orbitron,monospace; color:#dcdcff; background:#2a2a4a; border:2px solid #9a7cff; border-radius:5px; box-shadow:0 0 8px rgba(154,124,255,.6); }
.arena-app .d20-fx.nat20{ color:#1a1a0a; background:#ffd24a; border-color:#fff; box-shadow:0 0 14px #ffd24a; }
.arena-app .d20-fx.nat1{ color:#fff; background:#a01818; border-color:#ff5a4a; }
.arena-app .arrow-fx{ border-radius:1px; box-shadow:0 0 4px #caa44d; }
/* — пропы правок батча 3 — */
.arena-app .water-surf{ background:linear-gradient(180deg,rgba(180,225,255,.55),rgba(40,110,180,.55) 18%,rgba(16,54,100,.78)); border-top:3px solid rgba(190,230,255,.75); border-radius:0 0 10px 10px; box-shadow:0 0 22px rgba(58,138,208,.5) inset; }
.arena-app .nuke-flash{ border-radius:50%; background:radial-gradient(circle,#fff 0 30%,rgba(255,235,160,.7) 45%,transparent 72%); pointer-events:none; }
.arena-app .mushroom{ position:relative; pointer-events:none; }
.arena-app .mushroom .m-cap{ position:absolute; left:50%; top:0; transform:translateX(-50%); width:100%; height:46%; border-radius:50% 50% 44% 44%; background:radial-gradient(circle at 50% 40%,#ffe08a,#ff8a3a 55%,#c0401a); box-shadow:0 0 26px rgba(255,140,50,.7); }
.arena-app .mushroom .m-stem{ position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:30%; height:62%; background:linear-gradient(180deg,#ff8a3a,#c0401a); border-radius:8px; box-shadow:0 0 18px rgba(255,120,40,.6); }
.arena-app .buff-arrow{ display:flex; align-items:center; justify-content:center; font:800 22px Orbitron,monospace; }
.arena-app .buff-arrow.up{ color:#5fd86a; text-shadow:0 0 8px #5fd86a; }
.arena-app .buff-arrow.down{ color:#e0563a; text-shadow:0 0 8px #e0563a; }
/* — пропы батча 4 — */
.arena-app .deck-card b{ display:flex; align-items:center; justify-content:center; height:100%; font:800 16px Orbitron,monospace; color:#fff; }
.arena-app .emf-bar{ display:flex; gap:3px; align-items:flex-end; justify-content:center; height:16px; }
.arena-app .emf-bar i{ width:7px; background:#5fff7a; border-radius:1px; box-shadow:0 0 5px #5fff7a; }
.arena-app .emf-bar i:nth-child(1){height:30%}.arena-app .emf-bar i:nth-child(2){height:50%}.arena-app .emf-bar i:nth-child(3){height:70%}.arena-app .emf-bar i:nth-child(4){height:85%}.arena-app .emf-bar i:nth-child(5){height:100%;background:#ff5a4a;box-shadow:0 0 6px #ff5a4a}
.arena-app .tear-fx{ border-radius:50% 50% 50% 0; background:radial-gradient(circle at 40% 30%,#cfe4ff,#5a8ad0); box-shadow:0 0 6px #7fb0ff; transform:rotate(45deg); }
.arena-app .ball-fx{ border-radius:50%; background:radial-gradient(circle at 35% 30%,#2a2a2e,#0a0a0c); box-shadow:0 0 6px rgba(0,0,0,.6); }
/* — пропы финального пака — */
.arena-app .thought-fx{ display:flex; align-items:center; justify-content:center; background:rgba(20,30,40,.85); border:2px solid #7fd0e0; border-radius:14px; box-shadow:0 0 10px rgba(127,208,224,.4); }
.arena-app .thought-fx i{ font:800 26px Orbitron,monospace; font-style:normal; color:#7fd0e0; }
.arena-app .gm-bullet{ border-radius:2px; background:#5fb0ff; box-shadow:0 0 6px #5fb0ff; }
.arena-app .meme-txt{ display:flex; align-items:center; justify-content:center; font:900 18px Orbitron,monospace; color:#ffd24a; text-shadow:0 0 6px #000,2px 2px 0 #c0392b; }
.arena-app .deadeye-x{ display:flex; align-items:center; justify-content:center; font:900 18px Orbitron,monospace; color:#e02329; text-shadow:0 0 6px #e02329; }
.arena-app .px-shot{ background:#5fd0ff; box-shadow:0 0 6px #5fd0ff; image-rendering:pixelated; }
.arena-app .px-bit{ background:#5fd0ff; }
.arena-app .ink-slash{ background:linear-gradient(120deg,transparent,#0a0a0a 30%,#0a0a0a 70%,transparent); border-radius:50%; }
/* — пропы доп-пака — */
.arena-app .finals-plat{ background:repeating-linear-gradient(90deg,#5a6a7a,#5a6a7a 12px,#48565f 12px,#48565f 16px); border:2px solid #3a4650; border-radius:3px; box-shadow:0 4px 10px rgba(0,0,0,.4); }
.arena-app .meteor-fx{ border-radius:50%; background:radial-gradient(circle at 38% 32%,#ffd24a,#ff6a2a 45%,#7a1a0a); box-shadow:0 0 22px rgba(255,110,40,.8); }
.arena-app .esword-fx{ border-radius:3px; background:linear-gradient(180deg,#bff0ff,#5fe0ff); box-shadow:0 0 14px #5fe0ff,0 0 22px #3aa0e0; }

/* ═══ МОБИЛЬНАЯ АРЕНА ═══ */
@media (max-width:768px){
  .panel{ padding:18px 14px; }
  .arena-layout{ width:96vw; }
  #prepareBtn, .dl-card-btn{ width:100%; box-sizing:border-box; }
  .prepare-row #prepareBtn{ width:auto; flex:1 1 auto; }
  .input-row input{ max-width:none; }
  .arena-app .stage{ aspect-ratio:16/11; }
  .arena-app .medallion{ width:clamp(72px,19vw,112px); height:clamp(72px,19vw,112px); }
  .arena-app .fighter.A{ left:7%; } .arena-app .fighter.B{ right:7%; }
  .arena-app .fighter .plate{ font-size:.88rem; margin-top:7px; } .arena-app .fighter .pcls{ font-size:.6rem; }
  .arena-app .hp .name .nm{ font-size:clamp(.8rem,3.6vw,1.1rem); max-width:58%; }
  .arena-app .hp .name .cls{ font-size:.58rem; }
  .arena-app .hp .track{ height:16px; }
  .arena-app .hpbar{ gap:7px; }
  .arena-app .caster{ font-size:.9rem; }
  .skillname{ font-size:clamp(.95rem,4vw,1.5rem); }
}
@media (max-width:480px){
  .arena-app .stage{ aspect-ratio:16/12.6; }
  .arena-app .medallion{ width:clamp(60px,20vw,92px); height:clamp(60px,20vw,92px); }
  .arena-app .fighter.A{ left:4%; } .arena-app .fighter.B{ right:4%; }
  .arena-app .fighter .plate{ font-size:.76rem; } .arena-app .fighter .pcls{ font-size:.54rem; }
  .skillname{ font-size:clamp(.82rem,4.6vw,1.25rem); }
  .arena-app .shout .big{ font-size:clamp(.82rem,4.6vw,1.3rem); }
  .arena-app .fatname .word{ font-size:clamp(1.3rem,7.4vw,2.5rem); }
  .arena-app .fatname .sub{ font-size:.66rem; letter-spacing:2px; margin-top:9px; }
  .arena-app .fightb .word{ font-size:clamp(1.3rem,7.6vw,2.4rem); letter-spacing:3px; }
  .arena-app .finish .word{ font-size:clamp(2rem,11vw,4rem); }
  .arena-app .cry .word{ font-size:clamp(1.2rem,6vw,2.4rem); }
  .arena-app .count .word{ font-size:clamp(3.4rem,20vw,7rem); }
}

.lb-empty{ list-style:none; padding:18px 12px; text-align:center; color:#b7a888; font-size:.82rem; line-height:1.4; opacity:.85; }

/* ====================== ИТОГОВАЯ КАРТОЧКА ПОБЕДЫ (vcard) ====================== */
.result-overlay{position:absolute; inset:0; z-index:40; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(ellipse at center, rgba(8,6,4,.8), rgba(3,2,1,.94)); animation:vcFade .4s ease both;}
@keyframes vcFade{from{opacity:0}to{opacity:1}}
.vc-close{position:absolute; top:12px; right:14px; z-index:42; width:42px; height:42px; border-radius:50%;
  border:1px solid rgba(201,162,74,.5); background:rgba(20,15,9,.85); color:#e8dcc4; font-size:1.1rem; cursor:pointer; line-height:1;}
.vc-close:hover{background:rgba(40,28,14,.95); color:#fff;}

.vcard{position:absolute; left:50%; top:50%; transform-origin:center; width:1600px; height:860px; overflow:hidden;
  background:#15120d; color:#efe6d2; font-family:'Exo 2',sans-serif; box-shadow:0 30px 80px rgba(0,0,0,.7);
  -webkit-font-smoothing:antialiased;}
.vc-scene{position:absolute; inset:0; z-index:0;}
.vc-scene svg{width:100%; height:100%; display:block;}
.vc-grain{position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='220' height='220' filter='url(%23n)'/></svg>");}
.vc-vign{position:absolute; inset:0; z-index:2; pointer-events:none; background:radial-gradient(ellipse 78% 82% at 50% 46%, transparent 54%, rgba(0,0,0,.74) 100%);}
.vc-frame{position:absolute; inset:20px; z-index:6; pointer-events:none; border:3px solid rgba(201,162,74,.55); border-radius:4px;}
.vc-frame::after{content:""; position:absolute; inset:6px; border:1px solid rgba(201,162,74,.35);}

.vc-mast{position:absolute; top:30px; left:0; right:0; z-index:5; text-align:center;}
.vc-mh{display:inline-flex; align-items:center; gap:18px; font-family:'Cinzel',serif; font-weight:700; letter-spacing:7px; font-size:1.15rem; color:#f3d488; text-shadow:0 2px 6px rgba(0,0,0,.6);}
.vc-mh i{display:block; width:90px; height:2px; background:linear-gradient(90deg,transparent,#c9a24a);}
.vc-mh i.r{background:linear-gradient(90deg,#c9a24a,transparent);}
.vc-msub{display:block; margin-top:6px; font-size:.78rem; letter-spacing:5px; color:#9d8f76; text-transform:uppercase;}

.vc-crown{position:absolute; left:50%; top:150px; transform:translateX(-50%); z-index:5; width:120px; height:64px; filter:drop-shadow(0 4px 6px rgba(0,0,0,.5));}
.vc-win{position:absolute; left:50%; top:212px; transform:translateX(-50%); z-index:5; width:250px; height:250px; border-radius:50%;
  background-color:#23303f; background-size:cover; background-position:center;
  box-shadow:0 0 0 4px #15120d, 0 0 0 10px rgba(227,177,78,.92), 0 0 54px 10px rgba(244,214,134,.34), inset 0 8px 24px rgba(0,0,0,.35);}
.vc-wplate{position:absolute; left:50%; top:704px; transform:translateX(-50%); z-index:5; text-align:center; width:720px;}
.vc-wlbl{font-family:'Cinzel',serif; font-weight:700; letter-spacing:5px; font-size:.78rem; color:#c9a24a;}
.vc-wtitle{font-family:'Cinzel Decorative',serif; font-weight:900; font-size:2.5rem; line-height:1.05; color:#f3d488; text-shadow:0 2px 0 #2a1404,0 4px 16px rgba(0,0,0,.6); margin:2px 0;}
.vc-wepi{font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.15rem; color:#d8c8a6;}
.vc-wepi b{color:#f1e4c4; font-weight:600; font-style:normal;}

.vc-bubble{position:absolute; left:36px; top:92px; z-index:5; width:316px; padding:18px 22px; background:#f3ecda; color:#241c12; border-radius:18px; border:3px solid #241c12; font-weight:600; font-size:1.02rem; line-height:1.32; box-shadow:0 10px 24px rgba(0,0,0,.45);}
.vc-bubble::after{content:""; position:absolute; left:140px; bottom:-26px; width:0; height:0; border:16px solid transparent; border-top-color:#241c12; border-bottom:0;}
.vc-bubble::before{content:""; position:absolute; left:145px; bottom:-18px; width:0; height:0; z-index:1; border:11px solid transparent; border-top-color:#f3ecda; border-bottom:0;}

.vc-lose{position:absolute; left:118px; top:330px; z-index:5; width:158px; height:158px; border-radius:50%;
  background-color:#23303f; background-size:cover; background-position:center;
  box-shadow:0 0 0 4px #15120d, 0 0 0 8px rgba(120,110,92,.55), inset 0 6px 18px rgba(0,0,0,.4);}
.vc-lemoji{font-size:92px; line-height:1; filter:saturate(.85) brightness(.95);}
.vc-lbadge{position:absolute; right:-6px; bottom:-6px; z-index:7; width:60px; height:60px; border-radius:50%;
  background:radial-gradient(circle at 38% 34%, #3a352d, #1b1814); border:3px solid #15120d;
  display:flex; align-items:center; justify-content:center; font-size:32px; line-height:1; box-shadow:0 5px 12px rgba(0,0,0,.55);}
.vc-lbadge-win{background:radial-gradient(circle at 38% 34%, #6a5626, #2c2510);}
.vc-cbadge{position:absolute; right:8px; bottom:8px; z-index:7; width:66px; height:66px; border-radius:50%;
  background:radial-gradient(circle at 38% 34%, #3a352d, #1b1814); border:3px solid #15120d;
  display:flex; align-items:center; justify-content:center; font-size:36px; line-height:1; box-shadow:0 5px 14px rgba(0,0,0,.6);}
/* (9) ведро на голове + мрачный режим поражения */

/* подпись фаталити («ульта») под аватаркой — только карточка поражения */
.vc-fatcap{position:absolute; left:50%; top:486px; transform:translateX(-50%); z-index:6; width:600px; max-width:600px; text-align:center;}
.vc-fcname{display:block; font-family:'Cinzel',serif; font-weight:700; letter-spacing:2px; font-size:1.5rem; color:#e6b96a; text-shadow:0 2px 5px rgba(0,0,0,.7);}
.vc-fcsub{display:block; margin-top:6px; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.18rem; line-height:1.25; color:#d3c2a2; white-space:normal; word-break:break-word;}
.vc-buckethat{position:absolute; left:50%; top:156px; transform:translateX(-50%); z-index:6; width:150px; height:120px; filter:drop-shadow(0 6px 8px rgba(0,0,0,.55));}
.vcard.vc-defeat .vc-bucket{display:none;}
.vcard.vc-defeat .vc-scene{filter:grayscale(.4) brightness(.6) saturate(.8);}
.vcard.vc-defeat .vc-vign{background:radial-gradient(ellipse 78% 82% at 50% 46%, transparent 42%, rgba(0,0,0,.88) 100%);}
.vcard.vc-defeat .vc-frame{border-color:rgba(122,44,44,.6);}
.vcard.vc-defeat .vc-frame::after{border-color:rgba(122,44,44,.4);}
.vcard.vc-defeat .vc-win{box-shadow:0 0 0 4px #15120d, 0 0 0 10px rgba(122,44,44,.7), inset 0 8px 24px rgba(0,0,0,.55);}
.vcard.vc-defeat .vc-wlbl{color:#d2746a;}
.vcard.vc-defeat .vc-wtitle{color:#e8c0b6; text-shadow:0 2px 0 #2a0a06,0 4px 16px rgba(0,0,0,.6);}
.vc-lcap{position:absolute; left:30px; top:506px; z-index:5; width:336px; text-align:center;}
.vc-ltag{display:inline-block; font-family:'Cinzel',serif; font-weight:700; letter-spacing:1px; font-size:.82rem; color:#1a1610; background:linear-gradient(135deg,#cfc3a5,#a99b78); padding:5px 14px; border-radius:6px; box-shadow:0 4px 10px rgba(0,0,0,.4);}
.vc-ldesc{margin-top:9px; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.06rem; line-height:1.3; color:#a4977e;}
.vc-lname{margin-top:10px; font-family:'Cinzel',serif; font-weight:700; font-size:1.25rem; color:#b9ad96; letter-spacing:1px;}
.vc-lname small{display:block; font-family:'Exo 2',sans-serif; font-weight:400; font-style:italic; font-size:.82rem; color:#7d7568; letter-spacing:0; text-transform:none;}

.vc-scroll{position:absolute; right:40px; top:64px; z-index:5; width:392px; padding:26px 28px 30px; color:#2a1a08; transform:rotate(.5deg);
  background-color:#e6d3a6;
  background-image:
    radial-gradient(circle at 18% 12%, rgba(120,75,25,.16), transparent 26%),
    radial-gradient(circle at 84% 86%, rgba(90,55,20,.20), transparent 30%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='200' height='200' filter='url(%23p)' opacity='0.06'/></svg>"),
    radial-gradient(ellipse 150% 130% at 50% 50%, #ecdbb0 36%, #cdb079 100%);
  box-shadow:0 18px 40px rgba(0,0,0,.55), inset 0 0 90px rgba(80,48,18,.45); border:1px solid rgba(80,50,18,.5);}
.vc-scroll::before{content:""; position:absolute; inset:8px; border:2px solid rgba(70,44,16,.45); pointer-events:none;}
.vc-scroll h3{font-family:'Cinzel',serif; font-weight:900; font-size:1.02rem; letter-spacing:2px; text-align:center; color:#3a230c; padding-bottom:9px; margin-bottom:12px; border-bottom:2px solid rgba(70,44,16,.5);}
.vc-scroll p{font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:500; font-size:1.34rem; line-height:1.42; color:#322012;}

.vc-stats{position:absolute; right:40px; top:512px; z-index:5; width:392px; display:flex; flex-direction:column; gap:16px;}
.vc-stat{display:flex; align-items:center; gap:16px; padding:12px 16px; background:linear-gradient(135deg, rgba(40,32,20,.82), rgba(22,17,10,.82)); border:1px solid rgba(201,162,74,.4); border-left:4px solid #c9a24a; border-radius:8px; box-shadow:0 8px 20px rgba(0,0,0,.4);}
.vc-ic{flex-shrink:0; width:40px; height:40px; color:#f3d488;}
.vc-ic svg{width:40px; height:40px;}
.vc-tx{display:flex; flex-direction:column;}
.vc-l{font-family:'Cinzel',serif; font-weight:700; letter-spacing:1.5px; font-size:.74rem; color:#a89472; text-transform:uppercase;}
.vc-v{font-family:'Exo 2',sans-serif; font-weight:700; font-size:1.28rem; color:#f1e4c4; line-height:1.1;}

.vc-wm{position:absolute; left:46px; bottom:34px; z-index:5; font-family:'Cinzel',serif; font-weight:700; letter-spacing:2px; font-size:1rem; color:#e8dcc4; text-shadow:0 2px 6px rgba(0,0,0,.7);}
.vc-wm small{display:block; font-family:'Exo 2',sans-serif; font-weight:400; font-style:italic; letter-spacing:.5px; font-size:.78rem; color:#c9a24a; text-transform:none;}

/* кнопка скачивания в шапке */
.dl-card-btn{margin-top:10px; cursor:pointer; border:none; border-radius:10px; padding:11px 24px; font-family:'Cinzel',serif; font-weight:700; font-size:.95rem; letter-spacing:1px; color:#2a1607; background:linear-gradient(135deg,#e0a94f,#bd7a26); box-shadow:0 5px 0 #6e4512,0 9px 20px rgba(0,0,0,.45); transition:.14s;}
.dl-card-btn:hover{transform:translateY(-2px); box-shadow:0 7px 0 #6e4512,0 12px 24px rgba(0,0,0,.5);}
.dl-card-btn:active{transform:translateY(2px); box-shadow:0 2px 0 #6e4512;}
.dl-card-btn:disabled{opacity:.6; cursor:default; transform:none;}

/* бензопила DOOM — бегущая цепь */
.arena-app .sawchain{ animation: sawspin .22s linear infinite; }
@keyframes sawspin{ to{ stroke-dashoffset:-20; } }