/* =====================================================================
   ARMA-GEDON · Sezon 3 · profile4.css
   „Teczka żołnierza”: po kliknięciu w gracza lewa strona to scena z jego postacią
   z WARDOGS (szturmowiec, snajper, pilot, pancerniak), liczbami, stopniem,
   odznaczeniami i formą. Panel ze statystykami zostaje po prawej.
   Od 1100 px szerokości; na węższych ekranach nad panelem jest pasek z postacią.
   ===================================================================== */
.v6 .drawer{background:none!important;box-shadow:none!important;border:0!important}
.v6 .drawer-shade{background:#05060a;-webkit-backdrop-filter:none;backdrop-filter:none}
.v6 .drawer-box{width:min(540px,100%);background:linear-gradient(180deg,rgba(10,11,14,.93),rgba(7,8,10,.96));
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-left:0;
  box-shadow:inset 1px 0 0 rgba(202,148,72,.55),-50px 0 90px -34px #000}
.v6 .drawer-head{background:linear-gradient(180deg,rgba(10,11,14,.97),rgba(10,11,14,.8));border-bottom:1px solid rgba(202,148,72,.28)}

.dz{--dz:#ca9448;--dz-rgb:202,148,72;--px:0;--py:0;position:absolute;left:0;top:0;bottom:0;right:min(540px,100%);overflow:hidden;pointer-events:none;
  opacity:0;transition:opacity .45s ease;font-family:var(--b,system-ui,sans-serif);color:#e9e2d4}
.drawer.is-open .dz{opacity:1}

/* tło: dym zdjęcia, poświata frakcji, snopy światła, ziarno */
.dz-bg{position:absolute;inset:-3%;transform:translate3d(calc(var(--px)*-10px),calc(var(--py)*-6px),0);background:
  radial-gradient(60% 56% at 60% 52%,rgba(var(--dz-rgb),.26),transparent 70%),
  linear-gradient(180deg,rgba(5,6,9,.5) 0,rgba(5,6,9,.82) 72%,#05060a 100%),
  url(/assets/v4/img/ranking.webp) 62% 30%/cover no-repeat;filter:saturate(.7)}
.dz-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 55% 48%,transparent 42%,rgba(2,3,5,.85) 100%)}
.dz-beam{position:absolute;top:-10%;width:22%;height:120%;opacity:.5;filter:blur(18px);transform-origin:50% 0;
  background:linear-gradient(180deg,rgba(var(--dz-rgb),.36),rgba(var(--dz-rgb),.05) 70%,transparent)}
.dz-beam.b1{left:34%;transform:rotate(18deg) translate3d(calc(var(--px)*-18px),0,0)}
.dz-beam.b2{left:62%;width:14%;opacity:.32;transform:rotate(-14deg) translate3d(calc(var(--px)*-26px),0,0)}
.dz::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:overlay;opacity:.45;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.05) 0 1px,transparent 1px 3px)}

/* wielki napis klasy za postacią */
.dz-wm{position:absolute;transform:translate3d(calc(-50% + var(--px)*-24px),calc(-50% + var(--py)*-12px),0);white-space:nowrap;
  font:700 120px/1 var(--c,Impact,sans-serif);letter-spacing:.06em;color:transparent;-webkit-text-stroke:1.5px rgba(var(--dz-rgb),.34);opacity:.55;
  text-shadow:0 0 80px rgba(var(--dz-rgb),.25)}

/* iskry */
.dz-embers i{position:absolute;bottom:-10px;width:3px;height:3px;border-radius:50%;background:rgb(var(--dz-rgb));box-shadow:0 0 8px rgb(var(--dz-rgb));opacity:0;animation:dz-ember 10s linear infinite}
@keyframes dz-ember{0%{transform:translate3d(0,0,0);opacity:0}10%{opacity:.9}100%{transform:translate3d(30px,-90vh,0);opacity:0}}

/* podłoga: poświata i pierścienie pod stopami */
.dz-floor{position:absolute;transform:translate3d(calc(var(--px)*8px),0,0)}
.dz-floor::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--dz-rgb),.42),rgba(var(--dz-rgb),.1) 55%,transparent 76%);filter:blur(6px)}
.dz-floor i{position:absolute;left:50%;top:50%;border:1.5px solid rgba(var(--dz-rgb),.55);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 18px rgba(var(--dz-rgb),.35)}
.dz-floor i:nth-child(1){width:62%;height:62%}
.dz-floor i:nth-child(2){width:84%;height:84%;opacity:.45;border-style:dashed}
.dz-floor i:nth-child(3){width:100%;height:100%;opacity:.22}

/* postać */
.dz-fig{position:absolute;transform:perspective(1100px) translate3d(calc(var(--px)*14px),calc(var(--py)*6px),0) rotateY(calc(var(--px)*3deg))}
.dz-fig img{display:block;width:100%;height:100%;object-fit:contain;object-position:50% 100%;
  filter:drop-shadow(0 0 1px rgba(var(--dz-rgb),.9)) drop-shadow(0 0 26px rgba(var(--dz-rgb),.32)) drop-shadow(0 34px 38px rgba(0,0,0,.75));
  -webkit-box-reflect:below -6px linear-gradient(transparent 74%,rgba(255,255,255,.2))}
.dz-scan{position:absolute;left:0;right:0;height:2px;top:100%;opacity:0;background:linear-gradient(90deg,transparent,rgb(var(--dz-rgb)) 25%,#fff 50%,rgb(var(--dz-rgb)) 75%,transparent);box-shadow:0 0 22px 4px rgba(var(--dz-rgb),.7)}
.dz-go .dz-fig img{animation:dz-mat 1s cubic-bezier(.2,.7,.2,1) backwards}
.dz-go .dz-scan{animation:dz-scan 1.15s cubic-bezier(.4,.1,.2,1) .05s both}
@keyframes dz-mat{from{opacity:0;transform:translateX(46px) scale(.97);filter:blur(10px) brightness(2.2)}60%{opacity:1}to{transform:none}}
@keyframes dz-scan{0%{top:84%;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:6%;opacity:0}}
.dz-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.dz-lines polyline{fill:none;stroke:rgb(var(--dz-rgb));stroke-width:1;opacity:.8;stroke-dasharray:480;stroke-dashoffset:480;animation:dz-draw .9s .5s ease forwards}
.dz-lines circle{fill:rgb(var(--dz-rgb));filter:drop-shadow(0 0 6px rgb(var(--dz-rgb)))}
@keyframes dz-draw{to{stroke-dashoffset:0}}

/* kryptonim, klasa, znaczki */
.dz-id{position:absolute;left:40px;top:34px;max-width:min(38%,420px)}
.dz-tag{font:700 11px/1 var(--wm,ui-monospace,monospace);letter-spacing:.24em;color:rgb(var(--dz-rgb));text-shadow:0 0 14px rgba(var(--dz-rgb),.6)}
.dz-name{margin:12px 0 14px;font:700 clamp(34px,4.6vw,64px)/.96 var(--c,Impact,sans-serif);letter-spacing:.015em;text-transform:uppercase;color:#f6f0e4;
  text-shadow:0 0 36px rgba(var(--dz-rgb),.35),0 2px 0 rgba(0,0,0,.6);white-space:nowrap}
.dz-name[data-l="m"]{font-size:clamp(30px,3.7vw,50px)}
.dz-name[data-l="s"]{font-size:clamp(24px,3vw,38px)}
.dz-class{display:inline-flex;align-items:center;gap:14px;padding:10px 22px 10px 14px;margin-bottom:12px;
  background:linear-gradient(90deg,rgba(var(--dz-rgb),.28),rgba(var(--dz-rgb),.04));border-left:3px solid rgb(var(--dz-rgb));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.dz-ic{display:block;width:38px;height:38px;flex:none;background:rgb(var(--dz-rgb));-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat;filter:drop-shadow(0 0 8px rgba(var(--dz-rgb),.6))}
.dz-cn small{display:block;font:700 9.5px/1 var(--wm,monospace);letter-spacing:.24em;color:rgba(233,226,212,.6)}
.dz-cn b{display:block;margin-top:5px;font:700 26px/1 var(--c,Impact,sans-serif);letter-spacing:.06em;color:#fff3da}
.dz-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.dz-chips .dz-rk{display:inline-flex;max-width:100%;white-space:nowrap;align-items:baseline;gap:8px;padding:5px 12px 4px 10px;font:700 10px/1 var(--wm,monospace);letter-spacing:.16em;color:#d9cfb8;
  background:rgba(var(--dz-rgb),.13);box-shadow:inset 0 0 0 1px rgba(var(--dz-rgb),.55)}
.dz-chips .dz-rk b{font:700 20px/1 var(--c,Impact,sans-serif);letter-spacing:.02em;color:rgb(var(--dz-rgb));text-shadow:0 0 14px rgba(var(--dz-rgb),.6)}
.dz-chips .dz-now{display:inline-flex;align-items:center;gap:7px;padding:5px 10px 4px;font:700 10px/1 var(--wm,monospace);letter-spacing:.14em;color:#6dffa7;
  background:rgba(60,220,120,.1);border:1px solid rgba(80,230,140,.5)}
.dz-spec{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.dz-sp{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 6px;background:rgba(9,10,12,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:inset 0 0 0 1px rgba(var(--dz-rgb),.4);font:600 12.5px/1 var(--b,sans-serif);color:#cfc7b6}
.dz-sp b{font:700 16px/1 var(--c,Impact,sans-serif);color:#fff3da;letter-spacing:.03em}
.dz-sp .ic{color:rgb(var(--dz-rgb));font-size:17px}

/* liczby przy sylwetce */
.dz-pin{position:absolute;left:0;top:0;min-width:156px;padding:11px 16px 10px 14px;transform:translate(var(--tx,0),var(--ty,0));
  background:linear-gradient(180deg,rgba(9,10,12,.86),rgba(9,10,12,.62));-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
  border-left:2px solid rgb(var(--dz-rgb));box-shadow:0 14px 40px -18px #000,inset 0 0 0 1px rgba(var(--dz-rgb),.16);opacity:0;animation:dz-pin .55s .4s cubic-bezier(.2,.7,.2,1) forwards}
.dz-pin.dz-r{border-left:0;border-right:2px solid rgb(var(--dz-rgb));text-align:right}
.dz-pin b{display:block;font:700 34px/1 var(--c,Impact,sans-serif);letter-spacing:.015em;color:#fff4de;text-shadow:0 0 18px rgba(var(--dz-rgb),.45);font-variant-numeric:tabular-nums}
.dz-pin span{display:block;margin-top:6px;font:700 10px/1 var(--wm,monospace);letter-spacing:.2em;color:rgb(var(--dz-rgb))}
.dz-pin.dz-n1{animation-delay:.5s}.dz-pin.dz-n2{animation-delay:.65s}.dz-pin.dz-n3{animation-delay:.8s}
@keyframes dz-pin{from{opacity:0;transform:translate(var(--tx,0),calc(var(--ty,0px) + 12px)) scale(.94)}to{opacity:1;transform:translate(var(--tx,0),var(--ty,0))}}

/* dół sceny: stopień, odznaczenia, forma */
.dz-foot{position:absolute;left:40px;right:40px;bottom:30px;display:grid;grid-template-columns:auto 1fr;gap:14px 30px;align-items:end}
.dz-foot>div:empty{display:none}
.dz-grade{grid-row:1/3;display:flex;align-items:center;gap:16px;min-width:0;padding:12px 20px 12px 14px;background:linear-gradient(180deg,rgba(9,10,12,.88),rgba(9,10,12,.64));
  -webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);box-shadow:inset 0 0 0 1px rgba(var(--dz-rgb),.38);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.dz-grade svg{width:54px;height:54px;flex:none;color:rgb(var(--dz-rgb));filter:drop-shadow(0 0 10px rgba(var(--dz-rgb),.6))}
.dz-grade b{display:block;font:700 24px/1 var(--c,Impact,sans-serif);letter-spacing:.04em;text-transform:uppercase;color:#fff3da}
.dz-grade small{display:block;margin-top:6px;font:600 12px/1.25 var(--b,sans-serif);color:#b9b09d}
.dz-mt{height:3px;margin-top:8px;background:rgba(255,255,255,.12);overflow:hidden}
.dz-mt i{display:block;height:100%;background:linear-gradient(90deg,#7c4118,rgb(var(--dz-rgb)));box-shadow:0 0 10px rgb(var(--dz-rgb))}
.dz-medals,.dz-form{grid-column:2;justify-self:end}
.dz-lab{font:700 10px/1 var(--wm,monospace);letter-spacing:.22em;color:rgb(var(--dz-rgb));margin-bottom:10px;text-shadow:0 0 12px rgba(var(--dz-rgb),.5)}
.dz-row{display:flex;flex-wrap:wrap;gap:8px}
.dz-md{position:relative;display:grid;place-items:center;width:38px;height:38px;background:rgba(9,10,12,.78);color:rgb(var(--dz-rgb));font-size:19px;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);box-shadow:inset 0 0 0 1px rgba(var(--dz-rgb),.5)}
.dz-md::before{content:"";position:absolute;inset:1px;clip-path:inherit;background:linear-gradient(180deg,rgba(var(--dz-rgb),.3),rgba(var(--dz-rgb),.04))}
.dz-md .ic{position:relative}
.dz-form .dz-row{gap:5px;flex-wrap:nowrap}
.dz-f{display:grid;place-items:center;width:26px;height:26px;font:700 12px/1 var(--wm,monospace);color:#0b0c0e}
.dz-f.dz-win{background:#4be88a;box-shadow:0 0 12px rgba(75,232,138,.45)}
.dz-f.dz-loss{background:#ff5a52;box-shadow:0 0 12px rgba(255,90,82,.4)}
.dz-f.dz-draw{background:#c9bfa8}

/* wejście elementów przy zmianie gracza */
.dz-go .dz-id>*,.dz-go .dz-foot>*{animation:dz-up .6s cubic-bezier(.2,.7,.2,1) backwards}
.dz-go .dz-id>:nth-child(2){animation-delay:.07s}.dz-go .dz-id>:nth-child(3){animation-delay:.14s}.dz-go .dz-id>:nth-child(4){animation-delay:.21s}.dz-go .dz-id>:nth-child(5){animation-delay:.28s}
.dz-go .dz-foot>:nth-child(2){animation-delay:.12s}.dz-go .dz-foot>:nth-child(3){animation-delay:.24s}
@keyframes dz-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.dz-go .dz-pin{animation-name:dz-pin}

/* węższe ekrany: pasek z postacią nad panelem statystyk */
.dz-mini{display:none}
@media (max-width:1099px){
  .dz{display:none}
  .dz-mini{display:block;position:relative;height:210px;overflow:hidden;background:
    radial-gradient(70% 90% at 72% 60%,rgba(var(--dz-rgb,202,148,72),.34),transparent 72%),linear-gradient(180deg,#0b0c10,#07080b);border-bottom:1px solid rgba(var(--dz-rgb,202,148,72),.35)}
  .dz-mini img{position:absolute;right:4%;top:6px;height:420px;width:auto;max-width:none;filter:drop-shadow(0 0 20px rgba(var(--dz-rgb,202,148,72),.35)) drop-shadow(0 20px 24px rgba(0,0,0,.7))}
  .dz-mc{position:absolute;left:22px;top:50%;transform:translateY(-50%)}
  .dz-mc small{display:block;font:700 9.5px/1 var(--m,monospace);letter-spacing:.24em;color:rgba(233,226,212,.6)}
  .dz-mc>b{display:block;margin-top:6px;font:700 30px/1 var(--c,Impact,sans-serif);letter-spacing:.05em;color:#fff3da}
  .dz-mc span{display:block;margin-top:10px;font:600 12px/1.3 var(--b,sans-serif);color:#cfc7b6;max-width:16ch}
  .dz-mc span b{font:700 18px/1 var(--c,Impact,sans-serif);color:rgb(var(--dz-rgb,202,148,72))}
}
@media (max-height:760px){.dz-name{font-size:clamp(28px,4vw,48px)}.dz-foot{bottom:20px}.dz-id{top:26px}}
@media (prefers-reduced-motion:reduce){.dz *,.dz{animation:none!important}.dz-pin{opacity:1}.dz-lines polyline{stroke-dashoffset:0}.dz-embers{display:none}}
.dz-id,.dz-pin,.dz-foot{z-index:3}
.dz-lines{z-index:2}
@media (max-width:1359px){.dz-spec{display:none}.dz-id{left:28px;max-width:min(46%,420px)}.dz-foot{left:28px;right:28px}}
