/* Pixel star-system theme module for Linkify */

body[data-theme="PixelStarSystem"] {
  --shell-top: #090b1b;
  --shell-bottom: #11193a;
  --panel-bg: #ccd0d9;
  --pill-bg: rgba(255, 255, 255, 0.14);
  --pill-border: rgba(28, 34, 46, 0.58);
  --frame-border: rgba(28, 34, 46, 0.58);
  --ink: #172031;
  --ink-soft: rgba(23, 32, 49, 0.9);
}

body[data-theme="PixelStarSystem"]::before,
body[data-theme="PixelStarSystem"]::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
}

body[data-theme="PixelStarSystem"]::before {
  width: 2px;
  height: 2px;
  background: #ffffff;
  box-shadow:
    8vw 12vh #ffffff, 16vw 30vh #8fd7ff, 25vw 18vh #ffffff, 34vw 44vh #ffd679,
    42vw 16vh #9a7bff, 50vw 28vh #ffffff, 58vw 10vh #5ac8ff, 68vw 22vh #ffffff,
    76vw 14vh #ff82c9, 84vw 34vh #ffffff, 92vw 20vh #8fd7ff, 12vw 62vh #ffffff,
    20vw 74vh #ffd679, 30vw 66vh #ffffff, 40vw 84vh #9a7bff, 52vw 72vh #ffffff,
    63vw 80vh #5ac8ff, 74vw 90vh #ffffff, 86vw 70vh #ff82c9, 94vw 86vh #ffffff,
    4vw 26vh #ffffff, 11vw 46vh #8fd7ff, 22vw 52vh #ffffff, 27vw 8vh #ffd679,
    36vw 30vh #9a7bff, 45vw 48vh #ffffff, 56vw 58vh #5ac8ff, 65vw 42vh #ffffff,
    71vw 60vh #ff82c9, 79vw 8vh #ffffff, 88vw 54vh #8fd7ff, 96vw 38vh #ffffff,
    7vw 92vh #ffd679, 18vw 84vh #ffffff, 33vw 94vh #9a7bff, 47vw 88vh #ffffff,
    59vw 96vh #5ac8ff, 69vw 86vh #ffffff, 81vw 94vh #ff82c9, 91vw 98vh #ffffff;
  opacity: 0.9;
  animation: pixelTwinkleA 1.2s steps(2, end) infinite;
}

body[data-theme="PixelStarSystem"]::after {
  width: 3px;
  height: 3px;
  background: #c6ebff;
  box-shadow:
    6vw 8vh #c6ebff, 18vw 40vh #9a7bff, 28vw 24vh #c6ebff, 38vw 56vh #5ac8ff,
    48vw 8vh #ffd679, 62vw 36vh #c6ebff, 72vw 18vh #ff82c9, 82vw 42vh #c6ebff,
    90vw 12vh #5ac8ff, 14vw 88vh #c6ebff, 32vw 78vh #ffd679, 54vw 92vh #c6ebff,
    78vw 74vh #9a7bff, 88vw 84vh #c6ebff, 10vw 22vh #c6ebff, 24vw 36vh #9a7bff,
    44vw 20vh #c6ebff, 57vw 44vh #5ac8ff, 67vw 30vh #ffd679, 76vw 52vh #ff82c9,
    86vw 26vh #c6ebff, 94vw 46vh #5ac8ff, 22vw 96vh #c6ebff, 42vw 84vh #ffd679,
    64vw 98vh #9a7bff, 84vw 92vh #c6ebff;
  opacity: 0.5;
  animation: pixelTwinkleB 1.8s steps(2, end) infinite;
}

body[data-theme="PixelStarSystem"] .phone-frame::before {
  background:
    linear-gradient(180deg, rgba(211, 215, 216, 0.08), rgba(211, 215, 216, 0.08)),
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.18) 0 1px, transparent 1px),
    radial-gradient(circle at 26% 12%, rgba(255, 255, 255, 0.12) 0 1px, transparent 1px),
    radial-gradient(circle at 38% 22%, rgba(255, 255, 255, 0.15) 0 1px, transparent 1px),
    radial-gradient(circle at 54% 16%, rgba(255, 255, 255, 0.12) 0 1px, transparent 1px),
    radial-gradient(circle at 68% 24%, rgba(255, 255, 255, 0.16) 0 1px, transparent 1px),
    radial-gradient(circle at 82% 14%, rgba(255, 255, 255, 0.12) 0 1px, transparent 1px),
    radial-gradient(circle at 18% 72%, rgba(255, 255, 255, 0.14) 0 1px, transparent 1px),
    radial-gradient(circle at 44% 80%, rgba(255, 255, 255, 0.12) 0 1px, transparent 1px),
    radial-gradient(circle at 76% 76%, rgba(255, 255, 255, 0.15) 0 1px, transparent 1px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0 2px, transparent 2px 6px);
  opacity: 0.42;
}

@keyframes pixelTwinkleA {
  0%, 100% { opacity: 0.9; }
  50% { opacity: 0.52; }
}

@keyframes pixelTwinkleB {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 0.24; }
}
