.nutrition-photo-title {
  margin-top: 16px;
}

.nutrition-photo-card {
  margin-top: 11px;
  padding: 15px;
  border-color: rgba(66, 212, 91, .18);
  overflow: visible;
}

.nutrition-photo-picker[hidden],
.nutrition-photo-preview[hidden],
.nutrition-photo-result[hidden],
.nutrition-photo-review-fields[hidden],
.nutrition-photo-correction[hidden],
.nutrition-photo-actions[hidden],
.nutrition-photo-form[hidden],
.nutrition-v2-sheet .nutrition-v2-add-icons[hidden] {
  display: none !important;
}

.nutrition-photo-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nutrition-photo-header small {
  color: var(--green);
  font-size: 9px;
}

.nutrition-photo-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin-top: 12px;
}

.nutrition-photo-picker,
.nutrition-photo-hint-field,
.nutrition-photo-correction label {
  display: grid;
  gap: 4px;
}

.nutrition-photo-picker {
  padding: 12px;
  border: 1px dashed rgba(66, 212, 91, .32);
  border-radius: 13px;
  color: var(--text);
  background: rgba(66, 212, 91, .07);
  cursor: pointer;
}

.nutrition-photo-picker span,
.nutrition-photo-hint-field span {
  font-size: 15px;
  font-weight: 750;
}

#nutrition-photo-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.nutrition-photo-form textarea,
.nutrition-photo-correction textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 86px;
  padding: 10px 12px;
  color: var(--text);
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  font: inherit;
  font-size: 16px;
  line-height: 1.35;
  resize: vertical;
}

.nutrition-photo-form textarea::placeholder,
.nutrition-photo-correction textarea::placeholder {
  color: rgba(141, 155, 171, .85);
}

.nutrition-photo-form button,
.nutrition-photo-correction button,
.nutrition-photo-actions button {
  min-height: 46px;
  border-radius: 12px;
  font-size: 16px;
}

.nutrition-photo-form button,
#nutrition-photo-correct,
#nutrition-photo-save {
  border: 0;
  color: #03111d;
  background: var(--green);
  font-weight: 800;
}

.nutrition-photo-form button:disabled,
.nutrition-photo-correction button:disabled,
.nutrition-photo-actions button:disabled {
  opacity: .55;
}

.nutrition-photo-preview {
  display: block;
  width: 100%;
  max-height: 220px;
  margin-top: 11px;
  border-radius: 13px;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.08);
}

.nutrition-photo-card.is-result > .nutrition-photo-preview {
  display: none !important;
}

.nutrition-photo-status {
  min-height: 17px;
  margin-top: 9px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.nutrition-photo-status:empty {
  display: none;
}

.nutrition-photo-card.is-analyzing .nutrition-photo-status {
  display: block;
  padding: 10px 12px;
  border: 1px solid rgba(72,199,255,.18);
  border-radius: 12px;
  background: rgba(72,199,255,.07);
  color: #8fdcff;
  font-weight: 700;
}

.nutrition-photo-result {
  display: grid;
  gap: 12px;
  margin-top: 2px;
  padding: 0;
  background: transparent;
  border: 0;
}

.nutrition-photo-model-badge {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 4px 10px;
  border: 1px solid rgba(95,176,255,.22);
  border-radius: 999px;
  background: rgba(42,123,190,.08);
  color: #b8c9d9;
  font-size: 12px;
  font-weight: 700;
}

.nutrition-photo-result-hero {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(255,255,255,.028);
}

.nutrition-photo-result-hero.has-image {
  grid-template-columns: 104px minmax(0,1fr);
  align-items: center;
}

.nutrition-photo-result-hero img {
  width: 104px;
  height: 104px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
}

.nutrition-photo-result-copy {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 5px;
}

.nutrition-photo-result-copy strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1.18;
}

.nutrition-photo-result-copy > span {
  color: #d6e1ea;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.nutrition-photo-result-copy small {
  color: var(--muted);
  font-size: 13px;
}

.nutrition-photo-result-copy em {
  justify-self: start;
  padding: 3px 8px;
  border-radius: 8px;
  background: rgba(40,203,93,.13);
  color: var(--green);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.nutrition-photo-macros {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 7px;
}

.nutrition-photo-macro {
  min-width: 0;
  min-height: 104px;
  padding: 11px 5px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 2px;
  text-align: center;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}

.nutrition-photo-macro strong {
  font-size: clamp(20px,6vw,28px);
  line-height: 1;
}

.nutrition-photo-macro > span {
  font-size: 11px;
  font-weight: 800;
}

.nutrition-photo-macro small {
  margin-top: 4px;
  color: #c6d2dd;
  font-size: 11px;
}

.nutrition-photo-macro.is-energy { border-color: rgba(50,210,92,.34); }
.nutrition-photo-macro.is-energy strong,.nutrition-photo-macro.is-energy > span { color: #43db6c; }
.nutrition-photo-macro.is-carbs { border-color: rgba(55,166,255,.34); }
.nutrition-photo-macro.is-carbs strong,.nutrition-photo-macro.is-carbs > span { color: #43aaff; }
.nutrition-photo-macro.is-fat { border-color: rgba(244,171,39,.34); }
.nutrition-photo-macro.is-fat strong,.nutrition-photo-macro.is-fat > span { color: #f4aa27; }
.nutrition-photo-macro.is-protein { border-color: rgba(178,91,242,.34); }
.nutrition-photo-macro.is-protein strong,.nutrition-photo-macro.is-protein > span { color: #c36cf2; }

.nutrition-photo-review-fields {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 8px;
  margin-top: 10px;
  padding: 0;
}

.nutrition-photo-review-fields > * {
  min-width: 0;
}

.nutrition-photo-review-fields label {
  position: relative;
  display: grid;
  gap: 1px;
  min-height: 62px;
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 13px;
  background: rgba(255,255,255,.025);
}

.nutrition-photo-review-fields label > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}

.nutrition-photo-review-fields input[type="date"],
.nutrition-photo-review-fields select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 0 3px;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  font-weight: 750;
}

.nutrition-photo-review-fields input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  opacity: .68;
}

.nutrition-photo-correction {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 13px;
  border-radius: 15px;
  background: rgba(66,212,91,.045);
  border: 1px solid rgba(66,212,91,.16);
}

.nutrition-photo-correction-heading {
  display: grid;
  gap: 3px;
}

.nutrition-photo-correction-heading strong {
  font-size: 15px;
}

.nutrition-photo-correction-heading strong span,
.nutrition-photo-correction-heading small {
  color: var(--muted);
  font-weight: 550;
  font-size: 12px;
}

.nutrition-photo-correction textarea {
  min-height: 96px;
}

#nutrition-photo-correct {
  min-height: 46px;
}

.nutrition-photo-actions {
  display: grid;
  grid-template-columns: .78fr 1fr 1.42fr;
  gap: 8px;
  margin-top: 12px;
}

.nutrition-photo-actions button {
  min-width: 0;
  padding: 8px 7px;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 800;
}

#nutrition-photo-reset {
  border: 1px solid rgba(255,255,255,.1);
  color: var(--text);
  background: rgba(255,255,255,.035);
}

#nutrition-photo-modify {
  border: 1px solid rgba(64,166,255,.36);
  color: #62baff;
  background: rgba(42,129,196,.055);
}

#nutrition-photo-modify[aria-expanded="true"] {
  background: rgba(42,129,196,.12);
}

#nutrition-photo-save {
  color: #03111d;
  background: var(--green);
}

@media (max-width: 390px) {
  .nutrition-photo-card {
    padding-left: 10px;
    padding-right: 10px;
  }

  .nutrition-photo-result-hero.has-image {
    grid-template-columns: 88px minmax(0,1fr);
  }

  .nutrition-photo-result-hero img {
    width: 88px;
    height: 88px;
  }

  .nutrition-photo-macro {
    min-height: 94px;
  }

  .nutrition-photo-macro small {
    font-size: 10px;
  }

  .nutrition-photo-actions {
    grid-template-columns: .72fr .92fr 1.36fr;
    gap: 6px;
  }

  .nutrition-photo-actions button {
    font-size: 12px;
    padding-left: 4px;
    padding-right: 4px;
  }
}