/* ==========================================================================
   KPOPGIG ARTIST HUB REDESIGN — "Neon Stage" (Design Team, 2026-10-05)
   --------------------------------------------------------------------------
   Visual-only layer. No content, text, or section order changes.
   Load AFTER the hub's inline <style> block so these rules win on ties.

   System: dark cinematic base + per-artist neon accent pair.
   Each hub section carries its artist class (e.g. .blackpink-hub) which sets
   --hub-accent / --hub-accent2. Everything below keys off those two vars.
   ========================================================================== */

/* ---- Per-artist accent pairs (original pairings, benchmark-informed) ---- */
.artist-hub{--hub-accent:#ff4b8b;--hub-accent2:#46d0d8}
.bts-hub{--hub-accent:#f3c96b;--hub-accent2:#e8933f}
.blackpink-hub{--hub-accent:#ff2d78;--hub-accent2:#c084fc}
.bigbang-hub{--hub-accent:#ffb800;--hub-accent2:#ff5a3c}
.epik-high-hub{--hub-accent:#2dd4bf;--hub-accent2:#60a5fa}
.aespa-hub{--hub-accent:#a78bfa;--hub-accent2:#f472b6}
.taemin-hub{--hub-accent:#22d3ee;--hub-accent2:#818cf8}
.le-sserafim-hub{--hub-accent:#fb3b5c;--hub-accent2:#ff9a62}
.monsta-x-hub{--hub-accent:#ff6b35;--hub-accent2:#f43f5e}
.artms-hub{--hub-accent:#93c5fd;--hub-accent2:#c4b5fd}
.ten-hub{--hub-accent:#8b5cf6;--hub-accent2:#e879f9}
.sohyang-hub{--hub-accent:#fbbf24;--hub-accent2:#fb7185}
.triples-hub{--hub-accent:#f472b6;--hub-accent2:#22d3ee}

.artist-hub ::selection{background:color-mix(in srgb,var(--hub-accent) 85%,transparent);color:#fff}

/* ---- Shell: neon light-strip + soft accent glow ---- */
.artist-hub .hub-shell{
  position:relative;border-radius:26px;border:1px solid color-mix(in srgb,var(--hub-accent) 22%,var(--line));
  box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 90px -30px color-mix(in srgb,var(--hub-accent) 45%,transparent);
}
.artist-hub .hub-shell:before{
  content:"";display:block;height:4px;position:relative;z-index:2;
  background:linear-gradient(90deg,var(--hub-accent),var(--hub-accent2),var(--hub-accent));
  background-size:220% 100%;
  box-shadow:0 0 18px color-mix(in srgb,var(--hub-accent) 70%,transparent);
}

/* ---- Hero: layered cinematic gradients + light streak ---- */
.artist-hub .hub-hero{
  background:
    radial-gradient(1100px 480px at 88% -12%,color-mix(in srgb,var(--hub-accent) 30%,transparent),transparent 62%),
    radial-gradient(760px 430px at 4% 112%,color-mix(in srgb,var(--hub-accent2) 24%,transparent),transparent 60%),
    radial-gradient(520px 300px at 46% 38%,color-mix(in srgb,var(--hub-accent) 10%,transparent),transparent 70%),
    linear-gradient(165deg,#0d0d14 0%,#101019 52%,#08080d 100%);
}
.artist-hub .hub-hero:before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 40%,color-mix(in srgb,var(--hub-accent) 13%,transparent) 50%,transparent 60%);
}
/* Watermark: accent-tinted with neon glow (was flat 3.5% white) */
.artist-hub .hub-hero:after{
  color:color-mix(in srgb,var(--hub-accent) 17%,transparent);
  text-shadow:0 0 70px color-mix(in srgb,var(--hub-accent) 40%,transparent);
}

/* ---- Kicker: gradient tick + glow ---- */
.artist-hub .hub-kicker{color:var(--hub-accent);display:inline-flex;align-items:center;gap:10px}
.artist-hub .hub-kicker:before{
  content:"";width:26px;height:2px;border-radius:2px;flex:0 0 26px;
  background:linear-gradient(90deg,var(--hub-accent),var(--hub-accent2));
  box-shadow:0 0 12px color-mix(in srgb,var(--hub-accent) 80%,transparent);
}

/* ---- Hero title: gradient neon on the Korean name line ---- */
.artist-hub .hub-hero h2 span{
  background:linear-gradient(100deg,var(--hub-accent) 5%,var(--hub-accent2) 95%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 0 22px color-mix(in srgb,var(--hub-accent) 38%,transparent));
}
.artist-hub .hub-status{border-top:1px solid color-mix(in srgb,var(--hub-accent) 48%,transparent)}
.artist-hub .hub-status b{text-shadow:0 0 26px color-mix(in srgb,var(--hub-accent) 30%,transparent)}

/* ---- Hub nav: accent hover wash ---- */
.artist-hub .hub-nav{border-bottom:1px solid color-mix(in srgb,var(--hub-accent) 26%,var(--line))}
.artist-hub .hub-nav a{transition:background .18s ease,color .18s ease}
.artist-hub .hub-nav a:hover,.artist-hub .hub-nav a:focus-visible{
  background:color-mix(in srgb,var(--hub-accent) 12%,transparent);color:var(--hub-accent);
}

/* ---- Section titles: accent numerals ---- */
.artist-hub .hub-title .num{color:var(--hub-accent)}
.artist-hub .hub-tour-head .num{color:var(--hub-accent)}
.artist-hub .route-group{color:var(--hub-accent2)}

/* ---- Profile grid: accent labels + hover lift ---- */
.artist-hub .profile-fact{transition:background .18s ease,box-shadow .18s ease}
.artist-hub .profile-fact small{color:var(--hub-accent)}
.artist-hub .profile-fact:hover{
  background:color-mix(in srgb,var(--hub-accent) 8%,transparent);
  box-shadow:inset 0 3px 0 color-mix(in srgb,var(--hub-accent) 70%,transparent);
}

/* ---- Official links: gradient top edge + glow hover ---- */
.artist-hub .official-link{
  border-top:3px solid transparent;
  border-image:linear-gradient(90deg,var(--hub-accent),var(--hub-accent2)) 1;
  transition:transform .18s ease,box-shadow .18s ease;
}
.artist-hub .official-link:hover,.artist-hub .official-link:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 14px 32px -12px color-mix(in srgb,var(--hub-accent) 45%,transparent);
}
.artist-hub .official-link span:last-child{color:var(--hub-accent)}

/* ---- Tour rows: accent dates, hover wash ---- */
.artist-hub .route-row{transition:background .18s ease}
.artist-hub .route-row:hover{background:color-mix(in srgb,var(--hub-accent) 7%,transparent)}
.artist-hub .route-row time{color:var(--hub-accent)}
.artist-hub .route-ticket{color:var(--hub-accent)}
.artist-hub .today-mark{background:linear-gradient(100deg,var(--hub-accent),var(--hub-accent2))}

/* ---- Events + listen cards ---- */
.artist-hub .event-item time{color:var(--hub-accent)}
.artist-hub .event-link{color:var(--hub-accent)}
.artist-hub .track{
  background:linear-gradient(160deg,color-mix(in srgb,var(--hub-accent) 15%,#17171b),#0f0f14 75%);
  border:1px solid color-mix(in srgb,var(--hub-accent) 32%,transparent);
  border-radius:14px;transition:transform .18s ease,box-shadow .18s ease;
}
.artist-hub .track small{color:var(--hub-accent)}
.artist-hub .track:hover,.artist-hub .track:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 16px 36px -12px color-mix(in srgb,var(--hub-accent) 50%,transparent);
}
.artist-hub .spotify-all{color:var(--hub-accent)}

/* ---- FAQ numerals ---- */
.artist-hub .faq-list summary:before{color:var(--hub-accent)}

/* ---- Alerts CTA ---- */
.artist-hub .btn.pink{background:linear-gradient(100deg,var(--hub-accent),var(--hub-accent2));box-shadow:0 10px 26px -8px color-mix(in srgb,var(--hub-accent) 60%,transparent)}
.artist-hub .btn.pink:hover{filter:brightness(1.08)}

@media(max-width:620px){
  .artist-hub .hub-shell{border-radius:18px}
}
@media(prefers-reduced-motion:reduce){
  .artist-hub .official-link,.artist-hub .track,.artist-hub .hub-nav a{transition:none}
}