/* ═══════════ XVII Market — дизайн v2 для мини-аппа и owner.html ═══════════
   Тот же вид, что на xviigift.ru / xvii-market.online: графитовая палитра,
   шрифт Geist (+ Geist Mono для номеров и подписей), кремовые главные
   кнопки, фон из мерцающих точек (v2-bg.js).
   ТОЛЬКО оформление поверх уже существующих стилей: разметку, шторки и
   логику не трогаем. Подключается последним, поэтому перебивает прежние
   правила. Полный откат — убрать <link v2-skin.css>, <canvas id="v2bg">
   и <script v2-bg.js> в конце index.html / owner.html. */

:root,html body{
  --bg:#171617; --panel:#1e1d1e; --card:#232123; --card-2:#2a282a;
  --field:#2f2d2f; --field-h:#343234; --field-f:#383638;
  --line:#343234; --line2:#444244;
  --text:#f2f0ec; --muted:#8d8b8d; --muted2:#aaa8aa; --dim:#6f6d6f;
  --cream:#f2f0ec; --ink:#1c1917;
  --ok:#4ade80; --warn:#f5a524; --err:#f87171;
  --ac:#9aa6ff;
  --pill:#2f2d2f; --gold:#f2f0ec; --accent:#f2f0ec;
  --iris:#f2f0ec; --iris-soft:rgba(242,240,236,.12);
  --radius:22px;
  --mono:'Geist Mono',ui-monospace,monospace;
  --v2-ease:cubic-bezier(.22,1,.36,1);
}

/* ── шрифт и фон ── */
html body,html body button,html body input,html body textarea,html body select{
  font-family:'Geist',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif!important;
  -webkit-font-smoothing:antialiased}
html{background:#171617}
html body{background:transparent!important;color:var(--text)}
html body::before{display:none!important}           /* старое фиолетовое сияние */
#v2bg{position:fixed;inset:0;width:100vw;height:100vh;z-index:-1;pointer-events:none}
html::before{content:"";position:fixed;inset:0;z-index:-2;background:#171617;pointer-events:none}
::selection{background:rgba(242,240,236,.25)}

/* всё, что раньше было Unbounded/Manrope, — Geist. Правил со старым шрифтом
   около 30 штук, поэтому ставим на все элементы разом (кроме svg — у иконок
   свой текст); моно-подписи ниже специфичнее и перебивают это правило. */
html body *:not(svg):not(svg *){font-family:'Geist',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif!important}
html body .gifts-h,html body .inv-pv-name,html body .dt-price,html body .dpb-price,
html body .dt-price-out,html body .bm-price,html body .bm-sum-row b,html body .ci-price,
html body .pk-price .p,html body .am-price,html body .pf-name,html body .pk-head h2,
html body .dt-title,html body .cart-total b,html body .pf-bal-n,html body .pm-h,html body .pm-sum,
html body .pf-login-t,html body .sh-buy h3,html body .sh-rub,html body .flt-head h3,html body .pl-title,
html body h1,html body h2,html body h3{letter-spacing:-.03em!important;font-weight:700!important}
html body .pf-bal-n,html body .pm-sum,html body .cart-total b{color:var(--text)!important}

/* моно-подписи: номера, даты, мелкие подписи — как на витрине */
html body .c-num,html body .inv-num,html body .inv-pv-num,html body .pf-row-date,
html body .pk-sub,html body .pk-price .s,html body .dt-k,html body .bm-sum-row span,
html body .pf-user,html body .bm-code code,html body .pm-timer,html body .pf-row-amt{font-family:var(--mono)!important;font-size:12.5px;letter-spacing:.01em;color:var(--muted)}

/* ── верхняя строка: баланс и корзина ── */
html body .ma-bal-mini{background:var(--card)!important;border:1px solid transparent!important;
  color:var(--text)!important;font-weight:650}
html body .ma-bal-mini .dot{background:var(--ok)!important;box-shadow:0 0 10px var(--ok)!important}
html body .ma-bal-plus{background:var(--cream)!important;color:var(--ink)!important}
html body .ma-ico,html body .ma-srow .ma-ico{background:var(--card)!important;border:1px solid transparent!important;
  color:var(--muted2)!important;transition:transform .45s var(--v2-ease),background .3s!important}
html body .ma-ico:hover,html body .ma-srow .ma-ico:hover{background:var(--field-h)!important;color:var(--text)!important}
html body .cart-count{background:var(--cream)!important;color:var(--ink)!important;font-family:var(--mono)!important}

/* баннер: точки-индикаторы без фиолетового */
html body .bnr-dot{background:var(--line2)!important}
html body .bnr-dot.on{background:var(--cream)!important}
html body .ma-bnr img,html body .ma-bnr .bnr-slide{border-radius:22px}

/* ── поиск и фильтры: одна «панель», как .tools на витрине ── */
html body .ma-srow::before{
  background:linear-gradient(180deg,#171617 0%,#171617 64%,rgba(23,22,23,.72) 80%,rgba(23,22,23,.34) 91%,rgba(23,22,23,0) 100%)!important}
html body .ma-search{background:var(--field)!important;border:1px solid transparent!important;
  transition:background .3s,box-shadow .3s}
html body .ma-search:focus-within{background:var(--field-f)!important;
  box-shadow:0 0 0 1.5px color-mix(in srgb,var(--ac) 60%,transparent)}
html body .ma-search input{font-family:var(--mono)!important;font-weight:500;letter-spacing:.02em}
html body .ma-search input::placeholder{color:var(--dim)}
html body .ma-srow .bar-funnel,html body .ma-srow .icobtn{background:var(--field)!important;border:1px solid transparent!important;color:var(--muted2)!important}
html body .ma-srow .bar-funnel:hover,html body .ma-srow .icobtn:hover{background:var(--field-f)!important;color:var(--text)!important}
html body .bar .dd-btn{background:var(--field)!important;border:1px solid rgba(255,255,255,.06)!important;
  color:var(--text)!important;font-weight:600!important;font-size:13.5px!important}
html body .bar .dd-btn:hover{background:var(--field-f)!important;border-color:rgba(255,255,255,.12)!important}
html body .dd-btn.active,html body .bar .dd-btn.active{background:var(--cream)!important;
  border-color:var(--cream)!important;color:var(--ink)!important}
html body .dd-btn.active .chev{color:var(--ink)}
html body .dd-x{background:rgba(28,25,23,.12)!important;color:var(--ink)!important}
html body .bar .divider{background:var(--line2)!important}

/* ── карточки ── */
html body .card{background:var(--card)!important;border:none!important;border-radius:22px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
  transition:transform .6s var(--v2-ease),box-shadow .5s var(--v2-ease),background .4s!important}
@media(hover:hover){
  html body .card:hover{transform:translateY(-6px);background:var(--card-2)!important;
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ac) 45%,transparent),
               0 24px 50px -24px color-mix(in srgb,var(--ac) 55%,transparent)!important}
}
html body .grid:not(.g-list) .thumb{margin:6px 6px 0;border-radius:17px;overflow:hidden}
html body .info{padding:11px 14px 13px!important;gap:1px!important}
html body .c-name{font-weight:600!important;font-size:14.5px!important;letter-spacing:-.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .c-num{margin-top:1px!important}
html body .price-row{padding-top:9px!important}
/* цена — простой жирный текст, как на витрине (по нажатию всё так же покупка) */
html body .grid:not(.g-list) .price-row .rub{background:none!important;border:none!important;
  padding:0!important;color:var(--text)!important;font-weight:700!important;font-size:17px!important;
  letter-spacing:-.02em;font-family:'Geist',sans-serif!important}
html body .grid:not(.g-list) .price-row .rub:hover{transform:none!important;opacity:.8}
html body .c-add{width:36px!important;height:36px!important;border-radius:18px!important;
  background:var(--field)!important;border:none!important;color:var(--muted2)!important;
  transition:transform .5s var(--v2-ease),background .3s,color .3s!important}
html body .c-add:hover,html body .c-add.in{background:var(--cream)!important;color:var(--ink)!important}
html body .c-add svg{width:16px!important;height:16px!important}
html body .q-nft{background:rgba(23,22,23,.75)!important;color:var(--warn)!important;
  font:600 11px var(--mono)!important;border-radius:9px!important;backdrop-filter:blur(6px)}
html body .q-cnt{font-family:var(--mono)!important;background:rgba(23,22,23,.8)!important}
html body .q-wait{color:var(--warn)!important}
/* режим «список» */
html body .grid.g-list .card{border-radius:20px!important}
html body .grid.g-list .rub{background:var(--cream)!important;color:var(--ink)!important;
  border:none!important;font-family:'Geist',sans-serif!important;font-weight:700!important}
html body .grid.g-list .c-add{background:var(--field)!important}
/* «Показать ещё» и пустые состояния */
html body .load-more{background:var(--card)!important;border:none!important;border-radius:28px!important;color:var(--text)!important;font-weight:600}
html body .loading::after,html body .bm-status .sp{border-top-color:var(--text)!important}
html body .empty,html body .loading{color:var(--muted)!important}

/* ── нижнее меню ── */
html body .ma-nav{background:rgba(23,22,23,.82)!important;border-top:1px solid var(--line)!important;
  backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
html body .ma-nav-btn{color:var(--muted)!important}
html body .ma-nav-btn.active{color:var(--text)!important}
html body .ma-nav-btn.active::after{background:var(--cream)!important;box-shadow:0 0 12px rgba(242,240,236,.35)!important}

/* ── окна и шторки ── */
html body .overlay,html body .inv-ov,html body .sort-backdrop{background:rgba(12,11,12,.6)!important;
  backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important}
html body .picker,html body #dtModal,html body #picker,html body #apModal,html body #cartModal,
html body .inv-sheet,html body > .sort-menu.floating,html body .sort-menu{
  background:var(--panel)!important;border:none!important;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.75),inset 0 0 0 1px rgba(255,255,255,.06)!important}
html body #dtModal::before,html body .sh-grip2 i,html body .inv-sheet .sh-grip{background:var(--line2)!important}
html body .x,html body .inv-pv-x{background:var(--card)!important;border:none!important;color:var(--muted)!important;
  transition:transform .5s var(--v2-ease),color .3s!important}
html body .x:hover,html body .inv-pv-x:hover{transform:rotate(90deg);color:var(--text)!important}

/* окно подарка: характеристики строками, как на витрине */
html body .dt-img{background:var(--card)!important;border:none!important;border-radius:22px!important}
html body .dt-row{border-bottom:1px solid var(--line)!important;border-top:none!important}
html body .dt-row:last-child{border-bottom:0!important}
html body .dt-v{font-weight:600!important}
html body .dt-v .rar,html body .dt-v .pct,html body .dt-r{font-family:var(--mono)!important;color:var(--ac)!important;
  background:color-mix(in srgb,var(--ac) 12%,transparent)!important;border:none!important;border-radius:10px!important}
html body .dt-sign,html body .sign{border:1px dashed var(--line2)!important;background:transparent!important;border-radius:18px!important}
html body .dt-eye{background:rgba(23,22,23,.6)!important}
/* главная кнопка «Купить за …» — кремовая */
html body .dt-price-buy,html body .dt-buy,html body .bm-btn,html body .pf-topup,html body .rf-btn,
html body .pm-go,html body .sh-go,html body .ap-show,html body .inv-wd:not([disabled]):not(.secondary):not(.done),
html body .flt-apply,html body .buy{
  background:var(--cream)!important;color:var(--ink)!important;border:none!important;
  border-radius:28px!important;font-weight:650!important;
  box-shadow:none!important;transition:transform .5s var(--v2-ease),box-shadow .35s!important}
html body .dt-price-buy:hover,html body .dt-buy:hover,html body .bm-btn:hover,html body .pf-topup:hover,
html body .ap-show:hover,html body .flt-apply:hover{box-shadow:0 12px 30px -12px color-mix(in srgb,var(--ac) 70%,transparent)!important}
html body .dt-price-buy .dpb-price{font-weight:700!important}
/* второстепенные — контурные */
html body .dt-add,html body .sh-cancel,html body .ap-clear,html body .flt-reset,html body .inv-wd.secondary{
  background:transparent!important;color:var(--text)!important;border:none!important;border-radius:28px!important;
  box-shadow:inset 0 0 0 1px var(--line2)!important}
html body .dt-add.in{color:var(--ok)!important;background:var(--card)!important}

/* списки в фильтрах и корзине */
html body .pk-search,html body .flt-row{background:var(--field)!important;border:none!important;border-radius:25px!important}
html body .pk-search input{font-family:var(--mono)!important}
html body .pk-row,html body .ci,html body .am-row{border-radius:18px!important;transition:background .3s}
html body .pk-row:hover,html body .ci:hover{background:var(--card)!important}
html body .pk-row.sel,html body .pk-row.on{background:var(--card)!important}
html body .pk-thumb,html body .ci-thumb,html body .am-thumb,html body .bm-thumb{background:var(--card)!important;border-radius:14px!important}
html body .cbx{border-color:var(--line2)!important;border-radius:8px!important}
html body .cbx.on,html body .cbx.checked{background:var(--cream)!important;border-color:var(--cream)!important;color:var(--ink)!important}
html body .radio{border-color:var(--line2)!important}
html body .pk-price .p,html body .ci-price,html body .am-price,html body .bm-price{color:var(--text)!important}
html body .pk-cols button,html body .pk-col{font-family:var(--mono)!important}

/* ── «Мои подарки» и профиль ── */
html body .inv-card,html body .pf-balcard,html body .pf-card,html body .pf-box,html body .bm-summary{
  background:var(--card)!important;border:none!important;border-radius:22px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
html body .inv-thumb,html body .inv-pv-img{background:var(--panel)!important;border-radius:17px!important}
html body .inv-wd.done{background:rgba(74,222,128,.12)!important;color:var(--ok)!important;box-shadow:none!important}
html body .pf-row{border-color:var(--line)!important}
html body .pf-row-ico{background:var(--field)!important}
html body .pf-row-amt.in{color:var(--ok)!important}
html body .pf-empty{color:var(--muted)!important}

/* вход в профиль (виден только в обычном браузере, в Telegram вход сам) */
html body .ag-btn{border-radius:28px!important;font-weight:650!important;border:none!important}
html body .ag-bot{background:var(--cream)!important;color:var(--ink)!important}
html body .ag-login{background:transparent!important;color:var(--text)!important;box-shadow:inset 0 0 0 1px var(--line2)!important}
html body .pf-login,html body .pf-login-ico{background:var(--card)!important;border:none!important}
html body .pf-login-ico{background:var(--field)!important}

/* подвал */
html body footer{color:var(--dim)!important;font-family:var(--mono)!important;font-size:12.5px!important}
html body footer a{color:var(--muted2)!important}

/* фокус — светлый, как на витрине */
html body button:focus-visible,html body a:focus-visible,html body .dd-btn:focus-visible{outline:2px solid var(--cream)!important}

@media(prefers-reduced-motion:reduce){#v2bg{display:none}}

/* моно-шрифт шире — подсказка «Поиск по номеру» должна влезать на телефоне */
html body .ma-search input{letter-spacing:0!important}
/* owner.html: кнопка «скрыть цены» во включённом состоянии — кремовая */
html body.no-prices #maIcoPrice{background:var(--cream)!important;border-color:var(--cream)!important;color:var(--ink)!important}