/* ===========================
   FONT
=========================== */
@font-face {
  font-family: 'Singulier';
  src: url('singulier.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

html, body, input, button, div, p, h1, h2, h3, h4, h5, h6 {
  font-family: 'Singulier', sans-serif;
  margin: 0;
  padding: 0;
}

/* ===========================
   LOGO (róg ekranu)
=========================== */
#cornerImage {
  position: absolute;
  top: calc(2 * var(--vvh) * var(--ui-images));
  right: calc(2 * var(--vvw) * var(--ui-images));
  height: calc(15 * var(--vvh) * var(--ui-images));
  z-index: 1000;
  pointer-events: none;
}

/* ===========================
   PRZEŁĄCZNIK JĘZYKA
=========================== */
.lang-switch {
  position: absolute;
  top: calc(2 * var(--vvh));
  left: calc(2 * var(--vvw));
  display: flex;
  gap: calc(1.5 * var(--vvw));
  z-index: 1000;
}

/* ===========================
   PRZYCISKI JĘZYKA
=========================== */
.lang-switch .lang-btn {
  width: calc(4 * var(--vvw) * var(--ui-buttons));
  aspect-ratio: 1 / 1;
  cursor: pointer;
  user-select: none;
}