/* V46.41 (sitio) · chrome.css — V46.41: orbes sin desenfoque gigante y quietos fuera de Inicio, sin latidos infinitos, decoraciones solo en Inicio. Detalle: README.md → "Registro de cambios V46.41". */
/* V46.39 (sitio) · chrome.css — V46.39: barra inferior rediseñada (color por sección, íconos grandes, Agendar discreto), la música se esconde con la barra, encabezado dos y dos, y barras del teléfono a color. Detalle: README.md → "Registro de cambios V46.39". */
/* V46.38 (sitio) · chrome.css — V46.38: intro automática del logotipo (sin caja detrás del brillo), fondo que se tiñe por sección y botón «Arriba» de cristal al centro. Detalle: README.md → "Registro de cambios V46.38". */
/* V46.37 (sitio) · chrome.css — V46.37: NUEVO. Marco del sitio: logotipo protagonista que vuela al encabezado, encabezado limpio y transparente que se encoge, barra inferior flotante de cristal con «Agendar» al centro e indicador deslizante, burbuja de Aura, modo Art & Nails en Manicura, transiciones suaves y fondo vivo. Detalle: README.md → "Registro de cambios V46.37". */
/**
 * Se carga DESPUÉS de main.css, components.css y los estilos en línea de
 * index.html: aquí solo se ajusta la apariencia del marco (encabezado,
 * barra inferior, fondo). La lógica vive en js/chrome.js.
 */
:root {
    --vlt-hdr-h: 74px;
    --vlt-hdr-h-small: 62px;
    --vlt-bnav-h: 70px;                       /* alto de la cápsula inferior */
    --vlt-bnav-gap: 10px;                     /* separación con el borde */
    --vlt-bnav-space: calc(var(--vlt-bnav-h) + var(--vlt-bnav-gap) + env(safe-area-inset-bottom, 0px));
    --vlt-gold: #F2C94C;
    --vlt-an-pink: #FF5FAE;
    --vlt-an-teal: #2EC8D6;
}

/* ═══════════════════ ENCABEZADO ═══════════════════ */
.system-header {
    height: var(--vlt-hdr-h) !important;
    padding: 0 14px !important;
    transition: height .35s cubic-bezier(.2,.8,.2,1), background-color .35s ease, box-shadow .35s ease, border-color .35s ease, transform .35s cubic-bezier(.16,1,.3,1), opacity .35s ease !important;
}
body.vlt-scrolled .system-header { height: var(--vlt-hdr-h-small) !important; }
/* Transparente al inicio: sin fondo ni borde hasta que la persona se desplaza */
body.vlt-at-top .system-header {
    background: linear-gradient(180deg, rgba(5,4,8,.55), rgba(5,4,8,0)) !important;
    border-bottom-color: transparent !important; box-shadow: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
.hdr-left-group, .header-quick-btns { position: static !important; gap: 8px !important; }
.hdr-left-group > button:not(.header-logo), .header-quick-btns > * { position: relative; z-index: 2; }

/* Logo siempre al centro, grande */
.system-header .header-logo {
    position: absolute !important; left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    height: 62px !important; z-index: 1; padding: 0 !important;
    transition: height .35s cubic-bezier(.2,.8,.2,1), opacity .35s ease;
}
body.vlt-scrolled .system-header .header-logo { height: 54px !important; }
.system-header .header-logo .logo-img {
    max-height: none !important; height: 100% !important; width: auto !important;
    filter: drop-shadow(0 0 14px rgba(242,201,76,.35)) !important;
}
.system-header .header-logo .logo-an { display: none; height: 100%; width: auto; aspect-ratio: 1; border-radius: 50%; object-fit: cover;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(255,95,174,.8), 0 6px 18px rgba(0,0,0,.45); }
/* Mientras el logotipo grande vuela, el del encabezado espera invisible */
body.vlt-flying .system-header .header-logo { opacity: 0; pointer-events: none; }

/* Aura sale del encabezado (ahora es burbuja flotante) */
.system-header .hdr-aura-card { display: none !important; }
/* Agenda: píldora dorada más fina */
.system-header .hdr-agenda { min-height: 40px !important; height: 40px !important; padding: 0 14px !important; font-size: .82rem !important; gap: 6px !important; }
@media (max-width: 480px) {
    .system-header .hdr-agenda { width: 44px !important; height: 44px !important; padding: 0 !important; border-radius: 50% !important; justify-content: center; }
    .system-header .hdr-agenda span { display: none !important; }
}
/* Contactos de Art & Nails (solo en Manicura) */
.hdr-an { display: none !important; }
.hdr-an-btn {
    width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    color: #fff; text-decoration: none; font-size: 1.1rem;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.28);
    transition: transform .15s ease, background-color .2s ease;
}
.hdr-an-btn:hover, .hdr-an-btn:focus-visible { background: rgba(255,95,174,.25); }
.hdr-an-btn:active { transform: scale(.92); }

/* ── Modo Art & Nails: logo, colores y contactos de la marca ── */
body.vlt-mode-an .system-header .header-logo .logo-img { display: none; }
body.vlt-mode-an .system-header .header-logo .logo-an { display: block; }
body.vlt-mode-an .hdr-an { display: inline-flex !important; }
body.vlt-mode-an .system-header .hdr-buscar { display: none !important; }
body.vlt-mode-an:not(.vlt-at-top) .system-header {
    background:
        radial-gradient(60% 140% at 10% 0%, rgba(255,95,174,.28), transparent 70%),
        radial-gradient(60% 140% at 90% 0%, rgba(46,200,214,.24), transparent 70%),
        linear-gradient(180deg, rgba(14,8,16,.96), rgba(10,6,14,.9)) !important;
    border-bottom-color: rgba(255,95,174,.35) !important;
}
body.vlt-mode-an .system-header .hdr-agenda {
    background: linear-gradient(150deg, #FF8CC6, #FF5FAE 55%, #C93A86) !important; color: #fff !important;
    box-shadow: 0 4px 16px rgba(255,95,174,.45) !important;
}
body.vlt-mode-an .system-header .hdr-agenda i, body.vlt-mode-an .system-header .hdr-agenda span { color: #fff !important; }

/* ═══════════════════ LOGOTIPO PROTAGONISTA (Inicio) ═══════════════════ */
.vlt-hero-spacer { height: var(--vlt-hero-h, 46vh); min-height: 280px; max-height: 470px; pointer-events: none; }
.vlt-fly {
    position: fixed; left: 0; top: 0; z-index: 2100; pointer-events: none;
    transform-origin: 0 0; will-change: transform, opacity;
}
.vlt-fly img { display: block; width: 100%; height: auto; }
.vlt-fly .halo {
    position: absolute; inset: -18%; border-radius: 50%; z-index: -1;
    background: radial-gradient(circle at 50% 50%, rgba(242,201,76,.30) 0, rgba(242,201,76,.10) 34%, rgba(242,201,76,0) 62%);   /* V46.38: se apaga antes del borde (sin caja visible) */
    animation: vlt-halo 6s ease-in-out infinite;
}
/* Trazo del loto: el logotipo se descubre en círculo, como si se dibujara */
@property --vlt-draw { syntax: '<angle>'; inherits: false; initial-value: 360deg; }
.vlt-fly.is-drawing .art {
    -webkit-mask-image: conic-gradient(from 200deg at 50% 40%, #000 var(--vlt-draw), transparent calc(var(--vlt-draw) + 1deg));
    mask-image: conic-gradient(from 200deg at 50% 40%, #000 var(--vlt-draw), transparent calc(var(--vlt-draw) + 1deg));
    animation: vlt-draw .9s cubic-bezier(.45,.05,.3,1) forwards;
}
.vlt-fly.is-drawing img { animation: vlt-shine 2.4s ease-out forwards; }
.vlt-fly.is-breathing .art { animation: vlt-breathe 6s ease-in-out infinite; }
@keyframes vlt-draw { from { --vlt-draw: 0deg; } to { --vlt-draw: 360deg; } }
@keyframes vlt-shine { 0% { filter: drop-shadow(0 0 0 rgba(242,201,76,0)) brightness(.8); } 70% { filter: drop-shadow(0 0 26px rgba(242,201,76,.75)) brightness(1.25); } 100% { filter: drop-shadow(0 0 14px rgba(242,201,76,.4)) brightness(1); } }
@keyframes vlt-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.035); } }
@keyframes vlt-halo { 0%, 100% { opacity: .7; transform: scale(1); } 50% { opacity: 1; transform: scale(1.08); } }

/* ═══════════════════ BARRA INFERIOR FLOTANTE ═══════════════════ */
#bottom-nav {
    left: 12px !important; right: 12px !important; bottom: calc(var(--vlt-bnav-gap) + env(safe-area-inset-bottom, 0px)) !important;
    max-width: 620px; margin: 0 auto;
    height: var(--vlt-bnav-h); padding: 7px !important; gap: 2px !important; align-items: center !important;
    border-radius: 28px !important; border: 1px solid rgba(242,201,76,.32) !important;
    background: linear-gradient(180deg, rgba(26,22,14,.72), rgba(10,9,8,.86)) !important;
    backdrop-filter: blur(22px) saturate(160%) !important; -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.12), 0 0 30px rgba(242,201,76,.08) !important;
}
body.vlt-bars-hidden:not(.vlt-menu-open):not(:has(.side-menu.open)) #bottom-nav { transform: translateY(140%) !important; }
.bnav-ind {
    position: absolute; top: 7px; bottom: 7px; left: 0; width: 0; z-index: 0; border-radius: 21px; pointer-events: none;
    background: linear-gradient(155deg, #FFE7A0, #F2C94C 55%, #D9A92C);
    box-shadow: 0 6px 18px rgba(242,201,76,.45), inset 0 1px 0 rgba(255,255,255,.6);
    transition: transform .45s cubic-bezier(.2,.9,.2,1.05), width .45s cubic-bezier(.2,.9,.2,1.05), opacity .3s ease;
    opacity: 0;
}
.bnav-btn { position: relative; z-index: 1; height: 100%; min-height: 0 !important; border-radius: 21px !important; font-size: .68rem !important; font-weight: 800 !important; gap: 4px !important; color: rgba(255,248,230,.82) !important; }
.bnav-btn i { font-size: 1.35rem !important; }
.bnav-btn.bnav-active { background: transparent !important; box-shadow: none !important; color: #1C1405 !important; }
.bnav-btn.bnav-active i { color: #1C1405 !important; }
/* Agendar: botón dorado al centro, un poco elevado */
.bnav-agenda {
    flex: 0 0 auto; width: 64px; height: 64px; margin: -22px 4px 0; border-radius: 50%;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
    text-decoration: none; color: #1C1405; font: 900 .6rem 'Lato', sans-serif; letter-spacing: .02em; text-transform: uppercase;
    background: radial-gradient(120% 120% at 30% 15%, rgba(255,255,255,.6), rgba(255,255,255,0) 45%), linear-gradient(160deg, #FFE7A0, #F2C94C 45%, #C9971C);
    border: 3px solid rgba(10,9,8,.95);
    box-shadow: 0 10px 24px rgba(242,201,76,.45), 0 0 0 1px rgba(255,236,170,.7);
    position: relative; z-index: 2; -webkit-tap-highlight-color: transparent;
    transition: transform .15s ease;
}
.bnav-agenda i { font-size: 1.35rem; }
.bnav-agenda:active { transform: scale(.92); }
.bnav-agenda:focus-visible { outline: 3px solid #fff !important; outline-offset: 3px !important; }
body.vlt-mode-an .bnav-agenda { background: radial-gradient(120% 120% at 30% 15%, rgba(255,255,255,.6), rgba(255,255,255,0) 45%), linear-gradient(160deg, #FFB3D9, #FF5FAE 50%, #C93A86); color: #fff; box-shadow: 0 10px 24px rgba(255,95,174,.45); }
/* Sonido: punto «en vivo» */
#bnav-sonotherapy::after {
    content: ''; position: absolute; top: 9px; right: calc(50% - 18px); width: 8px; height: 8px; border-radius: 50%;
    background: #FF4D4D; box-shadow: 0 0 8px #FF4D4D, 0 0 0 2px rgba(10,9,8,.9);
    animation: vlt-live 1.8s ease-in-out infinite;
}
#bnav-sonotherapy:not(.bnav-active) i { color: #FFE7A0; filter: drop-shadow(0 0 6px rgba(242,201,76,.55)); }
@keyframes vlt-live { 50% { opacity: .35; } }

/* Espacio para la cápsula, los botones flotantes y el mini reproductor */
#main-content { padding-bottom: calc(var(--vlt-bnav-space) + 24px) !important; }
#main-footer { margin-bottom: calc(var(--vlt-bnav-space) + 8px) !important; }
.vb-fab, .vtx-fab { bottom: calc(var(--vlt-bnav-space) + 14px) !important; }
.oa-mini { bottom: calc(var(--vlt-bnav-space) + 10px) !important; }
body.oa-mini-on .vb-fab, body.oa-mini-on .vtx-fab, body.oa-mini-on .vlt-aura-fab { bottom: calc(var(--vlt-bnav-space) + 88px) !important; }

/* ═══════════════════ BURBUJA DE AURA ═══════════════════ */
.vlt-aura-fab {
    position: fixed; left: 16px; z-index: 9400; bottom: calc(var(--vlt-bnav-space) + 14px);
    width: 58px; height: 58px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; text-decoration: none;
    color: #04232a; font-size: 1.35rem;
    background: radial-gradient(120% 120% at 30% 15%, rgba(255,255,255,.65), rgba(255,255,255,0) 45%), linear-gradient(150deg, #9FFFF5, #2EE6D6 50%, #0FA3B8);
    box-shadow: 0 10px 28px rgba(46,230,214,.4), 0 0 0 1px rgba(200,255,250,.7);
    transition: transform .2s ease, bottom .3s ease, opacity .3s ease;
    -webkit-tap-highlight-color: transparent;
}
.vlt-aura-fab::before { content: ''; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid rgba(46,230,214,.45); animation: vlt-aura-ring 2.8s ease-out infinite; }
@keyframes vlt-aura-ring { from { transform: scale(.9); opacity: 1; } to { transform: scale(1.35); opacity: 0; } }
.vlt-aura-fab:active { transform: scale(.92); }
.vlt-aura-fab:focus-visible { outline: 3px solid #fff !important; outline-offset: 4px !important; }
body.vlt-bars-hidden:not(.vlt-menu-open) .vlt-aura-fab { bottom: calc(env(safe-area-inset-bottom, 0px) + 16px); }
body.vlt-menu-open .vlt-aura-fab { opacity: 0; pointer-events: none; }

/* ═══════════════════ SENSACIÓN GENERAL ═══════════════════ */
/* Transición suave entre secciones */
.view-section.active { animation: vlt-view-in .55s cubic-bezier(.2,.8,.2,1) backwards !important; }
@keyframes vlt-view-in { from { opacity: 0; transform: translateY(18px); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
/* Fondo vivo: la aurora dorada, muy sutil, en todo el sitio */
/* V46.41: sin desenfoque gigante (pesaba muchísimo); cada orbe es un degradado suave */
.ambient-engine .orb { opacity: .4 !important; filter: none !important; mix-blend-mode: normal !important; background: radial-gradient(closest-side, var(--orb-c, #C9971C), transparent) !important; will-change: auto !important; }
.ambient-engine .orb-1 { --orb-c: #C9971C; }
.ambient-engine .orb-2 { --orb-c: #1FA89C; opacity: .22 !important; }
.ambient-engine .orb-3 { --orb-c: #F2C94C; opacity: .2 !important; }
.ambient-engine .orb-4 { --orb-c: #8A5CD6; opacity: .16 !important; }
.ambient-engine .orb-5 { --orb-c: #E8A33D; opacity: .2 !important; }

@media (prefers-reduced-motion: reduce) {
    .view-section.active, .vlt-fly .halo, .vlt-fly.is-breathing .art, .vlt-aura-fab::before, #bnav-sonotherapy::after { animation: none !important; }
    .vlt-fly.is-drawing .art { animation: none !important; -webkit-mask-image: none; mask-image: none; }
    .bnav-ind, .system-header { transition: none !important; }
}
html.reduced-motion .view-section.active, html.reduced-motion .vlt-fly .halo, html.reduced-motion .vlt-fly.is-breathing .art { animation: none !important; }

/* ═══════════ V46.38 · FONDO QUE SE TIÑE SEGÚN LA SECCIÓN ═══════════ */
.ambient-engine .orb { transition: opacity 1.2s ease !important; }
body[data-vlt-route="restoration"] .ambient-engine .orb-1 { --orb-c: #B8742A; }
body[data-vlt-route="restoration"] .ambient-engine .orb-2 { --orb-c: #8C4B2A; }
body[data-vlt-route="restoration"] .ambient-engine .orb-4 { --orb-c: #D9A35C; }
body[data-vlt-route="beauty"] .ambient-engine .orb-1 { --orb-c: #FF5FAE; }
body[data-vlt-route="beauty"] .ambient-engine .orb-2 { --orb-c: #2EC8D6; }
body[data-vlt-route="beauty"] .ambient-engine .orb-3 { --orb-c: #9B6BFF; }
body[data-vlt-route="beauty"] .ambient-engine .orb-4 { --orb-c: #FF8FC7; }
body[data-vlt-route="beauty"] .ambient-engine .orb-5 { --orb-c: #FFD84D; }
body[data-vlt-route="sonotherapy"] .ambient-engine .orb-1 { --orb-c: #2EC8A0; }
body[data-vlt-route="sonotherapy"] .ambient-engine .orb-2 { --orb-c: #5A7CFF; }
body[data-vlt-route="sonotherapy"] .ambient-engine .orb-3 { --orb-c: #9B6BFF; }
body[data-vlt-route="sonotherapy"] .ambient-engine .orb-4 { --orb-c: #45D3E8; }
body[data-vlt-route="science"] .ambient-engine .orb-1 { --orb-c: #3E9B5A; }
body[data-vlt-route="science"] .ambient-engine .orb-2 { --orb-c: #8DBF4A; }
body[data-vlt-route="science"] .ambient-engine .orb-4 { --orb-c: #2F7D6B; }
body[data-vlt-route="technology"] .ambient-engine .orb-1, body[data-vlt-route="technology-en"] .ambient-engine .orb-1 { --orb-c: #2F6FE4; }
body[data-vlt-route="technology"] .ambient-engine .orb-2, body[data-vlt-route="technology-en"] .ambient-engine .orb-2 { --orb-c: #00B8D9; }
body[data-vlt-route="technology"] .ambient-engine .orb-4, body[data-vlt-route="technology-en"] .ambient-engine .orb-4 { --orb-c: #6A5CFF; }

/* ═══════════ V46.38 · BOTÓN «SUBIR» DE CRISTAL, AL CENTRO ═══════════
   Ya no se encima con «Reservar» (derecha) ni con Aura (izquierda). */
#vt-arriba.vt-arriba {
    left: 50% !important; right: auto !important; width: auto !important; height: 44px !important; padding: 0 1rem 0 .85rem !important;
    bottom: calc(var(--vlt-bnav-space) + 30px) !important;
    border-radius: 999px !important; display: inline-flex !important; align-items: center; gap: .45rem;
    font: 800 .86rem 'Lato', sans-serif !important; color: #FFE7A0 !important;
    background: linear-gradient(180deg, rgba(26,22,14,.7), rgba(10,9,8,.86)) !important;
    border: 1px solid rgba(242,201,76,.5) !important;
    -webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%);
    box-shadow: 0 10px 26px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.12) !important;
    transform: translate(-50%, 16px) scale(.9) !important;
}
#vt-arriba.vt-arriba::after { content: 'Arriba'; }
#vt-arriba.vt-arriba.ve { transform: translate(-50%, 0) !important; }
#vt-arriba.vt-arriba:hover, #vt-arriba.vt-arriba:focus-visible { background: linear-gradient(155deg, #FFE7A0, #F2C94C) !important; color: #1C1405 !important; }
#vt-arriba.vt-arriba:focus-visible { outline: 3px solid #00FFFF; outline-offset: 3px; }
body.oa-mini-on #vt-arriba.vt-arriba { bottom: calc(var(--vlt-bnav-space) + 96px) !important; }
body.vlt-bars-hidden:not(.vlt-menu-open) #vt-arriba.vt-arriba { bottom: calc(env(safe-area-inset-bottom, 0px) + 18px) !important; }
body.vlt-mode-an #vt-arriba.vt-arriba { color: #fff !important; border-color: rgba(255,95,174,.7) !important; background: linear-gradient(180deg, rgba(36,14,44,.75), rgba(18,8,24,.9)) !important; }
body.vlt-mode-an #vt-arriba.vt-arriba:hover, body.vlt-mode-an #vt-arriba.vt-arriba:focus-visible { background: linear-gradient(135deg, #FF5FAE, #9B6BFF) !important; color: #1C0B26 !important; }

/* V46.38 — Intro del logotipo: mientras viaja (≈3 s) la página no se desplaza */
html.vlt-intro-lock, html.vlt-intro-lock body { overflow: hidden !important; overscroll-behavior: none; }
html.vlt-intro-lock #main-content { overflow: hidden !important; }

/* ═══════════ V46.39 · BARRA INFERIOR REDISEÑADA ═══════════
   Íconos grandes (Font Awesome convierte <i> en <svg>, por eso se apunta a
   ambos), etiquetas claras, el botón activo toma el color de su sección y
   «Agendar» es más discreto. */
#bottom-nav { --bn-a: #F2C94C; --bn-b: #FFE7A0; --bn-ink: #1C1405; --bn-glow: rgba(242,201,76,.45); }
body[data-vlt-route="restoration"] #bottom-nav { --bn-a: #E39A4B; --bn-b: #FFD3A0; --bn-ink: #200F03; --bn-glow: rgba(227,154,75,.45); }
body[data-vlt-route="beauty"] #bottom-nav { --bn-a: #FF4FA8; --bn-b: #B99CFF; --bn-ink: #1C0B26; --bn-glow: rgba(255,79,168,.45); }
body[data-vlt-route="sonotherapy"] #bottom-nav { --bn-a: #2EC8D6; --bn-b: #9FF0F5; --bn-ink: #04232A; --bn-glow: rgba(46,200,214,.45); }
#bottom-nav .bnav-ind { background: linear-gradient(155deg, var(--bn-b), var(--bn-a)) !important; box-shadow: 0 6px 18px var(--bn-glow), inset 0 1px 0 rgba(255,255,255,.55) !important; transition: transform .45s cubic-bezier(.2,.9,.2,1.05), width .45s cubic-bezier(.2,.9,.2,1.05), opacity .3s ease, background .5s ease !important; }
#bottom-nav { border-color: color-mix(in srgb, var(--bn-a) 45%, transparent) !important; }
#bottom-nav .bnav-btn { font-size: .74rem !important; font-weight: 800 !important; letter-spacing: .01em; color: rgba(255,255,255,.9) !important; gap: 3px !important; }
#bottom-nav .bnav-btn i, #bottom-nav .bnav-btn svg { font-size: 1.45rem !important; width: 1.45rem; height: 1.45rem; }
#bottom-nav .bnav-btn.bnav-active, #bottom-nav .bnav-btn.bnav-active i, #bottom-nav .bnav-btn.bnav-active svg { color: var(--bn-ink) !important; }
#bottom-nav .bnav-agenda { width: 54px; height: 54px; margin: -14px 4px 0; font-size: .54rem; border-width: 2px; }
#bottom-nav .bnav-agenda i, #bottom-nav .bnav-agenda svg { font-size: 1.1rem; width: 1.1rem; height: 1.1rem; }
body.vlt-mode-an #bottom-nav .bnav-btn.bnav-active, body.vlt-mode-an #bottom-nav .bnav-btn.bnav-active i, body.vlt-mode-an #bottom-nav .bnav-btn.bnav-active svg { color: #1C0B26 !important; }

/* ═══════════ V46.39 · LA MÚSICA SE ESCONDE CON LA BARRA ═══════════
   Al bajar, la mini barra de Oasis se va junto con la navegación; solo
   quedan Aura y Reservar, abajo. */
.oa-mini { transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .3s ease !important; }
body.vlt-bars-hidden:not(.vlt-menu-open) .oa-mini { transform: translateY(calc(100% + var(--vlt-bnav-space) + 30px)) !important; opacity: 0; pointer-events: none; }
body.vlt-bars-hidden:not(.vlt-menu-open).oa-mini-on .vb-fab,
body.vlt-bars-hidden:not(.vlt-menu-open).oa-mini-on .vtx-fab,
body.vlt-bars-hidden:not(.vlt-menu-open).oa-mini-on .vlt-aura-fab { bottom: calc(env(safe-area-inset-bottom, 0px) + 16px) !important; }
body.vlt-bars-hidden:not(.vlt-menu-open) .vlt-aura-fab { bottom: calc(env(safe-area-inset-bottom, 0px) + 16px) !important; }

/* ═══════════ V46.39 · ENCABEZADO: DOS Y DOS ═══════════ */
.system-header .hdr-left-group, .system-header .header-quick-btns { gap: 14px !important; }
.system-header .hdr-left-group .hdr-an { display: none; }
body.vlt-mode-an .system-header .hdr-left-group .hdr-an { display: inline-flex !important; }

/* ═══════════ V46.39 · COLOR DEL TELÉFONO (fondo detrás de las barras del sistema) ═══════════ */
html { background-color: var(--vlt-sys, #050508) !important; transition: background-color .5s ease; }
body { background-color: var(--vlt-sys, #050508) !important; transition: background-color .5s ease; }
/* Franja bajo la barra de navegación del sistema (Android de borde a borde / iPhone): mismo color */
body::after { content: ''; position: fixed; left: 0; right: 0; bottom: 0; height: env(safe-area-inset-bottom, 0px); background: var(--vlt-sys, #050508); z-index: 2147483000; pointer-events: none; }

/* V46.41: los orbes solo se mueven en Inicio; en las demás secciones, quietos */
body:not([data-vlt-route="home"]) .ambient-engine .orb { animation-play-state: paused !important; }
/* V46.41: sin latidos infinitos en botones (Aura, punto en vivo) */
.vlt-aura-fab::before, #bnav-sonotherapy::after { animation: none !important; }
#bnav-sonotherapy::after { opacity: 1 !important; }
.vlt-aura-fab::before { opacity: .5; transform: scale(1.12); }
/* V46.41: decoraciones de Día de Muertos, campanita y brillo del pie: quietos o fuera de Inicio */
body:not([data-vlt-route="home"]) #vdm-capa { display: none !important; }
.vav-campana { animation: none !important; }
.footer-expediente-promo::before { animation: none !important; }