:root {
  color-scheme: dark;
  --bg: #050505;
  --panel: rgba(8, 8, 8, .58);
  --line: rgba(255, 255, 255, .12);
  --text: #f5f5f0;
  --muted: rgba(245, 245, 240, .62);
  --muted-2: rgba(245, 245, 240, .42);
  --shadow: 0 24px 90px rgba(0,0,0,.44);
  --topbar-h: 62px;
  --dock-h: 132px;
  --footer-h: 34px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
}

body {
  overflow: hidden;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
}

a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { border: 0; }

.site-shell {
  min-height: 100vh;
  display: grid;
  grid-template-rows: var(--topbar-h) minmax(0, 1fr) var(--footer-h);
  background: #050505;
}

.site-topbar {
  position: relative;
  z-index: 30;
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: rgba(5, 5, 5, .76);
  backdrop-filter: blur(22px);
}

.brand {
  display: inline-flex;
  flex-direction: column;
  width: fit-content;
  line-height: 1;
}

.brand-main {
  font-size: 1.02rem;
  font-weight: 760;
  letter-spacing: -.04em;
}

.brand-sub {
  margin-top: 4px;
  color: var(--muted-2);
  font-size: .72rem;
  letter-spacing: .04em;
}

.category-filter {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  min-width: 0;
}

.category-filter::-webkit-scrollbar { display: none; }

.category-button,
.icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  white-space: nowrap;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 12px;
  color: var(--muted);
  background: rgba(255,255,255,.045);
  cursor: pointer;
  font-size: .82rem;
  line-height: 1;
}

.category-button:hover,
.icon-button:hover {
  color: var(--text);
  background: rgba(255,255,255,.09);
}

.category-button.active {
  color: #050505;
  background: var(--text);
  border-color: var(--text);
}

.top-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.viewer-area {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) var(--dock-h);
}

.viewer-frame {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: #000;
}

.stage-layer,
#viewer,
.media-stage {
  width: 100%;
  height: 100%;
  min-height: 0;
}

#viewer { overflow: hidden; }

.hidden { display: none !important; }

.media-stage {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: stretch;
  overflow: hidden;
  touch-action: none;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.06), transparent 34rem), #030303;
}

.media-stage img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  transform-origin: 50% 50%;
  transition: transform .12s ease-out;
  user-select: none;
  -webkit-user-drag: none;
  cursor: grab;
  will-change: transform;
  background: #030303;
}

.media-stage img.dragging {
  cursor: grabbing;
  transition: none;
}

.media-stage.wide-mode img {
  width: auto;
  height: 100%;
  max-width: none;
  object-fit: unset;
  justify-self: center;
  align-self: center;
  cursor: ew-resize;
}

.media-toolbar {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 12;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(5,5,5,.64);
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow);
}

.media-toolbar span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-inline: 8px;
  color: var(--muted);
  font-size: .84rem;
}

.media-controls {
  display: flex;
  gap: 6px;
  flex-wrap: nowrap;
}

.media-controls .icon-button {
  min-height: 30px;
  padding-inline: 10px;
}

.caption-panel {
  position: absolute;
  left: 18px;
  bottom: 22px;
  z-index: 14;
  width: min(520px, calc(100% - 36px));
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(5,5,5,.54);
  backdrop-filter: blur(22px);
  box-shadow: var(--shadow);
  pointer-events: none;
}

.viewer-frame:has(.media-stage:not(.hidden)) .caption-panel {
  bottom: 82px;
}

.caption-panel h1 {
  margin: 0;
  font-size: clamp(1.45rem, 3vw, 2.6rem);
  line-height: .98;
  letter-spacing: -.06em;
}

.caption-panel p {
  margin: 9px 0 0;
  color: var(--muted);
  line-height: 1.45;
  font-size: .94rem;
}

.viewer-meta {
  margin: 0 0 8px !important;
  color: var(--muted-2) !important;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-size: .66rem !important;
  font-weight: 800;
}

.viewer-status {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: grid;
  place-items: center;
  padding: 24px;
  color: var(--muted);
  background: rgba(0,0,0,.42);
  backdrop-filter: blur(6px);
  transition: opacity .18s ease, visibility .18s ease;
}

.viewer-status.hidden {
  display: grid !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.thumb-dock {
  min-width: 0;
  min-height: 0;
  border-top: 1px solid var(--line);
  background: rgba(5,5,5,.92);
}

.gallery-grid {
  display: flex;
  gap: 8px;
  height: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 12px 16px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.24) transparent;
}

.gallery-card {
  position: relative;
  flex: 0 0 180px;
  display: grid;
  grid-template-rows: 74px auto;
  gap: 8px;
  min-width: 0;
  height: 108px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 16px;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  text-align: left;
  overflow: hidden;
}

.gallery-card.active {
  border-color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.06);
}

.gallery-card:hover { background: rgba(255,255,255,.055); }

.gallery-thumb {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
}

.gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-category { display: none; }

.gallery-card strong {
  display: block;
  min-width: 0;
  padding: 0 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .82rem;
  font-weight: 650;
}

.gallery-card small { display: none; }

.gallery-type {
  position: absolute;
  top: 7px;
  left: 7px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  color: #050505;
  background: rgba(245,245,240,.88);
  backdrop-filter: blur(12px);
  font-size: .62rem;
  font-weight: 850;
  letter-spacing: .04em;
}

.gallery-type.type-planet {
  color: #1f1400;
  background: rgba(255, 215, 137, .9);
}

.gallery-type.type-wide {
  color: #00170f;
  background: rgba(128, 255, 202, .9);
}

.gallery-type.type-image {
  color: #08061b;
  background: rgba(190, 185, 255, .9);
}

.site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 16px;
  border-top: 1px solid var(--line);
  color: var(--muted-2);
  background: #050505;
  font-size: .72rem;
}

.psv-container { --psv-panel-background: rgba(5, 5, 5, 0.94); }

.hotspot-dot {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: #050505;
  background: var(--text);
  font-weight: 900;
  box-shadow: 0 12px 32px rgba(0,0,0,.4);
}

@media (max-width: 900px) {
  :root {
    --topbar-h: 104px;
    --dock-h: 120px;
  }

  .site-topbar {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    align-content: center;
  }

  .category-filter {
    grid-column: 1 / -1;
    order: 3;
  }

  .top-actions {
    grid-column: 2;
    grid-row: 1;
  }

  .gallery-card {
    flex-basis: 150px;
    height: 98px;
    grid-template-rows: 66px auto;
  }

  .caption-panel {
    left: 12px;
    right: 12px;
    bottom: 14px;
    width: auto;
    padding: 13px 14px;
  }
}

@media (max-width: 640px) {
  :root {
    --topbar-h: 96px;
    --dock-h: 104px;
    --footer-h: 0px;
  }

  .site-footer { display: none; }

  .site-topbar {
    padding: 8px 10px;
    gap: 8px;
  }

  .brand-sub,
  .admin-link { display: none; }

  .category-button,
  .icon-button {
    min-height: 30px;
    padding-inline: 9px;
    font-size: .76rem;
  }

  .caption-panel { display: none; }

  .gallery-grid { padding: 9px 10px; }

  .gallery-card {
    flex-basis: 132px;
    height: 86px;
    grid-template-rows: 58px auto;
    border-radius: 13px;
  }

  .gallery-thumb { border-radius: 12px; }

  .gallery-card strong { font-size: .76rem; }

  .media-toolbar {
    left: 8px;
    right: 8px;
    bottom: 8px;
    border-radius: 18px;
    align-items: flex-start;
  }

  .media-toolbar span { display: none; }

  .media-controls {
    width: 100%;
    overflow-x: auto;
  }
}


/* v5.5-minimal: tryb wystawowy, przełączniki i nawigacja */
.icon-button.active {
  color: #050505;
  background: var(--text);
  border-color: var(--text);
}

body.hide-thumbs {
  --dock-h: 0px;
}

body.hide-thumbs .thumb-dock {
  opacity: 0;
  overflow: hidden;
  border-top-color: transparent;
  pointer-events: none;
}

body.hide-captions .caption-panel {
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
}

.caption-panel {
  transition: opacity .18s ease, transform .18s ease;
}

.thumb-dock {
  transition: opacity .18s ease, border-color .18s ease;
}

.viewer-nav {
  position: absolute;
  inset: 0;
  z-index: 13;
  pointer-events: none;
}

.nav-button {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(5,5,5,.38);
  backdrop-filter: blur(16px);
  box-shadow: 0 18px 50px rgba(0,0,0,.26);
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  font-size: 1.1rem;
  transition: opacity .18s ease, background .18s ease, color .18s ease;
}

.nav-button:hover {
  color: var(--text);
  background: rgba(5,5,5,.66);
}

.nav-button.prev { left: 16px; }
.nav-button.next { right: 16px; }

.gallery-card.active .gallery-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid rgba(255,255,255,.86);
  border-radius: inherit;
  pointer-events: none;
}

@media (hover: hover) {
  .viewer-nav {
    opacity: .18;
    transition: opacity .18s ease;
  }

  .viewer-frame:hover .viewer-nav {
    opacity: 1;
  }
}

@media (max-width: 640px) {
  .nav-button {
    width: 38px;
    height: 38px;
    font-size: .95rem;
  }

  .nav-button.prev { left: 8px; }
  .nav-button.next { right: 8px; }

  body.hide-thumbs {
    --dock-h: 0px;
  }
}


/* v5.5.3-minimal: biały pasek i tekstowe linki zamiast przycisków */
:root {
  --topbar-h: 58px;
}

.site-topbar {
  color: #111;
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 8px 30px rgba(0,0,0,.08);
}

.brand-main {
  color: #111;
}

.brand-sub {
  color: rgba(0,0,0,.48);
}

.category-filter {
  gap: 18px;
}

.category-button,
.icon-button {
  min-height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: rgba(0,0,0,.58);
  background: transparent;
  font-size: .86rem;
  font-weight: 620;
  letter-spacing: -.015em;
}

.category-button:hover,
.icon-button:hover {
  color: #000;
  background: transparent;
}

.category-button.active,
.icon-button.active {
  color: #000;
  background: transparent;
  border-color: transparent;
}

.category-button.active::after,
.icon-button.active::after {
  content: "";
  display: block;
  height: 1px;
  margin-top: 4px;
  background: #000;
}

.top-actions {
  gap: 16px;
}

.admin-link {
  color: rgba(0,0,0,.42);
}

@media (max-width: 900px) {
  :root {
    --topbar-h: 96px;
  }

  .category-filter {
    gap: 14px;
  }
}

@media (max-width: 640px) {
  :root {
    --topbar-h: 84px;
  }

  .category-button,
  .icon-button {
    font-size: .78rem;
  }

  .top-actions {
    gap: 10px;
  }
}


/* v5.5.4-minimal: statyczna biała belka, Arial i plain-text linki */
:root {
  color-scheme: light !important;
  --topbar-h: 64px;
}

html,
body,
button,
input,
textarea,
select {
  font-family: Arial, Helvetica, sans-serif !important;
}

.site-topbar {
  background: #ffffff !important;
  color: #000000 !important;
  border-bottom: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.brand-main {
  color: #000000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1.08rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.brand-sub {
  color: #444444 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .82rem !important;
  letter-spacing: 0 !important;
}

.category-filter {
  gap: 24px !important;
}

.category-button,
.icon-button,
.admin-link {
  appearance: none !important;
  -webkit-appearance: none !important;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #111111 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1.02rem !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

.category-button:hover,
.icon-button:hover,
.admin-link:hover {
  color: #000000 !important;
  background: transparent !important;
  text-decoration: underline !important;
}

.category-button.active,
.icon-button.active {
  color: #000000 !important;
  background: transparent !important;
  border: 0 !important;
  font-weight: 700 !important;
}

.category-button.active::after,
.icon-button.active::after {
  display: none !important;
  content: none !important;
}

.top-actions {
  gap: 22px !important;
}

@media (max-width: 900px) {
  :root {
    --topbar-h: 102px;
  }

  .category-filter {
    gap: 18px !important;
  }

  .category-button,
  .icon-button,
  .admin-link {
    font-size: .96rem !important;
  }
}

@media (max-width: 640px) {
  :root {
    --topbar-h: 88px;
  }

  .category-filter {
    gap: 14px !important;
  }

  .category-button,
  .icon-button,
  .admin-link {
    font-size: .88rem !important;
  }
}


/* v5.6: udostępnianie aktualnego materiału */
.share-panel {
  position: fixed;
  top: calc(var(--topbar-h) + 10px);
  right: 18px;
  z-index: 90;
  width: min(420px, calc(100vw - 36px));
}

.share-panel[hidden] {
  display: none;
}

.share-panel-inner {
  padding: 18px;
  border: 1px solid rgba(0,0,0,.16);
  background: #ffffff;
  color: #000000;
  box-shadow: 0 22px 70px rgba(0,0,0,.22);
  font-family: Arial, Helvetica, sans-serif;
}

.share-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.share-panel-head strong {
  font-size: 1.04rem;
  font-weight: 700;
}

.share-close,
.share-links button,
.share-links a {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  padding: 0;
  background: transparent;
  color: #111111;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1rem;
  text-decoration: none;
  cursor: pointer;
}

.share-close:hover,
.share-links button:hover,
.share-links a:hover {
  text-decoration: underline;
}

#share-url {
  width: 100%;
  margin: 0 0 14px;
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,.24);
  outline: 0;
  background: #ffffff;
  color: #000000;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .92rem;
}

.share-links {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}

.share-status {
  display: block;
  min-height: 1.2em;
  margin-top: 12px;
  color: rgba(0,0,0,.58);
  font-size: .86rem;
}

@media (max-width: 640px) {
  .share-panel {
    left: 10px;
    right: 10px;
    top: calc(var(--topbar-h) + 8px);
    width: auto;
  }

  .share-links {
    gap: 14px;
  }
}


/* v5.6.1: poprawka działania panelu udostępniania */
.share-panel {
  display: none !important;
}

body.share-open .share-panel {
  display: block !important;
}

#share-open {
  cursor: pointer !important;
}


/* v5.6.2: prosty modal udostępniania, odporny na hidden/display */
.share-panel,
.share-panel[hidden] {
  display: none !important;
}

body.share-open .share-panel,
body.share-open .share-panel[hidden] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: block !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

.share-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0,0,0,.48) !important;
}

.share-panel-inner {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(460px, calc(100vw - 32px)) !important;
  padding: 22px !important;
  border: 1px solid #d8d8d8 !important;
  background: #ffffff !important;
  color: #000000 !important;
  box-shadow: 0 24px 90px rgba(0,0,0,.32) !important;
}

.share-panel-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin-bottom: 18px !important;
}

.share-panel-head strong {
  color: #000 !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
}

.share-close,
.share-links a,
.share-links button {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #000000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1.05rem !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.share-close:hover,
.share-links a:hover,
.share-links button:hover {
  text-decoration: underline !important;
}

#share-url {
  display: block !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 10px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #999 !important;
  outline: 0 !important;
  background: #fff !important;
  color: #000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .95rem !important;
}

.share-links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  align-items: center !important;
}

.share-status {
  display: block !important;
  min-height: 1.3em !important;
  margin-top: 16px !important;
  color: #555 !important;
  font-size: .9rem !important;
}


/* v5.6.3: dolny pasek w stylu górnej belki + większe elementy */
:root {
  --dock-h: 122px;
}

.thumb-dock {
  background: #ffffff !important;
  color: #000000 !important;
  border-top: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.gallery-strip {
  gap: 14px !important;
  padding: 12px 18px !important;
}

.gallery-card {
  min-width: 132px !important;
  width: 132px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #000000 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.gallery-card:hover,
.gallery-card.active {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.gallery-thumb {
  height: 68px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #eeeeee !important;
  overflow: hidden !important;
}

.gallery-thumb img {
  border-radius: 0 !important;
}

.gallery-card.active .gallery-thumb::after {
  display: none !important;
  content: none !important;
}

.gallery-card.active .gallery-thumb {
  outline: 3px solid #000000 !important;
  outline-offset: 3px !important;
}

.gallery-type {
  right: 4px !important;
  bottom: 4px !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.88) !important;
  color: #000000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .72rem !important;
}

.gallery-category {
  margin-top: 8px !important;
  color: #444444 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .82rem !important;
  letter-spacing: 0 !important;
}

.gallery-card strong {
  color: #000000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .96rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

.gallery-card small {
  color: #555555 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .82rem !important;
  line-height: 1.15 !important;
}

.media-controls {
  gap: 16px !important;
}

.media-controls button,
.media-controls a,
.media-button {
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 10px 12px !important;
  font-size: calc(1em + 2px) !important;
}

.nav-button {
  width: 54px !important;
  height: 54px !important;
  font-size: 1.28rem !important;
}

.caption-panel h1 {
  font-size: calc(1.65rem + 2px) !important;
}

.caption-panel p,
.viewer-meta {
  font-size: calc(.95rem + 2px) !important;
}

.share-close,
.share-links a,
.share-links button {
  font-size: calc(1.05rem + 2px) !important;
}

@media (max-width: 900px) {
  :root {
    --dock-h: 128px;
  }

  .gallery-card {
    min-width: 120px !important;
    width: 120px !important;
  }

  .gallery-thumb {
    height: 62px !important;
  }
}

@media (max-width: 640px) {
  :root {
    --dock-h: 120px;
  }

  .gallery-strip {
    padding: 10px 12px !important;
    gap: 12px !important;
  }

  .gallery-card {
    min-width: 108px !important;
    width: 108px !important;
  }

  .gallery-thumb {
    height: 58px !important;
  }

  .nav-button {
    width: 46px !important;
    height: 46px !important;
  }
}


/* v5.6.4: czystsze miniaturki + biały footer */
.gallery-card {
  background: transparent !important;
}

.gallery-thumb {
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.gallery-thumb img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  background: transparent !important;
}

.gallery-card.active .gallery-thumb {
  outline: 0 !important;
}

.gallery-card.active .gallery-thumb img {
  outline: 3px solid #000000 !important;
  outline-offset: 0 !important;
}

.gallery-card.active .gallery-thumb::after {
  display: none !important;
  content: none !important;
}

.site-footer {
  background: #ffffff !important;
  color: #000000 !important;
  border-top: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
}

.site-footer,
.site-footer * {
  font-family: Arial, Helvetica, sans-serif !important;
}

.footer-note,
.site-footer small,
.site-footer span,
.site-footer a {
  color: #444444 !important;
}

@media (max-width: 640px) {
  .gallery-card.active .gallery-thumb img {
    outline-width: 2px !important;
  }
}


/* v5.6.5: tryb zgodności mobile */
.media-caption {
  font-family: Arial, Helvetica, sans-serif !important;
}

@media (max-width: 820px) {
  .viewer-status {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 1rem !important;
  }
}


/* v5.8: stałe logo meyepic w górnej belce */
.brand-logo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  height: 48px !important;
  padding: 0 !important;
  text-decoration: none !important;
}

.brand-logo img {
  display: block !important;
  width: auto !important;
  height: 42px !important;
  max-width: 170px !important;
  object-fit: contain !important;
  image-rendering: auto !important;
}

.site-topbar {
  min-height: var(--topbar-h) !important;
}

@media (max-width: 900px) {
  .brand-logo {
    height: 42px !important;
  }

  .brand-logo img {
    height: 38px !important;
    max-width: 150px !important;
  }
}

@media (max-width: 640px) {
  .brand-logo {
    height: 38px !important;
  }

  .brand-logo img {
    height: 34px !important;
    max-width: 132px !important;
  }
}


/* v6.0 clean install: finalne wymuszenie wyglądu */
:root {
  color-scheme: light !important;
  --topbar-h: 64px;
  --dock-h: 122px;
}

html,
body,
button,
input,
textarea,
select {
  font-family: Arial, Helvetica, sans-serif !important;
}

.site-topbar {
  background: #ffffff !important;
  color: #000000 !important;
  border-bottom: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.brand-logo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  height: 48px !important;
  padding: 0 !important;
  text-decoration: none !important;
}

.brand-logo img {
  display: block !important;
  width: auto !important;
  height: 42px !important;
  max-width: 170px !important;
  object-fit: contain !important;
}

.category-button,
.icon-button,
.admin-link {
  appearance: none !important;
  -webkit-appearance: none !important;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #111111 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1.02rem !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

.category-button:hover,
.icon-button:hover,
.admin-link:hover {
  color: #000000 !important;
  background: transparent !important;
  text-decoration: underline !important;
}

.category-button.active,
.icon-button.active {
  color: #000000 !important;
  background: transparent !important;
  border: 0 !important;
  font-weight: 700 !important;
}

.category-button.active::after,
.icon-button.active::after {
  display: none !important;
  content: none !important;
}

.thumb-dock {
  background: #ffffff !important;
  color: #000000 !important;
  border-top: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.gallery-card {
  min-width: 132px !important;
  width: 132px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #000000 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.gallery-card:hover,
.gallery-card.active {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.gallery-thumb {
  height: 68px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

.gallery-thumb img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.gallery-card.active .gallery-thumb::after {
  display: none !important;
  content: none !important;
}

.gallery-card.active .gallery-thumb img {
  outline: 3px solid #000000 !important;
  outline-offset: 0 !important;
}

.gallery-category {
  margin-top: 8px !important;
  color: #444444 !important;
  font-size: .82rem !important;
  letter-spacing: 0 !important;
}

.gallery-card strong {
  color: #000000 !important;
  font-size: .96rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

.gallery-card small {
  color: #555555 !important;
  font-size: .82rem !important;
  line-height: 1.15 !important;
}

.site-footer {
  background: #ffffff !important;
  color: #000000 !important;
  border-top: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
}

.footer-note,
.site-footer small,
.site-footer span,
.site-footer a {
  color: #444444 !important;
}

/* Prosty modal udostępniania */
.share-panel,
.share-panel[hidden] {
  display: none !important;
}

body.share-open .share-panel,
body.share-open .share-panel[hidden] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: block !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

.share-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0,0,0,.48) !important;
}

.share-panel-inner {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(460px, calc(100vw - 32px)) !important;
  padding: 22px !important;
  border: 1px solid #d8d8d8 !important;
  background: #ffffff !important;
  color: #000000 !important;
  box-shadow: 0 24px 90px rgba(0,0,0,.32) !important;
}

.share-close,
.share-links a,
.share-links button {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #000000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1.05rem !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.share-close:hover,
.share-links a:hover,
.share-links button:hover {
  text-decoration: underline !important;
}

#share-url {
  display: block !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 10px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #999 !important;
  outline: 0 !important;
  background: #fff !important;
  color: #000 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .95rem !important;
}

@media (max-width: 900px) {
  :root {
    --topbar-h: 102px;
    --dock-h: 128px;
  }

  .brand-logo img {
    height: 38px !important;
    max-width: 150px !important;
  }

  .gallery-card {
    min-width: 120px !important;
    width: 120px !important;
  }

  .gallery-thumb {
    height: 62px !important;
  }
}

@media (max-width: 640px) {
  :root {
    --topbar-h: 88px;
    --dock-h: 120px;
  }

  .brand-logo img {
    height: 34px !important;
    max-width: 132px !important;
  }

  .category-button,
  .icon-button,
  .admin-link {
    font-size: .88rem !important;
  }

  .gallery-card {
    min-width: 108px !important;
    width: 108px !important;
  }

  .gallery-thumb {
    height: 58px !important;
  }

  .gallery-card.active .gallery-thumb img {
    outline-width: 2px !important;
  }
}


/* v6.6 — spacer między punktami panoram */
#toggle-places.hidden {
  display: none !important;
}

#toggle-places:disabled {
  cursor: default !important;
  opacity: .38 !important;
}

.psv-markers {
  z-index: 20 !important;
}

.walk-hotspot {
  position: relative;
  display: grid;
  place-items: center;
  width: 52px;
  height: 64px;
  cursor: pointer;
  user-select: none;
  filter: drop-shadow(0 10px 14px rgba(0,0,0,.38));
}

.walk-hotspot-core {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 2px solid #111111;
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  color: #111111;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  transition:
    transform .16s ease,
    background .16s ease,
    color .16s ease;
}

.walk-hotspot-tail {
  position: absolute;
  left: 50%;
  bottom: 6px;
  width: 15px;
  height: 15px;
  border-right: 2px solid #111111;
  border-bottom: 2px solid #111111;
  background: rgba(255,255,255,.96);
  transform: translateX(-50%) rotate(45deg);
}

.walk-hotspot:hover .walk-hotspot-core {
  background: #111111;
  color: #ffffff;
  transform: scale(1.08);
}

.walk-hotspot:hover .walk-hotspot-tail {
  background: #111111;
}

.walk-transition {
  position: absolute;
  inset: 0;
  z-index: 85;
  display: grid;
  place-items: center;
  background: rgba(0,0,0,0);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity .24s ease,
    background .24s ease,
    visibility 0s linear .24s;
}

.walk-transition span {
  padding: 9px 13px;
  background: rgba(255,255,255,.92);
  color: #111111;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .94rem;
  line-height: 1;
  transform: translateY(8px);
  opacity: 0;
  transition:
    transform .24s ease,
    opacity .24s ease;
}

body.walk-transition-active .walk-transition {
  background: rgba(0,0,0,.48);
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

body.walk-transition-active .walk-transition span {
  transform: translateY(0);
  opacity: 1;
}

@media (max-width: 640px) {
  .walk-hotspot {
    width: 46px;
    height: 58px;
  }

  .walk-hotspot-core {
    width: 38px;
    height: 38px;
    font-size: 1.15rem;
  }

  .walk-transition span {
    max-width: calc(100vw - 40px);
    font-size: .86rem;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .walk-hotspot-core,
  .walk-transition,
  .walk-transition span {
    transition: none !important;
  }
}

/* v6.8.2 — przełączany płaski widok panoramy 2:1 */
#toggle-flat.hidden {
  display: none !important;
}

#toggle-flat.active {
  color: var(--text);
  border-color: var(--text);
}

.flat-stage {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  touch-action: none;
  background: #050505;
}

#flat-canvas {
  display: block;
  width: 100%;
  height: 100%;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
}

#flat-canvas.dragging {
  cursor: grabbing;
}

.flat-toolbar {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 12;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(5,5,5,.66);
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow);
}

.flat-toolbar > span {
  min-width: 0;
  overflow: hidden;
  padding-inline: 8px;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.flat-controls {
  display: flex;
  align-items: center;
  gap: 4px;
}

.flat-controls .icon-button {
  min-height: 30px;
  padding-inline: 10px;
}

.flat-status {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: grid;
  place-items: center;
  padding: 24px;
  color: var(--muted);
  background: rgba(0,0,0,.42);
  backdrop-filter: blur(6px);
}

.flat-status.hidden {
  display: none !important;
}

.viewer-frame:has(.flat-stage:not(.hidden)) .caption-panel {
  bottom: 82px;
}

@media (max-width: 640px) {
  .flat-toolbar {
    left: 8px;
    right: 8px;
    bottom: 8px;
    gap: 6px;
    border-radius: 18px;
  }

  .flat-toolbar > span {
    font-size: .78rem;
  }

  .flat-controls .icon-button {
    padding-inline: 7px;
    font-size: .8rem !important;
  }
}


/* v6.9 — pinezki 25 px nad horyzontem z linią do punktu na ziemi */
.stage-layer {
  position: relative;
}

.horizon-links {
  position: absolute;
  inset: 0;
  z-index: 60;
  overflow: hidden;
  pointer-events: none;
}

.horizon-links-lines,
.horizon-links-icons {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.horizon-links-lines {
  overflow: visible;
  pointer-events: none;
}

.horizon-link-line {
  fill: none;
  stroke: rgba(255,255,255,.94);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 2 8;
  vector-effect: non-scaling-stroke;
  filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.95))
    drop-shadow(0 0 3px rgba(0,0,0,.7));
}

.horizon-link-ground-dot {
  fill: rgba(255,255,255,.98);
  stroke: rgba(0,0,0,.9);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.8));
}

.horizon-link-button {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 2px solid #111;
  border-radius: 999px;
  background: rgba(255,255,255,.97);
  color: #111;
  box-shadow:
    0 8px 22px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,255,255,.54);
  cursor: pointer;
  pointer-events: auto;
  transform-origin: center;
  transition:
    box-shadow .12s ease,
    opacity .12s ease;
  user-select: none;
  will-change: transform;
}

.horizon-link-button:hover,
.horizon-link-button:focus-visible {
  background: rgba(255,255,255,.97);
  color: #111;
  outline: none;
  scale: 1;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.72),
    0 8px 22px rgba(0,0,0,.34);
}

.horizon-link-icon {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  transform: translateY(-1px);
}

.horizon-link-label {
  position: absolute;
  left: 50%;
  top: calc(100% + 7px);
  max-width: 220px;
  padding: 5px 8px;
  border: 1px solid rgba(255,255,255,.76);
  background: rgba(0,0,0,.72);
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.15;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  text-overflow: ellipsis;
  transform: translateX(-50%) translateY(-2px);
  transition: opacity .1s ease;
  white-space: nowrap;
}

.horizon-link-button:hover .horizon-link-label,
.horizon-link-button:focus-visible .horizon-link-label {
  opacity: 1;
  transform: translateX(-50%) translateY(-2px);
}

@media (max-width: 640px) {
  .horizon-link-button {
    width: 42px;
    height: 42px;
  }

  .horizon-link-icon {
    font-size: 1.18rem;
  }

  .horizon-link-label {
    max-width: 160px;
    font-size: .68rem;
  }

  .horizon-link-line {
    stroke-width: 1.75;
    stroke-dasharray: 2 7;
  }
}

@media (prefers-reduced-motion: reduce) {
  .horizon-link-button,
  .horizon-link-label {
    transition: none !important;
  }
}


.horizon-link-button.is-activating {
  background: rgba(255,255,255,.97);
  color: #111;
  cursor: wait;
  opacity: .72;
  scale: 1;
  box-shadow:
    0 0 0 4px rgba(255,255,255,.45),
    0 8px 22px rgba(0,0,0,.34);
}


.horizon-links-icons {
  pointer-events: none;
}

.horizon-links-icons .horizon-link-button {
  pointer-events: auto;
}


/* v6.10 — indywidualny wygląd każdej pinezki spaceru */
.horizon-link-button {
  --pin-size: 48px;
  --pin-bg: rgba(255,255,255,.97);
  --pin-fg: #111;
  --pin-border: #111;
  width: var(--pin-size);
  height: var(--pin-size);
  border-color: var(--pin-border);
  background: var(--pin-bg);
  color: var(--pin-fg);
}

.horizon-link-button[data-theme="dark"] {
  --pin-bg: rgba(20,20,20,.96);
  --pin-fg: #fff;
  --pin-border: rgba(255,255,255,.96);
}

.horizon-link-button[data-theme="blue"] {
  --pin-bg: rgba(225,242,255,.98);
  --pin-fg: #075985;
  --pin-border: #075985;
}

.horizon-link-button[data-theme="amber"] {
  --pin-bg: rgba(255,243,205,.98);
  --pin-fg: #7c2d12;
  --pin-border: #92400e;
}

.horizon-link-button:hover,
.horizon-link-button:focus-visible,
.horizon-link-button.is-activating {
  border-color: var(--pin-border);
  background: var(--pin-bg);
  color: var(--pin-fg);
  scale: 1;
}

.horizon-link-icon {
  font-size: calc(var(--pin-size) * .46);
}

.horizon-link-button[data-icon="info"] .horizon-link-icon {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-weight: 800;
}

.horizon-link-button[data-label-mode="hidden"] .horizon-link-label {
  display: none;
}

.horizon-link-button[data-label-mode="always"] .horizon-link-label {
  opacity: 1;
  transform: translateX(-50%) translateY(-2px);
}

.horizon-link-button[data-label-mode="hover"] .horizon-link-label {
  opacity: 0;
}

.horizon-link-button[data-label-mode="hover"]:hover .horizon-link-label,
.horizon-link-button[data-label-mode="hover"]:focus-visible .horizon-link-label {
  opacity: 1;
}

.horizon-link-line.line-dotted {
  stroke-dasharray: 2 8;
}

.horizon-link-line.line-dashed {
  stroke-dasharray: 12 9;
}

.horizon-link-line.line-solid {
  stroke-dasharray: none;
}

.horizon-link-line.line-none {
  display: none;
}

.horizon-link-line.theme-light {
  stroke: rgba(255,255,255,.96);
}

.horizon-link-line.theme-dark {
  stroke: rgba(20,20,20,.96);
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.98))
    drop-shadow(0 1px 2px rgba(255,255,255,.7));
}

.horizon-link-line.theme-blue {
  stroke: rgba(186,230,253,.98);
}

.horizon-link-line.theme-amber {
  stroke: rgba(253,230,138,.98);
}

.horizon-link-ground-dot.theme-light {
  fill: rgba(255,255,255,.98);
  stroke: rgba(0,0,0,.9);
}

.horizon-link-ground-dot.theme-dark {
  fill: rgba(20,20,20,.98);
  stroke: rgba(255,255,255,.96);
}

.horizon-link-ground-dot.theme-blue {
  fill: rgba(186,230,253,.98);
  stroke: #075985;
}

.horizon-link-ground-dot.theme-amber {
  fill: rgba(253,230,138,.98);
  stroke: #92400e;
}

@media (max-width: 640px) {
  .horizon-link-button {
    width: var(--pin-size);
    height: var(--pin-size);
  }

  .horizon-link-icon {
    font-size: calc(var(--pin-size) * .44);
  }
}


/* v6.11 — duże konturowe SVG bez tła */
.horizon-link-button.outline-pin {
  --pin-size: 72px;
  --pin-color: #ffffff;
  width: var(--pin-size);
  height: var(--pin-size);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--pin-color);
  box-shadow: none;
  filter: none;
  overflow: visible;
}

.horizon-link-button.outline-pin:hover,
.horizon-link-button.outline-pin:focus-visible,
.horizon-link-button.outline-pin.is-activating {
  border: 0;
  background: transparent;
  color: var(--pin-color);
  box-shadow: none;
  scale: 1;
  opacity: 1;
}

.horizon-link-button.outline-pin:focus-visible {
  outline: 2px dashed currentColor;
  outline-offset: 5px;
}

.horizon-link-button.outline-pin.is-activating {
  opacity: .68;
}

.horizon-link-button.outline-pin .horizon-link-icon {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 0;
  line-height: 0;
  transform: none;
}

.horizon-link-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  color: var(--pin-color);
  vector-effect: non-scaling-stroke;
}

.horizon-link-button.outline-pin[data-halo="auto"]:not([data-color="black"]) .horizon-link-svg {
  filter:
    drop-shadow(0 0 1px rgba(0,0,0,.98))
    drop-shadow(0 2px 4px rgba(0,0,0,.72));
}

.horizon-link-button.outline-pin[data-halo="auto"][data-color="black"] .horizon-link-svg {
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,1))
    drop-shadow(0 0 3px rgba(255,255,255,.9));
}

.horizon-link-button.outline-pin[data-halo="none"] .horizon-link-svg {
  filter: none;
}

.horizon-link-button.outline-pin .horizon-link-label {
  top: calc(100% + 5px);
}

.horizon-link-line {
  stroke: var(--pin-color, rgba(255,255,255,.96));
}

.horizon-link-ground-dot {
  fill: var(--pin-color, #ffffff);
  stroke: rgba(0,0,0,.88);
}

.horizon-link-line[data-halo="auto"]:not([data-color="black"]) {
  filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.95))
    drop-shadow(0 0 3px rgba(0,0,0,.72));
}

.horizon-link-line[data-halo="auto"][data-color="black"] {
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,1))
    drop-shadow(0 0 3px rgba(255,255,255,.9));
}

.horizon-link-line[data-halo="none"],
.horizon-link-ground-dot[data-halo="none"] {
  filter: none;
}

.horizon-link-ground-dot[data-color="black"] {
  stroke: rgba(255,255,255,.96);
}

@media (max-width: 640px) {
  .horizon-link-button.outline-pin {
    width: var(--pin-size);
    height: var(--pin-size);
  }
}


/* v6.11.1 — pozycja pinezki bez interpolacji i bez przyklejania do krawędzi */
.horizon-link-button,
.horizon-link-button.outline-pin {
  transition-property: opacity, box-shadow !important;
  transition-duration: .08s !important;
  transition-timing-function: linear !important;
}


/* v6.11.2 — synchronizacja z WebGL bez dynamicznego translate3d */
.horizon-link-button,
.horizon-link-button.outline-pin {
  will-change: auto !important;
  transform: translate(-50%, -50%);
  transition-property: opacity, box-shadow !important;
}

.horizon-links-icons {
  transform: none !important;
  will-change: auto !important;
}


/* v6.11.4 — przejścia renderowane natywnie przez MarkersPlugin */
.native-walk-marker {
  --pin-size: 72px;
  --pin-color: #ffffff;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  color: var(--pin-color);
  cursor: pointer;
  pointer-events: auto;
  user-select: none;
}

.native-walk-icon {
  position: absolute;
  left: 50%;
  top: 0;
  display: block;
  width: var(--pin-size);
  height: var(--pin-size);
  color: var(--pin-color);
  line-height: 0;
  transform: translateX(-50%);
}

.native-walk-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  color: currentColor;
}

.native-walk-marker[data-halo="auto"]:not([data-color="black"]) .native-walk-svg {
  filter:
    drop-shadow(0 0 1px rgba(0,0,0,.98))
    drop-shadow(0 2px 4px rgba(0,0,0,.72));
}

.native-walk-marker[data-halo="auto"][data-color="black"] .native-walk-svg {
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,1))
    drop-shadow(0 0 3px rgba(255,255,255,.9));
}

.native-walk-marker[data-halo="none"] .native-walk-svg {
  filter: none;
}

.native-walk-label {
  position: absolute;
  left: 50%;
  top: calc(var(--pin-size) + 5px);
  max-width: 220px;
  padding: 5px 8px;
  border: 1px solid rgba(255,255,255,.72);
  background: rgba(0,0,0,.74);
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.15;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  text-overflow: ellipsis;
  transform: translateX(-50%);
  white-space: nowrap;
}

.native-walk-marker[data-label-mode="always"] .native-walk-label {
  opacity: 1;
}

.native-walk-marker[data-label-mode="hidden"] .native-walk-label {
  display: none;
}

.native-walk-marker[data-label-mode="hover"]:hover .native-walk-label {
  opacity: 1;
}

.native-walk-marker:hover .native-walk-svg,
.native-walk-marker:focus-within .native-walk-svg {
  opacity: .82;
}

.native-walk-ground-dot {
  --pin-color: #ffffff;
  display: block;
  width: 10px;
  height: 10px;
  border: 2px solid rgba(0,0,0,.9);
  border-radius: 50%;
  background: var(--pin-color);
  box-sizing: border-box;
  pointer-events: none;
}

.native-walk-ground-dot[data-color="black"] {
  border-color: rgba(255,255,255,.96);
}

.native-walk-ground-dot[data-halo="auto"]:not([data-color="black"]) {
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.85));
}

.native-walk-ground-dot[data-halo="auto"][data-color="black"] {
  filter: drop-shadow(0 0 2px rgba(255,255,255,.95));
}

/* Natywne markery są pozycjonowane przez viewer, bez własnego left/top/translate3d. */
.psv-marker .native-walk-marker,
.psv-marker .native-walk-ground-dot {
  will-change: auto;
}

@media (max-width: 640px) {
  .native-walk-label {
    max-width: 160px;
    font-size: .68rem;
  }
}


/* v6.11.6 — stabilne sterowanie mobilne */
html {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

body,
button,
input,
select,
textarea {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

/* Gesty należą do viewera, nie do powiększania całej strony. */
#viewer,
.psv-container,
.psv-canvas-container,
.psv-canvas {
  touch-action: none !important;
  -ms-touch-action: none !important;
}

/* Publiczna belka ma nie zwiększać tekstu po obrocie telefonu. */
.site-topbar,
.site-topbar button,
.site-topbar a {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

@media (max-width: 900px) {
  .site-topbar {
    overflow: hidden;
  }

  .category-filter,
  .top-actions {
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap !important;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  .category-filter::-webkit-scrollbar,
  .top-actions::-webkit-scrollbar {
    display: none;
  }

  .category-button,
  .top-actions .icon-button,
  .top-actions .admin-link {
    flex: 0 0 auto;
    font-size: 13px !important;
    line-height: 1 !important;
  }

  /* Pasek Photo Sphere Viewer */
  .psv-navbar {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding-left: max(2px, env(safe-area-inset-left)) !important;
    padding-right: max(2px, env(safe-area-inset-right)) !important;
    overflow: hidden !important;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
  }

  .psv-navbar .psv-button {
    box-sizing: border-box !important;
    flex: 0 0 32px !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding: 7px !important;
    font-size: 12px !important;
    line-height: 1 !important;
  }

  .psv-navbar .psv-button svg {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
  }

  .psv-navbar .psv-zoom-range {
    flex: 1 1 64px !important;
    width: auto !important;
    min-width: 42px !important;
    max-width: 76px !important;
    height: 38px !important;
    padding-inline: 4px !important;
  }

  /* Podpis nie jest przyciskiem funkcyjnym i nie może wypychać kontrolek. */
  .psv-navbar .psv-caption {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 38px !important;
    padding-inline: 5px !important;
    overflow: hidden !important;
    font-size: 11px !important;
    line-height: 38px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 430px) {
  /* Na najwęższych ekranach zostają przyciski +/−, bez szerokiego suwaka. */
  .psv-navbar .psv-zoom-range {
    display: none !important;
  }

  .psv-navbar .psv-caption {
    display: none !important;
  }

  .psv-navbar .psv-button {
    flex-basis: 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    padding: 6px !important;
  }

  .psv-navbar .psv-button svg {
    width: 17px !important;
    height: 17px !important;
    max-width: 17px !important;
    max-height: 17px !important;
  }

  .top-actions {
    gap: 9px !important;
  }

  .category-button,
  .top-actions .icon-button,
  .top-actions .admin-link {
    font-size: 12px !important;
  }
}

/* Telefon obrócony poziomo — odzyskujemy wysokość dla panoramy. */
@media (orientation: landscape) and (max-height: 540px) {
  :root {
    --topbar-h: 52px !important;
    --dock-h: 78px !important;
    --footer-h: 0px !important;
  }

  .site-footer {
    display: none !important;
  }

  .site-topbar {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    grid-template-rows: 1fr !important;
    align-items: center !important;
    gap: 10px !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 4px max(8px, env(safe-area-inset-right)) 4px max(8px, env(safe-area-inset-left)) !important;
  }

  .brand-logo {
    height: 42px !important;
  }

  .brand-logo img {
    height: 30px !important;
    max-width: 110px !important;
  }

  .category-filter {
    grid-column: auto !important;
    grid-row: auto !important;
    order: initial !important;
    gap: 12px !important;
  }

  .top-actions {
    grid-column: auto !important;
    grid-row: auto !important;
    gap: 10px !important;
  }

  .category-button,
  .top-actions .icon-button,
  .top-actions .admin-link {
    font-size: 12px !important;
  }

  .psv-navbar {
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
  }

  .psv-navbar .psv-button {
    flex-basis: 29px !important;
    width: 29px !important;
    min-width: 29px !important;
    max-width: 29px !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    padding: 6px !important;
  }

  .psv-navbar .psv-button svg {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
  }

  .psv-navbar .psv-caption,
  .psv-navbar .psv-zoom-range {
    display: none !important;
  }

  .flat-toolbar,
  .media-toolbar {
    bottom: max(5px, env(safe-area-inset-bottom)) !important;
    min-height: 34px !important;
    padding: 5px 7px !important;
  }

  .flat-controls .icon-button,
  .media-controls .icon-button {
    font-size: 12px !important;
    line-height: 1 !important;
  }
}

/* v6.11.7 — finalny układ mobilny: bez olbrzymiego panelu i bez znikających kontrolek */
@media (pointer: coarse), (max-width: 700px) {
  :root {
    --topbar-h: 78px !important;
  }

  .site-topbar {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    grid-template-rows: 34px 34px !important;
    align-items: center !important;
    gap: 2px 10px !important;
    height: 78px !important;
    min-height: 78px !important;
    padding: 4px max(8px, env(safe-area-inset-right)) 4px max(8px, env(safe-area-inset-left)) !important;
    overflow: hidden !important;
  }

  .brand-logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
  }

  .brand-logo img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
  }

  .top-actions {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    gap: 12px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    scrollbar-width: none !important;
  }

  .top-actions::-webkit-scrollbar {
    display: none !important;
  }

  .category-filter {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    gap: 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    scrollbar-width: none !important;
  }

  .category-filter::-webkit-scrollbar {
    display: none !important;
  }

  .category-button,
  .top-actions .icon-button,
  .top-actions .admin-link {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    line-height: 1 !important;
  }

  /* Panel info na telefonie jest domyślnie schowany. Po kliknięciu "info"
     pojawia się jako mała karta, a nie półekranowy blok. */
  .caption-panel {
    display: none !important;
  }

  body:not(.hide-captions) .caption-panel {
    display: block !important;
    left: 10px !important;
    right: 10px !important;
    bottom: 42px !important;
    width: auto !important;
    max-height: min(38vh, 190px) !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
    overflow: auto !important;
    pointer-events: auto !important;
  }

  body:not(.hide-captions) .caption-panel h1 {
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
    letter-spacing: -.025em !important;
  }

  body:not(.hide-captions) .caption-panel p {
    margin-top: 6px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
  }

  body:not(.hide-captions) .caption-panel .viewer-meta {
    height: auto !important;
    margin: 0 0 6px !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
  }

  .nav-button {
    width: 34px !important;
    height: 34px !important;
    font-size: 15px !important;
    border-radius: 50% !important;
  }

  .nav-button.prev { left: 7px !important; }
  .nav-button.next { right: 7px !important; }

  /* Natywny pasek: dokładnie cztery kontrolki na telefonie. */
  .psv-navbar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    padding: 0 max(3px, env(safe-area-inset-right)) 0 max(3px, env(safe-area-inset-left)) !important;
    overflow: visible !important;
  }

  .psv-navbar .psv-button {
    flex: 0 0 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    padding: 8px !important;
  }

  .psv-navbar .psv-button svg {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
  }

  .psv-navbar .psv-caption,
  .psv-navbar .psv-zoom-range {
    display: none !important;
  }
}

@media (pointer: coarse) and (orientation: landscape),
       (orientation: landscape) and (max-height: 560px) {
  :root {
    --topbar-h: 42px !important;
    --dock-h: 66px !important;
    --footer-h: 0px !important;
  }

  .site-topbar {
    grid-template-columns: 28px minmax(0, auto) minmax(0, 1fr) !important;
    grid-template-rows: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    gap: 8px !important;
    padding-block: 3px !important;
  }

  .brand-logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 28px !important;
    height: 28px !important;
  }

  .brand-logo img {
    width: 26px !important;
    height: 26px !important;
    max-width: 26px !important;
  }

  .category-filter {
    grid-column: 2 !important;
    grid-row: 1 !important;
    gap: 14px !important;
  }

  .top-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-content: flex-end !important;
    gap: 11px !important;
  }

  .category-button,
  .top-actions .icon-button,
  .top-actions .admin-link {
    font-size: 11px !important;
  }

  body:not(.hide-captions) .caption-panel {
    left: 8px !important;
    right: auto !important;
    bottom: 38px !important;
    width: min(320px, calc(100vw - 90px)) !important;
    max-height: 128px !important;
    padding: 8px 10px !important;
  }

  body:not(.hide-captions) .caption-panel h1 {
    font-size: 15px !important;
  }

  body:not(.hide-captions) .caption-panel p {
    font-size: 11px !important;
  }

  .nav-button {
    width: 30px !important;
    height: 30px !important;
    font-size: 13px !important;
  }

  .psv-navbar {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
  }

  .psv-navbar .psv-button {
    flex-basis: 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 7px !important;
  }

  .psv-navbar .psv-button svg {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
  }

  .gallery-card {
    min-width: 96px !important;
    width: 96px !important;
  }

  .gallery-thumb {
    height: 46px !important;
  }
}


/* v6.11.8 — pełna widoczność białej belki na telefonie */
@media (pointer: coarse), (max-width: 700px) {
  html,
  body {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  /*
   * 100dvh reaguje na rozwijanie i chowanie paska adresu Chrome.
   * Pierwszy wiersz siatki jest automatyczny, więc nagłówek nie może
   * zostać obcięty przez zbyt małą wartość --topbar-h.
   */
  .site-shell {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    grid-template-rows: auto minmax(0, 1fr) var(--footer-h) !important;
    overflow: hidden !important;
  }

  :root {
    --topbar-h: 82px !important;
  }

  .site-topbar {
    box-sizing: border-box !important;
    position: relative !important;
    top: auto !important;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    grid-template-rows: 32px 32px !important;
    align-content: center !important;
    align-items: center !important;
    gap: 3px 10px !important;

    width: 100% !important;
    height: auto !important;
    min-height: 82px !important;
    max-height: none !important;

    padding-top: max(8px, env(safe-area-inset-top)) !important;
    padding-right: max(10px, env(safe-area-inset-right)) !important;
    padding-bottom: 7px !important;
    padding-left: max(10px, env(safe-area-inset-left)) !important;

    /*
     * Pionowe overflow: hidden wycinało logo i linki pierwszego rzędu.
     * Przewijanie poziome pozostaje na obu wewnętrznych listach.
     */
    overflow: visible !important;
    contain: none !important;
  }

  .brand-logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: start !important;

    display: grid !important;
    place-items: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .brand-logo img {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
    margin: 0 !important;
    object-fit: contain !important;
  }

  .top-actions {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: stretch !important;
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .category-filter {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    align-self: stretch !important;
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  .top-actions > *,
  .category-filter > * {
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .viewer-area {
    min-height: 0 !important;
    overflow: hidden !important;
  }
}

/* Telefon poziomo: jeden pełny, nieobcięty rząd. */
@media (pointer: coarse) and (orientation: landscape),
       (orientation: landscape) and (max-height: 560px) {
  :root {
    --topbar-h: 46px !important;
  }

  .site-shell {
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    grid-template-rows: auto minmax(0, 1fr) var(--footer-h) !important;
  }

  .site-topbar {
    grid-template-columns: 30px minmax(0, auto) minmax(0, 1fr) !important;
    grid-template-rows: 34px !important;
    align-content: center !important;

    height: auto !important;
    min-height: 46px !important;
    max-height: none !important;

    padding-top: max(5px, env(safe-area-inset-top)) !important;
    padding-right: max(8px, env(safe-area-inset-right)) !important;
    padding-bottom: 5px !important;
    padding-left: max(8px, env(safe-area-inset-left)) !important;

    overflow: visible !important;
  }

  .brand-logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
  }

  .brand-logo img {
    width: 26px !important;
    height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
  }

  .category-filter {
    grid-column: 2 !important;
    grid-row: 1 !important;
    height: 34px !important;
    min-height: 34px !important;
  }

  .top-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    height: 34px !important;
    min-height: 34px !important;
  }
}

/* Awaryjne wsparcie starszych mobilnych silników bez dvh. */
@supports not (height: 100dvh) {
  @media (pointer: coarse), (max-width: 700px) {
    .site-shell {
      height: 100vh !important;
      min-height: 100vh !important;
      max-height: 100vh !important;
    }
  }
}


/* v6.11.9 — nieruchoma mobilna powłoka aplikacji */
@media (pointer: coarse), (max-width: 700px) {
  :root {
    --mobile-header-h: 82px;
  }

  /*
   * Chrome potrafił przywrócić pozycję przewinięcia po obrocie ekranu.
   * Dokument i aplikacja są teraz przywiązane do viewportu, więc nagłówek
   * nie może znaleźć się ponad widocznym ekranem.
   */
  html,
  body {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  body {
    touch-action: manipulation;
  }

  .site-shell {
    position: fixed !important;
    inset: 0 !important;
    z-index: 0 !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows:
      var(--mobile-header-h)
      minmax(0, 1fr)
      var(--footer-h) !important;

    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: none !important;
  }

  .site-topbar {
    position: relative !important;
    inset: auto !important;
    z-index: 100 !important;

    grid-row: 1 !important;
    align-self: stretch !important;

    width: 100% !important;
    height: var(--mobile-header-h) !important;
    min-height: var(--mobile-header-h) !important;
    max-height: var(--mobile-header-h) !important;

    margin: 0 !important;
    transform: none !important;
    translate: none !important;
  }

  .viewer-area {
    position: relative !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  .site-footer {
    grid-row: 3 !important;
    min-height: 0 !important;
  }
}

/* Poziomy telefon: nadal nieruchoma powłoka, ale niższy nagłówek. */
@media (pointer: coarse) and (orientation: landscape),
       (orientation: landscape) and (max-height: 560px) {
  :root {
    --mobile-header-h: 46px;
  }

  .site-shell {
    grid-template-rows:
      var(--mobile-header-h)
      minmax(0, 1fr)
      var(--footer-h) !important;
  }

  .site-topbar {
    height: var(--mobile-header-h) !important;
    min-height: var(--mobile-header-h) !important;
    max-height: var(--mobile-header-h) !important;
  }
}

/*
 * W trybie pełnoekranowym przeglądarki Photo Sphere Viewer sam zarządza
 * przestrzenią. Nie wymuszamy dodatkowego nagłówka nad pełnym ekranem.
 */
:fullscreen .site-topbar,
:-webkit-full-screen .site-topbar {
  display: none !important;
}

:fullscreen .site-shell,
:-webkit-full-screen .site-shell {
  grid-template-rows: minmax(0, 1fr) 0 0 !important;
}

:fullscreen .viewer-area,
:-webkit-full-screen .viewer-area {
  grid-row: 1 !important;
}


/* v6.12 — obszary, granice i linie */
.area-always-label {
  display: block;
  box-sizing: border-box;
  max-width: 280px;
  padding: 5px 9px;
  border: 1px solid rgba(255,255,255,.82);
  background: rgba(0,0,0,.68);
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  text-shadow: 0 1px 2px #000;
  white-space: nowrap;
  pointer-events: none;
}

.area-content {
  font-family: Arial, Helvetica, sans-serif;
}

.area-content h2 {
  margin: 0 0 .55rem;
}

.area-content p {
  margin: 0;
  line-height: 1.45;
}

@media (max-width: 700px) {
  .area-always-label {
    max-width: 180px;
    padding: 4px 7px;
    font-size: 11px;
  }
}

/* v6.12.1 — duży napis wewnątrz zaznaczonego obszaru */
.area-inside-label {
  --area-label-color: #00d91a;
  --area-label-size: 34px;
  --area-label-opacity: .9;

  display: block;
  box-sizing: border-box;
  max-width: min(72vw, 720px);
  padding: 4px 8px;
  border: 0;
  background: transparent;
  color: var(--area-label-color);
  font-family: Arial, Helvetica, sans-serif;
  font-size: var(--area-label-size);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -.035em;
  opacity: var(--area-label-opacity);
  text-align: center;
  text-shadow:
    0 1px 1px rgba(255,255,255,.7),
    0 2px 5px rgba(0,0,0,.72);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}

.area-inside-label[data-background="dark"] {
  padding: 8px 13px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 10px;
  background: rgba(0,0,0,.66);
  color: var(--area-label-color);
  text-shadow: 0 1px 3px rgba(0,0,0,.95);
  backdrop-filter: blur(5px);
}

.area-inside-label[data-background="light"] {
  padding: 8px 13px;
  border: 1px solid rgba(0,0,0,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.78);
  color: var(--area-label-color);
  text-shadow: 0 1px 2px rgba(255,255,255,.92);
  backdrop-filter: blur(5px);
}

@media (max-width: 700px) {
  .area-inside-label {
    max-width: 78vw;
    font-size: min(var(--area-label-size), 42px);
    white-space: normal;
  }
}


/* v6.12.3 — etykiety z ręczną pozycją i zawijaniem */
.area-inside-label {
  --area-label-max-width: 360px;
  --area-label-align: center;
  --area-label-weight: 800;

  width: min(var(--area-label-max-width), 72vw);
  max-width: var(--area-label-max-width);
  font-weight: var(--area-label-weight);
  text-align: var(--area-label-align);
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

.area-inside-label[data-outline="auto"],
.area-inside-label[data-outline="dark"] {
  text-shadow: 0 1px 1px rgba(255,255,255,.6), 0 2px 5px rgba(0,0,0,.82);
}

.area-inside-label[data-outline="light"] {
  text-shadow: -1px -1px 0 rgba(255,255,255,.95), 1px -1px 0 rgba(255,255,255,.95), -1px 1px 0 rgba(255,255,255,.95), 1px 1px 0 rgba(255,255,255,.95);
}

.area-inside-label[data-outline="none"] {
  text-shadow: none;
}

@media (max-width: 700px) {
  .area-inside-label {
    width: min(var(--area-label-max-width), 78vw);
  }
}


/* v6.13.2 — publiczny automatyczny obrót */
#toggle-autorotate.active {
  color: #000;
}

#toggle-autorotate.active::after {
  content: "";
  display: block;
  height: 1px;
  margin-top: 4px;
  background: #000;
}

@media (prefers-reduced-motion: reduce) {
  #toggle-autorotate:not(.active) {
    opacity: .66;
  }
}


/* ==========================================================================
   v6.13.3 — kinowe wejście i czysty widok początkowy
   ========================================================================== */

.site-intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.055), transparent 28rem),
    #020202;
  opacity: 1;
  visibility: visible;
  transition:
    opacity .72s cubic-bezier(.22,.75,.18,1),
    visibility 0s linear .72s;
}

.site-intro-inner {
  display: grid;
  justify-items: center;
  gap: 18px;
  width: min(58vw, 340px);
  transform: translateY(0) scale(1);
  animation: meyepic-intro-logo 1.45s cubic-bezier(.16,.88,.24,1) both;
}

.site-intro-inner img {
  display: block;
  width: min(100%, 270px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 16px 42px rgba(0,0,0,.72));
}

.site-intro-line {
  display: block;
  width: min(48vw, 220px);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.88),
    transparent
  );
  transform-origin: center;
  animation: meyepic-intro-line 1.35s .16s cubic-bezier(.16,.88,.24,1) both;
}

@keyframes meyepic-intro-logo {
  0% {
    opacity: 0;
    filter: blur(13px);
    transform: translateY(12px) scale(.88);
  }
  55% {
    opacity: 1;
    filter: blur(0);
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

@keyframes meyepic-intro-line {
  0% {
    opacity: 0;
    transform: scaleX(0);
  }
  45% {
    opacity: .9;
  }
  100% {
    opacity: .62;
    transform: scaleX(1);
  }
}

body.cinematic-panorama-visible .site-intro {
  opacity: 0;
  visibility: hidden;
}

.site-topbar,
.site-footer,
.viewer-nav,
.psv-navbar,
.flat-toolbar,
.media-toolbar {
  transition:
    opacity .46s ease,
    transform .56s cubic-bezier(.2,.8,.2,1);
}

/*
 * Podczas wejścia kamera ma całą uwagę.
 * Geometria i pinezki wracają dopiero po zakończeniu ruchu.
 */
body.cinematic-boot:not(.cinematic-ui-ready) .site-topbar {
  opacity: 0 !important;
  transform: translateY(-14px);
  pointer-events: none !important;
}

body.cinematic-boot:not(.cinematic-ui-ready) .site-footer {
  opacity: 0 !important;
  transform: translateY(10px);
  pointer-events: none !important;
}

body.cinematic-boot:not(.cinematic-ui-ready) .viewer-nav,
body.cinematic-boot:not(.cinematic-ui-ready) .psv-navbar,
body.cinematic-boot:not(.cinematic-ui-ready) .flat-toolbar,
body.cinematic-boot:not(.cinematic-ui-ready) .media-toolbar,
body.cinematic-boot:not(.cinematic-ui-ready) .caption-panel,
body.cinematic-boot:not(.cinematic-ui-ready) .thumb-dock,
body.cinematic-boot:not(.cinematic-ui-ready) .psv-marker {
  opacity: 0 !important;
  pointer-events: none !important;
}

body.cinematic-boot.cinematic-ui-ready .site-topbar,
body.cinematic-boot.cinematic-ui-ready .site-footer,
body.cinematic-boot.cinematic-ui-ready .viewer-nav,
body.cinematic-boot.cinematic-ui-ready .psv-navbar,
body.cinematic-boot.cinematic-ui-ready .flat-toolbar,
body.cinematic-boot.cinematic-ui-ready .media-toolbar {
  opacity: 1;
  transform: none;
}

/* Galeria i opis pozostają zwinięte także po kinowym wejściu. */
body.hide-thumbs .thumb-dock,
body.hide-captions .caption-panel {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .site-intro,
  .site-topbar,
  .site-footer,
  .viewer-nav,
  .psv-navbar,
  .flat-toolbar,
  .media-toolbar {
    transition-duration: .12s !important;
  }

  .site-intro-inner,
  .site-intro-line {
    animation: none !important;
  }
}


/* ==========================================================================
   v6.18 — publiczna mapa panoram
   ========================================================================== */

.public-map-panel {
  position: absolute;
  z-index: 850;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, min(48vw, 760px));
  visibility: hidden;
  pointer-events: none;
}

body.public-map-open .public-map-panel {
  visibility: visible;
  pointer-events: auto;
}

.public-map-backdrop {
  grid-column: 1;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(0,0,0,.22);
  opacity: 0;
  cursor: default;
  transition: opacity .28s ease;
}

body.public-map-open .public-map-backdrop {
  opacity: 1;
}

.public-map-drawer {
  grid-column: 2;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-left: 1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(180deg, rgba(21,24,25,.98), rgba(8,10,11,.98));
  box-shadow: -28px 0 80px rgba(0,0,0,.44);
  transform: translateX(102%);
  transition: transform .34s cubic-bezier(.22,.78,.2,1);
}

body.public-map-open .public-map-drawer {
  transform: translateX(0);
}

.public-map-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 66px;
  padding: 12px 15px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.public-map-head > div {
  display: grid;
  gap: 3px;
}

.public-map-eyebrow {
  color: rgba(255,255,255,.46);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.public-map-head strong {
  font-size: 1.03rem;
}

.public-map-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(130px, .8fr) auto auto;
  align-items: end;
  gap: 8px;
  padding: 11px 12px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.025);
}

.public-map-toolbar label:not(.public-map-check) {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: rgba(255,255,255,.56);
  font-size: .7rem;
  font-weight: 700;
}

.public-map-toolbar input[type="search"],
.public-map-toolbar select {
  width: 100%;
  min-width: 0;
  min-height: 36px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 9px;
  padding: 0 10px;
  color: #f5f5f0;
  outline: none;
  background: rgba(255,255,255,.055);
}

.public-map-toolbar input[type="search"]:focus,
.public-map-toolbar select:focus {
  border-color: rgba(135,206,255,.72);
  box-shadow: 0 0 0 3px rgba(73,159,220,.13);
}

.public-map-check {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 4px;
  color: rgba(255,255,255,.64);
  font-size: .76rem;
  white-space: nowrap;
}

.public-map-content {
  display: grid;
  grid-template-rows: minmax(280px, 1fr) auto;
  min-height: 0;
  overflow: hidden;
}

.public-map-main {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: #dce7e3;
}

.public-map-canvas {
  width: 100%;
  height: 100%;
  min-height: 300px;
}

.public-map-status {
  position: absolute;
  z-index: 500;
  left: 50%;
  bottom: 13px;
  max-width: calc(100% - 26px);
  transform: translateX(-50%);
  border: 1px solid rgba(0,0,0,.18);
  border-radius: 999px;
  padding: 6px 11px;
  color: #17211f;
  background: rgba(255,255,255,.9);
  box-shadow: 0 8px 22px rgba(0,0,0,.16);
  font-size: .7rem;
  font-weight: 700;
  pointer-events: none;
  backdrop-filter: blur(8px);
}

.public-map-status[data-kind="warning"] {
  color: #7b4200;
}

.public-map-status[data-kind="error"] {
  color: #9a1e1e;
}

.public-map-status.hidden {
  display: none;
}

.public-map-side {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
  gap: 10px;
  max-height: 238px;
  padding: 10px;
  border-top: 1px solid rgba(255,255,255,.1);
  background: rgba(5,7,8,.96);
}

.public-map-selected,
.public-map-nearby-wrap {
  min-width: 0;
  overflow: auto;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 11px;
  padding: 11px;
  background: rgba(255,255,255,.035);
  scrollbar-width: thin;
}

.public-map-selected {
  display: grid;
  align-content: start;
  gap: 9px;
  color: rgba(255,255,255,.58);
}

.public-map-selected-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  color: #f5f5f0;
}

.public-map-selected-head > div {
  display: grid;
  gap: 3px;
}

.public-map-selected-head small {
  color: rgba(255,255,255,.48);
  font-size: .68rem;
}

.public-map-selected-head strong {
  line-height: 1.18;
}

.public-map-active-badge {
  flex: 0 0 auto;
  padding: 3px 7px;
  border: 1px solid rgba(107,205,255,.42);
  border-radius: 999px;
  color: #91dcff;
  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .04em;
}

.public-map-selected-meta {
  display: grid;
  gap: 3px;
}

.public-map-selected-meta small {
  color: rgba(255,255,255,.54);
  overflow-wrap: anywhere;
}

.public-map-selected-actions {
  display: grid;
  gap: 7px;
}

.public-map-open-button {
  min-height: 36px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 9px;
  padding: 0 12px;
  color: #050505;
  background: #f5f5f0;
  cursor: pointer;
  font-weight: 800;
}

.public-map-open-button:hover {
  background: #fff;
}

.public-map-current-note {
  color: rgba(255,255,255,.47);
  font-size: .72rem;
}

.public-map-nearby-wrap {
  display: grid;
  align-content: start;
  gap: 8px;
}

.public-map-side-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.public-map-side-title small {
  color: rgba(255,255,255,.42);
  font-size: .66rem;
}

.public-map-nearby {
  display: grid;
  gap: 5px;
  color: rgba(255,255,255,.48);
  font-size: .72rem;
}

.public-map-nearby-row {
  display: grid;
  justify-items: start;
  gap: 2px;
  width: 100%;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  padding: 7px 8px;
  color: #f5f5f0;
  text-align: left;
  background: rgba(0,0,0,.14);
  cursor: pointer;
}

.public-map-nearby-row:hover {
  border-color: rgba(107,205,255,.45);
  background: rgba(107,205,255,.065);
}

.public-map-nearby-row small {
  color: rgba(255,255,255,.46);
}

.public-map-panel .leaflet-container {
  font-family: inherit;
}

.public-map-panel .leaflet-tooltip {
  display: grid;
  gap: 2px;
  border: 1px solid rgba(0,0,0,.16);
  border-radius: 9px;
  color: #17211f;
  background: rgba(255,255,255,.96);
  box-shadow: 0 9px 26px rgba(0,0,0,.17);
}

.public-map-panel .leaflet-tooltip strong,
.public-map-panel .leaflet-tooltip small {
  display: block;
}

.public-map-panel .leaflet-control-attribution {
  font-size: 9px;
}

body.public-map-open .viewer-nav {
  opacity: .25;
  pointer-events: none;
}

@media (max-width: 900px) {
  .public-map-panel {
    grid-template-columns: minmax(0, 1fr) minmax(380px, 68vw);
  }

  .public-map-toolbar {
    grid-template-columns: minmax(0, 1fr) minmax(120px, .75fr);
  }

  .public-map-check,
  #public-map-fit {
    align-self: center;
  }
}

@media (max-width: 640px) {
  .public-map-panel {
    grid-template-columns: 1fr;
  }

  .public-map-backdrop {
    display: none;
  }

  .public-map-drawer {
    grid-column: 1;
    width: 100%;
    border-left: 0;
    transform: translateY(102%);
  }

  body.public-map-open .public-map-drawer {
    transform: translateY(0);
  }

  .public-map-head {
    min-height: 50px;
    padding: 7px 9px;
  }

  .public-map-toolbar {
    grid-template-columns: minmax(0, 1fr) minmax(108px, .72fr);
    gap: 6px;
    padding: 7px 8px;
  }

  .public-map-toolbar input[type="search"],
  .public-map-toolbar select,
  .public-map-toolbar .icon-button {
    min-height: 32px;
    font-size: .7rem;
  }

  .public-map-check {
    min-height: 30px;
    font-size: .68rem;
  }

  .public-map-content {
    grid-template-rows: minmax(210px, 1fr) auto;
  }

  .public-map-canvas {
    min-height: 220px;
  }

  .public-map-side {
    grid-template-columns: 1fr;
    max-height: 230px;
    padding: 7px;
  }

  .public-map-nearby-wrap {
    display: none;
  }

  .public-map-selected {
    padding: 9px;
  }
}

@media (orientation: landscape) and (max-height: 540px) {
  .public-map-head {
    min-height: 42px;
    padding-block: 5px;
  }

  .public-map-eyebrow {
    display: none;
  }

  .public-map-toolbar {
    padding-block: 5px;
  }

  .public-map-content {
    grid-template-rows: minmax(170px, 1fr) 106px;
  }

  .public-map-side {
    grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
    max-height: 106px;
    padding: 5px;
  }

  .public-map-selected,
  .public-map-nearby-wrap {
    padding: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .public-map-backdrop,
  .public-map-drawer {
    transition-duration: .12s !important;
  }
}


/* ==========================================================================
   v6.19 — publiczny kompas panoramy
   ========================================================================== */

.public-compass {
  position: absolute;
  z-index: 720;
  right: 18px;
  top: 18px;
  width: min(292px, calc(100% - 36px));
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 16px;
  color: #f7f7f3;
  background:
    linear-gradient(160deg, rgba(20,23,24,.94), rgba(5,7,8,.91));
  box-shadow: 0 18px 48px rgba(0,0,0,.42);
  backdrop-filter: blur(14px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-9px) scale(.97);
  pointer-events: none;
  transition:
    opacity .24s ease,
    transform .28s cubic-bezier(.2,.8,.2,1),
    visibility 0s linear .28s;
}

body.public-compass-open .public-compass {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  transition-delay: 0s;
}

.public-compass-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 11px 8px 14px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.public-compass-head > div {
  display: flex;
  align-items: baseline;
  gap: 9px;
}

.public-compass-head span {
  color: rgba(255,255,255,.48);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.public-compass-head strong {
  font-size: 1.05rem;
}

.public-compass-body {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  padding: 13px;
}

.public-compass-dial {
  position: relative;
  width: 108px;
  height: 108px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255,255,255,.07), transparent 65%),
    rgba(0,0,0,.19);
  box-shadow:
    inset 0 0 22px rgba(0,0,0,.35),
    0 9px 24px rgba(0,0,0,.24);
}

.public-compass-pointer {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: -2px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 13px solid #ff5d4a;
  transform: translateX(-50%);
  filter: drop-shadow(0 2px 3px rgba(0,0,0,.48));
}

.public-compass-rose {
  --compass-bearing: 0;
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 50%;
  transform: rotate(calc(var(--compass-bearing) * -1deg));
  transition: transform .08s linear;
}

.public-compass-rose b {
  position: absolute;
  font-size: .7rem;
  line-height: 1;
}

.public-compass-rose .north {
  left: 50%;
  top: 6px;
  color: #ff7567;
  transform: translateX(-50%);
}

.public-compass-rose .east {
  right: 7px;
  top: 50%;
  transform: translateY(-50%);
}

.public-compass-rose .south {
  left: 50%;
  bottom: 6px;
  transform: translateX(-50%);
}

.public-compass-rose .west {
  left: 7px;
  top: 50%;
  transform: translateY(-50%);
}

.public-compass-rose .tick {
  position: absolute;
  left: calc(50% - 1px);
  top: 2px;
  width: 2px;
  height: 7px;
  background: rgba(255,255,255,.38);
  transform-origin: 1px 43px;
}

.public-compass-rose .tick-0   { transform: rotate(0deg); }
.public-compass-rose .tick-45  { transform: rotate(45deg); }
.public-compass-rose .tick-90  { transform: rotate(90deg); }
.public-compass-rose .tick-135 { transform: rotate(135deg); }
.public-compass-rose .tick-180 { transform: rotate(180deg); }
.public-compass-rose .tick-225 { transform: rotate(225deg); }
.public-compass-rose .tick-270 { transform: rotate(270deg); }
.public-compass-rose .tick-315 { transform: rotate(315deg); }

.public-compass-center {
  position: absolute;
  z-index: 6;
  left: 50%;
  top: 50%;
  width: 9px;
  height: 9px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #111;
  transform: translate(-50%, -50%);
}

.public-compass-data {
  display: grid;
  align-content: center;
  gap: 5px;
  min-width: 0;
}

.public-compass-data > strong {
  font-size: 1.9rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.public-compass-data small {
  color: rgba(255,255,255,.5);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#public-compass-north {
  min-height: 34px;
  margin-top: 5px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 9px;
  color: #090909;
  background: #f6f6f1;
  cursor: pointer;
  font-size: .72rem;
  font-weight: 800;
}

#public-compass-north:hover {
  background: #fff;
}

body.public-map-open .public-compass {
  opacity: 0;
  pointer-events: none;
}

body.cinematic-boot:not(.cinematic-ui-ready) .public-compass {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 700px) {
  .public-compass {
    right: 9px;
    top: 9px;
    width: min(260px, calc(100% - 18px));
    border-radius: 13px;
  }

  .public-compass-body {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 10px;
    padding: 9px;
  }

  .public-compass-dial {
    width: 84px;
    height: 84px;
  }

  .public-compass-rose {
    inset: 7px;
  }

  .public-compass-rose .tick {
    transform-origin: 1px 33px;
    height: 5px;
  }

  .public-compass-data > strong {
    font-size: 1.55rem;
  }
}

@media (orientation: landscape) and (max-height: 520px) {
  .public-compass {
    top: 7px;
    right: 7px;
    width: 238px;
  }

  .public-compass-head {
    padding-block: 5px;
  }

  .public-compass-body {
    grid-template-columns: 72px minmax(0, 1fr);
    padding: 7px;
  }

  .public-compass-dial {
    width: 68px;
    height: 68px;
  }

  .public-compass-rose {
    inset: 5px;
  }

  .public-compass-rose .tick {
    transform-origin: 1px 27px;
    height: 4px;
  }

  .public-compass-rose b {
    font-size: .58rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .public-compass,
  .public-compass-rose {
    transition-duration: .1s !important;
  }
}


/* ==========================================================================
   v6.20 — nowa prezentacja galerii panoram
   ========================================================================== */

:root {
  --dock-h: 0px !important;
}

.viewer-area {
  position: relative;
  grid-template-rows: minmax(0, 1fr) !important;
}

.gallery-panel.thumb-dock {
  position: absolute !important;
  z-index: 810;
  inset: 0;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto;
  width: auto !important;
  height: auto !important;
  min-width: 0;
  min-height: 0;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  color: #f6f6f2 !important;
  box-shadow: none !important;
  opacity: 0 !important;
  visibility: hidden;
  pointer-events: none !important;
  transition:
    opacity .28s ease,
    visibility 0s linear .34s !important;
}

body.gallery-open .gallery-panel.thumb-dock {
  opacity: 1 !important;
  visibility: visible;
  pointer-events: auto !important;
  transition-delay: 0s !important;
}

.gallery-backdrop {
  grid-row: 1 / -1;
  grid-column: 1;
  width: 100%;
  height: 100%;
  border: 0;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.05) 0%,
      rgba(0,0,0,.16) 48%,
      rgba(0,0,0,.58) 100%
    );
  opacity: 0;
  cursor: default;
  transition: opacity .3s ease;
}

body.gallery-open .gallery-backdrop {
  opacity: 1;
}

.gallery-drawer {
  grid-row: 2;
  grid-column: 1;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  width: 100%;
  max-height: min(58vh, 610px);
  min-height: 330px;
  overflow: hidden;
  border-top: 1px solid rgba(255,255,255,.16);
  color: #f7f7f3;
  background:
    linear-gradient(180deg, rgba(20,22,23,.985), rgba(6,8,9,.99));
  box-shadow: 0 -24px 72px rgba(0,0,0,.48);
  backdrop-filter: blur(20px);
  transform: translateY(102%);
  transition: transform .38s cubic-bezier(.22,.8,.2,1);
}

body.gallery-open .gallery-drawer {
  transform: translateY(0);
}

.gallery-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 68px;
  padding: 12px 22px 10px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.gallery-drawer-head > div {
  display: grid;
  gap: 4px;
}

.gallery-eyebrow {
  color: rgba(255,255,255,.43);
  font-size: .66rem;
  font-weight: 850;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.gallery-heading-line {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.gallery-heading-line strong {
  font-size: 1.08rem;
}

.gallery-heading-line small {
  color: rgba(255,255,255,.48);
  font-size: .72rem;
}

.gallery-close.icon-button,
.gallery-map-open.icon-button {
  color: rgba(255,255,255,.66) !important;
}

.gallery-close.icon-button:hover,
.gallery-map-open.icon-button:hover {
  color: #fff !important;
}

.gallery-toolbar {
  display: grid;
  grid-template-columns: minmax(230px, 360px) minmax(0, 1fr) auto;
  align-items: end;
  gap: 14px;
  min-width: 0;
  padding: 10px 22px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.022);
}

.gallery-search-label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: rgba(255,255,255,.45);
  font-size: .68rem;
  font-weight: 750;
}

.gallery-search-label input {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 9px;
  padding: 0 11px;
  color: #f7f7f3;
  outline: none;
  background: rgba(255,255,255,.055);
}

.gallery-search-label input:focus {
  border-color: rgba(127,207,255,.72);
  box-shadow: 0 0 0 3px rgba(75,164,224,.13);
}

.gallery-category-filter {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px 1px 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}

.gallery-category-button {
  flex: 0 0 auto;
  min-height: 34px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  padding: 0 11px;
  color: rgba(255,255,255,.57);
  background: rgba(255,255,255,.035);
  cursor: pointer;
  font-size: .72rem;
  white-space: nowrap;
}

.gallery-category-button:hover {
  color: #fff;
  background: rgba(255,255,255,.075);
}

.gallery-category-button.active {
  border-color: #f5f5ef;
  color: #080808;
  background: #f5f5ef;
}

.gallery-grid {
  display: grid !important;
  grid-template-columns:
    repeat(auto-fill, minmax(min(245px, 100%), 1fr));
  align-content: start;
  gap: 15px !important;
  width: 100%;
  height: auto !important;
  min-width: 0;
  min-height: 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 16px 22px 24px !important;
  background: transparent !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent;
}

.gallery-card {
  position: relative;
  display: grid !important;
  grid-template-rows: auto auto !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 14px !important;
  color: #f6f6f2 !important;
  text-align: left;
  background: rgba(255,255,255,.035) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.18) !important;
  cursor: pointer;
  opacity: 0;
  transform: translateY(12px);
  animation:
    gallery-card-enter .38s
    calc(min(var(--gallery-order), 12) * 22ms)
    cubic-bezier(.2,.8,.2,1)
    forwards;
}

@keyframes gallery-card-enter {
  to {
    opacity: 1;
    transform: none;
  }
}

.gallery-card:hover {
  border-color: rgba(255,255,255,.32) !important;
  background: rgba(255,255,255,.065) !important;
  transform: translateY(-2px);
  box-shadow: 0 15px 34px rgba(0,0,0,.28) !important;
}

.gallery-card.active {
  border-color: rgba(116,213,255,.95) !important;
  background: rgba(81,181,229,.085) !important;
  box-shadow:
    0 0 0 3px rgba(79,188,239,.14),
    0 14px 34px rgba(0,0,0,.28) !important;
}

.gallery-thumb {
  position: relative;
  display: block !important;
  width: 100%;
  height: auto !important;
  aspect-ratio: 16 / 9;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #111 !important;
}

.gallery-thumb img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  outline: 0 !important;
  border-radius: 0 !important;
  transform: scale(1.001);
  transition: transform .35s ease, filter .35s ease;
}

.gallery-card:hover .gallery-thumb img {
  transform: scale(1.035);
}

.gallery-card.active .gallery-thumb img {
  outline: 0 !important;
  filter: saturate(1.06) contrast(1.03);
}

.gallery-card.active .gallery-thumb::after {
  content: "" !important;
  position: absolute;
  inset: 0;
  display: block !important;
  border: 3px solid rgba(119,218,255,.9);
  pointer-events: none;
}

.gallery-type,
.gallery-card-category,
.gallery-current-badge {
  position: absolute;
  z-index: 2;
  top: 8px !important;
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  border: 1px solid rgba(255,255,255,.24) !important;
  border-radius: 999px !important;
  padding: 0 8px !important;
  color: #111 !important;
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(12px);
  font-size: .6rem !important;
  font-weight: 850 !important;
  line-height: 1;
  letter-spacing: .02em !important;
}

.gallery-type {
  left: 8px !important;
  right: auto !important;
  bottom: auto !important;
}

.gallery-card-category {
  right: 8px;
  color: #f8f8f4 !important;
  background: rgba(5,7,8,.66) !important;
}

.gallery-current-badge {
  top: auto !important;
  right: 8px;
  bottom: 8px;
  border-color: rgba(114,218,255,.45) !important;
  color: #b9eaff !important;
  background: rgba(5,30,42,.78) !important;
}

.gallery-card-content {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 11px 12px 12px;
}

.gallery-card-content strong {
  display: -webkit-box !important;
  min-width: 0;
  padding: 0 !important;
  overflow: hidden;
  color: #f7f7f3 !important;
  font-size: .9rem !important;
  font-weight: 750 !important;
  line-height: 1.22 !important;
  white-space: normal !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.gallery-card-location {
  display: block !important;
  min-width: 0;
  overflow: hidden;
  color: rgba(255,255,255,.49) !important;
  font-size: .7rem !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gallery-card-details {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 18px;
}

.gallery-card-details small {
  display: inline-flex !important;
  align-items: center;
  min-height: 19px;
  border-radius: 999px;
  padding: 0 7px;
  color: rgba(255,255,255,.58) !important;
  background: rgba(255,255,255,.055);
  font-size: .61rem !important;
  line-height: 1 !important;
}

.gallery-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 190px;
  border: 1px dashed rgba(255,255,255,.14);
  border-radius: 14px;
  color: rgba(255,255,255,.53);
  text-align: center;
}

.gallery-empty strong {
  color: #f7f7f3;
}

.gallery-empty small {
  max-width: 440px;
}

.gallery-empty-reset {
  min-height: 34px;
  margin-top: 5px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 9px;
  padding: 0 12px;
  color: #111;
  background: #f5f5ef;
  cursor: pointer;
  font-weight: 750;
}

body.gallery-open .viewer-nav,
body.gallery-open .psv-navbar {
  opacity: .2 !important;
  pointer-events: none !important;
}

@media (min-width: 1600px) {
  .gallery-grid {
    grid-template-columns:
      repeat(auto-fill, minmax(285px, 1fr));
    gap: 18px !important;
  }

  .gallery-drawer {
    max-height: min(56vh, 660px);
  }
}

@media (max-width: 900px) {
  .gallery-drawer {
    max-height: min(66vh, 620px);
  }

  .gallery-toolbar {
    grid-template-columns: minmax(190px, 290px) minmax(0, 1fr);
  }

  .gallery-map-open {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .gallery-grid {
    grid-template-columns:
      repeat(auto-fill, minmax(205px, 1fr));
  }
}

@media (max-width: 640px) {
  .gallery-panel.thumb-dock {
    grid-template-rows: minmax(0, 1fr);
  }

  .gallery-backdrop {
    display: none;
  }

  .gallery-drawer {
    grid-row: 1;
    width: 100%;
    height: 100%;
    max-height: none;
    min-height: 0;
    border-top: 0;
    transform: translateY(102%);
  }

  .gallery-drawer-head {
    min-height: 52px;
    padding: 7px 10px 6px;
  }

  .gallery-eyebrow {
    display: none;
  }

  .gallery-heading-line strong {
    font-size: .96rem;
  }

  .gallery-heading-line small {
    font-size: .65rem;
  }

  .gallery-toolbar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
    padding: 7px 9px;
  }

  .gallery-search-label {
    grid-column: 1;
  }

  .gallery-search-label > span {
    display: none;
  }

  .gallery-search-label input {
    min-height: 34px;
    font-size: .75rem;
  }

  .gallery-category-filter {
    grid-column: 1 / -1;
    grid-row: 2;
    padding-bottom: 2px;
  }

  .gallery-category-button {
    min-height: 31px;
    padding-inline: 9px;
    font-size: .66rem;
  }

  .gallery-map-open {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    font-size: .7rem !important;
  }

  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    padding: 9px 9px 22px !important;
  }

  .gallery-card {
    border-radius: 10px !important;
  }

  .gallery-card-content {
    gap: 4px;
    padding: 8px 8px 9px;
  }

  .gallery-card-content strong {
    font-size: .76rem !important;
    -webkit-line-clamp: 2;
  }

  .gallery-card-location {
    font-size: .62rem !important;
  }

  .gallery-card-details {
    display: none;
  }

  .gallery-type,
  .gallery-card-category,
  .gallery-current-badge {
    min-height: 19px;
    padding-inline: 6px !important;
    font-size: .51rem !important;
  }

  .gallery-type {
    left: 5px !important;
    top: 5px !important;
  }

  .gallery-card-category {
    top: 5px !important;
    right: 5px;
    max-width: 58%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .gallery-current-badge {
    right: 5px;
    bottom: 5px;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  .gallery-drawer-head {
    min-height: 44px;
    padding-block: 4px;
  }

  .gallery-toolbar {
    padding-block: 5px;
  }

  .gallery-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-top: 7px !important;
  }

  .gallery-card-content {
    padding-block: 6px 7px;
  }

  .gallery-card-location {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-panel.thumb-dock,
  .gallery-backdrop,
  .gallery-drawer,
  .gallery-card,
  .gallery-thumb img {
    animation: none !important;
    transition-duration: .1s !important;
  }

  .gallery-card {
    opacity: 1;
    transform: none;
  }
}


/* ==========================================================================
   v6.20.1 — lekka galeria: poziomy desktop, lista na telefonie
   ========================================================================== */

.gallery-drawer {
  max-height: min(42vh, 430px);
  min-height: 255px;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.gallery-drawer-head {
  min-height: 55px;
  padding: 8px 18px 7px;
}

.gallery-toolbar {
  grid-template-columns: minmax(220px, 330px) minmax(0, 1fr) auto;
  gap: 10px;
  padding: 8px 18px;
}

.gallery-filter-toggle {
  display: none !important;
}

.gallery-grid {
  display: flex !important;
  flex-flow: row nowrap;
  align-items: stretch;
  gap: 12px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity;
  overscroll-behavior-x: contain;
  padding: 13px 18px 18px !important;
}

.gallery-card.gallery-card-light {
  flex: 0 0 clamp(245px, 21vw, 320px);
  grid-template-rows: auto minmax(82px, auto) !important;
  scroll-snap-align: start;
  border-left: 3px solid var(--gallery-accent) !important;
  border-radius: 11px !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.18) !important;
}

.gallery-card.gallery-card-light:hover {
  transform: translateY(-1px);
}

.gallery-card.gallery-card-light.active {
  border-color: rgba(116,213,255,.85) !important;
  border-left-color: var(--gallery-accent) !important;
}

.gallery-card-light .gallery-thumb {
  aspect-ratio: 16 / 9;
}

.gallery-card-light .gallery-card-content {
  align-content: start;
  gap: 4px;
  padding: 9px 10px 10px;
}

.gallery-card-category-text {
  display: block;
  overflow: hidden;
  color: var(--gallery-accent) !important;
  font-size: .58rem !important;
  font-weight: 850;
  letter-spacing: .07em;
  line-height: 1.1;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.gallery-card-light .gallery-card-content strong {
  font-size: .82rem !important;
  -webkit-line-clamp: 1;
}

.gallery-card-light .gallery-card-location {
  font-size: .66rem !important;
}

.gallery-card-meta {
  display: flex;
  min-height: 18px;
  align-items: center;
}

.gallery-card-meta small {
  display: inline-flex;
  min-height: 19px;
  align-items: center;
  border-radius: 999px;
  padding: 0 7px;
  color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.055);
  font-size: .59rem;
}

.gallery-current-badge {
  top: 7px !important;
  right: 7px;
  bottom: auto;
}

.gallery-load-more {
  flex: 0 0 190px;
  align-self: stretch;
  min-height: 150px;
  border: 1px dashed rgba(255,255,255,.18);
  border-radius: 11px;
  color: rgba(255,255,255,.64);
  background: rgba(255,255,255,.025);
  cursor: pointer;
  font-weight: 750;
  scroll-snap-align: start;
}

.gallery-load-more:hover {
  border-color: rgba(116,213,255,.55);
  color: #fff;
  background: rgba(116,213,255,.06);
}

@media (min-width: 1600px) {
  .gallery-drawer {
    max-height: min(40vh, 460px);
  }

  .gallery-card.gallery-card-light {
    flex-basis: clamp(275px, 19vw, 345px);
  }
}

@media (max-width: 900px) and (min-width: 641px) {
  .gallery-drawer {
    max-height: min(48vh, 460px);
  }

  .gallery-toolbar {
    grid-template-columns: minmax(190px, 270px) minmax(0, 1fr);
  }

  .gallery-map-open {
    grid-column: 1 / -1;
  }

  .gallery-card.gallery-card-light {
    flex-basis: 245px;
  }
}

@media (max-width: 640px) {
  .gallery-drawer {
    height: 100%;
    max-height: none;
    min-height: 0;
  }

  .gallery-drawer-head {
    min-height: 49px;
    padding: 6px 9px 5px;
  }

  .gallery-toolbar {
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    padding: 6px 8px;
  }

  .gallery-search-label {
    grid-column: 1;
    grid-row: 1;
  }

  .gallery-filter-toggle {
    display: inline-flex !important;
    grid-column: 2;
    grid-row: 1;
  }

  .gallery-map-open {
    grid-column: 3;
    grid-row: 1;
    font-size: .67rem !important;
  }

  .gallery-category-filter {
    display: none;
    grid-column: 1 / -1;
    grid-row: 2;
    max-height: 76px;
    overflow: auto;
    padding: 3px 0 1px;
  }

  body.gallery-filters-open .gallery-category-filter {
    display: flex;
  }

  .gallery-grid {
    display: grid !important;
    grid-template-columns: 1fr;
    align-content: start;
    gap: 7px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scroll-snap-type: none;
    padding: 8px 8px 18px !important;
  }

  .gallery-card.gallery-card-light {
    display: grid !important;
    grid-template-columns: minmax(118px, 42%) minmax(0, 1fr) !important;
    grid-template-rows: minmax(92px, auto) !important;
    width: 100% !important;
    min-height: 98px;
    border-left-width: 3px !important;
    border-radius: 9px !important;
    scroll-snap-align: none;
  }

  .gallery-card-light .gallery-thumb {
    width: 100%;
    height: 100% !important;
    min-height: 92px;
    aspect-ratio: auto;
  }

  .gallery-card-light .gallery-card-content {
    align-content: center;
    gap: 5px;
    padding: 9px 10px;
  }

  .gallery-card-light .gallery-card-content strong {
    font-size: .79rem !important;
    line-height: 1.22 !important;
    -webkit-line-clamp: 2;
  }

  .gallery-card-light .gallery-card-location {
    display: block !important;
    font-size: .64rem !important;
  }

  .gallery-card-category-text {
    font-size: .54rem !important;
  }

  .gallery-card-meta {
    display: flex !important;
  }

  .gallery-current-badge {
    top: 5px !important;
    right: 5px;
  }

  .gallery-load-more {
    width: 100%;
    min-height: 48px;
    border-radius: 9px;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gallery-card.gallery-card-light {
    grid-template-columns: minmax(105px, 42%) minmax(0, 1fr) !important;
    min-height: 84px;
  }

  .gallery-card-light .gallery-thumb {
    min-height: 82px;
  }

  .gallery-card-light .gallery-card-location {
    display: none !important;
  }
}


/* ==========================================================================
   v6.20.2 — przezroczysta belka, menu „więcej”, galeria bez pustych pól
   ========================================================================== */

:root {
  --topbar-h: 58px !important;
}

.site-shell {
  position: relative !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) var(--footer-h) !important;
  min-height: 100vh !important;
  background: #050505 !important;
}

.site-topbar {
  position: absolute !important;
  z-index: 1100 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  display: grid !important;
  grid-template-columns: auto minmax(150px, 430px) minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  height: var(--topbar-h) !important;
  min-height: var(--topbar-h) !important;
  padding:
    7px max(14px, env(safe-area-inset-right))
    7px max(14px, env(safe-area-inset-left)) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
  color: #fff !important;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.50) 0%,
      rgba(0,0,0,.22) 68%,
      rgba(0,0,0,.04) 100%
    ) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.viewer-area {
  grid-row: 1 !important;
  min-height: 0 !important;
}

.site-footer {
  grid-row: 2 !important;
}

.brand-logo {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.45));
}

.brand-logo img {
  width: 38px !important;
  height: 38px !important;
  max-width: 38px !important;
  max-height: 38px !important;
}

.category-filter-data {
  display: none !important;
}

.site-search {
  position: relative;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex;
  align-items: center;
  min-width: 0;
  height: 36px;
}

.site-search-icon {
  position: absolute;
  z-index: 1;
  left: 1px;
  top: 50%;
  width: 12px;
  height: 12px;
  border: 1.5px solid rgba(255,255,255,.76);
  border-radius: 50%;
  transform: translateY(-58%);
  pointer-events: none;
}

.site-search-icon::after {
  content: "";
  position: absolute;
  right: -5px;
  bottom: -3px;
  width: 6px;
  height: 1.5px;
  border-radius: 999px;
  background: rgba(255,255,255,.76);
  transform: rotate(45deg);
  transform-origin: left center;
}

.site-search input {
  width: 100%;
  min-width: 0;
  height: 34px;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.46) !important;
  border-radius: 0 !important;
  padding: 0 28px 0 23px !important;
  outline: 0 !important;
  color: #fff !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .82rem !important;
  font-weight: 400 !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.7);
}

.site-search input::placeholder {
  color: rgba(255,255,255,.7) !important;
  opacity: 1;
}

.site-search input:focus {
  border-bottom-color: #fff !important;
}

.site-search input::-webkit-search-cancel-button {
  filter: invert(1);
  opacity: .7;
}

.top-actions {
  grid-column: 4 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 14px !important;
  min-width: 0 !important;
  height: 40px !important;
  overflow: visible !important;
}

.site-topbar .top-actions > .icon-button,
.site-topbar .top-more-toggle {
  min-height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: rgba(255,255,255,.82) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .74rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-shadow: 0 1px 7px rgba(0,0,0,.88);
}

.site-topbar .top-actions > .icon-button:hover,
.site-topbar .top-more-toggle:hover,
.site-topbar .top-actions > .icon-button.active,
.site-topbar .top-more-toggle.active {
  color: #fff !important;
  text-decoration: none !important;
}

.site-topbar .top-actions > .icon-button.active,
.site-topbar .top-more-toggle.active {
  font-weight: 800 !important;
}

.top-more {
  position: relative;
  display: flex;
  align-items: center;
}

.top-more-menu {
  position: absolute;
  z-index: 1200;
  top: calc(100% + 10px);
  right: -4px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  width: min(330px, calc(100vw - 24px));
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  padding: 6px;
  background: rgba(8,10,11,.94);
  box-shadow: 0 18px 50px rgba(0,0,0,.48);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-7px) scale(.98);
  transform-origin: top right;
  pointer-events: none;
  transition:
    opacity .18s ease,
    transform .22s ease,
    visibility 0s linear .22s;
}

body.top-more-open .top-more-menu {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  transition-delay: 0s;
}

.site-topbar .top-more-menu .icon-button,
.site-topbar .top-more-menu .admin-link {
  display: flex;
  justify-content: flex-start;
  min-width: 0;
  min-height: 38px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  color: rgba(255,255,255,.72) !important;
  background: transparent !important;
  font-size: .74rem !important;
  font-weight: 500 !important;
  text-align: left;
  text-decoration: none !important;
}

.site-topbar .top-more-menu .icon-button:hover,
.site-topbar .top-more-menu .admin-link:hover,
.site-topbar .top-more-menu .icon-button.active {
  color: #fff !important;
  background: rgba(255,255,255,.075) !important;
  text-decoration: none !important;
}

.site-topbar .top-more-menu .hidden {
  display: none !important;
}

/* Galeria: bez osobnego pola wyszukiwania i bez dolnych pustych pól kart. */
.gallery-panel.thumb-dock {
  z-index: 900 !important;
}

.gallery-drawer {
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: min(48vh, 390px) !important;
}

.gallery-drawer-head {
  min-height: 48px !important;
  padding: 7px 16px !important;
}

.gallery-heading-line {
  min-width: 0;
}

.gallery-heading-line strong {
  font-size: .92rem !important;
}

.gallery-heading-line small {
  font-size: .65rem !important;
}

.gallery-head-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.gallery-filter-toggle {
  display: inline-flex !important;
}

.gallery-category-filter {
  display: none !important;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  padding: 7px 16px 8px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  scrollbar-width: thin;
}

body.gallery-filters-open .gallery-category-filter {
  display: flex !important;
}

.gallery-grid {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: 276px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 10px 12px 13px !important;
}

.gallery-card.gallery-card-minimal {
  flex: 1 0 220px !important;
  width: auto !important;
  min-width: 220px !important;
  max-width: none !important;
  grid-template-rows: auto 34px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: 0 7px 20px rgba(0,0,0,.17) !important;
}

.gallery-card.gallery-card-minimal:hover {
  border-color: rgba(255,255,255,.28) !important;
  background: rgba(255,255,255,.045) !important;
}

.gallery-card.gallery-card-minimal.active {
  border-color: rgba(117,217,255,.88) !important;
  box-shadow:
    0 0 0 2px rgba(89,195,242,.12),
    0 8px 22px rgba(0,0,0,.2) !important;
}

.gallery-card-minimal .gallery-thumb {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
}

.gallery-card-minimal .gallery-card-content {
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 5px 8px !important;
}

.gallery-card-minimal .gallery-card-content strong {
  display: block !important;
  width: 100%;
  overflow: hidden;
  color: #f7f7f3 !important;
  font-size: .69rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

.gallery-current-badge {
  top: 6px !important;
  right: 6px !important;
  bottom: auto !important;
  min-height: 19px !important;
  padding-inline: 6px !important;
  font-size: .5rem !important;
}

.gallery-load-more {
  flex: 0 0 160px !important;
  min-height: 130px !important;
}

.gallery-empty {
  width: 100%;
  min-height: 130px !important;
}

@media (min-width: 641px) {
  .gallery-card.gallery-card-minimal {
    flex-grow: 1 !important;
  }
}

@media (max-width: 760px) {
  :root {
    --topbar-h: 50px !important;
    --footer-h: 0px !important;
  }

  .site-shell {
    grid-template-rows: minmax(0, 1fr) 0 !important;
  }

  .site-footer {
    display: none !important;
  }

  .site-topbar {
    grid-template-columns: 30px minmax(74px, 1fr) auto !important;
    gap: 8px !important;
    height: var(--topbar-h) !important;
    min-height: var(--topbar-h) !important;
    padding:
      max(5px, env(safe-area-inset-top))
      max(8px, env(safe-area-inset-right))
      5px
      max(8px, env(safe-area-inset-left)) !important;
  }

  .brand-logo {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
  }

  .brand-logo img {
    width: 28px !important;
    height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
  }

  .site-search {
    grid-column: 2 !important;
    height: 32px;
  }

  .site-search input {
    height: 31px;
    padding-right: 20px !important;
    font-size: .72rem !important;
  }

  .top-actions {
    grid-column: 3 !important;
    gap: 10px !important;
    height: 32px !important;
  }

  .site-topbar .top-actions > .icon-button,
  .site-topbar .top-more-toggle {
    font-size: .67rem !important;
  }

  .top-more-menu {
    position: fixed;
    top: calc(var(--topbar-h) + env(safe-area-inset-top) + 2px);
    right: max(7px, env(safe-area-inset-right));
    grid-template-columns: 1fr;
    width: min(235px, calc(100vw - 14px));
    max-height: calc(100dvh - var(--topbar-h) - 16px);
    overflow-y: auto;
  }

  .site-topbar .top-more-menu .icon-button,
  .site-topbar .top-more-menu .admin-link {
    min-height: 40px !important;
    font-size: .75rem !important;
  }

  .gallery-panel.thumb-dock {
    padding-top: var(--topbar-h) !important;
  }

  .gallery-drawer {
    height: 100% !important;
    max-height: none !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
  }

  .gallery-drawer-head {
    min-height: 45px !important;
    padding: 5px 8px !important;
  }

  .gallery-head-actions {
    gap: 9px;
  }

  .gallery-category-filter {
    padding: 6px 8px 7px;
  }

  .gallery-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-content: start !important;
    gap: 6px !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 7px 7px 18px !important;
  }

  .gallery-card.gallery-card-minimal {
    display: grid !important;
    grid-template-columns: minmax(116px, 42%) minmax(0, 1fr) !important;
    grid-template-rows: minmax(86px, auto) !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 88px !important;
    border-radius: 8px !important;
  }

  .gallery-card-minimal .gallery-thumb {
    width: 100%;
    height: 100% !important;
    min-height: 86px !important;
    aspect-ratio: auto !important;
  }

  .gallery-card-minimal .gallery-card-content {
    min-height: 0 !important;
    padding: 9px 10px !important;
  }

  .gallery-card-minimal .gallery-card-content strong {
    font-size: .78rem !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .gallery-load-more {
    width: 100% !important;
    min-height: 46px !important;
  }
}

@media (max-width: 430px) {
  .site-topbar {
    grid-template-columns: 28px minmax(64px, 1fr) auto !important;
    gap: 7px !important;
  }

  .site-topbar #toggle-map {
    display: none !important;
  }

  .top-actions {
    gap: 9px !important;
  }

  .site-topbar .top-actions > .icon-button,
  .site-topbar .top-more-toggle {
    font-size: .63rem !important;
  }

  .site-search input::placeholder {
    color: rgba(255,255,255,.74) !important;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .gallery-card.gallery-card-minimal {
    grid-template-columns: minmax(102px, 40%) minmax(0, 1fr) !important;
    min-height: 74px !important;
  }

  .gallery-card-minimal .gallery-thumb {
    min-height: 72px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .top-more-menu {
    transition-duration: .1s !important;
  }
}


/* ==========================================================================
   v6.21.3 — widoczny przełącznik pinezek i obszarów
   ========================================================================== */

.top-layers {
  position: relative;
  display: flex;
  align-items: center;
}

.top-layers.hidden {
  display: none !important;
}

.site-topbar .top-layers-toggle {
  min-height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: rgba(255,255,255,.82) !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: .74rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-shadow: 0 1px 7px rgba(0,0,0,.88);
}

.site-topbar .top-layers-toggle:hover,
.site-topbar .top-layers-toggle.active {
  color: #fff !important;
}

.site-topbar .top-layers-toggle.has-visible-layer::after {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-left: 5px;
  border-radius: 50%;
  background: #7ddcff;
  box-shadow: 0 0 8px rgba(125,220,255,.9);
  vertical-align: middle;
}

.top-layers-menu {
  position: absolute;
  z-index: 1200;
  top: calc(100% + 10px);
  right: -10px;
  display: grid;
  width: min(245px, calc(100vw - 24px));
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  padding: 6px;
  background: rgba(8,10,11,.94);
  box-shadow: 0 18px 50px rgba(0,0,0,.48);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-7px) scale(.98);
  transform-origin: top right;
  pointer-events: none;
  transition:
    opacity .18s ease,
    transform .22s ease,
    visibility 0s linear .22s;
}

body.top-layers-open .top-layers-menu {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  transition-delay: 0s;
}

.site-topbar .top-layers-menu .icon-button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  min-height: 42px !important;
  padding: 0 34px 0 11px !important;
  border-radius: 8px !important;
  color: rgba(255,255,255,.72) !important;
  background: transparent !important;
  font-size: .75rem !important;
  font-weight: 500 !important;
  text-align: left;
}

.site-topbar .top-layers-menu .icon-button::after {
  content: "";
  position: absolute;
  right: 11px;
  width: 23px;
  height: 12px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 999px;
  background: rgba(255,255,255,.06);
}

.site-topbar .top-layers-menu .icon-button::before {
  content: "";
  position: absolute;
  z-index: 1;
  right: 22px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.48);
  transition:
    right .16s ease,
    background .16s ease;
}

.site-topbar .top-layers-menu .icon-button:hover {
  color: #fff !important;
  background: rgba(255,255,255,.075) !important;
}

.site-topbar .top-layers-menu .icon-button.active {
  color: #fff !important;
  background: rgba(79,183,235,.1) !important;
}

.site-topbar .top-layers-menu .icon-button.active::after {
  border-color: rgba(112,211,255,.7);
  background: rgba(87,190,239,.22);
}

.site-topbar .top-layers-menu .icon-button.active::before {
  right: 13px;
  background: #8ddfff;
  box-shadow: 0 0 7px rgba(141,223,255,.8);
}

.site-topbar .top-layers-menu .hidden {
  display: none !important;
}

@media (max-width: 760px) {
  .site-topbar .top-layers-toggle {
    font-size: .67rem !important;
  }

  .top-layers-menu {
    position: fixed;
    top: calc(var(--topbar-h) + env(safe-area-inset-top) + 2px);
    right: max(7px, env(safe-area-inset-right));
    width: min(245px, calc(100vw - 14px));
  }
}

@media (max-width: 430px) {
  .site-topbar .top-layers-toggle {
    font-size: .63rem !important;
  }
}


/* ==========================================================================
   v6.21.4 — bezpośrednie linki pinezki / obszary na desktopie
   ========================================================================== */

@media (min-width: 761px) {
  .top-layers {
    display: flex;
    align-items: center;
  }

  .top-layers.hidden {
    display: none !important;
  }

  .top-layers-toggle {
    display: none !important;
  }

  .top-layers-menu,
  body.top-layers-open .top-layers-menu {
    position: static !important;
    display: flex !important;
    align-items: center;
    gap: 14px;
    width: auto !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  .site-topbar .top-layers-menu .icon-button {
    position: static !important;
    display: inline-flex;
    min-width: 0 !important;
    min-height: 32px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: rgba(255,255,255,.82) !important;
    background: transparent !important;
    font-size: .74rem !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-shadow: 0 1px 7px rgba(0,0,0,.88);
  }

  .site-topbar .top-layers-menu .icon-button::before,
  .site-topbar .top-layers-menu .icon-button::after {
    display: none !important;
  }

  .site-topbar .top-layers-menu .icon-button:hover {
    color: #fff !important;
    background: transparent !important;
  }

  .site-topbar .top-layers-menu .icon-button.active {
    color: #8ddfff !important;
    background: transparent !important;
    font-weight: 800 !important;
  }

  .site-topbar .top-layers-menu .icon-button.active::after {
    content: "";
    display: inline-block !important;
    position: static !important;
    width: 5px !important;
    height: 5px !important;
    margin-left: 5px;
    border: 0 !important;
    border-radius: 50%;
    background: #8ddfff !important;
    box-shadow: 0 0 7px rgba(141,223,255,.85);
  }
}

@media (max-width: 760px) {
  .top-layers-toggle {
    display: inline-flex !important;
  }
}


/* ==========================================================================
   v6.22 — pinezki informacyjne i własne ikony
   ========================================================================== */

.native-info-custom-image,
.native-info-custom-mask {
  display: block;
  width: 100%;
  height: 100%;
}

.native-info-custom-image {
  object-fit: contain;
}

.native-info-custom-mask {
  background: currentColor;
  -webkit-mask-image: var(--info-pin-image);
  mask-image: var(--info-pin-image);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.native-info-marker[data-icon-source="custom"][data-halo="auto"]
.native-info-custom-image {
  filter:
    drop-shadow(0 0 1px rgba(0,0,0,.9))
    drop-shadow(0 2px 4px rgba(0,0,0,.68));
}

.native-info-marker[data-icon-source="custom"][data-halo="none"]
.native-info-custom-image {
  filter: none;
}

.native-info-marker[data-placement="point"] .native-info-icon {
  position: static;
  transform: none;
}

.info-pin-content {
  display: grid;
  gap: 12px;
  padding: 4px 2px 12px;
}

.info-pin-content h2 {
  margin: 0;
  color: #fff;
  font-size: 1.2rem;
  line-height: 1.22;
}

.info-pin-content p {
  margin: 0;
  color: rgba(255,255,255,.72);
  line-height: 1.55;
  white-space: pre-line;
}

.info-pin-content a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 38px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 9px;
  padding: 0 13px;
  color: #080808;
  background: #f6f6f1;
  font-weight: 800;
  text-decoration: none;
}

.info-pin-content a:hover {
  background: #fff;
}


/* ==========================================================================
   v6.22.5 — Arial, większy interfejs publiczny i trzy wiersze etykiety
   ========================================================================== */

html,
body,
body *,
body *::before,
body *::after {
  font-family: Arial, Helvetica, sans-serif !important;
}

.native-walk-label {
  display: grid;
  gap: 2px;
  width: max-content;
  min-width: 0;
  max-width: min(340px, 70vw);
  padding: 6px 10px;
  font-size: var(--pin-label-font-size, 18px);
  line-height: 1.08;
  text-align: center;
  text-overflow: clip;
  white-space: normal;
}

.native-walk-label-line {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 761px) {
  :root { --topbar-h: 86px !important; }

  .site-topbar {
    gap: 18px !important;
    padding-block: 12px !important;
  }

  .brand-logo {
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
  }

  .brand-logo img {
    width: 52px !important;
    height: 52px !important;
    max-width: 52px !important;
    max-height: 52px !important;
  }

  .site-search { height: 56px !important; }

  .site-search input {
    height: 54px !important;
    font-size: 1.55rem !important;
  }

  .site-search-icon {
    width: 18px !important;
    height: 18px !important;
  }

  .top-actions {
    gap: 20px !important;
    height: 58px !important;
  }

  .site-topbar .top-actions > .icon-button,
  .site-topbar .top-more-toggle,
  .site-topbar .top-layers-toggle,
  .site-topbar .top-layers-menu .icon-button {
    min-height: 48px !important;
    font-size: 1.45rem !important;
  }

  .site-topbar .top-more-menu .icon-button,
  .site-topbar .top-more-menu .admin-link {
    min-height: 58px !important;
    font-size: 1.35rem !important;
  }

  .top-more-menu {
    width: min(520px, calc(100vw - 30px)) !important;
  }

  .gallery-drawer-head {
    min-height: 76px !important;
    padding: 12px 20px !important;
  }

  .gallery-heading-line strong { font-size: 1.85rem !important; }
  .gallery-heading-line small { font-size: 1.2rem !important; }

  .gallery-head-actions .icon-button,
  .gallery-category-button,
  .gallery-load-more {
    font-size: 1.2rem !important;
  }

  .gallery-category-button {
    min-height: 46px !important;
    padding-inline: 16px !important;
  }

  .gallery-card-minimal .gallery-card-content {
    min-height: 58px !important;
    padding: 9px 12px !important;
  }

  .gallery-card-minimal .gallery-card-content strong {
    font-size: 1.35rem !important;
    line-height: 1.15 !important;
  }

  .caption-panel h1 { font-size: 2.2rem !important; }

  .caption-panel p,
  .viewer-meta,
  .viewer-status,
  .walk-transition,
  .flat-toolbar,
  .media-toolbar {
    font-size: 1.25rem !important;
  }

  .public-map-panel,
  .public-compass,
  .share-panel-inner,
  .psv-panel {
    font-size: 1.2rem !important;
  }
}

@media (max-width: 760px) {
  :root { --topbar-h: 72px !important; }

  .site-topbar {
    grid-template-columns: 38px minmax(82px, 1fr) auto !important;
    min-height: var(--topbar-h) !important;
  }

  .brand-logo,
  .brand-logo img {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
  }

  .site-search input {
    height: 42px !important;
    font-size: 1.25rem !important;
  }

  .site-topbar .top-actions > .icon-button,
  .site-topbar .top-more-toggle,
  .site-topbar .top-layers-toggle {
    font-size: 1.15rem !important;
  }

  .site-topbar .top-more-menu .icon-button,
  .site-topbar .top-more-menu .admin-link,
  .site-topbar .top-layers-menu .icon-button {
    min-height: 52px !important;
    font-size: 1.15rem !important;
  }

  .gallery-heading-line strong { font-size: 1.55rem !important; }

  .gallery-heading-line small,
  .gallery-head-actions .icon-button,
  .gallery-category-button {
    font-size: 1.05rem !important;
  }

  .gallery-card.gallery-card-minimal {
    min-height: 112px !important;
  }

  .gallery-card-minimal .gallery-card-content strong {
    font-size: 1.35rem !important;
    line-height: 1.2 !important;
  }

  .caption-panel h1 { font-size: 1.85rem !important; }

  .caption-panel p,
  .viewer-meta,
  .viewer-status,
  .flat-toolbar,
  .media-toolbar {
    font-size: 1.1rem !important;
  }

  .public-map-panel,
  .public-compass,
  .share-panel-inner,
  .psv-panel {
    font-size: 1.05rem !important;
  }

  .native-walk-label {
    max-width: min(300px, 78vw);
  }
}


/* ==========================================================================
   v6.22.6 — widoczność krótkiej nazwy pinezki
   ========================================================================== */

.native-info-marker .native-walk-label {
  z-index: 8;
  transition: opacity .16s ease;
}

.native-info-marker[data-label-mode="always"] .native-walk-label {
  display: grid;
  opacity: 1;
  visibility: visible;
}

.native-info-marker[data-label-mode="hover"]:focus-within .native-walk-label {
  opacity: 1;
}


/* ==========================================================================
   v6.22.7 — kolory podpisów i mniejsze pinezki na telefonie
   ========================================================================== */

.native-info-marker .native-walk-label {
  border-color: var(
    --pin-label-border,
    rgba(255,255,255,.72)
  );
  background: var(
    --pin-label-background,
    rgba(0,0,0,.74)
  );
}

@media (max-width: 760px) {
  /*
   * Zmniejszamy cały znacznik do 50%, ale wewnętrzną czcionkę
   * podnosimy do 120%. Końcowy rozmiar tekstu wynosi więc 60%
   * wartości ustawionej dla desktopu.
   */
  .native-info-marker {
    transform: scale(.5);
    transform-origin: center bottom;
  }

  .native-info-marker[data-placement="point"] {
    transform-origin: center center;
  }

  .native-info-marker .native-walk-label {
    max-width: min(440px, 148vw);
    padding: 7px 10px;
    font-size: calc(
      var(--pin-label-font-size, 18px) * 1.2
    );
    line-height: 1.08;
  }
}


/* ==========================================================================
   v6.22.8 — tylko jeden podpis, zawsze pod ikoną informacyjną
   ========================================================================== */

.native-info-marker .native-walk-label {
  top: calc(var(--pin-size) + 6px) !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  transform-origin: top center;
}

/*
 * Pinezki informacyjne korzystają z własnej etykiety HTML.
 * Systemowy tooltip Photo Sphere Viewer jest dla nich wyłączony w app.js.
 */
.native-info-marker .native-info-icon {
  z-index: 2;
}

.native-info-marker .native-walk-label {
  z-index: 3;
}


/* ==========================================================================
   v6.22.9 — telefon w poziomie nie korzysta już z wielkiego układu desktopowego
   ========================================================================== */

@media (max-width: 900px),
       (pointer: coarse) and (max-height: 600px) {
  :root {
    --topbar-h: 54px !important;
    --footer-h: 0px !important;
  }

  .site-shell {
    grid-template-rows: minmax(0, 1fr) 0 !important;
  }

  .site-footer {
    display: none !important;
  }

  .site-topbar {
    grid-template-columns:
      32px
      minmax(90px, 1fr)
      auto !important;
    gap: 9px !important;
    height: var(--topbar-h) !important;
    min-height: var(--topbar-h) !important;
    padding:
      max(5px, env(safe-area-inset-top))
      max(9px, env(safe-area-inset-right))
      5px
      max(9px, env(safe-area-inset-left)) !important;
  }

  .brand-logo {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
  }

  .brand-logo img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
  }

  .site-search {
    height: 34px !important;
  }

  .site-search input {
    height: 33px !important;
    padding-left: 22px !important;
    padding-right: 16px !important;
    font-size: .88rem !important;
  }

  .site-search-icon {
    width: 11px !important;
    height: 11px !important;
  }

  .top-actions {
    gap: 11px !important;
    height: 34px !important;
  }

  .site-topbar .top-actions > .icon-button,
  .site-topbar .top-more-toggle,
  .site-topbar .top-layers-toggle,
  .site-topbar .top-layers-menu .icon-button {
    min-height: 32px !important;
    font-size: .82rem !important;
  }

  .site-topbar .top-more-menu .icon-button,
  .site-topbar .top-more-menu .admin-link {
    min-height: 42px !important;
    font-size: .82rem !important;
  }

  .top-more-menu {
    width: min(300px, calc(100vw - 14px)) !important;
  }

  /*
   * Wartości zapisane w panelu pozostają desktopowe.
   * Telefon pokazuje ikonę w 50%, a tekst końcowo w około 60%.
   */
  .native-info-marker {
    transform: scale(.5);
    transform-origin: center bottom;
  }

  .native-info-marker[data-placement="point"] {
    transform-origin: center center;
  }

  .native-info-marker .native-walk-label {
    max-width: min(440px, 148vw);
    padding: 7px 10px;
    font-size: calc(
      var(--pin-label-font-size, 18px) * 1.2
    );
    line-height: 1.08;
  }
}

/* Telefon w poziomie — jeszcze niższa, lekka belka. */
@media (orientation: landscape)
       and (max-height: 600px)
       and (pointer: coarse) {
  :root {
    --topbar-h: 44px !important;
  }

  .site-topbar {
    grid-template-columns:
      27px
      minmax(80px, 1fr)
      auto !important;
    gap: 7px !important;
    padding:
      max(3px, env(safe-area-inset-top))
      max(8px, env(safe-area-inset-right))
      3px
      max(8px, env(safe-area-inset-left)) !important;
  }

  .brand-logo,
  .brand-logo img {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
  }

  .site-search {
    height: 29px !important;
  }

  .site-search input {
    height: 28px !important;
    font-size: .76rem !important;
  }

  .top-actions {
    gap: 8px !important;
    height: 29px !important;
  }

  .site-topbar .top-actions > .icon-button,
  .site-topbar .top-more-toggle,
  .site-topbar .top-layers-toggle,
  .site-topbar .top-layers-menu .icon-button {
    min-height: 28px !important;
    font-size: .72rem !important;
  }

  .site-topbar .top-more-menu .icon-button,
  .site-topbar .top-more-menu .admin-link {
    min-height: 38px !important;
    font-size: .76rem !important;
  }
}


/* ==========================================================================
   v6.22.10 — linia pod podpisem i konfigurowalny punkt zaczepienia
   ========================================================================== */

/*
 * Wysokość markera jest obliczana w app.js z uwzględnieniem wszystkich
 * wierszy podpisu. Dolna krawędź markera jest początkiem linii, dlatego
 * linia nie przechodzi już za napisem ani ikoną.
 */
.native-info-marker .native-walk-label {
  margin-bottom: 0;
}

.native-info-ground-dot {
  width: var(--ground-dot-size, 10px) !important;
  height: var(--ground-dot-size, 10px) !important;
  border-width: clamp(
    1px,
    calc(var(--ground-dot-size, 10px) * .16),
    3px
  ) !important;
  border-style: solid;
  background: var(--ground-dot-color, #ffffff) !important;
}

.native-info-ground-dot[data-dot-contrast="light"] {
  border-color: rgba(255,255,255,.96) !important;
}

.native-info-ground-dot[data-dot-contrast="dark"] {
  border-color: rgba(0,0,0,.9) !important;
}


/* ==========================================================================
   v6.23.0 — nieinwazyjny panel diagnostyki wydajności
   ========================================================================== */

.perf-panel[hidden] {
  display: none !important;
}

.perf-panel {
  position: fixed;
  z-index: 100000;
  top: max(10px, env(safe-area-inset-top));
  right: max(10px, env(safe-area-inset-right));
  width: min(350px, calc(100vw - 20px));
  max-height: calc(100dvh - 20px);
  overflow: auto;
  padding: 0;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 8px;
  background: rgba(10, 12, 14, .93);
  color: #f7f7f7;
  box-shadow: 0 12px 48px rgba(0,0,0,.46);
  backdrop-filter: blur(12px);
  font: 13px/1.35 Arial, sans-serif;
  overscroll-behavior: contain;
}

.perf-panel button,
.perf-panel input {
  font: inherit;
}

.perf-panel-head {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border-bottom: 1px solid rgba(255,255,255,.14);
  background: rgba(10, 12, 14, .96);
}

.perf-panel-head > div {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.perf-panel-head strong {
  font-size: 15px;
  letter-spacing: .02em;
}

.perf-panel-head small {
  color: #9fa6ad;
}

.perf-panel-head button {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 5px;
  background: rgba(255,255,255,.09);
  color: #fff;
  cursor: pointer;
  font-size: 20px;
}

.perf-live-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: rgba(255,255,255,.10);
}

.perf-live-grid article {
  min-width: 0;
  padding: 9px 7px;
  background: rgba(15,17,20,.96);
  text-align: center;
}

.perf-live-grid span {
  display: block;
  margin-bottom: 3px;
  color: #9fa6ad;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.perf-live-grid strong {
  display: block;
  overflow: hidden;
  color: #65ff82;
  font-size: 16px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.perf-section {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.perf-section-title {
  display: block;
  margin-bottom: 8px;
  color: #dce1e5;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .055em;
}

.perf-row {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 8px;
  margin: 4px 0;
}

.perf-row span {
  color: #9fa6ad;
}

.perf-row strong {
  min-width: 0;
  overflow: hidden;
  text-align: right;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.perf-button-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.perf-panel button {
  min-height: 34px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 5px;
  background: rgba(255,255,255,.07);
  color: #fff;
  cursor: pointer;
}

.perf-panel button:hover,
.perf-panel button:focus-visible {
  background: rgba(255,255,255,.14);
}

.perf-panel button.active {
  border-color: #65ff82;
  background: rgba(101,255,130,.16);
  color: #86ff9c;
}

.perf-panel button:disabled {
  opacity: .45;
  cursor: default;
}

.perf-panel .perf-primary {
  width: 100%;
  margin-bottom: 8px;
  border-color: rgba(101,255,130,.7);
  background: rgba(101,255,130,.15);
  color: #86ff9c;
  font-weight: 700;
}

.perf-check {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  cursor: pointer;
}

.perf-check input {
  width: 16px;
  height: 16px;
  accent-color: #65ff82;
}

.perf-check small {
  color: #9fa6ad;
}

.perf-renderer-details pre {
  max-height: 150px;
  margin: 0;
  overflow: auto;
  color: #cfd5da;
  font: 11px/1.45 Consolas, "Courier New", monospace;
  white-space: pre-wrap;
}

.perf-sample-status {
  min-height: 34px;
  margin-bottom: 8px;
  color: #b7bec4;
  font-size: 12px;
}

.perf-panel-foot {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  color: #828b93;
  font-size: 10px;
}

@media (max-width: 700px) {
  .perf-panel {
    top: max(6px, env(safe-area-inset-top));
    right: max(6px, env(safe-area-inset-right));
    width: min(340px, calc(100vw - 12px));
    max-height: calc(100dvh - 12px);
  }

  .perf-live-grid strong {
    font-size: 14px;
  }
}


/* v6.23.0a — czytelniejsza diagnostyka na WQHD i 4K */
.perf-panel {
  width: clamp(390px, 23vw, 520px);
  font-size: clamp(14px, .45vw, 17px);
  line-height: 1.42;
}

.perf-panel-head {
  padding: 13px 15px;
}

.perf-panel-head strong {
  font-size: 1.08em;
}

.perf-panel-head small {
  font-size: .78em;
}

.perf-live-grid article {
  padding: 11px 8px;
}

.perf-live-grid span {
  font-size: .7em;
}

.perf-live-grid strong {
  font-size: 1.25em;
}

.perf-section {
  padding: 12px 15px;
}

.perf-section-title {
  font-size: .78em;
}

.perf-row {
  grid-template-columns: 105px minmax(0, 1fr);
  gap: 11px;
  margin: 6px 0;
}

.perf-panel button {
  min-height: 39px;
  padding-inline: 10px;
}

.perf-check {
  min-height: 35px;
}

.perf-check input {
  width: 18px;
  height: 18px;
}

.perf-renderer-details pre {
  font-size: .78em;
}

.perf-sample-status {
  min-height: 40px;
  font-size: .83em;
}

.perf-panel-foot {
  padding: 10px 15px;
  font-size: .7em;
}

@media (max-width: 700px) {
  .perf-panel {
    width: min(370px, calc(100vw - 12px));
    font-size: 14px;
  }
}


/* ==========================================================================
   v6.23.1 — pinezki i linie w płynnym trybie Panorama
   ========================================================================== */

.flat-marker-overlay {
  position: absolute;
  z-index: 8;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.flat-marker-overlay.markers-hidden {
  display: none;
}

.flat-marker-lines,
.flat-marker-items {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}

.flat-marker-lines {
  z-index: 1;
}

.flat-marker-items {
  z-index: 2;
}

.flat-marker-item {
  position: absolute;
  display: block;
  overflow: visible;
  box-sizing: border-box;
  pointer-events: none;
  will-change: left, top;
}

.flat-marker-item.is-interactive {
  pointer-events: auto;
  cursor: pointer;
  outline: 0;
}

.flat-marker-item.is-interactive:focus-visible {
  filter: drop-shadow(0 0 5px rgba(255,255,255,.95));
}

.flat-marker-line {
  pointer-events: none;
}

.flat-marker-item .native-walk-marker,
.flat-marker-item .native-walk-ground-dot {
  will-change: auto;
}

.flat-info-panel[hidden] {
  display: none !important;
}

.flat-info-panel {
  position: absolute;
  z-index: 10;
  right: 18px;
  bottom: 78px;
  width: min(410px, calc(100% - 36px));
  max-height: min(430px, calc(100% - 130px));
  overflow: auto;
  padding: 18px 20px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 8px;
  background: rgba(8,10,12,.92);
  color: #fff;
  box-shadow: 0 18px 54px rgba(0,0,0,.45);
  backdrop-filter: blur(14px);
  pointer-events: auto;
}

.flat-info-close {
  position: sticky;
  z-index: 2;
  top: 0;
  float: right;
  width: 34px;
  height: 34px;
  margin: -7px -9px 5px 12px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 5px;
  background: rgba(255,255,255,.08);
  color: #fff;
  cursor: pointer;
  font-size: 22px;
}

.flat-info-content .info-pin-content {
  display: grid;
  gap: 10px;
}

.flat-info-content h2 {
  margin: 0;
  padding-right: 30px;
  font-size: 1.35rem;
}

.flat-info-content p {
  margin: 0;
  color: rgba(255,255,255,.78);
  line-height: 1.5;
}

.flat-info-content a {
  justify-self: start;
  color: #fff;
  text-decoration: underline;
}

@media (max-width: 760px) {
  .flat-info-panel {
    right: 10px;
    bottom: 66px;
    width: calc(100% - 20px);
    max-height: min(360px, calc(100% - 100px));
    padding: 15px 16px;
  }
}

/* v6.24.1d — neutralizacja starego układu site-topbar */
.meyepic-viewer-route .site-topbar.viewer-gallery-header { grid-template-columns: none; }
.meyepic-viewer-route .site-topbar.viewer-gallery-header::before,
.meyepic-viewer-route .site-topbar.viewer-gallery-header::after { display: none; }


/* ==========================================================================
   v6.25.0 — obszary, drogi i nazwy w trybie Panorama
   ========================================================================== */

.flat-marker-shape {
  vector-effect: non-scaling-stroke;
  transition:
    opacity .14s ease,
    filter .14s ease;
  will-change: d;
}

.flat-marker-shape.is-hovered {
  opacity: 1 !important;
  filter:
    drop-shadow(0 0 3px rgba(255,255,255,.88))
    drop-shadow(0 2px 5px rgba(0,0,0,.78)) !important;
}

.flat-marker-hit {
  pointer-events: stroke;
}

.flat-marker-hit-polygon {
  pointer-events: all;
}

.flat-marker-shape[hidden],
.flat-marker-hit[hidden],
.flat-marker-item[hidden] {
  display: none !important;
}

.flat-marker-polygon {
  cursor: default;
}

.flat-marker-polyline {
  fill: none;
}

.flat-marker-overlay
[data-marker-group="labels"] {
  pointer-events: none !important;
}

.flat-info-content .area-content {
  display: grid;
  gap: 10px;
}

.flat-info-content .area-content h2,
.flat-info-content .area-content p {
  margin: 0;
  font-weight: 400;
}

.flat-info-content .area-content h2 {
  font-size: 1.3rem;
}

.flat-info-content .area-content p {
  color: rgba(255,255,255,.78);
  line-height: 1.5;
}

@media (max-width: 700px) {
  .flat-marker-shape {
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.62));
  }
}


/* ==========================================================================
   v6.25.0 — propozycje miejsc
   ========================================================================== */

.suggest-place-open {
  appearance: none;
  margin: 10px 0 0;
  padding: 0 0 2px;
  border: 0;
  border-bottom: 1px solid currentColor;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font: 400 10px/1.2 Arial, Helvetica, sans-serif;
  letter-spacing: .04em;
}

.suggest-place-open:hover {
  opacity: .68;
}

.suggest-place-aim {
  position: absolute;
  z-index: 720;
  inset: 0;
  display: none;
  pointer-events: none;
}

.suggest-place-aim.is-open {
  display: block;
}

.suggest-place-crosshair {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 48px;
  height: 48px;
  transform: translate(-50%, -50%);
}

.suggest-place-crosshair::before,
.suggest-place-crosshair::after {
  content: "";
  position: absolute;
  background: rgba(255,255,255,.96);
  box-shadow: 0 0 0 1px rgba(0,0,0,.55);
}

.suggest-place-crosshair::before {
  top: 23px;
  left: 0;
  width: 48px;
  height: 1px;
}

.suggest-place-crosshair::after {
  top: 0;
  left: 23px;
  width: 1px;
  height: 48px;
}

.suggest-place-crosshair span {
  position: absolute;
  top: 19px;
  left: 19px;
  width: 10px;
  height: 10px;
  border: 1px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(0,0,0,.65);
}

.suggest-place-aim-message {
  position: absolute;
  right: 50%;
  bottom: 68px;
  width: min(420px, calc(100% - 28px));
  display: grid;
  gap: 7px;
  padding: 13px 15px;
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  background: rgba(0,0,0,.70);
  box-shadow: 0 12px 44px rgba(0,0,0,.24);
  backdrop-filter: blur(9px);
  transform: translateX(50%);
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  text-align: center;
  pointer-events: auto;
}

.suggest-place-aim-message strong {
  font-weight: 400;
  font-size: 14px;
}

.suggest-place-aim-message > span {
  color: rgba(255,255,255,.76);
  font-size: 11px;
  line-height: 1.45;
}

.suggest-place-aim-message > div {
  display: flex;
  justify-content: center;
  gap: 8px;
}

.suggest-place-aim-message button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.7);
  color: #111;
  background: #fff;
  cursor: pointer;
  font: 400 10px/1 Arial, Helvetica, sans-serif;
}

.suggest-place-aim-message button.secondary {
  color: #fff;
  background: transparent;
}

.suggest-place-modal {
  position: fixed;
  z-index: 13000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  visibility: hidden;
  opacity: 0;
  transition: opacity .16s ease, visibility .16s ease;
}

.suggest-place-modal.is-open {
  visibility: visible;
  opacity: 1;
}

.suggest-place-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0,0,0,.54);
  backdrop-filter: blur(5px);
}

.suggest-place-card {
  position: relative;
  z-index: 1;
  width: min(470px, 100%);
  max-height: calc(100vh - 40px);
  display: grid;
  gap: 15px;
  padding: 28px;
  overflow-y: auto;
  color: #111;
  background: #fff;
  box-shadow: 0 26px 80px rgba(0,0,0,.28);
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
}

.suggest-place-card h2,
.suggest-place-card p {
  margin: 0;
  font-weight: 400;
}

.suggest-place-card h2 {
  font-size: 22px;
}

.suggest-place-eyebrow {
  color: #888;
  font-size: 9px;
  letter-spacing: .1em;
}

.suggest-place-captured {
  color: #777;
  font-size: 10px;
}

.suggest-place-card label {
  display: grid;
  gap: 7px;
  font-size: 11px;
}

.suggest-place-card label small {
  color: #888;
  font-weight: 400;
}

.suggest-place-card input,
.suggest-place-card textarea {
  width: 100%;
  padding: 9px 0;
  border: 0;
  border-bottom: 1px solid #bbb;
  border-radius: 0;
  outline: 0;
  color: #111;
  background: transparent;
  resize: vertical;
  font: 400 14px/1.4 Arial, Helvetica, sans-serif;
}

.suggest-place-card input:focus,
.suggest-place-card textarea:focus {
  border-bottom-color: #111;
}

.suggest-place-note {
  color: #777;
  font-size: 10px;
  line-height: 1.45;
}

.suggest-place-status {
  min-height: 16px;
  color: #555;
  font-size: 11px;
}

.suggest-place-submit {
  min-height: 42px;
  border: 1px solid #111;
  color: #fff;
  background: #111;
  cursor: pointer;
  font: 400 11px/1 Arial, Helvetica, sans-serif;
}

.suggest-place-close {
  position: absolute;
  top: 8px;
  right: 10px;
  width: 32px;
  height: 32px;
  border: 0;
  color: #555;
  background: transparent;
  cursor: pointer;
  font: 400 22px/1 Arial, sans-serif;
}

.suggest-place-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

@media (max-width: 640px) {
  .suggest-place-card {
    padding: 24px 18px 20px;
  }

  .suggest-place-aim-message {
    bottom: 56px;
  }
}
