/* CHAT C · VYSHKA visual x10000 (2026-07-31)
 * Cascade-last polish: hero contrast · solid cobalt · store/files purple kill ·
 * auth-loading · empty · pulses · consent · 390 adapt.
 * Canon: Onest/Unbounded · cobalt #1d4ed8 · light-first · no purple slop.
 */
:root {
  --vyx-brand: #1d4ed8;
  --vyx-brand-deep: #1e40af;
  --vyx-sky: #38bdf8;
  --vyx-mint: #2ccf9b;
  --vyx-bg: #f4f7fb;
  --vyx-surface: #ffffff;
  --vyx-text: #111827;
  --vyx-muted: #475569; /* AA body mute — not washed #94a3b8 */
  --vyx-line: #d8e1ec;
  --vyx-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --vyx-live: #e11d48;
}

/* ── Voice hero: contrast · solid cobalt CTA · desktop balance ───────────── */
body.vy-shell-body[data-landing-v2] .hero .lede,
.hero .lede,
.hero .sub,
.vv-join__lede {
  color: #1e293b !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}
.hero .price-anchor,
.hero .nav-links a {
  color: #334155 !important;
}
.hero .btn-primary,
.hero-cta .btn-primary,
a.btn.btn-primary[data-primary-cta],
.nav .btn-primary,
.final .btn-primary {
  background: #1d4ed8 !important;
  background-image: none !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -12px rgba(29, 78, 216, 0.55) !important;
}
.hero .btn-primary:hover,
.hero-cta .btn-primary:hover,
a.btn.btn-primary[data-primary-cta]:hover,
.nav .btn-primary:hover {
  background: #1e40af !important;
  background-image: none !important;
  border-color: #1e40af !important;
  filter: none !important;
}
@media (min-width: 920px) {
  .hero-grid {
    grid-template-columns: 0.92fr 1.08fr !important;
    gap: 28px !important;
    align-items: stretch !important;
  }
  .hero-visual {
    min-height: 420px !important;
    height: 100%;
    transform: scale(1.02);
    transform-origin: center right;
    box-shadow:
      0 28px 64px -28px rgba(29, 78, 216, 0.38),
      0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
  }
  .hero h1 {
    max-width: 17ch !important;
  }
  .hero::before {
    background:
      radial-gradient(ellipse 520px 300px at 88% 18%, rgba(29, 78, 216, 0.14), transparent 55%),
      radial-gradient(ellipse 420px 240px at 12% 0%, rgba(56, 189, 248, 0.12), transparent 58%) !important;
  }
}

/* ── Store / Files: kill purple + Inter leftovers ────────────────────────── */
body[data-page="store"],
body[data-page="files"],
html[data-page="store"],
html[data-page="files"] {
  --acc: #1d4ed8 !important;
  --acc-hover: #1e40af !important;
  --acc-active: #1e3a8a !important;
  --acc-soft: rgba(29, 78, 216, 0.14) !important;
  --grad: linear-gradient(135deg, #1d4ed8, #0ea5e9) !important;
  font-family: var(--vy-font-body, "Onest", "Segoe UI", system-ui, sans-serif) !important;
}
body[data-page="store"] .st-cats .tab.active,
body[data-page="store"] .btn.primary,
body[data-page="store"] .rail .ritem.active {
  background: #1d4ed8 !important;
  box-shadow: 0 4px 14px rgba(29, 78, 216, 0.28) !important;
}
body[data-page="store"] .bgFrame {
  background:
    radial-gradient(ellipse at 50% 40%, rgba(29, 78, 216, 0.22), transparent 68%),
    linear-gradient(160deg, #0f172a 0%, #1e3a8a 100%) !important;
}
[data-theme="light"] body[data-page="store"] .bgFrame,
body[data-page="store"][data-theme="light"] .bgFrame {
  background:
    radial-gradient(ellipse at 50% 40%, rgba(29, 78, 216, 0.14), transparent 68%),
    linear-gradient(160deg, #eef6ff 0%, #dce8f8 100%) !important;
}
body[data-page="store"] .vshell-rail .it::before {
  background: #1d4ed8 !important;
}
body[data-page="files"] .grad-1 {
  background: linear-gradient(135deg, #1d4ed8, #1e40af) !important;
}

/* Early checking flash (::before) — branded pulse, not naked text */
html[data-auth-state="checking"] body:not(.vy-auth-gate-ready)::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: grid !important;
  place-items: center !important;
  background:
    radial-gradient(ellipse 560px 280px at 12% -8%, rgba(56, 189, 248, 0.16), transparent 55%),
    radial-gradient(ellipse 480px 240px at 92% 8%, rgba(29, 78, 216, 0.12), transparent 50%),
    #f4f7fb !important;
}
html[data-auth-state="checking"] body:not(.vy-auth-gate-ready)::after {
  content: "Проверяем защищённую сессию…";
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 2147483001;
  width: min(420px, calc(100vw - 40px));
  margin-left: 0;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  padding: 88px 28px 28px;
  border-radius: 22px;
  border: 1px solid #d8e1ec;
  background:
    #1d4ed8 50% 28px / 52px 52px no-repeat,
    #ffffff;
  background-origin: border-box;
  box-shadow:
    0 0 0 0 rgba(29, 78, 216, 0.35),
    0 22px 56px -28px rgba(15, 23, 42, 0.42);
  color: #111827;
  font: 700 18px/1.35 "Unbounded", "Avenir Next", system-ui, sans-serif;
  letter-spacing: -0.03em;
  text-align: center;
  animation: vyx-auth-load 1.4s var(--vyx-ease) infinite;
  pointer-events: none;
}
@keyframes vyx-auth-load {
  0%, 100% { box-shadow: 0 0 0 0 rgba(29, 78, 216, 0.28), 0 22px 56px -28px rgba(15, 23, 42, 0.42); }
  50% { box-shadow: 0 0 0 10px rgba(29, 78, 216, 0), 0 22px 56px -28px rgba(15, 23, 42, 0.42); }
}
html[data-auth-state="checking"] .vy-auth-gate:not([hidden]),
html[data-auth-state="offline"] .vy-auth-gate:not([hidden]) {
  display: grid !important;
}

/* ── Auth gate: pulse + hidden button respect + Onest ───────────────────── */
.vy-auth-gate {
  font-family: "Onest", "Segoe UI", system-ui, sans-serif !important;
  background:
    radial-gradient(ellipse 560px 280px at 12% -8%, rgba(56, 189, 248, 0.16), transparent 55%),
    radial-gradient(ellipse 480px 240px at 92% 8%, rgba(29, 78, 216, 0.12), transparent 50%),
    var(--vyx-bg) !important;
  color: var(--vyx-text) !important;
}
.vy-auth-gate-card {
  width: min(420px, 100%);
  padding: 28px 24px !important;
  border-radius: 22px !important;
  border: 1px solid var(--vyx-line) !important;
  background: var(--vyx-surface) !important;
  box-shadow: 0 22px 56px -28px rgba(15, 23, 42, 0.42) !important;
  animation: vyx-gate-in 360ms var(--vyx-ease) both;
}
.vy-auth-gate-mark {
  position: relative;
  width: 52px !important;
  height: 52px !important;
  margin: 0 auto 16px !important;
  border-radius: 16px !important;
  background: #1d4ed8 !important;
  background-image: none !important;
  color: #fff !important;
  font: 800 18px/1 "Unbounded", "Avenir Next", system-ui, sans-serif !important;
  box-shadow: 0 12px 28px -10px rgba(29, 78, 216, 0.55);
}
.vy-auth-gate-mark::after {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 18px;
  border: 2px solid rgba(29, 78, 216, 0.35);
  animation: vyx-pulse-ring 1.8s var(--vyx-ease) infinite;
  pointer-events: none;
}
html[data-auth-state="checking"] .vy-auth-gate-mark::after,
.vy-auth-gate.is-checking .vy-auth-gate-mark::after {
  animation-duration: 1.25s;
}
.vy-auth-gate strong {
  font: 700 18px/1.25 "Unbounded", system-ui, sans-serif !important;
  letter-spacing: -0.03em;
  color: var(--vyx-text) !important;
}
.vy-auth-gate p {
  margin: 10px 0 18px !important;
  color: var(--vyx-muted) !important;
  font: 400 14px/1.55 "Onest", system-ui, sans-serif !important;
}
.vy-auth-gate button {
  min-width: 140px;
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  background: var(--vyx-brand) !important;
  color: #fff !important;
  font: 700 14px/1 "Onest", system-ui, sans-serif !important;
  cursor: pointer;
  box-shadow: 0 12px 28px -12px rgba(29, 78, 216, 0.7);
  transition: transform 0.16s var(--vyx-ease), background 0.16s ease;
}
.vy-auth-gate button:hover { background: var(--vyx-brand-deep) !important; transform: translateY(-1px); }
.vy-auth-gate button[hidden] { display: none !important; }
.vy-auth-gate .vyx-gate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 2px;
}
.vy-auth-gate .vyx-gate-ghost {
  background: transparent !important;
  color: var(--vyx-brand) !important;
  border: 1.5px solid var(--vyx-line) !important;
  box-shadow: none !important;
}

@keyframes vyx-pulse-ring {
  0%, 100% { opacity: 0.35; transform: scale(0.94); }
  50% { opacity: 0.85; transform: scale(1.04); }
}
@keyframes vyx-gate-in {
  from { opacity: 0; transform: translateY(10px) scale(0.985); }
  to { opacity: 1; transform: none; }
}

/* ── Shared empty states ─────────────────────────────────────────────────── */
.vyes,
.empty-state,
.st-empty,
.cart-empty,
.vempty,
.ld-empty,
.vv-empty,
.files-empty,
.vyfx-empty {
  font-family: "Onest", system-ui, sans-serif !important;
}
.vyes .es-ic,
.empty-state .es-ic,
.st-empty-icon,
.vempty .ei,
.ld-empty-ic {
  position: relative;
  border-radius: 16px !important;
  background: linear-gradient(160deg, #eff6ff, #e0f2fe) !important;
  border: 1px solid color-mix(in srgb, var(--vyx-brand) 18%, var(--vyx-line)) !important;
  color: var(--vyx-brand) !important;
}
.vyes .es-t,
.empty-state .es-t,
.st-empty-t,
.vempty .et,
.ld-empty h2 {
  font-family: "Unbounded", system-ui, sans-serif !important;
  letter-spacing: -0.02em;
  color: var(--vyx-text) !important;
}
.vyes .es-s,
.empty-state .es-s,
.st-empty-s,
.vempty .es,
.ld-empty p {
  color: var(--vyx-muted) !important;
}

/* Soft pulse on live / online / new indicators */
.ld-pulse,
.vv-live-dot,
[data-vy-pulse],
.presence.on,
.story:not(.seen) .story-ring {
  animation: vyx-presence 2.2s var(--vyx-ease) infinite;
}
@keyframes vyx-presence {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.92); }
}

/* ── Consent banner: light canon (kill dark Discord sheet) ───────────────── */
.vy-analytics-consent {
  background: var(--vyx-surface) !important;
  color: var(--vyx-text) !important;
  border: 1px solid var(--vyx-line) !important;
  box-shadow: 0 22px 56px -24px rgba(15, 23, 42, 0.35) !important;
  font-family: "Onest", system-ui, sans-serif !important;
  max-width: min(560px, calc(100vw - 24px)) !important;
}
.vy-analytics-consent h2 {
  font-family: "Unbounded", system-ui, sans-serif !important;
  letter-spacing: -0.03em;
  font-size: 17px !important;
  color: var(--vyx-text) !important;
}
.vy-analytics-consent p {
  color: var(--vyx-muted) !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
}
.vy-analytics-consent__actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 8px !important;
}
.vy-analytics-consent__actions button[data-vy-analytics-close] {
  grid-column: 1 / -1;
}
.vy-analytics-consent button {
  border-radius: 12px !important;
  font-family: "Onest", system-ui, sans-serif !important;
  font-weight: 700 !important;
  border: 1px solid var(--vyx-line) !important;
  background: var(--vyx-surface) !important;
  color: var(--vyx-brand-deep) !important;
  box-shadow: none !important;
  outline: none !important;
}
.vy-analytics-consent button[data-vy-analytics-choice="accepted"] {
  background: #1d4ed8 !important;
  background-image: none !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 12px 28px -14px rgba(29, 78, 216, 0.75) !important;
}

/* Account primary CTA: solid cobalt (kill pale/iris gradient read) */
body[data-page="account"] .button.primary,
html[data-page="account"] .button.primary {
  background: #1d4ed8 !important;
  background-image: none !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
}
.vy-analytics-consent button:focus-visible {
  outline: 2px solid var(--vyx-brand) !important;
  outline-offset: 2px !important;
}
.vy-analytics-settings {
  background: var(--vyx-surface) !important;
  color: var(--vyx-muted) !important;
  border: 1px solid var(--vyx-line) !important;
  font-family: "Onest", system-ui, sans-serif !important;
  box-shadow: 0 8px 20px -12px rgba(15, 23, 42, 0.35);
}

/* ── Account rotating word: no fake gap before period ────────────────────── */
body[data-page="account"] .changing,
html[data-page="account"] .changing {
  min-width: 0 !important;
  padding-right: 0.05em;
}

/* ── Leads: header + switcher alignment ──────────────────────────────────── */
body[data-page="leads"] .ld-top-actions {
  align-items: center;
}
body[data-page="leads"] .ld-top .vy-product-switcher,
body[data-page="leads"] .ld-top-actions .vy-product-launcher {
  align-self: center;
}
body[data-page="leads"] .ld-chip,
body[data-page="leads"] .ld-btn {
  min-height: 42px;
}
body[data-page="leads"] .ld-empty-ic {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  margin: 0 auto 12px;
  font-size: 22px;
  color: var(--vyx-brand);
}

/* ── Video: unify LIVE badges + soft targets ─────────────────────────────── */
body[data-page="video"] .vv-live-pill,
.vv-chip.live,
.vv-thumb-live {
  background: var(--vyx-live) !important;
  color: #fff !important;
}
body[data-page="video"] .vv-live-soft {
  background: #fff1f2 !important;
  color: var(--vyx-live) !important;
  border: 1px solid #fecdd3 !important;
}
body[data-page="video"] .vv-live-soft .vv-live-dot,
body[data-page="video"] .vv-live-soft::before {
  background: var(--vyx-live);
  box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.45);
  animation: vyx-live-ping 1.8s var(--vyx-ease) infinite;
}
@keyframes vyx-live-ping {
  0% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.45); }
  70% { box-shadow: 0 0 0 8px rgba(225, 29, 72, 0); }
  100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, 0); }
}

/* ── Store / Files empty polish ──────────────────────────────────────────── */
body[data-page="store"] .st-empty-icon,
body[data-page="files"] .es-ic,
body[data-page="files"] .vyes .es-ic {
  animation: vyx-gate-in 420ms var(--vyx-ease) both;
}

/* ── Product switcher micro-motion ───────────────────────────────────────── */
.vy-product-card {
  transition: transform 0.18s var(--vyx-ease), box-shadow 0.18s var(--vyx-ease), border-color 0.18s ease;
}
.vy-product-card:hover {
  transform: translateY(-2px);
}
.vy-product-card__icon {
  transition: transform 0.2s var(--vyx-ease);
}
.vy-product-card:hover .vy-product-card__icon {
  transform: scale(1.06);
}

/* ── Mobile 390: overflow + tap targets ──────────────────────────────────── */
@media (max-width: 420px) {
  html, body {
    overflow-x: clip;
  }
  .vy-auth-gate { padding: 16px !important; }
  .vy-auth-gate-card { padding: 24px 18px !important; }
  .vy-analytics-consent {
    left: 10px !important;
    right: 10px !important;
    bottom: max(10px, env(safe-area-inset-bottom)) !important;
    padding: 16px !important;
  }
  .vy-analytics-consent h2 { font-size: 16px !important; }
  body[data-page="leads"] .ld-shell {
    width: calc(100% - 1rem);
    padding-top: 0.75rem;
  }
  body[data-page="leads"] .ld-top {
    flex-wrap: wrap;
    gap: 0.65rem;
  }
  body[data-page="leads"] .ld-top-actions {
    width: 100%;
    justify-content: flex-end;
  }
  body[data-page="video"] .vv-top {
    gap: 10px;
    padding: 10px 12px;
  }
  body[data-page="account"] .hero-actions .button,
  body[data-page="account"] .cta-row .button {
    min-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .vy-auth-gate-card,
  .vy-auth-gate-mark::after,
  .ld-pulse,
  .vv-live-dot,
  [data-vy-pulse],
  .presence.on,
  .story:not(.seen) .story-ring,
  .vy-product-card,
  .vy-product-card__icon,
  body[data-page="video"] .vv-live-soft .vv-live-dot,
  body[data-page="video"] .vv-live-soft::before,
  html[data-auth-state="checking"] body:not(.vy-auth-gate-ready)::after {
    animation: none !important;
    transition: none !important;
  }
}

/* CHAT_C_OVERFLOW · eco-assistant must never widen viewport */
html, body {
  max-width: 100%;
  overflow-x: clip;
}
.vy-eco-assistant,
.vy-eco-assistant *,
[data-vy-eco-assistant],
.vy-ea-root,
.vy-ea-panel,
.vy-ea-fab {
  max-width: min(100vw - 16px, 420px);
}
.vy-ea-fab,
[data-vy-eco-fab],
button[aria-label*="помощник" i],
button[aria-label*="Помощник"] {
  right: max(12px, env(safe-area-inset-right)) !important;
  left: auto !important;
  z-index: 60 !important;
}
.vy-ea-panel,
.vy-eco-assistant[data-open="1"],
.vy-ea-root.is-open {
  width: min(360px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  right: max(12px, env(safe-area-inset-right)) !important;
  left: auto !important;
  box-sizing: border-box !important;
}

/* Store 390: stack hero CTAs, kill overlap */
@media (max-width: 420px) {
  body[data-page="store"] .hero-actions,
  body[data-page="store"] .st-hero-cta,
  body[data-page="store"] .cta-row,
  body[data-page="store"] .st-hero .actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  body[data-page="store"] .hero-actions .btn,
  body[data-page="store"] .st-hero-cta .btn,
  body[data-page="store"] .st-hero .btn {
    width: 100% !important;
    max-width: 100% !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
  }
  body[data-page="video"] .vv-top,
  body[data-page="video"] .vv-hero-cta,
  body[data-page="leads"] .ld-top,
  body[data-page="leads"] .ld-top-actions {
    max-width: 100%;
    overflow: hidden;
  }
  body[data-page="leads"] .ld-top-actions {
    flex-wrap: wrap;
  }
}

/* CHAT_C_ECO_BEM · real assistant class names */
.vy-eco-assist {
  max-width: min(100vw - 16px, 420px);
  right: max(12px, env(safe-area-inset-right)) !important;
  left: auto !important;
}
@media (max-width: 640px) {
  .vy-eco-assist {
    /* Clear switcher FAB corner — see vyshka-mobile-390.css */
    right: max(78px, calc(66px + env(safe-area-inset-right, 0px))) !important;
  }
}
.vy-eco-assist__panel {
  width: min(360px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  box-sizing: border-box !important;
}
html, body { max-width: 100%; overflow-x: clip; }