/* One white wall, one type family, one accent. The content supplies the hierarchy. */
:root { --white:#fff; --ink:#1a1a1a; --body:#444; --muted:#6b6b6b; --line:#ececec; --accent:#5b93d1; --sidebar:248px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:32px; }
body { margin:0; background:var(--white); color:var(--ink); font-family:Inter,sans-serif; font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:0 0 auto; height:2px; background:var(--accent); z-index:20; pointer-events:none; }
a { color:var(--ink); text-decoration-line:underline; text-decoration-color:var(--accent); text-underline-offset:4px; text-decoration-thickness:1px; }
a:hover { text-decoration-thickness:2px; }
a:focus-visible, button:focus-visible, iframe:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
button { font:inherit; color:inherit; }
strong { font-weight:600; }
img { max-width:100%; }
p { margin:0 0 18px; color:var(--body); }
h1,h2,h3 { color:var(--ink); font-weight:600; }
h1 { text-wrap:balance; font-size:clamp(34px,2.8vw,40px); line-height:1.18; letter-spacing:-.025em; margin:12px 0 20px; }
h2 { font-size:21px; line-height:1.35; letter-spacing:-.02em; margin:0 0 16px; }
h3 { font-size:16px; line-height:1.5; margin:30px 0 10px; }
.eyebrow,.course-code { font-size:10.5px; line-height:1.6; font-weight:500; text-transform:uppercase; letter-spacing:.16em; color:var(--muted); }
.eyebrow { margin:0 0 10px; }
.skip-link { position:fixed; top:12px; left:12px; padding:10px 16px; background:white; border:1px solid var(--ink); transform:translateY(-180%); z-index:10; }
.skip-link:focus { transform:translateY(0); }
.site-sidebar { position:fixed; inset:0 auto 0 0; width:var(--sidebar); padding:42px 27px 24px; border-right:1px solid var(--line); display:flex; flex-direction:column; background:white; z-index:5; overflow-y:auto; }
.cbs-logo { display:block; width:200px; height:auto; object-fit:contain; object-position:left center; margin:0 0 36px; flex-shrink:0; }
.course-brand { text-decoration:none; display:flex; align-items:center; gap:12px; }
.course-brand img { display:block; width:25px; height:48px; flex-shrink:0; }
.brand-title { display:block; font-size:20px; line-height:1.3; font-weight:600; letter-spacing:-.025em; }
.course-code { margin:17px 0 0; white-space:nowrap; letter-spacing:.115em; font-size:10.5px; }
.sidebar-panel { display:flex; flex-direction:column; flex:1; }
.nav-list { list-style:none; padding:0; margin:42px 0 36px; }
.nav-list a { display:flex; align-items:center; position:relative; padding:10px 0 10px 17px; min-height:44px; font-size:14px; text-decoration:none; color:var(--body); transition:background-color .15s ease; }
.nav-list a:hover { background:#fafafa; }
.nav-list a[aria-current="page"] { font-weight:600; color:var(--ink); }
.nav-list a[aria-current="page"]::before { content:""; position:absolute; width:2px; height:2px; border-radius:50%; background:var(--accent); left:1px; top:50%; }
.sidebar-resources { margin-top:auto; padding-top:22px; border-top:1px solid var(--line); }
.sidebar-resources .eyebrow { margin-bottom:10px; }
.resource-link { display:flex; align-items:center; justify-content:space-between; min-height:40px; gap:8px; font-size:12px; text-decoration:none; }
.resource-link > span:first-child { text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:4px; }
.link-status,.inline-status { color:var(--muted); font-size:11px; white-space:nowrap; }
[data-pending] { cursor:default; }
.menu-toggle { display:none; }
main { margin-left:var(--sidebar); padding:76px 48px 0; }
main:focus { outline:none; }
.content { max-width:680px; margin:0 auto; }
.page-heading { margin-bottom:32px; }
.page-title-row { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:12px 0 20px; }
.page-title-row h1 { flex:1; margin:0; }
.page-illustration { display:block; width:112px; height:88px; object-fit:contain; flex-shrink:0; }
.subline { color:var(--muted); font-size:13px; line-height:1.8; max-width:610px; margin-bottom:0; }
.lead { font-size:17px; line-height:1.75; }
.up-next { margin-top:30px; padding:23px 0 20px; border-top:1px solid var(--line); }
.up-next .eyebrow { letter-spacing:.16em; }
.next-session { font-size:16px; font-weight:500; color:var(--ink); margin-bottom:8px; }
.next-due { font-size:14px; margin-bottom:0; }
.announcements { border-top:1px solid var(--line); padding:20px 0 0; }
.announcements h2 { margin-bottom:8px; }
.announcements p { color:var(--muted); font-size:14px; margin:0; }
.announcement-list { padding-left:20px; margin:0; font-size:14px; color:var(--body); }
.announcement-list li + li { margin-top:12px; }
.announcement-date { display:block; color:var(--muted); font-size:12px; }
figcaption { font-size:12px; color:var(--muted); line-height:1.6; margin-top:12px; }
.home-section { margin-top:52px; }
.week-index { list-style:none; padding:0; margin:20px 0 0; border-top:1px solid var(--line); }
.week-index li { border-bottom:1px solid var(--line); }
.week-index a { display:grid; grid-template-columns:68px 1fr 16px; gap:14px; align-items:center; min-height:51px; padding:12px 0; text-decoration:none; }
.week-index .eyebrow { margin:0; }
.week-link-title { font-size:14px; }
.link-arrow { font-size:15px; color:var(--accent); transition:transform .15s ease; }
.week-index a:hover { background:#fafafa; }
.week-index a:hover .link-arrow { transform:translate(2px,-2px); }
.facts { margin:22px 0 0; border-top:1px solid var(--line); }
.facts > div { display:grid; grid-template-columns:132px 1fr; gap:20px; border-bottom:1px solid var(--line); padding:17px 0; }
dt { font-size:13px; font-weight:500; color:var(--muted); }
dd { margin:0; color:var(--body); }
.facts dd { font-size:14px; }
.audience { display:grid; grid-template-columns:1fr 1fr; gap:36px; padding-top:32px; border-top:1px solid var(--line); }
.audience h2 { font-size:20px; }
.audience p { font-size:14px; }
.page-footer { display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; border-top:1px solid var(--line); margin-top:72px; padding:22px 0 30px; color:var(--muted); font-size:10px; letter-spacing:.04em; }
.preclass-note { padding:0 0 24px; }
.preclass-note p:last-child { margin:0; font-size:14px; }
.week-block,.project-block { border-top:1px solid var(--line); padding:35px 0 36px; scroll-margin-top:30px; }
.week-block { display:grid; grid-template-columns:60px minmax(0,1fr); gap:24px; }
.week-number { color:var(--accent); font-size:40px; line-height:1; font-weight:300; letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.section-meta { display:flex; justify-content:space-between; gap:16px; margin-bottom:13px; }
.section-meta .eyebrow { margin:0; }
.date-label { color:var(--muted); font-size:12px; white-space:nowrap; }
.week-goal { margin-bottom:26px; }
.week-details,.detail-list { margin:0; }
.week-details > div,.detail-list > div { display:grid; grid-template-columns:112px 1fr; column-gap:20px; padding:7px 0; }
.week-details dd,.detail-list dd { font-size:14px; line-height:1.7; }
.week-details .due-row { padding:15px 0; margin:6px 0; }
.due-row dd { display:flex; flex-wrap:wrap; gap:10px; align-items:baseline; }
.due-label { color:var(--ink); font-size:10.5px; font-weight:500; letter-spacing:.14em; line-height:1.5; text-transform:uppercase; text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:2px; text-underline-offset:4px; }
.project-block:first-of-type { margin-top:34px; }
.project-block p { margin-bottom:22px; }
.policy-section { margin-top:44px; padding-top:34px; border-top:1px solid var(--line); }
.policy-section.first-section { padding-top:0; margin-top:0; border-top:0; }
table { border-collapse:collapse; width:100%; margin:28px 0 20px; font-size:14px; line-height:1.55; font-variant-numeric:tabular-nums; table-layout:fixed; }
caption { text-align:left; font-size:16px; font-weight:600; margin-bottom:14px; }
th,td { padding:14px 10px 14px 0; vertical-align:top; text-align:left; border-bottom:1px solid var(--line); overflow-wrap:break-word; }
thead th { color:var(--muted); font-size:11px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; border-top:1px solid var(--line); }
tbody th { font-weight:500; }
td { color:var(--body); }
th:last-child,td:last-child { padding-right:0; }
.grade-table th:first-child { width:31%; }
.grade-table .points { width:13%; text-align:right; padding-right:22px; }
.threshold-table th:first-child { width:34%; }
.table-note { font-size:13px; color:var(--muted); }
.plain-list { padding-left:20px; color:var(--body); }
.plain-list li { margin-bottom:10px; padding-left:3px; }
.toolkit-list { margin:30px 0 0; }
.toolkit-list > div { border-top:1px solid var(--line); padding:25px 0 26px; display:grid; grid-template-columns:220px 1fr; column-gap:32px; }
.toolkit-list dt .eyebrow { display:block; margin-bottom:9px; }
.toolkit-list h2 { margin-bottom:0; }
.toolkit-list dd { padding-top:24px; font-size:15px; }
.staff-block { border-top:1px solid var(--line); padding:30px 0 28px; }
.staff-block h2 { font-size:22px; margin-bottom:7px; }
.staff-role { color:var(--muted); font-size:14px; margin-bottom:22px; }
.staff-block p:last-child { margin:0; }
@media (max-width:819px) {
  html { scroll-padding-top:166px; }
  .site-sidebar { position:sticky; inset:0 0 auto; width:100%; padding:17px 24px; border-right:0; border-bottom:1px solid var(--line); max-height:100svh; overflow-y:auto; }
  .sidebar-heading { position:relative; display:flex; align-items:center; min-height:44px; padding-right:78px; }
  .cbs-logo { margin-bottom:20px; }
  .course-brand { display:flex; gap:13px; align-items:center; }
  .course-brand img { width:25px; height:48px; margin:0; flex-shrink:0; }
  .brand-title { font-size:15px; line-height:1.3; letter-spacing:-.02em; }
  .course-code { display:none; }
  .desktop-break { display:none; }
  .js .menu-toggle { display:flex; justify-content:flex-end; align-items:center; gap:10px; position:absolute; right:0; top:0; padding:0; min-width:68px; min-height:44px; border:0; background:none; font-size:12px; cursor:pointer; }
  .menu-icon { display:block; width:16px; height:9px; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }
  .is-open .menu-icon { height:1px; border-bottom:0; }
  .js .sidebar-panel { display:none; }
  .js .is-open .sidebar-panel { display:flex; }
  .nav-list { margin:22px 0 18px; }
  .nav-list a { padding-top:11px; padding-bottom:11px; font-size:15px; }
  .sidebar-resources { margin-top:0; padding-top:16px; }
  .sidebar-resources .eyebrow { margin-bottom:4px; }
  .resource-link { font-size:13px; min-height:44px; }
  main { margin-left:0; padding:44px 24px 0; }
  h1 { text-wrap:balance; font-size:34px; }
  .page-heading { margin-bottom:27px; }
  .page-title-row { gap:16px; }
  .page-illustration { width:88px; height:72px; }
  .lead { font-size:16px; }
  .home-section { margin-top:40px; }
  .week-index a { grid-template-columns:56px 1fr 14px; gap:10px; min-height:56px; }
  .week-link-title { line-height:1.5; }
  .facts > div { grid-template-columns:100px 1fr; gap:18px; padding:16px 0; }
  .audience { grid-template-columns:1fr; gap:23px; }
  .audience p:last-child { margin-bottom:0; }
  .page-footer { margin-top:52px; gap:5px; flex-direction:column; }
  .week-block,.project-block { padding:29px 0 30px; scroll-margin-top:16px; }
  .week-block { grid-template-columns:1fr; gap:18px; }
  .week-details > div,.detail-list > div { grid-template-columns:1fr; gap:4px; padding:9px 0; }
  .week-details dt,.detail-list dt { font-size:12px; }
  .week-details .due-row { padding:12px 0; }
  .section-meta { gap:10px; }
  .section-meta .eyebrow { font-size:10.5px; letter-spacing:.12em; }
  .date-label { font-size:11px; }
  .project-block p { font-size:15px; }
  table { font-size:13px; }
  th,td { padding:13px 9px 13px 0; }
  thead th { font-size:10px; letter-spacing:0; }
  .grade-table th:first-child { width:32%; }
  .grade-table .points { width:16%; padding-right:12px; }
  .threshold-table th:first-child { width:36%; }
  .policy-section { margin-top:36px; padding-top:28px; }
  .toolkit-list > div { grid-template-columns:1fr; gap:12px; }
  .toolkit-list dd { padding-top:0; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; animation:none !important; } }


/* ---- 2026-09-27: readability + the notebook type pairing (Source Serif 4 for reading, Helvetica Neue for UI) ---- */
:root { --body:#2d2d2d; --muted:#595959; }
body { font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; }
/* reading text: serif, larger, darker */
.lead, .content p, .content dd, .content li, .content td, .next-session, .next-due, .announcements p {
  font-family:"Source Serif 4", Georgia, serif; font-optical-sizing:auto; color:var(--body); }
.content p, .content li { font-size:17px; line-height:1.5; }
.lead { font-size:19px; line-height:1.5; }
.content dd, .facts dd, .week-details dd, .detail-list dd, .toolkit-list dd { font-size:16.5px; line-height:1.5; }
.content td { font-size:15.5px; }
.next-session { font-size:18px; font-weight:600; color:#222; }
.next-due, .announcements p { font-size:16px; }
/* headings: serif, as in the notebook */
h1, h2, h3, .brand-title { font-family:"Source Serif 4", Georgia, serif; letter-spacing:-.01em; color:#222; }
h1 { font-size:clamp(32px,2.6vw,38px); }
h2 { font-size:22px; }
/* UI stays sans and gets darker */
.nav-list a { font-size:15px; color:#222; }
dt, .content dt { font-size:13px; color:var(--muted); }
.subline, .date-label, .link-status, .inline-status, .eyebrow, .course-code, .page-footer, thead th { color:var(--muted); }
.subline { font-size:14px; }
.date-label { font-size:13px; }
.week-link-title { font-size:16px; }
.audience p { font-size:16.5px; }
/* more air */
.week-details div, .detail-list div, .facts div { padding-top:4px; padding-bottom:4px; }
.week-block { padding-top:40px; padding-bottom:40px; }
@media (max-width: 820px) {
  .content p, .content li { font-size:16.5px; }
  .lead { font-size:17.5px; }
  .content dd, .week-details dd, .detail-list dd { font-size:16px; }
  table, .content td { font-size:14.5px; }
}

/* ---- 2026-09-27 r3: plain and direct. No decorative labels, stripes, or oversized numbers. ---- */
body::before { display:none; }
.eyebrow, .course-code, .week-label { font-size:14px; letter-spacing:0; text-transform:none; font-weight:400; color:var(--muted); }
.course-code { margin-top:12px; }
.nav-list a[aria-current="page"]::before { display:none; }
.nav-list a { padding-left:0; }
.sidebar-resources { padding-top:16px; }
.up-next h2 { margin-bottom:10px; }
.week-index a { grid-template-columns:72px 1fr; }
.week-block { display:block; }
.section-meta { align-items:baseline; }
.section-meta h2 { margin:0; }
.preclass-note h2 { margin-bottom:8px; }
thead th { text-transform:none; letter-spacing:0; font-size:13px; }
.toolkit-list dt h2 { margin:0; }
.toolkit-list dd { padding-top:4px; }
/* wider sidebar so "B8403: Finance in the Age of AI" fits on one line */
:root { --sidebar:340px; }
@media (max-width:819px) { .site-sidebar { width:100%; } }

/* ---- 2026-09-27 r8: fixed top bar carries the logo and course name; the left pane holds only page links ---- */
:root { --topbar:76px; --sidebar:220px; }
.topbar { position:fixed; inset:0 0 auto 0; height:var(--topbar); display:flex; align-items:center; gap:24px; padding:0 32px; background:#fff; border-bottom:1px solid var(--line); z-index:10; }
.topbar .cbs-logo { width:190px; height:auto; margin:0; }
.topbar .course-brand { display:flex; align-items:baseline; gap:12px; padding-left:24px; border-left:1px solid var(--line); text-decoration:none; }
.topbar .brand-title { font-size:20px; line-height:1.3; white-space:nowrap; }
.brand-term { font-size:15px; color:var(--muted); white-space:nowrap; }
.site-sidebar { top:var(--topbar); width:var(--sidebar); padding:24px 32px 24px; }
.nav-list { margin-top:8px; }
main { padding-top:calc(var(--topbar) + 56px); }
html { scroll-padding-top:calc(var(--topbar) + 24px); }
@media (max-width:819px) {
  :root { --topbar:64px; }
  .topbar { padding:0 16px; gap:12px; }
  .topbar .cbs-logo { width:132px; }
  .topbar .course-brand { flex-direction:column; gap:0; padding-left:12px; min-width:0; }
  .topbar .brand-title { font-size:14px; white-space:normal; }
  .brand-term { font-size:12px; }
  .js .menu-toggle { position:static; margin-left:auto; flex-shrink:0; }
  .site-sidebar { position:fixed; top:var(--topbar); inset:var(--topbar) 0 auto 0; width:100%; padding:0 16px; border-right:0; display:none; }
  .js .site-sidebar.is-open { display:block; border-bottom:1px solid var(--line); }
  .js .site-sidebar .sidebar-panel { display:flex; }
  main { padding-top:calc(var(--topbar) + 32px); }
}
/* logo is now a <picture>: size the image inside it */
.topbar .cbs-logo { display:block; flex-shrink:0; }
.topbar .cbs-logo img { display:block; width:190px; height:auto; }
@media (max-width:819px) {
  .topbar .cbs-logo { width:auto; }
  .topbar .cbs-logo img { width:30px; }
  .topbar .brand-title { font-size:15px; }
}

/* ---- 2026-09-28: aligned dividers, instructor in the left pane, tighter vertical spacing ---- */
:root { --sidebar:240px; }
@media (min-width:820px) {
  .topbar { padding:0; gap:0; }
  .topbar .cbs-logo { width:var(--sidebar); padding-left:32px; box-sizing:border-box; }
  .topbar .course-brand { padding-left:28px; }
}
.sidebar-instructor { margin-top:14px; padding-top:14px; border-top:1px solid var(--line); font-size:13px; }
.sidebar-instructor p { margin:0 0 4px; font-family:inherit; font-size:13px; color:var(--ink); }
.sidebar-instructor a { font-size:13px; }
.nav-list { margin:0 0 20px; }
.nav-list a { padding-top:5px; padding-bottom:5px; min-height:34px; }
.resource-link { min-height:30px; }
main { padding-top:calc(var(--topbar) + 40px); }
.page-heading { margin-bottom:18px; }
h1 { margin:0 0 14px; }
.content p { margin-bottom:20px; }
.content li { margin-bottom:12px; }
.up-next { margin-top:18px; padding:16px 0 12px; }
.announcements { padding-top:14px; }
.announcements h2, .up-next h2 { margin-bottom:6px; }
.home-section { margin-top:36px; }
h2 { margin-bottom:10px; }
.week-index { margin-top:10px; }
.week-index a { min-height:0; padding:8px 0; }
.facts { margin-top:10px; }
.facts > div { padding:9px 0; }
.preclass-note { padding-bottom:14px; }
.week-block, .project-block { padding:24px 0 22px; }
.section-meta { margin-bottom:6px; }
.week-goal { margin-bottom:12px; }
.week-details > div, .detail-list > div { padding:3px 0; }
.week-details .due-row { padding:3px 0; margin:0; }
.policy-section { margin-top:28px; padding-top:22px; }
table { margin:16px 0 12px; }
th, td { padding:9px 10px 9px 0; }
.toolkit-list { margin-top:16px; }
.toolkit-list > div { padding:16px 0; }
.staff-block { padding:20px 0 16px; }
.page-footer { margin-top:48px; }
@media (max-width:819px) { .nav-list a { min-height:40px; } }

/* ---- 2026-09-28: content hugs the left pane and is narrower ---- */
main { padding-left:56px; padding-right:40px; }
.content { max-width:640px; margin:0; }
.facts > div { grid-template-columns:112px 1fr; gap:16px; }
.week-details > div, .detail-list > div { grid-template-columns:112px 1fr; column-gap:16px; }
@media (max-width:819px) { main { padding-left:24px; padding-right:24px; } }

/* ---- 2026-09-28: page menu moves to the top bar; the left pane shows the page outline ---- */
.topnav { margin-left:auto; padding-right:32px; }
.topnav ul { list-style:none; display:flex; gap:26px; margin:0; padding:0; }
.topnav a { font-size:15px; color:#222; text-decoration:none; padding:6px 0; border-bottom:2px solid transparent; }
.topnav a:hover { border-bottom-color:var(--line); }
.topnav a[aria-current="page"] { font-weight:600; border-bottom-color:var(--accent); }
.site-sidebar { display:flex; flex-direction:column; padding-top:36px; }
.outline-title { font-size:13px; color:var(--muted); margin:0 0 10px; }
#outline { list-style:none; margin:0; padding:0; }
#outline a { display:block; padding:4px 0; font-size:14px; line-height:1.4; color:#444; text-decoration:none; }
#outline a:hover { color:var(--ink); }
#outline a.is-current { color:var(--ink); font-weight:600; }
.sidebar-foot { margin-top:auto; padding-top:24px; }
.sidebar-resources { margin-top:0; }
@media (max-width:1180px) and (min-width:820px) { .topnav ul { gap:18px; } .topnav a { font-size:14px; } .topbar .brand-term { display:none; } }
@media (max-width:819px) {
  .topnav { display:none; position:fixed; inset:var(--topbar) 0 auto 0; background:#fff; padding:6px 16px 8px; border-bottom:1px solid var(--line); }
  .topnav ul { flex-direction:column; gap:0; }
  .topnav a { display:block; padding:10px 0; border-bottom:0; font-size:16px; }
  .topnav a[aria-current="page"] { border-bottom:0; }
  .menu-open .topnav { display:block; }
  .page-outline { display:none; }
  .site-sidebar, .js .site-sidebar.is-open { display:none; }
  .menu-open .site-sidebar { display:block; position:fixed; left:0; right:0; bottom:auto; width:100%; padding:0 16px 12px; background:#fff; border-bottom:1px solid var(--line); z-index:9; }
  .menu-open .sidebar-foot { padding-top:8px; }
}
@media (max-width:819px) { .menu-open .sidebar-resources { border-top:0; padding-top:0; } }

/* ---- 2026-09-28: page menu sits under the course title ---- */
@media (min-width:820px) {
  :root { --topbar:104px; }
  .topbar { align-items:center; }
  .topbar-main { display:flex; flex-direction:column; justify-content:center; gap:10px; border-left:1px solid var(--line); padding-left:28px; align-self:stretch; }
  .topbar .course-brand { border-left:0; padding-left:0; }
  .topnav { margin-left:0; padding-right:0; }
  .topnav ul { gap:24px; }
  .topnav a { font-size:15px; padding:2px 0 4px; }
  .topbar .brand-term { display:inline; }
}
@media (max-width:819px) { .topbar-main { display:contents; } }

/* ---- 2026-09-28: Syllabus page sub-headings ---- */
.content h3 { font-family:"Source Serif 4", Georgia, serif; font-size:19px; font-weight:600; color:#222; margin:0; }
.preclass-note h3 { margin:8px 0 6px; }
.section-meta h3 { margin:0; }
.project-block h3 { margin:0 0 8px; }
.home-section.first-section { margin-top:0; }
.toolkit-list dt h3 { font-size:17px; margin:0; } .toolkit-list > div { grid-template-columns:180px 1fr; padding:12px 0; }

/* ---- 2026-09-28: merged Syllabus page ---- */
.sub-block { margin-top:22px; }
.sub-block h3 { margin-bottom:8px; }

/* ---- 2026-09-28: tighter tables and label/value rows ---- */
.facts > div { padding:6px 0; }
.facts dd, .week-details dd, .detail-list dd, .toolkit-list dd, .content td { line-height:1.45; }
.facts dt, .week-details dt, .detail-list dt { padding-top:2px; }
.week-details > div, .detail-list > div { padding:2px 0; }
.week-index a { padding:6px 0; }
.toolkit-list > div { padding:8px 0; }
table { margin:10px 0 8px; }
th, td { padding:6px 10px 6px 0; }
thead th { padding-top:8px; padding-bottom:6px; }
caption { margin-bottom:6px; }
.week-goal { margin-bottom:8px; }
.plain-list li, .content ul li, .content ol li { margin-bottom:4px; }

/* ---- 2026-09-28: Library sub-menu (one link per week's topic) ---- */
.subnav ul { list-style:none; display:flex; flex-wrap:wrap; gap:4px 20px; margin:0; padding:0; }
.subnav a { font-size:14px; color:var(--muted); text-decoration:none; padding:2px 0; border-bottom:1px solid transparent; }
.subnav a:hover { color:var(--ink); }
.subnav a[aria-current="page"] { color:var(--ink); font-weight:600; border-bottom-color:var(--accent); }
.subnav-inline { display:none; }
@media (min-width:820px) { body.in-library { --topbar:136px; } .subnav-top { padding-top:10px; border-top:1px solid var(--line); margin-right:32px; } }
@media (max-width:819px) { .subnav-top { display:none; } .subnav-inline { display:block; margin:0 0 20px; } }
.library-index { list-style:none; padding:0; margin:16px 0 0; border-top:1px solid var(--line); }
.library-index li { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--line); }
.library-index span { color:var(--muted); font-size:14px; }
@media (min-width:820px) and (max-width:1180px) { body.in-library { --topbar:166px; } }

/* ---- 2026-09-28: weeks are top-level sections on the Syllabus; instructor line in footer ---- */
.week-block .section-meta h2 { font-size:22px; margin:0; }
.week-details > div { grid-template-columns:128px 1fr; }
.page-footer { font-size:12px; letter-spacing:0; color:var(--muted); }
.page-footer a { font-size:12px; color:var(--muted); }

/* ---- 2026-09-28: "Contents" reads as its own element: serif title, Columbia Blue marker for the current section ---- */
.outline-title { font-family:"Source Serif 4", Georgia, serif; font-size:16px; font-weight:600; color:#222; margin:0 0 8px; padding-bottom:8px; border-bottom:1px solid var(--line); }
#outline a { color:#6b6b6b; font-size:13.5px; }
#outline a:hover { color:var(--ink); }
#outline a.is-current { color:#2F6FB8; font-weight:600; }

/* one item per line in the Syllabus week rows */
.row-list { list-style:none; margin:0; padding:0; }
.content .row-list li { margin:0 0 2px; font-size:16.5px; line-height:1.45; }
.week-details > div { padding:4px 0; }

/* ---- 2026-09-28: Library week pages = topics, each with Required and Optional materials ---- */
.topic-block { border-top:1px solid var(--line); padding:18px 0 8px; }
.topic-block h2 { margin-bottom:8px; }
.material-group { display:grid; grid-template-columns:96px 1fr; gap:16px; padding:4px 0; }
.material-group h3 { font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-size:13px; font-weight:500; color:var(--muted); margin:3px 0 0; }
.material-list { list-style:none; margin:0; padding:0; }
.content .material-list li { display:grid; grid-template-columns:64px 1fr; gap:10px; margin:0 0 8px; }
.material-kind { font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-size:12px; color:var(--muted); padding-top:3px; }
.material-source, .material-note { display:block; font-size:14px; color:var(--muted); }
.content p.material-empty { margin:0; color:var(--muted); font-size:15px; }
.library-index { margin-top:0; }
@media (max-width:819px) { .material-group { grid-template-columns:1fr; gap:4px; } }

/* ---- 2026-09-28: Required badge + required-only filter ---- */
.library-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.library-head .lead { margin:0 0 14px; }
.required-toggle { font:500 13px/1 "Helvetica Neue", Helvetica, Arial, sans-serif; color:var(--ink); background:#fff; border:1px solid #cfd8e3; border-radius:6px; padding:7px 12px; cursor:pointer; }
.required-toggle:hover { border-color:var(--accent); }
.required-toggle[aria-pressed="true"] { background:#eef4fb; border-color:var(--accent); color:#1f4f86; }
.badge-required { display:inline-block; font:600 11px/1 "Helvetica Neue", Helvetica, Arial, sans-serif; color:#2F6FB8; border:1px solid #9dbfe6; background:#f3f8fd; border-radius:4px; padding:3px 6px; margin-right:8px; vertical-align:2px; }
.topic-block { padding:14px 0 6px; }
.topic-block h2 { font-size:20px; margin-bottom:10px; }
.content .material-list li { grid-template-columns:60px 1fr; margin:0 0 10px; }
.material[hidden] { display:none !important; }
.content p.material-empty { margin:0 0 8px; }

/* ---- 2026-09-28: Library items as a plain bulleted list ---- */
.material-list { list-style:disc; padding-left:20px; margin:0; }
.content .material-list li { display:list-item; margin:0 0 10px; padding-left:2px; }
.content .material-list li::marker { color:#9aa3ad; }
.material-source { display:block; font-size:14px; color:var(--muted); margin-top:1px; }

/* ---- 2026-09-28: bullets for Syllabus topics and in-class activities ---- */
.row-list { list-style:disc; padding-left:18px; }
.content .row-list li { display:list-item; padding-left:2px; }
.content .row-list li::marker { color:#9aa3ad; }
.row-list { padding-left:0; } .content .row-list li { padding-left:0; }
#outline a.is-current { font-weight:400; color:#2F6FB8; } /* colour only, so the line never re-wraps */

/* ---- 2026-09-29: same three-row top bar on every page; name under the logo ---- */
@media (min-width:820px) {
  :root { --topbar:136px; }
  .subnav-empty { min-height:31px; }
  .topbar .logo-cell { width:var(--sidebar); padding-left:32px; box-sizing:border-box; flex-shrink:0; }
  .topbar .logo-cell .cbs-logo { width:auto; padding-left:0; }
  .logo-sub { margin:10px 0 0; font-size:13px; color:var(--muted); white-space:nowrap; }
}
@media (min-width:820px) and (max-width:1180px) { :root { --topbar:166px; } .subnav-empty { min-height:61px; } }
@media (max-width:819px) { .logo-sub, .subnav-empty { display:none; } .topbar .logo-cell { display:contents; } }
@media (min-width:820px) {
  .topbar-main { flex:1; margin-right:32px; }
  .subnav-top { margin-right:0; }
  .subnav-empty { min-height:37.4px; }
}
@media (min-width:820px) and (max-width:1180px) { .subnav-empty { min-height:37.4px; } }
@media (min-width:820px) { .topbar-main { justify-content:flex-start; padding-top:14px; } .subnav-empty { min-height:37.4px !important; } }

/* name + email centred under the logo */
@media (min-width:820px) {
  .topbar .logo-cell { display:flex; flex-direction:column; align-items:center; padding:0 16px; }
  .topbar .logo-cell img { width:190px; }
  .logo-sub { font-size:12px; text-align:center; margin-top:8px; }
  .logo-sub a { color:var(--muted); text-decoration-color:#c9d6e6; }
}
@media (min-width:820px) { .logo-sub.logo-title { margin-top:2px; } }
@media (min-width:820px) { .logo-sub { line-height:1.35; } }
@media (min-width:820px) { .logo-sub { line-height:1.5; margin-top:10px; } .logo-sub.logo-title { margin-top:4px; } }
@media (min-width:820px) { .topbar-main { justify-content:space-evenly; padding-top:0; gap:0; } .subnav-top { padding-top:8px; } }
@media (min-width:820px) { .topbar .course-brand, .topbar .brand-title { line-height:1.2; } .topnav a { padding:0 0 3px; line-height:1.4; } .topnav ul { line-height:1.4; } .subnav-top { padding-top:10px; } .subnav a { line-height:1.4; } .subnav-empty { min-height:31px !important; } }
@media (min-width:1181px) { .subnav-top { height:38px; } .subnav-empty { min-height:38px !important; } }
@media (min-width:820px) and (max-width:1180px) { .subnav-top { height:68px; } .subnav-empty { min-height:68px !important; } }

/* ---- 2026-09-30: smaller Library type; emoji instead of the type word ---- */
.material-list { list-style:none; padding-left:0; }
.content .material-list li { font-size:15px; line-height:1.45; margin:0 0 9px; padding-left:28px; position:relative; }
.material-icon { position:absolute; left:0; top:0; font-size:15px; line-height:1.45; }
.material-source, .material-note { font-size:13px; }
.content .material-list .material-note { font-size:14px; color:var(--body); margin-top:3px; }
.badge-required { font-size:10.5px; padding:2px 5px; margin-right:7px; vertical-align:1px; }
.topic-block h2 { font-size:18px; margin-bottom:8px; }
.topic-block { padding:12px 0 4px; }
.library-group { margin-top:32px; }
.library-group > h2 { font-size:22px; margin:0 0 12px; }
.library-group .topic-block > h3 { font-size:18px; line-height:1.35; margin:0 0 8px; }
.content p.icon-key { margin:0 0 14px auto; margin-right:16px; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-size:12.5px; color:var(--muted); }

/* ---- 2026-09-30: thin grey line icons instead of emoji ---- */
.material-icon svg { width:14px; height:14px; fill:none; stroke:#8a939d; stroke-width:1.2; stroke-linejoin:round; stroke-linecap:round; }
.content .material-list li .material-icon { top:3px; }
.icon-key { display:flex; align-items:center; gap:5px; }
.icon-key .material-icon { position:static; display:inline-flex; margin-left:8px; }
.icon-key .material-icon:first-child { margin-left:0; }
.material-length { color:var(--muted); font-size:13.5px; }
.material-length { white-space:nowrap; }

/* ---- 2026-09-30: title style D (bold serif, dark, faint underline), slightly smaller ---- */
.material-list a { font-weight:600; font-size:14px; color:#1a1a1a; text-decoration:underline; text-decoration-color:#d5dbe2; text-underline-offset:3px; text-decoration-thickness:1px; }
.material-list a:hover { text-decoration-color:var(--accent); }
.content .material-list li { font-size:14px; }
.material-length { font-size:12.5px; }
/* wider column on Library pages so long titles stay on one line */ body.in-library .content { max-width:740px; }

/* ---- 2026-09-30: small week label above Library page titles ---- */
.content p.kicker { font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-size:13px; font-weight:500; color:#2F6FB8; margin:0 0 4px; }
.content p.syllabus-link { font-size:15px; }

/* ---- 2026-09-30: week label sits above each Library menu item (not above the page title) ---- */
.subnav a { display:inline-flex; flex-direction:column; line-height:1.3; }
.subnav-kicker { font-size:10.5px; font-weight:500; color:#8a939d; letter-spacing:.01em; }
.subnav a[aria-current="page"] .subnav-kicker { color:#2F6FB8; }
@media (min-width:820px) {
  :root, body.in-library { --topbar:150px; }
  .subnav-top, .subnav-empty { height:52px !important; min-height:52px !important; }
  .subnav ul { align-items:flex-end; }
}
@media (max-width:819px) { .subnav-inline a { margin-bottom:4px; } }
/* small laptops: keep the Library menu on one row and let it scroll sideways */
@media (min-width:820px) and (max-width:1300px) {
  .subnav-top ul { flex-wrap:nowrap; gap:0 16px; overflow-x:auto; scrollbar-width:none; }
  .subnav-top ul::-webkit-scrollbar { display:none; }
  .subnav-top li { flex-shrink:0; }
  .subnav-top a { font-size:13.5px; }
}
.home-section + .home-section, .lead + .home-section { margin-top:32px; }
.lead + .library-index { margin-top:18px; }

/* Required / Optional badges: same width */
.badge-required { display:inline-block; width:58px; text-align:center; box-sizing:border-box; }
.badge-optional { color:#6b737c; border-color:#d3d8de; background:#f7f8f9; }
.in-library .week-details { margin-top:6px; }

/* Course materials use the existing serif content and sans-serif navigation. */
[hidden] { display:none !important; }
.menu-row { display:flex; align-items:center; justify-content:space-between; gap:18px; min-width:0; }
.menu-row .topnav { margin-left:0; padding-right:0; }
.auth-controls { display:flex; align-items:center; gap:12px; margin-left:auto; flex-shrink:0; font:13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.auth-controls button { background:white; border:0; padding:5px 0; cursor:pointer; color:#2F6FB8; white-space:nowrap; }
.role-badge { color:#555; white-space:nowrap; }
/* Header greeting before the role badge ("Welcome back, Jane!"); hidden below 1180px where the bar is tight. */
.auth-controls .greeting { font:600 13px/1.3 "Helvetica Neue", Helvetica, Arial, sans-serif; color:#1a1a1a; margin-right:4px; white-space:nowrap; }
@media (max-width:1180px) { .auth-controls .greeting { display:none; } }
.materials-button { display:inline-block; background:white; border:1px solid #d8d8d8; border-radius:3px; padding:9px 14px; cursor:pointer; color:#1a1a1a; font:14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.materials-button:hover { background:#fafafa; border-color:#2F6FB8; }
.materials-button.primary { background:#2F6FB8; color:white; border-color:#2F6FB8; }
.materials-button:disabled { opacity:.55; cursor:wait; }
.login-dialog { box-sizing:border-box; width:min(510px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:32px; border:1px solid #ECECEC; background:#fff; color:#1a1a1a; }
.login-dialog::backdrop { background:rgb(0 0 0 / .25); }
.login-dialog h2 { font:600 30px/1.25 "Source Serif 4",Georgia,serif; margin:28px 0 18px; }
.login-dialog p { font-family:"Source Serif 4",Georgia,serif; font-size:16px; line-height:1.55; }
.login-dialog .login-course, .login-dialog .uni-note { font:13px/1.6 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#666; }
.login-dialog .login-course { margin-top:22px; }
.dialog-close { float:right; background:white; border:0; color:#555; padding:0; cursor:pointer; font-size:13px; }
.login-dialog .uni-note { margin:16px 0 0; }
.login-dialog [data-login-message]:not(:empty) { margin-top:20px; padding-top:16px; border-top:1px solid #ECECEC; }
.login-dialog label, .admin-form label { display:block; font:14px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:14px 0 6px; }
.login-dialog input, .login-dialog select, .admin-form input:not([type=checkbox]), .admin-form textarea, .admin-form select { width:100%; max-width:100%; min-width:0; box-sizing:border-box; border:1px solid #d8d8d8; border-radius:2px; padding:9px; font:15px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#222; background:#fff; }
.login-dialog input, .login-dialog select { margin-bottom:12px; }
.admin-form textarea { min-height:100px; resize:vertical; }
.admin-form .check-label { display:flex; align-items:flex-start; gap:8px; }
.admin-form .check-label input { flex-shrink:0; margin-top:4px; }
.admin-form .materials-button { margin:12px 8px 4px 0; }
.admin-form { margin-bottom:24px; }
.admin-section, .assignment-section, .lecture-week { border-top:1px solid #ECECEC; padding:22px 0; }
.assignment-section h2, .lecture-week h2, .admin-section h2 { margin:0 0 14px; }
.assignment-meta, .file-meta, .materials-status, .demo-notice { font:13px/1.6 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#666; }
.content .assignment-meta { margin-bottom:6px; }
.assignment-copy { white-space:pre-wrap; overflow-wrap:anywhere; }
.file-list { list-style:none; padding:0; }
.content .file-list li { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; padding:10px 0; border-bottom:1px solid #ECECEC; margin:0; }
.file-list a { overflow-wrap:anywhere; }
.file-list .file-meta { margin-left:auto; }
.admin-section details { border-bottom:1px solid #ECECEC; padding:12px 0; }
.admin-section summary { cursor:pointer; font-size:17px; }
.roster-preview { max-height:320px; overflow:auto; border:1px solid #ECECEC; padding:0 12px; margin:12px 0; }
.roster-preview table { width:100%; table-layout:fixed; }
.roster-preview td { overflow-wrap:anywhere; }
.demo-controls { margin-top:24px; border:1px solid #ECECEC; padding:16px; }
.demo-controls legend { font:12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#666; }
.demo-notice { padding:10px 0; border-bottom:1px solid #ECECEC; margin-bottom:20px; }
.slides-status { display:block; color:#6b6b6b; font-size:14px; }
.materials-status:not(:empty) { padding:12px 0; }
.materials-error { color:#333; border-bottom:1px solid #ECECEC; }
@media (min-width:820px) { .menu-row { padding-left:28px; } .menu-row .topnav ul { gap:20px; } }
@media (min-width:820px) and (max-width:1050px) { .menu-row .topnav ul { gap:12px; } .menu-row .topnav a { font-size:13px; } .auth-controls { font-size:12px; gap:8px; } .menu-row { gap:12px; } }
@media (max-width:819px) {
  .topbar { height:auto; min-height:84px; flex-wrap:wrap; padding-top:8px; padding-bottom:8px; }
  :root { --topbar:100px; }
  .topbar-main { flex:1; min-width:0; }
  .menu-row { margin:6px 0 0 12px; }
  .auth-controls { margin-left:0; font-size:12px; }
  .auth-controls button { min-height:30px; }
  .menu-row .topnav { padding:6px 16px 8px; }
  .login-dialog { padding:24px; }
  .login-dialog h2 { font-size:27px; }
  .lecture-week h2, .assignment-section h2 { font-size:21px; }
  .file-list .file-meta { width:100%; margin-left:0; }
}
#materials-root { overflow-wrap:anywhere; }
/* Claude review fixes: main menu starts under the course title; hidden sub-menu keeps its row */
@media (min-width:820px) {
  .menu-row { padding-left:0; }
  .subnav-top[hidden] { display:block !important; visibility:hidden; }
}

/* sign-in button and role badge sit right after "Spring 2027" */
.brand-row { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.brand-row .auth-controls { margin-left:4px; }
.auth-controls .auth-login { background:#2F6FB8 !important; color:#fff !important; border-radius:999px; padding:4px 12px !important; font:500 12.5px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.auth-controls .auth-login:hover { background:#24599a !important; }
.auth-controls .role-badge { background:#2F6FB8; color:#fff; border-radius:999px; padding:3px 11px; font:500 12.5px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.auth-controls .auth-signout { font-size:12.5px; color:#6b737c !important; }
@media (max-width:819px) { .brand-row { gap:8px; } .brand-row .auth-controls { margin-left:0; } }
.auth-short { display:none; }
@media (max-width:819px) {
  .topbar { height:auto; min-height:var(--topbar); }
  .brand-row { display:contents; }
  .brand-row .auth-controls { order:2; margin-left:auto; gap:6px; }
  .menu-toggle, .js .menu-toggle { order:3; position:static; margin-left:6px; }
  .auth-long { display:none; }
  .auth-short { display:inline; }
  .auth-controls .auth-login, .auth-controls .role-badge { font-size:11.5px; padding:3px 9px !important; }
  .auth-controls .auth-signout { font-size:11.5px; }
}
@media (max-width:819px) { :root, body.in-library { --topbar:112px; } .topbar { flex-wrap:wrap; } }

/* login-only tab: separator after Staff and a distinct colour */
.topnav li.member-sep { width:1px; height:16px; background:#cfd6de; align-self:center; margin:0 -4px; }
.topnav li.member-only a { color:#2F6FB8; }
.topnav li.member-only a[aria-current="page"] { color:#2F6FB8; border-bottom-color:#2F6FB8; }
@media (max-width:819px) { .topnav li.member-sep { width:100%; height:1px; margin:6px 0; } }
/* Staff */
.staff-card { display:grid; grid-template-columns:160px 1fr; gap:28px; padding:24px 0; border-top:1px solid var(--line); align-items:start; }
.staff-card:first-of-type { border-top:0; padding-top:4px; }
.staff-photo { width:160px; height:160px; border-radius:50%; object-fit:cover; display:block; }
.staff-photo-empty { background:#f2f4f6; }
.staff-card h2 { margin:0 0 4px; font-size:22px; }
.content p.staff-label { font:500 12px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#2F6FB8; margin:0 0 6px; }
.content p.staff-role { font-size:15px; color:var(--muted); margin:0 0 6px; }
.content p.staff-links { font-size:15px; margin:0 0 12px; }
@media (max-width:819px) { .staff-card { grid-template-columns:1fr; gap:14px; } .staff-photo { width:120px; height:120px; } }
.gsi-slot { min-height:44px; margin:4px 0 6px; }
.gsi-fallback { background:none; border:0; padding:4px 0; color:#6b737c; font:12px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; text-decoration:underline; text-decoration-color:#cfd6de; cursor:pointer; }

/* cross-link between a week's Syllabus and Library pages */
.h1-row { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.h1-row h1 { margin:0; }
.xlink { font:500 13px/1 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#2F6FB8; text-decoration:none; border:1px solid #9dbfe6; background:#f3f8fd; border-radius:999px; padding:7px 12px; white-space:nowrap; }
.xlink:hover { background:#e6f0fa; }
.page-heading .h1-row + * { margin-top:14px; }
/* cross-link: plain text, not a pill */
.xlink { border:0 !important; background:none !important; padding:0 !important; border-radius:0; font:400 14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; color:var(--muted); text-decoration:underline; text-decoration-color:#d5dbe2; text-underline-offset:3px; align-self:flex-end; margin-bottom:6px; }
.xlink:hover { color:#2F6FB8; text-decoration-color:#2F6FB8; }
.kicker-sep { color:#c5ccd4; margin:0 8px; }
.kicker .xlink { font:400 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0; align-self:auto; }

/* Compact class tools. The public reading pages retain their existing typography. */
.topnav li.instructor-only a { color:#34536e; font-weight:400; }
.topnav li.instructor-only a[aria-current="page"] { font-weight:600; border-bottom-color:#34536e; }
.brand-heading { min-width:0; }
.brand-row .auth-controls { margin-left:auto; gap:8px; min-width:0; }
.demo-tag { display:block; color:#777; font:10px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; margin-top:3px; }
.view-picker select { font:12px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; max-width:180px; border:1px solid #ECECEC; background:white; color:#555; padding:4px; }
.preview-banner { display:flex; align-items:center; gap:6px; min-width:0; font:11.5px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.preview-pill { display:flex; align-items:center; min-width:0; padding:4px 8px; border:1px solid #9dbfe6; border-radius:999px; color:#34536e; }
[data-preview-name] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:220px; }
.preview-readonly { white-space:pre; flex-shrink:0; }
.auth-controls [data-preview-exit] { font-size:12px; text-decoration:underline; text-underline-offset:3px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.class-tools main { padding:calc(var(--topbar) + 24px) 28px 0; }
body.class-tools .content { max-width:1180px; }
.class-tools .outline-title { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools .page-heading { margin-bottom:8px; }
.class-tools .page-title-row { margin:0; }
.class-tools .page-title-row h1 { font-size:32px; }
.class-tools #materials-root { font:13px/1.45 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools #materials-root p, .class-tools #materials-root li { font:inherit; margin:6px 0; }
.class-tools #materials-root h2, .class-tools #materials-root h3 { font:500 15px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0 0 6px; }
.class-tools #materials-root .tool-help { color:#6b6b6b; font-size:12px; margin:0 0 12px; }
.class-tools .materials-button { padding:5px 9px; font-size:12px; min-height:28px; border-radius:2px; }
.class-tools .materials-status:empty { display:none; }
.class-tools .materials-status:not(:empty) { padding:4px 0; color:#34536e; }
.class-grid-wrap { overflow:auto; max-width:100%; max-height:65vh; margin:8px 0 14px; border:1px solid #ECECEC; scrollbar-gutter:stable; }
.class-grid { table-layout:auto; width:max-content; border-collapse:separate; border-spacing:0; margin:0; min-width:100%; font:13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-grid th,.class-grid td { height:34px; padding:3px 8px; border-bottom:1px solid #ECECEC; vertical-align:middle; min-width:88px; }
.class-tools .class-grid td { font:inherit; }
.class-grid th[scope="row"] { width:210px; min-width:210px; max-width:210px; font-weight:400; position:sticky; left:0; background:#fff; z-index:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.class-grid thead th { background:#FAFAFA; font-weight:500; text-transform:none; position:sticky; top:0; z-index:2; vertical-align:top; padding:7px 8px; }
.class-grid thead th:first-child { left:0; z-index:3; }
.class-grid tbody tr:hover > * { background:#FAFAFA; }
.student-uni { color:#777; font:11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace; }
.student-identity { display:flex; align-items:baseline; gap:6px; }
.student-name { overflow:hidden; text-overflow:ellipsis; }
.student-uni { flex-shrink:0; }
.class-grid input[type="number"] { width:64px; height:26px; padding:3px 5px; font:13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; border:1px solid #d8d8d8; border-radius:2px; }
.class-grid select { width:101px; height:26px; padding:2px; border:1px solid #d8d8d8; background:white; color:#444; border-radius:2px; font:12px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.attendance-grid td { white-space:nowrap; }
.quiz-marker { display:inline-block; margin-left:4px; color:#34536e; font-size:10px; }
.class-grid .materials-button { font-size:11px; padding:3px 0; min-height:24px; margin:0; border:0; color:#2F6FB8; background:none; white-space:nowrap; }
.class-grid td .materials-button + .materials-button { margin-left:12px; }
.class-grid input[type="date"], .session-date { display:block; width:122px; padding:0; margin:3px 0; color:#666; font:11px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; border:0; background:transparent; }
.class-grid .attendance-totals > * { height:30px; background:#FAFAFA; font-size:11px; }
.attendance-totals span + span { margin-left:8px; }
.total-present { color:#26704f; } .total-absent { color:#a13f37; } .total-excused { color:#666; }
.gradebook-grid thead th:not(:first-child) { min-width:88px; max-width:116px; }
.table-tools { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:10px 0 0; }
.table-tools input, .table-tools select { max-width:100%; height:30px; min-width:0; padding:4px 7px; border:1px solid #d8d8d8; border-radius:2px; background:white; font:12px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.table-tools input { width:210px; }
.table-tools select { width:180px; }
.student-count { color:#777; font-size:11px; margin-right:auto; white-space:nowrap; }
.class-tools .admin-section { padding:12px 0; }
.class-tools .admin-section > summary, .tool-disclosure > summary { cursor:pointer; padding:8px 0; font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools details.admin-section { padding:0; }
.class-tools details.admin-section[open] { padding-bottom:10px; }
.class-tools .admin-section details { padding:6px 0; }
.class-tools .admin-section details > summary { font:13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.tool-disclosure { border-top:1px solid #ECECEC; margin-top:12px; }
.class-tools .admin-form { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px 12px; margin:8px 0 12px; }
.class-tools .admin-form label, .tool-label { font:12px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0; min-width:0; }
.class-tools .admin-form .tool-label { flex:1 1 180px; }
.class-tools .admin-form input:not([type=checkbox]), .class-tools .admin-form textarea, .class-tools .admin-form select, .tool-label > input, .tool-label > select { display:block; width:100%; min-width:0; max-width:100%; padding:5px 7px; margin:4px 0 0; border:1px solid #d8d8d8; border-radius:2px; background:white; font:13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools .admin-form .materials-button { margin:0; }
.class-tools .admin-form > p, .class-tools .admin-form > div { flex-basis:100%; }
.class-tools .admin-form .check-label { align-self:center; }
.class-tools .admin-form label:has(textarea) { flex-basis:100%; }
.class-tools .admin-form textarea { min-height:70px; }
.class-tools .file-list { margin:8px 0 0; }
.class-tools .file-list li { padding:5px 0; gap:6px 12px; }
.class-tools .group-grid ul { margin:0; padding:0; list-style:none; }
.class-tools .group-grid td { max-width:280px; }
.group-grid, .student-attendance-grid { width:100%; table-layout:fixed; }
.group-grid th, .group-grid td, .student-attendance-grid th, .student-attendance-grid td { min-width:0; }
.class-tools .group-grid th[scope="row"], .group-grid thead th:first-child { width:100px; min-width:100px; max-width:100px; }
.group-grid thead th:nth-child(2) { width:70px; }
.group-grid thead th:nth-child(4) { width:64px; }
.class-tools .student-attendance-grid th[scope="row"], .student-attendance-grid thead th:first-child { width:76px; min-width:76px; max-width:76px; }
.class-tools .page-footer { margin-top:28px; }
@media (min-width:820px) {
  /* Reserve all three rows, even when a role has fewer links or no submenu. */
  .topbar-main { display:grid; grid-template-rows:54px 37px 57px; align-content:start; justify-content:normal; gap:0; padding-top:0; min-width:0; }
  .brand-row { flex-wrap:nowrap; gap:12px; min-width:0; padding-top:15px; align-items:flex-start; }
  .brand-heading { flex:1; height:36px; }
  .brand-heading .demo-tag { font-size:9px; line-height:11px; margin-top:1px; }
  .brand-row .course-brand { height:24px; flex-wrap:nowrap; gap:8px; }
  .topbar .brand-title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .brand-term { flex-shrink:0; }
  .brand-row .auth-controls { flex-shrink:0; height:30px; }
  .menu-row { align-items:flex-start; margin:0; padding:0; }
  .menu-row .topnav { min-width:0; overflow-x:auto; scrollbar-width:none; }
  .menu-row .topnav ul { flex-wrap:nowrap; gap:0 14px; }
  .menu-row .topnav li { flex-shrink:0; }
  .menu-row .topnav a { display:block; font-size:13px; line-height:18px; padding:0 0 2px; }
  :root, body.in-library { --topbar:148px; }
  .topbar-main > .subnav-top { display:block; align-self:start; margin:0; padding-top:5px; height:57px !important; min-height:57px !important; }
  .topbar-main > .subnav-top ul { height:38px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .topbar-main > .subnav-top li { flex-shrink:0; }
  .topbar-main > .subnav-top a { display:flex; }
}
@media (min-width:820px) and (max-width:1180px) {
  .topbar .brand-title { font-size:18px; }
  .topbar .brand-term { font-size:12px; }
  .view-picker select { max-width:136px; }
  [data-preview-name] { max-width:100px; }
}
@media (max-width:819px) {
  :root, body.in-library { --topbar:136px; }
  .topbar { display:grid; grid-template-columns:28px minmax(0,1fr) auto; grid-template-rows:minmax(0,1fr) 30px; gap:6px 10px; height:var(--topbar); padding:8px 16px; }
  .topbar .cbs-logo { grid-column:1; grid-row:1; width:28px; margin:0; }
  .brand-heading { grid-column:2; grid-row:1; align-self:start; padding-top:8px; }
  .topbar .course-brand { padding:0; border:0; }
  .topbar .brand-title { white-space:normal; font-size:16px; }
  .demo-tag { font-size:9px; }
  .brand-row .auth-controls { grid-column:1 / -1; grid-row:2; width:100%; height:30px; margin:0; justify-content:flex-end; gap:6px; }
  .auth-controls .role-badge { flex-shrink:0; }
  .preview-banner { flex:1; justify-content:flex-end; }
  .preview-pill { min-width:0; font-size:10px; padding:4px 6px; }
  [data-preview-name] { max-width:none; }
  .view-picker select { max-width:150px; }
  .menu-toggle, .js .menu-toggle { grid-column:3; grid-row:1; margin:0; }
  .menu-row { display:contents; }
  .topnav { max-height:calc(100dvh - var(--topbar)); overflow-y:auto; }
  .class-tools main { padding:calc(var(--topbar) + 20px) 16px 0; }
  .class-grid th[scope="row"] { min-width:142px; max-width:142px; width:142px; }
  .class-grid .student-uni { font-size:10px; }
  .table-tools input { flex:1; }
  .table-tools select { width:100%; }
}

/* Upcoming uses the same quiet, compact course-tool surface. */
.class-tools #materials-root .next-class { font-size:17px; font-weight:500; margin:0 0 5px; }
.upcoming-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:22px; }
.upcoming-columns:has(> :nth-child(2):last-child) { grid-template-columns:repeat(2,minmax(0,1fr)); }
.upcoming-block { min-width:0; border-top:1px solid #ECECEC; padding-top:12px; }
.class-tools #materials-root .upcoming-block h2 { font:500 11px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; margin:0 0 12px; }
.class-tools #materials-root .upcoming-block h3 { font:500 14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0 0 5px; }
.upcoming-block p { margin:6px 0 10px; }
.upcoming-block a, .upcoming-block p, .upcoming-block li { overflow-wrap:anywhere; }
.upcoming-meta { color:#737373; font-size:12px; }
.upcoming-readings, .upcoming-files { list-style:none; margin:0; padding:0; }
.upcoming-readings li, .upcoming-files li { margin:0 0 12px; }
.upcoming-readings .upcoming-meta { display:block; margin-top:3px; }
.upcoming-excerpt { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
#upcoming-announcements, #upcoming-groups { margin-top:24px; }
.announcement + .announcement { border-top:1px solid #ECECEC; margin-top:12px; padding-top:12px; }
.announcement-body { white-space:pre-wrap; }
.announcement-editor { border-top:1px solid #ECECEC; padding:12px 0; }
.announcement-editor summary { cursor:pointer; overflow-wrap:anywhere; }
.grade-max { display:block; font-size:11px; font-weight:400; color:#737373; }
#grade-legend { margin:6px 0 12px; }
#grade-legend ul { list-style:none; padding:0; font-size:12px; }
@media (max-width:819px) {
  .upcoming-columns, .upcoming-columns:has(> :nth-child(2):last-child) { grid-template-columns:minmax(0,1fr); gap:22px; }
}

/* Week pages use the existing course type and spacing, with one vertical reading order. */
.class-tools .week-block { display:block; border-top:1px solid #ececec; padding:20px 0; }
.class-tools .week-block:first-child { border-top:0; padding-top:0; }
.class-tools #materials-root .week-block h2 { font:500 11px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#737373; margin:0 0 12px; }
.class-tools #materials-root .week-block h3 { font-size:15px; font-weight:500; margin:0 0 6px; }
.week-block p { margin:8px 0; }
.earlier-notices { margin-top:12px; }
.earlier-notices summary { cursor:pointer; color:#737373; }
.earlier-notices .announcement { margin-top:12px; }
.class-tools #materials-root .week-block .upcoming-readings li { font-size:15px; }
.week-files { list-style:none; padding:0; margin:0; }
.class-tools #materials-root .week-files li { font-size:15px; margin:8px 0; overflow-wrap:anywhere; }
.assignment-copy, .grade-comment { overflow-wrap:anywhere; white-space:pre-wrap; }
.text-action { margin-left:8px; }
.submission-delete .inline-confirm { display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px; margin-left:8px; }
.submission-row input[type=url] { flex:1; width:0; min-width:0; padding:5px 8px; font:inherit; border:1px solid #d8d8d8; }
.class-tools #materials-root .submission-hint { color:#737373; font-size:12px; margin:4px 0 0; }
.submission-status, .assignment-copy, .grade-comment { overflow-wrap:anywhere; white-space:pre-wrap; }
.submission-mode { font-weight:600; }
.text-action { background:none; border:0; padding:0; margin-left:16px; font:inherit; text-decoration:underline; color:var(--link, #1a1a1a); cursor:pointer; }
/* A grade is one compact row; comments take the full line below it. */
.student-grade { border-top:1px solid #ececec; padding:12px 0; display:grid; grid-template-columns:minmax(0,1fr) 120px 64px; gap:4px 18px; }
.class-tools #materials-root .student-grade h2, .class-tools #materials-root .student-grade p { margin:0; font-size:13px; }
.student-grade .grade-status { grid-column:2; grid-row:1; }
.student-grade .grade-score { grid-column:3; grid-row:1; text-align:right; }
.student-grade .grade-comment { grid-column:1 / -1; }
@media(max-width:819px) {
  .student-grade { grid-template-columns:minmax(0,1fr) auto; }
  .student-grade .grade-status { grid-column:1; grid-row:2; }
  .student-grade .grade-score { grid-column:2; }
}

/* ---- 2026-10-01: each signed-in menu group has its own colour ---- */
/* class area (Course Materials, Attendance, Grades, Groups) = Columbia Blue; staff tools = burgundy */
.topnav li[data-zone="class"] a { color:#2F6FB8; }
.topnav li[data-zone="class"] a[aria-current="page"] { color:#2F6FB8; border-bottom-color:#2F6FB8; }
.topnav li[data-zone="staff"] a { color:#8C2F39; }
.topnav li[data-zone="staff"] a[aria-current="page"] { color:#8C2F39; border-bottom-color:#8C2F39; }
.topnav li[data-zone] a:hover { border-bottom-color:currentColor; }

/* Class tools use the whole wall; the fixed course header stays identical. */
body.full-tools .site-sidebar { display:none !important; }
body.full-tools main { margin-left:0; }
body.full-tools .content { max-width:none; }
.full-tools .class-grid-wrap { border:0; border-top:1px solid #ececec; border-bottom:1px solid #ececec; scrollbar-gutter:auto; }
.gradebook-workspace { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
.gradebook-workspace.panel-open { grid-template-columns:minmax(0,1fr) 300px; }
.gradebook-content { min-width:0; }
.grade-panel { border-left:1px solid #ececec; padding:12px 0 12px 20px; overflow-wrap:anywhere; }
.grade-panel > button:first-child { float:right; margin-bottom:12px; }
.grade-panel h2 { clear:both; }
.class-tools .gradebook-grid { table-layout:fixed; width:100%; min-width:1100px; }
.class-tools .gradebook-grid th, .class-tools .gradebook-grid td { min-width:0; max-width:none; padding:3px 3px; position:relative; text-align:center; }
.class-tools .gradebook-grid th:first-child { min-width:180px; width:180px; max-width:180px; text-align:left; position:sticky; left:0; }
.class-tools .gradebook-grid th:last-child { width:88px; }
.class-tools .gradebook-grid thead th { position:sticky; top:0; }
.grade-visibility { display:block; width:max-content; margin:4px auto 1px; padding:2px 3px; border:1px solid #d8d8d8; border-radius:3px; background:#f4f4f4; color:#737373; font:400 10px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.grade-visibility[data-release-state=visible] { background:#8C2F39; border-color:#8C2F39; color:#fff; }
.gradebook-grid td[data-release-state=hidden] { background:#f7f7f7; color:#777; font-weight:400; font-style:normal; }
.grade-total-hidden { display:block; color:#777; font-size:10px; font-weight:400; }
.gradebook-total > span { display:block; line-height:13px; }
.class-tools #materials-root .grade-visibility-note { font-size:12px; color:#666; margin:12px 0; }
.submission-mark, .override-mark { position:absolute; top:0; left:4px; font-size:9px; z-index:1; color:#737373; pointer-events:none; }
.override-mark { left:auto; right:3px; }
.grade-panel .materials-button { margin-right:8px; }
.class-tools #materials-root .grade-total { font-weight:600; }
@media (min-width:1280px) { .class-tools .gradebook-grid { min-width:0; } .panel-open .gradebook-grid th:first-child { width:140px; min-width:140px; max-width:140px; } }
@media (max-width:819px) { .gradebook-workspace.panel-open { grid-template-columns:minmax(0,1fr); } .grade-panel { border-left:0; border-top:1px solid #ececec; padding:16px 0; } }
.term-filter { display:flex; align-items:center; gap:8px; margin:12px 0; font-size:12px; }
.term-filter select { padding:4px; border:1px solid #d8d8d8; background:#fff; font:inherit; }
#session-times .admin-form h3 { flex:0 0 70px; align-self:center; }
#lecture-pdfs input[type=datetime-local] { max-width:185px; width:100%; font:inherit; }
.term-actions { border-top:1px solid #ececec; margin-top:14px; padding-top:12px; }
.term-actions label { display:block; margin:10px 0; }
/* ---- 2026-10-01: three reading levels (Required later, Recommended now, Optional); equal-width badges ---- */
.badge-required { width:86px; }
.badge-recommended { color:#2F6FB8; border-color:#c6dbf2; background:#f7fafe; }

/* The instructor workspace uses the same full-width, quiet staff layout. */
.preparation-nav a { color:#8C2F39; }
.preparation-nav a[aria-current="page"] .subnav-kicker { color:#8C2F39; }
.preparation-nav a[aria-current="page"] { border-color:currentColor; }
.preparation-editor { border-top:1px solid #ececec; padding-top:16px; }
.class-tools .prep-form { display:block; }
.class-tools .prep-form textarea { min-height:360px; width:100%; }
.prep-controls { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:12px 0; }
.prep-controls [role="status"] { color:#666; font-size:12px; }
.prep-warning { border-bottom:1px solid #ececec; padding:12px 0; margin-bottom:12px; }
.prep-warning button { margin-left:12px; }
.prep-markdown { max-width:900px; overflow-wrap:anywhere; white-space:normal; }
.prep-markdown p { white-space:pre-line; }
.prep-markdown em { font-style:italic; }
.class-tools #materials-root .prep-markdown :is(h1,h2,h3,h4,h5,h6) { font-family:inherit; font-weight:600; text-transform:none; letter-spacing:normal; margin:20px 0 10px; }
.class-tools #materials-root .prep-markdown h1 { font-size:24px; }
.class-tools #materials-root .prep-markdown h2 { font-size:20px; }
.class-tools #materials-root .prep-markdown :is(h3,h4,h5,h6) { font-size:16px; }
.speakers-toolbar { display:flex; align-items:flex-end; gap:16px; flex-wrap:wrap; }
.speakers-toolbar label { flex:1; max-width:340px; }
#materials-root[data-page="speakers"] { max-width:900px; }
.speaker-week { border-top:1px solid #ececec; padding:22px 0; }
.class-tools #materials-root .speaker-week > h2 { font:600 23px/1.35 "Source Serif 4",Georgia,serif; margin:0 0 14px; }
.speaker-week-list { list-style:none; padding:0; margin:0; }
.class-tools #materials-root .speaker-row { padding:5px 0; margin:0 0 12px; overflow-wrap:anywhere; }
.speaker-heading { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; }
.speaker-heading > * { min-width:0; }
.class-tools #materials-root .speaker-heading h3 { font-size:14px; font-weight:600; margin:0; text-transform:none; letter-spacing:normal; }
.speaker-heading > span { color:#666; font-size:12px; }
.speaker-heading .speaker-status { color:#777; font-size:11px; }
.class-tools #materials-root .speaker-row :is(.speaker-topic,.speaker-notes) { margin:5px 0 0; font-size:12px; line-height:1.5; color:#737373; white-space:pre-wrap; }
.speaker-actions { display:flex; align-items:baseline; gap:8px; margin:0; }
.speaker-actions .materials-button, .speakers-toolbar > .materials-button, .speaker-form .materials-button { padding:0; min-height:0; border:0; background:none; font-size:12px; text-decoration:underline; text-underline-offset:3px; }
.speaker-form { padding:12px 0; }
.class-tools #materials-root[data-page="speakers"] :is(input,select,textarea) { border:0; border-bottom:1px solid #ddd; border-radius:0; box-shadow:none; padding:5px 0; }

.week-material-list { margin-top:10px; }

.badge-required { white-space:nowrap; width:92px; }
.class-tools #materials-root h3.week-reading-topic, h3.week-reading-topic { font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#4b5560; margin:16px 0 6px; }
.week-material-list { margin-top:0; }

/* ---- 2026-10-01: week pages: each section sits in its own shaded box so sections read as separate ---- */
body.week-page #materials-root > .week-block { background:#FAFAFA; border:1px solid #ECECEC; border-radius:8px; padding:18px 22px 20px; margin:0 0 16px; }
body.week-page #materials-root > .week-block > h2 { color:#4b5560; margin:0 0 12px; }
body.week-page #materials-root > .next-class { background:#fff; border:1px solid #ECECEC; border-radius:8px; padding:14px 22px; margin:6px 0 16px; }
body.week-page #materials-root > .week-block .week-reading-topic:first-of-type { margin-top:8px; }

/* Calendar links and staff student cards use the existing course and panel styles. */
.content .calendar-links { font-size:12px; margin:0 0 18px; color:var(--muted); }
.week-title { display:flex; flex-wrap:wrap; align-items:flex-start; gap:6px 14px; }
.page-title-row .week-title h1 { flex:0 1 auto; }
.week-date { padding-top:4px; max-width:100%; }
.week-date .date-pill { margin-left:0; top:0; }
.week-date .calendar-links { margin:4px 0 0; font:12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.student-profile-link { border:0; padding:0; background:none; font:inherit; text-align:left; color:inherit; cursor:pointer; }
.student-profile-link:hover, .student-profile-link:focus-visible { text-decoration:underline; }
.profile-attendance { padding-left:16px; font-size:12px; }
.profile-item { border-top:1px solid #ececec; padding:8px 0; }
.profile-item h4, .profile-item p { margin:4px 0; font-size:12px; }
.profile-note textarea { display:block; width:100%; margin:8px 0; }
.group-note { font-size:13px; }
.grade-panel[data-profile-uni] { max-height:calc(100vh - 200px); overflow-y:auto; position:sticky; top:12px; }
@media (max-width:819px) { .grade-panel[data-profile-uni] { position:static; max-height:70vh; } }

/* Student ID card, design B. All mockup styles stay inside this panel. */
.grade-panel .student-card { clear:both; border-radius:14px; border:1px solid #d9e3ef; overflow:hidden; background:#fbfdff; }
.student-card .band { background:#2F6FB8; color:#fff; padding:9px 16px; font:500 11px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:.16em; text-transform:uppercase; display:flex; justify-content:space-between; gap:10px; }
.student-card .main { display:grid; grid-template-columns:86px minmax(0,1fr); gap:14px; padding:16px; }
.student-card .photo { width:86px; height:104px; border-radius:10px; background:#e9f0f9; display:grid; place-items:center; font:600 30px "Source Serif 4",Georgia,serif; color:#2F6FB8; }
#materials-root .student-card .name { font:600 18px/1.2 "Source Serif 4",Georgia,serif; margin:0 0 2px; letter-spacing:0; }
.student-card .meta { font-size:12.5px; line-height:1.45; color:#5b6470; overflow-wrap:anywhere; }
.student-card .meta a { color:inherit; }
.student-card .totals { margin-top:8px; }
.student-card .totals strong { color:#1a1a1a; }
.student-card .stamps { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:7px; list-style:none; margin:0; padding:0 16px 12px; }
.student-card .stamp { width:100%; max-width:38px; aspect-ratio:1; border-radius:50%; border:2px dashed #b9cbe2; display:grid; place-items:center; font-size:10.5px; line-height:1; color:#7d93b0; }
.student-card .stamp.present { border:2px solid #2F6FB8; color:#fff; background:#2F6FB8; font-weight:600; }
.student-card .stamp.excused { border:2px solid #e3b04b; color:#9a6200; background:#fff7e6; }
.student-card .stamp.absent { border:2px solid #dfa9b3; color:#8C2F39; background:#f3d3d7; }
.student-card .barcode { margin:4px 16px 14px; height:22px; background:repeating-linear-gradient(90deg,#1a1a1a 0 2px,transparent 2px 4px,#1a1a1a 4px 5px,transparent 5px 8px); opacity:.75; border-radius:2px; }
.student-card .foot { border-top:1px dashed #d9e3ef; padding:12px 16px 14px; }
.student-card .chip { display:inline-block; font:400 11.5px/1.45 "Helvetica Neue",Helvetica,Arial,sans-serif; border:0; border-radius:999px; padding:3px 9px; margin:0 6px 6px 0; cursor:pointer; }
.student-card .chip.ok { background:#e8f1fb; color:#2F6FB8; }
.student-card .chip.late { background:#fff1d6; color:#9a6200; }
.student-card .chip.miss, .student-card .chip.hid { background:#f6f6f6; color:#8a8a8a; }
.student-card .note { margin:10px 0 0; border:1px solid #ECECEC; border-radius:10px; padding:8px 10px; font-size:12.5px; color:#555; background:#fff; }
.student-card .note .materials-button { margin:4px 0; }
#materials-root .student-card .note [role=status] { margin:4px 0 0; font-size:11px; }
.student-card .profile-record { margin-top:12px; font-size:12px; }
.student-card .profile-record summary { cursor:pointer; }
.student-card .profile-record h3 { margin-top:14px; }
@media (max-width:480px) { .student-card .main { grid-template-columns:minmax(0,1fr); } }

/* ---- 2026-10-02: week page cards: date pill, Due before class, Lecture notes & materials, Reading list ---- */
.date-pill { display:inline-block; vertical-align:middle; margin-left:14px; padding:4px 12px; border-radius:999px; background:#FFF1E2; border:1px solid #F3C38E; color:#A85A10; font:500 13px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:0; position:relative; top:-3px; }
body.week-page #materials-root .due-note { margin:0 0 14px; padding:8px 12px; background:#fff; border:1px solid #ECECEC; border-radius:6px; font-size:13px; color:#4b5560; }
body.week-page #materials-root > .week-block .week-block { background:none; border:0; border-top:1px solid #ECECEC; border-radius:0; padding:14px 0 0; margin:16px 0 0; }
body.week-page #materials-root > .week-block .week-block > h2, .week-file-label { font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:0; text-transform:none; color:#1a1a1a; margin:0 0 8px; }
.due-reading-list, .week-files { list-style:none; margin:0; padding:0; }
.due-reading-list li { margin:0 0 7px; } .due-reading-list a { font-weight:600; }
.week-file-group + .week-file-group h3 { margin-top:12px; }
body.week-page #materials-root h3.week-file-label { font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0 0 8px; color:#1a1a1a; }

/* ---- 2026-10-02: week page design B: tinted cards with a coloured title chip ---- */
body.week-page #materials-root > .week-block { border-radius:12px; padding:16px 18px 18px; }
body.week-page #materials-root > #due-before-class { background:#FFF7EE; border-color:#F6DDBF; }
body.week-page #materials-root > #lecture-notes { background:#F2F7FC; border-color:#D7E5F5; }
body.week-page #materials-root > #required-readings { background:#F6F7F9; border-color:#E5E8EC; }
body.week-page #materials-root > .week-block > h2 { display:inline-block; margin:0 10px 12px 0; padding:6px 11px; border-radius:999px; color:#fff; font:600 12px/1 "Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:.04em; text-transform:uppercase; background:#5B6B7B; }
body.week-page #materials-root > #due-before-class > h2 { background:#D9822B; }
body.week-page #materials-root > #lecture-notes > h2 { background:#2F6FB8; }
body.week-page #materials-root > #week-announcements > h2 { background:#4b5560; }
body.week-page .card-summary { font-size:12.5px; color:#737373; }
body.week-page #materials-root .due-note { background:none; border:0; padding:0; margin:0 0 4px; color:#8a4d0f; font-size:13px; }
body.week-page #materials-root h3.card-sub { font:600 12.5px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#5b4630; margin:14px 0 7px; text-transform:none; letter-spacing:0; }
body.week-page .due-reading-list li { display:grid; grid-template-columns:1fr auto; column-gap:12px; background:#fff; border:1px solid rgba(0,0,0,.05); border-radius:8px; padding:8px 12px; margin:0 0 6px; }
body.week-page .due-reading-list li a { font-weight:600; text-decoration:none; }
body.week-page .due-reading-list .due-author { grid-column:1; grid-row:2; font-size:12px; color:#737373; }
body.week-page .due-reading-list .due-length { grid-column:2; grid-row:1; font-size:12.5px; color:#737373; white-space:nowrap; }
/* the milestone sits in one white box inside the orange card */
body.week-page #materials-root #due-before-class .assignment-section { background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:8px; padding:12px 14px; margin:0; }
body.week-page #materials-root #due-before-class .assignment-section > h2 { display:none; }
body.week-page #materials-root #due-before-class .assignment-section > h3 { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 4px; }
.ms-chip { font:600 11px/1 "Helvetica Neue",Helvetica,Arial,sans-serif; padding:4px 9px; border-radius:999px; letter-spacing:.02em; }
.ms-todo { background:#FFF1E2; color:#A85A10; border:1px solid #F3C38E; }
.ms-done { background:#E8F1FB; color:#2F6FB8; border:1px solid #BFD6F0; }
.ms-late { background:#FFF6D6; color:#8a6200; border:1px solid #EBD38A; }
.ms-graded { background:#F1F2F4; color:#5b6470; border:1px solid #DDE0E4; }
/* full reading list rows */
body.week-page #required-readings .material-list li { background:#fff; border:1px solid rgba(0,0,0,.05); border-radius:8px; padding:8px 12px 8px 36px; margin:0 0 6px; }
body.week-page #required-readings .material-list li .material-icon { left:12px; top:11px; }
body.week-page #required-readings .material-list a { text-decoration:none; }
body.week-page #lecture-notes .week-files li { background:#fff; border:1px solid rgba(0,0,0,.05); border-radius:8px; padding:8px 12px; margin:0 0 6px; }

/* ---- 2026-10-02: Required readings get a red-orange tag (Recommended stays blue, Optional grey) ---- */
.badge-required:not(.badge-recommended):not(.badge-optional) { color:#fff; background:#D4561E; border-color:#D4561E; }

/* ---- 2026-10-02: consistent level tags: same outline shape, colour by level ---- */
.badge-required:not(.badge-recommended):not(.badge-optional) { color:#B8501A; background:#FFF4EC; border-color:#F2C2A2; }

/* Student assignment names and deadlines share the live week-page palette. */
.class-tools #materials-root .due-line { font:600 13px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#A85A10; }
.class-tools #materials-root .due-line.past-due { color:#99535c; }
.class-tools #materials-root .milestone-title { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
.milestone-title .due-line { border-left:1px solid #e7d3ba; padding-left:12px; }
.assignment-instructions-link { display:inline-block; font-size:12px; margin:2px 0 6px; }
.optional-tabs { display:flex; flex-wrap:wrap; gap:4px 24px; margin:4px 0 22px; border-bottom:1px solid #ECECEC; }
.optional-tab { appearance:none; background:none; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; padding:8px 0 9px; font:500 15px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#737373; cursor:pointer; }
.optional-tab:hover { color:#1A1A1A; }
.optional-tab[aria-selected="true"] { color:#1A1A1A; border-bottom-color:#2F6FB8; font-weight:600; }
.optional-tab:focus-visible { outline:2px solid #2F6FB8; outline-offset:2px; }
#materials-root[data-page="assignments"] { max-width:740px; } /* same reading column as Syllabus and Library */
.assignment-page + .assignment-page { border-top:1px solid #ECECEC; padding-top:22px; margin-top:24px; }
.assignment-summary { border-top:1px solid #ECECEC; border-bottom:1px solid #ECECEC; padding:10px 0; margin:20px 0; color:#595959; }
.class-tools #materials-root .assignment-page .assignment-section { padding:14px 0; }
.class-tools #materials-root .assignment-mode { color:#595959; }
.assignment-nav a { white-space:nowrap; }

/* Preparation follows the public course outline; notes sit directly on the page. */
#materials-root[data-page="preparation"] { max-width:900px; }
.class-tools #materials-root .preparation-goal { color:#6b6b6b; margin:6px 0 26px; font-size:14px; }
.preparation-section, .preparation-exercises { border-top:1px solid #ececec; padding:22px 0; }
.preparation-exercises .preparation-section { border:0; padding:14px 0 4px; }
.prep-section-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 16px; margin-bottom:10px; }
.class-tools #materials-root :is(.prep-section-heading,.preparation-exercises) > h2 { font:600 23px/1.35 "Source Serif 4",Georgia,serif; margin:0; }
.class-tools #materials-root .prep-section-heading > h3 { font:600 19px/1.4 "Source Serif 4",Georgia,serif; margin:0; }
.prep-text-action { border:0; background:none; border-radius:0; padding:2px 0; color:#34536e; font:400 12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.prep-text-action.empty { color:#777; }
.prep-text-action:disabled { opacity:.5; cursor:default; }
.class-tools #materials-root .prep-reading-level { color:#777; font-size:10px; text-transform:uppercase; letter-spacing:.1em; margin:12px 0 4px; }
.prep-reading-list { list-style:none; padding:0; margin:0 0 12px; }
.class-tools #materials-root .prep-reading-list li { margin:3px 0; font-size:12px; overflow-wrap:anywhere; }
.prep-reading-author { color:#777; }
.prep-section-form textarea { display:block; width:100%; min-height:60px; max-height:none; padding:8px 0; border:0; border-bottom:1px solid #ddd; border-radius:0; box-shadow:none; background:transparent; color:#444; font:14px/1.6 "Helvetica Neue",Helvetica,Arial,sans-serif; resize:none; overflow:hidden; }
.prep-section-form textarea:focus { outline:none; border-bottom-color:#34536e; }
.prep-section-form .prep-controls { margin:8px 0; }
.preparation-section > [role="status"] { color:#777; font-size:11px; }

/* ---- 2026-10-04: larger, easier sub-headings inside week cards ---- */
body.week-page #materials-root h3.card-sub { font:600 15px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#1a1a1a; margin:16px 0 6px; }
body.week-page #materials-root .due-readings .due-note { margin:0 0 10px; }

/* ---- 2026-10-04: navy replaces orange (Simon chose palette A) ---- */
.date-pill { background:#EEF2FA; border-color:#C4D0E6; color:#1F3A6B; }
body.week-page #materials-root > #due-before-class { background:#F3F6FB; border-color:#D5DEEC; }
body.week-page #materials-root > #due-before-class > h2 { background:#1F3A6B; }
body.week-page #materials-root .due-note, body.week-page #materials-root .due-readings .due-note { color:#1F3A6B; }
.ms-todo { background:#EEF2FA; color:#1F3A6B; border-color:#C4D0E6; }
.badge-required:not(.badge-recommended):not(.badge-optional) { color:#1F3A6B; background:#EEF2FA; border-color:#C4D0E6; }
.class-tools #materials-root .due-line { color:#1F3A6B; }
/* "Required readings" and "Milestone": larger and bolder */
body.week-page #materials-root h3.card-sub { font:700 18px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#1F3A6B; margin:18px 0 6px; padding-bottom:5px; border-bottom:1px solid #D5DEEC; }

/* ---- 2026-10-04: Nota Bene page ---- */
.field-note { border-top:1px solid var(--line); padding:20px 0 8px; }
.field-note:first-of-type { border-top:0; padding-top:4px; }
.field-note h2 { font-size:20px; line-height:1.35; margin:0 0 12px; }
.field-note ul ul { margin-top:6px; }

/* ---- 2026-10-04: Syllabus topic bullets start where the other rows' text starts ---- */
.week-details dd .row-list { padding-left:1.15em; margin:0; }
.week-details dd .row-list li { padding-left:2px; }

/* Gradebook opens in its own tab: no course header or sidebars, full width. */
body.standalone-tool { --topbar:0px; }
body.standalone-tool .topbar, body.standalone-tool .site-sidebar, body.standalone-tool .skip-link, body.standalone-tool .subnav-inline { display:none !important; }
body.standalone-tool main { margin-left:0; padding:32px 40px 0; }
body.standalone-tool .content { max-width:none; }

/* Speakers: one line per person, filter box inline with Add speaker. */
.speakers-toolbar { align-items:center; justify-content:flex-end; padding-bottom:6px; }
.speaker-week { padding:16px 0 10px; }
.class-tools #materials-root .speaker-week > h2 { font-size:19px; margin:0 0 6px; }
.class-tools #materials-root .speaker-row { padding:4px 0; margin:0; border-bottom:1px solid #f4f4f4; }
.class-tools #materials-root .speaker-row:last-child { border-bottom:0; }
.speaker-heading { display:flex; flex-wrap:nowrap; align-items:baseline; gap:10px; }
.class-tools #materials-root .speaker-heading h3 { flex:none; font-size:13.5px; }
.speaker-heading h3 a { color:inherit; }
.speaker-heading .speaker-affiliation { flex:none; color:#666; font-size:12.5px; }
.speaker-detail { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#8a8a8a; font-size:12.5px; }
.class-tools #materials-root .speaker-detail :is(.speaker-topic,.speaker-notes) { margin:0; font-size:inherit; color:inherit; white-space:nowrap; }
.speaker-detail .speaker-notes::before { content:" · "; }
.speaker-detail .speaker-topic + .speaker-notes::before, .speaker-detail .speaker-notes:first-child::before { content:" · "; }
.speaker-detail .speaker-notes:first-child::before { content:""; }
.speaker-actions { flex:none; margin-left:auto; }
@media (max-width:819px) { .speaker-heading { flex-wrap:wrap; } .speaker-detail { flex-basis:100%; white-space:normal; } }

/* Staff tools: one burgundy dropdown beside the role badge. */
.staff-menu { position:relative; }
.staff-menu summary { list-style:none; cursor:pointer; color:#8C2F39; border:1px solid #E3C5CA; border-radius:999px; padding:3px 11px; font:500 12.5px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; white-space:nowrap; background:#fff; }
.staff-menu summary::-webkit-details-marker { display:none; }
.staff-menu summary::after { content:"\25BE"; margin-left:6px; font-size:10px; }
.staff-menu summary:hover, .staff-menu[open] summary { background:#F8EEF0; }
.staff-menu.is-current summary { background:#8C2F39; border-color:#8C2F39; color:#fff; }
.staff-menu ul { position:absolute; right:0; top:calc(100% + 6px); min-width:170px; margin:0; padding:6px 0; list-style:none; background:#fff; border:1px solid #ECECEC; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.08); z-index:40; }
.staff-menu li a { display:block; padding:7px 16px; color:#8C2F39; text-decoration:none; font:400 13.5px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; white-space:nowrap; }
.staff-menu li a:hover { background:#FAF3F4; }
.staff-menu li a[aria-current="page"] { font-weight:600; }
.staff-menu .staff-sep { border-top:1px solid #ECECEC; margin:5px 0; }
@media (max-width:819px) { .staff-menu summary { font-size:11.5px; padding:3px 9px; } }
/* Phones: the Tools pill already marks a staff account, so the role badge steps aside to save room. */
@media (max-width:480px) { .auth-controls:has(.staff-menu:not([hidden])) .role-badge { display:none !important; } }

/* Attendance has one compact instructor action; the record itself is read-only. */
.attendance-excuse-form { min-width:150px; text-align:left; white-space:normal; }
.attendance-excuse-form textarea { display:block; width:100%; min-height:54px; }
.attendance-excuse-form button { margin:4px 5px 0 0; }
.class-tools #materials-root .attendance-legend, .class-tools #materials-root .profile-excuse-reason { font-size:12px; color:#555; }
.profile-excuse-reason { white-space:pre-wrap; overflow-wrap:anywhere; }
/* Preparation: Logistics sits first in a light shaded panel. */
.preparation-section[data-prep-section="Logistics"] { background:#F4F6F9; border:1px solid #E3E8EF; border-radius:10px; padding:16px 20px; margin:6px 0 10px; }
.preparation-section[data-prep-section="Logistics"] + .preparation-section { border-top:0; }
/* Preparation class plan: each part is its own card. Lecture parts light red, exercises light blue. */
.preparation-plan, .preparation-appendix { display:flex; flex-direction:column; gap:10px; margin:10px 0 18px; }
.preparation-section.prep-lecture, .preparation-section.prep-exercise { border-radius:10px; padding:14px 20px; }
.preparation-section.prep-lecture { background:#FBF4F4; border:1px solid #F0DCDE; }
.preparation-section.prep-exercise { background:#F1F6FC; border:1px solid #D9E5F3; }
.preparation-appendix { border-top:1px solid #ececec; padding-top:20px; }
.class-tools #materials-root .preparation-appendix > h2 { font:600 23px/1.35 "Source Serif 4",Georgia,serif; margin:0; }
.preparation-plan + .preparation-section, .preparation-appendix + .preparation-section { border-top:1px solid #ececec; }
.class-tools #materials-root .preparation-appendix .prep-section-heading > h3 { font:600 23px/1.35 "Source Serif 4",Georgia,serif; }
/* Attendance, Canvas-style: compact columns, UNI under the name, click a mark for a pop-up. */
.class-grid.attendance-grid { min-width:0; width:max-content; }
.attendance-grid th, .attendance-grid td { min-width:0; }
.attendance-grid td, .attendance-grid thead th:not(:first-child) { width:72px; text-align:center; }
.class-grid th[scope="row"] .student-identity { display:flex; flex-direction:column; line-height:1.15; }
.class-grid th[scope="row"] .student-uni { font-size:11px; color:#8a8a8a; }
.attendance-mark { border:0; background:none; padding:4px 10px; border-radius:4px; font:500 13px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif; cursor:pointer; }
.attendance-mark:hover, .attendance-mark:focus-visible { background:#EEF2F7; }
.attendance-mark.mark-present { color:#2E7D4F; }
.attendance-mark.mark-excused { color:#6b5a00; }
.attendance-mark.mark-absent { color:#b0b0b0; }
.attendance-totals td span, .attendance-totals td span + span { display:block; margin:0 !important; padding:0; font-size:11px; line-height:1.4; }
.attendance-confirm h3 { margin:0 0 8px; font:600 15px/1.3 "Helvetica Neue",Helvetica,Arial,sans-serif; text-transform:none; letter-spacing:0; }
.attendance-confirm textarea { display:block; width:100%; box-sizing:border-box; margin:0 0 12px; font:13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.attendance-confirm { border:1px solid #ECECEC; border-radius:10px; padding:20px 22px; max-width:380px; box-shadow:0 12px 32px rgba(0,0,0,.12); }
.attendance-confirm::backdrop { background:rgba(0,0,0,.25); }
.attendance-confirm p { margin:0 0 14px; font-size:14px; line-height:1.5; }
.attendance-confirm-actions { display:flex; gap:10px; justify-content:flex-end; }
.class-tools #materials-root table.attendance-grid { width:auto !important; min-width:0 !important; }
.class-tools #materials-root .attendance-grid td, .class-tools #materials-root .attendance-grid thead th:not(:first-child) { width:auto; min-width:76px; padding:3px 6px; }
.class-grid-wrap:has(> .attendance-grid) { width:max-content; max-width:100%; }
.attendance-grid .session-date { width:auto; text-align:center; }
.attendance-confirm .attendance-question { font-weight:600; }

/* Header term switcher (staff): looks like the term label, opens a list of terms. */
.term-switch { appearance:none; -webkit-appearance:none; margin:0 0 0 12px; border:0; border-bottom:1px dashed #bbb; border-radius:0; color:var(--muted); font:400 15px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif; height:auto; padding:0 16px 0 0; cursor:pointer; vertical-align:baseline;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23777'/%3E%3C/svg%3E") no-repeat right 2px center; }
.term-switch:hover, .term-switch:focus { border-bottom-color:#555; outline:none; }
.term-readonly-note { color:#8C2F39; font-size:13px; margin:0 0 8px; }

/* Loading: the course paperclip bobs gently. */
.course-loader { display:flex; flex-direction:column; align-items:center; gap:8px; padding:48px 0; color:#777; font-size:13px; }
.course-loader img { image-rendering:pixelated; animation:clip-bob 1.1s ease-in-out infinite; }
@keyframes clip-bob { 0%,100% { transform:translateY(0) rotate(-3deg); } 50% { transform:translateY(-8px) rotate(3deg); } }
@media (prefers-reduced-motion: reduce) { .course-loader img { animation:none; } }
/* With the switcher, the heading becomes a row: course name, then the term menu; the demo tag wraps below. */
.brand-heading:has(.term-switch) { display:flex; flex-wrap:wrap; align-items:flex-start; column-gap:0; }
.brand-heading:has(.term-switch) > .course-brand { min-width:0; }
.brand-heading:has(.term-switch) > .demo-tag { flex-basis:100%; }
.brand-heading .term-switch { height:24px; line-height:24px; margin-top:0; flex-shrink:0; }
@media (max-width:1180px) { .term-switch { font-size:12px; margin-left:8px; } }
/* Very small phones: no room for the menu; keep the plain term label. */
@media (max-width:480px) { .brand-heading .term-switch { display:none; } .topbar .brand-term[hidden] { display:inline !important; } }
/* Speakers: bulleted list under each week. */
.class-tools #materials-root .speaker-week-list { list-style:disc; padding-left:1.2em; }
.class-tools #materials-root .speaker-week-list > .speaker-row { display:list-item; }
.class-tools #materials-root .speaker-week-list > .speaker-row::marker { color:#8a8a8a; }

/* Every collapsible row in the class tools uses the same toggle: a round plus that turns into a solid minus. */
#materials-root[data-page="settings"] { max-width:860px; }
#materials-root[data-page="settings"] > details.admin-section { border:0; border-top:1px solid #ECECEC; margin:0; padding:0; }
#materials-root[data-page="settings"] > details.admin-section[open] { padding-bottom:16px; }
#materials-root[data-page="settings"] > :is(details.admin-section, .storage-meter):last-of-type { border-bottom:1px solid #ECECEC; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu) > summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 0; font:500 14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
#materials-root[data-page="settings"] > details.admin-section > summary { padding:13px 0; font-size:14.5px; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu) > summary::-webkit-details-marker { display:none; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu) > summary::marker { content:""; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu) > summary::after { content:"+"; width:22px; height:22px; box-sizing:border-box; border:1.5px solid #2F6FB8; border-radius:50%; color:#2F6FB8; display:grid; place-items:center; font:600 15px/1 "Helvetica Neue",Helvetica,Arial,sans-serif; flex-shrink:0; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu)[open] > summary::after { content:"–"; background:#2F6FB8; color:#fff; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu) > summary:hover::after { background:#EEF4FB; }
:is(#materials-root, .student-profile, .profile-panel) details:not(.staff-menu)[open] > summary:hover::after { background:#24599a; }
/* Rows nested inside an open row use a smaller toggle. */
:is(#materials-root, .student-profile, .profile-panel) details details > summary { padding:8px 0; font-size:13px; font-weight:400; }
:is(#materials-root, .student-profile, .profile-panel) details details > summary::after { width:18px; height:18px; font-size:13px; border-width:1.25px; }
.storage-meter { border-top:1px solid #EFEFEF; padding:12px 0 10px; font-size:13px; color:#555; }
.storage-bar { height:6px; border-radius:99px; background:#EEF1F4; overflow:hidden; margin-bottom:6px; max-width:320px; }
.storage-bar span { display:block; height:100%; background:#2F6FB8; border-radius:99px; }

/* Card controls use the existing text actions and keep drafts inline. */
.preparation-section { position:relative; }
.prep-section-heading { padding-right:28px; }
.prep-drag-grip { position:absolute; right:12px; top:12px; cursor:grab; font-size:21px; line-height:1; text-decoration:none; }
.prep-drag-grip:disabled { cursor:default; }
.prep-card-form { display:flex; flex-wrap:wrap; align-items:end; gap:10px 16px; padding:10px 0; border-top:1px solid #ECECEC; }
.prep-card-form label { display:flex; flex-direction:column; gap:4px; font-size:12px; min-width:0; }
.prep-card-form label:first-child { flex:1 1 200px; }
.prep-card-form input, .prep-card-form select { width:100%; max-width:100%; font:inherit; border:0; border-bottom:1px solid #D8D8D8; background:transparent; padding:5px 0; }
.prep-card-actions { flex-basis:100%; display:flex; flex-wrap:wrap; gap:8px 16px; }
.prep-card-form [role="status"], [data-prep-layout-status] { font-size:12px; color:#555; }
.prep-add-card { align-self:flex-start; }
.prep-drop-target { outline:1px dashed #888; outline-offset:2px; }

/* Canvas staff tools remain inside the existing right pane. */
.canvas-settings, .canvas-mode, [data-canvas-gradebook] { font-family:Inter,Arial,sans-serif; }
.canvas-settings form { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:16px 0; }
.canvas-settings input { width:140px; }
.canvas-settings small, .canvas-grid th small { display:block; font-size:11px; font-weight:400; color:#666; }
.canvas-mapping select { max-width:320px; width:100%; }
.canvas-mapping td:first-child { min-width:170px; }
.canvas-mode { display:block; margin-bottom:16px; }
.canvas-grid { min-width:0; font-family:Inter,Arial,sans-serif; }
.class-grid-wrap:has(> .canvas-grid) { width:max-content; max-width:100%; }
.canvas-grid th, .canvas-grid td { padding:3px 10px; white-space:nowrap; }
.canvas-grid th:first-child { position:sticky; left:0; background:#fff; z-index:1; }
.canvas-popup { position:fixed; right:16px; bottom:16px; width:min(440px,calc(100vw - 288px)); max-height:calc(100vh - 176px); overflow:auto; z-index:20; background:#fff; border:1px solid #d8d8d8; padding:20px; box-sizing:border-box; }
.canvas-popup h3 { font:600 17px/1.4 Inter,Arial,sans-serif; }
.canvas-popup p { margin:8px 0; font-size:13px; }
@media(max-width:819px) { .canvas-popup { width:calc(100vw - 32px); } .canvas-mapping select { max-width:230px; } }

/* Canvas student views use the same quiet rules as the teaching content. */
.class-tools #materials-root .canvas-sync-note { font:11px/1.5 Inter,Arial,sans-serif; color:#777; margin:8px 0 16px; }
.canvas-status { font-size: 12px; font-weight: 600; margin: 8px 0; }
.canvas-assignment .courseworks-link { display: inline-block; font-size: 12px; }
.canvas-group-set { border-top: 1px solid #ececec; margin-top: 20px; padding-top: 12px; }
.canvas-group { border-top: 1px solid #ececec; padding: 10px 0; }
.canvas-group ul { margin: 4px 0; padding-left: 18px; }
/* Semantic colors belong only to the shared status pill. */
.canvas-status-pill { display:inline-block; border-radius:999px; padding:3px 8px; font:500 11px/1.35 Inter,Arial,sans-serif; background:#f2f2f2; color:#555; }
.canvas-status-pill.status-submitted { background:#e9f5ed; color:#235b3b; }
.canvas-status-pill.status-late { background:#fff5df; color:#885b12; }
.canvas-status-pill.status-missing { background:#faedf2; color:#852f4a; }
.class-tools #materials-root .canvas-assignment .milestone-title, .class-tools #materials-root #due-before-class .canvas-assignment > .milestone-title { display:block; font-size:13px; line-height:1.6; }
.class-tools #materials-root .canvas-assignment .milestone-title .due-line { display:inline; font:inherit; border:0; padding:0; color:inherit; }
.canvas-assignment-links { display:flex; align-items:baseline; flex-wrap:wrap; gap:0 8px; font-size:12px; margin:8px 0; }
.canvas-assignment-links .assignment-instructions-link { margin:0; }
.class-tools #materials-root .canvas-assignment .canvas-sync-note { margin:4px 0 0; font-size:11px; color:#777; }
.canvas-student-grades { width:100%; border-collapse:collapse; table-layout:fixed; font:13px/1.5 Inter,Arial,sans-serif; }
.canvas-student-grades th,.canvas-student-grades td { text-align:left; padding:9px 8px; border-bottom:1px solid #ececec; overflow-wrap:anywhere; vertical-align:middle; }
.canvas-student-grades th:first-child { width:52%; padding-left:0; }
.class-tools .canvas-student-grades th,.class-tools .canvas-student-grades td { font:inherit; }
.canvas-student-grades thead th { color:#777; font-size:11px; font-weight:500; }
.canvas-student-grades thead th:last-child,.canvas-student-grades .grade-score { text-align:right; padding-right:0; }
.canvas-student-grades .canvas-grade-group th { padding:24px 0 6px; }
.class-tools #materials-root .canvas-student-grades h2 { margin:0; font:600 13px/1.5 Inter,Arial,sans-serif; }
.canvas-roster small { display:block; color:#777; font-weight:400; }
@media(max-width:600px) {
  .canvas-student-grades { font-size:12px; }
  .canvas-student-grades th,.canvas-student-grades td { padding:8px 4px; }
  .canvas-student-grades th:first-child { width:44%; }
  .canvas-student-grades .canvas-status-pill { font-size:10px; padding:3px 6px; }
}

/* Canvas staff cells use the same status colors as student views. */
.class-grid.canvas-grid th:not(:first-child), .class-grid.canvas-grid td { min-width:64px; width:64px; padding:3px 2px; text-align:center; }
.canvas-status-cell, .archive-grade-cell { display:block; width:100%; min-height:28px; padding:0; border:0; background:transparent; color:inherit; font:inherit; text-decoration:none; cursor:pointer; }
.canvas-status-cell:hover, .canvas-status-cell:focus-visible, .archive-grade-cell:hover, .archive-grade-cell:focus-visible { background:#fafafa; outline:1px solid #ccc; outline-offset:-1px; }
.canvas-status-pill.status-compact { padding:2px 5px; min-width:22px; box-sizing:border-box; font-size:10px; }
.canvas-roster .roster-match { font:400 11px/1.4 Inter,Arial,sans-serif; color:#777; }
.canvas-roster .roster-match-warning { display:inline-block; padding:2px 6px; border-radius:999px; color:#852f4a; background:#faedf2; }
.canvas-roster .roster-needs-match > th, .canvas-roster .roster-needs-match > td { background:#fdf8fa; }
/* Top menu sits between the course title and the sub-menu: 15.5px on desktop, 14px on narrow laptops. */
@media (min-width:820px) { .menu-row .topnav a { font-size:15.5px; font-weight:500; line-height:21px; } .menu-row .topnav a[aria-current="page"] { font-weight:600; } .menu-row .topnav ul { gap:0 22px; } }
@media (min-width:820px) and (max-width:1050px) { .menu-row .topnav a { font-size:14px; line-height:19px; } .menu-row .topnav ul { gap:0 14px; } }
/* Nota Bene: one note per item, with room between them. */
.content .takes-list li { margin-bottom:30px; }
.content .takes-list .takes-sublist { list-style:disc; padding-left:22px; margin-top:10px; }
.content .takes-list .takes-sublist li { margin-bottom:10px; }
/* Lock after links that need a Columbia sign-in (milestones, lecture notes); hidden once signed in. */
[data-protected-link]::after { content:""; display:inline-block; width:.78em; height:.78em; margin-left:.35em; vertical-align:-.05em; background:var(--accent);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 7V5a3.5 3.5 0 0 1 7 0v2h.5A1 1 0 0 1 13 8v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1h.5zm1.5 0h4V5a2 2 0 0 0-4 0v2z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 7V5a3.5 3.5 0 0 1 7 0v2h.5A1 1 0 0 1 13 8v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1h.5zm1.5 0h4V5a2 2 0 0 0-4 0v2z'/%3E%3C/svg%3E") center/contain no-repeat; }
html[data-signed-in] [data-protected-link]::after { display:none; }
/* Required tag in red so it stands apart from Recommended (blue) and Optional (gray). */
.badge-required:not(.badge-recommended):not(.badge-optional) { color:#B42318; background:#FEF3F2; border-color:#F4B8B2; }

/* Milestone #2 role task lists */
.role-tools { display:flex; justify-content:flex-end; margin:-8px 0 8px; }
.role-summary { color:#444; }
.content p.role-instruct { margin-top:18px; }
.role-legend { display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin:14px 0 6px; border-top:1px solid #ECECEC; border-bottom:1px solid #ECECEC; }
.role-legend > div { padding:12px 14px 12px 0; }
.role-legend > div + div { padding-left:14px; border-left:1px solid #ECECEC; }
.role-legend dt { font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#1A1A1A; margin-bottom:4px; }
.role-legend dd { margin:0; font-size:13px; line-height:1.45; color:#555; }
.role-tasks col.role-task-num { width:36px; }
.role-tasks col.role-task-name { width:26%; }
.role-tasks col.role-task-label { width:104px; }
.role-tasks td:first-child { color:#999; font-variant-numeric:tabular-nums; }
.role-tasks td:nth-child(2) { font-weight:500; }
/* Category tags: one muted colour per kind of work; Own is the strongest. */
.task-label { display:inline-block; padding:2px 9px; border-radius:999px; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size:11.5px; font-weight:600; letter-spacing:.04em; line-height:1.6; white-space:nowrap; }
.task-label.is-process { background:#EAF1FA; color:#2F5F96; }
.task-label.is-predict { background:#F1ECF8; color:#5E3E8F; }
.task-label.is-persuade { background:#FBF0E4; color:#9A5414; }
.task-label.is-own { background:#B3261E; color:#FFFFFF; }
.role-legend dt .task-label { letter-spacing:.04em; text-transform:none; }
@media print { .task-label { -webkit-print-color-adjust:exact; print-color-adjust:exact; } }
@media (max-width:720px) { .role-legend { grid-template-columns:1fr 1fr; } .role-legend > div:nth-child(3) { border-left:0; padding-left:0; } .role-legend > div:nth-child(n+3) { border-top:1px solid #ECECEC; } }
@media (max-width:480px) { .role-tasks col.role-task-name { width:34%; } .role-tasks col.role-task-label { width:84px; } }
@media print {
  .topbar, .subnav, .page-footer, .role-tools, .skip-link, .kicker .xlink, .kicker-sep { display:none !important; }
  body, main, .content { margin:0 !important; padding:0 !important; max-width:none !important; }
  .role-tasks { font-size:11px; page-break-inside:auto; } .role-tasks tr { page-break-inside:avoid; }
  .role-legend { grid-template-columns:repeat(4,1fr); }
  @page { margin:16mm 14mm; }
}
/* Milestone line inside "Due before class" reads at body size, not as fine print. */
.class-tools #materials-root .canvas-assignment .milestone-title, .class-tools #materials-root #due-before-class .canvas-assignment > .milestone-title { font-size:15px; }
/* Assignment pages are reading pages: same serif body text as Syllabus and Library, not the 13px staff-grid type. */
.class-tools #materials-root[data-page="assignments"] :is(.prep-markdown, .assignment-summary) :is(p, li, dd) { font-family:"Source Serif 4", Georgia, serif; font-size:17px; line-height:1.5; color:var(--body); }
.class-tools #materials-root[data-page="assignments"] .prep-markdown :is(p, ul, ol, h2, h3, h4) { max-width:70ch; }
.class-tools #materials-root .prep-markdown p { margin:0 0 20px; }
.class-tools #materials-root .prep-markdown > p:last-child { margin-bottom:0; }
.class-tools #materials-root[data-page="assignments"] .prep-markdown td { font-family:"Source Serif 4", Georgia, serif; font-size:15.5px; }
.class-tools #materials-root[data-page="assignments"] :is(.assignment-mode, .due-line) { font-size:15px; }
/* Nota Bene subtitle and date line. */
.content .nb-subtitle { margin:-8px 0 26px; font-size:17px; color:var(--muted); }
/* Individual / Group: the applicable mode is dark, the other is greyed out. */
.class-tools #materials-root .assignment-mode .mode-option { color:#C4C4C4; }
.class-tools #materials-root .assignment-mode .mode-option + .mode-option { margin-left:14px; }
.class-tools #materials-root .assignment-mode .mode-option.is-active { color:#1A1A1A; font-weight:600; }
/* Assignment pages sit exactly where Syllabus and Library pages sit (same left edge and top), not at the grid-page offset. */
@media (min-width:781px) { body.class-tools:has(#materials-root[data-page="assignments"]) main { padding:calc(var(--topbar) + 40px) 40px 0 56px; } }
/* Assignment pages: one hairline panel per section, each with its own Edit button. */
.assignment-sections { display:flex; flex-direction:column; gap:14px; margin:20px 0 8px; }
.assignment-panel { border:1px solid #ECECEC; border-radius:6px; padding:18px 22px 6px; background:#FFFFFF; }
.assignment-panel-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.class-tools #materials-root .assignment-panel-head h2 { margin:0 0 10px; font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#1A1A1A; }
.assignment-panel:not([data-assignment-section="Introduction"]) .assignment-panel-head + .prep-markdown { margin-top:0; }
.class-tools #materials-root .assignment-panel .prep-markdown h3 { font-size:16px; margin:20px 0 8px; }
.class-tools #materials-root .assignment-panel textarea { width:100%; box-sizing:border-box; font:14px/1.55 ui-monospace,Menlo,monospace; }
.class-tools #materials-root p.assignment-panel-empty { color:#999; font-style:normal; }
@media (max-width:480px) { .assignment-panel { padding:14px 14px 4px; } }
.assignment-panel .visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
/* Button rule (DESIGN.md): three kinds only. Inline text action = blue text, no box. */
.text-action { background:none; border:0; padding:0; margin:0; cursor:pointer; color:#2F6FB8; font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.text-action:hover { text-decoration:underline; text-underline-offset:3px; }
.class-tools #materials-root .assignment-panel .prep-controls { display:flex; align-items:center; gap:10px; margin:10px 0 12px; }
.class-tools #materials-root .assignment-panel .prep-controls .materials-button { margin:0; }
.assignment-panel-head .assignment-submit-link { margin-left:auto; text-decoration:none; }
.assignment-panel-head .assignment-submit-link + .text-action { margin-left:14px; }
.assignment-submission .canvas-assignment { border:0; margin:6px 0 0; padding:0; background:transparent; }
/* Submission panel stands out from the reading panels: light action-blue tint, blue heading. */
.assignment-panel.assignment-submission { background:#F3F7FC; border-color:#CFDDF0; }
.class-tools #materials-root .assignment-submission .assignment-panel-head h2 { color:#2F6FB8; }
/* Equal space above the heading and below the last line in every panel. */
.assignment-panel, .assignment-panel.assignment-submission { padding:20px 22px; }
.class-tools #materials-root .assignment-panel :is(.prep-markdown, .canvas-assignment) > :last-child,
.class-tools #materials-root .assignment-panel > :last-child,
.class-tools #materials-root .assignment-panel .prep-markdown > :last-child > li:last-child { margin-bottom:0; }
@media (max-width:480px) { .assignment-panel, .assignment-panel.assignment-submission { padding:16px 14px; } }
.class-tools #materials-root .assignment-submission .canvas-assignment { padding-bottom:0; }
/* Staff page: website shown as a globe icon next to the email. */
.staff-links .staff-web { display:inline-flex; vertical-align:-3px; margin-left:8px; color:var(--accent); text-decoration:none; }
.staff-links .staff-web:hover { color:var(--ink); }
/* Sidebar: profile icons (website, LinkedIn, X, Google Scholar) after the name. */
.logo-icons { display:inline-flex; gap:7px; margin-left:6px; vertical-align:-2px; }
.logo-icons a { color:#8a939d; text-decoration:none; display:inline-flex; }
.logo-icons a:hover { color:var(--accent); }
/* M1 survey: keep these scoped rules beside M2, away from unrelated page additions. */
.survey-editor, .survey-staff { min-width:0; font:14px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.survey-status { display:flex; flex-wrap:wrap; align-items:center; gap:10px; color:#777; margin:0 0 14px; }
.survey-state { padding:3px 9px; border:1px solid #DDD; border-radius:999px; background:#FFF; color:#444; }
.class-tools #materials-root :is(.survey-editor,.survey-staff) :is(p,li,td,dd,dt) { font:14px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools #materials-root :is(.survey-editor,.survey-staff) h3 { font:600 15px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0 0 14px; }
.class-tools #materials-root p.survey-opening { font-size:15px; line-height:1.6; margin:14px 0 20px; }
.survey-section { min-width:0; padding:16px; margin:14px 0; border:1px solid #ECECEC; border-radius:6px; background:#FFF; }
.survey-question { min-inline-size:0; min-width:0; margin:0 0 24px; padding:0; border:0; }
.survey-question:last-child { margin-bottom:0; }
.survey-question legend { width:100%; padding:0; margin:0 0 10px; font:500 15px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#1A1A1A; }
.survey-optional { color:#777; font-size:13px; font-weight:400; }
.class-tools #materials-root p.survey-hint { color:#777; font-size:13px; margin:6px 0 10px; }
.survey-field { display:flex; flex-direction:column; gap:5px; min-width:0; font:13px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#666; margin:8px 0; }
.survey-identity { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:12px; }
.class-tools #materials-root .survey-editor :is(input:not([type=radio]):not([type=checkbox]),textarea,select) { width:100%; min-width:0; max-width:100%; box-sizing:border-box; padding:8px; border:1px solid #DDD; border-radius:4px; background:#FFF; color:#1A1A1A; font:14px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0; box-shadow:none; }
.class-tools #materials-root .survey-editor textarea { resize:vertical; min-height:80px; white-space:pre-wrap; overflow-wrap:anywhere; }
.survey-editor input[type=number] { max-width:150px !important; }
.survey-editor :is(input,textarea,select):focus-visible { outline:2px solid #2F6FB8; outline-offset:2px; }
.class-tools #materials-root .survey-editor :is(input,textarea,select):disabled, .class-tools #materials-root .survey-editor input[readonly] { opacity:1; background:#FAFAFA; color:#555; -webkit-text-fill-color:currentColor; }
.survey-choices { display:flex; flex-direction:column; gap:8px; }
.survey-choices label { display:flex; gap:8px; align-items:flex-start; cursor:pointer; }
.survey-editor input:is([type=radio],[type=checkbox]) { width:16px; height:16px; min-width:16px; margin:2px 0 0; accent-color:#2F6FB8; }
.survey-grid { width:100%; table-layout:fixed; border-collapse:collapse; margin:8px 0 12px; }
.survey-grid > thead > tr > th:first-child { width:28%; }
.class-tools #materials-root .survey-grid :is(th,td) { padding:8px 4px; border-bottom:1px solid #ECECEC; vertical-align:middle; text-align:center; overflow-wrap:anywhere; }
.class-tools #materials-root .survey-grid th { font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; text-transform:none; letter-spacing:0; }
.class-tools #materials-root .survey-grid tbody th { text-align:left; }
.survey-grid label { display:flex; justify-content:center; padding:3px; cursor:pointer; }
.survey-grid label span { display:none; }
.survey-section > a { display:inline-block; margin:0 0 16px; color:#2F6FB8; }
.survey-warning { color:#8C2F39; }
.survey-message:empty, .survey-hint:empty { display:none; }
.survey-actions { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0; }
.class-tools #materials-root :is(.survey-editor,.survey-staff) .materials-button { margin:0; border-radius:4px; padding:8px 14px; font:500 14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools #materials-root .materials-button.survey-secondary { background:#FFF; color:#444; border:1px solid #CCC; }
.class-tools #materials-root .materials-button.survey-primary { background:#2F6FB8; color:#FFF; border:1px solid #2F6FB8; }
.survey-editor [hidden] { display:none !important; }
.survey-editor button:disabled { opacity:.45; cursor:default; }
.survey-summary { margin:20px 0; border-bottom:1px solid #ECECEC; padding-bottom:12px; }
.survey-summary dl { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 20px; margin:0; }
.survey-summary dd { margin:0; text-align:right; font-variant-numeric:tabular-nums; }
.survey-response { padding:12px 0; border-top:1px solid #ECECEC; }
.survey-response > summary { display:flex; align-items:center; gap:12px; font-size:14px; }
.survey-response > summary > span:first-child { flex:1; min-width:0; }
.survey-response small { display:block; color:#777; font-size:12px; }
.survey-response .survey-editor { margin-top:16px; }
@media (max-width:600px) {
  .survey-section { padding:12px; }
  .survey-identity { grid-template-columns:1fr; gap:0; }
  .survey-grid, .survey-grid tbody { display:block; }
  .survey-grid thead { display:none; }
  .survey-grid tr { display:flex; flex-wrap:wrap; gap:8px 0; padding:10px 0; border-bottom:1px solid #ECECEC; }
  .class-tools #materials-root .survey-grid tbody th { flex-basis:100%; padding:0; border:0; }
  .class-tools #materials-root .survey-grid td { width:33.333%; box-sizing:border-box; border:0; padding:0 4px 0 0; }
  .survey-grid label { justify-content:flex-start; align-items:center; gap:6px; padding:2px 0; font-size:13px; }
  .survey-grid label span { display:inline; }
  .survey-response > summary { flex-wrap:wrap; }
  .survey-response > summary > span:first-child { flex-basis:100%; }
}
/* M2 task maps use the same small UI type as other submission controls. */
.task-map-editor, .task-map-staff { min-width:0; font:13px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.task-map-status { display:flex; flex-wrap:wrap; align-items:center; gap:10px; color:#777; margin:0 0 16px; }
.task-map-state { padding:3px 9px; border:1px solid #DDD; background:#FFF; border-radius:999px; color:#444; }
.task-map-panel { background:#FFF; border:1px solid #ECECEC; border-radius:6px; padding:16px; margin:0 0 14px; min-width:0; }
.class-tools #materials-root :is(.task-map-editor,.task-map-staff) :is(h3,p,li) { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-style:normal; }
.class-tools #materials-root :is(.task-map-editor,.task-map-staff) h3 { font-size:14px; font-weight:600; margin:0 0 8px; }
.class-tools #materials-root .task-map-staff > h3 { margin-top:24px; }
.class-tools #materials-root :is(.task-map-editor,.task-map-staff) p { font-size:13px; line-height:1.5; margin:8px 0; }
.class-tools #materials-root p.task-map-hint { color:#777; font-size:12px; }
.task-map-job { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; }
.task-map-ahead { display:grid; grid-template-columns:1fr 1.5fr 110px; gap:12px; margin:14px 0; }
.task-map-field { display:flex; flex-direction:column; gap:5px; min-width:0; color:#666; font-size:12px; }
.class-tools #materials-root .task-map-editor :is(input,textarea,select) { box-sizing:border-box; max-width:100%; width:100%; min-width:0; margin:0; border:1px solid #DDD; border-radius:4px; padding:8px; font:13px/1.45 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#1A1A1A; background:#FFF; box-shadow:none; }
.class-tools #materials-root .task-map-editor textarea { resize:vertical; overflow:hidden; min-height:36px; white-space:pre-wrap; overflow-wrap:anywhere; }
.class-tools #materials-root .task-map-editor :is(input,textarea,select):focus { outline:2px solid #2F6FB8; outline-offset:1px; }
.class-tools #materials-root .task-map-editor :is(input,textarea,select):disabled { opacity:1; color:#555; background:#FAFAFA; -webkit-text-fill-color:currentColor; }
.class-tools #materials-root .task-map-editor select.task-label { padding:7px 4px; font-size:11.5px; font-weight:600; letter-spacing:0; border-radius:999px; }
.class-tools #materials-root .task-map-editor select.is-process { background:#EAF1FA; color:#2F5F96; }
.class-tools #materials-root .task-map-editor select.is-predict { background:#F1ECF8; color:#5E3E8F; }
.class-tools #materials-root .task-map-editor select.is-persuade { background:#FBF0E4; color:#9A5414; }
.class-tools #materials-root .task-map-editor select.is-own { background:#B3261E; color:#FFF; }
.task-map-tasks, .task-map-roster { width:100%; table-layout:fixed; border-collapse:collapse; margin:12px 0; font:13px/1.45 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools #materials-root :is(.task-map-tasks,.task-map-roster) :is(th,td) { padding:8px 4px; vertical-align:top; border-bottom:1px solid #ECECEC; overflow-wrap:anywhere; }
.class-tools #materials-root :is(.task-map-tasks,.task-map-roster) td { font:inherit; }
.task-map-tasks th { text-align:left; font-size:11px; color:#888; font-weight:500; }
.task-map-tasks th:nth-child(1) { width:18px; }
.task-map-tasks th:nth-child(2) { width:25%; }
.task-map-tasks th:nth-child(4) { width:99px; }
.task-map-tasks th:nth-child(5) { width:16px; }
.task-map-number { color:#999; white-space:nowrap; }
.task-map-tasks button { font-size:20px; line-height:34px; color:#999; }
.task-map-tally { display:flex; flex-wrap:wrap; gap:6px 8px; align-items:center; margin:14px 0 0; font-size:12px; color:#777; }
.task-map-tally > span:first-child:not(.task-label) { flex-basis:100%; }
.task-map-nudge { color:#A54A43; flex-basis:100%; margin-top:4px; }
.class-tools #materials-root p.task-map-words { font-size:11px; color:#888; text-align:right; margin-bottom:0; }
.task-map-warning { color:#A54A43; }
.task-map-message:empty, .task-map-hint:empty { display:none; }
.task-map-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:4px 0 10px; }
.class-tools #materials-root .task-map-actions .materials-button { margin:0; padding:8px 14px; border-radius:4px; font:500 13px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools #materials-root .task-map-actions .task-map-secondary { background:#FFF; color:#444; border:1px solid #CCC; }
.class-tools #materials-root .task-map-actions .task-map-primary { background:#2F6FB8; color:#FFF; border:1px solid #2F6FB8; }
.task-map-export { margin-left:auto; }
.task-map-editor button:disabled { cursor:default; opacity:.45; }
.task-map-anonymous { list-style:none; padding:0; margin:0; }
.task-map-anonymous li { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 10px; border-bottom:1px solid #ECECEC; padding:10px 0; }
.task-map-anonymous li > span:last-child:not(.task-label) { flex-basis:100%; overflow-wrap:anywhere; }
.task-map-roster th { color:#777; font-size:11px; font-weight:500; text-align:left; }
.task-map-roster > thead > tr > th:first-child { width:30%; }
.task-map-roster > thead > tr > th:last-child { width:36px; }
.task-map-roster small { display:block; color:#888; font-size:11px; }
.task-map-roster button { text-align:left; }
.task-map-roster tr[hidden], .task-map-editor [hidden] { display:none !important; }
.task-map-roster .task-map-editor { padding-top:12px; }
.task-map-print-target { display:none; }
@media (max-width:600px) {
  .task-map-panel { padding:12px; }
  .task-map-job, .task-map-ahead { grid-template-columns:1fr; }
  .task-map-tasks, .task-map-tasks tbody { display:block; }
  .task-map-tasks thead { display:none; }
  .task-map-tasks tr { display:grid; grid-template-columns:20px minmax(0,1fr) 20px; gap:6px; padding:10px 0; border-bottom:1px solid #ECECEC; }
  .class-tools #materials-root .task-map-tasks td { border:0; padding:0; }
  .task-map-tasks td:nth-child(1) { grid-column:1; grid-row:1; align-self:center; }
  .task-map-tasks td:nth-child(2) { grid-column:2; grid-row:1; }
  .task-map-tasks td:nth-child(3) { grid-column:2; grid-row:2; }
  .task-map-tasks td:nth-child(4) { grid-column:2; grid-row:3; max-width:120px; }
  .task-map-tasks td:nth-child(5) { grid-column:3; grid-row:1; }
  .task-map-roster .task-map-panel { padding:8px; }
}
@media print {
  body:has(.task-map-print-target) > :not(.task-map-print-target) { display:none !important; }
  .task-map-print-target { display:block; font:12px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#1A1A1A; }
  .task-map-print-target h1 { font-size:20px; }
  .task-map-print-target h2 { font-size:15px; margin-top:20px; }
  .task-map-print-target h3 { font-size:13px; }
  .task-map-print-target p { white-space:pre-wrap; overflow-wrap:anywhere; }
  .task-map-print-target table { width:100%; table-layout:fixed; border-collapse:collapse; }
  .task-map-print-target :is(th,td) { text-align:left; vertical-align:top; padding:6px; border-bottom:1px solid #DDD; white-space:pre-wrap; overflow-wrap:anywhere; }
  .task-map-print-target th:first-child { width:20px; }
  .task-map-print-target th:nth-child(2) { width:22%; }
  .task-map-print-target th:last-child { width:80px; }
  .task-map-print-target tr { break-inside:avoid; }
}
/* M3 shares the Submission panel and stays beside the M2 form rules. */
.group-link-editor, .group-link-staff { min-width:0; font:14px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; }
.class-tools #materials-root :is(.group-link-editor,.group-link-staff) :is(p,th,td) { font:inherit; overflow-wrap:anywhere; }
.group-link-field { display:flex; flex-direction:column; gap:6px; margin:14px 0 6px; color:#555; }
.class-tools #materials-root .group-link-field input { box-sizing:border-box; min-width:0; width:100%; margin:0; padding:9px; font:inherit; border:1px solid #DDD; border-radius:4px; background:#FFF; color:#1A1A1A; }
.group-link-field input:focus-visible { outline:2px solid #2F6FB8; outline-offset:2px; }
.group-link-field input:disabled { opacity:1; background:#FAFAFA; -webkit-text-fill-color:#555; }
.class-tools #materials-root .group-link-editor .materials-button { margin:10px 0; padding:8px 14px; border-radius:4px; font:500 14px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif; background:#2F6FB8; color:#FFF; border:1px solid #2F6FB8; }
.group-link-editor button:disabled { opacity:.5; cursor:default; }
.group-link-editor [hidden] { display:none !important; }
.group-link-hint { color:#6B6B6B; }
.group-link-warning { color:#8C2F39; }
.group-link-message:empty, .group-link-warning:empty, .group-link-hint:empty { display:none; }
.group-link-submitted { padding-top:8px; border-top:1px solid #ECECEC; overflow-wrap:anywhere; }
.group-link-table { width:100%; table-layout:fixed; border-collapse:collapse; margin-top:16px; }
.class-tools #materials-root .group-link-table :is(th,td) { padding:8px 4px; text-align:left; vertical-align:top; border-bottom:1px solid #ECECEC; width:auto; }
.class-tools #materials-root .group-link-table th { color:#555; font-weight:500; font-size:12px; text-transform:none; letter-spacing:0; }
.group-link-status { min-width:0; }
@media (max-width:600px) {
  .group-link-table, .group-link-table tbody { display:block; }
  .group-link-table thead { display:none; }
  .group-link-table tr { display:block; border-top:1px solid #ECECEC; padding:10px 0; }
  .class-tools #materials-root .group-link-table :is(th,td) { display:grid; grid-template-columns:85px minmax(0,1fr); gap:8px; width:auto; border:0; padding:4px 0; }
  .group-link-table :is(th,td)::before { content:attr(data-label); color:#777; font-size:12px; }
}
/* Syllabus > Deliverables overview table */
.deliverables-table col.dl-item { width:24%; } .deliverables-table col.dl-due { width:17%; } .deliverables-table col.dl-mode { width:12%; } .deliverables-table col.dl-pts { width:8%; }
.deliverables-table td:first-child { font-weight:600; }
.deliverables-table td:last-child, .deliverables-table th:last-child { text-align:right; }
.deliverables-table .dl-date { color:var(--muted); font-size:13px; }
@media (max-width:600px) { .deliverables-table col.dl-item { width:30%; } .deliverables-table col.dl-mode, .deliverables-table td:nth-child(4), .deliverables-table th:nth-child(4) { display:none; } }
.deliverables-table td:nth-child(3) { white-space:nowrap; }
/* Submission panel sits outside .assignment-sections: give it the same 14px gap as between panels. */
.assignment-page > .assignment-sections { margin-bottom:0; }
.assignment-page > .assignment-submission { margin-top:14px; }
/* Individual / Group: a read-only two-part pill. Active side filled blue; not a control, so no pointer. */
.class-tools #materials-root .assignment-mode { display:inline-flex; margin:6px 0 4px; border:1px solid #D5D5D5; border-radius:999px; overflow:hidden; cursor:default; user-select:none; }
.class-tools #materials-root .assignment-mode .mode-option { padding:3px 14px; font:500 12.5px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#9A9A9A; background:#FFFFFF; }
.class-tools #materials-root .assignment-mode .mode-option + .mode-option { margin-left:0; border-left:1px solid #D5D5D5; }
.class-tools #materials-root .assignment-mode .mode-option.is-active { background:#2F6FB8; color:#FFFFFF; font-weight:600; }
.class-tools #materials-root .assignment-mode .mode-option.is-active + .mode-option, .class-tools #materials-root .assignment-mode .mode-option + .mode-option.is-active { border-left-color:#2F6FB8; }

/* Setup Guide: copyable commands */
.content code { font:13.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace; background:#F5F5F5; border:1px solid #ECECEC; border-radius:4px; padding:1px 5px; overflow-wrap:anywhere; }
.setup-commands col.sc-who { width:24%; }
.setup-commands td:first-child { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size:13.5px; font-weight:600; vertical-align:top; padding-top:12px; }
.content code.setup-code { cursor:copy; position:relative; }
.content code.setup-code:hover { border-color:#2F6FB8; }
.content code.setup-code[data-copied]::after { content:"Copied"; position:absolute; left:100%; top:0; margin-left:8px; font:600 11px/1.9 "Helvetica Neue",Helvetica,Arial,sans-serif; color:#2F6FB8; background:#fff; white-space:nowrap; }
/* Prompt box: one consistent look for every prompt students send to their assistant. */
.content .prompt-box { position:relative; margin:10px 0 14px; padding:14px 76px 14px 16px; border:1px solid #CFDDF0; border-radius:8px; background:#F3F7FC; }
.content .prompt-box .prompt-label { display:block; font:600 10.5px/1 "Helvetica Neue", Helvetica, Arial, sans-serif; letter-spacing:.14em; text-transform:uppercase; color:#2F6FB8; margin-bottom:8px; }
.content .prompt-box .prompt-text { margin:0; font:14px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; color:#1a1a1a; }
.content .prompt-box .prompt-copy { position:absolute; top:12px; right:12px; font:600 12px/1 "Helvetica Neue", Helvetica, Arial, sans-serif; color:#2F6FB8; background:#fff; border:1px solid #CFDDF0; border-radius:6px; padding:6px 10px; cursor:pointer; }
.content .prompt-box .prompt-copy:hover { border-color:#2F6FB8; }
@media (max-width:600px) { .setup-commands col.sc-who { width:34%; } }
.deliverables-table td:nth-child(2) { font-weight:400; }
.optional-table col.dl-item { width:26%; }
.deliverables-table.optional-table td:nth-child(3) { white-space:nowrap; text-align:right; }

/* Milestones table: balanced columns, Name no wider than its longest entry needs. */
.milestones-table col.ms-num { width:21%; } .milestones-table col.ms-name { width:29%; } .milestones-table col.ms-due { width:21%; } .milestones-table col.ms-mode { width:17%; } .milestones-table col.ms-pts { width:12%; }
@media (max-width:600px) { .milestones-table col.ms-num { width:30%; } .milestones-table col.ms-name { width:36%; } .milestones-table td:nth-child(4), .milestones-table th:nth-child(4) { display:none; } }

/* Logistics > Grading: one simple points table */
.grading-table col.gr-pts { width:22%; }
.grading-table td:last-child, .grading-table th:last-child { text-align:right; white-space:nowrap; }
.grading-table tr.gr-total td { font-weight:600; border-top:1px solid #1A1A1A; }
.grading-table tr.gr-extra td { color:var(--muted); }
/* M2 form: one question per row; status pill beside the SUBMISSION heading; taller reasoning box. */
.task-map-job { grid-template-columns:1fr; gap:14px; }
.task-map-ahead { grid-template-columns:1fr; gap:14px; }
.task-map-field { font-size:13.5px; color:#333; }
.assignment-submission > .assignment-panel-head { justify-content:flex-start; align-items:center; gap:12px; }
.task-map-status.in-panel-head { margin:0 0 10px; }
.class-tools #materials-root .task-map-editor textarea.task-map-reason { min-height:140px; }

/* M2 form: per-block save note beside each block heading; taller look-ahead answer. */
.task-map-panel-head { display:flex; align-items:baseline; gap:10px; }
.task-map-panel-note { font-size:12px; color:#2F6FB8; }
.class-tools #materials-root .task-map-editor textarea.task-map-ahead-answer { min-height:76px; }