<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>pink nebula</title>
<style>
  body {
    margin: 0;
    font-family: 'Comic Sans MS', sans-serif;
    background: #ffdaf2 url('https://i.imgur.com/qAvZQ2s.png') repeat;
    color: #4a003d;
  }
  .nebula {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: radial-gradient(circle at 40% 30%, rgba(255,170,220,0.6), transparent 60%),
                radial-gradient(circle at 70% 70%, rgba(255,200,240,0.4), transparent 70%);
    pointer-events: none;
    z-index: -1;
  }
  .twinkle {
    position: fixed;
    width: 100%; height: 100%;
    background-image: url('https://i.imgur.com/2RKF5zO.gif');
    opacity: 0.3;
    pointer-events: none;
    z-index: -1;
  }
  header {
    text-align: center;
    padding: 20px;
  }
  h1 { font-size: 2rem; }
  .projects, .gallery {
    margin: 20px auto;
    width: 90%;
    background: rgba(255,230,245,0.8);
    padding: 20px;
    border-radius: 20px;
  }
  .item {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 1.1rem;
  }
  .icon {
    font-size: 1.5rem;
  }
  .comet {
    position: fixed;
    animation: flyby 12s linear infinite;
    top: 20%; left: -10%; font-size: 2.5rem;
  }
  @keyframes flyby {
    0% { transform: translateX(0); opacity: 0; }
    20% { opacity: 1; }
    100% { transform: translateX(120vw); opacity: 0; }
  }
  .bio {
    margin: 20px auto;
    width: 90%;
    background: rgba(255,230,245,0.8);
    padding: 20px;
    border-radius: 20px;
    font-size: 1.1rem;
  }
</style>
</head>
<body>
<div class="nebula"></div>
<div class="twinkle"></div>
<div class="comet">☄️</div>
<header>
  <h1>My Pink Space Corner</h1>
</header>
<section class="projects h-entry">
  <h2>Projects</h2>
  <div class="item"><span class="icon">🪐</span>journal</div>
  <div class="item"><span class="icon">✨</span>Soft nebula wallpapers</div>
  <div class="item"><span class="icon">🔭</span>Retro sci-fi mockups</div>
</section>
<section class="gallery">
  <h2>Gallery</h2>
  <div class="item"><span class="icon">🪐</span>Cosmic doodles</div>
  <div class="item"><span class="icon">✨</span>Character sketches</div>
  <div class="item"><span class="icon">🔭</span>Pixel art experiments</div>
</section>
<section class="bio">
  <h2>About Me</h2>
  <p>Hi! I'm v (username: istricorder-angel). I make soft, personal spacey art. I also enjoy fandom stuff, but mostly I just like keeping my little pink corner of the internet cozy and creative.</p>
</section>
<footer style="text-align:center; padding:20px;">
  <p class="h-card">Made by <strong class="p-name">v</strong> — cozy, personal, cute, and pixel-friendly.</p>
</footer>
</body>
</html>


h2 {
  position: relative;
  padding-left: 32px; /* space so the bow doesn’t overlap the text */
}

h2::before {
  content: "";
  width: 24px;
  height: 24px;
  background: url("https://i.imgur.com/ygA3fD8.png") no-repeat center/contain;
  position: absolute;
  left: 0;
  top: 0;
}
