.facility-ui {
  --facility-ink: #344b40;
  --facility-muted: #829083;
  --facility-line: #e6e9dd;
  --facility-green: #39725a;
  width: min(480px, calc(100vw - 28px));
  max-width: 480px;
  max-height: min(720px, calc(100dvh - 32px));
  overflow: auto;
  padding: 0;
  border: 1px solid #e1e6d8;
  border-radius: 24px;
  background: #fffdf7;
  box-shadow: 0 26px 90px rgba(33, 61, 48, .24);
  color: var(--facility-ink);
  font-family: inherit;
  scrollbar-color: #d6dfd1 transparent;
  scrollbar-width: thin;
}

.facility-ui::backdrop {
  background: rgba(35, 58, 49, .39);
  backdrop-filter: blur(3px);
}

.facility-ui[open] { animation: facility-ui-enter .18s ease-out; }

.facility-ui__shell {
  position: relative;
  padding: 23px 24px 22px;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(236, 237, 216, .72), transparent 36%),
    linear-gradient(160deg, #fffdf7, #fbfaf1 88%);
}

.facility-ui__header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.facility-ui__icon {
  display: grid;
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #d9e5d5;
  border-radius: 15px;
  background: #edf4e8;
  color: #578467;
}

.facility-ui__icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.facility-ui__title-wrap { min-width: 0; flex: 1; }
.facility-ui__eyebrow { margin: 0 0 3px; color: #98a18c; font-size: 9px; font-weight: 800; letter-spacing: .13em; }
.facility-ui__header h2 { margin: 0; color: #385446; font-size: 21px; font-weight: 800; letter-spacing: .025em; }

.facility-ui__close {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #e4e8dc;
  border-radius: 50%;
  background: rgba(255, 255, 255, .7);
  color: #778478;
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
}

.facility-ui__close:hover { background: #edf3e9; color: #426b55; }
.facility-ui__description { margin: 13px 0 18px; color: var(--facility-muted); font-size: 11px; line-height: 1.65; }
.facility-ui__content { min-height: 80px; }
.facility-ui__simulation-note { margin: 15px 0 0; color: #adb0a3; font-size: 8px; text-align: center; }

.facility-ui__pond-stats,
.facility-ui__inventory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.facility-ui__stat {
  display: flex;
  min-width: 0;
  min-height: 64px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 10px 9px;
  border: 1px solid #e8ebdf;
  border-radius: 12px;
  background: rgba(255, 255, 255, .72);
}

.facility-ui__stat small { color: #8b9586; font-size: 9px; }
.facility-ui__stat strong { overflow: hidden; color: #48634f; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }

.facility-ui__meter {
  height: 6px;
  overflow: hidden;
  margin: 12px 0 16px;
  border-radius: 10px;
  background: #e9ecdf;
}

.facility-ui__meter span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #d9ad59, #8ca76f); transition: width .3s ease; }

.facility-ui__pond-picker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
  color: #859082;
  font-size: 9px;
}

.facility-ui__pond-picker > div { display: flex; gap: 5px; }
.facility-ui__pond-picker button { padding: 6px 9px; border: 1px solid #e3e7db; border-radius: 18px; background: #fffef9; color: #829080; font: inherit; font-weight: 700; cursor: pointer; }
.facility-ui__pond-picker button.is-selected { border-color: #b9cfb6; background: #edf5e9; color: #4c7556; }
.facility-ui__pond-picker button:disabled { border-color: #ecebe4; background: #f5f3ed; color: #b2b4a8; cursor: not-allowed; }

.facility-ui__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.facility-ui__actions--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.facility-ui__action {
  display: flex;
  min-width: 0;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #e0e7d9;
  border-radius: 12px;
  background: #fffef9;
  box-shadow: 0 2px 0 #e8ebdf;
  color: #48634f;
  text-align: left;
  cursor: pointer;
  transition: transform .12s ease, background .12s ease, box-shadow .12s ease;
}

.facility-ui__action:hover:not(:disabled) { transform: translateY(-1px); background: #f4f7ed; box-shadow: 0 4px 0 #e3e8d9; }
.facility-ui__action:active:not(:disabled) { transform: translateY(1px); box-shadow: 0 1px 0 #e3e8d9; }
.facility-ui__action > span { min-width: 0; font-size: 11px; font-weight: 800; }
.facility-ui__action small { display: block; margin-top: 3px; color: #95a08d; font-size: 9px; font-weight: 500; }
.facility-ui__action > b { flex: 0 0 auto; color: #93a58d; font-size: 19px; font-weight: 400; }
.facility-ui__action--wide { grid-column: 1 / -1; }
.facility-ui__action--primary { border-color: #47775d; background: linear-gradient(180deg, #5b896a, #47775d); box-shadow: 0 3px 0 #345c47; color: #fffdf7; }
.facility-ui__action--primary small, .facility-ui__action--primary > b { color: #dbe9d7; }
.facility-ui__action--primary:hover:not(:disabled) { background: #548364; box-shadow: 0 4px 0 #345c47; }
.facility-ui__action:disabled { border-color: #e8e9df; background: #f4f3ec; box-shadow: 0 2px 0 #e8e9df; color: #a3a89b; cursor: not-allowed; opacity: .78; }
.facility-ui__action:disabled small, .facility-ui__action:disabled > b { color: #b0b3a7; }

.facility-ui__feature-card {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 86px;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid #e2e9dc;
  border-radius: 16px;
  background: linear-gradient(115deg, #f0f5e9, #fffdf7);
}

.facility-ui__feature-number { min-width: 59px; color: #50775a; font-size: 23px; font-weight: 800; text-align: center; }
.facility-ui__feature-card > span:last-child { color: #516453; font-size: 12px; font-weight: 800; }
.facility-ui__feature-card small { display: block; margin-top: 5px; color: #8b9786; font-size: 10px; font-weight: 500; }

.facility-ui__inventory-strip {
  display: flex;
  justify-content: space-around;
  gap: 12px;
  margin: 3px 0 15px;
  padding: 15px 10px;
  border: 1px dashed #d9dfd1;
  border-radius: 14px;
  background: #fbfaf4;
  color: #8b9687;
  font-size: 10px;
}

.facility-ui__inventory-strip span { display: grid; gap: 4px; text-align: center; }
.facility-ui__inventory-strip strong { color: #4d6a53; font-size: 15px; }
.facility-ui__fine-print { margin: 11px 0 0; color: #97a08f; font-size: 10px; line-height: 1.6; text-align: center; }

.facility-ui__link-button { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: 11px; padding: 8px 2px; border: 0; border-bottom: 1px solid #e8eadf; background: transparent; color: #608167; font-size: 10px; font-weight: 800; text-align: left; cursor: pointer; }
.facility-ui__link-button span { font-size: 18px; font-weight: 400; }
.facility-ui__link-button:hover { color: #3d694d; }

.facility-ui__section-kicker { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; color: #8e9a85; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.facility-ui__section-kicker small { color: #a5aa9c; font-size: 8px; font-weight: 500; letter-spacing: 0; }
.facility-ui__prep-card, .facility-ui__routine { margin-top: 13px; padding: 13px; border: 1px solid #e3e9dc; border-radius: 15px; background: rgba(255, 255, 255, .7); }
.facility-ui__prep-route { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; margin: 11px 0 14px; }
.facility-ui__prep-route span { display: grid; justify-items: center; gap: 5px; color: #a2a99b; font-size: 8px; text-align: center; }
.facility-ui__prep-route i { display: grid; width: 21px; height: 21px; place-items: center; border: 1px solid #e0e5d9; border-radius: 50%; background: #f6f5ef; color: #9da496; font-size: 9px; font-style: normal; }
.facility-ui__prep-route .is-current { color: #55785e; font-weight: 800; }
.facility-ui__prep-route .is-current i { border-color: #8ead87; background: #eaf2e5; color: #4f7956; }
.facility-ui__prep-route .is-done { color: #769276; }
.facility-ui__prep-route .is-done i { border-color: #cbdcc4; background: #edf5e9; color: #618564; }
.facility-ui__prep-copy { display: grid; gap: 4px; margin: 0 0 10px; }
.facility-ui__prep-copy b { color: #4d6550; font-size: 11px; }
.facility-ui__prep-copy small { color: #8c9687; font-size: 9px; line-height: 1.55; }
.facility-ui__routine-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 9px; color: #58715a; font-size: 10px; font-weight: 800; }
.facility-ui__routine-head small { color: #929b8b; font-size: 8px; font-weight: 500; }
.facility-ui__routine-actions, .facility-ui__pond-care { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.facility-ui__pond-care { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 8px; }
.facility-ui__routine .facility-ui__action { min-height: 50px; padding: 8px; }
.facility-ui__routine > .facility-ui__action--wide { width: 100%; margin-top: 8px; }
.facility-ui__process-step { margin: 0 0 12px; padding: 11px; border: 1px solid #e6e9df; border-radius: 13px; background: #fffefa; }
.facility-ui__process-step > div { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; }
.facility-ui__process-step > div > i { display: grid; width: 22px; height: 22px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #edf3e8; color: #618064; font-size: 10px; font-style: normal; font-weight: 800; }
.facility-ui__process-step b { display: block; color: #506650; font-size: 10px; }
.facility-ui__process-step small { display: block; margin-top: 2px; color: #959c8f; font-size: 8px; }
.facility-ui__process-step .facility-ui__action { min-height: 43px; }
.facility-ui__grade-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 0 0 12px; }
.facility-ui__grade-stat { display: grid; gap: 4px; padding: 10px 7px; border: 1px solid #e8e7dc; border-radius: 11px; background: #fdfbf4; text-align: center; }
.facility-ui__grade-stat small { color: #928d7a; font-size: 8px; }
.facility-ui__grade-stat b { color: #5b7056; font-size: 13px; }
.facility-ui__grade-stat span { color: #a1a394; font-size: 8px; }
.facility-ui__quality-note { margin: 9px 0; padding: 9px 11px; border: 1px solid #e5e8d9; border-radius: 10px; background: #f5f7ed; color: #74826b; font-size: 9px; line-height: 1.5; }
.facility-ui__order-choices { display: grid; gap: 7px; margin: 10px 0; }
.facility-ui__order-choice { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 10px 12px; border: 1px solid #e5e7dd; border-radius: 12px; background: #fffefa; color: #536b54; text-align: left; cursor: pointer; }
.facility-ui__order-choice.is-selected { border-color: #8dad83; background: #f0f6ea; box-shadow: inset 0 0 0 1px #dce9d4; }
.facility-ui__order-choice span { display: grid; gap: 3px; }
.facility-ui__order-choice b { font-size: 10px; }
.facility-ui__order-choice small { color: #90988c; font-size: 8px; }
.facility-ui__order-choice strong { flex: 0 0 auto; color: #78906c; font-size: 8px; }
.facility-ui__order-choice strong.is-waiting { color: #b68b52; }
.facility-ui__order-choice:hover { border-color: #b6c9aa; }
.facility-ui__last-shipment { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px; padding: 9px 0; border-top: 1px solid #e8e9df; color: #879283; font-size: 9px; }
.facility-ui__last-shipment b { color: #586d55; }
.facility-ui__species-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.facility-ui__species-option { position: relative; display: grid; min-height: 88px; align-content: center; gap: 5px; padding: 12px; border: 1px solid #e2e7dd; border-radius: 13px; background: #fffefa; color: #536b54; text-align: left; cursor: pointer; }
.facility-ui__species-option.is-selected { border-color: #a8c39f; background: #eff6ea; box-shadow: inset 0 0 0 1px #d8e7d1; }
.facility-ui__species-option:disabled { background: #f5f3ed; color: #a7aa9d; cursor: default; }
.facility-ui__species-option b { font-size: 12px; }
.facility-ui__species-option small { color: #929b8e; font-size: 8px; }
.facility-ui__species-mark { position: absolute; top: 8px; right: 9px; color: #6d956b; font-size: 12px; }
.facility-ui__journal-list { display: grid; gap: 8px; }
.facility-ui__journal-list article { display: flex; gap: 10px; padding: 12px; border: 1px solid #e8e6da; border-radius: 12px; background: #fffefa; }
.facility-ui__journal-mark { width: 7px; flex: 0 0 auto; border-radius: 5px; background: #c9ad79; }
.facility-ui__journal-list b { color: #536b54; font-size: 10px; }
.facility-ui__journal-list p { margin: 4px 0 0; color: #899386; font-size: 9px; line-height: 1.6; }
.facility-ui__work-journal-intro { margin: -4px 0 12px; color: #85907e; font-size: 10px; line-height: 1.6; }
.facility-ui__work-day { margin: 10px 0 14px; padding: 11px; border: 1px solid #e6e9dc; border-radius: 14px; background: #f8f8ef; }
.facility-ui__work-day .facility-ui__daily-title { margin: 0 0 8px; padding-bottom: 7px; border-bottom: 1px solid #e5e6d9; }
.facility-ui__work-day-empty { margin: 8px 2px; color: #a0a391; font-size: 9px; }
.facility-ui__journal-data { display: block; margin-top: 4px; color: #73816a; font-size: 9px; }
.facility-ui__work-note { display: grid; gap: 7px; margin-top: 10px; }
.facility-ui__work-note label { color: #65765f; font-size: 10px; font-weight: 700; }
.facility-ui__work-note textarea { box-sizing: border-box; width: 100%; min-height: 74px; resize: vertical; padding: 9px 10px; border: 1px solid #dfe3d5; border-radius: 10px; background: #fffef9; color: #536b54; font: inherit; font-size: 12px; line-height: 1.5; }
.facility-ui__work-note button { justify-self: end; min-height: 44px; padding: 7px 12px; border: 1px solid #bdd0af; border-radius: 10px; background: #edf4e5; color: #526a50; font: inherit; font-size: 10px; font-weight: 700; }
.facility-ui__ledger { padding: 12px; border: 1px solid #e7e8dc; border-radius: 14px; background: #fffefa; }
.facility-ui__ledger > div:not(.facility-ui__section-kicker) { display: flex; justify-content: space-between; gap: 10px; padding: 7px 2px; border-bottom: 1px solid #f0efe7; color: #899285; font-size: 9px; }
.facility-ui__ledger > div b { color: #65755e; font-size: 10px; }
.facility-ui__ledger > .is-total { margin-top: 3px; border-top: 1px solid #dfe5d8; border-bottom: 0; color: #526b52; font-weight: 800; }
.facility-ui__ledger > .is-total b { color: #3e694c; font-size: 13px; }
.facility-ui__ledger .facility-ui__trust-row { border-bottom: 0; color: #a28258; }
.facility-ui__batch-section { margin-top: 14px; }
.facility-ui__batch-section article { display: flex; justify-content: space-between; gap: 8px; margin: 6px 0; padding: 9px; border: 1px solid #e9e9df; border-radius: 10px; color: #687960; font-size: 9px; }
.facility-ui__batch-section article span { color: #92998a; text-align: right; }
.facility-ui__harvest-records { display: grid; gap: 8px; min-width: 0; margin: 9px 0 12px; }
.facility-ui__harvest-record-best { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 9px; border: 1px solid #dce5d3; border-radius: 11px; background: #f6f8ed; }
.facility-ui__harvest-record-best > div { display: grid; gap: 3px; min-width: 0; }
.facility-ui__harvest-record-best span { color: #71836a; font-size: 9px; font-weight: 700; }
.facility-ui__harvest-record-best b { color: #4e6b4c; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.facility-ui__harvest-record-list { display: grid; gap: 5px; min-width: 0; }
.facility-ui__harvest-records .facility-ui__harvest-record-list article { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; margin: 0; }
.facility-ui__harvest-records .facility-ui__harvest-record-list article b { color: #5d7559; overflow-wrap: anywhere; }
.facility-ui__harvest-records .facility-ui__harvest-record-list article span { color: #7c8878; text-align: left; line-height: 1.55; overflow-wrap: anywhere; }
.facility-ui__harvest-record-diagnostic, .facility-ui__harvest-record-diagnostics { color: #957d59; font-size: 8px; line-height: 1.5; overflow-wrap: anywhere; }
.facility-ui__harvest-record-diagnostics { display: grid; gap: 3px; margin: 0; padding-left: 18px; }
.facility-ui__shipment-result { margin-bottom: 12px; padding: 13px; border: 1px solid #e6dfca; border-radius: 14px; background: linear-gradient(145deg, #fcf6e8, #fffefa); }
.facility-ui__shipment-result h3 { margin: 0 0 5px; color: #52684e; font-size: 13px; }
.facility-ui__shipment-result p { margin: 0 0 8px; color: #8c927f; font-size: 9px; }
.facility-ui__shipment-result > div:not(.facility-ui__section-kicker) { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; border-bottom: 1px solid #eeeade; color: #8a907f; font-size: 9px; }
.facility-ui__shipment-result > div b { color: #65775c; }
.facility-ui__shipment-result > .is-total { color: #4c694c; font-weight: 800; }
.facility-ui__shipment-result > .is-total b { color: #3e694c; font-size: 12px; }
.facility-ui__shipment-result > small { display: block; margin-top: 7px; color: #a0a08d; font-size: 8px; line-height: 1.5; }
.facility-ui__receipt-audit { margin-top: 8px; padding-top: 7px; border-top: 1px solid #eeeade; }
.facility-ui__receipt-audit > summary { color: #526b51; cursor: pointer; font-size: 9px; font-weight: 800; }
.facility-ui__receipt-audit-content { display: grid; gap: 5px; padding-top: 8px; color: #788477; font-size: 9px; line-height: 1.6; }
.facility-ui__receipt-audit-content ul { display: grid; gap: 3px; margin: 0; padding-left: 16px; }
.facility-ui__receipt-audit-content > b { color: #526b51; }
.facility-ui__receipt-audit-content > div { display: flex; justify-content: space-between; gap: 8px; }
.facility-ui__receipt-audit-content small { font-size: 8px; }
.facility-ui__receipt-audit-content pre { max-height: 140px; overflow: auto; margin: 5px 0 0; padding: 7px; border-radius: 8px; background: #f0f2e8; font: 8px/1.5 ui-monospace,monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.facility-ui__shipment-confirmation { margin: 9px 0 12px; padding: 12px; border: 1px solid #dfe6d6; border-radius: 14px; background: #f8f8ef; }
.facility-ui__shipment-confirmation-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.facility-ui__shipment-confirmation-summary > div { display: grid; gap: 3px; padding: 8px; border-radius: 10px; background: #fffdf7; }
.facility-ui__shipment-confirmation-summary span,.facility-ui__shipment-confirmation-details { color: #778675; font-size: 10px; }
.facility-ui__shipment-confirmation-summary b { color: #425e4d; font-size: 12px; }
.facility-ui__shipment-confirmation-summary .is-total { background: #eaf1df; }
.facility-ui__shipment-confirmation-summary .is-total b { color: #315e43; font-size: 14px; }
.facility-ui__shipment-confirmation > p { margin: 8px 0 0; color: #84907c; font-size: 9px; }
.facility-ui__shipment-confirmation details { margin-top: 9px; padding-top: 8px; border-top: 1px solid #e6e9dd; }
.facility-ui__shipment-confirmation summary { color: #4c6d52; cursor: pointer; font-size: 10px; font-weight: 800; }
.facility-ui__shipment-confirmation-details { display: grid; gap: 5px; padding-top: 8px; line-height: 1.6; }
.facility-ui__shipment-confirmation-details ul { display: grid; gap: 3px; margin: 0; padding-left: 16px; }
.facility-ui__shipment-confirmation-details b { color: #506d53; }
.facility-ui__shipment-confirmation-details small { font-size: 9px; }
.facility-ui__shipment-confirmation-details pre { max-height: 120px; overflow: auto; margin: 0; padding: 7px; border-radius: 8px; background: #f0f2e8; font: 8px/1.5 ui-monospace,monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.facility-ui__source-link { display: block; margin-top: 14px; color: #65836a; font-size: 9px; text-align: center; text-decoration: none; }
.facility-ui__source-link:hover { color: #3d694d; text-decoration: underline; }

.facility-ui__order-card {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
  padding: 15px 17px;
  border: 1px solid #e7dfc9;
  border-radius: 15px;
  background: linear-gradient(135deg, #fbf5e5, #fffdf7);
}

.facility-ui__order-card small { color: #9b8669; font-size: 10px; }
.facility-ui__order-card strong { color: #4a624f; font-size: 17px; }
.facility-ui__order-card span { color: #bd7959; font-size: 11px; font-weight: 700; }

.facility-ui__unlock-card {
  padding: 18px;
  border: 1px solid #e7e4d6;
  border-radius: 17px;
  background: linear-gradient(145deg, #f8f6eb, #fffdf7);
  text-align: center;
}

.facility-ui__lock-mark {
  display: grid;
  width: 42px;
  height: 42px;
  margin: 0 auto 10px;
  place-items: center;
  border: 1px solid #e0d5bc;
  border-radius: 13px;
  background: #f4ebd7;
  color: #a07d50;
  font-size: 20px;
  font-weight: 800;
}

.facility-ui__unlock-card h3 { margin: 0 0 6px; color: #4c6250; font-size: 15px; }
.facility-ui__unlock-card p { margin: 0 auto 12px; max-width: 300px; color: #8a9485; font-size: 10px; line-height: 1.65; }
.facility-ui__unlock-requirements { display: flex; justify-content: center; gap: 8px; margin-bottom: 13px; }
.facility-ui__unlock-requirements span { padding: 5px 8px; border: 1px solid #e8dfc9; border-radius: 20px; background: #fffaf0; color: #a28c69; font-size: 9px; }
.facility-ui__unlock-requirements .is-met { border-color: #d7e5d3; background: #eff6ec; color: #618164; }
.facility-ui__unlock-card .facility-ui__action { width: 100%; justify-content: center; min-height: 43px; text-align: center; }

.facility-ui__task-list { display: grid; gap: 8px; }
.facility-ui__task { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 10px; border: 1px solid #e9e9df; border-radius: 12px; background: #fffefa; }
.facility-ui__task.is-done { border-color: #dae7d5; background: #f7faf2; }
.facility-ui__task-check { display: grid; width: 21px; height: 21px; flex: 0 0 auto; place-items: center; border: 1px solid #d8ded0; border-radius: 50%; color: #5d8b67; font-size: 13px; }
.facility-ui__task.is-done .facility-ui__task-check { border-color: #b8d1b2; background: #e8f2e4; }
.facility-ui__task-copy { min-width: 0; flex: 1; }
.facility-ui__task-copy b { display: block; overflow: hidden; color: #526653; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.facility-ui__task-copy small { display: block; margin-top: 3px; color: #969f8e; font-size: 9px; }
.facility-ui__task-reward { flex: 0 0 auto; color: #b9815c; font-size: 10px; font-weight: 800; }
.facility-ui__task-claim { flex: 0 0 auto; padding: 6px 9px; border: 1px solid #d3dfcf; border-radius: 8px; background: #f0f6ec; color: #55765b; font-size: 9px; font-weight: 800; cursor: pointer; }
.facility-ui__task-claim:disabled { border-color: #e9e9e0; background: #f4f3ee; color: #a7ab9f; cursor: default; }
.facility-ui__empty { display: grid; min-height: 104px; place-content: center; gap: 6px; border: 1px dashed #dfe5d8; border-radius: 14px; color: #60775d; font-size: 12px; font-weight: 700; text-align: center; }
.facility-ui__empty small { color: #99a191; font-size: 10px; font-weight: 400; }

.facility-ui__recovery {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
  padding: 11px 12px;
  border: 1px solid #ead8c4;
  border-radius: 12px;
  background: #fff5e9;
}

.facility-ui__recovery[hidden] { display: none; }
.facility-ui__recovery span { min-width: 0; }
.facility-ui__recovery b { display: block; color: #a9694e; font-size: 10px; }
.facility-ui__recovery small { display: block; margin-top: 3px; color: #a18a72; font-size: 9px; }
.facility-ui__recovery button { flex: 0 0 auto; padding: 7px 9px; border: 1px solid #dfbca0; border-radius: 8px; background: #fffaf2; color: #a26349; font-size: 9px; font-weight: 800; cursor: pointer; }

.facility-ui :focus-visible { outline: 3px solid rgba(64, 128, 90, .35); outline-offset: 2px; }

@keyframes facility-ui-enter {
  from { opacity: 0; transform: translateY(7px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 520px) {
  .facility-ui { width: calc(100vw - 24px); max-height: calc(100dvh - 24px); border-radius: 21px; }
  .facility-ui__shell { padding: 19px 17px 17px; }
  .facility-ui__pond-stats, .facility-ui__inventory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .facility-ui__stat { min-height: 58px; }
  .facility-ui__description { margin: 11px 0 15px; }
  .facility-ui__routine-actions { grid-template-columns: minmax(0, 1fr); }
  .facility-ui__prep-route span { font-size: 7px; }
}

@media (max-width: 350px) {
  .facility-ui__shell { padding-right: 13px; padding-left: 13px; }
  .facility-ui__actions { grid-template-columns: minmax(0, 1fr); }
  .facility-ui__action--wide { grid-column: auto; }
  .facility-ui__recovery { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .facility-ui, .facility-ui * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
/* V0.4: small nonmodal field cards, with detail only on request. */
.facility-ui{position:fixed;inset:90px 18px auto auto;margin:0;width:350px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 190px);border:2px solid #e0d7b5;border-radius:22px;box-shadow:0 12px 36px #264e4425;z-index:25}.facility-ui__shell{padding:17px}.facility-ui__header{gap:9px;margin-bottom:14px}.facility-ui__header h2{font-size:18px}.facility-ui__eyebrow{font-size:8px;letter-spacing:.04em}.facility-ui__icon{width:42px;height:42px;border:0;background:#edf0d9}.facility-ui__icon .game-icon{width:36px;height:36px;fill:none;stroke:#476456;stroke-width:2.4}.facility-ui__link-button{font-size:11px;padding:11px 0}.facility-ui__action{min-height:65px;gap:8px;padding:9px;border-radius:14px;align-items:center;justify-content:flex-start}.facility-ui__action .game-icon{width:38px;height:38px;flex-shrink:0}.facility-ui__action span{font-size:12px}.facility-ui__action small{font-size:11px;margin-top:4px;color:#8e9879}.facility-ui__action.primary{background:#e6efd8;border-color:#a3bb8c}.pond-gauges{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:14px}.pond-gauge{text-align:center;display:grid;justify-items:center;gap:5px}.pond-gauge>span{display:grid;place-items:center;width:54px;height:54px;background:conic-gradient(#a4bd7d var(--progress),#e9e9d6 0);border-radius:50%;padding:4px}.pond-gauge .game-icon{background:#fffcef;border-radius:50%;width:46px;height:46px;padding:6px}.pond-gauge small{font-size:10px;color:#8e9b80}.pond-gauge b{font-size:11px}.prep-steps{display:flex;justify-content:space-between;margin:14px 0}.prep-steps>span{display:grid;justify-items:center;opacity:.35}.prep-steps .done{opacity:1}.prep-steps svg{width:32px;height:32px}.prep-steps small{font-size:9px;margin-top:4px}.pond-main-action>button{width:100%}.care-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.density-choices{display:flex;gap:8px}.density-choices button{background:#f6f1db;border:1px solid #dfdec4;border-radius:15px;flex:1;display:grid;justify-items:center;gap:4px;padding:10px;color:#4c6e53}.density-choices svg{width:42px;height:42px}.density-choices small{color:#9b8050}.inline-details,.play-notes{margin-top:12px;border-top:1px solid #e8e5d3;padding-top:10px;font-size:11px;color:#84917a}.inline-details summary,.play-notes summary{cursor:pointer;padding:3px 0}.inline-details p,.play-notes p{font-size:11px;line-height:1.7}.inline-details[open]>button{margin-top:10px;width:100%}.play-notes{font-size:10px}.feed-display{display:flex;align-items:center;justify-content:center;gap:25px;padding:14px;background:#f2eed7;border-radius:18px;margin-bottom:15px}.feed-display>.game-icon{width:110px;height:110px;filter:drop-shadow(0 7px 0 #c1be9b33)}.feed-display strong{display:block;font-size:38px}.feed-display small{font-size:12px;color:#8b9276}.finance-headlines{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:14px 0}.finance-headlines>div{display:grid;justify-items:center;gap:8px;background:#f1efd9;border-radius:14px;padding:12px 2px}.finance-headlines svg{width:42px;height:42px}.finance-headlines small{font-size:11px;color:#879777}.finance-headlines b{font-size:17px}.finance-caption{text-align:center;font-size:11px;color:#8b987b}.facility-ui__process-step small{font-size:10px}.facility-ui__feature-card small{font-size:10px}.facility-ui__quality-note{font-size:10px}
@media(max-width:620px){.facility-ui{inset:auto 8px 112px 8px;width:auto;max-width:none;max-height:42dvh;border-radius:20px}.facility-ui__shell{padding:13px}.facility-ui__header{margin-bottom:10px}.facility-ui__header h2{font-size:16px}.facility-ui__routine-actions{grid-template-columns:repeat(2,1fr)}.pond-gauges{margin-bottom:10px}.facility-ui__action{min-height:58px}.facility-ui__action .game-icon{width:32px;height:32px}.facility-ui__pond-stats{grid-template-columns:repeat(4,1fr)}}
.equipment-hero{display:flex;align-items:center;gap:20px;padding:12px;background:#edf0d9;border-radius:16px;margin:12px 0}.equipment-hero>.game-icon{width:80px;height:80px}.equipment-hero b{font-size:16px}.equipment-hero small{display:block;font-size:11px;color:#849473;margin:8px 0}.equipment-hero progress{width:150px;height:9px;accent-color:#7aa888}.packing-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.packing-steps>div{display:grid;justify-items:center;gap:7px;background:#f0efd9;padding:12px 5px;border-radius:15px}.packing-steps svg{width:48px;height:48px}.packing-steps small{font-size:10px;color:#8f997d}.packing-steps b{font-size:16px}.process-actions{display:grid;gap:8px}.process-actions>button{width:100%;min-height:54px}

/* Species catalog and SKU-filtered processing */
.pond-species-heading,.species-care-heading,.sku-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:4px 0 9px;color:#536e52}.pond-species-heading b,.species-care-heading b,.sku-heading b{font-size:12px}.pond-species-heading small,.species-care-heading small,.sku-heading small{color:#8f987d;font-size:9px}.species-setup-summary{display:grid;gap:4px;padding:10px 12px;margin-bottom:9px;border-radius:14px;background:#f2f0dd}.species-setup-summary>b{color:#4d6c50;font-size:12px}.species-setup-summary>small{font-size:10px;color:#828d75}.species-current-label{margin:0 0 10px;color:#828d75;font-size:10px}.species-catalog{display:grid;gap:9px;max-height:42dvh;overflow:auto;padding:2px}.species-card{padding:11px;border:1px solid #e3e5d6;border-radius:16px;background:#fffdf3}.species-card.is-selected{border-color:#99b37d;background:#f0f3dd;box-shadow:inset 0 0 0 1px #ccd6ac}.species-card__heading{display:flex;align-items:center;gap:9px}.species-card__heading>.game-icon{width:36px;height:36px;padding:5px;border-radius:12px;background:#e9edd6}.species-card__heading>div{display:grid;gap:3px;flex:1}.species-card__heading b{font-size:13px;color:#4c6951}.species-card__heading small{font-size:9px;color:#8b947e}.species-card__heading i{font-size:9px;color:#6e855d;font-style:normal}.species-card__stats{display:grid;grid-template-columns:repeat(2,1fr);gap:5px;margin:10px 0}.species-card__stats>span{display:flex;justify-content:space-between;gap:5px;padding:5px 7px;border-radius:8px;background:#f6f5e9;color:#909783;font-size:9px}.species-card__stats b{color:#5d7356;font-size:9px}.species-card .facility-ui__action{width:100%;min-height:45px}.species-card .facility-ui__action .game-icon{width:27px;height:27px}.species-card .species-selected-action{opacity:.72}.sku-picker{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:9px;padding:8px 10px;border-radius:12px;background:#f2f0dd;color:#7d8974;font-size:10px}.sku-picker select{max-width:65%;padding:6px 8px;border:1px solid #d9dec8;border-radius:9px;background:#fffdf4;color:#536c51;font:inherit}.sku-heading{display:grid;gap:3px;padding:0 2px}.sku-heading b{font-size:14px}.sku-heading small{font-size:9px}
.species-card__details{margin:6px 0}.species-card__details>summary{padding:5px 7px;border-radius:8px;background:#f6f5e9;color:#73856c;font-size:9px;cursor:pointer}.species-card__details[open]>summary{margin-bottom:4px}
.shrimp-handling{margin:12px 0;padding:11px;border:1px solid #e4e4d0;border-radius:15px;background:linear-gradient(145deg,#f5f3df,#eef2df)}
.shrimp-handling__heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:9px;color:#536e52}
.shrimp-handling__heading b{font-size:11px}.shrimp-handling__heading small{font-size:9px;color:#92977f}
.shrimp-handling__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-bottom:9px}
.shrimp-handling__step{display:grid;justify-items:center;gap:4px;padding:6px 2px;border-radius:10px;background:#fffdf4;color:#939b85;text-align:center}
.shrimp-handling__step.is-ready{background:#e4efd8;color:#4e7258;box-shadow:inset 0 0 0 1px #c5d8b8}
.shrimp-handling__step>.game-icon{width:31px;height:31px}
.shrimp-handling__step span{display:grid;gap:2px}.shrimp-handling__step b{font-size:8px;line-height:1.3}.shrimp-handling__step small{font-size:8px}
.shrimp-handling__actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.shrimp-handling__actions .facility-ui__action{min-height:48px;padding:5px 6px;gap:4px;border-radius:10px}
.shrimp-handling__actions .facility-ui__action .game-icon{width:24px;height:24px}
.shrimp-handling__actions .facility-ui__action span{font-size:8px;line-height:1.3}
.shrimp-handling__actions .facility-ui__action small{font-size:7px;line-height:1.25}
.shrimp-handling__actions .facility-ui__action:disabled{opacity:.48}
@media(max-width:390px){.shrimp-handling__actions{grid-template-columns:minmax(0,1fr)}.shrimp-handling__actions .facility-ui__action{min-height:43px}.shrimp-handling__actions .facility-ui__action span{font-size:10px}.shrimp-handling__actions .facility-ui__action small{font-size:8px}}

/* iPhone-friendly facility sheets: keep actions reachable above the fixed toolbar. */
@media (max-width: 620px) {
  .facility-ui {
    position: fixed;
    inset: auto max(8px, env(safe-area-inset-right, 0px)) calc(96px + env(safe-area-inset-bottom, 0px) + 7px) max(8px, env(safe-area-inset-left, 0px));
    width: auto;
    max-width: none;
    max-height: min(48dvh, calc(100dvh - 96px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 16px));
    margin: 0;
    border-radius: 19px;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  .facility-ui__shell { padding: 13px 14px; }
  .facility-ui__header { gap: 8px; margin-bottom: 9px; }
  .facility-ui__icon { width: 38px; height: 38px; border-radius: 12px; }
  .facility-ui__header h2 { font-size: 16px; }
  .facility-ui__close { width: 40px; height: 40px; font-size: 22px; }
  .facility-ui__description { margin: 8px 0 11px; font-size: 10px; }
  .facility-ui__content { min-height: 0; }
  .facility-ui button { touch-action: manipulation; }
  .facility-ui__action { min-height: 56px; padding: 8px; }
  .facility-ui__link-button { min-height: 42px; }
  .facility-ui__task-claim { min-height: 38px; padding: 6px 10px; }
  .facility-ui__task { padding: 8px; }
  .facility-ui__journal-list article { padding: 9px; }
  .facility-ui__journal-list p { font-size: 10px; }
  .facility-ui__ledger { padding: 9px; }
}

/* Side sheets leave a broad strip of the pond visible in phone landscape. */
@media (max-width: 950px) and (orientation: landscape) and (max-height: 520px) {
  .facility-ui {
    position: fixed;
    inset: max(7px, env(safe-area-inset-top, 0px)) max(8px, env(safe-area-inset-right, 0px)) calc(48px + env(safe-area-inset-bottom, 0px) + 6px) auto;
    width: min(340px, 43vw);
    max-width: none;
    max-height: calc(100dvh - 48px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 18px);
    margin: 0;
    border-radius: 17px;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  .facility-ui__shell { padding: 11px 12px; }
  .facility-ui__header { gap: 7px; margin-bottom: 7px; }
  .facility-ui__icon { width: 34px; height: 34px; border-radius: 10px; }
  .facility-ui__header h2 { font-size: 15px; }
  .facility-ui__close { width: 38px; height: 38px; }
  .facility-ui__description { margin: 6px 0 8px; font-size: 9px; }
  .facility-ui__content { min-height: 0; }
  .facility-ui__action { min-height: 45px; padding: 6px 7px; }
  .facility-ui__action .game-icon { width: 29px; height: 29px; }
  .facility-ui__action > span { font-size: 10px; }
  .facility-ui__action small { font-size: 8px; }
  .facility-ui__link-button { min-height: 38px; padding: 6px 2px; }
  .facility-ui__task { padding: 7px; }
  .facility-ui__task-claim { min-height: 36px; }
  .facility-ui__journal-list article { padding: 7px; }
  .facility-ui__journal-list p { font-size: 9px; }
}

/* LUNA-F compact touch layout for portrait phones and landscape short screens. */
@media (max-width: 620px) {
  .facility-ui { inset: auto 8px max(8px, env(safe-area-inset-bottom)); width: auto; max-width: none; max-height: min(82dvh, 760px); border-radius: 20px; }
  .facility-ui__shell { padding: 14px 14px max(14px, env(safe-area-inset-bottom)); }
  .facility-ui__header { gap: 9px; margin-bottom: 10px; }
  .facility-ui__icon { width: 38px; height: 38px; border-radius: 12px; }
  .facility-ui__header h2 { font-size: 17px; }
  .facility-ui__close { width: 42px; height: 42px; font-size: 25px; }
  .facility-ui__content { min-height: 0; }
  .pond-gauges { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .pond-gauge { grid-template-columns: 36px 1fr; grid-template-rows: auto auto; justify-items: start; align-items: center; column-gap: 8px; padding: 7px; border: 1px solid #e7eadf; border-radius: 13px; background: #fffef9; }
  .pond-gauge>span { grid-row: 1 / 3; width: 36px; height: 36px; padding: 3px; }
  .pond-gauge .game-icon { width: 30px; height: 30px; padding: 4px; }
  .pond-gauge small, .pond-gauge b { font-size: 10px; }
  .prep-steps { gap: 2px; margin: 10px 0; }
  .prep-steps svg { width: 27px; height: 27px; }
  .prep-steps small { font-size: 9px; }
  .density-choices { gap: 6px; }
  .density-choices button { min-height: 78px; padding: 8px 4px; }
  .density-choices svg { width: 34px; height: 34px; }
  .facility-ui__action { min-height: 58px; }
  .facility-ui__grade-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .facility-ui__process-step { padding: 9px; }
  .facility-ui__action--wide { min-height: 56px; }
  .facility-ui__inventory-strip { gap: 5px; padding: 11px 6px; }
}
@media (max-width: 380px) {
  .facility-ui__shell { padding-inline: 11px; }
  .facility-ui__grade-grid { grid-template-columns: 1fr; }
  .care-grid { gap: 6px; }
  .facility-ui__action { padding: 7px; }
}
@media (orientation: landscape) and (max-height: 520px) {
  .facility-ui { inset: 6px 8px 6px auto; width: min(420px, 56vw); max-height: calc(100dvh - 12px); }
  .facility-ui__shell { padding: 10px 13px; }
  .facility-ui__header { margin-bottom: 6px; }
  .facility-ui__icon { width: 34px; height: 34px; }
  .facility-ui__content { min-height: 0; }
  .pond-gauges { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pond-gauge { display: grid; justify-items: center; padding: 2px; border: 0; background: transparent; }
  .pond-gauge>span { grid-row: auto; width: 32px; height: 32px; }
  .pond-gauge .game-icon { width: 26px; height: 26px; }
  .prep-steps svg { width: 24px; height: 24px; }
}
.water-ecology-card{margin:14px 0;padding:14px;border:1px solid #d4dec9;border-radius:16px;background:#f5f7e9;color:#344c3d}
.water-ecology-card__heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.water-ecology-card__heading small,.water-ecology-card p,.water-ecology-card__note{color:#607365;font-size:.78rem}
.water-ecology-card p{margin:8px 0}
.water-ecology-card .facility-ui__actions{display:flex;gap:8px;margin:8px 0}
.water-ecology-card .facility-ui__action{min-width:0;flex:1;padding:8px;font-size:.78rem}
.water-ecology-card .facility-ui__action svg{width:18px;height:18px}
.event-illustration{margin:0 0 12px;padding:8px;border-radius:16px;background:linear-gradient(145deg,#edf0db,#fff8e5);border:1px solid #e0e4ce;text-align:center}
.event-illustration img{display:block;width:100%;height:126px;object-fit:contain}
.event-illustration figcaption{margin-top:5px;color:#58705b;font-size:11px;line-height:1.5}
.market-grades{width:100%;border-collapse:collapse;margin:12px 0;color:#405e4a;font-size:12px}
.market-grades caption{text-align:left;font-size:11px;padding-bottom:8px;color:#687c67}
.market-grades th,.market-grades td{padding:9px 5px;border-bottom:1px solid #e2e6d6;text-align:left}
.market-grades thead{background:#edf1e0}
.market-grades small{color:#71836e}
.market-conversation{margin:12px 0;padding:12px;border-radius:14px;background:#eef3e4;border:1px solid #d5dfc6}
.market-conversation p{font-size:12px;line-height:1.8;color:#3c5947}
.market-returns .facility-ui__action{width:100%;margin:6px 0;min-height:44px}
.custom-stocking{margin:12px 0;padding:10px;border:1px solid #d9e0c8;border-radius:12px;background:#f4f5e5;color:#526c51;font-size:11px}
.custom-stocking>div{display:flex;gap:7px;margin:7px 0}
.custom-stocking input{min-width:0;width:90px;flex:1;border:1px solid #bdcbaa;border-radius:8px;padding:9px;color:#365541;background:#fffef5;font:inherit;font-size:16px}
.custom-stocking button{min-height:44px;border:1px solid #a5b893;border-radius:9px;background:#e4efd6;color:#365541;font:inherit;font-weight:700;padding:7px 10px}
.custom-stocking small{line-height:1.6;display:block}
@media(max-width:620px){.event-illustration img{height:146px}.market-conversation .facility-ui__actions{grid-template-columns:1fr 1fr}.market-conversation .facility-ui__action{min-width:0}.market-grades{font-size:11px}}
@media(orientation:landscape) and (max-height:520px){.event-illustration img{height:96px}}
/* Keep day progression and the main tools reachable while a facility sheet is open. */
@media(max-width:620px){.facility-ui{bottom:calc(112px + env(safe-area-inset-bottom,0px));max-height:min(74dvh,calc(100dvh - 184px - env(safe-area-inset-bottom,0px)))}}
@media(orientation:landscape) and (max-height:520px){.facility-ui{inset:6px 8px auto auto;max-height:calc(100dvh - 68px)}}
.water-ecology-card__note{display:block;line-height:1.45}

/* Keep the facility header and close control fixed while long journal content scrolls. */
.facility-ui { overflow: hidden; }
.facility-ui__shell {
  display: flex;
  min-height: 0;
  max-height: calc(100dvh - 32px);
  flex-direction: column;
  box-sizing: border-box;
}
.facility-ui__header { flex: 0 0 auto; }
.facility-ui__content {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #d6dfd1 transparent;
  scrollbar-width: thin;
}
.sku-picker input[type="number"] {
  width: 7.5em;
  max-width: 65%;
  padding: 6px 8px;
  border: 1px solid #d9dec8;
  border-radius: 9px;
  background: #fffdf4;
  color: #536c51;
  font: inherit;
}
@media (max-width: 620px) {
  .facility-ui__shell { max-height: min(74dvh, calc(100dvh - 184px - env(safe-area-inset-bottom, 0px))); }
}
@media (orientation: landscape) and (max-height: 520px) {
  .facility-ui__shell { max-height: calc(100dvh - 68px); }
}