/* Selected option 1. Shared colours and typography live in styles.scss. */
body:has(.lecture-library) main.content { max-width: none; }
body:has(.lecture-library) #title-block-header { margin-bottom: .6rem; }
.library-intro { display: flex; gap: 1rem 2rem; align-items: start; justify-content: space-between; margin-bottom: 1.5rem; }
.library-intro > p { color: var(--course-muted); margin: 0; }
.library-playlists { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.library-playlists a { display: inline-flex; gap: .4rem; align-items: center; padding: .4rem .6rem; border: 1px solid var(--course-line); border-radius: 4px; background: var(--course-paper); color: var(--course-muted); font-size: .78rem; text-decoration: none; }
.lecture-jump { display: flex; flex-wrap: wrap; gap: .3rem; padding-bottom: .8rem; border-bottom: 1px solid var(--course-line); margin-bottom: 1.1rem; }
.lecture-jump a, .lecture-jump button { display: inline-flex; align-items: center; gap: .45rem; min-height: 36px; padding: .4rem .65rem; border: 0; border-radius: 4px; background: transparent; font: inherit; font-size: .82rem; color: var(--course-ink); text-decoration: none; cursor: pointer; }
.lecture-jump [data-active="true"] { background: var(--course-selected); color: var(--course-accent); font-weight: 600; }
.lecture-jump .jump-range { color: var(--course-muted); font-size: .72rem; font-variant-numeric: tabular-nums; }
.lecture-jump a:hover, .lecture-jump button:hover { background: var(--course-soft); }
.library-tools { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; }
.library-tools label { display: flex; flex-direction: column; gap: .4rem; font-size: .75rem; color: var(--course-muted); margin: 0; }
.library-search { flex: 1; max-width: 400px; }
.library-search-input { display: flex; align-items: center; gap: .6rem; padding: .5rem .7rem; border: 1px solid var(--course-line); border-radius: 4px; background: var(--course-paper); }
.library-search-input input { width: 100%; min-width: 0; border: 0; background: transparent; font: inherit; font-size: .88rem; color: var(--course-ink); }
.library-search-input input::placeholder { color: var(--course-muted); opacity: 1; }
.library-format select { min-height: 38px; padding: .5rem 2rem .5rem .7rem; border: 1px solid var(--course-line); border-radius: 4px; color: var(--course-ink); background: var(--course-paper); font: inherit; font-size: .85rem; }
.resource-key { display: flex; flex-wrap: wrap; gap: .55rem .9rem; color: var(--course-muted); font-size: .72rem; margin-bottom: 1.1rem; }
.resource-key span { display: inline-flex; align-items: center; gap: .3rem; }
.library-result-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: 1rem; font-size: .78rem; color: var(--course-muted); }
.library-result-row p { margin: 0; }
.library-result-row button { background: transparent; border: 0; padding: .3rem 0; font: inherit; color: var(--course-accent); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.lecture-section { margin-bottom: 2.25rem; scroll-margin-top: 110px; }
.lecture-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.lecture-section-head h2 { margin: 0; padding: 0; border: 0; font-size: 1.1rem; letter-spacing: -.025em; }
.lecture-section-head > span { flex-shrink: 0; color: var(--course-muted); font-size: .76rem; }
.lecture-section-list { border: 1px solid var(--course-line); border-radius: 6px; background: var(--course-paper); }
.lecture-row { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 1rem; padding: 1.3rem; border-bottom: 1px solid var(--course-line); scroll-margin-top: 110px; }
.lecture-row:last-child { border-bottom: 0; }
.lecture-number { font-size: .8rem; padding-top: .1rem; font-variant-numeric: tabular-nums; color: var(--course-muted); white-space: nowrap; }
.lecture-body { min-width: 0; }
.lecture-topic-line { display: flex; gap: 1.2rem; justify-content: space-between; align-items: flex-start; }
.lecture-topic { flex: 1; min-width: 0; }
.lecture-topic h3 { font-family: inherit; font-size: 1rem; line-height: 1.4; font-weight: 600; letter-spacing: -.02em; margin: 0; color: var(--course-ink); text-wrap: pretty; }
.lecture-topic p { color: var(--course-muted); font-size: .8rem; line-height: 1.5; margin: .35rem 0 0; }
.lecture-library .resource-actions { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; max-width: 55%; flex-shrink: 1; }
.lecture-library .resource-button { display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .55rem; border: 1px solid var(--course-line); border-radius: 4px; background: var(--course-paper); color: var(--course-accent); font-size: .78rem; text-decoration: none; min-height: 35px; }
.lecture-library .resource-button.resource-cheat { border-color: var(--course-selected); background: var(--course-selected); }
.lecture-library .resource-button:hover { background: var(--course-soft); border-color: var(--course-accent); }
.lecture-library .resource-button:active { transform: translateY(1px); }
.lecture-extras { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,220px),1fr)); gap: .8rem 1.2rem; margin-top: .9rem; }
.resource-cluster { min-width: 0; }
.resource-cluster-title { display: flex; align-items: center; gap: .4rem; font-size: .73rem; font-weight: 500; color: var(--course-muted); margin: 0 0 .35rem; }
.lecture-library .resource-links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .3rem; }
.lecture-library .resource-text-link { display: flex; align-items: flex-start; justify-content: space-between; gap: .6rem; min-width: 0; font-size: .8rem; color: var(--course-accent); text-decoration: none; }
.resource-name { min-width: 0; }
.resource-duration { white-space: nowrap; flex-shrink: 0; font-variant-numeric: tabular-nums; color: var(--course-muted); font-size: .72rem; padding-top: .1rem; }
.lecture-library .resource-text-link:hover .resource-name { text-decoration: underline; text-underline-offset: 3px; }
.library-format-note, .lecture-planned { color: var(--course-muted); font-size: .75rem; line-height: 1.6; }
.lecture-planned { margin: .5rem 0 0; }
.library-empty { background: var(--course-paper); border: 1px solid var(--course-line); border-radius: 5px; padding: 2rem 1rem; text-align: center; color: var(--course-muted); }
.library-tools[hidden], .library-result-row[hidden], .lecture-jump button[hidden], .lecture-section[hidden], .lecture-row[hidden], .library-empty[hidden], #lecture-reset[hidden] { display: none !important; }
@media (max-width: 950px) {
  .lecture-topic-line { flex-direction: column; gap: .7rem; }
  .lecture-library .resource-actions { max-width: 100%; justify-content: flex-start; }
}
@media (max-width: 650px) {
  .library-intro { flex-direction: column; gap: .8rem; }
  .library-playlists { justify-content: flex-start; }
  .library-tools { flex-direction: column; align-items: stretch; gap: .8rem; }
  .library-search { max-width: none; }
  .library-tools input, .library-tools select { font-size: 16px; }
  .lecture-section-head { align-items: flex-start; }
  .lecture-section-head h2 { font-size: 1.04rem; }
  .lecture-row { grid-template-columns: 22px minmax(0,1fr); gap: .65rem; padding: 1.05rem .85rem; }
  .lecture-topic h3 { font-size: .97rem; }
  .lecture-extras { grid-template-columns: 1fr; gap: .9rem; }
  .lecture-library .resource-text-link { font-size: .85rem; }
  .resource-key { gap: .5rem .7rem; }
}
@media (pointer: coarse) {
  .lecture-jump a, .lecture-jump button, .library-playlists a, .lecture-library .resource-button, .lecture-library .resource-text-link, .library-result-row button { min-height: 44px; }
  .lecture-library .resource-text-link { align-items: center; }
}
@media (prefers-reduced-motion: reduce) { .lecture-library .resource-button { transition: none; } }
@media print {
  .lecture-jump, .library-tools, .library-result-row, .library-playlists { display: none !important; }
  .lecture-row { break-inside: avoid; }
  .lecture-section[hidden], .lecture-row[hidden] { display: block !important; }
  .lecture-library .resource-button { min-height: 0; padding: 0; border: 0; }
}
