body {
  margin: 0;
  min-height: 100vh;
  background-color: #0c030d; /* Цвет швов витража */
  position: relative;
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;

  /* 1. ГРАДИЕНТ (как ты просила) */
  background: linear-gradient(225deg, #0c030d,#320b35, #57165e, #9b59b6,  #d154b8);
  
  /* 2. ЭФФЕКТ ВИТРАЖА (Пикселизация) */
  /* Мы сжимаем фон и растягиваем его обратно через мозаичный фильтр */
  /* В CSS это проще всего имитировать через наложение сетки с "умным" смешиванием */
  background-size: 100% 100%;
}

/* 3. САМА СЕТКА ВИТРАЖА */
body::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  
  --line: #080207; /* Цвет контура */
  --size: 25px;    /* Размер кусочка витража */

  background-image: 
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: var(--size) var(--size);
  
  /* Магия: этот режим "дробит" градиент под сеткой на блоки */
  backdrop-filter: contrast(120%) brightness(110%); 
}