/* ======================
   finals.css
   Finals showdown section
   ====================== */

.finals-section{
  position:relative;margin-bottom:40px;overflow:visible;
}
.finals-stage{
  position:relative;
  background:var(--finals-stage-bg);
  border-radius:20px;padding:40px 20px 36px;
  border:2px solid var(--finals-border-color);
  box-shadow:var(--finals-stage-shadow);
  overflow:hidden;
}

/* Header */
.finals-header{text-align:center;position:relative;z-index:2;margin-bottom:28px}
.finals-title{
  font-family:'Inter','Noto Sans JP',sans-serif;
  font-size:2.8rem;font-weight:900;letter-spacing:8px;
  background:var(--finals-title-gradient);
  background-size:400% 400%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:finalsGold 8s ease infinite;
  filter:var(--finals-title-filter);
  line-height:1.2;
}
@keyframes finalsGold{
  0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}
}
.finals-subtitle{
  font-size:0.8rem;color:var(--finals-subtitle-color);font-weight:600;margin-top:8px;
}
.finals-subtitle span{color:var(--finals-subtitle-span);font-weight:800}

/* Player cards grid */
.finals-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
  position:relative;z-index:2;margin-bottom:20px;
}

/* VS badge */
.finals-vs{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;
  width:56px;height:56px;border-radius:50%;
  background:var(--finals-vs-bg);
  border:2px solid var(--finals-vs-border);
  display:flex;align-items:center;justify-content:center;
  font-family:'Inter',sans-serif;font-weight:900;font-size:0.85rem;
  color:var(--finals-vs-color);letter-spacing:2px;
  box-shadow:var(--finals-vs-shadow);
}

/* Player card */
.finalist-card{
  position:relative;
  background:var(--finalist-card-bg);
  border:1px solid var(--finalist-card-border);border-radius:14px;
  padding:20px 16px;text-align:center;
  backdrop-filter:blur(12px);
  transition:all 0.4s cubic-bezier(0.4,0,0.2,1);
  overflow:hidden;
  opacity:0;transform:scale(0.8) translateY(30px);
}
.finalist-card.revealed{opacity:1;transform:scale(1) translateY(0)}
.finalist-card:hover{
  border-color:var(--finalist-card-hover-border);
  box-shadow:var(--finalist-card-hover-shadow);
  transform:scale(1.03) translateY(-4px);
}

.finalist-seed{
  display:inline-block;font-size:0.6rem;font-weight:700;letter-spacing:3px;
  color:var(--finalist-seed-color);margin-bottom:8px;opacity:0.6;
}

.finalist-name{
  font-size:1.15rem;font-weight:900;color:var(--finalist-name-color);margin-bottom:4px;
  text-shadow:var(--finalist-name-shadow);
}
.finalist-score{font-family:'Inter',sans-serif;font-weight:800;font-size:0.9rem;margin-bottom:6px}
.finalist-score.plus{color:var(--plus-text)}
.finalist-score.minus{color:var(--minus-text)}
.finalist-trend{
  font-size:0.65rem;color:var(--finalist-trend-color);font-family:'Inter',sans-serif;
  letter-spacing:1px;
}

/* Responsive */
@media(max-width:480px){
  .finals-title{font-size:2rem;letter-spacing:4px}
  .finals-grid{gap:10px}
  .finalist-card{padding:14px 10px}
  .finalist-name{font-size:1rem}
  .finals-vs{width:44px;height:44px;font-size:0.7rem}
}

@media(max-width:768px){
  .finalist-card{backdrop-filter:none}
}
