/* recorrido.css — globos del recorrido guiado (js/recorrido.js). Núcleo de la plantilla del mando: cada app lleva una
   COPIA; se mejora en /root/mando/plantilla/web/ y se trae con tools/actualizar-nucleo.sh. Nació del tour del mando
   (web/tour.js + presentacion.css), generalizado. Solo var(--…) de tokens.css; una app con otros nombres los ajusta con
   las --rc-* (sin #hex: los respaldos son colores del sistema). Velo que bloquea toques, un foco con halo alrededor de
   lo señalado y un globo con flechita; en celular (≤ 700 px) una tarjeta pegada abajo (o arriba) con zonas seguras.
   Posiciones por CSSOM desde recorrido.js: aquí nada en línea. Movimiento reducido: sin animaciones. */
.recorrido{
  --rc-fondo:var(--superficie,Canvas);--rc-tinta:var(--tinta,CanvasText);--rc-tinta-2:var(--tinta-2,GrayText);
  --rc-linea:var(--linea,GrayText);--rc-marca:var(--marca,LinkText);--rc-sobre-marca:var(--sobre-marca,Canvas);
  --rc-velo:color-mix(in srgb,var(--noche-honda,CanvasText) 66%,transparent);--rc-halo:var(--sobre-noche,Canvas);
  --rc-radio:var(--radio-tarjeta,18px);--rc-curva:cubic-bezier(.2,.8,.2,1);
  position:fixed;inset:0;z-index:var(--rc-z,1000);pointer-events:none;font-family:var(--sans,system-ui,sans-serif)}
.rc-velo{position:absolute;inset:0;pointer-events:auto;background:transparent}
.rc-foco{position:fixed;border-radius:16px;pointer-events:none;box-shadow:0 0 0 3px var(--rc-halo),0 0 0 100vmax var(--rc-velo);
  transition:left .26s var(--rc-curva),top .26s var(--rc-curva),width .26s var(--rc-curva),height .26s var(--rc-curva)}
.rc-foco[hidden]{display:none}
.rc-sin-ancla .rc-velo{background:var(--rc-velo)}
.rc-seguro{position:fixed;left:0;top:0;width:0;height:0;visibility:hidden;pointer-events:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.rc-tarjeta{position:fixed;display:grid;gap:6px;box-sizing:border-box;padding:16px 16px 14px;border-radius:var(--rc-radio);pointer-events:auto;
  background:var(--rc-fondo);color:var(--rc-tinta);box-shadow:0 24px 60px -18px color-mix(in srgb,CanvasText 70%,transparent),0 0 0 1px color-mix(in srgb,var(--rc-tinta) 10%,transparent);
  animation:rc-entra .22s var(--rc-curva)}
.rc-tarjeta:focus{outline:none}
.rc-imagen{width:56px;height:56px;margin:-4px 0 2px;object-fit:contain}
.rc-imagen[hidden]{display:none}
.rc-paso{margin:0;font-size:.875rem;font-weight:700;letter-spacing:.02em;color:var(--rc-tinta-2)}
.rc-titulo{margin:0;font:800 1.25rem/1.2 var(--display,inherit);letter-spacing:-.01em;color:var(--rc-tinta)}
.rc-texto{margin:2px 0 0;font-size:1rem;line-height:1.45}
.rc-acc{display:flex;align-items:center;gap:8px;margin-top:10px}
.rc-b{min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;border:1px solid var(--rc-linea);background:transparent;color:var(--rc-tinta);font:inherit;font-weight:700;font-size:.9375rem;cursor:pointer;
  transition:transform .12s ease-out;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.rc-b:active:not(:disabled){transform:scale(.96)}
.rc-b:focus-visible{outline:3px solid var(--rc-marca);outline-offset:2px}
.rc-b:disabled{opacity:.4;cursor:default}
.rc-saltar{margin-right:auto;border-color:transparent;color:var(--rc-tinta-2);padding:0 10px;text-decoration:underline;text-underline-offset:3px}
.rc-sig{background:var(--rc-marca);border-color:var(--rc-marca);color:var(--rc-sobre-marca);min-width:96px}
@media (hover:hover) and (pointer:fine){.rc-b:hover:not(:disabled){border-color:var(--rc-tinta)}.rc-sig:hover{filter:brightness(1.08)}}
.rc-flecha{position:absolute;width:14px;height:14px;background:var(--rc-fondo);transform:rotate(45deg);box-shadow:-1px -1px 0 0 color-mix(in srgb,var(--rc-tinta) 10%,transparent)}
.rc-flecha[hidden]{display:none}
.rc-f-abajo{top:-7px;left:calc(var(--rc-pos,50%) - 7px)}
.rc-f-arriba{bottom:-7px;left:calc(var(--rc-pos,50%) - 7px);transform:rotate(225deg)}
.rc-f-derecha{left:-7px;top:calc(var(--rc-pos,50%) - 7px);transform:rotate(-45deg)}
.rc-f-izquierda{right:-7px;top:calc(var(--rc-pos,50%) - 7px);transform:rotate(135deg)}
.rc-centro{left:50%;top:50%;width:min(344px,calc(100vw - 24px));translate:-50% -50%}
.rc-abajo,.rc-arriba{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));width:auto}
.rc-abajo{bottom:max(12px,env(safe-area-inset-bottom))}
.rc-arriba{top:max(12px,env(safe-area-inset-top))}
.rc-abajo .rc-flecha,.rc-arriba .rc-flecha{display:none}
@keyframes rc-entra{from{opacity:0;transform:translateY(6px) scale(.97)}}
@media (prefers-reduced-motion:reduce){.rc-foco{transition:none}.rc-tarjeta{animation:none}.rc-b{transition:none}}
