/* Cantos Cósmicos · Revisión 9 */

/* 2. Letra en el display: dos líneas completas, centradas verticalmente.
      El tamaño se ajusta en armonio-rev9.js si el texto no cabe. */
#armonium .digital-screen .screen-lyrics-area{top:78.5%!important;height:21%!important;padding:0 1%!important;box-sizing:border-box!important}
#armonium .digital-screen #liveLyricsPosition{height:100%!important;display:flex!important;align-items:center!important}
#armonium .digital-screen #mobileLyrics{height:auto!important;max-height:100%!important;display:flex!important;flex-direction:column!important;justify-content:center!important;line-height:1.08!important}
#armonium .digital-screen #mobileLyrics .live-lyric-line{line-height:1.08!important;max-height:none!important;padding:0 0 .04em!important}

/* 6. Halo concéntrico con la perla (centro de la perla en el PNG: 48,4 % · 47,7 %). */
#armonium .floating-element.mode.active::after,
#armonium .floating-element.mode.latched::after{
 inset:auto!important;left:11.4%!important;top:12.2%!important;width:74%!important;height:71%!important;
 box-sizing:border-box;border-radius:50%!important;
}

/* 5. Interruptores arrastrables. */
#armonium .floating-element.chord,
#armonium .floating-element.toggle-note{touch-action:none!important;cursor:grab}
#armonium .floating-element.rev9-dragging{cursor:grabbing!important;transition:none!important}

/* 7. Enlace al libro en PDF, claramente visible. */
.lotus-pdf-links{margin:20px auto 6px!important;padding:0!important;border:0!important;background:none!important}
.lotus-pdf-links a#lotusPdfView{
 display:inline-flex!important;align-items:center;justify-content:center;
 padding:9px 26px!important;border-radius:999px!important;
 background:linear-gradient(180deg,#8a3a22 0%,#6a2614 55%,#561c0e 100%)!important;
 border:2px solid #d9b25c!important;color:#fff3d6!important;
 box-shadow:0 0 0 2px #f6e6bd,0 5px 12px rgba(74,32,12,.38),inset 0 1px 0 rgba(255,226,170,.35)!important;
 font:600 clamp(13px,1.6vw,16px)/1.15 'EB Garamond',Georgia,serif!important;letter-spacing:.2px;
 text-decoration:none!important;transition:transform .15s ease,box-shadow .15s ease,background .15s ease!important;
}
.lotus-pdf-links a#lotusPdfView:hover,.lotus-pdf-links a#lotusPdfView:focus-visible{
 transform:translateY(-2px);background:linear-gradient(180deg,#9c4428 0%,#7a2d18 55%,#621f10 100%)!important;
 box-shadow:0 0 0 2px #f6e6bd,0 8px 17px rgba(74,32,12,.45),inset 0 1px 0 rgba(255,226,170,.4)!important;outline:none}
.lotus-pdf-links a#lotusPdfView:active{transform:translateY(0)}
.lotus-pdf-links .rev9-pdf-text{display:flex;flex-direction:column;align-items:center;text-align:center}
.lotus-pdf-links .rev9-pdf-sub{font:500 italic clamp(10px,1.1vw,11.5px)/1.2 'EB Garamond',Georgia,serif;color:#f3d9a0;margin-top:1px}

/* 4. Nota de erratas en el pie de página; el correo es una imagen. */
footer .rev9-errata{max-width:640px;margin:4px auto 16px;padding:14px 18px;border:1px solid #d8c398;border-radius:12px;
 background:linear-gradient(110deg,#fffaf0,#f7edd9);font-style:normal;color:#5d4c33;text-align:center}
footer .rev9-errata strong{display:block;font:600 21px/1.2 'Cormorant Garamond',Georgia,serif;color:#3b3327;margin-bottom:4px}
footer .rev9-errata p{margin:0;font:400 16px/1.45 'EB Garamond',Georgia,serif}
footer .rev9-errata img{display:inline-block;height:1.32em;width:auto;vertical-align:-.36em;margin-left:3px}

/* 8. Learning: la tecla a pulsar parpadea con una sombra que sigue su forma real. */
@keyframes rev9KeyBlink{0%,100%{opacity:1}50%{opacity:.18}}
@keyframes rev9KeyGlow{
 0%,100%{filter:drop-shadow(0 0 1.5px rgba(255,205,90,1)) drop-shadow(0 0 3px rgba(255,170,40,.55))}
 50%{filter:drop-shadow(0 0 1px rgba(255,205,90,.25)) drop-shadow(0 0 2px rgba(255,170,40,.1))}
}
#armonium .piano-key.white.target,#armonium .piano-key.black.target{background:transparent!important;outline:none!important;box-shadow:none!important;
 animation:rev9KeyGlow 1s ease-in-out infinite}
#armonium .piano-key.target::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
 animation:rev9KeyBlink 1s ease-in-out infinite}
#armonium .piano-key.white.target::before{clip-path:var(--rev9-key-clip,none);border-radius:0 0 5px 5px;
 background:linear-gradient(180deg,rgba(255,214,110,.35) 0%,rgba(250,196,80,.72) 62%,rgba(240,170,50,.9) 100%)}
#armonium .piano-key.black.target::before{border-radius:0 0 4px 4px;
 background:linear-gradient(180deg,rgba(255,220,130,.55),rgba(248,190,70,.9))}
#armonium .piano-key .key-name{z-index:1}
#armonium .piano-key.target.pressed{animation:none}
#armonium .piano-key.target.pressed::before{animation:none;opacity:1}
@media (prefers-reduced-motion:reduce){
 #armonium .piano-key.target,#armonium .piano-key.target::before{animation-duration:2s}
}

/* Tempo: el recorrido del tirador termina dentro de la ranura dibujada (x 1148–1302 de 1448). */
#armonium .tempo-input{left:79.28%!important;width:10.64%!important}

/* Encendido pendiente de la primera interacción: el LED late suavemente. */
@keyframes rev9LedWait{0%,100%{opacity:0}50%{opacity:.45}}
#armonium.display-off.rev9-awaiting .led-indicator::after{content:"";position:absolute;left:22%;top:20%;width:56%;height:56%;border-radius:50%;pointer-events:none;
 background:radial-gradient(circle,rgba(120,255,150,.85) 0%,rgba(40,200,90,.45) 45%,rgba(20,120,50,0) 72%);animation:rev9LedWait 1.6s ease-in-out infinite}

/* Táctil (móvil/tableta): tocar las teclas no mueve el armonio ni hace zoom,
   pero un deslizamiento vertical sigue desplazando la página. */
.harmonium-window{touch-action:pan-x pan-y!important;overscroll-behavior-x:contain!important}
#armonium .keyboard,#armonium .piano-key{touch-action:pan-y!important;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}