/* Dueño de Curramba · cuenta, perfil y ranking */
.nav-dc { display: flex; gap: 6px; flex-wrap: wrap; }
.auth { padding: 20px; max-width: 620px; margin: 0 auto; }
.auth-cab h1 { margin: 0; font-family: 'Lilita One', sans-serif; font-weight: 400; font-size: 2rem; }
.auth-cab p { margin: 4px 0 14px; }
.auth .etiqueta { margin-top: 10px; }

/* perfil */
.perfil { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; padding: 20px; position: relative; overflow: hidden; }
.perfil::before { content: ''; position: absolute; inset: -40%; background: repeating-conic-gradient(rgba(245,158,11,.08) 0 10deg, transparent 10deg 24deg); animation: rayosGiran 30s linear infinite; pointer-events: none; }
.perfil > * { position: relative; }
.perfil-av { width: 150px; height: 150px; border-radius: 50%; display: grid; place-items: center; font-size: 5rem; background: radial-gradient(circle at 40% 30%, #fde68a, #f59e0b 55%, #9a3412); box-shadow: 0 0 0 5px rgba(255,255,255,.85), 0 10px 0 rgba(0,0,0,.35), 0 0 50px rgba(245,158,11,.4); overflow: visible; }
.perfil-av img { width: 100%; height: 100%; object-fit: contain; transform: scale(1.3) translateY(-8%); filter: drop-shadow(0 8px 6px rgba(0,0,0,.45)); animation: heroeFlota 3s ease-in-out infinite; }
.perfil-info small { color: #fde68a; font-weight: 800; letter-spacing: .05em; }
.perfil-info h1 { margin: 0 0 6px; font-family: 'Lilita One', sans-serif; font-weight: 400; font-size: clamp(2rem, 7vw, 2.8rem); line-height: 1; }
.nivel-l { display: flex; align-items: center; gap: 10px; }
.nivel-l .ins { width: 54px; height: 54px; object-fit: contain; font-size: 2.3rem; display: inline-grid; place-items: center; filter: drop-shadow(0 3px 3px rgba(0,0,0,.4)); }
.nivel-l b { display: block; font-size: 1.15rem; } .nivel-l span { color: var(--suave); font-weight: 800; }
.barra-xp.grande { height: 22px; position: relative; } .barra-xp.grande span { position: absolute; inset: 0; display: grid; place-items: center; font-size: .75rem; font-weight: 900; text-shadow: 0 1px 2px #000; }
.barra-xp.mini { height: 7px; margin: 5px 0 0; }
.perfil-acc { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 600px) { .perfil { grid-template-columns: 1fr; text-align: center; justify-items: center; } .nivel-l { justify-content: center; } .perfil-info { width: 100%; } .perfil-acc { justify-content: center; } }
.seccion { padding: 18px; margin-top: 14px; }
.seccion h2 { margin: 0 0 10px; font-size: 1.15rem; } .seccion h2 small { color: var(--suave); font-size: .8rem; }
.est-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: 8px; }
.est-grid > div { padding: 12px 8px; border-radius: 14px; text-align: center; background: rgba(255,255,255,.06); box-shadow: 0 4px 0 rgba(0,0,0,.3); }
.est-grid span { font-size: 1.5rem; } .est-grid b { display: block; font-size: 1.15rem; color: #fde68a; } .est-grid small { color: var(--suave); font-size: .72rem; font-weight: 700; }
.logros-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 12px; perspective: 900px; }
.logro { --r: #cd7f32; text-align: center; padding: 12px 8px; border-radius: 16px; background: linear-gradient(180deg, color-mix(in srgb, var(--r) 30%, #1f2937), #111827); box-shadow: inset 0 0 0 2px var(--r), 0 5px 0 rgba(0,0,0,.4); transition: transform .2s; }
.logro:hover { transform: translateY(-4px) rotateX(6deg); }
.logro .lg { width: 70px; height: 70px; object-fit: contain; font-size: 2.6rem; display: inline-grid; place-items: center; filter: drop-shadow(0 4px 4px rgba(0,0,0,.4)); }
.logro b { display: block; font-size: .85rem; margin-top: 4px; } .logro small { display: block; font-size: .7rem; color: var(--suave); line-height: 1.25; margin-top: 2px; }
.logro em { display: block; font-style: normal; font-weight: 900; font-size: .7rem; margin-top: 6px; color: #fde68a; text-transform: capitalize; }
.logro.no { filter: grayscale(1); opacity: .55; } .logro.no .lg { filter: brightness(.5); }
.hist-lista { display: grid; gap: 6px; }
.hist { display: grid; grid-template-columns: 44px 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.05); }
.hist.gano { background: linear-gradient(90deg, rgba(251,191,36,.18), rgba(255,255,255,.04)); }
.h-l { text-align: center; font-weight: 900; } .h-l .copa { width: 34px; height: 34px; font-size: 1.5rem; }
.hist b { display: block; font-size: .9rem; } .hist small { color: var(--suave); font-size: .75rem; } .hist em { font-style: normal; font-weight: 900; color: #c4b5fd; }

/* ranking */
.titulo-rank { margin: 0; font-family: 'Lilita One', sans-serif; font-weight: 400; font-size: clamp(2rem, 8vw, 3rem); background: linear-gradient(90deg, #fde68a, #f97316); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 3px 0 rgba(0,0,0,.35)); }
.tabs-rank { max-width: 520px; margin: 0 auto 16px; }
.podio-rank { display: grid; grid-template-columns: 1fr 1.15fr 1fr; align-items: end; gap: 10px; margin: 30px 0 16px; perspective: 900px; }
.pr { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; color: var(--texto); text-decoration: none; animation: cartaPjEntra .7s calc(var(--i) * 150ms) cubic-bezier(.2,1.4,.4,1) both; }
.pr .tr { width: 58px; height: 58px; object-fit: contain; font-size: 2.4rem; display: inline-grid; place-items: center; margin-bottom: -10px; z-index: 2; filter: drop-shadow(0 4px 4px rgba(0,0,0,.5)); }
.pr .av { width: 86px; height: 86px; border-radius: 50%; display: grid; place-items: center; font-size: 3rem; background: radial-gradient(circle at 40% 30%, #fff7, #7c3aed 70%); box-shadow: 0 0 0 4px #fff; overflow: visible; }
.pr.p1 .av { width: 110px; height: 110px; background: radial-gradient(circle at 40% 30%, #fde68a, #f59e0b 70%); box-shadow: 0 0 0 4px #fde68a, 0 0 40px rgba(253,230,138,.5); }
.pr .av img { width: 100%; height: 100%; object-fit: contain; transform: scale(1.3) translateY(-8%); filter: drop-shadow(0 5px 4px rgba(0,0,0,.45)); animation: heroeFlota 3s ease-in-out infinite; }
.pr b { margin-top: 6px; font-size: 1rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pr small { color: var(--suave); font-size: .72rem; font-weight: 800; } .pr em { font-style: normal; font-weight: 900; color: #fde68a; font-size: .85rem; }
.pr .base { width: 100%; margin-top: 8px; border-radius: 12px 12px 4px 4px; display: grid; place-items: center; font-family: 'Lilita One', sans-serif; font-size: 2rem; color: rgba(255,255,255,.85); box-shadow: 0 6px 0 rgba(0,0,0,.35); transform: rotateX(10deg); }
.pr.p1 .base { height: 110px; background: linear-gradient(180deg, #fbbf24, #b45309); } .pr.p2 .base { height: 80px; background: linear-gradient(180deg, #e2e8f0, #64748b); } .pr.p3 .base { height: 60px; background: linear-gradient(180deg, #f59e0b, #7c2d12); }
.lista-rank { padding: 8px; display: grid; gap: 6px; }
.fila-rank { display: grid; grid-template-columns: 44px 52px 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 14px; color: var(--texto); text-decoration: none; background: rgba(255,255,255,.04); transition: transform .15s, background .15s; animation: aparecer .4s calc(var(--i) * 40ms) both; }
.fila-rank:hover { background: rgba(255,255,255,.1); transform: translateX(4px); }
.fila-rank.yo { background: linear-gradient(90deg, rgba(245,158,11,.25), rgba(245,158,11,.05)); box-shadow: inset 0 0 0 2px #f59e0b; }
.fila-rank .pos { text-align: center; font-weight: 900; font-size: 1.1rem; color: var(--suave); } .fila-rank .trm { width: 36px; height: 36px; object-fit: contain; font-size: 1.6rem; display: inline-grid; place-items: center; }
.fila-rank .av { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; font-size: 1.8rem; background: radial-gradient(circle at 40% 30%, #fff5, #7c3aed 75%); overflow: visible; } .fila-rank .av img { width: 100%; height: 100%; object-fit: contain; transform: scale(1.25) translateY(-6%); }
.fila-rank .info b { font-size: .95rem; } .fila-rank .info b small { color: var(--suave); font-weight: 700; font-size: .72rem; }
.fila-rank .nv { display: flex; align-items: center; gap: 5px; font-size: .75rem; color: var(--suave); font-weight: 800; } .insm { width: 20px; height: 20px; object-fit: contain; font-size: .95rem; display: inline-grid; place-items: center; }
.fila-rank .cifras { text-align: right; } .fila-rank .cifras b { display: block; color: #fde68a; } .fila-rank .cifras small { color: var(--suave); font-size: .72rem; }
@media (max-width: 520px) { .fila-rank { grid-template-columns: 34px 42px 1fr; } .fila-rank .cifras { grid-column: 2 / -1; text-align: left; display: flex; gap: 10px; align-items: baseline; } .fila-rank .av { width: 40px; height: 40px; } }