/* NeetSeat.in — rank-predictor.html-only styles: score slider, tier badges,
   multi-year result cards, and standalone-page header tweaks. */

/* ══════════════════════════════════════════════════════
   RANK PREDICTOR SECTION
══════════════════════════════════════════════════════ */
.rp-score-display {
  font-family:'DM Mono',monospace; font-size:46px; font-weight:700;
  color:var(--teal); text-align:center; line-height:1; margin:12px 0 2px;
  letter-spacing:-1px;
}
.rp-score-max { font-size:13px; color:var(--t3); font-weight:600; text-align:center; margin-bottom:6px; }
.rp-slider-wrap { margin-top:8px; }
.rp-slider {
  -webkit-appearance:none; appearance:none;
  width:100%; height:6px; border-radius:6px; outline:none; cursor:pointer;
  background:var(--surf3);
  transition:background .1s;
}
.rp-slider::-webkit-slider-thumb {
  -webkit-appearance:none; appearance:none;
  width:24px; height:24px; border-radius:50%;
  background:var(--white); border:3px solid var(--teal);
  box-shadow:0 2px 8px rgba(0,151,167,.30); cursor:pointer;
}
.rp-slider::-moz-range-thumb {
  width:24px; height:24px; border-radius:50%;
  background:var(--white); border:3px solid var(--teal);
  box-shadow:0 2px 8px rgba(0,151,167,.30); cursor:pointer;
}
.rp-range-labels { display:flex; justify-content:space-between; font-size:11px; color:var(--t4); font-weight:600; margin-top:5px; }
.rp-tier-badge {
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 16px; border-radius:30px;
  font-size:12px; font-weight:800; letter-spacing:.4px; margin-top:10px;
}
.rp-tier-elite    { background:#E0F7FA; color:#00796B; border:1.5px solid #80CBC4; }
.rp-tier-top      { background:#E8F5E9; color:#2E7D32; border:1.5px solid #A5D6A7; }
.rp-tier-good     { background:#F0FDF4; color:#15803D; border:1.5px solid #86EFAC; }
.rp-tier-moderate { background:#FFF7ED; color:#C2410C; border:1.5px solid #FDBA74; }
.rp-tier-low      { background:#FEF3C7; color:#B45309; border:1.5px solid #FCD34D; }
.rp-tier-base     { background:#F1F5F9; color:#64748B; border:1.5px solid #CBD5E1; }
.rp-results-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:20px;
}
@media(max-width:530px){ .rp-results-grid { grid-template-columns:1fr; gap:10px; } }
.rp-year-card {
  background:var(--white); border:1.5px solid var(--bd);
  border-radius:var(--r); padding:16px 14px; box-shadow:var(--sh-sm);
  text-align:center; position:relative; overflow:hidden;
  transition:border-color .18s, box-shadow .18s;
}
.rp-year-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; }
.rp-year-card.yr-2026::before { background:linear-gradient(90deg,#C4B5FD,#7C3AED); }
.rp-year-card.yr-2024::before { background:linear-gradient(90deg,#6EE7B7,#059669); }
.rp-year-card.yr-2025::before { background:linear-gradient(90deg,#FCD34D,#D97706); }
.rp-year-label { font-size:10.5px; font-weight:800; color:var(--t3); text-transform:uppercase; letter-spacing:.7px; margin-bottom:6px; }
.rp-year-rank { font-family:'DM Mono',monospace; font-size:24px; font-weight:700; color:var(--t1); line-height:1.1; margin-bottom:4px; }
.rp-year-pill { display:inline-block; margin-top:6px; font-size:10px; font-weight:700; padding:3px 9px; border-radius:10px; }
.rp-yr26-pill { background:#EDE9FE; color:#5B21B6; }
.rp-yr24-pill { background:#DCFCE7; color:#15803D; }
.rp-yr25-pill { background:#FEF3C7; color:#B45309; }
.rp-year-sub { font-size:11px; color:var(--t3); font-weight:500; }
.rp-avg-card {
  background:var(--navy); border-radius:var(--r);
  padding:18px 22px; margin-top:16px;
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  box-shadow:var(--sh-md);
}
.rp-avg-body { flex:1; min-width:140px; }
.rp-avg-label { font-size:11px; font-weight:700; color:rgba(255,255,255,.5); text-transform:uppercase; letter-spacing:.6px; margin-bottom:4px; }
.rp-avg-rank { font-family:'DM Mono',monospace; font-size:30px; font-weight:700; color:var(--teal2); line-height:1; }
.rp-avg-sub { font-size:12px; color:rgba(255,255,255,.55); margin-top:4px; }
.rp-avg-share {
  background:rgba(37,211,102,.14); border:1.5px solid rgba(37,211,102,.35);
  border-radius:22px; padding:10px 20px; color:#4EDF85;
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:700;
  cursor:pointer; transition:all .18s; white-space:nowrap; display:flex; align-items:center; gap:6px;
}
.rp-avg-share:hover { background:rgba(37,211,102,.26); }
.rp-note {
  background:var(--amber-bg); border:1.5px solid var(--amber-bd);
  border-radius:var(--r-sm); padding:12px 16px; margin-top:14px;
  font-size:12px; color:#78350F; line-height:1.7; font-weight:500;
}
.rp-note strong { font-weight:800; color:var(--amber); }
.rp-topper-note {
  background:var(--teal-bg); border:1.5px solid var(--teal-bd);
  border-radius:var(--r-sm); padding:11px 16px; margin-top:12px;
  font-size:12.5px; color:var(--teal); line-height:1.65; font-weight:500;
}
.rp-topper-note strong { color:var(--navy); font-weight:800; }
.rp-trend-row {
  display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px;
}
@media(max-width:530px){ .rp-trend-row { grid-template-columns:1fr; } }
.rp-trend-item {
  background:var(--surf2); border:1px solid var(--bd);
  border-radius:var(--r-sm); padding:12px 14px;
  font-size:12px; line-height:1.6;
}
.rp-trend-yr { font-size:10px; font-weight:800; color:var(--t3); text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.rp-trend-fact { font-weight:600; color:var(--t1); }
.rp-trend-sub { color:var(--t3); font-weight:500; font-size:11px; }

/* ── Hero CTA buttons (Rank / Seat / Explorer) ── */
.hero-cta-row {
  display:flex; gap:12px; justify-content:center; flex-wrap:wrap;
  margin:24px auto 0; max-width:720px;
}
.hero-cta-btn {
  display:flex; align-items:center; gap:12px;
  background:rgba(255,255,255,.10); border:1.5px solid rgba(255,255,255,.22);
  border-radius:16px; padding:14px 18px; cursor:pointer;
  transition:all .2s; text-align:left;
  flex:1 1 200px; min-width:200px; max-width:100%;
  font-family:'DM Sans',sans-serif;
}
.hero-cta-btn:hover { background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.40); transform:translateY(-2px); }
.hero-cta-primary { border-color:rgba(0,188,212,.50); background:rgba(0,188,212,.12); }
.hero-cta-primary:hover { background:rgba(0,188,212,.22); border-color:rgba(0,188,212,.70); }
.hero-cta-icon { font-size:22px; flex-shrink:0; }
.hero-cta-text { flex:1; }
.hero-cta-label { font-size:15px; font-weight:800; color:#FFF; line-height:1.2; }
.hero-cta-sub { font-size:11px; color:rgba(255,255,255,.60); font-weight:500; margin-top:2px; }
.hero-cta-arr { font-size:16px; color:rgba(255,255,255,.50); flex-shrink:0; }
.hero-cta-primary .hero-cta-arr { color:var(--teal2); }
@media(max-width:640px){
  .hero-cta-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; max-width:420px; }
  .hero-cta-btn {
    flex:0 0 auto; min-width:0; width:auto;
    flex-direction:column; align-items:flex-start; gap:8px;
    padding:14px 14px;
  }
  .hero-cta-arr { display:none; }
  .hero-cta-label { font-size:13.5px; }
  .hero-cta-sub { font-size:10.5px; }
  .hero-cta-explorer { grid-column:1 / -1; flex-direction:row; align-items:center; justify-content:center; }
  .hero-cta-explorer .hero-cta-text { flex:0 1 auto; }
}


/* Rank Predictor standalone page: keep state switcher + dark mode visible on mobile too */
@media(max-width:1180px){
  .state-switcher{ display:flex; overflow-x:auto; max-width:38vw; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .state-switcher::-webkit-scrollbar{ display:none; }
  .hdr-actions{ display:flex; }
  .mob-actions{ display:none; }
}
@media(max-width:600px){
  .state-switcher{ gap:4px; max-width:50vw; }
  .state-pill{ padding:5px 10px; font-size:11px; }
  .logo-tag{ display:none; }
}