/* Beatport/Spotify Releases */
#np-card-bp { order: 1 !important; }
/* Vinyl Releases */
#np-vinyl-section { order: 2 !important; }
/* CD Releases */
#np-cd-section { order: 3 !important; }
/* Mixcloud/SoundCloud Mixes */
#np-card-mc { order: 4 !important; }

/* =============================
   NEW DJ PROFILE TEMPLATE v2.1
   ULTRA-MODERN POLISHED VERSION
   ============================= */

:root {
  --np-bg: #050505;
  --np-card-bg: rgba(13, 13, 13, 0.7);
  --np-accent: #27ff9c;
  --np-accent-glow: rgba(39, 255, 156, 0.3);
  --np-text-main: #ffffff;
  --np-text-muted: #888888;
  --np-border: rgba(255, 255, 255, 0.06);
  --np-border-accent: rgba(39, 255, 156, 0.2);
  --np-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.np-wrap, .np-wrap *, .np-wrap *::before, .np-wrap *::after { box-sizing:border-box }
.np-wrap { 
  max-width: 1100px; 
  margin: 0 auto; 
  padding: 1.5rem 1.5rem 0.75rem; 
  font-family: 'Outfit', sans-serif;
  overflow-x: hidden;
  scrollbar-width: none;
}
.np-wrap::-webkit-scrollbar { display:none }

/* Loading */
.np-loading { display:flex; align-items:center; justify-content:center; min-height:60vh }
.np-spinner { width:40px; height:40px; border:3px solid #1a1a1a; border-top-color:var(--np-accent); border-radius:50%; animation:np-spin .8s linear infinite }
@keyframes np-spin { to { transform:rotate(360deg) } }

/* Hero Section */
.np-hero { 
  position:relative; 
  border-radius:32px; 
  overflow:hidden; 
  margin-bottom:2rem; 
  background:#0a0a0a; 
  border:1px solid var(--np-border); 
  box-shadow: 0 20px 50px rgba(0,0,0,0.5);
  animation:np-hero-in 0.8s ease-out;
  min-width:0;
}
@keyframes np-hero-in { from { opacity:0; transform:translateY(-20px); } to { opacity:1; transform:translateY(0); } }

.np-hero-bg { 
  position:absolute; 
  inset:0; 
  opacity:.85; 
  background-size:cover; 
  background-position:center; 
  filter:grayscale(100%); 
  z-index:0;
  transition: opacity 1s ease;
}

.np-hero-overlay {
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(5,5,5,0.35) 0%, rgba(5,5,5,0.55) 50%, rgba(5,5,5,0.85) 100%);
  z-index:1;
  pointer-events:none;
}

.np-hero-i { 
  position:relative; 
  display:flex; 
  gap:2.5rem; 
  align-items:center; 
  padding:1.75rem 3rem; 
  z-index:1;
}

/* Avatar with Glow Ring */
.np-av-w { 
  position:relative; 
  flex-shrink:0; 
  width:340px; 
  height:340px; 
  border-radius:32px; 
  overflow:hidden; 
  border:2px solid rgba(255,255,255,0.12); 
  box-shadow: 0 20px 80px rgba(0,0,0,0.6);
  transition: var(--np-transition);
}
.np-av-w:hover { transform: scale(1.03) rotate(1deg); box-shadow: 0 0 30px rgba(255,255,255,0.06); }

.np-av-img { width:100%; height:100%; object-fit:cover; transition: var(--np-transition); }
.np-av-w:hover .np-av-img { transform: scale(1.1); }

.np-av-init { 
  width:100%; height:100%; 
  display:flex; align-items:center; justify-content:center; 
  font-size:6rem; font-weight:900; color:var(--np-accent); 
  background:#111; 
}

.np-av-g { 
  position:absolute; 
  inset:-2px; 
  border-radius:32px; 
  border:1px solid transparent; 
  background:linear-gradient(135deg, rgba(255,255,255,0.15), transparent 50%, rgba(255,255,255,0.08)) border-box; 
  -webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0); 
  -webkit-mask-composite:xor; 
  mask-composite:exclude; 
  pointer-events:none;
}

/* Typography & Hero Info */
.np-hero-t { flex:1; min-width:0 }
.np-badge { 
  display:inline-block; 
  background:rgba(39,255,156,.1); 
  border:1px solid var(--np-border-accent); 
  color:var(--np-accent); 
  font-size:.65rem; 
  font-weight:800; 
  text-transform:uppercase; 
  letter-spacing:.15em; 
  padding:.4rem .9rem; 
  border-radius:999px; 
  margin-bottom:0.75rem;
}

.np-name { 
  font-size:clamp(2.5rem, 7vw, 4.5rem); 
  font-weight:900; 
  text-transform:uppercase; 
  letter-spacing:-.04em; 
  line-height:1;
  margin:0;
  overflow-wrap:break-word;
  word-break:break-word;
  hyphens:auto
}
.np-premium-badge{position:absolute;bottom:10px;right:10px;z-index:5;padding:4px 10px;border-radius:100px;background:linear-gradient(135deg,#ffd700,#ffaa00);color:#000;font-size:.65rem;font-weight:800;letter-spacing:.06em;box-shadow:0 2px 8px rgba(0,0,0,.5);display:flex;align-items:center;gap:4px}
.np-premium-badge::before{content:"✓";font-size:.7rem}
.np-premium-check{display:inline-flex;align-items:center;justify-content:center;width:1.6em;height:1.6em;border-radius:50%;background:linear-gradient(135deg,#ffd700,#ffaa00);color:#000;font-size:.25em;font-weight:800;vertical-align:super;margin-left:.5em;box-shadow:0 2px 6px rgba(255,215,0,.5);flex-shrink:0}
  line-height:1; 
  margin:0 0 .75rem; 
  color:#fff; 
  text-shadow: 0 0 30px rgba(255,255,255,0.1);
}

/* Meta Line — music style + location */
.np-meta-line { display:flex; flex-wrap:wrap; align-items:center; gap:2rem; margin-bottom:0.75rem }
.np-meta-item {
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--np-text-muted); transition: var(--np-transition);
}
.np-meta-item svg { color:var(--np-accent); flex-shrink:0; }
.np-meta-loc { margin-left:1.25rem }
.np-meta-item:hover { color:#fff; }

/* Social Links Grid */
.np-soc-icons { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem }
.np-soc-pill {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.4rem .7rem; border-radius:10px;
  border:1px solid var(--c); background:rgba(255,255,255,0.03);
  text-decoration:none; color:var(--np-text-muted);
  transition: var(--np-transition); min-width:0;
}
.np-soc-pill:hover {
  background:rgba(255,255,255,0.06);
  transform:translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.np-soc-pill .np-soc-pill-icon { background:var(--c); color:#000; border-color:var(--c) }
.np-soc-pill:hover .np-soc-pill-icon { background:var(--c); color:#000; border-color:var(--c) }
.np-soc-pill:hover .np-soc-pill-name { color:#fff }
.np-soc-pill .np-soc-fol { color:var(--c) }
.np-soc-pill:hover .np-soc-fol { color:var(--c) }
.np-soc-pill-icon {
  display:flex; align-items:center; justify-content:center;
  width:24px; height:24px; border-radius:6px; flex-shrink:0;
  border:1px solid var(--np-border); background:rgba(255,255,255,0.04);
  transition: var(--np-transition);
}
.np-soc-pill-icon svg { width:13px; height:13px }
.np-soc-pill-name { font-size:.65rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; white-space:nowrap }
.np-soc-fol { font-size:.55rem; font-weight:900; color:var(--np-text-muted); margin-left:auto; padding-left:.3rem; white-space:nowrap; transition: var(--np-transition) }

/* VOTE BUTTON */
.np-vote { 
  display:inline-flex; 
  align-items:center;
  justify-content:center; 
  gap:.4rem;
  padding:.45rem 1.2rem; 
  border-radius:999px; 
  border:1px solid rgba(39,255,156,0.4);
  background:rgba(39,255,156,0.05); 
  color:var(--np-accent);
  font-size:.65rem; 
  font-weight:700; 
  text-transform:uppercase; 
  letter-spacing:.08em; 
  cursor:pointer; 
  position:relative;
  overflow:hidden;
  transition: var(--np-transition); 
  font-family:inherit; 
}
.np-vote::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(45deg, transparent, rgba(255,255,255,0.1), transparent);
  transform: rotate(45deg);
  transition: 0.6s;
  animation: np-shimmer 3s infinite linear;
}
@keyframes np-shimmer {
  0% { transform: translateX(-100%) rotate(45deg); }
  100% { transform: translateX(100%) rotate(45deg); }
}
.np-vote:hover { 
  background:var(--np-accent); 
  color:#000;
  border-color:var(--np-accent);
  box-shadow: 0 0 15px rgba(39,255,156,0.3);
}
.np-vote:active { transform:scale(0.97); }
.np-vote svg { width:12px; height:12px; flex-shrink:0 }

/* Content Grid */
.np-grid { 
  display:grid; 
  grid-template-columns:1fr; 
  gap:1rem; 
  min-width:0;
}
.np-grid-main, .np-grid-side { 
  display:flex; 
  flex-direction:column; 
  gap:1rem; 
  min-width:0; 
}
@media(min-width:992px) {
  .np-grid { 
    grid-template-columns: 2fr 1fr; 
  }
}

/* Cards - Glassmorphism 2.0 */
.np-card { 
  background:var(--np-card-bg); 
  backdrop-filter:blur(12px); 
  -webkit-backdrop-filter:blur(12px); 
  border:1px solid var(--np-border); 
  border-radius:24px; 
  padding:1.5rem; 
  transition: opacity 0.6s cubic-bezier(0.23,1,0.32,1), transform 0.6s cubic-bezier(0.23,1,0.32,1), border-color 0.4s ease, background 0.4s ease, box-shadow 0.4s ease; 
  opacity:0; 
  transform:translateY(30px);
  overflow:hidden;
  width:100%;
}
.np-card.np-visible { 
  opacity:1; 
  transform:translateY(0); 
}
.np-card:hover { 
  border-color:var(--np-border-accent); 
  background:rgba(20,20,20,0.8);
  box-shadow: 0 10px 40px rgba(0,0,0,0.4);
}
.np-card-bio { grid-column:1/-1; }
.np-card-sp { 
  border-color:var(--np-border-accent); 
  background:rgba(39,255,156,0.03); 
}

.np-ct { 
  font-size:.8rem; 
  font-weight:900; 
  text-transform:uppercase; 
  letter-spacing:.1em; 
  display:flex; 
  align-items:center; 
  gap:.75rem; 
  margin:0 0 1rem; 
  color:#fff; 
}
.np-cb { 
  display:block; 
  width:4px; 
  height:16px; 
  background:var(--cb-color, var(--np-accent)); 
  border-radius:2px; 
  box-shadow:0 0 10px var(--cb-color, var(--np-accent)); 
}

.np-card-feedback { --cb-color:#27ff9c; border-color:rgba(39,255,156,0.1); background:rgba(39,255,156,0.02) }
.np-card-bio { --cb-color:#7c5cfc }
.np-card-rider { --cb-color:#f59e0b }
.np-card-bp { --cb-color:#01ff01; border-color:rgba(1,255,1,0.1); background:rgba(1,255,1,0.02) }
.np-card-mc { --cb-color:#52a0e8; border-color:rgba(82,160,232,0.15); background:rgba(82,160,232,0.03) }
.np-card-ev { --cb-color:#ff6b6b }
.np-card-cities { --cb-color:#a78bfa }
.np-card-sp { --cb-color:#fbbf24 }
.np-card-contact { --cb-color:#22d3ee }

.np-bio { 
  font-size:.95rem; 
  line-height:1.8; 
  color:var(--np-text-muted); 
  font-weight:500; 
  white-space:pre-wrap; 
}
.np-bio-collapsed {
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.np-read-more {
  background:none;
  border:none;
  color:var(--np-accent);
  font-weight:700;
  cursor:pointer;
  padding:0;
  margin-top:0.75rem;
  font-size:0.85rem;
  letter-spacing:0.03em;
  transition:var(--np-transition);
}
.np-read-more:hover {
  opacity:0.8;
}

/* Buttons in Card */
.np-btn { 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  gap:.5rem; 
  padding:.8rem 1.2rem; 
  border-radius:12px; 
  border:1px solid var(--np-border); 
  background:rgba(255,255,255,0.03); 
  color:#fff; 
  text-decoration:none; 
  font-size:.75rem; 
  font-weight:800; 
  text-transform:uppercase; 
  letter-spacing:.05em; 
  transition: var(--np-transition); 
  cursor:pointer; 
  font-family:inherit; 
  margin-bottom:.75rem; 
}
.np-btn:hover { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.15); }
.np-btn-g { border-color:var(--np-border-accent); color:var(--np-accent); background:rgba(39,255,156,0.05); }
.np-btn-g:hover { background:var(--np-accent); color:#000; border-color:var(--np-accent); }

/* Rider */
.np-rider { 
  font-size:.85rem; 
  line-height:1.6; 
  color:var(--np-text-muted); 
  font-family:inherit; 
  white-space:pre-wrap; 
  margin:0; 
}

.np-sp-t { font-size:.8rem; color:var(--np-text-muted); font-weight:500; line-height:1.5; margin:0 0 1.25rem }

/* Responsive */
@media(max-width:768px) {
  .np-wrap { padding:0.5rem 1rem 0 }
  .np-hero-i { flex-direction:column; align-items:center; text-align:center; padding:1.5rem 1.5rem }
  .np-av-w { width:260px; height:260px; border-radius:26px }
  .np-av-init { font-size:4rem }
  .np-name { font-size:clamp(1.8rem, 8vw, 2.5rem) }
  .np-meta-line { justify-content:center }
  .np-soc-icons { justify-content:center }
  .np-hero-t { display:flex; flex-direction:column; align-items:center }
  .np-fb-row { grid-template-columns:1fr }
  .np-fb-form { padding:.8rem; max-height:60vh; gap:.5rem }
  .np-fb-msg { min-height:50px }
  .np-fb-name, .np-fb-ig { padding:.5rem .6rem }
  .np-soc-pill { padding:.3rem .55rem }
  .np-soc-pill-icon { width:22px; height:22px; border-radius:5px }
  .np-soc-pill-icon svg { width:11px; height:11px }
  .np-soc-pill-name { font-size:.58rem }
  .np-soc-fol { font-size:.5rem }
  .np-card { padding:0.9rem; border-radius:12px }
}
@media(max-width:380px) {
  .np-soc-pill { gap:.3rem; padding:.25rem .45rem }
  .np-soc-pill-name { font-size:.52rem }
  .np-av-w { width:200px; height:200px; border-radius:24px }
}

/* Banners Grid */
.np-banners-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1rem }
.np-banners-grid .banner-wrap { border-radius:12px; overflow:hidden; border:1px solid var(--np-border); transition: var(--np-transition) }
.np-banners-grid .banner-wrap:hover { border-color:var(--np-border-accent); transform:translateY(-3px) }
.np-banners-grid .banner-img { width:100%; height:auto; display:block }

/* Feedback Section */
.np-fb-wrap { display:flex; flex-direction:column; gap:1rem; width:100%; min-width:0 }
.np-fb-list { 
  display:flex; 
  flex-direction:column; 
  gap:.6rem; 
  margin-bottom:1rem; 
  max-height:250px; 
  overflow-y:auto; 
  padding-right:4px;
  scrollbar-width:none;
}
.np-fb-list::-webkit-scrollbar { display:none; }
.np-fb-item { background:rgba(255,255,255,0.03); border:1px solid var(--np-border); padding:.75rem 1rem; border-radius:12px; transition: var(--np-transition) }
.np-fb-item:hover { border-color:var(--np-border-accent); background:rgba(255,255,255,0.05) }
.np-fb-user { font-size:.7rem; font-weight:800; color:var(--np-accent); margin-bottom:.2rem; display:block }
.np-fb-msg { font-size:.8rem; color:var(--np-text-muted); line-height:1.4; font-style:italic }

.np-fb-form { display:flex; flex-direction:column; gap:.6rem; padding:1rem; background:rgba(0,0,0,0.5); border-radius:16px; border:1px solid var(--np-border); position:relative; max-height:70vh; overflow-y:auto; -webkit-overflow-scrolling:touch; width:100%; min-width:0; scrollbar-width:none }
.np-fb-form::-webkit-scrollbar { display:none }
.np-fb-close { position:sticky; top:0; float:right; width:28px; height:28px; border-radius:50%; border:1px solid var(--np-border); background:rgba(255,255,255,0.05); color:var(--np-text-muted); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:var(--np-transition); font-size:1rem; line-height:1; z-index:1 }
.np-fb-close:hover { background:rgba(255,255,255,0.1); color:#fff; border-color:rgba(255,255,255,0.2) }
.np-fb-row { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; min-width:0 }
.np-fb-name, .np-fb-ig, .np-fb-msg { 
  background:rgba(255,255,255,0.05); 
  border:1px solid var(--np-border); 
  border-radius:8px; 
  padding:.6rem .7rem; 
  color:#fff; 
  font-family:inherit; 
  font-size:16px; 
  transition: var(--np-transition);
  -webkit-appearance:none;
  width:100%;
  min-width:0;
  box-sizing:border-box;
}
.np-fb-name:focus, .np-fb-ig:focus, .np-fb-msg:focus { 
  outline:none; border-color:var(--np-accent); background:rgba(39,255,156,0.05); 
}
.np-fb-msg { resize:vertical; min-height:60px; font-size:16px }
.np-fb-send { background:var(--np-accent); color:#000; font-weight:900; border:none; }
.np-fb-send:hover { background:#1fb88f; transform:translateY(-2px); }

.np-btn-fb { 
  display:flex; align-items:center; justify-content:center; gap:.5rem; 
  padding:.7rem 1rem; border-radius:12px; 
  border:1px dashed var(--np-border-accent); 
  background:transparent; color:var(--np-accent); 
  font-size:.75rem; font-weight:800; text-transform:uppercase; 
  cursor:pointer; transition: var(--np-transition); font-family:inherit;
}
.np-btn-fb:hover { background:rgba(39,255,156,0.1); border-style:solid; }

/* Support Buttons Row */
.np-sp-btns { display:flex; flex-wrap:wrap; gap:.75rem }
.np-sp-btns .np-btn { flex:1; min-width:140px; }
.np-cities-collapsed { max-height:200px; overflow:hidden; overflow-x:hidden; display:flex; flex-direction:column; gap:.3rem; transition:max-height 0.4s ease; width:100%; box-sizing:border-box }
.np-cities-collapsed.np-cities-expanded { max-height:none; overflow:visible }

/* Hot Cities Section — Ultra Minimal */
.np-cities-list, #profile-cities-list {
  display:flex; flex-direction:column; gap:.3rem; width:100%; max-width:100%; overflow-x:hidden; box-sizing:border-box
}
.np-cities-list::-webkit-scrollbar, #profile-cities-list::-webkit-scrollbar { display:none }
.np-cities-list, #profile-cities-list { scrollbar-width:none }
.np-city-row {
  display:flex; align-items:center; gap:.5rem;
  padding:.3rem 0; border-radius:8px;
  transition: background .3s ease, transform .3s ease; min-width:0; 
width:100%; box-sizing:border-box;
}
.np-city-row:hover { background:rgba(255,255,255,0.03); transform:translateX(3px) }
.np-city-info { display:flex; align-items:center; gap:.35rem; flex:1; min-width:0 }
.np-city-pin { width:12px; height:12px; flex-shrink:0; opacity:.45; color:var(--np-accent) }
.np-city-name { font-size:.75rem; font-weight:700; color:#fff; text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.np-city-ctry { font-size:.75rem; font-weight:500; color:var(--np-text-muted); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; flex-shrink:0; display:inline }
.np-city-ctry::before { content:"\00B7"; margin:0 .2rem; color:var(--np-text-muted); opacity:.5 }
.np-city-bar-wrap { height:3px; width:48px; background:rgba(255,255,255,0.05); border-radius:999px; overflow:hidden; flex-shrink:0; margin-left:auto }
.np-city-bar { display:block; height:100%; border-radius:999px; background:var(--np-accent); opacity:.6 }

/* Beatport Tracks Section */
.np-bp-tracks { display:grid; grid-template-columns:1fr 1fr; gap:.6rem }
.np-bp-loading { display:flex; align-items:center; justify-content:center; padding:2rem 0; grid-column:1/-1 }
.np-bp-loading .np-spinner { border-top-color:#01ff01; width:24px; height:24px }
.np-bp-empty { font-size:.8rem; color:var(--np-text-muted); text-align:center; padding:1rem 0; margin:0; grid-column:1/-1 }
.np-bp-track {
  display:flex; flex-direction:column; border-radius:12px;
  border:1px solid var(--np-border); background:rgba(255,255,255,0.03);
  text-decoration:none; color:inherit; overflow:hidden;
  transition: var(--np-transition);
}
.np-bp-track:hover { border-color:rgba(1,255,1,0.3); background:rgba(1,255,1,0.06); transform:translateY(-2px) }
.np-bp-cover {
  width:100%; aspect-ratio:1/1;
  background-size:cover; background-position:center;
  background-color:#111;
}
.np-bp-info { padding:.5rem .6rem .6rem }
.np-bp-title { font-size:.75rem; font-weight:800; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:flex; align-items:center; gap:.3rem }
.np-bp-role { font-size:.45rem; font-weight:900; text-transform:uppercase; letter-spacing:.06em; background:rgba(1,255,1,0.15); color:#01ff01; padding:.08rem .35rem; border-radius:3px; border:1px solid rgba(1,255,1,0.3); flex-shrink:0; line-height:1 }
.np-bp-artist { font-size:.65rem; font-weight:600; color:var(--np-accent); margin-top:.1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.np-bp-meta { display:none }
.np-bp-dur { display:none }
@media(max-width:768px) {
  .np-bp-tracks { gap:.5rem }
  .np-bp-info { padding:.4rem .5rem .5rem }
  .np-bp-title { font-size:.7rem }
  .np-bp-artist { font-size:.6rem }
}

/* Mixcloud Set Section */
.np-mc-loading { display:flex; align-items:center; justify-content:center; padding:2rem 0 }
.np-mc-loading .np-spinner { border-top-color:#52A0E8; width:24px; height:24px }
.np-mc-empty { font-size:.8rem; color:var(--np-text-muted); text-align:center; padding:1rem 0; margin:0 }
.np-mc-card {
  display:flex; align-items:stretch; gap:1.25rem;
  border-radius:16px; border:1px solid var(--np-border);
  background:rgba(255,255,255,0.03); text-decoration:none; color:inherit;
  transition: var(--np-transition); overflow:hidden; min-width:0;
}
.np-mc-card:hover { border-color:rgba(82,160,232,0.3); background:rgba(82,160,232,0.06); transform:translateY(2px) }
.np-mc-cover {
  width:130px; min-height:130px; flex-shrink:0;
  background-size:cover; background-position:center;
  position:relative; background-color:#111;
  display:flex; align-items:center; justify-content:center;
}
.np-mc-play {
  width:48px; height:48px; border-radius:50%;
  background:rgba(82,160,232,0.9); color:#fff;
  display:flex; align-items:center; justify-content:center;
  transition: var(--np-transition); box-shadow: 0 4px 20px rgba(82,160,232,0.4);
}
.np-mc-card:hover .np-mc-play { transform:scale(1.15); box-shadow:0 6px 30px rgba(82,160,232,0.6) }
.np-mc-play svg { margin-left:2px }
.np-mc-dur {
  position:absolute; bottom:8px; right:8px;
  font-size:.6rem; font-weight:800; color:#fff;
  background:rgba(0,0,0,0.7); padding:.2rem .5rem;
  border-radius:6px; letter-spacing:.03em;
}
.np-mc-info { flex:1; padding:1rem 1rem 1rem 0; display:flex; flex-direction:column; justify-content:center; min-width:0 }
.np-mc-name { font-size:.9rem; font-weight:800; color:#fff; line-height:1.3; margin-bottom:.5rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.np-mc-meta { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center }
.np-mc-meta span {
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.65rem; font-weight:700; color:var(--np-text-muted);
  text-transform:uppercase; letter-spacing:.03em;
}
.np-mc-meta svg { color:rgba(82,160,232,0.7); flex-shrink:0 }
@media(max-width:768px) {
  .np-mc-card { flex-direction:column }
  .np-mc-cover { width:100%; min-height:180px; height:auto }
  .np-mc-info { padding:1rem }
}

/* Events Section */
.np-card-ev { margin-bottom:1rem }
.np-ev-toggle { width:100%; padding:.6rem 1rem; font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--np-accent); background:rgba(39,255,156,.06); border:1px solid rgba(39,255,156,.2); border-radius:10px; cursor:pointer; transition:all .25s ease; display:flex; align-items:center; justify-content:center; gap:.5rem }
.np-ev-toggle:hover { background:rgba(39,255,156,.12); border-color:rgba(39,255,156,.4) }
.np-ev-list { margin-top:.75rem }
.np-ev-carousel { position:relative; overflow:hidden; border-radius:10px; border:1px solid rgba(255,255,255,.06) }
.np-ev-slide { position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .6s ease, visibility .6s ease; cursor:pointer; display:flex; flex-direction:column }
.np-ev-slide.active { position:relative; opacity:1; visibility:visible }
.np-ev-flyer { width:100%; display:block; aspect-ratio:3/4; object-fit:contain }
.np-ev-flyer-empty { width:100%; min-height:120px; background-color:rgba(255,255,255,.03); border-radius:0 }
.np-ev-info { padding:.65rem .75rem .75rem; display:flex; flex-direction:column; gap:.15rem }
.np-ev-title { font-size:.75rem; font-weight:700; color:#fff; text-transform:uppercase; letter-spacing:.04em; line-height:1.3 }
.np-ev-date { font-size:.65rem; color:var(--np-text-muted); letter-spacing:.03em }
.np-ev-loc { font-size:.65rem; color:var(--np-text-muted); display:flex; align-items:center; gap:.25rem }
.np-ev-loc svg { width:11px; height:11px; flex-shrink:0; opacity:.5 }
.np-ev-empty { font-size:.65rem; color:var(--np-text-muted); text-align:center; padding:.75rem 0 }
.np-ev-dots { display:flex; justify-content:center; gap:.4rem; margin-top:.5rem }
.np-ev-dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.2); cursor:pointer; transition:all .3s ease }
.np-ev-dot.active { background:var(--np-accent); width:18px; border-radius:3px }

.np-ev-form { margin-top:.75rem; display:none }
.np-ev-form.open { display:block }
.np-ev-form .np-form-row { margin-bottom:.5rem }
.np-ev-form .np-form-row label { display:block; font-size:.6rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--np-text-muted); margin-bottom:.2rem }
.np-ev-form .np-form-row input,
.np-ev-form .np-form-row textarea { width:100%; padding:.5rem .65rem; font-size:.7rem; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:8px; color:#fff; outline:none; transition:border .2s; box-sizing:border-box; min-width:0 }
.np-ev-form .np-form-row input:focus,
.np-ev-form .np-form-row textarea:focus { border-color:var(--np-accent) }
.np-ev-form .np-ev-desc { min-height:4rem; resize:vertical }
.np-ev-form .np-ev-flyer-wrap { position:relative; display:flex; align-items:center; gap:.5rem; padding:.4rem .65rem; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:8px; cursor:pointer; transition:border .2s; font-size:.65rem; color:var(--np-text-muted) }
.np-ev-form .np-ev-flyer-wrap:hover { border-color:var(--np-accent) }
.np-ev-form .np-ev-flyer-wrap input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer }
.np-ev-form .np-ev-flyer-wrap svg { width:14px; height:14px; flex-shrink:0; opacity:.5 }
.np-ev-form .np-ev-flyer-preview { width:100%; max-height:160px; border-radius:8px; overflow:hidden; margin-top:.4rem; display:none; aspect-ratio:3/4; background:rgba(255,255,255,.03) }
.np-ev-form .np-ev-flyer-preview img { width:100%; height:100%; object-fit:cover; display:block }
.np-ev-form .np-ev-flyer-preview.show { display:block }
.np-ev-form .np-ev-submit { width:100%; padding:.55rem; font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#0a0a0a; background:var(--np-accent); border:none; border-radius:8px; cursor:pointer; transition:opacity .2s }
.np-ev-form .np-ev-submit:hover { opacity:.85 }
.np-ev-form .np-ev-submit:disabled { opacity:.4; cursor:default }

/* EPK SECTIONS PORTED TO NP */
.np-sp-desc{font-size:0.85rem;color:var(--np-text-muted);margin-bottom:1.25rem}
.np-sp-btns{display:flex;gap:0.75rem;flex-wrap:wrap}
.np-wrap .epk-sp-btns .epk-btn{flex:1;padding:0.6rem 0.8rem;font-size:0.75rem;justify-content:center;min-width:0;gap:0.35rem;border-radius:8px;white-space:nowrap}
.np-wrap .epk-sp-btns .epk-btn svg{width:14px;height:14px;flex-shrink:0}
.np-wrap .np-hero-t .epk-btn{padding:0.6rem 1.4rem;font-size:0.8rem}
.np-wrap .epk-booking-links{display:flex;flex-direction:row;flex-wrap:nowrap;gap:0.5rem;justify-content:flex-start}
.np-wrap .epk-booking-links .epk-btn{flex:1;padding:0.6rem 0.8rem;font-size:0.75rem;min-width:0;gap:0.35rem;justify-content:center;border-radius:8px;white-space:nowrap}
.np-wrap .epk-booking-links .epk-btn svg{width:14px;height:14px;flex-shrink:0}
.np-booking-links{display:flex;flex-direction:column;gap:0.75rem}
.np-booking-link{display:flex;align-items:center;gap:0.75rem;padding:0.9rem 1.25rem;border-radius:12px;background:rgba(255,255,255,0.03);border:1px solid var(--np-border);text-decoration:none;color:var(--np-text-main);transition:var(--np-transition);font-weight:600;font-size:0.9rem}
.np-booking-link:hover{border-color:var(--np-accent);transform:translateY(-2px);background:rgba(255,255,255,0.06)}
.np-booking-link svg{width:20px;height:20px;flex-shrink:0;color:var(--np-accent)}
.np-similar-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem}
.np-similar-card{background:rgba(255,255,255,0.03);border:1px solid var(--np-border);border-radius:16px;overflow:hidden;text-decoration:none;color:var(--np-text-main);transition:var(--np-transition);text-align:center}
.np-similar-card:hover{border-color:var(--np-accent);transform:translateY(-3px);background:rgba(255,255,255,0.06)}
.np-similar-img{width:100%;aspect-ratio:1/1;object-fit:cover}
.np-similar-name{padding:0.65rem;font-weight:700;font-size:0.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* VOTE CTA FINAL */
.np-vote-cta{text-align:center;padding:0.75rem 1rem;background:linear-gradient(to bottom,transparent,rgba(39,255,156,0.05));margin-top:0.5rem}
.np-vote-cta h2{font-size:1.75rem;font-weight:900;margin:0 0 0.75rem;text-transform:uppercase;letter-spacing:-0.02em}
.np-vote-cta p{color:var(--np-text-muted);margin:0 0 1.25rem}
.np-vote-cta .np-btn-g{padding:1rem 3rem;font-size:1rem;margin:0 auto}

/* Remove excessive gap above modern and EPK profiles */
#profile-container:has(.np-wrap),
#profile-container:has(.epk) {
  padding-top: 0 !important;
  padding-bottom: 2rem !important;
}

@media(max-width:768px) {
  #profile-container:has(.np-wrap),
  #profile-container:has(.epk) {
    padding-top: 0 !important;
    padding-bottom: 1.5rem !important;
  }
}

.np-cities-tabs{display:flex;gap:.35rem;margin-bottom:.75rem}
.np-cities-tab{background:transparent;border:1px solid var(--border);color:var(--muted-foreground);padding:.2rem .6rem;border-radius:.375rem;font-size:.68rem;font-weight:700;cursor:pointer;transition:all .15s;letter-spacing:.03em}
.np-cities-tab:hover{border-color:rgba(167,139,250,.4);color:var(--foreground)}
.np-cities-tab.active{background:rgba(167,139,250,.12);border-color:#a78bfa;color:#a78bfa}

/* Vinyl Releases */
.np-vinyl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;margin-top:.75rem}
.np-vinyl-release{background:rgba(255,255,255,.03);border:1px solid var(--np-border);border-radius:.5rem;overflow:hidden;transition:all .2s;cursor:pointer;text-decoration:none;color:inherit;display:flex;flex-direction:column}
.np-vinyl-release:hover{border-color:rgba(29,185,84,.4);transform:translateY(-2px)}
.np-vinyl-release img,.np-vinyl-placeholder{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;flex-shrink:0}
.np-vinyl-placeholder{background:var(--secondary);display:flex;align-items:center;justify-content:center;color:var(--muted-foreground)}
.np-vinyl-placeholder svg{width:2rem;height:2rem;opacity:.3}
.np-vinyl-info{padding:.5rem .65rem .6rem;display:flex;flex-direction:column;gap:.1rem;flex:1}
.np-vinyl-title{font-size:.68rem;font-weight:700;color:var(--foreground);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.np-vinyl-artist{font-size:.6rem;color:var(--np-accent);font-weight:600}
.np-vinyl-meta{font-size:.58rem;color:var(--muted-foreground);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* PHOTO GALLERY */
.np-card-gallery{margin-bottom:1.5rem}
.np-gallery-carousel{position:relative;border-radius:.5rem;overflow:hidden;background:var(--np-card-bg);border:1px solid var(--np-border)}
.np-gallery-stage{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden}
.np-gallery-slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;cursor:pointer}
.np-gallery-slide.np-gallery-active{opacity:1;position:relative}
.np-gallery-slide img{width:100%;height:100%;object-fit:cover;display:block}
.np-gallery-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.6);color:#fff;border:none;width:36px;height:36px;border-radius:50%;font-size:1.3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;opacity:0;transition:opacity .2s;line-height:1}
.np-gallery-carousel:hover .np-gallery-nav{opacity:1}
.np-gallery-prev{left:.5rem}
.np-gallery-next{right:.5rem}
.np-gallery-nav:hover{background:rgba(0,0,0,.9)}
.np-gallery-dots{display:flex;justify-content:center;gap:.35rem;padding:.5rem;background:rgba(0,0,0,.3)}
.np-gallery-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.25);cursor:pointer;transition:all .2s}
.np-gallery-dot.np-gallery-dot-active{background:var(--np-accent);width:20px;border-radius:4px}

/* GALLERY LIGHTBOX */
.np-gallery-overlay{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:10000;display:flex;align-items:center;justify-content:center;padding:2rem;animation:np-fade-in .2s ease}
.np-gallery-lightbox{position:relative;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;align-items:center}
.np-gallery-lightbox img{max-width:100%;max-height:80vh;object-fit:contain;border-radius:.5rem;box-shadow:0 0 40px rgba(0,0,0,.5)}
.np-gallery-lb-close{position:absolute;top:-2.5rem;right:0;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.25rem;line-height:1;opacity:.7;transition:opacity .2s}
.np-gallery-lb-close:hover{opacity:1}
.np-gallery-lb-actions{margin-top:1rem;display:flex;gap:.75rem;align-items:center}
.np-gallery-download-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.25rem;border-radius:999px;background:var(--np-accent);color:#000;font-weight:700;font-size:.8rem;text-decoration:none;transition:all .2s;text-transform:uppercase;letter-spacing:.04em}
.np-gallery-download-btn:hover{box-shadow:0 0 20px var(--np-accent-glow);transform:scale(1.05)}
@keyframes np-fade-in{from{opacity:0}to{opacity:1}}

/* SUPPORT & BOOKING MODALS - MOBILE */
@media(max-width:480px) {
  .support-modal-overlay{padding:.3rem!important}
  .support-modal-box{max-width:100%!important;padding:1.1rem 1rem!important;margin:0!important;border-radius:.8rem!important;max-height:92vh!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
  .support-modal-box h3{font-size:1.35rem!important;margin-bottom:.35rem!important;line-height:1.3!important}
  .support-modal-box p{font-size:.95rem!important;margin-bottom:.7rem!important;line-height:1.5!important;color:#c0c0c0!important}
  .support-modal-box input,.support-modal-box textarea{font-size:1.15rem!important;padding:.9rem .95rem!important;width:100%!important;flex:none!important;box-sizing:border-box!important;border-radius:.6rem!important;line-height:1.45!important}
  .support-modal-box input::placeholder,.support-modal-box textarea::placeholder{font-size:1.05rem!important;color:#999!important}
  .support-modal-box > div{display:flex!important;flex-direction:column!important;gap:.6rem!important}
  .support-modal-box .dj-fb-types{display:flex!important;flex-wrap:wrap!important;gap:.35rem!important;margin:.7rem 0!important}
  .support-modal-box .dj-fb-type{font-size:.95rem!important;padding:.55rem .9rem!important;white-space:nowrap!important;border-radius:2rem!important;min-height:44px!important;display:flex!important;align-items:center!important}
  .support-modal-box > div:last-child{display:flex!important;flex-direction:row!important;justify-content:flex-end!important;gap:.5rem!important;margin-top:.8rem!important;padding-top:.7rem!important;border-top:1px solid rgba(255,255,255,.12)!important}
  .support-modal-box > div:last-child button{font-size:1.05rem!important;padding:.75rem 1.4rem!important;min-height:48px!important;border-radius:.55rem!important}
  #booking-modal .support-modal-box{max-width:100%!important;padding:1.1rem 1rem!important}
  #booking-modal .support-modal-box h3{font-size:1.25rem!important;line-height:1.3!important}
  #booking-modal .support-modal-box p{font-size:.92rem!important;line-height:1.45!important;color:#c0c0c0!important}
  #booking-modal .support-modal-box input,#booking-modal .support-modal-box textarea{font-size:1.1rem!important;padding:.85rem .9rem!important;line-height:1.45!important}
  #booking-modal .support-modal-box input::placeholder,#booking-modal .support-modal-box textarea::placeholder{font-size:1rem!important;color:#999!important}
  #booking-modal .support-modal-box > div{flex-direction:column!important;gap:.55rem!important}
  #booking-modal .support-modal-box > div:last-child button{font-size:1rem!important;padding:.7rem 1.25rem!important;min-height:46px!important}
}
@media(max-width:360px) {
  .support-modal-box{padding:.9rem .8rem!important}
  .support-modal-box h3{font-size:1.25rem!important}
  .support-modal-box p{font-size:.88rem!important}
  .support-modal-box input,.support-modal-box textarea{font-size:1.05rem!important;padding:.8rem!important}
  .support-modal-box .dj-fb-type{font-size:.85rem!important;padding:.5rem .8rem!important;min-height:42px!important}
  .support-modal-box > div:last-child button{font-size:.95rem!important;padding:.65rem 1.15rem!important;min-height:44px!important}
}

