*{margin:0;padding:0;box-sizing:border-box}body{background:#0a0a0a;color:#e0e0e0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden;height:100vh;width:100vw}#app{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;position:relative}#visualizer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;opacity:.4}#content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:2rem;text-align:center;padding:2rem}#title{font-size:2.5rem;font-weight:200;letter-spacing:.5em;text-transform:uppercase;color:#fff;opacity:.9}#subtitle{font-size:.75rem;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:#666;margin-top:-1rem}#start-btn{background:transparent;border:1px solid #333;color:#ccc;font-size:.9rem;font-weight:400;letter-spacing:.2em;text-transform:uppercase;padding:1rem 3rem;cursor:pointer;border-radius:2px;transition:all .3s ease}#start-btn:hover{border-color:#666;color:#fff;background:#ffffff08}#start-btn.hidden{display:none}#status{display:flex;flex-direction:column;align-items:center;gap:.75rem;opacity:0;transition:opacity 1s ease}#status.visible{opacity:1}#genre-label{font-size:.7rem;font-weight:300;letter-spacing:.25em;text-transform:uppercase;color:#555;max-width:400px;line-height:1.6}#drop-attribution{position:fixed;bottom:3rem;left:50%;transform:translate(-50%);text-align:center;max-width:600px;opacity:0;transition:opacity 1.5s ease;z-index:2}#drop-attribution.visible{opacity:1}#drop-speaker{font-size:.65rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:#888;margin-bottom:.5rem}#drop-text{font-size:.85rem;font-weight:300;font-style:italic;color:#aaa;line-height:1.7}#connection-status{position:fixed;top:1rem;right:1rem;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:#444;z-index:2}#connection-status.error{color:#a44}#health-indicator{position:fixed;bottom:1rem;right:1rem;display:flex;align-items:center;gap:.4rem;font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;color:#444;z-index:2;opacity:0;transition:opacity 1s ease}#health-indicator.visible{opacity:1}#health-dot{width:6px;height:6px;border-radius:50%;background:#444;transition:background .5s ease}#health-dot.live{background:#4a4}#health-dot.buffering{background:#aa4}#health-dot.reconnecting{background:#a44}
