/* Панель владельца — своё сверх оформления панели SORRY VPN. Только токены, никаких цветов «по месту». */

/* hidden прячет и кнопки: у .btn свой display, и без этого «Убрать»/«Фирменный» висели, когда убирать нечего */
[hidden] { display: none !important; }

/* Покупатель в кабинете: имя на всю ширину, блокировка — кнопкой-значком */
.pt-buyer { align-items: center; gap: 12px; }
.pt-buyer .row__body { min-width: 0; }
.pt-buyer .row__title { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-width: 0; }
.pt-buyer__name { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-buyer__ban { flex: none; color: var(--fg-3); }
.pt-buyer__ban:not(.btn--ghost) { color: var(--ok); }
.pt-buyer--banned .avatar { opacity: .5; }

/* Карточка магазина в кабинете: обложка, название и тег, статус; строка фактов и одна главная кнопка */
.pt-bot { display: grid; gap: 12px; padding: 16px; }
.pt-bot__head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pt-bot__cover { flex: none; width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; overflow: hidden;
  color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); }
.pt-bot__cover img { width: 100%; height: 100%; object-fit: cover; }
.pt-bot__main { flex: 1; min-width: 0; display: grid; gap: 2px; }
.pt-bot__name { font-size: 18px; font-weight: 700; letter-spacing: -0.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-bot__tag { font-size: 12.5px; color: var(--fg-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-bot__facts { font-size: 13px; color: var(--fg-2); }
.row[disabled] { opacity: .5; }

/* «Редактирование бота» — как у PayCore: обложка с предупреждением о размере, тег только для чтения, неубираемые админы */
.bx-ro { display: flex; align-items: center; color: var(--fg-2); background: color-mix(in srgb, var(--fg) 4%, transparent); }
.bx-cover { display: grid; gap: 10px; padding: 12px; }
.bx-warn { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: 12px; font-size: 13px; line-height: 1.4;
  color: #ffd59a; background: rgba(240, 150, 30, .16); border: 1px solid rgba(240, 150, 30, .55); }
:root[data-theme="light"] .bx-warn { color: #8a4b00; }
.bx-warn svg { flex: none; margin-top: 1px; }
.bx-cover__img { display: block; width: 100%; max-height: 220px; object-fit: cover; border-radius: 14px; }
.bx-cover__empty { display: grid; place-items: center; gap: 6px; padding: 22px 12px; border-radius: 14px; text-align: center; font-size: 13px;
  color: var(--fg-3); border: 1px dashed var(--line); }
.bx-line { display: flex; gap: 8px; }
.bx-line > label { cursor: pointer; }
.bx-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.bx-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 8px; font-size: 12px; color: var(--fg-2);
  border: 1px solid var(--line); }
.bx-switch { margin: 4px 0 10px; padding: 12px 2px; font-size: 15px; }
.bx-go { justify-content: center; margin-top: 8px; }
.bx-steps { display: flex; gap: 6px; margin-bottom: 14px; }
.bx-steps i { flex: 1; height: 4px; border-radius: 4px; background: color-mix(in srgb, var(--fg) 12%, transparent); }
.bx-steps i.on { background: var(--accent); }
.bx-step { margin: 0 0 12px; font-size: 13px; color: var(--fg-3); }
.bx-ok { display: flex; gap: 10px; align-items: center; padding: 12px; border-radius: 14px; background: var(--ok-soft); color: var(--fg); }
.bx-ok svg { color: var(--ok); flex: none; }

/* Промокоды: код — плашкой (копируется нажатием), справа переключатель «работает» и карандаш */
.adm-promo { display: grid; gap: 6px; padding: 14px; }
.adm-promo + .adm-promo { border-top: 1px solid var(--line); }
.adm-promo__head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.adm-promo__code { flex: 0 1 auto; min-width: 0; padding: 6px 9px; border-radius: 10px; border: 1px dashed color-mix(in srgb, var(--accent) 55%, transparent);
  background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent); font-size: 12.5px; font-weight: 700; letter-spacing: .04em;
  cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-promo__off { flex: none; font-size: 16px; }
.adm-shop__name { min-width: 0; font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-promo__tools { margin-left: auto; flex: none; display: flex; align-items: center; gap: 6px; }
.adm-promo__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 13px; color: var(--fg-2); }
.adm-promo__switch { width: auto; padding: 4px 2px; }
.adm-promo__input { text-transform: uppercase; letter-spacing: .06em; }
.adm-promo__unit { flex: 0 0 36px; display: grid; place-items: center; font-weight: 700; color: var(--fg-2); }
.adm-promo__gen { flex: 0 0 48px !important; padding: 0; }
.adm-promo__line { display: flex; gap: 8px; align-items: stretch; }
.adm-promo__line > .input { flex: 1 1 0; min-width: 0; }
.adm-promo__pick { justify-content: flex-start; }
.adm-promo__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 10px; }

.adm-money { display: flex; align-items: baseline; gap: 6px; }
.adm-row-end { margin-left: auto; text-align: right; white-space: nowrap; }
.adm-row-end b { display: block; font: 700 14px/1.2 var(--mono); }
.adm-row-end small { color: var(--fg-3); font-size: 11.5px; }
.adm-chips { display: flex; gap: 6px; flex-wrap: wrap; }

/* Плитки раскладки «Бот → Фото»: превью своего фото или нарисованной карточки */
.adm-media { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
.adm-media__item { display: grid; gap: 8px; padding: 10px; }
.adm-media__pic { aspect-ratio: 1200 / 630; border-radius: var(--r-sm); background: var(--sunken) center / cover no-repeat;
  display: grid; place-items: center; color: var(--fg-3); font-size: 12px; text-align: center; padding: 6px; }
.adm-media__title { font-weight: 700; font-size: 13.5px; }
.adm-media__actions { display: flex; gap: 6px; }
.adm-media__actions .btn { flex: 1; }
@media (min-width: 720px) { .adm-media { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Эмодзи: сетка значков с подписью роли, своё — с точкой акцента */
.adm-emoji { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.adm-emoji__item { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 10px; border: 1px solid var(--line);
  border-radius: var(--r-sm); background: var(--s-1); color: var(--fg); font: inherit; text-align: left; cursor: pointer; }
.adm-emoji__glyph { flex: none; width: 30px; height: 30px; display: grid; place-items: center; font-size: 22px; }
.adm-emoji__glyph img { width: 28px; height: 28px; }
.adm-emoji__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--fg-2); }
.adm-emoji__item--own { border-color: var(--accent-line); }
.adm-emoji__item--own .adm-emoji__name::after { content: " •"; color: var(--accent); }

.adm-preview { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.45; }

/* Партнёрская панель → «Оформление»: меню бота как в Telegram — ряды кнопок; серые — кнопки платформы */
.pt-menu { display: grid; gap: 6px; padding: 12px; }
.pt-row { display: flex; gap: 6px; }
.pt-btn { flex: 1 1 0; min-width: 0; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--s-2); color: var(--fg); font: 600 13.5px/1.2 var(--font); text-align: center; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.pt-btn:disabled { opacity: .55; cursor: default; }
.pt-btn--primary { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent); }
.pt-btn--success { background: rgba(34, 197, 94, .14); border-color: rgba(34, 197, 94, .4); color: var(--ok); }
.pt-btn--danger { background: rgba(239, 68, 68, .14); border-color: rgba(239, 68, 68, .4); color: var(--bad); }
.pt-btn--add { flex: 0 0 44px; color: var(--fg-3); border-style: dashed; display: grid; place-items: center; }

/* Обёртка премиум-эмодзи (под анимацию): строчным блоком с размером картинки, чтобы плитки не прыгали по высоте */
.pe-anim { display: inline-block; line-height: 0; vertical-align: -0.22em; }
.hx-emoji-tile__glyph .pe-anim, .hx-emoji .pe-anim, .tx-emo__tile .pe-anim { vertical-align: middle; }

/* «Mini App» → «Игры на главной»: одна строка на игру — номер, название, стрелки порядка, переключатель */
.adm-games { display: grid; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
.adm-game { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 10px;
  padding: 10px 12px; border-top: 1px solid var(--line); background: var(--s-1); }
.adm-game:first-child { border-top: 0; }
.adm-game--off .adm-game__title { color: var(--fg-3); }
.adm-game__n { font-size: 11.5px; color: var(--fg-3); width: 18px; }
.adm-game__main { min-width: 0; display: grid; gap: 2px; }
.adm-game__title { font-weight: 650; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-game__meta { font-size: 11.5px; color: var(--fg-3); }
.adm-game__move { display: inline-flex; gap: 4px; }
.adm-game__btn { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; border: 1px solid var(--line);
  background: transparent; color: var(--fg-2); cursor: pointer; }
.adm-game__btn:disabled { opacity: .3; cursor: default; }
.adm-game .switch { flex: none; }

/* Конструктор меню: превью приветствия и кнопки с премиум-эмодзи */
.pt-welcome { display: block; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 0; }
.pt-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.pt-btn > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.pt-btn .pe, .pt-btn .pe-anim { flex: none; }

/* «Финансы» → «Цены»: позиция — закупка → цена, справа наценка % и своя цена */
.adm-prices { display: grid; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
/* Строка товара: сверху название и расчёт, снизу два поля вровень — на телефоне три колонки в ряд не помещались */
.adm-price { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: 8px 10px; padding: 12px;
  border-top: 1px solid var(--line); background: var(--s-1); }
.adm-price:first-child { border-top: 0; }
.adm-price--own { box-shadow: inset 3px 0 0 var(--accent); }
.adm-price__main { grid-column: 1 / -1; min-width: 0; display: grid; gap: 3px; }
.adm-price__title { font-weight: 650; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-price__meta { font-size: 12px; color: var(--fg-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-price__meta b { color: var(--fg); }
.adm-price .input { padding-left: 8px; padding-right: 8px; min-width: 0; }

/* ─── карточка человека: кто он, деньги и всё, что о нём известно ─── */
.adm-person { padding: 14px 16px; display: grid; gap: 12px; }
.adm-person__top { display: flex; align-items: center; gap: 12px; }
.adm-person__ava { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; flex: none;
  background: var(--accent-soft); color: var(--accent); font-weight: 700; font-size: 19px; }
.adm-person__name { font-weight: 700; font-size: 17px; letter-spacing: -0.02em; }
.adm-person__sub { color: var(--fg-3); font-size: 12.5px; margin-top: 2px; }
.adm-person__kv { display: grid; gap: 2px; }

/* ─── редактор витрины Mini App: живой предпросмотр в «телефоне», черновик, поля по разделам ─── */
.vx-stage { display: flex; justify-content: center; margin: 6px 0 8px; }
/* Живой предпросмотр: витрина шириной телефона (375 px), уменьшенная до рамки */
.vx-phone--live .vx-viewport { width: 222px; height: 470px; overflow: hidden; border-radius: 24px; background: #0b0f16; }
.vx-frame { width: 375px; height: 794px; border: 0; transform: scale(0.592); transform-origin: 0 0; display: block; }
.vx-phone { width: 236px; padding: 7px; border-radius: 30px; background: #05070c; border: 1px solid var(--line);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }
.vx-screen { position: relative; height: 430px; overflow: hidden; border-radius: 24px; background: #0a0f1a center / cover no-repeat; color: #fff; }
.vx-dim { position: absolute; inset: 0; background: #05080e; }
.vx-inner { position: relative; padding: 12px 10px 0; display: grid; gap: 7px; }
.vx-top { font: 800 13px/1 var(--font); letter-spacing: .02em; }
.vx-banner { width: 100%; height: 54px; object-fit: cover; border-radius: 10px; }
.vx-card { border-radius: 12px; background: rgba(22, 30, 46, .92); border: 1px solid rgba(255, 255, 255, .08); }
.vx-glass--liquid.vx-screen--bg .vx-card { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .2);
  backdrop-filter: blur(10px) saturate(170%); -webkit-backdrop-filter: blur(10px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22); }
.vx-glass--frost.vx-screen--bg .vx-card { background: rgba(20, 28, 44, .7); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.vx-hero { padding: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--vx-accent) 38%, #0d1424), #0d1424); }
.vx-eyebrow { font: 700 6.5px/1 var(--mono); letter-spacing: .14em; color: color-mix(in srgb, var(--vx-accent) 70%, #fff); }
.vx-title { margin-top: 5px; font: 800 16px/1.1 var(--font); letter-spacing: -.02em; overflow-wrap: anywhere; }
.vx-text { margin-top: 4px; font-size: 8.5px; line-height: 1.35; color: rgba(255, 255, 255, .72); }
.vx-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
.vx-badges span { padding: 3px 6px; border-radius: 99px; font-size: 7px; font-weight: 700; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .14); }
.vx-search { display: flex; align-items: center; gap: 5px; padding: 7px 8px; font-size: 8px; color: rgba(255, 255, 255, .5); }
.vx-sec { font: 600 7px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.vx-sec b { color: var(--vx-accent); }
.vx-rows { display: grid; gap: 5px; padding: 7px; }
.vx-rows i { height: 9px; border-radius: 4px; background: rgba(255, 255, 255, .1); }
.vx-grid { display: grid; gap: 5px; }
.vx-tile { height: 52px; background: linear-gradient(150deg, color-mix(in srgb, var(--vx-accent) 30%, #101827), rgba(16, 24, 39, .9)); }
.vx-nav { position: absolute; left: 8px; right: 8px; bottom: 8px; display: flex; justify-content: space-around; padding: 6px; border-radius: 99px;
  background: rgba(14, 20, 32, .92); border: 1px solid rgba(255, 255, 255, .1); font-size: 7.5px; color: rgba(255, 255, 255, .55); }
.vx-nav .on { color: #fff; padding: 2px 8px; border-radius: 99px; background: color-mix(in srgb, var(--vx-accent) 40%, transparent); }
.vx-draft { display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-bottom: 10px; font-size: 13px; line-height: 1.35;
  border-color: color-mix(in srgb, var(--accent) 45%, transparent) !important; }
.vx-draft > svg { flex: none; color: var(--accent); }
.vx-draft .btn { flex: none; margin-left: auto; }
.vx-row { padding: 0; }
.vx-switch { padding: 6px 0; font-size: 14.5px; }
.vx-count { align-self: flex-end; font: 500 11px/1 var(--mono); color: var(--fg-4, var(--fg-3)); }
.vx-swatches { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.vx-swatch { position: relative; width: 30px; height: 30px; padding: 0; border-radius: 10px; border: 2px solid transparent; background: var(--c);
  cursor: pointer; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); }
.vx-swatch.on { border-color: var(--fg); }
.vx-swatch--own { background: conic-gradient(#ef4444, #f59e0b, #22c55e, #3b82f6, #a855f7, #ef4444); }
.vx-swatch--own.on { background: var(--c); }
.vx-swatch--own input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.vx-range { display: flex; align-items: center; gap: 12px; }
.vx-range input { flex: 1; accent-color: var(--accent); }
.vx-range b { min-width: 42px; text-align: right; font: 600 13px/1 var(--mono); }
.vx-image { display: grid; gap: 8px; margin-top: 6px; }
.vx-image__img { width: 100%; max-height: 160px; object-fit: cover; border-radius: 12px; }
.vx-image__empty { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 16px; border-radius: 12px;
  border: 1px dashed var(--line); color: var(--fg-3); font-size: 13px; }
.vx-products { padding: 4px 0; }
.vx-cat { padding: 12px 14px 4px; font: 600 11.5px/1.2 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--fg-3); }
.vx-product { gap: 12px; }
.vx-product__img { flex: none; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; overflow: hidden;
  color: var(--fg-3); background: color-mix(in srgb, var(--fg) 6%, transparent); }
.vx-product__img img { width: 100%; height: 100%; object-fit: contain; }
.vx-product__big { object-fit: contain; max-height: 180px; background: color-mix(in srgb, var(--fg) 5%, transparent); }

/* Конструктор кнопок: быстрые заготовки сеткой, перестановка — четырьмя стрелками в ряд */
.pt-presets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pt-moves { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.pt-moves .btn, .pt-presets .btn { justify-content: center; }
.pt-pick { justify-content: flex-start; }

/* ─── конструктор меню: превью — как сообщение главного меню в Telegram (фото, текст, клавиатура под ним) ─── */
.tgx { display: grid; gap: 6px; padding: 14px 10px; border-radius: 20px; border: 1px solid var(--line);
  background: radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 60%), #0b111c; }
:root[data-theme="light"] .tgx { background: radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 60%), #dfe7f1; }
.tgx-msg { overflow: hidden; border-radius: 16px 16px 16px 6px; background: #182233; box-shadow: 0 1px 0 rgba(0, 0, 0, .25); }
:root[data-theme="light"] .tgx-msg { background: #fff; }
.tgx-photo { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.tgx-photo img { display: block; width: 100%; max-height: 190px; object-fit: cover; }
.tgx-photo__empty { display: grid; justify-items: center; gap: 4px; padding: 22px 12px; color: var(--fg-3);
  background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 22%, #101a2a), #101a2a); }
.tgx-photo__empty b { color: var(--fg); font-size: 14px; }
.tgx-photo__empty small { font-size: 12px; }
.tgx-text { position: relative; display: block; width: 100%; padding: 10px 34px 12px 12px; border: 0; background: none; color: var(--fg);
  font: inherit; font-size: 14px; line-height: 1.45; text-align: left; white-space: pre-wrap; cursor: pointer; }
.tgx-edit { position: absolute; top: 9px; right: 10px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px;
  color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, transparent); }
.tgx-kb { display: grid; gap: 5px; }
.tgx-row { display: flex; gap: 5px; }
.tgx-btn { flex: 1 1 0; min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 6px 8px;
  border: 0; border-radius: 10px; background: rgba(36, 50, 72, .82); color: #fff; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tgx-btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tgx-btn img, .tgx-btn .pe { flex: none; }
:root[data-theme="light"] .tgx-btn { background: rgba(80, 110, 150, .32); color: #0e1726; }
.tgx-btn--primary { background: #2f7cf6; color: #fff; }
.tgx-btn--success { background: #2fa65a; color: #fff; }
.tgx-btn--danger { background: #e2453c; color: #fff; }
:root[data-theme="light"] .tgx-btn--primary, :root[data-theme="light"] .tgx-btn--success, :root[data-theme="light"] .tgx-btn--danger { color: #fff; }
.tgx-btn--off { opacity: .38; text-decoration: line-through; }
/* Встроенная кнопка, которой сейчас не будет у покупателя (ссылка не задана, нет адреса): бледная, с пунктиром */
.tgx-btn--na { opacity: .5; background: none !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); border: 1px dashed transparent; }
.tgx-btn--fixed { opacity: .45; cursor: default; }
.tgx-btn:not(.tgx-btn--fixed):active { transform: scale(.98); }
.tgx-add { flex: 0 0 40px; display: grid; place-items: center; border: 1px dashed color-mix(in srgb, var(--accent) 55%, transparent);
  border-radius: 10px; background: none; color: var(--accent); cursor: pointer; }
.tgx-addrow { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; border-radius: 10px; cursor: pointer;
  border: 1px dashed color-mix(in srgb, var(--accent) 55%, transparent); background: none; color: var(--accent); font: inherit; font-weight: 600; font-size: 13.5px; }

/* Шторка кнопки: превью кнопки, подпись со значком слева, что делает, цвет, перестановка */
.mb-preview { display: flex; padding: 12px; margin-bottom: 14px; border-radius: 14px; background: #0b111c; }
:root[data-theme="light"] .mb-preview { background: #dfe7f1; }
.mb-preview .tgx-btn { cursor: default; }
.mb-name { display: flex; gap: 8px; }
.mb-name .input { flex: 1; min-width: 0; }
.mb-emoji { flex: none; width: 46px; display: grid; place-items: center; border-radius: 12px; border: 1px solid var(--line);
  background: color-mix(in srgb, var(--fg) 5%, transparent); color: var(--fg-3); cursor: pointer; }
.mb-info { display: flex; gap: 8px; align-items: flex-start; margin: 2px 0 6px; font-size: 13px; color: var(--fg-2); }
.mb-info svg { flex: none; margin-top: 2px; color: var(--accent); }
.mb-switch { padding: 8px 0 12px; font-size: 15px; }
.mb-screen { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 8px; align-items: stretch; }
.mb-screen__photo { display: grid; place-items: center; gap: 2px; min-height: 74px; padding: 0; overflow: hidden; border-radius: 12px; cursor: pointer;
  border: 1px dashed var(--line); background: color-mix(in srgb, var(--fg) 4%, transparent); color: var(--fg-3); font: inherit; }
.mb-screen__photo img { width: 100%; height: 100%; object-fit: cover; }
.mb-screen__photo small { font-size: 11px; }
.mb-screen__text { min-height: 74px; text-align: left; cursor: pointer; }

/* Карандаш и удаление над каждой кнопкой меню — быстрые действия без шторки */
.tgx-item { flex: 1 1 0; min-width: 0; display: grid; gap: 3px; }
.tgx-item > .tgx-btn { width: 100%; }
.tgx-tools { display: flex; justify-content: center; gap: 4px; }
.tgx-tool { width: 26px; height: 20px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 7px;
  background: color-mix(in srgb, var(--fg) 7%, transparent); color: var(--fg-3); cursor: pointer; }
.tgx-tool:active { transform: scale(.94); }
.tgx-tool--bad { color: var(--bad); }

/* Наценка на раздел: поле и «Применить ко всем» — друг под другом, в одну строку на телефоне они не помещались */
.adm-catline { display: grid; gap: 8px; }
.adm-catline .btn { justify-content: center; white-space: nowrap; }

/* Кнопка выбора раздела: слева подпись и название, справа — номер и стрелка */
.adm-catpick { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; height: auto; padding: 10px 14px; text-align: left; }
.adm-catpick__main { min-width: 0; display: grid; gap: 1px; }
.adm-catpick__main small { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--fg-3); }
.adm-catpick__main b { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-catpick__n { font-size: 12px; color: var(--fg-3); }

/* Иконка товара в строке наценки — та же картинка, что на витрине */
.adm-price { grid-template-columns: 40px repeat(2, minmax(0, 1fr)); }
.adm-price__art { grid-row: 1; width: 40px; height: 40px; display: grid; place-items: center; }
.adm-price__art img { width: 100%; height: 100%; object-fit: contain; }
.adm-price__main { grid-column: 2 / -1; }
.adm-price > .input:nth-of-type(1) { grid-column: 1 / 3; }

/* Картинка в строке списка (выбор раздела) */
.row-art { flex: none; width: 32px; height: 32px; display: grid; place-items: center; }
.row-art img { width: 100%; height: 100%; object-fit: contain; }

/* «Фоны разделов» в редакторе витрины: игра — карточкой, внутри шапка (широкая) и фон экрана рядом */
.vx-games { display: grid; gap: 10px; }
.vx-game { padding: 12px; }
.vx-game__title { font-weight: 700; margin-bottom: 8px; }
.vx-game__slots { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.vx-game__slots .vx-image { min-width: 0; }
.vx-image__img--wide { aspect-ratio: 12 / 5; object-fit: cover; }
@media (max-width: 420px) { .vx-game__slots { grid-template-columns: 1fr; } }

/* «+» в конце ряда конструктора меню: ещё кнопка в этот ряд */
.tgx-addin { flex: 0 0 38px; display: grid; place-items: center; min-height: 38px; border-radius: 10px;
  border: 1px dashed var(--line-strong); background: transparent; color: var(--fg-3); cursor: pointer; }
.tgx-addin:hover, .tgx-addin:focus-visible { color: var(--accent); border-color: var(--accent); }