/* ---------- Экраны-шторки в стиле референсов (Гетто 2): рамка, заголовок, карточки, кнопки, табы, поля, статусы, тосты ----------
   Ассеты — нарезка референсов (tools/ghetto2/sheet.py), центр прозрачный; заливка центров — CSS. Для новых тем: свой блок переменных --sh-* и тот же набор правил. */
:root[data-theme="ghetto2"] {
  --sh-dir: "/themes/ghetto2/sheet/";
  --sh-frame: url("/themes/ghetto2/sheet/frame.png");
  --sh-card: url("/themes/ghetto2/sheet/card.png");
  --sh-pink: url("/themes/ghetto2/sheet/btn-pink.png");
  --sh-yellow: url("/themes/ghetto2/sheet/btn-yellow.png");
  --sh-dark: url("/themes/ghetto2/sheet/btn-dark.png");
  --sh-chip-on: url("/themes/ghetto2/sheet/chip-on.png");
  --sh-chip-off: url("/themes/ghetto2/sheet/chip-off.png");
  --sh-input: url("/themes/ghetto2/sheet/input.png");
  --sh-pill-green: url("/themes/ghetto2/sheet/pill-green.png");
  --sh-pill-yellow: url("/themes/ghetto2/sheet/pill-yellow.png");
  --sh-banner: url("/themes/ghetto2/sheet/banner.png");
  --sh-panel: #121014; --sh-card-bg: #16121a;
}

/* Шторка: рамка поверх (псевдоэлемент), заголовок лежит в верхней кромке рамки */
:root[data-theme="ghetto2"] .sheet { background: var(--sh-panel); border: 0; box-shadow: none; padding: 0 18px calc(22px + env(safe-area-inset-bottom)); max-height: calc(100dvh - var(--sh-top, 215px)); border-radius: 0; }
:root[data-theme="ghetto2"] .sheet::before { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; border-style: solid; border-width: 58px 20px 24px 20px; border-image: var(--sh-frame) 90 44 44 44 / 58px 20px 24px 20px stretch; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .sheet-bar { flex: none; position: relative; z-index: 4; margin: 0 -18px; height: 58px; padding: 0 28px 0 28px; background: transparent; border: 0; font-family: var(--pix); font-size: 12px; color: #fff; box-sizing: border-box; }
:root[data-theme="ghetto2"] .sheet-bar span { text-shadow: 2px 0 #000, -2px 0 #000, 0 2px #000, 0 -2px #000, 2px 2px #000, -2px -2px #000, 2px -2px #000, -2px 2px #000; letter-spacing: 1px; }
:root[data-theme="ghetto2"] .back-btn { width: 30px; height: 28px; background: transparent; border: 0; box-shadow: none; color: #fff; font-size: 18px; }
:root[data-theme="ghetto2"] .x-btn { width: 28px; height: 28px; border: 2px solid #1a0a0a; border-radius: 6px; background: linear-gradient(#ff6a58, #cf231c); color: #fff; box-shadow: 0 2px 0 rgba(0, 0, 0, .6), inset 0 0 0 1px rgba(255, 255, 255, .45); font-size: 11px; }
:root[data-theme="ghetto2"] .sheet-body { padding: 10px 4px 6px; background: transparent; }
:root[data-theme="ghetto2"] .sheet-back { background: rgba(5, 3, 8, .62); }

/* Карточки и плитки */
:root[data-theme="ghetto2"] .card, :root[data-theme="ghetto2"] .tile, :root[data-theme="ghetto2"] .note, :root[data-theme="ghetto2"] .pay-box { background: var(--sh-card-bg); border: 13px solid transparent; border-image: var(--sh-card) 26 / 13px stretch; background-clip: padding-box; box-shadow: none; padding: 0 2px; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .card .card { border-image: none; border: 2px dashed #4a2a52; padding: 6px; background: transparent; }
:root[data-theme="ghetto2"] .note, :root[data-theme="ghetto2"] .pay-box { border-left-width: 13px; }
:root[data-theme="ghetto2"] .tile b, :root[data-theme="ghetto2"] .price { color: #ffd23f; }
:root[data-theme="ghetto2"] .section { color: #ff6fe0; text-shadow: 1px 1px 0 #000; }
:root[data-theme="ghetto2"] .title { color: #fff; }

/* Кнопки внутри шторок (нижнее меню остаётся картинками) */
:root[data-theme="ghetto2"] .sheet .pbtn, :root[data-theme="ghetto2"] .gate .pbtn, :root[data-theme="ghetto2"] .tour .pbtn { border: 14px solid transparent; border-image: var(--sh-yellow) 34 / 14px stretch; background: linear-gradient(#ffd84d, #f1a800) padding-box; color: #2a1a00; box-shadow: none; border-radius: 0; min-height: 50px; padding: 0 2px; font-family: var(--pix); font-size: 9px; text-shadow: none; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .sheet .pbtn.orange, :root[data-theme="ghetto2"] .gate .pbtn.orange, :root[data-theme="ghetto2"] .tour .pbtn.orange { border-width: 13px; border-image: var(--sh-pink) 26 / 13px stretch; background: linear-gradient(#ff5fdc, #d1139f) padding-box; color: #fff; text-shadow: 1px 1px 0 #5a0a48; }
:root[data-theme="ghetto2"] .sheet .pbtn.red { border-width: 13px; border-image: var(--sh-pink) 26 / 13px stretch; background: linear-gradient(#ff5a4a, #b01811) padding-box; color: #fff; text-shadow: 1px 1px 0 #3a0a08; }
:root[data-theme="ghetto2"] .sheet .pbtn.ghost, :root[data-theme="ghetto2"] .gate .pbtn.ghost, :root[data-theme="ghetto2"] .tour .pbtn.ghost { border-width: 8px; border-image: var(--sh-dark) 16 / 8px stretch; background: #1b161e padding-box; color: #f4f1ea; min-height: 40px; text-shadow: none; }
:root[data-theme="ghetto2"] .sheet .pbtn.on { filter: brightness(1.12) drop-shadow(0 0 5px #ffd23f); outline: 0; }
:root[data-theme="ghetto2"] .sheet .pbtn:active { transform: translateY(1px); filter: brightness(.92); }
:root[data-theme="ghetto2"] .sheet .pbtn:disabled { opacity: .5; }
:root[data-theme="ghetto2"] .mini { border: 8px solid transparent; border-image: var(--sh-dark) 16 / 8px stretch; background: #1b161e padding-box; color: #f4f1ea; box-shadow: none; border-radius: 0; padding: 0 4px; font-size: 8px; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .mini.red { background: linear-gradient(#ff5a4a, #b01811) padding-box; color: #fff; }
:root[data-theme="ghetto2"] .mini.green { background: linear-gradient(#a6ff3a, #4fa80a) padding-box; color: #10200a; }
:root[data-theme="ghetto2"] .btns { gap: 8px; }

/* Табы, чипы, статусы */
:root[data-theme="ghetto2"] .seg button, :root[data-theme="ghetto2"] .chip { border: 7px solid transparent; border-image: var(--sh-chip-off) 14 / 7px stretch; background: #141015 padding-box; color: #f4f1ea; box-shadow: none; border-radius: 0; padding: 4px 6px; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .seg button.on, :root[data-theme="ghetto2"] .chip.on { border-image: var(--sh-chip-on) 14 / 7px stretch; background: linear-gradient(#ffe04a, #f2b400) padding-box; color: #2a1a00; }
:root[data-theme="ghetto2"] .status { border: 6px solid transparent; border-image: var(--sh-chip-off) 14 / 6px stretch; background: #141015 padding-box; color: #f4f1ea; padding: 0 4px; border-radius: 0; }
:root[data-theme="ghetto2"] .status.done { border-image: var(--sh-pill-green) 10 / 5px stretch; background: #66f20a padding-box; color: #10200a; }
:root[data-theme="ghetto2"] .status.new, :root[data-theme="ghetto2"] .status.accepted { border-image: var(--sh-pill-yellow) 10 / 5px stretch; background: #ffe300 padding-box; color: #2a1a00; }
:root[data-theme="ghetto2"] .status.cancelled { color: #b9b4ae; }

/* Поля ввода */
:root[data-theme="ghetto2"] .field input, :root[data-theme="ghetto2"] .field select, :root[data-theme="ghetto2"] .field textarea, :root[data-theme="ghetto2"] .chip-input { border: 12px solid transparent; border-image: var(--sh-input) 28 / 12px stretch; background: #f4f0ea padding-box; color: #1a1418; padding: 0 2px; min-height: 48px; box-shadow: none; border-radius: 0; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .field textarea { min-height: 76px; }
:root[data-theme="ghetto2"] .field { color: #d8d2cc; }
:root[data-theme="ghetto2"] .chat-bar { background: transparent; }
:root[data-theme="ghetto2"] .chat-bar textarea { border: 12px solid transparent; border-image: var(--sh-input) 28 / 12px stretch; background: #f4f0ea padding-box; padding: 0 2px; border-radius: 0; }

/* Сообщения чата */
:root[data-theme="ghetto2"] .msg { border: 7px solid transparent; border-image: var(--sh-chip-off) 14 / 7px stretch; background: #1a151c padding-box; box-shadow: none; color: #f4f1ea; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .msg.me { border-image: var(--sh-pink) 26 / 9px stretch; background: linear-gradient(#ff5fdc, #d1139f) padding-box; color: #fff; }
:root[data-theme="ghetto2"] .msg.me span { color: #ffd0f4; }
:root[data-theme="ghetto2"] .msg.sys { border-style: dashed; border-image: none; border-width: 2px; border-color: #ffd23f; background: #1a151c; color: #ffd23f; }

/* Тост и плашка «админ вошёл как…» */
:root[data-theme="ghetto2"] .toast { border: 13px solid transparent; border-image: var(--sh-card) 26 / 13px stretch; background: #16121a padding-box; color: #fff; box-shadow: none; border-radius: 0; padding: 0 4px; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .toast.err { background: #8a1412 padding-box; }
:root[data-theme="ghetto2"] .actas { border: 12px solid transparent; border-image: var(--sh-banner) 24 / 12px stretch; background: linear-gradient(#ffd84d, #f1a800) padding-box; color: #2a1a00; padding: 0 2px; margin: 0 6px; image-rendering: pixelated; z-index: 3; }

/* Бонус дня и квест: свои акценты */
:root[data-theme="ghetto2"] .spin-dots .dot { border: 2px solid #1a0a0a; border-radius: 4px; background: #1b161e; }
:root[data-theme="ghetto2"] .spin-dots .dot.on { background: linear-gradient(#ffe04a, #f2b400); }
:root[data-theme="ghetto2"] .stepper { border: 2px solid #ff3fd0; border-radius: 6px; background: #1b161e; color: #fff; }
:root[data-theme="ghetto2"] .stepper button { background: linear-gradient(#ff5fdc, #d1139f); color: #fff; border-radius: 4px; }

/* ================= UI-kit (лист «РЕФЕРЕНСЫ РАМОК И UI»): единые рамки, кнопки, поля, теги, пузыри, диалоги ================= */
:root[data-theme="ghetto2"] {
  --k: url("/themes/ghetto2/sheet/");
  --k-main: url("/themes/ghetto2/sheet/k-main.png"); --k-accent: url("/themes/ghetto2/sheet/k-accent.png"); --k-info: url("/themes/ghetto2/sheet/k-info.png");
  --k-second: url("/themes/ghetto2/sheet/k-second.png"); --k-dash: url("/themes/ghetto2/sheet/k-dash.png");
  --k-btn: url("/themes/ghetto2/sheet/k-btn.png"); --k-btn-press: url("/themes/ghetto2/sheet/k-btn-press.png"); --k-btn-off: url("/themes/ghetto2/sheet/k-btn-off.png");
  --k-field: url("/themes/ghetto2/sheet/k-field.png"); --k-field-off: url("/themes/ghetto2/sheet/k-field-off.png");
  --k-tag-green: url("/themes/ghetto2/sheet/k-tag-green.png"); --k-tag-yellow: url("/themes/ghetto2/sheet/k-tag-yellow.png"); --k-tag-pink: url("/themes/ghetto2/sheet/k-tag-pink.png");
  --k-tag-gray: url("/themes/ghetto2/sheet/k-tag-gray.png"); --k-tag-admin: url("/themes/ghetto2/sheet/k-tag-admin.png"); --k-tag-on: url("/themes/ghetto2/sheet/k-tag-on.png");
  --k-bubble-in: url("/themes/ghetto2/sheet/k-bubble-in.png"); --k-bubble-out: url("/themes/ghetto2/sheet/k-bubble-out.png");
  --k-dialog: url("/themes/ghetto2/sheet/k-dialog.png"); --k-success: url("/themes/ghetto2/sheet/k-success.png");
  --k-dbtn-gray: url("/themes/ghetto2/sheet/k-dbtn-gray.png"); --k-dbtn-pink: url("/themes/ghetto2/sheet/k-dbtn-pink.png"); --k-dbtn-green: url("/themes/ghetto2/sheet/k-dbtn-green.png");
  --k-chatbar: url("/themes/ghetto2/sheet/k-chatbar.png"); --k-chathead: url("/themes/ghetto2/sheet/k-chathead.png");
}
/* карточки: вторичная рамка для списков, акцентная — для главных блоков (баланс, плитки), информационная — для подсказок */
:root[data-theme="ghetto2"] .card { border-image: var(--k-second) 18 / 9px stretch; border-width: 9px; background: #14111a padding-box; }
:root[data-theme="ghetto2"] .tile { border-image: var(--k-accent) 24 / 12px stretch; border-width: 12px; background: #14101a padding-box; }
:root[data-theme="ghetto2"] .note, :root[data-theme="ghetto2"] .pay-box { border-image: var(--k-info) 18 / 9px stretch; border-width: 9px; background: #16130f padding-box; }
:root[data-theme="ghetto2"] .card .card { border-image: var(--k-dash) 16 / 8px stretch; border-width: 8px; }
/* кнопки: основная жёлтая (CTA), розовая — действие, серая — второстепенное; нажатие и неактивное — из листа */
:root[data-theme="ghetto2"] .sheet .pbtn.orange, :root[data-theme="ghetto2"] .gate .pbtn.orange { border-image: var(--k-btn) 20 / 10px stretch; border-width: 10px; }
:root[data-theme="ghetto2"] .sheet .pbtn.red { border-image: var(--k-btn) 20 / 10px stretch; border-width: 10px; }
:root[data-theme="ghetto2"] .sheet .pbtn.orange:active, :root[data-theme="ghetto2"] .sheet .pbtn.red:active { border-image: var(--k-btn-press) 22 / 11px stretch; filter: none; transform: none; }
:root[data-theme="ghetto2"] .sheet .pbtn.ghost, :root[data-theme="ghetto2"] .gate .pbtn.ghost { border-image: var(--k-btn-off) 20 / 10px stretch; border-width: 10px; background: #2c262f padding-box; color: #cfc8d2; }
:root[data-theme="ghetto2"] .sheet .pbtn:disabled { border-image: var(--k-btn-off) 20 / 10px stretch; background: #2c262f padding-box; color: #8d8692; opacity: 1; }
:root[data-theme="ghetto2"] .mini { border-image: var(--k-btn-off) 20 / 8px stretch; border-width: 8px; background: #2c262f padding-box; color: #f4f1ea; }
:root[data-theme="ghetto2"] .mini.green { border-image: var(--k-tag-green) 12 / 6px stretch; border-width: 6px; background: #1c4a0a padding-box; color: #b6ff6a; }
:root[data-theme="ghetto2"] .mini.red { border-image: var(--k-tag-pink) 12 / 6px stretch; border-width: 6px; background: #5a0c3c padding-box; color: #ff8fe0; }
/* поля */
:root[data-theme="ghetto2"] .field input, :root[data-theme="ghetto2"] .field select, :root[data-theme="ghetto2"] .field textarea, :root[data-theme="ghetto2"] .chip-input, :root[data-theme="ghetto2"] .chat-bar textarea { border-image: var(--k-field) 16 / 8px stretch; border-width: 8px; background: #14101a padding-box; color: #fff; min-height: 46px; caret-color: #ff3fd0; }
:root[data-theme="ghetto2"] .field input::placeholder, :root[data-theme="ghetto2"] .field textarea::placeholder, :root[data-theme="ghetto2"] .chat-bar textarea::placeholder { color: #8f8696; }
:root[data-theme="ghetto2"] .field input:disabled, :root[data-theme="ghetto2"] .field select:disabled { border-image: var(--k-field-off) 16 / 8px stretch; background: #1c1920 padding-box; color: #8d8692; }
:root[data-theme="ghetto2"] .field input:focus, :root[data-theme="ghetto2"] .field select:focus, :root[data-theme="ghetto2"] .field textarea:focus { outline: 0; filter: drop-shadow(0 0 5px #ff3fd0); }
/* теги-статусы: зелёный успех, жёлтый ожидание, розовый ошибка/отмена, серый нейтральный */
:root[data-theme="ghetto2"] .status { border-width: 6px; border-image: var(--k-tag-gray) 12 / 6px stretch; background: #15121a padding-box; color: #cfc8d2; }
:root[data-theme="ghetto2"] .status.done { border-image: var(--k-tag-green) 12 / 6px stretch; background: #0c2a06 padding-box; color: #8dff3c; }
:root[data-theme="ghetto2"] .status.new, :root[data-theme="ghetto2"] .status.accepted { border-image: var(--k-tag-yellow) 12 / 6px stretch; background: #2a1e04 padding-box; color: #ffd23f; }
:root[data-theme="ghetto2"] .status.cancelled { border-image: var(--k-tag-pink) 12 / 6px stretch; background: #2a0620 padding-box; color: #ff6fe0; }
/* табы и чипы: как кнопки листа */
:root[data-theme="ghetto2"] .seg button, :root[data-theme="ghetto2"] .chip { border-image: var(--k-btn-off) 20 / 8px stretch; border-width: 8px; background: #2c262f padding-box; color: #e8e2ec; }
:root[data-theme="ghetto2"] .seg button.on, :root[data-theme="ghetto2"] .chip.on { border-image: var(--k-btn) 20 / 8px stretch; border-width: 8px; background: linear-gradient(#ff5fdc, #d1139f) padding-box; color: #fff; filter: drop-shadow(0 0 5px #ff3fd0); }
/* чат: пузыри и поле ввода */
:root[data-theme="ghetto2"] .msg { border-image: var(--k-bubble-in) 22 / 11px stretch; border-width: 11px; background: #17131b padding-box; }
:root[data-theme="ghetto2"] .msg.me { border-image: var(--k-bubble-out) 22 / 11px stretch; border-width: 11px; background: linear-gradient(#e0179f, #a50e78) padding-box; }
:root[data-theme="ghetto2"] .chat-bar .pbtn { border-image: var(--k-btn) 20 / 10px stretch; border-width: 10px; background: linear-gradient(#ff5fdc, #d1139f) padding-box; min-height: 46px; width: 56px; }
/* карточки-выборы в формах (товар, категории, эмодзи): неактивные — металл, выбранный — неон-розовая подсветка */
:root[data-theme="ghetto2"] .pick, :root[data-theme="ghetto2"] .emoji-pick button { border: 8px solid transparent; border-image: var(--k-second) 18 / 8px stretch; background: #14111a padding-box; color: #f4f1ea; box-shadow: none; border-radius: 0; }
:root[data-theme="ghetto2"] .pick.on, :root[data-theme="ghetto2"] .emoji-pick button.on { border-image: var(--k-accent) 24 / 8px stretch; background: #2a0a22 padding-box; color: #fff; outline: 0; filter: drop-shadow(0 0 6px #ff3fd0); }
:root[data-theme="ghetto2"] .pick .sub { color: #b9b0be; }
:root[data-theme="ghetto2"] .pick.on .sub { color: #ffc2ee; }
:root[data-theme="ghetto2"] .emoji { border: 3px solid #1a0a14; background: #f4f0ea; }
:root[data-theme="ghetto2"] .check input { accent-color: #ff2bd6; }
:root[data-theme="ghetto2"] .bar { border: 2px solid #3a2a40; background: #14101a; }
:root[data-theme="ghetto2"] .bar i { background: repeating-linear-gradient(90deg, #ff2bd6 0 6px, #a50e78 6px 8px); }
:root[data-theme="ghetto2"] table.list td { border-bottom: 2px solid #2a2230; }

/* Окно подтверждения и успеха (ask() в растровых темах) */
.kdlg-back { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; background: rgba(5, 3, 8, .72); padding: 20px; }
.kdlg { position: relative; width: min(360px, 100%); box-sizing: border-box; border: 22px solid transparent; border-image: var(--k-dialog) 44 / 22px stretch; background: #110e14 padding-box; color: #f4f1ea; text-align: center; padding: 0 6px 6px; image-rendering: pixelated; filter: drop-shadow(0 6px 0 rgba(0, 0, 0, .5)); }
.kdlg.ok { border-image: var(--k-success) 44 / 22px stretch; }
.kdlg-ico { font-size: 34px; color: #ffd23f; line-height: 1; margin-top: 2px; }
.kdlg.ok .kdlg-ico { color: #8dff3c; }
.kdlg-title { font-family: var(--pix); font-size: 13px; color: #fff; margin: 8px 0 6px; letter-spacing: 1px; }
.kdlg-text { font-family: var(--text, var(--body)); font-size: 16px; line-height: 1.35; margin-bottom: 12px; }
.kdlg-btns { display: flex; gap: 8px; }
.kdlg-b { flex: 1; min-height: 46px; border: 9px solid transparent; border-radius: 0; font-family: var(--pix); font-size: 10px; color: #fff; image-rendering: pixelated; }
.kdlg-b.gray { border-image: var(--k-dbtn-gray) 18 / 9px stretch; background: #3a343e padding-box; }
.kdlg-b.pink { border-image: var(--k-dbtn-pink) 18 / 9px stretch; background: linear-gradient(#ff5fdc, #d1139f) padding-box; text-shadow: 1px 1px 0 #5a0a48; }
.kdlg-b.green { border-image: var(--k-dbtn-green) 18 / 9px stretch; background: linear-gradient(#a6ff3a, #4fa80a) padding-box; color: #10200a; }
.kdlg-b:active { filter: brightness(.9); transform: translateY(1px); }

/* шторка: тело прокручивается, шапка не сжимается */
:root[data-theme="ghetto2"] .sheet-body { min-height: 0; }
:root[data-theme="ghetto2"] .check input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 24px; height: 24px; border: 3px solid #5a4a60; border-radius: 4px; background: #14101a; display: inline-grid; place-content: center; flex: none; }
:root[data-theme="ghetto2"] .check input[type="checkbox"]:checked { border-color: #ff2bd6; background: linear-gradient(#ff5fdc, #d1139f); }
:root[data-theme="ghetto2"] .check input[type="checkbox"]:checked::after { content: "✓"; color: #fff; font: 700 16px/1 var(--text, sans-serif); }

/* ================= Форма товара: нумерованные секции, блок фото, ряд цена/остаток ================= */
.form-sec { display: flex; align-items: center; gap: 10px; margin: 16px 0 8px; font-family: var(--pix); font-size: 11px; letter-spacing: .5px; color: #fff; }
.form-sec:first-child { margin-top: 4px; }
.sec-n { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; border: 2px solid #1a0a00; background: linear-gradient(#ffe04a, #f2a800); color: #2a1a00; font-size: 12px; box-shadow: 0 2px 0 rgba(0, 0, 0, .5); }
.photo-box { position: relative; display: flex; gap: 12px; align-items: stretch; }
.photo-drop { flex: 1; min-height: 96px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; cursor: pointer; border: 3px dashed #7a6a80; border-radius: 10px; background: #14101a; color: #f4f1ea; padding: 8px; }
.photo-drop b { font-family: var(--text, var(--body)); font-size: 15px; }
.photo-drop small { font-family: var(--text, var(--body)); font-size: 12px; color: #a99fb0; }
.photo-ico { font-size: 26px; }
.photo-file { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none; }
.photo-prev { position: relative; flex: none; width: 104px; padding: 6px; background: #f4f0ea; border: 2px solid #1a0a14; transform: rotate(2deg); box-shadow: 0 3px 0 rgba(0, 0, 0, .5); }
.photo-prev img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.photo-x { position: absolute; top: -10px; right: -10px; width: 26px; height: 26px; border-radius: 50%; border: 2px solid #1a0a0a; background: linear-gradient(#ff6a58, #cf231c); color: #fff; font-size: 12px; line-height: 1; }
.row.pair { gap: 10px; }
.form-btns { margin-top: 14px; }
.form-btns .pbtn { flex: 1; }
.form-btns .pbtn.orange { flex: 1.6; }
:root[data-theme="ghetto2"] .photo-drop { border-color: #8a7d90; }
:root[data-theme="ghetto2"] .emoji-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: 6px; }
:root[data-theme="ghetto2"] .emoji-pick button { aspect-ratio: 1; padding: 0; min-height: 0; font-size: 24px; display: grid; place-items: center; }
.cat-chips { margin: 6px 0 10px; }
.form-hint { font-family: var(--text, var(--body)); font-size: 12px; color: #a99fb0; letter-spacing: 0; text-transform: none; }

/* Аватары и шапка диалога */
.av { flex: none; width: 40px; height: 40px; border-radius: 8px; background: #2a2230; border: 2px solid #1a0a14; display: grid; place-items: center; }
.av::before { content: "🙂"; font-size: 22px; }
.card.chat-row { display: flex; flex-direction: row; align-items: center; gap: 10px; }
.chat-row .grow { min-width: 0; }
.chat-head { display: flex; align-items: center; gap: 10px; padding-bottom: 8px; margin-bottom: 8px; border-bottom: 2px solid #2a2230; }
:root[data-theme="ghetto2"] .av { width: 46px; height: 46px; border: 0; border-radius: 0; background: center / contain no-repeat; image-rendering: pixelated; }
:root[data-theme="ghetto2"] .av::before { content: none; }
:root[data-theme="ghetto2"] .av1 { background-image: url("/themes/ghetto2/sheet/k-avatar1.png"); }
:root[data-theme="ghetto2"] .av2 { background-image: url("/themes/ghetto2/sheet/k-avatar2.png"); }
:root[data-theme="ghetto2"] .av3 { background-image: url("/themes/ghetto2/sheet/k-avatar3.png"); }
:root[data-theme="ghetto2"] .av4 { background-image: url("/themes/ghetto2/sheet/k-avatar4.png"); }
:root[data-theme="ghetto2"] .chat-head { border-image: var(--k-chathead) 24 / 10px stretch; border-width: 10px; padding: 4px 8px; margin-bottom: 10px; background: #14111a padding-box; }

/* P2P: шаги сделки и карточка предложения */
.tsteps { display: flex; align-items: flex-start; margin: 6px 0 10px; }
.tst { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; position: relative; font-family: var(--text, var(--body)); }
.tst::before { content: ""; position: absolute; top: 14px; right: 50%; width: 100%; height: 3px; background: #4a3f52; z-index: 0; }
.tst:first-child::before { display: none; }
.tst.done::before, .tst.act::before { background: #ff2bd6; }
.tst i { position: relative; z-index: 1; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-weight: 700; font-size: 13px; border: 2px solid #1a0a14; background: #2c262f; color: #b9b0be; }
.tst.done i { background: linear-gradient(#ff5fdc, #d1139f); color: #fff; }
.tst.act i { background: #14101a; border-color: #ff2bd6; color: #fff; box-shadow: 0 0 8px #ff2bd6; }
.tst small { font-size: 11px; color: #b9b0be; }
.tsteps.bad .tst::before { background: #4a3f52; }
.ad-head { display: flex; align-items: center; gap: 8px; }
.crown-mark { color: #ffd23f; }
:root[data-theme="ghetto2"] .tst i { width: 34px; height: 33px; border: 0; border-radius: 0; background: center / 100% 100% no-repeat; color: transparent; font-size: 0; image-rendering: pixelated; position: relative; }
:root[data-theme="ghetto2"] .tst.done i { background-image: url("/themes/ghetto2/kit/step-done.png"); box-shadow: none; }
:root[data-theme="ghetto2"] .tst.act i { background-image: url("/themes/ghetto2/kit/step-active.png"); box-shadow: none; }
:root[data-theme="ghetto2"] .tst.todo i { background-image: url("/themes/ghetto2/kit/step-todo.png"); }
:root[data-theme="ghetto2"] .tst::before { top: 15px; height: 4px; }
:root[data-theme="ghetto2"] .p2p-ad { border-image: url("/themes/ghetto2/kit/p2p-bar-yellow.png") 26 36 26 36 / 13px 18px 13px 18px stretch; border-width: 13px 18px; background: #14111a padding-box; }
:root[data-theme="ghetto2"] .p2p-ad:not(.vip) { border-image: url("/themes/ghetto2/kit/p2p-bar-pink.png") 30 40 30 40 / 15px 20px 15px 20px stretch; border-width: 15px 20px; }
:root[data-theme="ghetto2"] .p2p-trade { border-image: url("/themes/ghetto2/kit/p2p-bar-grey.png") 24 34 24 34 / 12px 17px 12px 17px stretch; border-width: 12px 17px; }

/* Вкладки и чипы: плоские металлические кнопки без запечённых подложек (раньше border-image тянул тёмную прямоугольную плашку под текстом и оставлял просветы) */
:root[data-theme$="2"] .seg { gap: 6px; }
:root[data-theme$="2"] .seg button, :root[data-theme$="2"] .chip { border: 2px solid #5b5062; border-image: none; border-radius: 7px; background: linear-gradient(#403945, #272229); color: #ece6ef; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -2px 0 rgba(0, 0, 0, .35), 0 2px 0 #0c090e; text-shadow: 0 1px 0 #000; min-height: 38px; padding: 8px 10px; image-rendering: auto; filter: none; outline: none; -webkit-tap-highlight-color: transparent; }
:root[data-theme$="2"] .seg button.on, :root[data-theme$="2"] .chip.on { border-color: #ffb0f0; background: linear-gradient(#ff63df, #c8129a); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -2px 0 rgba(0, 0, 0, .25), 0 0 10px rgba(255, 63, 208, .55), 0 2px 0 #0c090e; filter: none; }
:root[data-theme$="2"] .seg button:active, :root[data-theme$="2"] .chip:active { transform: translateY(1px); box-shadow: inset 0 2px 3px rgba(0, 0, 0, .5); }