/* ==========================================================================
   «Полутон» — дизайн-код Voice поверх стилей сайта.
   Бумага и ночные чернила, фиолетовый голос, Montserrat. Декор — только точки:
   без градиентных свечений, размытий, теней, «зерна» и 3D-наклонов.
   ========================================================================== */
:root {
  --paper: #f4f2ff;
  --paper-2: #ece8ff;
  --card: #ffffff;
  --ink: #16112e;
  --ink-2: #4a4470;
  --mute: #6e6898;
  --line: rgba(22, 17, 46, 0.11);
  --line-2: rgba(22, 17, 46, 0.2);
  --accent: #5b3cff;
  --violet-night: #8c75ff;
  --lav: #c9bfff;
  --night: #0a0817;
  --night-2: #141029;
  --night-line: #272147;
  --app: #0e0b1f;
  --mint: #12a577;
  --rose: #d92d55;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --sans: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --tight: "Montserrat", system-ui, sans-serif;
  --serif: "Montserrat", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}

body { font-family: var(--sans); font-weight: 500; }
/* «Зерно бумаги» было фиксированным слоем со смешиванием на весь экран — его пересчитывал каждый кадр прокрутки. */
body::before { display: none !important; }
*, *::before, *::after { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }

/* ---------- Типографика: вместо курсива с засечками — фиолетовое слово того же шрифта ---------- */
.display, .h2, .h3, .final-title { font-family: var(--sans); font-weight: 700; letter-spacing: -0.05em; }
.h3 { letter-spacing: -0.035em; }
.display em, .h2 em, .final-title em, .ph-h1 em, .cta-in .h2 em {
  font-family: var(--sans);
  font-style: normal;
  font-weight: 700;
  font-size: 1em;
  line-height: inherit;
  letter-spacing: inherit;
  color: var(--accent);
}
.market .h2 em, .games .h2 em { color: var(--violet-night); }
.more-title, .marquee span { font-family: var(--sans); font-style: normal; font-weight: 700; letter-spacing: -0.04em; }
.marquee b { color: var(--accent); }
.nf-code { font: 800 clamp(110px, 22vw, 260px)/0.8 var(--mono); font-style: normal; letter-spacing: -0.06em; }
.eyebrow { font: 600 12px/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; }
.eyebrow::before { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.num { font-family: var(--mono); letter-spacing: 0.04em; }
code, kbd, .mono { font-family: var(--mono); }
::selection { background: var(--accent); color: #fff; }

/* ---------- Кнопки ---------- */
.btn { font-weight: 600; }
.btn-ink { background: var(--accent); color: #fff; }
.btn-ink::before { background: var(--ink); }
.btn-line { border-color: var(--line-2); }
.btn-line:hover { border-color: var(--accent); background: transparent; color: var(--accent); }

/* ---------- Шапка ---------- */
.nav.scrolled, body.sp .nav { background: var(--paper); border-color: var(--line); }
.brand { gap: 0; }
.brand svg.word { display: block; height: 24px; width: auto; }
.brand svg.word .v { fill: var(--accent); }
.brand svg.word .w { fill: var(--ink); }
.brand:hover svg.word circle { animation: pt-pulse 0.62s var(--ease) var(--dl, 0s); }
.sfoot .brand svg.word { height: 30px; }
@keyframes pt-pulse { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.35); } 70% { transform: scale(0.9); } }
svg.word circle { transform-box: fill-box; transform-origin: center; }

/* ---------- Без 3D: окно приложения стоит прямо ---------- */
.stage-wrap { perspective: none; }
.stage { transform: translateY(var(--ty, 0px)) !important; will-change: auto; }

/* ---------- Без теней: глубина — тонкой линией ---------- */
.window { box-shadow: 0 0 0 1px var(--night-line); border-radius: 18px; }
.window-bar { background: var(--night-2); border-bottom-color: var(--night-line); }
.window-bar i, .window-bar i:nth-child(n) { background: #2b2552; }
.vc { background: var(--night-2); box-shadow: 0 0 0 1px var(--night-line); }
.vc-p.on { box-shadow: 0 0 0 2.5px var(--night-2), 0 0 0 5px #2ee6a8; }
.vc-live { color: #2ee6a8; }
.vc-ctl .ic { background: #1b1636; }
.vc-ctl .ic.off { background: #ff5c7c; }
.phone { box-shadow: 0 0 0 1px var(--night-line); background: var(--night); }
.fx-card:hover, .lg-card:hover, .pk:hover { box-shadow: none; border-color: var(--accent); }
.dn-account, .ret-card { box-shadow: none; }
.show-tabs button[aria-selected="true"] { box-shadow: 0 0 0 1.5px var(--accent); }
.show-pane, .arcade-screen { box-shadow: 0 0 0 1px var(--night-line); }
.news { box-shadow: 0 0 0 1px var(--line); }
.news:hover { box-shadow: 0 0 0 1.5px var(--accent); }
.guest, .pop, .tf { box-shadow: 0 0 0 1px var(--line) !important; }
.market-shot .window { box-shadow: 0 0 0 1px var(--night-line); }
.howto-card:target, .ds-box:focus-within { box-shadow: 0 0 0 3px rgba(91, 60, 255, 0.18); }
.scrub-knob { box-shadow: 0 0 0 2px var(--accent); }

/* ---------- Свечения → поле точек ---------- */
.hero-glow, .ph-glow { display: none !important; }
.market::before, .games::before {
  background: none !important;
  background-image: radial-gradient(circle, rgba(140, 117, 255, 0.4) 1.3px, transparent 1.8px) !important;
  background-size: 18px 18px !important;
  -webkit-mask-image: radial-gradient(60% 70% at 50% 100%, #000, transparent 75%);
  mask-image: radial-gradient(60% 70% at 50% 100%, #000, transparent 75%);
}
.tf-ic { background: var(--accent) !important; }
.arcade-list button::before { background: var(--g1) !important; }
.arcade-list button[aria-selected="true"] { box-shadow: none; }

/* Бесконечное покачивание карточек — в покое страница не двигается */
.guest, .tf { animation: none !important; }

/* ---------- Первый экран: крупная надпись voice из точек ---------- */
.pt-hero { position: relative; margin: 0 auto clamp(18px, 3vw, 40px); height: clamp(150px, 24vw, 300px); max-width: 1280px; }
.pt-hero canvas { position: absolute; inset: 0; width: 100%; height: 100%; touch-action: pan-y; -webkit-mask-image: radial-gradient(75% 95% at 50% 50%, #000 55%, transparent 100%); mask-image: radial-gradient(75% 95% at 50% 50%, #000 55%, transparent 100%); }
.pt-hero-hint { position: absolute; left: 50%; bottom: -4px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; font: 600 11px/1 var(--sans); letter-spacing: 0.14em; text-transform: uppercase; color: var(--mute); white-space: nowrap; pointer-events: none; }
.pt-hero-hint i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
@media (hover: none) { .pt-hero-hint { display: none; } }

@media (prefers-reduced-motion: reduce) {
  .brand:hover svg.word circle { animation: none; }
}

/* Свечения секций → спокойное поле точек */
.games-bg, .ph::before {
  background: none !important;
  background-image: radial-gradient(circle, rgba(140, 117, 255, 0.35) 1.3px, transparent 1.8px) !important;
  background-size: 18px 18px !important;
  -webkit-mask-image: radial-gradient(70% 80% at 80% 10%, #000, transparent 70%);
  mask-image: radial-gradient(70% 80% at 80% 10%, #000, transparent 70%);
}
.ph::before { background-image: radial-gradient(circle, rgba(91, 60, 255, 0.22) 1.3px, transparent 1.8px) !important; }

/* ---------- Логотип в шапке: знак + надпись Montserrat ---------- */
.lockup { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); }
.lockup .mark { width: 30px; height: auto; fill: var(--accent); overflow: visible; }
.lockup .mark circle { transform-box: fill-box; transform-origin: center; }
.lockup b { font: 700 23px/1 var(--sans); letter-spacing: -0.04em; }
.brand:hover .lockup .mark circle { animation: pt-pulse 0.62s var(--ease) var(--dl, 0s); }
.sfoot .lockup .mark { width: 36px; }
.sfoot .lockup b { font-size: 27px; }