/* =========================================================================
   v88.css — слой после v87.css (тот же приём :root:not(#v)).
   Один язык на весь сайт — как раскрытый вопрос FAQ: выбранное и наведённое заливается сплошным
   цветом текста (белым в тёмной теме, чёрным в светлой), текст инвертируется. Жидкое стекло — там же,
   где было (карточки товаров, тарифы, быстрая покупка, окна), но цельное: блик по всей поверхности
   ведёт курсор (liquid.js, GSAP), кант светится со стороны курсора, без задержки и без «рамки».
   Фиолетового меньше: только знак, точка-маркер, фокус с клавиатуры. Тёмная тема — чистый чёрный.
   ========================================================================= */

/* 1. Токены ------------------------------------------------------------------ */
:root:not(#v){
  --bg:#000;--band:#000;
  --tone:#ddd6fe;
  --line:rgba(221,214,254,.14);--line-soft:rgba(221,214,254,.09);--line-strong:rgba(221,214,254,.3);
  --flat:#000;--flat-line:rgba(221,214,254,.14);--flat-line-hi:rgba(221,214,254,.34);
  --ag-nav-line:rgba(221,214,254,.12);
  --ag-aura:none;
  --inv-bg:var(--text);--inv-fg:var(--bg);
  --rr-base:var(--text);
  --hl-c:var(--text);
  --cta-bg:#fff;--cta-fg:#000;--cta-wipe:#000;--cta-wipe-fg:#fff;
  /* стекло: почти прозрачная чёрная толща, блик белый */
  --lg-fill:rgba(0,0,0,.22);
  --lg-sheen:rgba(255,255,255,.022);
  --lg-spot:rgba(255,255,255,.12);
  --lg-rim-hi:rgba(255,255,255,.75);--lg-rim-lo:rgba(255,255,255,.07);
  --lg-edge:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(255,255,255,.04);
  --lg-drop:0 22px 44px -26px rgba(0,0,0,.9);
  --lg-blur:blur(10px) saturate(170%);
  --e88:cubic-bezier(.22,1,.36,1);
}
:root[data-theme="light"]:not(#v){
  --bg:#fff;--band:#fff;
  --tone:#2e1f66;
  --line:rgba(46,31,102,.13);--line-soft:rgba(46,31,102,.08);--line-strong:rgba(46,31,102,.3);
  --flat:#fff;--flat-line:rgba(46,31,102,.13);--flat-line-hi:rgba(46,31,102,.34);
  --ag-nav-line:rgba(46,31,102,.1);
  --cta-bg:#000;--cta-fg:#fff;--cta-wipe:#fff;--cta-wipe-fg:#000;
  --lg-fill:rgba(255,255,255,.5);
  --lg-sheen:rgba(255,255,255,.6);
  --lg-spot:rgba(255,255,255,.9);
  --lg-rim-hi:rgba(255,255,255,1);--lg-rim-lo:rgba(46,31,102,.1);
  --lg-edge:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(46,31,102,.06);
  --lg-drop:0 22px 44px -28px rgba(20,10,60,.3);
}
:root:not(#v) body,:root:not(#v) .sheet,:root:not(#v) main{background-color:var(--bg)}

/* 2. Жидкое стекло — цельное ----------------------------------------------- */
:root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.consent-bar,.toast){
  position:relative;
  background:
    radial-gradient(280px circle at var(--mx,50%) var(--my,-30%),var(--lg-spot),transparent 68%) no-repeat,
    linear-gradient(180deg,var(--lg-sheen),transparent 46%),
    var(--lg-fill);
  background-size:100% 100%;
  box-shadow:var(--lg-edge),var(--lg-drop);
  -webkit-backdrop-filter:var(--lg-blur);backdrop-filter:var(--lg-blur)}
/* кант: светлая дуга смотрит на курсор (--ga), в покое — сверху слева */
:root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.consent-bar,.toast)::before,
:root:not(#v).lq-glare :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.consent-bar,.toast)::before,
:root:not(#v) .gm.gm.gm::before,:root:not(#v).lq-glare .gm.gm.gm::before{
  content:"";display:block;position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1px;opacity:1;animation:none;
  background:conic-gradient(from var(--ga,300deg),var(--lg-rim-hi) 0deg,var(--lg-rim-lo) 70deg,var(--lg-rim-lo) 150deg,
    color-mix(in srgb,var(--lg-rim-hi) 45%,transparent) 180deg,var(--lg-rim-lo) 220deg,var(--lg-rim-lo) 300deg,var(--lg-rim-hi) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) :is(.tile--cat,.card[class*="card--"],.plan__card,.tcard):hover{
    background:
      radial-gradient(280px circle at var(--mx,50%) var(--my,-30%),var(--lg-spot),transparent 68%) no-repeat,
      linear-gradient(180deg,var(--lg-sheen),transparent 46%),
      var(--lg-fill)}
}
/* сенсорные экраны: без размытия фона (кадры при прокрутке), толща чуть плотнее */
@media (hover:none){
  :root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.consent-bar,.toast){
    -webkit-backdrop-filter:none;backdrop-filter:none;--lg-fill:rgba(0,0,0,.6)}
  :root[data-theme="light"]:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.consent-bar,.toast){--lg-fill:rgba(255,255,255,.86)}
}
@media (prefers-reduced-transparency:reduce){
  :root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.consent-bar,.toast){background:var(--bg)}
}

/* 3. Плитки меню — без серого: чёрные (белые) с кантом, наведение заливает цветом текста, как FAQ */
:root:not(#v) #mainNav .menu__inner{background-image:none}
:root:not(#v) #mainNav.menu{background-image:none;background-color:var(--bg)}
:root:not(#v) .menu__product{position:relative;overflow:hidden;isolation:isolate;background:var(--bg);
  box-shadow:inset 0 0 0 1px var(--line-strong);-webkit-backdrop-filter:none;backdrop-filter:none;color:var(--text)}
:root:not(#v) .menu__product::before,:root:not(#v).lq-glare .menu__product::before{display:none}
:root:not(#v) .menu__product::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--inv-bg);
  clip-path:inset(0 100% 0 0);transition:clip-path .5s var(--e88)}
:root:not(#v) .menu__product :is(b,.menu__from){position:relative;transition:color .3s var(--e88)}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) .menu__product:hover::after{clip-path:inset(0 0 0 0)}
  :root:not(#v) .menu__product:hover :is(b,.menu__from){color:var(--inv-fg)}
}
:root:not(#v) .menu__product.is-active{box-shadow:inset 0 0 0 1.5px var(--text)}

/* 4. Выбранное и наведённое — сплошная заливка (как раскрытый вопрос FAQ) ----- */
:root:not(#v) :is(.chip.is-on,.chip[aria-pressed="true"],.wl-chip.is-on,.sc__chip.is-on,.charts-tools button.is-active,
  .charts-tools__toggle.is-active,.crypto-pick.is-active,.pay-pill.is-active,.pay-pill[aria-pressed="true"]){
  background:var(--inv-bg);color:var(--inv-fg);box-shadow:none}
:root:not(#v) :is(.pseg__thumb,.seg-thumb){background:var(--inv-bg);box-shadow:none}
:root:not(#v) :is(.pseg__opt,.seg__btn){transition:color .3s var(--e88)}
:root:not(#v) :is(.pseg__opt.is-on,.pseg__opt[aria-checked="true"],.seg__btn.is-active,.seg__btn[aria-checked="true"]){color:var(--inv-fg)}
:root:not(#v) .deck__dot{background:var(--line-strong)}
:root:not(#v) .deck__dot.is-on{background:var(--text)}
:root:not(#v) .hdr-nav__link.is-active{background:var(--inv-bg);color:var(--inv-fg)}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) .btn:not(.btn--primary,.btn--solid,.btn--grad,.plan__buy,.pick-add,.consent-bar__yes,.is-added):not(:disabled):hover,
  :root:not(#v) .lq-btn:not(.btn--primary,.btn--solid,.plan__buy):not(:disabled):hover{background:var(--inv-bg);color:var(--inv-fg);box-shadow:none}
  :root:not(#v) :is(.hdr-btn,.account-btn,.cart-btn,.menu-btn,.theme-toggle,.hdr-nav__link):hover{background:color-mix(in srgb,var(--text) 12%,transparent)}
  /* главная кнопка: при наведении краска «уходит» — остаётся контур */
  :root:not(#v) :is(.btn--primary,.btn--solid,.btn--grad,.plan__buy,.pick-add,.consent-bar__yes):not(:disabled):not([aria-disabled="true"]):not(.is-added):hover{
    box-shadow:inset 0 0 0 1.5px var(--text)}
}
/* маркер в тексте — сплошная заливка, как метка FAQ */
:root:not(#v) mark.hl,:root:not(#v) .hl-mark{background:var(--inv-bg);color:var(--inv-fg)}

/* 5. Появление текста — без фиолетового/серого: обе шторки цвета текста ------ */
:root:not(#v) .rr-base,:root:not(#v) .rr-over{background:var(--text)}

/* 6. FAQ — снова сплошная заливка открытого вопроса (v85), без стеклянной панели v85.1 */
:root:not(#v) .stf-fill{left:calc(var(--gut) * -1);right:calc(var(--gut) * -1);top:-1px;bottom:0;border-radius:0;
  background:var(--text);box-shadow:none}
:root:not(#v) .stf-row--inv{display:grid;color:var(--bg)}
:root:not(#v) .faq.stf .faq__item[data-state="open"] p,:root:not(#v) .faq.stf .faq__item[data-state="open"] .stf-copy{color:var(--bg)}
:root:not(#v) .faq.stf .faq__item p,:root:not(#v) .stf-copy{transition:color .3s var(--e88)}
:root:not(#v) .stf-cell,:root:not(#v) .stf-cell::before{border-radius:0}
:root:not(#v) .stf-cell::before{background:var(--text)}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) .faq__item[data-state="closed"] summary:hover .stf-plus{color:var(--bg)}
}
:root:not(#v) .stf-mark{background:var(--text);color:var(--bg);border-radius:0}
:root:not(#v) .stf-row--inv .stf-mark{background:var(--bg);color:var(--text)}
:root:not(#v) .faq.stf .faq__item[data-state="open"] summary:focus-visible{box-shadow:inset 0 0 0 2px var(--bg)}
@media (max-width:859px){:root:not(#v) .stf-fill{left:-16px;right:-16px}}

/* 7. Туннель: сцена — абсолютный слой (v86 сделал её flex-элементом шириной 130 px: заголовок съезжал влево) */
:root:not(#v) .tunnel--live .tunnel__space{position:absolute;inset:0;z-index:1}
:root:not(#v) .tunnel--live .tunnel__head{z-index:2}
:root:not(#v) .tslot{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;will-change:transform,opacity;pointer-events:none}
:root:not(#v) .tunnel--live .tcard{position:absolute;left:0;top:0;opacity:1;visibility:visible;pointer-events:auto;
  transform:translate(-50%,-50%);will-change:transform}
:root:not(#v) .tcard__glyph{pointer-events:none}
/* телефон, Mini App, узкое окно: все карточки сразу — сетка 3 × 3 */
:root:not(#v) .tunnel.tunnel--rail .tunnel__space{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;
  overflow:visible;padding:0 16px;margin-top:28px;scroll-snap-type:none}
:root:not(#v) .tunnel--rail .tunnel__space::before{display:none}
:root:not(#v) .tunnel--rail .tcard{flex:none;width:auto!important;aspect-ratio:3/4;padding:10px;gap:3px}
:root:not(#v) .tunnel--rail .tcard__t{font-size:12.5px;line-height:1.2}
:root:not(#v) .tunnel--rail .tcard__p{font-size:13px}
:root:not(#v) .tunnel--rail .tcard__glyph{left:14%;right:14%;top:8%}
:root:not(#v) .tunnel.tunnel--rail .tunnel__space{max-width:100%}
@media (min-width:560px){:root:not(#v) .tunnel.tunnel--rail .tunnel__space{grid-template-columns:repeat(5,minmax(0,1fr));max-width:900px;margin-inline:auto}}

/* 8. Бегущие строки со скоростью прокрутки (velocity.js, порт ScrollVelocity) */
:root:not(#v) .velo{position:relative;overflow:hidden;padding:clamp(28px,4vw,56px) 0;border-block:1px solid var(--line);
  cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y}
:root:not(#v) .velo.is-drag{cursor:grabbing}
:root:not(#v) .velo__row{display:flex;width:max-content;white-space:nowrap;will-change:transform}
:root:not(#v) .velo__row + .velo__row{margin-top:clamp(4px,1vw,12px)}
:root:not(#v) .velo__t{display:block;padding-right:.35em;font:900 clamp(48px,8.2vw,104px)/1 var(--f-display2,var(--f-sans));
  letter-spacing:-.04em;text-transform:uppercase;color:var(--text)}
:root:not(#v) .velo__row--b .velo__t{color:transparent;-webkit-text-stroke:1.5px var(--text)}
html:not(#v) body[data-page="home"] #site-marquee{display:none}

/* 9. Shatter (shatter.js): заголовок разбивается на осколки вокруг курсора */
:root:not(#v) [data-shatter]{position:relative}
:root:not(#v) .shat{position:absolute;inset:0;z-index:2;perspective:1500px;pointer-events:none}
:root:not(#v) .shat__t{position:absolute;overflow:hidden;transform-style:preserve-3d;will-change:transform;backface-visibility:hidden}
:root:not(#v) .shat__t > *{position:absolute;margin:0!important;pointer-events:none}
/* без светлой подложки осколка: на чёрном она давала серые квадраты; объём — тень и наклон */
:root:not(#v) [data-shatter].is-shattered > :not(.shat){visibility:hidden}

/* 10. Ripple (ripple.js): волна по клику — фильтр смещения на самом блоке */
:root:not(#v) .rpl-svg{position:absolute;width:0;height:0;overflow:hidden}

/* 11. Выбор валюты — своя панель вместо системного списка */
:root:not(#v) .menu__pref--cur{position:relative;flex-wrap:wrap}
:root:not(#v) .menu__pref--cur .menu-cur{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
:root:not(#v) .curp__btn{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 12px 0 14px;border:0;border-radius:var(--r-m,10px);
  background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--line-strong);font:600 14px/1 var(--f-sans);cursor:pointer;
  transition:background .3s var(--e88),color .3s var(--e88)}
:root:not(#v) .curp__btn b{font:700 15px/1 var(--f-sans);min-width:1.1em;text-align:center}
:root:not(#v) .curp__btn svg{transition:transform .4s var(--e88)}
:root:not(#v) .curp__btn[aria-expanded="true"]{background:var(--inv-bg);color:var(--inv-fg)}
:root:not(#v) .curp__btn[aria-expanded="true"] svg{transform:rotate(180deg)}
@media (hover:hover) and (pointer:fine){:root:not(#v) .curp__btn:hover{background:var(--inv-bg);color:var(--inv-fg)}}
:root:not(#v) .curp__panel{flex:1 0 100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:12px;overflow:hidden}
:root:not(#v) .curp__panel[hidden]{display:none}
:root:not(#v) .curp__opt{position:relative;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;min-height:44px;
  padding:0 12px;border:0;border-radius:var(--r-s,6px);background:transparent;color:var(--text);text-align:left;cursor:pointer;
  box-shadow:inset 0 0 0 1px var(--line);isolation:isolate;overflow:hidden;transition:color .3s var(--e88)}
:root:not(#v) .curp__opt::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--inv-bg);clip-path:inset(0 100% 0 0);
  transition:clip-path .45s var(--e88)}
:root:not(#v) .curp__opt b{font:700 16px/1 var(--f-sans);text-align:center}
:root:not(#v) .curp__opt span{font:500 13px/1.2 var(--f-sans)}
:root:not(#v) .curp__opt i{font:600 12px/1 var(--f-code,monospace);font-style:normal;letter-spacing:.04em}
:root:not(#v) .curp__opt[aria-selected="true"],:root:not(#v) .curp__opt:focus-visible{color:var(--inv-fg);outline:none}
:root:not(#v) .curp__opt[aria-selected="true"]::after,:root:not(#v) .curp__opt:focus-visible::after{clip-path:inset(0 0 0 0)}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) .curp__opt:hover{color:var(--inv-fg)}
  :root:not(#v) .curp__opt:hover::after{clip-path:inset(0 0 0 0)}
}
:root:not(#v) .curp__note{flex:1 0 100%;margin:8px 0 0;font:500 12px/1.4 var(--f-sans);color:var(--text)}

/* 12. Стеклянный знак: подсказка про лёд, фиолетовая точка-маркер остаётся единственным акцентом блока */
:root:not(#v) .gobj__stage{cursor:crosshair;box-shadow:inset 0 0 0 1px var(--line)}
:root:not(#v) .gobj__hint{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}

/* 13. Остатки фиолетового: подсветка выбранного в «Почему eroot», полосы, рамки */
:root:not(#v) .section--why{--sel-fill:var(--text)}
:root:not(#v) .tile--cat .tile__visual::before,:root:not(#v) .tile--cat .tile__visual::after{display:none}
@media (prefers-reduced-motion:reduce){
  :root:not(#v) :is(.menu__product::after,.curp__opt::after){transition:none}
}
:root:not(#v) .tunnel:not(.tunnel--live) .tslot{display:contents}
:root:not(#v) .tunnel--rail .tcard{opacity:var(--o,1)!important}
:root:not(#v) .shat :is(.rr-base,.rr-over){display:none}
:root:not(#v) .shat .rr-txt{opacity:1;animation:none}
/* переключатели языка и темы в меню — выбранное залито цветом текста */
:root:not(#v) :is(.menu-lang,.menu-theme){box-shadow:inset 0 0 0 1px var(--line-strong);background:transparent}
:root:not(#v) :is(.menu-lang,.menu-theme) button{transition:background .35s var(--e88),color .35s var(--e88)}
:root:not(#v) :is(.menu-lang,.menu-theme) button:is(.is-active,[aria-pressed="true"]){background:var(--inv-bg);color:var(--inv-fg)}
/* бегунок переключателя — выше по специфичности, чем :is(...) v87 и светлая тема v84 */
:root:not(#v) .pseg .pseg__thumb.pseg__thumb,:root[data-theme="light"]:not(#v) .pseg .pseg__thumb.pseg__thumb,
:root:not(#v) .seg .seg-thumb.seg-thumb,:root[data-theme="light"]:not(#v) .seg .seg-thumb.seg-thumb{background:var(--inv-bg);box-shadow:none}