/* ================= Стили витрины (22.10) =================
   Разметка, корзина, заказы и оплата у всех стилей общие — здесь только вид.
   Стиль ставит app.js (applyLook): <html data-look="fashion|tech|food|beauty|home|kids">; «classic» — style.css как есть.
   Набор — по спросу в Узбекистане: одежда, техника, еда, косметика, дом, детское.
   Цвета задаём только для светлой витрины (html:not(.dark)), форму — для любой. Цвет кнопок — всегда цвет магазина. */

/* ---------- общее для всех стилей ---------- */
html[data-look] .card{position:relative}
html[data-look] .sheet-head b{letter-spacing:-.01em}

/* ================= Moda — одежда и обувь =================
   Как журнал: фото в рост без рамок, строгие заглавные, чёрно-белая сетка, крупные поля. */
html[data-look="fashion"]:not(.dark){
  --bg:#FFFFFF; --card:#F4F4F2; --line:#E7E7E4; --text:#111111; --hint:#7A7A76; --muted:#7A7A76;
}
html[data-look="fashion"] body{font-family:'Manrope','Onest',-apple-system,sans-serif}
html[data-look="fashion"] .brand-name,html[data-look="fashion"] .sheet-head b{font-family:'Playfair Display',Georgia,serif;font-weight:600}
html[data-look="fashion"] .brand-name{font-size:19px;letter-spacing:.01em}
html[data-look="fashion"]:not(.dark) header{background:rgba(255,255,255,.94)}
html[data-look="fashion"] .search-field{border-radius:0}
html[data-look="fashion"] .bn-track{border-radius:0}
html[data-look="fashion"] .grid{gap:22px 10px}
html[data-look="fashion"]:not(.dark) .card,html[data-look="fashion"] .card{background:transparent;border:0;border-radius:0;box-shadow:none}
html[data-look="fashion"] .card .imgwrap,html[data-look="fashion"]:not(.dark) .card .imgwrap{background:#F3F2EF}
html[data-look="fashion"] .card .ph,html[data-look="fashion"]:not(.dark) .card .ph{aspect-ratio:3/4;object-fit:cover;padding:0;background:#F3F2EF}
html[data-look="fashion"] .card .noph{aspect-ratio:3/4}
html[data-look="fashion"] .card .body{padding:10px 2px 6px;gap:2px}
html[data-look="fashion"] .card .br{font-size:10px;letter-spacing:.14em;color:var(--hint)}
html[data-look="fashion"] .card .nm{font-size:12.5px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;line-height:1.35;-webkit-line-clamp:2}
html[data-look="fashion"] .card .pr{font-size:14px;font-weight:600;padding-top:4px}
html[data-look="fashion"] .card .add{margin:6px 0 0;padding:9px;border-radius:0;background:transparent;color:var(--text);
  border:1px solid var(--text);font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.1em}
html[data-look="fashion"] .card .add svg{display:none}
html[data-look="fashion"] .card .add:disabled{border-color:var(--line);color:var(--hint)}
html[data-look="fashion"] .card .stepper{margin:6px 0 0;border-radius:0;background:transparent;border:1px solid var(--text)}
html[data-look="fashion"] .badge{border-radius:0;background:#111;color:#fff;letter-spacing:.12em}
html[data-look="fashion"] .badge.sale{background:#C0262D}
html[data-look="fashion"] .fav,html[data-look="fashion"] .share{background:transparent;box-shadow:none;color:#111;border-radius:0}
html[data-look="fashion"] .share{display:none}
html[data-look="fashion"] .chips button{border-radius:0}
html[data-look="fashion"] .tile{border-radius:0}
html[data-look="fashion"] .btn{border-radius:0;text-transform:uppercase;letter-spacing:.08em;font-size:14px}
html[data-look="fashion"] .gallery img{aspect-ratio:3/4;object-fit:cover;border-radius:0}
html[data-look="fashion"] .price-big{font-weight:600}

/* ================= Texnika — смартфоны и электроника =================
   Чисто и точно: холодный серый фон, товар на белом, крупная цена, характеристики значками. */
html[data-look="tech"]:not(.dark){
  --bg:#F2F4F7; --card:#FFFFFF; --line:#E3E7EE; --text:#0F172A; --hint:#64748B; --muted:#64748B;
}
html[data-look="tech"] body{font-family:'Manrope','Onest',-apple-system,sans-serif}
html[data-look="tech"]:not(.dark) header{background:rgba(242,244,247,.94)}
html[data-look="tech"] .brand-name{font-weight:800;letter-spacing:-.02em}
html[data-look="tech"] .grid{gap:10px}
html[data-look="tech"]:not(.dark) .card{border:1px solid #E6E9EF;border-radius:14px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
html[data-look="tech"] .card .ph{padding:14px}
html[data-look="tech"] .card .body{padding:10px 12px 10px}
html[data-look="tech"] .card .br{font-size:10.5px;font-weight:700;letter-spacing:.06em;color:#64748B}
html[data-look="tech"] .card .nm{font-size:13.5px;font-weight:600;-webkit-line-clamp:2}
html[data-look="tech"] .card .pr{font-size:17px;font-weight:800;letter-spacing:-.02em}
html[data-look="tech"] .card .add{margin:0 12px 12px;border-radius:10px;font-size:13.5px;padding:10px}
html[data-look="tech"] .card .stepper{margin:0 12px 12px;border-radius:10px}
html[data-look="tech"] .badge{border-radius:5px;letter-spacing:.02em;text-transform:none;font-size:10.5px}
html[data-look="tech"] .fav,html[data-look="tech"] .share{border-radius:10px;box-shadow:none;background:#F2F4F7}
html[data-look="tech"] .chips button{border-radius:10px}
html[data-look="tech"] .tile{border-radius:14px}
html[data-look="tech"] .btn{border-radius:12px}
html[data-look="tech"] .price-big{font-weight:800;letter-spacing:-.02em}
html[data-look="tech"] .gallery img{background:#fff;border-radius:14px}

/* ================= Taom — кафе, фастфуд, продукты =================
   Фото блюда на всю карточку, тёплый фон, круглая «+» прямо на фото, крупная цена — чтобы хотелось заказать. */
html[data-look="food"]:not(.dark){
  --bg:#FFF7EE; --card:#FFFFFF; --line:#F1E3D3; --text:#2A1A0E; --hint:#8A7462; --muted:#8A7462;
}
html[data-look="food"] body{font-family:'Nunito','Onest',-apple-system,sans-serif}
html[data-look="food"]:not(.dark) header{background:rgba(255,247,238,.94)}
html[data-look="food"] .brand-name{font-weight:800}
html[data-look="food"] .bn-track{border-radius:22px}
html[data-look="food"] .grid{gap:12px}
html[data-look="food"] .card,html[data-look="food"]:not(.dark) .card{border:0;border-radius:22px;
  box-shadow:0 6px 18px -8px rgba(120,60,10,.25);display:grid;grid-template-columns:100%;grid-template-rows:auto 1fr}
html[data-look="food"] .card .imgwrap{grid-row:1;grid-column:1}
html[data-look="food"] .card .ph,html[data-look="food"]:not(.dark) .card .ph{aspect-ratio:1;object-fit:cover;padding:0;background:#F6EADB}
html[data-look="food"] .card .body{grid-row:2;padding:10px 12px 14px;gap:2px}
html[data-look="food"] .card .nm{font-size:15px;font-weight:700;line-height:1.25;-webkit-line-clamp:2}
html[data-look="food"] .card .pr{font-size:18px;font-weight:800;letter-spacing:-.01em;padding-top:4px}
/* «+» и счётчик — поверх фото, в правом нижнем углу */
html[data-look="food"] .card>.add,html[data-look="food"] .card>.stepper{grid-row:1;grid-column:1;align-self:end;justify-self:end;margin:0 10px 10px 0;z-index:2}
html[data-look="food"] .card>.add:not(:disabled){width:44px;height:44px;padding:0;border-radius:50%;font-size:0;
  box-shadow:0 6px 14px -4px rgba(0,0,0,.35)}
html[data-look="food"] .card>.add:not(:disabled) svg,html[data-look="food"] .card>.add:not(:disabled) span{display:none}
html[data-look="food"] .card>.add:not(:disabled)::before{content:"+";font-size:30px;font-weight:600;line-height:1;margin-top:-3px}
html[data-look="food"] .card>.add:disabled{font-size:12px;padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.92)}
html[data-look="food"] .card>.stepper{background:#fff;border-radius:99px;height:40px;width:124px;box-shadow:0 6px 14px -4px rgba(0,0,0,.3)}
html[data-look="food"] .card>.stepper span{border:0;line-height:40px}
html[data-look="food"] .share{display:none}
html[data-look="food"] .fav{border-radius:50%}
html[data-look="food"] .badge{border-radius:99px;text-transform:none;letter-spacing:0;font-size:11px;padding:4px 9px}
html[data-look="food"] .chips button{border-radius:99px;font-weight:700}
html[data-look="food"] .tile{border-radius:22px}
html[data-look="food"] .btn{border-radius:99px;font-weight:800}
html[data-look="food"] .gallery img{aspect-ratio:4/3;object-fit:cover;border-radius:20px}
html[data-look="food"] .price-big{font-weight:800}

/* ================= Go‘zallik — косметика, парфюм, уход, цветы =================
   Нежно и дорого: пудровый фон, изящный шрифт с засечками в названиях, вытянутые фото, много воздуха. */
html[data-look="beauty"]:not(.dark){
  --bg:#FBF5F2; --card:#FFFFFF; --line:#EEDFD8; --text:#2B1F1D; --hint:#8E7B76; --muted:#8E7B76;
}
html[data-look="beauty"]:not(.dark) header{background:rgba(251,245,242,.94)}
html[data-look="beauty"] .brand-name,html[data-look="beauty"] .sheet-head b,html[data-look="beauty"] .card .nm{
  font-family:'Cormorant Garamond',Georgia,serif}
html[data-look="beauty"] .brand-name{font-size:21px;font-weight:600}
html[data-look="beauty"] .search-field{border-radius:99px}
html[data-look="beauty"] .bn-track{border-radius:24px}
html[data-look="beauty"] .grid{gap:14px 12px}
html[data-look="beauty"]:not(.dark) .card{border:1px solid #F0E3DD;border-radius:22px}
html[data-look="beauty"] .card .imgwrap,html[data-look="beauty"]:not(.dark) .card .imgwrap{background:#F7EDE9}
html[data-look="beauty"] .card .ph,html[data-look="beauty"]:not(.dark) .card .ph{aspect-ratio:4/5;object-fit:contain;padding:16px;background:#F7EDE9}
html[data-look="beauty"] .card .noph{aspect-ratio:4/5}
html[data-look="beauty"] .card .body{padding:11px 13px 8px;gap:3px}
html[data-look="beauty"] .card .br{font-size:9.5px;letter-spacing:.16em}
html[data-look="beauty"] .card .nm{font-size:17px;font-weight:600;line-height:1.15;-webkit-line-clamp:2;letter-spacing:0}
html[data-look="beauty"] .card .pr{font-size:14.5px;font-weight:600}
html[data-look="beauty"] .card .add{border-radius:99px;margin:0 12px 13px;font-size:13px;letter-spacing:.02em}
html[data-look="beauty"] .card .stepper{border-radius:99px;margin:0 12px 13px}
html[data-look="beauty"] .badge{border-radius:99px;text-transform:none;letter-spacing:.02em;font-weight:600}
html[data-look="beauty"] .fav,html[data-look="beauty"] .share{border-radius:50%;box-shadow:none;background:rgba(255,255,255,.85)}
html[data-look="beauty"] .chips button{border-radius:99px}
html[data-look="beauty"] .tile{border-radius:22px}
html[data-look="beauty"] .btn{border-radius:99px}
html[data-look="beauty"] .gallery img{aspect-ratio:4/5;background:#F7EDE9;border-radius:22px}
html[data-look="beauty"] .sheet-head b{font-size:21px;font-weight:600;line-height:1.15}

/* ================= Uy — дом, интерьер, хозтовары =================
   Спокойно и тепло: льняной фон, мягкие тени, засечки в заголовках, фото с интерьером почти без полей. */
html[data-look="home"]:not(.dark){
  --bg:#F4EFE7; --card:#FFFFFF; --line:#E4DCCF; --text:#2C2620; --hint:#7D7366; --muted:#7D7366;
}
html[data-look="home"]:not(.dark) header{background:rgba(244,239,231,.94)}
html[data-look="home"] .brand-name,html[data-look="home"] .sheet-head b{font-family:'Lora',Georgia,serif;font-weight:600}
html[data-look="home"] .grid{gap:12px}
html[data-look="home"]:not(.dark) .card{border:0;border-radius:16px;box-shadow:0 8px 22px -14px rgba(60,45,25,.35)}
html[data-look="home"] .card .imgwrap,html[data-look="home"]:not(.dark) .card .imgwrap{background:#EEE7DB}
html[data-look="home"] .card .ph,html[data-look="home"]:not(.dark) .card .ph{aspect-ratio:4/5;object-fit:cover;padding:0;background:#EEE7DB}
html[data-look="home"] .card .noph{aspect-ratio:4/5}
html[data-look="home"] .card .body{padding:11px 12px 8px}
html[data-look="home"] .card .nm{font-family:'Lora',Georgia,serif;font-size:14.5px;font-weight:500;line-height:1.3;-webkit-line-clamp:2}
html[data-look="home"] .card .pr{font-size:15.5px;font-weight:700}
html[data-look="home"] .card .add{border-radius:10px;margin:0 12px 12px}
html[data-look="home"] .card .stepper{border-radius:10px;margin:0 12px 12px}
html[data-look="home"] .badge{border-radius:6px;text-transform:none;letter-spacing:.01em}
html[data-look="home"] .fav,html[data-look="home"] .share{border-radius:50%;box-shadow:none}
html[data-look="home"] .tile{border-radius:16px}
html[data-look="home"] .btn{border-radius:12px}
html[data-look="home"] .gallery img{aspect-ratio:4/5;object-fit:cover;border-radius:16px}

/* ================= Bolalar — детская одежда, игрушки, всё для малышей =================
   Весело и мягко: цветные подложки у фото, круглые формы, пухлый шрифт, кнопка «пружинит». */
html[data-look="kids"]:not(.dark){
  --bg:#FFFBF0; --card:#FFFFFF; --line:#F3E7C8; --text:#2D2A3E; --hint:#7C7891; --muted:#7C7891;
}
html[data-look="kids"] body{font-family:'Nunito','Onest',-apple-system,sans-serif}
html[data-look="kids"]:not(.dark) header{background:rgba(255,251,240,.94)}
html[data-look="kids"] .brand-name,html[data-look="kids"] .sheet-head b{font-family:'Comfortaa','Nunito',sans-serif;font-weight:700}
html[data-look="kids"] .search-field{border-radius:99px}
html[data-look="kids"] .bn-track{border-radius:26px}
html[data-look="kids"] .grid{gap:12px}
html[data-look="kids"]:not(.dark) .card{border:0;border-radius:26px;box-shadow:0 6px 16px -10px rgba(45,42,62,.3)}
html[data-look="kids"] .card .imgwrap{--kid:#FFE9A8}
html[data-look="kids"] .grid>.card:nth-child(4n+2) .imgwrap{--kid:#CFEFE3}
html[data-look="kids"] .grid>.card:nth-child(4n+3) .imgwrap{--kid:#FFD9E2}
html[data-look="kids"] .grid>.card:nth-child(4n+4) .imgwrap{--kid:#D6E6FF}
html[data-look="kids"] .card .imgwrap,html[data-look="kids"]:not(.dark) .card .imgwrap{background:var(--kid);margin:8px 8px 0;border-radius:20px;overflow:hidden}
html[data-look="kids"] .card .ph,html[data-look="kids"]:not(.dark) .card .ph{padding:12px;background:transparent}
html[data-look="kids"] .card .body{padding:10px 12px 8px}
html[data-look="kids"] .card .nm{font-size:14.5px;font-weight:700;-webkit-line-clamp:2}
html[data-look="kids"] .card .pr{font-size:17px;font-weight:800}
html[data-look="kids"] .card .add{border-radius:99px;margin:0 12px 12px;font-weight:800;transition:transform .2s cubic-bezier(.3,1.6,.5,1)}
html[data-look="kids"] .card .add:active{transform:scale(.9)}
html[data-look="kids"] .card .stepper{border-radius:99px;margin:0 12px 12px}
html[data-look="kids"] .badge{border-radius:99px;text-transform:none;letter-spacing:0;font-size:11px;padding:4px 9px}
html[data-look="kids"] .fav,html[data-look="kids"] .share{border-radius:50%;box-shadow:none}
html[data-look="kids"] .chips button{border-radius:99px;font-weight:700}
html[data-look="kids"] .tile{border-radius:26px}
html[data-look="kids"] .btn{border-radius:99px;font-weight:800}
html[data-look="kids"] .gallery img{border-radius:24px;background:#FFF3CF}

/* ================= Устройство главной по нишам (looks.js) ================= */
/* строка на карточке: вес и калории, размеры, характеристики, объём, материал */
.lk-line{font-size:11.5px;color:var(--hint);display:flex;flex-wrap:wrap;gap:0 5px;line-height:1.35;margin-top:2px}
.lk-line em{font-style:normal;opacity:.6}
.lk-inst{align-self:flex-start;margin-top:5px;font-size:10.5px;font-weight:700;padding:3px 7px;border-radius:6px;
  background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent)}

/* вкладки разделов (одежда, дом, еда внутри раздела); у еды на главной — липкие, ведут к разделу меню */
.lk-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 12px;padding:2px 16px 4px}
.lk-tabs::-webkit-scrollbar{display:none}
.lk-tabs button{flex:none;border:1px solid var(--line);background:var(--card);color:var(--text);font:inherit;font-size:13.5px;font-weight:600;
  padding:8px 14px;border-radius:99px;cursor:pointer;white-space:nowrap}
.lk-tabs button.on{background:var(--text);color:var(--bg);border-color:var(--text)}
.lk-tabs.sticky{position:sticky;top:-10px;z-index:5;margin-top:-4px;padding-top:10px;padding-bottom:10px;background:var(--bg)}

/* ленты карточек: «Ommabop», «Bestsellerlar» */
.lk-strip{margin:0 0 16px}
.lk-strip h3,.lk-sec h3{font-size:19px;font-weight:800;letter-spacing:-.02em;margin:6px 0 10px}
.lk-strip-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px 6px;scroll-snap-type:x proximity}
.lk-strip-row::-webkit-scrollbar{display:none}
.lk-strip-row .card{flex:0 0 44%;scroll-snap-align:start}
.lk-strip-row.two .card{flex:1 1 0;min-width:0}          /* два товара — во всю ширину, без пустой полосы справа */
.lk-sec{margin-bottom:18px;scroll-margin-top:62px}

/* кружки и плитки разделов */
.lk-rail{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 14px;padding:2px 16px 4px}
.lk-rail::-webkit-scrollbar{display:none}
.lk-rail button{flex:none;border:0;background:none;padding:0;font:inherit;color:var(--text);cursor:pointer;display:flex;flex-direction:column;
  align-items:center;gap:6px;width:72px}
.lk-rail small{font-size:11.5px;line-height:1.2;text-align:center;max-width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lk-pic{display:grid;place-items:center;overflow:hidden;background:var(--card)}
.lk-pic img{width:100%;height:100%;object-fit:cover;display:block}
.lk-pic{color:var(--accent)}             /* 23.10: значки наборов красятся цветом (currentColor), а не stroke */
.lk-pic svg{width:28px;height:28px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.lk-pic b{font-size:22px;color:var(--accent)}
/* «сторис»: кольцо в цвете магазина */
.lk-stories .lk-pic{width:66px;height:66px;border-radius:50%;padding:3px;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 45%,#F5C3A8))}
.lk-stories .lk-pic img,.lk-stories .lk-pic svg,.lk-stories .lk-pic b{border-radius:50%;background:#fff;border:2px solid #fff}
.lk-stories .lk-pic img{width:100%;height:100%}
.lk-stories .lk-pic svg,.lk-stories .lk-pic b{width:100%;height:100%;display:grid;place-items:center;padding:14px}
.lk-stories button.on small{font-weight:700}
/* техника: квадратные плитки с фото устройства */
.lk-tiles button{width:78px}
.lk-tiles .lk-pic{width:78px;height:78px;border-radius:18px;background:#fff;border:1px solid var(--line);padding:8px}
.lk-tiles .lk-pic img{object-fit:contain}
.lk-tiles button.on .lk-pic{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 25%,transparent)}
/* детское: цветные пузыри */
.lk-bubbles .lk-pic{width:68px;height:68px;border-radius:50%;padding:8px;background:#FFE9A8}
.lk-bubbles button:nth-child(4n+2) .lk-pic{background:#CFEFE3}
.lk-bubbles button:nth-child(4n+3) .lk-pic{background:#FFD9E2}
.lk-bubbles button:nth-child(4n+4) .lk-pic{background:#D6E6FF}
.lk-bubbles .lk-pic img{object-fit:contain;border-radius:50%}
.lk-bubbles small{font-weight:700}

/* еда: доставка одной строкой */
.lk-deliv{display:flex;align-items:center;gap:9px;margin:0 0 12px;padding:10px 13px;border-radius:16px;background:var(--card);
  font-size:13px;color:var(--text);border:1px solid var(--line)}
.lk-deliv i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}
.lk-deliv i svg{width:17px;height:17px}
.lk-deliv span{display:flex;flex-wrap:wrap;gap:0 6px;line-height:1.4}
.lk-deliv em{font-style:normal;color:var(--hint)}
/* еда: корзина с суммой поверх нижнего меню */
.lk-cart{position:fixed;left:14px;right:14px;bottom:calc(var(--tabbar-h, 60px) + var(--tab-gap, 8px) + 10px);z-index:41;
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border:0;border-radius:18px;
  background:var(--accent);color:var(--accent-text);font:inherit;font-size:15px;font-weight:700;cursor:pointer;
  box-shadow:0 12px 28px -10px color-mix(in srgb,var(--accent) 70%,transparent)}
.lk-cart[hidden]{display:none}
.lk-cart b{font-size:16px}
body:has(.lk-cart:not([hidden])) .agent-fab{display:none}

/* техника: полоса доверия */
.lk-trust{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 12px;padding:0 16px}
.lk-trust::-webkit-scrollbar{display:none}
.lk-trust span{flex:none;display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:12px;background:#fff;border:1px solid var(--line);
  font-size:12.5px;font-weight:600;white-space:nowrap}
.lk-trust i{display:grid;place-items:center;color:var(--accent)}
.lk-trust i svg{width:16px;height:16px}

/* дом: комнаты крупными плитками */
.lk-rooms{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}
.lk-rooms button{position:relative;border:0;padding:0;border-radius:16px;overflow:hidden;cursor:pointer;aspect-ratio:4/3;background:var(--card)}
.lk-rooms .lk-pic{position:absolute;inset:0}
.lk-rooms b{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;text-align:left;color:#fff;font-size:15px;
  font-family:'Lora',Georgia,serif;background:linear-gradient(0deg,rgba(0,0,0,.55),transparent)}

/* одежда: каждая седьмая карточка — крупная, во всю ширину, как в журнале.
   23.10: только на телефоне и планшете (2–3 колонки). На компьютере 5 колонок — карточка во всю ширину оставляла бы
   пустые места в ряду, поэтому там сетка ровная. */
@media (max-width:899px){
  html[data-look="fashion"] .grid>.card:nth-child(7n+3){grid-column:1/-1}
  html[data-look="fashion"] .grid>.card:nth-child(7n+3) .ph{aspect-ratio:4/5}
  html[data-look="fashion"] .grid>.card:nth-child(7n+3) .nm{font-size:14px}
}
html[data-look="fashion"] .lk-tabs button{border:0;border-radius:0;background:none;padding:8px 2px;margin-right:14px;font-size:12.5px;
  text-transform:uppercase;letter-spacing:.12em;color:var(--hint);border-bottom:2px solid transparent}
html[data-look="fashion"] .lk-tabs button.on{color:var(--text);border-bottom-color:var(--text);background:none}
html[data-look="fashion"] .lk-line{letter-spacing:.06em;text-transform:uppercase;font-size:10.5px}

/* еда: тёплые вкладки меню и лента «Ommabop» */
html[data-look="food"] .lk-tabs button{border:0;background:#fff;box-shadow:0 2px 8px -4px rgba(120,60,10,.3)}
html[data-look="food"] .lk-tabs button.on{background:var(--accent);color:var(--accent-text)}
html[data-look="food"] .lk-strip h3,html[data-look="food"] .lk-sec h3{font-size:21px}
html[data-look="beauty"] .lk-strip h3{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;font-weight:600;letter-spacing:0}
html[data-look="home"] .lk-tabs button.on{background:#2C2620;border-color:#2C2620}

/* ================= 23.10: «Еда списком» (food_list) — меню строками, как в доставке =================
   Блюдо читают сверху вниз: слева название, вес и цена, справа фото с «+». Лента «Ommabop» остаётся карточками.
   Владелец 23.10: прежняя «Еда» (карточки) нравилась больше — она снова «food», а строки — отдельный выбор (data-lv="list"). */
html[data-look="food"][data-lv="list"] .grid{grid-template-columns:1fr;gap:10px}
html[data-look="food"][data-lv="list"] .grid>.card{grid-template-columns:minmax(0,1fr) 116px;grid-template-rows:auto;min-height:128px;border-radius:20px}
html[data-look="food"][data-lv="list"] .grid>.card .imgwrap{grid-row:1;grid-column:2;margin:8px 8px 8px 0;border-radius:16px;overflow:hidden;align-self:center}
html[data-look="food"][data-lv="list"] .grid>.card .ph,html[data-look="food"][data-lv="list"]:not(.dark) .grid>.card .ph{aspect-ratio:1;border-radius:16px}
html[data-look="food"][data-lv="list"] .grid>.card .body{grid-row:1;grid-column:1;padding:13px 6px 13px 14px;justify-content:center}
html[data-look="food"][data-lv="list"] .grid>.card .nm{font-size:15.5px;-webkit-line-clamp:2}
html[data-look="food"][data-lv="list"] .grid>.card .pr{font-size:17px;padding-top:6px}
html[data-look="food"][data-lv="list"] .grid>.card>.add,html[data-look="food"][data-lv="list"] .grid>.card>.stepper{grid-row:1;grid-column:2;margin:0 14px 14px 0}
html[data-look="food"][data-lv="list"] .grid>.card>.add:not(:disabled){width:38px;height:38px}
html[data-look="food"][data-lv="list"] .grid>.card>.add:not(:disabled)::before{font-size:26px}
html[data-look="food"][data-lv="list"] .grid>.card>.stepper{width:100px;height:34px;margin:0 8px 14px 0}
html[data-look="food"][data-lv="list"] .grid>.card>.stepper span{line-height:34px;min-width:28px}   /* 23.10 (круг 8): цифра уже — кнопки «−/+» 36 px вместо 28 */
html[data-look="food"][data-lv="list"] .grid>.card .badges{left:6px;top:6px}
html[data-look="food"][data-lv="list"] .grid>.card .fav{width:32px;height:32px;top:6px;right:6px}
/* 23.10 (круг 8): сердечко маленькое — невидимая зона нажатия вокруг, ~44 px */
html[data-look="food"][data-lv="list"] .grid>.card .fav::after{content:"";position:absolute;inset:-6px}
html[data-look="food"][data-lv="list"] .grid>.card .badge{font-size:10px;padding:3px 7px}

/* ================= Salomatlik — витамины, БАДы, аптека =================
   Чисто и спокойно, как в хорошей аптеке: светлый мятный фон, баночка на белом, форма и дозировка чипами,
   доверие (оригинал, сертификат, совет) — первым. */
html[data-look="health"]:not(.dark){
  --bg:#F3F7F5; --card:#FFFFFF; --line:#DCE8E2; --text:#0F241C; --hint:#5B6F67; --muted:#5B6F67;
}
html[data-look="health"] body{font-family:'Manrope','Onest',-apple-system,sans-serif}
html[data-look="health"]:not(.dark) header{background:rgba(243,247,245,.94)}
html[data-look="health"] .brand-name{font-weight:800;letter-spacing:-.02em}
html[data-look="health"] .search-field{border-radius:14px}
html[data-look="health"] .bn-track{border-radius:18px}
html[data-look="health"] .grid{gap:10px}
html[data-look="health"]:not(.dark) .card{border:1px solid #E1ECE6;border-radius:18px;box-shadow:none}
html[data-look="health"] .card .imgwrap,html[data-look="health"]:not(.dark) .card .imgwrap{background:#EEF5F1;margin:6px 6px 0;border-radius:14px;overflow:hidden}
html[data-look="health"] .card .ph,html[data-look="health"]:not(.dark) .card .ph{aspect-ratio:1;object-fit:contain;padding:14px;background:transparent}
html[data-look="health"] .card .body{padding:10px 12px 8px;gap:3px}
html[data-look="health"] .card .br{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--accent)}
html[data-look="health"] .card .nm{font-size:13.5px;font-weight:600;line-height:1.3;-webkit-line-clamp:2}
html[data-look="health"] .card .pr{font-size:16.5px;font-weight:800;letter-spacing:-.01em;padding-top:2px}
html[data-look="health"] .card .add{margin:0 10px 10px;border-radius:12px;background:transparent;color:var(--accent);
  border:1.5px solid color-mix(in srgb,var(--accent) 55%,transparent);font-weight:700;font-size:13px;padding:9px}
html[data-look="health"] .card .add:disabled{border-color:var(--line);color:var(--hint)}
html[data-look="health"] .card .stepper{margin:0 10px 10px;border-radius:12px}
html[data-look="health"] .badge{border-radius:6px;text-transform:none;letter-spacing:0;font-size:10.5px}
html[data-look="health"] .fav,html[data-look="health"] .share{border-radius:10px;box-shadow:none;background:rgba(255,255,255,.9)}
html[data-look="health"] .chips button{border-radius:12px}
html[data-look="health"] .tile{border-radius:16px}
html[data-look="health"] .btn{border-radius:14px}
html[data-look="health"] .gallery img{background:#EEF5F1;border-radius:16px;object-fit:contain}
html[data-look="health"] .price-big{font-weight:800}
/* форма · дозировка · упаковка */
.lk-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.lk-chip{font-size:10.5px;font-weight:600;line-height:1.3;padding:3px 7px;border-radius:6px;color:#2E5446;background:#E7F1EC}
html.dark .lk-chip{color:var(--text);background:color-mix(in srgb,var(--accent) 18%,transparent)}
/* «для чего»: пилюли со значком */
.lk-goals{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 14px;padding:2px 16px 4px}
.lk-goals::-webkit-scrollbar{display:none}
.lk-goals button{flex:none;display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);color:var(--text);
  font:inherit;font-size:13px;font-weight:600;padding:7px 13px 7px 8px;border-radius:12px;cursor:pointer;white-space:nowrap}
.lk-goals button:first-child{padding-left:13px}
.lk-goals i{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent)}
.lk-goals i svg{width:15px;height:15px;fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lk-goals i b{font-size:12px;color:var(--accent)}
.lk-goals button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}
.lk-goals button.on i{background:rgba(255,255,255,.22)}
.lk-goals button.on i svg{stroke:var(--accent-text)}
.lk-goals button.on i{color:var(--accent-text)}
.lk-goals button.on i b{color:var(--accent-text)}
.lk-health span{background:var(--card)}

/* ================= Gullar — цветы и подарки =================
   Букет — главное: фото во всю высоту карточки, имя курсивом с засечками, «доставим сегодня» сразу под баннером. */
html[data-look="flowers"]:not(.dark){
  --bg:#FFF7F6; --card:#FFFFFF; --line:#F3DFDF; --text:#2F1B21; --hint:#8C6E75; --muted:#8C6E75;
}
html[data-look="flowers"] body{font-family:'Nunito','Onest',-apple-system,sans-serif}
html[data-look="flowers"]:not(.dark) header{background:rgba(255,247,246,.94)}
html[data-look="flowers"] .brand-name,html[data-look="flowers"] .sheet-head b{font-family:'Playfair Display',Georgia,serif;font-weight:600}
html[data-look="flowers"] .search-field{border-radius:99px}
html[data-look="flowers"] .bn-track{border-radius:24px}
html[data-look="flowers"] .grid{gap:14px 10px}
html[data-look="flowers"] .card,html[data-look="flowers"]:not(.dark) .card{border:0;border-radius:22px;overflow:hidden;
  box-shadow:0 10px 24px -16px rgba(120,40,60,.45);display:grid;grid-template-columns:100%}
html[data-look="flowers"] .card .imgwrap{grid-row:1;grid-column:1}
html[data-look="flowers"] .card .ph,html[data-look="flowers"]:not(.dark) .card .ph{aspect-ratio:3/4;object-fit:cover;padding:0;background:#F8E9E9}
html[data-look="flowers"] .card .noph{aspect-ratio:3/4}
html[data-look="flowers"] .card .body{grid-row:2;padding:11px 12px 6px;gap:2px}
html[data-look="flowers"] .card .nm{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:16px;font-weight:500;line-height:1.2;-webkit-line-clamp:2}
html[data-look="flowers"] .card .pr{font-size:16px;font-weight:700;padding-top:3px}
html[data-look="flowers"] .card>.add,html[data-look="flowers"] .card>.stepper{grid-row:3;margin:4px 12px 12px;border-radius:99px}
html[data-look="flowers"] .card>.add{font-weight:700;font-size:13px}
html[data-look="flowers"] .badge{border-radius:99px;text-transform:none;letter-spacing:0;font-size:11px;padding:4px 9px}
html[data-look="flowers"] .fav,html[data-look="flowers"] .share{border-radius:50%;box-shadow:none;background:rgba(255,255,255,.88)}
html[data-look="flowers"] .chips button{border-radius:99px}
html[data-look="flowers"] .tile{border-radius:22px}
html[data-look="flowers"] .btn{border-radius:99px;font-weight:700}
html[data-look="flowers"] .gallery img{aspect-ratio:3/4;object-fit:cover;border-radius:22px}
html[data-look="flowers"] .sheet-head b{font-style:italic;font-size:21px}
html[data-look="flowers"] .lk-strip h3{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-weight:500;font-size:22px;letter-spacing:0}
html[data-look="flowers"] .lk-stories .lk-pic{background:linear-gradient(135deg,var(--accent),#F7B9C4)}
.lk-today i{background:color-mix(in srgb,var(--accent) 16%,transparent)}

/* 23.10: на компьютере строки еды/меню — в две колонки, иначе одна строка растягивалась на весь экран, фото улетало вправо */
@media (min-width:900px){
  html[data-look="food"][data-lv="list"] .grid{grid-template-columns:1fr 1fr;gap:12px}
}
