:root {
        --bg-deep: #070d19;
        --glass: rgba(12, 22, 38, 0.6);
        --glass-2: rgba(19, 33, 55, 0.72);
        --stroke: rgba(86, 124, 172, 0.26);
        --stroke-2: rgba(56, 189, 248, 0.46);
        --text: rgba(234, 244, 255, 0.96);
        --muted: rgba(178, 200, 228, 0.78);
        --neon1: #38bdf8;
        --neon2: #14b8a6;
      }

      html {
        background: var(--bg-deep);
      }

      html,
      body {
        min-height: 100%;
      }

      /* Tailwind preflight может перебивать фон — держим контент поверх отдельного слоя */
      body {
        margin: 0;
        background: transparent;
        color: var(--text);
        overflow-x: hidden;
      }

      /* Фиксированный фон: глубина + движение, без «двух полос» */
      .page-bg {
        position: fixed;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        overflow: hidden;
        background: var(--bg-deep);
      }

      .page-bg__mesh {
        position: absolute;
        inset: -25% -12%;
        background:
          radial-gradient(ellipse 75% 55% at 50% 12%, rgba(59, 130, 246, 0.22), transparent 68%),
          radial-gradient(ellipse 65% 45% at 88% 84%, rgba(20, 184, 166, 0.12), transparent 72%),
          linear-gradient(180deg, #060d1a 0%, #081224 50%, #060b17 100%);
        animation: meshDrift 28s ease-in-out infinite alternate;
      }

      @keyframes meshDrift {
        0% {
          transform: translate(0, 0) rotate(0deg) scale(1);
        }
        100% {
          transform: translate(-3%, 2%) rotate(-2deg) scale(1.06);
        }
      }

      .page-bg__blob {
        position: absolute;
        border-radius: 50%;
        filter: blur(90px);
        opacity: 0.46;
        mix-blend-mode: screen;
        animation: blobFloat 20s ease-in-out infinite;
      }

      .page-bg__blob--a {
        width: min(72vw, 640px);
        height: min(72vw, 640px);
        top: -12%;
        left: -8%;
        background: radial-gradient(circle, rgba(59, 130, 246, 0.62) 0%, transparent 68%);
        animation-delay: 0s;
      }

      .page-bg__blob--b {
        width: min(60vw, 520px);
        height: min(60vw, 520px);
        top: 8%;
        right: -14%;
        background: radial-gradient(circle, rgba(16, 185, 129, 0.4) 0%, transparent 70%);
        animation-delay: -4s;
        animation-duration: 17s;
      }

      .page-bg__blob--c {
        width: min(85vw, 720px);
        height: min(85vw, 720px);
        bottom: -22%;
        left: 18%;
        background: radial-gradient(circle, rgba(14, 165, 233, 0.36) 0%, transparent 72%);
        animation-delay: -7s;
        animation-duration: 19s;
      }

      @keyframes blobFloat {
        0%,
        100% {
          transform: translate(0, 0) scale(1);
        }
        50% {
          transform: translate(18px, -22px) scale(1.05);
        }
      }

      .page-bg__vignette {
        position: absolute;
        inset: 0;
        background:
          radial-gradient(ellipse 78% 66% at 50% 42%, transparent 35%, rgba(4, 10, 22, 0.82) 100%),
          linear-gradient(90deg, rgba(18, 48, 83, 0.1) 1px, transparent 1px),
          linear-gradient(180deg, rgba(18, 48, 83, 0.1) 1px, transparent 1px);
        background-size: auto, 44px 44px, 44px 44px;
        pointer-events: none;
      }

      .page-bg__noise {
        position: absolute;
        inset: 0;
        opacity: 0.03;
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        mix-blend-mode: soft-light;
      }

      .page-shell {
        position: relative;
        z-index: 1;
      }

      @media (prefers-reduced-motion: reduce) {
        .page-bg__mesh,
        .page-bg__blob {
          animation: none !important;
        }
      }

      /* Glassmorphism */
      .glass-card {
        background: var(--glass);
        border: 1px solid var(--stroke);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        box-shadow:
          0 10px 30px rgba(2, 8, 18, 0.45),
          inset 0 1px 0 rgba(130, 170, 220, 0.08);
        transition:
          transform 220ms ease,
          border-color 220ms ease,
          box-shadow 220ms ease,
          background 220ms ease;
      }

      .glass-card:hover {
        transform: translateY(-7px);
        border-color: var(--stroke-2);
        background: rgba(17, 33, 54, 0.74);
        box-shadow:
          0 16px 48px rgba(2, 9, 20, 0.58),
          0 0 0 1px rgba(56, 189, 248, 0.2),
          inset 0 1px 0 rgba(130, 170, 220, 0.12);
      }

      .glass-badge {
        background: rgba(56, 189, 248, 0.14);
        border: 1px solid rgba(56, 189, 248, 0.35);
        box-shadow: 0 0 18px rgba(56, 189, 248, 0.12);
      }

      /* Список локаций: одна панель, строки вместо сетки карточек */
      .proxy-panel {
        list-style: none;
        margin: 0;
        padding: 0;
        border-radius: 22px;
        border: 1px solid var(--stroke);
        background: rgba(10, 22, 38, 0.72);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        box-shadow:
          0 16px 48px rgba(2, 8, 18, 0.55),
          inset 0 1px 0 rgba(124, 161, 208, 0.08);
        overflow: hidden;
      }

      .proxy-row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 1rem 1.25rem;
        padding: 1rem 1.15rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        transition:
          background 0.2s ease,
          border-color 0.2s ease;
      }

      .proxy-row:last-child {
        border-bottom: 0;
      }

      .proxy-row:hover {
        background: rgba(31, 54, 82, 0.42);
      }

      /* Обёртка под flag-icons: размер через em, как в библиотеке */
      .country-flag {
        flex: 0 0 auto;
        font-size: 2.875rem;
        width: 1em;
        height: 1em;
        border-radius: 14px;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, 0.18);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.1),
          0 4px 14px rgba(0, 0, 0, 0.25);
        background: rgba(0, 0, 0, 0.2);
        line-height: 0;
      }

      .country-flag .fi {
        display: block;
      }

      .country-flag .fi.fis {
        width: 1em !important;
        height: 1em !important;
        line-height: 1em !important;
        background-size: cover;
        background-position: center;
      }

      .proxy-row__main {
        flex: 1 1 200px;
        min-width: 0;
      }

      .proxy-row__title {
        font-size: 1.05rem;
        font-weight: 800;
        line-height: 1.25;
      }

      .proxy-row__meta {
        margin-top: 0.25rem;
        font-size: 0.8rem;
        color: var(--muted);
      }

      /* Кнопки прокси: спокойный glass / outline вместо неонового градиента */
      .proxy-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.45rem;
        width: 100%;
        padding: 0.7rem 1.15rem;
        border-radius: 12px;
        font-weight: 700;
        font-size: 0.875rem;
        letter-spacing: 0.04em;
        color: rgba(248, 250, 252, 0.96);
        background: linear-gradient(180deg, rgba(19, 40, 65, 0.86) 0%, rgba(14, 30, 49, 0.9) 100%);
        border: 1px solid rgba(86, 124, 172, 0.38);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
        transition:
          background 0.2s ease,
          border-color 0.2s ease,
          color 0.2s ease,
          transform 0.15s ease;
        user-select: none;
      }

      @media (min-width: 640px) {
        .proxy-btn--inline {
          width: auto;
          min-width: 10.5rem;
          padding-left: 1.2rem;
          padding-right: 1.2rem;
        }
      }

      .proxy-btn:hover {
        background: linear-gradient(180deg, rgba(24, 51, 83, 0.92) 0%, rgba(18, 39, 64, 0.94) 100%);
        border-color: rgba(56, 189, 248, 0.5);
        color: #ffffff;
      }

      .proxy-btn:active,
      .proxy-btn.is-pressed {
        transform: scale(0.98);
        background: rgba(255, 255, 255, 0.07);
      }

      .proxy-btn:focus-visible {
        outline: 2px solid rgba(167, 139, 250, 0.85);
        outline-offset: 2px;
      }

      .proxy-btn__chevron {
        opacity: 0.85;
        font-weight: 600;
      }

      a.share-btn {
        text-decoration: none;
        color: #fff;
        box-sizing: border-box;
      }

      /* Кнопка «Поделиться»: спокойный системный вид (как в iOS) */
      .share-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.55rem;
        width: 100%;
        padding: 0.62rem 1.1rem;
        border-radius: 13px;
        font-family:
          -apple-system,
          BlinkMacSystemFont,
          "SF Pro Text",
          "Segoe UI",
          Roboto,
          "Helvetica Neue",
          Helvetica,
          Arial,
          sans-serif;
        font-weight: 600;
        font-size: 0.9375rem;
        letter-spacing: -0.015em;
        line-height: 1.25;
        color: #fff;
        cursor: pointer;
        border: 1px solid rgba(255, 255, 255, 0.14);
        background: linear-gradient(180deg, #5e5ce6 0%, #4b49d1 100%);
        box-shadow:
          0 1px 0 rgba(255, 255, 255, 0.18) inset,
          0 4px 16px rgba(0, 0, 0, 0.28),
          0 1px 2px rgba(0, 0, 0, 0.2);
        -webkit-font-smoothing: antialiased;
        transition:
          transform 0.18s ease,
          background 0.18s ease,
          box-shadow 0.18s ease,
          opacity 0.18s ease;
      }

      .share-btn__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 1.25rem;
        height: 1.25rem;
        opacity: 0.95;
      }

      .share-btn__icon svg {
        width: 1.1rem;
        height: 1.1rem;
        display: block;
      }

      .share-btn__label {
        position: relative;
        top: 0.5px;
      }

      .share-btn:hover {
        background: linear-gradient(180deg, #6b69eb 0%, #5553d8 100%);
        box-shadow:
          0 1px 0 rgba(255, 255, 255, 0.22) inset,
          0 6px 20px rgba(78, 76, 226, 0.45),
          0 2px 4px rgba(0, 0, 0, 0.2);
      }

      .share-btn:active {
        transform: scale(0.98);
        opacity: 0.92;
      }

      .share-btn:focus-visible {
        outline: 2px solid rgba(147, 197, 253, 0.95);
        outline-offset: 3px;
      }

      @media (min-width: 640px) {
        .share-btn {
          width: auto;
        }
      }

      .share-btn--cta {
        width: auto;
        max-width: 100%;
      }

      .subtle-line {
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
      }

      /* Блок Telegram-канала: стекло, без анимаций */
      .tg-channel-card {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 1.15rem 1.5rem;
        padding: 1.25rem 1.4rem;
        border-radius: 20px;
        text-decoration: none;
        color: inherit;
        overflow: hidden;
        isolation: isolate;
        background: rgba(255, 255, 255, 0.055);
        border: 1px solid rgba(255, 255, 255, 0.14);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        box-shadow:
          0 10px 36px rgba(0, 0, 0, 0.38),
          inset 0 1px 0 rgba(255, 255, 255, 0.09);
        transition:
          transform 0.2s ease,
          border-color 0.2s ease,
          box-shadow 0.2s ease;
      }

      /* Статичный акцент слева вместо крутящегося градиента */
      .tg-channel-card::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background: linear-gradient(180deg, var(--neon1), var(--neon2));
        opacity: 0.9;
        pointer-events: none;
        z-index: 0;
      }

      .tg-channel-card > * {
        position: relative;
        z-index: 1;
      }

      .tg-channel-card:hover {
        transform: translateY(-2px);
        border-color: rgba(168, 85, 247, 0.35);
        box-shadow:
          0 14px 44px rgba(0, 0, 0, 0.42),
          inset 0 1px 0 rgba(255, 255, 255, 0.1),
          0 0 0 1px rgba(168, 85, 247, 0.15);
      }

      .tg-channel-card:focus-visible {
        outline: 3px solid rgba(34, 211, 238, 0.7);
        outline-offset: 4px;
      }

      .tg-channel-card__icon {
        flex: 0 0 auto;
        width: 3.35rem;
        height: 3.35rem;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.12);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
        overflow: hidden;
      }

      .tg-channel-card__icon svg {
        width: 2.125rem;
        height: 2.125rem;
        flex-shrink: 0;
        display: block;
      }

      .tg-channel-card__body {
        flex: 1 1 200px;
        min-width: 0;
      }

      .tg-channel-card__badge {
        display: inline-block;
        font-size: 0.7rem;
        font-weight: 800;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: rgba(245, 241, 255, 0.85);
        margin-bottom: 0.35rem;
      }

      .tg-channel-card__title {
        margin: 0;
        font-size: 1.2rem;
        font-weight: 800;
        line-height: 1.25;
      }

      .tg-channel-card__text {
        margin: 0.4rem 0 0;
        font-size: 0.9rem;
        color: var(--muted);
        line-height: 1.45;
        max-width: 36rem;
      }

      .tg-channel-card__cta {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        padding: 0.72rem 1.3rem;
        border-radius: 12px;
        font-weight: 700;
        font-size: 0.875rem;
        letter-spacing: 0.03em;
        color: #faf5ff;
        background: rgba(91, 33, 182, 0.5);
        border: 1px solid rgba(167, 139, 250, 0.35);
        box-shadow:
          0 6px 18px rgba(0, 0, 0, 0.35),
          inset 0 1px 0 rgba(255, 255, 255, 0.12);
        white-space: nowrap;
        transition:
          background 0.2s ease,
          border-color 0.2s ease;
      }

      a.tg-channel-card:hover .tg-channel-card__cta {
        background: rgba(14, 116, 236, 0.62);
        border-color: rgba(125, 211, 252, 0.55);
      }

      /* Канал + бот: заголовок и две карточки в сетке, без внешней «коробки» */
      .tg-hub-section {
        position: relative;
      }

      .tg-hub-section__title {
        color: rgba(238, 247, 255, 0.98);
      }

      .tg-hub__defs {
        position: absolute;
        width: 0;
        height: 0;
        overflow: hidden;
        pointer-events: none;
      }

      .tg-hub__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
      }

      @media (min-width: 640px) {
        .tg-hub__grid {
          grid-template-columns: 1fr 1fr;
          gap: 1rem;
          align-items: stretch;
        }
      }

      @media (min-width: 1024px) {
        .tg-hub__grid {
          gap: 1.15rem;
        }
      }

      .tg-hub__tile {
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        min-height: 100%;
        padding: 1.2rem 1.25rem;
        border-radius: 17px;
        text-decoration: none;
        color: inherit;
        overflow: hidden;
        isolation: isolate;
        background: rgba(255, 255, 255, 0.045);
        border: 1px solid rgba(255, 255, 255, 0.12);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        transition:
          transform 0.2s ease,
          border-color 0.2s ease,
          box-shadow 0.2s ease;
      }

      .tg-hub__tile::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        pointer-events: none;
        z-index: 0;
      }

      .tg-hub__tile--channel::before {
        background: linear-gradient(180deg, #38bdf8, #14b8a6);
      }

      .tg-hub__tile--bot::before {
        background: linear-gradient(180deg, #a78bfa, #38bdf8);
      }

      .tg-hub__tile > * {
        position: relative;
        z-index: 1;
      }

      .tg-hub__tile:hover {
        transform: translateY(-3px);
        border-color: rgba(56, 189, 248, 0.35);
        box-shadow:
          0 18px 44px rgba(0, 0, 0, 0.38),
          0 0 0 1px rgba(56, 189, 248, 0.12);
      }

      .tg-hub__tile:focus-visible {
        outline: 3px solid rgba(34, 211, 238, 0.65);
        outline-offset: 3px;
      }

      .tg-hub__tile-main {
        display: flex;
        gap: 1rem;
        align-items: flex-start;
        flex: 1;
      }

      .tg-hub__icon {
        flex: 0 0 auto;
        width: 3rem;
        height: 3rem;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.11);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
      }

      .tg-hub__icon svg {
        width: 1.9rem;
        height: 1.9rem;
        display: block;
      }

      .tg-hub__body {
        min-width: 0;
        flex: 1;
      }

      .tg-hub__badge {
        display: inline-flex;
        align-items: center;
        padding: 0.2rem 0.55rem;
        border-radius: 8px;
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        margin-bottom: 0.4rem;
        border: 1px solid transparent;
      }

      .tg-hub__badge--channel {
        color: rgba(224, 246, 255, 0.95);
        background: rgba(56, 189, 248, 0.14);
        border-color: rgba(56, 189, 248, 0.35);
      }

      .tg-hub__badge--bot {
        color: rgba(243, 240, 255, 0.96);
        background: rgba(167, 139, 250, 0.16);
        border-color: rgba(167, 139, 250, 0.4);
      }

      .tg-hub__title {
        margin: 0;
        font-size: 1.1rem;
        font-weight: 800;
        line-height: 1.28;
        letter-spacing: -0.02em;
        padding-bottom: 0.06em;
      }

      .tg-hub__text {
        margin: 0.45rem 0 0;
        font-size: 0.88rem;
        line-height: 1.5;
        color: var(--muted);
      }

      .tg-hub__cta {
        margin-top: auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.45rem;
        width: 100%;
        padding: 0.68rem 1rem;
        border-radius: 12px;
        font-weight: 700;
        font-size: 0.84rem;
        letter-spacing: 0.02em;
        border: 1px solid transparent;
        transition:
          background 0.2s ease,
          border-color 0.2s ease;
      }

      .tg-hub__cta--channel {
        color: #f0f9ff;
        background: rgba(14, 116, 236, 0.45);
        border-color: rgba(125, 211, 252, 0.4);
      }

      .tg-hub__cta--bot {
        color: #faf5ff;
        background: rgba(91, 33, 182, 0.42);
        border-color: rgba(167, 139, 250, 0.42);
      }

      .tg-hub__tile--channel:hover .tg-hub__cta--channel {
        background: rgba(14, 116, 236, 0.62);
        border-color: rgba(125, 211, 252, 0.55);
      }

      .tg-hub__tile--bot:hover .tg-hub__cta--bot {
        background: rgba(124, 58, 237, 0.55);
        border-color: rgba(196, 181, 253, 0.55);
      }

      .tg-hub__cta-ico {
        display: inline-flex;
        width: 1rem;
        height: 1rem;
        opacity: 0.9;
      }

      .tg-hub__cta-ico svg {
        width: 100%;
        height: 100%;
        display: block;
      }

      /* Пропуск к контенту (доступность) */
      .skip-link {
        position: absolute;
        left: -9999px;
        top: 0;
        z-index: 100;
        padding: 0.65rem 1rem;
        border-radius: 10px;
        font-weight: 700;
        font-size: 0.9rem;
        color: #120524;
        background: linear-gradient(90deg, var(--neon1), var(--neon2));
      }

      .skip-link:focus {
        left: 1rem;
        top: 1rem;
        outline: 2px solid rgba(167, 139, 250, 0.9);
        outline-offset: 2px;
      }

      /* Верхняя навигация (стиль iOS: стекло, SF, капсула) */
      .site-nav {
        position: sticky;
        top: 0;
        z-index: 50;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: max(0.65rem, env(safe-area-inset-top, 0px)) max(1rem, env(safe-area-inset-right, 0px)) 0
          max(1rem, env(safe-area-inset-left, 0px));
        font-family:
          -apple-system,
          BlinkMacSystemFont,
          "SF Pro Text",
          "SF Pro Display",
          "Segoe UI",
          Roboto,
          "Helvetica Neue",
          Helvetica,
          Arial,
          sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }

      .site-nav__inner {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.5rem 0.75rem;
        box-sizing: border-box;
        width: fit-content;
        max-width: min(72rem, calc(100% - 2rem));
        margin-inline: auto;
        padding: 0.42rem 0.55rem 0.42rem 1.15rem;
        border-radius: 9999px;
        background: linear-gradient(
          165deg,
          rgba(255, 255, 255, 0.11) 0%,
          rgba(255, 255, 255, 0.04) 48%,
          rgba(10, 5, 28, 0.35) 100%
        );
        background-color: rgba(18, 12, 36, 0.52);
        border: 1px solid rgba(255, 255, 255, 0.14);
        box-shadow:
          0 8px 32px rgba(0, 0, 0, 0.38),
          0 2px 8px rgba(0, 0, 0, 0.2),
          inset 0 1px 0 rgba(255, 255, 255, 0.14),
          inset 0 -1px 0 rgba(0, 0, 0, 0.22);
        backdrop-filter: saturate(185%) blur(22px);
        -webkit-backdrop-filter: saturate(185%) blur(22px);
        transition: box-shadow 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
      }

      /* Одна строка: логотип + кнопка меню на телефоне; на десктопе «растворяется» в общий flex */
      .site-nav__row--head {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        min-width: 0;
      }

      @media (min-width: 768px) {
        .site-nav__row--head {
          display: contents;
        }
      }

      @media (max-width: 767px) {
        .site-nav__inner {
          flex-direction: column;
          align-items: stretch;
          flex-wrap: nowrap;
          justify-content: flex-start;
          gap: 0;
          border-radius: 22px;
        }

        /* Свёрнуто: без display:none — чтобы анимировать раскрытие */
        .site-nav__list {
          max-height: 0;
          opacity: 0;
          overflow: hidden;
          margin-top: 0;
          padding-top: 0;
          padding-bottom: 0;
          border-top-width: 0;
          border-top-style: solid;
          border-top-color: transparent;
          pointer-events: none;
          visibility: hidden;
          transition:
            max-height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.3s ease,
            margin-top 0.32s ease,
            padding-top 0.32s ease,
            padding-bottom 0.32s ease,
            border-top-width 0.32s ease,
            border-top-color 0.25s ease,
            visibility 0s linear 0.38s;
        }

        .site-nav__list.is-open {
          max-height: min(75vh, 24rem);
          opacity: 1;
          margin-top: 0.35rem;
          padding-top: 0.45rem;
          padding-bottom: 0.12rem;
          border-top-width: 1px;
          border-top-color: rgba(255, 255, 255, 0.12);
          pointer-events: auto;
          visibility: visible;
          transition:
            max-height 0.45s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.32s ease 0.04s,
            margin-top 0.32s ease,
            padding-top 0.32s ease,
            padding-bottom 0.32s ease,
            border-top-width 0.32s ease,
            border-top-color 0.28s ease,
            visibility 0s linear 0s;
        }

        /* Пункты: лёгкий каскад при открытии */
        .site-nav__list.is-open li {
          animation: siteNavItemIn 0.4s cubic-bezier(0.22, 1, 0.36, 1) backwards;
        }

        .site-nav__list.is-open li:nth-child(1) {
          animation-delay: 0.05s;
        }

        .site-nav__list.is-open li:nth-child(2) {
          animation-delay: 0.09s;
        }

        .site-nav__list.is-open li:nth-child(3) {
          animation-delay: 0.13s;
        }

        .site-nav__list.is-open li:nth-child(4) {
          animation-delay: 0.17s;
        }

        .site-nav__list.is-open li:nth-child(5) {
          animation-delay: 0.21s;
        }

        .site-nav__list.is-open li:nth-child(6) {
          animation-delay: 0.25s;
        }

        /* Гамбургер → крестик */
        .site-nav__toggle-icon line {
          transition:
            transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.22s ease;
        }

        .site-nav__toggle-icon line:nth-child(1) {
          transform-origin: 12px 7px;
        }

        .site-nav__toggle-icon line:nth-child(2) {
          transform-origin: 12px 12px;
        }

        .site-nav__toggle-icon line:nth-child(3) {
          transform-origin: 12px 17px;
        }

        .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon line:nth-child(1) {
          transform: translateY(5px) rotate(45deg);
        }

        .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon line:nth-child(2) {
          opacity: 0;
          transform: scaleX(0.2);
        }

        .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon line:nth-child(3) {
          transform: translateY(-5px) rotate(-45deg);
        }
      }

      @keyframes siteNavItemIn {
        from {
          opacity: 0;
          transform: translateY(-0.45rem);
        }

        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      .site-nav__brand {
        font-weight: 600;
        letter-spacing: -0.035em;
        font-size: 0.9375rem;
        color: rgba(255, 255, 255, 0.96);
        text-decoration: none;
        transition: opacity 0.22s cubic-bezier(0.4, 0, 0.2, 1);
      }

      .site-nav__brand:hover {
        opacity: 0.82;
        color: #fff;
      }

      .site-nav__toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        min-width: 44px;
        min-height: 44px;
        padding: 0.4rem;
        border-radius: 14px;
        font-weight: 600;
        font-size: 0.8125rem;
        letter-spacing: -0.02em;
        color: rgba(255, 255, 255, 0.95);
        background: rgba(255, 255, 255, 0.11);
        border: 1px solid rgba(255, 255, 255, 0.14);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
        cursor: pointer;
        transition:
          transform 0.2s cubic-bezier(0.34, 1.2, 0.64, 1),
          background 0.22s ease;
      }

      .site-nav__toggle-icon {
        display: block;
        flex-shrink: 0;
      }

      .site-nav__toggle:hover {
        background: rgba(255, 255, 255, 0.16);
      }

      .site-nav__toggle:active {
        transform: scale(0.96);
      }

      .site-nav__toggle:focus-visible {
        outline: 2px solid rgba(147, 197, 253, 0.85);
        outline-offset: 3px;
      }

      @media (min-width: 768px) {
        .site-nav__toggle {
          display: none;
        }
      }

      .site-nav__list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0.2rem;
        width: 100%;
      }

      .site-nav__list li {
        list-style: none;
        margin: 0;
        padding: 0;
      }

      @media (min-width: 768px) {
        .site-nav__list {
          display: flex;
          flex-direction: row;
          align-items: center;
          gap: 0.2rem;
          width: auto;
          padding: 0;
          max-height: none;
          opacity: 1;
          overflow: visible;
          margin-top: 0;
          border-top-width: 0;
          pointer-events: auto;
          visibility: visible;
        }

        .site-nav__list.is-open {
          display: flex;
          padding: 0;
        }

        .site-nav__list li {
          animation: none !important;
        }
      }

      .site-nav__list a {
        display: inline-flex;
        align-items: center;
        gap: 0.48rem;
        padding: 0.45rem 0.85rem;
        border-radius: 9999px;
        font-weight: 600;
        font-size: 0.875rem;
        letter-spacing: -0.025em;
        color: rgba(255, 255, 255, 0.72);
        text-decoration: none;
        border: 1px solid transparent;
        transition:
          background 0.24s cubic-bezier(0.4, 0, 0.2, 1),
          color 0.24s cubic-bezier(0.4, 0, 0.2, 1),
          box-shadow 0.24s cubic-bezier(0.4, 0, 0.2, 1),
          transform 0.2s ease;
      }

      .site-nav__list a:hover {
        color: rgba(255, 255, 255, 0.98);
        background: rgba(255, 255, 255, 0.09);
      }

      .site-nav__list a:active {
        transform: scale(0.98);
      }

      .site-nav__list a[aria-current="page"] {
        color: #fff;
        background: linear-gradient(180deg, rgba(14, 116, 236, 0.6) 0%, rgba(8, 47, 127, 0.5) 100%);
        border-color: rgba(125, 211, 252, 0.32);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.18),
          0 2px 10px rgba(2, 36, 82, 0.42);
      }

      .site-nav__list a[aria-current="page"]:hover {
        color: #fff;
        background: linear-gradient(180deg, rgba(147, 104, 250, 0.62) 0%, rgba(124, 58, 237, 0.48) 100%);
      }

      .site-nav__list a:focus-visible {
        outline: 2px solid rgba(147, 197, 253, 0.9);
        outline-offset: 2px;
      }

      .site-nav__link-ico {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 1rem;
        height: 1rem;
        opacity: 0.92;
      }

      .site-nav__link-ico svg {
        width: 100%;
        height: 100%;
        display: block;
      }

      @media (prefers-reduced-motion: reduce) {
        .site-nav__inner,
        .site-nav__brand,
        .site-nav__toggle,
        .site-nav__list a {
          transition: none;
        }

        .site-nav__toggle:active,
        .site-nav__list a:active {
          transform: none;
        }

        @media (max-width: 767px) {
          .site-nav__list {
            transition: none;
          }

          .site-nav__list.is-open {
            transition: none;
          }

          .site-nav__list.is-open li {
            animation: none !important;
          }

          .site-nav__toggle-icon line {
            transition: none;
          }

          .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon line:nth-child(1),
          .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon line:nth-child(3) {
            transform: none;
          }

          .site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon line:nth-child(2) {
            opacity: 1;
            transform: none;
          }
        }
      }

      /* Призыв: не потерять сайт — добавить на главный экран */
      .cta-pwa {
        margin: 0;
      }

      .cta-pwa__box {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 1rem 1.25rem;
        padding: 1rem 1.25rem;
        border-radius: 20px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        background: linear-gradient(135deg, rgba(14, 116, 236, 0.34) 0%, rgba(34, 211, 238, 0.14) 58%, rgba(6, 182, 212, 0.14) 100%);
        box-shadow:
          0 10px 36px rgba(0, 0, 0, 0.28),
          inset 0 1px 0 rgba(255, 255, 255, 0.12);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
      }

      .cta-pwa__body {
        flex: 1 1 16rem;
        min-width: 0;
      }

      .cta-pwa__title {
        display: block;
        font-weight: 800;
        font-size: 1.02rem;
        letter-spacing: -0.02em;
        color: #fff;
        margin-bottom: 0.35rem;
      }

      .cta-pwa__desc {
        margin: 0;
        font-size: 0.9rem;
        line-height: 1.55;
        color: rgba(245, 241, 255, 0.82);
        max-width: 44rem;
      }

      .cta-pwa__actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.65rem;
        flex: 0 0 auto;
      }

      /* «Добавить на экран» — как системная кнопка iOS (синяя, белый текст) */
      .cta-pwa__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0.58rem 1.15rem;
        border-radius: 13px;
        font-family:
          -apple-system,
          BlinkMacSystemFont,
          "SF Pro Text",
          "Segoe UI",
          Roboto,
          "Helvetica Neue",
          Helvetica,
          Arial,
          sans-serif;
        font-weight: 600;
        font-size: 0.875rem;
        letter-spacing: -0.015em;
        line-height: 1.25;
        color: #fff;
        text-decoration: none;
        white-space: nowrap;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: linear-gradient(180deg, #0b84ff 0%, #0071e8 100%);
        box-shadow:
          0 1px 0 rgba(255, 255, 255, 0.2) inset,
          0 4px 14px rgba(0, 113, 232, 0.35),
          0 1px 2px rgba(0, 0, 0, 0.2);
        -webkit-font-smoothing: antialiased;
        transition:
          transform 0.18s ease,
          background 0.18s ease,
          box-shadow 0.18s ease,
          opacity 0.18s ease;
      }

      .cta-pwa__btn:hover {
        background: linear-gradient(180deg, #1a8fff 0%, #0b7fdf 100%);
        box-shadow:
          0 1px 0 rgba(255, 255, 255, 0.22) inset,
          0 6px 18px rgba(0, 113, 232, 0.42),
          0 2px 4px rgba(0, 0, 0, 0.18);
      }

      .cta-pwa__btn:active {
        transform: scale(0.98);
        opacity: 0.9;
      }

      .cta-pwa__btn:focus-visible {
        outline: 2px solid rgba(147, 197, 253, 0.95);
        outline-offset: 3px;
      }

      .site-footer-cta {
        padding: 0.9rem 1.05rem;
        border-radius: 16px;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: rgba(255, 255, 255, 0.045);
      }

      .site-footer-cta p {
        margin: 0;
        font-size: 0.875rem;
        line-height: 1.6;
        color: var(--muted);
      }

      .site-footer-cta strong {
        color: rgba(255, 255, 255, 0.96);
        font-weight: 700;
      }

      .site-footer-cta a {
        color: rgba(34, 211, 238, 0.98);
        font-weight: 600;
        text-decoration: underline;
        text-underline-offset: 3px;
      }

      .site-footer-cta a:hover {
        color: #fff;
      }

      /* Текстовые страницы: без «подъёма» карточки при hover */
      .page-article .glass-card:hover {
        transform: none;
      }

      .page-article h2 {
        margin: 1.75rem 0 0.75rem;
        font-size: 1.2rem;
        font-weight: 800;
      }

      .page-article p,
      .page-article li {
        line-height: 1.65;
      }

      .breadcrumb {
        font-size: 0.85rem;
        color: var(--muted);
      }

      .breadcrumb a {
        color: rgba(34, 211, 238, 0.95);
        text-decoration: underline;
        text-underline-offset: 3px;
      }

      .breadcrumb a:hover {
        color: #fff;
      }

      /* ===== Ultra Redesign Theme ===== */
      body {
        font-family:
          "Inter",
          "SF Pro Text",
          -apple-system,
          BlinkMacSystemFont,
          "Segoe UI",
          Roboto,
          Arial,
          sans-serif;
      }

      .page-bg {
        background:
          radial-gradient(1200px 700px at 50% -5%, rgba(14, 165, 233, 0.16), transparent 65%),
          radial-gradient(900px 520px at 95% 100%, rgba(34, 197, 94, 0.08), transparent 64%),
          linear-gradient(180deg, #050b16 0%, #081224 52%, #050a14 100%);
      }

      .page-bg__mesh {
        inset: -8% -4%;
        background:
          linear-gradient(90deg, rgba(40, 71, 114, 0.15) 1px, transparent 1px),
          linear-gradient(180deg, rgba(40, 71, 114, 0.15) 1px, transparent 1px);
        background-size: 52px 52px, 52px 52px;
        animation: meshDrift 38s linear infinite;
      }

      .page-bg__blob {
        opacity: 0.34;
      }

      .page-bg__noise {
        opacity: 0.018;
      }

      .site-nav {
        padding-top: max(0.9rem, env(safe-area-inset-top, 0px));
      }

      .site-nav__inner {
        background: linear-gradient(180deg, rgba(10, 23, 39, 0.9) 0%, rgba(9, 18, 31, 0.88) 100%);
        border: 1px solid rgba(70, 116, 171, 0.38);
        box-shadow:
          0 14px 36px rgba(3, 8, 17, 0.52),
          inset 0 1px 0 rgba(145, 182, 230, 0.12);
      }

      .site-nav__brand {
        color: rgba(226, 240, 255, 0.97);
      }

      .site-nav__list a {
        color: rgba(172, 199, 229, 0.82);
      }

      .site-nav__list a[aria-current="page"] {
        background: linear-gradient(180deg, rgba(14, 116, 236, 0.7) 0%, rgba(8, 47, 127, 0.62) 100%);
        border-color: rgba(125, 211, 252, 0.45);
      }

      .glass-card {
        background: linear-gradient(180deg, rgba(11, 22, 38, 0.9) 0%, rgba(8, 17, 29, 0.92) 100%);
        border: 1px solid rgba(72, 117, 172, 0.34);
        box-shadow:
          0 12px 34px rgba(1, 7, 16, 0.56),
          inset 0 1px 0 rgba(140, 176, 221, 0.09);
      }

      .glass-card:hover {
        transform: translateY(-4px);
        border-color: rgba(56, 189, 248, 0.5);
        box-shadow:
          0 18px 50px rgba(1, 8, 19, 0.62),
          0 0 0 1px rgba(56, 189, 248, 0.16),
          inset 0 1px 0 rgba(164, 197, 235, 0.12);
      }

      .proxy-panel {
        border-radius: 20px;
        border-color: rgba(79, 124, 179, 0.36);
        background: linear-gradient(180deg, rgba(9, 21, 36, 0.94) 0%, rgba(7, 16, 28, 0.95) 100%);
      }

      .proxy-row {
        border-bottom-color: rgba(59, 91, 129, 0.34);
      }

      .proxy-row:hover {
        background: rgba(24, 45, 72, 0.45);
      }

      .country-flag {
        border-color: rgba(120, 161, 208, 0.34);
      }

      .proxy-row__title {
        color: rgba(233, 244, 255, 0.97);
      }

      .proxy-row__meta {
        color: rgba(162, 189, 219, 0.77);
      }

      .proxy-btn {
        border-radius: 13px;
        background: linear-gradient(180deg, rgba(20, 45, 73, 0.95) 0%, rgba(14, 31, 51, 0.95) 100%);
        border-color: rgba(89, 138, 195, 0.45);
        color: rgba(233, 245, 255, 0.98);
      }

      .proxy-btn:hover {
        border-color: rgba(56, 189, 248, 0.6);
        box-shadow:
          0 8px 24px rgba(5, 38, 70, 0.4),
          inset 0 1px 0 rgba(151, 199, 241, 0.12);
      }

      /* После темы: мобильный список прокси (карточки), иначе перебивается фоном панели */
      @media (max-width: 639px) {
        .proxy-panel {
          display: flex;
          flex-direction: column;
          gap: 0.6rem;
          padding: 0.5rem;
          border-radius: 20px;
          background: rgba(4, 11, 22, 0.72);
          border: 1px solid rgba(72, 118, 172, 0.3);
          box-shadow:
            0 14px 42px rgba(0, 0, 0, 0.38),
            inset 0 1px 0 rgba(130, 170, 220, 0.06);
          overflow: visible;
        }

        .proxy-row {
          display: grid;
          grid-template-columns: auto 1fr;
          grid-template-rows: auto auto auto;
          align-items: start;
          gap: 0.3rem 0.65rem;
          padding: 0.75rem 0.8rem;
          margin: 0;
          border: 1px solid rgba(90, 132, 188, 0.28);
          border-radius: 16px;
          background: linear-gradient(160deg, rgba(12, 26, 44, 0.95) 0%, rgba(7, 16, 30, 0.97) 100%);
          box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.07),
            0 6px 22px rgba(0, 0, 0, 0.22);
          border-bottom: none;
        }

        .proxy-row:last-child {
          border-bottom: none;
        }

        .proxy-row:hover {
          background: linear-gradient(160deg, rgba(16, 32, 54, 0.98) 0%, rgba(9, 20, 36, 0.99) 100%);
        }

        .country-flag {
          grid-column: 1;
          grid-row: 1 / span 2;
          align-self: start;
          font-size: 2.35rem;
          border-radius: 11px;
        }

        .proxy-row__main {
          grid-column: 2;
          grid-row: 1 / span 2;
          align-self: stretch;
          min-width: 0;
          flex: unset;
        }

        .proxy-row__title {
          font-size: 1.02rem;
          line-height: 1.22;
        }

        .proxy-row__meta-slot {
          min-height: 2.55rem;
          margin-top: 0.15rem;
          display: flex;
          align-items: flex-start;
        }

        .proxy-row__meta-slot:empty {
          min-height: 2.55rem;
        }

        .proxy-row__meta {
          margin-top: 0;
          font-size: 0.76rem;
          line-height: 1.38;
        }

        .proxy-btn.proxy-btn--inline {
          grid-column: 1 / -1;
          grid-row: 3;
          width: 100%;
          margin-top: 0.4rem;
          padding: 0.55rem 0.9rem;
          min-height: 46px;
          border-radius: 12px;
          font-size: 0.8125rem;
          letter-spacing: 0.02em;
          gap: 0.4rem;
          background: linear-gradient(180deg, rgba(22, 48, 78, 0.95) 0%, rgba(16, 36, 58, 0.98) 100%);
          border-color: rgba(56, 165, 250, 0.42);
        }

        .proxy-btn__ico,
        .proxy-btn__chevron {
          display: none !important;
        }
      }

      .share-btn,
      .cta-pwa__btn {
        border-radius: 14px;
      }

      .share-btn {
        background: linear-gradient(180deg, #0c8ee8 0%, #0b6fd4 100%);
        border-color: rgba(134, 212, 255, 0.42);
      }

      .share-btn:hover {
        background: linear-gradient(180deg, #18a0ff 0%, #0d79de 100%);
      }

      .tg-channel-card {
        border-radius: 18px;
        background: linear-gradient(180deg, rgba(12, 24, 42, 0.9) 0%, rgba(9, 19, 33, 0.92) 100%);
        border: 1px solid rgba(81, 126, 181, 0.34);
      }

      .tg-channel-card__badge {
        background: rgba(56, 189, 248, 0.16);
        border-color: rgba(56, 189, 248, 0.44);
      }

      .tg-channel-card__title {
        color: rgba(233, 245, 255, 0.98);
      }

      .tg-channel-card__text {
        color: rgba(168, 194, 223, 0.8);
      }

      .tg-hub-section__title {
        color: rgba(238, 247, 255, 0.98);
      }

      .tg-hub__tile {
        background: linear-gradient(180deg, rgba(11, 22, 40, 0.88) 0%, rgba(8, 17, 31, 0.92) 100%);
        border-color: rgba(72, 117, 172, 0.32);
      }

      .tg-hub__title {
        color: rgba(233, 245, 255, 0.98);
      }

      .tg-hub__text {
        color: rgba(168, 194, 223, 0.82);
      }

      .cta-pwa__box {
        border-color: rgba(81, 125, 180, 0.36);
        background: linear-gradient(135deg, rgba(14, 58, 110, 0.45) 0%, rgba(10, 32, 62, 0.56) 50%, rgba(6, 35, 62, 0.56) 100%);
      }

      .cta-pwa__title {
        color: rgba(238, 247, 255, 0.98);
      }

      .cta-pwa__desc {
        color: rgba(178, 203, 230, 0.8);
      }

      .cta-pwa__btn {
        background: linear-gradient(180deg, #0d8df4 0%, #0b6fde 100%);
        border-color: rgba(129, 209, 255, 0.46);
      }

      .site-footer-cta {
        background: rgba(10, 24, 40, 0.82);
        border-color: rgba(76, 118, 170, 0.3);
      }

      .site-footer-cta p {
        color: rgba(173, 200, 227, 0.8);
      }

      .site-footer-cta strong {
        color: rgba(229, 241, 255, 0.98);
      }

      footer {
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
      }

      header h1,
      main h2 {
        letter-spacing: -0.03em;
        text-wrap: balance;
      }

      /* background-clip: text режет нижние выносные (g, y, р, ц…) — нужен запас по высоте и box */
      header h1 {
        display: block;
        overflow: visible;
        background: linear-gradient(180deg, rgba(241, 248, 255, 1) 0%, rgba(185, 220, 253, 0.9) 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        line-height: 1.35;
        padding: 0.06em 0 0.18em;
        -webkit-font-smoothing: antialiased;
      }

      .subtle-line {
        background: linear-gradient(90deg, transparent, rgba(110, 188, 255, 0.5), transparent);
      }

      /* Иконки: визуальные якоря, меньше «стены текста» */
      .ui-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 2.65rem;
        height: 2.65rem;
        border-radius: 14px;
        background: rgba(56, 189, 248, 0.1);
        border: 1px solid rgba(125, 211, 252, 0.28);
        color: rgba(147, 213, 253, 0.98);
      }

      .ui-icon svg {
        width: 1.35rem;
        height: 1.35rem;
        display: block;
      }

      .ui-icon--sm {
        width: 2.15rem;
        height: 2.15rem;
        border-radius: 12px;
      }

      .ui-icon--sm svg {
        width: 1.1rem;
        height: 1.1rem;
      }

      .ui-icon--xs {
        width: 1.65rem;
        height: 1.65rem;
        border-radius: 10px;
      }

      .ui-icon--xs svg {
        width: 0.88rem;
        height: 0.88rem;
      }

      .hero-kicker {
        display: inline-flex;
        align-items: center;
        gap: 0.55rem;
      }

      .feature-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
      }

      .feature-chip .ui-icon--xs {
        margin: 0;
      }

      .stat-card__icon {
        margin-bottom: 0.65rem;
      }

      .section-head {
        display: flex;
        align-items: flex-start;
        gap: 0.85rem;
      }

      .section-head__text {
        flex: 1;
        min-width: 0;
      }

      /* Иконка слева в блоке «добавить на экран» — без ломки строки body + actions */
      .cta-pwa__body--with-icon {
        display: flex;
        align-items: flex-start;
        gap: 1rem;
      }

      .cta-pwa__body-text {
        flex: 1;
        min-width: 0;
      }

      .faq-section-title {
        display: flex;
        align-items: center;
        gap: 0.65rem;
      }

      .faq-item {
        display: flex;
        align-items: flex-start;
        gap: 0.75rem;
      }

      .faq-item__body {
        flex: 1;
        min-width: 0;
      }

      .faq-item .ui-icon--sm {
        margin-top: 0.12rem;
      }

      .site-footer-cta {
        display: flex;
        align-items: flex-start;
        gap: 0.75rem;
      }

      .site-footer-cta p {
        flex: 1;
        min-width: 0;
      }

      .proxy-btn__ico {
        display: inline-flex;
        width: 1.05rem;
        height: 1.05rem;
        opacity: 0.92;
      }

      .proxy-btn__ico svg {
        width: 100%;
        height: 100%;
        display: block;
      }

      .proxy-status {
        display: flex;
        align-items: center;
        gap: 0.5rem;
      }

      .proxy-status .ui-icon--xs {
        flex-shrink: 0;
      }

      .proxy-status__msg {
        flex: 1;
        min-width: 0;
      }

      /* Всплывающее glass-уведомление (не блокирует страницу) */
      .glass-toast {
        position: fixed;
        z-index: 90;
        max-width: min(22rem, calc(100vw - 1.5rem - env(safe-area-inset-right, 0px) - env(safe-area-inset-left, 0px)));
        right: max(0.75rem, env(safe-area-inset-right, 0px));
        bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
        left: auto;
        pointer-events: none;
        opacity: 0;
        transform: translate3d(0.85rem, 0.35rem, 0) scale(0.98);
        transition:
          opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1),
          transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
      }

      .glass-toast.glass-toast--visible {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        pointer-events: auto;
      }

      .glass-toast__panel {
        position: relative;
        padding: 1rem 2.15rem 1.15rem 1.1rem;
        border-radius: 18px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        background: rgba(8, 18, 34, 0.42);
        backdrop-filter: blur(24px) saturate(170%);
        -webkit-backdrop-filter: blur(24px) saturate(170%);
        box-shadow:
          0 16px 48px rgba(0, 0, 0, 0.5),
          inset 0 1px 0 rgba(255, 255, 255, 0.14),
          0 0 0 1px rgba(56, 189, 248, 0.1);
        overflow: hidden;
      }

      .glass-toast__panel::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
          125deg,
          rgba(56, 189, 248, 0.14) 0%,
          transparent 45%,
          rgba(167, 139, 250, 0.12) 100%
        );
        pointer-events: none;
        z-index: 0;
      }

      .glass-toast__panel > * {
        position: relative;
        z-index: 1;
      }

      .glass-toast__x {
        position: absolute;
        top: 0.4rem;
        right: 0.4rem;
        z-index: 2;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        padding: 0;
        margin: 0;
        border: none;
        border-radius: 10px;
        font-size: 1.35rem;
        line-height: 1;
        color: rgba(255, 255, 255, 0.65);
        background: rgba(255, 255, 255, 0.06);
        cursor: pointer;
        transition:
          color 0.2s ease,
          background 0.2s ease;
      }

      .glass-toast__x:hover {
        color: rgba(255, 255, 255, 0.95);
        background: rgba(255, 255, 255, 0.12);
      }

      .glass-toast__x:focus-visible {
        outline: 2px solid rgba(56, 189, 248, 0.85);
        outline-offset: 2px;
      }

      .glass-toast__text {
        margin: 0;
        font-size: 0.92rem;
        line-height: 1.6;
        font-weight: 600;
        color: rgba(236, 244, 255, 0.96);
        letter-spacing: -0.015em;
        overflow: visible;
      }

      .glass-toast__accent {
        display: inline-block;
        color: rgba(125, 211, 252, 0.98);
        font-weight: 800;
        line-height: 1.5;
        padding-bottom: 0.06em;
        vertical-align: baseline;
      }

      .glass-toast__actions {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        margin-top: 0.85rem;
      }

      .glass-toast__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0.52rem 1rem;
        border-radius: 11px;
        font-weight: 700;
        font-size: 0.82rem;
        letter-spacing: 0.02em;
        text-decoration: none;
        border: 1px solid transparent;
        cursor: pointer;
        transition:
          background 0.2s ease,
          border-color 0.2s ease,
          color 0.2s ease,
          transform 0.15s ease;
        font-family: inherit;
      }

      .glass-toast__btn:active {
        transform: scale(0.98);
      }

      .glass-toast__btn--primary {
        color: #f0f9ff;
        background: linear-gradient(180deg, rgba(14, 116, 236, 0.75) 0%, rgba(8, 70, 160, 0.82) 100%);
        border-color: rgba(125, 211, 252, 0.45);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);
      }

      .glass-toast__btn--primary:hover {
        background: linear-gradient(180deg, rgba(24, 130, 250, 0.88) 0%, rgba(12, 84, 190, 0.9) 100%);
        border-color: rgba(186, 230, 253, 0.55);
      }

      .glass-toast__btn--secondary {
        color: rgba(226, 238, 255, 0.88);
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.16);
      }

      .glass-toast__btn--secondary:hover {
        background: rgba(255, 255, 255, 0.12);
        border-color: rgba(255, 255, 255, 0.22);
        color: #fff;
      }

      .glass-toast__btn:focus-visible {
        outline: 2px solid rgba(34, 211, 238, 0.85);
        outline-offset: 2px;
      }

      @media (prefers-reduced-motion: reduce) {
        .glass-toast {
          transition: none;
        }

        .glass-toast__btn:active {
          transform: none;
        }
      }

      /* ========== Адаптивность и safe-area (телефоны, планшеты, вырезы) ========== */
      html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
      }

      .page-shell {
        box-sizing: border-box;
        padding-bottom: env(safe-area-inset-bottom, 0px);
      }

      img,
      video {
        max-width: 100%;
        height: auto;
      }

      @media (max-width: 767px) {
        .site-nav__inner {
          width: 100%;
          max-width: min(
            72rem,
            calc(100vw - 1rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))
          );
        }

        .site-nav__brand {
          flex: 1 1 auto;
          min-width: 0;
        }

        .site-nav__brand > span:last-child {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }

        .site-nav__list a {
          width: 100%;
          box-sizing: border-box;
          min-height: 44px;
          padding-top: 0.55rem;
          padding-bottom: 0.55rem;
        }
      }

      @media (max-width: 639px) {
        .tg-hub__tile {
          padding: 1rem 1.05rem;
        }

        .tg-hub__icon {
          width: 2.65rem;
          height: 2.65rem;
        }

        .cta-pwa__box {
          padding: 0.9rem 1rem;
        }

        .glass-card {
          border-radius: 20px;
        }
      }

      @media (max-width: 380px) {
        .country-flag {
          font-size: 2.2rem;
        }
      }

      @media (max-width: 480px) {
        .glass-toast {
          left: max(0.5rem, env(safe-area-inset-left, 0px));
          right: max(0.5rem, env(safe-area-inset-right, 0px));
          max-width: none;
        }

        .glass-toast__actions {
          flex-direction: column;
          align-items: stretch;
        }

        .glass-toast__btn {
          width: 100%;
          min-height: 44px;
          justify-content: center;
        }
      }

      /* Текстовые страницы: компактнее на узком экране */
      @media (max-width: 639px) {
        article.page-article {
          border-radius: 20px;
        }

        .page-article h1 {
          flex-wrap: wrap;
        }

        .page-article h2 {
          font-size: 1.08rem;
          margin-top: 1.5rem;
        }
      }

      /* ===== Красивые анимации (уважение к prefers-reduced-motion) ===== */
      @keyframes shellBlockIn {
        from {
          opacity: 0;
          transform: translateY(18px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      @keyframes heroItemIn {
        from {
          opacity: 0;
          transform: translateY(14px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      @keyframes subtleLineGrow {
        from {
          opacity: 0;
          transform: scaleX(0);
        }
        to {
          opacity: 1;
          transform: scaleX(1);
        }
      }

      @keyframes navBrandGlow {
        0%,
        100% {
          filter: drop-shadow(0 0 0 transparent);
        }
        50% {
          filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.35));
        }
      }

      @keyframes floatSoft {
        0%,
        100% {
          transform: translateY(0);
        }
        50% {
          transform: translateY(-3px);
        }
      }

      @media (prefers-reduced-motion: no-preference) {
        .page-shell > nav,
        .page-shell > header,
        .page-shell > section,
        .page-shell > main,
        .page-shell > footer {
          animation: shellBlockIn 0.72s cubic-bezier(0.22, 1, 0.36, 1) both;
        }

        .page-shell > nav {
          animation-delay: 0.04s;
        }

        .page-shell > header {
          animation-delay: 0.1s;
        }

        .page-shell > section {
          animation-delay: 0.16s;
        }

        .page-shell > main {
          animation-delay: 0.2s;
        }

        .page-shell > footer {
          animation-delay: 0.26s;
        }

        .hero-stagger > * {
          animation: heroItemIn 0.58s cubic-bezier(0.22, 1, 0.36, 1) both;
        }

        .hero-stagger > *:nth-child(1) {
          animation-delay: 0.14s;
        }

        .hero-stagger > *:nth-child(2) {
          animation-delay: 0.22s;
        }

        .hero-stagger > *:nth-child(3) {
          animation-delay: 0.28s;
        }

        .hero-stagger > *:nth-child(4) {
          animation-delay: 0.34s;
        }

        .hero-stagger > *:nth-child(5) {
          animation-delay: 0.4s;
        }

        .hero-stagger > *:nth-child(6) {
          animation-delay: 0.46s;
        }

        .hero-stagger > *:nth-child(7) {
          animation-delay: 0.52s;
        }

        header .subtle-line {
          transform-origin: left center;
          animation: subtleLineGrow 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.32s both;
        }

        .site-nav__brand .ui-icon {
          animation: navBrandGlow 3.5s ease-in-out 0.8s 1;
        }

        .site-nav__list a .site-nav__link-ico {
          transition: transform 0.25s cubic-bezier(0.34, 1.2, 0.64, 1);
        }

        .site-nav__list a:hover .site-nav__link-ico {
          transform: scale(1.12) translateY(-1px);
        }

        .feature-chip,
        .share-btn {
          transition:
            transform 0.28s cubic-bezier(0.34, 1.2, 0.64, 1),
            box-shadow 0.28s ease,
            border-color 0.28s ease;
        }

        .feature-chip:hover,
        .share-btn:hover {
          transform: translateY(-2px);
        }

        .stat-card__icon .ui-icon {
          animation: floatSoft 5s ease-in-out 1.2s infinite;
        }

        .tg-hub__tile {
          transition:
            transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
            border-color 0.3s ease,
            box-shadow 0.3s ease;
        }

        .proxy-row {
          transition:
            background 0.25s ease,
            border-color 0.25s ease,
            transform 0.22s ease;
        }

        .proxy-row:hover {
          transform: translateX(3px);
        }

        .proxy-btn {
          transition:
            transform 0.2s ease,
            border-color 0.22s ease,
            box-shadow 0.22s ease,
            background 0.22s ease;
        }

        .faq-item {
          transition: transform 0.22s ease;
        }

        .faq-item:hover {
          transform: translateX(3px);
        }

        .glass-card {
          transition:
            transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
            border-color 0.35s ease,
            box-shadow 0.35s ease,
            background 0.35s ease;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .page-shell > nav,
        .page-shell > header,
        .page-shell > section,
        .page-shell > main,
        .page-shell > footer,
        .hero-stagger > *,
        header .subtle-line {
          animation: none !important;
          opacity: 1 !important;
          transform: none !important;
        }

        .site-nav__brand .ui-icon,
        .stat-card__icon .ui-icon,
        .site-nav__list a:hover .site-nav__link-ico {
          transform: none;
        }

        .feature-chip:hover,
        .share-btn:hover,
        .proxy-row:hover,
        .faq-item:hover {
          transform: none;
        }

        .glass-card {
          transition:
            border-color 0.25s ease,
            box-shadow 0.25s ease,
            background 0.25s ease;
        }

        .glass-card:hover {
          transform: none;
        }
      }