:root{--bg:#0e0d12;--panel:#17161d;--panel-2:#1f1e27;--text:#ece9f1;--muted:#9a94a8;--accent:#1db954;--accent-2:#b98fff;--border:#2a2833}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;min-height:100vh}main{max-width:960px;margin:0 auto;padding:2rem 1.25rem 4rem}header.site{border-bottom:1px solid var(--border);padding-bottom:1.25rem;margin-bottom:1.5rem}header.site h1{margin:0;font-size:2rem;letter-spacing:.02em}header.site h1 span{color:var(--accent)}header.site p{margin:.35rem 0 0;color:var(--muted)}.sync-row{display:flex;align-items:center;gap:.7rem;margin-top:.9rem;flex-wrap:wrap}.sync-btn{background:transparent;border:1px solid var(--accent);border-radius:8px;color:var(--accent);font-family:inherit;font-size:.85rem;font-weight:600;padding:.45rem .9rem;cursor:pointer}.sync-btn:hover:not(:disabled){background:var(--accent);color:#06210f}.sync-btn:disabled{opacity:.5;cursor:default}.sync-msg{color:var(--muted);font-size:.85rem}.search-row{display:flex;gap:.5rem;margin-bottom:1.5rem}.search-row input{flex:1 1;background:var(--panel);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1rem;padding:.7rem .9rem}.search-row input:focus{outline:2px solid var(--accent);outline-offset:-1px}.search-row button{background:var(--accent);border:none;border-radius:8px;color:#06210f;font-size:1rem;font-weight:600;padding:0 1.4rem;cursor:pointer}.search-row button:disabled{opacity:.5;cursor:default}.notice{background:var(--panel);border:1px solid var(--border);border-left:4px solid var(--accent-2);border-radius:8px;padding:.9rem 1.1rem;color:var(--muted);margin-bottom:1.5rem}.notice code{color:var(--text)}h2.section{font-size:.85rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:2rem 0 .75rem}.track-list{display:flex;flex-direction:column;gap:.4rem}.track{display:flex;align-items:center;gap:.8rem;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:.5rem .8rem;text-decoration:none;color:var(--text)}.track:hover{background:var(--panel-2)}.track img{width:44px;height:44px;border-radius:4px;object-fit:cover}.track .meta{min-width:0}.track .meta .name{font-weight:600}.track .meta .artists,.track .meta .name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track .meta .artists{color:var(--muted);font-size:.85rem}.playlist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-gap:.8rem;gap:.8rem}.playlist-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:.7rem;cursor:pointer;text-align:left;color:var(--text);font-family:inherit;font-size:.9rem}.playlist-card:hover{background:var(--panel-2)}.playlist-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;margin-bottom:.5rem}.playlist-card .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlist-card .owner{color:var(--muted);font-size:.8rem}.error{color:#ff8a8a;margin:1rem 0}.muted{color:var(--muted)}.nav-link{border:1px solid var(--accent-2);border-radius:8px;color:var(--accent-2);font-size:.85rem;font-weight:600;padding:.45rem .9rem;text-decoration:none}.nav-link:hover{background:var(--accent-2);color:#1a0f2e}.rec-filters{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}.chip{background:var(--panel);border:1px solid var(--border);border-radius:999px;color:var(--muted);cursor:pointer;font-family:inherit;font-size:.78rem;padding:.3rem .7rem}.chip:hover{background:var(--panel-2)}.chip.on{border-color:var(--accent);color:var(--text)}.chip .n{color:var(--muted);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;margin-left:.25rem}.rec-count{font-size:.82rem;margin:0 0 .6rem}.rec-scroll{overflow-x:auto;border:1px solid var(--border);border-radius:10px}.rec-table{border-collapse:collapse;width:100%;font-size:.85rem;white-space:nowrap}.rec-table th{background:var(--panel-2);color:var(--muted);font-weight:600;text-align:left;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;padding:.55rem .7rem;position:-webkit-sticky;position:sticky;top:0}.rec-table td{border-top:1px solid var(--border);padding:.5rem .7rem;vertical-align:top}.rec-table tbody tr:hover{background:var(--panel)}.rec-table .num{text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.rec-table .dim{color:var(--muted)}.rec-name{white-space:normal;min-width:200px;font-weight:600}.rec-name a{color:var(--text);text-decoration:none}.rec-name a:hover{color:var(--accent)}.rec-table .chords{white-space:normal;min-width:220px;color:var(--accent-2);font-size:.82rem}.badge{border-radius:999px;font-size:.72rem;font-weight:600;padding:.15rem .5rem;white-space:nowrap}.progression{display:flex;flex-direction:column;gap:.25rem;align-items:flex-start}.progression-pattern{background:var(--panel-2);border:1px solid var(--border);color:var(--muted);white-space:normal}.sheet-cell{white-space:nowrap}.sheet-cell a{color:var(--accent);text-decoration:none;margin-right:.35rem}.sheet-up{background:var(--panel);border:1px solid var(--border);border-radius:999px;color:var(--muted);cursor:pointer;font-family:inherit;font-size:.75rem;line-height:1;padding:.2rem .45rem}.sheet-up:hover:not(:disabled){background:var(--panel-2);color:var(--text)}.sheet-up:disabled{cursor:default;opacity:.6}.conf-human-verified{background:rgba(29,185,84,.16);color:#45d67e;border-color:rgba(29,185,84,.5)}.conf-cross-validated{background:rgba(90,150,255,.16);color:#79a8ff;border-color:rgba(90,150,255,.5)}.conf-single-source{background:rgba(225,190,70,.16);color:#e0c04d;border-color:rgba(225,190,70,.5)}.conf-conflicting{background:rgba(255,120,120,.16);color:#ff8a8a;border-color:rgba(255,120,120,.5)}.conf-unverified{background:rgba(154,148,168,.16);color:var(--muted);border-color:rgba(154,148,168,.4)}.credits{color:var(--muted);font-size:.78rem;line-height:1.5;margin-top:2rem;border-top:1px solid var(--border);padding-top:1rem}.sort-select{background:var(--panel);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit;font-size:.9rem;padding:0 .8rem}.facet{margin-bottom:.7rem}.facet-label{display:flex;align-items:center;gap:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.35rem}.facet-label,.mode-toggle{color:var(--muted);font-size:.72rem}.mode-toggle{background:var(--panel);border:1px solid var(--border);border-radius:999px;cursor:pointer;font-family:inherit;padding:.15rem .6rem;text-transform:none;letter-spacing:normal}.mode-toggle.on{border-color:var(--accent);color:var(--accent)}.chip.chord{color:var(--accent-2)}.chip.on.chord{border-color:var(--accent-2)}.chip.static{cursor:default;color:var(--text)}.more-filters{color:var(--muted);font-size:.8rem;padding:.2rem 0;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.clear-filters,.more-filters{background:none;border:none;cursor:pointer;font-family:inherit}.clear-filters{color:var(--accent);font-size:inherit;padding:0;text-decoration:underline}.song-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-gap:.7rem;gap:.7rem}.song-card{display:flex;flex-direction:column;gap:.45rem;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:.8rem .9rem;color:var(--text);text-decoration:none}.song-card:hover{background:var(--panel-2);border-color:var(--accent)}.song-card-head{display:flex;flex-direction:column}.song-title{font-weight:600;line-height:1.25}.song-artist{color:var(--muted);font-size:.82rem}.verified{color:var(--accent);margin-left:.35rem;font-size:.85em}.verified.big{font-size:.6em;vertical-align:middle}.song-facts{display:flex;flex-wrap:wrap;gap:.35rem}.fact{background:var(--panel-2);border:1px solid var(--border);border-radius:6px;color:var(--muted);font-size:.75rem;padding:.1rem .45rem;white-space:nowrap}.fact.key{color:var(--accent);border-color:rgba(29,185,84,.4)}.song-facts.big .fact{font-size:.85rem;padding:.2rem .6rem}.song-chords{color:var(--accent-2);font-size:.82rem;line-height:1.4}.song-nav{margin-bottom:1.2rem}.song-head h1{margin:0;font-size:1.7rem;line-height:1.2}.song-artist-line{color:var(--muted);margin:.25rem 0 .8rem;font-size:1.05rem}.spotify-embed{border:0;border-radius:12px;margin:1rem 0 .4rem}.song-section{margin-top:1.6rem}.chip-row{display:flex;flex-wrap:wrap;gap:.35rem}.structure-bar{display:flex;gap:2px;border-radius:8px;overflow:hidden;margin-bottom:.8rem}.structure-seg{flex-basis:0;min-width:1.4rem;padding:.35rem 0;text-align:center;font-size:.75rem;font-weight:700;color:#0d0c11}.seg-0{background:#45d67e}.seg-1{background:#79a8ff}.seg-2{background:#b98fff}.seg-3{background:#e0c04d}.seg-4{background:#ff9d76}.seg-5{background:#6fd6d0}.section-list{display:flex;flex-direction:column;gap:.5rem}.section-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:.7rem .9rem}.section-card-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:.6rem;margin-bottom:.35rem;font-size:.85rem}.section-label{font-weight:700}.badge.cadence{background:var(--panel-2);border:1px solid var(--border);color:var(--muted)}.section-chords{color:var(--accent-2);font-size:.9rem;line-height:1.5}.section-romans{color:var(--muted);font-size:.82rem;margin-top:.25rem;line-height:1.5}.progression-text{color:var(--accent-2);line-height:1.6;font-size:.92rem;overflow-wrap:anywhere}.theory-grid{display:flex;flex-direction:column;gap:.8rem}.theory-row .facet-label{margin-bottom:.3rem}.dim{color:var(--muted)}@media (max-width:560px){.song-grid{grid-template-columns:1fr}.song-head h1{font-size:1.4rem}}.transpose-ctl{display:inline-flex;align-items:center;gap:.4rem;margin-left:.8rem;text-transform:none;letter-spacing:normal}.transpose-val{color:var(--muted);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;min-width:1.6rem;text-align:center}.transpose-val.on{color:var(--accent);font-weight:700}.transpose-key{color:var(--accent);font-weight:600}.transpose-hint{font-size:.8rem;margin:.5rem 0 0}.metronome{display:flex;align-items:center;gap:.5rem;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:.55rem .8rem;margin-top:.8rem;width:-moz-fit-content;width:fit-content}.metro-play{background:var(--accent);border:none;border-radius:999px;color:#06210f;cursor:pointer;font-size:.85rem;width:2rem;height:2rem;line-height:1}.metro-play.on{background:#ff8a8a;color:#2b0b0b}.metro-bpm{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:600;min-width:4.4rem;text-align:center}.metro-meter{font-size:.8rem}.loop-ctl{display:inline-flex;align-items:center;gap:.5rem;margin-left:auto}.loop-btn{background:var(--panel-2);border:1px solid var(--border);border-radius:999px;color:var(--muted);cursor:pointer;font-family:inherit;font-size:.75rem;padding:.2rem .6rem}.loop-btn:hover{color:var(--text);border-color:var(--accent)}.loop-btn.on{background:rgba(255,138,138,.15);border-color:rgba(255,138,138,.5);color:#ff8a8a}.loop-pos{color:var(--accent);font-size:.75rem;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;white-space:nowrap}.section-card.looping{border-color:var(--accent)}main.home{max-width:1040px}.hero{padding:1.5rem 0 2rem;border-bottom:1px solid var(--border);margin-bottom:2rem}.hero h1{font-size:clamp(2.4rem,6vw,3.6rem);margin:0;letter-spacing:-.02em}.hero h1 span{color:var(--accent)}.hero-tag{color:var(--muted);font-size:1.1rem;line-height:1.5;max-width:46ch;margin:.7rem 0 1.4rem}.hero-cta{display:flex;flex-wrap:wrap;gap:.6rem}.btn-ghost,.btn-primary{border-radius:999px;font-size:.95rem;font-weight:600;padding:.6rem 1.3rem;text-decoration:none}.btn-primary{background:var(--accent);color:#06210f}.btn-primary:hover{filter:brightness(1.1)}.btn-ghost{border:1px solid var(--border);color:var(--text)}.btn-ghost:hover{border-color:var(--accent-2);color:var(--accent-2)}.hero-stats{color:var(--muted);font-size:.85rem;margin:1.4rem 0 0}.hero-stats strong{color:var(--text)}.home-section{margin-bottom:2.2rem}.home-lead{font-size:.9rem;margin:-.3rem 0 .8rem;max-width:60ch}.entry-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));grid-gap:.7rem;gap:.7rem}.entry-card{display:flex;flex-direction:column;gap:.25rem;background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:.9rem 1rem;text-decoration:none;color:var(--text)}.entry-card:hover{background:var(--panel-2);border-color:var(--accent)}.entry-card.ghost{border-style:dashed}.entry-title{font-weight:700;font-size:1.02rem}.entry-blurb{color:var(--muted);font-size:.82rem}.entry-count{color:var(--accent);font-size:.8rem;font-weight:600;margin-top:.2rem}.home-footer{display:flex;flex-direction:column;gap:.7rem;align-items:flex-start;border-top:1px solid var(--border);padding-top:1.2rem;margin-top:1rem;font-size:.8rem;line-height:1.5}.stars-badge{font-size:.8rem;letter-spacing:.06em;white-space:nowrap}.chip.stars,.stars-badge{color:#e0c04d}.chip.stars.on{border-color:#e0c04d}.bpm-readout{color:var(--muted);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:normal}.bpm-readout.on{color:var(--accent);font-weight:700}.bpm-slider{position:relative;height:26px;margin:0 .4rem}.bpm-track{position:absolute;top:11px;left:0;right:0;height:4px;border-radius:2px;background:var(--panel-2);border:1px solid var(--border)}.bpm-fill{position:absolute;top:-1px;bottom:-1px;background:var(--accent);border-radius:2px;opacity:.75}.bpm-slider input[type=range]{position:absolute;top:0;left:0;width:100%;height:26px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.bpm-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;pointer-events:auto;width:18px;height:18px;border-radius:50%;background:var(--text);border:3px solid var(--accent);cursor:-webkit-grab;cursor:grab}.bpm-slider input[type=range]::-moz-range-thumb{pointer-events:auto;width:15px;height:15px;border-radius:50%;background:var(--text);border:3px solid var(--accent);cursor:grab}.bpm-scale{display:flex;justify-content:space-between;color:var(--muted);font-size:.68rem;margin:.1rem .4rem 0}.meter-group{margin-bottom:.4rem}.meter-group-label{color:var(--muted);font-size:.7rem;display:block;margin-bottom:.25rem}a.chip{text-decoration:none;display:inline-block}.keyboard{position:relative;height:108px;max-width:480px;margin:.2rem 0 .6rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.keyboard-whites{display:flex;height:100%;gap:2px}.key{cursor:pointer;font-family:inherit;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:.35rem;gap:.1rem;transition:background .1s}.key.white{flex:1 1;background:#efeef2;border:1px solid #cfccd8;border-radius:0 0 6px 6px;color:#2a2833;font-size:.8rem;font-weight:600}.key.white:hover{background:#fff}.key.white.on{background:var(--accent);border-color:var(--accent);color:#06210f}.key.black{position:absolute;top:0;width:9%;height:62%;transform:translateX(-50%);background:#24222c;border:1px solid #3a3745;border-radius:0 0 5px 5px;color:#cfccd8;font-size:.6rem;font-weight:600;z-index:2;line-height:1.1}.key.black:hover{background:#322f3c}.key.black.on{background:var(--accent-2);border-color:var(--accent-2);color:#1a0f2e}.key.dead{opacity:.42}.key .key-name{display:flex;flex-direction:column;align-items:center}.key.black .slash{opacity:.5}.key .alt-spelling{opacity:.45;font-weight:400}.key .key-count{font-size:.62rem;font-weight:700;opacity:.65;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.key.black .key-count{font-size:.58rem}.mode-switch{display:inline-flex;border:1px solid var(--border);border-radius:999px;overflow:hidden;margin-bottom:.5rem}.mode-switch button{background:var(--panel);border:none;color:var(--muted);cursor:pointer;font-family:inherit;font-size:.8rem;font-weight:600;padding:.3rem 1rem}.mode-switch button.on{background:var(--accent);color:#06210f}.enharmonic-note{font-size:.76rem;line-height:1.5;max-width:62ch;margin:.1rem 0 0}.panel-lead{font-size:.78rem;margin:0 0 .4rem}.panel{border:1px solid var(--border);border-radius:10px;margin-bottom:.5rem;background:rgba(23,22,29,.5)}.panel-head{justify-content:space-between;padding:.1rem .4rem .1rem .1rem}.panel-head,.panel-toggle{display:flex;align-items:center;gap:.5rem}.panel-toggle{flex:1 1;background:none;border:none;color:var(--muted);cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.55rem .6rem;text-align:left}.panel-toggle:hover{color:var(--text)}.panel-toggle .caret{font-size:.7rem;width:.7rem}.panel-badge{background:var(--panel-2);border:1px solid var(--border);border-radius:999px;color:var(--accent);font-size:.68rem;letter-spacing:normal;padding:.05rem .5rem;text-transform:none}.panel-move{display:flex;gap:.15rem;opacity:0;transition:opacity .12s}.panel:focus-within .panel-move,.panel:hover .panel-move{opacity:1}.panel-move button{background:var(--panel);border:1px solid var(--border);border-radius:5px;color:var(--muted);cursor:pointer;font-size:.6rem;line-height:1;padding:.2rem .35rem}.panel-move button:hover:not(:disabled){color:var(--text);border-color:var(--accent)}.panel-move button:disabled{opacity:.25;cursor:default}.panel-body{padding:.1rem .7rem .7rem}@media (max-width:560px){.panel-move{opacity:1}.keyboard{height:92px}}.transpose-ctl.standalone{display:flex;align-items:center;gap:.4rem;margin-bottom:.6rem;font-size:.78rem}.fact.sync{color:#ff9d76;border-color:rgba(255,157,118,.35)}.panel-lead.footnote{margin:.5rem 0 0;font-size:.72rem}.keyboard-wrap{display:flex;align-items:flex-start;gap:.5rem}.keyboard-wrap .keyboard{flex:1 1}.key-mute{background:none;border:1px solid var(--border);border-radius:6px;cursor:pointer;font-size:.8rem;line-height:1;padding:.25rem .35rem;margin-top:.2rem}.key-mute:hover{border-color:var(--accent)}