/* ============================================================
   БИРЖА — тема 2026
   Тёмный холст, aurora-подсветка, стеклянные поверхности,
   электрический градиент, зерно поверх всего.
   Грузится последней — переопределяет базовые стили.
   ============================================================ */

:root {
  /* холст и поверхности */
  --bg-0:      #07070B;
  --bg-1:      #0C0C13;
  --bg-2:      #12121C;
  --glass:     rgba(255, 255, 255, .045);
  --glass-hi:  rgba(255, 255, 255, .08);
  --line:      rgba(255, 255, 255, .09);
  --line-hi:   rgba(255, 255, 255, .17);

  /* текст */
  --txt:   #ECECF3;
  --txt-2: #9E9EB2;
  --txt-3: #6A6A7E;

  /* акценты */
  --acc:   #6C5CFF;
  --acc-2: #A855F7;
  --acc-3: #FF4D9D;
  --cy:    #22D3EE;
  --ok:    #34D399;
  --warn:  #FBBF24;
  --err:   #FB7185;

  --grad:      linear-gradient(135deg, #6C5CFF 0%, #A855F7 55%, #FF4D9D 100%);
  --grad-soft: linear-gradient(135deg, rgba(108,92,255,.22), rgba(168,85,247,.16) 55%, rgba(255,77,157,.14));

  /* свечение и тени */
  --glow:    0 10px 34px -10px rgba(108, 92, 255, .55);
  --glow-hi: 0 16px 52px -12px rgba(108, 92, 255, .75);
  --shadow:  0 24px 64px -24px rgba(0, 0, 0, .9);

  /* радиусы */
  --r-sm: 10px;
  --r:    16px;
  --r-lg: 22px;
  --r-xl: 28px;

  /* пружинка для микровзаимодействий */
  --spring: cubic-bezier(.22, 1, .36, 1);

  /* переопределяем старые токены базы, чтобы наследники подтянулись */
  --c-black:     var(--txt);
  --c-ink:       var(--bg-2);
  --c-ink-soft:  var(--bg-1);
  --c-card-dark: var(--bg-2);
  --c-muted:     var(--txt-2);
  --c-muted-2:   var(--txt-2);
  --c-muted-3:   var(--txt-3);
  --c-placeholder: var(--txt-3);
  --c-line:      var(--line);
  --c-line-2:    var(--line);
  --c-line-3:    var(--line);
  --c-surface:   var(--bg-1);
  --c-surface-2: var(--bg-2);

  --r-block: var(--r);
  --r-pill:  999px;
  --r-chip:  999px;

  color-scheme: dark;
}

/* ---------- Холст ---------- */

html { background: var(--bg-0); }

/* Aurora — обычный нескроллящийся фон документа: рисуется один раз сверху
   и уходит со скроллом. Ни fixed-слоёв, ни background-attachment —
   и то и другое даёт артефакты отрисовки, а на iOS fixed просто игнорируется. */
body {
  color: var(--txt);
  min-height: 100vh;
  letter-spacing: -.011em;
  background-color: var(--bg-0);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"),
    radial-gradient(70% 62% at 8% 0%,   rgba(108, 92, 255, .30) 0%, rgba(108, 92, 255, .11) 38%, transparent 72%),
    radial-gradient(58% 52% at 97% 6%,  rgba(255, 77, 157, .20) 0%, rgba(255, 77, 157, .07) 40%, transparent 72%),
    radial-gradient(66% 46% at 55% 34%, rgba(34, 211, 238, .11) 0%, rgba(34, 211, 238, .03) 44%, transparent 74%);
  background-repeat: repeat, no-repeat, no-repeat, no-repeat;
  background-size: 180px 180px, 100% 1600px, 100% 1600px, 100% 1600px;
  background-position: top left, top center, top center, top center;
  background-blend-mode: soft-light, normal, normal, normal;
}

::selection { background: rgba(108, 92, 255, .45); color: #fff; }

:focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }

/* Скроллбар в тон */
* { scrollbar-color: rgba(255,255,255,.16) transparent; scrollbar-width: thin; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.13);
  border: 3px solid transparent;
  background-clip: content-box;
  border-radius: 999px;
}
*::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.24); background-clip: content-box; }

/* ---------- Типографика ---------- */

h1, h2, h3, .l-hero__title, .l-section__title, .section__title,
.hero__title, .p-name, .auth-heading, .auth-brand__title {
  letter-spacing: -.035em;
  font-weight: 650;
}

h1, .l-hero__title, .hero__title { letter-spacing: -.045em; }

/* Цифры — табличные, чтобы цены не «прыгали» */
.lot-card__price, .p-stat__val, .pdp-buy__price, .co-btn__amt,
.co-summary__val, .gcard__price, .scard__value, .p-deposit__val,
.nav__balance, .chip__num {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}

/* ---------- Шапка ---------- */

.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(7, 7, 11, .72);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-bottom: 1px solid var(--line);
}

.nav__inner { height: 76px; gap: 20px; }

.nav__logo img { filter: invert(1) brightness(1.7); }

.search {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: 999px;
  transition: border-color .2s, background .2s;
}
.search:focus-within {
  border-color: rgba(108, 92, 255, .55);
  background: rgba(108, 92, 255, .07);
}
.search__input { background: transparent; color: var(--txt); }
.search__input::placeholder { color: var(--txt-3); }
.search__icon { filter: invert(.62); }

/* ---------- Кнопки ---------- */

.btn, .l-hero__btn, .l-cta__btn, .form-btn, .auth-submit,
.chip-btn, .rvw-open-btn, .p-name-btn {
  border-radius: 999px;
  transition: transform .22s var(--spring), box-shadow .22s var(--spring),
              background .2s, border-color .2s, color .2s;
}

.btn--light,
.nav__actions .btn--light {
  background: var(--glass);
  color: var(--txt);
  border: 1px solid var(--line);
}
.btn--light:hover,
.nav__actions .btn--light:hover {
  background: var(--glass-hi);
  border-color: var(--line-hi);
  color: #fff;
  transform: translateY(-1px);
}

.btn--dark,
.nav__actions .btn--dark {
  background: var(--grad);
  color: #fff;
  border: 0;
  box-shadow: var(--glow);
}
.btn--dark:hover,
.nav__actions .btn--dark:hover {
  transform: translateY(-1px);
  box-shadow: var(--glow-hi);
}

.btn--outline {
  background: transparent;
  color: var(--txt);
  box-shadow: inset 0 0 0 1px var(--line-hi);
}
.btn--outline:hover { box-shadow: inset 0 0 0 1px var(--acc); color: #fff; }

.btn__caret { filter: invert(1); }

/* ---------- Карточки и поверхности ---------- */

.lot-card, .seller-card, .gcard, .game-tile, .p-card, .p-section,
.notif-list, .l-faq__item, .l-testi__card, .l-howto__step, .l-why,
.pm-tile, .pcard, .scard, .l-cats, .feature, .cat, .promos,
.catalog-categories, .filters, .form, .reviews, .similar {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  color: var(--txt);
  transition: transform .3s var(--spring), border-color .25s, box-shadow .3s var(--spring), background .25s;
}

.lot-card:hover, .seller-card:hover, .gcard:hover, .game-tile:hover,
.pm-tile:hover, .l-cats:hover, .cat:hover, .dir:hover {
  transform: translateY(-4px);
  border-color: rgba(108, 92, 255, .42);
  box-shadow: var(--glow), var(--shadow);
  background: var(--glass-hi);
}

/* Тонкая световая кромка сверху у карточек лотов */
.lot-card { position: relative; overflow: hidden; }
.lot-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  opacity: 0;
  transition: opacity .3s;
}
.lot-card:hover::before { opacity: 1; }

.lot-card__title, .seller-card__name, .gcard__title, .p-section__title { color: var(--txt); }
.lot-card__meta, .seller-card__stat, .gcard__label, .p-section__count { color: var(--txt-2); }

.lot-card__price, .pdp-buy__price {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 700;
}

.lot-card__thumb, .gcard__media, .seller-card__avatar, .game-tile__cover {
  background: var(--bg-2);
  border-radius: var(--r);
}

.lot-card__tag, .chip, .p-spec__chip, .pdp-buy__chips > * {
  background: var(--glass-hi);
  border: 1px solid var(--line);
  color: var(--txt-2);
  border-radius: 999px;
}

.lot-card__bump {
  background: var(--grad);
  color: #fff;
  border: 0;
  box-shadow: var(--glow);
}

.lot-card__sold {
  background: rgba(251, 113, 133, .16);
  border: 1px solid rgba(251, 113, 133, .4);
  color: #FB7185;
}

.lot-card__heart, .p-avatar, .nav__avatar, .byline__avatar,
.l-testi__ava, .p-review__ava, .seller-hero__avatar {
  border-color: var(--line);
}

/* ---------- Поля ввода ---------- */

.field, .auth-field, .field-split, .search__input, input[type="text"],
input[type="password"], input[type="email"], input[type="number"],
input[type="search"], textarea, select {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--txt);
  transition: border-color .2s, background .2s, box-shadow .2s;
}
.field:focus, .auth-field:focus-within, textarea:focus, select:focus,
input:focus {
  border-color: rgba(108, 92, 255, .6);
  background: rgba(108, 92, 255, .06);
  box-shadow: 0 0 0 4px rgba(108, 92, 255, .12);
  outline: none;
}
::placeholder { color: var(--txt-3); }

select option { background: var(--bg-2); color: var(--txt); }

/* ---------- Модалки ---------- */

.co-modal__body, .ai-modal__body, .rvw-modal__body, .bell__panel {
  background: rgba(18, 18, 28, .92);
  backdrop-filter: blur(28px) saturate(160%);
  -webkit-backdrop-filter: blur(28px) saturate(160%);
  border: 1px solid var(--line-hi);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow), 0 0 80px -40px rgba(108, 92, 255, .6);
  color: var(--txt);
}
.co-modal__back, .ai-modal__back, .rvw-modal__back {
  background: rgba(4, 4, 8, .7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.co-modal__title, .ai-modal__title, .rvw-modal__title { color: var(--txt); }
.co-modal__sub, .ai-modal__sub, .rvw-modal__sub { color: var(--txt-2); }
.co-close, .ai-modal__close, .rvw-modal__close {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt-2);
}
.co-close:hover, .ai-modal__close:hover, .rvw-modal__close:hover {
  background: var(--glass-hi);
  color: #fff;
}

/* Плитки оплаты */
.pm-tile { background: var(--glass); }
.pm-tile__name { color: var(--txt); }
.pm-tile__sub  { color: var(--txt-3); }
.pm-tile.is-active, .pm-tile[aria-pressed="true"] {
  border-color: var(--acc);
  background: rgba(108, 92, 255, .12);
  box-shadow: var(--glow);
}

.co-btn, .form-btn--primary, .form-btn--confirm, .auth-submit, .l-cta__btn {
  background: var(--grad);
  color: #fff;
  border: 0;
  box-shadow: var(--glow);
}
.co-btn:hover, .form-btn--primary:hover, .form-btn--confirm:hover,
.auth-submit:hover, .l-cta__btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--glow-hi);
}
.form-btn--ghost {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt);
}
.form-btn--ghost:hover { background: var(--glass-hi); border-color: var(--line-hi); }

.co-summary, .co-legal, .auth-legal { color: var(--txt-2); }
.co-summary__strike { color: var(--txt-3); }

/* ---------- Центр уведомлений ---------- */

.bell__glyph { color: var(--txt-2); }
.bell__btn:hover .bell__glyph { color: var(--acc); }
.bell__badge { box-shadow: 0 0 0 2px var(--bg-0); background: var(--acc-3); }

.bell__head { border-bottom: 1px solid var(--line); }
.bell__title { color: var(--txt); }
.bell__action { color: var(--acc); }
.bell__action:hover { background: rgba(108, 92, 255, .14); }
.bell__empty { color: var(--txt-3); }
.bell__all {
  border-top: 1px solid var(--line);
  background: rgba(108, 92, 255, .07);
  color: var(--acc);
}
.bell__all:hover { background: rgba(108, 92, 255, .16); }

.notif-row { border-bottom: 1px solid var(--line); }
.notif-row:hover { background: var(--glass); }
.notif-row.is-unread { background: rgba(108, 92, 255, .1); }
.notif-row.is-unread:hover { background: rgba(108, 92, 255, .16); }
.notif-row__title { color: var(--txt); }
.notif-row__text  { color: var(--txt-2); }
.notif-row__time  { color: var(--txt-3); }

.notif-tab {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt-2);
}
.notif-tab:hover { border-color: var(--line-hi); color: var(--txt); }
.notif-tab.is-active { background: var(--grad); border-color: transparent; color: #fff; box-shadow: var(--glow); }

/* ---------- Лендинг ---------- */

.l-hero {
  border-radius: var(--r-xl);
  border: 1px solid var(--line);
  overflow: hidden;
}
.l-hero__title { color: #fff; }
.l-hero__lead  { color: var(--txt-2); }
.l-hero__eyebrow, .hero__eyebrow, .auth-brand__eyebrow {
  background: var(--glass-hi);
  border: 1px solid var(--line-hi);
  color: var(--txt);
  border-radius: 999px;
}
.l-hero__badges > * {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt-2);
  border-radius: 999px;
}

.l-section__title, .section__title { color: var(--txt); }
.l-section__link { color: var(--acc); }
.l-section__link:hover { color: var(--acc-3); }

.l-howto__num {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 700;
}
.l-howto__title, .l-why strong, .l-faq__item summary { color: var(--txt); }
.l-howto__lead, .l-why p, .l-faq__item p { color: var(--txt-2); }

.l-testi__name { color: var(--txt); }
.l-testi__text { color: var(--txt-2); }
.l-testi__meta { color: var(--txt-3); }
.l-testi__stars { color: var(--warn); }

.l-cta {
  background: var(--grad-soft);
  border: 1px solid rgba(108, 92, 255, .32);
  border-radius: var(--r-xl);
  box-shadow: 0 40px 120px -60px rgba(108, 92, 255, .9);
}
.l-cta__title { color: #fff; }
.l-cta__lead  { color: var(--txt-2); }

/* Популярные направления */
.dir {
  border-radius: var(--r-lg);
  border: 1px solid var(--line);
  transition: transform .3s var(--spring), border-color .25s, box-shadow .3s var(--spring);
}
.dir__name { color: #fff; }
.dir__sub  { color: rgba(255, 255, 255, .62); }
.dir__scrim { background: linear-gradient(180deg, transparent 32%, rgba(4,4,8,.92)); }

/* Виджет нейросетей */
.ai-widget {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.ai-widget__head { color: var(--txt); }
.ai-widget__sub  { color: var(--txt-3); }
.ai-item {
  border: 1px solid transparent;
  border-radius: var(--r);
  transition: background .2s, border-color .2s, transform .22s var(--spring);
}
.ai-item:hover {
  background: var(--glass-hi);
  border-color: var(--line-hi);
  transform: translateX(2px);
}
.ai-item__name { color: var(--txt); }
.ai-item__sub  { color: var(--txt-3); }
.ai-item__from { color: var(--acc); font-weight: 650; }
.ai-more {
  background: var(--glass-hi);
  border: 1px solid var(--line);
  color: var(--txt);
  border-radius: 999px;
}
.ai-more:hover { border-color: var(--acc); color: #fff; }
.ai-modal__card {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
.ai-modal__card:hover { border-color: var(--acc); background: var(--glass-hi); }

/* ---------- Профиль продавца ---------- */

.p-shell, .p-head { color: var(--txt); }
.p-banner { border-radius: var(--r-xl); border: 1px solid var(--line); }
.p-name { color: #fff; }
.p-name__handle, .p-meta { color: var(--txt-2); }
.p-bio {
  background: var(--glass);
  border: 1px solid var(--line);
  border-left: 2px solid var(--acc);
  border-radius: var(--r);
  color: var(--txt-2);
}
.p-stat__val { color: var(--txt); }
.p-stat__lbl { color: var(--txt-3); }
.p-verified {
  background: rgba(52, 211, 153, .14);
  border: 1px solid rgba(52, 211, 153, .38);
  color: var(--ok);
}
.p-deposit {
  background: var(--grad-soft);
  border: 1px solid rgba(108, 92, 255, .3);
  border-radius: var(--r-lg);
}
.p-deposit__lbl { color: var(--txt-2); }
.p-deposit__val { color: #fff; }
.p-deposit__sub { color: var(--txt-3); }
.p-ach {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--txt-2);
}
.p-ach:hover { border-color: var(--line-hi); background: var(--glass-hi); }
.p-review { border-bottom: 1px solid var(--line); }
.p-review__who  { color: var(--txt); }
.p-review__text { color: var(--txt-2); }
.p-review__lot  { color: var(--txt-3); }
.p-review__stars, .rvw-modal__card-stars, .review__rate { color: var(--warn); }

/* ---------- Каталог / фильтры ---------- */

.filters__title, .catalog__head h1, .catalog-sort { color: var(--txt); }
.filters__link { color: var(--txt-2); border-radius: var(--r-sm); }
.filters__link:hover { color: var(--txt); background: var(--glass); }
.filters__link.is-active {
  background: rgba(108, 92, 255, .16);
  color: #fff;
  border: 1px solid rgba(108, 92, 255, .4);
}
.filters__count, .catalog__count { color: var(--txt-3); }

/* ---------- Формы и мастер лота ---------- */

.form-head__title, .form-row__label { color: var(--txt); }
.form-row { border-bottom: 1px solid var(--line); }
.photo-preview { border: 1px solid var(--line); border-radius: var(--r); background: var(--bg-2); }
.photo-remove {
  background: rgba(4, 4, 8, .82);
  border: 1px solid var(--line-hi);
  color: #fff;
}

/* ---------- Авторизация ---------- */

.auth-shell { background: var(--bg-0); }
.auth-panel {
  background: rgba(18, 18, 28, .72);
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
}
.auth-panel__logo img, .auth-brand__logo img { filter: invert(1) brightness(1.7); }
.auth-heading { color: #fff; }
.auth-sub, .auth-foot { color: var(--txt-2); }
.auth-tab {
  background: transparent;
  color: var(--txt-2);
  border-radius: 999px;
}
.auth-tab.is-active, .auth-tab[aria-selected="true"] {
  background: var(--grad);
  color: #fff;
  box-shadow: var(--glow);
}
.auth-divider { color: var(--txt-3); }
.auth-social {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt);
  border-radius: var(--r);
}
.auth-social:hover { background: var(--glass-hi); border-color: var(--line-hi); }
.auth-brand { background: var(--grad-soft); }
.auth-brand__title { color: #fff; }
.auth-brand__lead, .auth-brand__perks { color: var(--txt-2); }
.auth-brand__testi {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  color: var(--txt-2);
}
.auth-msg { border-radius: var(--r); }

/* ---------- Подвал ---------- */

.footer { background: var(--bg-1); border-top: 1px solid var(--line); }
.footer__heading { color: var(--txt); }
.footer__col a, .footer__legal { color: var(--txt-3); }
.footer__col a:hover { color: var(--acc); }

/* ---------- Прочее ---------- */

.empty { color: var(--txt-3); }

.skip-link { background: var(--acc); color: #fff; }

hr { border: 0; border-top: 1px solid var(--line); }


/* ============================================================
   Лендинг: точечные правки.
   Светлый фон в этих блоках висит не на контейнере, а на детях —
   .l-why li, .l-cats a, .l-howto__step и т.д.
   ============================================================ */

/* Полоса «Как работает» шла светлым градиентом во всю ширину */
.l-howto {
  background: linear-gradient(180deg, rgba(255,255,255,.028) 0%, transparent 100%);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.l-howto__title, .l-howto__step h3 { color: var(--txt); }
.l-howto__lead, .l-howto__step p   { color: var(--txt-2); }

.l-howto__step {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: transform .3s var(--spring), border-color .25s, box-shadow .3s var(--spring);
}
.l-howto__step:hover {
  transform: translateY(-4px);
  border-color: rgba(108, 92, 255, .42);
  box-shadow: var(--glow);
}

/* Номер шага — плашка с градиентом, а не градиентный текст */
.l-howto__num {
  background: var(--grad);
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: #fff;
  box-shadow: var(--glow);
}

/* «Почему на бирже» */
.l-why li {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: transform .3s var(--spring), border-color .25s, box-shadow .3s var(--spring);
}
.l-why li:hover {
  transform: translateY(-4px);
  border-color: rgba(108, 92, 255, .42);
  box-shadow: var(--glow);
}
.l-why h3 { color: var(--txt); }
.l-why p  { color: var(--txt-2); }
.l-why__ico {
  background: rgba(108, 92, 255, .16);
  border: 1px solid rgba(108, 92, 255, .32);
  color: #B9AFFF;
}

/* Категории-плитки */
.l-cats a {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.l-cats a:hover {
  border-color: rgba(108, 92, 255, .42);
  box-shadow: var(--glow);
}
.l-cats__ico {
  background: rgba(108, 92, 255, .16);
  border: 1px solid rgba(108, 92, 255, .32);
  color: #B9AFFF;
}
.l-cats__name  { color: var(--txt); }
.l-cats__count { color: var(--txt-3); }

/* Виджет нейросетей: строки шли на светлой подложке */
.ai-widget { box-shadow: none; }
.ai-item {
  background: rgba(255, 255, 255, .035);
  border: 1px solid transparent;
}
.ai-item:hover {
  background: var(--glass-hi);
  border-color: var(--line-hi);
}

/* Отзывы и FAQ */
.l-testi__card, .l-faq__item {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.l-testi__ava { background: var(--bg-2); }
.l-faq__item summary { color: var(--txt); }
.l-faq__item summary::marker { color: var(--acc); }
.l-faq__item p { color: var(--txt-2); }

/* Карточки продавцов: аватар-заглушка на тёмном */
.seller-card__avatar, .scard__media, .byline__avatar { background: var(--bg-2); }
.seller-card__badge {
  background: rgba(108, 92, 255, .18);
  border: 1px solid rgba(108, 92, 255, .38);
  color: #B9AFFF;
}

/* ============================================================
   Зачистка светлых плашек, которые сидят на конкретных блоках
   (app.css / profile.css / form.css / home.css), а не на контейнерах.
   ============================================================ */

/* Лот: блок продавца, галерея, описание */
.product__seller {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.product__seller a, .product__seller b { color: var(--txt); }
.product__thumb { background: var(--bg-2); border-color: transparent; }
.product__thumb.is-active { border-color: var(--acc); }
.product__desc {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt-2);
}
.product__title { color: var(--txt); }
.product__crumbs, .product__crumbs a { color: var(--txt-3); }
.product__crumbs a:hover { color: var(--acc); }
.product__price {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Карточка лота: подложка и накладки поверх обложки */
.lot-card { background: var(--glass); border-color: var(--line); }
.lot-card__heart {
  background: rgba(12, 12, 19, .72);
  border: 1px solid var(--line-hi);
  color: #fff;
}
.lot-card__heart:hover { background: rgba(12, 12, 19, .9); border-color: var(--acc); }
.lot-card__sold { background: rgba(8, 8, 12, .88); color: #FB7185; border: 1px solid rgba(251,113,133,.45); }

/* Отзывы в профиле и в галерее отзывов */
.p-review, .rvw-modal__card {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.p-review__ava, .rvw-modal__card-ava { background: var(--bg-2); }
.p-review__who b, .rvw-modal__card-who { color: var(--txt); }
.p-review__who span { color: var(--txt-3); }
.p-review__text, .rvw-modal__card-text { color: var(--txt-2); }
.p-review__lot, .rvw-modal__card-lot { color: var(--txt-3); border-top-color: var(--line); }
.rvw-modal__arrow {
  background: var(--glass);
  border: 1px solid var(--line-hi);
  color: var(--txt);
}
.rvw-modal__arrow:hover { background: var(--glass-hi); border-color: var(--acc); color: #fff; }
.rvw-modal__dot { background: var(--line-hi); }
.rvw-modal__dot.is-active { background: var(--acc); }
.rvw-modal__counter, .rvw-modal__avg-lbl { color: var(--txt-3); }
.rvw-modal__avg { color: var(--txt); }
.rvw-modal__empty { color: var(--txt-3); }

/* Чекаут: сводка и статус-сообщения */
.co-summary { background: var(--glass); border: 1px solid var(--line); }
.co-msg.is-error { background: rgba(251,113,133,.12); color: #FB7185; border-color: rgba(251,113,133,.35); }
.co-msg.is-info  { background: rgba(108,92,255,.14); color: #B9AFFF; border-color: rgba(108,92,255,.4); }
.co-msg.is-ok    { background: rgba(52,211,153,.12); color: var(--ok); border-color: rgba(52,211,153,.35); }
.co-status__ico  { background: rgba(52,211,153,.14); color: var(--ok); }
.co-status__title { color: var(--txt); }
.co-status__sub   { color: var(--txt-2); }

/* Формы */
.form__row input, .form__row select, .form__row textarea {
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt);
}
.form__row input:focus, .form__row select:focus, .form__row textarea:focus {
  border-color: rgba(108, 92, 255, .6);
  background: rgba(108, 92, 255, .06);
  box-shadow: 0 0 0 4px rgba(108, 92, 255, .12);
  outline: none;
}
.form__row label { color: var(--txt-2); }

/* Шапка выпадашки уведомлений: фон задан в app.css отдельным правилом */
.bell__panel { background: rgba(14, 14, 22, .96); border-color: var(--line-hi); }

/* Кнопки отправки форм были сплошным тёмным #101014 — на тёмном холсте
   они пропадали. Переводим на фирменный градиент. */
.form__submit, .form-btn--save {
  background: var(--grad);
  color: #fff;
  border: 0;
  box-shadow: var(--glow);
  transition: transform .22s var(--spring), box-shadow .22s var(--spring);
}
.form__submit:hover, .form-btn--save:hover {
  transform: translateY(-1px);
  box-shadow: var(--glow-hi);
}
.form__submit:disabled, .form-btn--save:disabled {
  background: var(--glass-hi);
  color: var(--txt-3);
  box-shadow: none;
  transform: none;
}

/* Админка: подписи под цифрами и заголовки таблиц были почти не видны */
.adm-tile__lbl, .adm-side__lbl { color: var(--txt-2); }

/* ============================================================
   Страница настроек (/settings.html, вид для авторизованного)
   ============================================================ */

.set-shell {
  width: min(1100px, 100% - 48px);
  margin: 36px auto 64px;
}

.set-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 26px;
}
.set-head__title { margin: 0; font-size: 34px; }
.set-head__sub   { margin: 6px 0 0; color: var(--txt-2); font-size: 14px; }

.set-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 18px;
  align-items: start;
}

.set-card {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 24px 24px 22px;
}
.set-card__title { margin: 0; font-size: 19px; letter-spacing: -.02em; }
.set-card__hint  { margin: 6px 0 0; color: var(--txt-2); font-size: 13px; line-height: 1.5; }
.set-card__title + .set-field,
.set-card__hint  + .set-field,
.set-card__hint  + .set-avatar,
.set-card__title + .set-avatar,
.set-card__hint  + .set-row,
.set-card__hint  + .set-links { margin-top: 18px; }

.set-sep { height: 1px; background: var(--line); margin: 20px 0; }

/* поля */
.set-field { display: block; margin-top: 14px; }
.set-field__label {
  display: block;
  font-size: 13px; font-weight: 600;
  color: var(--txt-2);
  margin-bottom: 7px;
}
.set-field__hint {
  display: block;
  margin-top: 6px;
  color: var(--txt-3);
  font-size: 12px; line-height: 1.45;
}

.set-input {
  width: 100%;
  padding: 12px 14px;
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--txt);
  font: inherit; font-size: 15px;
  transition: border-color .2s, background .2s, box-shadow .2s;
}
.set-input:focus {
  outline: none;
  border-color: rgba(108, 92, 255, .6);
  background: rgba(108, 92, 255, .06);
  box-shadow: 0 0 0 4px rgba(108, 92, 255, .12);
}
.set-input:disabled {
  color: var(--txt-3);
  background: rgba(255, 255, 255, .02);
  cursor: not-allowed;
}
.set-input--area { min-height: 120px; resize: vertical; line-height: 1.5; }

/* аватар */
.set-avatar { display: flex; gap: 16px; align-items: center; }
.set-avatar__img {
  width: 76px; height: 76px;
  border-radius: 20px;
  object-fit: cover;
  background: var(--bg-2);
  border: 1px solid var(--line);
  flex: none;
}
.set-avatar__img--empty {
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; font-weight: 700;
  color: var(--txt-3);
}
.set-avatar__side { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }

/* переключатели */
.set-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
}
.set-row:last-of-type { border-bottom: 0; }
.set-row__title { display: block; font-weight: 600; font-size: 14px; }
.set-row__hint  { display: block; margin-top: 3px; color: var(--txt-2); font-size: 12px; line-height: 1.45; }
.set-toggle {
  width: 42px; height: 23px;
  accent-color: var(--acc);
  cursor: pointer;
  flex: none;
  margin-top: 1px;
}

/* действия и статусы */
.set-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.set-links { display: flex; gap: 10px; flex-wrap: wrap; }

.set-status { margin: 0; font-size: 13px; color: var(--txt-2); }
.set-status.is-ok  { color: var(--ok); }
.set-status.is-err { color: var(--err); }

@media (max-width: 720px) {
  .set-shell { width: calc(100% - 32px); }
  .set-grid { grid-template-columns: 1fr; }
  .set-head__title { font-size: 26px; }
}

/* ---------- Управление залогом на своей странице продавца ---------- */
.p-deposit { position: relative; flex-wrap: wrap; }
.p-deposit__manage { flex-basis: 100%; margin-top: 14px; }

.p-deposit__btn {
  padding: 9px 18px;
  border-radius: 999px;
  border: 1px solid var(--line-hi);
  background: var(--glass-hi);
  color: var(--txt);
  font: inherit; font-size: 13px; font-weight: 600;
  cursor: pointer;
  transition: transform .22s var(--spring), box-shadow .22s var(--spring), background .2s, border-color .2s;
}
.p-deposit__btn:hover { background: rgba(255,255,255,.14); border-color: var(--acc); transform: translateY(-1px); }

.p-deposit__btn--primary {
  background: var(--grad);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glow);
}
.p-deposit__btn--primary:hover { box-shadow: var(--glow-hi); }

.p-deposit__btn--ghost {
  background: transparent;
  border-color: var(--line);
  color: var(--txt-2);
  align-self: flex-start;
}
.p-deposit__btn--ghost:hover { border-color: var(--err); color: var(--err); background: rgba(251,113,133,.08); }

.p-deposit__panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 14px;
  padding: 16px;
  background: rgba(8, 8, 14, .4);
  border: 1px solid var(--line);
  border-radius: var(--r);
  max-width: 560px;
}
.p-deposit__note { margin: 0; color: var(--txt-2); font-size: 12.5px; line-height: 1.55; }
.p-deposit__form { display: flex; gap: 10px; align-items: center; }
.p-deposit__input {
  width: 150px;
  padding: 10px 14px;
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--txt);
  font: inherit; font-size: 14px;
}
.p-deposit__input:focus {
  outline: none;
  border-color: rgba(108, 92, 255, .6);
  box-shadow: 0 0 0 4px rgba(108, 92, 255, .12);
}
.p-deposit__msg { margin: 0; font-size: 13px; color: var(--txt-2); }
.p-deposit__msg.is-ok  { color: var(--ok); }
.p-deposit__msg.is-err { color: var(--err); }

/* Кнопка соцсети, когда провайдер не настроен на сервере */
.auth-social.is-disabled {
  opacity: .45;
  cursor: not-allowed;
}
.auth-social.is-disabled:hover {
  background: var(--glass);
  border-color: var(--line);
  transform: none;
}

/* Способы входа в карточке «Аккаунт» */
.set-ways { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.set-way {
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--glass);
  color: var(--txt-3);
  font-size: 12.5px; font-weight: 600;
}
.set-way.is-on {
  border-color: rgba(52, 211, 153, .38);
  background: rgba(52, 211, 153, .12);
  color: var(--ok);
}

/* Плашка поведения продавца: скорость ответа, выдачи, доля доведённых сделок */
.p-behaviour {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 0;
}
.p-behaviour__item {
  flex: 1 1 180px;
  padding: 14px 16px;
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
.p-behaviour__val {
  display: block;
  font-size: 17px; font-weight: 700;
  color: var(--txt);
  letter-spacing: -.02em;
}
.p-behaviour__lbl {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  color: var(--txt-3);
}

/* ---------- Реферальная страница ---------- */
.ref-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.ref-tile {
  padding: 18px 20px;
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.ref-tile__val {
  display: block;
  font-size: 26px; font-weight: 700;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.ref-tile__lbl { display: block; margin-top: 4px; color: var(--txt-3); font-size: 12.5px; }

.ref-list { display: flex; flex-direction: column; margin-top: 14px; }
.ref-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  color: inherit;
}
.ref-row:last-child { border-bottom: 0; }
.ref-row:hover { background: var(--glass); }
.ref-row__ava {
  width: 34px; height: 34px;
  border-radius: 999px;
  object-fit: cover;
  background: var(--bg-2);
  flex: none;
}
.ref-row__ava--empty {
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; color: var(--txt-3);
}
.ref-row__body { flex: 1; min-width: 0; }
.ref-row__name { display: block; font-weight: 600; font-size: 14px; }
.ref-row__meta { display: block; margin-top: 2px; color: var(--txt-3); font-size: 12px; }
.ref-row__sum {
  font-weight: 700; font-size: 14px;
  font-variant-numeric: tabular-nums;
  color: var(--txt-2);
}
.ref-row__sum.is-plus { color: var(--ok); }

/* ---------- Оптовое выставление ---------- */
.bulk-area {
  min-height: 260px;
  font-family: "Source Code Pro", ui-monospace, Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 1.7;
  white-space: pre;
  overflow-x: auto;
}
.bulk-format {
  margin: 14px 0 8px;
  padding: 10px 14px;
  background: rgba(108, 92, 255, .1);
  border: 1px solid rgba(108, 92, 255, .26);
  border-radius: var(--r-sm);
  overflow-x: auto;
}
.bulk-format code {
  font-family: "Source Code Pro", ui-monospace, monospace;
  font-size: 12.5px;
  color: #B9AFFF;
  white-space: nowrap;
}
.bulk-errors {
  margin-top: 16px;
  padding: 14px 16px;
  background: rgba(251, 113, 133, .1);
  border: 1px solid rgba(251, 113, 133, .32);
  border-radius: var(--r);
}
.bulk-error {
  display: flex; gap: 10px;
  padding: 4px 0;
  font-size: 13px;
  color: var(--txt-2);
}
.bulk-error__line {
  flex: none;
  color: var(--err);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.bulk-ref { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.bulk-ref__game { border-bottom: 1px solid var(--line); padding-bottom: 14px; }
.bulk-ref__game:last-child { border-bottom: 0; padding-bottom: 0; }
.bulk-ref__title {
  display: flex; align-items: center; gap: 8px;
  font-weight: 600; font-size: 14px;
  margin-bottom: 8px;
}
.bulk-ref__slug {
  font-family: "Source Code Pro", ui-monospace, monospace;
  font-size: 11.5px;
  color: var(--txt-3);
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px 7px;
}
.bulk-ref__cats { display: flex; flex-wrap: wrap; gap: 6px; }
.bulk-chip {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--glass);
  color: var(--txt-2);
  font: inherit; font-size: 12.5px;
  cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}
.bulk-chip:hover { border-color: var(--acc); color: #fff; background: rgba(108, 92, 255, .14); }

/* ---------- API-токены в настройках ---------- */
.token-reveal {
  margin: 14px 0;
  padding: 14px 16px;
  background: rgba(52, 211, 153, .1);
  border: 1px solid rgba(52, 211, 153, .32);
  border-radius: var(--r);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
.token-reveal__value {
  display: block;
  width: 100%;
  padding: 10px 12px;
  background: rgba(0, 0, 0, .35);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  font-family: "Source Code Pro", ui-monospace, Menlo, Consolas, monospace;
  font-size: 12.5px;
  color: var(--ok);
  word-break: break-all;
}
.token-scope {
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--glass-hi);
  border: 1px solid var(--line);
  font-size: 10.5px;
  font-weight: 600;
  color: var(--txt-3);
  font-family: inherit;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* ---------- Документация API ---------- */
.doc { margin-bottom: 18px; }
.doc__code {
  margin: 14px 0;
  padding: 16px 18px;
  background: rgba(0, 0, 0, .38);
  border: 1px solid var(--line);
  border-radius: var(--r);
  font-family: "Source Code Pro", ui-monospace, Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.65;
  color: #C9D4E8;
  overflow-x: auto;
  white-space: pre;
}
.doc__inline {
  padding: 1px 6px;
  border-radius: 5px;
  background: var(--glass-hi);
  border: 1px solid var(--line);
  font-family: "Source Code Pro", ui-monospace, monospace;
  font-size: 12px;
  color: #B9AFFF;
}
.doc__ep {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}
.doc__ep code {
  font-family: "Source Code Pro", ui-monospace, monospace;
  font-size: 13px;
  color: var(--txt);
  word-break: break-all;
}
.doc__m {
  flex: none;
  padding: 3px 9px;
  border-radius: 6px;
  font-size: 10.5px; font-weight: 700;
  letter-spacing: .06em;
}
.doc__m--get   { background: rgba(52, 211, 153, .16); color: var(--ok);   border: 1px solid rgba(52,211,153,.35); }
.doc__m--post  { background: rgba(108, 92, 255, .18); color: #B9AFFF;     border: 1px solid rgba(108,92,255,.4); }
.doc__m--patch { background: rgba(251, 191, 36, .16); color: var(--warn); border: 1px solid rgba(251,191,36,.35); }
.doc__scope {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(251, 191, 36, .13);
  border: 1px solid rgba(251, 191, 36, .3);
  color: var(--warn);
  font-size: 10.5px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .05em;
}
.doc__d { margin: 6px 0 0; color: var(--txt-2); font-size: 13px; line-height: 1.55; }

/* ---------- Популярные направления в мастере лота ---------- */
.wiz-quick { margin-bottom: 22px; }
.wiz-quick__head {
  display: flex; align-items: baseline; justify-content: space-between;
  flex-wrap: wrap; gap: 8px; margin-bottom: 12px;
}
.wiz-quick__title { font-weight: 600; font-size: 14px; color: var(--txt); }
.wiz-quick__hint  { font-size: 12px; color: var(--txt-3); }
.wiz-quick__row { display: flex; flex-wrap: wrap; gap: 8px; }
.wiz-quick__chip {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px 16px;
  border-radius: var(--r);
  border: 1px solid var(--line);
  background: var(--glass);
  cursor: pointer;
  text-align: left;
  font: inherit;
  transition: transform .22s var(--spring), border-color .2s, box-shadow .22s var(--spring), background .2s;
}
.wiz-quick__chip:hover {
  transform: translateY(-2px);
  border-color: rgba(108, 92, 255, .5);
  background: rgba(108, 92, 255, .1);
  box-shadow: var(--glow);
}
.wiz-quick__game { font-size: 11px; color: var(--txt-3); }
.wiz-quick__cat  { font-size: 14px; font-weight: 600; color: var(--txt); }
.wiz-quick__n    { font-size: 11px; color: var(--acc); }
.wiz-quick__sep {
  display: flex; align-items: center; gap: 12px;
  margin-top: 18px;
  color: var(--txt-3); font-size: 12px;
}
.wiz-quick__sep::before, .wiz-quick__sep::after {
  content: ''; flex: 1; height: 1px; background: var(--line);
}

/* ============================================================
   Чат: пузыри, группировка, разделители дней
   ============================================================ */

.chat-day {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 22px 0 14px;
}
.chat-day::before, .chat-day::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--line);
}
.chat-day span {
  color: var(--txt-3);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.chat-line {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  margin-bottom: 10px;
}
.chat-line.is-grouped { margin-bottom: 4px; }
.chat-line.is-me { flex-direction: row-reverse; }

.chat-line__ava {
  width: 32px; height: 32px;
  border-radius: 999px;
  object-fit: cover;
  background: var(--bg-2);
  border: 1px solid var(--line);
  flex: none;
}
.chat-line__ava--empty {
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
  color: var(--txt-3);
}
.chat-line__gap { width: 32px; flex: none; }

.chat-line__body {
  display: flex;
  flex-direction: column;
  max-width: min(560px, 74%);
  min-width: 0;
}
.chat-line.is-me .chat-line__body { align-items: flex-end; }

.chat-line__who {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--txt-3);
  margin: 0 4px 4px;
}

.chat-bubble {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  padding: 9px 13px 8px;
  border-radius: 16px 16px 16px 5px;
  background: var(--glass);
  border: 1px solid var(--line);
  color: var(--txt);
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.chat-line.is-grouped .chat-bubble { border-radius: 16px 16px 16px 5px; }

.chat-line.is-me .chat-bubble {
  border-radius: 16px 16px 5px 16px;
  background: linear-gradient(135deg, rgba(108, 92, 255, .9), rgba(168, 85, 247, .85));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 6px 22px -10px rgba(108, 92, 255, .8);
}

.chat-bubble__text { white-space: pre-wrap; }
.chat-bubble__time {
  flex: none;
  align-self: flex-end;
  font-size: 10.5px;
  color: var(--txt-3);
  font-variant-numeric: tabular-nums;
  margin-bottom: 1px;
}
.chat-line.is-me .chat-bubble__time { color: rgba(255, 255, 255, .72); }

.chat-empty {
  margin: auto;
  padding: 40px 20px;
  text-align: center;
}
.chat-empty__title { margin: 0; font-size: 15px; font-weight: 600; color: var(--txt-2); }
.chat-empty__sub   { margin: 6px 0 0; font-size: 13px; color: var(--txt-3); }

@media (max-width: 640px) {
  .chat-line__body { max-width: 84%; }
}

/* ============================================================
   Экран входа и регистрации
   Часть сайта, а не отдельная полноэкранная страница:
   шапка и подвал на месте, карточки те же, что везде.
   ============================================================ */

.auth2-shell {
  width: min(1060px, 100% - 48px);
  margin: 44px auto 72px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .82fr);
  gap: 20px;
  align-items: start;
}

.auth2-card {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 30px 32px;
}
.auth2-card--form { padding: 26px 32px 30px; }
.auth2-card--perks { background: var(--grad-soft); border-color: rgba(108, 92, 255, .28); }
.auth2-card--testi { margin-top: 16px; }

/* вкладки */
.auth2-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  background: rgba(0, 0, 0, .28);
  border: 1px solid var(--line);
  border-radius: 999px;
  margin-bottom: 22px;
}
.auth2-tab {
  padding: 9px 22px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--txt-2);
  font: inherit; font-size: 14px; font-weight: 600;
  cursor: pointer;
  transition: background .2s, color .2s, box-shadow .25s var(--spring);
}
.auth2-tab:hover { color: var(--txt); }
.auth2-tab.is-active {
  background: var(--grad);
  color: #fff;
  box-shadow: var(--glow);
}

.auth2-title { margin: 0; font-size: 30px; letter-spacing: -.04em; }
.auth2-sub   { margin: 8px 0 0; color: var(--txt-2); font-size: 14px; line-height: 1.5; }

.auth2-msg { margin: 14px 0 0; font-size: 13px; color: var(--txt-2); }
.auth2-msg:empty { margin: 0; }
.auth2-msg.is-error { color: var(--err); }
.auth2-msg.is-ok    { color: var(--ok); }
.auth2-msg.is-info  { color: #B9AFFF; }

.auth2-formhost { margin-top: 20px; }
.auth2-form { display: flex; flex-direction: column; gap: 14px; }

.auth2-field { display: block; }
.auth2-label {
  display: block;
  margin-bottom: 7px;
  font-size: 13px; font-weight: 600;
  color: var(--txt-2);
}
.auth2-hint { display: block; margin-top: 6px; font-size: 12px; color: var(--txt-3); }

.auth2-inputwrap { position: relative; display: block; }
.auth2-inputwrap .set-input { padding-right: 96px; }
.auth2-peek {
  position: absolute;
  right: 6px; top: 50%;
  transform: translateY(-50%);
  padding: 6px 12px;
  border: 0;
  border-radius: 999px;
  background: var(--glass-hi);
  color: var(--txt-2);
  font: inherit; font-size: 12px;
  cursor: pointer;
}
.auth2-peek:hover { color: #fff; background: rgba(255, 255, 255, .14); }

.auth2-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.auth2-check {
  display: inline-flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 13px;
  color: var(--txt-2);
  cursor: pointer;
}
.auth2-check input { accent-color: var(--acc); width: 17px; height: 17px; cursor: pointer; flex: none; margin-top: 1px; }
.auth2-check--terms { line-height: 1.45; }

.auth2-link {
  background: none;
  border: 0;
  padding: 0;
  color: var(--acc);
  font: inherit; font-size: 13px; font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}
.auth2-link:hover { color: var(--acc-3); }

.auth2-submit {
  margin-top: 4px;
  padding: 14px 24px;
  border: 0;
  border-radius: 999px;
  background: var(--grad);
  color: #fff;
  font: inherit; font-size: 15px; font-weight: 600;
  cursor: pointer;
  box-shadow: var(--glow);
  transition: transform .22s var(--spring), box-shadow .22s var(--spring);
}
.auth2-submit:hover { transform: translateY(-1px); box-shadow: var(--glow-hi); }
.auth2-submit:disabled { opacity: .6; cursor: progress; transform: none; }

.auth2-or {
  display: flex; align-items: center; gap: 14px;
  margin: 22px 0 16px;
  color: var(--txt-3); font-size: 12px;
}
.auth2-or::before, .auth2-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }

.auth2-socials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.auth2-social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 10px;
  border-radius: var(--r);
  border: 1px solid var(--line);
  background: var(--glass);
  color: var(--txt);
  font: inherit; font-size: 13px; font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .2s, background .2s, transform .22s var(--spring);
}
.auth2-social:hover { border-color: var(--line-hi); background: var(--glass-hi); transform: translateY(-1px); }
.auth2-social.is-disabled { opacity: .45; cursor: not-allowed; }
.auth2-social.is-disabled:hover { transform: none; background: var(--glass); border-color: var(--line); }
.auth2-social__ico {
  width: 20px; height: 20px;
  border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800;
  flex: none;
}

.auth2-legal { margin: 18px 0 0; font-size: 12.5px; color: var(--txt-3); }
.auth2-legal code {
  padding: 2px 7px;
  border-radius: 6px;
  background: var(--glass-hi);
  border: 1px solid var(--line);
  font-family: "Source Code Pro", ui-monospace, monospace;
  font-size: 11.5px;
  color: #B9AFFF;
}
.auth2-foot { margin: 12px 0 0; font-size: 13px; color: var(--txt-2); }

/* правая колонка */
.auth2-eyebrow {
  display: inline-block;
  padding: 5px 13px;
  border-radius: 999px;
  background: var(--glass-hi);
  border: 1px solid var(--line-hi);
  font-size: 11.5px; font-weight: 600;
  color: var(--txt);
}
.auth2-aside__title { margin: 16px 0 0; font-size: 21px; letter-spacing: -.03em; }
.auth2-perks { list-style: none; margin: 20px 0 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.auth2-perks li { display: flex; gap: 14px; }
.auth2-perks__n {
  flex: none;
  font-size: 13px; font-weight: 700;
  color: var(--acc);
  font-variant-numeric: tabular-nums;
  padding-top: 1px;
}
.auth2-perks b { display: block; font-size: 14.5px; color: var(--txt); }
.auth2-perks__d { display: block; margin-top: 4px; font-size: 13px; color: var(--txt-2); line-height: 1.5; }

.auth2-testi__text { margin: 0; font-size: 13.5px; color: var(--txt-2); line-height: 1.6; }
.auth2-testi__who  { margin: 10px 0 0; font-size: 12.5px; color: var(--txt-3); font-weight: 600; }

@media (max-width: 900px) {
  .auth2-shell { grid-template-columns: 1fr; width: calc(100% - 32px); margin-top: 28px; }
  .auth2-card { padding: 24px 22px; }
  .auth2-title { font-size: 25px; }
  .auth2-socials { grid-template-columns: 1fr; }
}

/* ============================================================
   Плавные переходы между страницами
   ============================================================ */

/* Нативные кросс-документные переходы: браузер сам делает кроссфейд
   между страницами, JS не нужен. Где не поддержано — обычная
   навигация, ничего не ломается. */
@view-transition { navigation: auto; }

/* Шапка и подвал одинаковы на всех страницах — пусть не мигают,
   а остаются на месте, пока меняется содержимое. */
.nav { view-transition-name: site-nav; }
.footer { view-transition-name: site-footer; }

@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root) {
    animation: vt-out .18s cubic-bezier(.4, 0, 1, 1) both;
  }
  ::view-transition-new(root) {
    animation: vt-in .28s cubic-bezier(.22, 1, .36, 1) both;
  }
  @keyframes vt-out {
    to { opacity: 0; transform: translateY(-6px); }
  }
  @keyframes vt-in {
    from { opacity: 0; transform: translateY(10px); }
  }

  /* Браузерам без View Transitions — мягкое появление содержимого.
     Шапки и подвала не касается, чтобы каркас не дёргался. */
  @supports not (view-transition-name: none) {
    main { animation: vt-in .3s cubic-bezier(.22, 1, .36, 1) both; }
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}