:root {
  --bg:#1a1a2e; --surface:#16213e; --accent:#e94560;
  --text:#eaeaea; --muted:#888; --chord:#f5a623; --fs:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:Georgia,serif;
  height:100dvh;display:flex;flex-direction:column}
header{background:var(--surface);padding:10px 14px;display:flex;
  flex-direction:column;gap:8px;flex-shrink:0;box-shadow:0 2px 8px #0006}
header h1{font-size:1rem;color:var(--accent);font-style:italic}
#q{width:100%;padding:8px 12px;border-radius:8px;border:none;
  background:var(--bg);color:var(--text);font-size:1rem;outline:none}
#app{flex:1;overflow:hidden;position:relative}
#list-view{height:100%;display:flex;flex-direction:column}
#list-view[hidden]{display:none}
#cover-view{flex:1;overflow:hidden;background:#111;position:relative}
#cover-img{width:100%;height:100%;object-fit:contain;display:block}
#build-ver{position:absolute;bottom:8px;right:10px;font-size:.62rem;
  color:#ccc;background:rgba(0,0,0,.55);padding:2px 7px;border-radius:4px;
  font-family:monospace;pointer-events:none}
#cover-embed{width:100%;height:100%;border:none;display:block}
.no-cover{display:flex;align-items:center;justify-content:center;
  height:100%;font-size:6rem;color:var(--accent);opacity:.25}
#results{list-style:none;overflow-y:auto}
#results li{padding:10px 14px;border-bottom:1px solid #222;cursor:pointer;
  display:flex;gap:10px;align-items:baseline}
#results li:active,#results li:hover{background:var(--surface)}
.num{color:var(--accent);font-size:.78rem;min-width:30px;font-family:monospace}
.title{font-weight:bold;font-size:.95rem}
.artist{color:var(--muted);font-size:.8rem}
#song-view{height:100%;display:flex;flex-direction:column}
#song-view[hidden]{display:none}
#song-header{background:var(--surface);padding:8px 10px;
  display:flex;gap:6px;align-items:center;flex-shrink:0}
#back{background:none;border:none;color:var(--accent);
  font-size:1.4rem;cursor:pointer;padding:2px 8px;line-height:1}
#song-meta{flex:1;min-width:0}
#song-title{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#song-artist{font-size:.72rem;color:var(--muted)}
#controls{display:flex;gap:6px;align-items:center;flex-shrink:0}
#controls button{background:var(--bg);border:1px solid #333;border-radius:6px;
  color:var(--text);font-size:.75rem;padding:4px 7px;cursor:pointer;white-space:nowrap}
#controls button.active{border-color:var(--accent);color:var(--accent)}
#scroll-speed{width:50px;vertical-align:middle;accent-color:var(--accent)}
/* Chord toggle switch */
#chord-wrap{display:flex;align-items:center;gap:4px;cursor:pointer;
  font-size:.7rem;color:var(--muted)}
#chord-toggle{appearance:none;-webkit-appearance:none;width:34px;height:20px;
  border-radius:10px;background:#444;position:relative;cursor:pointer;
  transition:background .2s;flex-shrink:0;border:1px solid #555}
#chord-toggle:checked{background:var(--accent);border-color:var(--accent)}
#chord-toggle::after{content:'';position:absolute;width:14px;height:14px;
  border-radius:50%;background:#fff;top:2px;left:2px;transition:left .2s}
#chord-toggle:checked::after{left:16px}
#song-body{flex:1;overflow-y:auto;padding:14px 16px;font-size:var(--fs);line-height:2.4}
section.verse,section.chorus{margin-bottom:18px}
section.chorus{border-left:3px solid var(--accent);padding-left:12px}
h3{font-size:.68rem;color:var(--muted);text-transform:uppercase;
  letter-spacing:1px;margin-bottom:4px;font-family:sans-serif}
p{margin-bottom:1px}
.cw{display:inline-block;vertical-align:bottom}
sup.ch{display:block;font-size:.68em;color:var(--chord);font-weight:bold;
  line-height:1;margin-bottom:1px;font-family:sans-serif}
body.no-chords sup.ch{display:none}
body.no-chords .cw{display:inline}
body.no-chords #song-body{line-height:1.7}
.comment{font-style:italic;color:var(--muted);font-size:.82em;margin:2px 0}
