html,body { width:100%; height:100%; margin:0; background:#090a0c; color:#f5f7fa; font-family:Arial,sans-serif; }
cast-media-player { position:fixed; inset:0; width:100%; height:100%; }
main { position:fixed; inset:0; z-index:1; pointer-events:none; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; }
main[hidden] { display:none; }
.glyph { width:90px; height:90px; border-radius:50%; background:#1d2630; display:grid; place-items:center; font-size:38px; color:#c6e8ff; }
h1 { max-width:70vw; margin:0; font-size:32px; font-weight:500; text-align:center; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
p { margin:0; color:#b4bdc7; font-size:18px; }
.track { width:52vw; max-width:720px; height:5px; background:#303840; border-radius:4px; overflow:hidden; }
#progress { width:0; height:100%; background:#79c9ff; }