/* Deron Ranking Level - Pro Visual */
.deron-lvl-container{ --bg:#0e101a; --card:#151827; --border:#24283f; --text:#e6e8f0; --muted:#8b8fa3; --gold:#ffcc33; --silver:#c0c6d6; --bronze:#d98a4a; --accent:#7c5cff; --accent2:#3ee7ff; max-width:900px; margin:30px auto; background: radial-gradient(1000px 500px at 10% 0%, rgba(124,92,255,.2), transparent), radial-gradient(800px 400px at 90% 0%, rgba(62,231,255,.15), transparent), var(--bg); border:1px solid var(--border); border-radius:20px; overflow:hidden; color:var(--text); font-family:system-ui, sans-serif; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.deron-lvl-header{ padding:24px 28px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; background: linear-gradient(180deg, rgba(255,255,255,.04), transparent); }
.deron-lvl-header h3{ margin:0; font-size:22px; font-weight:900; text-transform:uppercase; display:flex; gap:12px; align-items:center; color:#fff !important; }
.deron-lvl-header h3 .icon{ width:38px; height:38px; border-radius:10px; background: linear-gradient(135deg, var(--gold), #ff8a00); display:grid; place-items:center; color:#000; }
.deron-lvl-header .sub{ font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }
.deron-lvl-podium{ display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:14px; padding:22px; align-items:end; }
.deron-lvl-card{ background:var(--card); border:1px solid var(--border); border-radius:16px; padding:16px 12px; text-align:center; position:relative; }
.deron-lvl-card::before{ content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg, var(--accent), var(--accent2)); opacity:.8; }
.deron-lvl-card.pos-1{ transform:translateY(-10px); border-color: rgba(255,204,51,.5); box-shadow:0 10px 30px rgba(255,204,51,.15); }
.deron-lvl-card.pos-1::before{ background: linear-gradient(90deg, var(--gold), #ff8a00); }
.deron-lvl-rank{ font-size:11px; font-weight:800; color:var(--muted); letter-spacing:1px; }
.deron-lvl-card.pos-1 .deron-lvl-rank{ color:var(--gold); }
.deron-lvl-avatar{ width:56px; height:56px; border-radius:50%; margin:8px auto 10px; background: linear-gradient(180deg, #2a2e4a, #1a1d2e); display:grid; place-items:center; font-weight:900; font-size:20px; border:2px solid var(--border); }
.deron-lvl-card.pos-1 .deron-lvl-avatar{ width:72px; height:72px; font-size:26px; border-color:var(--gold); }
.deron-lvl-name{ font-weight:800; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff; }
.deron-lvl-guild{ font-size:11px; color:var(--muted); margin-top:2px; }
.deron-lvl-lvl{ margin-top:8px; display:inline-flex; align-items:center; gap:6px; background:#1c1f33; border:1px solid var(--border); border-radius:99px; padding:4px 10px; font-size:12px; font-weight:800; }
.deron-lvl-card.pos-1 .deron-lvl-lvl{ background: linear-gradient(135deg, #ffcc33, #ff8a00); color:#000; border:none; }
.deron-lvl-table-wrap{ padding:0 14px 14px; }
.deron-lvl-table{ width:100%; border-collapse:separate; border-spacing:0 8px; }
.deron-lvl-table thead th{ font-size:11px; text-transform:uppercase; letter-spacing:1px; color:var(--muted); padding:0 14px 6px; text-align:left; }
.deron-lvl-table thead th:last-child{ text-align:right; }
.deron-lvl-table tbody tr{ background:rgba(255,255,255,.02); transition:.2s; }
.deron-lvl-table tbody tr:hover{ background:rgba(124,92,255,.08); transform:translateY(-1px); }
.deron-lvl-table tbody td{ padding:12px 14px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.deron-lvl-table tbody td:first-child{ border-left:1px solid var(--border); border-radius:12px 0 0 12px; }
.deron-lvl-table tbody td:last-child{ border-right:1px solid var(--border); border-radius:0 12px 12px 0; }
.deron-pos{ display:inline-flex; width:28px; height:28px; border-radius:8px; align-items:center; justify-content:center; font-weight:900; font-size:12px; background:#1c1f33; border:1px solid var(--border); }
.deron-pos.top1{ background: linear-gradient(135deg, #ffcc33, #ff8a00); color:#000; border:none; }
.deron-pos.top2{ background: linear-gradient(135deg, #c0c6d6, #8a93a8); color:#000; border:none; }
.deron-pos.top3{ background: linear-gradient(135deg, #d98a4a, #a85a2a); color:#fff; border:none; }
.deron-player-cell{ display:flex; align-items:center; gap:10px; }
.deron-player-av{ width:32px; height:32px; border-radius:8px; background:#222540; display:grid; place-items:center; font-weight:800; font-size:12px; }
.deron-guild-tag{ font-size:11px; background:rgba(124,92,255,.15); border:1px solid rgba(124,92,255,.25); padding:2px 8px; border-radius:99px; color:#a99bff; }
.deron-lvl-badge{ display:inline-flex; align-items:center; gap:4px; background:linear-gradient(135deg, #1c1f33, #24284a); border:1px solid var(--border); padding:4px 10px; border-radius:99px; font-weight:800; font-size:12px; }
.deron-exp{ font-size:11px; color:var(--muted); text-align:right; }
.deron-exp b{ color:var(--text); font-size:12px; }
.deron-footer{ padding:12px 22px; border-top:1px solid var(--border); display:flex; justify-content:space-between; font-size:11px; color:var(--muted); }
@media(max-width:650px){ .deron-lvl-podium{ grid-template-columns:1fr; } .deron-lvl-card.pos-1{ order:-1; transform:none; } }