body{max-width:70ch;margin:2rem auto;padding:0 1rem 5rem;font-family:system-ui,-apple-system,sans-serif;color:#1a1a1a}header{margin-bottom:1.5rem}h1{font-size:1.4rem;font-weight:600;margin:0}h2{font-size:1.15rem;font-weight:600;margin:.75rem 0 1rem}.chart-meta{font-size:.85rem;color:#666;margin:1rem 0 0}.chart-meta span+span:before{content:" · "}.tagline{font-size:.85rem;color:#666;margin:.25rem 0 0}.toolbar{display:flex;gap:.5rem;margin-bottom:.5rem}#library-sort{padding:.5rem .75rem;font-size:.9rem;font-family:inherit;border:1px solid #ccc;border-radius:4px;background:#fff}.app-nav{text-align:right;font-size:.85rem;color:#888;margin:.35rem 0 0}.file-input-label{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;color:#666}.search-field{position:relative;display:flex;flex:1;align-items:center}.search-field input[type=text]{padding-right:2.25rem}.clear-button{position:absolute;right:.4rem;display:inline-flex;align-items:center;justify-content:center;padding:.25rem;border:none;background:none;color:#999;cursor:pointer;line-height:0}.clear-button:hover{color:#1a1a1a}input[type=text]{flex:1;padding:.5rem .75rem;font-size:1rem;box-sizing:border-box;border:1px solid #ccc;border-radius:4px;font-family:inherit}button{font-size:.9rem;font-family:inherit;cursor:pointer}button.primary{padding:.5rem 1rem;background:#1a1a1a;color:#fff;border:none;border-radius:4px;white-space:nowrap}button.primary:hover{background:#333}button.link{background:none;border:none;color:#06c;padding:0;text-decoration:underline}button.link.danger{color:#c00}.hint{font-size:.85rem;color:#666;margin:.5rem 0}.status{font-size:.85rem;color:#b00;margin:.5rem 0;min-height:1.2em}.empty{color:#666;font-style:italic;text-align:center;padding:2rem 0}.library-list{list-style:none;padding:0;margin:0}.library-list li{border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between;gap:1rem}.library-list a.library-item{display:flex;flex-direction:column;padding:.6rem 0;text-decoration:none;color:inherit;flex:1}.library-list a.library-item:hover{background:#f5f5f5}.lib-title{font-weight:600}.lib-composer{font-size:.85rem;color:#666}.lib-footer{display:flex;justify-content:space-between;align-items:center;margin-top:1.5rem;padding-top:1rem;border-top:1px solid #eee;font-size:.85rem;color:#666}.chart-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;font-size:.9rem}.score-toolbar{display:flex;justify-content:flex-end;align-items:center;gap:.5rem;margin-bottom:.35rem}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border:1px solid #ccc;border-radius:4px;background:#fff;color:#333}.icon-button:hover{background:#f5f5f5}.copy-status{font-size:.8rem;color:#666}.level-nav{display:flex;align-items:center;gap:1rem;font-size:.9rem;color:#666;margin:0 0 1.5rem}.level-nav button{padding:.35rem .75rem;border:1px solid #ccc;border-radius:4px;background:#fff}.level-nav button:disabled{opacity:.4;cursor:default}.notation-nav{display:flex;gap:.5rem;margin:0 0 1.5rem}.notation-nav button{padding:.35rem .75rem;border:1px solid #ccc;border-radius:4px;background:#fff}.notation-nav button[aria-pressed=true]{background:#1a1a1a;color:#fff;border-color:#1a1a1a}#chart-score{width:100%;box-sizing:border-box;overflow-x:auto}#chart-score pre{font-family:ui-monospace,Menlo,Consolas,monospace;white-space:pre-wrap}.chart-line{display:flex;flex-wrap:nowrap;align-items:baseline;justify-content:space-between;width:100%;margin-bottom:.6rem}.chart-line>*{flex-shrink:0}.chart-line .heading{display:inline-flex;align-items:center;gap:.25rem}.chord-grid:has(.section-label) .chart-line .heading{min-width:1.9rem}#chart-score .navigation{font-size:.75rem;font-weight:700;color:#1a1a1a}#chart-score .error{color:#b00}#chart-score .time-signature{color:#666;font-size:.85rem}#chart-score .ending{color:#666;font-size:.8rem;margin-right:.2rem}#chart-score .annotation{color:#666;font-size:.8rem;font-style:italic;margin-left:.3rem}#chart-score .chart-annotation{color:#666;font-size:.85rem;margin-bottom:.6rem}#chart-score .chord-small{font-size:.85em}#chart-score .alternative{color:#666;font-size:.8em;font-weight:500}#chart-score .chord{font-size:1.3rem;font-weight:600}#chart-score .chord sup{font-size:.65em;font-weight:500;margin-left:.05em}#chart-score .bar{color:#999;margin:0 .3rem}#chart-score .section-label{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-right:.4rem;border:1px solid #1a1a1a;border-radius:3px;font-size:.9rem;font-weight:700;flex-shrink:0}
