/* XERIONYX - methodology disclosure links
   Isolated presentation only. No presale, wallet, treasury or transaction logic. */
.xerionyx-methodology-details {
  position: relative;
  display: inline-block;
  margin-left: .45rem;
  vertical-align: baseline;
  font-size: 10px;
  line-height: 1.25;
}

.xerionyx-methodology-details > summary {
  display: inline-flex;
  align-items: center;
  gap: .22rem;
  list-style: none;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  color: rgb(148 163 184);
  transition: color .18s ease, opacity .18s ease;
}

.xerionyx-methodology-details > summary::-webkit-details-marker {
  display: none;
}

.xerionyx-methodology-details > summary:hover,
.xerionyx-methodology-details > summary:focus-visible,
.xerionyx-methodology-details[open] > summary {
  color: rgb(103 232 249);
  outline: none;
}

.xerionyx-methodology-note {
  position: absolute;
  z-index: 90;
  top: calc(100% + .45rem);
  left: 0;
  display: block;
  width: min(290px, calc(100vw - 3rem));
  padding: .55rem .65rem;
  border: 1px solid rgba(103, 232, 249, .22);
  border-radius: .55rem;
  background: rgba(2, 6, 23, .96);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .34), 0 0 18px rgba(34, 211, 238, .07);
  color: rgb(203 213 225);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  white-space: normal;
  pointer-events: none;
}

@media (max-width: 640px) {
  .xerionyx-methodology-note {
    left: auto;
    right: 0;
    width: min(270px, calc(100vw - 2rem));
  }
}
