.mu-lib{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:0 0 10px;background:var(--surface)}
.mu-lib .mu-field input{width:100%;box-sizing:border-box;font:inherit;font-size:1rem;color:var(--ink);background:var(--surface);border:1px solid var(--line-2);border-radius:10px;padding:8px 10px;min-height:44px}
.mu-browse{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 2px}.mu-browse .btn{min-height:40px}
.mu-browse .btn[aria-pressed=true]{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}
.mu-res{list-style:none;margin:8px 0 0;padding:0;max-height:min(52vh,420px);overflow:auto;border-top:1px solid var(--line)}.mu-res:empty{display:none}
.mu-res li{padding:8px 6px;border-bottom:1px solid var(--line);cursor:pointer;display:flex;flex-direction:column;gap:2px}
.mu-res li[aria-selected=true],.mu-res li:hover{background:var(--accent-soft)}.mu-res li:focus{outline:3px solid var(--brand);outline-offset:-3px}
.mu-res b{font-weight:700;color:var(--ink)}.mu-meta{font-size:.82rem;color:var(--muted)}
.mu-lvl{display:inline-block;font-size:.75rem;font-weight:700;border-radius:999px;padding:1px 8px;margin-right:6px;border:1px solid var(--line-2);color:var(--ink)}
.mu-lvl0{background:#dff3ea}.mu-lvl1{background:#fdf0cf}.mu-lvl2{background:#f9dcd6}[data-theme=dark] .mu-lvl{color:#111}
.mu-cant{font-size:.85rem;color:var(--muted);margin:6px 0 0}.mu-credit a{color:inherit}
.fx-view{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:10px;max-height:62vh;overflow:auto;position:relative}
.fx-view:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.fx-empty{color:var(--muted);margin:8px 0}
.fx-sys{position:relative;margin:0 0 8px;font-variant-numeric:tabular-nums}
.fx-str{position:absolute;left:18px;right:0;height:1px;background:var(--line-2)}
.fx-sname{position:absolute;left:0;width:14px;font-size:.72rem;line-height:20px;color:var(--muted);text-align:center}
.fx-bl{position:absolute;top:32px;bottom:18px;width:2px;background:var(--line-2)}.fx-bl small{position:absolute;bottom:-17px;left:3px;font-size:.66rem;color:var(--muted)}
.fx-end{right:0}
.fx-cs{position:absolute;top:0;font-size:.82rem;font-weight:700;color:var(--brand)}
.fx-fr{position:absolute;margin-left:-.55em;min-width:1.1em;line-height:20px;padding:0 2px;font-weight:700;font-size:.95rem;text-align:center;background:var(--surface);color:var(--ink);border-radius:6px}
.fx-fr.now{background:var(--accent);color:#111;outline:2px solid var(--ink)}
.fx-board{display:block;width:100%;height:auto;max-width:900px;cursor:pointer;touch-action:manipulation}
.fx-ln{stroke:var(--line-2);stroke-width:1.5}.fx-nut{stroke:var(--ink);stroke-width:4}
.fx-inlay{fill:var(--line)}.fx-sn,.fx-fn{fill:var(--muted);font-size:11px}
.fx-hit{fill:var(--accent);stroke:var(--ink);stroke-width:2}.fx-next{fill:none;stroke:var(--brand);stroke-width:2;stroke-dasharray:4 3}
.fx-fi{fill:#111;font-size:11px;font-weight:700}
.fx-boxes{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 8px}
.fx-box{width:96px;height:auto}.fx-box.fx-big{width:170px}
.fx-box .fx-dot{fill:var(--ink)}.fx-box .fx-fi{fill:var(--surface)}.fx-open{fill:none;stroke:var(--ink);stroke-width:1.5}
.fx-cn{fill:var(--ink);font-size:13px;font-weight:800}.fx-ox{fill:var(--muted);font-size:12px}
.fx-noshape{font-size:.85rem;color:var(--muted);max-width:14em}
.fx-pat{display:flex;gap:4px;margin:8px 0;flex-wrap:wrap}
.fx-st{display:flex;flex-direction:column;align-items:center;min-width:1.9em;padding:4px 1px;border:2px solid var(--line-2);border-radius:8px}
.fx-st b{font-size:1.4rem;line-height:1}.fx-st small{font-size:.72rem;color:var(--muted)}.fx-miss b{color:var(--muted)}
.fx-st.on{background:var(--accent-soft);border-color:var(--accent)}
.fx-chart{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:6px}
.fx-cell{border-left:2px solid var(--line-2);padding:2px 6px;min-height:2.6em;display:flex;flex-wrap:wrap;gap:4px;align-items:baseline}
.fx-cell small{flex:1 1 100%;font-size:.66rem;color:var(--muted)}.fx-cell b{font-size:1.05rem;padding:0 4px;border-radius:6px}
.fx-cell b.now{background:var(--accent);color:#111}.fx-same{color:var(--muted)}
.mu-chip.now .mu-n{outline:3px solid var(--accent);outline-offset:1px}.mu-chip.now{background:var(--accent-soft)}
.fx-strings{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}.fx-strings[hidden]{display:none}
.fx-sbtn{min-width:64px;min-height:44px}.fx-sbtn.need{background:var(--accent);color:#111;border-color:var(--ink)}
.fx-wrong .fx-sbtn{animation:fxw .3s}@keyframes fxw{50%{border-color:var(--coral)}}
.fx-chartlist{display:flex;flex-wrap:wrap;gap:12px;margin:10px 0}.fx-fig{margin:0;text-align:center}.fx-fig figcaption{font-weight:700}
.fx-now{min-height:120px}.fx-lesson{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface)}
.fx-frets{border-collapse:collapse;font-variant-numeric:tabular-nums}.fx-frets td,.fx-frets th{border:1px solid var(--line);padding:3px 8px;text-align:left}
@media (max-width:520px){.fx-box{width:84px}.fx-view{max-height:70vh}}
@media print{.mu-lib,.mu-play,.mu-tabs,.fx-strings,.mu-more{display:none}.fx-view{max-height:none;overflow:visible;border:0}}
[data-fret] .mu-tab{padding:10px 9px}