/* Research theme map shared by the modern homepage and classic publication list. */
.map-wrap {
  min-width:0;
  color:var(--ink,#172f3b);
  font-family:var(--sans,"Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  line-height:1.75
}

.research-map {
  aspect-ratio:840/700;
  position:relative;
  isolation:isolate
}

.orbit-paths {
  position:absolute;
  width:100%;
  height:100%;
  inset:0;
  fill:none;
  stroke:#a9bdb5;
  stroke-width:.8;
  stroke-dasharray:3 9;
  opacity:.7
}

.map-center {
  position:absolute;
  width:29.1%;
  height:35%;
  left:35.45%;
  top:32.5%;
  border:1px solid #cbd7ce;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  background:rgba(247,247,242,.89);
  z-index:3;
  text-align:center;
  font-family:var(--serif,"Iowan Old Style","Palatino Linotype","Book Antiqua",Georgia,serif);
  font-size:clamp(22px,2.7vw,37px);
  line-height:1.05;
  letter-spacing:-.03em;
  box-shadow:0 0 35px 18px rgba(247,247,242,.4);
  pointer-events:none
}

.map-center i {
  font-size:.65em;
  color:#7b9385
}

.map-center .center-symbol {
  font-family:var(--serif,"Iowan Old Style","Palatino Linotype","Book Antiqua",Georgia,serif);
  font-size:34px;
  color:#758f7d;
  margin-bottom:6px;
  font-weight:400
}

.map-wrap a.orbit-circle {
  color:inherit;
  text-decoration:none
}

.map-wrap a.orbit-circle:focus-visible {
  outline:3px solid #c38c38;
  outline-offset:5px
}

.orbit-circle {
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  border-radius:50%;
  width:28.1%;
  height:33.72%;
  padding:22px 6px;
  border:1px solid color-mix(in srgb,var(--category-color) 36%,transparent);
  background:color-mix(in srgb,var(--category-tint) 81%,transparent);
  text-align:center;
  transition:transform .3s,box-shadow .3s,border .3s,background .3s;
  z-index:2;
  line-height:1.25
}

.orbit-circle:hover,.orbit-circle:focus-visible {
  transform:scale(1.045);
  z-index:5;
  background:var(--category-tint);
  box-shadow:0 12px 30px color-mix(in srgb,var(--category-color) 12%,transparent);
  border-color:var(--category-color)
}

.orbit-circle[aria-pressed=true] {
  border-color:var(--category-color);
  box-shadow:inset 0 0 0 1px var(--category-color)
}

.orbit-circle svg {
  height:32%;
  width:35%;
  margin-top:-4px;
  margin-bottom:8px;
  overflow:visible;
  color:var(--category-color);
  fill:var(--category-color);
  stroke:var(--category-color);
  stroke-width:1.5;
  transition:transform .25s
}

.orbit-circle:hover svg,.orbit-circle:focus-visible svg {
  transform:translateY(-3px)
}

.orbit-circle svg path {
  fill:none;
  opacity:.75
}

.orbit-circle svg .icon-halo {
  fill:none;
  stroke-dasharray:3 3;
  stroke-width:1
}

.orbit-circle .orbit-name {
  font-size:clamp(13px,1.36vw,19px);
  font-weight:600;
  letter-spacing:-.025em
}

.orbit-count {
  font-size:var(--text-compact,.75rem);
  color:var(--category-color);
  margin-top:9px;
  letter-spacing:.025em
}

.orbit-graphs {
  left:35.95%;
  top:2%
}

.orbit-flexibility {
  left:58.45%;
  top:17.57%
}

.orbit-hiring {
  left:58.45%;
  top:48.71%
}

.orbit-online {
  left:35.95%;
  top:64.28%
}

.orbit-dynamic {
  left:13.45%;
  top:48.71%
}

.orbit-geometry {
  left:13.45%;
  top:17.57%
}

.map-caption {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:27px;
  margin-top:12px;
  color:var(--muted,#4f646b);
  font-size:var(--text-label,.875rem)
}

.hint-dot {
  display:inline-block;
  width:5px;
  height:5px;
  background:var(--accent,#216f68);
  border-radius:50%;
  vertical-align:middle;
  margin-right:6px
}

@media(min-width:1600px) {
  .orbit-name {
    font-size:20px!important
  }
  .map-center {
    font-size:39px
  }
}

@media(max-width:1150px) {
  .map-center {
    font-size:26px
  }
  .map-center .center-symbol {
    font-size:23px
  }
  .orbit-name {
    font-size:14px!important
  }
  .map-caption {
    gap:12px
  }
}

@media(max-width:900px) {
  .research-map {
    width:min(700px,100%);
    margin:auto
  }
  .map-wrap {
    margin-top:15px
  }
  .map-center {
    font-size:34px
  }
  .map-center .center-symbol {
    font-size:32px
  }
  .orbit-name {
    font-size:18px!important
  }
  .map-caption {
    gap:25px;
    margin-top:5px
  }
}

@media(max-width:650px) {
  .map-wrap {
    margin-top:20px
  }
  .research-map {
    aspect-ratio:1 / 1.14;
    max-width:460px
  }
  .orbit-paths {
    display:none
  }
  .map-center {
    width:36%;
    height:31.6%;
    left:32%;
    top:34.2%;
    font-size:clamp(21px,6vw,28px)
  }
  .map-center .center-symbol {
    font-size:24px;
    margin-bottom:3px
  }
  .orbit-circle {
    width:35%;
    height:30.7%;
    padding:16px 3px
  }
  .orbit-name {
    font-size:clamp(12px,3.35vw,16px)!important
  }
  .orbit-count {
    margin-top:7px
  }
  .orbit-circle svg {
    width:30%;
    height:29%;
    margin-bottom:6px
  }
  .orbit-graphs {
    left:32.5%;
    top:1.5%
  }
  .orbit-flexibility {
    left:64%;
    top:18.5%
  }
  .orbit-hiring {
    left:64%;
    top:51%
  }
  .orbit-online {
    left:32.5%;
    top:68%
  }
  .orbit-dynamic {
    left:1%;
    top:51%
  }
  .orbit-geometry {
    left:1%;
    top:18.5%
  }
  .map-caption {
    margin-top:10px;
    gap:10px 20px;
    flex-wrap:wrap;
    text-align:center
  }
}

@media(prefers-reduced-motion:reduce) {
  .orbit-circle,.orbit-circle svg {
    transition:none
  }
  .orbit-circle:hover {
    transform:none
  }
}

@media print {
  .map-wrap {
    display:none!important
  }
}
