[hidden] {
  display: none !important;
}

.ckn-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  /* Выше нижней таб-панели сайта (.gmbn, z-index: 9999), но ниже
     плавающей кнопки переключения темы (z-index: 99999) — она должна
     всегда оставаться кликабельной поверх баннера. */
  z-index: 20000;
  color: #1f2328;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(180%) blur(16px);
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  border-top: .5px solid rgba(0, 0, 0, .1);
  opacity: 0;
  transform: translateY(100%);
  transition: opacity .25s ease, transform .25s ease;
}
.ckn-banner.ckn-banner--visible {
  opacity: 1;
  transform: translateY(0);
}
body.gdt-dark .ckn-banner {
  color: #e6e8eb;
  background: rgba(18, 18, 20, .92);
  border-top-color: rgba(255, 255, 255, .12);
}

.ckn-banner__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: .5rem 1rem calc(.5rem + env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
}

.ckn-banner__text {
  /* Не растягиваем на всю ширину — иначе кнопка "уезжает"
     далеко от конца текста на широких экранах. */
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
  font-size: .72rem;
  line-height: 1.4;
}
.ckn-banner__text a {
  color: var(--gk-app-accent, #0b008a);
  text-decoration: underline;
  text-underline-offset: 2px;
}
body.gdt-dark .ckn-banner__text a {
  color: #9d90ff;
}

.ckn-banner__btn {
  -webkit-appearance: none;
  appearance: none;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .32rem .95rem;
  font-family: inherit;
  font-size: .74rem;
  line-height: 1;
  font-weight: 700;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: transparent;
  /* Наследует цвет от .ckn-banner: чёрный на светлой теме, белый на тёмной. */
  color: inherit;
  cursor: pointer;
  transition: opacity .12s ease, transform .06s ease, background-color .12s ease;
}
.ckn-banner__btn:hover { background-color: rgba(0, 0, 0, .08); }
body.gdt-dark .ckn-banner__btn:hover { background-color: rgba(255, 255, 255, .12); }
.ckn-banner__btn:active { transform: translateY(1px) scale(.98); }

@media (max-width: 480px) {
  .ckn-banner__text {
    font-size: .64rem;
  }
}
