/* NYX — sticker-collage / scribble dividers / hot pink + black
   Palette: hot pink #ff2db8, UV green #b6ff3a, glitch purple #8a2bff, electric blue #00d1ff
   Display: marker/handwritten stack. Body: monospace nod to brainrot captions. */

.artist-nyx {
  --accent: #ff2db8;
  --uv: #b6ff3a;
  --glitch: #8a2bff;
  --bolt: #00d1ff;
  --paper: #07060a;
  --ink: #fff5fb;
  --rule: #1a0e18;
  background:
    radial-gradient(620px 360px at 12% 10%, rgba(255,45,184,0.22), transparent 60%),
    radial-gradient(540px 320px at 88% 30%, rgba(138,43,255,0.20), transparent 60%),
    radial-gradient(700px 380px at 60% 100%, rgba(0,209,255,0.16), transparent 60%),
    var(--paper);
  color: var(--ink);
}
.artist-nyx .ar { max-width: 980px; margin: 0 auto; display: flex; flex-direction: column; gap: 28px; }
.artist-nyx h1, .artist-nyx h2, .artist-nyx h3 {
  font-family: "Permanent Marker", "Marker Felt", "Comic Sans MS", cursive;
  margin: 0 0 10px;
}
.artist-nyx .ar-roles, .artist-nyx .ar-genre,
.artist-nyx .ar-top__by, .artist-nyx .ar-top__note,
.artist-nyx .ar-rel__moods {
  font-family: ui-monospace, "Cascadia Mono", "Courier New", monospace;
}

/* scribble divider — inline SVG as background */
.artist-nyx section + section {
  padding-top: 22px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 18'><path d='M2 14 Q 30 2 60 12 T 120 12 T 180 12 T 240 12 T 300 12 T 360 12 T 420 12 T 480 12 T 540 12 T 598 12' fill='none' stroke='%23ff2db8' stroke-width='3' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat; background-size: 100% 18px; background-position: top center;
}

.artist-nyx .ar-id {
  background: var(--accent); color: #100008;
  padding: 24px; border: 3px solid #100008;
  transform: rotate(-1.2deg);
  box-shadow: 12px 12px 0 var(--uv);
  display: grid; grid-template-columns: 160px 1fr; gap: 20px; align-items: center;
}
.artist-nyx .ar-id img { border: 3px solid #100008; transform: rotate(2deg); background: #fff; }
.artist-nyx .ar-name { font-size: clamp(2.6rem, 6vw, 4.6rem); line-height: 0.95; transform: rotate(-1deg); }

.artist-nyx .ar-blurb { transform: rotate(0.6deg); background: #14080f; padding: 22px; border: 2px solid var(--accent); border-radius: 4px; }
.artist-nyx .ar-going { transform: rotate(-0.8deg); background: var(--uv); color: #050a00; padding: 22px; border: 2px solid #050a00; border-radius: 4px; }
.artist-nyx .ar-going h2, .artist-nyx .ar-going p { color: #050a00; }
.artist-nyx .ar-sound { transform: rotate(0.4deg); padding: 18px; border: 2px dashed var(--bolt); border-radius: 6px; }
.artist-nyx .ar-influences { transform: rotate(-0.4deg); background: #0e0612; padding: 22px; border: 2px solid var(--glitch); }
.artist-nyx .ar-top { padding: 22px; border: 3px solid var(--accent); border-radius: 4px; background: #0c0509; }
.artist-nyx .ar-off { transform: rotate(0.8deg); background: var(--bolt); color: #001218; padding: 22px; border: 2px solid #001218; }
.artist-nyx .ar-off h2, .artist-nyx .ar-off li { color: #001218; }
.artist-nyx .ar-releases { transform: rotate(-0.6deg); padding: 20px; border: 2px solid var(--uv); }
.artist-nyx .ar-producer { transform: rotate(0.5deg); padding: 16px; border: 2px solid var(--accent); }

.artist-nyx h2 { color: var(--accent); font-size: 1.7rem; }
.artist-nyx .ar-influences h2 { color: var(--glitch); }
.artist-nyx .ar-top h2 { color: var(--uv); }

.artist-nyx .sf-tag {
  background: #100008; color: var(--uv);
  border: 2px solid var(--uv); border-radius: 999px;
  padding: 4px 12px; font-weight: 700;
}
.artist-nyx a { color: var(--bolt); text-decoration-thickness: 2px; }
.artist-nyx a:hover { color: var(--uv); text-shadow: 2px 0 var(--accent), -2px 0 var(--glitch); }

.artist-nyx .ar-infl-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.artist-nyx .ar-infl-cols ul { padding-left: 18px; margin: 0; }
.artist-nyx .ar-top__list { padding-left: 22px; }
.artist-nyx .ar-top__list li { margin-bottom: 12px; }
.artist-nyx .ar-top__title { font-weight: 800; font-family: "Permanent Marker", cursive; }

.artist-nyx .ar-releases__grid { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
.artist-nyx .ar-rel { background: #14080f; border: 2px solid var(--accent); padding: 14px; transform: rotate(-0.4deg); }
.artist-nyx .ar-rel:nth-child(even) { transform: rotate(0.6deg); }
.artist-nyx .ar-rel:hover { filter: drop-shadow(2px 0 var(--accent)) drop-shadow(-2px 0 var(--bolt)); }

@media (prefers-reduced-motion: reduce) {
  .artist-nyx .ar-id, .artist-nyx .ar-blurb, .artist-nyx .ar-going,
  .artist-nyx .ar-sound, .artist-nyx .ar-influences,
  .artist-nyx .ar-off, .artist-nyx .ar-releases, .artist-nyx .ar-producer,
  .artist-nyx .ar-rel { transform: none !important; }
  .artist-nyx .ar-rel:hover { filter: none; }
}
@media (max-width: 720px) {
  .artist-nyx .ar-id { grid-template-columns: 1fr; text-align: center; }
  .artist-nyx .ar-id img { margin: 0 auto; }
  .artist-nyx .ar-infl-cols { grid-template-columns: 1fr; }
  .artist-nyx .ar-releases__grid { grid-template-columns: 1fr; }
}
