.device-photo-field { min-width: 0; grid-column: 1 / -1; }
input[data-device-photos][hidden], .file-input-wrap[hidden], .device-photo-picker [hidden] { display: none !important; }
.device-photo-picker { display: grid; gap: 12px; width: 100%; margin: 10px 0; }
.device-photo-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.device-photo-picker button { font: inherit; cursor: pointer; min-height: 48px; border-radius: 16px; padding: 12px 16px; border: 1px solid rgba(15,122,66,.18); background: #eef8f2; color: #0f6a3c; font-weight: 800; }
.device-photo-picker .device-photo-camera { background: #13b66b; color: #fff; }
.device-photo-picker button:disabled { opacity: .5; cursor: not-allowed; }
.device-photo-picker button:focus-visible { outline: 3px solid #15995c; outline-offset: 3px; }
.device-photo-help, .device-photo-status { font-size: 13px; line-height: 1.5; color: #606c68; }
.device-photo-status[role=alert] { color: #b52d3b; }
.device-photo-previews, .device-photo-gallery > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: 12px; }
.device-photo-preview { position: relative; margin: 0; min-width: 0; }
.device-photo-preview img, .device-photo-gallery img { display: block; width: 100%; height: 140px; object-fit: cover; border-radius: 16px; background: #f1f5f3; }
.device-photo-preview figcaption { overflow-wrap: anywhere; font-size: 12px; padding-top: 6px; }
.device-photo-picker .device-photo-remove { position: absolute; top: 6px; right: 6px; min-height: 36px; min-width: 36px; padding: 5px; background: #fff; color: #a02a38; border-radius: 12px; box-shadow: 0 2px 12px #0002; }
.device-photo-gallery { margin: 14px 0; padding: 16px; border: 1px solid #dfe9e3; border-radius: 22px; background: #f5faf7; }
.device-photo-gallery h3 { margin: 0 0 6px; }
.device-photo-gallery p { font-size: 13px; color: #606c68; }
.device-photo-gallery a { display: block; }
@media (max-width: 480px) {
  .device-photo-actions > button { flex: 1; min-width: 130px; padding-inline: 10px; }
  .device-photo-previews { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}