/* Є ПЛАН · targeted UI corrections · 20 Oct 2026
   Preserves approved light/dark palettes, navigation and calendar arrows. */

/* 1. Dismiss controls in body-level dialogs.
   Earlier shared circular rules do not have enough specificity for these
   ID-scoped styles, and the two nutrition dialogs have unnamed buttons. */
body.eplan-redesign:is(.client-ui,.trainer-ui) :is(
  #foodSearchModal #foodSearchClose,
  #redesignNutritionModal .between > button.dark,
  #profileModal .profile-close,
  #nutritionDateModal .nutrition-date-close,
  #historyNutritionModal .history-nutrition-close,
  #notificationModal .notification-close,
  #notificationDetailModal .notification-close,
  #myProductModal .my-foods-panel .between > button.dark,
  #myFoodsModal .my-foods-panel .between > button.dark,
  #myRecipesModal .my-foods-panel .between > button.dark,
  #trainerNutritionCalcModal .trainer-nutrition-calc-close,
  #autoMealPlanModal .auto-meal-close,
  #recipeTemplatePicker #recipeTemplateClose,
  #editExerciseModal .edit-exercise-close,
  #supersetModal .edit-exercise-close,
  #dayTitleModal .edit-exercise-close,
  .trainer-new-client-modal .trainer-new-client-close,
  .trainer-program-picker-close,
  .trainer-program-form-close,
  .trainer-four-week-close,
  .trainer-review-complete-close
) {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  padding:0!important;
  border-radius:50%!important;
  border:1px solid var(--eplan-round-border)!important;
  background:var(--eplan-round-bg)!important;
  color:var(--eplan-round-ink)!important;
  box-shadow:none!important;
  flex-shrink:0!important;
  text-align:center!important;
  line-height:1!important;
}
/* The food-search and manual BJU close buttons have no former square dimensions.
   Make them real, equal-sided 44px tap targets instead of shrinking their content. */
body.eplan-redesign.client-ui :is(
  #foodSearchModal #foodSearchClose,
  #redesignNutritionModal .between > button.dark
) {
  flex:0 0 44px!important;
  width:44px!important;
  min-width:44px!important;
  height:44px!important;
  min-height:44px!important;
  font-size:20px!important;
}
/* Explicit ID specificity wins over the former rectangular OLED profile rule. */
body.eplan-redesign.client-ui[data-eplan-theme="dark"] #profileModal .profile-close,
body.eplan-redesign.client-ui:not([data-eplan-theme="dark"]) #profileModal .profile-close {
  border-radius:50%!important;
  border-color:var(--eplan-round-border)!important;
  background:var(--eplan-round-bg)!important;
  color:var(--eplan-round-ink)!important;
}
body.eplan-redesign.client-ui #profileModal .profile-close svg {
  display:block!important;
  flex:0 0 20px!important;
  margin:auto!important;
  transform:none!important;
}
/* Keep legacy trainer modal crosses circular in their own higher-specificity dialogs. */
body.eplan-redesign.trainer-ui :is(
  #trainerNutritionCalcModal .trainer-nutrition-calc-close,
  #autoMealPlanModal .auto-meal-close,
  #recipeTemplatePicker #recipeTemplateClose,
  #editExerciseModal .edit-exercise-close,
  #supersetModal .edit-exercise-close,
  #dayTitleModal .edit-exercise-close
) {border-radius:50%!important;}
body.eplan-redesign.client-ui :is(
  #foodSearchModal #foodSearchClose,
  #redesignNutritionModal .between > button.dark,
  #profileModal .profile-close
):focus-visible {
  outline:2px solid var(--eplan-round-focus)!important;
  outline-offset:2px!important;
}

/* 2. Three KPI tiles in the LIGHT training Progress tab: same white surface
   as the surrounding cards, without changing dark theme KPI colors. */
body.eplan-redesign.client-ui:not([data-eplan-theme="dark"]) #app
  .eplan-training-progress .eplan-training-kpi {
  background:#fff!important;
  background-color:#fff!important;
  border:1px solid var(--tp-line,#e1e8f2)!important;
  box-shadow:0 3px 12px rgba(24,59,102,.035)!important;
}

/* 3. Profile edit sheet: eliminate the old ~104px top-offset vs 100dvh
   max-height conflict, which put the Save button beyond the iPhone viewport.
   Keep the sticky header, and allow independent momentum scrolling of the card. */
body.eplan-redesign.client-ui #profileModal.modal {
  box-sizing:border-box!important;
  padding:max(16px,env(safe-area-inset-top,0px)) 14px
          max(16px,env(safe-area-inset-bottom,0px))!important;
  align-items:flex-start!important;
  justify-content:center!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y!important;
}
body.eplan-redesign.client-ui #profileModal.modal > .profile-editor-card {
  box-sizing:border-box!important;
  display:block!important;
  flex:0 1 auto!important;
  min-height:0!important;
  width:min(610px,100%)!important;
  max-height:calc(100dvh - max(16px,env(safe-area-inset-top,0px))
    - max(16px,env(safe-area-inset-bottom,0px)))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y!important;
  scroll-padding-bottom:30px;
}
body.eplan-redesign.client-ui #profileModal .profile-modal-body {
  padding-bottom:calc(36px + env(safe-area-inset-bottom,0px))!important;
}
body.eplan-redesign.client-ui #profileModal .profile-save {
  display:block!important;
  position:relative!important;
  width:100%!important;
  margin-top:12px!important;
}
/* Do not let the general overlay lock consume the profile sheet's touch-pan. */
body.eplan-redesign.client-ui.overlay-open:has(#profileModal) {
  touch-action:pan-y!important;
}

/* 4. Bulk measurements: compact two-column main fields; paired left/right
   values remain directly opposite each other at all iPhone widths. No field
   IDs, values or submission logic are changed. */
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measure-grid.measurement-input-grid,
body.eplan-redesign.client-ui #measurementEditModal .measure-grid.measurement-input-grid {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  column-gap:9px!important;
  row-gap:9px!important;
  margin:0!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-input-grid > div,
body.eplan-redesign.client-ui #measurementEditModal .measurement-input-grid > div {
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  gap:6px!important;
  margin:0!important;
  padding:10px!important;
  border:1px solid #e1e8f2!important;
  border-radius:13px!important;
  background:#fff!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-input-grid label,
body.eplan-redesign.client-ui #measurementEditModal .measurement-input-grid label {
  display:block!important;
  min-width:0!important;
  margin:0!important;
  font-size:12px!important;
  line-height:1.3!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-input-grid input,
body.eplan-redesign.client-ui #measurementEditModal .measurement-input-grid input {
  display:block!important;
  box-sizing:border-box!important;
  min-width:0!important;
  width:100%!important;
  min-height:42px!important;
  margin:0!important;
  padding:8px 10px!important;
  font-size:16px!important;
}

/* Each pair is a full-width row containing two identical side-by-side fields.
   This avoids squeezing two paired fields inside half-width parent cards. */
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-list,
body.eplan-redesign.client-ui #measurementEditModal .measurement-pair-list {
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:9px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-group,
body.eplan-redesign.client-ui #measurementEditModal .measurement-pair-group {
  min-width:0!important;
  margin:0!important;
  padding:9px 10px!important;
  border-radius:13px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-title,
body.eplan-redesign.client-ui #measurementEditModal .measurement-pair-title {
  margin:0 0 7px!important;
  font-size:12px!important;
  line-height:1.25!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-inputs,
body.eplan-redesign.client-ui #measurementEditModal .measurement-pair-inputs {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:9px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-inputs label,
body.eplan-redesign.client-ui #measurementEditModal .measurement-pair-inputs label {
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
  margin:0!important;
  font-size:11px!important;
  line-height:1.25!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-inputs input,
body.eplan-redesign.client-ui #measurementEditModal .measurement-pair-inputs input {
  box-sizing:border-box!important;
  min-width:0!important;
  width:100%!important;
  min-height:42px!important;
  margin:0!important;
  padding:8px 10px!important;
  font-size:16px!important;
}
/* Dark mode keeps its graphite surfaces and original blue control emphasis. */
body.eplan-redesign:is(.client-ui,.trainer-ui)[data-eplan-theme="dark"] #app
  .measurement-v3 .measurement-v3-bulk .measurement-input-grid > div,
body.eplan-redesign.client-ui[data-eplan-theme="dark"] #measurementEditModal .measurement-input-grid > div {
  background:#11161d!important;
  border-color:#344353!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui)[data-eplan-theme="dark"] #app
  .measurement-v3 .measurement-v3-bulk .measurement-input-grid input,
body.eplan-redesign.client-ui[data-eplan-theme="dark"] #measurementEditModal .measurement-input-grid input,
body.eplan-redesign:is(.client-ui,.trainer-ui)[data-eplan-theme="dark"] #app
  .measurement-v3 .measurement-v3-bulk .measurement-pair-inputs input,
body.eplan-redesign.client-ui[data-eplan-theme="dark"] #measurementEditModal .measurement-pair-inputs input {
  background:#0b1118!important;
  color:#f2f7ff!important;
  border-color:#405162!important;
  color-scheme:dark!important;
}
@media (max-width:350px) {
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-bulk .measurement-input-grid > div {
    padding:8px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-bulk .measurement-pair-group {
    padding:8px!important;
  }
}

/* v2 — targeted iPhone fixes backed by actual screenshots.
   Modal CSS below intentionally outranks the legacy ID + theme rules. */
body.eplan-redesign.client-ui #foodSearchModal .food-lookup-modal #foodSearchClose,
body.eplan-redesign.client-ui[data-eplan-theme="dark"] #foodSearchModal .food-lookup-modal #foodSearchClose,
body.eplan-redesign.client-ui #redesignNutritionModal .redesign-nutrition-modal .between > button.dark {
  display:inline-flex!important;
  justify-content:center!important;
  align-items:center!important;
  flex:0 0 44px!important;
  box-sizing:border-box!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  max-width:44px!important;
  padding:0!important;
  border-radius:50%!important;
  aspect-ratio:1!important;
  background:var(--eplan-round-bg)!important;
  border:1px solid var(--eplan-round-border)!important;
  color:var(--eplan-round-ink)!important;
  box-shadow:none!important;
  font-size:20px!important;
  line-height:1!important;
  text-align:center!important;
}

body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-list {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:9px!important;
  width:100%!important;
  min-width:0!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-item {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 12px!important;
  align-items:center!important;
  gap:5px!important;
  width:100%!important;
  min-width:0!important;
  min-height:63px!important;
  margin:0!important;
  padding:10px 10px!important;
  border-radius:13px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-item-copy strong {
  font-size:12px!important;
  line-height:1.22!important;
  overflow-wrap:break-word!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-item-copy small {
  font-size:11px!important;
  line-height:1.28!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-pair-values {
  display:flex!important;
  flex-wrap:wrap!important;
  gap:1px 8px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-item-chevron {
  display:inline-block!important;
  align-self:center!important;
  justify-self:end!important;
}
/* v3 — match the actual iPhone mockup: neutral anatomical figure at LEFT,
   10 compact measurement selectors in TWO columns at RIGHT. No second figure,
   no red/muscle overlay. The original SVG/PNG and selection behavior remain. */
@media(max-width:699px) {
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-atlas {
    display:grid!important;
    grid-template-columns:minmax(0,39fr) minmax(0,61fr)!important;
    align-items:start!important;
    column-gap:7px!important;
    row-gap:0!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-figure-col {
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-figure {
    display:flex!important;
    align-items:flex-start!important;
    justify-content:center!important;
    width:100%!important;
    height:305px!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-anatomy.measurement-v3-atlas-image {
    display:block!important;
    flex:none!important;
    width:100%!important;
    max-width:none!important;
    height:100%!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-list {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    align-items:stretch!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-item {
    grid-template-columns:minmax(0,1fr) 7px!important;
    column-gap:3px!important;
    min-height:55px!important;
    padding:6px 7px!important;
    border-radius:10px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-item-copy strong {
    font-size:10.5px!important;
    line-height:1.18!important;
    overflow-wrap:anywhere!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-item-copy small {
    font-size:9.5px!important;
    line-height:1.2!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-pair-values {
    display:flex!important;
    flex-wrap:wrap!important;
    gap:0 4px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-item-chevron {
    font-size:13px!important;
    line-height:1!important;
  }
}
@media(max-width:370px) {
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-atlas {
    grid-template-columns:minmax(0,35fr) minmax(0,65fr)!important;
    column-gap:5px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-list {gap:5px!important}
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-item {
    min-height:55px!important;
    padding:5px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-item-copy strong {font-size:10px!important}
}
/* 700px+ has room for the original side-by-side anatomy and the new two-column list. */
@media(min-width:700px) {
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-atlas {
    grid-template-columns:minmax(0,.56fr) minmax(0,1.44fr)!important;
  }
}


/* v333 — measurement atlas: keep ONE existing neutral anatomy on the left.
   All ten metric selectors and the editing controls live together on the right;
   remove the former standalone, full-width editor by relocating its DOM in JS. */
body.eplan-redesign:is(.client-ui,.trainer-ui) #app .measurement-v3 .measurement-v3-right-col {
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  gap:9px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app .measurement-v3 .measurement-v3-inline-editor {
  display:block!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:10px 0 0!important;
  border-top:1px solid var(--mv3-separator)!important;
  background:transparent!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-editor {
  display:grid!important;
  gap:7px!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-editor-head {
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-items:start!important;
  gap:7px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-editor-title strong {
  font-size:12px!important;
  line-height:1.2!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-editor-title small {
  display:block!important;
  max-width:100%!important;
  margin-top:2px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
  font-size:9px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-date {
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr)!important;
  align-items:center!important;
  gap:5px!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-date>span {
  margin:0!important;
  font-size:10px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-date-picker {
  width:100%!important;
  min-width:0!important;
  min-height:35px!important;
  border-radius:9px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-date-readable {
  font-size:10px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-inputs {
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:6px!important;
  min-width:0!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-inputs.is-pair {
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-inputs label {
  min-width:0!important;
  gap:4px!important;
  font-size:10px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-inputs input {
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  height:40px!important;
  padding:7px 8px!important;
  border-radius:9px!important;
  font-size:16px!important; /* no automatic iPhone Safari input zoom */
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-save {
  width:100%!important;
  min-height:40px!important;
  margin:0!important;
  padding:9px 7px!important;
  border-radius:10px!important;
  font-size:12px!important;
}
@media(max-width:699px) {
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-atlas {
    grid-template-columns:minmax(0,43fr) minmax(0,57fr)!important;
    column-gap:7px!important;
    align-items:start!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-figure {
    height:355px!important;
    align-items:flex-start!important;
    overflow:visible!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-anatomy.measurement-v3-atlas-image {
    width:100%!important;
    max-width:none!important;
    height:100%!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-right-col .measurement-v3-list {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-right-col .measurement-v3-item {
    grid-template-columns:minmax(0,1fr) 7px!important;
    min-height:53px!important;
    padding:5px 6px!important;
    gap:3px!important;
    border-radius:10px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-right-col .measurement-v3-item-copy strong {
    font-size:10.5px!important;
    line-height:1.2!important;
    overflow-wrap:anywhere!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-right-col .measurement-v3-item-copy small {
    font-size:9.5px!important;
    line-height:1.18!important;
  }
}
@media(max-width:370px) {
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-atlas {
    grid-template-columns:minmax(0,41fr) minmax(0,59fr)!important;
    column-gap:5px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-figure {
    height:325px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-right-col .measurement-v3-item {
    min-height:51px!important;
    padding:5px!important;
  }
  body.eplan-redesign:is(.client-ui,.trainer-ui) #app
    .measurement-v3 .measurement-v3-right-col .measurement-v3-item-copy strong {
    font-size:10px!important;
  }
}

/* v334 — once a date is saved, show a compact read-only value.
   Editing existing measurements requires the explicit "Редагувати" action. */
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-saved-readout {
  display:grid!important;
  gap:4px!important;
  min-width:0!important;
  padding:8px 9px!important;
  border:1px solid var(--mv3-line)!important;
  border-radius:10px!important;
  background:var(--mv3-field)!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-saved-readout>span {
  color:var(--mv3-muted)!important;
  font-size:10px!important;
  line-height:1.25!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-saved-readout>strong {
  display:block!important;
  color:var(--mv3-text)!important;
  font-size:13px!important;
  line-height:1.3!important;
  overflow-wrap:anywhere!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-edit {
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  width:100%!important;
  min-height:40px!important;
  margin:0!important;
  padding:8px 9px!important;
  border:1px solid var(--mv3-accent)!important;
  border-radius:10px!important;
  background:var(--mv3-accent-soft)!important;
  color:var(--mv3-accent)!important;
  font-size:12px!important;
  font-weight:800!important;
  box-shadow:none!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-editor-actions {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:stretch!important;
  gap:6px!important;
  min-width:0!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-editor-actions .measurement-v3-save {
  min-width:0!important;
  padding:8px 4px!important;
  font-size:11px!important;
}
body.eplan-redesign:is(.client-ui,.trainer-ui) #app
  .measurement-v3 .measurement-v3-inline-editor .measurement-v3-cancel {
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-height:40px!important;
  margin:0!important;
  padding:7px 8px!important;
  border:1px solid var(--mv3-line)!important;
  border-radius:10px!important;
  background:var(--mv3-panel)!important;
  color:var(--mv3-muted)!important;
  box-shadow:none!important;
  font-size:10px!important;
  font-weight:700!important;
}