.island-info-tip,.island-info-card {
  box-sizing:border-box;
  background:#fffaf0;
  color:#102445;
  border:1px solid #c6aa77;
  border-radius:7px;
  box-shadow:0 5px 18px #10244524;
  font:15px/1.4 Georgia,serif;
}
.island-info-tip {
  position:absolute;
  top:8px;
  left:50%;
  transform:translateX(-50%);
  width:min(260px,calc(100% - 16px));
  padding:9px 12px;
  font-size:14px;
  line-height:1.32;
  z-index:2;
}
.island-link.island-info-active {z-index:2}
.island-info-tip strong,.island-info-card h2 {
  display:block;
  color:#08184b;
  font:600 19px/1.2 Georgia,serif;
  margin:0 0 5px;
}
.island-info-tip p,.island-info-card p {margin:0 0 6px}
.island-info-tip b {color:#006878;font-size:14px}
.island-info-card {
  width:min(460px,calc(100% - 32px));
  margin:12px auto;
  padding:16px;
}
.island-info-card .island-info-actions {display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.island-info-actions a,.island-info-actions button {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  box-sizing:border-box;
  padding:6px 12px;
  border:1px solid #006878;
  border-radius:4px;
  font:inherit;
  cursor:pointer;
}
.island-info-actions a {background:#006878;color:white}
.island-info-actions button {background:#fffaf0;color:#006878}
.map-stage .island-info-trigger {
  display:none;
  width:44px;
  height:44px;
  z-index:3;
  align-items:center;
  justify-content:center;
  color:#102445;
}
.island-info-trigger i {
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  background:#fff5df;
  border:1px solid #b99c68;
  border-radius:50%;
  font:bold 15px Georgia,serif;
  box-shadow:0 2px 4px #10244525;
}
@media (max-width:700px),(any-pointer:coarse) {
  .map-stage .island-info-trigger:not([hidden]) {display:flex}
}
.island-info-tip[hidden],.island-info-card[hidden] {display:none}
@media (prefers-reduced-motion:no-preference) {
  .island-info-tip:not([hidden]),.island-info-card:not([hidden]) {animation:island-info-appear .16s ease-out}
}
@keyframes island-info-appear {from{opacity:0}to{opacity:1}}
.island-info-actions[hidden] {display:none}

.island-info-hint {color:#006878;font-size:14px}
.island-info-tip {width:min(320px,calc(100% - 16px))}
.island-info-tip strong {padding-right:112px}
.island-info-tip p {margin-bottom:0}
.island-info-tip b {position:absolute;right:12px;top:11px}
.island-link[href="/play/"] .island-info-tip {
  top:0;
  left:auto;
  right:8px;
  transform:none;
  width:min(360px,calc(100% - 16px));
}
.island-link[href="/birthday/"] .island-info-tip {
  left:8px;
  transform:none;
  width:min(250px,calc(100% - 16px));
}
.island-link[href="/birthday/"] .island-info-tip strong {padding-right:94px;font-size:18px}
.island-link[href="/birthday/"] .island-info-tip b {font-size:12px}
