/* The chosen compact-sidebar design, scoped to the teaching pages. */
:root {
  --teaching-paper:#fffefa;
  --teaching-ink:#292c27;
  --teaching-muted:#64675f;
  --teaching-rule:#ddded5;
  --teaching-wash:#f0efe8;
  --teaching-red:#a4352c;
  --teaching-sans:'DM Sans',Arial,sans-serif;
  --teaching-serif:'Instrument Serif',Georgia,serif
}
[data-theme=dark] {
  --teaching-paper:#1c1d1a;
  --teaching-ink:#efeee7;
  --teaching-muted:#b6b8ae;
  --teaching-rule:#42443c;
  --teaching-wash:#272922;
  --teaching-red:#ee9384
}
.teaching-body {
  background:var(--teaching-paper);
  color:var(--teaching-ink);
  font-family:var(--teaching-sans);
  line-height:1.5
}

.teaching-page {
  width:min(1256px,calc(100% - 88px));
  margin:auto;
  padding:104px 0 48px
}
.teaching-page h1,.teaching-page h2,.teaching-page h3,.teaching-page h4,.teaching-page p {
  margin:0
}
.teaching-page h1,.teaching-page h2,.teaching-page h3,.teaching-page h4 {
  text-wrap:balance
}
.teaching-page a {
  text-decoration:none
}
.teaching-page a:hover {
  text-decoration:underline;
  text-underline-offset:4px
}
.teaching-page button,.teaching-page input,.teaching-page select {
  font:inherit;
  color:inherit
}
.teaching-page button {
  cursor:pointer
}
.teaching-page [hidden] {
  display:none!important
}
.teaching-page a:active,.teaching-page button:active {
  opacity:.75
}
.teaching-intro {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:35px;
  padding-bottom:26px
}
.teaching-page .teaching-eyebrow {
  color:var(--teaching-red);
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:8px
}
.teaching-intro h1 {
  font:54px/1.08 var(--teaching-serif);
  letter-spacing:-.025em
}
.teaching-intro p:not(.teaching-eyebrow) {
  font-size:14px;
  color:var(--teaching-muted);
  margin-top:12px
}
.library-search {
  width:340px;
  max-width:45%;
  flex-shrink:0
}
.library-search label {
  display:block;
  font-size:11px;
  color:var(--teaching-muted);
  margin-bottom:7px
}
.library-search>div {
  display:flex;
  gap:10px;
  border-bottom:1px solid var(--teaching-ink);
  padding-bottom:7px
}
.library-search input {
  width:100%;
  min-width:0;
  background:none;
  border:0;
  font-size:12px
}
.library-search button {
  border:0;
  background:none;
  color:var(--teaching-red);
  font-size:12px;
  padding:4px
}

.course-heading {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:15px
}
.course-heading h2 {
  font-size:22px;
  line-height:1.2;
  letter-spacing:-.03em;
  font-weight:500
}
.course-heading>span {
  font-size:11px;
  color:var(--teaching-muted);
  white-space:nowrap
}
.teaching-page .section-note {
  font-size:12px;
  color:var(--teaching-muted);
  margin:9px 0 18px
}

.cover-0,.cover-1,.cover-2,.cover-3 {
  background-image:url('images/teaching/cover-atlas-01.webp')
}
.cover-4,.cover-5,.cover-7 {
  background-image:url('images/teaching/cover-atlas-02.webp')
}
.cover-10 {
  background-image:url('images/teaching/cover-atlas-03.webp')
}
.cover-16,.cover-17,.cover-18 {
  background-image:url('images/teaching/cover-atlas-05.webp')
}
.cover-0,.cover-4,.cover-16 {
  background-position:0 0
}
.cover-1,.cover-5,.cover-17 {
  background-position:100% 0
}
.cover-2,.cover-10,.cover-18 {
  background-position:0 100%
}
.cover-3,.cover-7 {
  background-position:100% 100%
}
.search-results {
  border-bottom:1px solid var(--teaching-rule);
  padding:24px 0 28px
}
.results-heading {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:20px
}
.results-heading h2,.directory-controls h2 {
  font-size:22px;
  font-weight:500;
  letter-spacing:-.03em
}
.results-heading button {
  border:0;
  background:none;
  color:var(--teaching-red);
  font-size:12px
}
.teaching-page [data-result-count] {
  font-size:12px;
  color:var(--teaching-muted);
  margin:8px 0 17px
}
.search-result {
  padding:14px 0;
  border-bottom:1px solid var(--teaching-rule)
}
.search-result h3 {
  font-size:16px;
  font-weight:500;
  line-height:1.4
}
.teaching-page .search-result p {
  font-size:12px;
  color:var(--teaching-muted);
  margin-top:5px
}
.load-more {
  border:1px solid var(--teaching-rule);
  background:transparent;
  border-radius:2px;
  font-size:12px;
  margin-top:18px;
  padding:10px 15px
}
.directory-controls {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:25px;
  border-top:1px solid var(--teaching-ink);
  padding-top:25px
}
.directory-controls label {
  font-size:11px;
  color:var(--teaching-muted)
}
.directory-controls select {
  display:block;
  max-width:350px;
  width:100%;
  margin-top:5px;
  font-size:12px;
  padding:9px;
  border:1px solid var(--teaching-rule);
  background:var(--teaching-paper)
}
.teaching-page .video-count {
  font-size:12px;
  color:var(--teaching-muted);
  margin:17px 0
}
.video-entry {
  border-top:1px solid var(--teaching-rule);
  padding:17px 0
}
.video-entry h3 {
  font-size:16px;
  font-weight:500;
  line-height:1.35
}
.teaching-page .video-entry p {
  font-size:12px;
  color:var(--teaching-muted);
  margin-top:6px
}
.video-list {
  max-width:950px
}
@media(max-width:1100px) {
  .teaching-page {
    width:calc(100% - 56px)
  }
  
  
  
  .course-heading h2 {
    font-size:20px
  }
  
  
  
  
  
  
  
  
  
  
}
@media(max-width:760px) {
  .teaching-page {
    width:calc(100% - 36px)
  }
  
  .teaching-page {
    padding-top:97px
  }
  .teaching-intro {
    display:block;
    padding-bottom:22px
  }
  .teaching-intro h1 {
    font-size:47px
  }
  .teaching-intro p:not(.teaching-eyebrow) {
    font-size:13px;
    max-width:320px
  }
  .library-search {
    width:100%;
    max-width:none;
    margin-top:23px
  }
  .library-search input {
    font-size:16px
  }
  .library-search label {
    font-size:12px
  }
  .library-search button {
    font-size:13px;
    min-height:35px
  }
  
  
  .course-heading h2 {
    font-size:21px;
    max-width:240px
  }
  .course-heading>span {
    font-size:10px
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  .directory-controls {
    display:block;
    padding-top:22px
  }
  .directory-controls label {
    display:block;
    margin-top:20px;
    font-size:12px
  }
  .directory-controls select {
    max-width:100%;
    font-size:16px
  }
  .results-heading h2 {
    font-size:21px
  }
  .results-heading button {
    min-height:44px
  }
  .load-more {
    min-height:44px
  }
  
  .video-entry h3,.search-result h3 {
    font-size:16px
  }
}
@media(prefers-reduced-motion:reduce) {
  .teaching-body {
    scroll-behavior:auto
  }
}
.cover-11 {
  background-image:url('images/teaching/cover-atlas-03.webp');
  background-position:100% 100%
}

/* Additional course playlists use the same generated illustration family. */
.cover-8,.cover-9 { background-image:url('images/teaching/cover-atlas-03.webp'); }
.cover-8 { background-position:0 0; }
.cover-9 { background-position:100% 0; }
.cover-12,.cover-13,.cover-14,.cover-15 { background-image:url('images/teaching/cover-atlas-04.webp'); }
.cover-12 { background-position:0 0; }
.cover-13 { background-position:100% 0; }
.cover-14 { background-position:0 100%; }
.cover-15 { background-position:100% 100%; }
.cover-19 { background-image:url('images/teaching/cover-atlas-05.webp');background-position:100% 100%; }
.cover-20 { background-image:url('images/teaching/cover-atlas-06.webp');background-size:300% 200%;background-position:0 0; }

.teaching-page section,.sheet-group { scroll-margin-top:90px; }

.teaching-cheatsheets { margin-top:38px;border-top:1px solid var(--teaching-ink);padding-top:25px; }
.sheet-group { border-top:1px solid var(--teaching-rule); }
.sheet-group:last-child { border-bottom:1px solid var(--teaching-rule); }
.sheet-group summary { display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:16px 0;cursor:pointer;list-style:none;font-size:15px;font-weight:500; }
.sheet-group summary::-webkit-details-marker { display:none; }
.sheet-group summary:hover>span:first-child { text-decoration:underline;text-underline-offset:4px; }
.sheet-group summary>span:last-child { flex-shrink:0;font-size:11px;font-weight:400;color:var(--teaching-red); }
.sheet-group[open] summary { color:var(--teaching-red); }
.teaching-page .sheet-course { color:var(--teaching-muted);font-size:11px;line-height:1.7; }
.sheet-course a { color:var(--teaching-red); }
.teaching-page .sheet-description { font-size:12px;color:var(--teaching-muted);margin-top:8px; }
.sheet-list { list-style:none;padding:0;margin:14px 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:0 22px; }
.sheet-list li { border-top:1px solid var(--teaching-rule);padding:12px 0;min-width:0; }
.sheet-list a { display:block;font-size:13px;line-height:1.45; }
.sheet-list li>span { display:block;font-size:10px;color:var(--teaching-muted);margin-top:5px; }
@media(max-width:760px) {
  .sheet-list { grid-template-columns:1fr; }
  .sheet-list a { font-size:14px; }
  
  .sheet-group summary { min-height:48px; }
}

.sheet-group summary small { display:block;font-size:11px;color:var(--teaching-muted);font-weight:400;margin-top:5px; }
.result-types { display:flex;flex-wrap:wrap;gap:6px;margin-top:18px; }
.result-types button { border:1px solid var(--teaching-rule);border-radius:2px;background:transparent;padding:7px 10px;font-size:12px; }
.result-types button[aria-pressed=true] { border-color:var(--teaching-ink);background:var(--teaching-ink);color:var(--teaching-paper); }
.result-types button>span { margin-left:8px;font-variant-numeric:tabular-nums;opacity:.7; }
.course-sheets::before,.sheet-list a::before,#cheatsheets-heading::before {
  content:'';
  display:inline-block;
  width:14px;
  height:17px;
  margin-right:6px;
  vertical-align:-3px;
  background-color:var(--teaching-red);
  -webkit-mask:url('images/teaching/document.svg') center/contain no-repeat;
  mask:url('images/teaching/document.svg') center/contain no-repeat;
}
#cheatsheets-heading::before { width:19px;height:22px;margin-right:9px; }
.sheet-list a { display:flex;align-items:flex-start; }
.sheet-list a::before { flex:0 0 14px;margin-top:2px; }
@media(max-width:760px) {
  
  
  
  
  
  
  .result-types button { min-height:44px; }
}

/* Refined index: jump strip, this-semester feature, one row per course, playlist grid. */
.teaching-intro { border-bottom:2px solid var(--teaching-ink);padding-bottom:18px; }
.section-jumps { display:flex;flex-wrap:wrap;gap:6px 22px;font-size:13.5px;padding:12px 0;border-bottom:1px solid var(--teaching-rule); }
.teaching-page .section-jumps a { color:var(--teaching-ink); }
.teaching-page .section-jumps a:hover { color:var(--teaching-red); }
.teaching-page .search-results { margin-top:26px; }
.teaching-courses,.teaching-videos,.teaching-cheatsheets { margin-top:34px;border-top:1px solid var(--teaching-rule);padding-top:22px; }
.feature { display:grid;grid-template-columns:220px minmax(0,1fr);gap:22px;align-items:center;background:var(--teaching-wash);padding:20px;margin-top:26px; }
.feature h2 { font:700 28px/1.2 var(--heading);letter-spacing:-.035em;margin-bottom:4px; }
.teaching-page .feature p:not(.teaching-eyebrow) { color:var(--teaching-muted); }
.feature .actions { display:flex;flex-wrap:wrap;gap:8px;margin-top:12px; }
.teaching-page .button { display:inline-block;padding:8px 13px;border:1px solid var(--teaching-red);color:var(--teaching-red);font-size:13.5px;line-height:1.3; }
.teaching-page .button.solid,.teaching-page .button:hover { background:var(--teaching-red);color:var(--teaching-paper);text-decoration:none; }
.feature .course-sheets::before { display:none; }
.collection-cover { display:block;aspect-ratio:16/9;background-color:#eee9db;background-size:200% 200%;background-repeat:no-repeat; }
.table-wrap { overflow-x:auto; }
.course-table { width:100%;border-collapse:collapse;min-width:640px; }
.course-table th,.course-table td { text-align:left;padding:12px 12px 12px 0;border-bottom:1px solid var(--teaching-rule);vertical-align:top; }
.course-table thead th { font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--teaching-muted);font-weight:600;border-bottom:1px solid var(--teaching-ink); }
.course-table tbody th { font-weight:400;width:34%; }
.teaching-page .course-table tbody th>a:first-child { display:block;color:var(--teaching-ink);font:600 16px/1.3 var(--heading); }
.teaching-page .course-table tbody th>a:first-child:hover { color:var(--teaching-red); }
.course-code { display:block;font-size:13px;color:var(--teaching-muted); }
.course-table .course-sheets { display:inline-flex;align-items:center;font-size:12px;margin-top:4px;color:var(--teaching-red); }
.course-table td.num { font-size:13px;color:var(--teaching-muted);font-variant-numeric:tabular-nums;white-space:nowrap; }
.chips { display:flex;flex-wrap:wrap;gap:6px; }
.offering { display:inline-block;font-size:11.5px;line-height:1;padding:5px 7px;border:1px solid var(--teaching-rule);white-space:nowrap;font-variant-numeric:tabular-nums; }
.teaching-page a.offering { color:var(--teaching-ink); }
.teaching-page .offering.is-recorded { border-color:var(--teaching-red);color:var(--teaching-red); }
.teaching-page .offering.is-current { background:var(--teaching-red);border-color:var(--teaching-red);color:var(--teaching-paper); }
.teaching-page a.offering:hover { border-color:var(--teaching-ink);text-decoration:none; }
.chip-legend { display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:12.5px;color:var(--teaching-muted);margin-top:12px!important; }
.collection-group { display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:22px; }
.collection-group>h3 { font:600 18px/1.3 var(--heading);letter-spacing:-.02em; }
.group-count { font-size:13px;color:var(--teaching-muted);font-variant-numeric:tabular-nums; }
.collection-grid { flex-basis:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:18px;margin-top:8px; }
.collection { display:flex;flex-direction:column;gap:4px;min-width:0; }
.collection h4 { font-weight:600;font-size:14.5px;line-height:1.3;margin-top:6px!important; }
.teaching-page .collection h4 a { color:var(--teaching-ink); }
.teaching-page .collection h4 a:hover { text-decoration-color:var(--teaching-red); }
.teaching-page .collection-meta,.teaching-page .collection-description { font-size:13px;color:var(--teaching-muted);font-variant-numeric:tabular-nums; }
.all-videos-link { display:inline-block;margin-top:22px;font-size:13.5px; }
.teaching-page .sheet-list a { color:var(--teaching-ink); }
.teaching-page .sheet-list a:hover { color:var(--teaching-red); }
.sheet-group summary em { display:block;font-style:normal;font-size:13px;font-weight:400;color:var(--teaching-muted);margin-top:4px; }
@media(max-width:760px) {
 .feature { grid-template-columns:1fr; }
 .teaching-intro { flex-direction:column;align-items:stretch; }
 .library-search { width:auto;max-width:none; }
}
