/* v164: 第 2 套效果图——养殖场双列目录。保留原 customer 数据键和业务流程。 */
#matingView {
  --farm-forest: #07573f;
  --farm-forest-strong: #064733;
  --farm-green: #17684d;
  --farm-ink: #18231f;
  --farm-muted: #617168;
  --farm-paper: #faf9f5;
  --farm-sage: #e7efe8;
  --farm-sand: #f3e8d6;
  --farm-line: #dfe5df;
  scroll-padding-bottom: 92px;
}

/* v180: “添加种群”延续田园分区地图的纸张、鼠尾草绿与手绘养殖场语言。 */
body:has(#newMatingGroupView.active) {
  background: #f5f1e8;
}

body:has(#newMatingGroupView.active) #appMain {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

#newMatingGroupView.active {
  --group-forest: #155f47;
  --group-forest-dark: #0d4535;
  --group-ink: #1c2924;
  --group-muted: #66766e;
  --group-paper: #fbfaf6;
  --group-line: #d6e2d9;
  min-height: calc(100dvh - 84px);
  padding: 12px 12px 108px;
  color: var(--group-ink);
  background:
    linear-gradient(rgba(245, 241, 232, 0.94), rgba(245, 241, 232, 0.98)),
    url("./assets/farms-v164/farm-detail-map-v178.png") center top / cover fixed;
}

#newMatingGroupView > .back-button {
  display: none !important;
}

#newMatingGroupView .add-group-panel {
  display: grid;
  gap: 14px;
  width: min(720px, 100%);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#newMatingGroupView .add-group-hero {
  position: relative;
  min-height: 228px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #cfdfd3;
  border-radius: 26px;
  background: #e9f1e7;
}

#newMatingGroupView .add-group-hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 58%;
  opacity: 1;
  mix-blend-mode: normal;
}

#newMatingGroupView .add-group-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin: 0;
  padding: 24px;
  border: 1px solid var(--group-line);
  border-radius: 26px;
  background: rgba(251, 250, 246, 0.98);
  box-shadow: 0 18px 44px rgba(34, 72, 53, 0.1);
}

#newMatingGroupView .add-group-farm-context {
  display: none !important;
}

#newMatingGroupView .add-group-form label {
  display: grid;
  gap: 8px;
  color: var(--group-ink);
}

#newMatingGroupView .add-group-form label > span {
  font-size: 15px;
  font-weight: 900;
}

#newMatingGroupView .add-group-form input,
#newMatingGroupView .add-group-form select {
  min-height: 58px;
  padding: 0 16px;
  border: 1.5px solid #cbd9cf;
  border-radius: 16px;
  color: var(--group-ink);
  background-color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  font-size: 17px;
  font-weight: 800;
  outline: none;
}

#newMatingGroupView .add-group-form input:focus,
#newMatingGroupView .add-group-form select:focus {
  border-color: var(--group-forest);
  box-shadow: 0 0 0 4px rgba(21, 95, 71, 0.12);
}

#newMatingGroupView .add-group-form label > small {
  color: var(--group-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
}

#newMatingGroupView .add-group-form > .primary-button {
  display: flex;
  min-height: 60px;
  margin-top: 2px;
  padding: 0 20px;
  border: 0;
  border-radius: 17px;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  background: var(--group-forest);
  box-shadow: 0 12px 24px rgba(13, 69, 53, 0.2);
  font-size: 17px;
  font-weight: 900;
}

#newMatingGroupView .add-group-form > .primary-button:hover {
  background: var(--group-forest-dark);
}

#newMatingGroupView .add-group-form > .primary-button span:last-child {
  font-size: 24px;
  line-height: 1;
}

@media (max-width: 560px) {
  #newMatingGroupView .add-group-hero {
    min-height: 222px;
    padding: 0;
    border-radius: 22px;
  }

  #newMatingGroupView .add-group-form {
    gap: 16px;
    padding: 20px;
    border-radius: 22px;
  }
}

/* v187: 添加龟池继承添加种群的田园纸张语言，养殖场作为入口上下文隐藏。 */
body:has(#newTurtlePoolView.active) {
  background: #f5f1e8;
}

body:has(#newTurtlePoolView.active) #appMain {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

#newTurtlePoolView.active {
  --pool-form-forest: #155f47;
  --pool-form-forest-dark: #0d4535;
  --pool-form-ink: #1c2924;
  --pool-form-muted: #66766e;
  --pool-form-line: #d6e2d9;
  min-height: calc(100dvh - 84px);
  padding: 12px 12px 108px;
  color: var(--pool-form-ink);
  background:
    linear-gradient(rgba(245, 241, 232, 0.94), rgba(245, 241, 232, 0.98)),
    url("./assets/farms-v164/farm-detail-map-v178.png") center top / cover fixed;
}

#newTurtlePoolView > .back-button {
  display: none !important;
}

#newTurtlePoolView .add-pool-panel {
  display: grid;
  gap: 14px;
  width: min(720px, 100%);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#newTurtlePoolView .add-pool-hero {
  position: relative;
  min-height: 228px;
  overflow: hidden;
  border: 1px solid #e2d8c6;
  border-radius: 26px;
  background: #f5ecdd;
}

#newTurtlePoolView .add-pool-hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 58%;
}

#newTurtlePoolView .add-pool-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin: 0;
  padding: 24px;
  border: 1px solid var(--pool-form-line);
  border-radius: 26px;
  background: rgba(251, 250, 246, 0.98);
  box-shadow: 0 18px 44px rgba(34, 72, 53, 0.1);
}

#newTurtlePoolView .add-pool-farm-context {
  display: none !important;
}

#newTurtlePoolView .add-pool-form label {
  display: grid;
  gap: 8px;
  color: var(--pool-form-ink);
}

#newTurtlePoolView .add-pool-form label > span:first-child {
  font-size: 15px;
  font-weight: 900;
}

#newTurtlePoolView .add-pool-form label em {
  color: var(--pool-form-muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

#newTurtlePoolView .add-pool-form label > input:not([type="file"]) {
  min-height: 58px;
  padding: 0 16px;
  border: 1.5px solid #cbd9cf;
  border-radius: 16px;
  color: var(--pool-form-ink);
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  font-size: 17px;
  font-weight: 800;
  outline: none;
}

#newTurtlePoolView .add-pool-form label > input:not([type="file"]):focus,
#newTurtlePoolView .pool-photo-picker:focus-within {
  border-color: var(--pool-form-forest);
  box-shadow: 0 0 0 4px rgba(21, 95, 71, 0.12);
}

#newTurtlePoolView .add-pool-form input[name="species"]::placeholder {
  font-size: 15px;
  font-weight: 750;
}

#newTurtlePoolView .add-pool-form label > small,
#newTurtlePoolView .pool-photo-picker small {
  color: var(--pool-form-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
}

#newTurtlePoolView .pool-add-mode-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

#newTurtlePoolView .pool-add-mode-fieldset legend {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  padding: 0;
  color: var(--pool-form-ink);
  font-size: 16px;
  font-weight: 950;
}

#newTurtlePoolView .pool-add-mode-fieldset legend em {
  padding: 3px 7px;
  border-radius: 7px;
  color: #39705b;
  background: #e8f1e8;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.35;
}

#newTurtlePoolView .pool-add-mode-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

#newTurtlePoolView .pool-add-mode-option {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 112px;
  padding: 10px 10px 9px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1.5px solid #c8d5ca;
  border-radius: 14px;
  color: var(--pool-form-ink);
  background: rgba(255, 255, 255, 0.8);
  cursor: pointer;
  text-align: center;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

#newTurtlePoolView .pool-add-mode-option:hover {
  border-color: #8eaf9d;
  background: #fbfdf9;
}

#newTurtlePoolView .pool-add-mode-option:active {
  transform: scale(0.985);
}

#newTurtlePoolView .pool-add-mode-option:has(input:checked) {
  border: 2px solid var(--pool-form-forest);
  background: #f2f8f3;
  box-shadow: 0 8px 22px rgba(21, 95, 71, 0.09);
}

#newTurtlePoolView .pool-add-mode-option > input[type="radio"] {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 24px;
  min-height: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  opacity: 0;
  cursor: pointer;
}

#newTurtlePoolView .pool-add-mode-option:has(input:focus-visible) {
  outline: 3px solid rgba(21, 95, 71, 0.25);
  outline-offset: 3px;
}

#newTurtlePoolView .pool-add-mode-icon {
  display: flex;
  height: 43px;
  align-items: center;
  justify-content: center;
}

#newTurtlePoolView .pool-add-mode-icon-manual img {
  width: 62px;
  height: 43px;
  object-fit: contain;
}

#newTurtlePoolView .pool-add-mode-icon-group {
  gap: 0;
}

#newTurtlePoolView .pool-add-mode-icon-group img {
  width: 90px;
  height: 42px;
  object-fit: contain;
}

#newTurtlePoolView .pool-add-mode-indicator {
  position: absolute;
  top: 9px;
  right: 9px;
  width: 30px;
  height: 30px;
  object-fit: contain;
  pointer-events: none;
}

#newTurtlePoolView .pool-add-mode-indicator-selected,
#newTurtlePoolView .pool-add-mode-option:has(input:checked) .pool-add-mode-indicator-empty {
  display: none;
}

#newTurtlePoolView .pool-add-mode-option:has(input:checked) .pool-add-mode-indicator-selected {
  display: block;
}

#newTurtlePoolView .pool-add-mode-option strong {
  color: var(--pool-form-ink);
  font-size: 16px;
  font-weight: 950;
  line-height: 1.25;
}

#newTurtlePoolView .pool-add-mode-option:has(input:checked) strong {
  color: var(--pool-form-forest);
}

#newTurtlePoolView .pool-add-mode-option > small {
  color: var(--pool-form-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
}

#newTurtlePoolView .pool-photo-picker {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  min-height: 82px;
  padding: 14px 16px;
  overflow: hidden;
  align-items: center;
  border: 1.5px dashed #b9cec0;
  border-radius: 18px;
  background: #f4f8f3;
  cursor: pointer;
}

#newTurtlePoolView .pool-photo-picker > img {
  width: 34px;
  height: 34px;
  justify-self: center;
}

#newTurtlePoolView .pool-photo-picker > span {
  display: grid;
  gap: 3px;
}

#newTurtlePoolView .pool-photo-picker strong {
  color: var(--pool-form-forest);
  font-size: 15px;
  font-weight: 900;
}

#newTurtlePoolView .pool-photo-picker input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0.001;
  cursor: pointer;
}

#newTurtlePoolView .add-pool-form > .primary-button {
  min-height: 60px;
  margin-top: 2px;
  border: 0;
  border-radius: 17px;
  color: #fff;
  background: var(--pool-form-forest);
  box-shadow: 0 12px 24px rgba(13, 69, 53, 0.2);
  font-size: 17px;
  font-weight: 900;
}

#newTurtlePoolView .add-pool-form > .primary-button:hover {
  background: var(--pool-form-forest-dark);
}

@media (max-width: 560px) {
  #newTurtlePoolView .add-pool-hero {
    min-height: 222px;
    border-radius: 22px;
  }

  #newTurtlePoolView .add-pool-form {
    gap: 16px;
    padding: 12px;
    border-radius: 22px;
  }

  #newTurtlePoolView .pool-add-mode-option {
    min-height: 112px;
    padding: 10px 7px 9px;
    border-radius: 14px;
  }

  #newTurtlePoolView .pool-add-mode-icon-manual img {
    width: 60px;
    height: 42px;
  }

  #newTurtlePoolView .pool-add-mode-icon-group img {
    width: 86px;
    height: 41px;
  }

  #newTurtlePoolView .pool-add-mode-option strong {
    font-size: 14px;
  }
}

@media (max-width: 350px) {
  #newTurtlePoolView .pool-add-mode-options {
    gap: 8px;
  }

  #newTurtlePoolView .pool-add-mode-option {
    min-height: 108px;
    padding-right: 6px;
    padding-left: 6px;
  }

  #newTurtlePoolView .pool-add-mode-option strong {
    font-size: 13px;
  }
}

/* 从种群添加乌龟：第二步档案选择 */
#groupTurtlePoolPickerView.active {
  --group-pool-forest: #155f47;
  --group-pool-ink: #172820;
  --group-pool-muted: #66766e;
  --group-pool-line: #d3dfd6;
  min-height: calc(100dvh - 84px);
  padding: 12px 12px 116px;
  color: var(--group-pool-ink);
  background:
    linear-gradient(rgba(245, 241, 232, 0.94), rgba(245, 241, 232, 0.98)),
    url("./assets/farms-v164/farm-detail-map-v178.png") center top / cover fixed;
}

#groupTurtlePoolPickerView > .back-button {
  display: none !important;
}

.group-pool-picker-panel {
  display: grid;
  gap: 14px;
  width: min(720px, 100%);
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.group-pool-picker-head,
.group-pool-picker-form {
  border: 1px solid var(--group-pool-line);
  background: rgba(251, 250, 246, 0.98);
  box-shadow: 0 18px 44px rgba(34, 72, 53, 0.09);
}

.group-pool-picker-head {
  padding: 22px 24px;
  border-radius: 26px;
}

.group-pool-picker-head .eyebrow {
  margin: 0 0 5px;
  color: #4c8b68;
  font-size: 13px;
  font-weight: 900;
}

.group-pool-picker-head h2 {
  margin: 0;
  color: var(--group-pool-ink);
  font-size: clamp(28px, 7vw, 40px);
  font-weight: 950;
  letter-spacing: -0.04em;
}

.group-pool-picker-head > p:last-child {
  margin: 8px 0 0;
  color: var(--group-pool-muted);
  font-size: 14px;
  font-weight: 700;
}

.group-pool-picker-head > p:last-child strong {
  color: var(--group-pool-forest);
}

.group-pool-picker-form {
  display: grid;
  gap: 18px;
  padding: 24px;
  border-radius: 26px;
}

.group-pool-select-field {
  display: grid;
  gap: 8px;
}

.group-pool-select-field > span {
  color: var(--group-pool-ink);
  font-size: 16px;
  font-weight: 950;
}

.group-pool-select-field em {
  margin-left: 6px;
  padding: 3px 7px;
  border-radius: 7px;
  color: #39705b;
  background: #e8f1e8;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.group-pool-select-field select {
  width: 100%;
  min-height: 60px;
  padding: 0 46px 0 16px;
  border: 1.5px solid #c8d7cc;
  border-radius: 16px;
  color: var(--group-pool-ink);
  background-color: #fff;
  font-size: 17px;
  font-weight: 850;
  outline: none;
}

.group-pool-select-field select:focus {
  border-color: var(--group-pool-forest);
  box-shadow: 0 0 0 4px rgba(21, 95, 71, 0.12);
}

.group-pool-select-field small {
  color: var(--group-pool-muted);
  font-size: 12px;
  font-weight: 650;
}

.group-pool-turtle-section {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.group-pool-turtle-head {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.group-pool-turtle-head h3 {
  margin: 0;
  color: var(--group-pool-ink);
  font-size: 21px;
  font-weight: 950;
}

.group-pool-turtle-head p {
  margin: 3px 0 0;
  color: var(--group-pool-muted);
  font-size: 13px;
  font-weight: 750;
}

.group-pool-turtle-head > button {
  min-width: 64px;
  min-height: 44px;
  border-color: #cbdacf;
  border-radius: 13px;
  color: var(--group-pool-forest);
  background: #f5f9f5;
  font-weight: 850;
}

.group-pool-turtle-head > button[hidden] {
  display: none !important;
}

.group-pool-turtle-choices {
  display: grid;
  gap: 12px;
}

.group-pool-picker-empty {
  display: grid;
  min-height: 150px;
  padding: 24px;
  place-content: center;
  gap: 6px;
  border: 1.5px dashed #b9cec0;
  border-radius: 18px;
  color: var(--group-pool-muted);
  background: #f4f8f3;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.55;
  text-align: center;
}

.group-pool-picker-empty strong {
  color: var(--group-pool-ink);
  font-size: 17px;
}

.group-pool-sex-group {
  overflow: hidden;
  border: 1px solid var(--group-pool-line);
  border-radius: 18px;
  background: #fff;
}

.group-pool-sex-group > header {
  display: flex;
  min-height: 54px;
  padding: 8px 12px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e1e8e2;
  background: #f7f9f5;
}

.group-pool-sex-group > header > span {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}

.group-pool-sex-group > header img {
  width: 34px;
  height: 34px;
}

.group-pool-sex-group > header strong {
  font-size: 16px;
  font-weight: 950;
}

.group-pool-sex-group > header small {
  color: var(--group-pool-muted);
  font-size: 12px;
  font-weight: 800;
}

.group-pool-sex-group > header button {
  min-width: 54px;
  min-height: 44px;
  padding: 0 10px;
  border: 1px solid #cbdacf;
  border-radius: 11px;
  color: var(--group-pool-forest);
  background: #fff;
  font-size: 13px;
  font-weight: 900;
}

.group-pool-turtle-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
}

.group-pool-turtle-option {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  min-width: 0;
  min-height: 64px;
  padding: 10px 12px;
  align-items: center;
  gap: 10px;
  border: 1.5px solid #d7e1d9;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
}

.group-pool-turtle-option:has(input:checked) {
  border-color: var(--group-pool-forest);
  background: #eef6f0;
  box-shadow: 0 5px 14px rgba(21, 95, 71, 0.09);
}

.group-pool-turtle-option:has(input:focus-visible) {
  outline: 3px solid rgba(21, 95, 71, 0.24);
  outline-offset: 2px;
}

.group-pool-turtle-option input[type="checkbox"] {
  width: 24px;
  height: 24px;
  margin: 0;
  accent-color: var(--group-pool-forest);
  cursor: pointer;
}

.group-pool-checkmark {
  display: none;
}

.group-pool-turtle-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.group-pool-turtle-copy strong,
.group-pool-turtle-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.group-pool-turtle-copy strong {
  color: var(--group-pool-ink);
  font-size: 15px;
  font-weight: 900;
}

.group-pool-turtle-copy small {
  color: var(--group-pool-muted);
  font-size: 11px;
  font-weight: 700;
}

.group-pool-sex-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 14px;
  color: var(--group-pool-muted);
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.group-pool-picker-actions {
  position: sticky;
  bottom: 88px;
  z-index: 3;
  display: grid;
  grid-template-columns: 0.72fr 1.28fr;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(207, 220, 210, 0.95);
  border-radius: 18px;
  background: rgba(251, 250, 246, 0.96);
  box-shadow: 0 12px 28px rgba(28, 62, 46, 0.16);
  backdrop-filter: blur(12px);
}

.group-pool-picker-actions button {
  min-height: 54px;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 900;
}

.group-pool-picker-actions .ghost-button {
  border-color: #bfcfc3;
  color: var(--group-pool-forest);
  background: #fff;
}

.group-pool-picker-actions .primary-button {
  border: 0;
  color: #fff;
  background: var(--group-pool-forest);
  box-shadow: 0 8px 18px rgba(21, 95, 71, 0.18);
}

.group-pool-picker-actions .primary-button:disabled {
  color: #839088;
  background: #dce4dd;
  box-shadow: none;
  cursor: not-allowed;
}

@media (max-width: 560px) {
  .group-pool-picker-head {
    padding: 19px 18px;
    border-radius: 22px;
  }

  .group-pool-picker-form {
    gap: 16px;
    padding: 14px 12px 12px;
    border-radius: 22px;
  }

  .group-pool-turtle-list {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .group-pool-turtle-option {
    transition: none;
  }
}

body:not(.data-center-sheet-open):not(:has(#farmCreateDialog:popover-open)) {
  overflow-y: auto;
  overscroll-behavior-y: auto;
}

body:has(#farmCreateDialog:popover-open) {
  overflow: hidden;
}

/* v222: 单只乌龟档案提供清楚可见的删除入口。 */
.archive-primary-actions button.archive-delete-action {
  border-color: #c9474f;
  color: #b82f3a;
  background: #fff6f5;
}

.archive-primary-actions.has-mating button.archive-delete-action {
  grid-column: 1 / -1;
}

.archive-primary-actions button.archive-delete-action:hover,
.archive-primary-actions button.archive-delete-action:focus-visible {
  border-color: #b82f3a;
  color: #a92430;
  background: #ffeceb;
}

/* v223: 从种群建立的龟池可按公、母、未知管理具体乌龟档案。 */
#turtlePoolDetailView .pool-directory-metric {
  width: 100%;
  margin: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  cursor: pointer;
  appearance: none;
}

#turtlePoolDetailView .pool-directory-metric em {
  padding: 4px 9px;
  border-radius: 999px;
  color: #176747;
  background: #eef6ef;
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
  line-height: 1;
}

#turtlePoolDetailView .pool-directory-metric:hover,
#turtlePoolDetailView .pool-directory-metric:focus-visible {
  position: relative;
  z-index: 1;
  outline: 3px solid rgba(27, 112, 76, 0.2);
  outline-offset: -3px;
  background: #f5faf4;
}

.group-pool-directory-view {
  width: min(100%, 760px);
  margin-inline: auto;
}

.group-pool-directory-panel {
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: rgba(255, 253, 247, 0.98);
  box-shadow: none;
}

.group-pool-directory-head {
  display: flex;
  padding: 22px 24px 18px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 0;
  background: #fffdf7;
}

.group-pool-directory-head .eyebrow {
  display: none;
}

.group-pool-directory-head h2 {
  margin: 0;
  color: #174936;
  font-size: clamp(28px, 5.2vw, 40px);
  line-height: 1.08;
}

.group-pool-directory-head p:last-child {
  margin: 6px 0 0;
  color: #687c73;
  font-size: 15px;
  font-weight: 800;
}

.group-pool-directory-add {
  min-width: 136px;
  min-height: 48px;
  padding: 0 16px;
  border: 0;
  border-radius: 14px;
  color: #fff;
  background: #2f764f;
  font-size: 15px;
  font-weight: 900;
  box-shadow: 0 7px 16px rgba(23, 103, 71, 0.18);
  cursor: pointer;
}

.group-pool-directory-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 8px 20px 24px;
  gap: 14px;
}

.group-pool-directory-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  padding: 10px;
  align-content: start;
  gap: 9px;
  border: 1px solid #d5ddd1;
  border-radius: 16px;
  background: #fffefa;
  box-shadow: 0 4px 12px rgba(30, 73, 50, 0.04);
}

.group-pool-directory-photo,
.group-pool-add-choice-photo {
  display: grid;
  overflow: hidden;
  place-items: center;
  border-radius: 18px;
  background: #eef5ee;
  aspect-ratio: 1;
}

.group-pool-directory-photo {
  border-radius: 12px;
  aspect-ratio: 4 / 3;
}

.group-pool-directory-photo > img,
.group-pool-directory-photo > span,
.group-pool-add-choice-photo > img,
.group-pool-add-choice-photo > span {
  width: 100%;
  height: 100%;
}

.group-pool-directory-photo img,
.group-pool-add-choice-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.group-pool-directory-photo > span img,
.group-pool-add-choice-photo > span img {
  padding: 12px;
  object-fit: contain;
  opacity: 0.72;
}

.group-pool-directory-copy {
  min-width: 0;
}

.group-pool-directory-copy h3 {
  margin: 0 0 3px;
  overflow-wrap: anywhere;
  color: #174936;
  font-size: 21px;
  line-height: 1.18;
}

.group-pool-directory-copy p {
  margin: 0;
  overflow-wrap: normal;
  color: #737b77;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
  white-space: nowrap;
}

.group-pool-directory-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.group-pool-directory-actions:has(.group-pool-directory-open:only-child) {
  grid-template-columns: minmax(0, 1fr);
}

.group-pool-directory-open,
.group-pool-directory-transfer {
  min-height: 44px;
  padding: 0 8px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 850;
  cursor: pointer;
}

.group-pool-directory-open {
  border: 1.5px solid #287251;
  color: #176747;
  background: #fffefa;
}

.group-pool-directory-transfer {
  border: 1.5px solid #b27a2d;
  color: #87581d;
  background: #fff9ec;
}

.group-pool-directory-transfer:hover,
.group-pool-directory-transfer:focus-visible {
  border-color: #87581d;
  outline: 3px solid rgba(178, 122, 45, 0.18);
  outline-offset: 2px;
  background: #fff3d6;
}

.group-pool-directory-empty {
  display: grid;
  min-height: 190px;
  padding: 28px;
  place-content: center;
  gap: 8px;
  border: 1px dashed #bcd1c2;
  border-radius: 22px;
  color: #697a70;
  background: #f7faf6;
  text-align: center;
}

.group-pool-directory-empty strong {
  color: #214737;
  font-size: 20px;
}

.group-pool-add-view {
  width: min(100%, 760px);
  margin-inline: auto;
}

.group-pool-add-card {
  padding: 0;
  overflow: hidden;
  border: 1px solid #d0ddcf;
  border-radius: 26px;
  background: #fffefa;
  box-shadow: 0 16px 42px rgba(18, 56, 39, 0.12);
}

.group-pool-add-card > header {
  padding: 20px 22px 16px;
  border-bottom: 1px solid #dce4d9;
  background: linear-gradient(135deg, #f2f7ed 0%, #fffaf0 100%);
}

.group-pool-add-card header p,
.group-pool-add-card header h2,
.group-pool-add-card header small {
  margin: 0;
}

.group-pool-add-card header p {
  color: #5b876e;
  font-weight: 850;
}

.group-pool-add-card header h2 {
  margin-top: 4px;
  color: #123d2d;
  font-size: clamp(28px, 5vw, 38px);
  line-height: 1.08;
}

.group-pool-add-card header small {
  display: block;
  margin-top: 6px;
  color: #6f7f76;
}

.group-pool-add-choices {
  display: grid;
  padding: 14px;
  gap: 9px;
}

.group-pool-add-choice {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  min-height: 82px;
  padding: 9px 10px;
  align-items: center;
  gap: 11px;
  border: 1px solid #dce4d9;
  border-radius: 16px;
  background: #fff;
}

.group-pool-add-choice strong,
.group-pool-add-choice small {
  display: block;
  overflow-wrap: anywhere;
}

.group-pool-add-choice strong {
  color: #14243c;
  font-size: 18px;
  line-height: 1.15;
}

.group-pool-add-choice small {
  margin-top: 4px;
  color: #748078;
  font-size: 12px;
  line-height: 1.3;
}

.group-pool-add-choice > button {
  min-width: 96px;
  min-height: 44px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: #176747;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
}

.group-pool-add-choice > button:hover,
.group-pool-add-choice > button:focus-visible {
  outline: 3px solid rgba(23, 103, 71, 0.22);
  outline-offset: 2px;
  background: #0f573b;
}

/* v226: 乌龟可以在同一种群的龟池之间转移，或转回手工龟缸。 */
.group-pool-transfer-view {
  width: min(100%, 760px);
  margin-inline: auto;
}

.group-pool-transfer-card {
  padding: 0;
  overflow: hidden;
  border: 1px solid #d0ddcf;
  border-radius: 26px;
  background: #fffefa;
  box-shadow: 0 16px 42px rgba(18, 56, 39, 0.12);
}

.group-pool-transfer-head {
  padding: 22px 24px 18px;
  border-bottom: 1px solid #dce4d9;
  background: linear-gradient(135deg, #f2f7ed 0%, #fffaf0 100%);
}

.group-pool-transfer-head p,
.group-pool-transfer-head h2,
.group-pool-transfer-head small {
  margin: 0;
}

.group-pool-transfer-head p {
  color: #5b876e;
  font-size: 14px;
  font-weight: 850;
}

.group-pool-transfer-head h2 {
  margin-top: 4px;
  color: #123d2d;
  font-size: clamp(28px, 5vw, 38px);
  line-height: 1.08;
}

.group-pool-transfer-head small {
  display: block;
  margin-top: 7px;
  color: #66766e;
  font-size: 13px;
  line-height: 1.5;
}

.group-pool-transfer-turtle {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  margin: 18px 20px 0;
  padding: 10px;
  align-items: center;
  gap: 12px;
  border: 1px solid #dce4d9;
  border-radius: 18px;
  background: #fff;
}

.group-pool-transfer-turtle .group-pool-directory-photo {
  width: 76px;
  border-radius: 12px;
  aspect-ratio: 1;
}

.group-pool-transfer-turtle strong,
.group-pool-transfer-turtle small,
.group-pool-transfer-turtle em {
  display: block;
}

.group-pool-transfer-turtle strong {
  color: #174936;
  font-size: 20px;
  line-height: 1.2;
}

.group-pool-transfer-turtle small {
  margin-top: 3px;
  color: #707c76;
  font-size: 12px;
  font-weight: 700;
}

.group-pool-transfer-turtle em {
  margin-top: 6px;
  color: #87581d;
  font-size: 13px;
  font-style: normal;
  font-weight: 800;
}

.group-pool-transfer-form {
  padding: 18px 20px 22px;
}

.group-pool-transfer-destinations {
  display: grid;
  margin: 0;
  padding: 0;
  gap: 10px;
  border: 0;
}

.group-pool-transfer-destinations legend {
  margin-bottom: 10px;
  color: #172820;
  font-size: 17px;
  font-weight: 900;
}

.group-pool-transfer-option {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  min-height: 62px;
  padding: 12px 14px;
  align-items: center;
  gap: 11px;
  border: 1.5px solid #d6e0d7;
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
}

.group-pool-transfer-option:has(input:checked) {
  border-color: #26714f;
  background: #f4faf5;
  box-shadow: 0 0 0 3px rgba(38, 113, 79, 0.09);
}

.group-pool-transfer-option:has(input:focus-visible) {
  outline: 3px solid rgba(38, 113, 79, 0.22);
  outline-offset: 2px;
}

.group-pool-transfer-option input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: #176747;
}

.group-pool-transfer-option strong,
.group-pool-transfer-option small {
  display: block;
}

.group-pool-transfer-option strong {
  color: #173f30;
  font-size: 16px;
}

.group-pool-transfer-option small {
  margin-top: 3px;
  color: #6c7972;
  font-size: 12px;
  line-height: 1.45;
}

.group-pool-transfer-option.is-disabled {
  cursor: not-allowed;
  opacity: 0.56;
}

.group-pool-transfer-field {
  display: grid;
  padding: 2px 2px 8px 34px;
  gap: 6px;
}

.group-pool-transfer-field[hidden] {
  display: none;
}

.group-pool-transfer-field label {
  color: #263b31;
  font-size: 14px;
  font-weight: 850;
}

.group-pool-transfer-field select,
.group-pool-transfer-field input {
  width: 100%;
  min-height: 48px;
  padding: 0 13px;
  border: 1px solid #cbd8ce;
  border-radius: 12px;
  color: #172820;
  background: #fff;
  font: inherit;
}

.group-pool-transfer-field select:focus,
.group-pool-transfer-field input:focus {
  border-color: #176747;
  outline: 3px solid rgba(23, 103, 71, 0.16);
  outline-offset: 1px;
}

.group-pool-transfer-field small {
  color: #6c7972;
  font-size: 12px;
  line-height: 1.4;
}

.group-pool-transfer-error {
  min-height: 20px;
  margin: 8px 0 0 34px;
  color: #b52e38;
  font-size: 13px;
  font-weight: 750;
}

.group-pool-transfer-actions {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  margin-top: 8px;
  gap: 10px;
}

.group-pool-transfer-actions button {
  min-height: 48px;
  border-radius: 13px;
  font-size: 15px;
  font-weight: 900;
}

.group-pool-transfer-actions .primary-button {
  background: #176747;
}

@media (max-width: 560px) {
  #turtlePoolDetailView .pool-directory-metric em {
    padding: 3px 6px;
    font-size: 9px;
  }

  .group-pool-directory-panel {
    border-radius: 0;
  }

  .group-pool-directory-head {
    padding: 16px 14px 12px;
    align-items: center;
    flex-direction: row;
    gap: 10px;
  }

  .group-pool-directory-add {
    width: auto;
    min-width: 118px;
    min-height: 46px;
    padding-inline: 12px;
    font-size: 14px;
  }

  .group-pool-directory-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 6px 12px 22px;
    gap: 10px;
  }

  .group-pool-directory-card {
    grid-template-columns: minmax(0, 1fr);
    padding: 8px;
    gap: 7px;
    border-radius: 14px;
  }

  .group-pool-directory-copy h3 {
    font-size: 19px;
  }

  .group-pool-directory-copy p {
    font-size: 10px;
    letter-spacing: -0.01em;
  }

  .group-pool-directory-open,
  .group-pool-directory-transfer {
    min-height: 42px;
    font-size: 13px;
  }

  .group-pool-add-card {
    border-radius: 22px;
  }

  .group-pool-add-card > header {
    padding: 17px 14px 14px;
  }

  .group-pool-add-choices {
    padding: 10px;
    gap: 8px;
  }

  .group-pool-add-choice {
    grid-template-columns: 54px minmax(0, 1fr) 88px;
    min-height: 72px;
    padding: 8px;
    gap: 8px;
  }

  .group-pool-add-choice > button {
    min-width: 0;
    width: 88px;
    min-height: 44px;
    padding-inline: 8px;
    font-size: 13px;
  }

  .group-pool-add-choice strong {
    font-size: 16px;
  }

  .group-pool-add-choice small {
    font-size: 11px;
  }

  .group-pool-transfer-card {
    border-radius: 20px;
  }

  .group-pool-transfer-head {
    padding: 18px 16px 15px;
  }

  .group-pool-transfer-turtle {
    margin: 14px 14px 0;
  }

  .group-pool-transfer-form {
    padding: 16px 14px 20px;
  }

  .group-pool-transfer-field {
    padding-left: 0;
  }

  .group-pool-transfer-error {
    margin-left: 0;
  }
}

/* v210: 手动龟池档案采用已选第 2 套分组总览；库存和日记继续读取稳定关联键。 */
#turtlePoolDetailView .pool-overview-option2 {
  --pool-v210-forest: #0b4d38;
  --pool-v210-green: #2e7b4d;
  --pool-v210-ink: #17352a;
  --pool-v210-muted: #5f6f67;
  --pool-v210-line: #d7dfcf;
  --pool-v210-paper: #fffefa;
  display: grid;
  gap: 24px;
  padding: 24px 22px 28px;
  border-color: #d4ddcc;
  color: var(--pool-v210-ink);
  background: rgba(255, 254, 250, 0.98);
  box-shadow: 0 14px 36px rgba(35, 71, 52, 0.08);
}

#turtlePoolDetailView .pool-overview-option2 .pool-status-title {
  position: relative;
  margin: 0;
  padding-left: 20px;
  color: var(--pool-v210-forest);
  font-size: clamp(26px, 4vw, 38px);
  font-weight: 950;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

#turtlePoolDetailView .pool-overview-option2 .pool-status-title::before {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 0;
  width: 7px;
  border-radius: 99px;
  background: #2c7d4b;
  content: "";
}

#turtlePoolDetailView .pool-breed-banner {
  position: relative;
  display: grid;
  grid-template-columns: 74px auto 1fr;
  min-height: 124px;
  padding: 18px 112px 18px 18px;
  align-items: center;
  overflow: hidden;
  border: 1px solid #ced9bf;
  border-radius: 24px;
  background: #f3f5e9;
}

#turtlePoolDetailView .pool-breed-art {
  position: relative;
  z-index: 2;
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(38, 91, 59, 0.18);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.66);
}

#turtlePoolDetailView .pool-breed-art img {
  width: 54px;
  height: 54px;
  object-fit: contain;
}

#turtlePoolDetailView .pool-breed-label {
  position: relative;
  z-index: 2;
  padding: 0 18px 0 8px;
  border-right: 1px solid #b9c6ad;
  color: var(--pool-v210-forest);
  font-size: 18px;
  font-weight: 900;
  white-space: nowrap;
}

#turtlePoolDetailView .pool-breed-banner > strong {
  position: relative;
  z-index: 2;
  min-width: 0;
  padding-left: 20px;
  overflow-wrap: anywhere;
  color: var(--pool-v210-forest);
  font-size: clamp(28px, 5vw, 46px);
  font-weight: 950;
  letter-spacing: -0.04em;
  line-height: 1.05;
}

#turtlePoolDetailView .pool-breed-decoration {
  position: absolute;
  top: -8px;
  right: -34px;
  width: 190px;
  height: 140px;
  object-fit: cover;
  object-position: 62% center;
  opacity: 0.2;
  mix-blend-mode: multiply;
  pointer-events: none;
}

#turtlePoolDetailView .pool-status-group {
  position: relative;
  padding: 32px 14px 12px;
  border: 1px solid var(--pool-v210-line);
  border-radius: 24px;
  background: var(--pool-v210-paper);
}

#turtlePoolDetailView .pool-status-group > h4 {
  position: absolute;
  top: -18px;
  left: 0;
  display: flex;
  min-height: 46px;
  margin: 0;
  padding: 6px 18px 6px 10px;
  align-items: center;
  gap: 8px;
  border: 1px solid #d8dec8;
  border-radius: 0 22px 22px 0;
  color: var(--pool-v210-forest);
  background: #eef1df;
  font-size: 18px;
  font-weight: 950;
  line-height: 1;
}

#turtlePoolDetailView .pool-status-group > h4 i {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: #2f7548;
}

#turtlePoolDetailView .pool-status-group > h4 img {
  width: 19px;
  height: 19px;
  filter: brightness(0) invert(1);
}

#turtlePoolDetailView .pool-status-group-grid {
  display: grid;
  align-items: stretch;
}

#turtlePoolDetailView .pool-status-group-grid.four-columns {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#turtlePoolDetailView .pool-status-group-grid.three-columns {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#turtlePoolDetailView .pool-option2-metric {
  display: grid;
  min-width: 0;
  min-height: 116px;
  padding: 12px 8px 8px;
  place-items: center;
  align-content: center;
  gap: 6px;
  border-left: 1px solid #e1e5dc;
  text-align: center;
}

#turtlePoolDetailView .pool-option2-metric:first-child {
  border-left: 0;
}

#turtlePoolDetailView .pool-option2-metric.no-icon {
  min-height: 88px;
  padding-top: 16px;
  padding-bottom: 12px;
  gap: 12px;
}

#turtlePoolDetailView .pool-option2-metric > i {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 50%;
  background: #edf4ed;
}

#turtlePoolDetailView .pool-option2-metric.amber > i {
  background: #fff4d9;
}

#turtlePoolDetailView .pool-option2-metric.blue > i {
  background: #e9f3fb;
}

#turtlePoolDetailView .pool-option2-metric.pink > i {
  background: #fdebf2;
}

#turtlePoolDetailView .pool-option2-metric.violet > i {
  background: #eeebff;
}

#turtlePoolDetailView .pool-option2-metric > i img {
  width: 27px;
  height: 27px;
}

#turtlePoolDetailView .pool-option2-metric b {
  min-height: 30px;
  color: #355247;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.15;
}

#turtlePoolDetailView .pool-option2-metric strong {
  max-width: 100%;
  overflow-wrap: anywhere;
  color: var(--pool-v210-forest);
  font-size: clamp(27px, 4.4vw, 40px);
  font-weight: 950;
  letter-spacing: -0.035em;
  line-height: 1;
}

.manual-pool-edit-dialog {
  width: min(620px, calc(100% - 28px));
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 1px solid #d1ddcf;
  border-radius: 28px;
  color: #17352a;
  background: #fffefa;
  box-shadow: 0 24px 70px rgba(18, 56, 39, 0.28);
}

.manual-pool-edit-dialog::backdrop {
  background: rgba(16, 37, 28, 0.5);
  backdrop-filter: blur(5px);
}

.manual-pool-edit-form {
  display: grid;
  gap: 20px;
  padding: 24px;
}

.manual-pool-edit-form > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.manual-pool-edit-form > header p {
  margin: 0 0 4px;
  color: #5f766b;
  font-size: 13px;
  font-weight: 800;
}

.manual-pool-edit-form > header h2 {
  margin: 0;
  color: #0b4d38;
  font-size: 27px;
  font-weight: 950;
}

.manual-pool-edit-close {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #d3ddd3;
  border-radius: 12px;
  color: #51655b;
  background: #f5f7f2;
  font-size: 13px;
  font-weight: 850;
}

.manual-pool-edit-form label {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.manual-pool-edit-form label > span {
  color: #27483b;
  font-size: 14px;
  font-weight: 900;
}

.manual-pool-edit-form input {
  width: 100%;
  min-height: 56px;
  padding: 0 15px;
  border: 1.5px solid #cad8cc;
  border-radius: 15px;
  color: #17352a;
  background: #fff;
  font-size: 18px;
  font-weight: 850;
  outline: none;
}

.manual-pool-edit-form input:focus {
  border-color: #24724d;
  box-shadow: 0 0 0 4px rgba(36, 114, 77, 0.12);
}

.manual-pool-edit-form label small {
  color: #6a7a72;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
}

.manual-pool-edit-counts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.manual-pool-edit-total {
  display: grid;
  grid-template-columns: 1fr auto;
  padding: 16px 18px;
  align-items: center;
  gap: 4px 16px;
  border: 1px solid #d2ddc9;
  border-radius: 18px;
  background: #f1f5e9;
}

.manual-pool-edit-total span {
  color: #315443;
  font-size: 15px;
  font-weight: 900;
}

.manual-pool-edit-total strong {
  grid-row: 1 / span 2;
  grid-column: 2;
  color: #0b4d38;
  font-size: 34px;
  font-weight: 950;
}

.manual-pool-edit-total small {
  color: #6a796f;
  font-size: 11px;
  font-weight: 700;
}

.manual-pool-edit-actions {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 12px;
}

.manual-pool-edit-actions button {
  min-height: 54px;
  border-radius: 15px;
  font-size: 16px;
  font-weight: 900;
}

.manual-pool-edit-cancel {
  border: 1px solid #d3ddd3;
  color: #53675d;
  background: #f6f7f4;
}

.manual-pool-edit-save {
  border: 0;
  color: #fff;
  background: #156344;
  box-shadow: 0 10px 22px rgba(21, 99, 68, 0.2);
}

body:has(.manual-pool-edit-dialog[open]) {
  overflow: hidden;
}

@media (max-width: 560px) {
  #turtlePoolDetailView .pool-overview-option2 {
    gap: 22px;
    padding: 20px 14px 24px;
    border-radius: 24px;
  }

  #turtlePoolDetailView .pool-overview-option2 .pool-status-title {
    padding-left: 16px;
    font-size: 26px;
  }

  #turtlePoolDetailView .pool-overview-option2 .pool-status-title::before {
    width: 6px;
  }

  #turtlePoolDetailView .pool-breed-banner {
    grid-template-columns: 58px auto minmax(0, 1fr);
    min-height: 106px;
    padding: 14px 50px 14px 12px;
    border-radius: 20px;
  }

  #turtlePoolDetailView .pool-breed-art {
    width: 50px;
    height: 50px;
  }

  #turtlePoolDetailView .pool-breed-art img {
    width: 44px;
    height: 44px;
  }

  #turtlePoolDetailView .pool-breed-label {
    padding: 0 10px 0 6px;
    font-size: 14px;
  }

  #turtlePoolDetailView .pool-breed-banner > strong {
    padding-left: 12px;
    font-size: 27px;
  }

  #turtlePoolDetailView .pool-breed-decoration {
    right: -72px;
    width: 154px;
    height: 112px;
    opacity: 0.16;
  }

  #turtlePoolDetailView .pool-status-group {
    padding: 27px 6px 8px;
    border-radius: 20px;
  }

  #turtlePoolDetailView .pool-status-group > h4 {
    top: -15px;
    min-height: 40px;
    padding: 5px 14px 5px 8px;
    font-size: 15px;
  }

  #turtlePoolDetailView .pool-status-group > h4 i {
    width: 28px;
    height: 28px;
  }

  #turtlePoolDetailView .pool-status-group > h4 img {
    width: 16px;
    height: 16px;
  }

  #turtlePoolDetailView .pool-option2-metric {
    min-height: 102px;
    padding: 10px 4px 6px;
    gap: 5px;
  }

  #turtlePoolDetailView .pool-option2-metric.no-icon {
    min-height: 80px;
    padding-top: 14px;
    padding-bottom: 10px;
    gap: 10px;
  }

  #turtlePoolDetailView .pool-option2-metric > i {
    width: 39px;
    height: 39px;
  }

  #turtlePoolDetailView .pool-option2-metric > i img {
    width: 23px;
    height: 23px;
  }

  #turtlePoolDetailView .pool-option2-metric b {
    min-height: 27px;
    font-size: 11px;
  }

  #turtlePoolDetailView .pool-option2-metric strong {
    font-size: 27px;
  }

  .manual-pool-edit-dialog {
    width: calc(100% - 20px);
    max-height: calc(100dvh - 20px);
    border-radius: 24px;
  }

  .manual-pool-edit-form {
    gap: 17px;
    padding: 20px 16px;
  }

  .manual-pool-edit-form > header h2 {
    font-size: 24px;
  }

  .manual-pool-edit-counts {
    gap: 8px;
  }

  .manual-pool-edit-counts input {
    padding: 0 10px;
    text-align: center;
  }

  .manual-pool-edit-counts label > span {
    font-size: 12px;
    text-align: center;
  }
}

/* 手动添加乌龟：第二步填写品种和公母未知数量 */
#manualTurtlePoolEntryView.active {
  --manual-entry-forest: #155f47;
  --manual-entry-ink: #172820;
  --manual-entry-muted: #66766e;
  --manual-entry-line: #d3dfd6;
  min-height: calc(100dvh - 84px);
  padding: 12px 12px 116px;
  color: var(--manual-entry-ink);
  background:
    linear-gradient(rgba(245, 241, 232, 0.94), rgba(245, 241, 232, 0.98)),
    url("./assets/farms-v164/farm-detail-map-v178.png") center top / cover fixed;
}

#manualTurtlePoolEntryView > .back-button {
  display: none !important;
}

.manual-pool-entry-panel {
  display: grid;
  gap: 14px;
  width: min(720px, 100%);
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.manual-pool-entry-head,
.manual-pool-create-form {
  border: 1px solid var(--manual-entry-line);
  background: rgba(251, 250, 246, 0.98);
  box-shadow: 0 18px 44px rgba(34, 72, 53, 0.09);
}

.manual-pool-entry-head {
  padding: 22px 24px;
  border-radius: 26px;
}

.manual-pool-entry-head .eyebrow {
  margin: 0 0 5px;
  color: #4c8b68;
  font-size: 13px;
  font-weight: 900;
}

.manual-pool-entry-head h2 {
  margin: 0;
  color: var(--manual-entry-ink);
  font-size: clamp(28px, 7vw, 40px);
  font-weight: 950;
  letter-spacing: -0.04em;
}

.manual-pool-entry-head > p:last-child {
  margin: 8px 0 0;
  color: var(--manual-entry-muted);
  font-size: 14px;
  font-weight: 700;
}

.manual-pool-entry-head > p:last-child strong {
  color: var(--manual-entry-forest);
}

.manual-pool-create-form {
  border-radius: 26px;
}

.manual-pool-create-form .manual-pool-edit-breed em {
  margin-left: 6px;
  padding: 3px 7px;
  border-radius: 7px;
  color: #39705b;
  background: #e8f1e8;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.manual-pool-create-count-section {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid #d6e0d6;
  border-radius: 20px;
  background: #f8faf6;
}

.manual-pool-create-count-section h3 {
  margin: 0;
  color: var(--manual-entry-ink);
  font-size: 20px;
  font-weight: 950;
}

.manual-pool-create-count-section > div:first-child p {
  margin: 3px 0 0;
  color: var(--manual-entry-muted);
  font-size: 12px;
  font-weight: 700;
}

.manual-pool-create-actions .manual-pool-edit-save {
  background: var(--manual-entry-forest);
}

@media (max-width: 560px) {
  .manual-pool-entry-head {
    padding: 19px 18px;
    border-radius: 22px;
  }

  .manual-pool-create-form {
    gap: 16px;
    padding: 16px 12px 12px;
    border-radius: 22px;
  }

  .manual-pool-create-count-section {
    padding: 14px 10px;
  }

  .manual-pool-create-count-section .manual-pool-edit-counts {
    gap: 7px;
  }

  .manual-pool-create-count-section .manual-pool-edit-counts input {
    min-height: 58px;
    font-size: 20px;
  }
}

#appMain,
#matingView.active,
#matingView .customer-section,
#matingView .customer-row-card {
  overflow-y: visible;
  overscroll-behavior-y: auto;
}

body:has(#matingView.farm-directory-mode.active) {
  background: var(--farm-paper, #faf9f5);
}

body:has(#matingView.farm-directory-mode.active) #appMain {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

#matingView.farm-directory-mode {
  position: relative;
  padding: 0 0 92px;
  background: var(--farm-paper);
}

#matingView.farm-directory-mode > .back-row {
  display: none;
}

#matingView.farm-directory-mode > .back-row #backMatingCustomersButton {
  display: none !important;
}

#matingView.farm-directory-mode .customer-management-panel {
  width: min(960px, 100%);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#matingView.farm-directory-mode .customer-management-panel > .panel-head {
  position: relative;
  display: flex;
  width: calc(100% - 24px);
  min-height: 176px;
  margin: 12px auto 0;
  padding: 28px 28px 24px;
  align-items: flex-start;
  justify-content: space-between;
  overflow: hidden;
  border: 0;
  border-radius: 30px;
  color: #fff;
  background-color: var(--farm-forest);
  background-image: url("./assets/farms-v164/farm-hero-field.png");
  background-position: center;
  background-size: cover;
  box-shadow: none;
  text-align: left;
}

/* 进入单个龟场后不再重复显示系统总览，直接展示当前龟场内容。 */
#matingView:not(.farm-directory-mode) .customer-management-panel > .panel-head {
  display: none;
}

#matingView:not(.farm-directory-mode) .customer-management-panel {
  width: min(760px, 100%);
  margin: 0 auto;
}

#matingView:not(.farm-directory-mode) #matingGroupList {
  gap: 0;
}

#matingView:not(.farm-directory-mode) .customer-detail-section {
  gap: 18px;
  width: calc(100% - 24px);
  margin: 12px auto 24px;
  padding: 20px;
  border: 1px solid #dfe8e1;
  border-radius: 26px;
  background: rgba(252, 253, 250, 0.98);
  box-shadow: 0 18px 44px rgba(18, 64, 45, 0.1);
}

#matingView:not(.farm-directory-mode) .customer-detail-section > .customer-section-head {
  padding: 18px;
  border: 1px solid #d9e7dc;
  border-radius: 20px;
  background: linear-gradient(135deg, #eef7f0 0%, #fbf8ef 100%);
}

#matingView:not(.farm-directory-mode) .customer-detail-section > .customer-section-head strong {
  color: var(--farm-ink);
  font-size: 28px;
  line-height: 1.12;
}

#matingView:not(.farm-directory-mode) .customer-detail-section > .customer-section-head strong::before {
  width: 5px;
  height: 30px;
  background: var(--farm-green);
}

#matingView:not(.farm-directory-mode) .customer-detail-section > .customer-section-head small {
  margin: 7px 0 0 13px;
  color: var(--farm-muted);
  font-size: 13px;
}

#matingView:not(.farm-directory-mode) .customer-detail-section .header-actions {
  gap: 8px;
}

#matingView:not(.farm-directory-mode) .customer-detail-section .header-actions span {
  display: grid;
  min-height: 42px;
  padding: 0 10px;
  place-items: center;
  border: 1px solid #d6e6db;
  border-radius: 13px;
  color: var(--farm-green);
  background: rgba(255, 255, 255, 0.76);
  font-size: 13px;
}

#matingView:not(.farm-directory-mode) .customer-detail-section .header-actions .ghost-button {
  min-height: 46px;
  border: 0;
  border-radius: 14px;
  color: #fff;
  background: var(--farm-green);
  box-shadow: none;
  font-weight: 900;
}

#matingView:not(.farm-directory-mode) .customer-detail-section .customer-subtitle {
  margin: 2px 0 -2px;
  color: var(--farm-ink);
  font-size: 18px;
  font-weight: 900;
}

#matingView:not(.farm-directory-mode) .customer-detail-section .group-row-card {
  border-color: #dfe8e1;
  border-radius: 20px;
  box-shadow: 0 10px 26px rgba(18, 64, 45, 0.07);
}

#matingView.farm-directory-mode .farm-management-hero-copy {
  position: relative;
  z-index: 1;
  min-width: 0;
  width: 100%;
}

#matingView.farm-directory-mode .customer-management-panel > .panel-head .eyebrow {
  display: none;
}

#matingView.farm-directory-mode .customer-management-panel > .panel-head h2 {
  margin: 0;
  color: #fff;
  padding-right: 160px;
  font-size: clamp(32px, 5vw, 42px);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: -0.045em;
}

#matingView.farm-directory-mode .farm-management-intro {
  display: flex;
  gap: 12px;
  margin: 20px 0 0;
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

#matingView.farm-directory-mode .farm-management-intro span {
  position: relative;
  white-space: nowrap;
}

#matingView.farm-directory-mode .farm-management-intro span + span {
  padding-left: 13px;
}

#matingView.farm-directory-mode .farm-management-intro span + span::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.62);
  content: "";
  transform: translateY(-50%);
}

#matingView.farm-directory-mode .farm-management-intro strong {
  color: #fff;
  font-size: inherit;
}

#matingView .farm-create-trigger {
  position: absolute;
  z-index: 2;
  top: 26px;
  right: 28px;
  display: inline-flex;
  min-width: 136px;
  min-height: 50px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 16px;
  align-items: center;
  justify-content: center;
  color: var(--farm-forest);
  background: #fff;
  box-shadow: 0 10px 26px rgba(0, 48, 34, 0.2);
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 900;
  transition: background-color 160ms ease, box-shadow 160ms ease;
}

#matingView .farm-create-trigger:hover {
  background: #f2f8f4;
  box-shadow: 0 13px 30px rgba(0, 48, 34, 0.26);
}

#matingView .farm-create-trigger:focus-visible,
#matingView .farm-card-open:focus-visible,
#matingView .farm-card-secondary-actions button:focus-visible,
#matingView .farm-create-close:focus-visible,
#matingView .farm-create-dialog input:focus-visible,
#matingView .farm-create-dialog .primary-button:focus-visible {
  outline: 3px solid rgba(231, 201, 120, 0.76);
  outline-offset: 3px;
}

#matingView.farm-directory-mode .customer-section {
  display: grid;
  gap: 22px;
  padding: 30px 28px 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#matingView.farm-directory-mode .customer-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#matingView.farm-directory-mode .customer-section-head strong {
  display: block;
  color: var(--farm-ink);
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -0.03em;
}

#matingView.farm-directory-mode .customer-section-head strong::before {
  display: none;
}

#matingView.farm-directory-mode .customer-section-head > span {
  padding: 0;
  color: var(--farm-green);
  background: transparent;
  font-size: 14px;
  font-weight: 800;
}

#matingView.farm-directory-mode .farm-manage-toggle {
  min-width: 58px;
  min-height: 44px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  color: var(--farm-green);
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
}

#matingView.farm-directory-mode .farm-manage-toggle:focus-visible {
  outline: 3px solid rgba(23, 104, 77, 0.22);
  outline-offset: 2px;
}

#matingView.farm-directory-mode .customer-section > .customer-row-card,
#matingView.farm-directory-mode .customer-section > .compact-empty {
  min-width: 0;
}

#matingView.farm-directory-mode .customer-section:has(.customer-row-card) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#matingView.farm-directory-mode .customer-section-head {
  grid-column: 1 / -1;
}

#matingView.farm-directory-mode .customer-row-card {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 250px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 22px;
  flex-direction: column;
  background: var(--farm-sage);
  box-shadow: none;
  transition: box-shadow 180ms ease, transform 180ms ease;
}

#matingView.farm-directory-mode .customer-row-card.farm-visual-sand {
  background: var(--farm-sand);
}

#matingView.farm-directory-mode .customer-row-card:hover {
  box-shadow: 0 16px 34px rgba(29, 73, 53, 0.12);
  transform: translateY(-2px);
}

#matingView.farm-directory-mode .farm-card-open {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 250px;
  padding: 0 14px 10px;
  border: 0;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  color: var(--farm-ink);
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: center;
}

#matingView.farm-directory-mode .farm-card-illustration {
  display: block;
  width: calc(100% + 28px);
  height: 178px;
  margin: 0 -14px 2px;
  object-fit: cover;
  object-position: center;
  mix-blend-mode: multiply;
}

#matingView.farm-directory-mode .farm-card-open > strong {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: var(--farm-ink);
  font-size: 21px;
  font-weight: 900;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#matingView.farm-directory-mode .customer-row-stats {
  display: flex;
  margin: 14px 0 0;
  align-items: center;
  justify-content: center;
  color: #34453e;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
}

#matingView.farm-directory-mode .customer-row-stats span {
  display: inline-flex;
  min-height: 24px;
  padding: 0 10px;
  border: 0;
  align-items: center;
  gap: 3px;
  color: inherit;
  background: transparent;
  white-space: nowrap;
}

#matingView.farm-directory-mode .customer-row-stats b {
  color: var(--farm-green);
  font-size: 17px;
  font-weight: 900;
}

#matingView.farm-directory-mode .customer-row-stats i {
  width: 1px;
  height: 18px;
  background: rgba(52, 69, 62, 0.2);
}

#matingView.farm-directory-mode .farm-card-secondary-actions {
  display: none;
  min-height: 38px;
  padding: 0 12px;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

#matingView.farm-directory-mode .farm-manage-mode .customer-row-card {
  min-height: 294px;
  padding-bottom: 10px;
}

#matingView.farm-directory-mode .farm-manage-mode .farm-card-secondary-actions {
  display: flex;
}

#matingView.farm-directory-mode .farm-card-secondary-actions:empty {
  display: none;
}

#matingView.farm-directory-mode .farm-card-secondary-actions button {
  min-width: 56px;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 11px;
  font-size: 12px;
  font-weight: 800;
}

#matingView .farm-create-dialog {
  position: fixed;
  z-index: 70;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 24px;
  border: 0;
  place-items: center;
  background: transparent;
}

#matingView .farm-create-dialog:popover-open {
  display: grid;
}

#matingView .farm-create-dialog::backdrop {
  background: rgba(7, 34, 25, 0.58);
}

#matingView .customer-management-panel #matingCustomerForm {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(440px, 100%);
  gap: 16px;
  margin: 0;
  padding: 26px;
  border: 0;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 64px rgba(6, 42, 30, 0.26);
}

#matingView .farm-create-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

#matingView .farm-create-kicker {
  color: var(--farm-ink);
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -0.02em;
}

#matingView .farm-create-close {
  min-width: 52px;
  min-height: 44px;
  padding: 0 10px;
  border: 0;
  border-radius: 12px;
  color: var(--farm-muted);
  background: #f1f4f1;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
}

#matingView .farm-create-description,
#matingView .farm-name-hint {
  margin: 0;
  color: var(--farm-muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.6;
}

#matingView .customer-management-panel #matingCustomerForm label {
  display: grid;
  gap: 8px;
  color: var(--farm-ink);
  font-size: 14px;
  font-weight: 900;
}

#matingView .customer-management-panel #matingCustomerForm input {
  width: 100%;
  min-height: 52px;
  padding: 0 15px;
  border: 1px solid #bdcfc4;
  border-radius: 14px;
  color: var(--farm-ink);
  background: #fbfdfb;
  box-shadow: none;
  font: inherit;
  font-size: 16px;
}

#matingView .customer-management-panel #matingCustomerForm input::placeholder {
  color: #87948d;
}

#matingView .customer-management-panel #matingCustomerForm .primary-button {
  width: 100%;
  min-height: 52px;
  border-radius: 14px;
  background: var(--farm-forest);
  box-shadow: none;
  font-size: 16px;
  font-weight: 900;
}

#matingView .farm-delete-dialog {
  width: min(420px, calc(100% - 32px));
  max-width: none;
  margin: auto;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 26px;
  color: var(--farm-ink);
  background: transparent;
}

#matingView .farm-delete-dialog::backdrop {
  background: rgba(7, 34, 25, 0.58);
  backdrop-filter: blur(3px);
}

#matingView .farm-delete-dialog-card {
  display: grid;
  gap: 18px;
  padding: 26px;
  border: 1px solid rgba(214, 224, 217, 0.92);
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(6, 42, 30, 0.3);
}

#matingView .farm-delete-dialog-icon {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border-radius: 50%;
  color: #b26812;
  background: #fff1d9;
  font-size: 25px;
  font-weight: 900;
}

#matingView .farm-delete-dialog.danger .farm-delete-dialog-icon {
  color: #c83030;
  background: #fdeaea;
}

#matingView .farm-delete-dialog-copy h3 {
  margin: 0;
  font-size: 23px;
  font-weight: 900;
  letter-spacing: -0.02em;
}

#matingView .farm-delete-dialog-copy p {
  margin: 9px 0 0;
  color: var(--farm-muted);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.65;
}

#matingView .farm-delete-dialog-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

#matingView .farm-delete-dialog-actions button {
  min-height: 50px;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 900;
}

#matingView .farm-delete-dialog-actions button:only-child {
  grid-column: 1 / -1;
}

#matingView .farm-delete-cancel.hidden + .farm-delete-confirm {
  grid-column: 1 / -1;
}

#matingView .farm-delete-cancel {
  color: var(--farm-muted);
  background: #f1f4f1;
}

#matingView .farm-delete-confirm {
  color: #fff;
  background: var(--farm-forest);
}

#matingView .farm-delete-confirm.danger {
  background: #c93636;
}

#matingView .farm-delete-dialog-actions button:focus-visible {
  outline: 3px solid rgba(7, 87, 63, 0.28);
  outline-offset: 2px;
}

body.customer-session #matingView .farm-create-trigger,
body.customer-session #matingView .farm-management-intro {
  display: none !important;
}

/* 底部导航始终沿用系统全局结构，本页不再覆盖。 */

@media (max-width: 720px) {
  #matingView:not(.farm-directory-mode) .customer-detail-section {
    width: calc(100% - 20px);
    margin-top: 10px;
    padding: 16px;
    border-radius: 24px;
  }

  #matingView:not(.farm-directory-mode) .customer-detail-section > .customer-section-head {
    padding: 16px;
    border-radius: 18px;
  }

  #matingView:not(.farm-directory-mode) .customer-detail-section > .customer-section-head strong {
    font-size: 25px;
  }

  #matingView.farm-directory-mode .customer-management-panel > .panel-head {
    min-height: 166px;
    padding: 26px 18px 22px;
    border-radius: 26px;
  }

  #matingView.farm-directory-mode .customer-management-panel > .panel-head h2 {
    padding-right: 142px;
    font-size: 33px;
  }

  #matingView .farm-create-trigger {
    top: 22px;
    right: 18px;
    min-width: 124px;
    min-height: 48px;
  }

  #matingView .farm-create-trigger {
    top: 22px;
    right: 18px;
    min-width: 124px;
    min-height: 48px;
    padding: 0 14px;
    font-size: 14px;
  }

  #matingView.farm-directory-mode .customer-section {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 12px;
    padding: 26px 14px 20px;
  }

  #matingView.farm-directory-mode .customer-section:has(.customer-row-card) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #matingView.farm-directory-mode .customer-section-head strong {
    font-size: 25px;
  }

  #matingView.farm-directory-mode .customer-row-card {
    min-height: 240px;
    border-radius: 18px;
  }

  #matingView.farm-directory-mode .farm-card-open {
    min-height: 240px;
    padding-right: 10px;
    padding-left: 10px;
  }

  #matingView.farm-directory-mode .farm-card-illustration {
    width: calc(100% + 20px);
    height: 156px;
    margin-right: -10px;
    margin-left: -10px;
  }

  #matingView.farm-directory-mode .farm-card-open > strong {
    font-size: 19px;
  }

  #matingView.farm-directory-mode .customer-row-stats {
    margin-top: 12px;
    font-size: 12px;
  }

  #matingView.farm-directory-mode .customer-row-stats span {
    padding: 0 7px;
  }

  #matingView.farm-directory-mode .customer-row-stats b {
    font-size: 16px;
  }
}

@media (max-width: 390px) {
  #matingView:not(.farm-directory-mode) .customer-detail-section {
    width: calc(100% - 16px);
    padding: 14px;
  }

  #matingView.farm-directory-mode .customer-management-panel > .panel-head {
    min-height: 158px;
    padding: 24px 14px 20px;
    border-radius: 24px;
  }

  #matingView.farm-directory-mode .customer-management-panel > .panel-head h2 {
    padding-right: 124px;
    font-size: 30px;
  }

  #matingView.farm-directory-mode .farm-management-intro {
    gap: 6px;
    margin-top: 16px;
    font-size: 12px;
  }

  #matingView.farm-directory-mode .farm-management-intro span + span {
    padding-left: 8px;
  }

  #matingView .farm-create-trigger {
    top: 20px;
    right: 14px;
    min-width: 112px;
    min-height: 44px;
    padding: 0 10px;
    border-radius: 14px;
    font-size: 13px;
  }

  #matingView.farm-directory-mode .customer-section {
    padding-right: 12px;
    padding-left: 12px;
  }

  #matingView.farm-directory-mode .customer-row-card {
    min-height: 228px;
  }

  #matingView.farm-directory-mode .farm-card-open {
    min-height: 228px;
  }

  #matingView.farm-directory-mode .farm-card-illustration {
    height: 142px;
  }

  #matingView.farm-directory-mode .farm-card-open > strong {
    font-size: 18px;
  }

  #matingView.farm-directory-mode .farm-card-secondary-actions button {
    min-width: 52px;
    padding: 0 9px;
  }

  #matingView .farm-create-dialog {
    padding: 14px;
    align-items: end;
  }

  #matingView .customer-management-panel #matingCustomerForm {
    width: 100%;
    padding: 22px 18px calc(20px + env(safe-area-inset-bottom));
    border-radius: 24px 24px 18px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #matingView .customer-row-card,
  #matingView .farm-create-trigger {
    transition: none;
  }
}

/* v178: 3号“田园分区地图”——仅重做单个龟场详情，底部导航保持系统原样。 */
body:has(#matingView:not(.farm-directory-mode).active) {
  background: #fbfaf5;
}

body:has(#matingView:not(.farm-directory-mode).active) #appMain {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 78px;
}

#matingView:not(.farm-directory-mode) {
  padding: 0 0 92px;
  background: #fbfaf5;
}

#matingView:not(.farm-directory-mode) .customer-management-panel {
  width: min(760px, 100%);
}

#matingView:not(.farm-directory-mode) .customer-detail-section.farm-map-detail {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0 0 28px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #fbfaf5;
  box-shadow: none;
}

#matingView .farm-detail-map-hero {
  position: relative;
  height: clamp(250px, 72vw, 360px);
  overflow: hidden;
  background: #f7f4e9;
}

#matingView .farm-detail-map-hero > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
}

#matingView .farm-detail-map-copy {
  position: absolute;
  z-index: 1;
  top: 24px;
  left: 20px;
  display: grid;
  gap: 8px;
  max-width: calc(100% - 118px);
}

#matingView .farm-detail-map-copy strong {
  color: #153c2e;
  font-size: clamp(34px, 10vw, 52px);
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.05em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85);
}

#matingView .farm-detail-map-copy span {
  width: max-content;
  max-width: 100%;
  padding: 7px 11px;
  border-radius: 999px;
  color: #315b49;
  background: rgba(232, 239, 230, 0.9);
  backdrop-filter: blur(6px);
  font-size: 13px;
  font-weight: 900;
}

#matingView .farm-detail-manage-toggle {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: 16px;
  min-width: 62px;
  min-height: 38px;
  border: 1px solid rgba(53, 92, 72, 0.24);
  border-radius: 999px;
  color: #315b49;
  background: rgba(255, 253, 247, 0.88);
  backdrop-filter: blur(7px);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
}

#matingView .farm-zone-actions {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: -30px 14px 20px;
}

#matingView .farm-zone-action {
  display: flex;
  min-width: 0;
  min-height: 76px;
  padding: 12px 12px 12px 15px;
  border: 1px solid #d8e3d9;
  border-radius: 22px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: rgba(240, 245, 238, 0.97);
  box-shadow: 0 8px 22px rgba(28, 69, 49, 0.08);
}

#matingView .farm-zone-action-pool {
  border-color: #eadcc6;
  background: rgba(248, 239, 224, 0.97);
}

#matingView .farm-zone-action > span {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 8px;
  color: #315b49;
}

#matingView .farm-zone-action-pool > span {
  color: #8a653a;
}

#matingView .farm-zone-action b {
  font-size: 17px;
  white-space: nowrap;
}

#matingView .farm-zone-action strong {
  font-size: 17px;
}

#matingView .farm-zone-action button {
  min-width: 54px;
  min-height: 42px;
  padding: 0 10px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: #315f4b;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
}

#matingView .farm-zone-action-pool button {
  background: #9a7548;
}

#matingView .farm-ledger-section {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  width: calc(100% - 24px);
  margin: 0 auto;
}

#matingView .farm-ledger-section + .farm-ledger-section {
  margin-top: 0;
}

#matingView .farm-ledger-rail {
  display: flex;
  min-height: 100%;
  align-items: center;
  justify-content: center;
  color: #3f6d59;
  background: #e7efe7;
}

#matingView .farm-ledger-groups .farm-ledger-rail {
  border-radius: 20px 0 0 0;
}

#matingView .farm-ledger-pools .farm-ledger-rail {
  border-radius: 0 0 0 20px;
  color: #946d3e;
  background: #f3e6d1;
}

#matingView .farm-ledger-rail span {
  font-size: 17px;
  font-weight: 950;
  letter-spacing: 0.08em;
  writing-mode: vertical-rl;
}

#matingView .farm-ledger-rows {
  min-width: 0;
  background: rgba(255, 255, 252, 0.68);
}

#matingView .farm-ledger-row {
  position: relative;
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) 22px;
  min-height: 132px;
  padding: 16px 10px 16px 14px;
  align-items: center;
  gap: 14px;
  border: 0;
  border-bottom: 1px solid #dde3dc;
  color: #18231f;
  background: transparent;
  cursor: pointer;
}

#matingView .farm-ledger-row:last-child {
  border-bottom: 0;
}

#matingView .farm-ledger-thumb {
  display: block;
  width: 104px;
  height: 104px;
  object-fit: cover;
  border-radius: 18px;
  background: #edf3ed;
}

#matingView .farm-ledger-pool-row .farm-ledger-thumb {
  background: #f5ead8;
}

#matingView .farm-ledger-copy {
  min-width: 0;
}

#matingView .farm-ledger-copy > strong {
  display: block;
  overflow: hidden;
  color: #17211e;
  font-size: 20px;
  font-weight: 950;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#matingView .farm-ledger-copy p {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 7px;
  margin: 10px 0 0;
  color: #5b6c63;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.5;
}

#matingView .farm-ledger-copy p span,
#matingView .farm-ledger-copy p i {
  white-space: nowrap;
}

#matingView .farm-ledger-copy p b {
  color: #2e644d;
  font-size: 14px;
  font-weight: 950;
}

#matingView .farm-ledger-copy p i {
  color: #aab3ad;
  font-style: normal;
}

#matingView .farm-ledger-caret {
  width: 18px;
  height: 18px;
  object-fit: contain;
  opacity: 0.72;
}

#matingView .farm-ledger-delete {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: none;
  min-height: 34px;
  padding: 0 11px;
  border: 0;
  border-radius: 11px;
  color: #c93636;
  background: #fdeaea;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 900;
}

#matingView .farm-ledger-manage-actions {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: none;
  align-items: center;
  gap: 8px;
}

#matingView .farm-ledger-manage-actions .farm-ledger-edit,
#matingView .farm-ledger-manage-actions .farm-ledger-delete {
  position: static;
  display: inline-flex;
  min-height: 44px;
  padding: 0 14px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 13px;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
}

#matingView .farm-ledger-manage-actions .farm-ledger-edit {
  color: #175f47;
  background: #e9f3ec;
}

#matingView .farm-ledger-manage-actions .farm-ledger-delete {
  color: #c93636;
  background: #fdeaea;
}

#matingView .farm-detail-manage-mode .farm-ledger-caret {
  visibility: hidden;
}

#matingView .farm-detail-manage-mode .farm-ledger-delete {
  display: inline-flex;
  align-items: center;
}

#matingView .farm-detail-manage-mode .farm-ledger-manage-actions {
  display: flex;
}

#matingView .farm-detail-manage-mode .farm-ledger-group-row {
  padding-bottom: 66px;
}

#matingView .farm-ledger-manage-actions button:focus-visible {
  outline: 3px solid rgba(49, 95, 75, 0.3);
  outline-offset: 2px;
}

.mating-group-edit-dialog {
  width: min(520px, calc(100% - 28px));
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 1px solid #d1ddcf;
  border-radius: 26px;
  color: #17352a;
  background: #fffefa;
  box-shadow: 0 24px 70px rgba(18, 56, 39, 0.28);
}

.mating-group-edit-dialog::backdrop {
  background: rgba(16, 37, 28, 0.5);
  backdrop-filter: blur(5px);
}

.mating-group-edit-form {
  display: grid;
  gap: 16px;
  padding: 24px;
}

.mating-group-edit-form > header {
  position: relative;
  padding-right: 72px;
}

.mating-group-edit-form > header p {
  margin: 0 0 4px;
  color: #5f766b;
  font-size: 13px;
  font-weight: 800;
}

.mating-group-edit-form > header h3 {
  margin: 0;
  color: #0b4d38;
  font-size: 27px;
  font-weight: 950;
}

.mating-group-edit-form > header button {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 60px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #d3ddd3;
  border-radius: 12px;
  color: #51655b;
  background: #f5f7f2;
  font-size: 13px;
  font-weight: 850;
}

.mating-group-edit-form label {
  display: grid;
  gap: 8px;
}

.mating-group-edit-form label > span {
  color: #27483b;
  font-size: 15px;
  font-weight: 900;
}

.mating-group-edit-form input {
  width: 100%;
  min-height: 58px;
  padding: 0 15px;
  border: 1.5px solid #cad8cc;
  border-radius: 15px;
  color: #17352a;
  background: #fff;
  font-size: 18px;
  font-weight: 850;
  outline: none;
}

.mating-group-edit-form input:focus {
  border-color: #24724d;
  box-shadow: 0 0 0 4px rgba(36, 114, 77, 0.12);
}

.mating-group-edit-form input[aria-invalid="true"] {
  border-color: #c93636;
  box-shadow: 0 0 0 4px rgba(201, 54, 54, 0.1);
}

.mating-group-edit-hint,
.mating-group-edit-error {
  margin: -4px 0 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}

.mating-group-edit-hint {
  color: #66766e;
}

.mating-group-edit-error {
  padding: 10px 12px;
  border: 1px solid #f0c5c5;
  border-radius: 12px;
  color: #a52f2f;
  background: #fff2f2;
}

.mating-group-edit-error[hidden] {
  display: none !important;
}

.mating-group-edit-actions {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 10px;
}

.mating-group-edit-actions button {
  min-height: 52px;
  border: 1px solid #d3ddd3;
  border-radius: 14px;
  color: #53675d;
  background: #f6f7f4;
  font-size: 15px;
  font-weight: 900;
}

.mating-group-edit-actions .primary-button {
  border: 0;
  color: #fff;
  background: #156344;
  box-shadow: 0 10px 22px rgba(21, 99, 68, 0.2);
}

body:has(.mating-group-edit-dialog[open]) {
  overflow: hidden;
}

@media (max-width: 560px) {
  .mating-group-edit-form {
    padding: 20px 16px 16px;
  }

  .mating-group-edit-form > header h3 {
    font-size: 24px;
  }
}

#matingView .farm-ledger-row:focus-visible,
#matingView .farm-zone-action button:focus-visible,
#matingView .farm-detail-manage-toggle:focus-visible {
  outline: 3px solid rgba(49, 95, 75, 0.32);
  outline-offset: -3px;
}

@media (max-width: 480px) {
  #matingView .farm-detail-map-hero {
    height: 278px;
  }

  #matingView .farm-detail-map-hero > img {
    object-position: center 48%;
  }

  #matingView .farm-detail-map-copy {
    top: 22px;
    left: 18px;
  }

  #matingView .farm-detail-map-copy strong {
    font-size: 38px;
  }

  #matingView .farm-zone-actions {
    margin-right: 10px;
    margin-left: 10px;
  }

  #matingView .farm-zone-action {
    min-height: 72px;
    padding-left: 12px;
    border-radius: 19px;
  }

  #matingView .farm-zone-action b,
  #matingView .farm-zone-action strong {
    font-size: 15px;
  }

  #matingView .farm-zone-action button {
    min-width: 48px;
    padding: 0 8px;
  }

  #matingView .farm-ledger-section {
    grid-template-columns: 52px minmax(0, 1fr);
    width: calc(100% - 16px);
  }

  #matingView .farm-ledger-rail span {
    font-size: 15px;
  }

  #matingView .farm-ledger-row {
    grid-template-columns: 92px minmax(0, 1fr) 18px;
    min-height: 124px;
    padding: 14px 8px 14px 12px;
    gap: 11px;
  }

  #matingView .farm-ledger-thumb {
    width: 92px;
    height: 92px;
    border-radius: 16px;
  }

  #matingView .farm-ledger-copy > strong {
    font-size: 18px;
  }

  #matingView .farm-ledger-copy p {
    gap: 2px 5px;
    margin-top: 7px;
    font-size: 10px;
  }

  #matingView .farm-ledger-copy p b {
    font-size: 12px;
  }
}

/* 图 2：种群与龟池统一使用种龟、龟蛋、龟苗三栏概览。 */
#matingView .farm-ledger-row {
  grid-template-columns: 128px minmax(0, 1fr) 22px;
  min-height: 178px;
  padding: 18px 12px 18px 16px;
  gap: 18px;
  border: 1px solid #e0e5df;
  border-radius: 20px;
  background: rgba(255, 255, 252, 0.9);
}

#matingView .farm-ledger-rows {
  display: grid;
  gap: 10px;
  padding-left: 8px;
  background: transparent;
}

#matingView .farm-ledger-thumb {
  width: 128px;
  height: 128px;
  border-radius: 20px;
}

#matingView .farm-ledger-copy > strong {
  font-size: 23px;
}

#matingView .farm-ledger-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 17px;
}

#matingView .farm-ledger-metric-group {
  display: grid;
  min-width: 0;
  padding: 0 16px;
  border-left: 1px solid #d8dfd9;
  align-content: start;
  gap: 5px;
}

#matingView .farm-ledger-metric-group:first-child {
  padding-left: 0;
  border-left: 0;
}

#matingView .farm-ledger-metric-group:last-child {
  padding-right: 0;
}

#matingView .farm-ledger-metric-group > span {
  margin-bottom: 2px;
  color: #607068;
  font-size: 12px;
  font-weight: 850;
}

#matingView .farm-ledger-metric-group p {
  display: flex;
  margin: 0;
  align-items: baseline;
  flex-wrap: nowrap;
  gap: 6px;
  color: #53645c;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  white-space: nowrap;
}

#matingView .farm-ledger-metric-group p b {
  color: #2e644d;
  font-size: 18px;
  font-weight: 950;
  line-height: 1.1;
}

@media (max-width: 600px) {
  #matingView .farm-ledger-row {
    grid-template-columns: 64px minmax(0, 1fr) 14px;
    min-height: 146px;
    padding: 14px 8px 14px 10px;
    gap: 8px;
  }

  #matingView .farm-ledger-thumb {
    width: 64px;
    height: 92px;
    border-radius: 15px;
  }

  #matingView .farm-ledger-copy > strong {
    font-size: 17px;
  }

  #matingView .farm-ledger-metrics {
    margin-top: 12px;
  }

  #matingView .farm-ledger-metric-group {
    padding: 0 5px;
    gap: 4px;
  }

  #matingView .farm-ledger-metric-group > span {
    font-size: 11px;
  }

  #matingView .farm-ledger-metric-group p {
    gap: 2px;
    font-size: 9px;
  }

  #matingView .farm-ledger-metric-group p b {
    font-size: 14px;
  }
}