/* Friends App · Conecta · Acciones y coincidencias v2
   Alcance deliberado: botones, mensajes y modales. No cambia las tarjetas,
   su fotografía, datos de nombre/edad/ubicación ni el radar. */

/* 01 · Tres acciones que se distinguen de un vistazo. */
body.bf-page-conocer .discover-actions .action-item {
  position: relative;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  gap: 7px !important;
  transition: transform .22s cubic-bezier(.2,.8,.2,1);
}
body.bf-page-conocer .discover-actions .action-item:has(button:active) { transform: translateY(2px); }
body.bf-page-conocer .discover-actions button {
  box-sizing: border-box;
  display: grid !important;
  place-items: center;
  width: 60px !important;
  height: 60px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border-radius: 21px !important;
  outline: none;
  cursor: pointer;
  transition: transform .22s cubic-bezier(.2,.75,.2,1), box-shadow .22s ease, background .2s ease, border-color .2s ease !important;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
body.bf-page-conocer .discover-actions .btn-discard {
  border: 1px solid #e7e8ec !important;
  background: #fff !important;
  color: #68717e !important;
  box-shadow: 0 6px 20px rgba(27,38,52,.075) !important;
}
body.bf-page-conocer .discover-actions .btn-like-friend {
  border: 1px solid #d9e6fd !important;
  background: #edf4ff !important;
  color: #245eb5 !important;
  box-shadow: 0 7px 24px rgba(43,100,194,.11) !important;
}
body.bf-page-conocer .discover-actions .btn-like-match {
  border: 1px solid #e64961 !important;
  background: linear-gradient(135deg,#fa6479 0%,#e84367 100%) !important;
  color: #fff !important;
  box-shadow: 0 9px 23px rgba(229,63,102,.25) !important;
}
body.bf-page-conocer .discover-actions button svg {
  width: 27px !important;
  height: 27px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .22s ease;
}
body.bf-page-conocer .discover-actions .action-label {
  max-width: none;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #575d66 !important;
  font-size: .74rem !important;
  font-weight: 700 !important;
  letter-spacing: -.01em;
  text-align: center;
  line-height: 1.35 !important;
}
body.bf-page-conocer .discover-actions .action-item--follow .action-label { color: #245eb5 !important; }
body.bf-page-conocer .discover-actions .action-item--match .action-label { color: #d23d5e !important; }
body.bf-page-conocer .discover-actions button:focus-visible {
  outline: 3px solid rgba(42,109,206,.55) !important;
  outline-offset: 4px;
}
body.bf-page-conocer .discover-actions button:hover:not(:disabled) { transform: translateY(-4px) scale(1.035) !important; }
body.bf-page-conocer .discover-actions button:active:not(:disabled) { transform: scale(.91) !important; }
body.bf-page-conocer .discover-actions .btn-like-match:hover:not(:disabled) { box-shadow: 0 12px 29px rgba(229,63,102,.32) !important; }
body.bf-page-conocer .discover-actions .btn-like-friend:hover:not(:disabled) { box-shadow: 0 10px 26px rgba(43,100,194,.18) !important; }
body.bf-page-conocer .discover-actions [hidden] { display: none !important; }

/* 02 · Confirmación discreta y botón de deshacer. */
body.bf-page-conocer .discover-feedback { z-index: 1305; }
body.bf-page-conocer .discover-feedback .bubble {
  box-sizing: border-box;
  min-height: 57px;
  max-width: min(90vw,340px);
  padding: 11px 16px !important;
  border: 1px solid #eceef2 !important;
  border-radius: 19px !important;
  background: rgba(255,255,255,.97) !important;
  box-shadow: 0 17px 44px rgba(23,31,46,.19) !important;
  color: #242934 !important;
  font-size: 14px;
  font-weight: 680;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  transform: translateY(14px) scale(.93);
  transition: transform .28s cubic-bezier(.16,1,.3,1);
}
body.bf-page-conocer .discover-feedback.show .bubble { transform: translateY(0) scale(1); }
body.bf-page-conocer .discover-feedback .bubble .ico {
  width: 38px !important;
  height: 38px !important;
  flex: 0 0 38px;
  display: grid !important;
  place-items: center;
  border-radius: 13px;
  background: #f1f3f6 !important;
  color: #697586 !important;
  font: 800 23px/1 system-ui,sans-serif;
}
body.bf-page-conocer .discover-feedback.seguir .bubble .ico { background: #eaf2ff !important; color:#2463bc !important; }
body.bf-page-conocer .discover-feedback.match .bubble .ico { background: #ffe8ee !important; color:#e4466d !important; }
body.bf-page-conocer .discover-feedback.pasar .bubble .ico { background: #eff0f3 !important; color:#626b76 !important; }
body.bf-page-conocer .discover-feedback .bubble .txt { color:#252a34 !important; line-height:1.3; }
body.bf-page-conocer .undo-bar {
  border: 1px solid #e9ebf0;
  border-radius: 18px;
  background: rgba(255,255,255,.97);
  color: #252a32;
  box-shadow: 0 11px 35px rgba(22,27,36,.14);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.bf-page-conocer .undo-bar .undo-text { color: #49515d; }
body.bf-page-conocer .undo-bar .undo-btn { background:#252a36; color:#fff; border-radius:11px; }

/* 03 · Match privado: blanco limpio, accesible y preparado para móvil. */
body.bf-page-conocer .match-overlay {
  z-index: 1250;
  background: rgba(17,25,39,.55);
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
  transition: opacity .28s ease;
}
body.bf-page-conocer .match-sheet {
  box-sizing: border-box;
  display: block;
  position: fixed;
  z-index: 1251;
  top: 50% !important;
  bottom: auto !important;
  left: 50% !important;
  right: auto !important;
  width: min(92vw, 474px) !important;
  max-width: 474px !important;
  max-height: min(90dvh, 760px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding: 23px 28px 27px !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  border-radius: 29px !important;
  background: #fff !important;
  color: #222733 !important;
  box-shadow: 0 28px 88px rgba(12,20,34,.30) !important;
  visibility: hidden;
  opacity: 0;
  transform: translate(-50%,-46%) scale(.95);
  transition: transform .36s cubic-bezier(.17,.94,.25,1), opacity .25s ease, visibility .25s ease !important;
  outline: none;
}
body.bf-page-conocer .match-sheet.show {
  visibility: visible;
  opacity: 1;
  transform: translate(-50%,-50%) scale(1);
}
body.bf-page-conocer .match-sheet .match-handle { display: none; }
body.bf-page-conocer .match-sheet .match-close {
  display: grid;
  place-items: center;
  position: absolute;
  top: 16px;
  right: 16px;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid #eff0f3;
  border-radius: 13px;
  background: #f6f7f9;
  color: #596270;
  cursor: pointer;
}
body.bf-page-conocer .match-close svg { width:19px; height:19px; stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; }
body.bf-page-conocer .match-close:focus-visible,
body.bf-page-conocer .match-sheet button:focus-visible,
body.bf-page-conocer .match-message-form textarea:focus-visible { outline:3px solid rgba(35,101,201,.4); outline-offset:2px; }
body.bf-page-conocer .match-celebration {
  position: relative;
  display: grid;
  place-items: center;
  width: 118px;
  height: 109px;
  margin: 2px auto 0;
}
body.bf-page-conocer .match-celebration-icon {
  display: grid;
  place-items: center;
  width: 70px;
  height: 70px;
  border: 1px solid #ffe1e8;
  border-radius: 25px;
  background: linear-gradient(145deg,#ffecf0,#ffd7e2);
  color: #df4068;
  box-shadow: 0 12px 34px rgba(220,68,109,.17);
}
body.bf-page-conocer .match-celebration-icon svg { width:36px; height:36px; stroke:currentColor; stroke-width:1.7; fill:none; stroke-linecap:round; stroke-linejoin:round; }
body.bf-page-conocer .match-spark {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 3px;
  background: #f296ab;
  opacity: .9;
}
body.bf-page-conocer .match-spark--one { top: 14px; left:8px; transform:rotate(25deg); }
body.bf-page-conocer .match-spark--two { top: 9px; right: 11px; width:7px; height:7px; background:#a5bfea; transform:rotate(42deg); }
body.bf-page-conocer .match-spark--three { bottom: 8px; right:15px; width:6px; height:6px; background:#e7c587; border-radius:50%; }
body.bf-page-conocer .match-sheet.show .match-celebration-icon { animation: friends-match-bloom .72s cubic-bezier(.16,1,.3,1) both; }
body.bf-page-conocer .match-sheet.show .match-spark { animation: friends-match-spark .8s ease-out both; }
body.bf-page-conocer .match-sheet.show .match-spark--two { animation-delay:.09s; }
body.bf-page-conocer .match-sheet.show .match-spark--three { animation-delay:.16s; }
body.bf-page-conocer .match-eyebrow { margin:0 auto 8px; color:#cf496d; font-size:10px; letter-spacing:.15em; font-weight:830; }
body.bf-page-conocer .match-sheet h2 { margin:0 0 9px; font-size:clamp(24px,3.5vw,29px); font-weight:810; letter-spacing:-.04em; line-height:1.14; color:#1e2330; }
body.bf-page-conocer .match-sheet #matchText { margin:0 auto 10px !important; max-width:360px; color:#596170; font-size:14px; line-height:1.55; opacity:1; }
body.bf-page-conocer .match-sheet #matchText strong { color:#222a35; }
body.bf-page-conocer .match-sheet .match-help-text { margin:0 0 20px; color:#89909d; font-size:12px; line-height:1.45; opacity:1; }
body.bf-page-conocer .match-message-form { margin:0 0 13px; gap:10px; }
body.bf-page-conocer .match-message-form label { color:#252b36; font-size:13px; font-weight:760; }
body.bf-page-conocer .match-message-form textarea {
  min-height:86px;
  max-height:160px;
  padding:13px 14px;
  border:1px solid #e4e8ef;
  border-radius:16px;
  background:#f8f9fb;
  color:#252b36;
  box-shadow:none;
  font-size:16px;
  line-height:1.4;
}
body.bf-page-conocer .match-message-form textarea:focus { border-color:#b8cae7; box-shadow:0 0 0 3px rgba(44,107,206,.07); }
body.bf-page-conocer .match-icebreakers { display:flex; flex-wrap:wrap; gap:7px; }
body.bf-page-conocer .match-icebreaker {
  min-height:37px;
  padding:8px 11px;
  border:1px solid #e8eaf0;
  border-radius:12px;
  background:#f7f8fb;
  color:#4e5663;
  font-size:12px;
  font-weight:580;
  text-align:left;
  line-height:1.35;
  cursor:pointer;
  transition:background .2s ease,border-color .2s ease;
}
body.bf-page-conocer .match-icebreaker:hover { border-color:#cddcee; background:#edf3ff; }
body.bf-page-conocer .match-send-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  border:0;
  border-radius:14px;
  background:#232a38 !important;
  color:#fff !important;
  font-size:13px;
  font-weight:740;
  box-shadow:none;
}
body.bf-page-conocer .match-send-btn svg { width:17px; height:17px; stroke:currentColor; stroke-width:1.8; fill:none; stroke-linecap:round; stroke-linejoin:round; }
body.bf-page-conocer .match-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
body.bf-page-conocer .match-actions button {
  box-sizing:border-box;
  min-height:45px;
  height:auto;
  padding:10px 12px;
  border:1px solid #e4e7ec;
  border-radius:14px;
  background:#fff;
  color:#434c5b;
  font-family: inherit;
  font-size:12.5px;
  font-weight:700;
  line-height:1.3;
  cursor:pointer;
}
body.bf-page-conocer .match-actions #matchChatBtn { border-color:#d6e4fa; background:#edf4ff; color:#245eb5; }
body.bf-page-conocer .match-actions button:hover { filter:brightness(.97); }
body.bf-page-conocer .match-message-status { color:#788190; font-size:12px; }

/* 04 · También pulimos el aviso de personas que te eligieron. */
body.bf-page-conocer .discover-incoming-sheet {
  border:1px solid #e8ebf1;
  background:#fff;
  box-shadow:0 27px 80px rgba(15,24,43,.2);
  transition:transform .32s cubic-bezier(.16,.9,.25,1),opacity .26s ease;
}
body.bf-page-conocer .discover-incoming-sheet-icon {
  border-radius:15px;
  background:#fff0f3;
  color:#d84b70;
}
body.bf-page-conocer .discover-incoming-sheet-summary { border-radius:19px; background:#f8f9fc; }
body.bf-page-conocer .discover-incoming-sheet-count { background:linear-gradient(135deg,#f47b92,#df4b6e); color:white; }
body.bf-page-conocer .discover-incoming-see { border-radius:15px; background:#252c39 !important; color:white !important; }

@keyframes friends-match-bloom {
  0% { opacity:0; transform:scale(.56) rotate(-12deg); }
  58% { opacity:1; transform:scale(1.12) rotate(4deg); }
  100% { transform:scale(1) rotate(0); }
}
@keyframes friends-match-spark {
  0% { opacity:0; transform:translateY(9px) scale(.3); }
  60% { opacity:.94; transform:translateY(-5px) scale(1.18); }
  100% { opacity:.85; transform:translateY(0) scale(1); }
}

@media (max-width:640px) {
  body.bf-page-conocer .discover-actions button { width:52px !important; height:52px !important; border-radius:17px !important; }
  body.bf-page-conocer .discover-actions button svg { width:24px !important; height:24px !important; }
  body.bf-page-conocer .discover-actions .action-label { font-size:.68rem !important; }
  body.bf-page-conocer .match-sheet {
    top:auto !important;
    bottom:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    max-width:none !important;
    max-height:min(91dvh,780px);
    padding:11px 19px calc(21px + env(safe-area-inset-bottom)) !important;
    border-radius:27px 27px 0 0 !important;
    border-bottom:none !important;
    transform:translateY(105%);
    opacity:1;
  }
  body.bf-page-conocer .match-sheet.show { transform:translateY(0); }
  body.bf-page-conocer .match-sheet .match-handle { display:block; width:36px; height:4px; margin:0 auto 0; background:#d4d9e2; }
  body.bf-page-conocer .match-sheet .match-close { top:16px; right:18px; }
  body.bf-page-conocer .match-celebration { height:94px; margin:-3px auto 0; }
  body.bf-page-conocer .match-celebration-icon { width:61px; height:61px; border-radius:21px; }
  body.bf-page-conocer .match-celebration-icon svg { width:31px; height:31px; }
  body.bf-page-conocer .match-sheet h2 { font-size:25px; }
  body.bf-page-conocer .match-sheet .match-help-text { margin-bottom:15px; }
}
@media (max-width:420px) {
  body.bf-page-conocer .discover-actions .action-item { height:auto !important; grid-template-rows: 45px 16px !important; gap:5px !important; padding:0 !important; }
  body.bf-page-conocer .discover-actions button { width:45px !important; height:45px !important; border-radius:15px !important; }
  body.bf-page-conocer .discover-actions button svg { width:22px !important; height:22px !important; }
  body.bf-page-conocer .discover-actions .action-label { font-size:.66rem !important; }
  body.bf-page-conocer .match-sheet { padding-inline:16px !important; }
  body.bf-page-conocer .match-actions { grid-template-columns:1fr; }
  body.bf-page-conocer .match-message-form textarea { min-height:75px; }
}
@media (prefers-reduced-motion:reduce) {
  body.bf-page-conocer .discover-actions button,
  body.bf-page-conocer .discover-actions .action-item,
  body.bf-page-conocer .discover-feedback .bubble,
  body.bf-page-conocer .match-overlay,
  body.bf-page-conocer .match-sheet,
  body.bf-page-conocer .discover-incoming-sheet { transition-duration:.01ms !important; animation:none !important; }
  body.bf-page-conocer .match-celebration-icon,
  body.bf-page-conocer .match-spark { animation:none !important; }
}

/* ==============================================================
   Friends App · Conecta v3 · Visor sin marcos y acciones accesibles
   --------------------------------------------------------------
   Único bloque de composición final: prevalece sobre las reglas
   históricas de conecta-production, sin alterar fotos, datos, radar,
   modales ni el comportamiento del backend.
   --conecta-header-h y --conecta-dock-clearance se sincronizan con
   el encabezado y el menú real por conecta-viewport-v3.js.
============================================================== */
html.bf-conecta-page-locked {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}
body.bf-page-conocer {
  --conecta-header-h: 66px;
  --conecta-dock-clearance: calc(77px + env(safe-area-inset-bottom, 0px));
  --conecta-viewport-height: 100dvh;
  height: 100vh;
  height: var(--conecta-viewport-height, 100dvh);
  min-height: 0 !important;
  max-height: var(--conecta-viewport-height, 100dvh);
  overflow: hidden !important;
  overscroll-behavior: none;
}

/* Independencia visual de los tres botones: ningún cristal o halo
   persiste debajo de Seguir, ni aparece al posar el cursor. */
body.bf-page-conocer #discoverActions {
  isolation: isolate;
  max-height: none;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
body.bf-page-conocer #discoverActions .action-item,
body.bf-page-conocer #discoverActions .action-item:hover,
body.bf-page-conocer #discoverActions .action-item:focus-within,
body.bf-page-conocer #discoverActions .action-item:active {
  border: 0 !important;
  outline: 0;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
body.bf-page-conocer #discoverActions .action-item::before,
body.bf-page-conocer #discoverActions .action-item::after { display: none !important; }
body.bf-page-conocer #discoverActions .action-label,
body.bf-page-conocer #discoverActions .action-item--follow .action-label,
body.bf-page-conocer #discoverActions .action-item--match .action-label,
body.bf-page-conocer #discoverActions .action-item:hover .action-label {
  color: #fff !important;
  opacity: 1 !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.72);
  font-weight: 800 !important;
}
body.bf-page-conocer #discoverActions .btn-like-friend,
body.bf-page-conocer #discoverActions .btn-like-friend:hover:not(:disabled),
body.bf-page-conocer #discoverActions .btn-like-friend:focus-visible {
  border: 1px solid #bed8ff !important;
  background: #ebf3ff !important;
  color: #1f63bd !important;
  box-shadow: 0 4px 14px rgba(17,64,137,.14) !important;
}
body.bf-page-conocer #discoverActions .btn-like-match,
body.bf-page-conocer #discoverActions .btn-like-match:hover:not(:disabled),
body.bf-page-conocer #discoverActions .btn-like-match:focus-visible {
  border: 1px solid #dd2849 !important;
  background: #e93455 !important;
  color: #fff !important;
  box-shadow: 0 5px 18px rgba(224,43,78,.25) !important;
}
body.bf-page-conocer #discoverActions .btn-discard:hover:not(:disabled) {
  border-color: #dce0e6 !important;
  background: #fff !important;
  color: #565f6c !important;
}
body.bf-page-conocer #discoverActions button {
  -webkit-tap-highlight-color: transparent;
  appearance: none;
  -webkit-appearance: none;
}
body.bf-page-conocer #discoverActions button:disabled { opacity: .57; cursor: not-allowed; }
body.bf-page-conocer #discoverActions button:focus-visible {
  outline: 3px solid #222a39 !important;
  outline-offset: 3px;
}

/* Fotografía encerrada en su propio visor, sin esquinas redondeadas,
   sin selección de texto, arrastre, menú de imagen ni zoom gestual.
   El carrusel de fotos conserva sus gestos horizontales con Pointer Events. */
body.bf-page-conocer .discover-wrapper,
body.bf-page-conocer .discover-card,
body.bf-page-conocer .discover-media-carousel,
body.bf-page-conocer .discover-media-viewport,
body.bf-page-conocer .discover-media-track,
body.bf-page-conocer .discover-media-slide {
  border-radius: 0 !important;
}
body.bf-page-conocer .discover-wrapper,
body.bf-page-conocer .discover-card {
  border: 0 !important;
  box-shadow: none !important;
}
body.bf-page-conocer .discover-media-carousel,
body.bf-page-conocer .discover-media-viewport {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden !important;
  touch-action: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
  overscroll-behavior: contain;
}
body.bf-page-conocer .discover-media-track,
body.bf-page-conocer .discover-media-slide {
  height: 100%;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none !important;
}
body.bf-page-conocer .discover-media-slide > img,
body.bf-page-conocer .discover-media-slide > video,
body.bf-page-conocer .discover-card > img,
body.bf-page-conocer .discover-card > video {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  -webkit-touch-callout: none !important;
  touch-action: none !important;
}
body.bf-page-conocer .discover-media-slide:not(.is-active) { pointer-events: none; }

@media (max-width: 899px) {
  body.bf-page-conocer .conocer {
    position: fixed !important;
    z-index: 1 !important;
    top: var(--conecta-header-h) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    inset: var(--conecta-header-h) 0 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.bf-page-conocer .discover-wrapper {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    aspect-ratio: auto !important;
    transform: none !important;
    overflow: hidden !important;
  }
  body.bf-page-conocer .discover-card { inset: 0 !important; }
  body.bf-page-conocer #discoverActions {
    position: absolute !important;
    z-index: 88 !important;
    top: auto !important;
    right: auto !important;
    bottom: var(--conecta-dock-clearance) !important;
    left: 50% !important;
    display: flex !important;
    width: max-content !important;
    max-width: calc(100vw - 16px) !important;
    height: auto !important;
    min-height: 0 !important;
    flex-direction: row !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: clamp(10px, 4vw, 25px) !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-50%) !important;
  }
  body.bf-page-conocer #discoverActions .action-item {
    display: grid !important;
    width: clamp(62px, 20vw, 78px) !important;
    min-width: 0 !important;
    height: auto !important;
    grid-template-rows: auto auto !important;
    gap: 6px !important;
    justify-items: center !important;
    padding: 0 !important;
    transform: none !important;
  }
  body.bf-page-conocer #discoverActions button {
    width: clamp(45px, 13vw, 56px) !important;
    min-width: 0 !important;
    height: clamp(45px, 13vw, 56px) !important;
    min-height: 0 !important;
    border-radius: 17px !important;
  }
  body.bf-page-conocer #discoverActions button svg { width: 24px !important; height: 24px !important; }
  body.bf-page-conocer #discoverActions .action-label {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    white-space: nowrap;
  }
  /* Se conserva el bloque de nombre/edad/ubicación en la fotografía,
     pero se deja libre la franja inferior para el nuevo dock. */
  body.bf-page-conocer .card-info {
    bottom: calc(var(--conecta-dock-clearance) + 88px) !important;
  }
  body.bf-page-conocer .discover-empty {
    border-radius: 0 !important;
  }
}

/* Modo apaisado: el menú desaparece y las acciones van a la derecha.
   Quedan fuera de la fotografía visible (nunca detrás del dock). */
@media (max-width: 899px) and (orientation: landscape) and (max-height: 540px) {
  body.bf-page-conocer .discover-wrapper { right: 88px !important; width: calc(100% - 88px) !important; }
  body.bf-page-conocer #discoverActions {
    top: 50% !important;
    right: 6px !important;
    bottom: auto !important;
    left: auto !important;
    display: flex !important;
    width: 76px !important;
    max-width: 76px !important;
    flex-direction: column !important;
    gap: 9px !important;
    transform: translateY(-50%) !important;
  }
  body.bf-page-conocer #discoverActions .action-item { width: 68px !important; gap: 2px !important; }
  body.bf-page-conocer #discoverActions button { width: 42px !important; height: 42px !important; border-radius: 13px !important; }
  body.bf-page-conocer #discoverActions button svg { width: 21px !important; height: 21px !important; }
  body.bf-page-conocer #discoverActions .action-label { font-size: 10px !important; }
  body.bf-page-conocer .card-info { bottom: 16px !important; }
}

/* Escritorio: la página no tiene scroll y el visor central ocupa toda
   la altura disponible. Los paneles laterales conservan su función. */
@media (min-width: 900px) {
  body.bf-page-conocer .conocer {
    position: fixed !important;
    top: var(--conecta-header-h) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: min(100%, 1260px) !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 620px) minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: clamp(12px, 2vw, 24px) !important;
    overflow: hidden !important;
  }
  body.bf-page-conocer .discover-wrapper {
    position: relative !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: stretch !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    border-radius: 0 !important;
    transform: none !important;
    overflow: hidden !important;
  }
  body.bf-page-conocer .discover-actions {
    position: relative !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: min(100%, 116px) !important;
    align-self: center !important;
    justify-self: start !important;
    transform: none !important;
  }
  body.bf-page-conocer .discover-native-toolbar {
    max-height: calc(var(--conecta-viewport-height, 100dvh) - var(--conecta-header-h) - 16px) !important;
    overflow-y: auto !important;
    scrollbar-width: none;
  }
  body.bf-page-conocer .discover-native-toolbar::-webkit-scrollbar { display: none; }
}
@media (min-width: 900px) and (max-width: 1120px) {
  body.bf-page-conocer .conocer {
    grid-template-columns: minmax(0, 1fr) minmax(0, 56vw) minmax(100px, 1fr) !important;
  }
}
@media (max-height: 520px) and (min-width:900px) {
  body.bf-page-conocer .discover-card > .card-info { bottom: 10px !important; }
  body.bf-page-conocer #discoverActions button { width: 43px !important; height: 43px !important; }
}
@media (prefers-reduced-motion: reduce) {
  body.bf-page-conocer #discoverActions *,
  body.bf-page-conocer .discover-media-track { transition: none !important; animation: none !important; }
}

/* Los antiguos recortes redondeados de Safari/Chrome seguían activos
   aunque border-radius fuese cero. Conservamos contain:paint sin clip circular. */
@media (min-width: 900px) {
  body.bf-page-conocer .discover-wrapper,
  body.bf-page-conocer .discover-card,
  body.bf-page-conocer .discover-media-carousel,
  body.bf-page-conocer .discover-media-viewport {
    clip-path: inset(0) !important;
    -webkit-clip-path: inset(0) !important;
  }
  /* El grid, y no el left:50% heredado, coloca el panel lateral. */
  body.bf-page-conocer .discover-native-toolbar {
    position: relative !important;
    z-index: 10;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
    align-self: center !important;
    width: min(100%, 330px) !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
  }
}

/* El apilado heredado aplicaba una altura mínima de 992px en PC:
   la ficha se salía del visor y ocultaba nombre y ciudad. */
@media (min-width: 900px) {
  body.bf-page-conocer .discover-wrapper > .discover-card {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  body.bf-page-conocer .discover-card > .discover-media-carousel,
  body.bf-page-conocer .discover-card .discover-media-track,
  body.bf-page-conocer .discover-card .discover-media-slide {
    height: 100% !important;
    max-height: 100% !important;
  }
}

/* Colocación explícita de los datos tras estabilizar el alto del visor.
   Evita que otros estilos generales conviertan el texto en flujo normal. */
body.bf-page-conocer .discover-card > .card-info {
  position: absolute !important;
  z-index: 84 !important;
  display: block !important;
  margin: 0 !important;
  pointer-events: none !important;
}
@media (max-width: 899px) {
  body.bf-page-conocer .discover-card > .card-info {
    right: 18px !important;
    bottom: calc(var(--conecta-dock-clearance) + 88px) !important;
    left: 18px !important;
    width: auto !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}
@media (min-width: 900px) {
  body.bf-page-conocer .discover-card > .card-info {
    right: 22px !important;
    bottom: 22px !important;
    left: 22px !important;
  }
}

/* Etiquetas blancas en todos los estados, con sombra oscura
   para mantener la lectura sobre cualquier fotografia. */
body.bf-page-conocer #discoverActions .action-label,
body.bf-page-conocer #discoverActions .action-item--follow .action-label,
body.bf-page-conocer #discoverActions .action-item--match .action-label,
body.bf-page-conocer #discoverActions .action-item:hover .action-label {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.85),
               0 2px 9px rgba(0,0,0,.55) !important;
}