:root {
  
  --cart-bar-h: 60px;

  --feed-item-h: 100vh;

  --item-image-h: 260px;

  --card-gap: 12px;

  --tap-btn-gap: 16px;

  --tap-min: 44px;
}

@supports (height: 100dvh) {
  :root {
    --feed-item-h: 100dvh;
  }
}

html {
  
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html, body,
uni-app, uni-page, uni-page-wrapper {
  height: 100%;
}

body {
  overflow-x: hidden;
}

uni-page-body {
  box-sizing: border-box;
  min-height: 100%;
}

uni-page-body:not(:has(uni-scroll-view .uni-card)):not(:has(.uni-card)) {
  height: auto !important;
  min-height: 100% !important;
  display: block !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 32px) !important;
}

uni-page-body:not(:has(uni-scroll-view .uni-card)):not(:has(.uni-card)) uni-button,
uni-page-body:not(:has(uni-scroll-view .uni-card)):not(:has(.uni-card)) button {
  margin-left: auto !important;
  margin-right: auto !important;
  touch-action: manipulation !important;
}

@supports not selector(:has(*)) {
  uni-page-body {
    height: auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  uni-page-body > * {
    flex-shrink: 0;
  }
}

uni-page-body:has(uni-scroll-view .uni-card) {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

uni-page-body:has(uni-scroll-view .uni-card) > uni-view {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

uni-scroll-view:has(.uni-card) {
  display: block !important;
  height: var(--feed-item-h) !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  box-sizing: border-box !important;
}

uni-scroll-view:has(.uni-card) > .uni-scroll-view,
uni-scroll-view:has(.uni-card) .uni-scroll-view {
  height: 100% !important;
}

.scroll-view-item_H.scroll-view-item_H,
.scroll-view-item_V.scroll-view-item_V,
uni-scroll-view:has(.uni-card) .uni-scroll-view-content > uni-view {
  height: var(--feed-item-h) !important;
  min-height: var(--feed-item-h) !important;
  max-height: var(--feed-item-h) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  vertical-align: top !important;
  align-items: stretch !important;
}

.scroll-view-item_H.scroll-view-item_H {
  width: 100vw !important;
  max-width: 100vw !important;
}

.scroll-view_H.scroll-view_H,
.scroll-view_V.scroll-view_V {
  height: 100% !important;
}

.uni-card.uni-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding-bottom: calc(var(--cart-bar-h) + env(safe-area-inset-bottom, 0px) + 8px) !important;
  border: none !important;
  box-shadow: none !important;
}

.uni-card .uni-card__content {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.uni-card .uni-card__header,
.uni-card .uni-card__actions {
  flex: 0 0 auto !important;
}

.uni-card .uni-card__header,
.uni-card .uni-card__actions,
.uni-card .uni-card__content {
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

.box-side.box-side {
  height: var(--card-gap) !important;
  min-height: var(--card-gap) !important;
  max-height: var(--card-gap) !important;
  flex: 0 0 var(--card-gap) !important;
  width: 100% !important;
}

.box-side.box-side:has(uni-button),
.box-side.box-side:has(button) {
  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
  flex: 0 0 auto !important;
}

.uni-card:has([id^="btn-card-"]) uni-image.item-image-scroll,
.uni-card:has([id^="btn-card-"]) .item-image-scroll,
.uni-card:has([id^="btn-card-"]) uni-image.item-image-wipe,
.uni-card:has([id^="btn-card-"]) .item-image-wipe {
  height: var(--item-image-h) !important;
  max-height: var(--item-image-h) !important;
  flex: 0 0 var(--item-image-h) !important;
  align-self: center !important;
  box-sizing: border-box !important;
}

uni-image.item-image-scroll > div, uni-image.item-image-wipe > div,
.item-image-scroll > div, .item-image-wipe > div {
  width: 100% !important;
  height: 100% !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}

/* Кнопкам внутри карточки задаётся ровно одно свойство: снятие
   задержки двойного нажатия. Ни position, ни display, ни поля.
   Прежний блок загонял тап-кнопки в обычный поток, из-за чего
   они менялись местами и верхняя работала как нижняя. */
.uni-card uni-button,
.uni-card button {
  touch-action: manipulation !important;
}

uni-page-body [class*="cart-bar"],
uni-page-body [class*="cartBar"],
uni-page-body [class*="bottom-bar"] {
  z-index: 20 !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  box-sizing: border-box !important;
}

@media (orientation: landscape) {
  :root {
    --card-gap: 8px;
  }

  .uni-card.uni-card {
    padding-bottom: calc(var(--cart-bar-h) + env(safe-area-inset-bottom, 0px) + 8px) !important;
  }

  uni-page-body:not(:has(uni-scroll-view .uni-card)):not(:has(.uni-card)) {
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 24px) !important;
  }
}

/* Кнопка перехода. Адресуется по type="primary" — так она
   задана в разметке страницы ввода и опросников. Прежнее
   правило ловило любую страницу с полем ввода, включая
   корзину: там есть поле количества товара, и Confirm со
   всеми соседними кнопками раздувало до 69 пикселей. */
uni-page-body:not(:has(uni-scroll-view .uni-card)) uni-button[type="primary"] {
  height: 69px !important;
  min-height: 69px !important;
  width: fit-content !important;
  padding: 0 40px !important;
  font-size: 30px !important;
  line-height: 69px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* ============================================================
 * ВЕРСИЯ 10 — по исходникам study 1, 4 и 5
 * ------------------------------------------------------------
 * Что проверено по коду, а не по скриншотам:
 *
 * • study1/task и study4/task — один и тот же файл, совпадает
 *   побайтово. Разметка study 5 отличается только долями в
 *   распорках, которые всё равно переопределяются.
 *
 * • Изображение в обеих ветках задано классами страницы:
 *   .item-image-scroll (вертикаль) с высотой 260px и
 *   .item-image-wipe (горизонталь) без высоты. Прежние
 *   селекторы искали .item-image, которого в этих студиях нет
 *   вовсе, поэтому вертикаль оставалась 260px, а горизонталь
 *   получала 42dvh. Отсюда и разница размеров между
 *   условиями и между студиями. Теперь обе ветки получают
 *   260px — родную величину страницы.
 *
 * • Концевая распорка ленты: 60px в study 1 и 4, 50px в
 *   study 5. Правило :empty ловит обе.
 * ============================================================ */


/* ---- 10. Прокрутка ниже последнего элемента ----------------
 * В конце ленты страница ставит пустую распорку, чтобы
 * последний товар не упирался в панель корзины. Правило «каждый
 * элемент ленты равен экрану» цепляло и её: элементы ленты у
 * страницы без класса, селектор подходил к обоим. Распорка
 * раздувалась с 50–60 пикселей до целого экрана.
 *
 * Отличие распорки от товара в том, что внутри неё пусто.
 */

uni-scroll-view:has(.uni-card) .uni-scroll-view-content > uni-view:empty {
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

body {
  overscroll-behavior-y: none;
}

uni-page-body:has(uni-scroll-view .uni-card) {
  overscroll-behavior: none !important;
}

uni-scroll-view:has(.uni-card) > .uni-scroll-view,
uni-scroll-view:has(.uni-card) .uni-scroll-view {
  overscroll-behavior: none !important;
}


/* ---- 11. Единый размер кнопок и высота панели --------------
 * В разметке .shop-foot задана строкой height: 50px.
 */

:root {
  --cart-bar-h: 50px;

  /* Единый размер кнопок действия: Confirm, End browsing и
     подобные. Одна высота, одна скруглённость, текст по центру. */
  --btn-h: 40px;
  --btn-min-w: 104px;
}


/* ---- 12. Вертикальный тап: место под нижнюю кнопку ---------
 * Кнопка «вниз» в разметке позиционирована как
 * position:absolute; bottom:60px; left:25%; width:50%
 * и отсчитывается от низа страницы, а не от распорки, внутри
 * которой лежит. Раньше карточка занимала не весь экран, и
 * строка с ценой заканчивалась выше кнопки. Теперь карточка
 * во весь экран, и без запаса снизу они накладываются.
 *
 * Условие :has(.box-side uni-button) верно только для
 * вертикального тапа: в скролле и свайпе кнопок в распорках нет.
 */

:root {
  --tap-btn-bottom: 60px;
  --tap-btn-h: 40px;
  --tap-btn-zone: calc(var(--tap-btn-bottom) + var(--tap-btn-h) + 12px);
}

.uni-card.uni-card:has(.box-side uni-button),
.uni-card.uni-card:has(.box-side button) {
  padding-bottom: calc(var(--tap-btn-zone) + env(safe-area-inset-bottom, 0px)) !important;
}


/* ---- 13. Горизонтальный тап: стрелки по центру фотографии --
 * Стрелки лежат не внутри ленты, а рядом с ней, в обёртке
 * с идентификатором fx и стилем position:absolute; top:50%.
 * Поэтому прежние правила, искавшие кнопки внутри
 * .scroll-view-item_H, ничего не находили.
 *
 * top: 50% давало середину экрана, а нужна середина
 * фотографии: сверху только шапка карточки, снизу строка с
 * ценой и панель корзины. Формула вычитает из высоты экрана
 * всё, что не фотография, и делит остаток пополам.
 */

:root {
  --card-header-h: 36px;
  --card-actions-h: 60px;
  --side-btn-h: 40px;

  --tap-side-y: calc(var(--card-header-h)
                     + (var(--feed-item-h) - var(--card-header-h) - var(--card-actions-h)
                        - var(--cart-bar-h) - env(safe-area-inset-bottom, 0px) - 8px) / 2
                     - var(--side-btn-h) / 2);
}

@supports (height: 100dvh) {
  :root {
    --tap-side-y: calc(var(--card-header-h)
                       + (var(--feed-item-h) - var(--card-header-h) - var(--card-actions-h)
                          - var(--cart-bar-h) - env(safe-area-inset-bottom, 0px) - 8px) / 2
                       - var(--side-btn-h) / 2);
  }
}

#fx {
  top: var(--tap-side-y) !important;
  bottom: auto !important;
}


/* ---- 14. Корзина -------------------------------------------
 * Кнопка Confirm в разметке имеет класс pop-submit. Здесь ей
 * возвращается обычный размер: правило про 69 пикселей больше
 * до неё не достаёт, но на случай других переопределений
 * размер задан явно.
 *
 * Панель .shop-foot у корзины уже выравнивает содержимое по
 * центру, поэтому, как только кнопка перестаёт быть огромной,
 * галочка All, строка с суммой и Confirm встают на одну линию
 * сами.
 */


/* Надпись внутри кнопки — тоже флекс-элемент. Собственная
   line-height страницы растягивала её и прижимала текст кверху. */
.pop-submit.pop-submit uni-text,
.pop-submit.pop-submit text {
  line-height: 1 !important;
  font-size: 13px !important;
  display: block !important;
}

/* ---- 15. Шапка страницы на ленте ---------------------------
 * В study 5 у страницы задания включена шапка uni-page-head с
 * заголовком «shopping task», а в study 1 её нет. Во фреймворке
 * шапка занимает 44px плюс вырез экрана, и обёртка страницы
 * получает height: calc(100% - 44px - env(safe-area-inset-top)).
 * Элементы же ленты считаются от полной высоты экрана — отсюда
 * нехватка места внизу: строка с ценой и «плюс» уходят под
 * панель корзины.
 *
 * Шапка убирается только на странице ленты, поэтому корзина и
 * прочие экраны свою шапку с кнопкой «назад» сохраняют. Обёртке
 * возвращается полная высота.
 *
 * Если шапку в study 5 нужно оставить, замените это правило на
 * вычитание её высоты:
 *   uni-page:has(uni-page-head) {
 *     --feed-item-h: calc(100dvh - 44px - env(safe-area-inset-top, 0px));
 *   }
 * и уберите display: none ниже.
 */

uni-page:has(uni-scroll-view .uni-card) uni-page-head {
  display: none !important;
}

uni-page:has(uni-scroll-view .uni-card) uni-page-wrapper {
  height: 100% !important;
}

/* ---- 16. Опросник: вопросы вплотную ------------------------
 * Вопросы лежат внутри scroll-view, и правило «каждый элемент
 * ленты равен экрану» раздувало каждый из них до целого экрана.
 * Теперь все правила ленты сужены до scroll-view, внутри
 * которого есть карточка товара, — опросника они не касаются.
 *
 * Своя высота у вопроса тоже великовата: страница задаёт
 * height: {windowHeight}rpx, то есть около четырёхсот пикселей
 * на вопрос независимо от его содержимого. Здесь она снимается,
 * и вопрос занимает столько, сколько нужно, плюс небольшой
 * просвет до следующего.
 */

uni-scroll-view:not(:has(.uni-card)) .uni-scroll-view-content > uni-view {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding-bottom: 18px !important;
  box-sizing: border-box !important;
}

/* ============================================================
 * ЕДИНЫЙ ФАЙЛ — ЧАСТЬ ДЛЯ STUDY 3 И ОБЩЕЕ ОФОРМЛЕНИЕ КНОПОК
 * ------------------------------------------------------------
 * Этот файл ставится на ВСЕ ПЯТЬ студий. Отдельного файла для
 * study 3 больше нет — правила разделены внутри по меткам из
 * разметки, а не по имени файла на сервере. Дважды подряд
 * проблема была именно в том, что в study 3 попадал общий файл.
 *
 * Метки проверены по исходникам всех четырёх доступных студий:
 *   • карточка товара        — внутри есть id="btn-card-N"
 *     (study 1, 4, 5: по два совпадения; study 3: ноль)
 *   • карточка с фотографией — внутри есть id="love-N"
 *     (study 3: два совпадения; остальные: ноль)
 *   • галерея                — панель с кнопкой id="back"
 *     (только study 3)
 * ============================================================ */


/* ---- 17. Карточка с фотографией (study 3) ------------------
 * Размер задаётся числами, без растяжения. Высота считается
 * вычитанием: из высоты экрана убираются название, блок с
 * сердечком и полоса под панель Collection, остаток достаётся
 * фотографии. Поэтому линия и сердечко стоят внизу, а картинка
 * забирает верх.
 *
 * Классы изображения здесь те же, что в магазине, —
 * .item-image-wipe и .item-image-scroll. Разводятся они не по
 * классу картинки, а по метке карточки, внутри которой лежат.
 */

:root {
  --title-h: 40px;
  --like-h: 50px;
  --like-gap: 24px;

  --photo-w: 90vw;
  --photo-h: calc(100vh - var(--title-h) - var(--like-h)
                  - var(--cart-bar-h) - env(safe-area-inset-bottom, 0px) - 14px);
}

@supports (height: 100dvh) {
  :root {
    --photo-h: calc(100dvh - var(--title-h) - var(--like-h)
                    - var(--cart-bar-h) - env(safe-area-inset-bottom, 0px) - 14px);
  }
}

/* Распорки отнимают высоту у фотографии. */
.uni-card:has([id^="love-"]) .box-side.box-side {
  display: none !important;
}

.uni-card:has([id^="love-"]) uni-image.item-image-wipe,
.uni-card:has([id^="love-"]) uni-image.item-image-scroll,
.uni-card:has([id^="love-"]) .item-image-wipe,
.uni-card:has([id^="love-"]) .item-image-scroll {
  width: var(--photo-w) !important;
  max-width: var(--photo-w) !important;
  height: var(--photo-h) !important;
  max-height: var(--photo-h) !important;
  min-height: 0 !important;
  flex: 0 1 auto !important;
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  /* position нужен, чтобы inset вложенного блока считался от
     этой коробки. На кнопки его вешать нельзя — именно это
     ломало тап-кнопки в study 4. */
  position: relative !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Вложенный блок растянут через inset, а не через height: 100%:
   у родителя высота может оказаться неопределённой, и браузер
   вправе разрешить процент нулём — картинка тогда исчезает.
   contain убирает кадрирование, которое даёт заданный в
   разметке режим aspectFill. */
.uni-card:has([id^="love-"]) .item-image-wipe > div,
.uni-card:has([id^="love-"]) .item-image-scroll > div {
  position: absolute !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

.uni-card:has([id^="love-"]) .item-image-wipe > img,
.uni-card:has([id^="love-"]) .item-image-scroll > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* Сердечко внизу карточки, с отбивкой от панели Collection.
   Область нажатия не меньше 44px, иначе палец попадает в полосу
   жеста «домой» и нажатие до страницы не доходит. */
.uni-card:has([id^="love-"]) .uni-card__actions {
  flex: 0 0 auto !important;
  margin-top: 0 !important;
  padding-top: var(--like-gap) !important;
  padding-bottom: calc(var(--like-gap) + env(safe-area-inset-bottom, 0px)) !important;
}

.uni-card:has([id^="love-"]) .uni-card__actions uni-icons {
  min-width: 44px !important;
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  touch-action: manipulation !important;
}


/* ---- 18. Единая шкала кнопок действия ----------------------
 * Одна высота, одна скруглённость, текст по центру по обеим
 * осям. Под правило попадают Confirm и End browsing (общий
 * класс pop-submit), Back to pics и пилюли «my cart» и
 * «Collection».
 *
 * Круглая кнопка «плюс» исключена по id: у неё в разметке
 * заданы ширина и высота 50px, и общая высота её бы сплющила.
 *
 * Кнопка перехода со стрелкой сюда не входит — у неё type
 * primary и свой размер, заданный в разделе 2.
 */

.pop-submit.pop-submit,
#back,
.shop-foot uni-button[type="warn"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: var(--btn-h) !important;
  min-height: var(--btn-h) !important;
  max-height: var(--btn-h) !important;
  width: auto !important;
  padding: 0 22px !important;
  line-height: 1 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border-radius: calc(var(--btn-h) / 2) !important;
  box-sizing: border-box !important;
}

/* Confirm и End browsing: одинаковая минимальная ширина. */

/* Надпись внутри — тоже флекс-элемент. Собственная line-height
   страницы растягивала её и прижимала текст кверху. */
.pop-submit.pop-submit uni-text,
.pop-submit.pop-submit text {
  line-height: 1 !important;
  font-size: 13px !important;
  display: block !important;
}

/* Back to pics: ширина по тексту, прижата к левому краю. */
#back {
  min-width: 0 !important;
  margin: 0 auto 0 0 !important;
  left: auto !important;
}


/* ---- 19. Нижняя панель галереи -----------------------------
 * Панели задана высота 36px, из-за чего кнопки прижимались
 * вплотную к разделительной линии. Высота теперь по
 * содержимому, с отбивкой сверху и снизу.
 *
 * Условие :has(#back) ограничивает правило галереей — панель
 * корзины и панель Collection на странице фотографии его не
 * получают.
 */

.shop-foot:has(#back) {
  --bar-pad-x: 6px;
  height: auto !important;
  min-height: calc(var(--btn-h) + 20px) !important;
  padding: 10px var(--bar-pad-x) calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  box-sizing: border-box !important;
}

uni-page-body:has(uni-rich-text) .uni-scroll-view-content > uni-view > uni-view:first-child {
  margin-top: 10px !important;
}

uni-page-body:has(uni-rich-text) .uni-scroll-view-content > uni-view {
  padding-bottom: 4px !important;
}

uni-page-body:has(uni-rich-text) .uni-row {
  padding-top: 2px !important;
  padding-bottom: 4px !important;
}



.shop-foot {
  height: auto !important;
  min-height: 60px !important;
  padding: 10px 6px !important;
  padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
}

.shop-foot uni-button#back,
.shop-foot uni-button:not(.pop-submit):not([id^="addtocard-"]),
.shop-foot .pop-submit {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  border-radius: 20px !important;
  padding: 0 22px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
}

.shop-foot .pop-submit {
  min-width: 104px !important;
  width: auto !important;
  margin: 0 0 0 auto !important;
}

.shop-foot uni-button#back,
.shop-foot uni-button:not(.pop-submit):not([id^="addtocard-"]) {
  min-width: 0 !important;
  width: auto !important;
  margin: 0 auto 0 0 !important;
  left: 0 !important;
}

.pop-submit uni-text,
.pop-submit text,
.pop-submit span {
  line-height: 1 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  display: block !important;
}