:root {
  --brand-cyan: 20, 222, 255;
  --brand-pink: 254, 27, 187;
  --brand-violet: 172, 29, 253;
  --brand-blue: 54, 67, 255;

  --bg-base: #fbfbff;
  --bg-soft: #f4f7ff;
  --bg-lilac: #faf6ff;
  --text-main: #2a3150;
}

html,
body {
  min-height: 100%;
}

body {
  position: relative;
  min-height: 100vh;
  overflow-x: hidden;
  background-color: var(--bg-base);
  background-image:
    radial-gradient(circle at 50% 34%, rgba(255,255,255,0.96) 0%, rgba(255,255,255,0.82) 20%, rgba(255,255,255,0) 46%),
    radial-gradient(circle at 14% 18%, rgba(var(--brand-pink), 0.14) 0%, rgba(var(--brand-pink), 0) 34%),
    radial-gradient(circle at 26% 70%, rgba(var(--brand-cyan), 0.12) 0%, rgba(var(--brand-cyan), 0) 36%),
    radial-gradient(circle at 76% 72%, rgba(var(--brand-violet), 0.18) 0%, rgba(var(--brand-violet), 0) 34%),
    radial-gradient(circle at 88% 84%, rgba(var(--brand-pink), 0.11) 0%, rgba(var(--brand-pink), 0) 30%),
    radial-gradient(circle at 82% 24%, rgba(var(--brand-blue), 0.10) 0%, rgba(var(--brand-blue), 0) 30%),
    linear-gradient(135deg, #fdfcff 0%, #f3f6ff 34%, #f9f4ff 68%, #eef5ff 100%);
  color: var(--text-main);
}

/* Фоновый слой */
#tilda-site-bg {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

/* Контент Tilda выше фона */
#allrecords {
  position: relative;
  z-index: 1;
  background: transparent !important;
}

.t-records {
  position: relative;
  z-index: 1;
}

/* Частицы */
#particles-js {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* Орбы */
#tilda-site-bg .orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(125px);
  pointer-events: none;
}

#tilda-site-bg .orb-1 {
  top: -180px;
  left: -160px;
  width: 520px;
  height: 520px;
  background: rgba(var(--brand-pink), 0.14);
}

#tilda-site-bg .orb-2 {
  bottom: -260px;
  right: -140px;
  width: 720px;
  height: 720px;
  background: rgba(var(--brand-blue), 0.11);
}

#tilda-site-bg .orb-3 {
  top: 45%;
  left: 58%;
  width: 440px;
  height: 440px;
  background: rgba(var(--brand-violet), 0.12);
}

/* Чтобы стандартные фоны Tilda не мешали, если где-то нужно прозрачнее —
   фон у конкретных блоков лучше выключать вручную в редакторе */

/* Мобильная версия */
@media (max-width: 980px) {
  #tilda-site-bg .orb-1 {
    width: 380px;
    height: 380px;
    top: -120px;
    left: -120px;
  }

  #tilda-site-bg .orb-2 {
    width: 520px;
    height: 520px;
    bottom: -180px;
    right: -120px;
  }

  #tilda-site-bg .orb-3 {
    display: none;
  }
}

@media (max-width: 640px) {
  #tilda-site-bg .orb-1 {
    width: 320px;
    height: 320px;
  }

  #tilda-site-bg .orb-2 {
    width: 420px;
    height: 420px;
  }
}