/* ==========================================================================
   ARTΞMIDA UI V203 — третий слой: главная (глобус, стойка), стекло, анимации,
   вкладка, меню, выделение. Подключается после ui-v202.css.
   ========================================================================== */

/* ---------- Глобус ---------- */
html:not(#ui) body .ui-globe-label{position:absolute;left:0;top:0;z-index:3;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 10px;border-radius:16px!important;
  pointer-events:none;white-space:nowrap;transition:opacity .25s ease;will-change:transform}
html:not(#ui) body .ui-globe-label[hidden]{display:none!important}
html:not(#ui) body .ui-globe-label.show{animation:ui-label-in .45s var(--ui-spring) backwards}
@keyframes ui-label-in{from{opacity:0;filter:blur(4px)}to{opacity:1;filter:none}}
html:not(#ui) body .ui-globe-label img{width:22px;height:16px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px rgb(255 255 255/.14)}
html:not(#ui) body .ui-globe-label b{display:block;font-size:14px;font-weight:800;color:var(--ui-text);line-height:1.15}
html:not(#ui) body .ui-globe-label small{display:block;font-size:11.5px;font-weight:600;color:var(--ui-text-3)}
html:not(#ui) body .ui-globe-wrap.is-pointing .ui-globe{cursor:pointer}
html:not(#ui) body .ui-flag{cursor:pointer;font-family:inherit;border:1px solid var(--ui-stroke)!important;background:var(--ui-fill-2)!important;box-shadow:none!important;color:var(--ui-text)!important;
  transition:opacity .5s var(--ui-ease),transform .5s var(--ui-ease),background-color .2s ease,border-color .2s ease,color .2s ease!important}
html:not(#ui) body .ui-flag:hover{background:var(--ui-fill-hover)!important}
html:not(#ui) body .ui-flag.is-focus{border-color:rgb(var(--ui-accent)/.6)!important;background:rgb(var(--ui-accent)/.14)!important;box-shadow:0 0 0 3px rgb(var(--ui-accent)/.12)!important}

/* ---------- Стойка серверов: ровная, без перекоса ---------- */
html:not(#ui) body .ui-rack-sec{--p:0}
html:not(#ui) body .ui-rack-stage{perspective:none!important;padding:10px 0 26px;position:relative}
html:not(#ui) body .ui-rack{transform:none!important;display:block!important;padding:14px!important;border-radius:28px!important}
html:not(#ui) body .ui-rack-head{display:flex;align-items:center;gap:12px;padding:4px 6px 14px;border-bottom:1px solid var(--ui-stroke);margin-bottom:12px}
html:not(#ui) body .ui-rack-head b{font-size:14px;font-weight:800;letter-spacing:.02em;color:var(--ui-text)}
html:not(#ui) body .ui-rack-dots{display:flex;gap:6px}
html:not(#ui) body .ui-rack-dots i{width:10px;height:10px;border-radius:50%;background:var(--ui-fill-3)}
html:not(#ui) body .ui-rack-dots i:nth-child(1){background:#ff6b6b}html:not(#ui) body .ui-rack-dots i:nth-child(2){background:#ffcc4d}html:not(#ui) body .ui-rack-dots i:nth-child(3){background:#4ade80}
html:not(#ui) body .ui-rack-status{margin-left:auto;display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#4ade80}
html:not(#ui) body .ui-rack-status i{width:8px;height:8px;border-radius:50%;background:#4ade80;animation:ui-live 2s ease-out infinite}
html:not(#ui) body .ui-rack-status.is-off{color:#ffcc4d}html:not(#ui) body .ui-rack-status.is-off i{background:#ffcc4d;animation:none}
html:not(#ui) body .ui-rack-list{display:flex;flex-direction:column;gap:8px}
html:not(#ui) body .ui-srv{--pe:clamp(0,calc(var(--p) * 1.8 - var(--i) * .13),1);--dir:1;
  display:grid;grid-template-columns:10px 22px minmax(70px,1fr) auto 64px 56px;align-items:center;gap:12px;height:52px;padding:0 14px;border-radius:16px;
  background:var(--ui-fill-2);border:1px solid var(--ui-stroke);
  opacity:var(--pe);transform:translate3d(calc((1 - var(--pe)) * 48px),0,0);filter:blur(calc((1 - var(--pe)) * 6px))}
html:not(#ui) body .ui-srv:nth-child(even){transform:translate3d(calc((1 - var(--pe)) * -48px),0,0)}
html:not(#ui) body .ui-srv-led{width:8px;height:8px;border-radius:50%;background:var(--ui-fill-3);transition:background-color .4s ease,box-shadow .4s ease}
html:not(#ui) body .ui-srv-flag{width:22px;height:16px;border-radius:4px;object-fit:cover;box-shadow:0 0 0 1px rgb(255 255 255/.12)}
html:not(#ui) body .ui-srv-name{font-size:14px;font-weight:700;color:var(--ui-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Полоски сигнала: заполняются зелёным одна за другой, потом по ним бежит «пинг» */
html:not(#ui) body .ui-srv-signal{display:flex;align-items:center;gap:3px;height:22px}
html:not(#ui) body .ui-srv-signal i{width:4px;height:calc(8px + var(--s) * .9px);max-height:20px;border-radius:2px;background:var(--ui-fill-3);transition:background-color .35s ease,box-shadow .35s ease}
html:not(#ui) body .ui-srv-load{height:6px;border-radius:99px;background:var(--ui-fill-3);overflow:hidden}
html:not(#ui) body .ui-srv-load i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,rgb(var(--ui-accent)),rgb(var(--ui-accent-2)));transition:width 1.2s var(--ui-ease)}
html:not(#ui) body .ui-srv-state{justify-self:end;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ui-text-3);transition:color .4s ease}
html:not(#ui) body .ui-rack-sec.assembled .ui-srv-led{background:#4ade80;box-shadow:0 0 0 3px rgb(74 222 128/.18),0 0 10px rgb(74 222 128/.7);transition-delay:calc(var(--i) * 120ms + .2s)}
html:not(#ui) body .ui-rack-sec.assembled .ui-srv-state{color:#4ade80;transition-delay:calc(var(--i) * 120ms + .9s)}
html:not(#ui) body .ui-rack-sec.assembled .ui-srv-signal i{background:#4ade80;box-shadow:0 0 6px rgb(74 222 128/.45);transition-delay:calc(var(--i) * 120ms + var(--s) * 45ms + .25s);
  animation:ui-ping 2.4s ease-in-out infinite;animation-delay:calc(var(--i) * 120ms + var(--s) * 70ms + 1.6s)}
@keyframes ui-ping{0%,70%,100%{background:#4ade80;opacity:.85}82%{background:#bbf7d0;opacity:1;box-shadow:0 0 10px rgb(187 247 208/.9)}}
html:not(#ui) body .ui-rack-sec.assembled .ui-srv-load i{width:var(--w);transition-delay:calc(var(--i) * 120ms + .5s);animation:ui-load 4s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.7s + 2s)}
@keyframes ui-load{from{width:calc(var(--w) * .7)}to{width:var(--w)}}
html:not(#ui) body .ui-srv.is-off .ui-srv-led{background:#ffcc4d!important;box-shadow:none!important}
html:not(#ui) body .ui-srv.is-off .ui-srv-state{color:#ffcc4d!important}
html:not(#ui) body .ui-srv.is-off .ui-srv-signal i{background:var(--ui-fill-3)!important;animation:none!important;box-shadow:none!important}
html[data-theme="pearl"]:not(#ui) body .ui-rack-sec.assembled .ui-srv-signal i{background:#22c55e}
html:not(#ui) body .ui-rack-floor{opacity:calc(var(--p) * .8)}
html:not(#ui) body .ui-unit{display:none!important}
@media (max-width:600px){
  html:not(#ui) body .ui-srv{grid-template-columns:8px 20px minmax(0,1fr) auto 44px;gap:9px;padding:0 11px;height:48px}
  html:not(#ui) body .ui-srv-load{display:none}
  html:not(#ui) body .ui-srv-signal{gap:2px}html:not(#ui) body .ui-srv-signal i{width:3px}
  html:not(#ui) body .ui-srv-signal i:nth-child(n+11){display:none}
}
@media (prefers-reduced-motion:reduce){html:not(#ui) body .ui-srv{opacity:1!important;transform:none!important;filter:none!important}}

/* Текст фич больше не обрезается справа */
html:not(#ui) body .ui-hsec-copy,html:not(#ui) body .ui-feature-list li > div{min-width:0}
html:not(#ui) body .ui-feature-list span{display:block;white-space:normal!important;overflow-wrap:anywhere}

/* ==========================================================================
   Жидкое стекло — заметно везде
   ========================================================================== */
:root{
  --lg-fill:linear-gradient(135deg,rgb(255 255 255/.15) 0%,rgb(255 255 255/.06) 30%,rgb(255 255 255/.025) 60%,rgb(255 255 255/.09) 100%);
  --lg-tint:rgb(20 16 24/.24);
  --lg-blur:blur(14px) saturate(210%) brightness(1.08);
  --lg-blur-strong:blur(18px) saturate(220%) brightness(1.1);
  --lg-shadow:inset 0 1px 1px rgb(255 255 255/.30),inset 0 -1px 1px rgb(255 255 255/.06),inset 0 0 30px rgb(255 255 255/.04),0 24px 60px -24px rgb(0 0 0/.75),0 2px 6px rgb(0 0 0/.18);
}
html[data-theme="pearl"]{--lg-tint:rgb(255 255 255/.22)}
/* Пятно света за курсором поверх стекла */
html:not(#ui) body :is(.glass-panel,.glass-card,.ui-glass):not(.theme-popover):not(.landing-auth-panel):not(.modal){
  background:radial-gradient(420px circle at var(--gx,-500px) var(--gy,-500px),rgb(var(--ui-accent)/.12),transparent 42%),var(--lg-fill),var(--lg-tint)!important}
/* Световая кромка: яркая сверху-слева и снизу-справа, как у iOS */
html:not(#ui) body :where(.ui-glass:not(.ui-globe-label):not(.ui-globe-badge)){position:relative}
html:not(#ui) body :is(.glass-card,.glass-panel,.ui-glass)::after{
  content:""!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;margin:0!important;border:0!important;border-radius:inherit!important;padding:1px!important;pointer-events:none!important;z-index:3!important;display:block!important;box-shadow:none!important;
  background:linear-gradient(140deg,rgb(255 255 255/.55),rgb(255 255 255/.10) 22%,rgb(255 255 255/0) 45%,rgb(255 255 255/0) 62%,rgb(255 255 255/.10) 80%,rgb(255 255 255/.35))!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0)!important;-webkit-mask-composite:xor!important;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)!important;
  opacity:.75;transition:opacity .3s ease!important;transform:none!important;filter:none!important;animation:none!important}
html:not(#ui) body :is(.glass-card,.glass-panel,.ui-glass).ui-lit::after{opacity:1}
html[data-theme="pearl"]:not(#ui) body :is(.glass-card,.glass-panel,.ui-glass)::after{background:linear-gradient(140deg,#fff,rgb(255 255 255/.4) 30%,rgb(184 58 108/.10) 60%,rgb(255 255 255/.9))!important}
html:not(#ui) body :is(.glass-card,.glass-panel) :is(.glass-card,.glass-panel)::after{opacity:.35}
html:not(#ui) body .glass-mini::after{display:none}
/* Внутри стекла — содержимое выше блика */
html:not(#ui) body :is(.faq-item,.period-card,.key-card,.os-picker button,.install-key-option):not(.glass-card){
  background:radial-gradient(320px circle at var(--gx,-500px) var(--gy,-500px),rgb(var(--ui-accent)/.10),transparent 45%),var(--lg-nested)!important}
/* Цвет позади стекла: три мягких пятна темы */
html:not(#ui) body .background-glow{opacity:.24!important;filter:blur(80px)!important}
html:not(#ui) body .background-glow.glow-b{opacity:.2!important}
html:not(#ui) body::before{content:""!important;position:fixed!important;inset:auto!important;left:38%!important;top:38%!important;width:42vw!important;height:42vw!important;border-radius:50%!important;
  background:radial-gradient(circle,rgb(var(--ui-accent-2)/.16),transparent 65%)!important;filter:blur(40px)!important;opacity:1!important;z-index:-2!important;pointer-events:none!important;
  animation:ui-drift-b 52s ease-in-out infinite alternate-reverse!important;-webkit-mask:none!important;mask:none!important}
html[data-theme="pearl"]:not(#ui) body::before{background:radial-gradient(circle,rgb(226 85 139/.10),transparent 65%)!important}

/* ==========================================================================
   Анимации на всех страницах
   ========================================================================== */
@keyframes ui-title-in{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translate3d(0,.35em,0)}to{opacity:1;clip-path:inset(-20% -10% -30% -10%);transform:none}}
@keyframes ui-rise-in{from{opacity:0;transform:translate3d(0,22px,0) scale(.985);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
html:not(#ui) body main :is(h1){animation:ui-title-in .95s var(--ui-ease) .08s backwards}
html:not(#ui) body main :is(.page-hero,.review-page-hero,.faq-hero,.legal-hero,.all-reviews-hero,.hero-card,.own-vpn-hero-copy) :is(p,.eyebrow,.overline,.faq-kicker,.ov-badge){animation:ui-rise-in .8s var(--ui-ease) .22s backwards}
html:not(#ui) body main :is(.page-hero-actions,.hero-actions,.own-vpn-hero-actions,.faq-search-main,.popular-queries){animation:ui-rise-in .8s var(--ui-ease) .34s backwards}
/* Блоки страницы появляются каскадом */
html:not(#ui) body :is(main.page-wrap,main.review-page-main,main.all-reviews-main,main.own-vpn-main,.legal-shell > main,main.faq-public-main) > :not(script):not([hidden]){animation:ui-rise-in .75s var(--ui-ease) backwards!important}
html:not(#ui) body :is(main.page-wrap,main.review-page-main,main.all-reviews-main,main.own-vpn-main,.legal-shell > main,main.faq-public-main) > :nth-child(2){animation-delay:.08s!important}
html:not(#ui) body :is(main.page-wrap,main.review-page-main,main.all-reviews-main,main.own-vpn-main,.legal-shell > main,main.faq-public-main) > :nth-child(3){animation-delay:.16s!important}
html:not(#ui) body :is(main.page-wrap,main.review-page-main,main.all-reviews-main,main.own-vpn-main,.legal-shell > main,main.faq-public-main) > :nth-child(n+4){animation-delay:.24s!important}
/* Карточки в сетках — по одной */
html:not(#ui) body :is(.keys-grid,.period-grid,.purchase-list,.os-picker,.install-key-list,.device-preset-row) > *{animation:ui-rise-in .6s var(--ui-ease) backwards;animation-delay:calc(.25s + var(--n,0) * 60ms)}
html:not(#ui) body .faq-list > .faq-item{animation:ui-rise-in .55s var(--ui-ease) backwards;animation-delay:calc(.2s + var(--n,0) * 45ms)}
/* Появление при прокрутке — с размытием */
html:not(#ui) body .ui-scroll-hidden{opacity:0!important;transform:translate3d(0,26px,0) scale(.985)!important;filter:blur(8px)}
html:not(#ui) body .ui-scroll-in{opacity:1!important;transform:none!important;filter:none;transition:opacity .8s var(--ui-ease),transform .9s var(--ui-ease),filter .8s var(--ui-ease)!important}
/* Цена — мягкий «щелчок» при изменении */
@keyframes ui-bump{0%{opacity:.35;transform:translate3d(0,6px,0);filter:blur(3px)}100%{opacity:1;transform:none;filter:none}}
html:not(#ui) body .ui-bump{animation:ui-bump .38s var(--ui-ease) backwards;display:inline-block}
/* Подсветка активного тарифа и выбранного срока «дышит» */
@keyframes ui-glow{0%,100%{box-shadow:0 0 0 3px rgb(var(--ui-accent)/.12),0 10px 30px -12px rgb(var(--ui-accent-2)/.35)}50%{box-shadow:0 0 0 4px rgb(var(--ui-accent)/.2),0 14px 36px -12px rgb(var(--ui-accent-2)/.55)}}
html:not(#ui) body :is(.period-card.active,.ui-price.is-best,.install-key-option.active){animation:ui-glow 3.2s ease-in-out infinite}
/* Иконки разделов: мягкий градиентный «блик», без движения */
html:not(#ui) body :is(.empty-icon,.support-icon,.network-custom-icon,.purchase-auto-icon){background:linear-gradient(140deg,rgb(var(--ui-accent)/.22),rgb(var(--ui-accent)/.06))!important}
@media (prefers-reduced-motion:reduce){
  html:not(#ui) body *{animation:none!important}
  html:not(#ui) body .ui-scroll-hidden{opacity:1!important;transform:none!important;filter:none!important}
}

/* ==========================================================================
   Кнопка меню — квадрат со скруглением, как кнопки в шапке
   ========================================================================== */
html:not(#ui) body .legal-hub.ui-fab > summary{width:54px!important;height:54px!important;border-radius:18px!important}
html:not(#ui) body .legal-hub.ui-fab > summary .ui-fab-ico{position:absolute;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:opacity .25s ease,transform .4s var(--ui-spring)}
html:not(#ui) body .legal-hub.ui-fab > summary .ui-fab-x{opacity:0;transform:rotate(-90deg) scale(.6)}
html:not(#ui) body .legal-hub.ui-fab[open] > summary .ui-fab-grid{opacity:0;transform:rotate(90deg) scale(.6)}
html:not(#ui) body .legal-hub.ui-fab[open] > summary .ui-fab-x{opacity:1;transform:none}
html:not(#ui) body .legal-hub.ui-fab > summary:hover .ui-fab-grid rect:nth-child(1),html:not(#ui) body .legal-hub.ui-fab > summary:hover .ui-fab-grid rect:nth-child(4){fill:currentColor;fill-opacity:.25}
@media (max-width:1024px){html:not(#ui) body:has(.mobile-nav) .legal-hub.ui-fab > summary{border-radius:22px!important}}

/* ==========================================================================
   Выделение текста и состояния боковой панели
   ========================================================================== */
html:not(#ui) body ::selection{background:rgb(var(--ui-accent)/.32);color:#fff;-webkit-text-fill-color:#fff}
html[data-theme="pearl"]:not(#ui) body ::selection{background:rgb(226 85 139/.22);color:#16131a;-webkit-text-fill-color:#16131a}
@media (min-width:1025px){
  html:not(#ui) body .sidebar .side-link{background:transparent!important;border:1px solid transparent!important;color:var(--ui-text-2)!important;position:relative}
  html:not(#ui) body .sidebar .side-link:hover{background:rgb(255 255 255/.06)!important;color:var(--ui-text)!important}
  html[data-theme="pearl"]:not(#ui) body .sidebar .side-link:hover{background:rgb(22 19 26/.05)!important}
  html:not(#ui) body .sidebar .side-link.active{background:linear-gradient(90deg,rgb(var(--ui-accent)/.18),rgb(var(--ui-accent)/.05))!important;border-color:rgb(var(--ui-accent)/.22)!important;color:rgb(var(--ui-accent))!important}
  html:not(#ui) body .sidebar .side-link.active::before{content:""!important;position:absolute!important;left:-8px!important;top:12px!important;bottom:12px!important;width:3px!important;border-radius:3px!important;background:rgb(var(--ui-accent))!important;box-shadow:0 0 10px rgb(var(--ui-accent)/.7)!important;display:block!important;opacity:1!important;transform:none!important}
  html:not(#ui) body .sidebar .side-copy b{color:var(--ui-text)!important}
  html:not(#ui) body .sidebar .side-copy small{color:var(--ui-text-3)!important}
  html:not(#ui) body .sidebar .side-link.active .side-copy b{color:rgb(var(--ui-accent))!important}
  html:not(#ui) body .sidebar{overflow:visible!important;clip-path:inset(-20px -40px -20px 0 round 22px)}
}
/* Шапка: пилюля активной вкладки — одна, спокойная */
html:not(#ui) body .site-top-hub nav a:is(.active,[aria-current="page"]){background:rgb(255 255 255/.10)!important}
html[data-theme="pearl"]:not(#ui) body .site-top-hub nav a:is(.active,[aria-current="page"]){background:#fff!important}

/* Глобус: ореол спокойнее */
html:not(#ui) body .ui-globe-halo{inset:14%!important;opacity:.55}

/* ==========================================================================
   Живая эмблема в шапке внутренних страниц
   ========================================================================== */
html:not(#ui) body .ui-has-art{position:relative!important}
html:not(#ui) body .ui-hero-art{--mx:0;--my:0;--sz:240px;position:absolute;z-index:0;pointer-events:none;width:var(--sz);height:var(--sz);top:50%;right:4%;
  transform:translate3d(calc(var(--mx) * 16px),calc(-50% + var(--my) * 12px),0);transition:transform .7s var(--ui-ease);animation:ui-rise-in 1s var(--ui-ease) .3s backwards}
html:not(#ui) body :is(.legal-hero,.review-page-hero).ui-has-art .ui-hero-art{right:auto;left:calc(100% + clamp(30px,6vw,110px))}
html:not(#ui) body .faq-hero.ui-has-art .ui-hero-art{--sz:170px;top:24px;right:36px;transform:translate3d(calc(var(--mx) * 12px),calc(var(--my) * 10px),0)}
html:not(#ui) body .ui-has-art > :not(.ui-hero-art){position:relative;z-index:1}
html:not(#ui) body .ui-ha-ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgb(var(--ui-accent)/.22);
  -webkit-mask:conic-gradient(#000 0 28%,transparent 34% 52%,#000 60% 84%,transparent 90%);mask:conic-gradient(#000 0 28%,transparent 34% 52%,#000 60% 84%,transparent 90%);animation:ui-spin 30s linear infinite}
html:not(#ui) body .ui-ha-ring.r2{inset:14%;border-style:dashed;border-color:rgb(var(--ui-accent)/.18);animation-duration:44s;animation-direction:reverse;-webkit-mask:none;mask:none}
html:not(#ui) body .ui-ha-ring.r3{inset:-14%;border-color:rgb(var(--ui-accent)/.10);animation-duration:60s}
html:not(#ui) body .ui-ha-orb{position:absolute;inset:22%;border-radius:50%;background:radial-gradient(circle,rgb(var(--ui-accent)/.35),rgb(var(--ui-accent-2)/.08) 55%,transparent 70%);filter:blur(14px);animation:ui-breathe 6s ease-in-out infinite}
html:not(#ui) body .ui-ha-sat{position:absolute;inset:0;border-radius:50%;animation:ui-spin 14s linear infinite}
html:not(#ui) body .ui-ha-sat::before{content:"";position:absolute;top:-4px;left:50%;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:rgb(var(--ui-accent));box-shadow:0 0 14px rgb(var(--ui-accent))}
html:not(#ui) body .ui-ha-sat.s2{inset:14%;animation-duration:22s;animation-direction:reverse}
html:not(#ui) body .ui-ha-sat.s2::before{width:6px;height:6px;background:#fff;box-shadow:0 0 10px rgb(255 255 255/.8)}
html:not(#ui) body .ui-ha-tile{position:absolute;inset:32%;border-radius:28%;display:grid;place-items:center;
  background:var(--lg-fill),rgb(24 20 28/.35);border:1px solid var(--lg-edge);box-shadow:var(--lg-shadow),0 18px 40px -14px rgb(var(--ui-accent-2)/.6);
  -webkit-backdrop-filter:var(--lg-blur);backdrop-filter:var(--lg-blur);animation:ui-float 7s ease-in-out infinite}
html[data-theme="pearl"]:not(#ui) body .ui-ha-tile{background:var(--lg-fill)}
@keyframes ui-float{0%,100%{transform:translateY(-3px)}50%{transform:translateY(3px)}}
html:not(#ui) body .ui-ha-ico{width:42%;height:42%;background:linear-gradient(150deg,#fff,rgb(var(--ui-accent)) 55%,rgb(var(--ui-accent-2)));-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
html[data-theme="pearl"]:not(#ui) body .ui-ha-ico{background:linear-gradient(150deg,rgb(var(--ui-accent)),rgb(var(--ui-accent-2)))}
@media (max-width:1180px){html:not(#ui) body :is(.legal-hero,.review-page-hero).ui-has-art .ui-hero-art{left:auto;right:-10px;--sz:200px;opacity:.6}}
@media (max-width:900px){html:not(#ui) body .ui-hero-art{display:none!important}}
html:not(#ui) body .page-hero.ui-has-art .ui-hero-art{--sz:190px;right:6%}
html:not(#ui) body .page-hero.ui-has-art{overflow:visible}