/* Общая оболочка магазина: токены, шапка (П15), подвал и cookie (П16), плитка товара (П24), тосты.
   Грузят карточка (+ card.css), листинги (+ listing.css), 404 и «Спасибо за заказ». ТЗ: docs/TZ-2026-11-04-home-transfer.md,
   docs/TZ-2026-11-04-listing-transfer.md. Системный шрифт, без библиотек. .gl — стекло с размытием (≤ 12 в окне), .gl0 — без. */
:root{--ink:#1d1d1f;--ink2:#424245;--mut:#6e6e73;--mut2:#86868b;--line:#e8e8ed;--acc:#0071e3;--acc-d:#0062c4;--lnk:#0066cc;--ok:#1a7f37;--ok-dot:#34c759;
--ord:#b25000;--ord-dot:#ff9f0a;--glass:rgba(255,255,255,.62);--glass-b:rgba(255,255,255,.85);
--sh:0 0 0 1px rgba(0,0,0,.05),0 10px 30px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.95);--blur:blur(24px) saturate(180%);
--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:132px}
body.es{margin:0;font:15px/1.5 var(--font);color:var(--ink);background:#eef1f6;-webkit-font-smoothing:antialiased;padding-bottom:96px}
.es-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;background:
radial-gradient(620px 620px at 50% -60px,rgba(156,107,62,.20),transparent 70%),
radial-gradient(700px 700px at 85% 75%,rgba(0,113,227,.14),transparent 70%),
radial-gradient(560px 560px at -5% 55%,rgba(30,30,31,.08),transparent 70%),
linear-gradient(165deg,#fbfbfd 0%,#eef1f6 55%,#e7ebf2 100%)}
a{color:var(--lnk);text-decoration:none}a:hover{color:#004499;text-decoration:underline}
img{max-width:100%;height:auto}
h1,h2,h3,p{margin:0}
.mut{color:var(--mut2)}
.ph{display:inline-block;padding:0 7px;border:1px solid #d97706;border-radius:999px;background:#fff7ed;color:#9a4b00;font-weight:600;font-size:.85em;line-height:1.6}
.es-skip{position:absolute;left:-999px}.es-skip:focus{left:16px;top:16px;z-index:50;background:#fff;padding:8px 12px;border-radius:8px}
.gl{background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-b);box-shadow:var(--sh)}
.gl0{background:rgba(255,255,255,.72);border:1px solid var(--glass-b);box-shadow:0 0 0 1px rgba(0,0,0,.05),0 4px 14px rgba(0,0,0,.06)}
/* панели с фото: backdrop-filter ломает mix-blend-mode (белый фон кадра не сливается) — у них стекло без размытия */
.es-gal.gl,.tile__im.gl,.es-docs__img.gl,.es-ft.gl{-webkit-backdrop-filter:none;backdrop-filter:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.gl{background:rgba(255,255,255,.96)}}
@media (prefers-reduced-transparency:reduce){.gl{background:rgba(255,255,255,.96);-webkit-backdrop-filter:none;backdrop-filter:none}}
.ico{width:20px;height:20px;flex:0 0 20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ico--s{width:18px;height:18px;flex-basis:18px}.ico--ok{color:var(--ok)}
.ibtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:0;background:none;color:var(--ink);cursor:pointer;padding:0;position:relative;font:inherit;font-size:22px;list-style:none}
.ibtn::-webkit-details-marker{display:none}
.es-hd .ibtn{border-radius:12px}.es-hd .ibtn:hover{background:rgba(0,0,0,.06);text-decoration:none;color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 22px;border-radius:14px;border:0;font:600 16px/1 var(--font);cursor:pointer;color:var(--ink);text-decoration:none;white-space:nowrap}
.btn:hover{text-decoration:none}
.btn--a{background:var(--acc);color:#fff}.btn--a:hover{background:var(--acc-d);color:#fff}
.btn--g{color:var(--ink)}.btn--g:hover{background:#fff;color:var(--ink)}
.btn--o{background:#fff;box-shadow:inset 0 0 0 1.5px var(--ink);height:48px}
.btn--s{height:40px;padding:0 16px;font-size:14px;border-radius:11px}
.lnk{border:0;background:none;padding:0;font:inherit;font-weight:500;color:var(--lnk);cursor:pointer}.lnk:hover{text-decoration:underline}
.stt{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:500;color:var(--ok)}
.stt::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok-dot);flex:none}
.stt--order{color:var(--ord)}.stt--order::before{background:var(--ord-dot)}
.stt--out{color:var(--mut)}.stt--out::before{background:var(--mut2)}
.flag{display:inline-block;width:18px;height:13px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.12);vertical-align:-2px;margin-right:7px}
.es-wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.es-desk{display:none}

/* ── шапка П15: телефон — плашка (меню, логотип, звонок, избранное) + нижняя панель; ПК — верхняя строка + основная ── */
.es-top{display:none}
.es-hd{position:sticky;top:10px;z-index:20;margin:10px 10px 0;height:52px;border-radius:18px;display:flex;align-items:center;gap:4px;padding:0 6px}
/* стекло шапки — на подложке ::before, не на самой шапке: backdrop-filter у шапки делал её «корнем размытия», и вложенное меню
   «Каталог» размывало только шапку — страница под меню просвечивала (Лёша 05.11). Вид шапки тот же. */
.es-hd.gl{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:transparent;box-shadow:none}
.es-hd.gl::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:var(--glass);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);border:1px solid var(--glass-b);box-shadow:var(--sh);pointer-events:none}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.es-hd.gl::before{background:rgba(255,255,255,.96)}}
@media (prefers-reduced-transparency:reduce){.es-hd.gl::before{background:rgba(255,255,255,.96);-webkit-backdrop-filter:none;backdrop-filter:none}}
.es-hd__logo{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;padding-left:4px;color:var(--ink)}
.es-hd__logo:hover{text-decoration:none;color:var(--ink)}
.es-hd__logo img{height:28px;width:auto;display:block}
.es-hd__tag{display:none}
.es-hd__nav{order:-1;display:flex;align-items:center}
.es-hd__nav>a,.es-hd__srch,.es-hd__tel,.es-hd__ic .es-desk{display:none}
.es-hd__ic{display:flex;align-items:center}
.es-cnt{position:absolute;top:4px;right:2px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--acc);color:#fff;font-size:10px;font-weight:600;line-height:16px;text-align:center}
.ph-ic{box-shadow:inset 0 0 0 1.5px #d97706}
/* «Каталог»: на ПК — тёмная кнопка и выпадашка, на телефоне — бургер и лист меню (одна копия ссылок) */
.es-cat>summary{list-style:none;cursor:pointer}.es-cat>summary::-webkit-details-marker{display:none}
.es-cat__b{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:40px;height:40px;border-radius:12px;color:var(--ink)}
.es-cat__b span{display:none}
/* left/top — от окна: до 05.11 их отсчитывала шапка (её backdrop-filter — точка отсчёта для fixed), отсюда 21 = 10 поле + 1 рамка
   + 10 и 79 = 10 + 1 + 68; стекло меню — то же, что у шапки (.gl), размытие работает после переноса стекла шапки на ::before */
.es-cat__p{position:fixed;left:21px;right:21px;top:79px;max-height:calc(100vh - 160px);overflow-y:auto;overscroll-behavior:contain;border-radius:18px;padding:12px 16px 14px;z-index:25}
.es-cat__p form{display:flex;gap:8px;margin-bottom:6px}
.es-cat__p input{flex:1;min-width:0;height:44px;border:1px solid rgba(0,0,0,.1);border-radius:12px;padding:0 12px;font:16px var(--font);background:#fff}
.es-cat__l a,.es-cat__m>a{display:flex;justify-content:space-between;gap:12px;color:var(--ink);padding:10px 0;border-bottom:1px solid rgba(0,0,0,.06);font-size:15px}
.es-cat__l a:hover,.es-cat__m>a:hover{text-decoration:none;color:var(--ink)}
.es-cat__l a{justify-content:flex-start}
.es-cat__l a span{color:var(--mut2);font-size:13px;margin-left:auto}
.es-cat__ic{width:22px;height:22px;flex:0 0 22px;stroke-width:1.5;color:var(--ink2)}
.es-cat__l a[aria-current] .es-cat__ic{color:var(--acc)}
.es-cat__l a[aria-current]{font-weight:600}
.es-cat__l a[aria-current] span{color:var(--ink)}
.es-cat__all{display:none}
.es-cat__m{margin-top:6px;border-top:1px solid rgba(0,0,0,.08)}
.es-cat__nap{padding:10px 0 0;display:flex;flex-direction:column;gap:6px;font-size:14px}
.es-cat__nap b{font-size:16px}
/* нижняя панель телефона: Каталог · Поиск · Корзина */
.es-dock{position:fixed;left:10px;right:10px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:30;height:64px;border-radius:20px;display:flex;align-items:center;justify-content:space-around}
.es-dock a{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--ink);font-size:11px;font-weight:500;min-width:72px;position:relative}
.es-dock a:hover{text-decoration:none;color:var(--ink)}
.es-dock a[aria-current]{color:var(--acc)}
.es-dock .ico{width:22px;height:22px;flex-basis:22px}
.es-dock .es-cnt{top:-4px;right:16px}

/* ── подвал П16 ── */
.es-ft-w{padding:40px 10px 16px}
.es-ft{border-radius:18px;padding:18px 16px 14px;background:rgba(255,255,255,.72);font-size:14px}
.es-ft__logo{height:30px;width:auto;display:block;margin-bottom:10px}
.es-ft__about{color:var(--ink2);max-width:280px}
.es-ft h4{margin:16px 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.7px;color:var(--mut);font-weight:600}
.es-ft ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.es-ft li a{color:var(--ink)}
.es-ft__tel{font-weight:600;font-size:16px}
.es-ft__req{border-top:1px solid rgba(0,0,0,.08);margin-top:16px;padding-top:12px;font-size:12px;color:var(--mut);line-height:1.6;display:flex;flex-direction:column;gap:6px}
.es-ft__req a{color:var(--mut)}

/* ── плитка товара П24: одна на листинги, «Похожие», «Вся коллекция», «Вы смотрели», блок 6 главной ── */
.tiles{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:2px 16px 8px;scrollbar-width:none}
.tiles::-webkit-scrollbar{display:none}
.tiles>.tile{flex:0 0 160px;scroll-snap-align:start}
.tile{position:relative;display:flex;flex-direction:column;min-width:0}
.tile__im{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border-radius:16px;overflow:hidden;margin-bottom:8px}
.tile__im img{width:82%;height:82%;object-fit:contain;mix-blend-mode:multiply}
.tile--out .tile__im img{opacity:.55}
.tile__fav{display:none}
.tile__dots{display:flex;gap:5px;align-items:center;height:16px;margin-bottom:3px}
.tile__dots a{width:12px;height:12px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);flex:none}
.tile__dots a[aria-current]{box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px var(--ink)}
.tile__nm{font-size:13px;line-height:1.3;color:var(--ink);height:51px;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;margin-bottom:4px}
.tile__nm:hover{color:var(--ink)}
.tile__sub{display:none}
.tile__pz{display:flex;flex-direction:column;gap:2px;margin-top:auto}
.tile__pr{font-size:15px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.tile .stt{font-size:11px;gap:5px}.tile .stt::before{width:7px;height:7px}
.tile__buy{width:100%;height:44px;margin-top:8px;border:0;border-radius:12px;background:var(--acc);color:#fff;font:600 14px/1 var(--font);cursor:pointer}
.tile__buy:hover{background:var(--acc-d)}
.tile__buy.is-in{background:var(--ok)}
.tile__buy:disabled{opacity:.6}

/* ── тосты и cookie ── */
.es-toast{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);z-index:40;background:var(--ink);color:#fff;padding:12px 18px;border-radius:14px;font-size:14px;max-width:calc(100vw - 32px)}
.es-toast a{color:#9fd0ff;font-weight:600}
.es-cookie{position:fixed;left:10px;right:10px;bottom:calc(88px + env(safe-area-inset-bottom));z-index:35;padding:12px 14px;border-radius:16px;font-size:13px;line-height:1.4}
.es-cookie__b{display:flex;gap:8px;margin-top:10px}
.es-cookie .btn{flex:1}

/* ── FAQ (карточка и текст листинга) ── */
.faq{border-top:1px solid var(--line)}
.faq__it{border-bottom:1px solid var(--line);padding:14px 0}
.faq__it summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;list-style:none}
.faq__it summary::-webkit-details-marker{display:none}
.faq__it h3{font-size:15px;font-weight:500}
.faq__it[open] summary .ico{transform:rotate(180deg)}
.faq__it p{margin-top:8px;font-size:14px;line-height:1.55;max-width:820px}

@media (min-width:640px){.tiles>.tile{flex-basis:200px}}
@media (min-width:1024px){
body.es{font-size:16px;padding-bottom:0}
html{scroll-padding-top:150px}
.es-desk{display:revert}.btn.es-desk,.ibtn.es-desk{display:inline-flex}
.es-wrap{padding:0 24px}
.es-top{display:flex;align-items:center;gap:18px;max-width:1280px;margin:16px auto 8px;height:34px;border-radius:12px;padding:0 16px;font-size:13px;color:var(--ink2)}
.es-top a{color:var(--ink)}
.es-top__sp{flex:1}
.es-hd{top:12px;max-width:1280px;margin:0 auto;height:64px;border-radius:22px;padding:0 20px;gap:22px}
.es-hd__logo{flex:0 0 auto;padding:0}
.es-hd__logo img{height:30px}
.es-hd__tag{display:block;font-size:10.5px;letter-spacing:.3px;color:var(--mut);margin-top:3px;white-space:nowrap}
.es-hd__nav{order:0;gap:4px}
.es-hd__nav>a{display:block;color:var(--ink);font-size:14px;padding:8px 12px;border-radius:12px;white-space:nowrap}
.es-hd__nav>a:hover{background:rgba(0,0,0,.06);text-decoration:none}
.es-cat{position:relative}
.es-cat__b{width:auto;height:auto;padding:8px 12px;background:var(--ink);color:#fff;font-size:14px}
.es-cat__b span{display:inline}
.es-cat__b .ico{width:16px;height:16px;flex-basis:16px}
.es-cat>summary:hover .es-cat__b{background:#000}
.es-cat__p{position:absolute;left:-150px;right:auto;top:52px;width:960px;max-height:none;overflow:visible;padding:22px 26px;border-radius:22px}
.es-cat__p form,.es-cat__m{display:none}
.es-cat__l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 28px}
.es-cat__l a{padding:9px 10px;border:0;border-radius:12px}
.es-cat__l a:hover{background:rgba(0,0,0,.05)}
.es-cat__l a[aria-current]{background:rgba(0,113,227,.08)}
.es-cat__all{display:flex;gap:28px;border-top:1px solid rgba(0,0,0,.08);margin-top:8px;padding:12px 10px 0;font-size:14px}
.es-hd__srch{flex:1 1 160px;min-width:0;display:flex;align-items:center;gap:10px;height:40px;border-radius:12px;background:rgba(255,255,255,.7);border:1px solid rgba(0,0,0,.08);padding:0 12px;color:var(--mut2)}
.es-hd__srch input{border:0;background:transparent;outline:0;font:14px var(--font);color:var(--ink);flex:1;min-width:0}
.es-hd__srch .ico{width:16px;height:16px;flex-basis:16px}
.es-hd__tel{display:block;text-align:right;line-height:1.2;white-space:nowrap}
.es-hd__tel a,.es-hd__tel>span:first-child{color:var(--ink);font-weight:600;font-size:15px;letter-spacing:.2px}
.es-hd__tel small{display:block;color:var(--mut);font-size:12px;margin-top:2px}
.es-hd__ic{gap:4px}
.es-hd__ic .es-desk{display:inline-flex}
.es-hd__ic .es-mob,.es-hd__call{display:none}
.es-dock{display:none}
.es-ft-w{max-width:1280px;margin:0 auto;padding:56px 0 24px}
.es-ft{border-radius:24px;padding:36px 40px 24px}
.es-ft__cols{display:grid;grid-template-columns:1.1fr .9fr .9fr .8fr 1.1fr;gap:28px}
.es-ft h4{margin:0 0 10px;font-size:13px;letter-spacing:.8px}
.es-ft__req{flex-direction:row;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:28px;padding-top:16px;font-size:13px}
.es-cookie{left:auto;right:24px;bottom:24px;max-width:460px;display:flex;align-items:center;gap:16px;padding:14px 18px;font-size:14px}
.es-cookie__b{margin:0;flex:none}.es-cookie .btn{flex:none}
.es-toast{bottom:32px}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;overflow:visible;margin:0;padding:0}
.tile__im{border-radius:18px;margin-bottom:10px}
.tile__fav{display:flex;position:absolute;top:6px;left:6px;width:44px;height:44px;border:0;padding:0;background:none;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);z-index:1}
.tile__fav::before{content:"";position:absolute;inset:5px;border-radius:50%;background:rgba(255,255,255,.85);box-shadow:0 0 0 1px rgba(0,0,0,.06),0 6px 18px rgba(0,0,0,.12);z-index:-1}
.tile__fav.is-on{color:#d70015}.tile__fav.is-on .ico{fill:currentColor}
.tile__dots{gap:6px;margin-bottom:6px}
.tile__nm{font-size:14px;line-height:1.35;height:38px;-webkit-line-clamp:2}
.tile__sub{display:block;font-size:12px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile__pz{flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 8px;padding-top:8px}
.tile__pr{font-size:16px}
.tile .stt{font-size:12px;gap:6px}.tile .stt::before{width:8px;height:8px}
.tile__buy{height:40px;margin-top:12px}
.faq__it{padding:18px 0}.faq__it h3{font-size:17px}.faq__it p{font-size:15px;line-height:1.6}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}