/* =========================================================================
   v86.css — слой после v85.css (тот же приём :root:not(#v)).
   Стекло Apple — только там, где под ним живой контент: карточки товаров, шапка, меню
   (+ точечно: нижняя панель вкладок, окно согласия, уведомления). Остальной сайт — плоский
   чёрно-белый (Awwwards), лёгкий фиолетовый — только как атмосфера под стеклом и акцент фокуса.
   Текст сплошной: чёрный в светлой теме, белый в тёмной (без серых «второстепенных» оттенков).
   Скругления маленькие: 4 / 6 / 10 / 14.
   Значения стекла сняты с apple.com (2026-10-23): шапка rgba(0,0,0,.6) + blur(20px) saturate(180%),
   плашки rgba(42,42,45,.73) + размытие, светлый кант по ребру, под стеклом всегда цветное содержимое.
   ========================================================================= */

/* 1. Токены ---------------------------------------------------------------- */
:root:not(#v){
  --text-dim:var(--text);--text-mute:var(--text);
  --r-xs:4px;--r-s:6px;--r-m:10px;--r-l:14px;--r-btn:10px;
  --r-tile:10px;--r-panel:10px;--r-ctrl:8px;--radius:10px;--radius-lg:14px;--radius-xl:14px;
  --header-h:60px;
  /* плоские поверхности */
  --flat:#0c0c0e;--flat-line:rgba(255,255,255,.12);--flat-line-hi:rgba(255,255,255,.28);
  /* стекло Apple (тёмная тема) */
  --ag-fill:rgba(36,36,40,.52);
  --ag-sheen:linear-gradient(180deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,0) 46%);
  --ag-filter:blur(24px) saturate(180%);
  --ag-rim:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.1) 28%,rgba(255,255,255,.05) 60%,rgba(255,255,255,.34) 100%);
  /* кромки как у Liquid Glass: блик сверху, преломлённый свет у нижнего ребра, мягкое свечение внутрь */
  --ag-shadow:inset 0 1.5px 1px -.5px rgba(255,255,255,.42),inset 0 12px 22px -18px rgba(255,255,255,.14),
             inset 0 -12px 22px -14px rgba(255,255,255,.2),inset 0 -1px 1px rgba(255,255,255,.16),0 18px 40px -18px rgba(0,0,0,.75);
  --ag-nav:rgba(0,0,0,.6);--ag-nav-line:rgba(255,255,255,.12);
  /* атмосфера под стеклом: приглушённый фиолетовый + холодный синий */
  --ag-aura:radial-gradient(38% 52% at 16% 28%,rgba(124,77,255,.34),transparent 64%),
            radial-gradient(34% 48% at 84% 72%,rgba(70,110,255,.22),transparent 64%),
            radial-gradient(24% 34% at 56% 12%,rgba(247,119,183,.14),transparent 64%);
  /* старая призменная кайма и подвижный блик — выключены: материал стекла теперь один */
  --lq-iris:none;--lq-stops:transparent 0deg,transparent 360deg;
}
:root[data-theme="light"]:not(#v){
  --text:#000;--text-dim:#000;--text-mute:#000;
  --flat:#fff;--flat-line:rgba(0,0,0,.12);--flat-line-hi:rgba(0,0,0,.3);
  --line:rgba(0,0,0,.12);--line-strong:rgba(0,0,0,.28);
  --ag-fill:rgba(255,255,255,.56);
  --ag-sheen:linear-gradient(180deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 50%);
  --ag-rim:linear-gradient(180deg,rgba(255,255,255,1) 0%,rgba(255,255,255,.5) 35%,rgba(0,0,0,.06) 70%,rgba(0,0,0,.12) 100%);
  --ag-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 18px 40px -20px rgba(0,0,0,.28);
  --ag-nav:rgba(255,255,255,.72);--ag-nav-line:rgba(0,0,0,.1);
  --ag-aura:radial-gradient(38% 52% at 16% 28%,rgba(124,77,255,.22),transparent 64%),
            radial-gradient(34% 48% at 84% 72%,rgba(70,110,255,.14),transparent 64%),
            radial-gradient(24% 34% at 56% 12%,rgba(247,119,183,.12),transparent 64%);
}
:root:not(#v) body,:root:not(#v) .sheet{background-image:none}
@media (max-width:760px){:root:not(#v){--header-h:56px}}

/* 2. Плоский чёрно-белый остальной сайт ------------------------------------ */
:root:not(#v) :is(.card:not([class*="card--"]),.tile:not(.tile--cat),.chart,.notice,.summary,.custom-amount,.form-block,.showcase-banner,
  .faq-cta,.trust__item,.cart-item,.empty,.pay-card,.donut,.xmini,.rv-card,.rv-sum,.rv-form,.acc-card,.acc-stat,.wl-panel,.wl-sec,
  .wl-empty,.wl-bonus,.sc,.doc-card,.legal__card,.sup-way,.paywin,.paywin__block,.star-ladder,.psplus-perks,.botcard,.cs__screen,
  .why-grid .card,.subp,.acc-act,.apivol,.guar,.msr__item){
  background:var(--flat);background-image:none;box-shadow:inset 0 0 0 1px var(--flat-line);
  -webkit-backdrop-filter:none;backdrop-filter:none;border-color:transparent}
:root:not(#v) :is(.card:not([class*="card--"]),.tile:not(.tile--cat),.chart,.notice,.summary,.custom-amount,.form-block,.showcase-banner,
  .faq-cta,.trust__item,.cart-item,.empty,.pay-card,.why-grid .card,.seg,.pick-seg)::before{display:none}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) :is(.trust__item,.doc-card,.sup-way,.subp,.acc-act,.why-grid .card):hover{box-shadow:inset 0 0 0 1px var(--flat-line-hi)}
}
/* переключатели и поля — плоские, с тонким кантом */
:root:not(#v) :is(.seg,.pseg,.pick-seg,.pay-pill,.crypto-pick,.chip,.wl-chip,.sc__chip,.gift-style){
  -webkit-backdrop-filter:none;backdrop-filter:none;border-radius:var(--r-ctrl)}
:root:not(#v) :is(.seg__btn,.pseg__opt,.pseg__thumb,.seg-thumb){border-radius:calc(var(--r-ctrl) - 2px)}
:root:not(#v) :is(.input,.select,.wl-field,.xmini__field,.msearch input,.crypto-search input,.stf-field input){border-radius:var(--r-s)}

/* кнопки: главное действие — сплошная заливка, остальное — плоский контур; скругление 10 */
:root:not(#v) .btn,:root:not(#v) .lq-btn,:root:not(#v) .wl-btn,:root:not(#v) .sc__send{border-radius:var(--r-btn)}
:root:not(#v) .btn:not(.btn--primary,.btn--solid,.btn--grad,.plan__buy,.pick-add,.consent-bar__yes,.is-added),
:root:not(#v) .lq-btn:not(.btn--primary,.btn--solid,.plan__buy){
  background:transparent;box-shadow:inset 0 0 0 1px var(--flat-line-hi);-webkit-backdrop-filter:none;backdrop-filter:none}
@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:color-mix(in srgb,var(--tone,var(--text)) 8%,transparent)}
}
@media (hover:none){
  :root:not(#v) main .btn:not(.btn--primary,.btn--solid,.btn--grad,.plan__buy,.pick-add,.consent-bar__yes,.is-added),
  :root:not(#v) main .lq-btn:not(.btn--primary,.btn--solid,.plan__buy),
  :root[data-theme="light"]:not(#v) main .btn:not(.btn--primary,.btn--solid,.btn--grad,.plan__buy,.pick-add,.consent-bar__yes,.is-added),
  :root[data-theme="light"]:not(#v) main .lq-btn:not(.btn--primary,.btn--solid,.plan__buy){background:transparent}
}
:root:not(#v) :is(.btn--primary,.btn--solid,.btn--grad,.plan__buy,.pick-add,.consent-bar__yes,.card__foot .btn,.custom-amount__foot .btn):not(:disabled):not([aria-disabled="true"]):not(.is-added){
  box-shadow:none}
/* фиолетовый — только акцент: фокус с клавиатуры */
:root:not(#v) :focus-visible{outline-color:var(--logo-violet,#8b5cf6)}

/* 3. Стекло Apple ----------------------------------------------------------- */
/* 3а. Шапка — во всю ширину, как globalnav apple.com: стекло всегда, тонкая линия снизу */
:root:not(#v) #site-header{background:var(--ag-nav);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  box-shadow:inset 0 -1px 0 var(--ag-nav-line)}
:root:not(#v) .header{padding:0 var(--gutter)}
:root:not(#v) .header__bar,:root:not(#v) .header.is-scrolled .header__bar{height:100%;max-width:var(--maxw);padding:0;border:0;border-radius:0;
  background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
:root:not(#v) .header__bar::before,:root:not(#v) .header__bar::after{display:none}
:root:not(#v) :is(.hdr-btn,.account-btn,.cart-btn,.menu-btn,.theme-toggle,.hdr-nav__link){border-radius:var(--r-m);background:transparent;
  box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:transparent}
:root:not(#v) :is(.hdr-btn,.account-btn,.cart-btn,.menu-btn,.theme-toggle,.hdr-nav__link)::before{display:none}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) :is(.hdr-btn,.account-btn,.cart-btn,.menu-btn,.theme-toggle,.hdr-nav__link):hover{background:color-mix(in srgb,var(--tone,var(--text)) 10%,transparent)}
}
:root:not(#v) .hdr-nav__link.is-active{background:color-mix(in srgb,var(--tone,var(--text)) 12%,transparent);color:var(--text)}
:root:not(#v) .account-btn{box-shadow:inset 0 0 0 1px var(--ag-nav-line)}

/* 3б. Карточки товаров: стекло поверх приглушённой «атмосферы» */
:root:not(#v) :is(.grid--catalog,.quickband,.tunnel__space,.plans,.pricing__cards){position:relative;isolation:isolate}
:root:not(#v) .grid:has(> .card[class*="card--"]){position:relative;isolation:isolate}
:root:not(#v) :is(.grid--catalog,.quickband,.tunnel--rail .tunnel__space)::before,
:root:not(#v) .grid:has(> .card[class*="card--"])::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--ag-aura)}
:root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard){
  position:relative;border:0;border-radius:var(--r-l);color:var(--text);
  background:var(--ag-sheen),var(--ag-fill);box-shadow:var(--ag-shadow);
  -webkit-backdrop-filter:var(--ag-filter);backdrop-filter:var(--ag-filter)}
/* светлый кант по ребру (Liquid Glass): кольцо 1px с градиентом сверху вниз */
:root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard)::before{
  content:"";display:block;position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1px;
  background:var(--ag-rim);opacity:1;animation:none;
  -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}
:root:not(#v) .tile--cat .tile__glow{display:none}
@media (hover:hover) and (pointer:fine){
  :root:not(#v) :is(.tile--cat,.card[class*="card--"],.plan__card,.tcard):hover{
    background:var(--ag-sheen),color-mix(in srgb,var(--ag-fill) 100%,rgba(255,255,255,.04))}
}
/* сенсорные экраны: размытие слабее (дешевле), материал тот же */
/* сенсорные экраны: под карточками и так мягкий градиент — размытие не меняет вид, но стоит кадров при прокрутке.
   Там стекло — та же полупрозрачная заливка, кант и блик, без backdrop-filter (шапка размытие сохраняет) */
@media (hover:none){
  :root:not(#v) :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.menu__product,.consent-bar,.toast){
    -webkit-backdrop-filter:none;backdrop-filter:none}
}
/* выделенный тариф — кант плотнее, без цветной обводки */
:root:not(#v) .plan--best .plan__card{box-shadow:var(--ag-shadow),inset 0 0 0 1px color-mix(in srgb,var(--tone,var(--text)) 40%,transparent)}

/* 3в. Меню: тёмная основа с «атмосферой», пункты-плитки — стекло; курсор-линза (lens.js) остаётся */
:root:not(#v) #mainNav.menu{background-color:var(--bg);background-image:var(--ag-aura)}
:root:not(#v) .menu__product{border-radius:var(--r-l);background:var(--ag-sheen),var(--ag-fill);box-shadow:var(--ag-shadow);
  -webkit-backdrop-filter:var(--ag-filter);backdrop-filter:var(--ag-filter)}
:root:not(#v) .menu__product::before{background:var(--ag-rim)}
:root:not(#v) .lgc{border-radius:var(--r-l)}

/* 3г. Точечно: панель вкладок, окно согласия, уведомления — то же стекло */
:root:not(#v) :is(.tabbar,.consent-bar,.toast){background:var(--ag-sheen),var(--ag-fill);box-shadow:var(--ag-shadow);border-radius:var(--r-l);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
@media (prefers-reduced-transparency:reduce){
  :root:not(#v) :is(#site-header,.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.menu__product,.tabbar,.consent-bar,.toast){
    -webkit-backdrop-filter:none;backdrop-filter:none;background:var(--flat)}
}

/* 4. Скругления остальных элементов — маленькие --------------------------- */
:root:not(#v) :is(.modal,.paywin,.gc,.cs__card,.botcard){border-radius:var(--r-l)}
:root:not(#v) .stf-fill{border-radius:var(--r-m)}
:root:not(#v) .faq.stf .faq__item summary:focus-visible{border-radius:var(--r-m)}
:root:not(#v) :is(.stf-cell,.stf-cell::before){border-radius:var(--r-m)}
:root:not(#v) :is(.card__icon,.sup-way__ic,.doc-card__ic,.msr__ic,.consent-bar__ic,.guar__ic,.wl-hist__ic,.subp__mark){border-radius:var(--r-s)}
:root:not(#v) .wl-card{border-radius:var(--r-l)}
/* кнопки раскрытия и стрелки внутри карточек — то же малое скругление */
:root:not(#v) :is(.tile__go,.tile__arrow,.tile__more,.cat-more,.deck__btn){border-radius:var(--r-m)}
/* плашки внутри стеклянной плитки — полупрозрачные, а не плоские тёмные блоки поверх стекла */
:root:not(#v) .tile--cat .subp{background:color-mix(in srgb,var(--tone,var(--text)) 6%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone,var(--text)) 10%,transparent)}
/* атмосфера меню — на внутреннем слое (он закрывал фон панели) */
:root:not(#v) #mainNav .menu__inner{background-color:transparent;background-image:var(--ag-aura);background-attachment:local}
/* подвижный блик glare.js (класс html.lq-glare) перебивал кант: у стекла v86 кант один — светлый сверху вниз */
:root:not(#v).lq-glare :is(.tile--cat,.card[class*="card--"],.quick,.plan__card,.tcard,.menu__product)::before{background:var(--ag-rim);opacity:1}
:root:not(#v).lq-glare :is(.card:not([class*="card--"]),.tile:not(.tile--cat),.chart,.notice,.summary,.custom-amount,.form-block,.showcase-banner,
  .faq-cta,.trust__item,.cart-item,.empty,.pay-card,.seg,.pick-seg,.btn,.pseg,.hdr-nav__link)::before{display:none}