/* Records page styles — Supersports 10 Mile */
.head{font-family:'Prompt',sans-serif}

.page-hero{
  position:relative;
  background:url('../assets/images/SSP26_KV_800x533.jpg') center center / cover no-repeat;
  overflow:hidden;
}
.page-hero::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(10,14,39,0.55) 0%, rgba(10,14,39,0.85) 70%, rgba(10,14,39,1) 100%);
}
.page-hero::after{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(circle at 20% 30%, rgba(57,255,20,0.18), transparent 50%),
                   radial-gradient(circle at 80% 70%, rgba(255,0,255,0.12), transparent 50%);
  pointer-events:none;
}
.page-hero > *{position:relative;z-index:1}

.topnav{background:rgba(10,14,39,0.95);backdrop-filter:blur(12px);border-bottom:1px solid rgba(57,255,20,0.15)}

.filter-bar{background:rgba(20,26,61,0.9);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,0.06)}
.filter-bar select{
  background:rgba(10,14,39,0.8);
  color:#e5e7eb;
  border:1px solid rgba(57,255,20,0.25);
  outline:none;
}
.filter-bar select:focus{border-color:#39FF14;box-shadow:0 0 0 3px rgba(57,255,20,0.15)}

.card{
  background:linear-gradient(180deg, rgba(20,26,61,0.6) 0%, rgba(20,26,61,0.4) 100%);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:16px;
  backdrop-filter:blur(6px);
}
.card-glow{
  border:1.5px solid rgba(57,255,20,0.4);
  box-shadow:0 0 30px rgba(57,255,20,0.12), inset 0 0 20px rgba(57,255,20,0.04);
}
.card-thai{border:1px solid rgba(255,0,255,0.3);box-shadow:0 0 20px rgba(255,0,255,0.08)}
.card-top100{border:1px solid rgba(57,255,20,0.25)}

.records-table{width:100%;border-collapse:collapse;font-size:0.92rem}
.records-table thead{background:linear-gradient(135deg,#39FF14 0%,#22d80a 100%);color:#0A0E27}
.records-table thead th{padding:12px 18px;text-align:left;font-family:'Prompt',sans-serif;font-weight:800;letter-spacing:0.02em}
.records-table tbody tr{border-bottom:1px solid rgba(255,255,255,0.06)}
.records-table tbody tr:hover{background:rgba(57,255,20,0.04)}
.records-table tbody td{padding:14px 18px}
.female-table thead{background:linear-gradient(135deg,#FF00FF 0%,#c026d3 100%);color:#fff}

.mono{font-family:'JetBrains Mono','ui-monospace',monospace}
.spinner{
  border:3px solid rgba(255,255,255,0.1);
  border-top-color:#39FF14;
  border-radius:50%;width:48px;height:48px;
  animation:spin 1s linear infinite;margin:0 auto;
}
@keyframes spin{to{transform:rotate(360deg)}}

.distance-tag{
  display:inline-block;padding:4px 14px;border-radius:999px;
  font-family:'Prompt',sans-serif;font-weight:700;font-size:0.78rem;letter-spacing:0.06em;
}
.tag-10mile{background:rgba(57,255,20,0.15);color:#39FF14;border:1px solid rgba(57,255,20,0.4)}
.tag-5mile{background:rgba(255,0,255,0.15);color:#FF00FF;border:1px solid rgba(255,0,255,0.4)}
.divider-glow{
  height:2px;width:80px;margin:0.75rem auto 0;border-radius:999px;
  background:linear-gradient(90deg,#39FF14,#FF00FF);
}

/* Year Tabs */
.year-tabs{
  background:rgba(20,26,61,0.6);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.year-tabs-inner{
  max-width:1300px;margin:0 auto;padding:0 1.5rem;
  display:flex;align-items:center;gap:0.25rem;flex-wrap:wrap;
}
.year-tab{
  position:relative;
  padding:0.95rem 1.5rem;
  font-family:'Prompt',sans-serif;font-weight:700;font-size:0.95rem;
  color:#9ca3af;
  background:transparent;border:none;cursor:pointer;
  transition:color 0.2s;
  letter-spacing:0.04em;
}
.year-tab:hover{color:#e5e7eb}
.year-tab.active{color:#39FF14}
.year-tab.active::after{
  content:'';position:absolute;left:1rem;right:1rem;bottom:0;height:3px;
  background:linear-gradient(90deg,#39FF14,#FF00FF);
  border-radius:3px 3px 0 0;
  box-shadow:0 0 15px rgba(57,255,20,0.5);
}
.year-tab .badge{
  display:inline-block;margin-left:0.4rem;
  padding:1px 8px;border-radius:999px;
  background:rgba(57,255,20,0.15);color:#39FF14;
  font-size:0.7rem;font-weight:700;
  border:1px solid rgba(57,255,20,0.3);
}
.year-tab.active .badge{background:rgba(57,255,20,0.25)}

.mobile-menu{display:none;position:fixed;top:64px;left:0;right:0;background:#0A0E27;border-bottom:1px solid rgba(57,255,20,0.2);padding:1rem;z-index:60}
.mobile-menu.open{display:block}
.mobile-menu a{display:block;padding:0.75rem 0;color:#e5e7eb;border-bottom:1px solid rgba(255,255,255,0.05);text-decoration:none}
.mobile-menu a.active{color:#39FF14}

@media (max-width:768px){
  .desktop-nav{display:none}
  .hamburger{display:flex}
}
@media (min-width:769px){
  .hamburger{display:none}
}
.hamburger{flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2px;background:#39FF14;display:block;transition:all 0.3s}

.text-magenta{color:#FF00FF}
.bg-magenta{background:#FF00