/* ═══════════════════════════════════════════════════════
   militree 花园探索世界
   ═══════════════════════════════════════════════════════ */

#pageGarden {
  max-width: 100% !important;
  height: calc(100vh - 60px);
  overflow: hidden;
}

.garden-map {
  width: 100%; height: 100%;
  background: linear-gradient(180deg, #87CEEB 0%, #E0F0E0 40%, #C8E6C0 70%, #8BC34A 100%);
  position: relative;
  overflow: hidden;
}

/* SVG 样式 */
.garden-svg {
  width: 100%; height: 100%;
}

/* 地块 */
.garden-plot {
  cursor: pointer;
  transition: transform 0.2s, filter 0.2s;
}
.garden-plot:hover {
  transform: scale(1.05);
  filter: brightness(1.1);
}
.garden-plot.completed {
  filter: saturate(1.3);
}

/* 地块标签 */
.garden-label {
  font-size: 12px; font-weight: 700;
  fill: #2d331a;
  pointer-events: none;
  text-anchor: middle;
}

/* 路径 */
.garden-path {
  fill: none; stroke: #d4c5a0; stroke-width: 8;
  stroke-linecap: round; stroke-linejoin: round;
}

/* 装饰元素 */
.garden-decoration {
  pointer-events: none;
  animation: sway 3s ease-in-out infinite;
}
@keyframes sway {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

/* 提示浮层 */
.garden-tooltip {
  position: absolute;
  background: white;
  border-radius: 10px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  pointer-events: none;
  z-index: 200;
  transition: opacity 0.15s;
}

/* 返回按钮 */
.garden-back {
  position: absolute; top: 12px; left: 12px;
  background: white; border: none; border-radius: 10px;
  padding: 8px 16px; font-size: 14px; font-weight: 600;
  box-shadow: 0 2px 8px rgba(0,0,0,.1);
  cursor: pointer; z-index: 100;
  color: var(--primary);
}
.garden-back:hover { background: var(--primary-light); }

/* 花园入口按钮 */
.garden-enter-btn {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 8px;
  font-size: 13px;
  color: var(--primary);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.garden-enter-btn:hover { color: #65a30d; }

/* 响应式 */
@media (max-width: 768px) {
  .garden-label { font-size: 10px; }
}
