/* Illustrated regional map. Its artwork and hotspots share the same 3:2 canvas. */
.historic-v49-section {
  padding: 22px 0 28px;
  scroll-margin-top: 72px;
  color: #263a31;
  background: radial-gradient(ellipse at 8% 0%, #fffbf1, transparent 54%), #eee6d6;
}
.historic-v49-viewer {
  overflow: hidden;
  border: 1px solid #baa47c;
  border-radius: 12px;
  background: #f5ead4;
  box-shadow: 0 20px 54px #2a24171c;
}
.historic-v49-viewer [hidden] { display: none; }
.historic-v49-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 16px;
  background: #193b32;
  color: #fff0cf;
}
.historic-v49-map-name { display: grid; gap: 2px; line-height: 1.18; }
.historic-v49-map-name h1 { margin: 0; color: inherit; font: normal 1.35rem/1.1 Georgia, serif; }
.historic-v49-map-name small { color: #e7d6b4; font-size: .81rem; }
.historic-v49-zoom, .historic-v49-shortcuts { display: flex; flex-wrap: wrap; gap: 6px; }
.historic-v49-viewer button {
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.historic-v49-zoom button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 44px;
  min-height: 44px;
  padding: 0 8px;
  border: 1px solid #819687;
  border-radius: 4px;
  background: #305249;
  color: #fff2d3;
  font-size: 1.24rem;
  line-height: 1;
}
.historic-v49-zoom button:hover { background: #436c5f; }
.historic-v49-zoom button[aria-disabled="true"] { color: #c0c4ad; cursor: default; }
.historic-v49-zoom { flex: none; flex-wrap: nowrap; }
.historic-v49-zoom button[data-v49-zoom="reset"] { font-size: .8rem; white-space: nowrap; }
.historic-v49-places {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  padding: 6px 16px;
  border-bottom: 1px solid #bba47c;
  color: #594d36;
  background: #f6eddb;
  font-size: .85rem;
}
.historic-v49-places > span { font-weight: 700; }
.historic-v49-shortcuts button {
  padding: 6px 13px;
  min-height: 44px;
  border: 1px solid #b59b70;
  border-radius: 4px;
  color: #473b25;
  background: #fff7e5;
  font-weight: 650;
}
.historic-v49-shortcuts button::before { content: '◆'; margin-right: 7px; color: #763b25; font-size: .68em; }
.historic-v49-shortcuts button:hover, .historic-v49-shortcuts button[aria-expanded="true"] { background: #e7d6b3; }
.historic-v49-stage { position: relative; }
.historic-v49-viewport {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  overflow: clip;
  background: #d6b87c;
}
.historic-v49-viewport.is-interactive { touch-action: none; user-select: none; }
.historic-v49-viewport.is-zoomed { cursor: grab; }
.historic-v49-viewport.is-panning, .historic-v49-viewport.is-panning button { cursor: grabbing; }
.historic-v49-viewport:focus-visible { outline: 3px solid #194638; outline-offset: -3px; z-index: 1; }
.historic-v49-world {
  position: absolute;
  inset: 0;
  transform-origin: 0 0;
}
.historic-v49-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.historic-v49-pin {
  position: absolute;
  transform: translate(-50%, -50%);
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
}
.historic-v49-pin:is(:hover, [aria-expanded="true"]) {
  box-shadow: inset 0 0 0 calc(1px / var(--atlas-zoom, 1)) #613e25, inset 0 0 0 calc(2.5px / var(--atlas-zoom, 1)) #fff0be;
  background: #fff0be14;
}
.historic-v49-pin:focus-visible {
  outline: calc(2px / var(--atlas-zoom, 1)) solid #174636;
  outline-offset: 1px;
  box-shadow: inset 0 0 0 calc(2px / var(--atlas-zoom, 1)) #fff0be;
}
.historic-v49-pin.is-symbol::before {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 10px;
  height: 10px;
  border: 2px solid #ffeab6;
  background: #793d29;
  content: '';
  transform: translate(-50%, -50%) rotate(45deg) scale(calc(1 / var(--atlas-zoom, 1)));
}
.historic-v49-preview {
  position: absolute;
  z-index: 3;
  right: 16px;
  bottom: 16px;
  width: min(340px, calc(100% - 32px));
  box-sizing: border-box;
  padding: 16px 17px 12px;
  border: 1px solid #927849;
  border-radius: 7px;
  background: #fff8e8;
  box-shadow: 0 5px 28px #26170855;
  color: #263a31;
  scroll-margin-top: 80px;
}
.historic-v49-preview h3 { margin: 3px 48px 6px 0; color: #532d20; font: normal 1.65rem/1.12 Georgia, serif; }
.historic-v49-kicker { margin: 0 48px 0 0; color: #695637; font-size: .75rem; font-weight: 700; }
.historic-v49-teaser { margin: 0 0 6px; font-size: .92rem; line-height: 1.5; }
.historic-v49-preview-figure { margin: 9px 0 3px; }
.historic-v49-preview-figure img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: 50% 51%;
  border-radius: 3px;
}
.historic-v49-preview-figure figcaption { margin-top: 4px; color: #695637; font-size: .76rem; }
.historic-v49-preview-link { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; color: #204f41; font-weight: 700; text-decoration: underline; }
.historic-v49-viewer .historic-v49-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 44px;
  height: 44px;
  border: 1px solid #c1ac84;
  border-radius: 4px;
  background: #f3e6ca;
  color: #493923;
  font-size: 1.35rem;
  line-height: 1;
}
.historic-v49-close:hover { background: #ead8b5; }
.historic-v49-viewer :is(.historic-v49-shortcuts button, .historic-v49-close, a):focus-visible { outline: 2px solid #245f4d; outline-offset: 2px; }
.historic-v49-zoom button:focus-visible { outline: 2px solid #ffe2a2; outline-offset: 2px; }
.historic-v49-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px 22px;
  padding: 13px 16px;
  color: #544832;
  font-size: .88rem;
}
.historic-v49-bottom p { margin: 0; line-height: 1.55; }
.historic-v49-bottom .historic-v49-guide { margin-bottom: 3px; font-weight: 600; }
.historic-v49-bottom a { color: #254f41; text-decoration: underline; }
.historic-v49-download { min-width: max-content; font-weight: 700; }
.historic-v49-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#hlavni-mista { scroll-margin-top: 86px; }
/* Editorial stories grow independently of the interactive map. */
.historic-stories { padding-block: 24px 8px; scroll-margin-top: 86px; }
.historic-stories h2 {
  margin: 0 0 16px;
  color: #263f33;
  font: normal clamp(1.75rem, 3vw, 2.35rem)/1.14 Georgia, serif;
}
.historic-stories-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.historic-story {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #d4c5a9;
  border-radius: 10px;
  background: #fffaf0;
}
.historic-story-figure { margin: 0; }
.historic-story-figure img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.historic-story-figure figcaption {
  padding: 8px 18px;
  border-bottom: 1px solid #e1d3ba;
  background: #f6eddb;
  color: #624e31;
  font-size: .8rem;
  line-height: 1.4;
}
.historic-story-content { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 18px 18px 12px; }
.historic-story h3 {
  margin: 0 0 9px;
  color: #263f33;
  font: normal clamp(1.42rem, 2.15vw, 1.8rem)/1.2 Georgia, serif;
}
.historic-story-content p { margin: 0 0 8px; color: #3d473e; line-height: 1.65; }
.historic-story-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  margin-top: auto;
  color: #24503e;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.historic-story-link:hover { color: #6d4b22; }
.historic-story-link:focus-visible { outline: 2px solid #245f4d; outline-offset: 3px; }
.historic-v410-more { padding-block: 22px 42px; }
.historic-v410-more > details { border: 1px solid #d4c5a9; border-radius: 8px; background: #faf4e7; }
.historic-v410-more > details > summary {
  padding: 13px 16px;
  cursor: pointer;
  color: #263f33;
  font-weight: 650;
}
.historic-v410-more > details > summary:hover { background: #f2e8d4; }
.historic-v410-more > details > summary:focus-visible { outline: 2px solid #245f4d; outline-offset: -3px; }
.historic-v410-more .map-explorer { padding: 0 16px 19px; background: transparent; }
.historic-v410-more .map-explorer > .container { width: 100%; max-width: none; padding: 0; }
.historic-v410-terrain-heading { margin: 12px 0 14px; }
.historic-v410-terrain-heading h2 { margin: 0 0 4px; color: #263f33; font: normal 1.6rem/1.2 Georgia, serif; }
.historic-v410-terrain-heading p { margin: 0; color: #5f5b49; }
@media (max-width: 760px) {
  .historic-v49-section { padding: 12px 0 18px; }
  .historic-stories { padding-block: 17px 5px; }
  .historic-stories-grid { grid-template-columns: minmax(0, 1fr); gap: 15px; }
  .historic-v410-more { padding-block: 15px 28px; }
  .historic-v410-more .map-explorer { padding-inline: 8px; }
  .historic-v49-toolbar, .historic-v49-places, .historic-v49-bottom { padding-inline: 10px; }
  .historic-v49-preview {
    position: relative;
    inset: auto;
    width: 100%;
    border-width: 1px 0 0;
    border-radius: 0;
    box-shadow: none;
  }
  .historic-v49-bottom { display: block; }
  .historic-v49-download { display: inline-block; min-width: 0; padding-block: 8px 3px; }
}
@media (max-width: 470px) {
  .historic-v49-map-name h1 { font-size: 1.19rem; }
  .historic-v49-map-name small { font-size: .74rem; }
}
