/* El mismo cielo de la portada; los controles permanecen visibles al leer. */
#lyrics-dialog{width:min(840px,calc(100vw - 28px));height:min(880px,94dvh);max-height:94dvh;padding:27px 28px 17px;overflow:hidden;box-sizing:border-box;color:#fff;border:1px solid #ffe5b8c4;border-radius:24px;background:linear-gradient(115deg,#f1a04a30,#ffd07b3b),url('../imagenes/cielo.jpg') 58% 38%/cover;box-shadow:0 20px 90px #3e213d66}
#lyrics-dialog[open]{display:flex;flex-direction:column;gap:14px}
#lyrics-dialog::backdrop{background:#33202955;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px)}
#lyrics-dialog .dialog-close{position:absolute;right:12px;top:12px;min-width:44px;min-height:44px;border:1px solid #ffedcc80;background:#6e341cbf;color:white;z-index:2}
#lyrics-dialog .lyrics-header{flex:none;display:block;padding:0 35px 0 0;text-shadow:0 2px 6px #472411}
#lyrics-dialog .eyebrow{color:#fff5de;font-size:12px;margin:0 0 9px;letter-spacing:.12em}
#lyrics-dialog h2{font-size:clamp(25px,3.5vw,36px);line-height:1.12;margin:0 0 10px;color:white}
#lyrics-subtitle{font-size:15px;line-height:1.35;margin:0;color:#fff9eb}
#lyrics-lines{flex:1 1 0;height:auto;min-height:110px;max-height:none;overflow:auto;overscroll-behavior:contain;padding:21px 14px;background:linear-gradient(110deg,#ffc46e8c,#ffd49166);border:1px solid #ffeacb66;border-radius:16px;scroll-behavior:smooth;scrollbar-color:#fff1caba #66332140}
#lyrics-lines p{font-family:system-ui,sans-serif;font-size:26px;font-weight:650;line-height:1.55;margin:0 0 22px;color:#291b14;overflow-wrap:anywhere;transition:color .25s,background .25s;padding:7px 12px;border-left:4px solid transparent;text-shadow:0 1px 2px #ffe2a6a8}
#lyrics-lines p.active{color:#fff;font-weight:800;border-left-color:#ffe49d;background:linear-gradient(110deg,#733c20dd,#60331ca8);border-radius:9px;text-shadow:0 2px 4px #3f210c;box-shadow:0 3px 17px #6c321833}
#lyrics-lines .lyrics-section{font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#432519}
#lyrics-lines .lyrics-empty{font-size:18px;color:#432519}
#lyrics-dialog .lyrics-footer{display:block;flex:0 0 auto;min-height:0;max-height:52dvh;overflow:auto;padding:0!important;margin:0!important;border:0;background:none;box-shadow:none;color:#fff;scrollbar-width:thin}
#lyrics-dialog .lyrics-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
#lyrics-dialog .button{min-height:44px;font-size:14px;font-weight:700;padding:10px 14px;background:#713c26eb;color:#fff;border:1px solid #ffe6b691;border-radius:10px;box-shadow:0 2px 6px #64352130;justify-content:center}
#lyrics-dialog .button:hover{background:#5d2e1deb;border-color:#fff3d7}
#lyrics-dialog .button:focus-visible,#lyrics-dialog summary:focus-visible{outline:3px solid white;outline-offset:3px}
#lyrics-dialog .lyrics-share-options{border:0;margin:12px 0 0;padding:0;display:block}
#lyrics-dialog .lyrics-share-options summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;min-height:50px;box-sizing:border-box;padding:11px 16px;border-radius:12px;font-size:18px;font-weight:800;color:#442619;background:linear-gradient(115deg,#ffe2a7,#ffc165);border:1px solid #fff1d1;box-shadow:0 3px 12px #59301838}
#lyrics-dialog .lyrics-share-options summary::-webkit-details-marker{display:none}
.lyrics-share-arrow{display:inline-flex;flex-shrink:0;line-height:1;animation:lyrics-down 1.8s ease-in-out infinite}
.lyrics-share-arrow svg{display:block;width:29px;height:29px;color:#392318}
#lyrics-dialog .lyrics-share-content{display:block;padding:8px 2px 0}
#lyrics-dialog .lyrics-share-content>p{font-size:13px;line-height:1.4;color:#fff9e9;text-shadow:0 1px 4px #3c210f;margin:0 0 9px}
#lyrics-dialog .lyrics-social-row{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;justify-content:flex-start}
#lyrics-dialog .lyrics-social-row .button{display:inline-flex;flex-direction:column;gap:5px;font-size:14px;min-height:71px;padding:9px 12px;text-decoration:none}
#lyrics-dialog .share-brand-icon,#share-dialog .share-brand-icon{width:22px;height:22px;flex-shrink:0;object-fit:contain;display:block}
#share-dialog .share-links{display:flex;flex-wrap:wrap;gap:9px}
#share-dialog .share-links>a,#share-dialog .share-links>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:95px;min-height:75px;padding:12px;border-radius:12px;background:#843e49;color:white;font-weight:700;border:1px solid #b78363}
#lyrics-dialog .lyrics-social-row small{display:block;font-size:10px;font-weight:500;color:#fff1d8;line-height:1.2}
#lyrics-dialog .lyrics-feedback{font-size:13px;line-height:1.35;color:#fff7e7;margin:8px 2px 0;text-shadow:0 1px 4px #402010;min-height:0}
#lyrics-dialog .lyrics-feedback:empty{display:none}
#lyrics-dialog button:disabled{opacity:.55;cursor:default}
#player #open-lyrics,#player #open-share{border:1px solid #bc855b80;border-radius:10px;font-weight:750;animation:lyrics-breathe 4s ease-in-out infinite;transform-origin:center}
#player #open-share{animation-delay:1s}
@keyframes lyrics-breathe{0%,63%,100%{transform:scale(1)}77%{transform:scale(1.075)}89%{transform:scale(1)}95%{transform:scale(1.025)}}
@keyframes lyrics-down{0%,100%{transform:translateY(-3px)}50%{transform:translateY(8px)}}
@media(max-width:760px){
 #lyrics-dialog{width:calc(100vw - 16px);height:min(850px,94dvh);padding:21px 15px 14px;border-radius:20px;background-position:61% 38%}
 #lyrics-dialog[open]{gap:10px}
 #lyrics-dialog .lyrics-header{padding-right:31px}
 #lyrics-dialog .eyebrow{font-size:10px;margin-bottom:6px}
 #lyrics-dialog h2{font-size:25px;margin-bottom:8px}
 #lyrics-subtitle{font-size:13px}
 #lyrics-lines{min-height:100px;padding:14px 8px}
 #lyrics-lines p{font-size:22px;line-height:1.5;margin-bottom:19px;padding:6px 8px}
 #lyrics-dialog .lyrics-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 #lyrics-dialog .lyrics-actions .button{font-size:12px;line-height:1.25;padding:8px 5px;min-width:0}
 #lyrics-dialog .lyrics-actions .button:first-child{grid-column:auto}
 #lyrics-dialog .lyrics-share-options{margin-top:9px}
 #lyrics-dialog .lyrics-share-options summary{font-size:17px;min-height:52px;padding:10px 13px}
 #lyrics-dialog .lyrics-social-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 #lyrics-dialog .lyrics-social-row .button{font-size:12px;min-width:0;padding:8px 3px;min-height:69px}
 body.player-compact #player{display:grid;grid-template-columns:minmax(0,1fr) 36px 46px;gap:7px;min-height:0;padding:9px 10px 10px;overflow:visible}
 body.player-compact #player .player-track{grid-row:1;grid-column:1;order:1}
 body.player-compact #player #player-size{grid-row:1;grid-column:2;order:2}
 body.player-compact #player .player-controls{grid-row:1;grid-column:3;order:3}
 body.player-compact #player .player-extras{display:flex!important;grid-row:2;grid-column:1/-1;order:4;gap:8px;width:100%;justify-self:stretch}
 body.player-compact #player .player-word-button{display:flex;flex:1;flex-direction:row;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:42px;font-size:13px;color:#fff9ed;background:#6333218a;border-color:#ffdda57d;padding:7px 6px}
 body.player-compact #player .player-word-button i{width:17px;height:17px;flex-shrink:0}
 body.player-compact footer{padding-bottom:170px}
 body.player-compact .toast{bottom:150px}
}
@media(prefers-reduced-motion:reduce){#player #open-lyrics,#player #open-share,.lyrics-share-arrow{animation:none}#lyrics-lines{scroll-behavior:auto}#lyrics-lines p{transition:none}}
