*{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{display:flex;flex-direction:column;align-items:center;gap:.35rem;max-width:400px}.genre-row{display:flex;align-items:center;gap:.5rem}.genre-name{font-size:.7rem;font-weight:300;letter-spacing:.25em;text-transform:uppercase;color:#555;line-height:1.6}.genre-mute{background:none;border:none;cursor:pointer;font-size:.6rem;line-height:1;padding:.1rem;opacity:.3;transition:opacity .2s ease}.genre-mute:hover{opacity:.7}.genre-mute.muted{opacity:.5}#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}#menu-btn{position:fixed;top:1rem;left:1rem;background:none;border:none;color:#444;font-size:1.1rem;cursor:pointer;z-index:10;padding:.25rem;transition:color .2s ease;line-height:1}#menu-btn:hover{color:#888}#menu-btn.hidden{display:none}#menu-btn.open{color:#888}#drop-history{position:fixed;top:0;left:0;width:320px;height:100vh;background:#0a0a0af2;border-right:1px solid #1a1a1a;z-index:9;transform:translate(-100%);transition:transform .3s ease;display:flex;flex-direction:column;overflow:hidden}#drop-history.open{transform:translate(0)}#drop-history-header{padding:1rem 1rem .75rem 3rem;font-size:.6rem;font-weight:500;letter-spacing:.25em;text-transform:uppercase;color:#555;border-bottom:1px solid #1a1a1a;flex-shrink:0}#drop-history-list{flex:1;overflow-y:auto;padding:.5rem 0}#drop-history-list::-webkit-scrollbar{width:3px}#drop-history-list::-webkit-scrollbar-thumb{background:#222;border-radius:2px}.history-entry{padding:.75rem 1rem;border-bottom:1px solid #111;cursor:pointer;transition:background .2s ease}.history-entry:hover{background:#ffffff08}.history-entry.replaying{background:#ffffff0d}.history-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:.35rem}.history-speaker{font-size:.55rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#666}.history-time{font-size:.5rem;color:#333;letter-spacing:.05em}.history-quote{font-size:.7rem;font-weight:300;font-style:italic;color:#777;line-height:1.5}.history-replay{display:inline-block;font-size:.5rem;color:#444;margin-top:.3rem;letter-spacing:.1em;text-transform:uppercase}.history-entry:hover .history-replay{color:#888}.history-empty{padding:2rem 1rem;text-align:center;font-size:.6rem;color:#333;font-style:italic}#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}#play-toggle{position:fixed;bottom:2.5rem;right:1rem;background:none;border:none;color:#444;font-size:.75rem;cursor:pointer;z-index:2;padding:.25rem;transition:color .2s ease;letter-spacing:-.1em}#play-toggle:hover{color:#888}#play-toggle.hidden{display:none}#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}#version{position:fixed;bottom:1rem;left:1rem;font-size:.55rem;letter-spacing:.1em;color:#333;z-index:2}