@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;800&display=swap');

/* =========================================================
   EldenRO PvP Rank UI - cleaned + deduped (non-breaking)
   ========================================================= */

:root{
  --eld-bg: rgba(10,12,16,.62);
  --eld-bg2: rgba(10,12,16,.42);
  --eld-bd: rgba(255,255,255,.10);

  --eld-tx: rgba(255,255,255,.92);
  --eld-tx2: rgba(255,255,255,.68);

  --eld-gold: rgba(177,147,67,.95);
  --eld-gold2: rgba(255,235,200,.95);

  --eld-shadow: 0 18px 60px rgba(0,0,0,.55);

  --eld-radius: 18px;
  --eld-radius-sm: 12px;
}

/* =========================================================
   Layout
   ========================================================= */
.eld-rank-wrap{
  padding: 16px 0 46px;
  display: grid;
  gap: 14px;
}

/* =========================================================
   Head
   ========================================================= */
.eld-rank-head{
  position: relative;
  overflow: hidden;
  padding: 16px 18px;

  border-radius: var(--eld-radius);
  background: linear-gradient(180deg, var(--eld-bg), var(--eld-bg2));
  border: 1px solid var(--eld-bd);
  box-shadow: var(--eld-shadow);
  backdrop-filter: blur(10px);
}

.eld-rank-head::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(700px 260px at 18% 8%, rgba(177,147,67,.18), transparent 60%),
    radial-gradient(520px 220px at 80% 0%, rgba(255,235,200,.10), transparent 60%);
}

.eld-rank-kicker{
  position: relative;
  font-family:"Cinzel", serif;
  letter-spacing:.18em;
  font-size:12px;
  color: var(--eld-tx2);
  text-transform: uppercase;
}

.eld-rank-title{
  position: relative;
  font-family:"Cinzel", serif;
  margin: 8px 0 6px;
  font-size: 34px;
  font-weight: 800;
  color: var(--eld-tx);
}

.eld-rank-sub{
  position: relative;
  color: var(--eld-tx2);
  font-size: 14px;
}

/* =========================================================
   Filter
   ========================================================= */
.eld-rank-filter{ position: relative; margin-top: 12px; }

.eld-filter-row{
  display:flex;
  gap: 12px;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: flex-end;
}

.eld-filter-field{
  display:grid;
  gap: 7px;
  min-width: 240px;
}

.eld-filter-label{
  color: var(--eld-tx2);
  font-size: 12px;
  letter-spacing:.08em;
  text-transform: uppercase;
}

/* Select wrapper (premium) */
.eld-select{
  position: relative;
  width: 340px;
  max-width: 75vw;
}

.eld-filter-select{
  width: 100%;
  border-radius: 14px;
  outline: none;

  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  padding: 10px 12px;
  padding-right: 38px;

  background: rgba(0,0,0,.30);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);

  scrollbar-width: thin;
  scrollbar-color: rgba(177,147,67,.55) rgba(0,0,0,.25);
}

.eld-filter-select::-webkit-scrollbar{ width: 10px; }
.eld-filter-select::-webkit-scrollbar-thumb{
  background: rgba(177,147,67,.55);
  border-radius: 999px;
}
.eld-filter-select::-webkit-scrollbar-track{
  background: rgba(0,0,0,.25);
}

.eld-select-arrow{
  position:absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events:none;
  color: rgba(255,235,200,.75);
  font-size: 13px;
}

.eld-filter-actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.eld-btn{
  border: 1px solid rgba(177,147,67,.42);
  background: linear-gradient(180deg, rgba(177,147,67,.30), rgba(0,0,0,.25));
  color: rgba(255,235,200,.95);
  padding: 10px 12px;
  border-radius: 14px;
  cursor: pointer;

  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: 12px;
}

.eld-btn:hover{
  border-color: rgba(255,235,200,.35);
  background: linear-gradient(180deg, rgba(177,147,67,.40), rgba(0,0,0,.25));
}

.eld-btn.is-ghost{
  border-color: rgba(255,255,255,.16);
  background: rgba(0,0,0,.22);
  color: rgba(255,255,255,.86);
}

/* =========================================================
   Podium
   ========================================================= */
.eld-podium{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.eld-podium-card{
  position: relative;
  overflow: hidden;

  border-radius: var(--eld-radius);
  background: linear-gradient(180deg, var(--eld-bg), var(--eld-bg2));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--eld-shadow);

  backdrop-filter: blur(10px);
  transform: translateZ(0); /* evita glitches */
}

/* top line highlight */
.eld-podium-card::after{
  content:"";
  position:absolute;
  left:18px; right:18px; top:0;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(255,235,200,.30), transparent);
  pointer-events:none;
}

/* tiers base borders */
.eld-podium-card.tier-champion{ border-color: rgba(255,255,255,.16); }
.eld-podium-card.tier-honored{ border-color: rgba(255,255,255,.14); }

/* rank row */
.eld-podium-rank{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  padding: 12px 14px 0;
  color: rgba(255,255,255,.80);
}

.eld-crown{
  font-size: 16px;
  filter: drop-shadow(0 0 10px rgba(177,147,67,.30));
}

.eld-medal{
  font-size: 14px;
  opacity: .85;
  color: rgba(255,255,255,.76);
}

/* medal title (replaces #2/#3) */
.eld-ranknum{
  margin-left: auto;
  font-family:"Cinzel", serif;
  letter-spacing:.10em;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(255,235,200,.90);
}

.eld-ranknum.medal-legend{
  color: rgba(255,235,200,1);
  text-shadow: 0 0 18px rgba(177,147,67,.22);
}

.eld-ranknum.medal-silver{
  color: rgba(230,235,255,.92);
  text-shadow: 0 0 18px rgba(180,190,220,.18);
}

.eld-ranknum.medal-bronze{
  color: rgba(243,223,207,.92);
  text-shadow: 0 0 18px rgba(180,140,100,.16);
}

.eld-podium-body{ padding: 12px 14px 14px; }

.eld-portrait{
  width:100%;
  height: 160px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.22);
  overflow:hidden;

  display:flex;
  align-items:center;
  justify-content:center;

  padding-top: 8px; /* mantenías esto al final */
}

.eld-portrait.noimg{ height: 110px; }

.eld-portrait img{
  width:100%;
  height:100%;
  display:block;
  object-fit: cover;
  object-position: center 92%;
}

.eld-podium-main{
  margin-top: 12px;
  display:grid;
  gap: 8px;
}

.eld-name,
.eld-name a{
  font-family:"Cinzel", serif;
  font-size: 18px;
  font-weight: 800;
  color: rgba(255,235,200,.95);
  text-decoration:none;
}

.eld-subline{
  color: rgba(255,255,255,.72);
  font-size: 12px;
  display:flex;
  gap: 10px;
  align-items:center;
  flex-wrap: wrap;
}

.eld-job{ display:inline-flex; gap: 8px; align-items:center; }
.eld-jobicon{ width: 18px; height: 18px; image-rendering: pixelated; }
.eld-sep{ opacity:.6; }

/* metrics */
.eld-metrics{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 8px;
}

.eld-m{
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  padding: 8px 8px;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.eld-ml{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 8px;

  color: rgba(255,255,255,.60);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .8;
}

.eld-mv{
  margin-top: 4px;
  font-size: 15px;
  font-weight: 800;
  color: rgba(255,235,200,.95);
}

.eld-ico{
  width: 14px;
  height: 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,235,200,.85);
  opacity: .95;
}
.eld-ico svg{ width: 14px; height: 14px; display:block; }

/* little boost for #1 */
.tier-legend .eld-ico{ color: rgba(255,235,200,1); }

.eld-guild,
.eld-guild a{
  color: rgba(255,255,255,.74);
  font-size: 12px;
  text-decoration:none;
}

.eld-emblem{
  width: 18px;
  height: 18px;
  vertical-align: middle;
  margin-right: 6px;
  border-radius: 4px;
}

.eld-podium-foot{
  padding: 12px 14px 14px;
  border-top: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.72);
}

.eld-title{
  font-family:"Cinzel", serif;
  letter-spacing:.06em;
  font-weight: 800;
  color: rgba(255,235,200,.95);
}

/* K/D text (as you had) */
.eld-kd{
  margin-top: 6px;
  font-size: 12px;
  letter-spacing: .08em;
  color: rgba(255,235,200,.9);
  text-align: left;
}
.tier-legend .eld-kd{
  color: rgba(255,235,200,1);
  font-weight: 800;
}

/* =========================================================
   Legendary Throne (Top #1) - single source of truth
   ========================================================= */
@keyframes eldLegendPulse{
  0%,100%{
    box-shadow:
      0 18px 60px rgba(0,0,0,.55),
      0 0 0 1px rgba(177,147,67,.16),
      0 0 24px rgba(177,147,67,.14);
  }
  50%{
    box-shadow:
      0 18px 60px rgba(0,0,0,.55),
      0 0 0 1px rgba(177,147,67,.24),
      0 0 56px rgba(177,147,67,.30);
  }
}

@keyframes eldSheen{
  0%   { transform: translateX(-140%) skewX(-18deg); opacity: 0; }
  10%  { opacity: .30; }
  35%  { opacity: 0; }
  100% { transform: translateX(140%) skewX(-18deg); opacity: 0; }
}

.eld-podium-card.tier-legend{
  border-color: rgba(177,147,67,.42);
  box-shadow:
    0 18px 60px rgba(0,0,0,.55),
    0 0 0 1px rgba(177,147,67,.16),
    0 0 46px rgba(177,147,67,.18);
  animation: eldLegendPulse 6.5s ease-in-out infinite;
}

/* runes + gradients */
.eld-podium-card.tier-legend::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(760px 280px at 18% 6%, rgba(177,147,67,.22), transparent 62%),
    radial-gradient(560px 240px at 82% 0%, rgba(255,235,200,.10), transparent 60%),
    repeating-linear-gradient(135deg, rgba(255,235,200,.035) 0 1px, transparent 1px 12px);
  opacity: .28;
}

/* sheen overlay */
.eld-podium-card.tier-legend::after{
  content:"";
  position:absolute;
  top:-10%;
  left:-30%;
  width: 60%;
  height: 140%;
  pointer-events:none;

  background: linear-gradient(90deg,
    transparent 0%,
    rgba(255,235,200,.08) 35%,
    rgba(255,235,200,.22) 50%,
    rgba(255,235,200,.08) 65%,
    transparent 100%);
  mix-blend-mode: screen;
  opacity: 0;
  animation: eldSheen 8.5s ease-in-out infinite;
}

/* portrait frame for #1 */
.eld-podium-card.tier-legend .eld-portrait{
  border-color: rgba(177,147,67,.40);
  box-shadow: 0 0 0 1px rgba(177,147,67,.12), 0 18px 55px rgba(0,0,0,.55);
}

/* =========================================================
   Table card
   ========================================================= */
.eld-table-card{
  border-radius: var(--eld-radius);
  background: linear-gradient(180deg, var(--eld-bg), var(--eld-bg2));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--eld-shadow);
  overflow:hidden;
  backdrop-filter: blur(10px);
}

.eld-table-head{
  padding: 14px 18px 12px;
  display:flex;
  justify-content:space-between;
  gap: 12px;
  align-items:flex-end;
}

.eld-table-title{
  font-family:"Cinzel", serif;
  font-size: 18px;
  font-weight: 800;
  color: rgba(255,255,255,.92);
}

.eld-table-note{ color: rgba(255,255,255,.60); font-size: 12px; }

.eld-table-scroll{
  overflow:auto;
  border-top: 1px solid rgba(255,255,255,.10);
}

.eld-table{
  width:100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
}

.eld-table th,
.eld-table td{
  padding: 12px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.82);
  font-size: 13px;
  background: transparent; /* evita “parches” */
}

.eld-table th{
  color: rgba(255,255,255,.64);
  font-size: 12px;
  letter-spacing:.08em;
  text-transform: uppercase;
}

.tc{ text-align:center; }

/* Row states painted on TD (consistent across browsers) */
.eld-table tbody tr:hover td{ background: rgba(255,255,255,.04); }

.eld-table tbody tr.tier-legend td{
  background: rgba(177,147,67,.08);
  color: rgba(255,235,200,.92);
}
.eld-table tbody tr.tier-champion td{ background: rgba(255,255,255,.03); }
.eld-table tbody tr.tier-honored  td{ background: rgba(255,255,255,.02); }

/* Character cell */
.eld-charcell{
  display:flex;
  align-items:center;
  gap: 10px;
}

.eld-miniport{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

.eld-miniport img{ width:100%; height:100%; object-fit: cover; display:block; }

/* Rank badge in table */
.eld-rank-badge{
  min-width: 30px;
  width: 30px;
  height: 30px;
  margin-right: 12px;

  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;

  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.35);
  color: rgba(255,255,255,.85);
}

.eld-rank-badge.tier-legend{
  background: linear-gradient(180deg, rgba(177,147,67,.55), rgba(0,0,0,.45));
  border-color: rgba(177,147,67,.6);
  color: rgba(255,235,200,1);
}

.eld-rank-badge.tier-champion{
  background: linear-gradient(180deg, rgba(180,180,200,.45), rgba(0,0,0,.45));
  border-color: rgba(200,200,220,.55);
  color: #eef;
}

.eld-rank-badge.tier-honored{
  background: linear-gradient(180deg, rgba(160,120,90,.45), rgba(0,0,0,.45));
  border-color: rgba(180,140,100,.55);
  color: #f3dfcf;
}

/* name/link inside table: prevent global theme overrides */
.eld-charname,
.eld-charname a{
  display:inline-flex;
  align-items:center;

  font-weight: 700;
  color: rgba(255,255,255,.92);
  text-decoration: none !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1.15;
  width: auto !important;
}

.eld-charname a:hover,
.eld-table td a:hover{ text-decoration: none; }

.eld-class{
  display:inline-flex;
  gap: 8px;
  align-items:center;
  justify-content:center;
}

.eld-pos{
  display:inline-flex;
  min-width: 34px;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.16);
}

.eld-na{ color: rgba(255,255,255,.45); }

/* =========================================================
   Responsive helpers
   ========================================================= */
.dn-md{ display: table-cell; }
.dn-sm{ display: inline; }

@media (max-width: 860px){
  .eld-podium{ grid-template-columns: 1fr; }
  .eld-table{ min-width: 640px; }
  .dn-md{ display: none; }
}
/* Fuerza al navegador/OS a preferir widgets oscuros */
:root{ color-scheme: dark; }

/* Tu select premium (cerrado) */
.eld-filter-select{
  background: rgba(0,0,0,.35) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

/* En Firefox suele aplicar a la lista */
@-moz-document url-prefix(){
  .eld-filter-select{
    background-color: rgba(0,0,0,.55) !important;
  }
  .eld-filter-select option{
    background-color: #0b0f14 !important;
    color: rgba(255,255,255,.92) !important;
  }
  .eld-filter-select option:checked{
    background-color: rgba(177,147,67,.35) !important;
    color: rgba(255,235,200,.95) !important;
  }
}

/* En Chromium a veces ayuda un poco (no siempre) */
.eld-filter-select option{
  background: #0b0f14;
  color: rgba(255,255,255,.92);
}
/* Fix: select “cortado” (Cinzel + controls nativos) */
.eld-filter-select{
  box-sizing: border-box;
  height: 44px;              /* ajusta 42–48 si quieres */
  padding: 0 38px 0 12px;    /* 38px para dejar espacio a la flecha */
  line-height: 42px;         /* centra el texto sin recortar */
  font-size: 14px;
  font-family: inherit;      /* o "Cinzel", serif si lo quieres aquí */
}

/* Si usas wrapper con flecha */
.eld-select-arrow{
  top: 50%;
  transform: translateY(-50%);
}
/* =========================
   GvG page small additions
   ========================= */

.eld-gvg .eld-chip{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.86);
  font-size: 12px;
  letter-spacing: .04em;
}

/* Fix select text cut */
.eld-gvg .eld-filter-select{
  box-sizing: border-box;
  height: 46px;
  padding: 0 38px 0 12px;
  line-height: 44px;
  font-size: 14px;
}

/* podium portrait fallback */
.eld-portrait-fallback{
  width: 100%;
  height: 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Cinzel", serif;
  font-weight: 800;
  letter-spacing: .08em;
  color: rgba(255,235,200,.90);
  text-shadow: 0 0 18px rgba(177,147,67,.18);
  background:
    radial-gradient(600px 240px at 50% 0%, rgba(177,147,67,.10), transparent 60%),
    repeating-linear-gradient(135deg, rgba(255,235,200,.03) 0 1px, transparent 1px 12px);
  border-radius: 12px;
}

/* make table compact on small screens */
@media (max-width: 860px){
  .eld-gvg .eld-table{ min-width: 720px; }
}
/* MVP small additions */
.eld-mvp .eld-chip{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.86);
  font-size: 12px;
  letter-spacing: .04em;
}

.eld-mvp .eld-filter-select{
  box-sizing: border-box;
  height: 46px;
  padding: 0 38px 0 12px;
  line-height: 44px;
  font-size: 14px;
}

.eld-mvp .eld-portrait-fallback{
  font-family:"Cinzel", serif;
  font-weight: 800;
  letter-spacing: .10em;
  color: rgba(255,235,200,.90);
  text-shadow: 0 0 18px rgba(177,147,67,.18);
}
/* ============================
   MVP PODIUM LAYOUT (1 / 2 3)
   ============================ */

.eld-podium--mvp{
  display:grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "one one"
    "two three";
}

.eld-podium--mvp .pos-1{ grid-area: one; }
.eld-podium--mvp .pos-2{ grid-area: two; }
.eld-podium--mvp .pos-3{ grid-area: three; }

/* #1 más “trono” */
.eld-podium--mvp .pos-1 .eld-portrait{
  height: 220px;
}
.eld-podium--mvp .pos-1 .eld-name,
.eld-podium--mvp .pos-1 .eld-name a{
  font-size: 22px;
}

/* #2 y #3 compactos */
.eld-podium--mvp .pos-2 .eld-portrait,
.eld-podium--mvp .pos-3 .eld-portrait{
  height: 160px;
}

/* ROChargen suele necesitar contain para no “cortar” sprites */
.eld-podium--mvp .eld-portrait img{
  object-fit: contain;
  object-position: center;
  padding: 10px;
}

/* Responsive */
@media (max-width: 860px){
  .eld-podium--mvp{
    grid-template-columns: 1fr;
    grid-template-areas:
      "one"
      "two"
      "three";
  }
}
/* =========================================
   ROCHARGEN FIX (MVP PODIUM) - no crop/zoom
   ========================================= */

.eld-mvp .eld-podium--mvp .eld-portrait{
  /* opcional: ajusta el “marco” */
  background: rgba(0,0,0,.18);
}

/* Fuerza contain y neutraliza overrides previos (cover / object-position 92%) */
.eld-mvp .eld-podium--mvp .eld-portrait img{
  width: 100% !important;
  height: 100% !important;

  object-fit: contain !important;
  object-position: center center !important;

  padding: 8px !important;          /* baja si quieres más grande */
  image-rendering: pixelated;
  transform: translateZ(0);
}

/* Alturas coherentes para que no se vea “vacío” */
.eld-mvp .eld-podium--mvp .pos-1 .eld-portrait{ height: 240px; }
.eld-mvp .eld-podium--mvp .pos-2 .eld-portrait{ height: 180px; }
.eld-mvp .eld-podium--mvp .pos-3 .eld-portrait{ height: 180px; }

/* Si aún te queda demasiado pequeño en #1, baja padding solo ahí */
.eld-mvp .eld-podium--mvp .pos-1 .eld-portrait img{
  padding: 4px !important;
}
.eld-mvp .eld-podium--mvp .eld-portrait::after{
  content:"";
  position:absolute;
  left: 14%;
  right: 14%;
  bottom: 14px;
  height: 18px;
  border-radius: 999px;
  background: radial-gradient(closest-side, rgba(177,147,67,.22), transparent 70%);
  pointer-events:none;
  filter: blur(0.2px);
  opacity: .9;
}
.eld-mvp .eld-podium--mvp .eld-portrait{ position:relative; }
/* =================================================
   MVP VANQUISHED (icons near the ROChargen player)
   ================================================= */

.eld-mvp .eld-portrait--mvp{
  position: relative;
  overflow: hidden;
}

/* ROChargen sprite always centered, no crop */
.eld-mvp .eld-portrait--mvp .eld-rochar{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 6px !important;
  image-rendering: pixelated;
  transform: translateZ(0);
}

/* container for “vanquished MVPs” */
.eld-mvp .eld-mvp-vanquished{
  position: absolute;
  left: 14px;
  bottom: 12px;
  display: flex;
  gap: 10px;
  align-items: flex-end;
  pointer-events: none;
}

/* each MVP “soul” */
.eld-mvp .eld-mvp-soul{
  position: relative;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  filter: drop-shadow(0 18px 30px rgba(0,0,0,.55));
  opacity: .92;

  /* the “ash fade” vibe */
  animation: eldAshFloat 6.8s ease-in-out infinite;
}

/* staggered motion */
.eld-mvp .eld-mvp-soul:nth-child(2){ animation-delay: -1.2s; transform: translateY(-6px); }
.eld-mvp .eld-mvp-soul:nth-child(3){ animation-delay: -2.1s; transform: translateY(-2px); }

/* MVP image */
.eld-mvp .eld-mvp-soul img{
  width: 36px;
  height: 36px;
  object-fit: contain;
  image-rendering: pixelated;

  /* looks like “defeated” */
  filter: grayscale(.25) contrast(1.05) brightness(.95);
  opacity: .92;
}

/* glow / dissolve overlay */
.eld-mvp .eld-mvp-soul::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(18px 18px at 30% 30%, rgba(255,235,200,.22), transparent 65%),
    radial-gradient(22px 22px at 70% 20%, rgba(177,147,67,.20), transparent 70%),
    repeating-linear-gradient(135deg, rgba(255,235,200,.05) 0 1px, transparent 1px 10px);
  opacity: .55;
  mix-blend-mode: screen;
  pointer-events:none;
}

/* subtle “slash” line to imply defeat */
.eld-mvp .eld-mvp-soul::after{
  content:"";
  position:absolute;
  left:-20%;
  top:52%;
  width: 140%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,235,200,.26), transparent);
  transform: rotate(-18deg);
  opacity: .65;
  pointer-events:none;
}

/* kill count badge */
.eld-mvp .eld-mvp-count{
  position:absolute;
  right: 7px;
  bottom: 6px;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: rgba(255,235,200,.95);
  text-shadow: 0 2px 12px rgba(0,0,0,.75);
}

/* float + ash fade */
@keyframes eldAshFloat{
  0%, 100% { transform: translateY(0); opacity: .90; }
  50%      { transform: translateY(-6px); opacity: .98; }
}

/* Optional: put them on the RIGHT instead of left */
.eld-mvp .eld-mvp-vanquished.is-right{
  left: auto;
  right: 14px;
}
.eld-mvp .eld-mvp-caption{
  position:absolute;
  left: 14px;
  bottom: 62px;
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.60);
  text-shadow: 0 10px 28px rgba(0,0,0,.75);
  pointer-events:none;
}
/* ===== MVP Podium: tighten top #1 (less empty space) ===== */

/* baja la altura del cuadro del sprite */
.eld-mvp .eld-podium--mvp .pos-1 .eld-portrait{ height: 180px !important; }

/* deja #2/#3 un poco más pequeños también */
.eld-mvp .eld-podium--mvp .pos-2 .eld-portrait,
.eld-mvp .eld-podium--mvp .pos-3 .eld-portrait{ height: 150px !important; }

/* hace que el sprite se vea más “grande” dentro del marco */
.eld-mvp .eld-portrait--mvp .eld-rochar{
  padding: 0px !important;          /* antes tenías padding alto */
  transform: scale(1.10);           /* agranda sin recortar */
  transform-origin: center bottom;  /* se “apoya” al piso */
}
/* souls más cerca del personaje y más arriba */
.eld-mvp .eld-mvp-vanquished{
  left: 18px !important;
  bottom: 20px !important;
  gap: 12px !important;
}

/* un poco más grandes para que se entiendan */
.eld-mvp .eld-mvp-soul{
  width: 52px !important;
  height: 52px !important;
  border-radius: 16px !important;
}
.eld-mvp .eld-mvp-soul img{
  width: 40px !important;
  height: 40px !important;
}
/* si te quedó el bloque viejo visible, escóndelo */
.eld-mvp .eld-mvp-trophies{ display:none !important; }
/* #1: layout más “hero” */
.eld-mvp .eld-podium--mvp .pos-1 .eld-podium-body{
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 14px;
  align-items: center;
}

.eld-mvp .eld-podium--mvp .pos-1 .eld-portrait{
  order: 2;
}

.eld-mvp .eld-podium--mvp .pos-1 .eld-podium-main{
  order: 1;
}
/* =========================
   MVP Podium compact + hero
   ========================= */

/* Estructura base (evita aire por padding mal puesto) */
.eld-mvp .eld-podium-body{
  padding: 12px 14px 14px; /* más compacto que antes */
  display: grid;
  gap: 12px;
}

/* Portrait no tan alto, sprite más protagonista */
.eld-mvp .eld-portrait--mvp{
  position: relative;
  height: 170px;               /* baja el “vacío” */
  border-radius: 14px;
}

.eld-mvp .eld-portrait--mvp .eld-rochar{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  padding: 0px !important;
  transform: scale(1.08);      /* más presencia */
  transform-origin: center bottom;
  image-rendering: pixelated;
}

/* #1 más “hero”: dos columnas (info + sprite) */
.eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
  grid-template-columns: 1.1fr 0.9fr;
  align-items: center;
}

.eld-mvp .eld-podium-card.pos-1 .eld-podium-main{ order: 1; }
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{ order: 2; height: 190px; }

/* #2/#3 más compactos */
.eld-mvp .eld-podium-card.pos-2 .eld-portrait--mvp,
.eld-mvp .eld-podium-card.pos-3 .eld-portrait--mvp{
  height: 150px;
}

/* Souls pegados al sprite (no a la esquina) */
.eld-mvp .eld-mvp-vanquished{
  position: absolute;
  left: 12px;
  bottom: 12px;
  display: flex;
  gap: 10px;
  align-items: flex-end;
  pointer-events: none;
}

/* tamaño y presencia */
.eld-mvp .eld-mvp-soul{
  width: 52px;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  opacity: .92;
  filter: drop-shadow(0 18px 30px rgba(0,0,0,.55));
  animation: eldAshFloat 6.8s ease-in-out infinite;
}
.eld-mvp .eld-mvp-soul:nth-child(2){ animation-delay: -1.2s; transform: translateY(-6px); }
.eld-mvp .eld-mvp-soul:nth-child(3){ animation-delay: -2.1s; transform: translateY(-2px); }

.eld-mvp .eld-mvp-soul img{
  width: 40px;
  height: 40px;
  object-fit: contain;
  image-rendering: pixelated;
  filter: grayscale(.25) contrast(1.05) brightness(.95);
  opacity: .92;
}

.eld-mvp .eld-mvp-count{
  position:absolute;
  right: 7px;
  bottom: 6px;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: rgba(255,235,200,.95);
  text-shadow: 0 2px 12px rgba(0,0,0,.75);
}

@keyframes eldAshFloat{
  0%, 100% { transform: translateY(0); opacity: .90; }
  50%      { transform: translateY(-6px); opacity: .98; }
}

/* Mobile: vuelve a 1 columna */
@media (max-width: 860px){
  .eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
    grid-template-columns: 1fr;
  }
  .eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
    order: 1;
    height: 180px;
  }
  .eld-mvp .eld-podium-card.pos-1 .eld-podium-main{
    order: 2;
  }
}
/* =========================
   FIX: espacio vacío LEGEND
   ========================= */

/* El card #1 no debe estirarse a todo el grid */
.eld-mvp .eld-podium-card.pos-1{
  max-width: 980px;          /* controla el ancho */
  margin: 0 auto;            /* lo centra */
}

/* El body del #1 no debe crecer de más */
.eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
  grid-template-columns: 1fr 420px; /* texto | sprite */
  justify-content: center;
}
/* centra el sprite dentro del marco */
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ajusta el sprite */
.eld-mvp .eld-podium-card.pos-1 .eld-rochar{
  transform: scale(1.1);
}
/* souls más integrados al personaje */
.eld-mvp .eld-podium-card.pos-1 .eld-mvp-vanquished{
  left: 22%;
  bottom: 18px;
}
.eld-mvp .eld-podium-card.pos-1 .eld-mvp-soul{
  filter: drop-shadow(0 0 18px rgba(255,190,90,.35));
}
/* =========================================================
   ELDENRO PREMIUM UPGRADES (Legend card)
   - Slash mark
   - Subtle animated background
   - Ash souls (dissolve shimmer)
   ========================================================= */

/* --- 1) Background animated "embers" (super subtle) --- */
@keyframes eldEmbersDrift {
  0%   { transform: translate3d(-2%, -1%, 0); opacity: .22; }
  50%  { transform: translate3d( 2%,  1%, 0); opacity: .30; }
  100% { transform: translate3d(-2%, -1%, 0); opacity: .22; }
}

/* solo para el #1 */
.eld-mvp .eld-podium-card.pos-1{
  max-width: 980px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

/* capa animada de fondo */
.eld-mvp .eld-podium-card.pos-1::before{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:
    radial-gradient(420px 220px at 22% 18%, rgba(177,147,67,.18), transparent 60%),
    radial-gradient(520px 260px at 78% 10%, rgba(255,235,200,.10), transparent 60%),
    repeating-linear-gradient(135deg, rgba(255,235,200,.03) 0 1px, transparent 1px 14px);
  opacity: .28;
  mix-blend-mode: screen;
  animation: eldEmbersDrift 10.5s ease-in-out infinite;
}

/* --- 2) Slash mark behind the sprite (execution vibe) --- */
@keyframes eldSlashShimmer {
  0%,100% { opacity: .12; transform: translateX(-10px) rotate(-16deg); }
  50%     { opacity: .22; transform: translateX( 10px) rotate(-16deg); }
}

/* slash dentro del marco del portrait */
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp::before{
  content:"";
  position:absolute;
  left:-20%;
  top: 58%;
  width: 140%;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(255,235,200,.10) 25%,
    rgba(177,147,67,.28) 50%,
    rgba(255,235,200,.10) 75%,
    transparent 100%);
  transform: rotate(-16deg);
  filter: blur(.2px);
  opacity: .16;
  pointer-events:none;
  animation: eldSlashShimmer 6.5s ease-in-out infinite;
}

/* --- 3) Hero layout polish (no empty space) --- */
.eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
  display:grid;
  grid-template-columns: 1fr 420px; /* texto | portrait */
  gap: 14px;
  align-items: center;
}

/* portrait más compacto y centrado */
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
  height: 190px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}

.eld-mvp .eld-podium-card.pos-1 .eld-rochar{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  padding: 0 !important;
  transform: scale(1.12);
  transform-origin: center bottom;
  image-rendering: pixelated;
}

/* --- 4) Ash Souls: dissolve + shimmer + “defeated” --- */
@keyframes eldAshPulse{
  0%,100% { opacity: .88; transform: translateY(0); }
  50%     { opacity: 1;    transform: translateY(-6px); }
}

@keyframes eldAshSheen{
  0%   { transform: translateX(-140%) skewX(-18deg); opacity: 0; }
  12%  { opacity: .25; }
  35%  { opacity: 0; }
  100% { transform: translateX(140%) skewX(-18deg); opacity: 0; }
}

.eld-mvp .eld-podium-card.pos-1 .eld-mvp-vanquished{
  left: 24%;
  bottom: 16px;
  gap: 12px;
}

.eld-mvp .eld-mvp-soul{
  position:relative;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  overflow:hidden;
  animation: eldAshPulse 6.8s ease-in-out infinite;
}

/* brillo que cruza (shimmer) */
.eld-mvp .eld-mvp-soul::after{
  content:"";
  position:absolute;
  inset:-2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(255,235,200,.08) 35%,
    rgba(255,235,200,.22) 50%,
    rgba(255,235,200,.08) 65%,
    transparent 100%);
  mix-blend-mode: screen;
  opacity: 0;
  animation: eldAshSheen 8.5s ease-in-out infinite;
  pointer-events:none;
}

/* textura “ceniza/runa” */
.eld-mvp .eld-mvp-soul::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(18px 18px at 30% 30%, rgba(255,235,200,.18), transparent 65%),
    repeating-linear-gradient(135deg, rgba(255,235,200,.03) 0 1px, transparent 1px 12px);
  opacity: .55;
  mix-blend-mode: screen;
  pointer-events:none;
}

/* el mob se ve “derrotado” */
.eld-mvp .eld-mvp-soul img{
  filter: grayscale(.35) contrast(1.05) brightness(.92);
  opacity: .92;
}

/* “ejecutado” (slash line sutil) */
.eld-mvp .eld-mvp-soul i,
.eld-mvp .eld-mvp-count{
  text-shadow: 0 2px 12px rgba(0,0,0,.75);
}

/* etiqueta opcional */
.eld-mvp .eld-vanq-label{
  position:absolute;
  left: 18px;
  top: 14px;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.60);
  text-shadow: 0 10px 28px rgba(0,0,0,.75);
  pointer-events:none;
}

/* responsive */
@media (max-width: 860px){
  .eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
    grid-template-columns: 1fr;
  }
  .eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
    height: 180px;
  }
  .eld-mvp .eld-podium-card.pos-1 .eld-mvp-vanquished{
    left: 14px;
    bottom: 12px;
  }
}
.eld-mvp .eld-podium-card.pos-1{
  box-shadow:
    0 18px 60px rgba(0,0,0,.55),
    0 0 0 1px rgba(177,147,67,.18),
    0 0 42px rgba(177,147,67,.14);
}
/* Compacta el hero card del #1 */
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
  height: 160px;   /* antes 190 */
  padding-top: 8px;
  padding-bottom: 6px;
}

.eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
  gap: 10px;       /* antes 14 */
}
/* Souls más cerca del jugador */
.eld-mvp .eld-podium-card.pos-1 .eld-mvp-vanquished{
  left: 38%;      /* antes ~24% */
  bottom: 12px;   /* más pegado al suelo */
}
/* MVP principal más grande */
.eld-mvp .eld-mvp-soul:first-child{
  transform: scale(1.15);
  border-color: rgba(177,147,67,.45);
}

/* secundarios más débiles */
.eld-mvp .eld-mvp-soul:not(:first-child){
  opacity: .85;
  filter: grayscale(.45);
}
/* Execution shadow under legend */
.eld-mvp .eld-podium-card.pos-1 .eld-rochar{
  filter: drop-shadow(0 22px 18px rgba(0,0,0,.65));
}
.eld-vanq-label{
  font-family: "Cinzel", serif;
  letter-spacing: .18em;
  opacity: .55;
}
/* Label más arriba, más fino, y sin estorbar */
.eld-mvp .eld-vanq-label{
  left: auto !important;
  right: 18px !important;
  top: -25px !important;
  opacity: .45 !important;
  font-size: 10px !important;
  letter-spacing: .22em !important;
}
@keyframes eldCardEnter{
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Solo el podio para que no afecte tablas */
.eld-mvp .eld-podium-card{
  animation: eldCardEnter .55s ease-out both;
}

/* Delay escalonado */
.eld-mvp .eld-podium-card.pos-1{ animation-delay: .05s; }
.eld-mvp .eld-podium-card.pos-2{ animation-delay: .12s; }
.eld-mvp .eld-podium-card.pos-3{ animation-delay: .18s; }
/* =========================
   ROChargen bigger / bolder
   ========================= */

/* Base: todos un poco más grandes */
.eld-mvp .eld-portrait--mvp .eld-rochar{
  transform: scale(1.25) !important;     /* antes ~1.10 */
  transform-origin: center bottom !important;
}

/* El #1 aún más protagonista */
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp .eld-rochar{
  transform: scale(1.38) !important;
}

/* Si te queda cortado por arriba, dale un poquito más de altura al marco */
.eld-mvp .eld-portrait--mvp{ height: 175px !important; }
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{ height: 190px !important; }

/* Lo “apoya” mejor en el suelo */
.eld-mvp .eld-portrait--mvp .eld-rochar{
  object-position: 55% 92% !important;  /* un poquito más abajo */
}

/* Opcional: más nitidez/presencia sin neon */
.eld-mvp .eld-portrait--mvp .eld-rochar{
  filter: drop-shadow(0 22px 18px rgba(0,0,0,.65)) contrast(1.03) saturate(1.02);
}
@keyframes eldRoPop{
  from { transform: scale(1.22); opacity: .0; }
  to   { transform: scale(1.38); opacity: 1; }
}
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp .eld-rochar{
  animation: eldRoPop .65s ease-out both;
}
/* =========================================================
   FINAL OVERRIDES (MVP) - single source of truth
   Pegar al FINAL del CSS para evitar conflictos.
   ========================================================= */

/* Podio 1 / (2 3) */
.eld-mvp .eld-podium--mvp{
  display:grid !important;
  gap: 12px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-areas:
    "one one"
    "two three" !important;
}
.eld-mvp .eld-podium--mvp .pos-1{ grid-area: one; }
.eld-mvp .eld-podium--mvp .pos-2{ grid-area: two; }
.eld-mvp .eld-podium--mvp .pos-3{ grid-area: three; }

/* Hero card #1 centrado, sin aire */
.eld-mvp .eld-podium-card.pos-1{
  max-width: 980px !important;
  margin: 0 auto !important;
}

/* Layout interno del #1: texto + portrait */
.eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
  display: grid !important;
  grid-template-columns: 1fr 420px !important;
  gap: 12px !important;
  align-items: center !important;
}

/* Portrait sizes */
.eld-mvp .eld-portrait--mvp{
  position: relative !important;
  height: 165px !important;            /* base 2/3 */
  padding: 0 !important;               /* corta el aire */
}
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
  height: 185px !important;            /* hero */
}

/* ROChargen: grande, apoyado abajo, sin crop */
.eld-mvp .eld-portrait--mvp .eld-rochar{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: 50% 92% !important; /* “piso” */
  padding: 0 !important;

  transform-origin: center bottom !important;
  transform: scale(1.26) !important;   /* tamaño general */
  image-rendering: pixelated;
  filter: drop-shadow(0 22px 18px rgba(0,0,0,.65)) contrast(1.03) saturate(1.02);
}
.eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp .eld-rochar{
  transform: scale(1.40) !important;   /* tamaño #1 */
}

/* Vanquished: pegados al sprite */
.eld-mvp .eld-mvp-vanquished{
  left: 16px !important;
  bottom: 12px !important;
  gap: 12px !important;
}
.eld-mvp .eld-mvp-soul{
  width: 54px !important;
  height: 54px !important;
  border-radius: 16px !important;
}
.eld-mvp .eld-mvp-soul img{
  width: 42px !important;
  height: 42px !important;
}

/* Mobile: 1 columna */
@media (max-width: 860px){
  .eld-mvp .eld-podium--mvp{
    grid-template-columns: 1fr !important;
    grid-template-areas: "one" "two" "three" !important;
  }
  .eld-mvp .eld-podium-card.pos-1 .eld-podium-body{
    grid-template-columns: 1fr !important;
  }
  .eld-mvp .eld-podium-card.pos-1 .eld-portrait--mvp{
    height: 180px !important;
  }
}
/* =========================
   ZENY small additions
   ========================= */

.eld-zeny .eld-zeny{
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(255,235,200,.95);
  text-shadow: 0 0 18px rgba(177,147,67,.18);
}

.eld-zeny .eld-portrait--zeny .eld-rochar{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  padding: 0 !important;

  transform: scale(1.18);
  transform-origin: center bottom;
  image-rendering: pixelated;

  filter: drop-shadow(0 22px 18px rgba(0,0,0,.65));
}

.eld-zeny .pos-1 .eld-portrait--zeny .eld-rochar{
  transform: scale(1.30);
}
/* =========================
   ZENY EMBLEM (HEADER)
   ========================= */
.eld-zeny-emblem{
  position:absolute;
  right: 22px;
  top: 18px;
  width: 64px;
  height: 64px;
  opacity: .85;
  pointer-events:none;

  filter:
    drop-shadow(0 0 12px rgba(255,215,120,.45))
    drop-shadow(0 0 32px rgba(177,147,67,.25));
}

.eld-zeny-emblem img{
  width:100%;
  height:100%;
  object-fit:contain;
  image-rendering: pixelated;
}
/* =========================
   ZENY LEGEND AURA
   ========================= */

.eld-zeny .pos-1{
  position: relative;
}

.eld-zeny .pos-1::after{
  content:"";
  position:absolute;
  inset:-12%;
  pointer-events:none;

  background:
    radial-gradient(420px 220px at 50% 15%, rgba(255,215,120,.22), transparent 60%),
    radial-gradient(600px 300px at 50% 0%, rgba(177,147,67,.18), transparent 65%);

  mix-blend-mode: screen;
  opacity: .85;
}
/* =========================
   FLOATING ZENY COINS
   ========================= */

@keyframes eldCoinFloat{
  0%,100%{ transform: translateY(0) rotate(0deg); opacity:.75; }
  50%{ transform: translateY(-10px) rotate(6deg); opacity:1; }
}

.eld-zeny-coins{
  position:absolute;
  left: 18%;
  bottom: 16px;
  display:flex;
  gap: 10px;
  pointer-events:none;
}

.eld-zeny-coins span{
  width: 40px;
  height: 40px;
  background: url("https://www.divine-pride.net/img/items/collection/iRO/31091") no-repeat center / contain;
  image-rendering: pixelated;

  filter:
    drop-shadow(0 0 10px rgba(255,215,120,.45))
    drop-shadow(0 12px 22px rgba(0,0,0,.65));

  animation: eldCoinFloat 6.5s ease-in-out infinite;
}

.eld-zeny-coins span:nth-child(2){
  animation-delay:-1.4s;
  transform: translateY(-6px);
}
.eld-zeny-coins span:nth-child(3){
  animation-delay:-2.6s;
  transform: translateY(-2px);
}
/* =========================
   ZENY NUMBERS POWER
   ========================= */

.eld-zeny{
  font-weight: 900;
  font-size: 15px;
  color: rgba(255,235,200,.95);
  text-shadow:
    0 0 18px rgba(177,147,67,.22),
    0 2px 12px rgba(0,0,0,.75);
}

.eld-table tbody tr.tier-legend .eld-zeny{
  font-size: 16px;
  color: rgba(255,215,120,1);
}
/* =========================================================
   ZENY RANKING – Premium skin (podium + coins + aura)
   ========================================================= */

/* Podium layout 1 / (2 3) */
.eld-podium--zeny{
  display:grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "one one"
    "two three";
}
.eld-podium--zeny .pos-1{ grid-area: one; }
.eld-podium--zeny .pos-2{ grid-area: two; }
.eld-podium--zeny .pos-3{ grid-area: three; }

@media (max-width: 860px){
  .eld-podium--zeny{
    grid-template-columns: 1fr;
    grid-template-areas:
      "one"
      "two"
      "three";
  }
}

/* Header emblem (you already added the HTML) */
.eld-zeny .eld-zeny-emblem{
  position:absolute;
  right: 22px;
  top: 18px;
  width: 64px;
  height: 64px;
  opacity: .90;
  pointer-events:none;
  filter:
    drop-shadow(0 0 12px rgba(255,215,120,.45))
    drop-shadow(0 0 36px rgba(177,147,67,.25));
}
.eld-zeny .eld-zeny-emblem img{
  width:100%;
  height:100%;
  object-fit:contain;
  image-rendering: pixelated;
}

/* Portrait as "treasure frame" */
.eld-zeny .eld-portrait--zeny{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(520px 180px at 50% 0%, rgba(177,147,67,.12), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.12));
}

/* Make ROChargen bigger without crop */
.eld-zeny .eld-portrait--zeny .eld-rochar{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  padding: 0 !important;
  transform: scale(1.20);
  transform-origin: center bottom;
  image-rendering: pixelated;
  filter: drop-shadow(0 22px 18px rgba(0,0,0,.65));
}

/* Heights (avoid too much empty space) */
.eld-zeny .pos-1 .eld-portrait--zeny{ height: 190px; }
.eld-zeny .pos-2 .eld-portrait--zeny,
.eld-zeny .pos-3 .eld-portrait--zeny{ height: 150px; }

/* Top #1: hero layout (text | portrait) like MVP */
.eld-zeny .pos-1 .eld-podium-body{
  display:grid;
  grid-template-columns: 1fr 420px;
  gap: 14px;
  align-items: center;
}
@media (max-width: 860px){
  .eld-zeny .pos-1 .eld-podium-body{
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   Coins floating (uses Divine Pride 31091)
   ========================================================= */

@keyframes eldCoinFloat{
  0%,100%{ transform: translateY(0) rotate(0deg); opacity:.70; }
  50%{ transform: translateY(-10px) rotate(6deg); opacity:1; }
}

.eld-zeny .eld-zeny-coins{
  position:absolute;
  left: 14px;
  bottom: 12px;
  display:flex;
  gap: 10px;
  align-items:flex-end;
  pointer-events:none;
}

.eld-zeny .eld-zeny-coins span{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    rgba(0,0,0,.22)
    url("https://www.divine-pride.net/img/items/collection/iRO/31091") no-repeat center / contain;
  image-rendering: pixelated;

  filter:
    drop-shadow(0 0 10px rgba(255,215,120,.35))
    drop-shadow(0 18px 30px rgba(0,0,0,.55));

  animation: eldCoinFloat 6.5s ease-in-out infinite;
}

.eld-zeny .eld-zeny-coins span:nth-child(2){
  animation-delay:-1.4s;
  transform: translateY(-6px);
  opacity: .85;
}
.eld-zeny .eld-zeny-coins span:nth-child(3){
  animation-delay:-2.6s;
  transform: translateY(-2px);
  opacity: .78;
}

/* =========================================================
   Richest aura (#1)
   ========================================================= */

@keyframes eldGoldPulse{
  0%,100%{ opacity: .18; transform: translate3d(-1%, -1%, 0); }
  50%{ opacity: .30; transform: translate3d(1%, 1%, 0); }
}

.eld-zeny .pos-1{
  position: relative;
}

.eld-zeny .pos-1::before{
  content:"";
  position:absolute;
  inset:-18%;
  pointer-events:none;
  background:
    radial-gradient(480px 220px at 50% 10%, rgba(255,215,120,.18), transparent 62%),
    radial-gradient(620px 320px at 50% 0%, rgba(177,147,67,.16), transparent 66%),
    repeating-linear-gradient(135deg, rgba(255,235,200,.02) 0 1px, transparent 1px 14px);
  mix-blend-mode: screen;
  animation: eldGoldPulse 10.5s ease-in-out infinite;
}

/* Zeny number looks heavier */
.eld-zeny .eld-zeny{
  font-weight: 900;
  color: rgba(255,235,200,.95);
  text-shadow:
    0 0 18px rgba(177,147,67,.22),
    0 2px 12px rgba(0,0,0,.75);
}
.eld-zeny .tier-legend .eld-zeny{
  color: rgba(255,215,120,1);
}
/* --- ZENY COINS: fix "postcard" look --- */
.eld-zeny .eld-zeny-coins span{
  width: 46px;
  height: 46px;
  border-radius: 999px; /* círculo => token */
  border: 1px solid rgba(177,147,67,.35);

  /* “corta” el blanco: más zoom y máscara radial */
  background:
    radial-gradient(circle at 50% 50%, rgba(0,0,0,0) 58%, rgba(0,0,0,.70) 78%, rgba(0,0,0,.95) 100%),
    url("https://www.divine-pride.net/img/items/collection/iRO/31091") no-repeat center / 190%;

  box-shadow:
    0 0 0 1px rgba(0,0,0,.55) inset,
    0 10px 24px rgba(0,0,0,.55),
    0 0 16px rgba(177,147,67,.18);

  overflow: hidden;
  opacity: .95;
}

/* un brillo tipo “moneda” */
.eld-zeny .eld-zeny-coins span::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  background: linear-gradient(135deg,
    rgba(255,235,200,.22),
    transparent 45%,
    rgba(177,147,67,.16));
  mix-blend-mode: screen;
  opacity: .65;
  pointer-events:none;
}

/* quita el look de “tarjeta” */
.eld-zeny .eld-zeny-coins span{
  position:relative;
}
.eld-zeny .eld-zeny-coins span:nth-child(1){ background-size: 200%; background-position: 42% 55%; }
.eld-zeny .eld-zeny-coins span:nth-child(2){ background-size: 210%; background-position: 58% 50%; }
.eld-zeny .eld-zeny-coins span:nth-child(3){ background-size: 195%; background-position: 50% 62%; opacity:.85; }
/* =========================
   ZENY COINS (use item icon)
   ========================= */

.eld-zeny .eld-zeny-coins{
  position:absolute;
  left: 18px;
  bottom: 18px;
  display:flex;
  gap: 10px;
  align-items:flex-end;
  pointer-events:none;
}

.eld-zeny .eld-zeny-coins span{
  width: 52px;
  height: 52px;
  border-radius: 999px;
  border: 1px solid rgba(177,147,67,.35);
  background: rgba(0,0,0,.18);

  /* ICON */
  background-image: url("https://www.divine-pride.net/img/items/item/iRO/31091");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 86%;

  box-shadow:
    0 0 0 1px rgba(0,0,0,.55) inset,
    0 14px 28px rgba(0,0,0,.55),
    0 0 18px rgba(177,147,67,.16);

  filter: saturate(1.05) contrast(1.04);
  opacity: .95;
  transform: translateZ(0);
}

/* Variación (se siente "stack") */
.eld-zeny .eld-zeny-coins span:nth-child(1){ transform: translateY(2px) scale(1.08); }
.eld-zeny .eld-zeny-coins span:nth-child(2){ opacity:.90; }
.eld-zeny .eld-zeny-coins span:nth-child(3){ opacity:.82; transform: translateY(4px) scale(.98); }

/* Brillo premium */
.eld-zeny .eld-zeny-coins span::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  background: radial-gradient(circle at 30% 25%, rgba(255,235,200,.22), transparent 55%);
  mix-blend-mode: screen;
  pointer-events:none;
}

/* Animación muy sutil */
@keyframes eldCoinFloat{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-4px); }
}
.eld-zeny .eld-zeny-coins span{
  position: relative;
  animation: eldCoinFloat 7.5s ease-in-out infinite;
}
.eld-zeny .eld-zeny-coins span:nth-child(2){ animation-delay: -1.2s; }
.eld-zeny .eld-zeny-coins span:nth-child(3){ animation-delay: -2.2s; }
@keyframes eldGoldDust{
  0%,100%{ opacity:.10; transform: translateY(0); }
  50%{ opacity:.18; transform: translateY(10px); }
}

.eld-zeny .eld-podium-card.pos-1 .eld-portrait--zeny::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(2px 2px at 18% 22%, rgba(255,235,200,.55), transparent 60%),
    radial-gradient(2px 2px at 42% 18%, rgba(177,147,67,.55), transparent 60%),
    radial-gradient(2px 2px at 66% 28%, rgba(255,235,200,.45), transparent 60%),
    radial-gradient(2px 2px at 82% 20%, rgba(177,147,67,.45), transparent 60%);
  animation: eldGoldDust 6.8s ease-in-out infinite;
  opacity:.14;
}
/* fallback cuando falla ROChargen */
.eld-portrait .eld-rochar.is-fallback{
  object-fit: contain !important;
  padding: 18px !important;
  transform: none !important;
  image-rendering: auto !important;
}
.eld-zeny .eld-portrait--zeny{
  position: relative;
  overflow: hidden;
}
/* =========================
   ZENY: premium wealth aura
   ========================= */

/* Header emblem: que parezca “sigilo” */
.eld-zeny .eld-zeny-emblem{
  position:absolute;
  right: 18px;
  top: 14px;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  border: 1px solid rgba(177,147,67,.28);
  background: rgba(0,0,0,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:
    0 16px 40px rgba(0,0,0,.45),
    0 0 0 1px rgba(177,147,67,.10);
}

.eld-zeny .eld-zeny-emblem img{
  width: 44px;
  height: 44px;
  object-fit: contain;
  image-rendering: pixelated;
  filter: drop-shadow(0 10px 18px rgba(177,147,67,.18));
  opacity: .95;
}

/* Portrait container */
.eld-zeny .eld-portrait--zeny{
  position: relative;
  overflow: hidden;
}

/* Aura: polvo dorado + “sparkles” (sin repetir imágenes feas) */
.eld-zeny .eld-zeny-aura{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity: .85;
  background:
    radial-gradient(240px 90px at 18% 82%, rgba(177,147,67,.22), transparent 70%),
    radial-gradient(220px 80px at 38% 90%, rgba(255,235,200,.12), transparent 70%),
    radial-gradient(300px 120px at 65% 86%, rgba(177,147,67,.16), transparent 72%),
    radial-gradient(6px 6px at 16% 74%, rgba(255,235,200,.55), transparent 60%),
    radial-gradient(5px 5px at 27% 66%, rgba(255,235,200,.35), transparent 60%),
    radial-gradient(4px 4px at 44% 78%, rgba(255,235,200,.30), transparent 60%),
    radial-gradient(5px 5px at 58% 70%, rgba(255,235,200,.40), transparent 60%),
    radial-gradient(4px 4px at 72% 76%, rgba(255,235,200,.28), transparent 60%),
    radial-gradient(5px 5px at 82% 68%, rgba(255,235,200,.35), transparent 60%);
  mix-blend-mode: screen;
  filter: blur(.2px);
  animation: eldZenyShimmer 7.5s ease-in-out infinite;
}

@keyframes eldZenyShimmer{
  0%,100% { transform: translateY(0); opacity: .72; }
  50%     { transform: translateY(-4px); opacity: .92; }
}

/* Un “haz” sutil para el Legend */
.eld-zeny .eld-podium-card.pos-1 .eld-portrait--zeny::before{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:
    conic-gradient(from 210deg at 70% 60%,
      transparent 0 40%,
      rgba(255,235,200,.08) 46%,
      rgba(177,147,67,.18) 52%,
      rgba(255,235,200,.06) 58%,
      transparent 64% 100%);
  opacity: .55;
  mix-blend-mode: screen;
  animation: eldZenyBeam 9s ease-in-out infinite;
}

@keyframes eldZenyBeam{
  0%,100% { transform: rotate(-2deg) translateX(0); opacity: .32; }
  50%     { transform: rotate( 2deg) translateX(-8px); opacity: .55; }
}

/* Zeny value: más “oro” */
.eld-zeny .eld-metrics .eld-m:first-child .eld-mv{
  text-shadow: 0 0 18px rgba(177,147,67,.18);
}
.eld-zeny .eld-zeny-stamp{
  position:absolute;
  left: 10%;
  bottom: -10px;
  width: 120px;
  height: 120px;
  object-fit: contain;
  opacity: .10;
  filter: blur(.2px) drop-shadow(0 18px 40px rgba(177,147,67,.12));
  pointer-events:none;
}
.eld-zeny .eld-podium-card.pos-1 .eld-zeny-stamp{
  width: 150px;
  height: 150px;
  opacity: .14;
}