/* Mini App — стили макета «Cornery MiniApp» (значения 1:1 из макета; инлайн-стили макета разнесены по классам). */

@font-face { font-family: 'Onest'; src: url(fonts/onest-cyr.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; src: url(fonts/onest-lat.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Golos Text'; src: url(fonts/golos-cyr.woff2) format('woff2'); font-weight: 400 700; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; src: url(fonts/golos-lat.woff2) format('woff2'); font-weight: 400 700; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Golos Text'; src: url(fonts/golos-latext.woff2) format('woff2'); font-weight: 400 700; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+20A0-20AB, U+20AD-20C0, U+2113; }

:root, [data-theme="dark"] { --outer:#060607; --bg:#0E0E10; --bg0:rgba(14,14,16,0); --glass:rgba(14,14,16,.86); --card:#17171A; --sheet:#141416; --field:#1C1C1F; --img:#1A1A1D; --btn2:#232327; --ink:#F2F0EB; --on-ink:#0E0E10; --on-ink-muted:#5E5C58; --sub:#C9C7C2; --muted:#8D8B87; --muted2:#77756F; --dis:#55534F; --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.14); --off:#3A3A3F; --accent:#E5483A; --accent-soft:rgba(229,72,58,.13); --accent-ink:#F5B1AA; --pos:#7FD49B; --shadow:rgba(0,0,0,.4); --fab-bg:rgba(242,240,235,.92); --fab-ink:#0E0E10; --fab-bd:rgba(255,255,255,.2); --fab-sh:rgba(0,0,0,.5); }
[data-theme="light"] { --outer:#EFEFEF; --bg:#FFFFFF; --bg0:rgba(255,255,255,0); --glass:rgba(255,255,255,.9); --card:#F5F5F4; --sheet:#FFFFFF; --field:#F5F5F4; --img:#F2F2F1; --btn2:#F0F0EF; --ink:#111112; --on-ink:#FFFFFF; --on-ink-muted:#A3A3A3; --sub:#3F3F3F; --muted:#6B6B6B; --muted2:#8A8A8A; --dis:#C4C4C4; --line:rgba(0,0,0,.08); --line2:rgba(0,0,0,.13); --off:#DADADA; --accent:#D93F31; --accent-soft:rgba(217,63,49,.08); --accent-ink:#B4352A; --pos:#2E8B57; --shadow:rgba(0,0,0,.08); --fab-bg:rgba(17,17,18,.9); --fab-ink:#FFFFFF; --fab-bd:rgba(0,0,0,.1); --fab-sh:rgba(0,0,0,.18); }
:root { --navb:calc(6px + env(safe-area-inset-bottom)); --top:0px; --bar:48px; --barpad:0px; --disp:'Golos Text','Onest',system-ui,sans-serif; } /* --disp — шрифт заголовков и логотипа, как на cornery.store */

html { overflow:hidden; overscroll-behavior:none; }
body { position:fixed; top:0; right:0; bottom:0; left:0; overflow:hidden; overscroll-behavior:none; } /* документ не «тянется» за пальцем — прокручиваются только экран и содержимое шторок */
.root.lock .scroll { overflow:hidden; }
html, body { margin:0; background:var(--outer); color:var(--ink); font-family:'Onest',system-ui,sans-serif; -webkit-font-smoothing:antialiased; transition:background-color .3s; }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
*::-webkit-scrollbar { display:none; }
button, input, textarea { font-family:inherit; }
button { cursor:pointer; }
input::placeholder, textarea::placeholder { color:var(--muted2); }
a { color:var(--ink); text-decoration:none; }
a:hover { color:var(--accent); }
svg { display:block; }
img { -webkit-user-drag:none; }
[hidden] { display:none !important; }
.f-on { font-family:'Onest',sans-serif; }
.unb { font-family:var(--disp); }
.tab { font-variant-numeric:tabular-nums; }
.pr-red { color:var(--accent) !important; }
.act-98:active { transform:scale(.98); }
.act-97:active { transform:scale(.97); }

/* ─── Каркас ─────────────────────────────────────────────────────────── */
.outer { min-height:100vh; background:var(--outer); display:flex; justify-content:center; }
.root { position:relative; width:100%; max-width:1080px; height:100vh; height:100dvh; overflow:hidden; background:var(--bg); color:var(--ink); display:flex; flex-direction:column; transition:background-color .3s; }
@supports (overflow:clip) { .root { overflow:clip; } } /* корень не прокручивается вовсе: закрытые шторки лежат за его краем, и показ поля над клавиатурой сдвигал весь экран */
.bar { flex:none; height:var(--bar); padding:var(--barpad) 12px 0; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:8px; background:var(--bg); position:relative; z-index:7; }
/* Потянуть за шапку вниз — обновить: кружок выезжает из-под шапки, на время загрузки крутится */
.ptr { position:absolute; left:50%; top:var(--bar); z-index:8; width:34px; height:34px; margin-left:-17px; border-radius:50%; background:var(--bg); border:1px solid var(--line2); box-shadow:0 6px 18px var(--shadow); display:grid; place-items:center; color:var(--ink); transform:translateY(-52px); opacity:0; pointer-events:none; transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .28s; }
.ptr.drag { transition:none; }
.ptr.busy { transform:translateY(12px); opacity:1; }
.ptr.busy svg { animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.bar { touch-action:none; }
/*
 * Шапка без фона (config.php header = 'clear'): полоса с логотипом лежит поверх экрана, содержимое прокручивается под ней.
 * mix-blend-mode: difference — на самой полосе (у вложенного элемента смешивание шло бы только с её пустым фоном):
 * белый логотип становится тёмным на светлом и светлым на тёмном. Нажатия ловит только логотип — экран под полосой
 * остаётся рабочим. Под полосой — размытие без цвета; сплошной только узкий верх у строки состояния телефона
 * (в полном экране), чтобы часы и заряд не сливались с содержимым.
 */
[data-header="clear"] .bar { position:absolute; top:0; left:0; right:0; background:none; mix-blend-mode:difference; pointer-events:none; }
[data-header="clear"] .bar .logo { color:#fff; pointer-events:auto; }
[data-header="clear"] .scroll { padding-top:var(--bar); }
[data-header="clear"] .root::before { content:''; position:absolute; top:0; left:0; right:0; z-index:6; height:calc(var(--bar) + 14px); pointer-events:none;
	background:linear-gradient(var(--bg) 0, var(--bg) var(--barpad), var(--bg0) calc(var(--barpad) + 14px));
	-webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
	-webkit-mask-image:linear-gradient(#000 0, #000 58%, transparent 100%); mask-image:linear-gradient(#000 0, #000 58%, transparent 100%); } /* заливки нет: то, что уходит под логотип, мягко размывается (текст под ним не спорит с логотипом) */
.logo { border:0; background:none; padding:6px 4px 6px calc(4px + .22em); font:700 17px/1 var(--disp); letter-spacing:.22em; text-transform:uppercase; color:var(--ink); } /* как логотип cornery.store: Golos Text 700, прописные, разрядка */
.scroll { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-width:none; overscroll-behavior-y:contain; }
.h-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 16px; }
.h2 { margin:0; font:600 20px/1.2 'Onest',sans-serif; letter-spacing:-.01em; }
.more { border:0; background:none; padding:12px 8px; margin:-6px -4px; color:var(--muted); font:500 13px/1 'Onest',sans-serif; }
.more--s { padding:6px 4px; margin:0; }
.rbtn { width:34px; height:34px; border:1px solid var(--line2); border-radius:50%; background:none; color:var(--ink); display:grid; place-items:center; padding:0; }
.hscroll { display:flex; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:none; }
.dragging { cursor:grabbing; scroll-snap-type:none !important; scroll-behavior:auto !important; user-select:none; -webkit-user-select:none; } /* лента под мышью (core.js) */
.hs-arr { position:fixed; z-index:7; height:0; display:none; pointer-events:none; } /* стрелки ленты под курсором (core.js), только мышь */
.hs-arr.on { display:block; }
.hs-arr button { position:absolute; top:-18px; width:36px; height:36px; border:1px solid var(--line2); border-radius:50%; background:var(--bg); color:var(--ink); box-shadow:0 4px 14px var(--shadow); font:400 22px/1 'Onest',sans-serif; display:grid; place-items:center; padding:0 0 3px; cursor:pointer; pointer-events:auto; opacity:.92; }
.hs-arr button:hover { opacity:1; }
.hs-arr button[data-d="-1"] { left:6px; }
.hs-arr button[data-d="1"] { right:6px; }
.hs-arr button[hidden] { display:none; }
.lbl { font:500 11px/1 'Onest',sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--muted2); }

/* Кнопки и чипы */
.btn-ink { border:0; background:var(--ink); color:var(--on-ink); font:600 13.5px/1 'Onest',sans-serif; }
.btn-line { border:1px solid var(--line2); background:none; color:var(--ink); font:500 13.5px/1 'Onest',sans-serif; }
.btn-red { border:0; background:var(--accent); color:#fff; font:600 15px/1 'Onest',sans-serif; }
.btn-tg { display:flex; align-items:center; justify-content:center; gap:8px; border:0; background:#2AABEE; color:#fff; font:600 15px/1 'Onest',sans-serif; }
.chip { flex:none; border:1px solid var(--line2); background:transparent; color:var(--ink); font:500 13px/1 'Onest',sans-serif; white-space:nowrap; }
.chip.on { background:var(--ink); color:var(--on-ink); border-color:var(--ink); }
.chip--36 { height:36px; padding:0 15px; border-radius:18px; }
.chip--34 { height:34px; padding:0 13px; border-radius:17px; font-size:12.5px; }
.chip--32 { height:32px; padding:0 13px; border-radius:16px; font-size:12.5px; }
.chip--38 { height:38px; padding:0 14px; border-radius:19px; }
.chip--pop { height:36px; padding:0 14px; border-radius:18px; }
.chip--up { width:36px; padding:0; display:grid; place-items:center; color:var(--muted); } /* «‹» — из раздела назад к разделам */
.chip--38.chip--up { width:38px; }
.chip.skel { border:0; }
.dfoot .btn-line:disabled { opacity:.4; cursor:default; }
.x-chip { flex:none; display:flex; align-items:center; gap:6px; height:32px; padding:0 10px 0 12px; border:0; border-radius:16px; background:var(--ink); color:var(--on-ink); font:500 12.5px/1 'Onest',sans-serif; }
.reset-u { flex:none; height:32px; padding:0 10px; border:0; background:none; color:var(--muted); font:500 12.5px/1 'Onest',sans-serif; text-decoration:underline; text-underline-offset:3px; }
.sw { flex:none; width:44px; height:26px; border-radius:13px; background:var(--off); position:relative; transition:background .2s; }
.sw::after { content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .2s; }
.sw.on { background:var(--accent); }
.sw.on::after { transform:translateX(18px); }
.tgl { width:100%; display:flex; align-items:center; gap:12px; padding:14px; border:0; border-radius:14px; background:var(--field); color:var(--ink); text-align:left; }
.empty { display:flex; flex-direction:column; align-items:center; gap:10px; padding:70px 24px; text-align:center; }
.empty b { font:600 17px/1.3 'Onest',sans-serif; }
.empty span { font:400 13.5px/1.45 'Onest',sans-serif; color:var(--muted); max-width:240px; }
.empty button { margin-top:8px; height:44px; padding:0 20px; border-radius:12px; }
.skel { background:var(--card); border-radius:14px; animation:skel 1.2s ease-in-out infinite; }
@keyframes skel { 50% { opacity:.55; } }

/* ─── Главная ────────────────────────────────────────────────────────── */
.home { display:flex; flex-direction:column; gap:40px; padding:12px 0 40px; }
.px16 { padding:0 16px; }
.sbtn { width:100%; height:46px; display:flex; align-items:center; gap:10px; padding:0 16px; border:0; border-radius:14px; background:var(--card); color:var(--muted); font:400 14px/1 'Onest',sans-serif; text-align:left; }
.sbtn svg { flex:none; }
.stories { gap:6px; padding:0 16px; margin:-24px 0 -16px; }
.story { flex:none; display:flex; flex-direction:column; align-items:center; gap:7px; border:0; background:none; padding:0; width:74px; }
.story__r { width:68px; height:68px; border-radius:50%; padding:2px; border:1.5px solid var(--line2); display:block; }
.story__r.hot { border-color:var(--accent); }
.story img { width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.story span:last-child { font:500 11px/1.2 'Onest',sans-serif; color:var(--sub); text-align:center; max-width:74px; text-wrap:balance; }
.lvgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr)); gap:10px; padding:0 16px; }
.lvc { text-align:left; border:0; border-radius:20px; background:var(--card); color:var(--ink); padding:16px; display:flex; flex-direction:column; justify-content:space-between; gap:18px; min-height:156px; }
.lvc--ink { background:var(--ink); color:var(--on-ink); position:relative; overflow:hidden; }
.lvc__top { position:relative; display:flex; flex-direction:column; gap:6px; }
.lvc__l { font:500 12px/1.2 'Onest',sans-serif; color:var(--muted); }
.lvc--ink .lvc__l { color:var(--on-ink-muted); }
.lvc__n { font:700 21px/1.1 var(--disp); letter-spacing:-.02em; }
.lvc__r { font:400 12px/1.35 'Onest',sans-serif; color:var(--sub); }
.lvc__num { font:700 clamp(26px,8.4vw,34px)/1 var(--disp); letter-spacing:-.03em; }
.lvc__bot { display:flex; flex-direction:column; gap:7px; }
.lvc__bot2 { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
.lvc__t { font:400 11px/1.3 'Onest',sans-serif; color:var(--muted); }
.lvc__t2 { font:400 11.5px/1.35 'Onest',sans-serif; color:var(--on-ink-muted); }
.lvc__go { flex:none; width:34px; height:34px; border-radius:50%; background:var(--on-ink); color:var(--ink); display:grid; place-items:center; }
.bar4 { height:4px; border-radius:2px; background:var(--line2); overflow:hidden; }
.bar4 > i { display:block; height:100%; background:var(--accent); border-radius:2px; transition:width .4s; }
.bar4--dark { background:var(--on-ink-muted); }
.bar4--dark > i { background:#E5483A; }
.art { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; pointer-events:none; color:var(--on-ink); }
.promo { margin:-12px 16px 0; display:flex; align-items:center; gap:14px; padding:16px; border-radius:20px; background:var(--accent); color:#fff; }
.promo__t { flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.promo__e { font:500 12px/1.2 'Onest',sans-serif; opacity:.85; }
.promo__v { font:700 30px/1 var(--disp); letter-spacing:-.03em; }
.promo__s { font:400 12.5px/1.35 'Onest',sans-serif; opacity:.9; }
.promo__code { flex:none; display:flex; flex-direction:column; align-items:center; gap:7px; padding:12px 14px; border:1.5px dashed rgba(255,255,255,.75); border-radius:14px; background:rgba(255,255,255,.12); color:#fff; cursor:copy; }
.promo__code:active { transform:scale(.97); }
.promo__code b { font:700 17px/1 var(--disp); letter-spacing:.08em; }
.promo__code span { display:flex; align-items:center; gap:5px; font:500 11.5px/1 'Onest',sans-serif; opacity:.9; }
.tiles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:0 16px; }
.tile { position:relative; width:100%; height:clamp(210px,62vw,440px); border:0; padding:0; border-radius:20px; overflow:hidden; background:#17171A; text-align:left; display:block; color:#fff; }
.tile:active { transform:scale(.985); }
.tile img, .tile video { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
.tile video { pointer-events:none; }
.tile__g { position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(180deg,rgba(14,14,16,0) 40%,rgba(14,14,16,.78) 100%); }
.tile__c { position:absolute; left:14px; right:14px; bottom:14px; display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
.tile__tx { flex:1; display:flex; flex-direction:column; gap:7px; min-width:0; }
.tile__e { font:500 10.5px/1 'Onest',sans-serif; letter-spacing:.16em; text-transform:uppercase; opacity:.8; }
.tile__t { font:700 clamp(17px,4.8vw,30px)/1.05 var(--disp); letter-spacing:-.03em; overflow-wrap:break-word; }
.glass-go { flex:none; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.18); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); display:grid; place-items:center; }
.rail { display:flex; flex-direction:column; gap:16px; }
.rail__ctl { display:flex; align-items:center; gap:6px; }
.track { display:flex; gap:12px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scroll-padding-inline:16px; padding:0 16px; scrollbar-width:none; touch-action:pan-x pan-y; }
.track > div { flex:0 0 max(calc((100% - 48px) / 4.35), min(calc((100% - 36px) / 3.35), calc((870px - 100%) * 999)), min(calc((100% - 24px) / 2.35), calc((568px - 100%) * 999))); min-width:0; scroll-snap-align:start; }
.all-t { width:100%; aspect-ratio:4/5; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; border:1px solid var(--line2); border-radius:14px; background:var(--card); color:var(--ink); padding:12px; }
.all-t i { width:52px; height:52px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; }
.all-t b { font:600 14px/1.2 'Onest',sans-serif; }
.all-t span { font:400 12px/1.2 'Onest',sans-serif; color:var(--muted); }
.banner-w { padding:14px 16px 0; }
.banner { position:relative; width:100%; aspect-ratio:2.1/1; max-height:280px; border:0; padding:0; border-radius:20px; overflow:hidden; background:#17171A; text-align:left; display:block; }
.banner img { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover; }
.banner__g { position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(90deg,rgba(14,14,16,.85) 0%,rgba(14,14,16,.2) 70%); }
.banner__c { position:absolute; left:18px; bottom:18px; right:18px; display:flex; flex-direction:column; gap:6px; color:#F2F0EB; }
.banner__e { font:500 11px/1 'Onest',sans-serif; letter-spacing:.1em; text-transform:uppercase; color:#FF7A6E; }
.banner__t { font:700 clamp(21px,6.2vw,30px)/1.08 var(--disp); letter-spacing:-.03em; }
.banner__s { font:400 12.5px/1.3 'Onest',sans-serif; color:#C9C7C2; }
.drops { margin:0 16px; display:flex; flex-direction:column; gap:16px; padding:18px; border-radius:20px; border:1px solid var(--line2); background:var(--card); }
.drops__h { display:flex; gap:12px; align-items:flex-start; }
.drops__i { flex:none; width:42px; height:42px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; }
.drops__t { display:flex; flex-direction:column; gap:5px; min-width:0; }
.drops__t b { font:600 16px/1.25 'Onest',sans-serif; }
.drops__t span { font:400 13px/1.45 'Onest',sans-serif; color:var(--muted); }
.wrap6 { display:flex; flex-wrap:wrap; gap:6px; }
.wrap8 { display:flex; flex-wrap:wrap; gap:8px; }
.dash-more { align-self:flex-start; display:flex; align-items:center; gap:6px; height:34px; margin-top:-8px; padding:0 13px; border-radius:17px; border:1px dashed var(--line2); background:none; color:var(--ink); font:500 12.5px/1 'Onest',sans-serif; }
.drops__go { height:48px; border:1px solid var(--ink); border-radius:14px; background:var(--ink); color:var(--on-ink); font:600 14px/1 'Onest',sans-serif; }
.drops__go.done { background:transparent; color:var(--ink); border-color:var(--line2); }
.drops__m { display:flex; align-items:center; justify-content:center; gap:3px; height:30px; margin:-8px 0 -6px; border:0; background:none; color:var(--muted); font:400 12px/1 'Onest',sans-serif; }
.drops__m svg { opacity:.7; }
.brands { display:flex; flex-direction:column; gap:14px; padding:0 16px; }
.brands .h-row { padding:0; }
.bgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,148px),1fr)); gap:8px; }
.bt { display:flex; flex-direction:column; justify-content:space-between; gap:20px; min-height:104px; padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--card); color:var(--ink); text-align:left; transition:border-color .2s; }
.bt:hover { border-color:var(--line2); }
.bt b { font:600 14px/1.2 'Onest',sans-serif; letter-spacing:.02em; text-wrap:balance; }
.bt__f { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; }
.bt__f span { font:400 12px/1 'Onest',sans-serif; color:var(--muted); }
.bt__f i { flex:none; width:28px; height:28px; border-radius:50%; border:1px solid var(--line2); display:grid; place-items:center; color:var(--ink); }
.bt--ink { border:0; background:var(--ink); color:var(--on-ink); }
.bt--ink .bt__f span { color:var(--on-ink-muted); }
.bt--ink .bt__f i { border:0; background:var(--on-ink); color:var(--ink); }
.shop { margin:0 16px; display:flex; flex-direction:column; gap:14px; padding:18px; border-radius:20px; background:var(--card); }
.shop__a { display:flex; flex-direction:column; gap:6px; }
.shop__a b { font:600 18px/1.25 'Onest',sans-serif; letter-spacing:-.01em; }
.shop__a span { font:400 13px/1.3 'Onest',sans-serif; color:var(--muted); }
.shop__s { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font:500 13px/1 'Onest',sans-serif; }
.shop__s i { width:8px; height:8px; border-radius:50%; background:var(--pos); }
.shop__s i.off { background:var(--accent); }
.shop__s em { color:var(--muted2); font-weight:400; font-style:normal; }
.grid2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.shop__btn { height:46px; display:flex; align-items:center; justify-content:center; gap:8px; border-radius:12px; }
.n3 { display:flex; flex-direction:column; align-items:center; gap:14px; padding:28px 16px 22px; }
.n3 > i { width:28px; height:1px; background:var(--line2); }
.n3 a { display:flex; align-items:center; gap:10px; padding:8px 14px 8px 8px; border:1px solid var(--line); border-radius:999px; color:var(--muted); text-decoration:none; white-space:nowrap; }
.n3 a:hover { border-color:var(--line2); color:var(--ink); }
.n3 a b { flex:none; width:24px; height:24px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; font:700 10px/1 var(--disp); }
.n3 a span { font:400 11.5px/1 'Onest',sans-serif; letter-spacing:.02em; }
.n3 a strong { font:700 12px/1 var(--disp); letter-spacing:.04em; color:var(--ink); }

/* ─── Карточка товара ────────────────────────────────────────────────── */
.card { display:flex; flex-direction:column; gap:10px; min-width:0; font-family:'Onest',system-ui,sans-serif; }
.card__m { position:relative; aspect-ratio:4/5; border-radius:14px; overflow:hidden; background:var(--img); cursor:pointer; }
.card__m img { width:100%; height:100%; object-fit:cover; display:block; }
.card.out .card__m img { opacity:.5; }
.bdg { position:absolute; top:8px; left:8px; display:flex; gap:4px; }
.bdg-n, .bdg-s { font:600 10px/1 'Onest',sans-serif; padding:5px 7px; border-radius:6px; }
.bdg-n { letter-spacing:.06em; background:#F2F0EB; color:#0E0E10; }
.bdg-s { letter-spacing:.04em; background:#E5483A; color:#fff; }
.cbtn { position:absolute; width:36px; height:36px; border:0; border-radius:50%; background:rgba(14,14,16,.42); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:#F2F0EB; display:grid; place-items:center; padding:0; }
.cbtn--fav { top:6px; right:6px; }
.cbtn--add { right:6px; bottom:6px; color:#fff; }
.cbtn--add:active { transform:scale(.92); }
.heart-on { display:none; }
.is-fav .heart-on { display:block; }
.is-fav .heart-off { display:none; }
.card__i { display:flex; flex-direction:column; gap:4px; cursor:pointer; padding:0 2px; }
.artb { display:flex; align-items:center; gap:3px; margin:-9px 0 -9px -6px; padding:9px 6px; border:0; border-radius:6px; background:none; color:var(--muted2); font:400 11.5px/1.2 'Onest',sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.02em; cursor:copy; align-self:flex-start; }
.artb:hover { color:var(--ink); }
.card__t { font:400 13.5px/1.3 'Onest',sans-serif; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.prices { display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; margin-top:2px; }
.prices b { font:600 14.5px/1.2 'Onest',sans-serif; white-space:nowrap; color:var(--ink); }
.prices s { font:400 12px/1.2 'Onest',sans-serif; white-space:nowrap; color:var(--muted2); }
.card__out { font:400 11.5px/1.2 'Onest',sans-serif; color:var(--muted2); }
.cgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(max(calc((100% - 36px) / 4 - 1px), min(calc((100% - 24px) / 3 - 1px), calc((870px - 100%) * 999)), min(calc((100% - 24px) / 3 + 1px), calc((568px - 100%) * 999))),1fr)); gap:32px 12px; padding:4px 16px 0; }

/* ─── Каталог ────────────────────────────────────────────────────────── */
.cat { display:flex; flex-direction:column; padding-bottom:28px; }
.cat__h { padding:6px 16px 14px; display:flex; flex-direction:column; gap:4px; }
.cat__h > div { display:flex; align-items:baseline; gap:10px; }
.h1 { margin:0; font:600 26px/1.15 'Onest',sans-serif; letter-spacing:-.02em; }
.cnt { font:400 12px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; color:var(--muted); }
.chips-row { gap:8px; padding:0 16px 12px; }
.tools { display:flex; flex-direction:column; gap:10px; padding:8px 16px 12px; background:var(--bg); }
.tbtn { height:42px; display:flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:12px; background:var(--card); color:var(--ink); font:500 13.5px/1 'Onest',sans-serif; min-width:0; padding:0 10px; }
.tbtn svg { flex:none; }
.tbtn span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tbtn em { font-style:normal; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--accent); color:#fff; font:600 11px/18px 'Onest',sans-serif; }
.act-row { gap:6px; margin:0 -16px; padding:0 16px; }
.c-empty { padding:60px 24px; display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; }
.c-empty b { font:600 17px/1.3 'Onest',sans-serif; }
.c-empty span { font:400 13.5px/1.45 'Onest',sans-serif; color:var(--muted); max-width:260px; }
.c-empty button { height:42px; padding:0 20px; border-radius:12px; }
.pager { display:flex; flex-direction:column; align-items:center; gap:16px; padding:36px 16px 8px; }
.pager__p { display:flex; flex-direction:column; align-items:center; gap:8px; width:min(100%,240px); }
.pager__p span { font:400 12.5px/1 'Onest',sans-serif; color:var(--muted); }
.bar3 { width:100%; height:3px; border-radius:2px; background:var(--line2); overflow:hidden; }
.bar3 > i { display:block; height:100%; background:var(--ink); border-radius:2px; transition:width .3s; }
.ldmore { height:48px; padding:0 28px; border:1px solid var(--line2); border-radius:14px; background:var(--card); color:var(--ink); font:600 14px/1 'Onest',sans-serif; }
.ldmore:active { transform:scale(.98); }
.pages { display:flex; align-items:center; gap:4px; flex-wrap:wrap; justify-content:center; }
.pg-ar { width:40px; height:40px; border:0; border-radius:10px; background:none; color:var(--ink); display:grid; place-items:center; padding:0; }
.pg-ar:disabled { opacity:.3; cursor:default; }
.pg { min-width:40px; height:40px; padding:0 6px; border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--ink); font:500 13.5px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; }
.pg.on { border-color:var(--ink); background:var(--ink); color:var(--on-ink); }
.pg.gap { border-color:transparent; color:var(--muted2); cursor:default; }
.busy { opacity:.55; pointer-events:none; transition:opacity .2s; }

/* ─── Поиск (страница) ───────────────────────────────────────────────── */
.srp { display:flex; flex-direction:column; padding-bottom:40px; }
.sfield { display:flex; align-items:center; gap:10px; height:48px; padding:0 6px 0 14px; border-radius:14px; background:var(--card); border:1px solid var(--line); }
.sfield--d { background:var(--field); }
.sfield > svg { flex:none; color:var(--muted); }
.sfield input { flex:1; min-width:0; height:100%; border:0; outline:0; background:none; color:var(--ink); font:400 15px/1 'Onest',sans-serif; }
.clr { width:34px; height:34px; flex:none; border:0; border-radius:50%; background:var(--btn2); color:var(--ink); display:grid; place-items:center; padding:0; }
.srp__h { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:10px 16px 14px; }
.srp__h h1 { margin:0; flex:1; font:600 22px/1.2 'Onest',sans-serif; letter-spacing:-.015em; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.srp__h span { flex:none; font:400 13px/1 'Onest',sans-serif; color:var(--muted); }
.sortchip { flex:none; display:flex; align-items:center; gap:6px; height:36px; padding:0 14px; border-radius:18px; border:1px solid var(--line2); background:none; color:var(--ink); font:500 13px/1 'Onest',sans-serif; }
.s-empty { display:flex; flex-direction:column; align-items:center; gap:12px; padding:48px 24px; text-align:center; }
.s-empty b { font:600 17px/1.3 'Onest',sans-serif; }
.s-empty span { font:400 13.5px/1.5 'Onest',sans-serif; color:var(--muted); max-width:280px; }
.s-empty > button { height:44px; padding:0 20px; border-radius:12px; }
.s-empty .wrap8 { justify-content:center; margin-top:16px; }
.s-start { display:flex; flex-direction:column; gap:10px; padding:0 16px 24px; }
.s-start__t { font:400 14px/1.4 'Onest',sans-serif; color:var(--muted); margin-bottom:10px; }
.s-start .lbl { margin-top:6px; }

/* ─── Товар ──────────────────────────────────────────────────────────── */
.pp-top { display:flex; align-items:center; gap:8px; padding:4px 16px 12px; }
.pp-top .sbtn { height:44px; border-radius:12px; padding:0 14px; }
.pp-top .sbtn span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pp { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr)); gap:0 32px; align-items:start; padding:clamp(0px,(100vw - 600px) * 999,8px) clamp(0px,(100vw - 600px) * 999,16px) 0; }
.pp > div { display:flex; flex-direction:column; min-width:0; }
.gal { position:relative; background:var(--img); overflow:hidden; margin:0; width:100%; border-radius:clamp(0px,(100vw - 600px) * 999,18px); }
.gal__t { display:flex; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; aspect-ratio:4/5; touch-action:pan-x pan-y; }
.gal__t img { flex:0 0 100%; width:100%; height:100%; object-fit:cover; scroll-snap-align:center; scroll-snap-stop:always; display:block; cursor:zoom-in; user-select:none; }
.dots { position:absolute; top:12px; left:12px; right:12px; display:flex; gap:4px; pointer-events:none; }
.dots i { flex:1; height:3px; border-radius:2px; background:rgba(255,255,255,.4); transition:background .25s; }
.dots i.on { background:#fff; }
.gar { position:absolute; top:50%; transform:translateY(-50%); width:56px; height:64px; border:0; background:rgba(255,255,255,.26); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:#fff; display:grid; place-items:center; padding:0; transition:opacity .2s; }
.gar--p { left:0; border-radius:0 10px 10px 0; }
.gar--n { right:0; border-radius:10px 0 0 10px; }
.gar.dim { opacity:.35; }
.gfs { position:absolute; right:12px; top:24px; width:40px; height:40px; border:0; border-radius:10px; background:rgba(255,255,255,.26); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:#fff; display:grid; place-items:center; padding:0; }
.gbdg { position:absolute; left:12px; top:24px; font:600 11px/1 'Onest',sans-serif; padding:7px 9px; border-radius:7px; background:#E5483A; color:#fff; }
.gbdg--n { letter-spacing:.06em; background:#F2F0EB; color:#0E0E10; }
.gart { position:absolute; left:12px; bottom:12px; display:flex; align-items:center; gap:5px; height:28px; padding:0 9px; border:0; border-radius:8px; background:rgba(14,14,16,.55); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:#F2F0EB; font:500 11.5px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.02em; cursor:copy; }
.gart svg { opacity:.75; }
.gpost { position:absolute; right:12px; bottom:12px; display:flex; align-items:center; gap:6px; height:32px; padding:0 12px 0 10px; border:0; border-radius:10px; background:#2AABEE; color:#fff; font:600 12.5px/1 'Onest',sans-serif; box-shadow:0 2px 10px rgba(0,0,0,.18); } /* «В канал» — тем, кому разрешил плагин отправки; цвет и самолётик Telegram */
.thumbs { display:flex; gap:8px; padding:12px clamp(0px,(600px - 100vw) * 999,16px) 0; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:none; }
.thumb { flex:none; width:56px; height:70px; padding:0; border-radius:10px; overflow:hidden; border:1.5px solid transparent; background:var(--img); opacity:.55; transition:opacity .2s,border-color .2s; }
.thumb.on { border-color:var(--ink); opacity:1; }
.thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.pi { display:flex; flex-direction:column; gap:12px; padding:28px 16px 0; }
.pi__art { align-self:flex-start; display:flex; align-items:center; gap:6px; height:30px; padding:0 10px; border:1px solid var(--line2); border-radius:9px; background:none; color:var(--sub); font:400 11.5px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.02em; cursor:copy; }
.pi h1 { margin:0; font:600 clamp(20px,6vw,24px)/1.2 'Onest',sans-serif; letter-spacing:-.015em; text-wrap:pretty; }
.pi__sub { font:400 13px/1.3 'Onest',sans-serif; color:var(--muted); }
.pi__pr { display:flex; align-items:center; gap:10px; margin-top:6px; flex-wrap:wrap; }
.pi__pr b { font:600 26px/1 'Onest',sans-serif; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--ink); }
.pi__pr s { font:400 13px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; color:var(--muted2); }
.pi__pr em { font:500 11px/1 'Onest',sans-serif; font-style:normal; font-variant-numeric:tabular-nums; padding:5px 7px; border-radius:6px; background:var(--accent-soft); color:var(--accent-ink); }
.pi__bon { display:flex; align-items:center; gap:8px; margin-top:6px; padding:10px 12px; border-radius:12px; background:var(--card); font:400 12.5px/1.35 'Onest',sans-serif; color:var(--sub); }
.pi__bon i { width:7px; height:7px; flex:none; border-radius:50%; background:var(--accent); }
.psz { display:flex; flex-direction:column; gap:14px; padding:32px 16px 0; }
.psz__h { display:flex; justify-content:space-between; align-items:baseline; }
.psz__h b { font:600 15px/1 'Onest',sans-serif; }
.guide-b { display:flex; align-items:center; gap:6px; border:0; background:none; padding:4px 0; color:var(--muted); font:500 13px/1 'Onest',sans-serif; }
.sz { min-width:52px; height:46px; padding:0 14px; border-radius:12px; border:1px solid var(--line2); background:transparent; color:var(--ink); font:500 14px/1 'Onest',sans-serif; }
.sz.on { background:var(--ink); color:var(--on-ink); border-color:var(--ink); }
.sz.no { color:var(--dis); border-color:var(--line); text-decoration:line-through; }
.sz.no.sub { color:var(--accent-ink); border-color:var(--accent); }
.sz--q { min-width:48px; height:42px; padding:0 12px; border-radius:11px; font-size:13.5px; }
.sz--p { min-width:56px; height:48px; }
.sz--f { min-width:36px; height:30px; padding:0 8px; border-radius:8px; font-size:12px; }
.sz-err { font:500 12.5px/1.2 'Onest',sans-serif; color:var(--accent); }
.sz-hint { font:400 12px/1.35 'Onest',sans-serif; color:var(--muted2); }
.pa { display:flex; flex-direction:column; gap:10px; padding:24px 16px 0; }
.pa > div { display:flex; gap:8px; }
.pa__add { flex:1; min-width:0; height:54px; border-radius:14px; }
.pa__add:disabled { background:var(--btn2); color:var(--muted); }
.pa__sq { flex:none; width:54px; height:54px; border-radius:14px; border:1px solid var(--line2); background:var(--card); color:var(--ink); display:grid; place-items:center; padding:0; }
.pa__quick { height:54px; display:flex; align-items:center; justify-content:center; gap:10px; border:1px solid var(--line2); border-radius:14px; background:none; color:var(--ink); font:500 14.5px/1 'Onest',sans-serif; }
.acc { display:flex; flex-direction:column; padding:32px 16px 0; }
.acc > div { border-top:1px solid var(--line); }
.acc__h { width:100%; display:flex; justify-content:space-between; align-items:center; height:54px; border:0; background:none; padding:0; color:var(--ink); font:500 14.5px/1 'Onest',sans-serif; }
.acc__h svg { transition:transform .25s; }
.acc__h.open svg { transform:rotate(180deg); }
.acc__b { display:flex; flex-direction:column; gap:9px; padding:0 0 18px; }
.kv { display:flex; gap:12px; font:400 13.5px/1.45 'Onest',sans-serif; }
.kv > span:first-child { flex:0 0 96px; color:var(--muted); }
.kv > span:last-child { color:var(--sub); min-width:0; }
.acc__d { font:400 13.5px/1.5 'Onest',sans-serif; color:var(--sub); }
/* Доставка и оплата на вкладке товара — компактная таблица: способ (переносится), срок, цена (не переносятся). */
.dtab { width:100%; border-collapse:collapse; font:400 13px/1.35 'Onest',sans-serif; color:var(--sub); }
.dtab th { padding:0 0 7px; text-align:left; font:500 10.5px/1 'Onest',sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--muted2); }
.dtab td { padding:7px 0; border-top:1px solid var(--line); vertical-align:baseline; }
.dtab tr:first-child td { border-top:0; padding-top:0; }
.dtab small { display:block; margin-top:2px; font-size:11.5px; color:var(--muted); }
.dtab th + th, .dtab td + td { padding-left:12px; text-align:right; white-space:nowrap; }
.dtab td + td { color:var(--ink); font-weight:500; }
.dtab__x div { display:flex; gap:10px; }
.dtab__x span:first-child { flex:none; color:var(--muted); }
.dtab__x span:last-child { flex:1; text-align:right; }
.acc__more { align-self:flex-start; display:flex; align-items:center; gap:4px; margin-top:4px; padding:0; border:0; background:none; color:var(--ink); font:500 13px/1.3 'Onest',sans-serif; text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--line2); }
.prails { display:flex; flex-direction:column; gap:40px; padding:40px 0 32px; }

/* ─── Навигация ──────────────────────────────────────────────────────── */
.nav { flex:none; display:grid; grid-template-columns:repeat(var(--cols,6),minmax(0,1fr)); padding:6px 4px var(--navb); background:var(--bg); border-top:1px solid var(--line); position:relative; z-index:6; }
.nav button { position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; height:50px; justify-content:center; border:0; background:none; color:var(--muted2); font:500 10.5px/1 'Onest',sans-serif; white-space:nowrap; }
.nav button.on { color:var(--ink); }
.nav em { position:absolute; top:3px; left:calc(50% + 6px); min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--ink); color:var(--on-ink); font:600 10px/17px 'Onest',sans-serif; font-style:normal; }
.nav em.red { background:var(--accent); color:#fff; }

/* ─── Лайтбокс ───────────────────────────────────────────────────────── */
.lb { position:absolute; top:0; right:0; bottom:0; left:0; z-index:40; background:#050505; color:#F2F0EB; display:flex; flex-direction:column; }
.lb__h { flex:none; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:calc(12px + var(--top)) 12px 12px 18px; }
.lb__n { flex:none; white-space:nowrap; font:500 12px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.06em; color:#C9C7C2; }
.lb__c { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:5px; }
.lb__t { max-width:100%; text-align:center; font:500 14px/1.2 'Onest',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lb__a { display:flex; align-items:center; gap:5px; padding:2px 6px; border:0; background:none; color:#A9A7A2; font:500 11.5px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.02em; cursor:copy; }
.lb__a svg { opacity:.75; }
.lb__x { flex:none; width:44px; height:44px; border:0; border-radius:50%; background:rgba(255,255,255,.1); color:#F2F0EB; display:grid; place-items:center; padding:0; }
.lb__b { flex:1; min-height:0; position:relative; }
.lb__tr { position:absolute; top:0; right:0; bottom:0; left:0; display:flex; overflow-x:auto; overflow-y:hidden; overscroll-behavior:contain; scroll-snap-type:x mandatory; scrollbar-width:none; touch-action:pan-x; }
.lb__s { flex:0 0 100%; height:100%; scroll-snap-align:center; scroll-snap-stop:always; display:grid; place-items:center; cursor:zoom-in; }
.lb__s img { max-width:100%; max-height:100%; object-fit:contain; display:block; user-select:none; }
.lb__z { position:absolute; top:0; right:0; bottom:0; left:0; overflow:auto; overscroll-behavior:contain; scrollbar-width:none; cursor:zoom-out; touch-action:pan-x pan-y; }
.lb__z img { width:230%; max-width:none; display:block; user-select:none; }
.lb__ar { position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border:0; border-radius:50%; background:rgba(255,255,255,.12); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:#F2F0EB; display:grid; place-items:center; padding:0; }
.lb__ar--p { left:12px; }
.lb__ar--n { right:12px; }
.lb__ar.dim { opacity:.35; }
.lb__f { flex:none; display:flex; flex-direction:column; align-items:center; gap:12px; padding:12px 16px calc(16px + env(safe-area-inset-bottom)); }
.lb__th { display:flex; gap:8px; max-width:100%; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
.lb__th button { flex:none; width:48px; height:60px; padding:0; border-radius:8px; overflow:hidden; border:1.5px solid transparent; background:#1A1A1D; opacity:.55; }
.lb__th button.on { border-color:#F2F0EB; opacity:1; }
.lb__th img { width:100%; height:100%; object-fit:cover; display:block; }

/* ─── Слои ───────────────────────────────────────────────────────────── */
.fab { position:absolute; right:14px; bottom:calc(70px + var(--navb)); z-index:8; width:44px; height:44px; border:1px solid var(--fab-bd); border-radius:50%; background:var(--fab-bg); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); color:var(--fab-ink); display:grid; place-items:center; box-shadow:0 6px 18px var(--fab-sh); padding:0; }
.fab:active { transform:scale(.94); }
.offline { position:fixed; left:12px; right:12px; top:calc(10px + max(env(safe-area-inset-top), var(--top))); z-index:80; display:flex; align-items:center; gap:12px; max-width:520px; margin:0 auto; padding:10px 10px 10px 14px; border-radius:14px; background:var(--ink); color:var(--on-ink); box-shadow:0 10px 30px var(--shadow); }
.offline svg { flex:none; }
.offline span { flex:1; min-width:0; font:500 13px/1.3 'Onest',sans-serif; }
.offline button { flex:none; height:32px; padding:0 12px; border:0; border-radius:9px; background:var(--on-ink); color:var(--ink); font:600 12.5px/1 'Onest',sans-serif; }
.toast-w { position:absolute; left:16px; right:16px; bottom:var(--tb,76px); z-index:30; display:flex; justify-content:center; pointer-events:none; } /* место — N3.toastPlace */
.toast-w.safe { bottom:calc(var(--tb,16px) + env(safe-area-inset-bottom)); }
.toast-w.in-dr { left:calc(100% - min(90%,420px) + 16px); }
.toast-w.by-fab { right:68px; } /* рядом с «Назад» (44 px справа), на её высоте */
/* Итоги опроса (администратору) */
.svs { padding:16px; display:flex; flex-direction:column; gap:14px; }
.svc { display:flex; flex-direction:column; gap:12px; padding:16px; border-radius:16px; background:var(--card); }
.svc__h { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:4px; }
.svc__h > span { display:flex; flex-direction:column; gap:6px; min-width:0; }
.svc__h b { font:600 15px/1.25 'Onest',sans-serif; }
.svc__h small { font:400 12px/1.3 'Onest',sans-serif; color:var(--muted); }
.svc__h > em { flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:4px; font:600 22px/1 'Onest',sans-serif; font-style:normal; font-variant-numeric:tabular-nums; }
.svr { display:flex; flex-direction:column; gap:6px; }
.svr > div { display:flex; align-items:baseline; justify-content:space-between; gap:10px; font:400 13.5px/1.2 'Onest',sans-serif; }
.svr b { font:500 12.5px/1 'Onest',sans-serif; color:var(--sub); white-space:nowrap; font-variant-numeric:tabular-nums; }
.svr > i { display:block; height:5px; border-radius:3px; background:var(--line2); overflow:hidden; }
.svr u { display:block; height:100%; border-radius:3px; background:var(--ink); }
/* Плашка «активируйте бота» — над нижней панелью; шторки и листы её перекрывают */
.botb { position:absolute; left:12px; right:12px; bottom:calc(62px + var(--navb)); z-index:9; max-width:520px; margin:0 auto; display:flex; align-items:center; gap:10px; padding:8px 6px 8px 14px; border-radius:14px; background:var(--ink); color:var(--on-ink); box-shadow:0 10px 30px var(--shadow); transform:translateY(12px); opacity:0; visibility:hidden; transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s,visibility 0s .3s; }
.botb.on { transform:none; opacity:1; visibility:visible; transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s; }
.botb span { flex:1; min-width:0; font:400 12.5px/1.35 'Onest',sans-serif; color:var(--on-ink-muted); }
.botb b { font-weight:600; color:var(--on-ink); }
.botb__go { flex:none; height:32px; padding:0 12px; border:0; border-radius:9px; background:var(--accent); color:#fff; font:600 12.5px/1 'Onest',sans-serif; }
.botb__x { flex:none; width:28px; height:28px; border:0; padding:0; background:none; color:var(--on-ink-muted); display:grid; place-items:center; }
.toast { display:flex; align-items:center; gap:14px; padding:12px 14px 12px 16px; border-radius:14px; background:var(--ink); color:var(--on-ink); box-shadow:0 10px 30px var(--shadow); transform:translateY(16px); opacity:0; transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s; pointer-events:none; max-width:100%; }
.toast.on { transform:translateY(0); opacity:1; pointer-events:auto; }
.toast span { font:500 13.5px/1.3 'Onest',sans-serif; }
.toast button { flex:none; border:0; background:var(--on-ink); color:var(--ink); border-radius:9px; height:30px; padding:0 12px; font:600 12.5px/1 'Onest',sans-serif; white-space:nowrap; }
/* Товар листом снизу (boot.pview = 'sheet'): во всю ширину, поверх каталога и нижней панели, под шторками и листами. */
.pvo { position:absolute; top:0; right:0; bottom:0; left:0; z-index:18; background:rgba(0,0,0,.45); opacity:0; pointer-events:none; transition:opacity .3s; }
.pvo.on { opacity:1; pointer-events:auto; }
.pv { position:absolute; left:0; right:0; bottom:0; top:calc(var(--top) + 8px); z-index:19; display:flex; flex-direction:column; background:var(--bg); color:var(--ink); border-radius:14px 14px 0 0; overflow:hidden; box-shadow:0 -20px 60px var(--shadow); transform:translateY(102%); visibility:hidden; transition:transform .38s cubic-bezier(.2,.8,.2,1), visibility 0s .38s; }
.pv.on { transform:none; visibility:visible; transition:transform .38s cubic-bezier(.2,.8,.2,1); }
.pv.drag { transition:none; }
.pv__h { flex:none; position:relative; height:30px; display:flex; justify-content:center; padding-top:7px; touch-action:none; }
.pv__h i { width:36px; height:5px; border-radius:3px; background:var(--line2); }
.pv__x { position:absolute; right:6px; top:1px; width:30px; height:30px; border:0; border-radius:50%; background:none; color:var(--muted); display:grid; place-items:center; padding:0; }
.pv__x:active, .pv__bk:active { background:var(--card); }
.pv__bk { position:absolute; left:6px; top:1px; width:30px; height:30px; border:0; border-radius:50%; background:none; color:var(--muted); display:grid; place-items:center; padding:0; } /* только в браузере: в Telegram — его кнопка «Назад» */
.pv__bk[hidden] { display:none; }
.pv__b { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; padding-bottom:calc(16px + env(safe-area-inset-bottom)); }
.pv__b::-webkit-scrollbar { display:none; }
.ov { position:absolute; top:0; right:0; bottom:0; left:0; z-index:20; background:rgba(0,0,0,.5); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); opacity:0; pointer-events:none; transition:opacity .3s; }
.ov.on { opacity:1; pointer-events:auto; }
.ov.up { z-index:22; } /* лист открыт поверх шторки: затемняем и её — в фокусе верхний слой, тап по затемнению закрывает его */

/* Шторка справа: в полном экране Telegram начинается под его кнопками (--top), а не у верхнего края, как в прежнем Mini App */
.dr { position:absolute; right:0; bottom:0; top:var(--top); width:min(90%,420px); z-index:21; background:var(--sheet); color:var(--ink); border-radius:22px 0 0 22px; display:flex; flex-direction:column; overflow:hidden; transform:translateX(104%); visibility:hidden; transition:transform .38s cubic-bezier(.2,.8,.2,1), visibility 0s .38s; box-shadow:-20px 0 60px var(--shadow); }
.dr.on { transform:none; visibility:visible; transition:transform .38s cubic-bezier(.2,.8,.2,1); }
.dr.drag { transition:none; }
.dr__h { flex:none; display:flex; align-items:center; gap:10px; padding:14px 12px 14px 18px; border-bottom:1px solid var(--line); touch-action:pan-y; }
.dr__back { width:36px; height:36px; margin-left:-8px; border:0; border-radius:50%; background:none; color:var(--ink); display:grid; place-items:center; padding:0; }
.dr__t { flex:1; min-width:0; font:600 18px/1.2 'Onest',sans-serif; letter-spacing:-.01em; }
.dr__t em { color:var(--muted2); font-weight:500; font-style:normal; }
.xbtn { flex:none; width:36px; height:36px; border:0; border-radius:50%; background:var(--btn2); color:var(--ink); display:grid; place-items:center; padding:0; }
.dr__b { flex:1; min-height:0; display:flex; flex-direction:column; position:relative; }
.dscroll { flex:1; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; }
.dfoot { flex:none; padding:14px 16px calc(16px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px; background:var(--sheet); }
.dfoot--g { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; }
.dfoot--2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.dfoot__l { display:flex; justify-content:space-between; font:400 13px/1 'Onest',sans-serif; color:var(--muted); }
.dfoot__l b { font-weight:400; color:var(--accent); }
.dfoot__t { display:flex; justify-content:space-between; align-items:baseline; margin:4px 0 6px; }
.dfoot__t span { font:600 16px/1 'Onest',sans-serif; }
.dfoot__t b { font:600 20px/1 'Onest',sans-serif; }
.big-red { height:52px; border-radius:14px; }
.big-ink { height:50px; border-radius:14px; font-size:14.5px; }
.big-line { height:50px; border-radius:14px; font-size:14px; }

/* Меню */
.menu { flex:1; min-height:0; position:relative; overflow:hidden; }
.menu__m { position:absolute; top:0; right:0; bottom:0; left:0; overflow-y:auto; overscroll-behavior:contain; padding:18px 18px 32px; display:flex; flex-direction:column; gap:30px; scrollbar-width:none; transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .38s; }
.menu.sub .menu__m { transform:translateX(-28%); opacity:0; }
.menu__s { position:absolute; top:0; right:0; bottom:0; left:0; background:var(--sheet); overflow-y:auto; overscroll-behavior:contain; padding:12px 18px 32px; scrollbar-width:none; transform:translateX(102%); transition:transform .38s cubic-bezier(.2,.8,.2,1); box-shadow:-12px 0 30px var(--shadow); }
.menu.sub .menu__s { transform:none; }
.prof { position:relative; overflow:hidden; flex:none; display:flex; flex-direction:column; gap:20px; padding:24px 20px 20px; border:0; border-radius:22px; background:var(--ink); color:var(--on-ink); text-align:left; } /* тот же блок, что «Баланс» в «Баллах», с анимацией на фоне */
.prof__r { position:relative; display:flex; align-items:center; gap:14px; }
.prof__a { position:relative; width:56px; height:56px; flex:none; border-radius:50%; background:var(--on-ink); color:var(--ink); display:grid; place-items:center; font:700 21px/1 var(--disp); overflow:hidden; box-shadow:0 0 0 1px var(--on-ink-muted); } /* обводка: тёмный аватар на тёмной карточке иначе пропадал */
.prof__a img { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover; }
.prof__t { flex:1; display:flex; flex-direction:column; gap:8px; min-width:0; }
.prof__t b { font:700 21px/1.12 var(--disp); letter-spacing:-.02em; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow-wrap:anywhere; } /* длинное имя — в две строки, а не обрезается */
.prof__t span { font:500 14.5px/1.2 'Onest',sans-serif; color:var(--on-ink-muted); }
.prof__r > svg { color:var(--on-ink-muted) !important; }
.prof__p { position:relative; display:flex; flex-direction:column; gap:8px; }
/* Кнопка-колонка: в Safari (Telegram на iPhone) у <button> по умолчанию align-items: flex-start — строки сжимались по
   содержимому (полоса прогресса в карточке профиля — по ширине подписи, стрелки плиток — не у правого края). */
.prof, .lvc, .bt, .oc { align-items:stretch; }
.prof__r, .prof__p { align-self:stretch; min-width:0; }
.prof__p .bar4 { width:100%; }
.prof__p > span:last-child { font:400 12px/1.3 'Onest',sans-serif; color:var(--on-ink-muted); }
.prof__p .bar4 { display:block; }
.mt { display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:16px 14px; border:0; border-radius:14px; background:var(--field); color:var(--ink); text-align:left; }
.mt b { font:600 15px/1 'Onest',sans-serif; }
.mt span { font:400 12px/1.2 'Onest',sans-serif; color:var(--muted); }
.mt--sale { background:var(--accent-soft); color:var(--accent-ink); }
.mt--sale span { color:inherit; }
.mclose { display:flex; align-items:center; justify-content:center; gap:8px; height:46px; margin-top:-6px; border:0; border-radius:12px; background:none; color:var(--muted); font:500 14px/1 'Onest',sans-serif; }
.mclose:active { background:var(--card); }
.mid { align-self:center; margin-top:-8px; padding:8px 12px; border:0; border-radius:10px; background:none; color:var(--muted2); font:500 12px/1 'Onest',sans-serif; letter-spacing:.04em; }
.mid:active { background:var(--card); }
.msec { display:flex; flex-direction:column; }
.msec > .lbl { margin-bottom:6px; }
.mrow { display:flex; align-items:center; gap:10px; min-height:52px; border:0; border-bottom:1px solid var(--line); background:none; padding:0; color:var(--ink); font:400 15px/1.2 'Onest',sans-serif; text-align:left; width:100%; }
.mrow > svg:first-child { flex:none; color:var(--muted); }
.mrow > svg:last-child { flex:none; color:var(--muted2); }
.mrow > span { flex:1; }
.mrow > em { font:400 12.5px/1 'Onest',sans-serif; font-style:normal; color:var(--muted2); }
.mrow > .pill { display:inline-flex; align-items:center; height:22px; padding:0 8px; border-radius:11px; background:var(--ink); color:var(--on-ink); font:600 11.5px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; white-space:nowrap; } /* .mrow > em сбивал высоту строки и цвет бейджа */
.mrow > .pill--red { background:var(--accent); color:#fff; }
.mrow .sub2 { color:var(--sub); }
.mrow--all { height:56px; font:600 15px/1 'Onest',sans-serif; }
.pill { flex:none !important; display:inline-flex; align-items:center; height:22px; padding:0 8px; border-radius:11px; background:var(--btn2); color:var(--ink); font:600 11.5px/1 'Onest',sans-serif; font-style:normal; white-space:nowrap; }
.pill--red { background:var(--accent-soft); color:var(--accent-ink); }
.seg { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; padding:4px; border-radius:14px; background:var(--field); }
.seg button { height:40px; border:0; border-radius:10px; background:transparent; color:var(--ink); display:grid; place-items:center; padding:0; font:500 13px/1 'Onest',sans-serif; }
.seg button.on { background:var(--ink); color:var(--on-ink); }
.seg--freq button { height:38px; color:var(--muted); padding:0 4px; white-space:nowrap; }
.seg--freq button.on { background:var(--bg); color:var(--ink); box-shadow:0 1px 3px var(--shadow); }
.bsearch { position:sticky; top:-12px; z-index:2; padding:0 0 4px; background:var(--sheet); }
.ifield { display:flex; align-items:center; gap:10px; height:46px; padding:0 14px; border-radius:12px; background:var(--field); }
.ifield svg { flex:none; color:var(--muted); }
.ifield input { flex:1; min-width:0; height:100%; border:0; outline:0; background:none; color:var(--ink); font:400 15px/1 'Onest',sans-serif; }
.letter { font:600 12px/1 'Onest',sans-serif; color:var(--muted2); padding:6px 0 4px; }
.note-c { padding:30px 0; text-align:center; font:400 13.5px/1.4 'Onest',sans-serif; color:var(--muted); }

/* Справка */
.info { padding:16px; display:flex; flex-direction:column; gap:8px; }
.iblk { display:flex; flex-direction:column; gap:6px; padding:14px; border-radius:14px; background:var(--field); }
.iblk > div { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.iblk b { font:600 14.5px/1.3 'Onest',sans-serif; }
.iblk > span { font:400 13.5px/1.5 'Onest',sans-serif; color:var(--muted); }
.info > button { margin-top:8px; height:48px; border-radius:12px; font-size:14px; }
.iblk__p { flex:none; font:600 13.5px/1.3 'Onest',sans-serif; font-style:normal; white-space:nowrap; }
.info__sec { padding:12px 2px 2px; }
.info__sec:first-child { padding-top:0; }
.qa { border-radius:14px; background:var(--field); }
.qa__q { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px; border:0; background:none; color:var(--ink); text-align:left; font:600 14px/1.35 'Onest',sans-serif; }
.qa__q svg { flex:none; color:var(--muted2); transition:transform .25s; }
.qa.open .qa__q svg { transform:rotate(180deg); }
.qa__a { display:none; padding:0 14px 14px; font:400 13.5px/1.5 'Onest',sans-serif; color:var(--muted); }
.qa.open .qa__a { display:block; }

/* Уровни и баллы */
.lvls { display:flex; flex-direction:column; gap:24px; padding:16px 16px 32px; }
.lvls > span { font:400 13.5px/1.45 'Onest',sans-serif; color:var(--muted); }
.lvh { position:relative; overflow:hidden; display:flex; flex-direction:column; gap:18px; padding:20px; border-radius:22px; background:var(--ink); color:var(--on-ink); }
.lvh--b { border-radius:20px; padding:18px; gap:14px; }
.lvh__r { position:relative; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:10px 12px; }
.lvh__r > span { display:flex; flex-direction:column; gap:6px; }
.lvh__l { font:500 12px/1 'Onest',sans-serif; color:var(--on-ink-muted); }
.lvh__n { font:700 clamp(24px,8vw,32px)/1.05 var(--disp); letter-spacing:-.03em; }
.lvh__num { font:700 36px/1 var(--disp); letter-spacing:-.03em; }
.lvh__b { flex:none; white-space:nowrap; font:600 11px/1 'Onest',sans-serif; letter-spacing:.06em; padding:7px 10px; border-radius:8px; background:var(--on-ink); color:var(--ink); }
.lvh__p { position:relative; display:flex; flex-direction:column; gap:8px; }
.lvh--b .lvh__p { gap:7px; }
.lvh__pt { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; font:400 12px/1.3 'Onest',sans-serif; color:var(--on-ink-muted); }
.lvh--b .lvh__pt { font-size:11.5px; flex-wrap:nowrap; }
.lvlist { display:flex; flex-direction:column; gap:10px; }
.lvlist > b { font:600 17px/1.2 'Onest',sans-serif; }
.lvi { display:flex; flex-direction:column; gap:10px; padding:14px; border-radius:14px; border:1px solid var(--line); background:transparent; }
.lvi.cur { border-color:var(--ink); background:var(--field); }
.lvi > div:first-child { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px 10px; }
.lvi__n { display:flex; align-items:center; gap:8px; }
.lvi__n b { font:700 17px/1 var(--disp); letter-spacing:-.02em; }
.lvi__n em { height:20px; padding:0 7px; border-radius:10px; background:var(--ink); color:var(--on-ink); font:600 10.5px/20px 'Onest',sans-serif; font-style:normal; white-space:nowrap; }
.lvi__f { font:400 12px/1 'Onest',sans-serif; color:var(--muted); white-space:nowrap; }
.perk { display:flex; gap:8px; font:400 13px/1.4 'Onest',sans-serif; color:var(--sub); }
.perk svg { flex:none; margin-top:3px; color:var(--muted2); }
.lvi.done .perk { color:var(--ink); }
.lvi.done .perk svg { color:var(--accent); }
.foot-n { font:400 12px/1.45 'Onest',sans-serif; color:var(--muted2); }
.bon { padding:16px; display:flex; flex-direction:column; gap:22px; }
.qrbtn { flex:none; display:flex; align-items:center; gap:12px; min-height:60px; padding:12px 16px; border:0; border-radius:14px; background:var(--ink); color:var(--on-ink); font:600 14.5px/1 'Onest',sans-serif; text-align:left; }
.qrbtn svg { flex:none; }
.qrbtn > span { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.qrbtn small { font:400 12px/1.2 'Onest',sans-serif; opacity:.7; }
.qrbtn > svg:last-child { opacity:.6; }
.soft { padding:12px 14px; border-radius:14px; background:var(--accent-soft); font:500 12.5px/1.35 'Onest',sans-serif; color:var(--accent-ink); }
.linkc { display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--field); color:var(--ink); text-align:left; }
.linkc > span { flex:1; display:flex; flex-direction:column; gap:5px; }
.linkc b { font:600 14.5px/1.2 'Onest',sans-serif; }
.linkc small { font:400 12.5px/1.3 'Onest',sans-serif; color:var(--muted); }
.linkc > svg { flex:none; color:var(--muted2); }
.sec10 { display:flex; flex-direction:column; gap:10px; }
.sec10 > b, .sec4 > b { font:600 15px/1 'Onest',sans-serif; }
.sec4 { display:flex; flex-direction:column; gap:4px; }
.sec4 > b { margin-bottom:6px; }
.task { display:flex; align-items:center; gap:12px; padding:14px; border-radius:14px; background:var(--field); }
.task > span { flex:1; display:flex; flex-direction:column; gap:5px; min-width:0; }
.task b { font:500 14px/1.2 'Onest',sans-serif; }
.task em { font:600 12.5px/1 'Onest',sans-serif; font-style:normal; color:var(--accent); }
.task button { flex:none; height:34px; padding:0 14px; border:0; border-radius:10px; background:var(--ink); color:var(--on-ink); font:600 12.5px/1 'Onest',sans-serif; }
.task button:disabled { background:var(--btn2); color:var(--muted); cursor:default; }
.hist { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); }
.hist-more { align-self:stretch; height:44px; margin-top:10px; border:1px solid var(--line2); border-radius:12px; background:none; color:var(--ink); font:500 13.5px/1 'Onest',sans-serif; }
.bon__rule { margin-top:-6px; padding:0 2px; font:400 12px/1.35 'Onest',sans-serif; color:var(--muted); }
.tgl:disabled { opacity:.6; cursor:default; }
.hist > span { display:flex; flex-direction:column; gap:5px; min-width:0; }
.hist > span:first-child span:first-child { font:400 14px/1.2 'Onest',sans-serif; }
.hist > span:first-child span:last-child { font:400 12px/1.3 'Onest',sans-serif; color:var(--muted2); }
.hist__r { flex:none; align-items:flex-end; }
.hist b { font:600 14px/1 'Onest',sans-serif; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.hist b.plus { color:var(--pos); }
.hist em { font:400 11.5px/1 'Onest',sans-serif; font-style:normal; color:var(--pos); white-space:nowrap; }
/* потрачены, списаны, сгорели — баллов больше нет: сумма и статус серые, сгоревшая сумма зачёркнута */
.hist--used b.plus, .hist--off b.plus { color:var(--muted); }
.hist--used em, .hist--off em { color:var(--muted2); }
.hist--off b { text-decoration:line-through; }

/* Заказы */
.olist { padding:16px; display:flex; flex-direction:column; gap:10px; }
.oc { display:flex; flex-direction:column; gap:14px; padding:16px; border:1px solid var(--line); border-radius:16px; background:var(--field); color:var(--ink); text-align:left; }
.oc > div { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; }
.oc__n { display:flex; flex-direction:column; gap:5px; }
.oc__n b { font:600 15px/1 'Onest',sans-serif; }
.oc__n span { font:400 12.5px/1 'Onest',sans-serif; color:var(--muted); }
.opill { flex:none; height:24px; padding:0 9px; border-radius:12px; background:var(--accent-soft); color:var(--accent-ink); font:600 11.5px/24px 'Onest',sans-serif; white-space:nowrap; }
.opill.done { background:var(--btn2); color:var(--sub); }
.opill--l { height:26px; padding:0 10px; border-radius:13px; font-size:12px; line-height:26px; }
.oc__th { display:flex; gap:6px; }
.oc__th img { width:44px; height:55px; border-radius:8px; object-fit:cover; background:var(--img); }
.oc__sum { display:flex; align-items:center; gap:8px; font:600 15px/1 'Onest',sans-serif; white-space:nowrap; }
.oc__sum svg { color:var(--muted2); }
.ord { padding:16px; display:flex; flex-direction:column; gap:24px; }
.ordc { display:flex; flex-direction:column; gap:16px; padding:16px; border-radius:16px; background:var(--field); }
.ordc > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.ordc__n { display:flex; flex-direction:column; gap:5px; }
.ordc__n b { font:600 17px/1 'Onest',sans-serif; }
.ordc__n span { font:400 12.5px/1 'Onest',sans-serif; color:var(--muted); }
.steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.steps > div { display:flex; flex-direction:column; gap:8px; }
.steps i { height:4px; border-radius:2px; background:var(--line2); }
.steps span { font:500 10.5px/1.25 'Onest',sans-serif; letter-spacing:-.02em; color:var(--muted2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } /* «Подтверждён» не наезжает на соседний шаг */
.steps .on i { background:var(--accent); }
.steps .on span { color:var(--ink); }
.ordc__note { font:400 13px/1.4 'Onest',sans-serif; color:var(--sub); }
.oitems { display:flex; flex-direction:column; }
.oitems > b { font:600 15px/1 'Onest',sans-serif; margin-bottom:6px; }
.oi { display:flex; gap:12px; align-items:center; padding:12px 0; border:0; border-bottom:1px solid var(--line); background:none; color:var(--ink); text-align:left; width:100%; }
.oi img { flex:none; width:60px; height:75px; border-radius:10px; object-fit:cover; background:var(--img); }
.oi > span { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.oi small { font:400 11.5px/1 'Onest',sans-serif; color:var(--muted2); }
.oi span span { font:400 14px/1.3 'Onest',sans-serif; }
.oi em { font:400 12.5px/1 'Onest',sans-serif; font-style:normal; color:var(--muted); }
.oi > b { flex:none; font:600 14px/1 'Onest',sans-serif; white-space:nowrap; }
.kv3 { display:flex; justify-content:space-between; gap:12px; font:400 13.5px/1.3 'Onest',sans-serif; }
.kv3 > span:first-child { color:var(--muted); }
.kv3 > span:last-child { color:var(--sub); white-space:nowrap; }
.kv3 .red { color:var(--accent); }
.kv3--w > span:first-child { flex:none; }
.kv3--w > span:last-child { white-space:normal; text-align:right; min-width:0; overflow-wrap:anywhere; } /* адрес и получатель переносятся */
.otot { display:flex; justify-content:space-between; align-items:baseline; padding-top:10px; border-top:1px solid var(--line); }
.otot span { font:600 15px/1 'Onest',sans-serif; }
.otot b { font:600 19px/1 'Onest',sans-serif; }
.earn { font:400 12.5px/1.3 'Onest',sans-serif; color:var(--pos); }

/* Подписки */
.subs { padding:16px; display:flex; flex-direction:column; gap:28px; }
.sec14 { display:flex; flex-direction:column; gap:14px; }
.subs__r { display:flex; align-items:center; gap:14px; }
.subs__r > span, .sec14 > span { flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.subs__r b, .sec14 > span b { font:600 15px/1.2 'Onest',sans-serif; }
.subs__r small, .sec14 > span small { font:400 13px/1.4 'Onest',sans-serif; color:var(--muted); }
.swl { flex:none; width:48px; height:28px; border:0; border-radius:14px; padding:3px; background:var(--line2); display:flex; justify-content:flex-start; transition:background .2s; }
.swl.on { background:var(--ink); justify-content:flex-end; }
.swl i { width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.25); }
.bchip { display:flex; align-items:center; gap:4px; height:34px; padding:0 6px 0 12px; border-radius:17px; background:var(--field); font:500 13px/1 'Onest',sans-serif; }
.bchip button { width:24px; height:24px; border:0; border-radius:50%; background:none; color:var(--muted); display:grid; place-items:center; padding:0; }
.edit-b { align-self:flex-start; height:38px; padding:0 14px; border:1px solid var(--line2); border-radius:19px; background:none; color:var(--ink); font:500 13px/1 'Onest',sans-serif; }
.freq { display:flex; flex-direction:column; gap:10px; padding-top:6px; }
.freq small { font:400 12.5px/1.45 'Onest',sans-serif; color:var(--muted); }
.hr { height:1px; background:var(--line); }
.zrow { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.zrow > button:first-child { flex:1; min-width:0; display:flex; align-items:center; gap:12px; border:0; background:none; padding:0; color:var(--ink); text-align:left; }
.zrow img { flex:none; width:48px; height:60px; border-radius:10px; object-fit:cover; background:var(--img); }
.zrow span span { display:flex; flex-direction:column; gap:5px; }
.zrow > button:first-child > span { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.zrow b { font:500 14px/1.3 'Onest',sans-serif; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zrow small { font:400 12.5px/1 'Onest',sans-serif; color:var(--muted); }
.rm { flex:none; width:36px; height:36px; border:0; border-radius:50%; background:var(--field); color:var(--muted); display:grid; place-items:center; padding:0; }
.boxnote { padding:16px; border-radius:14px; background:var(--field); font:400 13px/1.5 'Onest',sans-serif; color:var(--muted); }

/* Поиск в шторке */
.sd-f { padding:14px 16px 4px; }
.sd-r { padding:12px 16px 20px; }
.sd-r > div { display:flex; flex-direction:column; gap:24px; }
.sec6 { display:flex; flex-direction:column; gap:6px; }
.sec6 > div { display:flex; justify-content:space-between; align-items:center; }
.sec6 > div button { border:0; background:none; padding:4px 0; color:var(--muted); font:500 12.5px/1 'Onest',sans-serif; }
.rec { display:flex; align-items:center; gap:10px; height:44px; border:0; border-bottom:1px solid var(--line); background:none; padding:0; color:var(--ink); font:400 14.5px/1 'Onest',sans-serif; text-align:left; width:100%; }
.rec svg { color:var(--muted2); }
.sec12 { display:flex; flex-direction:column; gap:12px; }
.scat { height:44px; padding:0 14px; border:0; border-radius:12px; background:var(--field); color:var(--ink); font:500 13.5px/1.2 'Onest',sans-serif; text-align:left; }
.allres { display:flex; align-items:center; justify-content:space-between; gap:10px; height:48px; margin-bottom:6px; padding:0 14px; border:0; border-radius:12px; background:var(--ink); color:var(--on-ink); font:600 13.5px/1 'Onest',sans-serif; width:100%; }
.srow { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.srow__i { flex:none; width:52px; height:64px; padding:0; border:0; border-radius:10px; overflow:hidden; background:var(--img); }
.srow__i img { width:100%; height:100%; object-fit:cover; display:block; }
.srow > div { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.art-s { align-self:flex-start; display:flex; align-items:center; gap:3px; border:0; background:none; padding:2px; color:var(--muted2); font:500 10.5px/1 'Onest',sans-serif; cursor:copy; }
.art-s--c { font-size:11.5px; }
.tbtn-t { border:0; background:none; padding:0; color:var(--ink); font:400 14px/1.3 'Onest',sans-serif; text-align:left; cursor:pointer; }
.srow b { font:600 13.5px/1 'Onest',sans-serif; color:var(--ink); }
.snone { padding:40px 8px; text-align:center; display:flex; flex-direction:column; gap:8px; }
.snone b { font:600 16px/1.3 'Onest',sans-serif; }
.snone span { font:400 13px/1.45 'Onest',sans-serif; color:var(--muted); }

/* Избранное */
.fhead { flex:none; display:flex; flex-direction:column; gap:12px; padding:14px 16px 6px; }
.fhead > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.fhead > div:first-child > span { font:400 13px/1.3 'Onest',sans-serif; color:var(--muted); }
.shr { display:flex; align-items:center; gap:6px; height:32px; padding:0 10px; border:1px solid var(--line2); border-radius:10px; background:none; color:var(--ink); font:500 12.5px/1 'Onest',sans-serif; }
.flist { padding:0 16px 16px; }
.frow { display:flex; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); }
.frow__i { position:relative; flex:none; width:88px; height:110px; padding:0; border:0; border-radius:12px; overflow:hidden; background:var(--img); }
.frow__i img { width:100%; height:100%; object-fit:cover; display:block; }
.frow__i em { position:absolute; left:6px; top:6px; font:600 10px/1 'Onest',sans-serif; font-style:normal; padding:4px 6px; border-radius:5px; background:#E5483A; color:#fff; }
.frow > div { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.frow--w > div { gap:9px; padding-top:4px; }
.frow--w .skel { display:block; border-radius:6px; }
.frow--w .frow__i { border-radius:12px; }
.frow > div > div:first-child { display:flex; align-items:center; gap:8px; }
.frm { flex:none; margin:-8px -8px 0 auto; width:32px; height:32px; border:0; background:none; color:var(--muted2); display:grid; place-items:center; padding:0; }
.frow .prices { margin-top:0; }
.frow .prices b { line-height:1; }
.frow .prices s { line-height:1; }
.fsz { display:flex; flex-wrap:wrap; gap:5px; margin-top:3px; }
.fbot { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:6px; }
.fbot span { font:400 11.5px/1.2 'Onest',sans-serif; color:var(--pos); }
.fbot span.low { color:var(--accent-ink); }
.fbot span.out { color:var(--muted2); }
.fbot span.pts { color:var(--muted); white-space:nowrap; }
.fbot span.pts b { font-weight:600; color:var(--ink); }
.fbot span.low { white-space:nowrap; }
.fadd { flex:none; height:34px; padding:0 12px; border:1px solid var(--line2); border-radius:10px; background:transparent; color:var(--muted); font:600 12px/1 'Onest',sans-serif; }
.fadd.ready { background:var(--ink); color:var(--on-ink); border-color:var(--ink); }
.fadd.inc { color:var(--ink); }
.ffoot { flex:none; padding:12px 16px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); }
.ffoot button { width:100%; }
.ffoot--n { padding-top:10px; padding-bottom:calc(10px + env(safe-area-inset-bottom)); }
.ffoot__n { display:flex; align-items:center; justify-content:center; gap:4px; min-height:24px; padding:0; border:0; background:none; font:400 13px/1.3 'Onest',sans-serif; color:var(--muted); text-align:center; }
button.ffoot__n { color:var(--ink); font-weight:500; }

/* Корзина и оформление */
.cart { padding:4px 16px 16px; }
.free { display:flex; flex-direction:column; gap:8px; padding:12px 0 6px; }
.free span { font:500 12.5px/1.3 'Onest',sans-serif; color:var(--sub); }
.crow { display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); }
.crow__i { flex:none; width:76px; height:96px; padding:0; border:0; border-radius:12px; overflow:hidden; background:var(--img); }
.crow__i img { width:100%; height:100%; object-fit:cover; display:block; }
.crow > div { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.crow__t { display:flex; justify-content:space-between; gap:8px; }
.crow__t span { font:400 14px/1.3 'Onest',sans-serif; }
.crow__rm { flex:none; width:30px; height:30px; margin:-5px -6px 0 0; border:0; background:none; color:var(--muted2); display:grid; place-items:center; padding:0; }
.crow__m { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.crow__m > span { font:400 12.5px/1.2 'Onest',sans-serif; color:var(--muted); }
.crow__b { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; }
.qty { display:flex; align-items:center; height:32px; border-radius:9px; background:var(--field); }
.qty button { width:32px; height:32px; border:0; background:none; color:var(--ink); display:grid; place-items:center; padding:0; }
.qty button:disabled { opacity:.35; }
.qty span { min-width:20px; text-align:center; font:600 13px/1 'Onest',sans-serif; }
.crow__b > b { font:600 14.5px/1 'Onest',sans-serif; white-space:nowrap; }
.tgl > span:first-child { flex:1; display:flex; flex-direction:column; gap:4px; }
.tgl > span:first-child b { font:500 14px/1.2 'Onest',sans-serif; }
.tgl > span:first-child small { font:400 12px/1.3 'Onest',sans-serif; color:var(--muted); }
.cart .tgl { margin-top:14px; }
.earn-c { display:block; padding:10px 4px 0; font:400 12.5px/1.4 'Onest',sans-serif; color:var(--pos); }
.cpn { display:flex; align-items:center; gap:8px; margin-top:8px; padding:6px 6px 6px 14px; border-radius:14px; background:var(--field); }
.cpn input { flex:1; min-width:0; height:40px; border:0; outline:0; background:none; color:var(--ink); font:400 15px/1 'Onest',sans-serif; text-transform:uppercase; }
.cpn input::placeholder { text-transform:none; }
.cpn button { flex:none; height:36px; padding:0 14px; border-radius:10px; font-size:12.5px; }
.cpn-on { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; padding:12px 14px; border-radius:14px; background:var(--accent-soft); font:500 12.5px/1.35 'Onest',sans-serif; color:var(--accent-ink); }
.cpn-on button { flex:none; width:24px; height:24px; border:0; border-radius:50%; background:none; color:inherit; display:grid; place-items:center; padding:0; }
.co { padding:14px 16px 18px; display:flex; flex-direction:column; gap:18px; }
.co > div { display:flex; flex-direction:column; gap:8px; }
.co > div > b { font:600 14px/1 'Onest',sans-serif; }
.fld { display:flex; flex-direction:column; gap:6px; }
.inp { height:48px; padding:0 14px; border-radius:12px; border:1px solid var(--line); background:var(--field); color:var(--ink); font:400 16px/1 'Onest',sans-serif; outline:0; width:100%; }
.inp.err { border-color:var(--accent); }
.ferr { font:400 12px/1.3 'Onest',sans-serif; color:var(--accent); }
.fhint { font:400 12px/1.3 'Onest',sans-serif; color:var(--muted2); }
.phone { display:flex; gap:6px; }
.ccb { flex:none; display:flex; align-items:center; gap:6px; height:48px; padding:0 10px 0 12px; border-radius:12px; border:1px solid var(--line); background:var(--field); color:var(--ink); font:500 14px/1 'Onest',sans-serif; white-space:nowrap; }
.ccb.err { border-color:var(--accent); }
.ccb small { font:600 11px/1 'Onest',sans-serif; color:var(--muted); }
.ccb svg { color:var(--muted); transition:transform .2s; }
.ccb.open svg { transform:rotate(180deg); }
.phone .inp { flex:1; min-width:0; font-variant-numeric:tabular-nums; }
.cclist { display:flex; flex-direction:column; max-height:240px; overflow-y:auto; border:1px solid var(--line); border-radius:12px; background:var(--field); scrollbar-width:none; }
.cclist button { display:flex; align-items:center; gap:10px; min-height:44px; padding:0 14px; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); font:400 14px/1 'Onest',sans-serif; text-align:left; }
.cclist button.on { background:var(--btn2); }
.cclist small { flex:none; width:26px; font:600 11px/1 'Onest',sans-serif; color:var(--muted); }
.cclist span { flex:1; }
.cclist em { font-style:normal; color:var(--muted); }
.tgfill { align-self:flex-start; display:flex; align-items:center; gap:6px; height:32px; padding:0 10px; border:1px solid var(--line2); border-radius:10px; background:none; color:var(--ink); font:500 12.5px/1 'Onest',sans-serif; }
.opt { display:flex; align-items:center; gap:12px; padding:14px; border-radius:14px; border:1px solid var(--line); background:var(--field); color:var(--ink); text-align:left; width:100%; }
.opt.on { border-color:var(--ink); }
.opt > i { flex:none; width:20px; height:20px; border-radius:50%; border:1.5px solid var(--dis); display:grid; place-items:center; }
.opt > i::after { content:''; width:10px; height:10px; border-radius:50%; background:transparent; }
.opt.on > i { border-color:var(--ink); }
.opt.on > i::after { background:var(--ink); }
.opt > span { flex:1; display:flex; flex-direction:column; gap:4px; min-width:0; }
.opt b { font:500 14px/1.2 'Onest',sans-serif; }
.opt small { font:400 12px/1.3 'Onest',sans-serif; color:var(--muted); }
.co .payln { flex-direction:row; align-items:baseline; gap:12px; }
.payln > span { flex:1; min-width:0; text-align:right; font:400 13px/1.35 'Onest',sans-serif; color:var(--muted); }
.opt > em { font:500 13px/1 'Onest',sans-serif; font-style:normal; color:var(--sub); white-space:nowrap; }
.cmt { flex:none; display:block; width:100%; min-height:96px; padding:14px 16px; border-radius:14px; border:1px solid var(--line2); background:var(--field); color:var(--ink); font:400 16px/1.45 'Onest',sans-serif; outline:0; resize:vertical; -webkit-appearance:none; appearance:none; }
.cmt:focus, .inp:focus { border-color:var(--ink); }
.cns { display:flex; align-items:flex-start; gap:10px; padding:2px 0 6px; cursor:pointer; font:400 12px/1.45 'Onest',sans-serif; color:var(--muted); }
/* Оформление — компактно: поля 44 px, варианты плотнее, низ — сумма одной строкой, согласия мелко */
.co__h b { font:600 14px/1 'Onest',sans-serif; }
.co__h { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:28px; }
.co .inp { height:44px; padding:0 13px; border-radius:11px; font-size:15px; }
.co .ccb { height:44px; border-radius:11px; font-size:13.5px; padding:0 9px 0 11px; }
.co .opt { gap:11px; padding:11px 13px; border-radius:12px; }
.co .opt > i { width:18px; height:18px; }
.co .opt > i::after { width:8px; height:8px; }
.co .opt > span { gap:3px; }
.co .opt b { font-size:13.5px; line-height:1.25; }
.co .opt small { font-size:11.5px; }
.co .opt > em { font-size:13px; }
.co .cmt { min-height:66px; padding:11px 13px; border-radius:11px; border-color:var(--line); font-size:15px; line-height:1.4; }
.co .cmt:focus { border-color:var(--ink); }
.co .tgfill { align-self:auto; height:28px; padding:0 9px; gap:5px; border-radius:9px; font-size:12px; color:var(--sub); }
.co .ferr, .co .fhint { font-size:11.5px; }
.dfoot--co { padding:10px 16px calc(12px + env(safe-area-inset-bottom)); gap:4px; }
.cot { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.cot span { display:flex; flex-direction:column; gap:4px; font:600 15px/1 'Onest',sans-serif; }
.cot small { font:400 12px/1 'Onest',sans-serif; color:var(--muted); }
.cot b { font:600 19px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; }
.dfoot--co .cns { gap:8px; padding:1px 0 3px; font-size:11.5px; line-height:1.35; }
.dfoot--co .cns input { width:16px; height:16px; }
.dfoot--co .big-red { height:48px; border-radius:12px; margin-top:4px; }
.cns.err { color:var(--accent); }
.cns input { flex:none; width:18px; height:18px; margin:0; accent-color:var(--ink); cursor:pointer; }
.cns a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
.co-done { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:24px; text-align:center; }
.co-done > i { width:64px; height:64px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; margin-bottom:8px; }
.co-done b { font:600 20px/1.25 'Onest',sans-serif; }
.co-done span { font:400 14px/1.5 'Onest',sans-serif; color:var(--muted); max-width:280px; }
.co-done button { margin-top:12px; height:50px; padding:0 26px; border-radius:14px; font-size:14.5px; }

/* Фильтры */
.flt { padding:16px; display:flex; flex-direction:column; gap:24px; }
.flt > div { display:flex; flex-direction:column; gap:10px; }
.flt > div > b { font:600 15px/1 'Onest',sans-serif; }
.flt .x-chip { flex:initial; }
.szf { min-width:48px; height:40px; padding:0 13px; border-radius:11px; }
.flt .dash-more { margin-top:0; }
.flt .note-c { padding:6px 0; text-align:left; }
.prh { display:flex; justify-content:space-between; align-items:baseline; }
.prh b { font:600 15px/1 'Onest',sans-serif; }
.prh span { font:500 13px/1 'Onest',sans-serif; color:var(--sub); }
.rng { width:100%; accent-color:var(--accent); }
.flt .tgl > span:first-child { flex:1; font:500 14px/1.2 'Onest',sans-serif; }

/* Нижний лист */
.sh { position:absolute; left:0; right:0; bottom:0; margin:0 auto; max-width:600px; z-index:23; max-height:min(80%, calc(100% - var(--top) - 12px)); background:var(--sheet); color:var(--ink); border-radius:22px 22px 0 0; display:flex; flex-direction:column; transform:translateY(105%); visibility:hidden; transition:transform .35s cubic-bezier(.2,.8,.2,1), visibility 0s .35s; box-shadow:0 -20px 60px var(--shadow); padding-bottom:env(safe-area-inset-bottom); }
.sh.on { transform:none; visibility:visible; transition:transform .35s cubic-bezier(.2,.8,.2,1); } /* закрытый лист с тенью не выглядывает из-под края */
.sh__g { display:flex; justify-content:center; padding:10px 0 4px; }
.sh__g i { width:38px; height:4px; border-radius:2px; background:var(--line2); }
.sh__h { display:flex; align-items:center; justify-content:space-between; padding:8px 12px 8px 18px; }
.sh__h b { flex:1; min-width:0; font:600 17px/1.2 'Onest',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sh__x { width:34px; height:34px; border:0; border-radius:50%; background:var(--btn2); color:var(--ink); display:grid; place-items:center; padding:0; }
.sh__b { overflow-y:auto; overscroll-behavior:contain; padding:4px 16px 18px; scrollbar-width:none; }
.sorto { display:flex; align-items:center; justify-content:space-between; height:52px; border:0; border-bottom:1px solid var(--line); background:none; padding:0; color:var(--ink); font:400 15px/1 'Onest',sans-serif; text-align:left; width:100%; }
.sorto svg { stroke:transparent; }
.sorto.on svg { stroke:var(--ink); }
.sorto.sv svg { stroke:var(--muted2); }
.qr { display:flex; flex-direction:column; align-items:center; gap:16px; padding:4px 0 6px; text-align:center; }
.qr__box { width:min(72vw,260px); aspect-ratio:1; padding:16px; border-radius:20px; background:#FFFFFF; box-shadow:0 0 0 1px rgba(0,0,0,.06); }
.qr__box svg { width:100%; height:100%; }
.qr__id { display:flex; flex-direction:column; gap:6px; }
.qr__id b { font:700 24px/1 var(--disp); letter-spacing:.08em; font-variant-numeric:tabular-nums; }
.qr__id span { font:400 13px/1.4 'Onest',sans-serif; color:var(--muted); white-space:nowrap; }
.qr__tm { display:flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; background:var(--field); font:500 12px/1 'Onest',sans-serif; color:var(--sub); white-space:nowrap; }
.qr__tm i { width:7px; height:7px; border-radius:50%; background:var(--pos); }
.qr > small { font:400 12.5px/1.45 'Onest',sans-serif; color:var(--muted2); max-width:300px; }
.sh-col { display:flex; flex-direction:column; gap:14px; }
.ifield--s { height:44px; }
.dchips { display:flex; flex-wrap:wrap; gap:6px; max-height:42vh; overflow-y:auto; scrollbar-width:none; }
.sh-foot { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; }
.sh-foot button { height:48px; border-radius:14px; }
.sh-foot button:first-child { padding:0 16px; }
.sh-foot button:last-child { font-size:14px; }
.gtabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; padding:4px; border-radius:12px; background:var(--field); }
.gtabs button { height:36px; border:0; border-radius:9px; background:transparent; color:var(--ink); font:500 13px/1 'Onest',sans-serif; }
.gtabs button.on { background:var(--ink); color:var(--on-ink); }
.gtw { overflow-x:auto; border-radius:14px; border:1px solid var(--line); }
.gt { display:grid; min-width:100%; font:400 13.5px/1 'Onest',sans-serif; font-variant-numeric:tabular-nums; }
.gt span { padding:14px 10px; white-space:nowrap; border-bottom:1px solid var(--line); color:var(--ink); }
.gt .gh { background:var(--field); color:var(--muted); font-weight:500; font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.gt .g0 { font-weight:600; }
.gt .gs { background:var(--accent-soft); }
.gsel { font:500 12.5px/1.3 'Onest',sans-serif; color:var(--accent-ink); }
.gtip { display:flex; flex-direction:column; gap:6px; padding:14px; border-radius:14px; background:var(--field); }
.gtip b { font:600 13.5px/1.2 'Onest',sans-serif; }
.gtip span { font:400 13px/1.5 'Onest',sans-serif; color:var(--muted); }
.sh-b46 { height:46px; border-radius:12px; }
.qp { display:flex; gap:12px; align-items:center; }
.qp img { flex:none; width:80px; height:100px; border-radius:12px; object-fit:cover; background:var(--img); }
.qp > span { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.qp small { font:400 11.5px/1 'Onest',sans-serif; color:var(--muted2); }
.qp span span { font:500 14.5px/1.3 'Onest',sans-serif; }
.qp b { font:600 14.5px/1 'Onest',sans-serif; color:var(--ink); }
.qsec { display:flex; flex-direction:column; gap:8px; padding-top:6px; }
.qsec > b { font:600 13.5px/1 'Onest',sans-serif; }
.bubble { align-self:stretch; width:100%; padding:12px 14px; border-radius:16px 16px 16px 4px; background:var(--field); font:400 13.5px/1.5 'Onest',sans-serif; color:var(--ink); white-space:pre-line; }
.qsend { height:52px; border-radius:14px; }
.qsend:disabled { background:var(--btn2); color:var(--muted); }
.qnote { font:400 12px/1.4 'Onest',sans-serif; color:var(--muted2); text-align:center; }
.tpsel { position:relative; }
.tpsel select { width:100%; height:46px; padding:0 38px 0 14px; border:1px solid var(--line); border-radius:12px; background:var(--field); color:var(--ink); font:400 15px/1 'Onest',sans-serif; outline:0; -webkit-appearance:none; appearance:none; }
.tpsel svg { position:absolute; right:13px; top:15px; color:var(--muted); pointer-events:none; }
.tprow { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding:0; border:0; background:none; color:var(--ink); font:500 14px/1.2 'Onest',sans-serif; text-align:left; }
.tperr { padding:11px 13px; border-radius:12px; background:var(--accent-soft); color:var(--accent-ink); font:500 13px/1.35 'Onest',sans-serif; }
.sent { display:flex; flex-direction:column; align-items:center; gap:10px; padding:10px 0 4px; text-align:center; }
.sent > i { width:56px; height:56px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; margin-bottom:4px; }
.sent > b { font:600 20px/1.2 'Onest',sans-serif; }
.sent > span { font:400 13.5px/1.5 'Onest',sans-serif; color:var(--muted); max-width:290px; }
.sent > div { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; width:100%; margin-top:8px; }
.pk { display:flex; gap:12px; align-items:center; }
.pk img { width:52px; height:64px; border-radius:10px; object-fit:cover; background:var(--img); }
.pk > span { display:flex; flex-direction:column; gap:4px; }
.pk span span { font:400 14px/1.3 'Onest',sans-serif; }
.pk b { font:600 14px/1 'Onest',sans-serif; }
.pk__n { font:500 13px/1.3 'Onest',sans-serif; color:var(--accent-ink); }

/* Приложение в браузере (web.js): вход через Telegram, подтверждение в Mini App, подсказка установки на экран. */
.wlcard { display:flex; align-items:center; gap:14px; padding:18px 18px 18px 20px; border:0; border-radius:22px; background:var(--ink); color:var(--on-ink); text-align:left; }
.wlcard > span { flex:1; display:flex; flex-direction:column; gap:6px; }
.wlcard b { font:600 17px/1.2 'Onest',sans-serif; }
.wlcard small { font:400 12.5px/1.4 'Onest',sans-serif; opacity:.7; }
.wlcard > em { flex:none; width:44px; height:44px; border-radius:50%; background:#2AABEE; color:#fff; display:grid; place-items:center; }
.wl { gap:12px; }
.wl__why { font:600 15px/1.3 'Onest',sans-serif; }
.wl__t { font:400 13.5px/1.5 'Onest',sans-serif; color:var(--muted); }
.wl__t b { color:var(--ink); font-weight:600; }
.big-tg { height:52px; border-radius:14px; text-decoration:none; }
.wl__pc { display:flex; align-items:center; justify-content:center; text-decoration:none; }
.wl__lnk { align-self:center; padding:6px 10px; border:0; background:none; color:var(--muted); font:500 13px/1.2 'Onest',sans-serif; text-decoration:underline; text-underline-offset:3px; }
.wl__qr { display:flex; flex-direction:column; align-items:center; gap:10px; }
.wl__qr .qr__box { width:min(60vw,220px); }
.wl__qr small { font:400 12.5px/1.4 'Onest',sans-serif; color:var(--muted2); }
.wl__st { display:flex; align-items:center; justify-content:center; gap:8px; min-height:20px; font:500 12.5px/1.3 'Onest',sans-serif; color:var(--muted2); }
.wl__st i { width:8px; height:8px; border-radius:50%; background:#2AABEE; animation:wlpulse 1.4s ease-in-out infinite; }
@keyframes wlpulse { 50% { opacity:.25; transform:scale(.7); } }
.wl__dev { display:flex; align-items:center; gap:12px; padding:14px; border-radius:14px; background:var(--field); }
.wl__dev > svg { flex:none; color:var(--muted); }
.wl__dev span { display:flex; flex-direction:column; gap:4px; }
.wl__dev b { font:600 15px/1.2 'Onest',sans-serif; }
.wl__dev small { font:400 12.5px/1 'Onest',sans-serif; color:var(--muted2); }
.wl__warn { padding:11px 13px; border-radius:12px; background:var(--accent-soft); color:var(--accent-ink); font:500 13px/1.35 'Onest',sans-serif; }
.ins__s { display:flex; flex-direction:column; gap:12px; margin:0; padding:0; list-style:none; }
.ins__s li { display:flex; align-items:flex-start; gap:12px; font:400 14px/1.45 'Onest',sans-serif; }
.ins__s em { flex:none; width:26px; height:26px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; font:600 12.5px/1 'Onest',sans-serif; font-style:normal; }
.ins__i { display:inline-grid; place-items:center; width:24px; height:24px; margin:0 2px; border-radius:7px; background:var(--field); color:#0A84FF; vertical-align:-6px; }
.mrow > span .mrow__s { display:block; margin-top:3px; font:400 12px/1.2 'Onest',sans-serif; color:var(--muted2); }
.mrow > .sw { flex:none; } /* переключатель в строке меню: правило .mrow > span растягивало его на всю ширину */

/* Браузер и экран «Домой» (web.js: is-web, is-pwa). Шапка: «Назад» слева, чат справа — там, где в Telegram его кнопки;
   капсулы как плашка «N3 · Сделано в north3» (.n3 a). */
.hdb { position:absolute; z-index:8; top:calc(var(--barpad) + (var(--bar) - var(--barpad) - 36px) / 2); display:flex; align-items:center; gap:8px; height:36px; padding:0 12px 0 6px; border:1px solid var(--line); border-radius:999px; background:var(--glass); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); color:var(--muted); white-space:nowrap; }
.hdb--l { left:12px; }
.hdb--r { right:12px; padding:0 6px 0 12px; }
.hdb b { flex:none; width:24px; height:24px; border-radius:50%; background:var(--ink); color:var(--on-ink); display:grid; place-items:center; }
.hdb span { font:500 11.5px/1 'Onest',sans-serif; letter-spacing:.02em; }
.hdb:active { border-color:var(--line2); color:var(--ink); }
.hdb[hidden] { display:none; }
/* Экран «Домой»: под нижней панелью — полоса жеста iPhone; полный отступ безопасной зоны оставлял пустое место. */
.is-pwa { --navb:max(6px, calc(env(safe-area-inset-bottom) - 10px)); }

/* Старые WebView (iOS 14, Chrome < 88): без aspect-ratio карточки и галерея схлопнулись бы в ноль. */
@supports not (aspect-ratio:1/1) {
	.card__m::before { content:''; display:block; padding-top:125%; }
	.card__m img { position:absolute; top:0; left:0; }
	.gal__t { height:125vw; max-height:85vh; }
	.banner { height:47vw; }
	.all-t { min-height:62vw; }
	.qr__box { height:min(72vw,260px); }
}