@font-face{font-family:"GenshinImpact";src:url("fonts/Genshin.woff2") format("woff2");font-display:swap}


/* Vars + Base */

:root{
  --bg:#0f1115; --panel:#171a21; --panel-2:#1c2028; --text:#e6e9ef; --muted:#c8cfdd;
  --accent:#cbb5ff; --green:#27c93f; --blue:#3b82f6; --red:#ef4444; --outline:#2a3040;
  --shadow:0 10px 30px rgba(0,0,0,.35); --radius:16px;

  /* brillo dorado sutil usado alrededor del marco png */
  --sparkle:
    radial-gradient(6px 6px at 20% 30%, rgba(255,232,170,.8), transparent 60%),
    radial-gradient(5px 5px at 80% 65%, rgba(255,210,120,.75), transparent 60%),
    radial-gradient(4px 4px at 60% 20%, rgba(255,255,255,.85), transparent 60%);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:"GenshinImpact",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.45;overflow-x:hidden}
.pv-fore{position:relative;z-index:2}


/* BG */

.pv-bg-wrap{position:fixed;inset:0;z-index:0;overflow:hidden}
.pv-bg-video{position:absolute;width:100%;height:100%;top:0;left:0;object-fit:cover;filter:blur(1px) saturate(110%)}
.pv-bg-slideshow{display:none}
.pv-bg-slideshow.active{display:block;position:absolute;inset:0;background-size:cover;background-position:center;animation:pv-crossfade 7s linear infinite;filter:blur(1px) saturate(110%)}
@keyframes pv-crossfade{0%{opacity:.85}50%{opacity:1}100%{opacity:.85}}
.pv-bg-overlay{position:absolute;inset:0;z-index:1;background:radial-gradient(1200px 700px at 50% -10%,rgba(84,56,140,.28),rgba(15,17,21,.68));mix-blend-mode:soft-light}


/* Navbar */

.pv-navbar{position:sticky;top:0;background:rgba(15,17,21,.72);backdrop-filter:blur(10px);border-bottom:1px solid var(--outline);z-index:10}
.pv-glow-line{height:2px;width:100%;background:linear-gradient(90deg,transparent,rgba(167,139,250,.9),transparent);filter:blur(1px);animation:pv-sheen 3.5s linear infinite}
@keyframes pv-sheen{0%{opacity:.25}50%{opacity:.65}100%{opacity:.25}}

.pv-nav{max-width:1200px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:12px;position:relative}
.pv-nav-left,.pv-nav-right{display:flex;align-items:center;gap:12px;flex:1 1 0}
.pv-nav-left{justify-content:flex-start;flex-wrap:wrap}
.pv-nav-right{justify-content:flex-end}
.pv-brand{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;pointer-events:auto}
.pv-logo{letter-spacing:2px;font-weight:700;text-decoration:none;color:#fff;text-shadow:0 0 24px rgba(167,139,250,.45),0 0 6px rgba(167,139,250,.35)}

.pv-link{color:var(--text);text-decoration:none;padding:10px 14px;border-radius:999px;border:1px solid transparent}
.pv-link:hover{border-color:var(--outline);background:var(--panel)}


/* Botones */

.pv-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:12px;padding:12px 18px;font-size:16px;cursor:pointer;text-decoration:none;box-shadow:var(--shadow);transition:transform .06s ease,filter .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;user-select:none}
.pv-btn .ico,.pv-btn .g-ico{width:18px;height:18px;display:inline-block}
.pv-btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.pv-btn:active{transform:translateY(0);filter:brightness(.98)}
.pv-btn-green{background:var(--green);color:#0a0a0a}
.pv-btn-blue{background:var(--blue);color:#f8fafc}
.pv-btn-red{background:var(--red);color:#fff}
.pv-btn-outline{background:rgba(0,0,0,.15);color:var(--text);border-color:var(--outline)}
.pv-btn-outline:hover{background:var(--panel)}
.pv-btn-google{position:relative;background:#0f1115;color:#f6f7fb;border-radius:999px;padding:10px 16px;border:1px solid rgba(203,181,255,.35);box-shadow:0 6px 16px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.05)}
.pv-btn-google::before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(135deg,rgba(167,139,250,.65),rgba(56,189,248,.35));z-index:-1;opacity:.25;filter:blur(6px)}
.pv-btn-google:hover{filter:brightness(1.05);box-shadow:0 8px 20px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.08)}
.pv-btn-google .g-label{font-weight:700}
.pv-btn-google.loading{pointer-events:none;opacity:.85}
.pv-btn-google.loading .g-label::after{content:"";display:inline-block;width:14px;height:14px;margin-left:8px;border:2px solid rgba(255,255,255,.45);border-top-color:transparent;border-radius:50%;animation:pv-spin .8s linear infinite}
@keyframes pv-spin{to{transform:rotate(360deg)}}
.pv-btn-abyss{border-radius:999px;font-size:18px;padding:14px 20px;box-shadow:0 10px 24px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.06)}
.pv-abyss-normal{background:linear-gradient(180deg,#4ea0ff,#3072ff);color:#fff}
.pv-abyss-normal:hover{box-shadow:0 0 24px rgba(78,160,255,.45)}
.pv-abyss-pola{background:linear-gradient(180deg,#ff6666,#ff3a3a);color:#fff}
.pv-abyss-pola:hover{box-shadow:0 0 24px rgba(255,102,102,.45)}
.pv-btn-kofi{background:var(--blue);color:#fff;border-radius:999px;font-size:18px;padding:14px 22px}


/* Idiomas */

.pv-lang{position:relative}
.pv-flag-btn{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  min-height:38px;
  background:linear-gradient(180deg,rgba(38,43,58,.94),rgba(17,20,30,.94));
  border:1px solid var(--outline);
  color:var(--text);
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
  box-shadow:0 8px 16px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.035);
  transition:transform .16s cubic-bezier(.16,.84,.32,1),box-shadow .18s ease,border-color .18s ease,background .18s ease,filter .18s ease;
}
.pv-flag-btn::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.13) 48%,transparent 58%);
  transform:translateX(-145%);
  transition:transform .44s cubic-bezier(.16,.84,.32,1);
  pointer-events:none;
}
.pv-flag-btn:hover{
  transform:translateY(-2px);
  border-color:rgba(216,180,254,.58);
  background:linear-gradient(180deg,rgba(50,38,80,.96),rgba(18,18,31,.92));
  box-shadow:0 12px 22px rgba(0,0,0,.32),0 0 18px rgba(167,139,250,.22),inset 0 0 0 1px rgba(255,255,255,.055);
  filter:brightness(1.04);
}
.pv-flag-btn:hover::before{transform:translateX(145%)}
.pv-flag-btn:active{transform:translateY(0);filter:brightness(.98)}
.pv-lang-menu{position:absolute;right:0;top:calc(100% + 10px);display:none;gap:8px;background:rgba(23,26,33,.92);border:1px solid var(--outline);border-radius:14px;padding:10px;z-index:2000;box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.pv-lang-menu.open{display:flex}
.pv-lang-mini{width:42px;height:42px;border-radius:999px;border:1px solid var(--outline);background:var(--panel);color:#fff;font-weight:700;letter-spacing:1px;cursor:pointer}
.pv-lang-mini:hover{filter:brightness(1.05)}


/* Cuenta / avatar */

.pv-account{position:relative;display:flex;align-items:center}
.pv-account-chip{
  display:inline-flex;align-items:center;gap:12px;background:rgba(20,22,28,.92);
  border:1px solid rgba(203,181,255,.25);color:var(--text);border-radius:18px;
  padding:8px 14px;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.25);
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.pv-account-chip:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(0,0,0,.35);background:rgba(25,28,36,.96)}

.pv-avatar-wrap{position:relative;width:36px;height:36px;display:inline-block;margin-right:2px;overflow:visible}
.pv-avatar-wrap.big{width:52px;height:52px}
.pv-avatar-wrap.xbig{width:64px;height:64px}
.pv-avatar{position:relative;z-index:2;width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;border:1px solid rgba(255,255,255,.15)}
/* marco png por fuera (detrás) */
.pv-avatar-frame{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:170%;height:170%;object-fit:contain;pointer-events:none;display:none;z-index:1;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.45));
}
/* partículas suaves alrededor si hay marco */
.pv-avatar-wrap[data-frame-file="1"]::before{
  content:"";position:absolute;inset:-18%;background:var(--sparkle);opacity:.65;pointer-events:none;
  animation:spark 3.6s ease-in-out infinite alternate;z-index:0;
}
@keyframes spark{0%{filter:blur(2px) brightness(1);transform:rotate(0deg);opacity:.45}100%{filter:blur(1px) brightness(1.06);transform:rotate(8deg);opacity:.75}}

.pv-account-name{max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* menú de cuenta */
.pv-account-menu{position:fixed;right:16px;top:90px;min-width:320px;background:rgba(23,26,33,.98);border:1px solid var(--outline);border-radius:14px;box-shadow:0 12px 28px rgba(0,0,0,.45);padding:12px;display:none;z-index:2000}
.pv-account-menu.open{display:block}
.pv-account-header{display:flex;gap:12px;align-items:center;padding:6px 8px 10px 4px}
.pv-account-header .pv-avatar-wrap{margin-right:10px}
.pv-account-item{width:100%;text-align:left;background:transparent;border:1px solid transparent;color:var(--text);border-radius:10px;padding:10px 12px;cursor:pointer;text-decoration:none;display:block}
.pv-account-item:hover{background:rgba(255,255,255,.03)}
.pv-account-item.danger{color:#ffb3b3}


/* Main / Hero & Abyss */

.pv-main{max-width:1200px;margin:0 auto;padding:28px 20px 80px}
.pv-hero{text-align:center;margin:38px 0 10px}
.pv-hero-banner{display:inline-block;padding:16px 22px 18px;background:linear-gradient(180deg,rgba(13,15,20,.58),rgba(13,15,20,.42));border:1px solid rgba(255,255,255,.06);border-radius:18px;backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.pv-title{font-size:46px;margin:0 0 8px;line-height:1.1;color:#eae2ff;text-shadow:0 2px 10px rgba(0,0,0,.85),0 0 28px rgba(203,181,255,.55);-webkit-text-stroke:.8px rgba(0,0,0,.35)}
.pv-subtitle{color:var(--muted);margin:0 auto;max-width:780px;text-shadow:0 1px 2px rgba(0,0,0,.6)}

.pv-abyss{text-align:center;margin:16px auto 28px}
.pv-abyss-pill{display:inline-block;padding:8px 18px;border-radius:999px;letter-spacing:8px;color:#fff;background:linear-gradient(180deg,rgba(95,64,160,.75),rgba(38,28,70,.7));border:1px solid rgba(203,181,255,.6);text-shadow:0 2px 8px rgba(0,0,0,.7),0 0 22px rgba(203,181,255,.45);margin-bottom:12px}
.pv-abyss-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}


/* Donaciones / Top */

.pv-support-grid{margin-top:12px;display:grid;gap:18px;grid-template-columns:1.4fr .9fr}
.pv-card{position:relative;background:linear-gradient(180deg,rgba(30,34,44,.72),rgba(23,26,33,.92));border:1px solid var(--outline);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);backdrop-filter:blur(6px)}
.pv-donate{padding-right:140px}
.pv-top-donors{padding-right:140px}
.pv-card .pv-chibi{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:110px;opacity:.92;pointer-events:none;user-select:none;filter:drop-shadow(0 8px 16px rgba(0,0,0,.45));z-index:0}
.pv-card > *:not(.pv-chibi){position:relative;z-index:1}
.pv-reward{margin:14px 0 16px;color:var(--text)}
.pv-donate-actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.pv-top-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.pv-pill{display:inline-block;min-width:28px;padding:4px 10px;text-align:center;border-radius:999px;background:rgba(167,139,250,.18);color:var(--text);border:1px solid rgba(167,139,250,.45)}
.pv-donor-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-height:320px;overflow:auto}
.pv-donor-item{display:flex;align-items:center;justify-content:space-between;background:rgba(14,18,26,.55);border:1px solid var(--outline);border-radius:12px;padding:10px 12px}
.pv-donor-item .name{color:var(--text)}
.pv-donor-item .amount{color:#b3e6c0}
.pv-donor-list::-webkit-scrollbar{width:10px}
.pv-donor-list::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:12px}
.pv-donor-list::-webkit-scrollbar-thumb{background:rgba(167,139,250,.5);border-radius:12px}
.pv-donor-list{scrollbar-color:rgba(167,139,250,.5) rgba(255,255,255,.04);scrollbar-width:thin}


/* Volumen */

.pv-volume{position:fixed;right:20px;bottom:20px;display:flex;align-items:center;gap:8px;background:rgba(23,26,33,.8);border:1px solid var(--outline);border-radius:999px;padding:8px 10px;box-shadow:var(--shadow);backdrop-filter:blur(6px)}
.pv-vol-btn{background:var(--panel);color:var(--text);border:1px solid var(--outline);width:34px;height:34px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.pv-vol-btn:hover{filter:brightness(1.05)}
.pv-vol-display{min-width:40px;text-align:center;font-variant-numeric:tabular-nums}


/* Footer */

.pv-footer{border-top:1px solid var(--outline);background:#0c0e12;padding:28px 20px 40px}
.pv-footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.2fr .8fr .6fr;gap:20px}
.pv-footer h4{margin:0 0 8px}
.pv-footer a{color:var(--text);text-decoration:none;border-bottom:1px dashed transparent}
.pv-footer a:hover{border-color:var(--text)}
.pv-disclaimer{color:#b9c1d3}


/* Toasts */

.pv-toast{position:fixed;right:20px;top:80px;background:rgba(23,26,33,.96);border:1px solid rgba(203,181,255,.25);color:#fff;padding:12px 14px;border-radius:12px;box-shadow:0 10px 24px rgba(0,0,0,.35);z-index:3000;display:flex;align-items:center;gap:10px}
.pv-toast.ok{border-color:rgba(72,187,120,.55)}
.pv-toast.err{border-color:rgba(239,68,68,.55)}


/* Responsive */

@media (max-width:1100px){
  .pv-title{font-size:40px}
  .pv-card .pv-chibi{width:90px}
  .pv-donate,.pv-top-donors{padding-right:115px}
}
@media (max-width:980px){
  .pv-support-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  .pv-nav{padding:12px 14px}
  .pv-link{padding:8px 10px}
  .pv-title{font-size:32px}
  .pv-card .pv-chibi{display:none}
  .pv-donate,.pv-top-donors{padding-right:18px}
  .pv-account-name{display:none}
}
@media (max-width:520px){
  .pv-nav-left{display:none}
  .pv-logo{font-size:18px}
  .pv-btn{padding:12px 14px;font-size:15px}
  .pv-footer-grid{grid-template-columns:1fr}
}

/* Retoques */
.pv-account-menu{box-shadow:0 12px 28px rgba(0,0,0,.45)}
.pv-account-item:hover{background:rgba(255,255,255,.03)}
.pv-logo{text-shadow:0 0 24px rgba(167,139,250,.45),0 0 6px rgba(167,139,250,.35)}

/* Auth vis */
body.auth-loading #loginBtn,
body.auth-loading #accountBtn,
body.auth-loading .pv-account-menu{display:none!important}
body.is-logged-in #loginBtn{display:none!important}
body.is-logged-out #accountBtn,
body.is-logged-out .pv-account-menu{display:none!important}

/* Owner morado con efecto */
.title-badge.owner{
  color:#faf7ff;
  background:linear-gradient(90deg,#a78bfa,#7c3aed,#8b5cf6,#6d28d9,#a78bfa);
  background-size:200% 100%;
  border:1px solid rgba(255,255,255,.12);
  padding:2px 10px;border-radius:999px;font-size:12px;
  box-shadow:0 0 18px rgba(139,92,246,.45);
  animation:owner-sheen 3s linear infinite;
}
.title-badge.owner::after{
  content:"";position:absolute;inset:-40%;
  background:
    radial-gradient(12px 12px at 20% 30%, rgba(255,255,255,.8), transparent 60%),
    radial-gradient(10px 10px at 80% 65%, rgba(255,230,255,.6), transparent 60%);
  filter:blur(8px);opacity:.55;animation:owner-spark 2.8s ease-in-out infinite alternate;
}
@keyframes owner-sheen{to{background-position:200% 0}}
@keyframes owner-spark{from{transform:rotate(0)}to{transform:rotate(10deg)}}
/* Basado con efectos (acepta .basado o .anim-basado) */
.title-badge{
  position:relative;
  display:inline-block;
  vertical-align:middle;
}

.title-badge.basado,
.title-badge.anim-basado{
  padding:2px 10px;
  border-radius:999px;
  font-size:12px;
  color:#0b0f14;
  background:linear-gradient(90deg,#f8e38a,#8df0ff,#f8e38a);
  background-size:200% 100%;
  border:1px solid rgba(255,255,255,.18);
  text-shadow:0 1px 0 rgba(255,255,255,.35);
  box-shadow:
    0 0 14px rgba(248,227,138,.35),
    0 0 18px rgba(141,240,255,.25) inset;
  animation:
    basado-sheen 4s linear infinite,
    basado-pulse 2.6s ease-in-out infinite;
}

.title-badge.basado::before,
.title-badge.anim-basado::before{
  content:"";
  position:absolute;
  inset:-40%;
  pointer-events:none;
  background:
    radial-gradient(12px 12px at 20% 30%, rgba(255,255,255,.85), transparent 60%),
    radial-gradient(10px 10px at 75% 65%, rgba(250,255,208,.75), transparent 60%);
  filter:blur(8px);
  opacity:.55;
  animation:basado-spark 3s ease-in-out infinite alternate;
}

.title-badge.basado::after,
.title-badge.anim-basado::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-20%;
  width:60%;
  height:180%;
  transform:rotate(25deg) translateX(-120%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
  mix-blend-mode:screen;
  filter:blur(2px);
  opacity:.65;
  pointer-events:none;
  animation:basado-wipe 2.2s ease-in-out infinite;
}

@keyframes basado-sheen{
  0%{ background-position:0% 0 }
  100%{ background-position:200% 0 }
}
@keyframes basado-pulse{
  0%,100%{
    box-shadow:0 0 10px rgba(248,227,138,.28), 0 0 14px rgba(141,240,255,.20) inset;
    filter:brightness(1);
  }
  50%{
    box-shadow:0 0 18px rgba(248,227,138,.45), 0 0 22px rgba(141,240,255,.32) inset;
    filter:brightness(1.06);
  }
}
@keyframes basado-spark{
  from{ transform:rotate(0deg); opacity:.45 }
  to{   transform:rotate(8deg); opacity:.75 }
}
@keyframes basado-wipe{
  0%{   transform:rotate(25deg) translateX(-120%); opacity:0 }
  50%{  transform:rotate(25deg) translateX(10%);   opacity:.75 }
  100%{ transform:rotate(25deg) translateX(140%);  opacity:0 }
}

@media (prefers-reduced-motion:reduce){
  .title-badge.basado,
  .title-badge.anim-basado{ animation:none }
  .title-badge.basado::before,
  .title-badge.basado::after,
  .title-badge.anim-basado::before,
  .title-badge.anim-basado::after{ animation:none }
}
/* Fondo del abismo optimizado sin video pesado. */
.pv-abyss-bg{
  position:fixed;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  isolation:isolate;
  background:#05070d;
  opacity:0;
  animation:pvAbyssWrapFade .42s ease-out .04s forwards;
}
.pv-abyss-bg::before{
  content:"";
  position:absolute;
  inset:-2.5%;
  z-index:0;
  background-image:var(--pv-bg-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0;
  transform:scale(1.035);
  filter:saturate(1.08) contrast(1.05) brightness(.72);
  animation:
    pvAbyssImageIn .72s cubic-bezier(.16,.84,.32,1) .06s forwards,
    pvAbyssDrift 24s ease-in-out 1s infinite alternate;
  will-change:opacity,transform;
}
.pv-abyss-bg::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(780px 420px at 50% 30%, rgba(168,85,247,.18), transparent 62%),
    radial-gradient(660px 420px at 16% 8%, rgba(59,130,246,.14), transparent 58%),
    radial-gradient(620px 420px at 86% 16%, rgba(236,72,153,.10), transparent 60%),
    linear-gradient(180deg, rgba(3,5,12,.14), rgba(3,5,12,.62) 72%, rgba(0,0,0,.84));
  opacity:0;
  animation:pvAbyssVeilIn .62s ease-out .12s forwards;
}
.pv-abyss-bg .pv-bg-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  background:
    radial-gradient(1100px 620px at 50% -8%, rgba(124,58,237,.22), rgba(10,12,24,.16) 44%, rgba(3,5,12,.54) 100%);
  mix-blend-mode:soft-light;
  pointer-events:none;
}
.pv-abyss-bg .pv-bg-vignette{
  position:absolute;
  inset:-12%;
  z-index:3;
  background:radial-gradient(72% 58% at 50% 42%, rgba(0,0,0,0) 0%, rgba(0,0,0,.48) 72%, rgba(0,0,0,.82) 100%);
  mix-blend-mode:multiply;
  pointer-events:none;
}
.pv-abyss-bg .pv-bg-grain{
  position:absolute;
  inset:0;
  z-index:4;
  background-image:url('/img/grain.png'), url('/img/backgrounds/grain.png');
  background-size:220px 220px;
  opacity:.055;
  mix-blend-mode:overlay;
  pointer-events:none;
}
.pv-abyss-bg .pv-bg-video,
.pv-abyss-bg video{display:none!important;}
@keyframes pvAbyssWrapFade{from{opacity:0}to{opacity:1}}
@keyframes pvAbyssImageIn{from{opacity:0;transform:scale(1.055)}to{opacity:1;transform:scale(1.025)}}
@keyframes pvAbyssVeilIn{from{opacity:0}to{opacity:1}}
@keyframes pvAbyssDrift{from{transform:scale(1.025) translate3d(-.45%,-.35%,0)}to{transform:scale(1.045) translate3d(.45%,.35%,0)}}
@media (prefers-reduced-motion:reduce){
  .pv-abyss-bg,
  .pv-abyss-bg::before,
  .pv-abyss-bg::after{animation:none!important;opacity:1!important;transform:none!important;}
}


/* Fondo claro con transición suave y sin cortes bruscos. */
@keyframes pvNatBgWrapFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes pvNatBgImageFade { from { opacity: 0; transform: scale(1.028); } to { opacity: 1; transform: scale(1); } }
.pv-abyss-bg{
  opacity: 0;
  animation: pvNatBgWrapFade .34s ease-out .02s forwards !important;
  background: #05070d !important;
}
.pv-abyss-bg::before{
  inset: 0 !important;
  opacity: 0;
  transform: scale(1.02);
  filter: none !important;
  animation: pvNatBgImageFade .52s ease-out .04s forwards !important;
  will-change: opacity, transform;
}
.pv-abyss-bg::after,
.pv-abyss-bg .pv-bg-overlay,
.pv-abyss-bg .pv-bg-vignette,
.pv-abyss-bg .pv-bg-grain,
.pv-bg-slideshow{
  display: none !important;
}
@media (prefers-reduced-motion: reduce){
  .pv-abyss-bg,
  .pv-abyss-bg::before{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Pulido visual conservador sobre la base del Index. */

html{
  scrollbar-width:thin;
  scrollbar-color:rgba(183,146,255,.82) rgba(7,9,16,.94);
}
html::-webkit-scrollbar,
body::-webkit-scrollbar{width:12px;height:12px}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track{background:linear-gradient(180deg,rgba(7,9,16,.96),rgba(18,15,31,.96))}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(231,222,255,.95),rgba(124,58,237,.90));
  border:3px solid rgba(7,9,16,.96);
  border-radius:999px;
  box-shadow:0 0 16px rgba(167,139,250,.42);
}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#fff,rgba(167,139,250,1))}

body,button,input,select,textarea,a,
.pv-player-search,.pv-player-results,.pv-account-menu,.pv-card,.pv-footer{font-family:"GenshinImpact",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif!important}
button,input,select,textarea{font:inherit}

/* Entrada estable: evita saltos de posición al terminar el fade. */
@keyframes pv-panel-in-v4{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
@keyframes pv-soft-in-v4{from{opacity:0}to{opacity:1}}
.pv-navbar{animation:pv-soft-in-v4 .38s ease-out both}
.pv-hero-banner{animation:pv-panel-in-v4 .55s ease-out .06s both}
.pv-abyss{animation:pv-panel-in-v4 .55s ease-out .12s both}
.pv-support-grid .pv-card:first-child{animation:pv-panel-in-v4 .58s ease-out .18s both}
.pv-support-grid .pv-card:nth-child(2){animation:pv-panel-in-v4 .58s ease-out .24s both}

.pv-glow-line{
  background:linear-gradient(90deg,#ff4fd8,#8b5cf6,#38bdf8,#a855f7,#ff4fd8);
  background-size:240% 100%;
  animation:pv-top-rgb-v4 5.5s linear infinite;
  opacity:.9;
}
@keyframes pv-top-rgb-v4{to{background-position:240% 0}}

/* Fondo con respiración visible y sin saltos. */
.pv-abyss-bg{opacity:0;animation:pv-bg-wrap-v4 .36s ease-out .02s forwards!important;background:#05070d!important}
@keyframes pv-bg-wrap-v4{to{opacity:1}}
@keyframes pv-index-bg-breath-v4{
  0%{transform:scale(1.035) translate3d(-.75%,-.48%,0)}
  50%{transform:scale(1.065) translate3d(.18%,.12%,0)}
  100%{transform:scale(1.09) translate3d(.72%,.46%,0)}
}
.pv-abyss-bg::before{
  inset:-4.5%!important;
  opacity:1!important;
  filter:saturate(1.10) contrast(1.03) brightness(.94)!important;
  transform-origin:center!important;
  animation:pv-index-bg-breath-v4 18s ease-in-out infinite alternate!important;
  will-change:transform;
}
.pv-abyss-bg::after{
  content:"";
  display:block!important;
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(900px 520px at 50% 18%,rgba(167,139,250,.20),transparent 64%),
    radial-gradient(760px 520px at 16% 10%,rgba(56,189,248,.12),transparent 58%),
    radial-gradient(760px 520px at 84% 12%,rgba(255,79,216,.10),transparent 62%),
    linear-gradient(180deg,rgba(5,7,13,.12),rgba(5,7,13,.46) 74%,rgba(0,0,0,.72));
  opacity:.72!important;
  z-index:1;
}
.pv-abyss-bg .pv-bg-overlay{
  display:block!important;
  background:radial-gradient(1100px 620px at 50% -8%,rgba(124,58,237,.15),rgba(10,12,24,.10) 44%,rgba(3,5,12,.28) 100%)!important;
  mix-blend-mode:soft-light;
  opacity:.8;
}
.pv-abyss-bg .pv-bg-vignette,
.pv-abyss-bg .pv-bg-grain,
.pv-bg-slideshow{display:none!important}

/* Navbar: buscador fijo a la izquierda y enlaces junto a él. */
.pv-navbar{z-index:100;background:rgba(15,17,21,.70);border-bottom:1px solid rgba(203,181,255,.16)}
.pv-nav{max-width:none;width:100%;min-height:76px;margin:0;padding:10px 16px 10px 8px;gap:14px;align-items:center}
.pv-nav-left{display:flex!important;justify-content:flex-start;align-items:center;gap:12px;flex:1 1 auto;min-width:0;z-index:2}
.pv-nav-right{justify-content:flex-end;flex:0 0 auto;z-index:2;margin-left:auto}
.pv-brand{z-index:1;pointer-events:auto}
.pv-logo{
  text-decoration:none!important;
  color:#fff!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
  font-size:28px!important;
  line-height:1!important;
  display:inline-block;
  padding:6px 10px;
  text-shadow:0 0 6px rgba(255,255,255,.65),0 4px 18px rgba(0,0,0,.55)!important;
  filter:drop-shadow(0 0 22px rgba(134,183,255,.25));
  transition:transform .15s ease,opacity .15s ease,filter .15s ease;
}
.pv-logo:hover{transform:translateY(-1px);opacity:.95;filter:drop-shadow(0 0 26px rgba(134,183,255,.36))}

.pv-quick-links{
  display:grid;
  grid-template-columns:minmax(164px,max-content) minmax(122px,max-content);
  grid-template-areas:"pvp deck" "chars chars";
  gap:8px 22px;
  align-items:center;
  flex:0 0 auto;
}
.pv-link-pvp{grid-area:pvp}
.pv-link-mazo{grid-area:deck}
.pv-link-chars{grid-area:chars;justify-self:start;min-width:224px}
.pv-link-main{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:inline-flex!important;
  align-items:center;
  gap:9px;
  min-height:34px;
  padding:9px 13px;
  border-radius:14px;
  color:#f4efff!important;
  border:1px solid rgba(203,181,255,.20)!important;
  background:linear-gradient(180deg,rgba(21,24,34,.84),rgba(12,14,22,.72))!important;
  box-shadow:0 8px 20px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.035);
  font-size:12px;
  font-weight:850;
  letter-spacing:.045em;
  text-decoration:none!important;
  white-space:nowrap;
  transition:transform .18s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease,color .22s ease,filter .22s ease;
}
.pv-link-main::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(120deg,transparent,rgba(203,181,255,.34),rgba(56,189,248,.18),transparent);
  transform:translateX(-118%);
  transition:transform .55s cubic-bezier(.16,.84,.32,1);
}
.pv-link-main:hover{
  transform:translateY(-3px) scale(1.015);
  color:#fff!important;
  border-color:rgba(203,181,255,.64)!important;
  background:linear-gradient(180deg,rgba(45,38,70,.90),rgba(17,20,31,.80))!important;
  box-shadow:0 16px 32px rgba(0,0,0,.36),0 0 24px rgba(167,139,250,.26),inset 0 0 0 1px rgba(255,255,255,.07);
}
.pv-link-main:hover::before{transform:translateX(118%)}
.pv-link-emote{position:relative;display:inline-block;flex:0 0 auto;width:20px;height:20px;filter:drop-shadow(0 0 6px rgba(203,181,255,.35))}
.pv-emote-swords::before,.pv-emote-swords::after{
  content:"";position:absolute;left:9px;top:1px;width:3px;height:18px;border-radius:4px;
  background:linear-gradient(180deg,#eaf6ff 0 44%,#8b5cf6 45% 100%);
  box-shadow:0 0 8px rgba(139,92,246,.45);
  transform-origin:50% 82%;
}
.pv-emote-swords::before{transform:rotate(42deg)}
.pv-emote-swords::after{transform:rotate(-42deg)}
.pv-emote-character::before{
  content:"";position:absolute;inset:3px;border-radius:50%;
  background:radial-gradient(circle at 50% 35%,#fff 0 12%,#facc15 13% 24%,#a855f7 25% 58%,#312e81 60% 100%);
  box-shadow:0 0 12px rgba(168,85,247,.50);
}
.pv-emote-character::after{
  content:"";position:absolute;left:8px;top:-1px;width:4px;height:22px;border-radius:999px;background:rgba(255,255,255,.72);transform:rotate(45deg);filter:blur(.2px)
}
.pv-emote-deck::before,.pv-emote-deck::after{
  content:"";position:absolute;width:13px;height:17px;border-radius:3px;border:1px solid rgba(255,255,255,.78);
  background:linear-gradient(160deg,rgba(56,189,248,.84),rgba(124,58,237,.92));
  box-shadow:0 0 10px rgba(56,189,248,.32);
}
.pv-emote-deck::before{left:2px;top:2px;transform:rotate(-9deg)}
.pv-emote-deck::after{right:2px;top:1px;transform:rotate(9deg)}

/* Buscador de jugadores. */
.pv-player-search{position:relative;width:286px;max-width:286px;flex:0 0 286px;z-index:35;animation:pv-soft-in-v4 .42s ease-out .03s both}
.pv-player-search-label{display:block;margin:0 0 5px 12px;color:#dfd4ff;font-size:10px;line-height:1;letter-spacing:.16em;text-transform:uppercase;text-shadow:0 0 12px rgba(167,139,250,.38)}
.pv-player-search-box{
  height:43px;display:flex;align-items:center;gap:8px;padding:0 10px 0 12px;border-radius:999px;
  background:linear-gradient(180deg,rgba(17,20,31,.94),rgba(9,11,18,.86));
  border:1px solid rgba(203,181,255,.27);
  box-shadow:0 10px 28px rgba(0,0,0,.34),inset 0 0 0 1px rgba(255,255,255,.04);
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.pv-player-search:focus-within .pv-player-search-box{border-color:rgba(203,181,255,.68);box-shadow:0 12px 30px rgba(0,0,0,.40),0 0 24px rgba(167,139,250,.22),inset 0 0 0 1px rgba(255,255,255,.07);transform:translateY(-1px)}
.pv-search-icon{color:#cbb5ff;font-size:20px;line-height:1;filter:drop-shadow(0 0 8px rgba(203,181,255,.35))}
.pv-player-search-input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#f5f2ff;font-size:13px}
.pv-player-search-input::placeholder{color:rgba(230,233,239,.58)}
.pv-player-search-clear{width:27px;height:27px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(203,181,255,.22);border-radius:999px;background:rgba(255,255,255,.06);color:#fff;cursor:pointer;box-shadow:none;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.pv-player-search-clear:hover{transform:scale(1.06);background:rgba(203,181,255,.16);border-color:rgba(203,181,255,.50)}
.pv-player-results{
  position:absolute;left:0;top:calc(100% + 10px);width:min(462px,88vw);max-height:438px;overflow:auto;display:grid;gap:9px;padding:11px;
  border-radius:19px;border:1px solid rgba(203,181,255,.27);
  background:linear-gradient(180deg,rgba(18,21,32,.98),rgba(9,11,18,.965));
  box-shadow:0 18px 42px rgba(0,0,0,.52),0 0 28px rgba(124,58,237,.18);
  backdrop-filter:blur(12px) saturate(130%);
  opacity:0;transform:translateY(-8px) scale(.985);pointer-events:none;transition:opacity .18s ease,transform .18s ease;
}
.pv-player-search.open .pv-player-results{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.pv-player-results::-webkit-scrollbar{width:10px}
.pv-player-results::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:12px}
.pv-player-results::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(203,181,255,.72),rgba(124,58,237,.72));border-radius:12px}
.pv-player-result{
  display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:16px;min-height:90px;padding:11px 14px;border-radius:16px;
  text-decoration:none;color:var(--text);background:linear-gradient(180deg,rgba(255,255,255,.058),rgba(255,255,255,.026));
  border:1px solid rgba(255,255,255,.085);transition:transform .16s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.pv-player-result:hover{transform:translateY(-3px);background:linear-gradient(180deg,rgba(203,181,255,.15),rgba(255,255,255,.05));border-color:rgba(203,181,255,.42);box-shadow:0 14px 26px rgba(0,0,0,.32),0 0 20px rgba(167,139,250,.18)}
.pv-player-avatar.avatar{justify-self:center;position:relative;width:64px;height:64px;border-radius:999px;overflow:visible;border:2px solid rgba(255,255,255,.12);box-shadow:0 6px 16px rgba(0,0,0,.35)}
.pv-player-avatar.avatar img.photo{position:relative;z-index:2;width:100%;height:100%;object-fit:cover;display:block;border-radius:999px;background:#0b0f18}
.pv-player-avatar.avatar img.frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:178%;height:178%;object-fit:contain;pointer-events:none;z-index:1;display:block}
.pv-player-result-info{display:flex;flex-direction:column;gap:8px;min-width:0;padding-left:4px}
.pv-player-result-name{font-size:15px;line-height:1.2;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.pv-player-result-sub{display:flex;flex-wrap:wrap;align-items:center;gap:7px;min-width:0}
.pv-player-handle{position:relative;overflow:hidden;display:inline-flex;align-items:center;min-height:22px;padding:2px 8px;border-radius:999px;font-size:11px;color:#dfe6ff;background:rgba(7,10,18,.54);border:1px solid rgba(255,255,255,.09)}
.pv-player-title-line{display:inline-flex;align-items:center;max-width:100%;min-height:24px;margin-top:1px}
.pv-player-title-line .title-badge{font-size:12px;max-width:100%}
.pv-player-search-msg{padding:14px 12px;border-radius:14px;color:#d9def0;text-align:center;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07)}
.pv-player-search-msg.error{color:#ffb9b9;border-color:rgba(255,100,100,.26)}
.pv-player-rank{display:none!important}

/* Chip de cuenta con espacio para marco y título equipado. */
.pv-account-chip{gap:22px;min-height:68px;padding:8px 16px 8px 12px;border-radius:20px;border-color:rgba(203,181,255,.28);background:rgba(16,19,29,.92)}
.pv-account-chip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.38),0 0 20px rgba(167,139,250,.17)}
.pv-account-identity{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;min-width:126px;max-width:190px;padding-left:4px}
.pv-account-name{max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;color:#fff}
.pv-account-title,.pv-menu-title{font-size:12px;max-width:190px;overflow:visible}
.pv-account-menu{right:16px;top:88px;min-width:340px;border-color:rgba(203,181,255,.24)}
.pv-account-header{gap:22px;align-items:center;padding:8px 8px 12px 4px}
.pv-account-header .pv-avatar-wrap{margin-right:18px;flex:0 0 auto}
.pv-account-meta{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.pv-account-meta strong{color:#fff;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pv-account-meta small{color:var(--muted);max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Capas de avatar y marco: la foto queda encima y el pulso vive en el marco. */
.pv-avatar-wrap{overflow:visible!important}
.pv-avatar{position:relative;z-index:2!important}
.pv-avatar-frame{z-index:1!important;pointer-events:none}
.pv-avatar-wrap[data-frame-file]::before{content:none!important;display:none!important}
.pv-avatar-wrap.big{width:52px;height:52px}
.pv-avatar-wrap.xbig{width:66px;height:66px}

/* Botón de juego. */
.pv-abyss{margin:10px auto 20px;text-align:center}
.pv-abyss-actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.pv-play-btn{
  position:relative;isolation:isolate;overflow:hidden;min-width:258px;min-height:64px;padding:15px 34px;border-radius:999px;
  display:inline-flex!important;align-items:center;justify-content:center;gap:15px;color:#190d05!important;text-transform:uppercase;letter-spacing:.18em;font-weight:950;
  background:linear-gradient(135deg,#ffe27a 0%,#ff9f1c 38%,#ff4fd8 72%,#8b5cf6 100%)!important;
  border:1px solid rgba(255,244,196,.75)!important;
  box-shadow:0 20px 40px rgba(0,0,0,.42),0 0 42px rgba(255,159,28,.35),0 0 28px rgba(255,79,216,.22),inset 0 0 0 1px rgba(255,255,255,.30);
  text-shadow:0 1px 0 rgba(255,255,255,.42);transition:transform .20s cubic-bezier(.16,.84,.32,1),box-shadow .20s ease,filter .20s ease,border-color .20s ease,letter-spacing .20s ease;
}
.pv-play-btn::before{content:"";position:absolute;inset:-70%;z-index:-2;background:conic-gradient(from 0deg,transparent,rgba(255,255,255,.48),rgba(56,189,248,.20),transparent);animation:pv-play-aura-v4 4.8s linear infinite}
.pv-play-btn::after{content:"";position:absolute;inset:2px;z-index:-1;border-radius:inherit;background:linear-gradient(135deg,rgba(255,238,144,.96),rgba(255,168,38,.96) 44%,rgba(255,90,207,.90) 75%,rgba(139,92,246,.92))}
.pv-play-symbol{position:relative;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.88);box-shadow:0 0 16px rgba(255,255,255,.42),inset 0 0 0 1px rgba(255,255,255,.65);flex:0 0 34px}
.pv-play-symbol::before{content:"";position:absolute;left:13px;top:9px;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:13px solid #2d1452;filter:drop-shadow(0 0 4px rgba(45,20,82,.25))}
.pv-play-text{position:relative;z-index:1}
.pv-play-btn:hover{transform:translateY(-5px) scale(1.045);filter:brightness(1.08) saturate(1.12);border-color:#fff!important;letter-spacing:.24em;box-shadow:0 26px 50px rgba(0,0,0,.46),0 0 60px rgba(255,193,77,.52),0 0 30px rgba(255,79,216,.32),inset 0 0 0 1px rgba(255,255,255,.38)}
.pv-play-btn:hover .pv-play-symbol{transform:scale(1.08);box-shadow:0 0 22px rgba(255,255,255,.65),0 0 16px rgba(255,234,138,.42)}
.pv-play-btn:active{transform:translateY(-2px) scale(1.02)}
@keyframes pv-play-aura-v4{to{transform:rotate(360deg)}}

/* Área de donaciones. */
.pv-support-grid{margin-top:8px;display:grid;gap:18px;grid-template-columns:minmax(0,1.36fr) minmax(300px,.88fr)}
.pv-donate{padding-right:18px!important}
.pv-donate h3,.pv-top-donors h3{margin-top:0;text-shadow:0 0 18px rgba(203,181,255,.22)}
.pv-reward{margin:14px 0 16px;color:var(--text);line-height:1.62}
.pv-reward-showcase{display:flex;flex-wrap:wrap;gap:16px;margin:16px 0 18px}
.pv-reward-preview{flex:1 1 196px;min-width:184px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:16px 12px 14px;border-radius:17px;background:linear-gradient(180deg,rgba(255,255,255,.068),rgba(255,255,255,.026));border:1px solid rgba(203,181,255,.20);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 10px 24px rgba(0,0,0,.22)}
.pv-reward-frame{width:74px;height:74px;margin:8px 0 30px!important;display:inline-block;position:relative;overflow:visible}
.pv-reward-core{display:flex!important;align-items:center;justify-content:center;color:rgba(255,255,255,.80);font-weight:900;background:radial-gradient(circle at 50% 35%,rgba(203,181,255,.24),rgba(7,9,16,.92) 68%);border:1px solid rgba(255,255,255,.14)}
.pv-reward-frame .pv-avatar-frame{display:block!important;width:178%;height:178%;left:50%;top:50%;transform:translate(-50%,-50%)}
.pv-reward-preview .title-badge{font-size:15px;margin-top:2px;min-height:20px;overflow:visible}
.pv-reward-preview small{color:var(--muted);font-size:11px;letter-spacing:.03em}
.pv-btn-kofi:hover{box-shadow:0 0 28px rgba(59,130,246,.35),0 14px 28px rgba(0,0,0,.32);transform:translateY(-3px) scale(1.015)}
.pv-top-header{display:block;margin-bottom:10px}
.pv-thanks-badge{display:none!important}
.pv-top-donors{padding-right:128px}
.pv-donor-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-height:336px;overflow:auto}
.pv-donor-item{justify-content:flex-start;gap:10px;overflow:hidden;background:linear-gradient(180deg,rgba(14,18,26,.66),rgba(10,12,19,.56));border-color:rgba(203,181,255,.14);transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.pv-donor-item:hover{transform:translateY(-2px);border-color:rgba(203,181,255,.34);background:linear-gradient(180deg,rgba(203,181,255,.11),rgba(14,18,26,.58));box-shadow:0 10px 20px rgba(0,0,0,.24)}
.pv-donor-item .pos{display:inline-flex;align-items:center;justify-content:center;min-width:38px;padding:2px 8px;border-radius:999px;color:#d8caff;background:rgba(167,139,250,.14);border:1px solid rgba(167,139,250,.22)}
.pv-donor-item .name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.pv-donor-empty{display:none!important}

/* Panel de sonido. */
.pv-volume{right:20px;bottom:20px;gap:10px;min-height:66px;border-radius:26px;padding:12px 14px;z-index:50;background:linear-gradient(180deg,rgba(18,21,32,.90),rgba(8,10,16,.84));border:1px solid rgba(203,181,255,.25);box-shadow:0 16px 36px rgba(0,0,0,.42),0 0 24px rgba(124,58,237,.16),inset 0 0 0 1px rgba(255,255,255,.035);backdrop-filter:blur(12px) saturate(130%);animation:pv-panel-in-v4 .50s ease-out .30s both;overflow:visible}
.pv-vol-toggle,.pv-vol-btn{flex:0 0 auto;background:linear-gradient(180deg,rgba(38,43,58,.94),rgba(17,20,30,.94));color:#fff;border:1px solid rgba(203,181,255,.24);width:42px;height:42px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 16px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.035);transition:transform .16s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}
.pv-vol-toggle{font-size:20px;color:#dcd1ff;background:linear-gradient(180deg,rgba(80,61,130,.96),rgba(30,26,48,.96))}
.pv-vol-toggle:hover,.pv-vol-btn:hover{transform:translateY(-3px);border-color:rgba(203,181,255,.58);box-shadow:0 12px 22px rgba(0,0,0,.32),0 0 18px rgba(167,139,250,.22)}
.pv-volume-controls{display:flex;align-items:center;gap:10px;max-width:368px;opacity:1;overflow:visible;transition:max-width .26s cubic-bezier(.16,.84,.32,1),opacity .2s ease,transform .22s ease,margin .22s ease}
.pv-volume.is-collapsed .pv-volume-controls{max-width:0;opacity:0;overflow:hidden;transform:translateX(8px);pointer-events:none;margin-left:-10px}
.pv-vol-range{appearance:none;-webkit-appearance:none;width:132px;height:8px;border-radius:999px;outline:none;background:linear-gradient(90deg,rgba(203,181,255,.86),rgba(37,99,235,.80));box-shadow:inset 0 0 0 1px rgba(255,255,255,.10),0 0 12px rgba(124,58,237,.18)}
.pv-vol-range::-webkit-slider-thumb{-webkit-appearance:none;width:19px;height:19px;border-radius:50%;background:#f5f2ff;border:2px solid #8b5cf6;box-shadow:0 0 14px rgba(203,181,255,.55);cursor:pointer}
.pv-vol-range::-moz-range-thumb{width:19px;height:19px;border-radius:50%;background:#f5f2ff;border:2px solid #8b5cf6;box-shadow:0 0 14px rgba(203,181,255,.55);cursor:pointer}
.pv-vol-display{min-width:48px;color:#efeaff;font-variant-numeric:tabular-nums;font-size:13px;text-shadow:0 0 10px rgba(203,181,255,.20)}

/* Pulido de hover para enlaces del footer. */
.pv-footer a{position:relative;display:inline-flex;align-items:center;color:#efeaff;text-decoration:none!important;border-bottom:0!important;transition:transform .16s ease,color .16s ease,text-shadow .16s ease}
.pv-footer a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1px;background:linear-gradient(90deg,transparent,rgba(203,181,255,.85),transparent);transform:scaleX(0);transform-origin:center;transition:transform .22s ease}
.pv-footer a:hover{transform:translateY(-2px);color:#fff;text-shadow:0 0 12px rgba(203,181,255,.35)}
.pv-footer a:hover::after{transform:scaleX(1)}

/* Respaldo de títulos si titles.css no carga desde caché. */
.title-badge[data-title-key="basado"]{color:transparent;background-image:linear-gradient(90deg,#ffb347,#ffcc33,#ffb347);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 8px rgba(255,186,59,.35);animation:pv-v4-title-flow 3s linear infinite}
.title-badge[data-title-key="basado"]::after{content:"😎";display:inline-block;margin-left:.25rem;-webkit-text-fill-color:initial;color:initial;filter:drop-shadow(0 0 4px rgba(255,210,63,.55));animation:pv-v4-emoji-bob 2.2s ease-in-out infinite}
.title-badge[data-title-key="vip"]{color:transparent;background-image:linear-gradient(90deg,#ff4fd8,#8b5cf6,#38bdf8,#a855f7,#ff4fd8);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 10px rgba(168,85,247,.35),0 0 18px rgba(56,189,248,.22);animation:pv-v4-title-flow 3.1s linear infinite}
.title-badge[data-title-key="vip"]::before{content:"💎";display:inline-block;margin-right:.22rem;color:#e9d5ff;-webkit-text-fill-color:#e9d5ff;filter:drop-shadow(0 0 4px rgba(216,180,254,.9));animation:pv-v4-emoji-bob 2s ease-in-out infinite}
@keyframes pv-v4-title-flow{to{background-position:200% 0}}
@keyframes pv-v4-emoji-bob{50%{transform:translateY(-2px)}}

/* Marcos: animaciones centralizadas en frames.css. */

@media (max-width:1320px){
  .pv-player-search{width:260px;max-width:260px;flex-basis:260px}
  .pv-quick-links{gap:8px 14px}.pv-link-main{font-size:11px;padding:8px 10px}.pv-link-chars{min-width:204px}
}
@media (max-width:1120px){
  .pv-nav{align-items:center;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
  .pv-brand{position:static;transform:none;order:-2;width:100%;justify-content:center;margin-bottom:2px}
  .pv-nav-left{flex:1 1 100%;justify-content:flex-start}
  .pv-nav-right{flex:1 1 100%;justify-content:center;margin-left:0}
  .pv-player-search{width:min(430px,42vw);max-width:42vw;flex-basis:min(430px,42vw)}
}
@media (max-width:980px){
  .pv-support-grid{grid-template-columns:1fr}.pv-top-donors{padding-right:115px}
}
@media (max-width:760px){
  .pv-nav-left{justify-content:center;flex-wrap:wrap}.pv-player-search{width:min(440px,92vw);max-width:92vw;flex-basis:100%;order:-1}.pv-player-results{left:50%;transform:translate(-50%,-8px) scale(.985)}.pv-player-search.open .pv-player-results{transform:translate(-50%,0) scale(1)}
  .pv-quick-links{grid-template-columns:1fr 1fr;width:min(440px,92vw)}.pv-link-chars{grid-column:1 / -1;min-width:0;width:100%}.pv-play-btn{min-width:230px;letter-spacing:.15em}
  .pv-card .pv-chibi{display:none}.pv-top-donors,.pv-donate{padding-right:18px!important}.pv-volume{right:12px;bottom:12px}.pv-vol-range{width:104px}
}
@media (max-width:520px){
  .pv-nav{padding-left:10px;padding-right:10px}.pv-logo{font-size:22px!important}.pv-link-main{font-size:11px}.pv-player-search-label{margin-left:10px}.pv-reward-showcase{display:grid;grid-template-columns:1fr}.pv-volume-controls{gap:7px}.pv-vol-display{display:none}.pv-account-name{display:block}.pv-account-identity{min-width:0;max-width:140px}.pv-account-title{max-width:140px}
}
@media (prefers-reduced-motion:reduce){
  .pv-navbar,.pv-player-search,.pv-hero-banner,.pv-abyss,.pv-support-grid .pv-card,.pv-volume,.pv-play-btn::before,.pv-abyss-bg,.pv-abyss-bg::before{animation:none!important;opacity:1!important;transform:none!important}
  .pv-link-main,.pv-play-btn,.pv-player-result,.pv-vol-btn,.pv-vol-toggle,.pv-footer a{transition:none!important}
}

/* Ajustes visuales del Index. */

/* Header compacto: los accesos ya no crean una segunda fila debajo del buscador. */
.pv-navbar{z-index:120!important}
.pv-nav{min-height:70px!important;padding-top:8px!important;padding-bottom:8px!important;flex-wrap:nowrap!important}
.pv-nav-right{display:flex!important;align-items:center!important;gap:10px!important;flex:0 0 auto!important;margin-left:auto!important}
.pv-nav-actions{display:flex;align-items:center;gap:10px;position:relative;z-index:4;flex:0 0 auto}
.pv-nav-dock,.pv-quick-links{display:none!important}

/* Mi Mazo queda cerca del perfil, manteniendo la idea visual del deck. */
.pv-nav-deck{min-height:40px!important;padding:9px 14px!important;border-radius:15px!important;font-size:12px!important}
.pv-nav-deck:hover{transform:translateY(-2px) scale(1.018)!important}

/* Competitivo compacto/pro: un trigger visible y los rankings en un panel grande al hover/focus. */
.pv-competitive{position:relative;display:inline-flex;align-items:center}
.pv-competitive-trigger{
  position:relative;display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 15px;border-radius:15px;
  color:#f8f4ff;background:linear-gradient(180deg,rgba(27,22,43,.94),rgba(12,14,24,.88));
  border:1px solid rgba(203,181,255,.26);box-shadow:0 10px 22px rgba(0,0,0,.30),inset 0 0 0 1px rgba(255,255,255,.035);
  font-weight:900;font-size:12px;letter-spacing:.075em;text-transform:uppercase;cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
}
.pv-competitive-trigger:hover,.pv-competitive:focus-within .pv-competitive-trigger,.pv-competitive:hover .pv-competitive-trigger{
  transform:translateY(-2px);color:#fff;border-color:rgba(216,180,254,.62);
  background:linear-gradient(180deg,rgba(50,38,80,.96),rgba(18,18,31,.92));
  box-shadow:0 14px 28px rgba(0,0,0,.36),0 0 26px rgba(139,92,246,.22),inset 0 0 0 1px rgba(255,255,255,.055);
}
.pv-competitive-dot{width:12px;height:12px;border-radius:50%;background:radial-gradient(circle,#fff 0 18%,#c4b5fd 20% 44%,#7c3aed 48% 100%);box-shadow:0 0 12px rgba(167,139,250,.62),0 0 22px rgba(124,58,237,.24)}
.pv-competitive-menu{
  position:absolute;right:0;top:calc(100% + 12px);width:278px;display:grid;gap:10px;padding:12px;border-radius:20px;
  background:linear-gradient(180deg,rgba(19,21,32,.985),rgba(8,10,17,.965));
  border:1px solid rgba(203,181,255,.28);box-shadow:0 22px 48px rgba(0,0,0,.55),0 0 34px rgba(124,58,237,.22);
  backdrop-filter:blur(14px) saturate(140%);opacity:0;transform:translateY(-8px) scale(.985);pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;z-index:3000;
}
.pv-competitive:hover .pv-competitive-menu,.pv-competitive:focus-within .pv-competitive-menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.pv-competitive-menu::before{content:"";position:absolute;right:28px;top:-7px;width:14px;height:14px;transform:rotate(45deg);background:rgba(19,21,32,.985);border-left:1px solid rgba(203,181,255,.22);border-top:1px solid rgba(203,181,255,.22)}
.pv-competitive-link{
  position:relative;overflow:hidden;isolation:isolate;display:flex!important;align-items:center;gap:12px;min-height:54px;padding:12px 14px;
  color:#f7f2ff!important;text-decoration:none!important;border-radius:15px;border:1px solid rgba(203,181,255,.16)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.062),rgba(255,255,255,.026))!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);font-size:13px;font-weight:900;letter-spacing:.04em;white-space:nowrap;
  min-width:0!important;width:100%!important;grid-area:auto!important;justify-self:stretch!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.pv-competitive-link::after{content:"";position:absolute;inset:-1px;z-index:-1;background:linear-gradient(120deg,transparent,rgba(203,181,255,.25),transparent);transform:translateX(-110%);transition:transform .52s cubic-bezier(.16,.84,.32,1)}
.pv-competitive-link:hover{transform:translateY(-3px);border-color:rgba(216,180,254,.50)!important;background:linear-gradient(180deg,rgba(124,58,237,.16),rgba(255,255,255,.045))!important;box-shadow:0 14px 26px rgba(0,0,0,.34),0 0 22px rgba(167,139,250,.18)}
.pv-competitive-link:hover::after{transform:translateX(110%)}

/* Nuevos símbolos CSS para los rankings, menos caricatura y más limpios. */
.pv-emote-pvp,.pv-emote-characters{width:24px!important;height:24px!important;filter:drop-shadow(0 0 8px rgba(203,181,255,.42))}
.pv-emote-pvp::before{content:"";position:absolute;left:5px;top:3px;width:14px;height:12px;border-radius:4px 4px 8px 8px;background:linear-gradient(180deg,#e9d5ff,#8b5cf6 58%,#3b176f);box-shadow:0 0 14px rgba(139,92,246,.48)}
.pv-emote-pvp::after{content:"";position:absolute;left:8px;bottom:3px;width:8px;height:8px;border-radius:2px;background:linear-gradient(180deg,#c4b5fd,#5b21b6);box-shadow:-8px -8px 0 -5px rgba(196,181,253,.95),8px -8px 0 -5px rgba(196,181,253,.95)}
.pv-emote-characters::before{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;background:linear-gradient(135deg,#fff,#d8b4fe 34%,#7c3aed 72%,#2e1065);clip-path:polygon(50% 0,61% 34%,98% 34%,68% 55%,80% 96%,50% 70%,20% 96%,32% 55%,2% 34%,39% 34%);box-shadow:0 0 14px rgba(216,180,254,.46)}
.pv-emote-characters::after{content:"";position:absolute;left:10px;top:10px;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.95)}

/* Botón Jugar: morado completo, más premium y sin amarillo/rojo chillón. */
.pv-play-btn{
  color:#fff!important;background:linear-gradient(135deg,#1b1034 0%,#3b1474 34%,#7c3aed 68%,#b15cff 100%)!important;
  border:1px solid rgba(233,213,255,.78)!important;text-shadow:0 2px 8px rgba(0,0,0,.52);
  box-shadow:0 22px 46px rgba(0,0,0,.48),0 0 48px rgba(124,58,237,.42),0 0 22px rgba(216,180,254,.24),inset 0 0 0 1px rgba(255,255,255,.14)!important;
}
.pv-play-btn::before{background:conic-gradient(from 0deg,transparent,rgba(216,180,254,.38),rgba(124,58,237,.46),rgba(236,72,153,.18),transparent)!important;opacity:.95}
.pv-play-btn::after{background:linear-gradient(135deg,rgba(33,16,68,.98),rgba(78,28,150,.98) 46%,rgba(124,58,237,.96) 74%,rgba(177,92,255,.94))!important;box-shadow:inset 0 0 20px rgba(255,255,255,.08)}
.pv-play-symbol{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(221,214,254,.92))!important;box-shadow:0 0 22px rgba(216,180,254,.65),inset 0 0 0 1px rgba(255,255,255,.86)!important;transition:transform .2s ease,box-shadow .2s ease}
.pv-play-symbol::before{border-left-color:#4c1d95!important;filter:drop-shadow(0 0 5px rgba(76,29,149,.32))!important}
.pv-play-btn:hover{filter:brightness(1.08) saturate(1.14)!important;box-shadow:0 28px 58px rgba(0,0,0,.52),0 0 72px rgba(124,58,237,.56),0 0 32px rgba(216,180,254,.34),inset 0 0 0 1px rgba(255,255,255,.22)!important}
.pv-play-btn:hover .pv-play-symbol{transform:scale(1.1);box-shadow:0 0 28px rgba(233,213,255,.82),0 0 18px rgba(124,58,237,.42)!important}

/* Donaciones: pocos acentos de color, nada de RGB excesivo. */
.pv-text-mark{font-weight:900;color:#d8b4fe;text-shadow:0 0 14px rgba(167,139,250,.25)}
.pv-mark-violet,.pv-mark-gold,.pv-mark-blue,.pv-mark-red{color:#d8b4fe}
.pv-reward-gap{display:block;height:12px}
.pv-donate-actions{justify-content:center!important;margin-top:12px!important}
.pv-btn-kofi{margin-left:auto;margin-right:auto}

/* Recompensas: los títulos usan titles.css; aquí solo se evita recorte/pegado. */
.pv-reward-preview .title-badge,.pv-account-title.title-badge,.pv-menu-title.title-badge,.pv-player-title-line .title-badge{overflow:visible!important;max-width:none!important;white-space:nowrap!important;line-height:1.1!important}
.pv-reward-preview .title-badge{margin-top:8px!important}
.pv-account-title.title-badge[hidden],.pv-menu-title.title-badge[hidden]{display:none!important}

/* Últimos donadores: vuelve Gracias, imagen un poco más arriba y cápsula sin estirarse. */
.pv-support-grid{align-items:start!important}
.pv-top-donors{align-self:start!important;min-height:0!important;padding:16px 118px 14px 18px!important;overflow:visible}
.pv-top-donors .pv-chibi{top:42%!important;right:8px!important;width:112px!important;transform:translateY(-50%)!important}
.pv-top-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;margin-bottom:10px!important}
.pv-donor-title-glow{color:#f5efff;text-shadow:0 0 14px rgba(216,180,254,.32),0 0 26px rgba(124,58,237,.22);letter-spacing:.055em}
.pv-thanks-badge{display:inline-flex!important;align-items:center;justify-content:center;padding:5px 10px;border-radius:999px;color:#fff7db;background:linear-gradient(180deg,rgba(251,191,36,.22),rgba(124,58,237,.12));border:1px solid rgba(251,191,36,.28);box-shadow:0 0 16px rgba(251,191,36,.12);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.pv-donor-list{max-height:286px!important;padding-right:2px!important}
.pv-donor-item{min-height:38px;padding:8px 10px!important}

@media (max-width:1180px){
  .pv-player-search{width:246px!important;max-width:246px!important;flex-basis:246px!important}
  .pv-nav-actions{gap:8px}
  .pv-competitive-trigger,.pv-nav-deck{padding-left:12px!important;padding-right:12px!important}
}
@media (max-width:1040px){
  .pv-competitive-trigger span:last-child,.pv-nav-deck span:last-child{display:none}
  .pv-competitive-trigger,.pv-nav-deck{width:42px!important;padding:0!important;justify-content:center!important}
  .pv-competitive-menu{right:-56px}
}
@media (max-width:760px){
  .pv-nav{flex-wrap:wrap!important;min-height:auto!important}
  .pv-nav-actions{order:3;width:100%;justify-content:center;margin-top:6px}
  .pv-competitive-trigger span:last-child,.pv-nav-deck span:last-child{display:inline}
  .pv-competitive-trigger,.pv-nav-deck{width:auto!important;padding:0 12px!important}
  .pv-competitive-menu{left:50%;right:auto;transform:translate(-50%,-8px) scale(.985)}
  .pv-competitive:hover .pv-competitive-menu,.pv-competitive:focus-within .pv-competitive-menu{transform:translate(-50%,0) scale(1)}
  .pv-top-donors{padding-right:18px!important}
}

/* Ajustes visuales del Index. */
.pv-brand{position:absolute!important;left:50%!important;transform:translateX(-50%)!important;width:auto!important;order:0!important;margin-bottom:0!important}
.pv-nav-left{flex:1 1 auto!important;justify-content:flex-start!important;min-width:0!important}
@media (max-width:1120px){
  .pv-brand{position:absolute!important;left:50%!important;transform:translateX(-50%)!important;width:auto!important;margin-bottom:0!important}
  .pv-nav-left{flex:1 1 auto!important;justify-content:flex-start!important;min-width:0!important}
  .pv-nav-right{flex:0 0 auto!important;justify-content:flex-end!important;margin-left:auto!important}
}
.pv-competitive.open .pv-competitive-menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.pv-competitive.open .pv-competitive-trigger{transform:translateY(-2px);color:#fff;border-color:rgba(216,180,254,.62);background:linear-gradient(180deg,rgba(50,38,80,.96),rgba(18,18,31,.92));box-shadow:0 14px 28px rgba(0,0,0,.36),0 0 26px rgba(139,92,246,.22),inset 0 0 0 1px rgba(255,255,255,.055)}
@media (max-width:760px){
  .pv-competitive.open .pv-competitive-menu{transform:translate(-50%,0) scale(1)}
}

/* Ajustes puntuales del Index. */
/* Mi Mazo queda en el navbar donde estaba el boton de Competitivo; no se agranda la zona superior. */
.pv-nav-actions{display:flex!important;align-items:center!important;gap:10px!important;flex:0 0 auto!important}
.pv-nav-actions .pv-nav-deck{height:42px!important;min-height:42px!important;padding:0 16px!important;border-radius:16px!important}

/* El chip del usuario ahora va directo al perfil; se elimina el panel desplegable. */
.pv-account-chip{cursor:pointer!important}
.pv-account-menu{display:none!important}

/* Apartado COMPETITIVO visible, sin click ni desplegable. */
.pv-competitive-panel{
  width:min(760px,calc(100% - 28px));
  margin:-4px auto 16px;
  display:flex;
  justify-content:center;
  animation:pv-enter-soft .55s cubic-bezier(.16,.84,.32,1) both;
  animation-delay:.14s;
}
.pv-competitive-shell{
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:10px 12px;
  border-radius:22px;
  border:1px solid rgba(203,181,255,.20);
  background:linear-gradient(180deg,rgba(18,20,32,.80),rgba(8,10,18,.64));
  box-shadow:0 16px 34px rgba(0,0,0,.34),inset 0 0 0 1px rgba(255,255,255,.035);
  backdrop-filter:blur(13px) saturate(135%);
}
.pv-competitive-shell::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(110deg,rgba(124,58,237,.26),rgba(56,189,248,.10),rgba(216,180,254,.20));
  opacity:.55;
  filter:blur(10px);
}
.pv-competitive-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:40px;
  padding:0 13px;
  border-radius:999px;
  color:#eadcff;
  background:rgba(124,58,237,.15);
  border:1px solid rgba(216,180,254,.20);
  font-size:11px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-shadow:0 0 14px rgba(167,139,250,.22);
  white-space:nowrap;
}
.pv-competitive-direct{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:188px!important;
  min-height:46px;
  padding:0 16px;
  border-radius:16px;
  color:#fff!important;
  text-decoration:none!important;
  border:1px solid rgba(203,181,255,.22)!important;
  background:linear-gradient(180deg,rgba(35,28,56,.88),rgba(13,15,25,.76))!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(255,255,255,.035);
  font-size:13px;
  font-weight:950;
  letter-spacing:.045em;
  white-space:nowrap;
  transition:transform .18s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease,filter .2s ease;
  grid-area:auto!important;
  justify-self:auto!important;
}
.pv-competitive-direct::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  background:linear-gradient(110deg,transparent,rgba(216,180,254,.24),transparent);
  transform:translateX(-120%);
  transition:transform .55s cubic-bezier(.16,.84,.32,1);
}
.pv-competitive-direct:hover{
  transform:translateY(-3px) scale(1.015);
  border-color:rgba(216,180,254,.55)!important;
  background:linear-gradient(180deg,rgba(74,38,132,.34),rgba(18,18,31,.82))!important;
  box-shadow:0 16px 30px rgba(0,0,0,.34),0 0 24px rgba(167,139,250,.20),inset 0 0 0 1px rgba(255,255,255,.055);
  filter:brightness(1.06);
}
.pv-competitive-direct:hover::after{transform:translateX(120%)}

/* Símbolo de Ranking PvP: trofeo/arena construido en CSS. */
.pv-competitive-panel .pv-emote-pvp{
  position:relative!important;
  width:25px!important;
  height:25px!important;
  filter:drop-shadow(0 0 9px rgba(216,180,254,.42));
}
.pv-competitive-panel .pv-emote-pvp::before{
  content:"";
  position:absolute;
  left:5px;
  top:3px;
  width:15px;
  height:12px;
  border-radius:4px 4px 8px 8px;
  background:linear-gradient(180deg,#f5f3ff 0%,#c4b5fd 36%,#7c3aed 100%);
  box-shadow:-5px 2px 0 -2px rgba(196,181,253,.92),5px 2px 0 -2px rgba(196,181,253,.92),0 0 14px rgba(139,92,246,.46);
}
.pv-competitive-panel .pv-emote-pvp::after{
  content:"";
  position:absolute;
  left:8px;
  bottom:3px;
  width:9px;
  height:8px;
  border-radius:2px 2px 4px 4px;
  background:linear-gradient(180deg,#c4b5fd,#4c1d95);
  box-shadow:0 7px 0 -3px rgba(216,180,254,.95),0 0 10px rgba(216,180,254,.35);
}

/* Donadores: deja espacio para el hover del primer item y recorta el sobrante inferior de la capsula. */
.pv-top-donors{
  padding:14px 118px 10px 18px!important;
  overflow:visible!important;
}
.pv-top-donors .pv-chibi{
  top:38%!important;
  right:8px!important;
}
.pv-donor-list{
  max-height:268px!important;
  padding:6px 3px 4px 0!important;
  margin-top:-2px!important;
}
.pv-donor-item{
  min-height:36px!important;
  padding:7px 10px!important;
}
.pv-donor-item:hover{
  transform:translateY(-1px)!important;
}
.pv-thanks-badge{display:inline-flex!important}

@media (max-width:860px){
  .pv-competitive-shell{flex-wrap:wrap;gap:9px;padding:10px}
  .pv-competitive-label{width:100%;height:30px}
  .pv-competitive-direct{min-width:0!important;flex:1 1 220px}
}
@media (max-width:560px){
  .pv-competitive-panel{width:calc(100% - 18px);margin-top:0}
  .pv-competitive-direct{width:100%;flex-basis:100%}
  .pv-top-donors{padding-right:18px!important}
}

/* Competitivo lateral, donadores reales, títulos y botón de juego. */
/* El apartado competitivo vive a la izquierda en escritorio y no empuja donaciones. */
@media (min-width:1280px){
  .pv-competitive-panel{
    position:fixed!important;
    left:clamp(18px,4.1vw,78px)!important;
    top:clamp(138px,17vh,190px)!important;
    z-index:12!important;
    width:250px!important;
    margin:0!important;
    display:flex!important;
    justify-content:flex-start!important;
    pointer-events:none;
  }
  .pv-competitive-shell{
    pointer-events:auto;
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:13px!important;
    border-radius:20px!important;
    background:linear-gradient(180deg,rgba(12,12,23,.66),rgba(16,13,31,.50))!important;
    border:1px solid rgba(203,181,255,.18)!important;
    box-shadow:0 18px 46px rgba(0,0,0,.32),0 0 30px rgba(124,58,237,.10),inset 0 0 0 1px rgba(255,255,255,.035)!important;
    backdrop-filter:blur(10px) saturate(130%)!important;
  }
  .pv-competitive-shell::before{
    opacity:.38!important;
    filter:blur(12px)!important;
    background:linear-gradient(135deg,rgba(124,58,237,.26),rgba(216,180,254,.12),rgba(15,23,42,.05))!important;
  }
  .pv-competitive-label{
    width:100%!important;
    height:32px!important;
    padding:0 12px!important;
    justify-content:flex-start!important;
    color:#f1eaff!important;
    background:linear-gradient(90deg,rgba(124,58,237,.24),rgba(15,23,42,.10))!important;
    border-color:rgba(216,180,254,.22)!important;
  }
  .pv-competitive-direct{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    justify-content:flex-start!important;
    padding:0 14px!important;
    border-radius:16px!important;
    background:linear-gradient(180deg,rgba(23,20,38,.78),rgba(9,10,18,.70))!important;
  }
  .pv-support-grid{margin-top:12px!important;}
}
@media (min-width:980px) and (max-width:1279px){
  .pv-competitive-panel{width:min(620px,calc(100% - 28px))!important;margin:-6px auto 12px!important;}
  .pv-competitive-shell{padding:9px 10px!important;gap:10px!important;}
  .pv-competitive-direct{min-width:180px!important;}
}

/* Ranking PvP: emote CSS tipo VS/arena, sin trofeo. */
.pv-competitive-panel .pv-emote-pvp{
  position:relative!important;
  width:28px!important;
  height:28px!important;
  border-radius:10px!important;
  transform:rotate(-6deg);
  background:linear-gradient(135deg,rgba(216,180,254,.96),rgba(124,58,237,.78) 48%,rgba(49,46,129,.95))!important;
  box-shadow:0 0 14px rgba(167,139,250,.42),inset 0 0 0 1px rgba(255,255,255,.35)!important;
  filter:drop-shadow(0 0 8px rgba(124,58,237,.34))!important;
}
.pv-competitive-panel .pv-emote-pvp::before{
  content:"VS"!important;
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:auto!important;
  left:0!important;
  top:0!important;
  border-radius:inherit!important;
  background:transparent!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:1000!important;
  letter-spacing:-.03em!important;
  text-shadow:0 1px 4px rgba(0,0,0,.72),0 0 8px rgba(255,255,255,.28)!important;
  box-shadow:none!important;
}
.pv-competitive-panel .pv-emote-pvp::after{
  content:""!important;
  position:absolute!important;
  left:5px!important;
  right:5px!important;
  bottom:-4px!important;
  width:auto!important;
  height:3px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(216,180,254,.95),transparent)!important;
  box-shadow:0 0 12px rgba(216,180,254,.55)!important;
}

/* Jugar: morado profundo con borde animado más limpio y aura menos chillona. */
.pv-play-btn{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  color:#fff!important;
  background:linear-gradient(135deg,#170828 0%,#32105f 38%,#6424ce 72%,#9b5cf6 100%)!important;
  border:1px solid rgba(233,213,255,.74)!important;
  box-shadow:0 22px 48px rgba(0,0,0,.48),0 0 48px rgba(124,58,237,.38),inset 0 0 0 1px rgba(255,255,255,.12)!important;
  text-shadow:0 2px 8px rgba(0,0,0,.62),0 0 12px rgba(233,213,255,.28)!important;
}
.pv-play-btn::before{
  content:""!important;
  position:absolute!important;
  inset:-95%!important;
  z-index:-2!important;
  opacity:.85!important;
  background:conic-gradient(from 0deg,transparent 0 18%,rgba(255,255,255,.72) 22%,rgba(167,139,250,.34) 28%,transparent 36% 58%,rgba(216,180,254,.42) 64%,transparent 72% 100%)!important;
  animation:pv-play-aura-v4 5.8s linear infinite!important;
}
.pv-play-btn::after{
  content:""!important;
  position:absolute!important;
  inset:2px!important;
  z-index:-1!important;
  border-radius:inherit!important;
  background:
    radial-gradient(circle at 28% 18%,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(135deg,rgba(23,8,40,.98),rgba(56,19,111,.98) 42%,rgba(102,39,203,.96) 74%,rgba(155,92,246,.92))!important;
  box-shadow:inset 0 0 20px rgba(255,255,255,.075)!important;
}
.pv-play-btn:hover{
  transform:translateY(-5px) scale(1.045)!important;
  filter:brightness(1.09) saturate(1.12)!important;
  box-shadow:0 28px 62px rgba(0,0,0,.55),0 0 70px rgba(124,58,237,.56),0 0 26px rgba(233,213,255,.28),inset 0 0 0 1px rgba(255,255,255,.23)!important;
}
.pv-play-btn:hover::before{opacity:1!important;animation-duration:3.9s!important;}
.pv-play-symbol{
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(233,213,255,.92))!important;
  box-shadow:0 0 22px rgba(216,180,254,.62),inset 0 0 0 1px rgba(255,255,255,.88)!important;
}
.pv-play-symbol::before{border-left-color:#4c1d95!important;}

/* Donadores: sin fake donors, sin corte al hover y con cápsula más justa. */
.pv-top-donors{
  padding:14px 118px 8px 18px!important;
  overflow:visible!important;
  align-self:start!important;
}
.pv-top-donors .pv-chibi{
  top:34%!important;
  right:8px!important;
  width:108px!important;
}
.pv-donor-list{
  max-height:250px!important;
  padding:8px 4px 2px 0!important;
  margin-top:-2px!important;
}
.pv-donor-item{
  min-height:35px!important;
  padding:7px 10px!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.pv-donor-item:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(216,180,254,.38)!important;
  box-shadow:0 9px 18px rgba(0,0,0,.25),0 0 14px rgba(167,139,250,.12)!important;
}
.pv-donor-empty{
  justify-content:center!important;
  color:#cfc8e8!important;
  opacity:.86!important;
  font-size:12px!important;
}
.pv-donor-empty:hover{transform:none!important;}
.pv-thanks-badge{display:inline-flex!important;}

/* Donaciones: solo pocas palabras clave con acento. */
.pv-text-mark{color:#d8b4fe!important;font-weight:950!important;text-shadow:0 0 12px rgba(167,139,250,.24)!important;}

/* Títulos del perfil y del buscador: no se pisan; se fuerza layout compatible con titles.css. */
.pv-account-title.title-badge,
.pv-menu-title.title-badge,
.pv-player-title-line .title-badge{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  max-width:none!important;
  overflow:visible!important;
  white-space:nowrap!important;
  line-height:1!important;
}
.pv-player-title-line{overflow:visible!important;}
.pv-account-identity{overflow:visible!important;}
.pv-reward-preview .title-badge{display:inline-flex!important;align-items:center!important;overflow:visible!important;}

/* Competitivo ampliado y títulos reales. */
.pv-competitive-panel{
  width:min(840px,calc(100% - 28px))!important;
}
.pv-competitive-shell{
  gap:15px!important;
  padding:13px 16px!important;
}
.pv-competitive-label{
  justify-content:center!important;
  text-align:center!important;
  min-width:154px!important;
  height:44px!important;
  padding:0 18px!important;
  font-size:12.5px!important;
  letter-spacing:.14em!important;
}
.pv-competitive-direct{
  min-width:220px!important;
  min-height:54px!important;
  padding:0 20px!important;
  font-size:14px!important;
  gap:12px!important;
}
.pv-competitive-panel .pv-link-emote{
  transform:scale(1.08);
}

@media (min-width:1280px){
  .pv-competitive-panel{
    width:310px!important;
    left:clamp(20px,4.1vw,78px)!important;
    top:clamp(132px,16vh,184px)!important;
  }
  .pv-competitive-shell{
    padding:17px!important;
    gap:13px!important;
  }
  .pv-competitive-label{
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    justify-content:center!important;
    text-align:center!important;
  }
  .pv-competitive-direct{
    width:100%!important;
    min-height:57px!important;
    padding:0 18px!important;
    justify-content:flex-start!important;
    font-size:14.5px!important;
  }
}

@media (max-width:860px){
  .pv-competitive-label{
    width:100%!important;
    min-width:0!important;
  }
  .pv-competitive-direct{
    min-width:0!important;
  }
}

/* El layout del index respeta los presets de titles.css. */
.pv-account-title.title-badge,
.pv-menu-title.title-badge,
.pv-player-title-line .title-badge{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  max-width:none!important;
  overflow:visible!important;
  white-space:nowrap!important;
}


/* Preview grande para marcos de donación. */
.pv-reward-frame{cursor:zoom-in;}
.pv-reward-frame:focus-visible{outline:2px solid rgba(216,180,254,.95);outline-offset:10px;border-radius:999px;}
.pv-index-frame-viewer{
  position:fixed;
  inset:0;
  z-index:1000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:28px;
  background:rgba(0,0,0,.76);
  backdrop-filter:blur(6px);
}
.pv-index-frame-viewer.show{display:flex;}
.pv-index-frame-box{
  width:min(88vw,860px);
  height:min(88vh,860px);
  display:grid;
  place-items:center;
  animation:pv-index-frame-pop .16s ease-out;
}
.pv-index-frame-box img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  filter:drop-shadow(0 24px 60px rgba(0,0,0,.58));
}
@keyframes pv-index-frame-pop{from{opacity:.35;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

/* Respaldo local si el navegador conserva titles.css en caché. */
.title-badge[data-title-key="vip"]{animation:pv-v4-title-flow 6.5s linear infinite, vipGlow 4.8s ease-in-out infinite!important;}
.title-badge[data-title-key="vip"]::before{animation:vipDiamondSoftFloat 4.8s ease-in-out infinite!important;transform:translateY(-.12em) scale(1)!important;margin-right:.20rem!important;}
.title-badge[data-title-key="basado"]::after{animation:basadoEmojiSoftBounce 3.8s ease-in-out infinite!important;}


@keyframes vipDiamondSoftFloat{
  0%,100%{ transform:translateY(-.12em) scale(1); filter:drop-shadow(0 0 4px rgba(216,180,254,.48)); }
  50%{ transform:translateY(-.24em) scale(1.035); filter:drop-shadow(0 0 7px rgba(216,180,254,.68)); }
}
@keyframes basadoEmojiSoftBounce{
  0%,100%{ transform:translateY(0) scale(1); }
  45%{ transform:translateY(-.16em) scale(1.035); }
  70%{ transform:translateY(-.06em) scale(1.012); }
}


@keyframes vipGlow{
  0%,100%{text-shadow:0 0 10px rgba(168,85,247,.35),0 0 18px rgba(56,189,248,.22),0 0 24px rgba(255,79,216,.18)}
  50%{text-shadow:0 0 14px rgba(216,180,254,.62),0 0 26px rgba(56,189,248,.36),0 0 30px rgba(255,79,216,.3)}
}


/* Acceso a Tier List desde el bloque competitivo. */
.pv-competitive-panel .pv-link-tierlist{
  border-color:rgba(251,191,36,.26)!important;
  background:linear-gradient(180deg,rgba(45,29,72,.88),rgba(14,12,24,.76))!important;
}
.pv-competitive-panel .pv-link-tierlist:hover{
  border-color:rgba(252,211,77,.62)!important;
  box-shadow:0 16px 30px rgba(0,0,0,.34),0 0 24px rgba(251,191,36,.18),0 0 24px rgba(167,139,250,.16),inset 0 0 0 1px rgba(255,255,255,.055)!important;
}
.pv-competitive-panel .pv-emote-tierlist{
  position:relative!important;
  width:31px!important;
  height:25px!important;
  flex:0 0 31px!important;
  border-radius:8px!important;
  background:
    linear-gradient(90deg,#ff5a6f 0 26%,rgba(255,255,255,.18) 26% 100%) 0 0/100% 7px no-repeat,
    linear-gradient(90deg,#ffd166 0 26%,rgba(255,255,255,.18) 26% 100%) 0 9px/100% 7px no-repeat,
    linear-gradient(90deg,#7c3aed 0 26%,rgba(255,255,255,.18) 26% 100%) 0 18px/100% 7px no-repeat!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.14),0 0 18px rgba(203,181,255,.22),0 0 18px rgba(251,191,36,.12)!important;
  filter:drop-shadow(0 0 8px rgba(216,180,254,.28));
}
.pv-competitive-panel .pv-emote-tierlist::before,
.pv-competitive-panel .pv-emote-tierlist::after{
  content:""!important;
  position:absolute!important;
  display:block!important;
  width:4px!important;
  height:4px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 9px 0 rgba(255,255,255,.78),0 18px 0 rgba(255,255,255,.68)!important;
  left:5px!important;
  top:1.5px!important;
}
.pv-competitive-panel .pv-emote-tierlist::after{
  left:auto!important;
  right:5px!important;
  opacity:.45!important;
}

/* El tercer boton necesita que el bloque competitivo suba un poco para no chocar con donaciones. */
.pv-competitive-panel{
  margin:-18px auto 12px!important;
}
.pv-competitive-shell{
  flex-wrap:wrap!important;
}
.pv-competitive-direct{
  min-width:205px!important;
}
@media (min-width:1280px){
  .pv-competitive-panel{
    top:clamp(98px,12.8vh,152px)!important;
    width:310px!important;
    margin:0!important;
  }
  .pv-competitive-shell{
    flex-wrap:nowrap!important;
  }
  .pv-competitive-direct{
    min-width:0!important;
  }
}
@media (min-width:980px) and (max-width:1279px){
  .pv-competitive-panel{
    margin:-22px auto 10px!important;
    width:min(920px,calc(100% - 28px))!important;
  }
  .pv-competitive-shell{
    gap:10px!important;
    padding:10px 12px!important;
  }
  .pv-competitive-label{
    min-width:136px!important;
  }
  .pv-competitive-direct{
    flex:1 1 205px!important;
    min-width:0!important;
    padding:0 14px!important;
  }
}
@media (max-width:860px){
  .pv-competitive-panel{
    margin:0 auto 12px!important;
  }
  .pv-competitive-direct{
    flex:1 1 220px!important;
  }
}


/* Ajustes puntuales del Index. */
/* Opera puede hacer micro-tirones con filter + transform en una capa fija gigante. En Opera se usa una respiracion mas ligera. */
html.pv-browser-opera .pv-abyss-bg::before{
  inset:-2.4%!important;
  filter:none!important;
  animation:pv-index-bg-breath-opera-v14 34s linear infinite alternate!important;
  transform:translate3d(0,0,0) scale(1.026)!important;
  transform-origin:center!important;
  backface-visibility:hidden!important;
  will-change:transform!important;
}
@keyframes pv-index-bg-breath-opera-v14{
  from{transform:translate3d(-.18%,-.12%,0) scale(1.026)}
  to{transform:translate3d(.18%,.12%,0) scale(1.045)}
}

/* Competitivo: mas arriba, y se aparta animado cuando el buscador tiene resultados. */
.pv-competitive-panel{
  --pv-competitive-search-shift:0px;
  transition:transform .34s cubic-bezier(.16,.84,.32,1), margin .26s ease!important;
  transform:translateY(var(--pv-competitive-search-shift))!important;
  will-change:transform;
}
@media (min-width:1280px){
  .pv-competitive-panel{
    top:clamp(76px,9.6vh,124px)!important;
  }
}
@media (min-width:980px) and (max-width:1279px){
  .pv-competitive-panel{
    margin:-38px auto 8px!important;
  }
}
@media (max-width:979px){
  .pv-competitive-panel{
    margin:-28px auto 10px!important;
  }
}
@media (max-width:860px){
  .pv-competitive-panel{
    margin:-10px auto 12px!important;
  }
}

/* Botones competitivos con lineas propias por modo. */
.pv-competitive-panel .pv-link-pvp{
  border-color:rgba(248,113,113,.34)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(248,113,113,.20),0 0 0 1px rgba(127,29,29,.10)!important;
}
.pv-competitive-panel .pv-link-pvp:hover{
  border-color:rgba(248,113,113,.68)!important;
  box-shadow:0 16px 30px rgba(0,0,0,.34),0 0 24px rgba(248,113,113,.18),inset 0 0 0 1px rgba(248,113,113,.26)!important;
}
.pv-competitive-panel .pv-link-chars{
  border-color:rgba(96,165,250,.34)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(96,165,250,.20),0 0 0 1px rgba(30,64,175,.10)!important;
}
.pv-competitive-panel .pv-link-chars:hover{
  border-color:rgba(96,165,250,.68)!important;
  box-shadow:0 16px 30px rgba(0,0,0,.34),0 0 24px rgba(96,165,250,.18),inset 0 0 0 1px rgba(96,165,250,.26)!important;
}
.pv-competitive-panel .pv-link-tierlist{
  border-color:rgba(251,191,36,.40)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(251,191,36,.21),0 0 0 1px rgba(146,64,14,.10)!important;
}

/* Estrella de Ranking Characters sin punto blanco central. */
.pv-competitive-panel .pv-emote-characters::after{
  content:none!important;
  display:none!important;
}

/* Simbolo Tier List igual al usado en la Tier List: mini tier list limpia, sin puntos blancos. */
.pv-competitive-panel .pv-emote-tierlist{
  position:relative!important;
  width:31px!important;
  height:25px!important;
  flex:0 0 31px!important;
  border-radius:8px!important;
  background:
    linear-gradient(90deg,#ff5a6f 0 26%,rgba(255,255,255,.16) 26% 100%) 0 0/100% 7px no-repeat,
    linear-gradient(90deg,#ffd166 0 26%,rgba(255,255,255,.16) 26% 100%) 0 9px/100% 7px no-repeat,
    linear-gradient(90deg,#7c3aed 0 26%,rgba(255,255,255,.16) 26% 100%) 0 18px/100% 7px no-repeat!important;
  border:0!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 0 20px rgba(203,181,255,.22),0 0 18px rgba(251,191,36,.10)!important;
  filter:drop-shadow(0 0 8px rgba(216,180,254,.24))!important;
}
.pv-competitive-panel .pv-emote-tierlist::before,
.pv-competitive-panel .pv-emote-tierlist::after{
  content:none!important;
  display:none!important;
}


/* Competitivo centrado, compatibilidad con Opera y buscador limpio. */
/* Opera: mismo zoom visible que Chrome, pero sin filtros caros sobre la capa gigante. */
html.pv-browser-opera .pv-abyss-bg::before{
  inset:-4.5%!important;
  filter:none!important;
  animation:pv-index-bg-breath-opera-v15 18s ease-in-out infinite alternate!important;
  transform-origin:center!important;
  backface-visibility:hidden!important;
  will-change:transform!important;
}
@keyframes pv-index-bg-breath-opera-v15{
  0%{transform:scale(1.035) translate3d(-.75%,-.48%,0)}
  50%{transform:scale(1.065) translate3d(.18%,.12%,0)}
  100%{transform:scale(1.09) translate3d(.72%,.46%,0)}
}

/* Quita la X interna nativa de input[type=search]; se mantiene solo la X propia de PolaVerse. */
#playerSearchInput::-webkit-search-cancel-button,
#playerSearchInput::-webkit-search-decoration,
#playerSearchInput::-webkit-search-results-button,
#playerSearchInput::-webkit-search-results-decoration{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:none!important;
}
#playerSearchInput::-ms-clear,
#playerSearchInput::-ms-reveal{display:none!important;width:0!important;height:0!important;}
#playerSearchInput{appearance:textfield!important;-webkit-appearance:textfield!important;}

/* El panel competitivo ya no se mueve por el buscador: vive debajo de Jugar, centrado y horizontal. */
.pv-main{
  padding-top:8px!important;
  padding-bottom:72px!important;
}
.pv-hero{
  margin:12px 0 6px!important;
}
.pv-hero-banner{
  padding:12px 20px 14px!important;
}
.pv-title{
  font-size:clamp(34px,4vw,42px)!important;
  margin-bottom:6px!important;
}
.pv-subtitle{
  font-size:14px!important;
  max-width:740px!important;
}
.pv-abyss{
  margin:8px auto 6px!important;
}
.pv-abyss-actions{
  margin:0!important;
}

.pv-competitive-panel{
  --pv-competitive-search-shift:0px!important;
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  z-index:2!important;
  width:min(1080px,calc(100% - 28px))!important;
  max-width:1080px!important;
  margin:8px auto 14px!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  pointer-events:auto!important;
  transform:none!important;
  transition:filter .22s ease,opacity .22s ease!important;
  will-change:auto!important;
  animation:pv-panel-in-v4 .45s ease-out .10s both!important;
}
.pv-competitive-panel.is-search-shifted{
  transform:none!important;
}
.pv-competitive-shell{
  width:auto!important;
  max-width:100%!important;
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  padding:10px 14px!important;
  border-radius:22px!important;
}
.pv-competitive-label{
  width:auto!important;
  min-width:142px!important;
  height:42px!important;
  justify-content:center!important;
  text-align:center!important;
  padding:0 16px!important;
  white-space:nowrap!important;
}
.pv-competitive-direct{
  width:auto!important;
  flex:0 0 auto!important;
  min-width:214px!important;
  min-height:52px!important;
  justify-content:center!important;
  padding:0 18px!important;
}
.pv-support-grid{
  margin-top:8px!important;
}

/* Lineas de color limpias por boton competitivo. */
.pv-competitive-panel .pv-link-pvp{
  border-color:rgba(248,113,113,.42)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(248,113,113,.24),0 0 0 1px rgba(127,29,29,.12)!important;
}
.pv-competitive-panel .pv-link-chars{
  border-color:rgba(96,165,250,.42)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(96,165,250,.24),0 0 0 1px rgba(30,64,175,.12)!important;
}
.pv-competitive-panel .pv-link-tierlist{
  border-color:rgba(251,191,36,.44)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.26),inset 0 0 0 1px rgba(251,191,36,.23),0 0 0 1px rgba(146,64,14,.12)!important;
}
.pv-competitive-panel .pv-emote-characters::after{content:none!important;display:none!important;}

/* Mismo símbolo CSS limpio que usa la Tier List en pantalla grande. */
.pv-competitive-panel .pv-emote-tierlist{
  position:relative!important;
  width:31px!important;
  height:25px!important;
  flex:0 0 31px!important;
  border-radius:8px!important;
  background:
    linear-gradient(90deg,#ff5a6f 0 26%,rgba(255,255,255,.16) 26% 100%) 0 0/100% 7px no-repeat,
    linear-gradient(90deg,#ffd166 0 26%,rgba(255,255,255,.16) 26% 100%) 0 9px/100% 7px no-repeat,
    linear-gradient(90deg,#7c3aed 0 26%,rgba(255,255,255,.16) 26% 100%) 0 18px/100% 7px no-repeat!important;
  border:0!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 0 20px rgba(203,181,255,.22),0 0 18px rgba(251,191,36,.10)!important;
  filter:drop-shadow(0 0 8px rgba(216,180,254,.24))!important;
}
.pv-competitive-panel .pv-emote-tierlist::before,
.pv-competitive-panel .pv-emote-tierlist::after{
  content:none!important;
  display:none!important;
}

@media (min-width:1280px){
  .pv-competitive-panel{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    width:min(1080px,calc(100% - 28px))!important;
    max-width:1080px!important;
    margin:8px auto 14px!important;
    justify-content:center!important;
  }
  .pv-competitive-shell{
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
    padding:10px 14px!important;
  }
  .pv-competitive-label{
    width:auto!important;
    min-width:142px!important;
    height:42px!important;
    justify-content:center!important;
  }
  .pv-competitive-direct{
    width:auto!important;
    min-width:214px!important;
    min-height:52px!important;
    justify-content:center!important;
  }
}
@media (max-width:1050px){
  .pv-competitive-shell{
    flex-wrap:wrap!important;
    gap:10px!important;
  }
  .pv-competitive-label{
    flex:1 1 100%!important;
    width:100%!important;
    min-width:0!important;
    height:34px!important;
  }
  .pv-competitive-direct{
    flex:1 1 240px!important;
    min-width:0!important;
  }
}
@media (max-width:640px){
  .pv-main{padding-top:6px!important;}
  .pv-hero{margin-top:8px!important;}
  .pv-hero-banner{padding:10px 14px 12px!important;}
  .pv-title{font-size:30px!important;}
  .pv-competitive-panel{width:calc(100% - 18px)!important;margin:8px auto 12px!important;}
  .pv-competitive-shell{padding:9px!important;}
  .pv-competitive-direct{flex-basis:100%!important;width:100%!important;}
}

/* El buscador usa la X propia, no la nativa del navegador. */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration{
  -webkit-appearance:none;
  appearance:none;
}


/* Index responsive para teléfono vertical y horizontal. */
@media (max-width: 768px){
  .pv-navbar{
    background:rgba(9,11,18,.78)!important;
    border-bottom:1px solid rgba(216,180,254,.16)!important;
    backdrop-filter:blur(14px) saturate(130%)!important;
  }
  .pv-nav{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:
      "brand"
      "tools"
      "search"!important;
    width:100%!important;
    min-height:0!important;
    padding:7px 10px 8px!important;
    gap:7px!important;
    align-items:center!important;
    justify-items:stretch!important;
    flex-wrap:nowrap!important;
  }
  .pv-brand{
    grid-area:brand!important;
    position:relative!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    width:100%!important;
    justify-content:center!important;
    margin:0!important;
    z-index:3!important;
  }
  .pv-logo{
    font-size:23px!important;
    letter-spacing:.105em!important;
    padding:2px 8px!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
  .pv-nav-right{
    grid-area:tools!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    justify-content:center!important;
    align-items:center!important;
    gap:7px!important;
    flex:0 0 auto!important;
    margin:0!important;
    z-index:4!important;
  }
  .pv-nav-left{
    grid-area:search!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    justify-content:center!important;
    align-items:center!important;
    flex:0 0 auto!important;
    z-index:4!important;
  }
  .pv-lang{flex:0 0 auto!important;}
  .pv-flag-btn{
    min-width:40px!important;
    min-height:34px!important;
    height:34px!important;
    padding:0 10px!important;
    font-size:12px!important;
  }
  .pv-lang-menu{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    top:calc(100% + 8px)!important;
    padding:8px!important;
    gap:7px!important;
  }
  .pv-lang-mini{width:38px!important;height:38px!important;font-size:12px!important;}

  .pv-nav-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    flex:0 0 auto!important;
    order:0!important;
    margin:0!important;
    gap:0!important;
  }
  .pv-nav-actions .pv-nav-deck{
    height:36px!important;
    min-height:36px!important;
    width:auto!important;
    padding:0 11px!important;
    border-radius:14px!important;
    font-size:11px!important;
    letter-spacing:.035em!important;
    gap:7px!important;
  }
  .pv-nav-deck .pv-link-emote{
    width:18px!important;
    height:18px!important;
  }

  .pv-account{
    flex:0 1 auto!important;
    min-width:0!important;
  }
  .pv-btn-google{
    min-height:36px!important;
    height:36px!important;
    padding:0 11px!important;
    border-radius:14px!important;
    font-size:11px!important;
    gap:7px!important;
    white-space:nowrap!important;
    box-shadow:0 8px 18px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,255,255,.045)!important;
  }
  .pv-btn-google .g-ico,
  .pv-btn-google .g-ico svg{width:15px!important;height:15px!important;}
  .pv-account-chip{
    min-height:42px!important;
    height:42px!important;
    max-width:150px!important;
    gap:8px!important;
    padding:4px 9px 4px 6px!important;
    border-radius:16px!important;
    overflow:visible!important;
  }
  .pv-account-chip .pv-avatar-wrap.big,
  #accountWrap{
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
    margin-right:0!important;
  }
  .pv-account-identity{
    min-width:0!important;
    max-width:88px!important;
    padding-left:0!important;
    gap:2px!important;
    overflow:hidden!important;
  }
  .pv-account-name{
    display:block!important;
    max-width:88px!important;
    font-size:11px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .pv-account-title{
    display:none!important;
  }

  .pv-player-search{
    width:min(100%,430px)!important;
    max-width:430px!important;
    flex:0 1 auto!important;
    margin:0 auto!important;
    z-index:40!important;
  }
  .pv-player-search-label{
    display:none!important;
  }
  .pv-player-search-box{
    height:36px!important;
    padding:0 9px 0 11px!important;
    gap:7px!important;
    border-radius:14px!important;
  }
  .pv-search-icon{font-size:17px!important;}
  .pv-player-search-input{font-size:12px!important;}
  .pv-player-search-clear{width:24px!important;height:24px!important;}
  .pv-player-results{
    left:50%!important;
    top:calc(100% + 8px)!important;
    width:min(430px,calc(100vw - 18px))!important;
    max-height:min(55vh,390px)!important;
    transform:translate(-50%,-8px) scale(.985)!important;
    border-radius:16px!important;
  }
  .pv-player-search.open .pv-player-results{
    transform:translate(-50%,0) scale(1)!important;
  }

  .pv-main{
    padding-top:6px!important;
    padding-bottom:58px!important;
  }
  .pv-hero{
    margin:7px 0 5px!important;
  }
  .pv-hero-banner{
    width:calc(100% - 18px)!important;
    margin:0 auto!important;
    padding:10px 13px 11px!important;
    border-radius:18px!important;
  }
  .pv-title{
    font-size:clamp(24px,7.2vw,31px)!important;
    line-height:1.06!important;
    margin:0 0 4px!important;
    letter-spacing:.04em!important;
  }
  .pv-subtitle{
    font-size:12px!important;
    line-height:1.35!important;
    max-width:32em!important;
    margin:0 auto!important;
  }
  .pv-abyss{
    margin:7px auto 7px!important;
  }
  .pv-play-btn{
    min-width:0!important;
    min-height:48px!important;
    padding:11px 22px!important;
    gap:11px!important;
    font-size:14px!important;
    letter-spacing:.14em!important;
  }
  .pv-play-symbol{
    width:28px!important;
    height:28px!important;
    flex-basis:28px!important;
  }
  .pv-play-symbol::before{
    left:11px!important;
    top:7px!important;
    border-top-width:7px!important;
    border-bottom-width:7px!important;
    border-left-width:11px!important;
  }

  .pv-competitive-panel{
    width:calc(100% - 18px)!important;
    margin:7px auto 10px!important;
  }
  .pv-competitive-shell{
    width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:8px!important;
    padding:9px!important;
    border-radius:18px!important;
  }
  .pv-competitive-label{
    grid-column:1 / -1!important;
    width:100%!important;
    min-width:0!important;
    height:28px!important;
    padding:0 10px!important;
    font-size:10px!important;
    letter-spacing:.12em!important;
  }
  .pv-competitive-direct{
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    padding:0 9px!important;
    border-radius:14px!important;
    gap:7px!important;
    font-size:10.5px!important;
    letter-spacing:.025em!important;
    justify-content:center!important;
    flex:0 0 auto!important;
  }
  .pv-competitive-panel .pv-link-tierlist{
    grid-column:1 / -1!important;
  }
  .pv-competitive-panel .pv-link-emote{
    transform:scale(.88)!important;
  }

  .pv-support-grid{
    width:calc(100% - 18px)!important;
    margin:8px auto 0!important;
    gap:12px!important;
    grid-template-columns:1fr!important;
  }
  .pv-card{
    border-radius:18px!important;
    padding:14px!important;
  }
  .pv-donate h3,
  .pv-top-donors h3{
    font-size:16px!important;
    margin-bottom:8px!important;
  }
  .pv-donate p,
  .pv-footer p{
    font-size:12px!important;
    line-height:1.48!important;
  }
  .pv-reward-showcase{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    margin:12px 0!important;
  }
  .pv-reward-preview{
    min-width:0!important;
    padding:12px 8px 10px!important;
    border-radius:15px!important;
  }
  .pv-reward-frame{
    width:58px!important;
    height:58px!important;
    margin:5px 0 24px!important;
  }
  .pv-btn-kofi{
    min-height:42px!important;
    padding:10px 15px!important;
    font-size:13px!important;
  }
  .pv-top-donors{
    padding:14px!important;
  }
  .pv-top-donors .pv-chibi{
    display:none!important;
  }
  .pv-donor-list{
    max-height:220px!important;
  }
  .pv-volume{
    right:10px!important;
    bottom:10px!important;
    transform:scale(.92)!important;
    transform-origin:bottom right!important;
  }
}

@media (max-width: 380px){
  .pv-logo{font-size:20px!important;letter-spacing:.08em!important;}
  .pv-nav-right{gap:6px!important;}
  .pv-nav-actions .pv-nav-deck{
    width:38px!important;
    padding:0!important;
    justify-content:center!important;
  }
  .pv-nav-deck span:last-child{display:none!important;}
  .pv-account-chip{max-width:122px!important;padding-right:7px!important;}
  .pv-account-identity{max-width:62px!important;}
  .pv-account-name{max-width:62px!important;font-size:10.5px!important;}
  .pv-btn-google .g-label{max-width:92px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
  .pv-competitive-direct{font-size:10px!important;padding:0 7px!important;}
  .pv-subtitle{display:none!important;}
}

@media (max-width: 960px) and (orientation: landscape) and (max-height: 520px){
  .pv-navbar{
    background:rgba(9,11,18,.74)!important;
    backdrop-filter:blur(12px) saturate(130%)!important;
  }
  .pv-nav{
    display:flex!important;
    flex-wrap:nowrap!important;
    min-height:52px!important;
    padding:5px 8px!important;
    gap:8px!important;
    align-items:center!important;
  }
  .pv-brand{
    position:absolute!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:auto!important;
    z-index:1!important;
  }
  .pv-logo{
    font-size:20px!important;
    letter-spacing:.09em!important;
    padding:2px 6px!important;
  }
  .pv-nav-left{
    display:flex!important;
    flex:0 1 218px!important;
    min-width:170px!important;
    width:auto!important;
    justify-content:flex-start!important;
    z-index:3!important;
  }
  .pv-player-search{
    width:218px!important;
    max-width:218px!important;
    flex-basis:218px!important;
  }
  .pv-player-search-label{display:none!important;}
  .pv-player-search-box{height:35px!important;border-radius:14px!important;}
  .pv-nav-right{
    display:flex!important;
    flex:0 0 auto!important;
    justify-content:flex-end!important;
    align-items:center!important;
    gap:7px!important;
    margin-left:auto!important;
    z-index:4!important;
  }
  .pv-flag-btn{min-width:38px!important;min-height:34px!important;height:34px!important;padding:0 9px!important;font-size:11px!important;}
  .pv-nav-actions .pv-nav-deck{height:35px!important;min-height:35px!important;padding:0 10px!important;font-size:10.5px!important;gap:6px!important;}
  .pv-account-chip{min-height:38px!important;height:38px!important;max-width:132px!important;gap:7px!important;padding:3px 8px 3px 5px!important;border-radius:15px!important;}
  .pv-account-chip .pv-avatar-wrap.big,#accountWrap{width:31px!important;height:31px!important;flex-basis:31px!important;}
  .pv-account-identity{max-width:76px!important;min-width:0!important;padding-left:0!important;}
  .pv-account-name{display:block!important;max-width:76px!important;font-size:10.5px!important;line-height:1!important;}
  .pv-account-title{display:none!important;}
  .pv-btn-google{height:35px!important;min-height:35px!important;padding:0 10px!important;font-size:10.5px!important;border-radius:14px!important;}

  .pv-main{padding-top:2px!important;padding-bottom:48px!important;}
  .pv-hero{margin:4px 0 4px!important;}
  .pv-hero-banner{padding:7px 14px!important;border-radius:16px!important;max-width:min(620px,calc(100% - 18px))!important;}
  .pv-title{font-size:24px!important;line-height:1!important;margin-bottom:2px!important;}
  .pv-subtitle{display:none!important;}
  .pv-abyss{margin:5px auto!important;}
  .pv-play-btn{min-height:42px!important;padding:9px 22px!important;font-size:12px!important;letter-spacing:.13em!important;}
  .pv-play-symbol{width:25px!important;height:25px!important;flex-basis:25px!important;}
  .pv-competitive-panel{width:min(760px,calc(100% - 18px))!important;margin:5px auto 8px!important;}
  .pv-competitive-shell{display:flex!important;flex-wrap:nowrap!important;gap:7px!important;padding:7px!important;border-radius:16px!important;}
  .pv-competitive-label{width:auto!important;min-width:118px!important;height:34px!important;font-size:10px!important;padding:0 10px!important;}
  .pv-competitive-direct{min-width:145px!important;min-height:38px!important;padding:0 10px!important;font-size:10.5px!important;gap:7px!important;}
  .pv-support-grid{grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr)!important;width:min(900px,calc(100% - 18px))!important;margin-top:6px!important;gap:10px!important;}
  .pv-card{padding:12px!important;border-radius:16px!important;}
  .pv-donate h3,.pv-top-donors h3{font-size:15px!important;margin-bottom:6px!important;}
  .pv-donate p{font-size:11.5px!important;line-height:1.38!important;}
  .pv-reward-showcase{display:none!important;}
  .pv-top-donors{padding:12px!important;}
  .pv-top-donors .pv-chibi{display:none!important;}
  .pv-donor-list{max-height:116px!important;}
  .pv-footer{display:none!important;}
  .pv-volume{right:8px!important;bottom:8px!important;transform:scale(.82)!important;transform-origin:bottom right!important;}
}

/* Ajustes móviles de vertical y horizontal. */
@media (max-width: 768px){
  /* Los titulos equipados dentro del perfil/menu no deben verse gigantes en telefono. */
  .pv-account-menu .title-badge,
  .pv-menu-title.title-badge,
  .pv-account-title.title-badge{
    font-size:10.5px!important;
    line-height:1.08!important;
    max-width:170px!important;
    transform:scale(.92)!important;
    transform-origin:left center!important;
  }
  .pv-account-header{
    align-items:center!important;
  }
  .pv-account-meta{
    gap:4px!important;
  }
}

@media (max-width: 960px) and (orientation: landscape) and (max-height: 520px){
  /* Header horizontal mas limpio: el logo no invade los controles. */
  .pv-nav{
    min-height:48px!important;
    padding:4px 8px!important;
    gap:7px!important;
  }
  .pv-logo{
    font-size:17px!important;
    letter-spacing:.075em!important;
    padding:1px 5px!important;
  }
  .pv-nav-left{
    flex:0 1 210px!important;
    min-width:158px!important;
  }
  .pv-player-search{
    width:210px!important;
    max-width:210px!important;
    flex-basis:210px!important;
  }
  .pv-player-search-box{
    height:33px!important;
    padding:0 8px 0 10px!important;
  }
  .pv-nav-right{
    gap:6px!important;
  }
  .pv-flag-btn,
  .pv-nav-actions .pv-nav-deck,
  .pv-btn-google{
    height:33px!important;
    min-height:33px!important;
  }
  .pv-account-chip{
    min-height:36px!important;
    height:36px!important;
  }

  /* Hero mas profesional en horizontal: menos alto y titulo mas pequeño. */
  .pv-main{
    padding-top:1px!important;
  }
  .pv-hero{
    margin:2px 0 3px!important;
  }
  .pv-hero-banner{
    padding:5px 12px 6px!important;
    max-width:min(560px,calc(100% - 18px))!important;
  }
  .pv-title{
    font-size:19px!important;
    line-height:1!important;
    letter-spacing:.035em!important;
    margin:0!important;
  }

  /* Boton Jugar: el triangulo se centra dentro del circulo blanco al achicarse. */
  .pv-abyss{
    margin:4px auto!important;
  }
  .pv-play-btn{
    min-height:40px!important;
    padding:8px 21px!important;
    gap:10px!important;
    font-size:12px!important;
    letter-spacing:.13em!important;
    overflow:hidden!important;
  }
  .pv-play-symbol{
    width:26px!important;
    height:26px!important;
    flex:0 0 26px!important;
    display:inline-block!important;
  }
  .pv-play-symbol::before{
    left:50%!important;
    top:50%!important;
    transform:translate(-34%,-50%)!important;
    border-top-width:6px!important;
    border-bottom-width:6px!important;
    border-left-width:10px!important;
  }

  /* Competitivo horizontal: botones con espacio real, sin texto ni iconos saliendose. */
  .pv-competitive-panel{
    width:min(860px,calc(100% - 14px))!important;
    margin:4px auto 6px!important;
  }
  .pv-competitive-shell{
    gap:6px!important;
    padding:6px!important;
    border-radius:15px!important;
  }
  .pv-competitive-label{
    min-width:104px!important;
    height:32px!important;
    padding:0 9px!important;
    font-size:9.5px!important;
    letter-spacing:.105em!important;
  }
  .pv-competitive-direct{
    min-height:36px!important;
    height:36px!important;
    padding:0 9px!important;
    gap:6px!important;
    font-size:9.8px!important;
    letter-spacing:.01em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  .pv-competitive-direct > span:last-child{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    line-height:1!important;
  }
  .pv-competitive-panel .pv-link-pvp{
    min-width:132px!important;
  }
  .pv-competitive-panel .pv-link-chars{
    min-width:178px!important;
  }
  .pv-competitive-panel .pv-link-tierlist{
    min-width:122px!important;
  }
  .pv-competitive-panel .pv-link-emote{
    transform:none!important;
    flex-shrink:0!important;
  }
  .pv-competitive-panel .pv-emote-characters{
    width:19px!important;
    height:19px!important;
    flex:0 0 19px!important;
    overflow:visible!important;
  }
  .pv-competitive-panel .pv-emote-characters::before{
    left:2px!important;
    top:2px!important;
    width:15px!important;
    height:15px!important;
  }
  .pv-competitive-panel .pv-emote-tierlist{
    width:25px!important;
    height:21px!important;
    flex:0 0 25px!important;
    border-radius:7px!important;
    background:
      linear-gradient(90deg,#ff5a6f 0 26%,rgba(255,255,255,.16) 26% 100%) 0 0/100% 6px no-repeat,
      linear-gradient(90deg,#ffd166 0 26%,rgba(255,255,255,.16) 26% 100%) 0 8px/100% 6px no-repeat,
      linear-gradient(90deg,#7c3aed 0 26%,rgba(255,255,255,.16) 26% 100%) 0 16px/100% 6px no-repeat!important;
  }

  /* Donaciones horizontal: los marcos Donor/VIP vuelven a verse, compactos y centrados. */
  .pv-support-grid{
    grid-template-columns:minmax(0,1.18fr) minmax(226px,.82fr)!important;
    width:min(900px,calc(100% - 14px))!important;
    margin-top:5px!important;
    gap:9px!important;
  }
  .pv-card{
    padding:10px 11px!important;
  }
  .pv-donate h3,
  .pv-top-donors h3{
    font-size:14px!important;
    margin-bottom:5px!important;
  }
  .pv-donate p{
    font-size:10.7px!important;
    line-height:1.28!important;
    margin:5px 0!important;
  }
  .pv-reward-showcase{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    margin:7px 0 8px!important;
  }
  .pv-reward-preview{
    min-width:0!important;
    padding:8px 6px 7px!important;
    gap:5px!important;
    border-radius:13px!important;
  }
  .pv-reward-frame{
    width:46px!important;
    height:46px!important;
    margin:2px 0 14px!important;
  }
  .pv-reward-frame .pv-avatar-frame{
    display:block!important;
    width:184%!important;
    height:184%!important;
  }
  .pv-reward-preview .title-badge{
    font-size:10.5px!important;
    line-height:1.05!important;
    margin-top:0!important;
  }
  .pv-reward-preview small{
    font-size:9.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .pv-donate-actions{
    margin-top:4px!important;
  }
  .pv-btn-kofi{
    min-height:34px!important;
    padding:7px 12px!important;
    font-size:11px!important;
  }
  .pv-btn-kofi .ico{
    width:15px!important;
    height:15px!important;
  }
  .pv-donor-list{
    max-height:132px!important;
  }
}

/* Perfil horizontal y buscador compacto en móvil. */
@media (max-width: 768px){
  /* Resultados del buscador: compactos, no tarjetas gigantes. */
  .pv-player-results{
    width:min(360px,calc(100vw - 18px))!important;
    max-height:min(44vh,285px)!important;
    padding:7px!important;
    gap:6px!important;
    border-radius:14px!important;
  }
  .pv-player-result{
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:8px!important;
    min-height:58px!important;
    padding:7px 9px!important;
    border-radius:12px!important;
  }
  .pv-player-avatar.avatar{
    width:40px!important;
    height:40px!important;
    border-width:1px!important;
    box-shadow:0 5px 12px rgba(0,0,0,.32)!important;
  }
  .pv-player-result-info{
    gap:4px!important;
    padding-left:1px!important;
  }
  .pv-player-result-name{
    font-size:12px!important;
    line-height:1.08!important;
  }
  .pv-player-result-sub{
    gap:4px!important;
  }
  .pv-player-handle{
    min-height:17px!important;
    padding:1px 6px!important;
    font-size:9.5px!important;
    line-height:1!important;
  }
  .pv-player-title-line{
    min-height:17px!important;
    margin-top:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .pv-player-title-line .title-badge{
    font-size:9.5px!important;
    line-height:1!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .pv-player-search-msg{
    padding:9px 8px!important;
    border-radius:11px!important;
    font-size:11px!important;
  }
}

@media (max-width: 960px) and (orientation: landscape) and (max-height: 520px){
  /* Menú del perfil en horizontal: nombre y título compactos, sin cortes feos. */
  .pv-account-menu{
    top:54px!important;
    right:8px!important;
    min-width:238px!important;
    width:238px!important;
    max-width:calc(100vw - 16px)!important;
    padding:8px!important;
    border-radius:13px!important;
    overflow:visible!important;
  }
  .pv-account-header{
    gap:9px!important;
    padding:5px 5px 7px 3px!important;
    align-items:center!important;
  }
  .pv-account-header .pv-avatar-wrap,
  .pv-avatar-wrap.xbig#menuWrap{
    width:42px!important;
    height:42px!important;
    flex:0 0 42px!important;
    margin-right:4px!important;
  }
  .pv-account-meta{
    min-width:0!important;
    max-width:160px!important;
    gap:3px!important;
    overflow:visible!important;
  }
  .pv-account-meta strong,
  #menuName{
    max-width:160px!important;
    font-size:12px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .pv-account-meta small,
  #menuEmail{
    max-width:160px!important;
    font-size:9.5px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .pv-menu-title.title-badge,
  .pv-account-menu .pv-menu-title.title-badge,
  .pv-account-menu .title-badge{
    display:inline-flex!important;
    align-items:center!important;
    max-width:158px!important;
    min-height:13px!important;
    font-size:8.8px!important;
    line-height:1!important;
    letter-spacing:.015em!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    transform:none!important;
    transform-origin:left center!important;
  }
  .pv-menu-title.title-badge[hidden],
  .pv-account-menu .title-badge[hidden]{
    display:none!important;
  }
  .pv-menu-title.title-badge::before,
  .pv-menu-title.title-badge::after,
  .pv-account-menu .title-badge::before,
  .pv-account-menu .title-badge::after{
    font-size:.95em!important;
    flex:0 0 auto!important;
  }
  .pv-account-menu hr{
    margin:6px 0!important;
  }
  .pv-account-item{
    padding:7px 9px!important;
    border-radius:9px!important;
    font-size:11px!important;
    line-height:1.1!important;
  }

  /* Chip superior: que el nombre no se vea tosco ni corte raro en horizontal. */
  .pv-account-chip{
    max-width:126px!important;
    gap:6px!important;
    padding:3px 7px 3px 5px!important;
  }
  .pv-account-identity{
    max-width:72px!important;
  }
  .pv-account-name{
    max-width:72px!important;
    font-size:10px!important;
    line-height:1!important;
  }

  /* Buscador horizontal: resultados pequeños y útiles, no una pared enorme. */
  .pv-player-results{
    width:min(300px,calc(100vw - 18px))!important;
    max-height:min(50vh,188px)!important;
    padding:6px!important;
    gap:5px!important;
  }
  .pv-player-result{
    grid-template-columns:46px minmax(0,1fr)!important;
    gap:7px!important;
    min-height:50px!important;
    padding:6px 8px!important;
    border-radius:11px!important;
  }
  .pv-player-avatar.avatar{
    width:34px!important;
    height:34px!important;
  }
  .pv-player-result-info{
    gap:3px!important;
  }
  .pv-player-result-name{
    font-size:11px!important;
  }
  .pv-player-handle{
    min-height:16px!important;
    font-size:8.8px!important;
    padding:1px 5px!important;
  }
  .pv-player-title-line{
    min-height:15px!important;
  }
  .pv-player-title-line .title-badge{
    font-size:8.8px!important;
  }
}

/* Título del perfil y visor de marcos en móvil horizontal. */
@media (max-width: 960px) and (orientation: landscape) and (max-height: 520px){
  /* El titulo equipado usa el mismo comportamiento compacto del vertical, pero con selector por ID. */
  body #accountMenu.pv-account-menu{
    min-width:238px!important;
    width:238px!important;
    max-width:calc(100vw - 16px)!important;
    overflow:visible!important;
  }
  body #accountMenu .pv-account-header{
    align-items:center!important;
    min-height:54px!important;
    overflow:visible!important;
  }
  body #accountMenu .pv-account-meta{
    min-width:0!important;
    max-width:170px!important;
    overflow:visible!important;
    gap:4px!important;
  }
  body #accountMenu #menuName{
    max-width:170px!important;
    font-size:12px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body #accountMenu #menuEmail{
    max-width:170px!important;
    font-size:9.5px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body #accountMenu #menuTitle.pv-menu-title.title-badge{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:.28rem!important;
    width:auto!important;
    min-width:0!important;
    max-width:170px!important;
    min-height:18px!important;
    padding:.125rem .5rem!important;
    margin:0!important;
    border-radius:.5rem!important;
    font-size:10.5px!important;
    line-height:1.08!important;
    letter-spacing:normal!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    vertical-align:middle!important;
    transform:scale(.92)!important;
    transform-origin:left center!important;
  }
  body #accountMenu #menuTitle.pv-menu-title.title-badge[hidden]{
    display:none!important;
  }
  body #accountMenu #menuTitle.pv-menu-title.title-badge::before,
  body #accountMenu #menuTitle.pv-menu-title.title-badge::after{
    font-size:.95em!important;
    line-height:1!important;
    flex:0 0 auto!important;
  }

  /* Marcos expandidos en horizontal: compactos, centrados y sin cortes. */
  body .pv-index-frame-viewer{
    padding:14px 18px!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  body .pv-index-frame-box{
    width:min(70vh,300px)!important;
    height:min(70vh,300px)!important;
    max-width:calc(100vw - 36px)!important;
    max-height:calc(100vh - 36px)!important;
    display:grid!important;
    place-items:center!important;
  }
  body .pv-index-frame-box img{
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    transform:none!important;
  }
}

/* Título equipado del chip de cuenta en móvil horizontal. */
@media (max-width: 1024px) and (orientation: landscape) and (max-height: 540px){
  body #accountBtn.pv-account-chip{
    max-width:136px!important;
    min-width:0!important;
    overflow:visible!important;
  }
  body #accountBtn .pv-account-identity{
    min-width:0!important;
    max-width:76px!important;
    overflow:visible!important;
    gap:2px!important;
  }
  body #accountName.pv-account-name{
    max-width:76px!important;
    font-size:10px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body #accountBtn #accountTitle.pv-account-title.title-badge,
  body #accountTitle.pv-account-title.title-badge,
  body span#accountTitle.title-badge[data-title-style]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:.22rem!important;
    width:auto!important;
    min-width:0!important;
    max-width:76px!important;
    min-height:13px!important;
    padding:1px 5px!important;
    margin:0!important;
    border-radius:7px!important;
    font-size:8.5px!important;
    line-height:1!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    vertical-align:middle!important;
    transform:none!important;
    transform-origin:left center!important;
  }
  body #accountBtn #accountTitle.pv-account-title.title-badge::before,
  body #accountBtn #accountTitle.pv-account-title.title-badge::after,
  body span#accountTitle.title-badge[data-title-style]::before,
  body span#accountTitle.title-badge[data-title-style]::after{
    font-size:.9em!important;
    line-height:1!important;
    flex:0 0 auto!important;
  }
}

/* Cápsula de perfil móvil con nombre separado. */
@media (max-width: 768px) and (orientation: portrait){
  body #accountBtn.pv-account-chip{
    width:auto!important;
    min-width:0!important;
    max-width:min(235px, 64vw)!important;
    height:auto!important;
    min-height:44px!important;
    padding:4px 10px 4px 6px!important;
    gap:10px!important;
    overflow:visible!important;
  }
  body #accountBtn .pv-avatar-wrap.big,
  body #accountWrap{
    width:34px!important;
    height:34px!important;
    flex:0 0 34px!important;
    margin-right:2px!important;
  }
  body #accountBtn .pv-account-identity{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:calc(100% - 46px)!important;
    padding-left:3px!important;
    gap:2px!important;
    overflow:visible!important;
  }
  body #accountName.pv-account-name{
    display:block!important;
    max-width:100%!important;
    font-size:11px!important;
    line-height:1.04!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body #accountBtn #accountTitle.pv-account-title.title-badge,
  body #accountTitle.pv-account-title.title-badge,
  body span#accountTitle.title-badge[data-title-style]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:.22rem!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:13px!important;
    padding:1px 5px!important;
    margin:0!important;
    border-radius:7px!important;
    font-size:9px!important;
    line-height:1!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    vertical-align:middle!important;
    transform:none!important;
    transform-origin:left center!important;
  }
  body #accountBtn #accountTitle.pv-account-title.title-badge::before,
  body #accountBtn #accountTitle.pv-account-title.title-badge::after,
  body span#accountTitle.title-badge[data-title-style]::before,
  body span#accountTitle.title-badge[data-title-style]::after{
    font-size:.9em!important;
    line-height:1!important;
    flex:0 0 auto!important;
  }
}

@media (max-width: 1024px) and (orientation: landscape) and (max-height: 540px){
  body #accountBtn.pv-account-chip{
    max-width:148px!important;
    gap:8px!important;
    padding-left:6px!important;
    padding-right:8px!important;
  }
  body #accountBtn .pv-account-identity{
    max-width:86px!important;
    padding-left:3px!important;
  }
  body #accountName.pv-account-name{
    max-width:86px!important;
  }
  body #accountBtn #accountTitle.pv-account-title.title-badge,
  body #accountTitle.pv-account-title.title-badge,
  body span#accountTitle.title-badge[data-title-style]{
    max-width:86px!important;
    font-size:8.5px!important;
  }
}


/* Pulido visual conservador sobre la base del Index. */
@media (min-width: 1981px) and (min-height: 1081px){
  .pv-navbar{
    min-height:auto!important;
  }
  .pv-nav{
    width:100%!important;
    max-width:none!important;
    min-height:clamp(78px,4.9vh,94px)!important;
    padding:clamp(10px,.75vh,14px) clamp(18px,1.12vw,32px)!important;
    gap:clamp(14px,.9vw,24px)!important;
    align-items:center!important;
  }
  .pv-brand{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    width:auto!important;
    margin:0!important;
    z-index:3!important;
    pointer-events:auto!important;
  }
  .pv-logo{
    font-size:clamp(28px,1.32vw,36px)!important;
    letter-spacing:.12em!important;
    line-height:1!important;
    padding:clamp(6px,.45vh,9px) clamp(10px,.6vw,16px)!important;
    text-align:center!important;
    white-space:nowrap!important;
  }
  .pv-nav-left{
    flex:1 1 0!important;
    min-width:0!important;
    justify-content:flex-start!important;
    align-items:center!important;
    z-index:4!important;
  }
  .pv-nav-right{
    flex:1 1 0!important;
    min-width:0!important;
    justify-content:flex-end!important;
    align-items:center!important;
    margin-left:0!important;
    gap:clamp(10px,.7vw,18px)!important;
    z-index:4!important;
  }
  .pv-player-search{
    width:clamp(286px,14.2vw,372px)!important;
    max-width:clamp(286px,14.2vw,372px)!important;
    flex-basis:clamp(286px,14.2vw,372px)!important;
  }
  .pv-player-search-label{
    font-size:clamp(10px,.52vw,13px)!important;
    margin-left:clamp(12px,.7vw,18px)!important;
  }
  .pv-player-search-box{
    height:clamp(43px,2.65vh,52px)!important;
    padding-left:clamp(12px,.75vw,18px)!important;
    padding-right:clamp(10px,.65vw,16px)!important;
  }
  .pv-player-search-input{
    font-size:clamp(13px,.72vw,17px)!important;
  }
  .pv-nav-actions .pv-nav-deck{
    height:clamp(42px,2.7vh,52px)!important;
    min-height:clamp(42px,2.7vh,52px)!important;
    padding:0 clamp(16px,.9vw,24px)!important;
    font-size:clamp(12px,.66vw,16px)!important;
    gap:clamp(8px,.48vw,12px)!important;
  }
  .pv-flag-btn{
    min-width:clamp(46px,2.45vw,58px)!important;
    min-height:clamp(38px,2.45vh,48px)!important;
    padding:0 clamp(12px,.68vw,18px)!important;
    font-size:clamp(12px,.62vw,15px)!important;
  }
  .pv-account{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    align-self:center!important;
    margin:0!important;
  }
  .pv-account-chip{
    min-height:clamp(44px,2.75vh,54px)!important;
    height:auto!important;
    max-width:clamp(230px,12.5vw,310px)!important;
    padding:clamp(7px,.48vh,10px) clamp(14px,.75vw,20px)!important;
    gap:clamp(12px,.65vw,16px)!important;
    border-radius:clamp(18px,1.1vw,24px)!important;
  }
  .pv-account-chip .pv-avatar-wrap.big,
  #accountWrap{
    width:clamp(38px,2.35vw,52px)!important;
    height:clamp(38px,2.35vw,52px)!important;
    flex:0 0 clamp(38px,2.35vw,52px)!important;
  }
  .pv-account-identity{
    max-width:clamp(150px,8.5vw,220px)!important;
    min-width:0!important;
  }
  .pv-account-name{
    max-width:clamp(150px,8.5vw,220px)!important;
    font-size:clamp(13px,.72vw,17px)!important;
  }

  .pv-main{
    max-width:clamp(1200px,62vw,1660px)!important;
    padding:clamp(12px,1.05vh,22px) clamp(20px,1.2vw,36px) clamp(80px,5.8vh,116px)!important;
  }
  .pv-hero{
    margin:clamp(14px,1.25vh,26px) 0 clamp(8px,.75vh,14px)!important;
  }
  .pv-hero-banner{
    padding:clamp(15px,1.05vh,24px) clamp(24px,1.55vw,44px) clamp(17px,1.18vh,28px)!important;
    border-radius:clamp(18px,1.15vw,28px)!important;
  }
  .pv-title{
    font-size:clamp(46px,2.22vw,62px)!important;
    line-height:1.08!important;
    margin:0 0 clamp(6px,.55vh,12px)!important;
    letter-spacing:.035em!important;
  }
  .pv-subtitle{
    font-size:clamp(14px,.74vw,19px)!important;
    line-height:1.45!important;
    max-width:clamp(780px,42vw,1080px)!important;
  }
  .pv-abyss{
    margin:clamp(9px,.9vh,18px) auto clamp(8px,.85vh,18px)!important;
  }
  .pv-play-btn{
    min-height:clamp(58px,3.75vh,76px)!important;
    padding:clamp(13px,.95vh,20px) clamp(24px,1.55vw,44px)!important;
    font-size:clamp(18px,.94vw,24px)!important;
    gap:clamp(12px,.75vw,18px)!important;
    border-radius:999px!important;
  }
  .pv-play-symbol{
    width:clamp(34px,1.92vw,48px)!important;
    height:clamp(34px,1.92vw,48px)!important;
    flex-basis:clamp(34px,1.92vw,48px)!important;
  }
  .pv-play-symbol::before{
    left:43%!important;
    top:50%!important;
    transform:translate(-35%,-50%)!important;
    border-top-width:clamp(8px,.5vw,12px)!important;
    border-bottom-width:clamp(8px,.5vw,12px)!important;
    border-left-width:clamp(13px,.72vw,18px)!important;
  }

  .pv-competitive-panel{
    width:min(clamp(1080px,55vw,1460px),calc(100% - 56px))!important;
    max-width:1460px!important;
    margin:clamp(10px,.9vh,18px) auto clamp(16px,1.15vh,26px)!important;
  }
  .pv-competitive-shell{
    gap:clamp(12px,.74vw,20px)!important;
    padding:clamp(11px,.75vh,18px) clamp(15px,.95vw,26px)!important;
    border-radius:clamp(22px,1.35vw,32px)!important;
  }
  .pv-competitive-label{
    min-width:clamp(142px,7.5vw,200px)!important;
    height:clamp(42px,2.72vh,56px)!important;
    padding:0 clamp(16px,.9vw,24px)!important;
    font-size:clamp(11px,.6vw,15px)!important;
  }
  .pv-competitive-direct{
    min-width:clamp(214px,11vw,300px)!important;
    min-height:clamp(52px,3.2vh,66px)!important;
    padding:0 clamp(18px,1vw,28px)!important;
    font-size:clamp(13px,.72vw,18px)!important;
    gap:clamp(10px,.62vw,16px)!important;
    border-radius:clamp(16px,1vw,24px)!important;
  }
  .pv-competitive-panel .pv-link-emote{
    transform:scale(clamp(1,1.14,1.18))!important;
    transform-origin:center!important;
  }

  .pv-support-grid{
    grid-template-columns:minmax(0,1.35fr) minmax(360px,.95fr)!important;
    gap:clamp(20px,1.35vw,36px)!important;
    margin-top:clamp(10px,.85vh,20px)!important;
  }
  .pv-card{
    padding:clamp(20px,1.18vw,32px)!important;
    border-radius:clamp(16px,1.05vw,26px)!important;
  }
  .pv-donate{
    padding-right:clamp(140px,7.2vw,190px)!important;
  }
  .pv-top-donors{
    padding:clamp(18px,1.05vw,28px) clamp(150px,7.4vw,200px) clamp(18px,1.05vw,28px) clamp(20px,1.12vw,32px)!important;
  }
  .pv-card .pv-chibi,
  .pv-top-donors .pv-chibi{
    width:clamp(112px,6.25vw,162px)!important;
    right:clamp(8px,.6vw,18px)!important;
  }
  .pv-card h3,
  .pv-donate h3,
  .pv-top-donors h3{
    font-size:clamp(20px,1.1vw,28px)!important;
    margin-top:0!important;
    margin-bottom:clamp(10px,.7vh,16px)!important;
  }
  .pv-card p,
  .pv-donate p,
  .pv-footer p{
    font-size:clamp(14px,.76vw,19px)!important;
    line-height:1.52!important;
  }
  .pv-reward-showcase{
    gap:clamp(12px,.78vw,22px)!important;
    margin:clamp(16px,1.05vh,28px) 0!important;
  }
  .pv-reward-preview{
    padding:clamp(14px,.9vw,22px)!important;
    border-radius:clamp(15px,.95vw,24px)!important;
  }
  .pv-reward-frame{
    width:clamp(66px,3.7vw,96px)!important;
    height:clamp(66px,3.7vw,96px)!important;
  }
  .pv-btn-kofi{
    min-height:clamp(48px,3vh,62px)!important;
    padding:clamp(12px,.85vh,18px) clamp(20px,1.15vw,32px)!important;
    font-size:clamp(16px,.85vw,21px)!important;
  }
  .pv-donor-list{
    max-height:clamp(286px,18vh,390px)!important;
    gap:clamp(8px,.55vh,13px)!important;
  }
  .pv-donor-item{
    min-height:clamp(40px,2.45vh,52px)!important;
    padding:clamp(8px,.58vh,12px) clamp(10px,.72vw,16px)!important;
    font-size:clamp(13px,.72vw,17px)!important;
  }
  .pv-thanks-badge{
    font-size:clamp(11px,.6vw,15px)!important;
    padding:clamp(5px,.42vh,8px) clamp(10px,.7vw,16px)!important;
  }
  .pv-footer{
    padding:clamp(30px,2.2vh,52px) clamp(24px,1.5vw,42px) clamp(44px,3vh,70px)!important;
  }
  .pv-footer-grid{
    max-width:clamp(1200px,62vw,1660px)!important;
    gap:clamp(24px,1.55vw,42px)!important;
  }
  .pv-footer h4{
    font-size:clamp(18px,.95vw,24px)!important;
  }
  .pv-volume{
    right:clamp(20px,1.25vw,34px)!important;
    bottom:clamp(20px,1.25vw,34px)!important;
    padding:clamp(8px,.5vw,13px) clamp(10px,.65vw,16px)!important;
    gap:clamp(8px,.5vw,12px)!important;
  }
  .pv-vol-btn,
  .pv-vol-toggle{
    width:clamp(34px,1.85vw,46px)!important;
    height:clamp(34px,1.85vw,46px)!important;
    font-size:clamp(14px,.78vw,18px)!important;
  }
  .pv-vol-display{
    min-width:clamp(40px,2.45vw,62px)!important;
    font-size:clamp(13px,.72vw,17px)!important;
  }
}


/* Footer anclado abajo en pantallas grandes. */
html{
  min-height:100%;
}
body{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}
body > .pv-navbar,
body > .pv-footer{
  flex:0 0 auto;
}
body > .pv-main{
  flex:1 0 auto;
  width:100%;
}
.pv-footer{
  margin-top:auto;
}


/* Footer visible y layout compacto en teléfono horizontal. */
@media (max-width: 960px) and (orientation: landscape) and (max-height: 520px){
  /* El footer no debe desaparecer en horizontal: queda despues del contenido y se puede ver con scroll. */
  body .pv-footer{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:relative!important;
    margin-top:12px!important;
    padding:13px 14px 18px!important;
    border-top:1px solid rgba(203,181,255,.18)!important;
    background:rgba(8,10,16,.92)!important;
  }
  body .pv-footer-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.12fr) minmax(138px,.72fr) minmax(132px,.62fr)!important;
    gap:12px!important;
    max-width:calc(100vw - 24px)!important;
    width:100%!important;
    margin:0 auto!important;
    align-items:start!important;
  }
  body .pv-footer h4{
    font-size:11px!important;
    line-height:1.1!important;
    margin:0 0 5px!important;
    letter-spacing:.04em!important;
  }
  body .pv-footer p{
    font-size:9.4px!important;
    line-height:1.28!important;
    margin:4px 0!important;
  }
  body .pv-footer a{
    font-size:9.6px!important;
    line-height:1.25!important;
  }
  body .pv-disclaimer{
    opacity:.82!important;
  }
}

@media (max-width: 760px) and (orientation: landscape) and (max-height: 430px){
  /* 740x360 y similares: header compacto, perfil visible y botones no largos. */
  body .pv-nav{
    min-height:44px!important;
    padding:4px 6px!important;
    gap:5px!important;
    overflow:visible!important;
  }
  body .pv-brand{
    left:50%!important;
    transform:translateX(-50%)!important;
    max-width:132px!important;
    pointer-events:auto!important;
  }
  body .pv-logo{
    font-size:14px!important;
    letter-spacing:.065em!important;
    padding:1px 4px!important;
    max-width:132px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body .pv-nav-left{
    flex:0 1 148px!important;
    min-width:118px!important;
    max-width:148px!important;
    width:148px!important;
    z-index:5!important;
  }
  body .pv-player-search{
    width:148px!important;
    max-width:148px!important;
    flex-basis:148px!important;
  }
  body .pv-player-search-box{
    height:31px!important;
    border-radius:12px!important;
    padding:0 6px 0 8px!important;
  }
  body .pv-player-search-input{
    font-size:10px!important;
  }
  body .pv-search-icon{
    font-size:12px!important;
    margin-right:4px!important;
  }

  body .pv-nav-right{
    gap:5px!important;
    min-width:0!important;
    flex:0 0 auto!important;
    margin-left:auto!important;
    z-index:6!important;
  }
  body .pv-flag-btn{
    width:32px!important;
    min-width:32px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0!important;
    border-radius:12px!important;
    font-size:10px!important;
  }
  body .pv-nav-actions .pv-nav-deck{
    width:34px!important;
    min-width:34px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0!important;
    border-radius:12px!important;
    justify-content:center!important;
    gap:0!important;
  }
  body .pv-nav-deck span:last-child{
    display:none!important;
  }
  body .pv-nav-deck .pv-link-emote{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
  }

  body #loginBtn.pv-btn-google{
    width:36px!important;
    min-width:36px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0!important;
    border-radius:12px!important;
    justify-content:center!important;
    gap:0!important;
  }
  body #loginBtn .g-label{
    display:none!important;
  }
  body #loginBtn .g-ico,
  body #loginBtn .g-ico svg{
    width:15px!important;
    height:15px!important;
  }

  body #accountBtn.pv-account-chip{
    display:inline-flex!important;
    max-width:118px!important;
    min-width:0!important;
    width:auto!important;
    height:34px!important;
    min-height:34px!important;
    padding:3px 7px 3px 4px!important;
    gap:6px!important;
    border-radius:13px!important;
    overflow:visible!important;
  }
  body #accountBtn .pv-avatar-wrap.big,
  body #accountWrap{
    width:28px!important;
    height:28px!important;
    flex:0 0 28px!important;
  }
  body #accountBtn .pv-account-identity{
    max-width:72px!important;
    min-width:0!important;
    overflow:hidden!important;
    padding-left:0!important;
  }
  body #accountName.pv-account-name{
    display:block!important;
    max-width:72px!important;
    font-size:9.8px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body #accountTitle.pv-account-title,
  body #accountBtn #accountTitle.pv-account-title.title-badge{
    display:none!important;
  }

  /* Main mas compacto para que no empuje el perfil ni cree botones enormes. */
  body .pv-main{
    padding-top:1px!important;
    padding-bottom:22px!important;
  }
  body .pv-hero{
    margin:2px 0 2px!important;
  }
  body .pv-hero-banner{
    max-width:min(500px,calc(100% - 14px))!important;
    padding:5px 10px!important;
  }
  body .pv-title{
    font-size:18px!important;
  }
  body .pv-abyss{
    margin:3px auto!important;
  }
  body .pv-play-btn{
    min-height:36px!important;
    padding:7px 17px!important;
    font-size:11px!important;
    gap:8px!important;
  }
  body .pv-play-symbol{
    width:23px!important;
    height:23px!important;
    flex:0 0 23px!important;
  }

  body .pv-competitive-panel{
    width:min(700px,calc(100% - 12px))!important;
    margin:3px auto 5px!important;
  }
  body .pv-competitive-shell{
    gap:5px!important;
    padding:5px!important;
    border-radius:14px!important;
  }
  body .pv-competitive-label{
    min-width:88px!important;
    height:30px!important;
    padding:0 8px!important;
    font-size:8.8px!important;
  }
  body .pv-competitive-direct{
    min-width:0!important;
    min-height:34px!important;
    height:34px!important;
    padding:0 8px!important;
    font-size:9.3px!important;
    gap:5px!important;
    flex:1 1 0!important;
  }
  body .pv-competitive-panel .pv-link-pvp,
  body .pv-competitive-panel .pv-link-chars,
  body .pv-competitive-panel .pv-link-tierlist{
    min-width:0!important;
  }
  body .pv-competitive-direct > span:last-child{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  body .pv-support-grid{
    width:calc(100% - 12px)!important;
    grid-template-columns:minmax(0,1.12fr) minmax(210px,.88fr)!important;
    gap:8px!important;
    margin-top:4px!important;
  }
  body .pv-card{
    padding:9px!important;
  }
  body .pv-donor-list{
    max-height:98px!important;
  }

  body .pv-footer{
    padding:11px 10px 16px!important;
  }
  body .pv-footer-grid{
    grid-template-columns:minmax(0,1fr) minmax(118px,.72fr) minmax(112px,.58fr)!important;
    gap:9px!important;
    max-width:calc(100vw - 18px)!important;
  }
  body .pv-footer h4{font-size:10px!important;margin-bottom:4px!important;}
  body .pv-footer p,
  body .pv-footer a{font-size:8.6px!important;line-height:1.22!important;}
}


/* Layout compacto para teléfono horizontal bajo. */
@media (max-width: 760px) and (orientation: landscape) and (max-height: 430px){
  html, body{
    min-width:0!important;
    width:100%!important;
    overflow-x:hidden!important;
  }

  body .pv-navbar{
    position:relative!important;
    z-index:30!important;
    background:rgba(8,10,16,.88)!important;
    backdrop-filter:blur(10px) saturate(135%)!important;
  }
  body .pv-nav{
    display:grid!important;
    grid-template-columns:minmax(112px,128px) minmax(88px,1fr) auto!important;
    align-items:center!important;
    min-height:40px!important;
    width:100%!important;
    padding:3px 5px!important;
    gap:4px!important;
    overflow:visible!important;
  }

  body .pv-nav-left{
    grid-column:1!important;
    grid-row:1!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:initial!important;
    z-index:4!important;
  }
  body .pv-player-search{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:1 1 auto!important;
  }
  body .pv-player-search-box{
    height:29px!important;
    min-height:29px!important;
    padding:0 6px!important;
    border-radius:11px!important;
  }
  body .pv-player-search-input{
    min-width:0!important;
    font-size:9px!important;
  }
  body .pv-search-icon{
    font-size:11px!important;
    margin-right:3px!important;
  }

  body .pv-brand{
    position:static!important;
    grid-column:2!important;
    grid-row:1!important;
    justify-self:center!important;
    align-self:center!important;
    transform:none!important;
    max-width:110px!important;
    width:auto!important;
    z-index:2!important;
    pointer-events:auto!important;
  }
  body .pv-logo{
    display:block!important;
    max-width:110px!important;
    font-size:12.5px!important;
    line-height:1!important;
    letter-spacing:.055em!important;
    padding:1px 2px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body .pv-nav-right{
    grid-column:3!important;
    grid-row:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:3px!important;
    min-width:0!important;
    width:auto!important;
    flex:initial!important;
    margin-left:0!important;
    z-index:5!important;
  }
  body .pv-lang{flex:0 0 auto!important;}
  body .pv-flag-btn{
    width:27px!important;
    min-width:27px!important;
    height:29px!important;
    min-height:29px!important;
    padding:0!important;
    border-radius:10px!important;
    font-size:8.8px!important;
  }
  body .pv-lang-menu{
    top:32px!important;
    right:0!important;
    min-width:86px!important;
    padding:5px!important;
    gap:4px!important;
  }
  body .pv-lang-mini{
    min-height:25px!important;
    font-size:9px!important;
  }

  body .pv-nav-actions{display:flex!important;flex:0 0 auto!important;}
  body .pv-nav-actions .pv-nav-deck{
    width:30px!important;
    min-width:30px!important;
    height:29px!important;
    min-height:29px!important;
    padding:0!important;
    border-radius:10px!important;
    justify-content:center!important;
    gap:0!important;
  }
  body .pv-nav-deck span:last-child{display:none!important;}
  body .pv-nav-deck .pv-link-emote{
    width:16px!important;
    height:16px!important;
    flex:0 0 16px!important;
  }

  body #loginBtn.pv-btn-google{
    width:31px!important;
    min-width:31px!important;
    height:29px!important;
    min-height:29px!important;
    padding:0!important;
    border-radius:10px!important;
    justify-content:center!important;
    gap:0!important;
  }
  body #loginBtn .g-label{display:none!important;}
  body #loginBtn .g-ico,
  body #loginBtn .g-ico svg{
    width:14px!important;
    height:14px!important;
  }

  body #accountBtn.pv-account-chip{
    display:inline-flex!important;
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:31px!important;
    min-height:31px!important;
    padding:2px!important;
    gap:0!important;
    border-radius:11px!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:visible!important;
  }
  body #accountBtn .pv-avatar-wrap.big,
  body #accountWrap{
    width:27px!important;
    height:27px!important;
    flex:0 0 27px!important;
    margin:0!important;
  }
  body #accountBtn .pv-account-identity,
  body #accountName.pv-account-name,
  body #accountTitle.pv-account-title,
  body #accountBtn #accountTitle.pv-account-title.title-badge{
    display:none!important;
  }
  body #accountMenu.pv-account-menu{
    top:40px!important;
    right:5px!important;
    width:226px!important;
    min-width:226px!important;
    max-width:calc(100vw - 10px)!important;
  }

  body .pv-main{
    padding-top:2px!important;
    padding-bottom:12px!important;
    width:100%!important;
  }
  body .pv-hero{margin:3px 0 2px!important;}
  body .pv-hero-banner{
    width:min(470px,calc(100% - 12px))!important;
    max-width:min(470px,calc(100% - 12px))!important;
    padding:4px 9px!important;
    border-radius:13px!important;
  }
  body .pv-title{
    font-size:16px!important;
    line-height:1!important;
    margin:0!important;
    letter-spacing:.025em!important;
  }
  body .pv-subtitle{display:none!important;}

  body .pv-abyss{margin:3px auto!important;}
  body .pv-play-btn{
    min-height:32px!important;
    height:32px!important;
    padding:5px 14px!important;
    font-size:10px!important;
    letter-spacing:.105em!important;
    gap:7px!important;
    border-radius:13px!important;
  }
  body .pv-play-symbol{
    width:20px!important;
    height:20px!important;
    flex:0 0 20px!important;
  }
  body .pv-play-symbol::before{
    border-top-width:5px!important;
    border-bottom-width:5px!important;
    border-left-width:8px!important;
  }

  body .pv-competitive-panel{
    width:calc(100% - 10px)!important;
    max-width:730px!important;
    margin:3px auto 5px!important;
  }
  body .pv-competitive-shell{
    display:grid!important;
    grid-template-columns:74px repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
    padding:4px!important;
    border-radius:12px!important;
    align-items:center!important;
  }
  body .pv-competitive-label{
    width:auto!important;
    min-width:0!important;
    height:28px!important;
    padding:0 5px!important;
    font-size:7.8px!important;
    letter-spacing:.07em!important;
    border-radius:10px!important;
  }
  body .pv-competitive-direct{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:30px!important;
    min-height:30px!important;
    padding:0 5px!important;
    font-size:8.4px!important;
    gap:4px!important;
    border-radius:10px!important;
    justify-content:center!important;
  }
  body .pv-competitive-direct > span:last-child{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body .pv-competitive-panel .pv-link-emote{
    width:15px!important;
    height:15px!important;
    flex:0 0 15px!important;
    transform:none!important;
  }
  body .pv-competitive-panel .pv-emote-tierlist{
    width:18px!important;
    height:15px!important;
    flex-basis:18px!important;
    background-size:100% 4px,100% 4px,100% 4px!important;
    background-position:0 0,0 6px,0 12px!important;
  }

  body .pv-support-grid{
    width:calc(100% - 10px)!important;
    max-width:730px!important;
    grid-template-columns:minmax(0,1fr) minmax(185px,.64fr)!important;
    gap:6px!important;
    margin-top:4px!important;
    align-items:start!important;
  }
  body .pv-card{
    padding:8px!important;
    border-radius:13px!important;
  }
  body .pv-donate h3,
  body .pv-top-donors h3{
    font-size:12px!important;
    line-height:1.05!important;
    margin:0 0 4px!important;
  }
  body .pv-donate p{
    font-size:9.4px!important;
    line-height:1.23!important;
    margin:4px 0!important;
  }
  body .pv-reward,
  body .pv-reward-showcase{
    display:none!important;
  }
  body .pv-donate-actions{margin-top:5px!important;}
  body .pv-btn-kofi{
    min-height:29px!important;
    height:29px!important;
    padding:5px 10px!important;
    font-size:9.4px!important;
    border-radius:10px!important;
  }
  body .pv-btn-kofi .ico{
    width:13px!important;
    height:13px!important;
  }
  body .pv-top-donors{
    padding:8px!important;
  }
  body .pv-top-header{
    gap:5px!important;
    margin-bottom:3px!important;
  }
  body .pv-thanks-badge{
    font-size:8px!important;
    padding:3px 6px!important;
  }
  body .pv-donor-list{
    max-height:82px!important;
    gap:4px!important;
    padding-right:1px!important;
  }
  body .pv-donor-item{
    min-height:26px!important;
    padding:4px 6px!important;
    border-radius:9px!important;
    font-size:9px!important;
  }
  body .pv-donor-empty{
    font-size:9px!important;
    min-height:26px!important;
  }

  body .pv-footer{
    display:block!important;
    position:relative!important;
    margin-top:10px!important;
    padding:9px 9px 13px!important;
    background:rgba(8,10,16,.92)!important;
  }
  body .pv-footer-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.05fr) minmax(106px,.65fr) minmax(100px,.58fr)!important;
    gap:7px!important;
    max-width:calc(100vw - 18px)!important;
    width:100%!important;
  }
  body .pv-footer h4{
    font-size:9.2px!important;
    line-height:1.05!important;
    margin:0 0 3px!important;
  }
  body .pv-footer p,
  body .pv-footer a{
    font-size:7.8px!important;
    line-height:1.18!important;
    margin:2px 0!important;
  }
  body .pv-volume{
    right:5px!important;
    bottom:5px!important;
    transform:scale(.68)!important;
    transform-origin:bottom right!important;
  }
}

/* Emotes estables del Index en pantallas XL. */
@media (min-width: 1981px) and (min-height: 1081px){
  @keyframes crownFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-2px,0)}}
  @keyframes emojiBob{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-1px,0)}}
  @keyframes swordSwing{0%,100%{transform:rotate(-7deg) translate3d(0,0,0)}50%{transform:rotate(6deg) translate3d(0,-2px,0)}}
  @keyframes twinkle{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-1px,0) scale(1.045)}}
  @keyframes theOneCrownFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-2px,0)}}
  @keyframes pvBestAura{0%,100%{transform:translate3d(0,0,0);opacity:.55}50%{transform:translate3d(0,-2px,0);opacity:.75}}
  @keyframes pvBestSpark{0%,100%{transform:translate3d(0,0,0) scale(1);opacity:.9}50%{transform:translate3d(0,-1px,0) scale(1.045);opacity:1}}

  .title-badge,
  .title-badge::before,
  .title-badge::after,
  .pv-account-title,
  .pv-menu-title,
  .pv-player-title-line .title-badge{
    backface-visibility:hidden !important;
    -webkit-backface-visibility:hidden !important;
    -webkit-font-smoothing:antialiased;
    transform-origin:50% 50% !important;
    will-change:transform, opacity;
  }
}


/* Layout horizontal para Galaxy S8 y resoluciones similares. */
@media (min-width: 680px) and (max-width: 790px) and (orientation: landscape) and (max-height: 410px){
  html,
  body{
    min-width:0!important;
    width:100%!important;
    overflow-x:hidden!important;
  }

  body .pv-navbar{
    position:relative!important;
    z-index:30!important;
    background:rgba(9,11,18,.76)!important;
    backdrop-filter:blur(12px) saturate(132%)!important;
  }

  body .pv-nav{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    min-height:44px!important;
    width:100%!important;
    padding:4px 6px!important;
    gap:5px!important;
    overflow:visible!important;
  }

  body .pv-brand{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    max-width:132px!important;
    width:auto!important;
    z-index:1!important;
    pointer-events:auto!important;
  }

  body .pv-logo{
    display:block!important;
    max-width:132px!important;
    font-size:14px!important;
    line-height:1!important;
    letter-spacing:.065em!important;
    padding:1px 4px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body .pv-nav-left{
    display:flex!important;
    flex:0 0 148px!important;
    width:148px!important;
    min-width:118px!important;
    max-width:148px!important;
    justify-content:flex-start!important;
    z-index:5!important;
  }

  body .pv-player-search{
    width:148px!important;
    max-width:148px!important;
    min-width:0!important;
    flex:0 0 148px!important;
  }

  body .pv-player-search-label{display:none!important;}

  body .pv-player-search-box{
    height:31px!important;
    min-height:31px!important;
    padding:0 6px 0 8px!important;
    border-radius:12px!important;
  }

  body .pv-player-search-input{
    min-width:0!important;
    font-size:10px!important;
  }

  body .pv-search-icon{
    font-size:12px!important;
    margin-right:4px!important;
  }

  body .pv-nav-right{
    display:flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:5px!important;
    min-width:0!important;
    margin-left:auto!important;
    z-index:6!important;
  }

  body .pv-flag-btn{
    width:32px!important;
    min-width:32px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0!important;
    border-radius:12px!important;
    font-size:10px!important;
  }

  body .pv-nav-actions{display:flex!important;flex:0 0 auto!important;}
  body .pv-nav-actions .pv-nav-deck{
    width:34px!important;
    min-width:34px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0!important;
    border-radius:12px!important;
    justify-content:center!important;
    gap:0!important;
  }
  body .pv-nav-deck span:last-child{display:none!important;}
  body .pv-nav-deck .pv-link-emote{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
  }

  body #loginBtn.pv-btn-google{
    width:36px!important;
    min-width:36px!important;
    height:31px!important;
    min-height:31px!important;
    padding:0!important;
    border-radius:12px!important;
    justify-content:center!important;
    gap:0!important;
  }
  body #loginBtn .g-label{display:none!important;}
  body #loginBtn .g-ico,
  body #loginBtn .g-ico svg{
    width:15px!important;
    height:15px!important;
  }

  html body #accountBtn.pv-account-chip.pv-account-chip{
    display:inline-flex!important;
    width:auto!important;
    min-width:0!important;
    max-width:118px!important;
    height:34px!important;
    min-height:34px!important;
    padding:3px 7px 3px 4px!important;
    gap:6px!important;
    border-radius:13px!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
  }

  html body #accountBtn.pv-account-chip .pv-avatar-wrap.big,
  html body #accountWrap{
    width:28px!important;
    height:28px!important;
    flex:0 0 28px!important;
    margin:0!important;
  }

  html body #accountBtn.pv-account-chip .pv-account-identity{
    display:flex!important;
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:72px!important;
    overflow:hidden!important;
    padding-left:0!important;
    flex-direction:column!important;
    justify-content:center!important;
  }

  html body #accountName.pv-account-name{
    display:block!important;
    max-width:72px!important;
    font-size:9.8px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #accountTitle.pv-account-title,
  html body #accountBtn #accountTitle.pv-account-title.title-badge{
    display:none!important;
  }

  body #accountMenu.pv-account-menu{
    top:44px!important;
    right:6px!important;
    width:236px!important;
    min-width:236px!important;
    max-width:calc(100vw - 12px)!important;
  }

  body .pv-main{
    padding-top:1px!important;
    padding-bottom:22px!important;
    width:100%!important;
  }

  body .pv-hero{margin:2px 0 2px!important;}
  body .pv-hero-banner{
    max-width:min(500px,calc(100% - 14px))!important;
    padding:5px 10px!important;
    border-radius:15px!important;
  }
  body .pv-title{
    font-size:18px!important;
    line-height:1!important;
    margin:0!important;
    letter-spacing:.035em!important;
  }
  body .pv-subtitle{display:none!important;}

  body .pv-abyss{margin:3px auto!important;}
  body .pv-play-btn{
    min-height:36px!important;
    height:36px!important;
    padding:7px 17px!important;
    font-size:11px!important;
    letter-spacing:.13em!important;
    gap:8px!important;
    border-radius:14px!important;
  }
  body .pv-play-symbol{
    width:23px!important;
    height:23px!important;
    flex:0 0 23px!important;
  }

  body .pv-competitive-panel{
    width:min(700px,calc(100% - 12px))!important;
    max-width:700px!important;
    margin:3px auto 5px!important;
  }
  body .pv-competitive-shell{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:5px!important;
    padding:5px!important;
    border-radius:14px!important;
  }
  body .pv-competitive-label{
    flex:0 0 88px!important;
    width:88px!important;
    min-width:88px!important;
    height:30px!important;
    padding:0 8px!important;
    font-size:8.8px!important;
    letter-spacing:.085em!important;
    border-radius:11px!important;
  }
  body .pv-competitive-direct,
  body .pv-competitive-panel .pv-link-pvp,
  body .pv-competitive-panel .pv-link-chars,
  body .pv-competitive-panel .pv-link-tierlist{
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    min-height:34px!important;
    height:34px!important;
    padding:0 8px!important;
    font-size:9.3px!important;
    gap:5px!important;
    border-radius:11px!important;
    justify-content:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  body .pv-competitive-direct > span:last-child{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body .pv-competitive-panel .pv-link-emote{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
    transform:none!important;
  }
  body .pv-competitive-panel .pv-emote-tierlist{
    width:21px!important;
    height:18px!important;
    flex:0 0 21px!important;
    background-size:100% 5px,100% 5px,100% 5px!important;
    background-position:0 0,0 7px,0 14px!important;
  }

  body .pv-support-grid{
    display:grid!important;
    width:calc(100% - 12px)!important;
    max-width:700px!important;
    grid-template-columns:minmax(0,1.08fr) minmax(210px,.86fr)!important;
    gap:8px!important;
    margin:4px auto 0!important;
    align-items:start!important;
  }

  body .pv-card{
    padding:9px!important;
    border-radius:14px!important;
  }
  body .pv-donate h3,
  body .pv-top-donors h3{
    font-size:13px!important;
    line-height:1.05!important;
    margin:0 0 5px!important;
  }
  body .pv-donate p{
    display:block!important;
    font-size:9.7px!important;
    line-height:1.24!important;
    margin:4px 0!important;
  }

  body .pv-reward-showcase{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin:6px 0 7px!important;
  }
  body .pv-reward-preview{
    display:flex!important;
    min-width:0!important;
    padding:7px 5px 6px!important;
    gap:4px!important;
    border-radius:12px!important;
    align-items:center!important;
  }
  body .pv-reward-frame{
    display:inline-flex!important;
    width:43px!important;
    height:43px!important;
    min-width:43px!important;
    margin:2px 0 13px!important;
  }
  body .pv-reward-frame .pv-avatar-frame{
    display:block!important;
    width:184%!important;
    height:184%!important;
  }
  body .pv-reward-preview .title-badge{
    display:inline-flex!important;
    font-size:10px!important;
    line-height:1.05!important;
    margin-top:0!important;
  }
  body .pv-reward-preview small{
    display:block!important;
    font-size:8.8px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body .pv-donate-actions{margin-top:4px!important;}
  body .pv-btn-kofi{
    min-height:32px!important;
    height:32px!important;
    padding:6px 11px!important;
    font-size:10.4px!important;
    border-radius:11px!important;
  }
  body .pv-btn-kofi .ico{
    width:14px!important;
    height:14px!important;
  }

  body .pv-top-donors{padding:9px!important;}
  body .pv-top-donors .pv-chibi{
    display:block!important;
    width:42px!important;
    right:7px!important;
    top:-13px!important;
  }
  body .pv-top-header{
    gap:5px!important;
    margin-bottom:4px!important;
  }
  body .pv-thanks-badge{
    font-size:8px!important;
    padding:3px 6px!important;
  }
  body .pv-donor-list{
    max-height:98px!important;
    gap:4px!important;
    padding-right:1px!important;
  }
  body .pv-donor-item{
    min-height:26px!important;
    padding:4px 6px!important;
    border-radius:9px!important;
    font-size:9px!important;
  }
  body .pv-donor-empty{
    font-size:9px!important;
    min-height:26px!important;
  }

  body .pv-footer{
    display:block!important;
    position:relative!important;
    margin-top:10px!important;
    padding:11px 10px 16px!important;
    background:rgba(8,10,16,.92)!important;
  }
  body .pv-footer-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(118px,.72fr) minmax(112px,.58fr)!important;
    gap:9px!important;
    max-width:calc(100vw - 18px)!important;
    width:100%!important;
  }
  body .pv-footer h4{
    font-size:10px!important;
    line-height:1.05!important;
    margin:0 0 4px!important;
  }
  body .pv-footer p,
  body .pv-footer a{
    font-size:8.6px!important;
    line-height:1.22!important;
    margin:2px 0!important;
  }

  body .pv-volume{
    right:5px!important;
    bottom:5px!important;
    transform:scale(.68)!important;
    transform-origin:bottom right!important;
  }
}

/* Layout horizontal consistente para S8, iPhone SE y similares. */
@media (min-width: 620px) and (max-width: 790px) and (orientation: landscape) and (max-height: 410px){
  body .pv-nav{
    min-height:47px!important;
    padding:4px 8px!important;
    gap:7px!important;
    align-items:center!important;
    overflow:visible!important;
  }

  body .pv-brand{
    max-width:132px!important;
    z-index:1!important;
  }
  body .pv-logo{
    max-width:132px!important;
    font-size:14px!important;
    letter-spacing:.06em!important;
  }

  /* Buscador: suficiente ancho y resultados dentro del telefono. */
  body .pv-nav-left{
    flex:0 0 clamp(154px,23vw,172px)!important;
    width:clamp(154px,23vw,172px)!important;
    min-width:154px!important;
    max-width:172px!important;
    justify-content:flex-start!important;
    overflow:visible!important;
  }
  body .pv-player-search{
    width:clamp(154px,23vw,172px)!important;
    max-width:172px!important;
    min-width:154px!important;
    flex:0 0 clamp(154px,23vw,172px)!important;
    overflow:visible!important;
  }
  body .pv-player-search-box{
    height:32px!important;
    min-height:32px!important;
    padding:0 7px 0 9px!important;
    gap:5px!important;
    border-radius:12px!important;
  }
  body .pv-player-search-input{
    font-size:10.6px!important;
    min-width:0!important;
  }
  body .pv-search-icon{
    font-size:13px!important;
    margin-right:2px!important;
    flex:0 0 auto!important;
  }
  body .pv-player-results{
    left:0!important;
    right:auto!important;
    width:min(356px,calc(100vw - 12px))!important;
    max-width:calc(100vw - 12px)!important;
    max-height:min(58vh,218px)!important;
    padding:8px!important;
    gap:6px!important;
    overflow-x:hidden!important;
    border-radius:14px!important;
    transform:translateY(-8px) scale(.985)!important;
  }
  body .pv-player-search.open .pv-player-results{
    transform:translateY(0) scale(1)!important;
  }
  body .pv-player-result{
    display:grid!important;
    grid-template-columns:68px minmax(0,1fr)!important;
    gap:8px!important;
    min-height:58px!important;
    padding:8px 10px!important;
    border-radius:12px!important;
    overflow:visible!important;
  }
  body .pv-player-avatar.avatar{
    width:40px!important;
    height:40px!important;
    justify-self:center!important;
    overflow:visible!important;
  }
  body .pv-player-avatar.avatar img.photo{
    display:block!important;
  }
  body .pv-player-avatar.avatar img.frame{
    display:block!important;
    width:178%!important;
    height:178%!important;
  }
  body .pv-player-result-info{
    min-width:0!important;
    max-width:100%!important;
    gap:4px!important;
    padding-left:6px!important;
    overflow:hidden!important;
  }
  body .pv-player-result-name{
    max-width:100%!important;
    font-size:11.2px!important;
    line-height:1.08!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* Perfil y botones: separados como los otros telefonos, sin que el marco tape el nombre. */
  body .pv-nav-right{
    gap:8px!important;
    margin-left:auto!important;
    align-items:center!important;
    overflow:visible!important;
  }
  body .pv-lang,
  body .pv-nav-actions,
  body .pv-account{
    flex:0 0 auto!important;
  }
  body .pv-flag-btn{
    width:34px!important;
    min-width:34px!important;
    height:32px!important;
    min-height:32px!important;
    border-radius:12px!important;
  }
  body .pv-nav-actions .pv-nav-deck{
    width:38px!important;
    min-width:38px!important;
    height:32px!important;
    min-height:32px!important;
    border-radius:12px!important;
  }
  body .pv-nav-deck .pv-link-emote{
    width:18px!important;
    height:18px!important;
    flex:0 0 18px!important;
  }

  html body #accountBtn.pv-account-chip.pv-account-chip{
    width:auto!important;
    min-width:0!important;
    max-width:168px!important;
    height:42px!important;
    min-height:42px!important;
    padding:4px 9px 4px 7px!important;
    gap:10px!important;
    border-radius:15px!important;
    overflow:visible!important;
    align-items:center!important;
  }
  html body #accountBtn.pv-account-chip .pv-avatar-wrap.big,
  html body #accountWrap{
    width:31px!important;
    height:31px!important;
    flex:0 0 31px!important;
    margin-right:3px!important;
    overflow:visible!important;
  }
  html body #accountBtn.pv-account-chip .pv-account-identity{
    display:flex!important;
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:108px!important;
    padding-left:4px!important;
    gap:2px!important;
    overflow:visible!important;
    flex-direction:column!important;
    justify-content:center!important;
  }
  html body #accountName.pv-account-name{
    display:block!important;
    max-width:108px!important;
    font-size:10.2px!important;
    line-height:1.02!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #accountBtn #accountTitle.pv-account-title.title-badge:not([hidden]),
  html body #accountTitle.pv-account-title.title-badge:not([hidden]),
  html body span#accountTitle.title-badge[data-title-style]:not([hidden]){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:auto!important;
    min-width:0!important;
    max-width:108px!important;
    min-height:12px!important;
    padding:1px 4px!important;
    margin:0!important;
    border-radius:7px!important;
    font-size:7.8px!important;
    line-height:1!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    transform:none!important;
    transform-origin:left center!important;
  }
  html body #accountBtn #accountTitle.pv-account-title.title-badge::before,
  html body #accountBtn #accountTitle.pv-account-title.title-badge::after{
    font-size:.9em!important;
    flex:0 0 auto!important;
  }

  /* En telefonos no debe salir el chibi/imagen del panel Ultimos Donadores. */
  body .pv-top-donors .pv-chibi{
    display:none!important;
  }

  body .pv-support-grid{
    width:calc(100% - 12px)!important;
    max-width:700px!important;
    grid-template-columns:minmax(0,1.08fr) minmax(210px,.86fr)!important;
    gap:8px!important;
  }
  body .pv-top-donors{
    padding:9px!important;
  }
}

@media (min-width: 620px) and (max-width: 690px) and (orientation: landscape) and (max-height: 410px){
  body .pv-nav{
    gap:5px!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
  body .pv-brand,
  body .pv-logo{
    max-width:116px!important;
  }
  body .pv-logo{
    font-size:12.5px!important;
    letter-spacing:.05em!important;
  }
  body .pv-nav-left,
  body .pv-player-search{
    flex-basis:148px!important;
    width:148px!important;
    min-width:148px!important;
    max-width:148px!important;
  }
  body .pv-nav-right{
    gap:6px!important;
  }
  html body #accountBtn.pv-account-chip.pv-account-chip{
    max-width:158px!important;
    gap:8px!important;
    padding-right:7px!important;
  }
  html body #accountBtn.pv-account-chip .pv-account-identity,
  html body #accountName.pv-account-name,
  html body #accountTitle.pv-account-title.title-badge:not([hidden]){
    max-width:98px!important;
  }
  html body #accountName.pv-account-name{
    font-size:9.8px!important;
  }
  html body #accountBtn #accountTitle.pv-account-title.title-badge:not([hidden]){
    font-size:7.2px!important;
  }
  body .pv-player-results{
    width:min(342px,calc(100vw - 12px))!important;
  }
}

/* Ajustes del panel competitivo en iPhone SE horizontal. */
@media (min-width: 620px) and (max-width: 679px) and (orientation: landscape) and (max-height: 410px){
  body .pv-competitive-panel{
    width:min(655px,calc(100% - 12px))!important;
    max-width:655px!important;
    margin:3px auto 5px!important;
  }

  body .pv-competitive-shell{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    gap:5px!important;
    padding:5px!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
  }

  body .pv-competitive-label{
    flex:0 0 88px!important;
    width:88px!important;
    min-width:88px!important;
    max-width:88px!important;
    height:30px!important;
    min-height:30px!important;
    padding:0 8px!important;
    font-size:8.8px!important;
    line-height:1!important;
    letter-spacing:.085em!important;
    border-radius:11px!important;
    grid-column:auto!important;
    justify-content:center!important;
    white-space:nowrap!important;
  }

  body .pv-competitive-direct,
  body .pv-competitive-panel .pv-link-pvp,
  body .pv-competitive-panel .pv-link-chars,
  body .pv-competitive-panel .pv-link-tierlist{
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 8px!important;
    font-size:9.3px!important;
    line-height:1!important;
    letter-spacing:.02em!important;
    gap:5px!important;
    border-radius:11px!important;
    justify-content:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    grid-column:auto!important;
  }

  body .pv-competitive-direct > span:last-child,
  body .pv-competitive-panel .pv-link-pvp > span:last-child,
  body .pv-competitive-panel .pv-link-chars > span:last-child,
  body .pv-competitive-panel .pv-link-tierlist > span:last-child{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  body .pv-competitive-panel .pv-link-emote{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
    transform:none!important;
  }

  body .pv-competitive-panel .pv-emote-tierlist{
    width:21px!important;
    height:18px!important;
    flex:0 0 21px!important;
    background-size:100% 5px,100% 5px,100% 5px!important;
    background-position:0 0,0 7px,0 14px!important;
  }
}

/* Centrado de POLAVERSE en iPhone SE horizontal. */
@media (min-width: 620px) and (max-width: 679px) and (orientation: landscape) and (max-height: 410px){
  body .pv-nav{
    position:relative!important;
  }

  body .pv-brand{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translate(-50%,-50%)!important;
    grid-column:auto!important;
    grid-row:auto!important;
    justify-self:auto!important;
    align-self:auto!important;
    width:auto!important;
    max-width:124px!important;
    z-index:2!important;
    pointer-events:auto!important;
  }

  body .pv-logo{
    display:block!important;
    max-width:124px!important;
    text-align:center!important;
    font-size:13px!important;
    line-height:1!important;
    letter-spacing:.055em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}