/* ============================================================
   CULT — language suggestion popup (lang-popup)
   почти чёрный фон · тонкая тёмно-зелёная рамка · зелёное свечение
   ============================================================ */

.langpop {
  position: fixed; right: 24px; bottom: 24px; z-index: 900;
  width: min(360px, calc(100vw - 48px));
  background: rgba(8, 11, 10, 0.94);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(65, 253, 19, 0.22);
  border-radius: var(--radius, 16px);
  box-shadow: 0 0 18px rgba(65, 253, 19, 0.12), 0 18px 44px rgba(0, 0, 0, 0.55);
  padding: 18px 18px 16px;
  color: var(--text, #f3f5f2);
  font-family: var(--font-sans, "Jura", system-ui, sans-serif);
  opacity: 0; transform: translateY(14px); pointer-events: none;
  transition: opacity .35s ease, transform .35s ease;
}
.langpop.is-shown { opacity: 1; transform: none; pointer-events: auto; }

.langpop__head {
  margin: 0 0 10px; padding-right: 26px;
  font-family: var(--font-mono, var(--font-sans));
  font-size: .64rem; letter-spacing: .2em;
  color: var(--accent, #41FD13);
}
.langpop__dot {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent, #41FD13);
  box-shadow: 0 0 8px rgba(65, 253, 19, .8);
  vertical-align: 1px; margin: 0 3px;
  animation: langpopPulse 2s ease-in-out infinite;
}
@keyframes langpopPulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

.langpop__lead {
  margin: 0 0 7px; font-size: .95rem; line-height: 1.45;
  color: var(--text, #f3f5f2);
}
.langpop__ask {
  margin: 0; font-size: .74rem; line-height: 1.5;
  color: var(--text-muted, #8b938e);
}
.langpop__ask-loc {
  margin: 2px 0 0; font-size: .86rem; line-height: 1.5;
  color: var(--text-soft, #c4cbc6);
}

.langpop__actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.langpop__primary {
  border: 1px solid var(--accent, #41FD13); background: var(--accent, #41FD13);
  color: var(--accent-ink, #04130b); cursor: pointer;
  font-family: var(--font-sans, "Jura", system-ui, sans-serif);
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 10px 14px; border-radius: var(--radius-sm, 9px); white-space: nowrap;
  transition: box-shadow .2s ease;
}
.langpop__primary:hover { box-shadow: 0 0 16px rgba(65, 253, 19, .45); }
.langpop__ghost {
  background: transparent; border: 1px solid rgba(243, 245, 242, .14);
  color: var(--text-muted, #8b938e); cursor: pointer;
  font-family: var(--font-sans, "Jura", system-ui, sans-serif);
  font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  padding: 10px 14px; border-radius: var(--radius-sm, 9px); white-space: nowrap;
  transition: color .2s ease, border-color .2s ease;
}
.langpop__ghost:hover { color: var(--text, #f3f5f2); border-color: rgba(243, 245, 242, .3); }

.langpop__close {
  position: absolute; top: 6px; right: 8px; width: 30px; height: 30px;
  background: transparent; border: 0; border-radius: 8px; cursor: pointer;
  color: var(--text-faint, #5b635e); font-size: 1.05rem; line-height: 1;
  transition: color .2s ease;
}
.langpop__close:hover { color: var(--text, #f3f5f2); }

/* ------- mobile: floating bottom card ------- */
@media (max-width: 640px) {
  .langpop {
    left: 16px; right: 16px; width: auto;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    padding: 16px 16px 14px; border-radius: 14px;
  }
  .langpop__actions { margin-top: 12px; }
}
/* очень узкие экраны — кнопки вертикально */
@media (max-width: 379px) {
  .langpop__actions { flex-direction: column; }
  .langpop__primary, .langpop__ghost { width: 100%; }
}

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