/* POINT MODE: один цельный фон под всем сайтом */

.page-skin{
  position: fixed;
  inset: 0;
  z-index: 0;              /* фон снизу, но не "в минус" */
}

/* скрываем скин на страницах без него */
body:not(.has-page-skin) .page-skin{
  display: none;
}

.page-skin__media{
  position: absolute;
  inset: 0;
  background-image: var(--skin-image);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  pointer-events: none; /* фон не кликается */
}

/* если в HTML есть <img>/<video> — прячем, чтобы не мешали */
.page-skin__media img,
.page-skin__media video{
  display: none !important;
}

/* кликабельные "ушки" */
.page-skin__side{
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 1;              /* выше фона */
  pointer-events: auto;    /* кликаются */
}

/* контент сайта выше всего */
.ip-page{
  position: relative;
  z-index: 2;
}

/* ПРОЗРАЧНОСТЬ/СТЕКЛО только там, где включён skin */
body.has-page-skin .ip-page{
  background: rgba(255,255,255,.92) !important; /* или transparent */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.page-skin__side--left{ left: 0; }
.page-skin__side--right{ right: 0; }