.repertoire-timeline{position:relative;width:100%;max-width:100%;min-width:0;margin:0 0 30px;color:#171717}
.repertoire-timeline .repertoire-timeline-scroll{position:relative;width:100%;max-width:100%;height:478px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x pan-y;scrollbar-width:thin;scrollbar-color:#c4c4c4 transparent;scroll-behavior:auto;overflow-anchor:none;contain:layout paint;cursor:default}
.repertoire-timeline .repertoire-timeline-scroll:focus-visible{outline:1px solid #aaa;outline-offset:4px}
.repertoire-timeline .repertoire-timeline-sheet{position:absolute;left:0;top:0;min-width:1640px;height:478px;transform-origin:0 0;will-change:transform}
.repertoire-timeline .repertoire-timeline-axis{position:absolute;left:0;right:2px;top:26px;height:.5px;background:#9a9a9a;z-index:1}
.repertoire-timeline .repertoire-timeline-axis::after{content:'';position:absolute;right:0;top:-2.5px;width:5px;height:5px;border-top:.5px solid #888;border-right:.5px solid #888;transform:rotate(45deg)}
.repertoire-timeline .repertoire-timeline-entry{position:absolute;min-width:0;max-width:none;z-index:2;background:transparent}
.repertoire-timeline .repertoire-timeline-name{display:block;max-width:100%;margin:0;padding:0;border:0;background:transparent;color:#171717;text-align:left;white-space:nowrap;overflow-wrap:normal;font:400 9px/1.45 "Helvetica Neue",Helvetica,Arial,sans-serif;transition:opacity 160ms ease;cursor:default;transform:none}
.repertoire-timeline button.repertoire-timeline-name{cursor:pointer}
.repertoire-timeline button.repertoire-timeline-name:hover{color:#777}
.repertoire-timeline button.repertoire-timeline-name:focus-visible{outline:1px solid #888;outline-offset:4px}
.repertoire-timeline .repertoire-timeline-note{position:absolute;left:0;top:calc(100% + 7px);display:block;width:140px;max-width:none;visibility:hidden;opacity:0;margin:0;padding:3px 0;background:rgba(255,255,255,.97);color:#777;font:400 9px/1.55 "Helvetica Neue",Helvetica,Arial,sans-serif;transition:opacity 160ms ease;z-index:2;pointer-events:none}
.repertoire-timeline .repertoire-timeline-entry[data-timeline-id="ravel"] .repertoire-timeline-note{left:auto;right:0}
.repertoire-timeline .repertoire-timeline-context[data-open="true"]{z-index:3}
.repertoire-timeline .repertoire-timeline-context[data-open="true"] .repertoire-timeline-name{opacity:.35}
.repertoire-timeline .repertoire-timeline-context[data-open="true"] .repertoire-timeline-note{visibility:visible;opacity:1}
@media(max-width:640px){.repertoire-timeline{margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){.repertoire-timeline .repertoire-timeline-name,.repertoire-timeline .repertoire-timeline-note{transition:none}}
.repertoire-timeline .repertoire-timeline-leaders{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.repertoire-timeline .repertoire-timeline-leaders path{fill:none;stroke:#333;stroke-width:.6;stroke-dasharray:1 3;vector-effect:non-scaling-stroke}
.repertoire-timeline .repertoire-timeline-milestone{position:absolute;top:0;color:#999;font:400 8px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.repertoire-timeline .repertoire-timeline-milestone::after{content:'';position:absolute;left:0;top:var(--timeline-tick-top,22px);height:8px;width:.5px;background:#999}
.repertoire-timeline .repertoire-timeline-approx{position:absolute;right:calc(100% + 3px);top:0}
.repertoire-timeline .repertoire-timeline-break{position:absolute;left:91px;top:22px;width:11px;height:8px;background:#fff;z-index:2;pointer-events:none}
.repertoire-timeline .repertoire-timeline-break::before,.repertoire-timeline .repertoire-timeline-break::after{content:'';position:absolute;top:1px;width:.5px;height:7px;background:#aaa;transform:rotate(25deg)}
.repertoire-timeline .repertoire-timeline-break::before{left:3px}.repertoire-timeline .repertoire-timeline-break::after{left:7px}

.repertoire-timeline .repertoire-timeline-entry[data-guitar="true"] .repertoire-timeline-name{font-size:12px;line-height:1.4}
.repertoire-timeline .repertoire-timeline-entry[data-guitar="false"] .repertoire-timeline-name{font-size:8px;line-height:1.5}
.repertoire-timeline .repertoire-timeline-entry[data-dense="true"][data-guitar="true"] .repertoire-timeline-name{font-size:10px}
.repertoire-timeline .repertoire-timeline-entry[data-dense="true"][data-guitar="false"] .repertoire-timeline-name{font-size:7px}

/* Only this viewport zooms. Its outer dimensions and the surrounding page stay fixed. */
.repertoire-timeline .repertoire-timeline-surface{position:relative;height:478px;min-width:100%;overflow:hidden}
.repertoire-timeline .repertoire-timeline-zoom{position:absolute;right:6px;bottom:8px;display:flex;gap:4px;z-index:8;background:rgba(255,255,255,.94)}
.repertoire-timeline .repertoire-timeline-zoom button{display:grid;place-items:center;width:24px;height:24px;font:300 17px/1 "Helvetica Neue",Helvetica,Arial,sans-serif;color:#555;background:transparent;border:0;padding:0}
.repertoire-timeline .repertoire-timeline-zoom button:hover{color:#111}
.repertoire-timeline .repertoire-timeline-zoom button:disabled{opacity:.25;cursor:default}
.repertoire-timeline .repertoire-timeline-zoom button:focus-visible{outline:1px solid #999;outline-offset:0}

.repertoire-timeline .repertoire-timeline-scroll[data-zoomed="true"]{cursor:grab}

.repertoire-timeline .repertoire-timeline-scroll[data-dragging="true"]{user-select:none}
.repertoire-timeline .repertoire-timeline-scroll[data-dragging="true"],.repertoire-timeline .repertoire-timeline-scroll[data-dragging="true"] *{cursor:grabbing}

.repertoire-timeline .repertoire-timeline-entry[data-note-side="above"] .repertoire-timeline-note{top:auto;bottom:calc(100% + 7px)}
.repertoire-timeline .repertoire-timeline-entry[data-note-align="right"] .repertoire-timeline-note{left:auto;right:0}
.repertoire-timeline .repertoire-timeline-next{position:absolute;left:0;right:auto;top:10px;display:grid;place-items:center;width:180px;height:44px;margin:0;padding:0;border:0;background:transparent;color:#171717;cursor:pointer;z-index:8;transition:none;animation:none}
.repertoire-timeline .repertoire-timeline-next svg{display:block;width:160px;height:10px;fill:none;stroke:#171717;stroke-width:.6;vector-effect:non-scaling-stroke;pointer-events:none}
.repertoire-timeline .repertoire-timeline-next svg *{vector-effect:non-scaling-stroke}
.repertoire-timeline .repertoire-timeline-next:hover,.repertoire-timeline .repertoire-timeline-next:active{background:transparent;color:#171717;transition:none;animation:none}
.repertoire-timeline .repertoire-timeline-next svg,.repertoire-timeline .repertoire-timeline-next svg *{stroke:#171717;transition:none;animation:none;pointer-events:none}
.repertoire-timeline .repertoire-timeline-next:disabled{opacity:.16;cursor:default}
.repertoire-timeline .repertoire-timeline-next:focus-visible{outline:.5px solid #888;outline-offset:0}
@media(max-width:640px){.repertoire-timeline .repertoire-timeline-next{left:0;right:auto;width:140px;height:44px}.repertoire-timeline .repertoire-timeline-next svg{width:120px}}

.repertoire-timeline .repertoire-timeline-next{touch-action:none;user-select:none}