/* ------------------ BODY & FONT ------------------ */
body, html{
  margin:0; padding:0; height:100%; overflow:hidden;
  font-family:'Orbitron','Press Start 2P','Fredericka the Great',cursive;
  background:#1b0033; 
  color:white;
}

/* Canvas covers whole screen */
#particleLayer{
  position:fixed;
  top:0; left:0; width:100%; height:100%; z-index:0;
}

/* Sidebar aesthetic fixed texts */
.sidebar{
  position:fixed;
  top:50px; left:10px;
  width:220px;
  display:flex; flex-direction:column;
  gap:12px;
  z-index:5;
}
.floating-text-fixed{
  font-size:14px; line-height:1.3;
  color:#ffccff;
  font-family:'Fredericka the Great', cursive;
  text-shadow:0 0 6px #ff99ff,0 0 12px #ff66ff;
}

/* Floating text copies */
.floating-text{
  position:absolute;
  font-size:16px;
  color:#99ccff;
  font-family:'Fredericka the Great', cursive;
  text-shadow:0 0 6px #66ffff,0 0 12px #66ccff;
  pointer-events:none;
  z-index:4;
}

/* Draggable PicMix GIFs and blinkies */
.draggable{
  position:absolute;
  cursor:grab;
  z-index:3;
}
.draggable:active{
  cursor:grabbing;
}
.sparkle{
  animation: pulse 2s infinite alternate;
}
@keyframes pulse{
  0%{transform:scale(1);}
  50%{transform:scale(1.08);}
  100%{transform:scale(1);}
}

/* Blinkies */
.blinkies-row{
  display:flex;
  gap:12px;
  background:rgba(0,0,0,0.15);
  padding:6px; border-radius:10px;
}

/* Selector centrēts augšā */
.selector{
  position:fixed;
  top:10px;
  left:50%;
  transform:translateX(-50%);
  z-index:10;
  background:rgba(0,0,0,0.2);
  padding:6px 12px;
  border-radius:8px;
  font-size:16px;
}

/* Header – liels, neons, pulsējošs */
.sparkle-header{
  position:fixed;
  top:60px;
  left:50%;
  transform:translateX(-50%);
  font-size:64px;
  color:#d580ff; /* lilac */
  text-shadow:
    0 0 5px #d580ff,
    0 0 10px #cc66ff,
    0 0 20px #b84dff,
    0 0 40px #9933ff;
  z-index:9;
  animation: pulseHeader 2s infinite;
  white-space: nowrap;
}

@keyframes pulseHeader{
  0%{
    text-shadow:0 0 5px #d580ff,0 0 10px #cc66ff,0 0 20px #b84dff,0 0 40px #9933ff;
    transform:translateX(-50%) scale(1);
  }
  50%{
    text-shadow:0 0 10px #e699ff,0 0 20px #cc66ff,0 0 30px #b84dff,0 0 50px #9933ff;
    transform:translateX(-50%) scale(1.08);
  }
  100%{
    text-shadow:0 0 5px #d580ff,0 0 10px #cc66ff,0 0 20px #b84dff,0 0 40px #9933ff;
    transform:translateX(-50%) scale(1);
  }
}

/* Spotify panel – fiksēts labajā sānā */
.spotify-panel{
  position: fixed;
  top:150px;
  right:20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index:10;
}
.spotify-embed{
  width:300px;
  height:80px;
}