/* Картинка — только здесь. Фон экрана, не фон длинной ленты. */
:root {
  --kq-wallpaper: none;
  --kq-wallpaper-color: #1a0f14;
  --kq-avatar: url("avatar-1.jpg");
  --kq-frame: none;
  --kq-card-bg: none;
  --kq-blur: 14px;
  --kq-grain-opacity: 0.22;
}
body[data-skin="home"]   { --kq-wallpaper: url("background.jpg"); }
body[data-skin="notes"]  { --kq-wallpaper: url("notes-bg.jpg"); }
body[data-skin="dreams"] { --kq-wallpaper: url("dreams-bg.jpg"); }
body[data-skin="quotes"] { --kq-wallpaper: url("quotes-bg.jpg"); }
body[data-skin="about"]  { --kq-wallpaper: url("about-bg.jpg"); }

html, body { margin: 0; background: #000; }

.kq-bg {
  display: block !important;
  position: fixed !important;
  top: 42px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  pointer-events: none;
  background-color: var(--kq-wallpaper-color);
  background-image: var(--kq-wallpaper);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
.kq-bg::before {
  content: "";
  position: absolute;
  inset: -4%;
  background: inherit;
  background-size: cover;
  background-position: center;
  filter: blur(var(--kq-blur));
}
.kq-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: var(--kq-grain-opacity);
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

.kq-stage,
.hero,
.notes-page,
.about-page,
.quotes-page,
.kq-shell,
.dreams-shell {
  display: block;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
  margin: 42px 0 0 0 !important;
  min-height: calc(100vh - 42px);
  background: transparent !important;
  overflow: visible;
  border-radius: 0 0 30px 30px;
}

.kq-stage::before,
.hero::before,
.notes-page::before,
.about-page::before,
.quotes-page::before,
.kq-shell::before,
.dreams-shell::before,
.kq-stage::after,
.hero::after,
.notes-page::after,
.about-page::after,
.quotes-page::after,
.kq-shell::after,
.dreams-shell::after {
  content: none !important;
  display: none !important;
}

.kq-inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 58px 20px 80px;
  background: transparent !important;
  position: relative;
  z-index: 3;
}
.about-page > .kq-inner { max-width: 720px; }

.kq-grain,
.notes-bg, .notes-grain,
.about-bg, .about-grain,
.quotes-bg, .quotes-grain,
.hero-grain { display: none !important; }

.kq-title, .about-title, .site-title, .notes-title, .quotes-title,
.kq-tagline, .page-subtitle, .tagline, .kq-user, .diary-label {
  color: #111 !important;
  text-shadow: none !important;
}

.kq-bottom,
footer,
.support-line {
  position: relative;
  z-index: 20;
  background: #000 !important;
}

body[data-skin="home"] .site-title {
  padding: 48px 24px 0 !important;
}
body[data-skin="home"] { --kq-grain-opacity: 0.16; }
