/* 每顆星：純 CSS 定位 + 各自 delay */
  .star {
    position: absolute;
    width: 3px;
    height: 3px;
    background: #fff;
    border-radius: 50%;
    animation: star 2s ease-in-out infinite;
  }

  @keyframes star {
    0%, 100% { opacity: 0;   box-shadow: 0 0 2px #fff; }
    50%       { opacity: 1;   box-shadow: 0 0 6px 2px #fff; }
  }

  /* 大一點的星 */
  .star.lg {
    width: 5px;
    height: 5px;
  }

  /* 金色 */
  .star.gold {
    background: #ffe080;
    animation-name: star-gold;
  }
  @keyframes star-gold {
    0%, 100% { opacity: 0;   box-shadow: 0 0 2px #ffe080; }
    50%       { opacity: 1;   box-shadow: 0 0 8px 3px #ffe080; }
  }

  /* 紫色 */
  .star.purple {
    background: #cc99ff;
    animation-name: star-purple;
  }
  @keyframes star-purple {
    0%, 100% { opacity: 0;   box-shadow: 0 0 2px #cc99ff; }
    50%       { opacity: 1;   box-shadow: 0 0 8px 3px #cc99ff; }
  }

  /* 各自的 delay */
  .star:nth-child(1)  { top:  5%; left: 10%; animation-duration: 2.1s; animation-delay: 0s;    }
  .star:nth-child(2)  { top:  8%; left: 25%; animation-duration: 1.8s; animation-delay: -0.5s; }
  .star:nth-child(3)  { top:  3%; left: 40%; animation-duration: 2.4s; animation-delay: -1.2s; }
  .star:nth-child(4)  { top: 12%; left: 55%; animation-duration: 1.6s; animation-delay: -0.3s; }
  .star:nth-child(5)  { top:  6%; left: 70%; animation-duration: 2.2s; animation-delay: -1.8s; }
  .star:nth-child(6)  { top: 15%; left: 82%; animation-duration: 1.9s; animation-delay: -0.7s; }
  .star:nth-child(7)  { top: 20%; left:  5%; animation-duration: 2.5s; animation-delay: -2.1s; }
  .star:nth-child(8)  { top: 22%; left: 18%; animation-duration: 1.7s; animation-delay: -0.9s; }
  .star:nth-child(9)  { top: 18%; left: 33%; animation-duration: 2.3s; animation-delay: -1.5s; }
  .star:nth-child(10) { top: 25%; left: 48%; animation-duration: 2.0s; animation-delay: -0.4s; }
  .star:nth-child(11) { top: 10%; left: 62%; animation-duration: 1.8s; animation-delay: -2.4s; }
  .star:nth-child(12) { top: 28%; left: 75%; animation-duration: 2.6s; animation-delay: -1.1s; }
  .star:nth-child(13) { top: 30%; left: 90%; animation-duration: 1.5s; animation-delay: -0.6s; }
  .star:nth-child(14) { top: 35%; left:  2%; animation-duration: 2.2s; animation-delay: -1.9s; }
  .star:nth-child(15) { top: 38%; left: 14%; animation-duration: 1.9s; animation-delay: -0.2s; }
  .star:nth-child(16) { top: 32%; left: 28%; animation-duration: 2.7s; animation-delay: -2.6s; }
  .star:nth-child(17) { top: 42%; left: 42%; animation-duration: 1.6s; animation-delay: -1.3s; }
  .star:nth-child(18) { top: 40%; left: 58%; animation-duration: 2.1s; animation-delay: -0.8s; }
  .star:nth-child(19) { top: 45%; left: 72%; animation-duration: 1.8s; animation-delay: -2.0s; }
  .star:nth-child(20) { top: 48%; left: 88%; animation-duration: 2.4s; animation-delay: -1.4s; }
  .star:nth-child(21) { top: 55%; left:  8%; animation-duration: 2.0s; animation-delay: -0.1s; }
  .star:nth-child(22) { top: 52%; left: 22%; animation-duration: 1.7s; animation-delay: -1.7s; }
  .star:nth-child(23) { top: 60%; left: 36%; animation-duration: 2.3s; animation-delay: -2.3s; }
  .star:nth-child(24) { top: 58%; left: 50%; animation-duration: 1.5s; animation-delay: -0.5s; }
  .star:nth-child(25) { top: 62%; left: 65%; animation-duration: 2.8s; animation-delay: -1.6s; }
  .star:nth-child(26) { top: 65%; left: 80%; animation-duration: 1.9s; animation-delay: -2.2s; }
  .star:nth-child(27) { top: 70%; left:  3%; animation-duration: 2.1s; animation-delay: -0.9s; }
  .star:nth-child(28) { top: 72%; left: 17%; animation-duration: 1.6s; animation-delay: -1.0s; }
  .star:nth-child(29) { top: 68%; left: 30%; animation-duration: 2.5s; animation-delay: -2.5s; }
  .star:nth-child(30) { top: 75%; left: 45%; animation-duration: 1.8s; animation-delay: -0.3s; }
  .star:nth-child(31) { top: 78%; left: 60%; animation-duration: 2.2s; animation-delay: -1.8s; }
  .star:nth-child(32) { top: 80%; left: 78%; animation-duration: 1.7s; animation-delay: -2.7s; }
  .star:nth-child(33) { top: 85%; left: 92%; animation-duration: 2.0s; animation-delay: -0.7s; }
  .star:nth-child(34) { top: 88%; left: 12%; animation-duration: 2.6s; animation-delay: -1.2s; }
  .star:nth-child(35) { top: 90%; left: 35%; animation-duration: 1.5s; animation-delay: -2.0s; }
  .star:nth-child(36) { top: 92%; left: 55%; animation-duration: 2.3s; animation-delay: -0.4s; }
  .star:nth-child(37) { top: 95%; left: 70%; animation-duration: 1.9s; animation-delay: -1.5s; }
  .star:nth-child(38) { top: 14%; left: 95%; animation-duration: 2.4s; animation-delay: -2.9s; }
  .star:nth-child(39) { top: 50%; left: 95%; animation-duration: 1.6s; animation-delay: -0.6s; }
  .star:nth-child(40) { top: 82%; left: 48%; animation-duration: 2.1s; animation-delay: -1.1s; }