.bag-panel { display: grid; gap: 4px; padding-bottom: 8px; margin-bottom: 7px; border-bottom: 1px solid var(--bpb-border); }
.bag-status { font-size: 11px; font-weight: 700; color: var(--bpb-blue-dark); }
#bagSelect { width: 100%; max-width: 235px; min-width: 0; padding: 6px 20px 6px 6px; border: 1px solid var(--bpb-border); border-radius: 5px; background: white; color: var(--bpb-ink); font: inherit; font-size: 12px; cursor: pointer; }
.bag-links { display: grid; margin-top: 7px; }
.bag-links:empty { display: none; }
.bag-links a { max-width: 235px; font-size: 11px; line-height: 1.5; color: var(--bpb-blue-dark); text-decoration: none; padding: 4px 0; }
.bag-links a:hover { text-decoration: underline; }
#bagSelect:focus-visible, .bag-links a:focus-visible { outline: 2px solid var(--bpb-blue); outline-offset: 2px; }
.timeline { position: relative; }
#bagMarks { position: absolute; left: 8px; right: 8px; height: 6px; bottom: -4px; pointer-events: none; }
#bagMarks span { position: absolute; height: 4px; width: 1px; background: #8a9baa; }
#bagMarks span.active { background: var(--bpb-blue-dark); height: 6px; }
@media(max-width:600px) { #bagSelect { max-width: 190px; } .bag-links a { font-size: 10px; } }