/* Recorrido guiado (se superpone a toda la interfaz) */
#tour-layer { position: fixed; inset: 0; z-index: 300; }
#tour-layer .tour-block { position: fixed; inset: 0; background: transparent; }
#tour-layer.center .tour-block { background: rgba(2, 8, 22, .62); }
#tour-layer .tour-spot { position: fixed; border-radius: var(--r); box-shadow: 0 0 0 9999px rgba(2, 8, 22, .62); outline: 2px solid var(--y4); outline-offset: 0; pointer-events: none; transition: left .22s ease, top .22s ease, width .22s ease, height .22s ease; }
#tour-layer .tour-card { position: fixed; z-index: 2; width: 340px; max-width: calc(100vw - 24px); padding: 18px 20px 16px; background: var(--face-flat); color: var(--ink); border: 1px solid var(--outline); border-radius: var(--r); box-shadow: inset 0 1px 0 var(--rim), inset 0 -3px 0 var(--under), 0 6px 14px rgba(0, 0, 0, .45); }
#tour-layer.center .tour-card { left: 50%; top: 50%; transform: translate(-50%, -50%); width: 420px; }
.tour-count { margin: 0 0 4px; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.tour-card h3 { margin: 0 0 8px; font-size: 17px; }
.tour-body { margin: 0 0 14px; font-size: 13.5px; line-height: 1.5; color: var(--ink-2); }
.tour-bar { height: 6px; margin-bottom: 14px; border-radius: var(--r); background: var(--sunk); border: 1px solid var(--outline); box-shadow: var(--sunken); overflow: hidden; }
.tour-bar > i { display: block; height: 100%; background: var(--y3); box-shadow: inset 0 -2px 0 var(--y3u); transition: width .25s ease; }
.tour-actions { display: flex; align-items: center; gap: 8px; }
.tour-actions .spacer { flex: 1; }
@media (max-width: 719px) { #tour-layer.center .tour-card { width: calc(100vw - 24px); } }
@media (prefers-reduced-motion: reduce) { #tour-layer .tour-spot, .tour-bar > i { transition: none; } }
@media (max-width: 560px) { #tourbtn { display: none; } }  /* en el celular el recorrido se abre desde el menú de la cuenta */
