.bar-strip{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.bar-strip-bar{border:1px solid var(--line);background:var(--ground2);color:var(--ink);border-radius:8px;flex:1 0 22%;padding:8px 10px}.bar-strip-bar[aria-current=step]{border-color:var(--highlight);background:var(--highlight);color:var(--ui-on-highlight)}.bar-strip-chord,.bar-strip-caption{display:block}.bar-strip-chord{font-family:var(--display);font-size:17px;font-weight:700}.bar-strip-caption{color:var(--muted);font-family:var(--mono);letter-spacing:1px;margin-top:2px;font-size:11px}.bar-strip-bar[aria-current=step] .bar-strip-caption{color:var(--ui-on-highlight)}.bar-strip--night{flex-wrap:nowrap;gap:4px;max-width:100%;overflow-x:auto}.bar-strip--night .bar-strip-bar{border-color:color-mix(in srgb, var(--ui-on-night) 12%, var(--ui-night));background:color-mix(in srgb, var(--ui-on-night) 12%, var(--ui-night));color:var(--ui-on-night);text-align:center;flex:1 0 48px;padding:8px 4px}.bar-strip--night .bar-strip-chord{font-family:var(--mono);font-size:13px;font-weight:600}.bar-strip--night .bar-strip-caption{color:color-mix(in srgb, var(--ui-on-night) 80%, var(--ui-night))}.bar-strip--night .bar-strip-bar[aria-current=step]{border-color:var(--highlight);background:var(--highlight);color:var(--ui-on-highlight)}.bar-strip--compact .bar-strip-chord{font-family:var(--mono);font-size:.875rem;font-weight:600}