.swVkCommunity {
  box-sizing: border-box;
  position: fixed;
  left: max(14px, env(safe-area-inset-left));
  bottom: max(14px, env(safe-area-inset-bottom));
  z-index: 120;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: min(278px, calc(100vw - 28px));
  min-height: 62px;
  padding: 9px 12px 9px 9px;
  border: 1px solid rgba(132, 202, 255, 0.42);
  border-radius: 17px;
  color: #eef8ff;
  background: linear-gradient(135deg, rgba(9, 36, 61, 0.96), rgba(7, 21, 37, 0.94));
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.30), 0 0 26px rgba(0, 119, 255, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.14);
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}

.swVkCommunity:hover,
.swVkCommunity:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(153, 219, 255, 0.78);
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.34), 0 0 34px rgba(0, 119, 255, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.20);
  filter: brightness(1.08);
  outline: none;
}

.swVkCommunity__mark {
  display: grid;
  flex: 0 0 42px;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #0077ff;
  box-shadow: 0 8px 18px rgba(0, 119, 255, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.30);
}

.swVkCommunity__mark img {
  display: block;
  width: 27px;
  height: 27px;
}

.swVkCommunity__copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.swVkCommunity__copy strong,
.swVkCommunity__copy small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.swVkCommunity__copy strong {
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.1;
}

.swVkCommunity__copy small {
  color: rgba(213, 235, 255, 0.76);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
}

.swVkCommunity__arrow {
  display: grid;
  flex: 0 0 22px;
  place-items: center;
  width: 22px;
  height: 22px;
  margin-left: auto;
  border: 1px solid rgba(164, 221, 255, 0.38);
  border-radius: 50%;
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
}

html:is(.upload-active, .sw-processing-final-active) .swVkCommunity,
body:is([data-page-state="uploading"], [data-page-state="processing"], [data-page-state="queued"], [data-page-state="paid-processing"]) .swVkCommunity,
body.modal-open .swVkCommunity,
html.sw-modal-open .swVkCommunity,
body.sw-modal-open .swVkCommunity,
html.swImpactGrowthOpen .swVkCommunity,
body.sw-everywhere-modal-open .swVkCommunity,
html:has(#resultOverlay.show) .swVkCommunity,
body:has(#resultOverlay.show) .swVkCommunity,
html:has(#resultModal.swModal.is-open) .swVkCommunity,
body:has(#resultModal.swModal.is-open) .swVkCommunity {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(12px) !important;
}

@media (min-width: 1024px) {
  /* The index legal rail gets VK as a measured fourth action. */
  body:has(.swFastLegalConsent) .swVkCommunity {
    left: var(--sw-vk-dock-left, calc(clamp(76px, 5.25vw, 102px) + min(620px, 42vw) + 14px));
    top: var(--sw-vk-dock-top, calc(100svh - 54px));
    right: auto;
    bottom: auto;
    width: min(278px, calc(100vw - var(--sw-vk-dock-left, 695px) - 24px));
    min-width: 0;
    min-height: 44px;
    height: 44px;
    padding: 4px 9px 4px 7px;
    border-radius: 999px;
    gap: 8px;
  }

  body:has(.swFastLegalConsent) .swVkCommunity__mark {
    flex-basis: 34px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
  }

  body:has(.swFastLegalConsent) .swVkCommunity__mark img { width: 22px; height: 22px; }
  body:has(.swFastLegalConsent) .swVkCommunity__copy strong { font-size: 11px; }
  body:has(.swFastLegalConsent) .swVkCommunity__copy small { font-size: 9px; }
  body:has(.swFastLegalConsent) .swVkCommunity__arrow { width: 18px; height: 18px; flex-basis: 18px; font-size: 12px; }
}

@media (min-width: 1100px) {
  /* minusa desktop: voice, offer and VK form one measured bottom rail. */
  body[data-page-state="idle"]:has(.swProofMetrics) .swVkCommunity {
    left: calc(var(--swDockX, 44px) + var(--swDockW, 460px) + var(--swDockGap, 16px));
    right: auto;
    top: auto;
    bottom: clamp(22px, 3.8vh, 34px);
    width: min(278px, calc(100vw - var(--swDockX, 44px) - var(--swDockW, 460px) - var(--swDockGap, 16px) - 20px));
    min-width: 0;
    min-height: 56px;
    height: 56px;
    padding: 7px 10px 7px 8px;
    border-radius: 999px;
    gap: 8px;
  }

  body[data-page-state="idle"]:has(.swProofMetrics) .swVkCommunity__mark {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
  }

  body[data-page-state="idle"]:has(.swProofMetrics) .swVkCommunity__mark img { width: 24px; height: 24px; }
  body[data-page-state="idle"]:has(.swProofMetrics) .swVkCommunity__copy strong { font-size: 12px; }
  body[data-page-state="idle"]:has(.swProofMetrics) .swVkCommunity__copy small { font-size: 10px; }
}

@media (max-width: 640px) {
  .swVkCommunity {
    left: max(10px, env(safe-area-inset-left));
    right: auto;
    bottom: calc(max(10px, env(safe-area-inset-bottom)) + 72px);
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 4px;
    border-radius: 50%;
    gap: 0;
  }

  .swVkCommunity__mark {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
  }

  .swVkCommunity__mark img {
    width: 24px;
    height: 24px;
  }

  .swVkCommunity__copy,
  .swVkCommunity__arrow { display: none; }
}

@media (min-width: 641px) and (max-width: 1099px) {
  .swVkCommunity {
    left: auto;
    right: max(10px, env(safe-area-inset-right));
    bottom: calc(max(10px, env(safe-area-inset-bottom)) + 72px);
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 4px;
    border-radius: 50%;
    gap: 0;
  }

  .swVkCommunity__mark {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
  }

  .swVkCommunity__mark img { width: 24px; height: 24px; }
  .swVkCommunity__copy,
  .swVkCommunity__arrow { display: none; }
}

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