.wallet-connect {
  position: absolute;
  right: 18px;
  top: 12px;
  height: 40px;
  padding: 0 17px;
  border: 1px solid var(--acid);
  border-radius: 3px;
  background: #b7ff630d;
  color: var(--acid);
  font: 600 .62rem "DM Mono", monospace;
  letter-spacing: .08em;
  cursor: pointer;
}
.wallet-connect:hover { background: #b7ff6320; }
.wallet-connect.connected { border-color: var(--line); color: var(--text); }
.tree-grid { cursor: crosshair; }
.tree-node { pointer-events: none; transform: translate(-50%, -50%); }
.tree-node::after {
  border-color: #efffdc !important;
  box-shadow: 0 0 0 7px #b7ff6325, 0 0 24px var(--acid) !important;
  background: #b7ff6330 !important;
}
.selection-notice {
  margin: 0 0 9px !important;
  padding: 7px 9px;
  border: 1px solid #b7ff6340;
  background: #b7ff630b;
  color: var(--acid) !important;
  font-size: .52rem !important;
}
.forest-hint {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  margin: 0;
  padding: 10px 14px;
  border: 1px solid #b7ff6345;
  border-radius: 4px;
  background: #020604d9;
  color: #dce8df;
  font-size: .64rem;
  letter-spacing: .03em;
  white-space: nowrap;
  pointer-events: none;
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px #0009;
}
.forest-hint span { color: var(--acid); font-weight: 500; margin-right: 8px; }
@media (max-width: 700px) {
  header { place-items: center start; }
  nav { padding-left: 4px; }
  .tab { padding: 0 7px; font-size: .48rem; }
  .wallet-connect { right: 6px; top: 9px; height: 37px; padding: 0 8px; font-size: .47rem; }
  .forest-hint { bottom: 14px; font-size: .53rem; max-width: calc(100vw - 24px); white-space: normal; text-align: center; }
}
