@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@600;700&family=UnifrakturCook:wght@700&family=VT323&display=swap');
#lyricOverlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:100000;background:rgba(0,0,0,.55);backdrop-filter:blur(6px)}
#lyricOverlay.active{display:flex}
#lyricOverlay .lo-box{position:relative;max-width:80vw;max-height:70vh;padding:30px 40px;border-radius:16px;background:transparent;box-shadow:none}
#lyricOverlay .lo-text{color:#fff;font:600 26px/1.35 'Helvetica Neue', Arial, sans-serif;text-align:center;white-space:pre-wrap;word-wrap:break-word}
#lyricOverlay .lo-close{position:absolute;top:8px;right:10px;background:transparent;border:0;color:#fff;font-size:26px;cursor:pointer;opacity:.8}
#lyricOverlay .lo-close:hover{opacity:1}
#lyricOverlay .lo-fade-lines>div{opacity:0;transition:opacity .8s ease;margin:.25em 0}
#lyricOverlay .lo-reveal-up{animation:loReUp .6s ease both}
@keyframes loReUp{from{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(max-width:640px){#lyricOverlay .lo-box{max-width:92vw;padding:20px}#lyricOverlay .lo-text{font-size:20px}}

/* Streaming buttons */
#lyricOverlay .lo-streaming{display:flex;gap:12px;justify-content:center;margin-top:18px}
#lyricOverlay .lo-btn{width:44px;height:44px;display:inline-block;background:#fff;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.35);position:relative}
#lyricOverlay .lo-btn:hover{transform:translateY(-1px)}
#lyricOverlay .lo-spotify{background:#1DB954}
#lyricOverlay .lo-apple{background:linear-gradient(135deg,#fa233b,#b0121b)}
#lyricOverlay .lo-spotify:before{content:"";position:absolute;inset:10px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M12 0a12 12 0 1012 12A12 12 0 0012 0zm5.34 17.48a.75.75 0 01-1.03.25 12.22 12.22 0 00-10.62-.67.75.75 0 11-.56-1.4 13.73 13.73 0 0111.9.76.75.75 0 01.31 1.06zm1.47-3.26a.94.94 0 01-1.3.31 15.67 15.67 0 00-13.65-.88 0.94.94 0 11-.66-1.77 17.54 17.54 0 0115.28 1 .94.94 0 01.33 1.31zM19 10a1.12 1.12 0 01-1.54.37 18.91 18.91 0 00-15.43-1.14A1.12 1.12 0 011.6 7.95 21.16 21.16 0 0119.68 9a1.12 1.12 0 01.32 1z"/></svg>') center/contain no-repeat}
#lyricOverlay .lo-apple:before{content:"";position:absolute;inset:10px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M16.365 1.43c0 1.14-.454 2.27-1.186 3.096-.765.875-2.02 1.557-3.1 1.526-.133-1.093.51-2.26 1.216-2.99.79-.818 2.16-1.41 3.07-1.632zM20.23 17.23c-.59 1.33-.87 1.91-1.63 3.07-1.06 1.62-2.56 3.64-4.39 3.66-1.03.02-1.31-.67-3.04-.66-1.74.01-2.05.68-3.08.66-1.83-.02-3.35-1.85-4.41-3.47-3.02-4.64-3.34-10.1-1.48-12.94C3.6 5.36 5.26 4.54 6.78 4.52c1.81-.03 2.95.91 4.43.91 1.47 0 2.37-.91 4.43-.92 1.4-.02 2.89.76 3.78 2.07-3.32 1.83-2.79 6.63.81 7.57z"/></svg>') center/contain no-repeat}

/* Font options */
#lyricOverlay .lo-text.lo-font-haunt_serif{font-family: 'Cormorant Garamond', Georgia, serif !important; letter-spacing:.5px;}
#lyricOverlay .lo-text.lo-font-blackletter{font-family: 'UnifrakturCook', 'Old English Text MT', serif !important; letter-spacing:.4px;}
#lyricOverlay .lo-text.lo-font-terminal_mono{font-family: 'VT323','Courier New', monospace !important; letter-spacing:1px;}
#lyricOverlay .lo-text.lo-font-system_90s{font-family: "MS Sans Serif", Tahoma, Geneva, sans-serif !important; letter-spacing:.2px;}

/* Box themes */
.lo-box.glass_dark{background: rgba(10,10,14,.65); border:1px solid rgba(255,255,255,.08); backdrop-filter: blur(12px); box-shadow: 0 30px 80px rgba(0,0,0,.65);} 
.lo-box.vignette_glow{background: radial-gradient(ellipse at center, rgba(0,0,0,.35) 0%, rgba(0,0,0,.75) 70%); box-shadow: 0 0 120px rgba(120,80,200,.25), 0 25px 80px rgba(0,0,0,.7);}
.lo-box.terminal_green{background:#001400; border:1px solid #00ff88; box-shadow: inset 0 0 10px #00ff88, 0 0 30px rgba(0,255,136,.15);} 
.lo-box.win95_window{background:#c0c0c0; border:2px solid #fff; box-shadow: inset -2px -2px #808080, inset 2px 2px #fff, 4px 4px 0 0 #0003;}
.lo-box.mac_platinum{background:#ece9d8; border:1px solid #b8b6aa; box-shadow: inset 0 1px #fff, 0 6px 12px rgba(0,0,0,.25);} 
.lo-box.none{background: transparent; box-shadow:none;}


