/* Claude v3.1 · исполнитель F — корзина: маскот «за витриной» (картинка G assets/cart-v31, inc/mascot-map.php: hg_v31_cart_counter и хуки cart/*).
   Блок итогов — прилавок. Картинка (3:2, прозрачный фон: фигура за стеклянной витриной, внизу панель прилавка с логотипом Hub Garage, срезанная
   краем кадра) стоит над блоком: столешница совпадает с верхним краем блока, витрина и панель заходят на его верх, блок окрашен в цвет панели —
   панель прилавка продолжается в блок с ценами и кнопкой. Верх фигуры — над верхним краем блока; реплика cart/quantity (тот же слот C2, без второй
   фигуры) — рядом. Всё — элементы сетки корзины (.hg-cart-layout), без абсолютного позиционирования: высота полосы над таблицей =
   max(реплика, часть кадра над столешницей), цены и кнопки ничем не закрыты, высоты известны до загрузки картинки (width/height) — без сдвигов.
   --hgc-ar — высота/ширина кадра (640/960), --hgc-top — доля высоты до столешницы (G: день .525, ночь .510; .526 — ночная столешница выступает
   над краем блока на 1 %), --hgc-fw — ширина картинки = ширина блока: поле margin-bottom картинки и padding-top блока = fw × ar × (1 − top).
   ПК и планшет (≥681): справа над итогами, реплика слева от неё над таблицей. ≤680: реплика над картинкой, блок и картинка по ширине
   (не шире 480 px). Закреплённая полоса итога (.hg-m3-cartbar, z-index 45, ≤767) — поверх картинки. */

body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure){--hgc-ar:.6667;--hgc-top:.526;--hgc-fw:100%;
  --hgc-inside:calc(var(--hgc-fw) * var(--hgc-ar) * (1 - var(--hgc-top)));--hgc-panel:#e9e8e8;
  grid-template-areas:"say fig" "form card";row-gap:0}
html[data-theme=dark] body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure){--hgc-panel:#39393b}
body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-form{grid-area:form}
body.hg-store.woocommerce-cart .hg-cart-layout>.hgc-figure{grid-area:fig;align-self:end;position:relative;z-index:1;width:100%;margin:0 0 calc(var(--hgc-inside) * -1);line-height:0;pointer-events:none}
/* Стойки витрины (крайние 4 % ширины) растворяются в нижних 24 px кадра — панель прилавка уже одного цвета с блоком, без обрыва стоек;
   середина низа с логотипом Hub Garage не затрагивается. */
body.hg-store.woocommerce-cart .hg-cart-layout>.hgc-figure img{width:100%;max-width:none;height:auto;
  -webkit-mask-image:linear-gradient(#000,#000),linear-gradient(to bottom,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(#000,#000),linear-gradient(to bottom,#000 calc(100% - 24px),transparent);
  -webkit-mask-size:92% 100%,100% 100%;mask-size:92% 100%,100% 100%;-webkit-mask-position:50% 0,0 0;mask-position:50% 0,0 0;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-composite:source-over;mask-composite:add}

/* Блок итогов = нижняя часть прилавка: цвет панели, верх прямой (продолжает прилавок), низ скруглён как прежде */
body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-summary{grid-area:card;margin-top:0;padding-top:var(--hgc-inside);border-radius:0 0 10px 10px;background:var(--hgc-panel)}
body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-summary .cart_totals{padding-top:16px}
html[data-theme=dark] body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-summary :is(th,td,.hg-cart-shipping){border-color:#4b4e53}

/* Реплика: обычный пузырь (не «тихая заметка» слота без фигуры), хвост — к маскоту. Ширина задана: у пузыря container-type (mascot.css),
   без ширины он схлопывается в столбик по знаку. */
body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity{grid-area:say;align-self:center;justify-self:end;display:block;width:min(480px,100%);max-width:none;margin:0;color:var(--hg-ink)}
body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity .hg-mascot-bubble{position:relative;padding:14px 18px;border:1px solid var(--hg-line);border-radius:16px;background:var(--hg-white);box-shadow:0 8px 24px #171b220d}
html[data-theme=dark] body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity .hg-mascot-bubble{box-shadow:none}
body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity .hg-mascot-bubble::before{content:"";position:absolute;top:calc(50% - 6px);right:-7px;width:12px;height:12px;
  border-top:1px solid var(--hg-line);border-right:1px solid var(--hg-line);background:inherit;transform:rotate(45deg)}
body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity .hg-mascot-text{margin:0;font-size:14px;line-height:1.75}

@media (max-width:1050px){
  body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity{width:min(400px,100%)}
}

/* 681–800: как на ПК — реплика над таблицей, картинка над блоком итогов справа; колонка итогов 290 px (как у темы при ≤1050),
   таблица слева уже в карточном виде темы (≤800). Кнопка итогов — на первом экране планшета, без пустой колонки под репликой. */
@media (min-width:681px) and (max-width:800px){
  body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure){--hgc-fw:290px;grid-template-columns:minmax(0,1fr) var(--hgc-fw);column-gap:18px}
  body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity{width:100%}
}

/* ≤680: одна колонка — реплика над картинкой, хвост вниз к голове (фигура по центру кадра); реплика, картинка и блок не шире 480 px,
   по центру (на телефоне 360–390 — по ширине) */
@media (max-width:680px){
  body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure){--hgc-fw:min(100%,480px);grid-template-columns:minmax(0,1fr);grid-template-areas:"form" "say" "fig" "card"}
  body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-form{margin-bottom:22px}
  body.hg-store.woocommerce-cart .hg-cart-layout>.hgc-figure,body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-summary{justify-self:center;width:min(100%,480px)}
  body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity{justify-self:center;width:min(100%,480px);margin:0 0 8px}
  body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity .hg-mascot-bubble{padding:12px 14px}
  body.hg-store.woocommerce-cart .hg-cart-layout>.hg-mascot--cart-quantity .hg-mascot-bubble::before{top:auto;bottom:-7px;right:auto;left:calc(50% - 6px);border-top:0;border-bottom:1px solid var(--hg-line)}
  body.hg-store.woocommerce-cart .hg-cart-layout:has(>.hgc-figure)>.hg-cart-summary .cart_totals{padding-top:14px}
}