
*{box-sizing:border-box}
:root{
  --bg:#0a0d17;
  --surface:#ffffff;
  --surface-soft:rgba(255,255,255,.92);
  --text:#171a27;
  --text-soft:#5e6678;
  --text-faint:#8590a4;
  --line:rgba(255,255,255,.14);
  --line-strong:rgba(19,27,45,.09);
  --accent:#b2264c;
  --accent-2:#df456d;
  --accent-soft:#fff1f5;
  --success:#198754;
  --warning:#d98b06;
  --danger:#c7394b;
  --gold:#e0b14d;
  --silver:#bcc4d5;
  --bronze:#bf815d;
  --shadow:0 30px 80px rgba(7,12,24,.22);
  --shadow-soft:0 18px 46px rgba(10,13,28,.12);
  --radius-xl:30px;
  --radius-lg:22px;
  --radius-md:16px;
}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
body{min-height:100vh;background:var(--bg);color:#fff;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.page-bg{position:fixed;inset:0;z-index:-3;background:url("school-bg.png") center/cover no-repeat;filter:blur(9px) saturate(1.08) brightness(.50);transform:scale(1.09)}
.page-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 15%,rgba(255,207,220,.20),transparent 22%),radial-gradient(circle at 78% 12%,rgba(207,64,111,.18),transparent 20%),radial-gradient(circle at 50% 75%,rgba(255,255,255,.05),transparent 16%)}
.page-overlay{position:fixed;inset:0;z-index:-2;background:
linear-gradient(180deg,rgba(8,9,16,.84),rgba(20,10,21,.70) 28%,rgba(9,11,19,.84)),
linear-gradient(135deg,rgba(203,43,91,.12),transparent 42%,rgba(255,255,255,.04) 85%)}
.topbar{height:88px;padding:14px 30px;display:flex;align-items:center;justify-content:space-between;gap:18px;position:sticky;top:0;z-index:60;background:rgba(6,8,15,.72);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 8px 28px rgba(0,0,0,.14)}
.brand{display:flex;align-items:center;gap:12px}
.brand-logo{width:48px;height:48px;object-fit:contain;border-radius:14px;background:rgba(0,0,0,.18);padding:2px;box-shadow:0 8px 20px rgba(0,0,0,.22)}
.brand strong{display:block;font-size:28px;line-height:1;letter-spacing:-.03em}
.brand span{display:block;font-size:13px;color:#e0d0d7;margin-top:3px}
.top-actions,.top-actions>div{display:flex;align-items:center;gap:10px}
.elo-badge{padding:10px 13px;border-radius:999px;background:linear-gradient(135deg,#9f2241,#ea5077);font-weight:900;font-size:12px;box-shadow:0 10px 30px rgba(182,38,78,.26)}
.shell{width:min(1280px,calc(100% - 40px));margin:34px auto 72px}
.glass{border:1px solid var(--line);background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.07));backdrop-filter:blur(18px);box-shadow:var(--shadow)}
.glass-light{background:var(--surface-soft);color:var(--text);border:1px solid rgba(255,255,255,.75);backdrop-filter:blur(18px);box-shadow:var(--shadow)}
.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:900;letter-spacing:.17em;color:#e24c72;text-transform:uppercase}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 6px rgba(226,76,114,.12)}
.auth-layout{display:grid;grid-template-columns:1.12fr .88fr;gap:24px;align-items:stretch;min-height:calc(100vh - 190px)}
.auth-hero,.auth-card{border-radius:var(--radius-xl);padding:38px}
.auth-hero{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.auth-hero::before{content:"";position:absolute;inset:auto -60px -90px auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,177,203,.24),transparent 68%);pointer-events:none}
.hero-logo{width:min(300px,70%);max-height:170px;object-fit:contain;margin-bottom:16px;filter:drop-shadow(0 18px 28px rgba(0,0,0,.18))}
.auth-hero h1{font-size:clamp(54px,5vw,84px);line-height:.94;letter-spacing:-.05em;margin:12px 0 18px;max-width:700px}
.auth-hero>p{max-width:700px;color:#f1dce4;font-size:18px;line-height:1.75;margin:0}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.hero-badges span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);color:#fff;font-size:12px;font-weight:800;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.elo-examples{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}
.elo-examples div{padding:14px 14px 15px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.elo-examples strong,.elo-examples span{display:block}
.elo-examples strong{font-size:13px;color:#fff}
.elo-examples span{font-size:12px;color:#dfd2d8;margin-top:5px;line-height:1.5}
.auth-card{color:var(--text);display:flex;flex-direction:column;justify-content:center}
.auth-card h2{font-size:34px;letter-spacing:-.03em;margin:9px 0}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#eef0f4;padding:6px;border-radius:15px;margin-bottom:26px}
.auth-tab{border:0;border-radius:11px;padding:13px;background:transparent;font-weight:900;color:#6c7384;transition:.18s ease}
.auth-tab.active{background:#fff;color:#9f2543;box-shadow:0 10px 22px rgba(20,25,40,.08)}
.stack{display:flex;flex-direction:column;gap:14px;margin-top:18px}
label{font-size:12px;font-weight:800;color:#42495b}
input{width:100%;padding:15px 15px;border:1px solid #d4d9e2;border-radius:13px;background:#fff;color:#151824;outline:none;transition:.18s ease;margin-top:6px}
input::placeholder{color:#a0a6b6}
input:focus{border-color:#ca4468;box-shadow:0 0 0 5px rgba(198,58,96,.11)}
.btn{border:0;border-radius:13px;padding:12px 16px;font-weight:900;transition:.16s ease;letter-spacing:-.01em}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-primary{background:linear-gradient(135deg,#aa2346,#df456d);color:#fff;box-shadow:0 14px 30px rgba(178,38,76,.22)}
.btn-secondary{background:#eef1f5;color:#31384a}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.14)}
.btn-arena{background:linear-gradient(135deg,#ab2346,#f15278);color:#fff;padding:15px 22px;font-size:15px;box-shadow:0 16px 35px rgba(171,34,69,.28)}
.btn-danger{background:#d83e50;color:#fff}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none!important}
.alert{padding:11px 13px;border-radius:12px;font-size:12px;font-weight:800}
.alert-error{background:#fee6e9;color:#9d2030;border:1px solid #fac7cf}
.alert-success{background:#e3f8ec;color:#1e714c;border:1px solid #c4ebd5}
.muted{color:var(--text-soft);line-height:1.65}
.dashboard-hero{border-radius:var(--radius-xl);padding:28px 30px;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;overflow:hidden}
.dashboard-hero::after{content:"";position:absolute;right:-100px;top:-100px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,177,203,.18),transparent 65%)}
.player-identity{display:flex;align-items:center;gap:16px;position:relative;z-index:1}
.my-avatar{width:74px;height:74px;border-radius:24px;background:linear-gradient(145deg,#c23259,#78182f);display:grid;place-items:center;font-size:24px;font-weight:900;box-shadow:0 14px 32px rgba(150,30,57,.28)}
.player-identity h1{margin:6px 0 4px;font-size:35px;line-height:.98;letter-spacing:-.04em}
.player-identity p{margin:0;color:#e7ccd6;font-size:15px}
.dashboard-stats{display:grid;grid-template-columns:repeat(4,122px);gap:10px;position:relative;z-index:1}
.hero-stat{padding:13px 14px;border-radius:17px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.hero-stat span{display:block;font-size:10px;color:#e8d2db;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.hero-stat strong{display:block;font-size:26px;margin-top:4px;line-height:1}
.elo-stat{background:linear-gradient(145deg,rgba(217,52,94,.28),rgba(255,255,255,.10))}
.rank-stat{background:linear-gradient(145deg,rgba(222,177,67,.20),rgba(255,255,255,.09))}
.tabs{display:flex;gap:8px;padding:8px;margin:18px 0 22px;border-radius:18px;position:sticky;top:100px;z-index:20}
.tab{border:0;background:transparent;color:#f2dde5;padding:12px 18px;border-radius:12px;font-weight:900;font-size:14px;transition:.18s ease}
.tab:hover{background:rgba(255,255,255,.08)}
.tab.active{background:#fff;color:#a02543;box-shadow:0 10px 20px rgba(17,20,32,.08)}
.tab-panel{animation:fadeIn .22s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.section-title,.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.section-title h2,.section-head h2{margin:5px 0 0;font-size:28px;letter-spacing:-.03em}
.light-title h2{color:#fff}
.elo-system-pill{padding:10px 13px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.11);font-size:12px;font-weight:900;color:#fff}
.podium-section{margin-bottom:20px}
.podium{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:14px;align-items:end;margin-top:15px}
.podium-card{position:relative;border-radius:26px;padding:24px 20px;text-align:center;color:#fff;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(18px)}
.podium-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 45%);pointer-events:none}
.podium-card.rank-1{min-height:258px;background:linear-gradient(160deg,rgba(199,140,31,.88),rgba(71,43,14,.93))}
.podium-card.rank-2{min-height:218px;background:linear-gradient(160deg,rgba(126,137,160,.84),rgba(34,38,52,.93))}
.podium-card.rank-3{min-height:204px;background:linear-gradient(160deg,rgba(154,92,57,.82),rgba(52,31,24,.93))}
.podium-rank{font-size:34px;line-height:1}
.podium-avatar{width:72px;height:72px;margin:12px auto;border-radius:24px;background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;font-size:22px;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.podium-card h3{margin:10px 0 4px;font-size:21px;letter-spacing:-.03em}
.podium-card p{margin:0;color:#f1e7ea;font-size:12px}
.podium-elo{display:inline-flex;margin-top:12px;padding:8px 13px;border-radius:999px;background:rgba(255,255,255,.13);font-weight:900;letter-spacing:.02em}
.card{border-radius:24px;padding:24px}
.leaderboard-card{overflow:hidden}
.ranking-info{max-width:350px;color:#70788a;font-size:12px;text-align:right;line-height:1.6}
.leaderboard-table-wrap{overflow:auto;margin-top:14px;border:1px solid #eaedf2;border-radius:18px;background:#fff}
.leaderboard-table{width:100%;border-collapse:collapse;min-width:760px}
.leaderboard-table th{position:sticky;top:0;background:#fafbfc;text-align:left;padding:12px 12px;color:#8891a3;font-size:10px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid #e6e9ef}
.leaderboard-table td{padding:14px 12px;border-bottom:1px solid #eff2f6;font-size:14px}
.leaderboard-table tr{transition:.15s ease}
.leaderboard-table tr:hover{background:#faf5f7}
.leaderboard-table tr.is-me{background:#fff1f5}
.table-rank{font-weight:900;color:#697184}
.table-player{display:flex;align-items:center;gap:10px}
.table-avatar{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#f5e5eb;color:#9b2745;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.table-player strong,.table-player small{display:block}
.table-player strong{font-size:14px}
.table-player small{color:#818899;font-size:11px;margin-top:3px}
.table-elo{font-size:17px;font-weight:900;color:#9f2442}
.duels-layout{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start}
.duels-main{display:flex;flex-direction:column;gap:18px}
.create-duel-card{border-radius:26px;padding:26px;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;overflow:hidden}
.create-duel-card::after{content:"";position:absolute;right:-80px;bottom:-80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,173,197,.20),transparent 62%)}
.create-duel-card h2{font-size:31px;letter-spacing:-.03em;margin:6px 0 8px}
.create-duel-card p{margin:0;color:#ebd7df;max-width:560px;line-height:1.7}
.open-duels{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.open-duel{
  display:grid;grid-template-columns:minmax(0,1.35fr) auto auto;gap:16px;align-items:center;
  padding:18px;border:1px solid #e4e8ef;border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%, rgba(168,36,72,.06), transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,250,252,.96));
  box-shadow:var(--shadow-soft);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease
}
.open-duel:hover{transform:translateY(-2px);border-color:#e7c9d4;box-shadow:0 18px 42px rgba(18,24,40,.12)}
.open-duel-main{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;min-width:0}
.duel-avatar{
  width:64px;height:64px;border-radius:20px;background:linear-gradient(145deg,#b52a4d,#72162d);color:#fff;
  display:grid;place-items:center;font-weight:900;font-size:20px;box-shadow:0 12px 26px rgba(165,34,66,.18)
}
.open-duel-identity{min-width:0}
.open-duel-topline{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.open-duel-name{font-size:18px;font-weight:1000;letter-spacing:-.03em}
.open-duel-status{
  display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;
  background:#fff0f5;color:#a52345;border:1px solid #f0d2dc;font-size:10px;font-weight:1000;
  text-transform:uppercase;letter-spacing:.06em;white-space:nowrap
}
.open-duel-identity small{display:block;margin-top:4px;color:#7d8495;line-height:1.45;font-size:13px}
.open-duel-tier{margin-top:10px}
.open-duel-stats{display:grid;grid-template-columns:repeat(2,minmax(82px,1fr));gap:10px}
.open-duel-stat{
  padding:12px 14px;border-radius:16px;border:1px solid #e8ebf0;background:#fff;min-width:88px;text-align:center
}
.open-duel-stat span{display:block;font-size:10px;color:#8890a0;text-transform:uppercase;letter-spacing:.08em;font-weight:900}
.open-duel-stat strong{display:block;margin-top:5px;font-size:20px;line-height:1;color:#202433}
.open-duel-actions{display:flex;align-items:center;justify-content:flex-end}
.duel-join{
  border:0;border-radius:16px;padding:14px 18px;
  background:linear-gradient(135deg,#c52e58,#922241);color:#fff;font-weight:1000;
  min-width:155px;box-shadow:0 12px 26px rgba(165,34,66,.20);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease
}
.duel-join:hover{transform:translateY(-2px);box-shadow:0 18px 32px rgba(165,34,66,.28);filter:saturate(1.06)}

@media(max-width:1080px){
  .open-duels{grid-template-columns:1fr}
}
@media(max-width:720px){
  .open-duel{grid-template-columns:1fr;gap:14px}
  .open-duel-stats{grid-template-columns:1fr 1fr}
  .open-duel-actions{justify-content:stretch}
  .duel-join{width:100%}
}
@media(max-width:480px){
  .open-duel-main{grid-template-columns:56px 1fr}
  .duel-avatar{width:56px;height:56px;border-radius:18px;font-size:18px}
  .open-duel-name{font-size:16px}
}
.elo-rules{position:sticky;top:164px}
.elo-rules h2{font-size:28px;letter-spacing:-.03em;margin:5px 0 16px}
.elo-rule{padding:13px 0;border-bottom:1px solid #e8ebf0}
.elo-rule strong,.elo-rule span{display:block}
.elo-rule strong{font-size:14px}
.elo-rule span{margin-top:4px;color:#737a8b;font-size:12px;line-height:1.55}
.elo-rules>p{font-size:12px;color:#777e90;line-height:1.75;margin-bottom:0}
.current-duel h2{margin:4px 0;letter-spacing:-.03em;font-size:28px}
.duel-versus{display:grid;grid-template-columns:1fr auto 1fr;gap:15px;align-items:center;margin-top:16px}
.fighter{text-align:center;padding:18px;border:1px solid #e4e8ef;border-radius:20px;background:#fff;box-shadow:var(--shadow-soft)}
.fighter.me{background:#fff0f5;border-color:#f0c9d6}
.fighter-avatar{width:62px;height:62px;margin:auto;border-radius:20px;background:linear-gradient(145deg,#b62e50,#73172f);color:#fff;display:grid;place-items:center;font-weight:900;font-size:18px;box-shadow:0 12px 28px rgba(150,30,57,.20)}
.fighter h3{margin:10px 0 3px;font-size:18px;letter-spacing:-.03em}
.fighter .elo{font-size:12px;color:#8b5265;font-weight:900;letter-spacing:.04em}
.vs{font-size:24px;font-weight:1000;color:#b4284b;align-self:center;padding:0 5px}
.stakes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.stake{padding:13px 14px;border-radius:16px;background:#f4f6f9;font-size:12px;border:1px solid #e9edf2}
.stake strong{display:block;color:#202432;font-size:13px}
.stake span{display:block;margin-top:4px;color:#72798b;line-height:1.5}
.result-report{margin-top:15px;padding:16px;border-radius:18px;background:#f6f7fa;border:1px solid #e8ebf1}
.result-report h3{margin:0 0 9px;font-size:15px}
.result-buttons{display:flex;gap:9px}
.result-buttons button{flex:1}
.report-status{margin-top:10px;font-size:12px;color:#6f7788;line-height:1.6}
.duel-status{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.07em}
.status-open{background:#e9eefc;color:#465eac}
.status-in_progress,.status-awaiting{background:#fff1cc;color:#7f5d11}
.status-disputed{background:#fee2e2;color:#a21e31}
.status-completed{background:#dcfce7;color:#176943}
.history-list{display:flex;flex-direction:column;gap:11px;margin-top:14px}
.history-row{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding:14px;border:1px solid #e5e8ef;border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(248,249,252,.95));box-shadow:var(--shadow-soft)}
.history-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:18px}
.history-icon.win{background:#dcfce7}
.history-icon.loss{background:#fee2e2}
.history-copy strong,.history-copy small{display:block}
.history-copy strong{font-size:14px}
.history-copy small{margin-top:4px;color:#7e8595}
.history-delta{text-align:right;font-weight:900;font-size:17px}
.history-delta.win{color:#168757}
.history-delta.loss{color:#c42a3e}
.empty-state{padding:26px;text-align:center;border:1px dashed #d9dde5;border-radius:16px;color:#7c8394;background:#fbfcfd}
.modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:18px}
.modal-backdrop{position:absolute;inset:0;background:rgba(2,5,12,.83);backdrop-filter:blur(10px)}
.modal-dialog{position:relative;z-index:1;width:min(760px,100%);max-height:90vh;overflow:auto;border-radius:26px;padding:28px;background:#fff;color:var(--text);box-shadow:0 30px 90px rgba(0,0,0,.45)}
.modal-close{position:absolute;right:14px;top:12px;width:40px;height:40px;border:0;border-radius:12px;background:#eff1f5;font-size:24px;color:#3d4355}
.admin-disputes{display:flex;flex-direction:column;gap:12px}
.dispute-card{padding:15px;border:1px solid #e0e4eb;border-radius:16px;background:#fafbfd}
.dispute-card h3{margin:0 0 8px;letter-spacing:-.02em}
.dispute-card p{margin:0;color:#72798b;font-size:12px;line-height:1.6}
.dispute-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
@media(max-width:1100px){
  .auth-layout,.duels-layout{grid-template-columns:1fr}
  .auth-layout{min-height:auto}
  .dashboard-hero{align-items:flex-start;flex-direction:column}
  .dashboard-stats{grid-template-columns:repeat(4,1fr);width:100%}
  .podium{grid-template-columns:1fr 1fr 1fr}
  .elo-rules{position:static}
}
@media(max-width:780px){
  .topbar{height:78px;padding:12px 14px}
  .brand strong{font-size:22px}
  .brand span{font-size:12px}
  .brand-logo{width:44px;height:44px}
  .shell{width:min(100% - 18px,1280px);margin-top:16px}
  .auth-hero,.auth-card,.dashboard-hero,.card,.create-duel-card{padding:22px;border-radius:22px}
  .auth-hero h1{font-size:44px}
  .elo-examples,.open-duels,.stakes{grid-template-columns:1fr}
  .dashboard-stats{grid-template-columns:1fr 1fr}
  .podium{grid-template-columns:1fr}
  .podium-card.rank-1,.podium-card.rank-2,.podium-card.rank-3{min-height:0}
  .podium-card.rank-1{order:-1}
  .tabs{top:86px;overflow:auto}
  .create-duel-card{align-items:flex-start;flex-direction:column}
  .duel-versus{grid-template-columns:1fr}
  .vs{text-align:center}
  .result-buttons{flex-direction:column}
  .section-head,.section-title{flex-direction:column}
  .ranking-info{text-align:left;max-width:none}
  .history-row{grid-template-columns:1fr}
  .history-delta{text-align:left}
}



/* ==========================================================
   RANKED / ESPORTS V3
   ========================================================== */

.entrance-overlay{
  position:fixed;inset:0;z-index:5000;display:grid;place-items:center;
  align-content:center;gap:10px;background:
    radial-gradient(circle at 50% 42%,rgba(213,45,96,.25),transparent 26%),
    linear-gradient(180deg,#080a11,#160b14 56%,#080b12);
  transition:opacity .48s ease,visibility .48s ease;overflow:hidden;
}
.entrance-overlay.leave{opacity:0;visibility:hidden}
.entrance-ring{
  position:absolute;width:340px;height:340px;border-radius:50%;
  border:1px solid rgba(255,255,255,.10);box-shadow:
  0 0 0 34px rgba(255,255,255,.025),
  0 0 0 68px rgba(215,54,102,.025),
  0 0 80px rgba(212,49,95,.17);
  animation:entrancePulse 1.7s ease-in-out infinite;
}
.entrance-logo{width:min(330px,68vw);max-height:210px;object-fit:contain;position:relative;z-index:2;filter:drop-shadow(0 24px 45px rgba(0,0,0,.35));animation:entranceLogo .7s cubic-bezier(.2,.9,.2,1) both}
.entrance-title{position:relative;z-index:2;font-weight:1000;letter-spacing:.28em;text-indent:.28em;font-size:13px;color:#fff}
.entrance-subtitle{position:relative;z-index:2;font-weight:900;letter-spacing:.30em;text-indent:.30em;font-size:9px;color:#ef87a6}
@keyframes entranceLogo{from{opacity:0;transform:scale(.82) translateY(12px)}to{opacity:1;transform:none}}
@keyframes entrancePulse{50%{transform:scale(1.06);opacity:.68}}

.ambient-fx{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.sakura-petal{
  --left:50%;--delay:0s;--duration:14s;--size:12px;--drift:30px;
  position:absolute;left:var(--left);top:-8vh;width:var(--size);height:calc(var(--size) * .72);
  border-radius:80% 0 80% 20%;background:linear-gradient(135deg,#ffe9f1,#ee8eae);
  opacity:0;filter:drop-shadow(0 0 8px rgba(255,162,193,.18));
  animation:sakuraFall var(--duration) linear var(--delay) infinite;
}
@keyframes sakuraFall{
  0%{opacity:0;transform:translate3d(0,-5vh,0) rotate(0deg)}
  8%{opacity:.56}
  86%{opacity:.32}
  100%{opacity:0;transform:translate3d(var(--drift),112vh,0) rotate(720deg)}
}
.glow-particle{
  --left:50%;--top:50%;--delay:0s;position:absolute;left:var(--left);top:var(--top);
  width:3px;height:3px;border-radius:50%;background:#ffb5ca;box-shadow:0 0 14px 4px rgba(255,94,141,.20);
  opacity:.25;animation:particleGlow 4s ease-in-out var(--delay) infinite;
}
@keyframes particleGlow{50%{opacity:.75;transform:scale(1.8)}}

.player-profile-copy{min-width:260px}
.tier-badge{margin-top:10px}
.tier-progress-wrap{margin-top:11px;width:min(330px,55vw)}
.tier-progress-meta{display:flex;justify-content:space-between;gap:12px;color:#dbcbd2;font-size:10px;font-weight:800}
.tier-progress-meta strong{color:#fff}
.tier-progress-track{margin-top:7px;height:6px;border-radius:999px;background:rgba(255,255,255,.10);overflow:hidden}
.tier-progress-track span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#d32f5d,#ff9abc);box-shadow:0 0 18px rgba(235,76,118,.44);transition:width .5s ease}

.rank-chip{
  --rank-a:#8992a0;--rank-b:#414a56;
  display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;
  border:1px solid color-mix(in srgb,var(--rank-a) 38%,transparent);
  background:linear-gradient(135deg,color-mix(in srgb,var(--rank-a) 13%,white),color-mix(in srgb,var(--rank-b) 8%,white));
  color:#202431;font-size:11px;font-weight:900;line-height:1;box-shadow:0 8px 18px rgba(15,20,35,.08);
}
.rank-chip img{width:24px;height:27px;object-fit:contain}
.rank-chip.compact{padding:4px 8px;font-size:10px;gap:5px}
.rank-chip.compact img{width:20px;height:23px}
.rank-chip.rank-iron{--rank-a:#6d7581;--rank-b:#333942}
.rank-chip.rank-bronze{--rank-a:#c07a4d;--rank-b:#743820}
.rank-chip.rank-silver{--rank-a:#d4dce7;--rank-b:#8996a9}
.rank-chip.rank-gold{--rank-a:#f2cd59;--rank-b:#a36b10}
.rank-chip.rank-platinum{--rank-a:#82ddd6;--rank-b:#277f86}
.rank-chip.rank-diamond{--rank-a:#77c6ff;--rank-b:#6350e3}
.rank-chip.rank-immortal{--rank-a:#ff5b92;--rank-b:#8d28ff;color:#40132c}

.podium-tier{margin-top:10px}
.podium-tier .rank-chip{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.16);color:#fff;box-shadow:none}

.rank-legend{margin-top:22px;padding-top:18px;border-top:1px solid #e8ebef}
.rank-legend-list{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.rank-legend-row{
  --rank:#9ba2ae;display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;
  padding:8px 9px;border-radius:12px;background:#f7f8fa;border:1px solid #eceff3;position:relative;overflow:hidden
}
.rank-legend-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--rank)}
.rank-legend-row img{width:34px;height:38px;object-fit:contain}
.rank-legend-row strong,.rank-legend-row span{display:block}
.rank-legend-row strong{font-size:12px;color:#232735}
.rank-legend-row span{font-size:10px;color:#7c8495;margin-top:2px}
.rank-legend-row.rank-iron{--rank:#6d7581}
.rank-legend-row.rank-bronze{--rank:#b96e42}
.rank-legend-row.rank-silver{--rank:#b9c3d2}
.rank-legend-row.rank-gold{--rank:#e4b52f}
.rank-legend-row.rank-platinum{--rank:#57c9c1}
.rank-legend-row.rank-diamond{--rank:#66adff}
.rank-legend-row.rank-immortal{--rank:#e44381}

.open-duel-tier{margin-top:7px}

.arena-stage{
  margin-top:16px;padding:20px;border-radius:24px;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(182,38,78,.13),transparent 34%,transparent 66%,rgba(96,71,220,.12)),
    radial-gradient(circle at 50% 110%,rgba(255,75,126,.16),transparent 38%),
    #10131d;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 0 70px rgba(0,0,0,.24),0 20px 50px rgba(9,12,24,.16)
}
.arena-stage::before{
  content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:linear-gradient(transparent,rgba(255,255,255,.12),transparent)
}
.arena-stage-label{
  text-align:center;color:#ee7397;font-weight:1000;letter-spacing:.28em;font-size:10px;margin-bottom:12px
}
.arena-stage .duel-versus{position:relative;z-index:1;margin-top:0}
.arena-stage .fighter{
  min-height:245px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,247,251,.93));
  border-width:1px;position:relative;overflow:hidden
}
.arena-stage .fighter::before{
  content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--tier-accent,#b62e50)
}
.fighter-role{
  position:absolute;left:12px;top:12px;padding:5px 8px;border-radius:999px;background:#aa2347;color:#fff;
  font-size:9px;font-weight:1000;letter-spacing:.10em
}
.fighter-role.opponent{background:#343a52}
.fighter-rank-icon{
  position:absolute;right:12px;top:10px;width:45px;height:50px;object-fit:contain;opacity:.94;
  filter:drop-shadow(0 6px 9px rgba(0,0,0,.15))
}
.fighter-tier{margin-top:9px}
.vs-block{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:62px}
.vs-block span{
  width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#b3264c,#63172a);
  color:#fff;font-weight:1000;font-size:19px;box-shadow:0 0 0 8px rgba(184,38,79,.10),0 12px 28px rgba(0,0,0,.25)
}
.vs-block small{color:#bbc1cd;font-size:9px;font-weight:900;letter-spacing:.15em}
.tier-frame-iron{--tier-accent:#626b78}
.tier-frame-bronze{--tier-accent:#bb7146}
.tier-frame-silver{--tier-accent:#aab7c8}
.tier-frame-gold{--tier-accent:#e2b637}
.tier-frame-platinum{--tier-accent:#58cac3}
.tier-frame-diamond{--tier-accent:#6ab7ff}
.tier-frame-immortal{--tier-accent:#ef4a87;box-shadow:0 0 0 1px rgba(236,73,136,.20),0 20px 45px rgba(146,35,180,.13)}

.current-duel{
  background:rgba(255,255,255,.95);
  box-shadow:0 28px 70px rgba(7,11,25,.26),0 0 0 1px rgba(255,255,255,.50)
}
.current-duel .stakes{margin-top:14px}
.current-duel .stake:first-child{background:#eefbf4;border-color:#d1efde}
.current-duel .stake:last-child{background:#fff2f4;border-color:#f0d2d9}

@media(max-width:780px){
  .player-profile-copy{min-width:0}
  .tier-progress-wrap{width:100%}
  .arena-stage{padding:14px}
  .arena-stage::before{display:none}
  .arena-stage .fighter{min-height:210px}
  .vs-block{margin:2px auto}
}

@media(prefers-reduced-motion:reduce){
  .entrance-overlay{display:none!important}
  .ambient-fx{display:none!important}
  .tab-panel,.entrance-logo,.entrance-ring{animation:none!important}
}



/* ==========================================================
   PLAYER PROFILES V4
   ========================================================== */

.my-avatar,.table-avatar,.podium-avatar,.duel-avatar,.fighter-avatar,.avatar-preview,.public-profile-avatar{
  overflow:hidden
}
.my-avatar img,.table-avatar-img,.podium-avatar-img,.duel-avatar-img,.fighter-avatar-img,.avatar-preview img,.public-profile-avatar-img{
  width:100%;height:100%;object-fit:cover;display:block
}
.table-avatar,.podium-avatar,.duel-avatar,.fighter-avatar{
  padding:0;border:0;cursor:pointer
}
.profile-name-btn{
  appearance:none;border:0;background:none;padding:0;color:inherit;font:inherit;font-weight:900;cursor:pointer;text-align:left
}
.profile-name-btn:hover{color:#aa2448;text-decoration:underline;text-underline-offset:3px}
.profile-name-btn.light:hover{color:#fff;text-decoration-color:rgba(255,255,255,.55)}
.profile-open-btn{transition:transform .16s ease,box-shadow .16s ease}
.profile-open-btn:hover{transform:translateY(-2px) scale(1.02)}

.profile-dialog{width:min(820px,100%);padding:0;overflow:hidden;background:#f5f6f8}
.public-profile-hero{
  --profile-a:#9b2647;--profile-b:#28101a;
  display:flex;align-items:center;gap:22px;padding:34px;color:#fff;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 86% 5%,color-mix(in srgb,var(--profile-a) 30%,transparent),transparent 32%),
    linear-gradient(135deg,var(--profile-b),#111521 72%);
}
.public-profile-hero::after{
  content:"";position:absolute;right:-90px;bottom:-120px;width:280px;height:280px;border-radius:50%;
  border:1px solid rgba(255,255,255,.07);box-shadow:0 0 0 38px rgba(255,255,255,.025),0 0 0 76px rgba(255,255,255,.018)
}
.public-profile-avatar{
  width:126px;height:126px;min-width:126px;border-radius:34px;display:grid;place-items:center;
  background:linear-gradient(145deg,#c33159,#71152e);font-size:36px;font-weight:1000;
  border:3px solid rgba(255,255,255,.23);box-shadow:0 24px 45px rgba(0,0,0,.28);position:relative;z-index:1
}
.public-profile-main{position:relative;z-index:1;min-width:0}
.public-profile-main h2{font-size:36px;letter-spacing:-.04em;margin:9px 0 4px}
.public-profile-main>p{margin:0;color:#e8d6dd}
.public-profile-rank .rank-chip{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.16);color:#fff;box-shadow:none}
.profile-bio{margin-top:16px;max-width:540px;color:#f1e7eb;font-size:13px;line-height:1.7;white-space:pre-wrap}
.rank-bg-iron{--profile-a:#626a76;--profile-b:#171a20}
.rank-bg-bronze{--profile-a:#b46f47;--profile-b:#28150e}
.rank-bg-silver{--profile-a:#b4bfce;--profile-b:#202630}
.rank-bg-gold{--profile-a:#e0b033;--profile-b:#2f2108}
.rank-bg-platinum{--profile-a:#54c7c1;--profile-b:#0c292b}
.rank-bg-diamond{--profile-a:#69b7ff;--profile-b:#18204e}
.rank-bg-immortal{--profile-a:#e84b88;--profile-b:#2b0f31}

.public-profile-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px 22px;background:#fff;border-bottom:1px solid #e5e8ef}
.public-profile-stats>div{padding:12px 13px;border-radius:15px;background:#f5f7fa;border:1px solid #edf0f4}
.public-profile-stats span{display:block;color:#8a92a3;font-size:9px;text-transform:uppercase;font-weight:900;letter-spacing:.08em}
.public-profile-stats strong{display:block;margin-top:4px;font-size:22px;color:#202433}
.profile-recent{padding:22px}
.profile-recent h3{margin:5px 0 0;font-size:23px}
.profile-match-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.profile-match-row{display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center;padding:10px 11px;border-radius:13px;background:#fff;border:1px solid #e7eaf0}
.profile-match-result{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-weight:1000;font-size:12px}
.profile-match-result.win{background:#dcfce7;color:#176943}
.profile-match-result.loss{background:#fee2e2;color:#a52438}
.profile-match-row strong,.profile-match-row small{display:block}
.profile-match-row strong{font-size:12px;color:#272b38}
.profile-match-row small{font-size:10px;color:#858c9c;margin-top:2px}
.profile-match-row b{font-size:12px}
.profile-match-row .positive{color:#168757}
.profile-match-row .negative{color:#c42a3e}
.empty-state.compact{padding:14px}

.edit-profile-dialog{width:min(780px,100%)}
.edit-profile-dialog h2{font-size:31px;letter-spacing:-.03em;margin:6px 0}
.edit-profile-layout{display:grid;grid-template-columns:220px 1fr;gap:24px;margin-top:22px}
.avatar-editor{padding:18px;border-radius:19px;background:#f5f6f8;border:1px solid #e5e8ee;text-align:center}
.avatar-preview{
  width:150px;height:150px;margin:0 auto 15px;border-radius:36px;background:linear-gradient(145deg,#b82b50,#73162e);
  color:#fff;display:grid;place-items:center;font-size:35px;font-weight:1000;box-shadow:0 18px 35px rgba(166,36,72,.20)
}
.file-upload{display:block}
.file-upload input{display:none}
.file-upload span{
  display:block;padding:11px 12px;border-radius:12px;background:#fff;border:1px solid #dfe3ea;color:#9e2644;font-size:11px;font-weight:900;cursor:pointer
}
.avatar-editor small{display:block;color:#858c9b;font-size:9px;margin:8px 0 12px;line-height:1.5}
.avatar-editor .btn{width:100%}
.profile-form{margin-top:0}
.profile-form textarea{
  width:100%;min-height:150px;resize:vertical;padding:13px 14px;border:1px solid #d5dae3;border-radius:13px;
  background:#fff;color:#171a27;font:inherit;outline:none;line-height:1.6;margin-top:6px
}
.profile-form textarea:focus{border-color:#ca4468;box-shadow:0 0 0 5px rgba(198,58,96,.11)}
.profile-char-count{text-align:right;color:#8b92a1;font-size:10px;margin-top:-7px}

@media(max-width:700px){
  .public-profile-hero{align-items:flex-start;flex-direction:column;padding:25px}
  .public-profile-avatar{width:100px;height:100px;min-width:100px;border-radius:28px}
  .public-profile-main h2{font-size:29px}
  .public-profile-stats{grid-template-columns:1fr 1fr}
  .edit-profile-layout{grid-template-columns:1fr}
  .avatar-editor{max-width:260px;width:100%;margin:auto}
}


/* LIVE AUTO-REFRESH 5S */
.duels-live-tools{display:flex;align-items:center;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.live-status{
  display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border-radius:999px;
  background:#eaf9f0;color:#167047;border:1px solid #ccebd9;
  font-size:9px;font-weight:1000;letter-spacing:.06em;text-transform:uppercase;
  white-space:nowrap;transition:.18s ease
}
.live-status i{
  width:7px;height:7px;border-radius:50%;background:#21b66f;
  box-shadow:0 0 0 0 rgba(33,182,111,.42);
  animation:arenaLivePulse 1.7s infinite
}
.live-status.pulse{
  background:#fff0f5;color:#9f2447;border-color:#f1cad7;transform:translateY(-1px)
}
.live-status.pulse i{background:#d83d69;animation:none}
.live-status.offline{background:#f3f4f6;color:#777f90;border-color:#e2e5ea}
.live-status.offline i{background:#969eac;animation:none}

@keyframes arenaLivePulse{
  0%{box-shadow:0 0 0 0 rgba(33,182,111,.38)}
  70%{box-shadow:0 0 0 7px rgba(33,182,111,0)}
  100%{box-shadow:0 0 0 0 rgba(33,182,111,0)}
}

@media(max-width:700px){
  .duels-live-tools{width:100%;justify-content:space-between}
}



/* ==========================================================
   PROFILE POPUP FIX / MINI PROFILE V7
   ========================================================== */

.profile-modal{
  place-items:center!important;
}

.profile-modal .modal-dialog.profile-dialog{
  width:min(590px,calc(100vw - 28px))!important;
  max-height:min(780px,calc(100vh - 36px));
  padding:0!important;
  border-radius:28px!important;
  overflow:hidden;
  background:#f5f6f8;
  box-shadow:
    0 36px 110px rgba(0,0,0,.52),
    0 0 0 1px rgba(255,255,255,.12);
  animation:miniProfileIn .20s cubic-bezier(.2,.8,.2,1);
}

@keyframes miniProfileIn{
  from{opacity:0;transform:translateY(12px) scale(.96)}
  to{opacity:1;transform:none}
}

.profile-modal .modal-close{
  z-index:10;
  right:14px;
  top:14px;
  background:rgba(8,11,18,.48);
  color:#fff;
  border:1px solid rgba(255,255,255,.15);
  backdrop-filter:blur(10px);
}

.profile-modal .modal-close:hover{
  background:rgba(170,35,71,.84);
}

.mini-profile-card{
  --profile-a:#a5274a;
  --profile-b:#17131d;
  color:#202431;
  background:#f6f7f9;
}

.mini-profile-top{
  display:flex;
  align-items:center;
  gap:18px;
  padding:30px 30px 25px;
  color:#fff;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% -10%,color-mix(in srgb,var(--profile-a) 50%,transparent),transparent 38%),
    radial-gradient(circle at 20% 115%,rgba(255,255,255,.07),transparent 30%),
    linear-gradient(135deg,var(--profile-b),#121622 75%);
}

.mini-profile-top::after{
  content:"";
  position:absolute;
  right:-55px;
  bottom:-95px;
  width:210px;
  height:210px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.07);
  box-shadow:
    0 0 0 30px rgba(255,255,255,.022),
    0 0 0 60px rgba(255,255,255,.015);
}

.mini-profile-avatar{
  width:100px;
  height:100px;
  min-width:100px;
  border-radius:29px;
  display:grid;
  place-items:center;
  overflow:hidden;
  position:relative;
  z-index:1;
  background:linear-gradient(145deg,#c52e58,#75172f);
  border:3px solid rgba(255,255,255,.20);
  box-shadow:0 20px 40px rgba(0,0,0,.28);
  font-size:30px;
  font-weight:1000;
}

.mini-profile-avatar-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.mini-profile-identity{
  min-width:0;
  position:relative;
  z-index:1;
}

.mini-profile-identity h2{
  margin:8px 0 4px;
  font-size:31px;
  line-height:1;
  letter-spacing:-.045em;
  color:#fff;
}

.mini-profile-identity p{
  margin:0;
  color:#e5d5dc;
  font-size:13px;
}

.mini-profile-rank .rank-chip{
  background:rgba(255,255,255,.12);
  color:#fff;
  border-color:rgba(255,255,255,.15);
  box-shadow:none;
}

.mini-profile-stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  padding:15px 18px 0;
}

.mini-profile-stats>div{
  padding:12px 10px;
  border-radius:15px;
  background:#fff;
  border:1px solid #e7eaf0;
  text-align:center;
  box-shadow:0 7px 20px rgba(20,25,40,.045);
}

.mini-profile-stats span{
  display:block;
  color:#8a92a3;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:1000;
}

.mini-profile-stats strong{
  display:block;
  margin-top:4px;
  color:#202432;
  font-size:19px;
  line-height:1;
}

.mini-profile-bio{
  margin:12px 18px 0;
  padding:13px 15px;
  border-radius:15px;
  background:#fff;
  border:1px solid #e7eaf0;
}

.mini-profile-bio>span,
.mini-profile-section-title>span{
  color:#a52345;
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:9px;
  font-weight:1000;
}

.mini-profile-bio p{
  margin:6px 0 0;
  color:#596173;
  line-height:1.55;
  font-size:12px;
  white-space:pre-wrap;
  max-height:76px;
  overflow:auto;
}

.mini-profile-recent{
  padding:15px 18px 20px;
}

.mini-profile-section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.mini-profile-section-title small{
  color:#8b92a1;
  font-size:10px;
  font-weight:800;
}

.mini-profile-match-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.mini-profile-match{
  display:grid;
  grid-template-columns:32px 1fr auto;
  gap:9px;
  align-items:center;
  padding:9px 10px;
  border-radius:13px;
  background:#fff;
  border:1px solid #e7eaf0;
}

.mini-match-result{
  width:32px;
  height:32px;
  border-radius:10px;
  display:grid;
  place-items:center;
  font-size:10px;
  font-weight:1000;
}

.mini-match-result.win{
  background:#dcfce7;
  color:#176943;
}

.mini-match-result.loss{
  background:#fee2e2;
  color:#a52438;
}

.mini-match-copy strong,
.mini-match-copy small{
  display:block;
}

.mini-match-copy strong{
  color:#252936;
  font-size:11px;
}

.mini-match-copy small{
  color:#8a91a0;
  font-size:9px;
  margin-top:2px;
}

.mini-profile-match b{
  font-size:12px;
}

.mini-profile-match .positive{color:#178557}
.mini-profile-match .negative{color:#c22e43}

.mini-profile-empty{
  padding:13px;
  border:1px dashed #d9dde5;
  border-radius:13px;
  color:#858c9b;
  text-align:center;
  font-size:11px;
  background:#fff;
}

.profile-loading{
  min-height:300px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:13px;
  color:#555e70;
  background:#fff;
}

.profile-loading-spinner{
  width:37px;
  height:37px;
  border-radius:50%;
  border:3px solid #f0dbe2;
  border-top-color:#b3264c;
  animation:profileSpin .75s linear infinite;
}

@keyframes profileSpin{
  to{transform:rotate(360deg)}
}

.rank-bg-iron{--profile-a:#626a76;--profile-b:#171a20}
.rank-bg-bronze{--profile-a:#b46f47;--profile-b:#28150e}
.rank-bg-silver{--profile-a:#b4bfce;--profile-b:#202630}
.rank-bg-gold{--profile-a:#e0b033;--profile-b:#2f2108}
.rank-bg-platinum{--profile-a:#54c7c1;--profile-b:#0c292b}
.rank-bg-diamond{--profile-a:#69b7ff;--profile-b:#18204e}
.rank-bg-immortal{--profile-a:#e84b88;--profile-b:#2b0f31}

@media(max-width:600px){
  .mini-profile-top{
    padding:25px 20px 21px;
    gap:14px;
  }

  .mini-profile-avatar{
    width:82px;
    height:82px;
    min-width:82px;
    border-radius:24px;
  }

  .mini-profile-identity h2{
    font-size:24px;
  }

  .mini-profile-stats{
    grid-template-columns:1fr 1fr;
  }
}



/* ==========================================================
   GAKURAN ARENA RULES V9
   ========================================================== */

.rules-consent{
  display:grid;
  grid-template-columns:18px 1fr;
  align-items:start;
  gap:10px;
  padding:12px 13px;
  border-radius:13px;
  background:#f7f8fa;
  border:1px solid #e5e8ee;
  cursor:pointer;
}

.rules-consent>input{
  width:17px;
  height:17px;
  margin:1px 0 0;
  accent-color:#b2264c;
}

.rules-consent>span{
  color:#656d7f;
  font-size:11px;
  line-height:1.55;
  font-weight:700;
}

.inline-rules-btn{
  display:inline;
  padding:0;
  border:0;
  background:none;
  color:#a52345;
  font:inherit;
  font-weight:1000;
  text-decoration:underline;
  text-underline-offset:2px;
}

.rules-dialog{
  width:min(930px,calc(100vw - 28px))!important;
  max-height:calc(100vh - 30px);
  padding:0!important;
  border-radius:28px!important;
  overflow:auto;
  background:#f4f5f8!important;
}

.rules-header{
  display:grid;
  grid-template-columns:74px 1fr;
  gap:18px;
  align-items:center;
  padding:30px 34px;
  color:#fff;
  background:
    radial-gradient(circle at 89% 5%,rgba(230,66,112,.25),transparent 28%),
    linear-gradient(135deg,#16141d,#35131f 62%,#18111b);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.rules-header-icon{
  width:70px;
  height:70px;
  border-radius:22px;
  display:grid;
  place-items:center;
  font-size:30px;
  background:linear-gradient(145deg,#c52f59,#74172f);
  box-shadow:0 16px 34px rgba(129,24,53,.30);
  border:1px solid rgba(255,255,255,.14);
}

.rules-header h2{
  margin:7px 0 6px;
  color:#fff;
  font-size:31px;
  letter-spacing:-.04em;
}

.rules-header p{
  max-width:680px;
  margin:0;
  color:#dfd2d8;
  font-size:12px;
  line-height:1.7;
}

.rules-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  padding:20px;
}

.rule-card{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:11px;
  padding:15px;
  border-radius:17px;
  background:#fff;
  border:1px solid #e5e8ee;
  box-shadow:0 8px 22px rgba(18,24,40,.04);
}

.rule-card.rule-important{
  border-color:#efd0da;
  background:linear-gradient(135deg,#fff7fa,#fff);
}

.rule-number{
  width:38px;
  height:38px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#f4e6eb;
  color:#a72446;
  font-size:10px;
  font-weight:1000;
}

.rule-important .rule-number{
  color:#fff;
  background:linear-gradient(145deg,#c62e58,#8f203e);
}

.rule-card h3{
  margin:1px 0 5px;
  color:#252936;
  font-size:14px;
  letter-spacing:-.02em;
}

.rule-card p{
  margin:0;
  color:#70788a;
  font-size:11px;
  line-height:1.62;
}

.penalties-panel{
  margin:0 20px 18px;
  padding:20px;
  border-radius:20px;
  color:#fff;
  background:
    radial-gradient(circle at 95% 0%,rgba(229,68,111,.20),transparent 34%),
    linear-gradient(135deg,#18151f,#29121a);
  border:1px solid rgba(255,255,255,.08);
}

.penalties-panel h3{
  margin:6px 0 14px;
  font-size:22px;
  letter-spacing:-.03em;
}

.penalty-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.penalty-list>div{
  padding:12px 13px;
  border-radius:14px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.08);
}

.penalty-list strong,
.penalty-list span{
  display:block;
}

.penalty-list strong{
  color:#fff;
  font-size:12px;
}

.penalty-list span{
  margin-top:4px;
  color:#d9ccd2;
  font-size:10px;
  line-height:1.55;
}

.rules-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 20px 20px;
  border-top:1px solid #e2e5ea;
  background:#fff;
}

.rules-footer p{
  max-width:680px;
  margin:0;
  color:#707789;
  font-size:10px;
  line-height:1.6;
}

.rules-footer .btn{
  min-width:160px;
}

@media(max-width:720px){
  .rules-header{
    grid-template-columns:1fr;
    padding:25px 22px;
  }

  .rules-header-icon{
    width:58px;
    height:58px;
    border-radius:18px;
    font-size:25px;
  }

  .rules-header h2{
    font-size:26px;
  }

  .rules-grid,
  .penalty-list{
    grid-template-columns:1fr;
  }

  .rules-grid{
    padding:13px;
  }

  .penalties-panel{
    margin:0 13px 13px;
  }

  .rules-footer{
    align-items:stretch;
    flex-direction:column;
  }

  .rules-footer .btn{
    width:100%;
  }
}



/* ==========================================================
   REGULAMIN PRO / VISIBLE V11
   ========================================================== */

/* Topbar: regulamin jest celowo mocniej widoczny niż Admin */
.rules-top-btn{
  display:inline-flex;
  align-items:center;
  gap:7px;
  border:1px solid rgba(247,116,155,.28);
  border-radius:12px;
  padding:10px 14px;
  background:linear-gradient(135deg,rgba(176,34,72,.94),rgba(216,61,104,.92));
  color:#fff;
  font-weight:900;
  box-shadow:0 10px 26px rgba(170,35,71,.20);
  transition:.16s ease;
}

.rules-top-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 15px 32px rgba(170,35,71,.28);
}

/* Fair-play card visible before login */
.fairplay-card{
  width:100%;
  margin-top:18px;
  padding:13px 15px;
  display:grid;
  grid-template-columns:42px 1fr auto;
  align-items:center;
  gap:12px;
  border-radius:17px;
  border:1px solid rgba(255,141,176,.22);
  background:
    radial-gradient(circle at 100% 0%,rgba(229,67,112,.15),transparent 32%),
    rgba(9,10,17,.28);
  color:#fff;
  text-align:left;
  backdrop-filter:blur(10px);
  transition:.18s ease;
}

.fairplay-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,159,188,.42);
  background:
    radial-gradient(circle at 100% 0%,rgba(229,67,112,.22),transparent 34%),
    rgba(9,10,17,.36);
}

.fairplay-icon{
  width:42px;
  height:42px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#c22b54,#72162d);
  font-size:18px;
}

.fairplay-copy{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.fairplay-copy small{
  color:#ff8dac;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.12em;
}

.fairplay-copy strong{
  margin-top:2px;
  font-size:12px;
  line-height:1.4;
}

.fairplay-copy>span{
  margin-top:2px;
  color:#dccbd2;
  font-size:9px;
  line-height:1.45;
}

.fairplay-arrow{
  color:#fff;
  font-size:10px;
  font-weight:900;
  white-space:nowrap;
}

/* Logged-in visible strip */
.arena-rules-strip{
  width:100%;
  margin:14px 0 0;
  padding:11px 14px;
  display:grid;
  grid-template-columns:38px 1fr auto;
  align-items:center;
  gap:11px;
  color:#fff;
  border:1px solid rgba(255,255,255,.11);
  border-radius:16px;
  background:
    linear-gradient(90deg,rgba(154,31,65,.90),rgba(66,21,39,.82)),
    rgba(18,15,22,.85);
  box-shadow:0 12px 30px rgba(0,0,0,.14);
  transition:.17s ease;
}

.arena-rules-strip:hover{
  transform:translateY(-1px);
  box-shadow:0 17px 36px rgba(0,0,0,.20);
}

.arena-rules-strip-icon{
  width:36px;
  height:36px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.10);
}

.arena-rules-strip-copy{
  display:flex;
  flex-direction:column;
  text-align:left;
}

.arena-rules-strip-copy strong{
  font-size:11px;
}

.arena-rules-strip-copy span{
  margin-top:2px;
  color:#ead9df;
  font-size:9px;
}

.arena-rules-strip-cta{
  font-size:10px;
  font-weight:900;
  white-space:nowrap;
}

/* Registration consent: cleaner and harder to miss */
.rules-consent{
  border-color:#ecc9d5!important;
  background:linear-gradient(135deg,#fff3f7,#fff)!important;
}

.inline-rules-btn{
  color:#ad2549!important;
  font-weight:1000!important;
}

/* The modal */
.rules-modal{
  align-items:center!important;
}

.rules-dialog{
  width:min(940px,calc(100vw - 30px))!important;
  max-height:calc(100vh - 30px)!important;
  padding:0!important;
  border-radius:28px!important;
  overflow:auto!important;
  background:#f5f6f8!important;
  box-shadow:0 42px 130px rgba(0,0,0,.54)!important;
}

.rules-dialog .modal-close{
  position:sticky;
  float:right;
  top:13px;
  right:13px;
  margin:13px 13px -53px 0;
  z-index:30;
  color:#fff;
  background:rgba(9,11,17,.46);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(10px);
}

.rules-pro-header{
  min-height:170px;
  display:grid;
  grid-template-columns:82px 1fr;
  align-items:center;
  gap:20px;
  padding:31px 36px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 0%,rgba(232,69,116,.26),transparent 30%),
    radial-gradient(circle at 5% 100%,rgba(255,255,255,.06),transparent 28%),
    linear-gradient(135deg,#12141d,#34121f 62%,#16121b);
}

.rules-pro-mark{
  width:78px;
  height:78px;
  border-radius:24px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#c82d58,#76172f);
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 18px 40px rgba(120,21,51,.33);
  font-size:31px;
}

.rules-pro-kicker{
  color:#ff89aa;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.15em;
}

.rules-pro-heading h2{
  margin:7px 0 7px;
  font-size:33px;
  letter-spacing:-.04em;
}

.rules-pro-heading p{
  max-width:690px;
  margin:0;
  color:#dfd1d7;
  line-height:1.65;
  font-size:11px;
}

.rules-pro-alert{
  display:grid;
  grid-template-columns:43px 1fr auto;
  align-items:center;
  gap:12px;
  margin:15px 20px 0;
  padding:12px 14px;
  border-radius:16px;
  color:#77203a;
  background:linear-gradient(135deg,#fff0f5,#fff8fa);
  border:1px solid #edc8d4;
}

.rules-pro-alert-icon{
  width:39px;
  height:39px;
  border-radius:12px;
  display:grid;
  place-items:center;
  color:#fff;
  background:#b5274c;
  font-size:19px;
  font-weight:1000;
}

.rules-pro-alert strong{
  display:block;
  color:#8e2141;
  font-size:12px;
}

.rules-pro-alert p{
  margin:2px 0 0;
  color:#78616a;
  font-size:10px;
  line-height:1.5;
}

.rules-pro-alert>span{
  padding:7px 9px;
  border-radius:999px;
  background:#b4274c;
  color:#fff;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.07em;
  white-space:nowrap;
}

.rules-pro-body{
  padding:14px 20px 20px;
}

.rules-priority-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.rules-priority-card{
  display:grid;
  grid-template-columns:43px 1fr;
  gap:10px;
  padding:14px;
  border-radius:17px;
  background:#fff;
  border:1px solid #e5e8ee;
  box-shadow:0 8px 22px rgba(17,23,38,.04);
}

.rules-priority-icon{
  width:41px;
  height:41px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:#f6e5eb;
  font-size:17px;
}

.rules-priority-card span{
  color:#c03156;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.1em;
}

.rules-priority-card h3{
  margin:3px 0 3px;
  color:#242936;
  font-size:13px;
}

.rules-priority-card p{
  margin:0;
  color:#72798b;
  font-size:10px;
  line-height:1.55;
}

.rules-section{
  margin-top:11px;
  padding:16px;
  border-radius:18px;
  background:#fff;
  border:1px solid #e5e8ee;
}

.rules-section-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

.rules-section-icon{
  width:35px;
  height:35px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:#f4e7ec;
  font-size:15px;
}

.rules-section-title small{
  color:#bc3155;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.11em;
}

.rules-section-title h3{
  margin:2px 0 0;
  color:#242936;
  font-size:17px;
  letter-spacing:-.02em;
}

.rules-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}

.rules-list-item{
  display:grid;
  grid-template-columns:27px 1fr;
  gap:8px;
  align-items:start;
  padding:9px 10px;
  border-radius:12px;
  background:#f8f9fb;
  border:1px solid #edf0f4;
}

.rules-list-item>span{
  width:27px;
  height:27px;
  border-radius:9px;
  display:grid;
  place-items:center;
  color:#b6264b;
  background:#f8e3ea;
  font-size:13px;
  font-weight:1000;
}

.rules-list-item p{
  margin:1px 0 0;
  color:#6f7788;
  font-size:9px;
  line-height:1.55;
}

.rules-list-item strong{
  color:#303543;
}

.rules-two-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.rules-compact-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.rules-compact-list p{
  margin:0;
  padding:8px 9px;
  border-radius:11px;
  background:#f7f8fa;
  color:#6f7788;
  font-size:9px;
  line-height:1.5;
}

.rules-compact-list b{
  color:#a82748;
}

.rules-penalties{
  margin-top:11px;
  padding:17px;
  border-radius:19px;
  background:
    radial-gradient(circle at 100% 0%,rgba(224,65,109,.18),transparent 34%),
    linear-gradient(135deg,#14161e,#29131b);
  border:1px solid rgba(255,255,255,.07);
}

.rules-section-title.light .rules-section-icon{
  background:rgba(255,255,255,.08);
}

.rules-section-title.light small{
  color:#ff86a9;
}

.rules-section-title.light h3{
  color:#fff;
}

.rules-penalty-steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
}

.rules-penalty-steps>div{
  padding:11px;
  border-radius:13px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.075);
}

.rules-penalty-steps span{
  display:block;
  color:#ef7096;
  font-size:8px;
  font-weight:1000;
}

.rules-penalty-steps strong{
  display:block;
  margin-top:4px;
  color:#fff;
  font-size:11px;
}

.rules-penalty-steps p{
  margin:4px 0 0;
  color:#d5c9cf;
  font-size:8px;
  line-height:1.5;
}

.rules-pro-footer{
  position:sticky;
  bottom:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:13px 20px;
  background:rgba(255,255,255,.96);
  border-top:1px solid #e0e4e9;
  backdrop-filter:blur(14px);
}

.rules-pro-footer strong,
.rules-pro-footer span{
  display:block;
}

.rules-pro-footer strong{
  color:#272b38;
  font-size:11px;
}

.rules-pro-footer span{
  margin-top:2px;
  color:#808797;
  font-size:8px;
}

.rules-pro-footer .btn{
  min-width:155px;
}

@media(max-width:800px){
  .rules-priority-grid,
  .rules-list,
  .rules-two-columns,
  .rules-penalty-steps{
    grid-template-columns:1fr;
  }

  .rules-pro-header{
    grid-template-columns:1fr;
    padding:25px 22px;
  }

  .rules-pro-mark{
    width:58px;
    height:58px;
    border-radius:18px;
    font-size:23px;
  }

  .rules-pro-heading h2{
    font-size:27px;
  }

  .rules-pro-alert{
    grid-template-columns:38px 1fr;
  }

  .rules-pro-alert>span{
    grid-column:1 / -1;
    justify-self:start;
  }

  .rules-pro-footer{
    align-items:stretch;
    flex-direction:column;
  }

  .rules-pro-footer .btn{
    width:100%;
  }

  .arena-rules-strip{
    grid-template-columns:36px 1fr;
  }

  .arena-rules-strip-cta{
    grid-column:1 / -1;
    padding-left:47px;
  }
}

@media(max-width:600px){
  .fairplay-card{
    grid-template-columns:38px 1fr;
  }

  .fairplay-arrow{
    grid-column:1 / -1;
    padding-left:50px;
  }
}



/* ==========================================================
   EDITABLE PROFILE IDENTITY V15
   ========================================================== */

.profile-data-card{
  padding:15px;
  border-radius:17px;
  background:
    radial-gradient(circle at 100% 0%,rgba(185,39,77,.06),transparent 30%),
    #f7f8fa;
  border:1px solid #e4e8ef;
}

.profile-data-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.profile-data-heading h3{
  margin:4px 0 0;
  color:#252936;
  font-size:17px;
  letter-spacing:-.025em;
}

.profile-data-note{
  padding:6px 9px;
  border-radius:999px;
  background:#fff;
  border:1px solid #e3e6ec;
  color:#858d9d;
  font-size:9px;
  font-weight:850;
  white-space:nowrap;
}

.profile-fields-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.profile-fields-grid label{
  margin:0;
}

.profile-login-hint{
  margin:10px 0 0;
  padding:9px 10px;
  border-radius:11px;
  background:#fff4f7;
  border:1px solid #efd4dd;
  color:#8f4960;
  font-size:9px;
  font-weight:700;
  line-height:1.5;
}

.profile-save-btn{
  margin-top:2px;
}

@media(max-width:650px){
  .profile-fields-grid{
    grid-template-columns:1fr;
  }

  .profile-data-heading{
    flex-direction:column;
  }
}



/* ==========================================================
   PRESTIGE PODIUM + LEADERBOARD V17
   ========================================================== */

.podium-section{
  position:relative;
  margin-bottom:24px;
}

.podium-section::before{
  content:"";
  position:absolute;
  inset:auto 0 -16px 0;
  height:120px;
  background:radial-gradient(circle at 50% 0%, rgba(255,208,120,.12), transparent 68%);
  pointer-events:none;
  filter:blur(10px);
}

.podium{
  gap:18px;
  margin-top:18px;
}

.podium-card{
  position:relative;
  isolation:isolate;
  padding:28px 22px 24px;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:
    0 26px 60px rgba(8, 10, 18, .34),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -30px 60px rgba(0,0,0,.12);
}

.podium-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% -5%, rgba(255,255,255,.22), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 24%, transparent 76%, rgba(255,255,255,.05));
  mix-blend-mode:screen;
}

.podium-card.rank-1{
  min-height:280px;
  background:
    radial-gradient(circle at 50% -8%, rgba(255,233,170,.28), transparent 34%),
    linear-gradient(160deg, rgba(197,145,36,.96), rgba(111,68,17,.98));
}

.podium-card.rank-2{
  min-height:234px;
  background:
    radial-gradient(circle at 50% -8%, rgba(237,242,255,.18), transparent 34%),
    linear-gradient(160deg, rgba(138,148,171,.92), rgba(34,39,53,.98));
}

.podium-card.rank-3{
  min-height:220px;
  background:
    radial-gradient(circle at 50% -8%, rgba(255,220,200,.14), transparent 34%),
    linear-gradient(160deg, rgba(170,105,70,.92), rgba(65,39,28,.98));
}

.podium-rank{
  width:44px;
  height:44px;
  margin:0 auto 10px;
  display:grid;
  place-items:center;
  font-size:24px;
  line-height:1;
  border-radius:50%;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 10px 24px rgba(0,0,0,.14);
}

.podium-avatar{
  width:86px;
  height:86px;
  margin:8px auto 14px;
  border-radius:28px;
  background:rgba(255,255,255,.14);
  border:2px solid rgba(255,255,255,.24);
  box-shadow:
    0 16px 32px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.podium-card.rank-1 .podium-avatar{
  width:94px;
  height:94px;
  border-color:rgba(255,242,203,.42);
  box-shadow:
    0 18px 36px rgba(61,35,5,.28),
    0 0 0 6px rgba(255,224,145,.10);
}

.podium-card h3{
  margin:8px 0 4px;
  font-size:20px;
  letter-spacing:-.035em;
  text-shadow:0 2px 8px rgba(0,0,0,.12);
}

.podium-card p{
  color:rgba(255,247,250,.84);
  font-size:13px;
}

.podium-tier{
  margin-top:12px;
}

.podium-tier .rank-chip{
  min-height:34px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.15);
  color:#fff;
  box-shadow:none;
}

.podium-tier .rank-chip img{
  width:17px;
  height:17px;
}

.podium-tier .rank-chip b,
.podium-tier .rank-chip span{
  color:#fff;
}

.podium-elo{
  margin-top:14px;
  padding:10px 16px;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  font-size:16px;
}

.leaderboard-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.52);
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,250,252,.98));
  box-shadow:
    0 28px 60px rgba(13,16,27,.18),
    inset 0 1px 0 rgba(255,255,255,.8);
}

.leaderboard-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:88px;
  background:linear-gradient(90deg, rgba(181,36,73,.06), rgba(255,215,153,.07), rgba(113,55,188,.04));
  pointer-events:none;
}

.section-head{
  position:relative;
  z-index:1;
}

.ranking-info{
  max-width:380px;
  padding:10px 14px;
  border-radius:16px;
  background:rgba(252,247,249,.92);
  border:1px solid #efe0e6;
  color:#7c6e79;
  font-size:12px;
  line-height:1.6;
  box-shadow:0 8px 18px rgba(26,20,31,.05);
}

.leaderboard-table-wrap{
  position:relative;
  z-index:1;
  margin-top:18px;
  border-radius:22px;
  border:1px solid #ebeef4;
  background:linear-gradient(180deg, #ffffff 0%, #fcfcfd 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}

.leaderboard-table{
  min-width:820px;
}

.leaderboard-table th{
  top:0;
  padding:14px 14px;
  background:linear-gradient(180deg, #fbfbfd 0%, #f5f7fa 100%);
  color:#8c95a7;
  font-size:10px;
  letter-spacing:.12em;
  border-bottom:1px solid #eceff5;
}

.leaderboard-table td{
  padding:16px 14px;
  border-bottom:1px solid #eef1f5;
  vertical-align:middle;
}

.leaderboard-table tbody tr{
  transition:transform .14s ease, background .14s ease, box-shadow .14s ease;
}

.leaderboard-table tbody tr:hover{
  background:linear-gradient(90deg, rgba(255,247,250,.9), rgba(255,255,255,.98));
  transform:translateX(2px);
}

.leaderboard-table tr.is-me{
  background:linear-gradient(90deg, rgba(255,238,244,.95), rgba(255,250,252,.99));
}

.leaderboard-table tbody tr:nth-child(1){
  background:linear-gradient(90deg, rgba(255,247,227,.96), rgba(255,252,243,.98));
}

.leaderboard-table tbody tr:nth-child(2){
  background:linear-gradient(90deg, rgba(246,248,252,.98), rgba(255,255,255,.99));
}

.leaderboard-table tbody tr:nth-child(3){
  background:linear-gradient(90deg, rgba(250,241,236,.98), rgba(255,255,255,.99));
}

.leaderboard-table tbody tr:nth-child(1):hover,
.leaderboard-table tbody tr:nth-child(2):hover,
.leaderboard-table tbody tr:nth-child(3):hover{
  transform:translateX(2px);
}

.table-rank{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:54px;
  height:34px;
  padding:0 12px;
  border-radius:999px;
  background:#f4f6fa;
  border:1px solid #e5e9f0;
  color:#667085;
  font-weight:1000;
  letter-spacing:-.02em;
}

.leaderboard-table tbody tr:nth-child(1) .table-rank{
  background:linear-gradient(135deg, #f5d484, #b27a1d);
  border-color:#d9ab4d;
  color:#fff;
  box-shadow:0 10px 18px rgba(178,122,29,.18);
}

.leaderboard-table tbody tr:nth-child(2) .table-rank{
  background:linear-gradient(135deg, #e6ebf5, #9eaac2);
  border-color:#cfd7e6;
  color:#243044;
}

.leaderboard-table tbody tr:nth-child(3) .table-rank{
  background:linear-gradient(135deg, #f0d3c5, #ba7d56);
  border-color:#e0b398;
  color:#fff;
}

.table-player{
  gap:12px;
}

.table-avatar{
  width:46px;
  height:46px;
  border-radius:15px;
  border:1px solid #ead5de;
  background:linear-gradient(145deg, #f4e4ea, #eac7d3);
  box-shadow:0 8px 18px rgba(136,34,65,.08);
}

.table-player strong{
  font-size:15px;
  letter-spacing:-.02em;
  color:#1f2430;
}

.table-player small{
  color:#8a93a3;
  font-size:11px;
}

.leaderboard-table td:nth-child(3) .rank-chip{
  background:#fff;
}

.table-elo{
  font-size:20px;
  font-weight:1000;
  color:#a52245;
  letter-spacing:-.03em;
}

.leaderboard-table td:last-child,
.leaderboard-table td:nth-last-child(2),
.leaderboard-table td:nth-last-child(3){
  font-weight:800;
  color:#313748;
}

@media(max-width:960px){
  .ranking-info{
    max-width:none;
    text-align:left;
  }

  .leaderboard-card::before{
    height:72px;
  }
}

@media(max-width:760px){
  .podium{
    gap:14px;
  }

  .podium-card{
    padding:22px 18px;
  }

  .podium-avatar,
  .podium-card.rank-1 .podium-avatar{
    width:80px;
    height:80px;
    border-radius:24px;
  }

  .ranking-info{
    padding:10px 12px;
    font-size:11px;
  }
}



/* ==========================================================
   DUELS LAYOUT FIX V18
   ========================================================== */

/* Otwarta walka zajmuje pełną szerokość — nic nie ściska się do 2 kolumn. */
.open-duels{
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
  margin-top:16px!important;
}

.open-duel{
  width:100%;
  min-width:0;
  display:grid!important;
  grid-template-columns:minmax(260px,1fr) auto!important;
  grid-template-areas:
    "player action"
    "stats  action";
  align-items:center!important;
  gap:12px 22px!important;
  padding:17px 18px!important;
  border-radius:20px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(181,38,77,.055),transparent 31%),
    linear-gradient(180deg,#fff,#fbfbfd)!important;
  border:1px solid #e6e9ef!important;
  box-shadow:0 12px 30px rgba(18,24,40,.075)!important;
}

.open-duel-main{
  grid-area:player;
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr)!important;
  gap:13px!important;
  align-items:center!important;
  min-width:0!important;
}

.duel-avatar{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  border-radius:18px!important;
}

.open-duel-identity{
  min-width:0!important;
  overflow:hidden;
}

.open-duel-topline{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  min-width:0;
}

.open-duel-name{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:17px!important;
}

.open-duel-status{
  padding:5px 8px!important;
  font-size:8px!important;
  flex:0 0 auto;
}

.open-duel-identity small{
  margin-top:3px!important;
  font-size:11px!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.open-duel-tier{
  margin-top:7px!important;
}

.open-duel-stats{
  grid-area:stats;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0;
}

.open-duel-stat{
  min-width:86px!important;
  padding:8px 11px!important;
  border-radius:13px!important;
  text-align:left!important;
  background:#f7f8fa!important;
  border:1px solid #eceff3!important;
}

.open-duel-stat span{
  font-size:8px!important;
}

.open-duel-stat strong{
  margin-top:3px!important;
  font-size:16px!important;
}

.open-duel-actions{
  grid-area:action;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
}

.duel-join{
  width:auto!important;
  min-width:150px!important;
  margin:0!important;
  padding:13px 17px!important;
  border-radius:14px!important;
  white-space:nowrap;
}

/* Create duel card: button always has its own space and cannot be squeezed. */
.create-duel-card{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:24px!important;
}

.create-duel-card>div{
  min-width:0;
}

#createDuelBtn{
  position:relative;
  z-index:2;
  min-width:174px;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

#createDuelBtn:disabled,
.duel-join:disabled{
  cursor:wait!important;
  opacity:.74!important;
  transform:none!important;
  filter:none!important;
}

.button-spinner{
  width:15px;
  height:15px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.38);
  border-top-color:#fff;
  display:inline-block;
  animation:duelButtonSpin .68s linear infinite;
  flex:0 0 auto;
}

@keyframes duelButtonSpin{
  to{transform:rotate(360deg)}
}

/* Tablet / narrower desktop */
@media(max-width:900px){
  .open-duel{
    grid-template-columns:minmax(0,1fr) auto!important;
  }

  .open-duel-stats{
    flex-wrap:wrap;
  }
}

/* Mobile — clean vertical layout, still no overlaps. */
@media(max-width:680px){
  .create-duel-card{
    grid-template-columns:1fr!important;
    align-items:stretch!important;
    gap:16px!important;
  }

  #createDuelBtn{
    width:100%!important;
    min-width:0!important;
  }

  .open-duel{
    grid-template-columns:1fr!important;
    grid-template-areas:
      "player"
      "stats"
      "action"!important;
    gap:13px!important;
    padding:15px!important;
  }

  .open-duel-actions{
    justify-content:stretch!important;
  }

  .duel-join{
    width:100%!important;
    min-width:0!important;
  }

  .open-duel-stats{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
  }

  .open-duel-stat{
    width:100%!important;
  }
}

@media(max-width:420px){
  .open-duel-main{
    grid-template-columns:50px minmax(0,1fr)!important;
  }

  .duel-avatar{
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    border-radius:15px!important;
  }

  .open-duel-name{
    font-size:15px!important;
  }
}



/* ==========================================================
   GLOBAL MATCH HISTORY V19
   ========================================================== */

.history-global-card{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(255,255,255,.97),rgba(249,250,252,.98))!important;
}

.history-global-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:110px;
  background:
    radial-gradient(circle at 90% 0%,rgba(177,37,73,.07),transparent 35%),
    linear-gradient(90deg,rgba(177,37,73,.035),transparent 50%);
  pointer-events:none;
}

.history-global-head{
  position:relative;
  z-index:1;
  align-items:center;
}

.history-global-subtitle{
  margin:7px 0 0;
  color:#7e8798;
  font-size:12px;
  line-height:1.55;
}

.history-global-summary{
  min-width:120px;
  padding:11px 15px;
  border-radius:16px;
  text-align:center;
  background:#fff;
  border:1px solid #e5e9ef;
  box-shadow:0 8px 22px rgba(16,22,36,.055);
}

.history-global-summary span,
.history-global-summary strong{
  display:block;
}

.history-global-summary span{
  color:#8a93a4;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.history-global-summary strong{
  margin-top:3px;
  color:#a42446;
  font-size:23px;
  line-height:1;
}

.global-history-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:18px;
}

.global-history-row{
  position:relative;
  overflow:hidden;
  padding:14px;
  border-radius:20px;
  background:#fff;
  border:1px solid #e5e9ef;
  box-shadow:0 10px 28px rgba(16,22,36,.055);
}

.global-history-row::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,#d63b65,#9b2141);
}

.global-history-meta{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:11px;
}

.global-history-id{
  padding:6px 9px;
  border-radius:999px;
  background:#f7e8ed;
  color:#a52345;
  font-size:9px;
  font-weight:1000;
}

.global-history-meta strong,
.global-history-meta small{
  display:block;
}

.global-history-meta strong{
  color:#303544;
  font-size:11px;
}

.global-history-meta small{
  margin-top:2px;
  color:#939aaa;
  font-size:9px;
}

.global-history-match{
  display:grid;
  grid-template-columns:minmax(0,1fr) 116px minmax(0,1fr);
  gap:12px;
  align-items:stretch;
}

.global-history-player{
  position:relative;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) auto;
  grid-template-areas:
    "avatar copy result"
    "avatar copy delta";
  gap:2px 11px;
  align-items:center;
  min-width:0;
  padding:11px 12px;
  border-radius:16px;
  text-align:left;
  border:1px solid #e7eaf0;
  background:#f9fafb;
  color:#242936;
  transition:.16s ease;
}

.global-history-player:hover{
  transform:translateY(-1px);
}

.global-history-player.winner{
  background:linear-gradient(135deg,#f0fbf5,#fff);
  border-color:#d7eee2;
}

.global-history-player.loser{
  background:linear-gradient(135deg,#fbf7f8,#fff);
}

.global-history-avatar{
  grid-area:avatar;
  width:46px;
  height:46px;
  border-radius:14px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:linear-gradient(145deg,#bd2c52,#75172f);
  color:#fff;
  font-size:13px;
  font-weight:1000;
  box-shadow:0 8px 18px rgba(128,29,57,.12);
}

.global-history-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.global-history-player-copy{
  grid-area:copy;
  min-width:0;
}

.global-history-player-copy strong,
.global-history-player-copy small{
  display:block;
}

.global-history-player-copy strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#252936;
  font-size:12px;
}

.global-history-player-copy small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:2px;
  color:#9299a8;
  font-size:9px;
}

.global-history-player-result{
  grid-area:result;
  justify-self:end;
  padding:5px 7px;
  border-radius:999px;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.06em;
}

.global-history-player-result.win{
  color:#177249;
  background:#dcf7e7;
}

.global-history-player-result.loss{
  color:#9d4351;
  background:#f6e7ea;
}

.global-history-player-delta{
  grid-area:delta;
  justify-self:end;
  font-size:10px;
  font-weight:1000;
}

.global-history-player-delta.positive{
  color:#188457;
}

.global-history-player-delta.negative{
  color:#bd3248;
}

.global-history-score{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:10px;
  border-radius:16px;
  background:
    radial-gradient(circle at 50% 0%,rgba(196,47,88,.08),transparent 50%),
    #f5f6f8;
  border:1px solid #e7eaf0;
  text-align:center;
}

.global-history-score-label{
  color:#a52647;
  font-size:7px;
  font-weight:1000;
  letter-spacing:.13em;
}

.global-history-score strong{
  margin-top:4px;
  color:#202431;
  font-size:24px;
  line-height:1;
  letter-spacing:-.05em;
}

.global-history-score strong i{
  color:#a8afbb;
  font-style:normal;
  margin:0 4px;
}

.global-history-score small{
  margin-top:6px;
  max-width:100px;
  color:#787f90;
  font-size:8px;
  line-height:1.35;
}

@media(max-width:800px){
  .global-history-match{
    grid-template-columns:1fr;
  }

  .global-history-score{
    order:2;
    min-height:70px;
  }

  .global-history-player:first-child{
    order:1;
  }

  .global-history-player:last-child{
    order:3;
  }

  .history-global-head{
    align-items:flex-start;
  }
}

@media(max-width:520px){
  .history-global-summary{
    min-width:0;
    width:100%;
    text-align:left;
  }

  .global-history-player{
    grid-template-columns:42px minmax(0,1fr);
    grid-template-areas:
      "avatar copy"
      "avatar result"
      "avatar delta";
  }

  .global-history-player-result,
  .global-history-player-delta{
    justify-self:start;
  }

  .global-history-avatar{
    width:42px;
    height:42px;
  }
}



/* ==========================================================
   ADMIN ELO MANAGEMENT V20
   ========================================================== */

.admin-panel-pro{
  min-width:min(900px,calc(100vw - 60px));
}

.admin-panel-head{
  align-items:flex-start;
}

.admin-tabs{
  display:flex;
  gap:7px;
  margin:18px 0 16px;
  padding:6px;
  border-radius:15px;
  background:#f3f4f7;
  border:1px solid #e5e8ee;
}

.admin-tab{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:10px 14px;
  border:0;
  border-radius:11px;
  background:transparent;
  color:#697184;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
}

.admin-tab.active{
  color:#a52446;
  background:#fff;
  box-shadow:0 7px 18px rgba(17,23,38,.07);
}

.admin-tab-count{
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  display:inline-grid;
  place-items:center;
  color:#fff;
  background:#bd2a50;
  font-size:8px;
}

.admin-player-tools{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(240px,320px);
  gap:18px;
  align-items:end;
  margin-bottom:14px;
}

.admin-player-tools h3,
.admin-disputes-heading h3{
  margin:4px 0 4px;
  color:#252936;
  font-size:20px;
  letter-spacing:-.03em;
}

.admin-player-tools p{
  max-width:560px;
  margin:0;
  color:#7b8394;
  font-size:10px;
  line-height:1.55;
}

.admin-player-search{
  margin:0;
}

.admin-player-search span{
  display:block;
  margin-bottom:5px;
  color:#596173;
  font-size:10px;
  font-weight:900;
}

.admin-players-list{
  display:flex;
  flex-direction:column;
  gap:9px;
  max-height:520px;
  padding-right:3px;
  overflow:auto;
}

.admin-players-loading{
  min-height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:#838b9b;
  font-size:11px;
  font-weight:800;
}

.button-spinner.dark{
  border-color:#d8dde5;
  border-top-color:#a62648;
}

.admin-player-row{
  display:grid;
  grid-template-columns:minmax(220px,1.25fr) 135px minmax(360px,1.7fr);
  gap:14px;
  align-items:center;
  padding:13px;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#fafbfc);
  border:1px solid #e6e9ef;
  box-shadow:0 8px 22px rgba(18,24,40,.045);
}

.admin-player-identity{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:11px;
  align-items:center;
  min-width:0;
}

.admin-player-avatar{
  width:48px;
  height:48px;
  border-radius:15px;
  display:grid;
  place-items:center;
  overflow:hidden;
  color:#fff;
  background:linear-gradient(145deg,#be2b52,#74172f);
  font-size:13px;
  font-weight:1000;
}

.admin-player-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.admin-player-copy{
  min-width:0;
}

.admin-player-name-line{
  display:flex;
  align-items:center;
  gap:7px;
}

.admin-player-name-line strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#242936;
  font-size:12px;
}

.admin-player-name-line span{
  padding:4px 6px;
  border-radius:999px;
  background:#f1f3f6;
  color:#777f90;
  font-size:8px;
  font-weight:900;
}

.admin-player-copy small{
  display:block;
  margin-top:2px;
  color:#8d95a5;
  font-size:9px;
}

.admin-player-record{
  margin-top:5px;
  color:#727a8c;
  font-size:8px;
  font-weight:800;
}

.admin-player-current{
  padding:9px 10px;
  border-radius:14px;
  background:#f5f6f8;
  border:1px solid #eaedf2;
}

.admin-player-current>span,
.admin-player-current>strong{
  display:block;
}

.admin-player-current>span{
  color:#8b93a3;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.admin-player-current>strong{
  margin:3px 0 6px;
  color:#a52446;
  font-size:22px;
  line-height:1;
}

.admin-elo-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.admin-elo-action{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:7px;
  padding:8px;
  border-radius:13px;
  background:#f7f8fa;
  border:1px solid #eceff3;
}

.admin-elo-action label{
  margin:0;
}

.admin-elo-action label span{
  display:block;
  margin-bottom:4px;
  color:#737c8d;
  font-size:8px;
  font-weight:900;
}

.admin-elo-action input{
  min-width:0;
  width:100%;
  padding:9px 9px;
  border-radius:10px;
}

.admin-elo-action .btn{
  min-width:94px;
  padding:10px 11px;
  border-radius:10px;
  font-size:9px;
}

.admin-elo-subtract{
  color:#a02943;
  background:#fdecef;
  border:1px solid #f3d0d8;
}

.admin-elo-subtract:hover{
  color:#fff;
  background:#b72a4d;
}

.admin-elo-set{
  color:#fff;
  background:linear-gradient(135deg,#b7294e,#8e203d);
  border:1px solid #a42345;
}

.admin-disputes-heading{
  margin-bottom:12px;
}

@media(max-width:980px){
  .admin-panel-pro{
    min-width:0;
  }

  .admin-player-row{
    grid-template-columns:minmax(0,1fr) 130px;
  }

  .admin-elo-actions{
    grid-column:1 / -1;
  }
}

@media(max-width:700px){
  .admin-player-tools,
  .admin-player-row,
  .admin-elo-actions{
    grid-template-columns:1fr;
  }

  .admin-player-current{
    width:100%;
  }

  .admin-elo-action{
    grid-template-columns:1fr;
  }

  .admin-elo-action .btn{
    width:100%;
  }
}



/* ==== Rank frame + larger rank badges v21 ==== */
.rank-frame{
  --ring-1:#d6dbe3;
  --ring-2:#717b8a;
  --ring-edge:rgba(255,255,255,.42);
  --ring-glow:rgba(185,193,205,.18);
  position:relative;
  isolation:isolate;
  overflow:visible !important;
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
}
.rank-frame::before{
  content:"";
  position:absolute;
  inset:-4px;
  border-radius:calc(inherit + 4px);
  background:linear-gradient(145deg,var(--ring-1),var(--ring-2));
  box-shadow:0 0 0 1px var(--ring-edge),0 8px 18px var(--ring-glow);
  z-index:0;
  pointer-events:none;
}
.rank-frame::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:calc(inherit + 1px);
  border:1px solid rgba(255,255,255,.28);
  z-index:1;
  pointer-events:none;
}
.rank-frame img,
.rank-frame span{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:block;
  border-radius:inherit;
}
.rank-frame img{
  background:transparent !important;
  object-fit:cover;
}
.rank-frame span{
  display:grid;
  place-items:center;
  font-weight:900;
  background:rgba(255,255,255,.10);
}
.rank-frame-iron{--ring-1:#d4dae2;--ring-2:#7a8595;--ring-glow:rgba(122,133,149,.20)}
.rank-frame-bronze{--ring-1:#efbf95;--ring-2:#b86a39;--ring-glow:rgba(184,106,57,.18)}
.rank-frame-silver{--ring-1:#ffffff;--ring-2:#c1ccdb;--ring-glow:rgba(193,204,219,.22)}
.rank-frame-gold{--ring-1:#ffe593;--ring-2:#d2a132;--ring-glow:rgba(210,161,50,.20)}
.rank-frame-platinum{--ring-1:#b9f3ee;--ring-2:#5cc9c1;--ring-glow:rgba(92,201,193,.18)}
.rank-frame-diamond{--ring-1:#d2e7ff;--ring-2:#7a8fff;--ring-glow:rgba(122,143,255,.22)}
.rank-frame-immortal{--ring-1:#ffc1de;--ring-2:#f062a4;--ring-glow:rgba(240,98,164,.22)}

.my-avatar{width:82px;height:82px;border-radius:28px;padding:3px}
.my-avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:25px;background:transparent !important}
.my-avatar span{font-size:26px;border-radius:25px}

.podium-avatar{width:86px;height:86px;margin:16px auto 12px;border-radius:28px;padding:3px}
.podium-avatar-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:25px;background:transparent !important}
.podium-card h3{margin:14px 0 4px;font-size:22px}
.podium-card p{font-size:13px;color:rgba(255,245,248,.88)}
.podium-tier{margin-top:14px}
.podium-tier .rank-chip{padding:8px 14px;gap:8px;font-size:13px;border-width:1px;background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.22);color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.12)}
.podium-tier .rank-chip img{width:24px;height:28px}
.podium-elo{margin-top:14px;padding:10px 16px;font-size:17px}

.tier-badge .rank-chip{padding:8px 14px;gap:8px;font-size:13px}
.tier-badge .rank-chip img{width:24px;height:28px}

.table-avatar.rank-frame,.mini-profile-avatar.rank-frame,.duel-avatar.rank-frame,.mini-match-avatar.rank-frame{background:transparent !important}
.table-avatar.rank-frame{width:46px;height:46px;border-radius:16px;padding:3px}
.table-avatar.rank-frame img,.table-avatar.rank-frame span{border-radius:13px}

.mini-profile-avatar{width:104px;height:104px;min-width:104px;border-radius:32px;padding:4px}
.mini-profile-avatar-img,.mini-profile-avatar span{border-radius:28px}
.mini-profile-rank .rank-chip{padding:8px 14px;gap:8px;font-size:13px}
.mini-profile-rank .rank-chip img{width:24px;height:28px}

.duel-avatar.rank-frame{width:64px;height:64px;border-radius:22px;padding:3px}
.duel-avatar.rank-frame img,.duel-avatar.rank-frame span{border-radius:19px}
.mini-match-avatar.rank-frame{width:44px;height:44px;border-radius:15px;padding:3px}
.mini-match-avatar.rank-frame img,.mini-match-avatar.rank-frame span{border-radius:12px}

.leaderboard-table td:nth-child(3){min-width:132px}
.leaderboard-table td:nth-child(3) .rank-chip{background:#fff;min-width:118px;justify-content:center;box-shadow:0 8px 18px rgba(15,20,35,.08)}

@media (max-width: 720px){
  .podium-avatar{width:74px;height:74px;border-radius:24px}
  .podium-avatar-img{border-radius:21px}
  .podium-tier .rank-chip{font-size:12px;padding:7px 12px}
  .my-avatar{width:74px;height:74px;border-radius:26px}
  .my-avatar img{border-radius:23px}
}


/* v24: rounded prestige frames + preserve PNG transparency */
.podium-avatar.rank-frame,
.my-avatar.rank-frame,
.table-avatar.rank-frame,
.duel-avatar.rank-frame,
.mini-profile-avatar.rank-frame,
.mini-match-avatar.rank-frame {
  overflow: visible !important;
}
.podium-avatar.rank-frame::before,
.my-avatar.rank-frame::before,
.table-avatar.rank-frame::before,
.duel-avatar.rank-frame::before,
.mini-profile-avatar.rank-frame::before,
.mini-match-avatar.rank-frame::before {
  border-radius: calc(inherit + 6px);
}
.podium-avatar.rank-frame::after,
.my-avatar.rank-frame::after,
.table-avatar.rank-frame::after,
.duel-avatar.rank-frame::after,
.mini-profile-avatar.rank-frame::after,
.mini-match-avatar.rank-frame::after {
  border-radius: calc(inherit + 2px);
}
.podium-avatar-img,
.my-avatar img,
.table-avatar-img,
.duel-avatar-img,
.mini-profile-avatar-img,
.mini-match-avatar-img {
  background: transparent !important;
}


/* ===== v25 final rank-frame fix: rounded prestige ring, PNG transparency preserved ===== */
:root{
  --rf-iron-1:#d3dae4; --rf-iron-2:#7c8695; --rf-iron-glow:rgba(124,134,149,.22);
  --rf-bronze-1:#efc39f; --rf-bronze-2:#c47745; --rf-bronze-glow:rgba(196,119,69,.24);
  --rf-silver-1:#ffffff; --rf-silver-2:#c4cfde; --rf-silver-glow:rgba(196,207,222,.26);
  --rf-gold-1:#ffe89f; --rf-gold-2:#d3a131; --rf-gold-glow:rgba(211,161,49,.26);
  --rf-plat-1:#bff2ee; --rf-plat-2:#62cbbf; --rf-plat-glow:rgba(98,203,191,.24);
  --rf-dia-1:#d8e7ff; --rf-dia-2:#7d90ff; --rf-dia-glow:rgba(125,144,255,.28);
  --rf-imm-1:#ffd0ee; --rf-imm-2:#ff63b4; --rf-imm-glow:rgba(255,99,180,.28);
}

.rank-frame,
button.rank-frame{
  position:relative;
  isolation:isolate;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.rank-frame::before,
.rank-frame::after{content:"";position:absolute;pointer-events:none;}
.rank-frame::before{
  inset:0;
  border-radius:inherit;
  background:linear-gradient(145deg,var(--ring-1),var(--ring-2));
  box-shadow:
    0 10px 24px var(--ring-glow),
    0 0 0 1px rgba(255,255,255,.48) inset,
    0 1px 0 rgba(255,255,255,.20);
  z-index:0;
}
.rank-frame::after{
  inset:2px;
  border-radius:calc(var(--inner-radius, 16px) + 2px);
  background:rgba(255,255,255,.10);
  z-index:1;
}
.rank-frame img,
.rank-frame span{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:block;
  border-radius:var(--inner-radius, 16px) !important;
}
.rank-frame img{
  object-fit:cover;
  background:transparent !important;
  box-shadow:none !important;
}
.rank-frame span{
  display:grid;
  place-items:center;
  font-weight:1000;
  color:#1f2432;
  background:linear-gradient(145deg,rgba(255,255,255,.42),rgba(255,255,255,.16));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}

.rank-frame-iron{--ring-1:var(--rf-iron-1);--ring-2:var(--rf-iron-2);--ring-glow:var(--rf-iron-glow)}
.rank-frame-bronze{--ring-1:var(--rf-bronze-1);--ring-2:var(--rf-bronze-2);--ring-glow:var(--rf-bronze-glow)}
.rank-frame-silver{--ring-1:var(--rf-silver-1);--ring-2:var(--rf-silver-2);--ring-glow:var(--rf-silver-glow)}
.rank-frame-gold{--ring-1:var(--rf-gold-1);--ring-2:var(--rf-gold-2);--ring-glow:var(--rf-gold-glow)}
.rank-frame-platinum{--ring-1:var(--rf-plat-1);--ring-2:var(--rf-plat-2);--ring-glow:var(--rf-plat-glow)}
.rank-frame-diamond{--ring-1:var(--rf-dia-1);--ring-2:var(--rf-dia-2);--ring-glow:var(--rf-dia-glow)}
.rank-frame-immortal{--ring-1:var(--rf-imm-1);--ring-2:var(--rf-imm-2);--ring-glow:var(--rf-imm-glow)}

/* Podium avatars */
.podium-avatar.rank-frame{
  width:76px !important;
  height:76px !important;
  padding:4px !important;
  border-radius:26px !important;
  --inner-radius:18px;
}
.podium-avatar.rank-frame img,
.podium-avatar.rank-frame span{
  border-radius:18px !important;
}

/* Table avatars */
.table-avatar.rank-frame{
  width:46px !important;
  height:46px !important;
  padding:3px !important;
  border-radius:16px !important;
  --inner-radius:10px;
}
.table-avatar.rank-frame img,
.table-avatar.rank-frame span{
  border-radius:10px !important;
}

/* Current user hero avatar */
.my-avatar.rank-frame{
  width:78px !important;
  height:78px !important;
  padding:4px !important;
  border-radius:26px !important;
  --inner-radius:18px;
}
.my-avatar.rank-frame img,
.my-avatar.rank-frame span{
  border-radius:18px !important;
}

/* popup profile */
.mini-profile-avatar.rank-frame{
  width:104px !important;
  height:104px !important;
  min-width:104px !important;
  padding:4px !important;
  border-radius:30px !important;
  --inner-radius:22px;
}
.mini-profile-avatar.rank-frame img,
.mini-profile-avatar.rank-frame span{
  border-radius:22px !important;
}

/* duel list */
.duel-avatar.rank-frame{
  width:64px !important;
  height:64px !important;
  padding:3px !important;
  border-radius:22px !important;
  --inner-radius:16px;
}
.duel-avatar.rank-frame img,
.duel-avatar.rank-frame span{
  border-radius:16px !important;
}

.mini-match-avatar.rank-frame{
  width:44px !important;
  height:44px !important;
  padding:3px !important;
  border-radius:15px !important;
  --inner-radius:9px;
}
.mini-match-avatar.rank-frame img,
.mini-match-avatar.rank-frame span{
  border-radius:9px !important;
}

/* remove any inherited colored fills behind uploaded PNGs */
.podium-avatar.rank-frame,
.table-avatar.rank-frame,
.my-avatar.rank-frame,
.mini-profile-avatar.rank-frame,
.duel-avatar.rank-frame,
.mini-match-avatar.rank-frame{
  color:inherit;
}
.podium-avatar.rank-frame img,
.table-avatar.rank-frame img,
.my-avatar.rank-frame img,
.mini-profile-avatar.rank-frame img,
.duel-avatar.rank-frame img,
.mini-match-avatar.rank-frame img{
  background:transparent !important;
}


/* ===== v26 premium rank styling ===== */
.rank-frame.rank-frame-iron::before{
  background:linear-gradient(145deg,#eef2f7,#a8b0bb 45%,#7d8794 100%);
  box-shadow:0 10px 24px rgba(125,135,148,.18),0 0 0 1px rgba(255,255,255,.62) inset,0 2px 8px rgba(255,255,255,.18) inset;
}
.rank-frame.rank-frame-bronze::before{
  background:linear-gradient(145deg,#f5d3b8,#db965c 45%,#a95d31 100%);
  box-shadow:0 10px 24px rgba(169,93,49,.20),0 0 0 1px rgba(255,245,236,.65) inset,0 2px 8px rgba(255,255,255,.18) inset;
}
.rank-frame.rank-frame-silver::before{
  background:linear-gradient(145deg,#ffffff,#d6deea 42%,#aeb8ca 100%);
  box-shadow:0 12px 26px rgba(174,184,202,.24),0 0 0 1px rgba(255,255,255,.72) inset,0 2px 10px rgba(255,255,255,.24) inset;
}
.rank-frame.rank-frame-gold::before{
  background:linear-gradient(145deg,#fff1bf,#f0ca57 42%,#cb9830 100%);
  box-shadow:0 12px 28px rgba(214,167,53,.24),0 0 0 1px rgba(255,248,217,.72) inset,0 2px 10px rgba(255,255,255,.22) inset;
}
.rank-frame.rank-frame-platinum::before{
  background:linear-gradient(145deg,#d8fffb,#88e7dc 42%,#42b8ad 100%);
  box-shadow:0 14px 30px rgba(66,184,173,.24),0 0 0 1px rgba(233,255,252,.7) inset,0 2px 11px rgba(255,255,255,.22) inset;
}
.rank-frame.rank-frame-diamond::before{
  background:linear-gradient(145deg,#eef4ff,#9eb7ff 40%,#6a73ff 100%);
  box-shadow:0 14px 32px rgba(106,115,255,.26),0 0 0 1px rgba(240,245,255,.76) inset,0 2px 12px rgba(255,255,255,.22) inset;
}
.rank-frame.rank-frame-immortal::before{
  background:linear-gradient(145deg,#ffe4f3,#ff89c6 40%,#d94cff 100%);
  box-shadow:0 16px 36px rgba(217,76,255,.28),0 0 0 1px rgba(255,232,244,.78) inset,0 2px 13px rgba(255,255,255,.24) inset;
}

.rank-frame.rank-frame-gold::after,
.rank-frame.rank-frame-platinum::after,
.rank-frame.rank-frame-diamond::after,
.rank-frame.rank-frame-immortal::after{
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.07));
}
.rank-frame.rank-frame-diamond::after,
.rank-frame.rank-frame-immortal::after{
  box-shadow:0 0 18px rgba(255,255,255,.12) inset;
}

.podium-avatar.rank-frame.rank-frame-gold,
.podium-avatar.rank-frame.rank-frame-platinum,
.podium-avatar.rank-frame.rank-frame-diamond,
.podium-avatar.rank-frame.rank-frame-immortal{
  transform:translateZ(0);
}
.podium-avatar.rank-frame.rank-frame-gold::before,
.podium-avatar.rank-frame.rank-frame-platinum::before,
.podium-avatar.rank-frame.rank-frame-diamond::before,
.podium-avatar.rank-frame.rank-frame-immortal::before{
  filter:saturate(1.03);
}
.podium-avatar.rank-frame.rank-frame-diamond::before,
.podium-avatar.rank-frame.rank-frame-immortal::before{
  box-shadow:0 16px 38px var(--ring-glow),0 0 0 1px rgba(255,255,255,.78) inset,0 2px 12px rgba(255,255,255,.26) inset;
}

.rank-chip{
  padding:7px 12px;
  border-radius:999px;
  box-shadow:0 8px 18px rgba(17,24,39,.06), inset 0 1px 0 rgba(255,255,255,.7);
}
.rank-chip img{filter:drop-shadow(0 2px 4px rgba(0,0,0,.12));}
.rank-chip.rank-iron{
  border-color:rgba(125,135,148,.24);
  background:linear-gradient(135deg,#fbfcfd,#eceff3 55%,#e5e9ee);
}
.rank-chip.rank-bronze{
  border-color:rgba(169,93,49,.22);
  background:linear-gradient(135deg,#fff8f2,#faecdf 55%,#f6e1d1);
}
.rank-chip.rank-silver{
  border-color:rgba(172,184,204,.24);
  background:linear-gradient(135deg,#ffffff,#f2f6fb 55%,#edf2f8);
}
.rank-chip.rank-gold{
  border-color:rgba(208,165,51,.24);
  background:linear-gradient(135deg,#fffdf4,#fff6d8 55%,#fff1c6);
}
.rank-chip.rank-platinum{
  border-color:rgba(76,192,181,.24);
  background:linear-gradient(135deg,#f5fffe,#e4fbf8 55%,#daf7f3);
}
.rank-chip.rank-diamond{
  border-color:rgba(106,115,255,.24);
  background:linear-gradient(135deg,#f8faff,#eef2ff 55%,#e6ecff);
}
.rank-chip.rank-immortal{
  border-color:rgba(217,76,255,.22);
  background:linear-gradient(135deg,#fff8fc,#ffe9f5 55%,#ffe0f0);
  color:#6e2048;
}
.leaderboard-table td:nth-child(3) .rank-chip.rank-gold,
.leaderboard-table td:nth-child(3) .rank-chip.rank-platinum,
.leaderboard-table td:nth-child(3) .rank-chip.rank-diamond,
.leaderboard-table td:nth-child(3) .rank-chip.rank-immortal{
  box-shadow:0 10px 22px rgba(17,24,39,.08), inset 0 1px 0 rgba(255,255,255,.82);
}

/* subtle prestige up the ladder */
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-iron{transform:scale(1)}
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-bronze{transform:scale(1)}
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-silver{transform:scale(1.01)}
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-gold{transform:scale(1.02)}
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-platinum{transform:scale(1.02)}
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-diamond{transform:scale(1.03)}
.leaderboard-table tr .table-avatar.rank-frame.rank-frame-immortal{transform:scale(1.04)}

/* make top podium cards feel richer but still elegant */
.podium-card .podium-tier .rank-chip{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.18);
  color:#fff;
}
.podium-card .podium-tier .rank-chip.rank-gold,
.podium-card .podium-tier .rank-chip.rank-platinum,
.podium-card .podium-tier .rank-chip.rank-diamond,
.podium-card .podium-tier .rank-chip.rank-immortal{
  background:linear-gradient(135deg,rgba(255,255,255,.24),rgba(255,255,255,.12));
  box-shadow:0 10px 20px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.22);
}


/* ==========================================================
   GIF / AVATAR CONTAINMENT FIX V27
   ========================================================== */

/* The rank frame itself may glow outside, but the media inside must never escape. */
.rank-frame{
  --avatar-inset: 3px;
}

.podium-avatar.rank-frame,
.table-avatar.rank-frame,
.my-avatar.rank-frame,
.mini-profile-avatar.rank-frame,
.duel-avatar.rank-frame,
.mini-match-avatar.rank-frame,
.fighter-avatar.rank-frame{
  position:relative !important;
  overflow:visible !important;
}

/* Force uploaded PNG/GIF media to stay inside the avatar area. */
.podium-avatar.rank-frame > img,
.table-avatar.rank-frame > img,
.my-avatar.rank-frame > img,
.mini-profile-avatar.rank-frame > img,
.duel-avatar.rank-frame > img,
.mini-match-avatar.rank-frame > img,
.fighter-avatar.rank-frame > img{
  position:absolute !important;
  inset:var(--avatar-inset) !important;
  width:calc(100% - (var(--avatar-inset) * 2)) !important;
  height:calc(100% - (var(--avatar-inset) * 2)) !important;
  max-width:none !important;
  max-height:none !important;
  display:block !important;
  object-fit:contain !important;
  object-position:center center !important;
  overflow:hidden !important;
  background:transparent !important;
  border-radius:var(--inner-radius, 16px) !important;
  clip-path:inset(0 round var(--inner-radius, 16px));
  transform:none !important;
}

/* Initials fallback should be clipped exactly the same way. */
.podium-avatar.rank-frame > span,
.table-avatar.rank-frame > span,
.my-avatar.rank-frame > span,
.mini-profile-avatar.rank-frame > span,
.duel-avatar.rank-frame > span,
.mini-match-avatar.rank-frame > span,
.fighter-avatar.rank-frame > span{
  position:absolute !important;
  inset:var(--avatar-inset) !important;
  width:calc(100% - (var(--avatar-inset) * 2)) !important;
  height:calc(100% - (var(--avatar-inset) * 2)) !important;
  border-radius:var(--inner-radius, 16px) !important;
  overflow:hidden !important;
  clip-path:inset(0 round var(--inner-radius, 16px));
}

/* Exact insets per avatar size. */
.podium-avatar.rank-frame{--avatar-inset:4px;--inner-radius:18px}
.table-avatar.rank-frame{--avatar-inset:3px;--inner-radius:10px}
.my-avatar.rank-frame{--avatar-inset:4px;--inner-radius:18px}
.mini-profile-avatar.rank-frame{--avatar-inset:4px;--inner-radius:22px}
.duel-avatar.rank-frame{--avatar-inset:3px;--inner-radius:16px}
.mini-match-avatar.rank-frame{--avatar-inset:3px;--inner-radius:9px}
.fighter-avatar.rank-frame{--avatar-inset:4px;--inner-radius:18px}

/* Non-rank-frame avatars in other arena components must also stay contained. */
.avatar-preview,
.public-profile-avatar,
.global-history-avatar,
.fighter-avatar{
  position:relative;
  overflow:hidden !important;
}

.avatar-preview img,
.public-profile-avatar img,
.public-profile-avatar-img,
.global-history-avatar img,
.fighter-avatar-img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  display:block !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:transparent !important;
}

/* Prevent animated media from changing row/card height. */
.table-avatar,
.podium-avatar,
.duel-avatar,
.fighter-avatar,
.mini-profile-avatar,
.my-avatar,
.global-history-avatar{
  flex:0 0 auto;
  contain:layout paint;
}

/* The visual rank ring is allowed to render outside even though media is clipped. */
.rank-frame::before,
.rank-frame::after{
  pointer-events:none;
}


/* ===== v27 avatar crop/center fix ===== */
/* Every uploaded PNG/JPG/GIF fills the avatar box, is cropped, and stays centered. */
.podium-avatar-img,
.table-avatar-img,
.duel-avatar-img,
.mini-profile-avatar-img,
.mini-match-avatar-img,
.fighter-avatar-img,
.public-profile-avatar-img,
.avatar-preview img,
.my-avatar img,
.global-history-avatar img,
.rank-frame img {
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:50% 50% !important;
  background:transparent !important;
}

/* Keep the media neatly clipped to the same rounded shape as the avatar itself. */
.podium-avatar.rank-frame img { border-radius:18px !important; }
.table-avatar.rank-frame img { border-radius:10px !important; }
.my-avatar.rank-frame img { border-radius:18px !important; }
.mini-profile-avatar.rank-frame img { border-radius:22px !important; }
.duel-avatar.rank-frame img { border-radius:16px !important; }
.mini-match-avatar.rank-frame img { border-radius:9px !important; }
.fighter-avatar.rank-frame img { border-radius:18px !important; }

/* Non-ranked avatar containers also crop correctly. */
.avatar-preview,
.public-profile-avatar,
.global-history-avatar,
.fighter-avatar {
  overflow:hidden !important;
}

/* Prevent tall GIFs from ever stretching the row/card. */
.podium-avatar,
.table-avatar,
.duel-avatar,
.mini-profile-avatar,
.mini-match-avatar,
.fighter-avatar,
.my-avatar,
.global-history-avatar,
.avatar-preview,
.public-profile-avatar {
  flex-shrink:0 !important;
}


/* ==========================================================
   AVATAR TRUE COVER FIX V28
   ========================================================== */
/*
   V27 still had an earlier, more specific rule with
   object-fit: contain !important. These selectors deliberately
   match that specificity and are loaded last, so uploaded PNG/GIF
   truly fill the avatar box, crop excess and stay centered.
*/
.podium-avatar.rank-frame > img,
.table-avatar.rank-frame > img,
.my-avatar.rank-frame > img,
.mini-profile-avatar.rank-frame > img,
.duel-avatar.rank-frame > img,
.mini-match-avatar.rank-frame > img,
.fighter-avatar.rank-frame > img {
  position:absolute !important;
  inset:var(--avatar-inset) !important;
  width:calc(100% - (var(--avatar-inset) * 2)) !important;
  height:calc(100% - (var(--avatar-inset) * 2)) !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  max-height:none !important;
  display:block !important;
  object-fit:cover !important;
  object-position:50% 50% !important;
  overflow:hidden !important;
  background:transparent !important;
  transform:none !important;
}

/* exact clipping shape */
.podium-avatar.rank-frame > img { border-radius:18px !important; clip-path:inset(0 round 18px) !important; }
.table-avatar.rank-frame > img { border-radius:10px !important; clip-path:inset(0 round 10px) !important; }
.my-avatar.rank-frame > img { border-radius:18px !important; clip-path:inset(0 round 18px) !important; }
.mini-profile-avatar.rank-frame > img { border-radius:22px !important; clip-path:inset(0 round 22px) !important; }
.duel-avatar.rank-frame > img { border-radius:16px !important; clip-path:inset(0 round 16px) !important; }
.mini-match-avatar.rank-frame > img { border-radius:9px !important; clip-path:inset(0 round 9px) !important; }
.fighter-avatar.rank-frame > img { border-radius:18px !important; clip-path:inset(0 round 18px) !important; }

/* avatars without rank frames */
.avatar-preview > img,
.public-profile-avatar > img,
.global-history-avatar > img,
.fighter-avatar:not(.rank-frame) > img {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:50% 50% !important;
  display:block !important;
}

.avatar-preview,
.public-profile-avatar,
.global-history-avatar,
.fighter-avatar:not(.rank-frame) {
  position:relative !important;
  overflow:hidden !important;
}


/* ==========================================================
   SMART AVATAR CROP V29
   Real crop wrapper + automatic center zoom by aspect ratio
   ========================================================== */
.avatar-crop{
  position:relative !important;
  z-index:2 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
  border-radius:inherit !important;
  background:transparent !important;
  box-shadow:none !important;
}

.avatar-crop > img{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:50% 50% !important;
  transform:translate(-50%,-50%) scale(var(--avatar-zoom,1.08)) !important;
  transform-origin:50% 50% !important;
  border-radius:0 !important;
  clip-path:none !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Existing rank-frame rules style every direct span as initials.
   avatar-crop is media, not initials, so neutralize those styles. */
.rank-frame > .avatar-crop,
.podium-avatar.rank-frame > .avatar-crop,
.table-avatar.rank-frame > .avatar-crop,
.my-avatar.rank-frame > .avatar-crop,
.mini-profile-avatar.rank-frame > .avatar-crop,
.duel-avatar.rank-frame > .avatar-crop,
.mini-match-avatar.rank-frame > .avatar-crop,
.fighter-avatar.rank-frame > .avatar-crop{
  display:block !important;
  place-items:initial !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

/* Inner crop radius follows the premium frame instead of making a square. */
.podium-avatar.rank-frame > .avatar-crop{border-radius:18px !important;}
.table-avatar.rank-frame > .avatar-crop{border-radius:10px !important;}
.my-avatar.rank-frame > .avatar-crop{border-radius:18px !important;}
.mini-profile-avatar.rank-frame > .avatar-crop{border-radius:22px !important;}
.duel-avatar.rank-frame > .avatar-crop{border-radius:16px !important;}
.mini-match-avatar.rank-frame > .avatar-crop{border-radius:9px !important;}
.fighter-avatar.rank-frame > .avatar-crop{border-radius:18px !important;}

/* Other places using avatarHtml also crop properly. */
.global-history-avatar > .avatar-crop,
.admin-player-avatar > .avatar-crop,
.profile-avatar > .avatar-crop,
.avatar-preview > .avatar-crop{
  border-radius:inherit !important;
}


/* ==========================================================
   ADMIN 1V1 AVAILABILITY / ROLEPLAY LOCK V30
   ========================================================== */
.duels-disabled-notice{
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:14px;
  align-items:center;
  margin-bottom:16px;
  padding:15px 17px;
  border-radius:18px;
  border:1px solid rgba(255,132,161,.27);
  background:
    radial-gradient(circle at 0 50%,rgba(255,83,126,.16),transparent 35%),
    linear-gradient(135deg,rgba(92,20,43,.95),rgba(45,18,31,.96));
  box-shadow:0 16px 34px rgba(15,7,11,.19),inset 0 1px 0 rgba(255,255,255,.07);
  color:#fff;
}
.duels-disabled-notice.hidden{display:none!important}
.duels-disabled-icon{
  width:52px;height:52px;display:grid;place-items:center;
  border-radius:15px;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.12);font-size:23px;
}
.duels-disabled-notice span,
.duels-disabled-notice strong,
.duels-disabled-notice small{display:block}
.duels-disabled-notice span{font-size:8px;font-weight:1000;letter-spacing:.13em;color:#ff8bab}
.duels-disabled-notice strong{margin-top:4px;font-size:14px;line-height:1.35}
.duels-disabled-notice small{margin-top:4px;color:rgba(255,255,255,.68);font-size:9px}

.create-duel-card.duels-locked{
  opacity:.74;
  filter:saturate(.72);
}
.duels-disabled-button,
.duel-join-disabled{
  cursor:not-allowed!important;
  transform:none!important;
  box-shadow:none!important;
  opacity:.72!important;
}
.duel-join-disabled{
  color:#7e6b73!important;
  background:#eee9eb!important;
  border:1px solid #e0d7db!important;
}

.admin-duel-control{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  margin:16px 0;
  padding:16px;
  border-radius:18px;
  background:
    radial-gradient(circle at 100% 0,rgba(190,40,78,.07),transparent 35%),
    linear-gradient(180deg,#fff,#fafbfc);
  border:1px solid #e4e7ed;
  box-shadow:0 10px 26px rgba(16,22,36,.055);
}
.admin-duel-control-copy{min-width:0}
.admin-duel-title-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:4px}
.admin-duel-title-line h3{margin:0;color:#242936;font-size:18px;letter-spacing:-.025em}
.admin-duel-control-copy p{max-width:620px;margin:7px 0 0;color:#7b8394;font-size:10px;line-height:1.55}
.admin-duel-status{
  display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;
  font-size:8px;font-weight:1000;letter-spacing:.05em;border:1px solid transparent;
}
.admin-duel-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(0,0,0,.03)}
.admin-duel-status.is-enabled{color:#168252;background:#e9f9ef;border-color:#caecd7}
.admin-duel-status.is-disabled{color:#b32749;background:#fff0f4;border-color:#f1ced8}
.admin-duel-status.is-loading{color:#7b8394;background:#f3f4f7;border-color:#e5e8ed}
.admin-duel-status.is-error{color:#b32749;background:#fff0f4;border-color:#f1ced8}
.admin-duel-control-actions{display:flex;gap:8px;align-items:center}
.admin-duel-enable,.admin-duel-disable{white-space:nowrap;padding:11px 13px;border-radius:11px;font-size:9px;font-weight:950}
.admin-duel-enable{color:#18784f;background:#e9f8ef;border:1px solid #ccebd8}
.admin-duel-enable:not(:disabled):hover{color:#fff;background:#198357}
.admin-duel-disable{color:#ab2746;background:#fff0f3;border:1px solid #f0ccd5}
.admin-duel-disable:not(:disabled):hover{color:#fff;background:#ae2849}
.admin-duel-enable.is-active,.admin-duel-disable.is-active{opacity:.55}
.admin-duel-control-actions .btn:disabled{cursor:default;transform:none}
.admin-duel-message{grid-column:1/-1;padding:9px 11px;border-radius:11px;font-size:9px;font-weight:850}
.admin-duel-message.is-success{color:#177a50;background:#eaf8ef;border:1px solid #cee9d8}
.admin-duel-message.is-error{color:#a82c47;background:#fff0f3;border:1px solid #efd0d7}

@media(max-width:760px){
  .admin-duel-control{grid-template-columns:1fr}
  .admin-duel-control-actions{display:grid;grid-template-columns:1fr 1fr}
  .admin-duel-control-actions .btn{width:100%}
  .duels-disabled-notice{grid-template-columns:44px minmax(0,1fr)}
  .duels-disabled-icon{width:44px;height:44px;border-radius:13px}
}
@media(max-width:520px){
  .admin-duel-control-actions{grid-template-columns:1fr}
}


/* ==========================================================
   ARENA LOGO FIX V32
   Self-contained logo paths + clean header/loading logo
   ========================================================== */

.brand-logo{
  width:48px !important;
  height:48px !important;
  object-fit:contain !important;
  object-position:center !important;
  background:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  flex:0 0 auto;
}

.entrance-logo{
  width:min(230px,52vw) !important;
  height:auto !important;
  max-height:170px !important;
  object-fit:contain !important;
  object-position:center !important;
  display:block !important;
  background:transparent !important;
  filter:drop-shadow(0 18px 35px rgba(0,0,0,.28));
}
