:root{--bg: #0f0f13;--bg-surface: #1a1a22;--bg-hover: #22222e;--bg-active: #2a1f3d;--border: #2e2e3e;--accent: #b47eef;--accent-dim: #7c4bb0;--text: #e8e0f0;--text-muted: #8a80a0;--text-faint: #5a5270;--song-list-width: 420px;--video-max-h: calc(100vh - 250px) }*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;height:100%}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;height:100vh;display:flex;flex-direction:column;overflow:hidden}#root{flex:1;min-height:0;display:flex;flex-direction:column}header{padding:1rem 1.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:1rem;flex-shrink:0}header h1{font-size:1.75rem;font-weight:700;color:var(--accent);letter-spacing:-.02em}header h1 .home-link{color:inherit;text-decoration:none;cursor:pointer}header .subtitle{color:var(--text-muted);font-size:.875rem}.dice-btn{background:none;border:none;cursor:pointer;color:var(--text-faint);padding:.25rem;border-radius:6px;display:flex;align-items:center;transition:color .15s}.dice-btn:hover{color:var(--accent)}.feedback-link{margin-left:auto;font-size:.8125rem;color:var(--text-muted);text-decoration:none;white-space:nowrap}.feedback-link:hover,.dice-btn.rolling{color:var(--accent)}.search-bar{padding:.875rem 1.5rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:1rem;background:var(--bg);flex-shrink:0}.search-input-wrap{position:relative;flex:1}.search-bar input{width:100%;background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1rem;font-family:inherit;padding:.625rem 2.4rem .625rem 1rem;outline:none;transition:border-color .15s;-webkit-appearance:none;-moz-appearance:none;appearance:none}.search-clear-btn{position:absolute;right:.55rem;top:50%;transform:translateY(-50%);border:none;background:transparent;color:var(--text-muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:.125rem;border-radius:4px}.search-clear-btn:hover{color:var(--text)}.search-clear-btn:focus-visible{outline:2px solid var(--accent-dim);outline-offset:1px}.search-bar input::placeholder{color:var(--text-faint)}.search-bar input:focus{border-color:var(--accent-dim)}.search-bar input::-webkit-search-cancel-button,.search-bar input::-webkit-search-decoration{-webkit-appearance:none;-moz-appearance:none;appearance:none}.result-count{color:var(--text-muted);font-size:.8125rem;white-space:nowrap;min-width:5rem;text-align:right}main{flex:1;display:flex;flex-direction:row;overflow:hidden;min-height:0}.results-panel{display:flex;flex-direction:column;width:var(--song-list-width);min-width:180px;flex-shrink:0;overflow:hidden;border-right:1px solid var(--border)}#results{list-style:none;flex:1;min-height:0;overflow-y:auto;overflow-y:overlay;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:transparent transparent}#results:hover,#results.is-scrolling{scrollbar-color:var(--border) transparent}#results::-webkit-scrollbar{width:6px}#results::-webkit-scrollbar-track{background:transparent}#results::-webkit-scrollbar-thumb{background:transparent;border-radius:3px}#results:hover::-webkit-scrollbar-thumb,#results.is-scrolling::-webkit-scrollbar-thumb{background:var(--border)}#results:hover::-webkit-scrollbar-thumb:hover{background:var(--accent-dim)}.result-item{display:flex;align-items:center;gap:1rem;padding:.875rem 1.5rem;border-bottom:1px solid var(--border);cursor:pointer;transition:background .1s}.result-item:hover{background:var(--bg-hover)}.result-item.active{background:var(--bg-active);border-left:3px solid var(--accent);padding-left:calc(1.5rem - 3px)}.result-item.active .song-title{color:var(--accent)}.result-text{flex:1;min-width:0}.song-title{font-size:.9375rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-artist{font-size:.8125rem;color:var(--text-muted);margin-top:.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-stream{font-size:.7rem;color:var(--text-faint);margin-top:.125rem}.song-stream-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.result-meta{display:flex;align-items:center;gap:.375rem;flex-shrink:0}.cover-indicator,.members-only-indicator{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--text-muted)}.time-badge{font-size:.75rem;color:var(--text-faint);font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}.no-results{padding:3rem 1.5rem;text-align:center;color:var(--text-muted);font-size:.9375rem}.resize-handle{width:4px;flex-shrink:0;cursor:col-resize;background:var(--border);transition:background .15s}.resize-handle:hover,.resize-handle.dragging{background:var(--accent-dim)}.player-panel{flex:1;padding:1.25rem;display:flex;flex-direction:column;gap:.875rem;overflow:hidden;min-width:0}.now-playing{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;padding:.75rem 1rem;display:flex;flex-direction:column;gap:.2rem;flex-shrink:0}.now-playing-label{font-size:.6875rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:600}.now-playing-title{font-size:.9375rem;font-weight:500;color:var(--text)}.now-playing-artist{font-size:.8125rem;color:var(--text-muted)}.now-playing-stream{font-size:.7rem;color:var(--text-faint);margin-top:.125rem}.yt-container{position:relative;width:100%;max-width:calc(var(--video-max-h) * 16 / 9);aspect-ratio:16 / 9;border-radius:8px;overflow:hidden;background:#000}.yt-container iframe{width:100%;height:100%;display:block}.yt-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0009;pointer-events:none}.yt-loading[hidden]{display:none}.yt-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.15);border-top-color:var(--accent);border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){body{height:auto;overflow:auto}main{flex-direction:column;overflow:visible}.results-panel{width:100%!important;border-right:none;border-bottom:1px solid var(--border);max-height:50vh}.resize-handle{display:none}.player-panel{padding:1rem}}