.iso-farm {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  isolation: isolate;
  background: #afd9cd;
  color: #385b4d;
  font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  user-select: none;
  -webkit-user-select: none;
}
.iso-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
  cursor: grab;
}
.iso-canvas:active { cursor: grabbing; }
.iso-topline {
  position: absolute;
  z-index: 3;
  top: 14px;
  left: 16px;
  right: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  pointer-events: none;
  display: none;
}
.iso-location,
.iso-tip {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1.5px solid #7b9069;
  border-radius: 999px;
  background: #fff7e8ed;
  box-shadow: 0 3px 0 #465c4933;
  color: #47624d;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .025em;
  white-space: nowrap;
}
.iso-location i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #eea450;
  box-shadow: 0 0 0 4px #eea45033;
}
.iso-tip { min-height: 30px; background: #f9f6e8d9; font-size: 10px; font-weight: 750; }
.iso-controls {
  position: absolute;
  z-index: 4;
  bottom: 18px;
  right: 17px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.iso-controls button {
  display: grid;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  place-items: center;
  border: 1.5px solid #728762;
  border-radius: 11px;
  background: #fff8eaf0;
  box-shadow: 0 3px 0 #48604a3c;
  color: #44654f;
  cursor: pointer;
  font: 900 19px/1 "Noto Sans TC", sans-serif;
  transition: transform .12s ease, background .12s ease;
}
.iso-controls button:last-child { min-width: 48px; height: 30px; font-size: 10px; }
.iso-controls button:hover { transform: translateY(-1px); background: #fffdf3; }
.iso-controls button:active { transform: translateY(2px); box-shadow: 0 1px 0 #48604a3c; }
.iso-controls button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.farm-layout-ui { position:absolute; z-index:12; inset:0; pointer-events:none; font-family:"Noto Sans TC","PingFang TC",sans-serif; }
.farm-layout-open {
  position:absolute; top:10px; left:50%; transform:translateX(-50%); pointer-events:auto;
  border:1px solid #728762; border-radius:999px; padding:7px 15px; color:#345b48;
  background:#fff8eaf2; box-shadow:0 3px 0 #48604a3c; font-weight:850;
}
.farm-layout-panel {
  position:absolute; top:48px; left:50%; transform:translateX(-50%); width:min(310px,calc(100% - 18px));
  max-height:calc(100% - 58px); overflow:auto; pointer-events:auto; padding:11px 12px 10px;
  border:1.5px solid #748863; border-radius:15px; background:#fff9eefa; color:#355c48;
  box-shadow:0 6px 18px #263f3740; font-size:11px;
}
.farm-layout-panel[hidden],.farm-layout-open[hidden] { display:none; }
.farm-layout-panel header { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px; }
.farm-layout-panel header b { font-size:13px; }
.farm-layout-panel header span { color:#8b8865; font-size:9px; }
.farm-layout-panel label { display:block; margin:4px 0; font-weight:750; }
.farm-layout-panel select { width:100%; min-height:34px; border:1px solid #c5cdaa; border-radius:8px; padding:4px 8px; background:#fffdf5; color:#355c48; }
.farm-layout-add-row { display:grid; grid-template-columns:1fr 56px 56px; gap:5px; margin-top:5px; }
.farm-layout-add-row select { min-width:0; min-height:31px; }
.farm-layout-add-row button { border:1px solid #c9d0b1; border-radius:8px; background:#f5f4e4; color:#45654e; font-size:10px; font-weight:750; }
.farm-layout-instruction { margin:6px 0; line-height:1.45; color:#6a7d5d; }
.farm-layout-nudge { display:grid; grid-template-columns:repeat(4,34px) 1fr; align-items:center; gap:5px; }
.farm-layout-nudge button,.farm-layout-actions button { min-height:32px; border:1px solid #c9d0b1; border-radius:8px; background:#f5f4e4; color:#45654e; font-weight:750; }
.farm-layout-nudge button:focus-visible,.farm-layout-actions button:focus-visible { outline:3px solid #eba846; outline-offset:2px; }
.farm-layout-nudge .farm-layout-undo { padding:0 7px; font-size:10px; }
.farm-layout-status { min-height:16px; margin:6px 0; color:#587651; font-size:10px; }
.farm-layout-status[data-state="error"] { color:#a34d3e; }
.farm-layout-actions { display:flex; justify-content:flex-end; gap:7px; }
.farm-layout-actions button { min-width:72px; padding:4px 10px; }
.farm-layout-actions .is-primary { border-color:#2d785b; background:#2d785b; color:#fffbe9; }
@media(max-width:620px) {
  .farm-layout-open { top:7px; padding:6px 12px; font-size:11px; }
  .farm-layout-panel { top:40px; width:min(290px,calc(100% - 14px)); max-height:calc(100% - 47px); padding:9px 10px; }
  .farm-layout-nudge { grid-template-columns:repeat(4,32px) 1fr; gap:4px; }
  .farm-layout-nudge button,.farm-layout-actions button { min-height:30px; }
}
.iso-legend {
  position: absolute;
  z-index: 3;
  bottom: 14px;
  left: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  pointer-events: none;
  display: none;
}
.iso-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 29px;
  padding: 5px 10px;
  border: 1.5px solid #778869;
  border-radius: 999px;
  background: #fff7e8e8;
  box-shadow: 0 2px 0 #465c4933;
  color: #4d6149;
  font-size: 10px;
  font-weight: 800;
}
.iso-legend i { width: 11px; height: 8px; border-radius: 3px; }
.legend-water { background: #48b5a1; border: 1px solid #367d70; }
.legend-locked { background: #9eaa7599; border: 1px dashed #677d57; }
.iso-toast {
  position: absolute;
  z-index: 5;
  bottom: 18px;
  left: 50%;
  max-width: calc(100% - 32px);
  padding: 9px 16px;
  transform: translate(-50%, 10px);
  border: 1.5px solid #f1d99f;
  border-radius: 999px;
  background: #fff8eaf2;
  box-shadow: 0 4px 0 #435b473b;
  color: #8a6343;
  font-size: 12px;
  font-weight: 850;
  opacity: 0;
  transition: opacity .18s ease, transform .18s ease;
  pointer-events: none;
  white-space: nowrap;
}
.iso-toast.is-visible { transform: translate(-50%, 0); opacity: 1; }
.iso-farm[data-effect="harvest"] .iso-canvas { filter: saturate(1.12) brightness(1.035); }
.iso-farm[data-effect="feed"] .iso-canvas { filter: saturate(1.1); }
@media (max-width: 650px) {
  .iso-topline { top: 9px; left: 9px; right: 9px; }
  .iso-location { min-height: 30px; padding: 5px 9px; font-size: 10px; }
  .iso-tip { display: none; }
  .iso-controls { bottom: 12px; right: 9px; gap: 5px; }
  .iso-controls button { min-width: 33px; height: 33px; border-radius: 9px; }
  .iso-controls button:last-child { min-width: 43px; height: 28px; }
  .iso-legend { bottom: 9px; left: 9px; gap: 5px; }
  .iso-legend span { min-height: 26px; padding: 4px 8px; font-size: 9px; }
  .iso-toast { bottom: 11px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .iso-controls button, .iso-toast { transition: none; }
}

.iso-farm.rainy-weather::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:repeating-linear-gradient(112deg,transparent 0 39px,#bbdeed55 40px 41px,transparent 42px 79px);animation:pond-rain .7s linear infinite;opacity:.45}@keyframes pond-rain{to{background-position:-20px 55px}}
