.playing-check{margin:0 16px 16px;padding:18px;border:1px solid var(--border);border-radius:12px;background:var(--surface);animation:playing-check-in .16s ease-out}
.playing-check-heading,.playing-check-controls,.playing-check footer,.playing-check-positions>div:first-child{display:flex;align-items:center;gap:12px}
.playing-check-heading{justify-content:space-between;margin-bottom:13px}
.playing-check-heading>div{display:grid;gap:5px}
.playing-check-heading strong{display:flex;align-items:center;gap:7px;font-size:13px}
.playing-check-heading>div>span,.playing-check-caption,.playing-check-speed,.playing-check-legend,.playing-check-positions span,.playing-check-positions p{font-size:11px;color:var(--muted)}
.playing-check-caption{margin:12px 0;line-height:1.55}
.playing-check-controls{flex-wrap:wrap}
.playing-check-controls label{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}
.playing-check-controls select{min-width:105px}
.playing-check-controls button,.playing-check footer>button,.playing-check .position-options button{font-size:11px;min-height:32px;padding:6px 10px}
.playing-check-speed{margin-left:auto;font-variant-numeric:tabular-nums}
.playing-check-legend{display:flex;gap:18px;margin-bottom:9px}
.playing-check [data-level=conflict]{color:var(--playing-clash)}
.playing-check [data-level=caution]{color:var(--playing-caution)}
.playing-check-results ol{list-style:none;padding:0;margin:0;max-height:255px;overflow:auto;scrollbar-width:thin}
.playing-check-results li+li{border-top:1px solid var(--border)}
.playing-check-issue{display:flex;align-items:center;text-align:left;gap:16px;width:100%;padding:11px 7px;min-height:58px;border:0;background:transparent;border-radius:5px;white-space:normal}
.playing-check-issue:hover{background:var(--hover)}
.playing-check-location{display:grid;gap:4px;min-width:49px;font-family:var(--mono);font-size:11px}
.playing-check-location small{font-size:10px;color:var(--muted)}
.playing-check-reason{display:grid;gap:4px;flex:1}
.playing-check-reason strong{font-size:12px;font-weight:550}
.playing-check-reason small{color:var(--muted);font-size:11px;line-height:1.45}
.playing-check-issue.caution strong>span{color:var(--playing-caution)}
.playing-check-issue.conflict strong>span{color:var(--playing-clash)}
.playing-check-issue>.icon{width:14px;height:14px;color:var(--muted);flex:none}
.playing-check-empty{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted);padding:12px 0}
.playing-check-empty>.icon{width:18px;height:18px}
.playing-check-positions{border-top:1px solid var(--border);margin-top:15px;padding-top:15px}
.playing-check-positions strong{font-size:12px;font-weight:550}
.position-options{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.position-options button:disabled{opacity:.45}
.playing-check footer{align-items:flex-start;justify-content:space-between;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.playing-check details{max-width:65%;color:var(--muted);font-size:11px;line-height:1.6}
.playing-check summary{cursor:pointer;text-align:right}
.playing-check details p{margin:8px 0 0}
.playing-check-toggle{gap:7px;font-size:11px!important;padding:4px 8px!important;min-height:29px!important;white-space:nowrap}
.playing-check-toggle .check-count{font-family:var(--mono);padding:2px 5px;border-radius:4px;background:var(--hover);color:var(--playing-caution);font-size:10px}
.playing-check-toggle.has-clash .check-count{color:var(--playing-clash)}
.fret-note[data-playability] .note-bg{stroke:var(--playing-caution);stroke-width:1.4}
.fret-note[data-playability=conflict] .note-bg{stroke:var(--playing-clash);stroke-width:1.8}
.fret-note .playing-flag{fill:var(--playing-caution);stroke:var(--canvas);stroke-width:1;pointer-events:none}
.fret-note[data-playability=conflict] .playing-flag{fill:var(--playing-clash)}
.fret-note.selected[data-playability] .note-bg{stroke-dasharray:3 2}
@keyframes playing-check-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.playing-check{animation:none}}
@media(max-width:650px){.playing-check{margin:0 8px 10px;padding:12px}.playing-check-speed{margin-left:0}.playing-check footer{flex-wrap:wrap}.playing-check details{max-width:100%}.playing-check summary{text-align:left}.playing-check-legend{gap:10px}.playing-check-positions>div:first-child{align-items:flex-start;flex-direction:column;gap:5px}.playing-check-issue{gap:9px}}

/* Guided review keeps the suggested action beside a small picture of the problem. */
.guided-check{background:var(--panel);padding:16px;margin:0 16px 16px}
.guided-check .playing-check-heading{margin-bottom:12px}
.guided-check .check-navigation{display:flex;align-items:center;gap:5px;color:var(--muted)}
.check-navigation>span{font:10px var(--mono);margin-right:5px}
.check-navigation .icon-button{width:28px;height:28px;padding:6px}
.check-focus{display:grid;grid-template-columns:150px minmax(0,1fr);gap:17px;align-items:center;padding:13px;border:1px solid var(--border);border-radius:9px;background:var(--canvas)}
.check-illustration{display:flex;align-items:center;justify-content:center;padding:7px;border-radius:7px;background:var(--panel);min-height:87px}
.check-illustration svg{width:100%;overflow:visible}
.check-illustration text{fill:var(--ink);font:10px var(--mono)}
.check-illustration .diagram-caption{fill:var(--muted);font:9px var(--sans)}
.check-illustration .release-diagram text{font-size:14px}
.check-illustration .release-diagram .diagram-caption{font-size:12px}
.release-old{stroke:var(--playing-caution);stroke-width:3;stroke-linecap:round}
.release-overlap{stroke:var(--canvas);stroke-width:4;stroke-dasharray:4 3}
.release-new{stroke:var(--track);stroke-width:3;stroke-linecap:round}
.release-dot,.diagram-focus{fill:var(--track)}
.release-cut{stroke:var(--muted);stroke-width:1;stroke-dasharray:2 3}
.diagram-held{fill:var(--playing-caution)}
.diagram-string{stroke:var(--line);stroke-width:.6;opacity:.7}
.check-place{font:10px var(--mono);color:var(--muted);margin-bottom:4px;padding:0;gap:5px;min-height:17px;line-height:1.3}
.check-place .icon{width:12px;height:12px}
.check-place:hover{color:var(--track);background:transparent;text-decoration:underline}
.check-focus-body h3{font-size:13px;line-height:1.3;margin:0 0 5px;font-weight:650}
.check-focus-body h3>span{color:var(--playing-caution)}
.check-focus.conflict h3>span{color:var(--playing-clash)}
.check-focus-body>p{font-size:11px;line-height:1.5;color:var(--muted);margin:0 0 10px;max-width:65ch}
.check-repair{display:flex;align-items:center;flex-wrap:wrap;gap:5px}
.check-repair button{font-size:10px;padding:6px 8px;min-height:30px;gap:5px}
.check-repair button .icon{width:13px;height:13px}
.check-repair-caption{display:block;color:var(--muted);font-size:10px;margin-top:7px}
.check-preview-status{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--track);padding-top:11px}
.check-preview-status .icon{width:14px;height:14px}
.check-preview-status>span{color:var(--muted);margin-left:auto;font-size:10px}
.guided-check details{max-width:none}
.guided-check summary{text-align:left;list-style-position:inside;font-size:11px}
.check-other-positions{margin-top:10px}
.check-other-positions summary{color:var(--muted)}
.check-deferred-positions{border-top:1px solid var(--border);margin-top:11px;padding-top:10px}
.check-deferred-positions summary{color:var(--muted);font-size:10px}
.check-deferred-positions>p{font-size:11px;color:var(--muted);margin:9px 0 0}
.position-choice{display:grid!important;justify-items:start;gap:3px!important;text-align:left;min-height:45px!important}
.position-choice strong{font-size:11px;font-weight:550}
.position-choice small{font-size:10px;color:var(--muted)}
.position-choice.better small{color:var(--bass)}
.position-choice.tradeoff small,.position-choice.worse small{color:var(--playing-caution)}
.check-blocked{padding:6px 0}
.check-blocked p{font-size:10px!important;margin:5px 0!important}
.check-blocked strong{font-size:10px!important;font-weight:500;color:var(--muted)}
.check-bottom{display:flex;align-items:flex-start;gap:15px;flex-wrap:wrap;border-top:1px solid var(--border);padding-top:9px;margin-top:12px}
.check-bottom>button{font-size:10px;padding:5px 7px;min-height:27px;margin-right:auto}
.check-bottom>details{padding-top:5px}
.check-options summary{display:flex;align-items:center;gap:5px}
.check-options summary .icon{width:13px;height:13px}
.check-options[open]{flex-basis:100%;order:3}
.check-options[open] .playing-check-controls{margin:12px 0 8px}
.check-options[open] p{font-size:11px;line-height:1.55;color:var(--muted);margin:0;max-width:75ch}
.check-all[open]{flex-basis:100%;order:2}
.check-all ol{list-style:none;padding:0;margin:8px 0 0;max-height:200px;overflow:auto;scrollbar-width:thin}
.check-all li+li{border-top:1px solid var(--border)}
.check-all .playing-check-issue{min-height:34px;padding:7px;font-size:11px}
.check-all .playing-check-location{min-width:49px}
.check-all .playing-check-reason strong{font-weight:500;font-size:11px}
.guided-check .playing-check-positions{margin-top:12px;padding-top:11px}
.guided-check .playing-check-positions p{margin:7px 0;font-size:11px}
.guided-check .playing-check-empty{padding:9px 0}
@media(max-width:650px){.check-focus{grid-template-columns:104px minmax(0,1fr);gap:11px;padding:10px}.guided-check{margin-inline:8px;padding:12px}.check-preview-status{flex-wrap:wrap}.check-preview-status>span{margin-left:0}.check-repair button{min-height:34px}.check-bottom{gap:9px}.check-illustration{padding:3px}}