.cc-focus,.cc-preview,.right-panel{--cc-chord-font: var(--mono);--cc-lyric-font: var(--font);--cc-label-font: var(--font);--cc-control-font: var(--font);--cc-ink: #000;--cc-muted: #888;--cc-surface: var(--bg);--cc-size: 12px;--cc-label-size: 10px;--cc-gap: 8px;--cc-pad: 8px;--cc-line-gap: 6px;--cc-preview-min: 160px;--cc-summary-h: 34px;--cc-queue-row: 40px;--cc-queue-pad: 4px}body.dark .cc-focus,body.dark .cc-preview,body.dark .right-panel{--cc-ink: #d4c8f0}.cc-chart{font-family:var(--cc-lyric-font);font-size:calc(var(--cc-size) * var(--cc-zoom, 1));line-height:1.3}.cc-line{margin-bottom:var(--cc-line-gap)}.cc-grp{display:inline-block;vertical-align:top;white-space:pre}.cc-chord{display:block;font-family:var(--cc-chord-font);font-weight:700;padding-right:1ch;min-height:1.3em}.cc-lyr{display:block;font-family:var(--cc-lyric-font);white-space:pre}.cc-blank{height:var(--cc-gap)}.cc-section{font-family:var(--cc-label-font);font-size:var(--cc-label-size);font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--cc-muted);margin:var(--cc-gap) 0 var(--cc-line-gap)}.cc-msg{padding:var(--cc-pad);font-family:var(--cc-label-font);color:var(--cc-muted)}.cc-error{padding:var(--cc-pad);font-family:var(--cc-label-font);font-weight:700}.cc-chord.is-editable,.cc-ch{cursor:pointer}.cc-chord.is-editable:hover,.cc-ch:hover{outline:1px solid var(--cc-ink)}.cc-chord.is-active,.cc-ch.is-active{outline:1px solid var(--cc-ink);background:var(--cc-ink);color:var(--cc-surface)}.cc-btn{font-family:var(--cc-control-font);font-size:var(--cc-label-size);border:1px solid var(--cc-ink);background:var(--cc-surface);color:var(--cc-ink);padding:3px var(--cc-pad);cursor:pointer;white-space:nowrap}.cc-btn:hover:not(:disabled),.cc-btn.is-primary,.cc-btn.is-on{background:var(--cc-ink);color:var(--cc-surface)}.cc-btn:disabled{color:var(--cc-muted);border-color:var(--cc-muted);cursor:default}.cc-focus{--cc-size: 22px;--cc-label-size: 12px;--cc-line-gap: 12px;position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;background:var(--cc-surface);color:var(--cc-ink);display:flex;flex-direction:row}.cc-focus-main{flex:2 1 0;min-width:0;display:flex;flex-direction:column;position:relative}.cc-focus-lib{flex:1 1 0;min-width:0;display:flex;flex-direction:column;border-left:1px solid var(--cc-ink)}.cc-search{padding:var(--cc-pad);border-bottom:1px solid var(--cc-ink)}.cc-search input{width:100%;font-family:var(--cc-control-font);font-size:16px;border:1px solid var(--cc-ink);background:var(--cc-surface);color:var(--cc-ink);padding:3px var(--cc-pad)}.cc-focus-lib-body{flex:1;overflow-y:auto;padding:var(--cc-pad)}@media(max-width:700px){.cc-focus{flex-direction:column}.cc-focus-lib{border-left:0;border-top:1px solid var(--cc-ink)}}.cc-focus-bar{display:flex;align-items:center;gap:var(--cc-gap);padding:var(--cc-pad);border-bottom:1px solid var(--cc-ink);flex-wrap:wrap}.cc-focus-title{flex:1;min-width:0;font-family:var(--cc-lyric-font);display:flex;flex-direction:column}.cc-focus-title b{font-size:var(--cc-size);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cc-focus-title span{font-size:var(--cc-label-size);color:var(--cc-muted)}.cc-stepper,.cc-focus-actions{display:flex;align-items:center;gap:var(--cc-gap)}.cc-key{font-family:var(--cc-control-font);font-weight:700;font-size:var(--cc-label-size);padding:3px var(--cc-pad);border:1px solid var(--cc-ink);min-width:4ch;text-align:center}.cc-focus-body{flex:1;overflow:auto;padding:var(--cc-pad);-webkit-overflow-scrolling:touch}.cc-editor{border-top:1px solid var(--cc-ink);padding:var(--cc-pad);display:flex;flex-direction:column;gap:var(--cc-gap);background:var(--cc-surface)}.cc-editor-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--cc-gap)}.cc-field{display:flex;flex-direction:column;gap:2px;font-family:var(--cc-label-font);font-size:var(--cc-label-size);font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--cc-muted)}.cc-field-label{font-family:var(--cc-label-font);font-size:var(--cc-label-size);font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--cc-muted);align-self:center}.cc-field select,.cc-field input,.cc-import textarea{font-family:var(--cc-control-font);font-size:16px;border:1px solid var(--cc-ink);background:var(--cc-surface);color:var(--cc-ink);padding:3px var(--cc-pad);text-transform:none;letter-spacing:0;font-weight:400}.cc-field-free{flex:1;min-width:160px}.cc-preview-chord{font-family:var(--cc-chord-font);font-weight:700;font-size:var(--cc-size);align-self:center;min-width:8ch}.cc-import-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--cc-surface);display:flex;z-index:1}.cc-import{flex:1;display:flex;flex-direction:column;gap:var(--cc-gap);padding:var(--cc-pad);min-height:0}.cc-import-title{font-family:var(--cc-label-font);font-size:var(--cc-label-size);font-weight:700;text-transform:uppercase;letter-spacing:1px}.cc-import textarea{flex:1;resize:none;font-family:var(--cc-chord-font)}.cc-preview{flex:1 1 0;min-height:var(--cc-summary-h);display:flex;flex-direction:column;border-top:1px solid var(--cc-ink);overflow:hidden}.cc-preview-hdr{display:flex;align-items:center;justify-content:space-between;padding:4px var(--cc-pad);border-bottom:1px solid var(--cc-ink);font-family:var(--cc-label-font);font-size:var(--cc-label-size);font-weight:700;letter-spacing:1px;flex-shrink:0}.cc-preview-body{flex:1;min-height:0;overflow:auto;padding:var(--cc-pad)}.cc-view-full{margin:var(--cc-pad)}.right-panel.cc-open{overflow-y:auto}.right-panel.cc-open .pp-sec{max-height:none;flex-shrink:0}.right-panel.cc-open .queue-sec{flex:0 0 auto}.right-panel.cc-open .queue-list{flex:0 0 auto;height:calc(3 * var(--cc-queue-row) + 2 * var(--cc-queue-pad))}.cc-pp-more{width:100%;text-align:left;font-family:var(--cc-control-font);font-size:var(--cc-label-size);background:var(--cc-surface);color:var(--cc-ink);border:0;border-bottom:1px solid var(--cc-ink);padding:4px var(--cc-pad);cursor:pointer}.cc-set-summary{display:flex;align-items:center;gap:var(--cc-gap);height:var(--cc-summary-h);padding:0 var(--cc-pad);border-bottom:1px solid var(--cc-ink);flex-shrink:0;font-family:var(--cc-label-font);font-size:var(--cc-label-size);cursor:pointer}.cc-set-summary b{text-transform:uppercase;letter-spacing:1px}.cc-set-summary .session-name{flex:1}.np-sec{position:relative}.np-close{position:absolute;top:0;right:0;font-family:var(--cc-control-font);font-size:14px;line-height:1;padding:5px var(--cc-pad);border:0;background:transparent;color:var(--cc-ink);cursor:pointer}.np-close:hover{background:var(--cc-ink);color:var(--cc-surface)}
