/* Known analog sites: globe layer (off by default) and the flat 2D map section.
   Colour rule: the status colours (sage, ochre, rust, na) mean coverage status and are NOT used here.
   Markers are pale cream outlines (--text): ring = terrain or field site, square = habitat / enclosed facility.
   Only neutral tokens: --bg, --surface, --line, --text, --muted. No font below 12px. */

/* ---------- shared marker ---------- */
.ks-pin{position:absolute;transform:translate(-50%,-50%);width:12px;height:12px;padding:0;margin:0;border:1.5px solid var(--text);border-radius:50%;background:transparent;color:var(--text);cursor:pointer;pointer-events:auto;opacity:.85;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--bg) 60%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--bg) 55%,transparent);font:600 12px/1 var(--mono);display:flex;align-items:center;justify-content:center}
.ks-pin:before{content:"";position:absolute;inset:-9px}                      /* 30px touch target, 12px mark */
.ks-pin[data-shape="square"]{border-radius:0}
.ks-pin[hidden]{display:none!important}
.ks-pin:hover,.ks-pin:focus-visible,.ks-pin.is-selected{opacity:1;z-index:2}
.ks-pin.is-selected{width:15px;height:15px;border-width:2px;box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--text)}
.ks-pin:focus-visible{outline:2px solid var(--text);outline-offset:4px}
.ks-pin.is-cluster{width:24px;height:24px;border-radius:50%;background:color-mix(in srgb,var(--bg) 74%,transparent);opacity:.95}
.ks-pin.is-cluster:before{inset:-4px}
.ks-pin.is-cluster.is-selected{width:26px;height:26px}
.ks-key{display:inline-block;width:11px;height:11px;border:1.5px solid var(--text);vertical-align:-1px;margin-right:8px;border-radius:50%}
.ks-key[data-shape="square"]{border-radius:0}
.ks-shape{flex:0 0 11px;width:11px;height:11px;border:1.5px solid var(--text);border-radius:50%;margin-top:3px}
.ks-shape[data-shape="square"]{border-radius:0}

/* ---------- card ---------- */
.ks-card{color:var(--text);font:400 14px/1.5 var(--sans)}
.ks-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.ks-card h3{margin:0;font:400 20px/1.25 var(--serif);letter-spacing:-.005em}
.ks-country{margin:2px 0 12px;color:var(--muted);font-size:14px}
.ks-facts{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0 0 12px;font-size:14px}
.ks-facts dt{color:var(--muted);font:400 12px/1.7 var(--mono);letter-spacing:.04em}
.ks-facts dd{margin:0;min-width:0;overflow-wrap:anywhere}
.ks-summary{margin:0 0 12px}
.ks-trust,.ks-place,.ks-sources{margin:0 0 8px;font-size:13px;color:var(--muted)}
.ks-k{font:400 12px/1.5 var(--mono);letter-spacing:.04em;color:var(--muted)}
.ks-sources a{color:var(--text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--muted)}
.ks-sources a:hover,.ks-sources a:focus-visible{text-decoration-color:var(--text)}
.ks-also{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:4px 0 12px}
.ks-badge{display:inline-block;border:1px solid var(--text);padding:2px 8px;font:400 12px/1.5 var(--mono);letter-spacing:.04em;color:var(--text)}
.ks-link{background:none;border:0;padding:0;color:var(--text);font:400 13px/1.5 var(--sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer;text-align:left}
.ks-link:hover,.ks-link:focus-visible{text-decoration-color:var(--muted)}
.ks-close{flex:0 0 auto;width:30px;height:30px;border:1px solid var(--line);background:var(--surface);color:var(--text);font:400 18px/1 var(--mono);cursor:pointer}
.ks-close:hover,.ks-close:focus-visible{border-color:var(--text)}
.ks-open{display:none;margin-top:6px;border:1px solid var(--text);background:transparent;color:var(--text);padding:8px 12px;font:400 13px/1.2 var(--sans);cursor:pointer}
.ks-muted,.ks-placeholder{margin:0 0 10px;color:var(--muted);font-size:14px}
.ks-group-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ks-group-item,.ks-list-item{width:100%;display:flex;gap:10px;text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--text);padding:9px 12px;font:400 14px/1.35 var(--sans);cursor:pointer}
.ks-group-item{flex-direction:column;gap:2px}
.ks-group-item small{color:var(--muted);font-size:12px}
.ks-group-item:hover,.ks-group-item:focus-visible,.ks-list-item:hover,.ks-list-item:focus-visible,.ks-list-item.is-selected{border-color:var(--text)}

/* ---------- notes (mandatory text) ---------- */
.ks-note p{margin:0 0 8px;color:var(--muted);font-size:14px;line-height:1.55}
.ks-note p:last-child{margin-bottom:0}
.ks-note .ks-uz{color:var(--muted);font-size:13px;border-left:1px solid var(--line);padding-left:10px}

/* ---------- globe layer ---------- */
.ks-globe-pins{position:absolute;inset:0;z-index:2;pointer-events:none}
.ks-globe-pins[hidden]{display:none}
.ks-globe-pins .ks-pin.is-also{width:34px;height:34px;border-style:dashed;border-width:1px;opacity:.9;background:transparent}
.ks-globe-pins .ks-pin.is-also:before{inset:0}
.ks-globe-pins .ks-pin.is-also.is-selected{box-shadow:0 0 0 2px var(--bg),0 0 0 3px var(--text);border-style:solid}
.ks-globe-ui{position:absolute;z-index:6;right:20px;bottom:165px;max-height:calc(100% - 165px - 76px);width:min(410px,calc(100% - 40px));display:none;flex-direction:column;align-items:stretch;gap:8px;pointer-events:none;cursor:default}
.atlas-world.has-globe.is-orbit:not(.is-teaser):not(.is-arriving) .ks-globe-ui{display:flex}
.ks-globe-ui>*{pointer-events:auto}
.ks-globe-card{flex:0 1 auto;min-height:0;overflow:auto;padding:14px 16px;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 92%,transparent);scrollbar-width:thin}
.ks-globe-card[hidden],.ks-globe-note[hidden]{display:none}
/* the globe card is the compact form of the card */
.ks-globe-card{padding:12px 14px}
.ks-globe-card .ks-card{font-size:13px;line-height:1.4}
.ks-globe-card h3{font-size:18px}
.ks-globe-card .ks-country{margin:0 0 8px;font-size:13px}
.ks-globe-card .ks-facts{gap:1px 12px;margin-bottom:8px;font-size:13px}
.ks-globe-card .ks-facts dt{line-height:1.5}
.ks-globe-card .ks-summary{margin-bottom:8px}
.ks-globe-card .ks-trust,.ks-globe-card .ks-place,.ks-globe-card .ks-sources{margin-bottom:4px;font-size:12px}
.ks-globe-card .ks-also{margin:2px 0 8px}
.ks-globe-note{flex:none;padding:10px 14px;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 92%,transparent)}
.ks-globe-note p{font-size:12px;line-height:1.5;margin-bottom:6px}
.ks-toggle{align-self:flex-end;min-height:34px;padding:0 14px;border:1px solid var(--muted);background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--text);font:400 12px/1 var(--mono);letter-spacing:.05em;cursor:pointer}
.ks-toggle:before{content:"";display:inline-block;width:9px;height:9px;margin-right:9px;border:1.5px solid var(--text);border-radius:50%;vertical-align:-1px}
.ks-toggle.is-on{border-color:var(--text);background:var(--text);color:var(--bg)}
.ks-toggle.is-on:before{border-color:var(--bg)}
.ks-toggle:hover,.ks-toggle:focus-visible{border-color:var(--text)}
.ks-toggle:focus-visible{outline:2px solid var(--text);outline-offset:3px}

/* ---------- 2D map section ---------- */
.known-sites-section{padding:clamp(36px,5vw,72px) var(--pad,clamp(20px,4vw,64px)) clamp(44px,5vw,76px);border-top:1px solid var(--line);background:var(--bg)}
.ks-wrap{max-width:1440px;margin:0 auto}
.ks-head{margin-bottom:26px;max-width:78ch}
.ks-eyebrow{display:block;font:400 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.ks-head h2{font:400 clamp(26px,2.8vw,38px)/1.15 var(--serif);letter-spacing:-.012em;margin:0 0 16px;text-wrap:balance}
.ks-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 18px;margin-bottom:18px}
.ks-filter{display:flex;flex-direction:column;gap:5px;font:400 12px/1.3 var(--mono);letter-spacing:.06em;color:var(--muted)}
.ks-filter select{min-width:168px;min-height:38px;padding:0 10px;border:1px solid var(--line);background:var(--surface);color:var(--text);font:400 14px/1 var(--sans);color-scheme:dark;border-radius:0}
.ks-filter select:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.ks-count{margin:0 0 0 auto;align-self:center;font:400 12px/1.4 var(--mono);color:var(--muted)}
.ks-globe-link{min-height:38px;padding:0 14px;border:1px solid var(--muted);background:transparent;color:var(--text);font:400 13px/1 var(--sans);cursor:pointer}
.ks-globe-link:hover,.ks-globe-link:focus-visible{border-color:var(--text)}
.ks-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:24px;align-items:start}
.ks-main{min-width:0}
.ks-map{position:relative;aspect-ratio:2/1;overflow:hidden;border:1px solid var(--line);background:var(--surface);touch-action:pan-y}
.ks-map.is-zoomed{cursor:grab;touch-action:none}
.ks-map-img{position:absolute;display:block;max-width:none;user-select:none;-webkit-user-drag:none;filter:saturate(.8) brightness(.82)}
.ks-map-pins{position:absolute;inset:0;pointer-events:none}
.ks-zoom{position:absolute;right:10px;bottom:10px;z-index:3;display:flex;gap:4px}
.ks-zoom button{min-width:34px;height:34px;padding:0 10px;border:1px solid var(--muted);background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--text);font:400 16px/1 var(--mono);cursor:pointer}
.ks-zoom button:last-child{font-size:12px;letter-spacing:.05em}
.ks-zoom button:hover,.ks-zoom button:focus-visible{border-color:var(--text)}
.ks-legend{display:flex;flex-wrap:wrap;gap:6px 24px;margin:12px 0 4px;font-size:13px;color:var(--muted)}
.ks-earth-note{margin:0 0 16px;font-size:13px;color:var(--muted)}
.ks-card-slot{border:1px solid var(--line);background:var(--surface);padding:18px 20px;min-height:96px}
.ks-card-slot[hidden]{display:none}
.ks-list-panel{border:1px solid var(--line);background:var(--surface);padding:16px 16px 12px}
.ks-list-panel h3{margin:0 0 12px;font:400 12px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ks-list{list-style:none;margin:0;padding:0;display:grid;gap:6px;max-height:560px;overflow:auto;scrollbar-width:thin}
.ks-list li[hidden]{display:none}
.ks-list-words{display:flex;flex-direction:column;gap:3px;min-width:0}
.ks-list-words b{font-weight:600}
.ks-list-words small{font-size:12px;color:var(--muted)}
.ks-list-words .ks-badge{align-self:flex-start;color:var(--text)}

@media(max-width:1020px){
  .ks-grid{grid-template-columns:1fr}
  .ks-list{max-height:420px}
  .ks-count{margin-left:0;flex-basis:100%}
}
@media(max-width:760px){
  /* Phones: the hero globe is cropped by the headline, so there is no room for a layer, its note and a card on top of it.
     The globe layer is not offered here; the same sites, filters and note are in the 2D map section below. */
  .ks-globe-ui,.ks-globe-pins,.ks-globe-link{display:none!important}
  .ks-filter{flex:1 1 140px}
  .ks-filter select{min-width:0;width:100%}
  .ks-card-slot{padding:16px}
}
