@keyframes tourn-pulse{
0%{box-shadow:0 0 0 0 rgba(34,211,238,.5);}
70%{box-shadow:0 0 0 10px rgba(34,211,238,0);}
100%{box-shadow:0 0 0 0 rgba(34,211,238,0);}
}

@keyframes tourn-fadein{
from{opacity:0;transform:translateY(8px);}
to{opacity:1;transform:translateY(0);}
}

@keyframes tourn-shimmer{
0%{background-position:-200px 0;}
100%{background-position:200px 0;}
}

.tourn-toolbar{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:20px;
gap:12px;
flex-wrap:wrap;
}

.tourn-tabs{
display:flex;
gap:8px;
}

.tourn-tab{
background:#151124;
border:1px solid rgba(56,189,248,.15);
color:#94a3b8;
padding:8px 16px;
border-radius:999px;
cursor:pointer;
font-weight:700;
font-size:13px;
transition:.2s;
}

.tourn-tab.active{
background:linear-gradient(135deg,#0ea5e9,#38bdf8);
color:#06202e;
border-color:transparent;
}

.tourn-create-btn{
background:linear-gradient(135deg,#d4af37,#f4d878);
color:#1a1400;
font-weight:800;
border:none;
padding:10px 20px;
border-radius:14px;
cursor:pointer;
box-shadow:0 0 18px rgba(212,175,55,.35);
transition:.15s;
}

.tourn-create-btn:hover{
transform:translateY(-1px);
box-shadow:0 0 26px rgba(212,175,55,.55);
}

.tourn-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:18px;
}

.tourn-card{
background:#151124;
border:1px solid rgba(56,189,248,.15);
border-radius:20px;
padding:20px;
position:relative;
overflow:hidden;
cursor:pointer;
transition:.2s;
animation:tourn-fadein .35s ease both;
}

.tourn-card:hover{
border-color:rgba(56,189,248,.5);
transform:translateY(-2px);
}

.tourn-card-name{
font-size:18px;
font-weight:800;
margin-bottom:6px;
color:#fff;
}

.tourn-card-meta{
color:#94a3b8;
font-size:12px;
margin-bottom:14px;
}

.tourn-badge{
display:inline-flex;
align-items:center;
gap:6px;
font-size:11px;
font-weight:800;
padding:4px 10px;
border-radius:999px;
text-transform:uppercase;
letter-spacing:.05em;
}

.tourn-badge-live{
background:rgba(34,211,238,.12);
color:#22d3ee;
}

.tourn-badge-live .tourn-dot{
width:7px;
height:7px;
border-radius:50%;
background:#22d3ee;
animation:tourn-pulse 1.6s infinite;
}

.tourn-badge-reg{
background:rgba(212,175,55,.12);
color:#d4af37;
}

.tourn-badge-finished{
background:rgba(148,163,184,.12);
color:#94a3b8;
}

.tourn-badge-private{
background:rgba(244,63,94,.12);
color:#fb7185;
}

.tourn-card-players{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:14px;
font-size:13px;
color:#cbd5e1;
}

.tourn-progress-track{
height:6px;
border-radius:6px;
background:#0b0a14;
margin-top:10px;
overflow:hidden;
}

.tourn-progress-fill{
height:100%;
background:linear-gradient(90deg,#0ea5e9,#22d3ee);
border-radius:6px;
transition:width .4s ease;
}

.tourn-card-winner{
margin-top:14px;
font-size:13px;
color:#d4af37;
font-weight:700;
}

/* DETAIL VIEW */

.tourn-detail-header{
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
gap:16px;
background:#151124;
border:1px solid rgba(56,189,248,.15);
border-radius:20px;
padding:24px;
margin-bottom:20px;
}

.tourn-back-btn{
background:none;
border:1px solid rgba(148,163,184,.3);
color:#cbd5e1;
border-radius:12px;
padding:8px 14px;
cursor:pointer;
margin-bottom:14px;
}

.tourn-bracket{
display:flex;
gap:28px;
overflow-x:auto;
padding-bottom:20px;
}

.tourn-round{
display:flex;
flex-direction:column;
justify-content:space-around;
gap:18px;
min-width:230px;
}

.tourn-round-title{
text-align:center;
color:#94a3b8;
font-size:12px;
font-weight:800;
text-transform:uppercase;
letter-spacing:.08em;
margin-bottom:6px;
}

.tourn-match{
background:#0e0c1a;
border:1px solid rgba(56,189,248,.15);
border-radius:14px;
padding:10px;
display:flex;
flex-direction:column;
gap:6px;
animation:tourn-fadein .3s ease both;
}

.tourn-match.is-live{
border-color:rgba(34,211,238,.6);
box-shadow:0 0 16px rgba(34,211,238,.15);
}

.tourn-match-slot{
display:flex;
justify-content:space-between;
align-items:center;
padding:8px 10px;
border-radius:10px;
background:rgba(148,163,184,.06);
font-size:13px;
font-weight:600;
color:#cbd5e1;
}

.tourn-match-slot.is-winner{
background:rgba(212,175,55,.14);
color:#d4af37;
font-weight:800;
}

.tourn-match-slot.is-empty{
color:#475569;
font-style:italic;
}

.tourn-match-status{
text-align:center;
font-size:10px;
text-transform:uppercase;
letter-spacing:.05em;
color:#64748b;
}

.tourn-participants{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:14px;
}

.tourn-participant-chip{
background:rgba(56,189,248,.08);
border:1px solid rgba(56,189,248,.2);
color:#e2e8f0;
font-size:12px;
padding:6px 12px;
border-radius:999px;
}

.tourn-participant-chip.is-eliminated{
opacity:.4;
text-decoration:line-through;
}

.tourn-participant-chip.is-winner{
background:rgba(212,175,55,.15);
border-color:rgba(212,175,55,.4);
color:#d4af37;
}

/* MODAL */

.tourn-modal-overlay{
position:fixed;
inset:0;
background:rgba(5,5,10,.85);
display:flex;
align-items:center;
justify-content:center;
z-index:10001;
}

.tourn-modal{
background:#151124;
border:1px solid rgba(56,189,248,.25);
border-radius:20px;
padding:28px;
width:90%;
max-width:420px;
}

.tourn-modal h3{
margin-bottom:18px;
color:#fff;
}

.tourn-field{
margin-bottom:14px;
}

.tourn-field label{
display:block;
font-size:12px;
color:#94a3b8;
margin-bottom:6px;
}

.tourn-field input,
.tourn-field select{
width:100%;
padding:10px 12px;
border-radius:10px;
border:1px solid rgba(148,163,184,.25);
background:#0e0c1a;
color:#fff;
font-size:14px;
}

.tourn-modal-actions{
display:flex;
gap:10px;
margin-top:18px;
}

.tourn-modal-actions button{
flex:1;
padding:10px;
border-radius:12px;
border:none;
cursor:pointer;
font-weight:700;
}

.tourn-btn-confirm{
background:linear-gradient(135deg,#0ea5e9,#38bdf8);
color:#06202e;
}

.tourn-btn-cancel{
background:rgba(148,163,184,.15);
color:#cbd5e1;
}

.tourn-empty-state{
text-align:center;
color:#64748b;
padding:60px 20px;
}

.tourn-skeleton{
background:linear-gradient(90deg,#151124 25%,#1d1830 37%,#151124 63%);
background-size:400px 100%;
animation:tourn-shimmer 1.4s infinite linear;
border-radius:20px;
height:140px;
}
