/* MCATiers v3.0 - Overall Rankings */
i {
 font-size: 20px;
}
.scroll-reveal{opacity:0;transform:translateY(18px);transition:opacity .55s,transform .55s;}
.scroll-reveal.visible{opacity:1;transform:translateY(0);}

.page-header {
 display:flex; align-items:center; justify-content:space-between;
 gap:1rem; padding:2rem 0 1.25rem; flex-wrap:wrap;
}
.page-title { font-size:1.75rem; font-weight:900; }
.page-subtitle { color:var(--text3); font-size:.875rem; margin-top:.2rem; }

.search-box {
 display:flex; align-items:center; gap:.5rem;
 background:var(--glass-bg); backdrop-filter:blur(12px);
 border:1px solid var(--border); border-radius:9999px;
 padding:.4rem 1rem; transition:border-color .2s;
}
.search-box:focus-within { border-color:var(--accent); }
.search-input {
 background:none; border:none; outline:none;
 color:var(--text); font-size:.875rem; width:180px;
 font-family:inherit;
}

/* ── Info bar ── */
#info-bar { margin-bottom:1.5rem; }

.ov-toggle-row {
 display:flex; align-items:center; margin-bottom:1rem;
}
.ov-toggle {
 display:flex;
 background:var(--bg2); border:1px solid var(--border);
 border-radius:10px; padding:.2rem; gap:.2rem;
}
.ov-toggle-btn {
 padding:.45rem 1.25rem; border-radius:8px;
 border:none; background:none; color:var(--text2);
 font-size:.875rem; font-weight:600; font-family:inherit;
 cursor:pointer; transition:all .18s;
}
.ov-toggle-btn.active {
 background:var(--bg3); color:var(--text);
 box-shadow:0 1px 6px rgba(0,0,0,.3);
}

.ov-info-panel {
 background:var(--glass-bg); backdrop-filter:blur(16px);
 border:1px solid var(--glass-border);
 border-radius:14px; padding:1.25rem;
 animation:panelIn .25s ease;
}
@keyframes panelIn { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }

.ov-info-header {
 font-size:.95rem; font-weight:700; color:var(--text2);
 margin-bottom:1rem;
}
.ov-link { text-decoration:underline; color:var(--accent); }

/* Titles list */
.ov-titles-list { display:flex; flex-direction:column; gap:.625rem; }
.ov-title-row { display:flex; align-items:center; gap:.75rem; }
.ov-title-icon { width:24px; height:24px; object-fit:contain; flex-shrink:0; }
.ov-title-icon-placeholder { width:24px; height:24px; flex-shrink:0; display:block; }
.ov-title-name { font-size:.875rem; font-weight:700; }
.ov-title-req { font-size:.75rem; color:var(--text3); }

/* Points list */
.ov-points-list { display:flex; flex-direction:column; gap:.5rem; }
.ov-points-row { display:flex; align-items:center; gap:.75rem; }
.ov-points-tier-label { font-size:.875rem; font-weight:600; min-width:55px; }
.ov-points-badges { display:flex; gap:.375rem; }
.ov-pts-badge {
 padding:.18rem .65rem; border-radius:6px;
 font-size:.75rem; font-weight:700;
 font-family:'JetBrains Mono',monospace;
}
.ov-pts-badge.ht {
 background:rgba(212,160,32,.15); color:#d4a020;
 border:1px solid rgba(212,160,32,.3);
}
.ov-pts-badge.lt {
 background:rgba(79,158,255,.1); color:var(--text2);
 border:1px solid var(--border);
}

/* ── Rankings list ── */
.rankings-list {
 display:flex; flex-direction:column; gap:.625rem;
 padding-bottom:4rem;
}

/* Stagger animation on cards */
.player-card-v3 {
 animation:cardIn .4s cubic-bezier(.4,0,.2,1) both;
}
.player-card-v3:nth-child(1){animation-delay:.04s}
.player-card-v3:nth-child(2){animation-delay:.08s}
.player-card-v3:nth-child(3){animation-delay:.12s}
.player-card-v3:nth-child(4){animation-delay:.16s}
.player-card-v3:nth-child(5){animation-delay:.20s}
@keyframes cardIn { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }

.footer-link{font-size:.85rem;color:var(--text3);text-decoration:none;transition:color .2s;}
.footer-link:hover{color:var(--accent);}

@media(max-width:600px){
 .page-header{flex-direction:column;align-items:flex-start;}
 .search-input{width:140px;}
}

/* ── Reveal button ── */
.ov-reveal-row {
 margin-bottom: 0.75rem;
}
.ov-reveal-btn {
 display: inline-flex;
 align-items: center;
 gap: 0.5rem;
 padding: 0.5rem 1.25rem;
 background: var(--glass-bg, rgba(17,24,39,0.6));
 backdrop-filter: blur(12px);
 border: 1px solid var(--glass-border, rgba(79,158,255,0.15));
 border-radius: 9999px;
 color: var(--text2);
 font-size: 0.8rem;
 font-weight: 600;
 font-family: inherit;
 cursor: pointer;
 transition: all .2s;
}
.ov-reveal-btn:hover {
 border-color: var(--accent);
 color: var(--accent);
 background: var(--accent-glow2, rgba(79,158,255,0.08));
}
