.collection-config-panel { margin-top: 16px; scroll-margin-top: 18px; }
.config-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.config-head h3 { margin: 0 0 7px; }
.config-head > div > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 8px; }
.config-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 9px; }
.config-actions span { color: #81908c; font-size: 8px; }
.config-actions button { min-width: 126px; padding: 10px 16px; border: 0; border-radius: 11px; background: var(--green); color: white; font-size: 8px; font-weight: 800; }
.config-actions button:disabled { cursor: wait; opacity: .62; }
.config-actions .secondary-config-button { background: #e5f1ed; color: var(--green); }
.waste-brand-config { margin-top: 20px; padding: 18px; border: 1px solid #cfe0da; border-radius: 18px; background: linear-gradient(135deg, #f8fcfa, #eef7f3); }
.config-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.config-section-head h4 { margin: 3px 0 0; color: var(--ink); font-size: var(--font-ui-title); }
.config-section-head > p { max-width: 540px; margin: 0; color: var(--muted); font-size: var(--font-ui-control); text-align: right; }
.area-config-section-head { margin-top: 22px; }
.waste-brand-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 15px; }
.waste-brand-card { min-width: 0; padding: 15px; border: 1px solid #d7e5e0; border-radius: 15px; background: #fff; }
.waste-brand-title { display: flex; align-items: center; gap: 10px; }
.waste-brand-title > span { width: 34px; height: 34px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 11px; background: var(--green); color: #fff; font-size: var(--font-ui-control); font-weight: 900; }
.waste-brand-title h5 { margin: 0; color: var(--ink); font-size: var(--font-ui-body); }
.waste-brand-title p { margin: 3px 0 0; color: var(--muted); font-size: var(--font-ui-control); }
.waste-brand-list { min-height: 54px; margin-top: 12px; display: flex; align-content: flex-start; flex-wrap: wrap; gap: 6px; }
.waste-brand-list > span { display: inline-flex; align-items: center; gap: 5px; padding: 4px 4px 4px 9px; border-radius: 999px; background: #eaf5f1; color: #286f5f; font-size: var(--font-ui-control); font-weight: 700; }
.waste-brand-chip button { width: 20px; height: 20px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: rgba(40,111,95,.1); color: #51746b; font: inherit; font-size: 13px; line-height: 1; cursor: pointer; }
.waste-brand-chip button:hover, .waste-brand-chip button:focus-visible { background: #f4d9d4; color: #a64236; outline: none; }
.waste-brand-list em { color: var(--muted); font-size: var(--font-ui-control); font-style: normal; }
.waste-brand-add { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 12px; }
.waste-brand-add input { min-width: 0; height: 38px; padding: 0 11px; border: 1px solid #d5e3de; border-radius: 10px; background: #fbfdfc; color: var(--ink); font: inherit; }
.waste-brand-add input:focus { outline: 2px solid #c3e2d8; border-color: var(--green); }
.waste-brand-add button { padding: 0 13px; border: 0; border-radius: 10px; background: var(--green); color: #fff; font: inherit; font-weight: 800; cursor: pointer; }
.area-config-list .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.area-config-list { margin-top: 18px; overflow: hidden; border: 1px solid #dce7e2; border-radius: 12px; background: #fff; }
.area-config-list-head, .area-config-row { display: grid; grid-template-columns: minmax(220px, 1.4fr) minmax(240px, 1fr) 90px 48px; align-items: center; gap: 18px; padding: 12px 16px; }
.area-config-list-head { background: #f4f8f6; color: #758580; font-size: var(--font-ui-control); font-weight: 700; }
.area-config-row { border-top: 1px solid #e5ece8; }
.area-config-row.disabled { color: #85928c; background: #fafcfb; }
.area-config-row .config-field { min-width: 0; }
.area-config-row .config-field input { font-size: var(--font-ui-control); }
.area-config-categories { min-width: 0; margin: 0; padding: 0; border: 0; }
.area-config-row .category-checks { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.area-config-row .category-checks label { display: inline-flex; align-items: center; gap: 5px; padding: 4px 0; border: 0; background: transparent; color: #526b62; font-size: var(--font-ui-control); font-weight: 500; text-align: left; }
.area-config-row .category-checks label.selected { background: transparent; color: #526b62; }
.area-config-row .category-checks input { position: static; width: 15px; height: 15px; margin: 0; opacity: 1; pointer-events: auto; accent-color: var(--green); }
.area-config-row .enable-switch { margin: 0; font-size: var(--font-ui-control); white-space: nowrap; }
.area-config-delete { padding: 7px 0; border: 0; background: transparent; color: #8b625b; font: inherit; font-size: var(--font-ui-control); cursor: pointer; }
.area-config-delete:hover { color: #a64236; text-decoration: underline; }
.area-config-delete:disabled { opacity: .4; cursor: not-allowed; }
.area-config-list-footer { padding: 12px 16px; border-top: 1px solid #e5ece8; }
.area-config-add { padding: 8px 12px; border: 1px solid #c7ddd4; border-radius: 8px; background: #edf6f2; color: var(--green); font: inherit; font-size: var(--font-ui-control); font-weight: 700; cursor: pointer; }
.area-config-add:disabled { opacity: .6; cursor: wait; }
@media (max-width: 1100px) {
  .area-config-list-head { display: none; }
  .area-config-row { grid-template-columns: minmax(0, 1fr) 90px; gap: 8px 14px; }
  .area-config-row .config-field { grid-column: 1; grid-row: 1; }
  .area-config-row .enable-switch { grid-column: 2; grid-row: 1; }
  .area-config-categories { grid-column: 1; grid-row: 2; }
  .area-config-delete { grid-column: 2; grid-row: 2; text-align: left; }
}
.enable-switch { display: inline-flex; align-items: center; gap: 7px; color: #657771; font-size: 8px; cursor: pointer; }
.enable-switch input { accent-color: var(--green); }
.config-field { display: grid; gap: 7px; }
.config-field > span, .area-config-card legend { color: #758580; font-size: 8px; font-weight: 700; }
.config-field input { width: 100%; height: 40px; padding: 0 11px; border: 1px solid #d9e4df; border-radius: 10px; background: white; color: var(--ink); outline: none; font-size: 8px; }
.config-field input:focus { border-color: #65a997; box-shadow: 0 0 0 3px rgba(101,169,151,.12); }
.area-config-card fieldset { min-width: 0; margin: 14px 0 0; padding: 0; border: 0; }
.area-config-card legend { margin-bottom: 8px; }
.category-checks { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.category-checks label { min-width: 0; padding: 8px 5px; border: 1px solid #dfe8e4; border-radius: 9px; background: white; color: #6d7d78; cursor: pointer; font-size: 8px; font-weight: 700; text-align: center; }
.category-checks label.selected { border-color: #80b5a6; background: var(--mint); color: var(--green); }
.category-checks input { position: absolute; opacity: 0; pointer-events: none; }
.config-message { min-height: 18px; margin: 13px 0 0; color: #397666; font-size: 8px; }
.record-detail-link { padding: 0; border: 0; background: none; color: var(--green); font-weight: 800; text-decoration: underline; text-decoration-color: #a8cfc4; text-underline-offset: 3px; }
.record-detail-backdrop { position: fixed; inset: 0; z-index: 50; padding: 24px; display: grid; place-items: center; background: rgba(10, 37, 31, .46); }
.record-detail-dialog { width: min(680px, 100%); max-height: min(760px, calc(100vh - 48px)); overflow: auto; padding: 24px; border-radius: 20px; background: white; box-shadow: 0 30px 80px rgba(9, 38, 31, .25); }
.record-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.record-detail-head h3 { margin: 0; }
.record-detail-head button { padding: 8px 12px; border: 0; border-radius: 9px; background: #edf4f1; color: var(--green); }
.record-detail-actions { display: flex; align-items: center; gap: 8px; }
.record-detail-head .record-edit-button { background: var(--green); color: white; }
.record-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
.record-detail-grid > div { min-width: 0; padding: 12px; border-radius: 12px; background: #f6f9f7; }
.record-detail-grid dt { color: #7a8b85; font-size: 12px; }
.record-detail-grid dd { margin: 5px 0 0; overflow-wrap: anywhere; color: var(--ink); font-size: 12px; font-weight: 700; }
.record-detail-grid .record-detail-wide { grid-column: 1 / -1; }
.record-entry-list { margin-top: 18px; }
.record-entry-list h4 { margin: 0 0 9px; font-size: 12px; }
.record-entry-list > div { padding: 9px 2px; display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid #edf2ef; font-size: 12px; }
.record-entry-list p { color: var(--muted); font-size: 12px; }
.record-photo-list { margin-top: 18px; }
.record-photo-list h4 { margin: 0 0 9px; font-size: 9px; }
.record-photo-list > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.record-photo-list figure { min-width: 0; margin: 0; }
.record-photo-list button { display: block; width: 100%; padding: 0; border: 0; overflow: hidden; border-radius: 12px; background: #edf3f0; aspect-ratio: 4 / 3; cursor: zoom-in; }
.record-photo-list img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .18s ease; }
.record-photo-list button:hover img { transform: scale(1.025); }
.record-photo-list figcaption { margin-top: 6px; overflow: hidden; color: #70817b; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.type-badge.photo { background: #e6f0f7; color: #315f7d; }
.photo-thumbnail-column { width: 102px; }
.photo-thumbnail-cell { width: 102px; padding-top: 8px; padding-bottom: 8px; }
.photo-thumbnail-button { position: relative; width: 78px; height: 58px; padding: 0; display: block; overflow: hidden; border: 1px solid #d7e4df; border-radius: 10px; background: #edf3f0; cursor: pointer; }
.photo-thumbnail-button img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .18s ease; }
.photo-thumbnail-button:hover img { transform: scale(1.04); }
.photo-thumbnail-button span { position: absolute; right: 4px; bottom: 4px; padding: 2px 5px; border-radius: 6px; background: rgba(18,55,47,.78); color: #fff; font-size: 8px; font-weight: 800; line-height: 1.4; }
.photo-thumbnail-empty { color: var(--muted); font-size: 10px; }
.record-edit-form { margin-top: 18px; }
.record-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.record-edit-grid label { min-width: 0; display: grid; gap: 6px; color: #6f817b; font-size: 8px; font-weight: 700; }
.record-edit-grid input, .record-edit-grid textarea, .record-edit-entries input { width: 100%; min-width: 0; padding: 10px 11px; border: 1px solid #d9e4df; border-radius: 9px; background: #f9fbfa; color: var(--ink); outline: none; font-size: 8px; }
.record-edit-grid textarea { min-height: 76px; resize: vertical; }
.record-edit-grid .record-edit-wide { grid-column: 1 / -1; }
.record-edit-entries { margin-top: 16px; }
.record-edit-entries h4 { margin: 0 0 8px; font-size: 8px; }
.record-edit-entries label { padding: 7px 0; display: grid; grid-template-columns: minmax(0, 1fr) 90px auto; align-items: center; gap: 12px; color: #52665f; font-size: 8px; }
.record-entry-delete-note { margin: -2px 0 8px; color: #789087; font-size: var(--font-ui-control); }
.record-entry-remove { border: 1px solid #efc1b9; border-radius: 8px; background: #fff5f2; color: #b54839; padding: 9px 12px; cursor: pointer; }
.record-edit-footer { margin-top: 18px; display: flex; justify-content: flex-end; gap: 8px; }
.record-edit-footer button { padding: 9px 14px; border: 0; border-radius: 9px; background: #edf3f0; color: #62756f; cursor: pointer; }
.record-edit-footer .record-edit-save { background: var(--green); color: white; font-weight: 800; }
.record-edit-footer button:disabled { cursor: wait; opacity: .6; }
.record-edit-message { margin: 12px 0 0; color: #397666; font-size: 8px; }
.wildlife-record-edit .record-edit-grid label { font-size: 12px; }
.wildlife-record-edit .record-edit-grid input,
.wildlife-record-edit .record-edit-grid select,
.wildlife-record-edit .record-edit-grid textarea,
.wildlife-edit-fields input,
.wildlife-edit-fields textarea { width: 100%; min-width: 0; padding: 10px 11px; border: 1px solid #d9e4df; border-radius: 9px; background: #f9fbfa; color: var(--ink); font: inherit; font-size: 13px; }
.wildlife-edit-observation { position: relative; min-width: 0; margin: 12px 0; padding: 16px; border: 1px solid #d6e6de; border-radius: 14px; background: #f9fcfa; }
.wildlife-edit-observation legend { padding: 0 7px; color: var(--ink); font-size: 13px; font-weight: 800; }
.wildlife-edit-observation > button { position: absolute; top: 10px; right: 14px; padding: 5px 9px; border: 1px solid #edc9c2; border-radius: 8px; background: #fff6f4; color: #a34437; cursor: pointer; }
.wildlife-edit-observation > button:disabled { border-color: #dce7e2; background: #f1f5f3; color: #72877e; cursor: not-allowed; }
.wildlife-edit-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 8px; }
.wildlife-edit-fields label { min-width: 0; display: grid; grid-template-columns: 1fr; gap: 5px; padding: 0; color: #60766c; font-size: 12px; font-weight: 700; }
.wildlife-edit-fields .record-edit-wide { grid-column: 1 / -1; }
.wildlife-edit-fields textarea { min-height: 64px; resize: vertical; }
.wildlife-edit-add { margin-top: 8px; padding: 9px 14px; border: 1px solid #b8d7ca; border-radius: 9px; background: #eaf5ef; color: var(--green); font-weight: 800; cursor: pointer; }
.wildlife-record-edit .record-edit-message { font-size: 12px; }

@media (max-width: 1000px) {
  .waste-brand-grid { grid-template-columns: 1fr; }
  .category-checks { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 680px) {
  .sidebar nav { grid-template-columns: repeat(5, 1fr); }
  .config-head { flex-direction: column; }
  .config-actions { width: 100%; align-items: stretch; }
  .config-actions button { width: 100%; }
  .config-section-head { align-items: flex-start; flex-direction: column; }
  .config-section-head > p { text-align: left; }
  .waste-brand-add { grid-template-columns: 1fr; }
  .waste-brand-add button { min-height: 38px; }
  .area-config-grid { grid-template-columns: 1fr; }
  .record-detail-backdrop { padding: 12px; }
  .record-detail-dialog { max-height: calc(100vh - 24px); padding: 18px; }
  .record-detail-grid { grid-template-columns: 1fr; }
  .record-detail-grid .record-detail-wide { grid-column: auto; }
  .record-edit-grid { grid-template-columns: 1fr; }
  .record-edit-grid .record-edit-wide { grid-column: auto; }
  .wildlife-edit-fields { grid-template-columns: 1fr; }
  .wildlife-edit-fields .record-edit-wide { grid-column: auto; }
}

.photo-tags-caption { display:block; margin-top:5px; color:#397666; font-size:12px; overflow-wrap:anywhere; }

.collection-config-panel .config-head .config-station-scope { margin-top:8px; color:var(--green); font-size:var(--font-ui-control); font-weight:700; }
.station-config-notice { margin-top:16px; color:#60776e; }
.station-config-notice p { margin:0; }
.station-config-notice button { margin-top:12px; padding:8px 14px; border:1px solid #c7ddd4; border-radius:8px; background:#edf6f2; color:var(--green); cursor:pointer; }