:root {
  --hub-ink: #171a1d;
  --hub-soft-ink: #53606b;
  --hub-faint: #8a9299;
  --hub-blue: var(--primary, #285e82);
  --hub-blue-strong: var(--primary-strong, #204b68);
  --hub-blue-wash: var(--secondary-surface, #eef5fa);
  --hub-blue-muted: rgba(40, 94, 130, 0.3);
  --hub-rule: #dfe2e4;
  --hub-rule-light: #eceeef;
  --hub-wash: #f7f9fa;
  --hub-success: #3f7650;
  --hub-warning: #aa6d20;
}

.hub-global-home {
  flex: none;
  color: #171a1d;
  font-family: var(--font-display);
  font-size: 0.86rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.hub-global-home:hover {
  color: #000;
  text-decoration: underline;
}

.hub-course-switcher {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}

.hub-course-switcher-trigger {
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.hub-course-switcher-trigger:not([hidden]) {
  display: inline-flex;
}

.hub-course-switcher-menu {
  min-width: min(22rem, calc(100vw - 2rem));
}

.hub-course-switcher-link[aria-current="page"] {
  color: var(--hub-blue);
  background: var(--hub-blue-wash);
  font-weight: 600;
}

body.hub-directory-page {
  --primary: #171a1d;
  --primary-strong: #000;
  --heading: #171a1d;
  --heading-ink: #171a1d;
  --link: #171a1d;
  --page-bg: #fbfbfa;
  --surface-raised: #fff;
  --secondary-surface: #f2f2f0;
  --line: #d9d9d5;
  --line-strong: #bdbdb7;
  color: #171a1d;
  background: var(--page-bg);
}

.hub-directory-shell {
  width: min(100%, 1100px);
  margin: 0 auto;
  padding: clamp(3.5rem, 8vw, 7.5rem) 1.4rem 5rem;
}

.hub-directory-hero {
  max-width: 48rem;
}

.hub-directory-hero h1 {
  margin: 0;
  color: #171a1d;
  font-size: clamp(3rem, 8vw, 6rem);
  font-weight: 500;
  letter-spacing: -0.055em;
  line-height: 0.96;
}

.hub-directory-hero p {
  max-width: 38rem;
  margin: 1.3rem 0 0;
  color: #555b5d;
  font-size: clamp(1.05rem, 2vw, 1.3rem);
  line-height: 1.55;
}

.hub-directory {
  margin-top: clamp(4rem, 8vw, 7rem);
}

.hub-directory > h2 {
  margin: 0 0 1rem;
  color: #555b5d;
  font-size: 1rem;
  font-weight: 500;
}

.hub-directory-course-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.hub-directory-course {
  min-width: 0;
  border-bottom: 1px solid var(--line);
}

.hub-directory-course:nth-child(odd) {
  border-right: 1px solid var(--line);
}

.hub-directory-course a {
  display: grid;
  min-height: 12rem;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  color: var(--course-color);
  text-decoration: none;
  transition: background-color 160ms ease;
}

.hub-directory-course a:hover {
  color: var(--course-color);
  background: color-mix(in srgb, var(--course-color) 6%, transparent);
}

.hub-directory-course h2 {
  max-width: 15ch;
  margin: 0;
  color: inherit;
  font-size: clamp(1.55rem, 3vw, 2.25rem);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.12;
}

.hub-directory-course a > span {
  align-self: end;
  margin-top: 2.5rem;
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 600;
}

.hub-primary-nav {
  display: flex;
  align-items: center;
  gap: 1.35rem;
  margin-left: auto;
  font-family: var(--font-display);
  font-size: 0.9rem;
  white-space: nowrap;
}

.hub-account-nav {
  display: flex;
  align-items: center;
  margin-left: auto;
  min-height: 2rem;
  font-family: var(--font-display);
  font-size: 0.88rem;
  white-space: nowrap;
}

.hub-report-trigger {
  border: 0;
  background: transparent;
  color: var(--muted-text);
  font: inherit;
  cursor: pointer;
  padding: .45rem .7rem;
  margin-right: .4rem;
}
.hub-report-trigger:hover { color: var(--accent); }
.hub-report-dialog {
  width: min(38rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  box-sizing: border-box;
  padding: 1.5rem;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--text);
  background: var(--paper, #fff);
  overflow: auto;
}
.hub-report-dialog::backdrop { background: rgb(0 0 0 / .4); }
.hub-report-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.hub-report-heading h2 { margin: 0; font-size: 1.35rem; }
.hub-report-heading button { border: 0; background: transparent; font-size: 1.7rem; cursor: pointer; color: inherit; padding: 0 .25rem; }
.hub-report-dialog > p, .hub-report-context { color: var(--muted-text); font-size: .9rem; }
.hub-report-dialog fieldset { border: 0; padding: 0; margin: 1.25rem 0; }
.hub-report-dialog legend, .hub-report-description { font-weight: 600; margin-bottom: .6rem; display: block; }
.hub-report-kinds { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.hub-report-kinds label { display: flex; gap: .4rem; align-items: baseline; font-size: .9rem; cursor: pointer; }
.hub-report-dialog textarea { width: 100%; box-sizing: border-box; resize: vertical; font: inherit; padding: .7rem; border: 1px solid var(--line); border-radius: 6px; color: inherit; background: transparent; }
.hub-report-context { overflow-wrap: anywhere; }
.hub-report-submit { display: flex; justify-content: flex-end; }
.hub-report-dialog summary { cursor: pointer; }
.hub-report-dialog article { border-top: 1px solid var(--line); margin-top: 1rem; overflow-wrap: anywhere; }
.hub-report-dialog article p { white-space: pre-wrap; }
.hub-report-history-heading { font-size: .85rem; font-weight: 600; color: var(--muted-text); }
@media (max-width: 480px) {
  .hub-report-dialog { padding: 1rem; }
  .hub-report-kinds { grid-template-columns: 1fr; }
  .hub-report-trigger { padding-inline: .25rem; }
}

.hub-primary-nav + .hub-account-nav,
.chapter-nav + .hub-account-nav {
  margin-left: 1rem;
}

.hub-account-link,
.hub-account-signin {
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
  color: var(--muted-text);
  text-decoration: none;
}

.hub-account-link:hover,
.hub-account-signin:hover {
  color: var(--hub-blue);
}

.hub-account-avatar {
  display: block;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 50%;
  object-fit: cover;
}

.hub-account-avatar-fallback {
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--hub-blue);
  font-size: 0.76rem;
  font-weight: 600;
}

.hub-primary-link {
  position: relative;
  color: var(--muted-text);
  text-decoration: none;
}

.hub-nav-menu {
  position: relative;
  display: flex;
  align-items: center;
}

.hub-nav-menu-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  font: inherit;
}

.hub-nav-menu-chevron {
  width: 0.38rem;
  height: 0.38rem;
  margin-top: -0.18rem;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg);
}

.hub-nav-dropdown {
  position: absolute;
  top: calc(100% + 0.72rem);
  left: -0.72rem;
  z-index: 60;
  display: grid;
  min-width: 11.5rem;
  padding: 0.35rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.3rem;
  background: #fff;
  box-shadow: 0 0.65rem 1.6rem rgba(23, 26, 29, 0.12);
}

.hub-nav-dropdown[hidden] {
  display: none;
}

.hub-nav-dropdown-link {
  padding: 0.58rem 0.65rem;
  border-radius: 0.18rem;
  color: var(--hub-soft-ink);
  text-decoration: none;
}

.hub-nav-dropdown-link:hover,
.hub-nav-dropdown-link.is-active {
  color: var(--hub-blue);
  background: var(--hub-blue-wash);
}

.hub-primary-link:hover,
.hub-primary-link.is-active {
  color: var(--hub-blue);
}

.hub-primary-link.is-active::after {
  position: absolute;
  right: 0;
  bottom: -0.45rem;
  left: 0;
  height: 1px;
  background: var(--hub-blue);
  content: "";
}

.hub-live-link {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
}

.hub-live-dot {
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 50%;
  background: var(--hub-blue);
  box-shadow: 0 0 0 3px var(--primary-soft);
}

.hub-live-link .hub-live-dot { display: none; }
.hub-live-link.is-live-active .hub-live-dot { display: inline-block; }

.hub-nav-activity { display: inline-flex; align-items: center; gap: 0.3rem; }
.hub-primary-link.has-activity { display: inline-flex; align-items: center; gap: 0.42rem; }
.hub-nav-activity-dot { width: 0.42rem; height: 0.42rem; border-radius: 50%; background: var(--hub-blue); }
.hub-nav-count {
  display: inline-flex;
  min-width: 1.2rem;
  height: 1.2rem;
  align-items: center;
  justify-content: center;
  padding: 0 0.34rem;
  border-radius: 999px;
  background: var(--hub-blue);
  color: #fff;
  font: 600 0.7rem/1 var(--font-body);
  font-variant-numeric: tabular-nums;
}
.hub-nav-new {
  padding: 0.16rem 0.45rem;
  border-radius: 999px;
  background: var(--hub-blue-wash);
  color: var(--hub-blue);
  font: 0.72rem/1.2 var(--font-body);
  white-space: nowrap;
}
.hub-nav-dropdown-link.has-activity { display: flex; align-items: center; justify-content: space-between; gap: 0.9rem; }
.hub-nav-dropdown-link:hover .hub-nav-new,
.hub-nav-dropdown-link.is-active .hub-nav-new { background: #fff; }
.hub-ask-tab.has-activity { display: inline-flex; align-items: center; gap: 0.45rem; }

body.is-hub-course-home {
  background: var(--page-bg);
}

body.is-hub-course-home .page-shell {
  width: min(100%, 1390px);
  grid-template-columns: minmax(0, 1230px);
  padding-top: 2.5rem;
}

body.is-hub-course-home .page-header {
  max-width: none;
  margin-bottom: 2.25rem;
  border-bottom: 1px solid var(--hub-rule);
  padding-bottom: 1.6rem;
}

body.is-hub-course-home .page-header h1 {
  color: var(--hub-blue);
  font-size: clamp(2.35rem, 4vw, 3.8rem);
  font-weight: 500;
  letter-spacing: -0.035em;
}

body.is-hub-course-home .page-header .page-chapter-label {
  display: none;
}

body.is-hub-course-home .chapter-nav {
  display: none;
}

.hub-course-home {
  display: grid;
  gap: 2.25rem;
}

.hub-course-tools a {
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-course-tools a:hover {
  color: var(--hub-blue-strong);
  text-decoration: underline;
}

.hub-up-next-heading {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  margin-bottom: 1rem;
}

.hub-up-next-heading h2 {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 500;
  letter-spacing: -0.02em;
}

.hub-up-next-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
}

.hub-up-next-column {
  min-width: 0;
  padding: 1.5rem clamp(1.25rem, 2.5vw, 2.5rem);
}

.hub-up-next-column:first-child { padding-left: 0; }
.hub-up-next-column:last-child { padding-right: 0; }
.hub-up-next-column + .hub-up-next-column { border-left: 1px solid var(--hub-rule); }

.hub-up-next-column h3 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.3;
}

.hub-up-next-context {
  min-height: 2.8em;
  margin: 0.45rem 0 0.85rem;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
  line-height: 1.4;
}

.hub-up-next-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-up-next-list li + li { border-top: 1px solid var(--hub-rule-light); }

.hub-up-next-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 5.5rem;
  padding: 0.7rem 0;
  color: var(--hub-ink);
  text-decoration: none;
}

.hub-up-next-copy { display: grid; gap: 0.2rem; min-width: 0; }
.hub-up-next-label { font-size: 0.95rem; font-weight: 600; line-height: 1.35; }
.hub-up-next-detail { color: var(--hub-soft-ink); font-size: 0.84rem; line-height: 1.4; }
.hub-up-next-icon { color: var(--hub-blue); line-height: 1.3; }
a.hub-up-next-item:hover .hub-up-next-label { color: var(--hub-blue); text-decoration: underline; }
.hub-up-next-item:focus-visible { outline: 2px solid var(--hub-blue); outline-offset: 4px; }
.hub-up-next-status { color: var(--hub-success); font-size: 0.78rem; }
.hub-up-next-list .is-complete .hub-up-next-icon { color: var(--hub-success); }

.hub-up-next-done,
.hub-up-next-empty {
  margin: 0.7rem 0 0;
  font-size: 0.85rem;
  line-height: 1.45;
}

.hub-up-next-done { color: var(--hub-success); }
.hub-up-next-empty { color: var(--hub-soft-ink); }
.hub-up-next-heading .hub-up-next-done { margin: 0; }
.hub-up-next-more { display: inline-block; margin-top: 0.8rem; color: var(--hub-blue); font-size: 0.8rem; }

.hub-topic-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-public-note-list {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--hub-rule);
  list-style: none;
}

.hub-public-note-row {
  display: grid;
  grid-template-columns: 3rem minmax(0, 42rem);
  gap: clamp(1rem, 2.2vw, 2.7rem);
  padding: 2rem 0 2.15rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-public-note-row.is-upcoming {
  color: var(--hub-soft-ink);
}

.hub-public-note-link {
  display: inline-block;
  margin-top: 0.8rem;
  color: var(--hub-blue);
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
}

.hub-public-note-link:hover {
  color: var(--hub-blue-strong);
  text-decoration: underline;
}

.hub-topic-row {
  display: grid;
  grid-template-columns:
    3rem
    minmax(13rem, 1.1fr)
    minmax(11rem, 0.82fr)
    minmax(12rem, 0.9fr)
    minmax(9rem, 0.64fr);
  gap: clamp(1rem, 2.2vw, 2.7rem);
  padding: 2.35rem 0 2.45rem;
  border-bottom: 1px solid var(--hub-rule);
  align-items: start;
}

.hub-topic-row.is-current {
  box-shadow: inset 2px 0 0 var(--hub-blue);
  padding-left: 1rem;
}

.hub-topic-introduction-resources {
  grid-column: 3 / -1;
}

.hub-topic-row.is-upcoming {
  color: var(--hub-soft-ink);
}

.hub-topic-exam {
  grid-column: -2 / -1;
}

.hub-topic-number {
  padding-top: 0.12rem;
  color: var(--hub-faint);
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-variant-numeric: tabular-nums;
}

.hub-topic-title {
  margin: 0;
  color: var(--hub-ink);
  font-size: clamp(1.35rem, 2vw, 1.72rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.18;
}

.hub-topic-title a {
  color: inherit;
  text-decoration: none;
}

.hub-topic-title a:hover {
  color: var(--hub-blue);
}

.hub-topic-column-label {
  margin: 0 0 0.72rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.3;
}

.hub-topic-highlight-list {
  display: grid;
  gap: 0.22rem;
  margin: 0;
  padding: 0;
  color: var(--hub-ink);
  font-size: 0.9rem;
  line-height: 1.4;
  list-style: none;
}

.hub-topic-detail-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.68rem;
  color: var(--hub-soft-ink);
  font-size: 0.83rem;
  text-decoration: none;
}

.hub-topic-detail-link:hover {
  color: var(--hub-blue);
}

.hub-overall-progress,
.hub-performance {
  max-width: 17rem;
  margin-top: 1rem;
}

.hub-performance {
  margin-top: 0.72rem;
}

.hub-overall-progress-label,
.hub-performance-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  color: var(--hub-soft-ink);
  font-size: 0.78rem;
}

.hub-overall-progress-label strong,
.hub-performance-label strong {
  color: var(--hub-ink);
  font-weight: 500;
}

.hub-overall-progress .hub-progress-track,
.hub-performance .hub-progress-track {
  margin-top: 0.38rem;
}

.hub-practice-resource-list {
  display: grid;
}

.hub-practice-resource-list a {
  display: grid;
  gap: 0.12rem;
  padding: 0.58rem 0;
  border-top: 1px solid var(--hub-rule-light);
  color: var(--hub-ink);
  font-size: 0.88rem;
  line-height: 1.35;
  text-decoration: none;
}

.hub-practice-resource-list a:first-child {
  padding-top: 0;
  border-top: 0;
}

.hub-practice-resource-list a:hover > span {
  color: var(--hub-blue);
}

.hub-practice-resource-list small {
  color: var(--hub-faint);
  font-size: 0.76rem;
}

.hub-progress-track {
  height: 2px;
  margin-top: 0.72rem;
  overflow: hidden;
  background: var(--hub-rule-light);
}

.hub-progress-track span {
  display: block;
  height: 100%;
  background: var(--hub-blue);
}

.hub-performance-label .hub-performance-strong {
  color: var(--hub-success);
}

.hub-performance-track-strong span {
  background: var(--hub-success);
}

.hub-performance-label .hub-performance-developing {
  color: var(--hub-warning);
}

.hub-performance-track-developing span {
  background: var(--hub-warning);
}

.hub-performance-label .hub-performance-not-started {
  color: var(--hub-faint);
}

.hub-performance-label .hub-performance-not-scored {
  color: var(--hub-faint);
}

.hub-performance-track-not-started span {
  background: var(--hub-faint);
}

.hub-performance-track-not-scored span {
  background: var(--hub-faint);
}

.hub-proficiency.is-unmeasured .hub-performance-label strong {
  color: var(--hub-faint);
}

.hub-proficiency.is-unmeasured .hub-proficiency-track span {
  background: var(--hub-faint);
}

.hub-proficiency-evidence {
  display: block;
  margin-top: 0.3rem;
  color: var(--hub-soft-ink);
  font-size: 0.72rem;
}

.hub-proficiency-types {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem 3rem;
  padding: 0;
  list-style: none;
}

.hub-proficiency-types li {
  display: grid;
  gap: 0.25rem;
}

.hub-proficiency-type,
.hub-proficiency-legend,
.hub-proficiency-legend > span {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.hub-proficiency-types small,
.hub-proficiency-note,
.hub-proficiency-question p,
.hub-proficiency-method {
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
}

.hub-proficiency-swatch {
  display: inline-block;
  width: 0.7rem;
  height: 0.9rem;
}

.hub-proficiency-swatch.is-multipleChoice,
.hub-proficiency-swatch.is-short {
  background: var(--accent);
}

.hub-proficiency-swatch.is-long { background: var(--primary); }

.hub-proficiency-legend {
  gap: 0.75rem 1.5rem;
  margin-top: 1.75rem;
  color: var(--hub-soft-ink);
  font-size: 0.85rem;
}

.hub-proficiency-line-key {
  display: inline-block;
  width: 1.5rem;
  height: 3px;
  background: var(--primary-strong);
}

.hub-proficiency-chart { position: relative; margin-top: 0.9rem; }
.hub-proficiency-chart svg { display: block; overflow: visible; }
.hub-proficiency-chart svg text { fill: var(--hub-soft-ink); font: 12px var(--font-body, sans-serif); }
.hub-proficiency-grid { stroke: var(--hub-rule); stroke-width: 1; }
.hub-proficiency-bar { fill: var(--primary); opacity: 0.4; }
.hub-proficiency-bar.is-short,
.hub-proficiency-bar.is-multipleChoice { fill: var(--accent); }
.hub-proficiency-bar.is-selected { opacity: 0.85; }
.hub-proficiency-line { fill: none; stroke: var(--primary-strong); stroke-width: 2.5; }
.hub-proficiency-chart-targets { position: absolute; inset: 0; }
.hub-proficiency-chart-targets button {
  position: absolute;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
}
.hub-proficiency-chart-targets button:hover { background: color-mix(in srgb, var(--primary) 7%, transparent); }
.hub-proficiency-chart-targets button:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }

.hub-proficiency-picker { display: grid; gap: 0.4rem; max-width: 36rem; margin: 1rem 0; }
.hub-proficiency-picker select {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 0.65rem;
  color: var(--hub-ink);
  background: var(--surface-raised, white);
  border: 1px solid var(--hub-rule);
  border-radius: 4px;
  font: inherit;
}
.hub-proficiency-question { padding: 1rem 0; border-top: 1px solid var(--hub-rule); font-variant-numeric: tabular-nums; }
.hub-proficiency-result-heading { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; justify-content: space-between; }
.hub-proficiency-question p { margin: 0.45rem 0; }
.hub-proficiency-parts { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; padding: 0; list-style: none; font-size: 0.9rem; }
.hub-proficiency-method,
.hub-proficiency-pending { margin-top: 1.25rem; }
.hub-proficiency-details summary { cursor: pointer; }
.hub-proficiency-details { scroll-margin-top: 6rem; }
@media (max-width: 640px) {
  .hub-proficiency-details { scroll-margin-top: 9rem; }
}

.hub-topic-unavailable {
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.9rem;
}

.hub-course-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.25rem;
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
}

.hub-course-tools > span {
  color: var(--hub-faint);
  font-size: 0.82rem;
  font-weight: 600;
}

.hub-topic-shell {
  width: min(100% - 3rem, 1080px);
  margin: 0 auto;
  padding: 3.1rem 0 5rem;
}

.hub-topic-back {
  display: inline-flex;
  margin-bottom: 2.4rem;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  text-decoration: none;
}

.hub-topic-back:hover {
  color: var(--hub-blue);
}

.hub-topic-page-header {
  max-width: 54rem;
}

.hub-topic-course-name {
  margin: 0 0 0.65rem;
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
}

.hub-topic-page-title {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2.45rem, 5vw, 4.35rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1.04;
}

.hub-topic-measures {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 17rem));
  gap: 2.5rem;
  margin-top: 2.1rem;
}

.hub-topic-measure-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
}

.hub-topic-measure-label strong {
  color: var(--hub-ink);
  font-weight: 500;
}

.hub-topic-measure .hub-progress-track {
  margin-top: 0.42rem;
}

.hub-topic-content-section {
  margin-top: 3.3rem;
  padding-top: 1.55rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-topic-overview {
  display: grid;
  grid-template-columns: minmax(18rem, 2fr) minmax(0, 3fr);
  align-items: start;
  gap: clamp(3rem, 6vw, 5rem);
}

.hub-topic-overview-public {
  grid-template-columns: minmax(18rem, 26rem);
}

.hub-topic-section-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.hub-topic-section-heading h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
  letter-spacing: -0.02em;
}

.hub-topic-section-heading a {
  color: var(--hub-blue);
  font-size: 0.86rem;
  text-decoration: none;
}

.hub-topic-section-heading a:hover {
  text-decoration: underline;
}

.hub-topic-notes-actions {
  display: grid;
  gap: 0.45rem;
}

.hub-topic-recording-list {
  display: grid;
  gap: 1.5rem;
}

.hub-topic-material-list {
  display: grid;
  gap: 1.15rem;
}

.hub-topic-material-placeholder {
  min-height: 5.5rem;
  padding: 1.15rem 1.25rem;
  border: 1px solid var(--hub-rule);
  border-radius: 10px;
  background: var(--hub-paper);
}

.hub-topic-material-placeholder h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 500;
}

.hub-topic-material-placeholder p {
  margin: 0.3rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.85rem;
}

.hub-topic-recording-card {
  overflow: hidden;
  border: 1px solid var(--hub-rule);
  border-radius: 10px;
  background: var(--hub-paper);
}

.hub-topic-recording-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.15rem 1.25rem;
}

.hub-topic-recording-header h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 500;
}

.hub-topic-recording-header p,
.hub-topic-recording-notice {
  color: var(--hub-soft-ink);
  font-size: 0.85rem;
}

.hub-topic-recording-header p {
  margin: 0.25rem 0 0;
}

.hub-topic-recording-draft {
  flex: 0 0 auto;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: var(--hub-blue-wash);
  color: var(--hub-blue);
  font-size: 0.74rem;
  font-weight: 600;
}

.hub-topic-recording-notice {
  margin: 0;
  padding: 0.65rem 1.25rem;
  border-top: 1px solid var(--hub-rule-light);
  background: var(--hub-wash);
}

.hub-topic-recording-card video {
  display: block;
  width: 100%;
  max-height: 72vh;
  background: #0b0d0f;
}

.hub-topic-recording-transcript {
  display: inline-flex;
  margin: 0.9rem 1.25rem 1rem;
  color: var(--hub-blue);
  font-size: 0.86rem;
  text-decoration: none;
}

.hub-topic-recording-transcript:hover {
  text-decoration: underline;
}

.hub-topic-section-list,
.hub-topic-subsection-list,
.hub-topic-resource-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-topic-section-group-link,
.hub-topic-resource-list a {
  display: grid;
  align-items: center;
  gap: 1.2rem;
  padding: 1rem 0;
  border-top: 1px solid var(--hub-rule-light);
  color: var(--hub-ink);
  text-decoration: none;
}

.hub-topic-section-group-link {
  grid-template-columns: 2rem minmax(0, 1fr) auto;
}

.hub-topic-section-group:first-child > .hub-topic-section-group-link,
.hub-topic-resource-list li:first-child a {
  border-top: 0;
}

.hub-topic-section-list a:hover .hub-topic-section-title,
.hub-topic-resource-list a:hover .hub-topic-resource-title {
  color: var(--hub-blue);
}

.hub-topic-subsection-list {
  display: grid;
  gap: 0.15rem;
  margin: -0.15rem 0 0.75rem 3.2rem;
  padding: 0.1rem 0 0.25rem 1rem;
  border-left: 1px solid var(--hub-rule-light);
}

.hub-topic-subsection-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 0.38rem 0;
  color: var(--hub-soft-ink);
  text-decoration: none;
}

.hub-topic-subsection-link-nested {
  padding-left: 1rem;
}

.hub-topic-subsection-link .hub-topic-section-title {
  font-size: 0.9rem;
  font-weight: 400;
}

.hub-topic-section-number {
  color: var(--hub-faint);
  font-family: var(--font-display);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}

.hub-topic-section-copy,
.hub-topic-resource-copy {
  display: grid;
  gap: 0.12rem;
}

.hub-topic-section-title,
.hub-topic-resource-title {
  font-size: 0.98rem;
  font-weight: 500;
  line-height: 1.35;
}

.hub-topic-section-parent,
.hub-topic-resource-description {
  color: var(--hub-faint);
  font-size: 0.8rem;
  line-height: 1.4;
}

.hub-topic-row-arrow {
  color: var(--hub-faint);
  font-size: 0.9rem;
}

.hub-topic-practice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hub-topic-practice-group {
  min-width: 0;
  padding: 0 2.8rem;
}

.hub-topic-practice-group:first-child {
  padding-left: 0;
}

.hub-topic-practice-group + .hub-topic-practice-group {
  border-left: 1px solid var(--hub-rule);
}

.hub-topic-practice-group:last-child {
  padding-right: 0;
}

.hub-topic-practice-group h3 {
  margin: 0 0 0.6rem;
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
  font-weight: 600;
}

.hub-topic-practice-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-topic-practice-list a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  padding: 0.9rem 0;
  border-top: 1px solid var(--hub-rule-light);
  color: var(--hub-ink);
  font-size: 0.94rem;
  text-decoration: none;
}

.hub-topic-practice-list li:first-child a {
  border-top: 0;
}

.hub-topic-practice-list a:hover > span:first-child {
  color: var(--hub-blue);
}

.hub-topic-practice-status {
  color: var(--hub-faint);
  font-size: 0.8rem;
  white-space: nowrap;
}

.hub-topic-resource-list a {
  grid-template-columns: 8rem minmax(0, 1fr) auto;
}

.hub-topic-resource-kind {
  color: var(--hub-faint);
  font-size: 0.8rem;
}

.hub-topic-empty {
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.92rem;
}

.note-context-action {
  display: flex;
  justify-content: flex-end;
  margin: 0.7rem 0 1.25rem;
}

.note-context-action details {
  text-align: right;
}

.note-context-action summary {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
}

.note-context-action summary:hover {
  color: var(--hub-blue-strong);
}

.note-context-options {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.4rem 1rem;
  margin-top: 0.5rem;
}

.note-context-action a {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.8rem;
  font-weight: 500;
  text-decoration: none;
}

.note-context-action a::after {
  content: " →";
}

.note-context-action a:hover {
  color: var(--hub-blue-strong);
  text-decoration: underline;
}

.hub-module-page {
  min-height: 100vh;
  background: var(--page-bg);
  color: var(--hub-ink);
}

.hub-module-page .site-topbar {
  background: color-mix(in srgb, var(--page-bg) 96%, transparent);
}

.hub-module-page .hub-primary-nav {
  margin-left: auto;
}

.hub-module-shell {
  width: min(100% - 3rem, 1080px);
  margin: 0 auto;
  padding: 3.4rem 0 5rem;
}

.hub-page-context {
  margin: 0 0 1.25rem;
  color: var(--hub-soft-ink);
  font-family: var(--font-display);
  font-size: 0.84rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.hub-syllabus-shell {
  width: min(100% - 3rem, 1160px);
  margin: 0 auto;
  padding: 3.6rem 0 6rem;
}

.hub-syllabus-page .hub-generated-contents {
  display: contents;
}

.hub-syllabus-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 2.25rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-syllabus-header h1 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2.8rem, 5vw, 4.5rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
}

.hub-syllabus-header p {
  margin: 1rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.05rem;
}

.hub-syllabus-download {
  display: inline-flex;
  align-items: center;
  min-height: 2.7rem;
  border: 1px solid var(--hub-blue-muted);
  border-radius: 0.35rem;
  color: var(--hub-blue);
  padding: 0.65rem 0.95rem;
  font-family: var(--font-display);
  font-size: 0.88rem;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.hub-syllabus-download:hover {
  border-color: var(--hub-blue);
  background: var(--hub-blue-wash);
}

.hub-syllabus-layout {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  gap: clamp(3rem, 7vw, 6.5rem);
  align-items: start;
  padding-top: 3rem;
}

.hub-syllabus-section-nav {
  position: sticky;
  top: calc(var(--topbar-height) + 2rem);
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - var(--topbar-height) - 3rem);
  padding-left: 1rem;
  border-left: 1px solid var(--hub-rule);
  overflow: hidden;
}

.hub-syllabus-section-nav h2 {
  margin: 0 0 0.75rem;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 0.85rem;
  font-weight: 600;
}

.hub-syllabus-section-nav a {
  display: block;
  color: var(--hub-soft-ink);
  padding: 0.35rem 0;
  font-size: 0.84rem;
  line-height: 1.3;
  text-decoration: none;
}

.hub-syllabus-section-nav a:hover {
  color: var(--hub-blue);
}

.hub-syllabus-section-links {
  display: grid;
  gap: 0.1rem;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  margin: 0;
  padding: 0 0.35rem 0 0;
  list-style: none;
  align-content: start;
}

.hub-syllabus-subsection-links {
  margin: 0;
  padding: 0 0 0 0.9rem;
  list-style: none;
}

.hub-syllabus-subsection-links a {
  font-size: 0.8rem;
}

.hub-syllabus-content {
  min-width: 0;
  max-width: 50rem;
}

.hub-syllabus-section,
.hub-syllabus-item {
  scroll-margin-top: calc(var(--topbar-height) + 1.5rem);
}

.hub-syllabus-preamble + .hub-syllabus-section {
  margin-top: 3.2rem;
}

.hub-syllabus-section + .hub-syllabus-section {
  margin-top: 4rem;
  padding-top: 3.6rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-syllabus-section > h2 {
  margin: 0 0 1.5rem;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.hub-syllabus-section > p,
.hub-syllabus-prose p,
.hub-syllabus-item p {
  max-width: 46rem;
  margin: 0;
  color: var(--hub-ink);
  font-size: 1rem;
  line-height: 1.72;
}

.hub-syllabus-section > p + p,
.hub-syllabus-item p + p {
  margin-top: 1rem;
}

.hub-syllabus-content a:not(.hub-syllabus-download) {
  color: var(--hub-blue);
  text-underline-offset: 0.18em;
}

.hub-syllabus-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  border-top: 1px solid var(--hub-rule);
}

.hub-syllabus-facts > div {
  padding: 1rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-syllabus-facts > div:nth-child(odd) {
  padding-right: 2rem;
}

.hub-syllabus-facts > div:nth-child(even) {
  padding-left: 2rem;
  border-left: 1px solid var(--hub-rule-light);
}

.hub-syllabus-facts dt,
.hub-syllabus-facts dd {
  margin: 0;
}

.hub-syllabus-facts dt {
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-syllabus-facts dd {
  margin-top: 0.22rem;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 0.98rem;
  font-weight: 500;
}

.hub-syllabus-important-dates {
  margin-top: 2.8rem;
}

.hub-syllabus-section > .hub-syllabus-important-dates {
  margin-top: 0;
}

.hub-syllabus-important-dates h3,
.hub-syllabus-prose h3,
.hub-syllabus-item h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.hub-syllabus-important-dates > dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0.85rem 0 0;
  border-top: 1px solid var(--hub-rule);
}

.hub-syllabus-important-dates > dl > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  padding: 0.8rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-syllabus-important-dates > dl > div:nth-child(odd) {
  padding-right: 2rem;
}

.hub-syllabus-important-dates > dl > div:nth-child(even) {
  padding-left: 2rem;
  border-left: 1px solid var(--hub-rule-light);
}

.hub-syllabus-important-dates dt,
.hub-syllabus-important-dates dd {
  margin: 0;
  font-size: 0.9rem;
}

.hub-syllabus-important-dates dt {
  color: var(--hub-ink);
  font-weight: 500;
}

.hub-syllabus-important-dates dd {
  color: var(--hub-soft-ink);
  text-align: right;
}

.hub-syllabus-prose {
  margin-top: 3.2rem;
}

.hub-syllabus-prose h3:not(:first-child) {
  margin-top: 2.3rem;
}

.hub-syllabus-prose p {
  margin-top: 0.65rem;
}

.hub-syllabus-table-wrap {
  max-width: 100%;
  margin: 1.4rem 0 1.6rem;
  overflow-x: auto;
}

.hub-syllabus-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
  line-height: 1.45;
}

.hub-syllabus-table-wrap th,
.hub-syllabus-table-wrap td {
  border-bottom: 1px solid var(--hub-rule-light);
  padding: 0.8rem 0.75rem;
  text-align: left;
  vertical-align: top;
}

.hub-syllabus-table-wrap tr:first-child > * {
  border-top: 1px solid var(--hub-rule);
}

.hub-syllabus-grading-table th {
  width: 28%;
  color: var(--hub-ink);
  font-weight: 600;
}

.hub-syllabus-grading-table td:nth-child(2) {
  width: 25%;
  color: var(--hub-ink);
  white-space: nowrap;
}

.hub-syllabus-grading-table td:last-child {
  color: var(--hub-soft-ink);
}

.note-syllabus-content .hub-syllabus-grading-table td:nth-child(2) {
  white-space: normal;
}

.hub-syllabus-item + .hub-syllabus-item {
  margin-top: 2.4rem;
  padding-top: 2.2rem;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-syllabus-item p {
  margin-top: 0.65rem;
}

.hub-syllabus-schedule thead th {
  border-top: 1px solid var(--hub-rule);
  color: var(--hub-faint);
  font-size: 0.76rem;
  font-weight: 500;
}

.hub-syllabus-schedule thead th:first-child,
.hub-syllabus-schedule tbody th {
  width: 4.5rem;
}

.hub-syllabus-schedule thead th:nth-child(2),
.hub-syllabus-schedule tbody td:first-of-type {
  width: 6.5rem;
  white-space: nowrap;
}

.hub-syllabus-schedule tbody th {
  color: var(--hub-soft-ink);
  font-weight: 500;
}

.hub-syllabus-schedule tbody tr:nth-child(odd):not(.hub-syllabus-no-class):not(.hub-syllabus-final) {
  background: var(--hub-wash);
}

.hub-syllabus-no-class td {
  color: var(--hub-soft-ink);
}

.hub-syllabus-final > * {
  border-top: 1px solid var(--hub-blue-muted);
  color: var(--hub-blue-strong);
  font-weight: 600;
}

@media (max-width: 860px) {
  .hub-syllabus-header {
    padding-bottom: 1.25rem;
    border-bottom: 0;
  }

  .hub-syllabus-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.5rem;
    padding-top: 0;
  }

  .hub-syllabus-section-nav {
    position: static;
    flex-direction: row;
    gap: 1rem;
    max-height: none;
    overflow: visible;
    padding: 0.8rem 0;
    border-top: 1px solid var(--hub-rule);
    border-bottom: 1px solid var(--hub-rule);
    border-left: 0;
    white-space: nowrap;
  }

  .hub-syllabus-section-nav h2 {
    margin: 0;
    padding: 0.35rem 0;
  }

  .hub-syllabus-section-links {
    max-height: 14rem;
    overflow-x: hidden;
    padding-right: 0;
    white-space: normal;
  }

  .hub-syllabus-content {
    max-width: none;
  }

  .hub-syllabus-preamble > .hub-syllabus-facts {
    border-top: 0;
  }
}

@media (max-width: 640px) {
  .hub-syllabus-shell {
    width: min(100% - 2rem, 1160px);
    padding-top: 2.5rem;
  }

  .hub-syllabus-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 1.4rem;
  }

  .hub-syllabus-header h1 {
    font-size: clamp(2.6rem, 14vw, 3.7rem);
  }

  .hub-syllabus-facts,
  .hub-syllabus-important-dates > dl {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-syllabus-facts > div:nth-child(odd),
  .hub-syllabus-facts > div:nth-child(even),
  .hub-syllabus-important-dates > dl > div:nth-child(odd),
  .hub-syllabus-important-dates > dl > div:nth-child(even) {
    padding-right: 0;
    padding-left: 0;
    border-left: 0;
  }

  .hub-syllabus-section + .hub-syllabus-section {
    margin-top: 3.3rem;
    padding-top: 3rem;
  }

  .hub-syllabus-table-wrap th,
  .hub-syllabus-table-wrap td {
    padding-right: 0.55rem;
    padding-left: 0.55rem;
  }

  .hub-syllabus-grading-table td:last-child {
    min-width: 10rem;
  }

  .hub-syllabus-schedule {
    table-layout: fixed;
    min-width: 0;
    font-size: 0.84rem;
  }

  .hub-syllabus-schedule thead th:first-child,
  .hub-syllabus-schedule tbody th {
    width: 2.8rem;
  }

  .hub-syllabus-schedule thead th:nth-child(2),
  .hub-syllabus-schedule tbody td:first-of-type {
    width: 4.6rem;
    white-space: nowrap;
  }

  .hub-syllabus-schedule th,
  .hub-syllabus-schedule td {
    padding-right: 0.35rem;
    padding-left: 0.35rem;
  }
}

.hub-practice-home {
  max-width: 62rem;
}

.hub-practice-home-header {
  max-width: 43rem;
}

.hub-practice-home-header h1 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2.7rem, 5vw, 4.4rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
}

.hub-practice-home-header > p:last-child {
  margin: 1.25rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.08rem;
  line-height: 1.6;
}

.hub-practice-index-section {
  margin-top: 4.25rem;
}

.hub-practice-index-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr));
  gap: 3rem;
  margin-top: 3rem;
}

.hub-practice-index-grid > .hub-practice-index-section {
  min-width: 0;
  margin-top: 0;
}

.hub-practice-index-grid .hub-practice-index-heading,
.hub-practice-index-grid .hub-practice-question-list > li {
  grid-template-columns: minmax(0, 1fr);
  gap: 0.35rem;
}

.hub-practice-index-grid h3 {
  overflow-wrap: anywhere;
}

.hub-practice-index-heading {
  display: grid;
  grid-template-columns: minmax(12rem, 0.7fr) minmax(18rem, 1.3fr);
  gap: 2rem;
  align-items: baseline;
  margin-bottom: 0.5rem;
}

.hub-practice-index-heading h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: -0.02em;
}

.hub-practice-index-heading p {
  margin: 0;
  color: var(--hub-soft-ink);
  font-size: 0.94rem;
  line-height: 1.5;
}

.hub-practice-index-list,
.hub-practice-secondary-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-practice-index-list > li {
  display: grid;
  grid-template-columns: minmax(12rem, 0.7fr) minmax(18rem, 1.3fr);
  gap: 2rem;
  align-items: center;
  padding: 1.55rem 0;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-practice-index-list h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 500;
}

.hub-practice-index-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}

.hub-practice-index-links a {
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-practice-index-links a:hover > span:first-child {
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.hub-practice-index-links small {
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-practice-secondary-list > li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: center;
  padding: 1.45rem 0;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-practice-secondary-list h3 {
  margin: 0;
  color: var(--hub-ink);
  font-size: 1rem;
  font-weight: 500;
}

.hub-practice-secondary-list p {
  margin: 0.35rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  line-height: 1.45;
}

.hub-practice-secondary-list > li > span {
  color: var(--hub-faint);
  font-size: 0.8rem;
}

.hub-practice-question-list h3 a {
  color: var(--hub-blue);
  text-decoration: none;
  line-height: 1.5;
}

.hub-practice-question-list h3 a:hover {
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.hub-practice-question-list > li > span {
  white-space: nowrap;
}

.hub-practice-question-list > li > .is-complete {
  color: var(--hub-success);
}

.hub-practice-index-link:not([hidden]) {
  display: inline-block;
  margin-bottom: 1.5rem;
  color: var(--hub-blue);
  font-size: 0.9rem;
}

.hub-topic-practice-empty {
  margin: 2rem 0 0;
  color: var(--hub-soft-ink);
}

.hub-problem-set-shell {
  width: min(100% - 3rem, 1080px);
  margin: 0 auto;
  padding: 3.4rem 0 5rem;
}

.hub-problem-set-home {
  max-width: 62rem;
}

.hub-problem-set-index-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-problem-set-index-list > li {
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-index-summary h3 {
  margin: 0;
}

.hub-problem-set-index-summary .hub-problem-set-date {
  margin: 0.38rem 0 0;
}

.hub-problem-set-index-summary > p:last-child:not(.hub-problem-set-date):not(.hub-problem-set-release-date) {
  margin: 0.35rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  line-height: 1.45;
}

.hub-problem-set-release-date {
  margin: 0.25rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
  line-height: 1.4;
}

.hub-problem-set-index-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  align-items: center;
}

.hub-problem-set-index-status .hub-problem-set-status {
  font-size: 0.68rem;
}

.hub-problem-set-workspace {
  max-width: 62rem;
}

.hub-problem-set-back {
  display: inline-block;
  margin-bottom: 1.75rem;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  text-decoration: none;
}

.hub-problem-set-back:hover {
  color: var(--hub-blue);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.hub-problem-set-task-header {
  padding-bottom: 1.8rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-task-header .hub-page-context {
  margin-bottom: 0.8rem;
}

.hub-problem-set-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: start;
}

.hub-problem-set-question-content {
  max-width: 60rem;
  margin-top: 2.4rem;
  color: var(--hub-ink);
  font-size: 1rem;
  line-height: 1.65;
}

.hub-problem-set-question-content > p:first-child {
  color: var(--hub-soft-ink);
  font-size: 1.04rem;
}

.hub-problem-set-question-content h2 {
  margin: 3rem 0 1rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--hub-rule);
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: -0.02em;
}

.hub-problem-set-question-content h3 {
  margin: 2rem 0 0.75rem;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 600;
}

.hub-problem-set-question-content p {
  margin: 0.8rem 0;
}

.hub-problem-set-question-content ol,
.hub-problem-set-question-content ul {
  padding-left: 1.65rem;
}

.hub-problem-set-question-content li + li {
  margin-top: 0.85rem;
}

.hub-problem-set-question-content a {
  color: var(--hub-blue);
}

.hub-problem-set-question-content a[href*="/readings/"] {
  display: inline-flex;
  align-items: center;
  margin-top: 0.15rem;
  padding: 0.35rem 0.6rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.35rem;
  background: var(--hub-paper);
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none;
}

.hub-problem-set-question-content a[href*="/readings/"]:hover {
  border-color: var(--hub-blue);
  background: var(--hub-blue-soft);
}

.hub-problem-set-question-content img,
.hub-problem-set-question-content svg {
  max-width: 100%;
  height: auto;
}

.hub-problem-set-content-unavailable {
  padding: 2rem 0;
  border-block: 1px solid var(--hub-rule-light);
}

.hub-problem-set-content-unavailable h2,
.hub-problem-set-content-unavailable p {
  margin: 0;
}

.hub-problem-set-content-unavailable h2 {
  padding: 0;
  border: 0;
  color: var(--hub-ink);
  font-size: 1.25rem;
}

.hub-problem-set-content-unavailable p {
  margin-top: 0.5rem;
  color: var(--hub-soft-ink);
}

.hub-problem-set-submission {
  max-width: 60rem;
  margin-top: 4rem;
  padding-top: 2rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-problem-set-submission > header h2 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.65rem;
  font-weight: 500;
}

.hub-problem-set-submission > header > p:last-child {
  max-width: 46rem;
  margin: 0.65rem 0 0;
  color: var(--hub-soft-ink);
  line-height: 1.55;
}

.hub-problem-set-work-upload {
  margin-top: 1.5rem;
}

.hub-problem-set-upload-zone {
  min-height: 14rem;
}

.hub-problem-set-submission-status {
  max-width: 60rem;
}

.hub-problem-set-status-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.hub-problem-set-submission-status > p {
  max-width: 46rem;
  color: var(--hub-soft-ink);
}

.hub-problem-set-submission-meta {
  font-size: 0.82rem;
}

.hub-problem-set-student-feedback {
  margin-top: 1.5rem;
}

.hub-problem-set-student-feedback h3 {
  margin: 0;
  font-size: 1.05rem;
}

.hub-problem-set-student-feedback > p {
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
}

.hub-problem-set-student-feedback ul {
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

.hub-problem-set-student-feedback li {
  padding: 0.9rem 0;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-problem-set-student-feedback li span {
  margin-left: 0.5rem;
  color: var(--hub-soft-ink);
}

.hub-problem-set-student-feedback li p {
  margin: 0.4rem 0 0;
  line-height: 1.55;
}

.hub-solution-release-shell {
  width: min(100% - 3rem, 880px);
  margin: 0 auto;
  padding: 2.5rem 0 5rem;
}

.hub-solution-release-back {
  display: inline-block;
  margin-bottom: 1.5rem;
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
  text-decoration: none;
}

.hub-solution-release-back:hover {
  color: var(--hub-blue-strong);
  text-decoration: underline;
}

.hub-solution-release-content {
  max-width: 46rem;
}

.hub-solution-release-content > h1 {
  margin: 0 0 1.25rem;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 1.05;
}

.hub-solution-release-content > h2 {
  margin: 2.8rem 0 0.9rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--hub-rule);
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
  letter-spacing: -0.02em;
}

.hub-solution-release-content > p {
  color: var(--hub-soft-ink);
}

.hub-solution-release-content .solution {
  color: var(--hub-ink);
}

.hub-solution-release-content .solution > p:first-child strong:first-child {
  color: var(--hub-blue-strong);
  font-family: var(--font-display);
  font-weight: 600;
}

.hub-solution-release-content ol,
.hub-solution-release-content ul {
  padding-left: 1.6rem;
}

.hub-problem-set-page-header {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(16rem, 0.7fr);
  gap: clamp(2rem, 7vw, 6rem);
  align-items: end;
  padding-bottom: 2.2rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-page-header h1 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2.7rem, 5vw, 4.4rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
}

.hub-problem-set-page-header > div > p:last-child {
  max-width: 43rem;
  margin: 1.25rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.08rem;
  line-height: 1.6;
}

.hub-problem-set-page-header aside {
  padding-left: 1.25rem;
  border-left: 2px solid var(--hub-blue-muted);
}

.hub-problem-set-page-header aside strong {
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 600;
}

.hub-problem-set-page-header aside p {
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.87rem;
  line-height: 1.55;
}

.hub-problem-set-list {
  display: grid;
}

.hub-problem-set-card {
  padding: 2.4rem 0;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-card > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: start;
}

.hub-problem-set-date {
  margin: 0 0 0.4rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
}

.hub-problem-set-card h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: clamp(1.55rem, 3vw, 2rem);
  font-weight: 500;
  letter-spacing: -0.025em;
}

.hub-problem-set-card > header > div > p:last-child {
  max-width: 46rem;
  margin: 0.7rem 0 0;
  color: var(--hub-soft-ink);
  line-height: 1.55;
}

.hub-problem-set-credit {
  display: grid;
  min-width: 8rem;
  text-align: right;
}

.hub-problem-set-credit strong {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.65rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.hub-problem-set-credit span {
  color: var(--hub-faint);
  font-size: 0.74rem;
}

.hub-problem-set-requirements {
  display: grid;
  grid-template-columns: 9rem minmax(0, 1fr);
  gap: 1.5rem;
  margin-top: 1.6rem;
  padding: 1rem 0;
  border-block: 1px solid var(--hub-rule-light);
}

.hub-problem-set-requirements h3,
.hub-problem-set-requirements p {
  margin: 0;
}

.hub-problem-set-requirements h3 {
  color: var(--hub-ink);
  font-size: 0.85rem;
  font-weight: 600;
}

.hub-problem-set-requirements p {
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
}

.hub-problem-set-current {
  margin-top: 1.2rem;
  padding: 1rem 1.1rem;
  border-left: 3px solid var(--hub-rule);
  background: var(--hub-wash);
}

.hub-problem-set-current.is-complete {
  border-color: #2f7c4c;
  background: rgb(47 124 76 / 7%);
}

.hub-problem-set-current.is-review,
.hub-problem-set-current.is-pending {
  border-color: var(--hub-blue-muted);
  background: var(--hub-blue-wash);
}

.hub-problem-set-current.is-incomplete {
  border-color: #a65a43;
  background: #fff8f4;
}

.hub-problem-set-current > div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
}

.hub-problem-set-current small,
.hub-problem-set-current > p,
.hub-problem-set-form-message,
.hub-problem-set-closed {
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
}

.hub-problem-set-solutions {
  margin: 1rem 0 0;
  padding-left: 1.1rem;
}

.hub-problem-set-questions {
  margin: 1rem 0 0;
  padding-left: 1.1rem;
}

.hub-problem-set-questions a {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 500;
  text-decoration: none;
}

.hub-problem-set-questions a:hover {
  color: var(--hub-blue-strong);
  text-decoration: underline;
}

.hub-problem-set-solutions a {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 500;
  text-decoration: none;
}

.hub-problem-set-solutions a:hover {
  color: var(--hub-blue-strong);
  text-decoration: underline;
}

.hub-problem-set-release-list {
  display: grid;
  gap: 1rem;
}

.hub-problem-set-release-item {
  padding: 1rem 1.1rem;
  border: 1px solid var(--hub-rule-light);
  background: var(--hub-wash);
}

.hub-problem-set-release-item h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 500;
}

.hub-problem-set-release-item .hub-problem-set-release-date {
  margin-top: 0.35rem;
}

.hub-problem-set-release-item .hub-problem-set-solutions {
  margin-bottom: 0;
}

.hub-problem-set-current > p {
  margin: 0.55rem 0 0;
  line-height: 1.5;
}

.hub-problem-set-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.24rem 0.52rem;
  border: 1px solid var(--hub-rule);
  border-radius: 999px;
  color: var(--hub-soft-ink);
  font-size: 0.73rem;
  font-weight: 600;
  white-space: nowrap;
}

.hub-problem-set-status.is-complete {
  border-color: rgb(47 124 76 / 35%);
  color: #245e3a;
}

.hub-problem-set-status.is-review,
.hub-problem-set-status.is-pending {
  border-color: var(--hub-blue-muted);
  color: var(--hub-blue-strong);
}

.hub-problem-set-status.is-incomplete {
  border-color: rgb(166 90 67 / 38%);
  color: #7a3f2e;
}

.hub-problem-set-evaluation-summary,
.hub-problem-set-review-note {
  padding-top: 0.55rem;
  border-top: 1px solid rgb(108 115 122 / 16%);
}

.hub-problem-set-upload {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.85rem 1rem;
  align-items: end;
  margin-top: 1.2rem;
}

.hub-problem-set-upload label {
  display: grid;
  gap: 0.4rem;
}

.hub-problem-set-upload label > span,
.hub-problem-set-review-actions label > span {
  color: var(--hub-ink);
  font-size: 0.82rem;
  font-weight: 600;
}

.hub-problem-set-upload input[type="file"] {
  min-height: 2.8rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.4rem;
  background: #fff;
  color: var(--hub-soft-ink);
  font: inherit;
}

.hub-problem-set-upload small {
  color: var(--hub-faint);
  font-size: 0.75rem;
}

.hub-problem-set-form-message {
  grid-column: 1 / -1;
  min-height: 1.2rem;
  margin: 0;
}

.hub-problem-set-results,
.hub-problem-set-history {
  margin-top: 0.9rem;
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
}

.hub-problem-set-results summary,
.hub-problem-set-history summary {
  color: var(--hub-blue);
  cursor: pointer;
}

.hub-problem-set-results ul,
.hub-problem-set-review-results {
  display: grid;
  gap: 0;
  margin: 0.7rem 0 0;
  padding: 0;
  list-style: none;
}

.hub-problem-set-results li,
.hub-problem-set-review-results li {
  display: grid;
  grid-template-columns: minmax(5rem, 0.35fr) minmax(7rem, 0.4fr) minmax(0, 1fr);
  gap: 1rem;
  padding: 0.6rem 0;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-problem-set-results li strong,
.hub-problem-set-review-results li strong {
  font-size: 0.78rem;
  font-weight: 500;
}

.hub-problem-set-results li small,
.hub-problem-set-review-results li small {
  color: var(--hub-soft-ink);
}

.hub-problem-set-results .is-clear_attempt,
.hub-problem-set-review-results .is-clear_attempt {
  color: #245e3a;
}

.hub-problem-set-results .is-missing,
.hub-problem-set-review-results .is-missing {
  color: #7a3f2e;
}

.hub-problem-set-results .is-uncertain,
.hub-problem-set-review-results .is-uncertain {
  color: var(--hub-blue-strong);
}

.hub-problem-set-history ol {
  margin: 0.7rem 0 0;
  padding: 0;
  list-style: none;
}

.hub-problem-set-history li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 1rem;
  align-items: center;
  padding: 0.65rem 0;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-problem-set-history li > span:first-child {
  display: grid;
}

.hub-problem-set-history a,
.hub-problem-set-review-actions a {
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-problem-set-history a:hover,
.hub-problem-set-review-actions a:hover {
  text-decoration: underline;
}

.hub-problem-set-empty {
  padding: 4rem 0;
}

.hub-problem-set-empty h2 {
  margin: 0;
  color: var(--hub-ink);
  font-size: 1.4rem;
  font-weight: 500;
}

.hub-problem-set-empty p,
.hub-problem-set-empty-copy {
  color: var(--hub-soft-ink);
}

.hub-problem-set-instructor-section {
  padding-top: 3.2rem;
}

.hub-problem-set-summary-list {
  display: grid;
}

.hub-problem-set-summary-item {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) auto;
  gap: 2rem;
  align-items: center;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-summary-item h3,
.hub-problem-set-summary-item p,
.hub-problem-set-summary-item dl,
.hub-problem-set-summary-item dd,
.hub-problem-set-summary-item dt {
  margin: 0;
}

.hub-problem-set-summary-item h3 {
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 600;
}

.hub-problem-set-summary-item p {
  margin-top: 0.3rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
}

.hub-problem-set-summary-item dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(5.5rem, auto));
  gap: clamp(1rem, 3vw, 2.4rem);
}

.hub-problem-set-summary-item dl > div {
  display: grid;
  gap: 0.18rem;
  text-align: right;
}

.hub-problem-set-summary-item dd {
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.hub-problem-set-summary-item dt {
  color: var(--hub-faint);
  font-size: 0.72rem;
  white-space: nowrap;
}

.hub-problem-set-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.75fr);
  gap: 2rem;
  align-items: end;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-section-heading h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.65rem;
  font-weight: 500;
}

.hub-problem-set-section-heading .hub-page-context {
  margin-bottom: 0.4rem;
}

.hub-problem-set-section-heading > p {
  margin: 0;
  color: var(--hub-soft-ink);
  font-size: 0.86rem;
  line-height: 1.5;
  text-align: right;
}

.hub-review-shell > section {
  margin-block: 0;
  padding-top: 2.25rem;
}

.hub-review-shell .hub-problem-set-section-heading > div > p {
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.86rem;
}

.hub-problem-set-review-group {
  padding-top: 1.6rem;
}

.hub-problem-set-review-group > h3 {
  margin: 0 0 0.4rem;
  color: var(--hub-blue);
  font-size: 1rem;
  font-weight: 500;
}

.hub-problem-set-review-item {
  padding: 1.2rem 0 1.6rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-problem-set-review-item > header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}

.hub-problem-set-review-item h3,
.hub-problem-set-review-item p {
  margin: 0;
}

.hub-problem-set-review-item h3 {
  color: var(--hub-ink);
  font-size: 1rem;
  font-weight: 600;
}

.hub-problem-set-review-item header p,
.hub-problem-set-review-item > p {
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
}

.hub-problem-set-review-item > p {
  margin-top: 0.6rem;
}

.hub-problem-set-review-actions {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) auto auto;
  gap: 0.75rem;
  align-items: end;
  margin-top: 1rem;
}

.hub-problem-set-review-item fieldset {
  min-width: 0;
  margin-block: 1rem;
}

.hub-problem-set-review-item .hub-lecture-review-part p {
  overflow-wrap: anywhere;
}

.hub-problem-set-review-item input[type="checkbox"] {
  min-width: 20px;
  min-height: 20px;
}

.hub-problem-set-review-actions label {
  display: grid;
  gap: 0.35rem;
}

.hub-problem-set-review-actions input {
  width: 100%;
  min-width: 0;
  padding: 0.62rem 0.7rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.4rem;
  background: #fff;
  color: var(--hub-ink);
  font: inherit;
}

.hub-task-header {
  margin-bottom: 1.75rem;
}

.hub-question-position {
  margin: 0 0 0.85rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.hub-task-title {
  max-width: 62rem;
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

.hub-task-prompt {
  max-width: 60rem;
  margin: 1rem 0 0;
  color: #27313a;
  font-size: 1.17rem;
  line-height: 1.62;
}

.hub-rendered-question {
  max-width: 62rem;
  margin: 1.6rem 0 0;
}

.hub-rendered-question img {
  display: block;
  width: 100%;
  height: auto;
}

.hub-practice-navigation {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  max-width: 62rem;
  margin-top: 0;
  padding-top: 0.8rem;
  border-top: 1px solid var(--hub-rule-light);
  font-size: 0.84rem;
}

.hub-practice-navigation a {
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-practice-navigation a:last-child {
  text-align: right;
}

.hub-practice-navigation span {
  color: var(--hub-faint);
}

.hub-practice-footer {
  max-width: 62rem;
  margin-top: 2.75rem;
}

.hub-context-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1.15rem;
  margin-top: 1rem;
  font-size: 0.9rem;
}

.hub-context-links a {
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-context-links a:hover {
  text-decoration: underline;
}

.hub-upload-form {
  display: grid;
  gap: 1rem;
}

.hub-choice-response {
  display: grid;
  max-width: 60rem;
  gap: 0.8rem;
}

.hub-choice-response .hub-choice-list {
  gap: 0.45rem;
  border-top: 0;
}

.hub-choice-response .hub-choice {
  min-height: 0;
  grid-template-columns: 1.3rem minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0.72rem 0.85rem;
  border: 1px solid rgba(108, 115, 122, 0.24);
  border-radius: 0.72rem;
  background: rgba(255, 255, 255, 0.72);
  transition:
    background-color 150ms ease,
    color 150ms ease,
    border-color 150ms ease,
    transform 150ms ease,
    box-shadow 150ms ease;
}

.hub-choice-response .hub-choice:hover {
  border-color: rgba(40, 94, 130, 0.24);
  background: rgba(40, 94, 130, 0.05);
  box-shadow: 0 8px 20px rgba(40, 94, 130, 0.06);
  transform: translateX(2px);
}

.hub-choice-response.is-answered .hub-choice {
  cursor: default;
}

.hub-choice-response.is-answered .hub-choice:hover {
  box-shadow: none;
  transform: none;
}

.hub-choice-response .hub-choice.is-correct-response {
  border-color: rgba(63, 118, 80, 0.32);
  background: rgba(63, 118, 80, 0.08);
  color: var(--hub-success);
}

.hub-choice-response .hub-choice.is-incorrect-response {
  border-color: rgba(170, 109, 32, 0.3);
  background: rgba(170, 109, 32, 0.08);
  color: var(--hub-warning);
}

.hub-choice-feedback {
  margin-top: 0.2rem;
}

.hub-choice-feedback [data-choice-feedback-body] p {
  margin: 0;
}

.hub-choice-save-status {
  margin: 0.55rem 0 0;
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-choice-feedback .hub-text-button {
  margin-top: 0.65rem;
  padding: 0;
}

.hub-multipart-response {
  display: grid;
  gap: 1.4rem;
}

.hub-multipart-intro {
  max-width: 60rem;
  padding-bottom: 1.1rem;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-multipart-intro h2 {
  margin: 0;
  color: var(--heading-ink, #24455e);
  font-size: 1.4rem;
  font-weight: 500;
}

.hub-multipart-intro p {
  margin: 0.55rem 0 0;
  color: var(--hub-soft-ink);
}

.hub-part-response-list {
  display: grid;
  max-width: 60rem;
}

.hub-part-response {
  padding: 1.4rem 0 1.65rem;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-part-response:first-child {
  padding-top: 0;
}

.hub-part-response-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}

.hub-part-response-header h3 {
  margin: 0;
  color: var(--hub-ink);
  font-size: 1.12rem;
  font-weight: 600;
}

.hub-part-response-status {
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.8rem;
}

.hub-part-response-prompt {
  margin: 0.65rem 0 0;
  color: var(--hub-ink);
}

.hub-part-dependency {
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
}

.hub-part-upload-zone {
  min-height: 10rem;
  margin-top: 1rem;
}

.hub-part-response-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.55rem;
}

.hub-part-response.is-skipped .hub-part-upload-zone {
  min-height: 6rem;
  background: #f7f7f5;
  opacity: 0.68;
}

.hub-multipart-actions {
  max-width: 60rem;
  margin-top: 0;
}

.hub-upload-zone {
  display: grid;
  min-height: 16rem;
  place-items: center;
  border: 1px solid #aeb7be;
  background: #fff;
  cursor: pointer;
  text-align: center;
  transition: border-color 150ms ease, background-color 150ms ease;
}

.hub-upload-zone:hover,
.hub-upload-zone.is-dragging {
  border-color: var(--hub-blue);
  background: var(--hub-blue-wash);
}

.hub-upload-zone:focus-within {
  border-color: var(--hub-blue);
  background: var(--hub-blue-wash);
  outline: 2px solid var(--hub-blue);
  outline-offset: 3px;
}

.hub-upload-zone:hover .hub-upload-mark,
.hub-upload-zone.is-dragging .hub-upload-mark,
.hub-upload-zone:focus-within .hub-upload-mark {
  border-color: var(--hub-blue);
  color: var(--hub-blue);
}

.hub-upload-input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.hub-upload-copy {
  display: grid;
  justify-items: center;
  gap: 0.75rem;
  color: var(--hub-ink);
}

.hub-upload-mark {
  display: grid;
  width: 2.7rem;
  height: 2.7rem;
  place-items: center;
  border: 1px solid var(--hub-soft-ink);
  border-radius: 50%;
  color: var(--hub-soft-ink);
  font-size: 1.45rem;
  line-height: 1;
}

.hub-upload-copy p {
  margin: 0;
}

.hub-upload-copy strong {
  color: var(--hub-blue);
  font-weight: 500;
}

.hub-upload-help {
  color: var(--hub-faint);
  font-size: 0.84rem;
}

.hub-upload-selection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 2.6rem;
  padding: 0.2rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-selected-file {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  color: var(--hub-ink);
}

.hub-file-mark {
  color: var(--hub-soft-ink);
  font-size: 1.25rem;
}

.hub-file-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-text-button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--hub-blue);
  font: inherit;
  font-size: 0.9rem;
  cursor: pointer;
}

.hub-text-button:hover {
  text-decoration: underline;
}

.hub-form-actions {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  margin-top: 0.25rem;
}

.hub-primary-button {
  appearance: none;
  min-height: 2.9rem;
  border: 1px solid var(--hub-blue-strong);
  border-radius: 3px;
  background: var(--hub-blue-strong);
  color: #fff;
  padding: 0.7rem 1.25rem;
  font: 500 0.95rem/1 var(--font-display);
  cursor: pointer;
}

.hub-primary-button:hover:not(:disabled) {
  background: var(--hub-blue);
}

.hub-primary-button:disabled {
  border-color: #c8cdd1;
  background: #c8cdd1;
  cursor: not-allowed;
}

.hub-action-note {
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.82rem;
}

.hub-feedback {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-feedback h2,
.hub-solution h3 {
  margin: 0;
  color: var(--hub-ink);
  font-weight: 500;
}

.hub-feedback h2 {
  color: var(--hub-blue);
  font-size: 1.65rem;
}

.hub-feedback-body {
  max-width: 60rem;
  margin-top: 1.15rem;
}

.hub-feedback-body p {
  margin: 0 0 0.8rem;
}

.hub-feedback-body strong {
  font-weight: 600;
}

.hub-feedback-status {
  color: var(--hub-blue);
  font-size: 0.9rem;
  font-weight: 500;
}

.hub-feedback-score {
  margin: 0 0 0.35rem;
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 500;
  letter-spacing: -0.03em;
}

.hub-feedback-meta {
  margin: 1rem 0 0;
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-feedback-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
}

.hub-part-feedback-list {
  display: grid;
  max-width: 60rem;
  margin-top: 1.35rem;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-part-feedback {
  padding: 1.15rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-part-feedback h3 {
  margin: 0;
  color: var(--hub-ink);
  font-size: 1rem;
  font-weight: 600;
}

.hub-part-feedback p {
  margin: 0.5rem 0 0;
}

.hub-solution {
  max-width: 60rem;
  margin-top: 1.4rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-solution h3 {
  font-size: 1.15rem;
}

.hub-solution p {
  margin: 0.65rem 0 0;
}

.hub-solution img {
  display: block;
  width: 100%;
  height: auto;
  margin-top: 1rem;
}

.hub-solution-page {
  display: block;
  margin-bottom: 1.5rem;
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-solution-page span {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.85rem;
  text-align: right;
}

.hub-solution-page:hover span {
  text-decoration: underline;
}

.hub-solution-transcript summary {
  margin: 1.5rem 0 0.75rem;
  color: var(--hub-blue);
  cursor: pointer;
}

.hub-solution-part + .hub-solution-part {
  margin-top: 1.1rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-solution-part h4 {
  margin: 0;
  color: var(--hub-ink);
  font-size: 0.98rem;
  font-weight: 600;
}

.hub-solution-part p {
  white-space: pre-line;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.hub-ask-subnav {
  border-bottom: 1px solid var(--hub-rule);
  background: #fafafa;
}

.hub-ask-tabs {
  display: flex;
  width: min(100% - 3rem, 1080px);
  margin: 0 auto;
  gap: 1.5rem;
}

.hub-ask-tab {
  position: relative;
  padding: 0.9rem 0 0.8rem;
  color: var(--hub-soft-ink);
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 500;
  text-decoration: none;
}

.hub-ask-tab:hover,
.hub-ask-tab.is-active {
  color: var(--hub-blue);
}

.hub-ask-tab.is-active::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: var(--hub-blue);
  content: "";
}

.hub-question-index {
  width: min(100% - 3rem, 1080px);
  margin: 0 auto;
  padding: 2.4rem 0 5rem;
  scroll-margin-top: calc(var(--topbar-height) + 1rem);
}

.hub-question-index-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.hub-question-index-header > div:first-child {
  flex: 1 1 24rem;
  min-width: 0;
}

.hub-question-index-header h1 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2rem, 3vw, 2.6rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.15;
}

.hub-question-privacy {
  max-width: 42rem;
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  line-height: 1.45;
}

.hub-question-new { flex: none; }
.hub-question-index-actions { display: flex; flex: none; align-items: center; gap: 1.2rem; }
.hub-question-faq-link {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.9rem;
  text-decoration: none;
  white-space: nowrap;
}
.hub-question-faq-link:hover { text-decoration: underline; text-underline-offset: 0.18em; }

.hub-question-toolbar {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.2rem;
  margin-top: 2rem;
}
.hub-question-search {
  display: flex;
  flex: 1;
  align-items: center;
  min-width: 0;
  gap: 0.6rem;
  border-bottom: 1px solid var(--hub-rule);
  color: var(--hub-soft-ink);
}
.hub-question-search input {
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  border: 0;
  background: transparent;
  padding: 0.55rem 0;
  color: var(--hub-ink);
  font: 1rem/1.4 var(--font-body);
}
.hub-question-search input::placeholder { color: var(--hub-soft-ink); }
.hub-question-filter-button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: none;
  border: 1px solid var(--hub-rule);
  border-radius: 4px;
  background: #fff;
  padding: 0.55rem 0.85rem;
  color: var(--hub-ink);
  font: 0.92rem/1.4 var(--font-body);
  cursor: pointer;
}
.hub-question-filter-button[aria-expanded="true"] { border-color: var(--hub-blue); background: var(--hub-blue-wash); }
.hub-question-filter-panel {
  position: absolute;
  top: calc(100% + 0.6rem);
  right: 0;
  z-index: 20;
  width: min(22rem, 100%);
  padding: 1.2rem;
  border: 1px solid var(--hub-rule);
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 10px 30px rgb(26 50 65 / 12%);
}
.hub-question-filter-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.hub-question-filter-panel fieldset { margin: 1.1rem 0 0; padding: 0.65rem 0 0; border: 0; border-top: 1px solid var(--hub-rule); }
.hub-question-filter-panel legend { padding: 0 0.5rem 0 0; font-size: 0.85rem; font-weight: 600; }
.hub-question-filter-panel label { display: flex; align-items: center; gap: 0.6rem; padding: 0.4rem 0; font-size: 0.9rem; cursor: pointer; }
.hub-question-filter-panel input[type="checkbox"] { width: 1rem; height: 1rem; margin: 0; accent-color: var(--hub-blue); flex: none; }
.hub-question-filter-panel input[type="search"] { width: 100%; margin: 0.2rem 0 0.5rem; padding: 0.5rem; border: 1px solid var(--hub-rule); border-radius: 3px; font: 1rem var(--font-body); }
.hub-question-topic-options { max-height: 14rem; overflow-y: auto; }
.hub-question-views { display: flex; gap: 1.8rem; margin-top: 1.1rem; border-bottom: 1px solid var(--hub-rule); }
.hub-question-views button { border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--hub-soft-ink); padding: 0.75rem 0; font: 0.95rem var(--font-display); cursor: pointer; }
.hub-question-views button[aria-pressed="true"] { border-bottom-color: var(--hub-blue); color: var(--hub-blue); font-weight: 600; }
.hub-question-views span { margin-left: 0.3rem; color: var(--hub-soft-ink); font-size: 0.78rem; font-weight: 400; font-variant-numeric: tabular-nums; }
.hub-question-views span.is-attention { display: inline-block; min-width: 1.2rem; padding: 0.1rem 0.34rem; border-radius: 999px; background: var(--hub-blue); color: #fff; font-weight: 600; text-align: center; }
.hub-question-read-all { margin-left: auto; font-size: 0.82rem; }
.hub-question-filter-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 0.45rem; margin-top: 1rem; }
.hub-question-filter-chip { display: inline-flex; align-items: center; gap: 0.6rem; border: 0; border-radius: 3px; background: var(--hub-blue-wash); color: var(--hub-ink); padding: 0.3rem 0.6rem; font: 0.8rem var(--font-body); cursor: pointer; }
.hub-question-filter-chips .hub-text-button { font-size: 0.8rem; }
.hub-question-results-summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1rem; }
.hub-question-results-summary p { margin: 0; color: var(--hub-soft-ink); font-size: 0.82rem; }
.hub-question-sort select { max-width: 100%; border: 0; background: transparent; color: var(--hub-soft-ink); font: 0.82rem var(--font-body); padding: 0.4rem 0; cursor: pointer; }
.hub-question-index-list { margin: 0; padding: 0; list-style: none; }
.hub-question-index-link {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) 10rem;
  gap: 1.8rem;
  align-items: start;
  border-bottom: 1px solid var(--hub-rule-light);
  background: transparent;
  color: var(--hub-ink);
  padding: 1.4rem 0;
  text-align: left;
  text-decoration: none;
}
.hub-question-index-copy { position: relative; display: grid; min-width: 0; gap: 0.45rem; padding-left: 1rem; }
.hub-question-index-title { font-family: var(--font-display); font-size: 1.12rem; font-weight: 400; line-height: 1.4; overflow-wrap: anywhere; }
.hub-question-index-link.is-unread .hub-question-index-title { color: var(--hub-blue); font-weight: 600; }
.hub-unread-dot { width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--hub-blue); }
.hub-question-index-copy > .hub-unread-dot { position: absolute; left: 0; top: 0.55rem; }
.hub-question-index-link:hover .hub-question-index-title { color: var(--hub-blue); text-decoration: underline; text-underline-offset: 0.15em; }
.hub-question-index-preview { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; font-size: 0.94rem; line-height: 1.5; color: var(--hub-soft-ink); }
.hub-question-index-meta { display: flex; flex-wrap: wrap; color: var(--hub-soft-ink); font-size: 0.8rem; line-height: 1.4; }
.hub-question-index-meta span + span::before { margin: 0 0.42rem; content: "·"; }
.hub-question-index-activity { display: flex; flex-direction: column; align-items: flex-end; gap: 0.5rem; padding-top: 0.15rem; font-size: 0.8rem; color: var(--hub-soft-ink); }
.hub-question-status { font-size: 0.87rem; }
.hub-question-status > span { margin-right: 0.25rem; }
.hub-question-status.is-resolved, .hub-thread-status.is-resolved { color: #39705a; }
.hub-question-status.is-followup, .hub-thread-status.is-followup { color: #8a5e1c; }
.hub-question-instructor-reply { color: var(--hub-blue); }
.hub-question-for-you { color: var(--hub-blue); font-weight: 600; }
.hub-push-offer { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.35rem 0.8rem; margin: 1rem 0 0; color: var(--hub-soft-ink); font-size: 0.9rem; }
.hub-question-pagination { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.4rem; font-size: 0.85rem; color: var(--hub-soft-ink); }
.hub-question-pagination button:disabled { opacity: 0.4; cursor: default; }
.hub-thread-status-actions { position: absolute; right: 0; top: calc(100% + 0.35rem); z-index: 3; display: grid; gap: 0.25rem; min-width: 10rem; padding: 0.65rem 0.9rem; border: 1px solid var(--hub-rule); border-radius: 4px; background: #fff; box-shadow: 0 5px 15px rgb(35 53 68 / 8%); }
.hub-thread-status-actions .hub-text-button { text-align: left; padding: 0.35rem 0; }
.hub-thread-state { flex-wrap: wrap; }
.hub-discussion-error { color: #9d352b; }

.hub-new-question-fields input,
.hub-new-question-fields select {
  width: 100%; min-height: 2.8rem; border: 0; border-bottom: 1px solid var(--hub-rule);
  border-radius: 0; background: #fff; color: var(--hub-ink); padding: 0.55rem 0.85rem; font: 0.92rem/1.3 var(--font-body);
}
.hub-new-question-fields input:focus,
.hub-new-question-fields select:focus {
  border-bottom-color: var(--hub-blue);
  box-shadow: inset 0 -1px 0 var(--hub-blue);
  outline: 0;
}

@media (max-width: 540px) {
  .hub-question-index .hub-question-index-header { align-items: flex-start; }
  .hub-question-index .hub-question-index-actions { flex-direction: column-reverse; align-items: flex-end; gap: 0.55rem; }
  .hub-question-index .hub-question-new { padding: 0.65rem 0.8rem; font-size: 0.85rem; }
  .hub-question-index .hub-question-faq-link { font-size: 0.8rem; }
  .hub-question-index .hub-question-views { gap: 1rem; }
  .hub-question-index .hub-question-views button { font-size: 0.85rem; }
  .hub-question-index .hub-question-index-link { grid-template-columns: minmax(0, 1fr); gap: 0.8rem; }
  .hub-question-index-activity { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; padding-left: 1rem; }
}
@media (pointer: coarse) {
  .hub-question-views button, .hub-question-filter-button, .hub-question-filter-panel label,
  .hub-question-filter-chip, .hub-question-pagination button { min-height: 44px; }
}

.hub-question-empty {
  padding: 2.4rem 0;
  text-align: center;
}

.hub-question-empty p {
  margin: 0 0 0.55rem;
  color: var(--hub-soft-ink);
}

.hub-discussion-shell {
  display: grid;
  width: min(100%, 1480px);
  min-height: calc(100vh - var(--topbar-height));
  margin: 0 auto;
  grid-template-columns: minmax(17rem, 22rem) minmax(0, 1fr);
}

.hub-thread-sidebar {
  padding: 2.2rem 1.6rem 3rem;
  border-right: 1px solid var(--hub-rule);
  background: #fafafa;
}

.hub-thread-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.45rem;
}

.hub-all-questions {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--hub-blue);
  padding: 0;
  font: 500 0.88rem/1.3 var(--font-display);
  cursor: pointer;
}

.hub-new-thread {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--hub-blue);
  padding: 0;
  font: 500 0.88rem/1.3 var(--font-display);
  cursor: pointer;
}

.hub-thread-list {
  display: grid;
  gap: 0.15rem;
}

.hub-thread-link {
  appearance: none;
  width: 100%;
  border: 0;
  border-left: 2px solid transparent;
  background: transparent;
  color: var(--hub-ink);
  padding: 0.85rem 0.85rem 0.9rem 1rem;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.hub-thread-link:hover {
  background: var(--hub-blue-wash);
}

.hub-thread-link.is-active {
  border-left-color: var(--hub-blue);
  background: var(--hub-blue-wash);
  color: var(--hub-blue-strong);
}

.hub-thread-link-title,
.hub-thread-link-preview,
.hub-thread-link-meta {
  display: block;
}

.hub-thread-link-title {
  font-size: 0.98rem;
  line-height: 1.42;
}

.hub-thread-link-meta {
  margin-top: 0.32rem;
  color: var(--hub-faint);
  font-size: 0.8rem;
}

.hub-thread-link-preview {
  display: -webkit-box;
  margin-top: 0.2rem;
  overflow: hidden;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.tutor-thread-group {
  display: grid;
  gap: 0.15rem;
}

.tutor-thread-group + .tutor-thread-group { margin-top: 1.1rem; }

.tutor-thread-group-label {
  margin: 0 0 0.25rem;
  color: var(--hub-faint);
  font-size: 0.76rem;
  font-weight: 600;
}

.hub-thread-main {
  min-width: 0;
  padding: 2.2rem clamp(1.5rem, 4vw, 4rem) 4rem;
}

.hub-thread {
  max-width: 55rem;
  margin-inline: auto;
}

.hub-thread-header {
  padding-bottom: 0;
}

.hub-thread-header-topline {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 0.85rem;
  flex-wrap: wrap;
}

.hub-thread-metadata { display: flex; align-items: baseline; gap: 0.45rem 0.65rem; flex-wrap: wrap; }
.hub-thread-metadata .hub-post-meta { margin: 0; }
.hub-thread-taxonomy::before { content: "·"; margin-right: 0.65rem; color: var(--hub-soft-ink); }
.hub-thread-taxonomy:empty { display: none; }

.hub-thread-title {
  margin: 0;
  color: var(--hub-ink);
  font-size: clamp(1.75rem, 2.4vw, 2.2rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.18;
}

/* The heading receives focus after navigation, but is not an interactive control. */
.hub-thread-title:focus {
  outline: none;
}

.hub-thread-taxonomy {
  margin: 0;
  color: var(--hub-blue-strong);
  font-size: 0.86rem;
}

.hub-post-meta {
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.86rem;
}

.hub-post-meta .hub-instructor-label {
  margin-left: 0.35rem;
}

.hub-thread-state {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  margin-left: auto;
  gap: 0.2rem;
}
.hub-thread-status-menu-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  min-height: 2rem;
  padding: 0.25rem 0;
  color: var(--hub-soft-ink);
  white-space: nowrap;
}

.hub-thread-status {
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
}

.hub-thread-state .hub-text-button {
  font-size: 0.8rem;
}

.hub-thread-actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  justify-content: flex-end;
  margin: 1.5rem 0 0;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--hub-rule);
}
.hub-thread-actions [data-edit-thread] { margin-right: auto; order: -1; }

.hub-reveal-form {
  margin: 0.75rem 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--hub-rule);
  border-radius: 6px;
  background: var(--hub-wash);
  font-size: 0.9rem;
}
.hub-reveal-form p { margin: 0 0 0.6rem; }
.hub-reveal-form label { display: grid; gap: 0.3rem; }
.hub-reveal-form textarea { width: 100%; font: inherit; }
.hub-reveal-actions { display: flex; align-items: center; gap: 0.75rem; margin-top: 0.6rem; }

.hub-thread-answer {
  width: auto;
  font-size: 0.88rem;
  padding: 0.65rem 1rem;
}

.hub-original-post {
  margin-top: 1.65rem;
  padding-bottom: 0.35rem;
  font-size: 1.12rem;
  line-height: 1.65;
}
.hub-original-post > :last-child { margin-bottom: 0; }

.hub-original-post p,
.hub-reply p {
  margin: 0 0 0.8rem;
}

.hub-context-reference {
  margin: 1.35rem 0 1.55rem;
  padding: 0.15rem 0 0.15rem 1rem;
  border-left: 2px solid var(--primary-border);
}

.hub-context-reference-label {
  margin: 0 0 0.3rem;
  color: var(--hub-blue);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.hub-context-reference blockquote {
  margin: 0;
  color: var(--hub-soft-ink);
  font-size: 0.94rem;
}

.hub-context-reference a {
  color: var(--hub-blue);
  text-decoration: none;
}

.hub-new-question-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
  margin-bottom: 1.35rem;
}

.hub-new-question-fields label {
  display: grid;
  gap: 0.25rem;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
}

.hub-new-question-title-field {
  grid-column: 1 / -1;
}

.hub-question-recommendations {
  margin: -0.15rem 0 1.45rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--hub-rule);
  background: var(--hub-wash);
}

.hub-question-recommendation-group + .hub-question-recommendation-group {
  margin-top: 0.9rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-question-recommendations h2 {
  margin: 0 0 0.55rem;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 600;
}

.hub-question-recommendations ul {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-question-recommendations li + li {
  border-top: 1px solid var(--hub-rule);
}

.hub-question-recommendations a {
  display: grid;
  gap: 0.18rem;
  padding: 0.65rem 0;
  color: var(--hub-blue-strong);
  text-decoration: none;
}

.hub-question-recommendations a:hover > span {
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.hub-question-recommendations small {
  color: var(--hub-soft-ink);
  font-size: 0.76rem;
}

.hub-replies-heading {
  margin: 1.3rem 0 1.25rem;
  color: var(--hub-ink);
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.hub-answer-count { margin-left: 0.4rem; color: var(--hub-soft-ink); font-size: 0.85rem; font-weight: 400; }
.hub-answer-empty { color: var(--hub-soft-ink); font-size: 0.94rem; }
[data-reply-list] { margin-left: 1.5rem; }

.hub-reply-group:not(.is-nested) {
  border: 1px solid var(--hub-rule);
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 1.2rem;
  background: #fff;
}

.hub-reply {
  padding: 1.25rem 1.4rem;
  font-size: 0.96rem;
}

.hub-reply-group:not(.is-nested) > .hub-reply.is-instructor {
  background: var(--hub-blue-wash);
}

.hub-reply.is-instructor .hub-reply-author {
  color: var(--hub-ink);
}

.hub-reply-children {
  padding: 1.1rem 1.4rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-reply-children:empty {
  display: none;
}

.hub-reply-children .hub-reply {
  padding: 0 0 1.1rem 1rem;
  border-left: 2px solid var(--hub-rule);
  font-size: 0.9rem;
}
.hub-reply-children > .hub-reply-group:last-child > .hub-reply { padding-bottom: 0; }

.hub-reply .hub-reply-author {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.42rem;
  margin: 0 0 0.75rem;
  font-size: 0.85rem;
  font-weight: 600;
}

.hub-reply-time {
  margin-left: auto;
  color: var(--hub-soft-ink);
  font-size: 0.78rem;
  font-weight: 400;
}

.hub-instructor-label {
  color: var(--hub-blue);
  font-size: 0.74rem;
  font-weight: 600;
}

.hub-reply-body > :last-child {
  margin-bottom: 0;
}

.hub-reply-actions {
  display: flex;
  gap: 0.45rem;
  margin-top: 0.55rem;
}

.hub-reply-action {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--hub-blue);
  padding: 0;
  font: 500 0.8rem/1.3 var(--font-display);
  cursor: pointer;
}

.hub-reply-action:hover {
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.hub-editor {
  margin-top: 1.5rem;
  overflow: hidden;
  border: 1px solid var(--hub-rule-light);
  border-radius: 0.55rem;
  background: #fff;
}

.hub-editor.is-nested {
  margin: 0.8rem 0 1.25rem;
}

.hub-editor.is-editing {
  margin-top: 0.8rem;
}
.hub-editor.is-answer { margin: 0 0 1.25rem 1.5rem; }
.hub-reply-group > .hub-editor.is-editing { margin: 0; border: 0; border-radius: 0; }

.hub-reply-target {
  padding: 0.65rem 0.85rem 0.25rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
}

.hub-reply-target[hidden] {
  display: none;
}

.hub-editor-edit-fields {
  padding: 0.8rem 0.85rem 0.95rem;
}

.hub-editor-edit-fields label {
  display: grid;
  gap: 0.3rem;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
}

.hub-editor-edit-fields input {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--hub-rule);
  border-radius: 0;
  background: transparent;
  color: var(--hub-ink);
  padding: 0.45rem 0;
  font: 1rem/1.3 var(--font-body);
}

.hub-editor-edit-fields input:focus {
  border-bottom-color: var(--hub-blue);
  outline: 0;
}

.hub-editor:focus-within {
  border-color: var(--hub-blue-muted);
}

.hub-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.1rem;
  min-height: 2.75rem;
  padding: 0.3rem 0.55rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-question-picker {
  padding: 1rem;
  border-bottom: 1px solid var(--hub-rule);
  background: var(--hub-wash);
}
.hub-question-picker-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 0.65rem; }
.hub-question-picker-heading label { color: var(--hub-ink); font-size: 0.9rem; font-weight: 500; }
.hub-question-picker input[type="search"] { width: 100%; padding: 0.55rem 0.7rem; border: 1px solid var(--hub-rule); border-radius: 3px; background: #fff; color: var(--hub-ink); font: 1rem var(--font-body); }
.hub-question-picker-status { margin: 0.65rem 0 0; color: var(--hub-soft-ink); font-size: 0.82rem; }
.hub-question-picker-results { list-style: none; padding: 0; margin: 0.45rem 0 0; }
.hub-question-picker-result { display: grid; gap: 0.2rem; width: 100%; text-align: left; padding: 0.65rem 0; border: 0; border-bottom: 1px solid var(--hub-rule-light); background: transparent; color: var(--hub-blue); font: 0.95rem/1.4 var(--font-body); cursor: pointer; overflow-wrap: anywhere; }
.hub-question-picker-result:hover > span { text-decoration: underline; text-underline-offset: 0.15em; }
.hub-question-picker-result small { color: var(--hub-soft-ink); font-size: 0.8rem; }
.hub-question-picker-pages { display: flex; justify-content: space-between; align-items: center; gap: 0.8rem; margin-top: 0.7rem; color: var(--hub-soft-ink); font-size: 0.8rem; }
.hub-question-picker-pages button:disabled { opacity: 0.4; cursor: default; }
.hub-editor-field a, .hub-editor-preview a, .hub-reply-body a, .hub-original-post a { color: var(--hub-blue); text-decoration: underline; text-underline-offset: 0.15em; }

.hub-editor-tool {
  appearance: none;
  white-space: nowrap;
  min-width: 2.2rem;
  min-height: 2.1rem;
  border: 0;
  background: transparent;
  color: var(--hub-soft-ink);
  padding: 0.25rem 0.45rem;
  font: 500 0.94rem/1 var(--font-display);
  cursor: pointer;
}

.hub-editor-tool:hover {
  background: var(--hub-blue-wash);
  color: var(--hub-blue);
}

.hub-editor-tool.is-active {
  background: var(--hub-blue-wash);
  color: var(--hub-blue);
}

.hub-editor-preview-toggle {
  margin-left: auto;
}

.hub-editor-tool:disabled {
  color: var(--hub-rule);
  cursor: not-allowed;
}

.hub-editor-tool:disabled:hover {
  background: transparent;
}

.hub-editor-field {
  min-height: 7rem;
  padding: 0.9rem 0.85rem;
  color: var(--hub-ink);
  outline: none;
}

.hub-editor-field:empty::before {
  color: var(--hub-faint);
  content: attr(data-placeholder);
  pointer-events: none;
}

.hub-original-post img,
.hub-reply-body img,
.hub-editor-field img,
.hub-editor-preview img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0.75rem 0;
}

.hub-editor-preview {
  min-height: 5rem;
  padding: 0.8rem 0.85rem 1rem;
  border-top: 1px solid var(--hub-rule);
  background: transparent;
}

.hub-pdf-attachment {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.4rem 1.25rem;
  margin: 0.75rem 0;
  padding: 0.8rem 0;
  border-block: 1px solid var(--hub-rule);
  font-size: 0.9rem;
}

.hub-pdf-filename {
  flex: 1 1 12rem;
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 600;
}

.hub-pdf-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.hub-pdf-remove {
  align-self: center;
  flex: 0 0 auto;
}

.hub-editor-preview > p:first-child {
  margin: 0 0 0.75rem;
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-editor-preview [data-editor-preview-body] > :last-child {
  margin-bottom: 0;
}

.hub-editor-preview-empty {
  color: var(--hub-faint);
  font-style: italic;
}

.hub-editor-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  justify-content: flex-end;
  padding: 0.55rem 0.65rem;
}

.hub-reply-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.7rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.hub-reply-status legend {
  float: left;
  padding: 0;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
}

.hub-reply-status-options {
  display: inline-flex;
  flex-wrap: wrap;
  border: 1px solid var(--hub-rule);
  border-radius: 4px;
  overflow: hidden;
}

.hub-reply-status-option {
  position: relative;
  cursor: pointer;
}

.hub-reply-status-option + .hub-reply-status-option {
  border-left: 1px solid var(--hub-rule);
}

.hub-reply-status-option input {
  position: absolute;
  opacity: 0;
}

.hub-reply-status-option span {
  display: block;
  padding: 0.38rem 0.7rem;
  color: var(--hub-soft-ink);
  font: 0.82rem/1.3 var(--font-body);
}

.hub-reply-status-option input:checked + span {
  background: var(--hub-blue-wash);
  color: var(--hub-blue);
  font-weight: 600;
}

.hub-reply-status-option input:focus-visible + span {
  outline: 2px solid var(--hub-blue);
  outline-offset: -2px;
}

.hub-editor-status {
  margin: 0 auto 0 0;
  color: var(--hub-faint);
  font-size: 0.82rem;
}

.hub-editor-status.is-error {
  color: #a2362a;
}

.hub-editor-cancel {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--hub-blue);
  padding: 0;
  font: 500 0.82rem/1.3 var(--font-display);
  cursor: pointer;
}

.hub-editor-cancel:hover {
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.hub-send-button {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--hub-blue-strong);
  color: #fff;
  font-size: 1.05rem;
  cursor: pointer;
}

.hub-send-button:disabled {
  opacity: 0.45;
  cursor: wait;
}

.hub-live-shell {
  width: min(100% - 3rem, 1280px);
  margin: 0 auto;
  padding: 3.8rem 0 6rem;
}

.hub-live-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 2.7rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--hub-rule);
  color: var(--hub-soft-ink);
}

.hub-live-state {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  color: var(--hub-blue-strong);
}

.hub-live-time,
.hub-response-count {
  margin: 0;
  font-variant-numeric: tabular-nums;
}

.hub-live-question h1 {
  max-width: 65rem;
  margin: 0;
  color: var(--hub-blue);
  font-size: clamp(2rem, 4vw, 3.15rem);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.12;
}

.hub-live-question-prompt {
  margin: 1.2rem 0 1.7rem;
  font-size: 1.12rem;
}

.hub-choice-list {
  display: grid;
  border-top: 1px solid var(--hub-rule);
}

.hub-choice {
  display: grid;
  min-height: 5.1rem;
  grid-template-columns: 2.1rem minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  border-bottom: 1px solid var(--hub-rule);
  cursor: pointer;
  transition: background-color 150ms ease;
}

.hub-choice:hover,
.hub-choice:has(input:checked) {
  background: var(--hub-blue-wash);
}

.hub-choice input {
  width: 1.3rem;
  height: 1.3rem;
  accent-color: var(--hub-blue);
}

.hub-choice-text {
  font-size: 1.08rem;
  line-height: 1.45;
}

.hub-live-submit-row {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  margin-top: 1.7rem;
}

.hub-live-privacy {
  margin: 0;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
}

.hub-result-list {
  display: grid;
  margin-top: 1.8rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-result {
  padding: 1rem 0 1.15rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-result-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
}

.hub-result-label,
.hub-result-percent {
  margin: 0;
}

.hub-result-label {
  line-height: 1.45;
}

.hub-result-percent {
  font-variant-numeric: tabular-nums;
}

.hub-result-bar {
  height: 0.38rem;
  margin-top: 0.75rem;
  overflow: hidden;
  border-radius: 999px;
  background: #f0f2f3;
}

.hub-result-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--hub-blue-muted);
}

.hub-result.is-correct {
  color: var(--hub-blue-strong);
}

.hub-result.is-correct .hub-result-bar span {
  background: var(--hub-blue);
}

.hub-result-note {
  margin: 0.45rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
  text-align: right;
}

.hub-live-explanation {
  max-width: 64rem;
  margin-top: 1.8rem;
}

.hub-live-explanation h2 {
  margin: 0 0 0.45rem;
  color: var(--hub-blue);
  font-size: 1.15rem;
  font-weight: 600;
}

.hub-live-explanation p {
  margin: 0;
}

.hub-live-waiting {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 2.4rem 0 0;
  color: var(--hub-faint);
  font-size: 0.9rem;
}

.hub-live-loading,
.hub-live-empty,
.hub-live-checkin,
.hub-live-waiting-panel,
.hub-live-history,
.hub-live-admin-panel,
.hub-live-current-session {
  margin-top: 1.5rem;
  padding: 1.5rem;
  border: 1px solid var(--hub-rule);
  background: #fff;
}

.hub-live-loading h1,
.hub-live-empty h1,
.hub-live-checkin h1,
.hub-live-instructor-header h1 {
  margin: 0;
  color: var(--hub-blue);
  font-size: clamp(2rem, 4vw, 3.15rem);
  font-weight: 400;
  letter-spacing: -0.03em;
}

.hub-live-loading p,
.hub-live-empty p,
.hub-live-checkin > p,
.hub-live-waiting-panel p {
  max-width: 48rem;
  color: var(--hub-soft-ink);
}

.hub-live-actions,
.hub-live-form-row,
.hub-live-append,
.hub-live-instructor-header,
.hub-live-current-session header,
.hub-live-submit-row {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.hub-live-actions { margin-top: 1.5rem; }

.hub-secondary-button {
  min-height: 2.55rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid var(--hub-blue-muted);
  background: #fff;
  color: var(--hub-blue-strong);
  cursor: pointer;
}

.hub-secondary-button:hover { background: var(--hub-blue-wash); }
.hub-secondary-button:disabled { cursor: not-allowed; opacity: 0.45; }

.hub-live-status-text,
.hub-live-error {
  color: var(--hub-soft-ink);
  font-size: 0.92rem;
}

.hub-live-error {
  margin: 1rem 0;
  padding: 0.8rem 1rem;
  border-left: 3px solid #a43a3a;
  background: #fff5f5;
  color: #7d2828;
}

.hub-live-attendance-note {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 2rem;
  padding: 0.8rem 1rem;
  border-left: 3px solid var(--hub-blue);
  background: var(--hub-blue-wash);
  color: var(--hub-blue-strong);
}

.hub-live-attendance-note span { color: var(--hub-soft-ink); }

.hub-live-instructor-header {
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 2.8rem;
  padding-bottom: 0;
  border-bottom: 0;
}

.hub-live-instructor-header h1 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 5vw, 4.25rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
}

.hub-live-instructor-header p {
  max-width: 42rem;
  margin: 0.9rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.06rem;
}

.hub-live-connection {
  padding: 0;
  color: var(--hub-blue-strong);
  font-weight: 600;
  font-size: 0.85rem;
}

.hub-live-instructor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-live-admin-panel {
  margin-top: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.hub-live-admin-panel h2,
.hub-live-history h2 {
  margin: 0 0 1rem;
  color: var(--hub-blue);
  font-size: 1.45rem;
  font-weight: 600;
}

.hub-live-admin-panel form { display: grid; gap: 0.75rem; }
.hub-live-admin-panel label { display: grid; gap: 0.3rem; color: var(--hub-soft-ink); font-size: 0.86rem; }
.hub-live-admin-panel input,
.hub-live-admin-panel textarea,
.hub-live-admin-panel select {
  width: 100%;
  padding: 0.65rem 0;
  border: 0;
  border-bottom: 1px solid var(--hub-rule);
  border-radius: 0;
  background: transparent;
  color: var(--hub-ink);
  font: inherit;
}
.hub-live-library-item input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  flex: none;
  margin: 0.2rem 0 0;
  padding: 0;
  border: 0;
  accent-color: var(--hub-blue);
}
.hub-live-admin-panel textarea { min-height: 4.5rem; resize: vertical; }
.hub-live-form-row > label { flex: 1; }
.hub-live-library-list { display: grid; gap: 0; margin-top: 0.8rem; }
.hub-live-library-item { display: flex !important; grid-template-columns: auto 1fr; align-items: start; gap: 0.65rem; padding: 0.75rem 0; border: 0; border-bottom: 1px solid var(--hub-rule-light); }
.hub-live-library-item span { display: grid; gap: 0.2rem; }
.hub-live-library-item small { color: var(--hub-soft-ink); }
.hub-live-session-builder { margin-top: 2.4rem; padding: 1.4rem 0 1.8rem; border-top: 1px solid var(--hub-rule); border-bottom: 1px solid var(--hub-rule); background: transparent; }
.hub-live-session-builder > form { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(12rem, 0.8fr) auto; align-items: end; gap: 1.5rem; max-width: none; }
.hub-live-session-builder > form label { margin: 0; }
.hub-live-current-session { margin-top: 2.4rem; padding: 0; border: 0; background: transparent; }
.hub-live-current-session header { justify-content: space-between; }
.hub-live-current-session h2 { margin: 0; color: var(--hub-blue); font-size: 1.45rem; font-weight: 600; }
.hub-live-current-session header p { margin: 0.25rem 0 0; color: var(--hub-soft-ink); }
.hub-live-prompt-queue { display: grid; gap: 0.5rem; margin: 1rem 0; padding-left: 1.4rem; }
.hub-live-prompt-queue li { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 0.65rem 0; border-bottom: 1px solid var(--hub-rule); }
.hub-live-prompt-queue li > div { display: grid; gap: 0.2rem; }
.hub-live-prompt-queue small { color: var(--hub-soft-ink); }
.hub-live-append { margin-top: 1rem; }
.hub-live-append select { min-width: 18rem; padding: 0.65rem 0; border: 0; border-bottom: 1px solid var(--hub-rule); border-radius: 0; background: transparent; }
.hub-live-attendance-summary { color: var(--hub-soft-ink); font-size: 0.9rem; }
.hub-live-attendance-records { margin: 1rem 0; }
.hub-live-attendance-records h4 { margin: 0 0 0.45rem; color: var(--hub-blue); font-size: 1rem; }
.hub-live-attendance-record { display: flex; justify-content: space-between; gap: 1rem; padding: 0.55rem 0; border-top: 1px solid var(--hub-rule-light); color: var(--hub-soft-ink); font-size: 0.88rem; }
.hub-live-attendance-record span:first-child { display: grid; gap: 0.12rem; }
.hub-live-attendance-record small { color: var(--hub-faint); }
.hub-live-override { display: inline-flex; align-items: center; gap: 0.4rem; }
.hub-live-override select { padding: 0.2rem 0; border: 0; border-bottom: 1px solid var(--hub-rule); border-radius: 0; background: transparent; color: var(--hub-ink); }
.hub-live-history { margin-top: 2rem; padding: 1.4rem 0 0; border: 0; border-top: 1px solid var(--hub-rule); background: transparent; }
.hub-live-history-item { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.7rem; padding: 0.8rem 0; border-bottom: 1px solid var(--hub-rule); }
.hub-live-history-item summary { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.7rem; width: 100%; cursor: pointer; }
.hub-live-history-prompts { width: 100%; padding-top: 1rem; }
.hub-live-history-prompts h3 { margin: 1rem 0 0; color: var(--hub-blue); font-size: 1.1rem; font-weight: 600; }
.hub-live-history-item span { color: var(--hub-soft-ink); }
.hub-live-history-item a { color: var(--hub-blue-strong); }

.hub-live-shell .hub-primary-button,
.hub-live-shell .hub-secondary-button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--hub-blue-strong);
  font: 500 0.92rem/1.3 var(--font-display);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}
.hub-live-shell .hub-primary-button:hover,
.hub-live-shell .hub-secondary-button:hover { background: transparent; color: var(--hub-blue); }
.hub-live-shell .hub-primary-button:disabled,
.hub-live-shell .hub-secondary-button:disabled { color: var(--hub-faint); }

@media (max-width: 700px) {
  .hub-live-instructor-grid { grid-template-columns: 1fr; }
  .hub-live-instructor-header,
  .hub-live-actions,
  .hub-live-form-row,
  .hub-live-append,
  .hub-live-attendance-note { align-items: stretch; flex-direction: column; }
  .hub-live-session-builder > form { grid-template-columns: 1fr; gap: 1rem; }
  .hub-live-append select { min-width: 0; }
  .hub-live-prompt-queue li { align-items: flex-start; flex-direction: column; }
}

/* Tutor and Tutor Lab */
.tutor-shell {
  display: grid;
  grid-template-columns: 18rem minmax(0, 1fr);
  width: min(100% - 2rem, 88rem);
  min-height: calc(100vh - 7rem);
  margin: 2rem auto;
  overflow: hidden;
  border: 1px solid var(--hub-rule);
  border-radius: 1rem;
  background: var(--hub-surface, #fff);
}

.tutor-history {
  padding: 1.25rem;
  border-right: 1px solid var(--hub-rule);
  background: color-mix(in srgb, var(--hub-surface, #fff) 90%, var(--hub-accent, #315f54));
}

.tutor-history-header,
.tutor-header,
.tutor-lab-header,
.tutor-lab-toolbar,
.tutor-conversation-actions,
.tutor-admin-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.tutor-history-header h2,
.tutor-header h1,
.tutor-lab-header h2 {
  margin: 0;
}

.tutor-history nav {
  display: grid;
  gap: 0.4rem;
  margin-top: 1.2rem;
}

.tutor-history-item {
  display: grid;
  gap: 0.2rem;
  width: 100%;
  padding: 0.75rem;
  border: 0;
  border-radius: 0.65rem;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.tutor-history-item:hover,
.tutor-history-item.is-active {
  background: var(--hub-surface, #fff);
}

.tutor-history-item small,
.tutor-message-meta,
.tutor-empty {
  color: var(--hub-muted, #64706d);
}

.tutor-workspace {
  display: grid;
  grid-template-rows: auto auto minmax(18rem, 1fr) auto;
  min-width: 0;
  min-height: 42rem;
}

.tutor-workspace > .tutor-header { grid-row: 1; }
.tutor-workspace > .tutor-status { grid-row: 2; }
.tutor-workspace > .tutor-messages { grid-row: 3; }
.tutor-workspace > .tutor-composer-dock { grid-row: 4; }

.tutor-thread-shell {
  min-height: calc(100vh - var(--topbar-height) - 3.1rem);
}

.tutor-thread-workspace {
  min-height: calc(100vh - var(--topbar-height) - 3.1rem);
}

.tutor-thread-workspace .tutor-header h1 {
  color: var(--hub-blue);
  font-size: clamp(1.75rem, 2.4vw, 2.2rem);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.18;
}

.tutor-header,
.tutor-lab-header {
  padding: 1.4rem 1.6rem;
  border-bottom: 1px solid var(--hub-rule);
}

.tutor-header p,
.tutor-lab-header p,
.tutor-spec-panel header p {
  margin: 0.3rem 0 0;
  color: var(--hub-muted, #64706d);
}

.tutor-context-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  width: fit-content;
  margin-top: 0.65rem;
  padding: 0.35rem 0.45rem 0.35rem 0.7rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--hub-accent, #315f54) 12%, transparent);
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  font-weight: 600;
}

.tutor-context-pill button {
  display: grid;
  width: 1.45rem;
  height: 1.45rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: currentColor;
  font: inherit;
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
  place-items: center;
}

.tutor-context-pill button:hover { background: rgb(255 255 255 / 65%); }

.tutor-check {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.tutor-status,
.tutor-form-status {
  margin: 0;
  padding: 0.65rem 1.6rem;
  color: var(--hub-muted, #64706d);
}

.tutor-status[data-kind="error"],
.tutor-form-status[data-kind="error"] {
  color: #9b2c2c;
}

.tutor-messages {
  min-height: 12rem;
  padding: 1.5rem;
  overflow-y: auto;
}

.tutor-message {
  width: min(100%, 48rem);
  margin: 0 auto 1.15rem;
}

.tutor-message.is-user {
  width: fit-content;
  max-width: min(88%, 42rem);
  margin-right: 0;
  padding: 0.8rem 1rem;
  border-radius: 0.85rem 0.85rem 0.2rem 0.85rem;
  background: var(--interactive-bg, var(--secondary-surface, #eef5fa));
}

.tutor-message-body > :first-child { margin-top: 0; }
.tutor-message-body > :last-child { margin-bottom: 0; }
.tutor-stream-stable,
.tutor-stream-block,
.tutor-stream-live { display: contents; }
.tutor-stream-block:first-child > :first-child,
.tutor-stream-live > :first-child { margin-top: 0; }
.tutor-stream-block:last-child > :last-child,
.tutor-stream-live > :last-child { margin-bottom: 0; }
.tutor-pending-math { visibility: hidden; }
.tutor-inline-citation { font-weight: 650; white-space: nowrap; }
.tutor-message.is-streaming:not(.is-thinking) .tutor-message-body::after { content: " ▍"; opacity: 0.55; }
.tutor-thinking {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-height: 1.5rem;
}
.tutor-thinking > span {
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.35;
  animation: tutor-thinking-pulse 1.15s ease-in-out infinite;
}
.tutor-thinking > span:nth-child(2) { animation-delay: 0.14s; }
.tutor-thinking > span:nth-child(3) { animation-delay: 0.28s; }
@keyframes tutor-thinking-pulse {
  0%, 70%, 100% { opacity: 0.3; transform: translateY(0); }
  35% { opacity: 0.9; transform: translateY(-0.18rem); }
}
@media (prefers-reduced-motion: reduce) {
  .tutor-thinking > span { animation: none; opacity: 0.55; }
}
.tutor-message-meta { display: block; margin-top: 0.55rem; font-size: 0.75rem; }

.tutor-message-actions {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  margin-top: 0.65rem;
}

.tutor-message-action {
  padding: 0.25rem 0.4rem;
  border: 0;
  border-radius: 0.35rem;
  background: transparent;
  color: var(--hub-faint);
  font: 500 0.76rem/1.25 var(--font-display);
  cursor: pointer;
}

.tutor-message-action:hover,
.tutor-message-action[aria-pressed="true"] {
  background: var(--hub-blue-wash);
  color: var(--hub-blue-strong);
}

.tutor-citations {
  margin-top: 1rem;
  padding-top: 0.8rem;
  border-top: 1px solid var(--hub-rule);
  font-size: 0.86rem;
}

.tutor-source-dialog {
  width: min(46rem, calc(100% - 2rem));
  max-height: min(46rem, calc(100vh - 2rem));
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--hub-rule);
  border-radius: 0.9rem;
  background: var(--hub-surface, #fff);
  color: inherit;
  box-shadow: 0 1.4rem 4rem rgb(26 43 61 / 22%);
}
.tutor-source-dialog::backdrop { background: rgb(20 31 42 / 42%); }
.tutor-source-dialog-panel { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; max-height: min(46rem, calc(100vh - 2rem)); }
.tutor-source-dialog header,
.tutor-source-dialog footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.2rem;
}
.tutor-source-dialog header { border-bottom: 1px solid var(--hub-rule); }
.tutor-source-dialog footer { border-top: 1px solid var(--hub-rule); }
.tutor-source-dialog h2 { margin: 0; font-size: 1.2rem; }
.tutor-source-dialog header p { margin: 0.2rem 0 0; color: var(--hub-muted, #64706d); font-size: 0.86rem; }
.tutor-source-dialog-close {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--hub-blue);
  font: inherit;
  cursor: pointer;
}
.tutor-source-dialog-body { padding: 1.2rem; overflow: auto; }
.tutor-source-dialog-body > :first-child { margin-top: 0; }
.tutor-source-dialog-body > :last-child { margin-bottom: 0; }
.tutor-source-dialog-body img,
.tutor-source-dialog-body svg { max-width: 100%; height: auto; }

.tutor-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: flex-end;
  gap: 0.45rem;
  margin: 0.25rem 1.5rem 1.5rem;
  padding: 0.55rem 0.55rem 0.55rem 1rem;
  border: 1px solid var(--interactive-border, var(--hub-rule));
  border-radius: 1.1rem;
  background: var(--surface-raised, #fff);
  box-shadow: 0 0.4rem 1.4rem rgb(26 43 61 / 7%);
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.tutor-composer:focus-within {
  border-color: color-mix(in srgb, var(--hub-blue) 55%, var(--interactive-border, var(--hub-rule)));
  box-shadow: 0 0.45rem 1.6rem rgb(26 43 61 / 10%);
}

.tutor-composer-with-attachments { grid-template-columns: minmax(0, 1fr) auto; }
.tutor-composer-with-attachments .tutor-send-button,
.tutor-composer-with-attachments .tutor-stop-button { grid-column: 2; }
.tutor-attach-button {
  width: 2.4rem;
  height: 2.65rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--hub-soft-ink);
  font-size: 1.5rem;
  cursor: pointer;
}
.tutor-attach-button:hover { background: var(--interactive-bg); }
.tutor-attachment-draft:not([hidden]) {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.25rem 0;
}
.tutor-file-preview {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
  width: fit-content;
  max-width: 100%;
  padding: 0.5rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.55rem;
  color: inherit;
  font-size: 0.85rem;
  overflow-wrap: anywhere;
}
.tutor-file-preview img { width: 4rem; height: 4rem; object-fit: contain; border-radius: 0.25rem; }
.tutor-message .tutor-file-preview { margin-top: 0.6rem; }
.tutor-message .tutor-file-preview img { width: 6rem; height: 6rem; }
.tutor-attachment-help {
  width: min(100%, 48rem);
  margin: 0.45rem auto 0;
  padding: 0 0.65rem;
  color: var(--hub-muted, #64706d);
  font-size: 0.78rem;
}

.tutor-composer textarea,
.tutor-spec-panel textarea,
.tutor-spec-panel input,
.tutor-spec-panel select,
.tutor-comparison-setup textarea,
.tutor-comparison-setup select,
.tutor-feedback-panel textarea,
.tutor-admin-section input,
.tutor-admin-section select {
  width: 100%;
  padding: 0.7rem 0.8rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.55rem;
  background: var(--hub-surface, #fff);
  color: inherit;
  font: inherit;
}

.tutor-composer textarea {
  min-height: 3rem;
  max-height: 10rem;
  padding: 0.45rem 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  line-height: 1.45;
  resize: none;
}
.tutor-composer-with-attachments textarea {
  grid-column: 1 / -1;
  min-height: 0;
  field-sizing: content;
}
.tutor-composer .tutor-send-button:not([hidden]),
.tutor-composer .tutor-stop-button:not([hidden]) {
  display: grid;
  width: 2.65rem;
  min-width: 2.65rem;
  height: 2.65rem;
  min-height: 2.65rem;
  padding: 0;
  border-radius: 50%;
  place-items: center;
  font-size: 1.25rem;
  line-height: 1;
}
.tutor-composer-dock {
  position: sticky;
  z-index: 3;
  bottom: 0;
  box-sizing: border-box;
  width: 100%;
  margin-top: -2.25rem;
  padding: 2.75rem 1.5rem 1.5rem;
  background: linear-gradient(to bottom, transparent, var(--page-bg, #fff) 42%);
  pointer-events: none;
}

.tutor-thread-workspace .tutor-composer {
  width: min(100%, 48rem);
  margin: 0 auto;
  pointer-events: auto;
}

.tutor-thread-workspace.is-draft {
  grid-template-rows: minmax(4rem, 1fr) auto auto auto minmax(6rem, 1.5fr);
}

.tutor-thread-workspace.is-draft > .tutor-header {
  grid-row: 2;
  display: block;
  padding: 1.5rem;
  border: 0;
  text-align: center;
}

.tutor-thread-workspace.is-draft .tutor-header h1 {
  margin: 0;
  font-size: clamp(1.75rem, 3vw, 2.6rem);
  text-wrap: balance;
}

.tutor-thread-workspace.is-draft > .tutor-composer-dock {
  grid-row: 3;
  position: static;
  margin-top: 0;
  padding-top: 0;
  background: none;
}

.tutor-thread-workspace.is-draft > .tutor-status {
  grid-row: 4;
  text-align: center;
}

.tutor-jump-latest {
  position: absolute;
  top: 0.55rem;
  left: 50%;
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--hub-rule);
  border-radius: 999px;
  background: var(--hub-surface, #fff);
  color: var(--hub-blue-strong);
  box-shadow: 0 0.3rem 1rem rgb(26 43 61 / 10%);
  font: 500 0.78rem/1.2 var(--font-display);
  cursor: pointer;
  pointer-events: auto;
  transform: translateX(-50%);
}
.tutor-composer .tutor-stop-button {
  border: 0;
  background: var(--hub-blue);
  color: #fff;
  cursor: pointer;
}
.tutor-composer .tutor-stop-button:hover { background: var(--hub-blue-strong); }
.tutor-composer .tutor-stop-button span {
  width: 0.78rem;
  height: 0.78rem;
  border-radius: 0.08rem;
  background: currentColor;
  font-size: 0;
}
.hub-text-button.is-danger { color: #9b2c2c; }

.tutor-lab-shell {
  display: grid;
  grid-template-columns: minmax(20rem, 25rem) minmax(0, 1fr);
  width: min(100% - 2rem, 96rem);
  margin: 2rem auto 5rem;
  border: 1px solid var(--hub-rule);
  border-radius: 1rem;
  overflow: hidden;
  background: var(--hub-surface, #fff);
}

.tutor-spec-panel {
  padding: 1.4rem;
  border-right: 1px solid var(--hub-rule);
  background: var(--interactive-bg, var(--secondary-surface, #eef5fa));
}

.tutor-spec-panel h1 { margin: 0; }
.tutor-spec-close,
.tutor-spec-open,
.tutor-spec-backdrop { display: none; }
.tutor-spec-panel form,
.tutor-comparison-setup,
.tutor-admin-section form {
  display: grid;
  gap: 1rem;
  margin-top: 1.4rem;
}

.tutor-spec-panel label,
.tutor-comparison-setup label,
.tutor-admin-section label {
  display: grid;
  gap: 0.35rem;
}

.tutor-spec-panel label > span,
.tutor-comparison-setup label > span,
.tutor-admin-section label > span {
  font-size: 0.84rem;
  font-weight: 650;
}

.tutor-spec-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.tutor-saved-specs {
  display: grid;
  gap: 0.65rem;
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--hub-rule);
}

.tutor-saved-specs-heading,
.tutor-saved-specs-controls,
.tutor-saved-specs-actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.tutor-saved-specs-heading { justify-content: space-between; }
.tutor-saved-specs-heading h2 { margin: 0; font-size: 1rem; }
.tutor-saved-specs-controls select { min-width: 0; }
.tutor-saved-specs-controls .hub-secondary-button { flex: 0 0 auto; }
.tutor-saved-specs-actions { justify-content: flex-end; }
.tutor-saved-specs .tutor-form-status { min-height: 1.2em; padding: 0; font-size: 0.82rem; }

.tutor-diff { margin-top: 1.5rem; }
.tutor-diff pre,
.tutor-reveal pre,
.tutor-report-detail pre,
.tutor-feedback-detail pre {
  max-height: 24rem;
  padding: 0.8rem;
  overflow: auto;
  border: 1px solid var(--hub-rule);
  border-radius: 0.5rem;
  background: #f7f8f7;
  white-space: pre-wrap;
}

.tutor-lab-workspace { min-width: 0; }
.tutor-lab-header { align-items: flex-end; }
.tutor-lab-header-actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.tutor-lab-tabs {
  display: flex;
  gap: 1.25rem;
  margin-top: 1rem;
}
.tutor-lab-tabs button {
  position: relative;
  padding: 0 0 0.55rem;
  border: 0;
  background: transparent;
  color: var(--hub-muted, #64706d);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.tutor-lab-tabs button[aria-selected="true"] { color: var(--hub-blue); }
.tutor-lab-tabs button[aria-selected="true"]::after {
  position: absolute;
  right: 0;
  bottom: -1.45rem;
  left: 0;
  height: 2px;
  background: var(--hub-blue);
  content: "";
}
.tutor-lab-toolbar,
.tutor-comparison-setup,
.tutor-reveal { padding: 1.25rem 1.5rem; }
.tutor-lab-toolbar { justify-content: flex-start; }
.tutor-lab-toolbar select { min-width: 15rem; margin-left: auto; }

.tutor-spec-summary {
  display: flex;
  align-items: baseline;
  gap: 0.65rem;
  padding: 0.75rem 1.5rem;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
  background: color-mix(in srgb, var(--hub-surface, #fff) 94%, var(--hub-accent, #315f54));
  font-size: 0.86rem;
}
.tutor-spec-summary > span { color: var(--hub-muted, #64706d); }
.tutor-spec-summary details { margin-left: auto; }
.tutor-spec-summary summary { color: var(--hub-blue); cursor: pointer; }
.tutor-spec-summary details p { margin: 0.5rem 0 0; color: var(--hub-muted, #64706d); }
.tutor-spec-summary.is-branch { flex-wrap: wrap; padding: 0.75rem 1rem; border-top: 0; }
.tutor-spec-summary.is-branch details { width: 100%; margin-left: 0; }

.tutor-comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
}

.tutor-branch { display: grid; grid-template-rows: auto auto minmax(22rem, 1fr) auto auto; min-width: 0; }
.tutor-branch + .tutor-branch { border-left: 1px solid var(--hub-rule); }
.tutor-branch h3 { margin: 0; padding: 0.9rem 1.25rem; border-bottom: 1px solid var(--hub-rule); }
.tutor-branch h3 { grid-row: 1; }
.tutor-branch .tutor-spec-summary { grid-row: 2; }
.tutor-branch .tutor-messages { grid-row: 3; max-height: 55vh; padding: 1rem; }
.tutor-branch .tutor-composer { grid-row: 4; margin-right: 1rem; margin-left: 1rem; }
.tutor-branch .tutor-branch-rating { grid-row: 5; }
.tutor-branch .tutor-message { font-size: 0.94rem; }
.tutor-finish-comparison { margin: 1.25rem 1.5rem; }
.tutor-feedback-panel {
  display: grid;
  gap: 1.2rem;
}
.tutor-branch-rating {
  padding: 1.2rem;
  border-top: 1px solid var(--hub-rule);
  background: #fafafa;
}
.tutor-exploration-feedback {
  margin: 0;
  padding: 1.25rem 1.5rem;
  border-top: 1px solid var(--hub-rule);
  background: #fafafa;
}
.tutor-exploration-feedback h3 { margin: 0 0 1rem; }
.tutor-feedback-panel fieldset {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.tutor-feedback-panel legend { margin-bottom: 0.65rem; font-weight: 650; }
.tutor-score-options {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--hub-rule);
  border-radius: 0.4rem;
}
.tutor-score-option { position: relative; min-width: 0; cursor: pointer; }
.tutor-score-option input,
.tutor-rating-tags input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.tutor-score-option span {
  display: grid;
  min-height: 2.35rem;
  place-content: center;
  padding: 0.35rem 0.2rem;
  border-left: 1px solid var(--hub-rule);
  background: var(--hub-surface, #fff);
  text-align: center;
}
.tutor-score-option:first-child span { border-left: 0; }
.tutor-score-option strong { font-size: 0.9rem; font-variant-numeric: tabular-nums; }
.tutor-score-option input:checked + span,
.tutor-score-option input:focus-visible + span,
.tutor-rating-tags input:checked + span,
.tutor-rating-tags input:focus-visible + span {
  border-color: var(--hub-blue);
  background: var(--hub-blue-wash);
  color: var(--hub-blue-strong);
}
.tutor-score-scale-labels {
  display: flex;
  justify-content: space-between;
  color: var(--hub-muted, #64706d);
  font-size: 0.7rem;
}
.tutor-score-unable {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: fit-content;
  color: var(--hub-soft-ink);
  font-size: 0.85rem;
}
.tutor-rating-group + .tutor-rating-group { margin-top: 0.75rem; }
.tutor-rating-group p { margin: 0 0 0.45rem; color: var(--hub-soft-ink); font-size: 0.76rem; font-weight: 600; }
.tutor-rating-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.tutor-rating-tags label { position: relative; cursor: pointer; }
.tutor-rating-tags span {
  display: block;
  padding: 0.38rem 0.55rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.3rem;
  background: var(--hub-surface, #fff);
  font-size: 0.76rem;
}
.tutor-rating-note { display: grid; gap: 0.4rem; }
.tutor-rating-note > span { font-size: 0.84rem; font-weight: 650; }
.tutor-branch-rating.is-locked { background: var(--hub-surface, #fff); }
.tutor-branch-rating.is-locked label { cursor: default; }
.tutor-branch-rating.is-locked .tutor-rating-tags label:has(input:not(:checked)) { display: none; }
.tutor-rating-actions,
.tutor-feedback-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-top: 1px solid var(--hub-rule);
}
.tutor-feedback-actions { padding-top: 1rem; }
.tutor-rating-actions p,
.tutor-feedback-actions p { margin: 0; color: var(--hub-soft-ink); }
.tutor-reveal { border-top: 1px solid var(--hub-rule); }
.tutor-reveal h3 { margin-top: 0; }
.tutor-reveal-summary { color: var(--hub-soft-ink); }
.tutor-reveal details { margin-top: 1rem; }

.tutor-admin-shell { width: min(100% - 2rem, 76rem); margin: 2.5rem auto 5rem; }
.tutor-admin-section { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--hub-rule); }
.tutor-admin-budget-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.tutor-admin-budget-grid form { padding: 1.25rem; border: 1px solid var(--hub-rule); border-radius: 0.8rem; }
.tutor-admin-budget-grid h3 { margin: 0; }
.tutor-admin-inline-form { grid-template-columns: minmax(14rem, 1fr) auto; align-items: end; }
[data-feedback-filter].tutor-admin-inline-form { grid-template-columns: minmax(9rem, 0.45fr) minmax(13rem, 0.8fr) minmax(13rem, 1fr) auto auto; }
.tutor-admin-list { margin: 1rem 0 0; padding: 0; list-style: none; }
.tutor-admin-list li { padding: 0.7rem 0; border-bottom: 1px solid var(--hub-rule); }
.tutor-analytics { display: grid; gap: 1.25rem; }
.tutor-frontier-intro { max-width: 50rem; margin: 0; color: var(--hub-soft-ink); }
.tutor-frontier-empty { padding: 2.5rem; border: 1px solid var(--hub-rule); text-align: center; }
.tutor-frontier-empty h3 { margin: 0; }
.tutor-frontier-empty p { margin: 0.45rem 0 0; color: var(--hub-soft-ink); }
.tutor-frontier-chart { min-width: 0; padding: 1.15rem 1.25rem 0.75rem; border: 1px solid var(--hub-rule); }
.tutor-frontier-chart-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 2rem; }
.tutor-frontier-chart-heading h3 { margin: 0; font-size: 1.05rem; }
.tutor-frontier-chart-heading p { margin: 0; color: var(--hub-muted, #64706d); font-size: 0.85rem; }
.tutor-frontier-chart-viewport { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; }
.tutor-frontier-chart svg { display: block; width: 100%; height: auto; margin-top: 0.6rem; overflow: visible; }
.tutor-frontier-grid { stroke: #e6e9e8; stroke-width: 1; }
.tutor-frontier-zero { stroke: #aab3b0; stroke-width: 1.4; }
.tutor-frontier-tick { fill: var(--hub-muted, #64706d); font-size: 11px; font-variant-numeric: tabular-nums; }
.tutor-frontier-axis-label { fill: var(--hub-soft-ink); font-size: 12px; font-weight: 600; }
.tutor-frontier-point { cursor: pointer; }
.tutor-frontier-point:focus-visible { outline: none; }
.tutor-frontier-point-halo { fill: #fff; stroke: #7f8d89; stroke-width: 2; }
.tutor-frontier-point-core { fill: #7f8d89; }
.tutor-frontier-point.is-frontier .tutor-frontier-point-halo { fill: #edf5f2; stroke: var(--hub-blue); stroke-width: 3; }
.tutor-frontier-point.is-frontier .tutor-frontier-point-core { fill: var(--hub-blue); }
.tutor-frontier-point.is-current .tutor-frontier-point-halo { fill: #fff8e8; stroke: #9b6a10; stroke-width: 3; }
.tutor-frontier-point.is-current .tutor-frontier-point-core { fill: #9b6a10; }
.tutor-frontier-point:focus-visible .tutor-frontier-point-halo { stroke-width: 5; }
.tutor-frontier-point-label { fill: var(--hub-ink); font-size: 12px; font-weight: 650; paint-order: stroke; stroke: #fff; stroke-width: 3px; stroke-linejoin: round; }
.tutor-frontier-table-wrap { overflow-x: auto; }
.tutor-frontier-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.tutor-frontier-table th,
.tutor-frontier-table td { padding: 0.72rem 0.65rem; border-bottom: 1px solid var(--hub-rule); text-align: left; vertical-align: top; }
.tutor-frontier-table th { color: var(--hub-soft-ink); font-size: 0.76rem; font-weight: 650; }
.tutor-frontier-table tr.is-dominated { color: var(--hub-muted, #64706d); }
.tutor-frontier-candidate-button { padding: 0; border: 0; background: transparent; color: var(--hub-blue); font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.tutor-frontier-detail { padding: 1.25rem; border-left: 3px solid var(--hub-blue); background: #f8faf9; }
.tutor-frontier-detail > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.tutor-frontier-detail h3 { margin: 0; font-size: 1.1rem; }
.tutor-frontier-detail p { margin: 0.6rem 0 0; color: var(--hub-soft-ink); }
.tutor-frontier-status { flex: 0 0 auto; color: var(--hub-muted, #64706d); font-size: 0.8rem; font-weight: 650; }
.tutor-frontier-status.is-frontier { color: var(--hub-blue); }
.tutor-frontier-detail-actions { display: flex; align-items: center; gap: 0.8rem; margin-top: 0.9rem; }
.tutor-frontier-detail details { margin-top: 0.9rem; }
.tutor-frontier-detail pre { max-height: 24rem; padding: 0.8rem; overflow: auto; background: #edf0ef; white-space: pre-wrap; }
.tutor-frontier-priorities { padding-top: 1rem; border-top: 1px solid var(--hub-rule); }
.tutor-frontier-priorities h3 { margin: 0; }
.tutor-frontier-priorities > p { margin: 0.45rem 0 0; color: var(--hub-soft-ink); }
.tutor-frontier-priorities ol { display: grid; gap: 0.7rem; margin: 1rem 0 0; padding-left: 1.3rem; }
.tutor-frontier-priorities li { padding-left: 0.35rem; }
.tutor-frontier-priorities li strong,
.tutor-frontier-priorities li span { display: block; }
.tutor-frontier-priorities li span { margin-top: 0.18rem; color: var(--hub-soft-ink); }
.tutor-frontier-operations { color: var(--hub-soft-ink); }
.tutor-frontier-operations summary { color: var(--hub-blue); cursor: pointer; font-weight: 600; }
.tutor-frontier-operations p { margin: 0.55rem 0 0; }
.tutor-report-detail,
.tutor-feedback-detail { margin-top: 1.5rem; padding: 1.25rem; border: 1px solid var(--hub-rule); border-radius: 0.8rem; }
.tutor-feedback-transcript { display: grid; gap: 0.75rem; }
.tutor-feedback-transcript article { padding: 0.85rem; border-left: 2px solid var(--hub-rule); background: #fafafa; }
.tutor-feedback-transcript article p { margin: 0.35rem 0 0; white-space: pre-wrap; }

@media (max-width: 900px) {
  .tutor-shell,
  .tutor-lab-shell { grid-template-columns: minmax(0, 1fr); }
  .tutor-history { border-right: 0; border-bottom: 1px solid var(--hub-rule); }
  .tutor-history nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tutor-admin-budget-grid,
  [data-feedback-filter].tutor-admin-inline-form { grid-template-columns: minmax(0, 1fr); }
  .tutor-spec-open,
  .tutor-spec-close { display: inline-block; }
  .tutor-spec-close { float: right; border: 0; background: transparent; color: var(--hub-blue); cursor: pointer; }
  .tutor-spec-panel {
    position: fixed;
    z-index: 51;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(90vw, 25rem);
    overflow-y: auto;
    border-right: 1px solid var(--hub-rule);
    transform: translateX(-105%);
    transition: transform 160ms ease;
  }
  .tutor-spec-backdrop {
    position: fixed;
    z-index: 50;
    inset: 0;
    border: 0;
    background: rgb(21 35 48 / 34%);
  }
  .tutor-lab-shell.is-spec-open .tutor-spec-panel { transform: translateX(0); }
  .tutor-lab-shell.is-spec-open .tutor-spec-backdrop { display: block; }
}

@media (max-width: 680px) {
  .tutor-shell,
  .tutor-lab-shell { width: 100%; margin: 0; border: 0; border-radius: 0; }
  .tutor-comparison-grid { grid-template-columns: minmax(0, 1fr); }
  .tutor-branch + .tutor-branch { border-left: 0; border-top: 1px solid var(--hub-rule); }
  .tutor-spec-grid { grid-template-columns: minmax(0, 1fr); }
  .tutor-frontier-chart { padding-right: 0.65rem; padding-left: 0.35rem; }
  .tutor-frontier-chart-heading { align-items: flex-start; flex-direction: column; gap: 0.35rem; padding-left: 0.65rem; }
  .tutor-frontier-chart svg { width: 42rem; max-width: none; }
  .tutor-frontier-detail > div:first-child { align-items: flex-start; flex-direction: column; gap: 0.35rem; }
  .tutor-header,
  .tutor-lab-header { align-items: flex-start; flex-direction: column; }
  .tutor-lab-header-actions { width: 100%; }
  .tutor-lab-header-actions .hub-secondary-button { flex: 1; }
  .tutor-lab-tabs button[aria-selected="true"]::after { bottom: -1.45rem; }
  .tutor-lab-toolbar { align-items: stretch; flex-direction: column; }
  .tutor-lab-toolbar select { width: 100%; min-width: 0; margin-left: 0; }
  .tutor-spec-summary { align-items: flex-start; flex-direction: column; }
  .tutor-spec-summary details { width: 100%; margin-left: 0; }
  .tutor-composer { margin-right: 0.85rem; margin-bottom: 0.85rem; margin-left: 0.85rem; }
  .tutor-composer-dock { margin-top: -2rem; padding: 2.5rem 0.85rem 0.85rem; }
  .tutor-thread-workspace .tutor-composer {
    width: min(100%, 48rem);
    margin-right: auto;
    margin-left: auto;
  }
}

/* Live questions: quiet launcher, focused runner, and in-page review. */
.hub-live-shell [role="tabpanel"][hidden] { display: none; }
.hub-live-context-tabs { display: flex; gap: 1.7rem; border-bottom: 1px solid var(--hub-rule); margin: 1.5rem 0; }
.hub-live-context-tabs button { padding: 0.8rem 0; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--hub-soft-ink); font: inherit; cursor: pointer; }
.hub-live-context-tabs button[aria-selected="true"] { border-bottom-color: var(--hub-blue); color: var(--hub-blue-strong); }
.hub-live-open-sessions { margin: 1.7rem 0 2rem; }
.hub-live-open-sessions > h2, .hub-live-week-library > h2, .hub-live-weekly-results > h2 { margin: 0 0 1rem; font-size: 1.35rem; color: var(--hub-blue); font-weight: 500; }
.hub-live-open-room, .hub-live-resume { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.2rem 1.4rem; border: 1px solid var(--hub-rule-light); border-radius: 0.5rem; background: var(--hub-paper); margin: 0.7rem 0; }
.hub-live-open-room h3 { margin: 0; color: var(--hub-blue); font-size: 1.12rem; }
.hub-live-open-room p, .hub-live-resume p { margin: 0.35rem 0 0; font-size: 0.88rem; color: var(--hub-soft-ink); }
.hub-live-open-room .hub-live-open-status { color: var(--hub-blue-strong); }
.hub-live-open-status span { font-size: 0.65em; margin-right: 0.3rem; }
.hub-live-open-room > a, .hub-live-resume > a { flex-shrink: 0; }
.hub-live-resume { margin-block: 1.3rem; }
.hub-live-directory { margin-top: 2rem; }
.hub-live-directory > summary { color: var(--hub-blue-strong); cursor: pointer; padding: 0.65rem 0; }
.hub-live-directory > p, .hub-live-directory-row p { color: var(--hub-soft-ink); font-size: 0.9rem; margin: 0.3rem 0; }
.hub-live-directory-row, .hub-live-week-result { display: flex; align-items: center; justify-content: space-between; gap: 1.3rem; padding: 1rem 0; border-bottom: 1px solid var(--hub-rule-light); }
.hub-live-directory-row > a { flex-shrink: 0; }
.hub-live-week-result p { margin: 0.3rem 0; color: var(--hub-soft-ink); font-size: 0.88rem; }
.hub-live-result-week { margin-top: 1.5rem; }
.hub-live-result-week > h3 { font-size: 1.05rem; font-weight: 500; color: var(--hub-blue); }
.hub-live-result-attempt { display: flex; gap: 0.65rem 1.2rem; justify-content: flex-end; flex-wrap: wrap; margin: 0.45rem 0; font-size: 0.88rem; }
.hub-live-result-attempt > span { color: var(--hub-soft-ink); }
.hub-live-week { margin: 1rem 0; }
.hub-live-week > summary { padding: 0.85rem 0; border-bottom: 1px solid var(--hub-rule); cursor: pointer; color: var(--hub-blue); }
.hub-live-week > div { margin-left: 1rem; }
.hub-live-section-picker { display: flex; align-items: center; gap: 0.6rem; font-size: 0.9rem; }
.hub-live-section-picker select { max-width: 22rem; min-width: 0; padding: 0.55rem; background: var(--hub-paper); color: var(--hub-ink); border: 1px solid var(--hub-rule); border-radius: 0.3rem; font: inherit; }
.hub-live-other-rooms { display: flex; gap: 1rem; flex-wrap: wrap; margin: 1rem 0; }
.hub-live-student-history .hub-live-history-row small { display: block; color: var(--hub-soft-ink); margin-top: 0.35rem; }
@media (max-width: 600px) {
  .hub-live-open-room, .hub-live-resume { padding: 1rem; gap: 0.8rem; }
  .hub-live-page-header > .hub-live-row-actions { flex-wrap: wrap; width: 100%; }
  .hub-live-page-header .hub-live-section-picker { flex: 1 1 100%; }
  .hub-live-directory-row, .hub-live-week-result { flex-wrap: wrap; }
  .hub-live-result-attempt { justify-content: flex-start; }
  .hub-live-section-picker { width: 100%; }
  .hub-live-section-picker select { max-width: 100%; flex: 1; font-size: 1rem; }
  .hub-live-context-tabs button { min-height: 44px; }
}
.hub-live-shell {
  width: min(100% - 2rem, 1080px);
  margin: 0 auto;
  padding: clamp(2.5rem, 6vw, 4.75rem) 0 6rem;
}

.hub-live-attendance {
  margin: 0 0 2rem;
  padding: 1rem 0;
  border-block: 1px solid var(--hub-rule-light);
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
}
.hub-live-attendance [hidden] { display: none !important; }
.hub-live-attendance-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem 1.5rem; flex-wrap: wrap; }
.hub-live-attendance-row + .hub-live-attendance-row { margin-top: 0.65rem; }
.hub-live-attendance strong { color: var(--hub-ink); font-weight: 500; }
.hub-live-attendance p { margin: 0.65rem 0; }
.hub-live-attendance h2 { margin: 0; font-size: 1.2rem; }
.hub-live-attendance h3 { margin: 0; font-size: 1rem; }
.hub-live-classroom-form { margin-top: 1.2rem; padding: 1.25rem; background: var(--hub-paper); border: 1px solid var(--hub-rule-light); }
.hub-live-classroom-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-block: 1rem; }
.hub-live-attendance label { display: grid; gap: 0.4rem; }
.hub-live-attendance input, .hub-live-attendance select { width: 100%; min-width: 0; padding: 0.65rem; border: 1px solid var(--hub-rule); border-radius: 3px; background: var(--hub-paper); color: var(--hub-ink); font: inherit; }
.hub-live-attendance-review { margin-top: 1rem; padding-top: 1.25rem; border-top: 1px solid var(--hub-rule-light); }
.hub-live-attendance-search { max-width: 26rem; margin-top: 1rem; }
.hub-live-attendance-help { font-size: 0.8rem; }
.hub-live-attendance-student { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) auto; gap: 1rem; align-items: center; padding: 0.9rem 0; border-bottom: 1px solid var(--hub-rule-light); }
.hub-live-attendance-student small { display: block; color: var(--hub-faint); font-size: 0.8rem; overflow-wrap: anywhere; }
.hub-live-attendance-message:empty { display: none; }
.hub-live-attendance-message.is-error { color: var(--hub-ink); font-weight: 500; }
.hub-live-meeting-history { margin-bottom: 2rem; }
@media (max-width: 600px) {
  .hub-live-classroom-fields { grid-template-columns: 1fr; }
  .hub-live-attendance-student { grid-template-columns: minmax(0, 1fr) auto; gap: 0.6rem; }
  .hub-live-attendance-student > div:first-child { grid-column: 1 / -1; }
  .hub-live-attendance input, .hub-live-attendance select { font-size: 1rem; }
  .hub-live-attendance button { min-height: 44px; }
}

.hub-live-section-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-live-section-context > div {
  display: grid;
  gap: 0.15rem;
}

.hub-live-section-context strong {
  color: var(--hub-blue);
  font-size: 1rem;
}

.hub-live-section-context span {
  color: var(--hub-faint);
  font-size: 0.88rem;
}

.hub-live-section-context a {
  flex: 0 0 auto;
  color: var(--hub-blue-strong);
  font-weight: 600;
}

.hub-live-section-directory {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-live-section-directory > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 0.75rem;
}

.hub-live-section-directory h2,
.hub-live-section-directory p {
  margin: 0;
}

.hub-live-section-directory h2 {
  color: var(--hub-blue);
  font-size: 1.25rem;
}

.hub-live-section-directory p {
  max-width: 36rem;
  color: var(--hub-soft-ink);
  font-size: 0.92rem;
}

.hub-live-section-directory > div {
  display: grid;
}

.hub-live-section-directory > div > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 0;
  border-top: 1px solid var(--hub-rule-light);
  color: var(--hub-ink);
  text-decoration: none;
}

.hub-live-section-directory > div > a:hover strong,
.hub-live-section-directory > div > a.is-current strong {
  color: var(--hub-blue-strong);
}

.hub-live-section-directory > div > a > span:first-child {
  display: grid;
  gap: 0.18rem;
}

.hub-live-section-directory small {
  color: var(--hub-faint);
  font-weight: 400;
}

.hub-live-section-directory > div > a > span:last-child {
  color: var(--hub-faint);
  font-size: 0.88rem;
}

.hub-live-section-directory > div > a > span.is-live {
  color: var(--hub-blue-strong);
  font-weight: 650;
}

.hub-live-page-header,
.hub-live-runner-header,
.hub-live-student-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-live-page-header h1,
.hub-live-student-waiting h1,
.hub-live-student-header h1 {
  margin: 0.18rem 0 0;
  color: var(--hub-blue);
  font-size: clamp(2rem, 5vw, 3.35rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.hub-live-page-header p:last-child,
.hub-live-student-waiting > p:last-child {
  max-width: 42rem;
  margin: 0.8rem 0 0;
  color: var(--hub-soft-ink);
}

.hub-live-eyebrow {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  color: var(--hub-blue-strong);
  font: 600 0.76rem/1.2 var(--font-display);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.hub-live-primary,
.hub-live-tertiary,
.hub-live-link-button {
  appearance: none;
  display: inline-flex;
  min-height: 2.65rem;
  align-items: center;
  justify-content: center;
  padding: 0.62rem 1rem;
  border: 1px solid transparent;
  border-radius: 0.45rem;
  font: 600 0.9rem/1.2 var(--font-display);
  text-decoration: none;
  cursor: pointer;
}

.hub-live-primary {
  border-color: var(--hub-blue);
  background: var(--hub-blue);
  color: #fff;
}

.hub-live-primary:hover { background: var(--hub-blue-strong); }

.hub-live-tertiary,
.hub-live-link-button {
  border-color: var(--hub-rule);
  background: transparent;
  color: var(--hub-blue-strong);
}

.hub-live-tertiary:hover,
.hub-live-link-button:hover { border-color: var(--hub-blue-muted); background: var(--hub-blue-wash); }

.hub-live-primary:disabled,
.hub-live-tertiary:disabled { cursor: not-allowed; opacity: 0.45; }

.hub-live-topics { display: grid; }

.hub-live-topic {
  padding: 2rem 0 0;
}

.hub-live-topic + .hub-live-topic {
  margin-top: 0.5rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-live-topic h2 {
  margin: 0 0 0.4rem;
  color: var(--hub-blue);
  font-size: 1.2rem;
  font-weight: 600;
}

.hub-live-activity-list { display: grid; }

.hub-live-activity {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem;
  align-items: center;
  min-height: 5rem;
  padding: 1rem 0;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-live-activity h3 {
  margin: 0;
  color: var(--hub-ink);
  font-size: 1rem;
  font-weight: 600;
}

.hub-live-activity p {
  margin: 0.28rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.86rem;
}
.hub-live-activity-usage { display: flex; flex-wrap: wrap; gap: 0.25rem 0.7rem; margin-top: 0.45rem; font-size: 0.79rem; }
.hub-live-activity-usage > a { color: var(--hub-blue-strong); text-decoration: none; }
.hub-live-activity-usage > a:hover,
.hub-live-activity-usage span a:hover { text-decoration: underline; }
.hub-live-activity-usage span { color: var(--hub-soft-ink); }
.hub-live-activity-usage span a { color: inherit; }
.hub-live-activity .hub-live-activity-unused { margin-top: 0.45rem; font-size: 0.79rem; }

.hub-live-row-actions,
.hub-live-dialog-actions,
.hub-live-runner-footer > div {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.hub-live-dialog {
  width: min(100% - 2rem, 52rem);
  padding: 0;
  border: 1px solid var(--hub-rule);
  border-radius: 0.65rem;
  box-shadow: 0 1.2rem 3.5rem rgb(26 43 61 / 18%);
}

.hub-live-dialog::backdrop { background: rgb(21 35 48 / 34%); }
.hub-live-dialog-content { position: relative; padding: clamp(1rem, 4vw, 2rem); }
.hub-live-dialog-meta { padding-top: 0.9rem; border-top: 1px solid var(--hub-rule-light); font-size: 0.86rem; }
.hub-live-dialog-actions { justify-content: flex-end; margin-top: 1.5rem; }
.hub-live-dialog-close { position: absolute; top: 0.8rem; right: 0.9rem; border: 0; background: transparent; color: var(--hub-soft-ink); font-size: 1.5rem; cursor: pointer; }

.hub-live-message {
  margin: 0 0 1rem;
  padding: 0.75rem 0.9rem;
  border-left: 3px solid var(--hub-blue);
  background: var(--hub-blue-wash);
  color: var(--hub-blue-strong);
}
.hub-live-message.is-error { border-color: #a43a3a; background: #fff5f5; color: #7d2828; }
.hub-live-preview-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 0.65rem 0.8rem;
  background: var(--hub-blue-wash);
  color: var(--hub-blue-strong);
  font-size: 0.82rem;
}
.hub-live-preview-note button { border: 0; background: transparent; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; }

.hub-live-runner-header { align-items: center; }
.hub-live-runner-header h1 { margin: 0.2rem 0 0; color: var(--hub-blue); font-size: clamp(1.65rem, 4vw, 2.65rem); font-weight: 400; }
.hub-live-runner-metrics { display: flex; gap: 1.5rem; }
.hub-live-runner-metrics > span { display: grid; min-width: 5rem; text-align: right; }
.hub-live-runner-metrics strong { color: var(--hub-ink); font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.hub-live-runner-metrics small { color: var(--hub-soft-ink); font-size: 0.73rem; }

.hub-live-student-progress {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-live-student-progress button {
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 1px solid var(--hub-rule);
  border-radius: 50%;
  background: #fff;
  color: var(--hub-soft-ink);
  cursor: pointer;
}

.hub-live-student-progress button.is-current { border-color: var(--hub-blue); color: var(--hub-blue); }
.hub-live-student-progress button.is-answered { background: var(--hub-blue-wash); }

.hub-live-runner-question,
.hub-live-student-question {
  padding: clamp(2rem, 5vw, 3.5rem) 0;
}

.hub-live-question-heading {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: flex-start;
}
.hub-live-question-heading p,
.hub-live-position { margin: 0 0 0.4rem; color: var(--hub-soft-ink); font-size: 0.82rem; }
.hub-live-question-heading h2,
.hub-live-student-question h2 { margin: 0; color: var(--hub-blue); font-size: clamp(1.55rem, 3vw, 2.15rem); font-weight: 500; }
.hub-live-question-heading > span { color: var(--hub-soft-ink); font-size: 0.85rem; }
.hub-live-prompt { max-width: 58rem; margin: 1.1rem 0 1.6rem; font-size: 1.07rem; line-height: 1.6; }

.hub-live-distribution { display: grid; gap: 0.7rem; }
.hub-live-distribution-row {
  position: relative;
  display: grid;
  min-height: 3.75rem;
  grid-template-columns: 2.2rem minmax(0, 1fr) auto;
  gap: 0.8rem;
  align-items: center;
  overflow: hidden;
  padding: 0.75rem 1rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.55rem;
  background: #fff;
}
.hub-live-distribution-fill {
  position: absolute;
  inset: 0 auto 0 0;
  background: var(--hub-blue-wash);
}
.hub-live-distribution-row > span { position: relative; }
.hub-live-choice-label { display: grid; width: 1.75rem; height: 1.75rem; place-items: center; border: 1px solid var(--hub-blue-muted); border-radius: 50%; color: var(--hub-blue); font-weight: 600; }
.hub-live-choice-copy { line-height: 1.4; }
.hub-live-choice-result {
  color: var(--hub-blue-strong);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hub-live-distribution-row.is-correct { border-color: var(--hub-blue-muted); }
.hub-live-distribution-row.is-own-response { box-shadow: inset 0 0 0 1px var(--hub-blue-muted); }
.hub-live-distribution-row.has-answer-colors.is-correct {
  border-color: rgb(47 124 76 / 48%);
  box-shadow: inset 0 0 0 1px rgb(47 124 76 / 28%);
}
.hub-live-distribution-row.has-answer-colors.is-correct .hub-live-distribution-fill {
  background: rgb(47 124 76 / 20%);
}
.hub-live-distribution-row.has-answer-colors.is-incorrect {
  border-color: rgb(166 74 58 / 32%);
}
.hub-live-distribution-row.has-answer-colors.is-incorrect .hub-live-distribution-fill {
  background: rgb(166 74 58 / 11%);
}
.hub-live-distribution-row.has-answer-colors.is-incorrect-own {
  border-color: rgb(166 74 58 / 48%);
  box-shadow: inset 0 0 0 1px rgb(166 74 58 / 24%);
}
.hub-live-distribution-row.has-answer-colors.is-incorrect-own .hub-live-distribution-fill {
  background: rgb(166 74 58 / 18%);
}

.hub-live-outcome {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0 0 1rem;
  padding: 0.7rem 0.85rem;
  border-left: 3px solid var(--hub-rule);
  background: #fff;
  color: var(--hub-soft-ink);
}
.hub-live-outcome.is-correct {
  border-color: #2f7c4c;
  background: rgb(47 124 76 / 10%);
  color: #245e3a;
}
.hub-live-outcome.is-incorrect {
  border-color: #a65a43;
  background: #fff8f4;
  color: #7a3f2e;
}
.hub-live-outcome > span:last-child { margin-left: auto; font-size: 0.84rem; }

.hub-live-runner-footer,
.hub-live-quiz-footer {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  padding-top: 1.2rem;
  border-top: 1px solid var(--hub-rule);
}
.hub-live-queue { margin-top: 1rem; padding: 0.5rem 1rem; border-left: 2px solid var(--hub-rule); }
.hub-live-queue p { display: grid; grid-template-columns: 2rem 1fr auto; gap: 0.5rem; margin: 0; padding: 0.55rem 0; border-bottom: 1px solid var(--hub-rule-light); }
.hub-live-queue small { color: var(--hub-soft-ink); }

.hub-live-history-list,
.hub-live-review-questions { display: grid; margin-top: 1rem; }
.hub-live-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 2rem;
  gap: 1rem;
  align-items: center;
  padding: 1.1rem 0;
  border-bottom: 1px solid var(--hub-rule);
  color: var(--hub-ink);
  text-decoration: none;
}
.hub-live-history-row > span:first-child { display: grid; gap: 0.2rem; }
.hub-live-history-row small,
.hub-live-history-row > span:nth-child(2) { color: var(--hub-soft-ink); }
.hub-live-review-summary { display: grid; grid-template-columns: repeat(3, 1fr); margin: 1.5rem 0; border-block: 1px solid var(--hub-rule); }
.hub-live-review-summary div { display: grid; padding: 1.2rem 0; text-align: center; }
.hub-live-review-summary div + div { border-left: 1px solid var(--hub-rule); }
.hub-live-review-summary strong { color: var(--hub-blue); font-size: 1.7rem; }
.hub-live-review-summary span { color: var(--hub-soft-ink); font-size: 0.8rem; }
.hub-live-review-questions details { border-bottom: 1px solid var(--hub-rule); }
.hub-live-review-questions summary { display: grid; grid-template-columns: 7rem minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 1.1rem 0; cursor: pointer; }
.hub-live-review-questions summary span,
.hub-live-review-questions summary small { color: var(--hub-soft-ink); font-size: 0.82rem; }
.hub-live-review-questions details > div { padding: 0 0 2rem 8rem; }
.hub-live-review-footer { padding-top: 1.5rem; }
.hub-live-review-footer a { color: var(--hub-blue-strong); }
.hub-live-section-heading { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-top: 2.5rem; }
.hub-live-section-heading h2 { margin: 0.2rem 0 0; color: var(--hub-blue); font-size: 1.45rem; }
.hub-live-section-heading > p { max-width: 30rem; margin: 0; color: var(--hub-soft-ink); font-size: 0.85rem; text-align: right; }
.hub-live-student-result-list { margin-top: 0.8rem; border-top: 1px solid var(--hub-rule); }
.hub-live-student-result-list > details { border-bottom: 1px solid var(--hub-rule); }
.hub-live-student-result-list > details > summary { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 1rem 0; cursor: pointer; }
.hub-live-student-result-list > details > summary > span:first-child { display: grid; gap: 0.15rem; }
.hub-live-student-result-list summary small,
.hub-live-student-result-list > details > summary > span:last-child { color: var(--hub-soft-ink); font-size: 0.82rem; }
.hub-live-student-score-questions { padding: 0 0 1.5rem 1.5rem; }
.hub-live-score-row {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) 6rem 7rem minmax(12rem, 0.8fr) auto;
  gap: 1rem;
  align-items: end;
  padding: 1rem 0;
  border-top: 1px solid var(--hub-rule-light);
}
.hub-live-score-row > div:first-child { display: grid; gap: 0.2rem; }
.hub-live-score-row > div:first-child span,
.hub-live-score-row > div:first-child small,
.hub-live-score-row label span,
.hub-live-score-auto span { color: var(--hub-soft-ink); font-size: 0.75rem; }
.hub-live-score-row label,
.hub-live-score-auto { display: grid; gap: 0.35rem; }
.hub-live-score-row input { min-width: 0; padding: 0.58rem 0.65rem; border: 1px solid var(--hub-rule); border-radius: 0.35rem; font: inherit; }
.hub-live-score-actions { display: flex; gap: 0.5rem; align-items: center; }
.hub-live-score-history { grid-column: 1 / -1; color: var(--hub-soft-ink); font-size: 0.8rem; }
.hub-live-score-history summary { cursor: pointer; }
.hub-live-score-history ul { display: grid; gap: 0.35rem; margin: 0.6rem 0 0; padding: 0; list-style: none; }
.hub-live-score-history li { display: grid; grid-template-columns: 5rem minmax(0, 1fr) auto; gap: 0.75rem; }
.hub-live-score-history small { color: var(--hub-soft-ink); }
.hub-live-question-results-heading { margin-top: 3.5rem; }

.hub-live-student-header { align-items: center; }
.hub-live-student-header > div { display: flex; align-items: center; justify-content: space-between; gap: 2rem; width: 100%; }
.hub-live-student-header strong { color: var(--hub-blue); font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.hub-live-choice-list { display: grid; gap: 0.7rem; margin: 0; padding: 0; border: 0; }
.hub-live-choice,
.hub-choice-response .hub-live-choice {
  position: relative;
  display: grid;
  min-height: 4rem;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem 1rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.55rem;
  background: #fff;
  cursor: pointer;
}
.hub-choice-response .hub-live-choice:hover { border-color: var(--hub-rule); background: #fff; box-shadow: none; transform: none; }
.hub-choice-response .hub-live-choice:has(input:enabled):hover,
.hub-choice-response .hub-live-choice:has(input:checked) { border-color: var(--hub-blue-muted); background: var(--hub-blue-wash); }
.hub-live-choice:has(input:disabled) { cursor: default; }
.hub-live-choice input { width: 1px; height: 1px; margin: 0; }
.hub-live-choice > span[aria-hidden="true"] { display: grid; width: 1.7rem; height: 1.7rem; place-items: center; border: 1px solid var(--hub-blue-muted); border-radius: 50%; color: var(--hub-blue); font-size: 0.8rem; }
.hub-live-choice:has(input:checked) > span[aria-hidden="true"] { color: #fff; border-color: var(--hub-blue); background: var(--hub-blue); }
.hub-live-choice strong { font-weight: 500; line-height: 1.4; }
.hub-live-choice-save { min-height: 1.2rem; margin: 0.6rem 0 0; color: var(--hub-soft-ink); font-size: 0.8rem; }
.hub-live-student-actions { display: flex; align-items: center; gap: 1rem; margin-top: 1.3rem; }
.hub-live-student-actions span,
.hub-live-quiz-footer span { color: var(--hub-soft-ink); font-size: 0.85rem; }
.hub-live-student-progress > div { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.hub-live-student-progress > span { color: var(--hub-soft-ink); font-size: 0.85rem; }
.hub-live-submitted,
.hub-live-student-waiting { max-width: 42rem; margin: 3rem auto; text-align: center; }
.hub-live-submitted h2 { color: var(--hub-blue); font-size: 1.7rem; }
.hub-live-submitted p { color: var(--hub-soft-ink); }
.hub-live-student-history { margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid var(--hub-rule); }
.hub-live-student-history h2 { margin: 0 0 0.5rem; color: var(--hub-blue); font-size: 1.2rem; }
.hub-live-student-history button { display: flex; width: 100%; justify-content: space-between; gap: 1rem; padding: 1rem 0; border: 0; border-bottom: 1px solid var(--hub-rule); background: transparent; color: var(--hub-blue-strong); text-align: left; cursor: pointer; }
.hub-live-student-history button > span:first-child { display: grid; gap: 0.2rem; color: var(--hub-ink); }
.hub-live-student-history small { color: var(--hub-soft-ink); }
.hub-live-empty-copy { margin: 2rem 0; color: var(--hub-soft-ink); }
.hub-live-explanation { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--hub-rule-light); }
.hub-live-explanation h3 { margin: 0 0 0.4rem; color: var(--hub-blue); font-size: 1rem; }
.hub-live-explanation p { margin: 0; color: var(--hub-soft-ink); }

.hub-live-primary:focus-visible,
.hub-live-tertiary:focus-visible,
.hub-live-link-button:focus-visible,
.hub-live-student-progress button:focus-visible,
.hub-live-choice:focus-within {
  outline: 2px solid var(--hub-blue);
  outline-offset: 3px;
}

@media (max-width: 1050px) {
  .hub-live-score-row { grid-template-columns: minmax(14rem, 1fr) 6rem 7rem; }
  .hub-live-score-row label:nth-of-type(2) { grid-column: 1 / 3; }
  .hub-live-score-actions { justify-content: flex-end; }
}

@media (max-width: 700px) {
  .hub-live-section-context,
  .hub-live-section-directory > header,
  .hub-live-page-header,
  .hub-live-runner-header,
  .hub-live-student-header,
  .hub-live-runner-footer,
  .hub-live-quiz-footer { align-items: stretch; flex-direction: column; }
  .hub-live-section-directory > div > a { align-items: flex-start; flex-direction: column; }
  .hub-live-activity { grid-template-columns: 1fr; gap: 0.75rem; }
  .hub-live-row-actions { justify-content: flex-end; }
  .hub-live-runner-metrics { justify-content: space-between; }
  .hub-live-runner-metrics > span { min-width: 0; text-align: left; }
  .hub-live-question-heading { display: block; }
  .hub-live-question-heading > span { display: block; margin-top: 0.5rem; }
  .hub-live-review-summary { grid-template-columns: 1fr; }
  .hub-live-review-summary div + div { border-top: 1px solid var(--hub-rule); border-left: 0; }
  .hub-live-review-questions summary { grid-template-columns: 1fr; gap: 0.25rem; }
  .hub-live-review-questions details > div { padding-left: 0; }
  .hub-live-history-row { grid-template-columns: minmax(0, 1fr) auto; }
  .hub-live-history-row > span:nth-child(2) { display: none; }
  .hub-live-student-header > div { align-items: flex-start; flex-direction: column; gap: 0.75rem; }
  .hub-live-student-progress { align-items: flex-start; flex-direction: column; }
  .hub-live-section-heading,
  .hub-live-student-result-list > details > summary { align-items: flex-start; flex-direction: column; }
  .hub-live-section-heading > p { text-align: left; }
  .hub-live-student-score-questions { padding-left: 0; }
  .hub-live-score-row { grid-template-columns: 1fr 1fr; }
  .hub-live-score-row > div:first-child,
  .hub-live-score-row label:nth-of-type(2),
  .hub-live-score-actions { grid-column: 1 / -1; }
  .hub-live-score-actions { justify-content: flex-start; }
}

.hub-waiting-dots {
  letter-spacing: 0.18rem;
}

.hub-faq-shell {
  width: min(100% - 3rem, 1120px);
  margin: 0 auto;
  padding: 3.4rem 0 6rem;
  display: grid;
  grid-template-columns: 12rem minmax(0, 50rem);
  gap: clamp(3rem, 7vw, 6.5rem);
  justify-content: center;
  align-items: start;
}

.hub-faq-sidebar {
  position: sticky;
  top: calc(var(--topbar-height) + 1.5rem);
  max-height: calc(100vh - var(--topbar-height) - 2rem);
  overflow: auto;
}

.hub-faq-category-links {
  display: grid;
  gap: 0.3rem;
}

.hub-faq-main {
  min-width: 0;
}

.hub-faq-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}

.hub-faq-header h1 {
  margin: 0;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 4.25rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1.02;
}

.hub-faq-header p {
  max-width: 35rem;
  margin: 0.9rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.02rem;
  line-height: 1.5;
}

.hub-faq-ask {
  display: inline-flex;
  align-items: center;
  flex: none;
  text-decoration: none;
  white-space: nowrap;
}

.hub-faq-search {
  display: block;
  margin-top: 2.7rem;
}

.hub-faq-search input {
  width: 100%;
  min-height: 3rem;
  border: 0;
  border-bottom: 1px solid var(--hub-rule);
  border-radius: 0;
  background: #fff;
  color: var(--hub-ink);
  padding: 0.6rem 0;
  font: 0.95rem/1.3 var(--font-body);
}

.hub-faq-search input::placeholder {
  color: var(--hub-faint);
}

.hub-faq-search input:focus {
  border-bottom-color: var(--hub-blue);
  outline: 0;
}

.hub-faq-mobile-categories {
  display: none;
}

.hub-faq-results {
  margin: 1rem 0 0;
  color: var(--hub-faint);
  font-size: 0.8rem;
}

.hub-faq-content {
  margin-top: 3.2rem;
}

.hub-faq-section {
  scroll-margin-top: calc(var(--topbar-height) + 1.5rem);
}

.hub-faq-section + .hub-faq-section {
  margin-top: 3.8rem;
  padding-top: 3.3rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-faq-section > h2 {
  margin: 0 0 1.15rem;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.hub-faq-question-list {
  border-top: 1px solid var(--hub-rule);
}

.hub-faq-question {
  scroll-margin-top: calc(var(--topbar-height) + 1.5rem);
  border-bottom: 1px solid var(--hub-rule);
}

.hub-faq-question summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  min-height: 3.7rem;
  padding: 0.85rem 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.35;
  cursor: pointer;
  list-style: none;
}

.hub-faq-question summary::-webkit-details-marker {
  display: none;
}

.hub-faq-question summary::after {
  color: var(--hub-blue);
  font-size: 1.25rem;
  font-weight: 400;
  content: "+";
}

.hub-faq-question[open] summary::after {
  content: "−";
}

.hub-faq-question summary:hover {
  color: var(--hub-blue);
}

.hub-faq-answer {
  max-width: 44rem;
  padding: 0 2rem 1.25rem 0;
  color: var(--hub-soft-ink);
  font-size: 0.98rem;
  line-height: 1.68;
}

.hub-faq-answer p {
  margin: 0;
}

.hub-faq-answer p + p {
  margin-top: 0.9rem;
}

.hub-faq-answer a {
  color: var(--hub-blue);
  text-underline-offset: 0.17em;
}

.hub-faq-error {
  padding: 1.5rem 0;
  border-top: 1px solid var(--hub-rule);
}

.hub-faq-error h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.2rem;
}

.hub-faq-error p {
  color: var(--hub-soft-ink);
}

.hub-primary-button:focus-visible,
.hub-text-button:focus-visible,
.hub-new-thread:focus-visible,
.hub-all-questions:focus-visible,
.hub-question-index-link:focus-visible,
.hub-thread-link:focus-visible,
.hub-editor-tool:focus-visible,
.hub-reply-action:focus-visible,
.hub-thread-state button:focus-visible,
.hub-editor-cancel:focus-visible,
.hub-send-button:focus-visible,
.hub-primary-link:focus-visible,
.hub-nav-dropdown-link:focus-visible,
.hub-question-faq-link:focus-visible,
.hub-faq-category-links a:focus-visible,
.hub-faq-mobile-categories a:focus-visible,
.hub-faq-question summary:focus-visible,
.hub-faq-search input:focus-visible,
.hub-topic-title a:focus-visible,
.hub-topic-detail-link:focus-visible,
.hub-topic-back:focus-visible,
.hub-topic-section-list a:focus-visible,
.hub-topic-practice-list a:focus-visible,
.hub-topic-resource-list a:focus-visible {
  outline: 2px solid var(--hub-blue);
  outline-offset: 3px;
}

.hub-global-home:focus-visible,
.hub-course-switcher-trigger:focus-visible,
.hub-course-switcher-link:focus-visible,
.hub-directory-course a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

@media (max-width: 1120px) {
  .topbar-inner {
    flex-wrap: wrap;
  }

  body[data-course-section] .topbar-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  body[data-course-section] .site-breadcrumbs {
    grid-row: 1;
    grid-column: 1;
  }

  .hub-primary-nav {
    order: 2;
  }

  body[data-course-section] .hub-primary-nav {
    grid-row: 2;
    grid-column: 1 / -1;
    justify-self: start;
    margin-left: 0;
  }

  body[data-course-section] .hub-account-nav {
    grid-row: 1;
    grid-column: 2;
    margin-left: 0;
  }

  body[data-course-section] .chapter-nav {
    grid-row: 3;
    grid-column: 1 / -1;
  }

  .chapter-nav {
    order: 3;
  }

  .hub-topic-row {
    grid-template-columns:
      2.5rem
      minmax(12rem, 1fr)
      minmax(10rem, 0.82fr)
      minmax(11rem, 0.88fr)
      minmax(8rem, 0.65fr);
    gap: 1.2rem;
  }

  .hub-topic-overview,
  .hub-topic-overview-public {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

}

@media (max-width: 860px) {
  body.is-hub-course-home .page-shell {
    padding-top: 2rem;
  }

  .hub-topic-row {
    grid-template-columns: 2.4rem repeat(3, minmax(0, 1fr));
    gap: 1.2rem 1.4rem;
  }

  .hub-topic-copy {
    grid-column: 2 / -1;
  }

  .hub-topic-notes {
    grid-column: 2;
    padding-top: 1rem;
    border-top: 1px solid var(--hub-rule-light);
  }

  .hub-topic-practice {
    grid-column: 3;
    padding-top: 1rem;
    border-top: 1px solid var(--hub-rule-light);
  }

  .hub-topic-exam {
    grid-column: 4;
    padding-top: 1rem;
    border-top: 1px solid var(--hub-rule-light);
  }

  .hub-topic-row-exam .hub-topic-exam {
    grid-column: 2 / -1;
  }

  .hub-topic-introduction-resources {
    grid-column: 2 / -1;
  }

  .hub-discussion-shell {
    grid-template-columns: 15rem minmax(0, 1fr);
  }

  .hub-thread-sidebar {
    padding-right: 1rem;
    padding-left: 1rem;
  }

  .hub-thread-sidebar-header {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 700px) {
  .site-breadcrumbs {
    gap: 0;
  }

  .hub-global-home {
    font-size: 0.8rem;
  }

  .hub-course-switcher .site-brand-name {
    font-size: 0.98rem;
  }

  .hub-course-switcher-menu {
    left: -2.5rem;
  }

  .hub-directory-shell {
    padding: 3.5rem 1rem 3rem;
  }

  .hub-directory-course-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-directory-course:nth-child(odd) {
    border-right: 0;
  }

  .hub-directory-course a {
    min-height: 10rem;
    padding: 1.5rem 0.25rem;
  }

  .hub-primary-nav {
    width: 100%;
    margin-left: 0;
    flex-wrap: wrap;
    gap: 0.85rem 1.1rem;
    overflow: visible;
    padding-bottom: 0.2rem;
  }

  .hub-nav-dropdown {
    top: calc(100% + 0.52rem);
  }

  .hub-primary-link.is-active::after {
    bottom: -0.25rem;
  }

  body.is-hub-course-home .page-shell {
    padding-right: 1rem;
    padding-left: 1rem;
  }

  .hub-up-next-columns { grid-template-columns: minmax(0, 1fr); }

  .hub-up-next-column {
    padding: 1.3rem 0;
  }

  .hub-up-next-column + .hub-up-next-column {
    border-left: 0;
    border-top: 1px solid var(--hub-rule-light);
  }

  .hub-up-next-context { min-height: 0; }
  .hub-up-next-item { min-height: 0; padding: 0.8rem 0; }

  .hub-topic-row,
  .hub-topic-row.is-current {
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.8rem 1rem;
    padding: 1.75rem 0;
    box-shadow: none;
  }

  .hub-public-note-row {
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.8rem 1rem;
    padding: 1.6rem 0;
  }

  .hub-topic-row.is-current {
    border-left: 2px solid var(--hub-blue);
    padding-left: 0.75rem;
  }

  .hub-topic-copy {
    grid-column: 2;
  }

  .hub-topic-notes,
  .hub-topic-practice,
  .hub-topic-exam {
    grid-column: 2;
    grid-row: auto;
    padding-top: 0.95rem;
    border-top: 1px solid var(--hub-rule-light);
  }

  .hub-topic-title {
    font-size: 1.42rem;
  }

  .hub-topic-shell {
    width: min(100% - 1.7rem, 1080px);
    padding-top: 2rem;
  }

  .hub-topic-back {
    margin-bottom: 1.7rem;
  }

  .hub-topic-page-title {
    font-size: 2.45rem;
  }

  .hub-topic-measures,
  .hub-topic-practice-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-topic-measures {
    gap: 1.15rem;
  }

  .hub-topic-recording-header {
    display: grid;
    gap: 0.75rem;
  }

  .hub-topic-recording-draft {
    justify-self: start;
  }

  .hub-topic-practice-group,
  .hub-topic-practice-group:first-child,
  .hub-topic-practice-group:last-child {
    padding: 0;
  }

  .hub-topic-practice-group + .hub-topic-practice-group {
    margin-top: 1.2rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--hub-rule);
    border-left: 0;
  }

  .hub-topic-section-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.45rem;
  }

  .hub-topic-resource-list a {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .hub-topic-resource-kind {
    grid-column: 1 / -1;
  }

  .hub-module-shell,
  .hub-live-shell,
  .hub-problem-set-shell {
    width: min(100% - 1.7rem, 1080px);
    padding-top: 2rem;
  }

  .hub-problem-set-page-header,
  .hub-problem-set-section-heading,
  .hub-problem-set-summary-item,
  .hub-problem-set-card > header,
  .hub-problem-set-title-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
  }

  .hub-problem-set-summary-item dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.5rem;
  }

  .hub-problem-set-summary-item dl > div {
    text-align: left;
  }

  .hub-problem-set-index-status {
    text-align: left;
  }

  .hub-problem-set-page-header aside {
    padding: 1rem 0 0;
    border-top: 1px solid var(--hub-rule);
    border-left: 0;
  }

  .hub-problem-set-section-heading > p,
  .hub-problem-set-credit {
    text-align: left;
  }

  .hub-problem-set-requirements,
  .hub-problem-set-upload,
  .hub-problem-set-review-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-problem-set-question-content {
    font-size: 0.96rem;
  }

  .hub-problem-set-question-content h2 {
    margin-top: 2.4rem;
    font-size: 1.35rem;
  }

  .hub-problem-set-status-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.65rem;
  }

  .hub-problem-set-form-message {
    grid-column: auto;
  }

  .hub-problem-set-current > div,
  .hub-problem-set-review-item > header {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.6rem;
  }

  .hub-problem-set-results li,
  .hub-problem-set-review-results li {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.35rem 0.8rem;
  }

  .hub-problem-set-results li small,
  .hub-problem-set-review-results li small {
    grid-column: 1 / -1;
  }

  .hub-problem-set-history li {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .hub-problem-set-history li > :last-child {
    grid-column: 1 / -1;
  }

  .hub-task-title,
  .hub-live-question h1 {
    font-size: 2rem;
  }

  .hub-practice-index-heading,
  .hub-practice-index-list > li {
    grid-template-columns: 1fr;
    gap: 0.9rem;
  }

  .hub-practice-index-section {
    margin-top: 3rem;
  }

  .hub-task-prompt,
  .hub-live-question-prompt {
    font-size: 1rem;
  }

  .hub-upload-zone {
    min-height: 12rem;
  }

  .hub-part-upload-zone {
    min-height: 9rem;
  }

  .hub-part-response-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.3rem;
  }

  .hub-form-actions,
  .hub-live-submit-row {
    align-items: stretch;
    flex-direction: column;
  }

  .hub-primary-button {
    width: 100%;
  }

  .hub-question-index {
    width: min(100% - 1.7rem, 1080px);
    padding-top: 2.3rem;
  }

  .hub-ask-tabs {
    width: min(100% - 1.7rem, 1080px);
    overflow-x: auto;
  }

  .hub-question-index-header { align-items: center; gap: 1rem; }
  .hub-question-index-actions { gap: 0.7rem; }
  .hub-question-index-actions .hub-primary-button { width: auto; }
  .hub-question-toolbar { margin-top: 1.5rem; gap: 0.8rem; }
  .hub-question-index-link { gap: 0.8rem; padding: 1.15rem 0; grid-template-columns: minmax(0, 1fr) 9.5rem; }
  .hub-discussion-shell {
    display: block;
  }

  .hub-thread-sidebar {
    padding: 1rem 0.85rem;
    border-right: 0;
    border-bottom: 1px solid var(--hub-rule);
    overflow-x: auto;
  }

  .hub-thread-sidebar-header {
    align-items: center;
    flex-direction: row;
    margin-bottom: 0.8rem;
  }

  .hub-thread-list {
    display: flex;
    gap: 0.4rem;
    min-width: max-content;
  }

  .tutor-thread-group { display: flex; gap: 0.4rem; }
  .tutor-thread-group + .tutor-thread-group { margin-top: 0; }
  .tutor-thread-group-label { display: none; }

  .hub-thread-link {
    width: 15rem;
    min-height: 5rem;
    border-top: 2px solid transparent;
    border-left: 0;
    background: #fff;
  }

  .hub-thread-link.is-active {
    border-top-color: var(--hub-blue);
  }

  .hub-thread-main {
    padding: 1.7rem 0.85rem 3rem;
  }

  .hub-thread-header-topline {
    align-items: flex-start;
  }

  .hub-reply-children {
    padding: 1rem;
  }
  [data-reply-list], .hub-editor.is-answer { margin-left: 0; }
  .hub-reply { padding: 1rem; }
  .hub-thread-actions .hub-thread-answer { width: auto; }

  .hub-new-question-fields {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.8rem;
  }

  .hub-editor-toolbar {
    overflow-x: auto;
  }

  .hub-live-status {
    margin-bottom: 1.8rem;
  }

  .hub-choice {
    min-height: 4.7rem;
    grid-template-columns: 1.7rem minmax(0, 1fr);
    gap: 0.65rem;
  }

  .hub-choice-text {
    font-size: 0.98rem;
  }

  .hub-result-row {
    gap: 0.65rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-upload-zone {
    transition: none;
  }
}

/* Identity and class access */

.hub-account-page {
  min-height: 100vh;
  background: #fff;
}

.hub-account-shell {
  width: min(100% - 2rem, 620px);
  margin: 0 auto;
  padding: clamp(4.5rem, 10vh, 8rem) 0 5rem;
}

.hub-account-context {
  margin: 0 0 0.8rem;
  color: var(--hub-blue);
  font-size: 0.9rem;
  font-weight: 600;
}

.hub-account-shell h1 {
  max-width: 34rem;
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 7vw, 4.2rem);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1.02;
}

.hub-access-page {
  background: var(--page-bg, #fff);
}

.hub-access-page .hub-account-shell h1 {
  color: var(--heading, var(--hub-ink));
}

.hub-account-intro {
  max-width: 34rem;
  margin: 1.35rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.08rem;
  line-height: 1.65;
}

.hub-google-button {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin-top: 2.4rem;
  padding: 0.82rem 1.15rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.25rem;
  color: var(--hub-ink);
  background: #fff;
  font-family: var(--font-display);
  font-weight: 500;
  text-decoration: none;
}

.hub-google-button:hover {
  border-color: var(--hub-blue-muted);
  color: var(--hub-blue);
}

.hub-google-mark {
  display: grid;
  width: 1.45rem;
  height: 1.45rem;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--hub-blue);
  font-size: 0.75rem;
  font-weight: 700;
}

.hub-account-note {
  max-width: 34rem;
  margin: 1.25rem 0 0;
  color: var(--hub-faint);
  font-size: 0.88rem;
  line-height: 1.55;
}

.hub-account-back {
  display: inline-block;
  margin-top: 2.6rem;
  color: var(--hub-blue);
  font-size: 0.92rem;
  text-decoration: none;
}

.hub-account-signout {
  margin-left: auto;
  border: 0;
  color: var(--hub-soft-ink);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.hub-account-profile {
  display: flex;
  align-items: center;
  gap: 1.15rem;
}

.hub-account-profile-avatar {
  flex: 0 0 auto;
  display: block;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  object-fit: cover;
}

.hub-account-profile .hub-account-avatar-fallback {
  flex: 0 0 auto;
  width: 4.5rem;
  height: 4.5rem;
  font-size: 1.6rem;
}

.hub-account-profile h1 {
  font-size: clamp(2rem, 5vw, 3.2rem);
}

.hub-account-email {
  margin: 0.4rem 0 0;
  color: var(--hub-soft-ink);
}

.hub-account-course-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0;
  padding: 1.3rem 0;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
}

[data-account-course-list] {
  display: grid;
  gap: 2.25rem;
  margin-top: 3rem;
}

.hub-account-quarter > h2 {
  margin: 0 0 0.75rem;
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
}

[data-account-course-list] .hub-account-course-status + .hub-account-course-status {
  border-top: 0;
}

.hub-account-notifications {
  margin-top: 2.25rem;
  padding-bottom: 1.3rem;
  border-bottom: 1px solid var(--hub-rule);
}

.hub-account-notifications h2 {
  margin: 0 0 0.75rem;
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
}

.hub-account-notifications p { margin: 0 0 0.6rem; }

.hub-reminder-assignment-list { list-style: none; padding: 0; margin: 1.5rem 0; }
.hub-reminder-assignment-list li { padding: 0.65rem 0; border-bottom: 1px solid var(--hub-rule); }
.hub-reminder-assignment-list a { display: flex; align-items: center; min-height: 2.75rem; overflow-wrap: anywhere; }
.hub-reminder-assignment-list p { margin: 0.25rem 0; color: var(--hub-soft-ink); }
.hub-account-push-state { color: var(--hub-soft-ink); font-size: 0.92rem; }
.hub-account-push-error { color: #a2362a; font-size: 0.88rem; }

.hub-phone-setup { margin-top: 1rem; border-top: 1px solid var(--hub-rule-light); border-bottom: 1px solid var(--hub-rule-light); }
.hub-phone-setup summary { padding: 0.8rem 0; cursor: pointer; font-weight: 600; min-height: 2.75rem; }
.hub-phone-setup-content { padding: 0.25rem 0 1rem; }
.hub-phone-setup h3 { margin: 1.2rem 0 0.5rem; font-size: 1.05rem; }
.hub-phone-setup ol { padding-left: 1.5rem; margin: 0.5rem 0 0.8rem; }
.hub-phone-setup li { margin-bottom: 0.45rem; }

.hub-assignment-reminders { margin-top: 1.5rem; }
.hub-reminder-course { padding: 1rem 0; border-top: 1px solid var(--hub-rule-light); }
.hub-reminder-course h4 { margin: 0 0 0.25rem; font-size: 1.1rem; }
.hub-reminder-course > p { color: var(--hub-soft-ink); }
.hub-reminder-rows { display: grid; gap: 0.9rem; margin: 1rem 0; }
.hub-reminder-row { border: 0; padding: 0; margin: 0; }
.hub-reminder-row legend { padding: 0; font-weight: 600; margin-bottom: 0.25rem; }
.hub-reminder-row label { display: inline-flex; align-items: center; gap: 0.4rem; margin: 0 1.5rem 0 0; min-height: 2.75rem; }
.hub-reminder-row input { accent-color: var(--hub-blue); }

.hub-account-card-label {
  margin: 0 0 0.25rem;
  color: var(--hub-soft-ink);
  font-size: 0.85rem;
  font-weight: 600;
}

.hub-account-course-status > .hub-text-link { white-space: nowrap; }

@media (max-width: 40rem) {
  /* The course action drops below the details on phones. */
  .hub-account-course-status { flex-wrap: wrap; }
  .hub-account-course-status > div { flex: 1 1 100%; }
}

.hub-account-course-status h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 500;
}

.hub-text-link {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.9rem;
  text-decoration: none;
}

.hub-text-link:hover {
  color: var(--hub-blue-strong);
}

.hub-account-signout-page {
  display: block;
  margin: 2rem 0 0;
  padding: 0;
}

.hub-account-identity {
  margin: 1.6rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.92rem;
}

.hub-code-form {
  margin-top: 2.2rem;
}

.hub-code-form label,
.hub-instructor-code label {
  display: block;
  margin-bottom: 0.55rem;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  font-weight: 600;
}

.hub-code-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
}

.hub-code-entry input {
  min-width: 0;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--hub-rule);
  border-radius: 0.2rem;
  color: var(--hub-ink);
  background: #fff;
  font: inherit;
}

.hub-code-form input {
  font-family: var(--font-display);
  font-size: 1.05rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hub-account-message {
  margin: 1rem 0 0;
  color: #9a3e34;
  font-size: 0.92rem;
}

.hub-account-message[data-type="success"] {
  color: var(--hub-success);
}

.hub-account-continue {
  display: inline-flex;
  width: auto;
  margin-top: 2rem;
  text-decoration: none;
}

.hub-instructor-code {
  margin-top: 4rem;
  padding-top: 2rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-instructor-code h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 500;
}

.hub-instructor-code > p {
  margin: 0.65rem 0 1.4rem;
  color: var(--hub-soft-ink);
}

.hub-created-code {
  margin-top: 1.5rem;
  padding: 1.15rem 0;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
}

.hub-created-code p {
  margin: 0 0 0.35rem;
  color: var(--hub-faint);
  font-size: 0.82rem;
}

.hub-created-code strong {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.hub-instructor-shell {
  width: min(100% - 3rem, 1280px);
  margin: 0 auto;
  padding: 3.8rem 0 6rem;
}

.hub-recording-upload-shell {
  max-width: 880px;
}

.hub-recording-upload-shell > .status-card,
.hub-recording-upload-form,
.hub-recording-upload-status {
  margin-top: 2rem;
}

.hub-recording-upload-form {
  display: grid;
  gap: 1.5rem;
  padding: 1.5rem;
  border: 1px solid var(--hub-rule);
  border-radius: 10px;
  background: var(--hub-paper);
}

.hub-recording-upload-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.1rem 1.25rem;
}

.hub-recording-upload-fields label {
  display: grid;
  gap: 0.4rem;
  color: var(--hub-soft-ink);
  font-size: 0.86rem;
  font-weight: 600;
}

.hub-recording-upload-fields input {
  min-width: 0;
  padding: 0.72rem 0.8rem;
  border: 1px solid var(--hub-rule);
  border-radius: 7px;
  background: var(--hub-paper);
  color: var(--hub-ink);
  font: inherit;
  font-weight: 400;
}

.hub-recording-upload-button {
  justify-self: start;
}

.hub-recording-upload-status progress {
  width: 100%;
  margin-top: 0.9rem;
}

.hub-instructor-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}

.hub-instructor-header > div > p:first-child {
  margin: 0 0 0.75rem;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 500;
}

.hub-instructor-header h1 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 5vw, 4.25rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
}

.hub-instructor-header > div > p:last-child {
  max-width: 36rem;
  margin: 1rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 1.03rem;
  line-height: 1.55;
}

.hub-offering-selector {
  display: grid;
  gap: 0.4rem;
  min-width: 12rem;
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
}

.hub-offering-selector select {
  min-width: 12rem;
  padding: 0.68rem 2.25rem 0.68rem 0.75rem;
  border: 1px solid var(--hub-rule);
  border-radius: 7px;
  background: var(--hub-paper);
  color: var(--hub-ink);
  font: inherit;
}

.hub-offering-selector small:empty {
  display: none;
}

.hub-instructor-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 3rem;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
}

.hub-instructor-summary > div {
  display: grid;
  gap: 0.35rem;
  padding: 1.5rem 2rem;
}

.hub-instructor-summary > div:first-child {
  padding-left: 0;
}

.hub-instructor-summary > div + div {
  border-left: 1px solid var(--hub-rule);
}

.hub-instructor-summary strong {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -0.03em;
}

.hub-instructor-summary span {
  color: var(--hub-soft-ink);
  font-size: 0.9rem;
}

.hub-roster {
  margin-top: 3.5rem;
}

.hub-course-codes {
  margin-top: 3.5rem;
}

.hub-course-code-list {
  display: grid;
  border-top: 1px solid var(--hub-rule);
}

.hub-course-code-list article {
  display: grid;
  grid-template-columns: minmax(12rem, 0.8fr) minmax(14rem, 1fr) auto;
  gap: 1.5rem;
  align-items: center;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-course-code-list article.is-inactive {
  opacity: 0.62;
}

.hub-course-code-value,
.hub-course-code-meta {
  display: grid;
  gap: 0.3rem;
}

.hub-course-code-value code {
  color: var(--hub-blue-strong);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.hub-course-code-value span,
.hub-course-code-meta span,
.hub-course-code-form small {
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-course-code-meta strong {
  color: var(--hub-ink);
  font-size: 0.9rem;
  font-weight: 600;
}

.hub-course-code-actions {
  display: flex;
  gap: 1rem;
}

.hub-course-code-actions button {
  padding: 0;
  border: 0;
  background: none;
  color: var(--hub-blue);
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.hub-course-code-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  align-items: end;
  margin-top: 1.3rem;
}

.hub-course-code-form label {
  display: grid;
  gap: 0.35rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  font-weight: 600;
}

.hub-course-code-form input,
.hub-course-code-form select {
  min-width: min(22rem, 70vw);
  padding: 0.68rem 0.75rem;
  border: 1px solid var(--hub-rule);
  border-radius: 6px;
  background: var(--hub-paper);
  color: var(--hub-ink);
  font: inherit;
  font-weight: 400;
}

.hub-course-code-form select { min-width: 12rem; }

.hub-course-code-form small {
  flex-basis: 100%;
}

.hub-course-code-message {
  min-height: 1.4rem;
  margin: 0.75rem 0 0;
  color: var(--hub-blue);
}

.hub-course-code-message.is-error {
  color: #8b2f2f;
}

.hub-roster-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 1.1rem;
}

.hub-roster-title h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.8rem;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.hub-roster-title p {
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.88rem;
}

.hub-roster-panel > .hub-roster-toggle {
  flex-direction: row;
  align-items: center;
  border-bottom: 1px solid var(--hub-rule);
  cursor: pointer;
  list-style: none;
}

.hub-roster-toggle::-webkit-details-marker {
  display: none;
}

.hub-roster-toggle:focus-visible {
  outline: 2px solid var(--hub-blue);
  outline-offset: 4px;
}

.hub-roster-toggle-copy {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--hub-blue);
  font-size: 0.88rem;
  white-space: nowrap;
}

.hub-roster-toggle-copy::after {
  content: "+";
  font-size: 1.2rem;
}

.hub-roster-panel[open] > .hub-roster-toggle {
  border-bottom: 0;
}

.hub-roster-panel[open] .hub-roster-toggle-copy::after {
  content: "−";
}

.hub-roster-panel:not([open]) .hub-roster-when-open,
.hub-roster-panel[open] .hub-roster-when-closed {
  display: none;
}

.hub-roster-columns,
.hub-roster-link,
.hub-roster-row {
  display: grid;
  grid-template-columns:
    minmax(13rem, 1.8fr)
    minmax(9rem, 1.1fr)
    minmax(4.5rem, 0.5fr)
    minmax(6.5rem, 0.7fr)
    minmax(4.5rem, 0.5fr)
    minmax(7rem, 0.72fr)
    1rem;
  gap: 1.2rem;
  align-items: center;
}

.hub-roster-columns.is-tester-managed,
.hub-roster-row {
  grid-template-columns:
    minmax(13rem, 1.8fr)
    minmax(9rem, 1.1fr)
    minmax(4.5rem, 0.5fr)
    minmax(6.5rem, 0.7fr)
    minmax(4.5rem, 0.5fr)
    minmax(7rem, 0.72fr)
    minmax(8rem, 0.75fr);
}

.hub-roster-columns {
  padding: 0.65rem 0;
  border-top: 1px solid var(--hub-rule);
  color: var(--hub-faint);
  font-size: 0.76rem;
}

.hub-roster-list,
.hub-student-record-list,
.hub-student-attempt-list,
.hub-student-discussion-list,
.hub-student-timeline {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-roster-item {
  border-top: 1px solid var(--hub-rule-light);
}

.hub-roster-item:last-child {
  border-bottom: 1px solid var(--hub-rule);
}

.hub-roster-link {
  padding: 1.15rem 0;
  color: inherit;
  text-decoration: none;
}

.hub-roster-row {
  padding: 1.15rem 0;
}

.hub-roster-link:hover .hub-roster-student strong,
.hub-roster-student-link:hover strong {
  color: var(--hub-blue);
}

.hub-roster-student-link {
  color: inherit;
  text-decoration: none;
}

.hub-roster-student-link:focus-visible {
  border-radius: 2px;
  outline: 2px solid var(--hub-blue);
  outline-offset: 4px;
}

.hub-roster-link:focus-visible {
  outline: 2px solid var(--hub-blue);
  outline-offset: 4px;
}

.hub-roster-student {
  display: grid;
  min-width: 0;
  gap: 0.2rem;
}

.hub-roster-student strong {
  overflow: hidden;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 0.98rem;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-roster-student small {
  overflow: hidden;
  color: var(--hub-faint);
  font-size: 0.78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hub-class-progress {
  display: grid;
  grid-template-columns: minmax(3.5rem, 1fr) 2.5rem;
  gap: 0.65rem;
  align-items: center;
}

.hub-class-progress-track {
  display: block;
  height: 0.32rem;
  overflow: hidden;
  background: var(--hub-rule-light);
}

.hub-class-progress-track > span {
  display: block;
  height: 100%;
  background: var(--hub-blue);
}

.hub-class-progress strong {
  color: var(--hub-soft-ink);
  font-size: 0.78rem;
  font-weight: 500;
  text-align: right;
}

.hub-roster-value,
.hub-roster-activity {
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
}

.hub-roster-disclosure {
  color: var(--hub-faint);
  font-size: 1rem;
}

.hub-roster-tester {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.55rem;
  align-items: baseline;
  min-width: 0;
}

.hub-roster-tester > span {
  color: var(--hub-faint);
  font-size: 0.8rem;
}

.hub-roster-tester > span.is-tester {
  color: var(--hub-blue-strong);
  font-weight: 600;
}

.hub-roster-tester button {
  padding: 0;
  border: 0;
  background: none;
  color: var(--hub-blue);
  font: inherit;
  font-size: 0.76rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.hub-roster-tester button:disabled {
  color: var(--hub-faint);
  cursor: wait;
}

.hub-roster-tester small {
  flex-basis: 100%;
  color: var(--hub-blue);
  font-size: 0.72rem;
}

.hub-roster-tester small:empty {
  display: none;
}

.hub-roster-tester small.is-error {
  color: #8b2f2f;
}

.hub-roster-empty {
  margin: 0;
  padding: 2rem 0;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
  color: var(--hub-soft-ink);
}

.hub-course-staff {
  margin-top: 4rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-course-staff-forms {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 2rem;
  margin-top: 1.5rem;
}

.hub-course-staff-forms form {
  display: grid;
  align-content: start;
  gap: 1rem;
  padding: 1.4rem;
  border: 1px solid var(--hub-rule);
}

.hub-course-staff-forms h3,
.hub-course-section-list h3,
.hub-course-ta-list h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 600;
}

.hub-course-staff-forms label {
  display: grid;
  gap: 0.35rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  font-weight: 600;
}

.hub-course-staff-forms input,
.hub-course-staff-forms select {
  min-width: 0;
  padding: 0.68rem 0.75rem;
  border: 1px solid var(--hub-rule);
  border-radius: 6px;
  background: var(--hub-paper);
  color: var(--hub-ink);
  font: inherit;
  font-weight: 400;
}

.hub-course-staff-forms button {
  justify-self: start;
}

.hub-ta-section-choices {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.hub-ta-section-choices legend {
  margin-bottom: 0.65rem;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  font-weight: 600;
}

.hub-course-staff-forms .hub-ta-section-choice {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  cursor: pointer;
}

.hub-ta-section-choice input[type="checkbox"] {
  flex: none;
  width: 1rem;
  height: 1rem;
  margin: 0.15rem 0 0;
  padding: 0;
  accent-color: var(--hub-blue);
}

.hub-ta-section-choice span {
  display: grid;
  gap: 0.15rem;
}

.hub-ta-section-choice small {
  font-weight: 400;
}

.hub-course-staff-forms small,
.hub-course-section-list p,
.hub-course-ta-list small {
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-course-staff-message {
  min-height: 1.4rem;
  margin: 1rem 0 0;
  color: var(--hub-blue);
}

.hub-course-staff-message.is-error {
  color: #8b2f2f;
}

.hub-course-section-list {
  display: grid;
  margin-top: 2rem;
  border-top: 1px solid var(--hub-rule);
}

.hub-course-section-list > article {
  display: grid;
  grid-template-columns: minmax(12rem, 0.8fr) minmax(0, 1.2fr);
  gap: 2rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-course-section-list p {
  margin: 0.3rem 0 0;
}

.hub-course-section-staff {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.55rem;
}

.hub-course-section-staff span {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--hub-rule-light);
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
}

.hub-course-section-staff button,
.hub-course-ta-list button {
  padding: 0;
  border: 0;
  background: none;
  color: var(--hub-blue);
  font: inherit;
  font-size: 0.76rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.hub-course-section-staff .hub-course-section-archive {
  flex-basis: 100%;
  margin-left: auto;
  text-align: right;
}

.hub-course-ta-list {
  margin-top: 2.5rem;
}

.hub-course-ta-list ul {
  margin: 0.8rem 0 0;
  padding: 0;
  border-top: 1px solid var(--hub-rule);
  list-style: none;
}

.hub-course-ta-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-course-ta-list li > span {
  display: grid;
  gap: 0.15rem;
}

.hub-student-profile-shell {
  width: min(100% - 3rem, 1180px);
  margin: 0 auto;
  padding: 3.2rem 0 6rem;
}

.hub-student-profile-back {
  display: inline-block;
  margin-bottom: 2.4rem;
  color: var(--hub-blue);
  font-size: 0.9rem;
  text-decoration: none;
}

.hub-student-profile-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}

.hub-student-profile-header h1 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 4.4rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
}

.hub-student-profile-email {
  margin: 0.85rem 0 0;
  color: var(--hub-soft-ink);
  font-size: 0.96rem;
}

.hub-student-profile-dates {
  display: grid;
  gap: 0.3rem;
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.82rem;
  text-align: right;
}

.hub-student-profile-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 2.8rem;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
}

.hub-student-profile-summary > div {
  display: grid;
  gap: 0.35rem;
  padding: 1.35rem 1.8rem;
}

.hub-student-profile-summary > div:first-child {
  padding-left: 0;
}

.hub-student-profile-summary > div + div {
  border-left: 1px solid var(--hub-rule);
}

.hub-student-profile-summary strong {
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.hub-student-profile-summary span {
  color: var(--hub-soft-ink);
  font-size: 0.84rem;
}

.hub-student-record-section {
  margin-top: 3.8rem;
}

.hub-student-record-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1rem;
}

.hub-student-record-heading h2 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.hub-student-record-heading p {
  max-width: 34rem;
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.84rem;
  text-align: right;
}

.hub-student-topic-record {
  display: grid;
  grid-template-columns: minmax(15rem, 1.45fr) minmax(10rem, 0.85fr) minmax(20rem, 1.55fr);
  gap: 2rem;
  align-items: start;
  padding: 1.35rem 0;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-student-topic-record:first-child {
  border-top-color: var(--hub-rule);
}

.hub-student-topic-record:last-child {
  border-bottom: 1px solid var(--hub-rule);
}

.hub-student-topic-title {
  display: grid;
  gap: 0.3rem;
}

.hub-student-topic-title strong {
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 500;
}

.hub-student-topic-title small {
  color: var(--hub-faint);
  font-size: 0.76rem;
}

.hub-student-completion-list {
  display: grid;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-student-completion-list li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
}

.hub-student-completion-list strong {
  color: var(--hub-ink);
  font-weight: 500;
}

.hub-student-completed-items {
  grid-column: 1 / -1;
  margin: 0.25rem 0 0;
  color: var(--hub-faint);
  font-size: 0.74rem;
  line-height: 1.45;
}

.hub-student-attempt-group,
.hub-student-discussion-item,
.hub-student-timeline li {
  border-top: 1px solid var(--hub-rule-light);
}

.hub-student-attempt-group:first-child,
.hub-student-discussion-item:first-child,
.hub-student-timeline li:first-child {
  border-top-color: var(--hub-rule);
}

.hub-student-attempt-group:last-child,
.hub-student-discussion-item:last-child,
.hub-student-timeline li:last-child {
  border-bottom: 1px solid var(--hub-rule);
}

.hub-student-attempt-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 1.5rem;
  align-items: baseline;
  padding: 1.1rem 0;
}

.hub-student-attempt-header h3 {
  margin: 0;
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 500;
}

.hub-student-attempt-header p,
.hub-student-attempt-header time {
  margin: 0;
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-student-attempts {
  margin: 0 0 1.2rem 1.25rem;
  padding-left: 1.25rem;
  border-left: 1px solid var(--hub-blue-muted);
}

.hub-student-attempts details {
  padding: 0.7rem 0;
  border-top: 1px solid var(--hub-rule-light);
}

.hub-student-attempts details:first-child {
  border-top: 0;
}

.hub-student-attempts summary {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--hub-soft-ink);
  font-size: 0.8rem;
  cursor: pointer;
}

.hub-student-attempt-feedback {
  display: grid;
  gap: 0.55rem;
  max-width: 56rem;
  padding: 0.9rem 0 0;
}

.hub-student-attempt-feedback p {
  margin: 0;
  color: var(--hub-soft-ink);
  font-size: 0.82rem;
  line-height: 1.5;
}

.hub-student-attempt-feedback strong {
  color: var(--hub-ink);
  font-weight: 600;
}

.hub-student-discussion-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 1.5rem;
  align-items: baseline;
  padding: 1rem 0;
}

.hub-student-discussion-item a {
  color: var(--hub-ink);
  font-family: var(--font-display);
  font-weight: 500;
  text-decoration: none;
}

.hub-student-discussion-item a:hover {
  color: var(--hub-blue);
}

.hub-student-discussion-item span,
.hub-student-discussion-item time {
  color: var(--hub-faint);
  font-size: 0.78rem;
}

.hub-student-discussion-subsection + .hub-student-discussion-subsection {
  margin-top: 2.2rem;
}

.hub-student-discussion-subsection h3 {
  margin: 0 0 0.7rem;
  color: var(--hub-soft-ink);
  font-size: 0.88rem;
  font-weight: 600;
}

.hub-student-timeline li {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr) auto;
  gap: 1.3rem;
  align-items: baseline;
  padding: 0.9rem 0;
}

.hub-student-timeline time,
.hub-student-timeline span {
  color: var(--hub-faint);
  font-size: 0.76rem;
}

.hub-student-timeline strong {
  color: var(--hub-ink);
  font-weight: 500;
}

.hub-student-record-empty {
  margin: 0;
  padding: 1.4rem 0;
  border-top: 1px solid var(--hub-rule);
  border-bottom: 1px solid var(--hub-rule);
  color: var(--hub-faint);
  font-size: 0.88rem;
}

@media (max-width: 1000px) {
  .hub-roster-columns {
    display: none;
  }

  .hub-roster-item:first-child {
    border-top: 1px solid var(--hub-rule);
  }

  .hub-roster-link {
    grid-template-columns: minmax(12rem, 1.5fr) minmax(8rem, 1fr) repeat(3, 3.2rem) 6.5rem 1rem;
  }

  .hub-roster-row {
    grid-template-columns: minmax(12rem, 1.5fr) minmax(8rem, 1fr) repeat(3, 3.2rem) 6.5rem minmax(7.5rem, 0.75fr);
  }

  .hub-student-topic-record {
    grid-template-columns: minmax(12rem, 1fr) minmax(8rem, 0.8fr) minmax(16rem, 1.35fr);
    gap: 1.2rem;
  }
}

@media (max-width: 760px) {
  .hub-instructor-shell {
    width: min(100% - 2rem, 1280px);
    padding-top: 2.5rem;
  }

  .hub-instructor-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .hub-recording-upload-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-instructor-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-instructor-summary > div,
  .hub-instructor-summary > div:first-child {
    padding: 1rem 0;
  }

  .hub-instructor-summary > div + div {
    border-top: 1px solid var(--hub-rule-light);
    border-left: 0;
  }

  .hub-roster-title {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.4rem;
  }

  .hub-roster-link {
    grid-template-columns: minmax(0, 1fr) 7rem 1rem;
    gap: 0.8rem;
  }

  .hub-roster-row {
    grid-template-columns: minmax(0, 1fr) 7rem minmax(7.5rem, auto);
    gap: 0.8rem;
  }

  .hub-roster-value,
  .hub-roster-activity {
    display: none;
  }

  .hub-course-staff-forms,
  .hub-course-section-list > article,
  .hub-course-code-list article {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-course-code-actions {
    justify-content: flex-start;
  }

  .hub-course-section-staff {
    justify-content: flex-start;
  }

  .hub-course-section-staff .hub-course-section-archive {
    margin-left: 0;
    text-align: left;
  }

  .hub-student-profile-shell {
    width: min(100% - 2rem, 1180px);
    padding-top: 2.3rem;
  }

  .hub-student-profile-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 1rem;
  }

  .hub-student-profile-dates {
    text-align: left;
  }

  .hub-student-profile-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hub-student-profile-summary > div,
  .hub-student-profile-summary > div:first-child {
    padding: 1rem 0;
    border-top: 1px solid var(--hub-rule-light);
    border-left: 0;
  }

  .hub-student-profile-summary > div:nth-child(odd) {
    padding-right: 1rem;
  }

  .hub-student-profile-summary > div:nth-child(even) {
    padding-left: 1rem;
    border-left: 1px solid var(--hub-rule-light);
  }

  .hub-student-record-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.4rem;
  }

  .hub-student-record-heading p {
    text-align: left;
  }

  .hub-student-topic-record {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.9rem;
  }

  .hub-student-attempt-header,
  .hub-student-discussion-item {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.4rem 1rem;
  }

  .hub-student-attempt-header time,
  .hub-student-discussion-item time {
    grid-column: 1 / -1;
  }

  .hub-student-timeline li {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.3rem 1rem;
  }

  .hub-student-timeline time {
    grid-column: 1 / -1;
    grid-row: 2;
  }

}

@media (max-width: 560px) {
  .hub-account-shell {
    padding-top: 3.5rem;
  }

  .hub-code-entry {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-roster-row {
    grid-template-columns: minmax(0, 1fr) 7rem;
  }

  .hub-roster-tester {
    grid-column: 1 / -1;
  }
}

.hub-lecture-activity {
  width: min(100%, 920px);
  margin: 0 auto;
}

.hub-lecture-activity-header {
  padding: 1.25rem 0 1.5rem;
  border-bottom: 1px solid var(--hub-rule-light);
}

.hub-lecture-activity-header h1 {
  max-width: 780px;
  margin: 0 0 0.75rem;
  color: var(--hub-blue);
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.hub-lecture-pdf-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1.5rem;
  margin-top: 0.8rem;
}

.hub-lecture-pdf-links .notes-pdf-link {
  margin-top: 0;
}

.hub-lecture-activity-header > p:not(.hub-activity-deadline) {
  max-width: 720px;
  margin: 0;
  color: var(--hub-soft-ink);
  font-size: 1.08rem;
  line-height: 1.6;
}

.hub-activity-deadline {
  margin-top: 1rem;
  color: var(--hub-muted);
  font-size: 0.92rem;
}

.hub-activity-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.25rem 0;
  padding: 0.9rem 1rem;
  border: 1px solid var(--hub-rule-light);
  border-radius: 10px;
  background: var(--hub-paper);
}

.hub-activity-notice p {
  margin: 0;
}

.hub-activity-notice a {
  flex: 0 0 auto;
  font-weight: 650;
}

.hub-activity-notice.is-success {
  border-color: color-mix(in srgb, var(--hub-blue) 40%, var(--hub-rule-light));
  background: color-mix(in srgb, var(--hub-blue) 6%, var(--hub-paper));
}

.hub-activity-notice.is-warning {
  border-color: #d7b76b;
  background: #fffaf0;
}

.hub-activity-notice.is-error {
  border-color: #d8a3a3;
  background: #fff7f7;
}

.hub-lecture-quiz {
  margin-top: 1.5rem;
}

.hub-lecture-quiz-list {
  display: grid;
  gap: 0.95rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hub-lecture-quiz-question {
  margin: 0;
  padding: 0.35rem 0 0.9rem;
  border: 0;
  border-bottom: 1px solid rgba(108, 115, 122, 0.16);
  border-radius: 0;
  background: transparent;
}

.hub-lecture-quiz-question fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.hub-lecture-quiz-question legend:not(.visually-hidden) {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 0.8rem;
  color: var(--hub-ink);
  font-size: 1.04rem;
  font-weight: 400;
  line-height: 1.55;
}

.hub-lecture-quiz-question legend > span > :first-child {
  margin-top: 0;
}

.hub-lecture-quiz-question legend > span > :last-child {
  margin-bottom: 0;
}

.hub-quiz-number {
  flex: 0 0 auto;
  color: var(--hub-faint);
  font-weight: 600;
}

.hub-lecture-quiz-question .hub-choice-list {
  gap: 0.45rem;
  border-top: 0;
}

.hub-quiz-question-feedback {
  margin: 0.8rem 0 0;
  padding-top: 0.15rem;
  color: var(--hub-soft-ink);
  font-size: 0.95rem;
  line-height: 1.5;
}

.hub-quiz-summary {
  margin-top: 1.5rem;
}

.hub-lecture-practice-prompt {
  margin-top: 1.5rem;
}

.hub-lecture-practice-questions {
  display: grid;
  gap: 1.35rem;
  margin: 0;
  padding-left: 1.4rem;
}

.hub-lecture-practice-questions > li {
  padding-left: 0.4rem;
  line-height: 1.6;
}

.hub-lecture-practice-questions ol,
.hub-lecture-practice-questions ul {
  margin-top: 0.65rem;
}

.hub-lecture-practice-questions .practice-table {
  width: 100%;
  margin: 0.9rem 0;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

.hub-lecture-practice-questions .practice-table th,
.hub-lecture-practice-questions .practice-table td {
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--hub-rule-light);
  text-align: right;
}

.hub-lecture-practice-questions .practice-table th:first-child,
.hub-lecture-practice-questions .practice-table td:first-child {
  text-align: left;
}

.hub-lecture-practice-upload {
  margin-top: 1.25rem;
}

.hub-lecture-practice-upload.is-locked {
  display: none;
}

.hub-lecture-practice-closed {
  margin: 1.5rem 0 0;
  color: var(--hub-muted);
  font-size: 0.92rem;
}

@media (max-width: 640px) {
  .hub-activity-notice {
    align-items: flex-start;
    flex-direction: column;
  }

  .hub-lecture-practice-prompt {
    overflow-x: auto;
  }
}

@media (max-width: 860px) {
  .hub-faq-shell {
    width: min(100% - 2rem, 50rem);
    padding-top: 2.3rem;
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-faq-sidebar {
    display: none;
  }

  .hub-faq-mobile-categories {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem 1.2rem;
    margin-top: 1.8rem;
    padding: 1rem 0;
    border-top: 1px solid var(--hub-rule);
    border-bottom: 1px solid var(--hub-rule);
  }

  .hub-faq-mobile-categories .chapter-rail-link {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
  }
}

@media (max-width: 700px) {
  .hub-question-index-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 0.8rem;
  }

  .hub-question-faq-link {
    order: 2;
    text-align: center;
  }

  .hub-faq-header {
    align-items: stretch;
    flex-direction: column;
    gap: 1.4rem;
  }

  .hub-faq-header h1 {
    font-size: 2.45rem;
  }

  .hub-faq-ask {
    justify-content: center;
  }

  .hub-faq-search {
    margin-top: 2.1rem;
  }

  .hub-faq-content {
    margin-top: 2.5rem;
  }

  .hub-faq-section + .hub-faq-section {
    margin-top: 3rem;
    padding-top: 2.6rem;
  }
}

/* Course introduction */
.hub-onboarding-shell { max-width: 880px; margin: 0 auto; padding: 3rem 1.5rem 5rem; }
.hub-onboarding-header { max-width: 680px; margin-bottom: 2rem; }
.hub-onboarding-header h1 { margin: 0 0 0.7rem; font-size: clamp(2.2rem, 5vw, 3rem); }
.hub-onboarding-header p { font-size: 1.12rem; line-height: 1.65; }
.hub-onboarding-progress { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 1.5rem; color: var(--muted-text); }
.hub-onboarding-progress progress { flex: 1; height: 7px; accent-color: var(--primary); }
.hub-onboarding-steps > details { border-top: 1px solid var(--primary-border-soft); scroll-margin-top: 6rem; }
.hub-onboarding-steps > details:last-child { border-bottom: 1px solid var(--primary-border-soft); }
.hub-onboarding-steps > details > summary { display: flex; align-items: center; gap: 1rem; padding: 1.5rem 0; cursor: pointer; list-style: none; }
.hub-onboarding-steps > details > summary::-webkit-details-marker { display: none; }
.hub-onboarding-step-number { display: grid; place-items: center; flex: 0 0 2.5rem; height: 2.5rem; border: 1px solid var(--primary-border); border-radius: 50%; color: var(--primary); font-weight: 600; }
.hub-onboarding-step-heading { flex: 1; }
.hub-onboarding-step-heading h2 { margin: 0 0 0.25rem; font-size: 1.25rem; }
.hub-onboarding-step-heading > span, .hub-onboarding-step-status { color: var(--muted-text); font-size: 0.92rem; }
.hub-onboarding-step-status::after { content: '+'; margin-left: 1rem; }
.hub-onboarding-steps > details[open] > summary .hub-onboarding-step-status::after { content: '−'; }
.hub-onboarding-step-body { padding: 0 0 2rem 3.5rem; }
.hub-onboarding-step-body > p { line-height: 1.65; }
.hub-onboarding-note { font-size: 0.9rem; color: var(--muted-text); }
.hub-onboarding-acknowledgment { display: flex; gap: 0.65rem; align-items: baseline; margin: 1.5rem 0 0.8rem; }
.hub-onboarding-confidence { margin: 2rem 0; padding: 1rem; border: 1px solid var(--primary-border-soft); border-radius: 8px; }
.hub-onboarding-confidence legend { font-weight: 600; }
.hub-onboarding-confidence legend span { font-weight: 400; color: var(--muted-text); }
.hub-onboarding-confidence select { width: 100%; font: inherit; color: inherit; padding: 0.7rem; background: var(--surface-raised); border: 1px solid var(--primary-border); border-radius: 5px; }
.hub-onboarding-saved { color: var(--accent); font-weight: 500; }
.hub-onboarding-finished { padding: 1.5rem; margin-bottom: 2rem; background: var(--secondary-surface); border-radius: 10px; }
.hub-onboarding-finished h2 { margin-top: 0; }
.hub-onboarding-results { margin: 1.5rem 0; }
.hub-onboarding-results ul { list-style: none; padding: 0; }
.hub-onboarding-results li { display: grid; gap: 0.3rem; padding: 0.8rem 0; border-bottom: 1px solid var(--primary-border-soft); }
.hub-onboarding-review-clear { color: var(--muted-text); font-size: 0.9rem; }

.hub-review-performance-table { overflow-x: auto; }
.hub-review-performance-table table { width: 100%; border-collapse: collapse; }
.hub-review-performance-table th,
.hub-review-performance-table td { padding: 0.7rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--hub-rule); min-width: 9rem; overflow-wrap: anywhere; }
.hub-onboarding-error { padding: 1rem; background: var(--error-bg); color: var(--error-text); border-radius: 8px; }
.hub-start-here-link { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.5rem 0; margin-bottom: 1rem; border-bottom: 1px solid var(--primary-border-soft); }
.hub-start-here-link h2 { margin: 0 0 0.35rem; }
.hub-start-here-link p { margin: 0; }
.hub-start-here-link a { flex-shrink: 0; }
@media (max-width: 640px) {
  .hub-onboarding-shell { padding: 2rem 1rem 3rem; }
  .hub-onboarding-step-body { padding-left: 0; }
  .hub-onboarding-step-status { font-size: 0.8rem; }
  .hub-onboarding-step-status::after { margin-left: 0.5rem; }
  .hub-onboarding-steps > details > summary { gap: 0.7rem; }
  .hub-onboarding-step-heading h2 { font-size: 1.1rem; }
  .hub-onboarding-step-heading > span { font-size: 0.85rem; }
  .hub-start-here-link { flex-direction: column; align-items: flex-start; }
}

/* Course completion credit and optional personal milestones. */
.hub-completion-page { max-width: 960px; margin: 0 auto; padding: 2rem 1.25rem 4rem; }
.hub-credit-total strong { font-size: 1.8rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.hub-potential-chart { position: relative; padding-top: 1.8rem; margin: 1.25rem 0; }
.hub-potential-track { display: flex; height: 22px; overflow: hidden; border-radius: 4px; background: color-mix(in srgb, var(--text) 10%, transparent); }
.hub-potential-earned { background: var(--primary); }
.hub-potential-remaining { background: color-mix(in srgb, var(--primary) 32%, var(--page-bg)); }
.hub-potential-track > span { flex-shrink: 0; }
.hub-potential-threshold { position: absolute; top: 1.5rem; height: 32px; width: 2px; transform: translateX(-1px); background: var(--text); }
.hub-potential-threshold-label { position: absolute; top: 0; white-space: nowrap; font-size: .82rem; font-weight: 600; }
.hub-potential-scale { display: flex; justify-content: space-between; margin-top: .35rem; font-size: .8rem; }
.hub-potential-legend { display: flex; flex-wrap: wrap; gap: .4rem 1rem; margin-top: .6rem; font-size: .85rem; }
.hub-potential-legend > span { display: flex; align-items: center; gap: .4rem; }
.hub-potential-legend i { display: inline-block; width: 11px; height: 11px; border-radius: 2px; }
.hub-potential-legend i:not([class]) { background: color-mix(in srgb, var(--text) 10%, transparent); }
.hub-credit-categories { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 2rem; margin: 2rem 0; }
.hub-credit-categories > section { min-width: 0; border-top: 1px solid var(--line); padding-top: 1rem; }
.hub-credit-categories h3 { margin: 0; }
.hub-credit-categories p { font-size: .9rem; }
.hub-credit-outlook { font-weight: 600; }
.hub-credit-opportunities { padding-left: 1.1rem; }
.hub-credit-opportunities li { margin: .7rem 0; }
.hub-credit-opportunities small { display: block; line-height: 1.5; }
.hub-credit-ledger { list-style: none; padding: 0; margin: .65rem 0; }
.hub-credit-ledger > li { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: .75rem; padding: .8rem 0; border-top: 1px solid var(--line); }
.hub-credit-row-content { min-width: 0; overflow-wrap: anywhere; }
.hub-credit-row-content > a, .hub-credit-row-content > span:first-child { font-size: .9rem; }
.hub-credit-row-status { display: block; font-size: .85rem; margin-top: .25rem; color: var(--muted-text); }
.hub-credit-row-status.is-credited { color: var(--primary); }
.hub-credit-row-content small, .hub-credit-row-points small { display: block; font-size: .78rem; line-height: 1.5; margin-top: .2rem; color: var(--muted-text); }
.hub-credit-row-points { text-align: right; font-variant-numeric: tabular-nums; font-size: .95rem; white-space: nowrap; }
.hub-credit-topic { margin-top: .65rem; border-top: 1px solid var(--line); padding-top: .4rem; }
.hub-credit-topic > summary { padding: .45rem 0; font-size: .9rem; overflow-wrap: anywhere; }
.hub-credit-summary-points { display: inline-block; float: right; margin-left: .65rem; font-size: .8rem; color: var(--muted-text); font-variant-numeric: tabular-nums; }
.hub-credit-practice-type, .hub-credit-attendance-group { margin: 1.2rem 0; }
.hub-credit-practice-type h4, .hub-credit-practice-type h5, .hub-credit-attendance-group h4 { margin: 0 0 .7rem; font-size: .9rem; font-weight: 600; }
.hub-credit-practice-group .hub-potential-track { height: 14px; }
.hub-credit-practice-group .hub-potential-threshold { height: 24px; }
.hub-credit-practice-group .hub-potential-legend { gap: .35rem .8rem; font-size: .78rem; }
.hub-credit-practice-count, .hub-credit-breakdown-note { color: var(--muted-text); line-height: 1.5; }
.hub-credit-practice-group .hub-credit-practice-count { font-size: .8rem; margin: .4rem 0; }
.hub-credit-practice-link { font-size: .85rem; }
.hub-credit-practice-heading { margin: 1.5rem 0 .75rem; font-size: 1rem; font-weight: 600; }
@media(pointer:coarse) { .hub-credit-topic > summary { min-height: 44px; padding: .65rem 0; } }
.hub-activity-credit { font-size: .9rem; line-height: 1.5; margin: .8rem 0; }
.hub-motivation { border-top: 1px solid var(--line); margin-top: 2rem; padding-top: 1rem; }
.hub-motivation form label { display: flex; align-items: baseline; gap: .6rem; margin: .75rem 0; }
.hub-motivation table { width: 100%; border-collapse: collapse; }
.hub-motivation th, .hub-motivation td { padding: .65rem; text-align: left; border-bottom: 1px solid var(--line); }
.hub-motivation .is-you { font-weight: 600; }
.hub-achievements { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; list-style: none; padding: 0; }
.hub-achievements li { padding: 1rem; border: 1px solid var(--line); border-radius: 6px; }
.hub-achievements li span { display: block; margin-top: .4rem; font-size: .9rem; }
.hub-achievements .is-earned { background: color-mix(in srgb, var(--primary) 7%, transparent); }
.hub-reading-summary {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem 1rem;
  margin: .65rem 0 0;
  color: var(--muted-text);
  font-size: .85rem;
  line-height: 1.5;
}
.hub-reading-summary strong { color: var(--text); font-weight: 500; }
@media (max-width: 640px) {
  .hub-reading-deadline { flex-basis: 100%; }
}
.hub-reading-early-notice {
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  border: 1px solid var(--interactive-border);
  border-radius: 12px;
  background: var(--interactive-bg);
}
.hub-reading-check {
  display: grid;
  gap: 0.8rem;
  margin: 1.75rem 0 2rem;
  padding: clamp(1rem, 3vw, 1.5rem);
  border: 1px solid var(--interactive-border);
  border-radius: 12px;
  background: var(--interactive-bg);
}
.hub-reading-check .hub-form-actions { margin: .25rem 0 0; }
.hub-reading-check .hub-lecture-quiz-question { padding: 0; border: 0; }
@media(max-width:640px) { .hub-credit-categories, .hub-achievements { grid-template-columns: 1fr; } }
/* The introduction keeps the actual page visible and its current task usable. */
.hub-tour-active { padding-bottom: var(--hub-tour-space, 260px); }
.hub-tour-active [inert] { cursor: default; }
.hub-tour-active :is(a, button, input) { scroll-margin-block: 100px var(--hub-tour-space, 260px); }
.hub-tour-panel {
  position: fixed; z-index: 10002; bottom: 20px; left: 50%; transform: translateX(-50%);
  width: min(680px, calc(100% - 40px)); box-sizing: border-box; padding: 22px 26px;
  background: #fff; color: #24343e; border: 1px solid #ccd5da; border-radius: 14px;
  box-shadow: 0 12px 48px #182b3930; max-height: calc(100dvh - 32px); overflow-y: auto;
}
.hub-tour-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.hub-tour-toggle { flex-shrink: 0; font-size: .85rem; min-height: 44px; }
.hub-tour-panel.is-collapsed { padding: 10px 18px; }
.hub-tour-panel.is-collapsed h2 { font-size: 1rem; }
.hub-tour-panel.is-collapsed .hub-tour-actions { margin-top: 4px; gap: 12px; }
.hub-tour-panel.is-collapsed [data-tour-secondary] { display: none; }
.hub-tour-panel.is-collapsed .hub-primary-button { padding: .55rem 1rem; min-height: 44px; width: auto; }
.hub-tour-panel.is-collapsed [data-tour-activity-status] { flex: 1; font-size: .85rem; color: #64727b; }
.hub-tour-panel h2 { margin: 0; font-size: 1.25rem; line-height: 1.3; color: var(--primary-strong, #285e82); }
.hub-tour-panel h2:focus { outline: none; }
.hub-tour-panel p { margin: 10px 0 0; font-size: 1rem; line-height: 1.5; }
.hub-tour-panel .hub-tour-progress { color: #64727b; font-size: .85rem; margin-top: 5px; }
.hub-tour-panel .hub-tour-hint { font-weight: 600; }
.hub-tour-panel .hub-tour-error { color: #9c2925; }
.hub-tour-actions { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 16px; }
.hub-tour-actions .hub-primary-button { margin-left: auto; }
.hub-tour-actions [data-tour-reading-status] { margin-left: auto; font-size: .88rem; color: #64727b; }
.hub-tour-actions [data-tour-reading-status] + button { margin-left: 0; }
.hub-tour-spotlight {
  position: fixed; z-index: 10001; pointer-events: none; box-sizing: border-box;
  border: 3px solid var(--primary, #285e82); border-radius: 9px;
  box-shadow: 0 0 0 9999px rgb(19 36 49 / 42%);
  transition: top 100ms ease, left 100ms ease, width 100ms ease, height 100ms ease;
}
.hub-tour-shade { position: fixed; inset: 0; z-index: 10001; pointer-events: none; background: rgb(19 36 49 / 42%); }
@media (max-width: 560px) {
  .hub-tour-panel { bottom: 8px; width: calc(100% - 16px); padding: 16px; border-radius: 12px; }
  .hub-tour-heading { gap: 12px; }
  .hub-tour-panel h2 { font-size: 1.1rem; }
  .hub-tour-panel p { font-size: .94rem; }
  .hub-tour-actions { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { .hub-tour-spotlight { transition: none; } }

/* Tutorial samples use the course's question and upload interfaces. */
.hub-tutorial-activity { max-width: 920px; margin: 2rem auto; padding: 0 1.25rem; }
.hub-privacy { max-width: 44rem; }
.hub-privacy h1, .hub-privacy h2 { color: var(--hub-blue); }
.hub-privacy h2 { margin: 2rem 0 0.5rem; font-size: 1.15rem; }
.hub-privacy ul { padding-left: 1.2rem; }
.hub-privacy li { margin-bottom: 0.45rem; }
.hub-account-student-meta { margin-top: 0.35rem; max-width: 34rem; color: var(--hub-soft-ink); font-size: 0.88rem; }
.hub-account-student-meta .hub-account-learner-code { margin: 0; }
.hub-account-student-meta .hub-text-button { padding: 0; font-size: inherit; vertical-align: baseline; }
.hub-account-ai-note { margin: 0.25rem 0 0; }
.hub-account-ai-confirm { margin-top: 0.6rem; padding: 0.75rem 0.9rem; border: 1px solid var(--hub-rule); border-radius: 6px; background: var(--hub-wash); }
.hub-account-ai-confirm p { margin: 0 0 0.6rem; }
.hub-account-ai-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.9rem; }
.hub-account-ai-actions .hub-primary-button { width: auto; padding: 0.45rem 0.9rem; font-size: 0.85rem; }
.hub-account-ai-confirm [data-ai-error] { margin: 0.5rem 0 0; color: #9d352b; }
.hub-learner-codes { margin: 2.5rem 0; }
.hub-learner-codes > p { max-width: 44rem; color: var(--hub-soft-ink); }
.hub-learner-codes-file { display: grid; gap: 0.35rem; max-width: 28rem; font-weight: 600; }
.hub-learner-codes-result h3 { margin: 1.25rem 0 0.4rem; font-size: 1rem; }
.hub-learner-codes-result ul { margin: 0; padding-left: 1.2rem; }
.hub-learner-codes-result li { font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.88rem; }
.hub-account-learner-code { margin: 0.35rem 0 0; color: var(--hub-soft-ink); font-size: 0.88rem; }
.hub-account-learner-code strong { color: var(--hub-ink); font-family: var(--font-mono, ui-monospace, monospace); letter-spacing: 0.04em; }
.hub-learner-code-form { max-width: 36rem; }
.hub-learner-code-value { margin: 0 0 1rem; font-family: var(--font-mono, ui-monospace, monospace); font-size: 1.8rem; font-weight: 600; letter-spacing: 0.08em; }
.hub-learner-code-confirm { display: flex; gap: 0.5rem; align-items: flex-start; margin-top: 1rem; font-weight: 600; }
.hub-learner-code-form .hub-form-actions { margin-top: 1rem; }
.hub-tutorial-sample { margin: 1.5rem 0; padding: 1.5rem; background: var(--surface-raised, #fff); border: 1px solid var(--primary-border-soft); border-radius: 8px; }
.hub-tutorial-sample figcaption { color: var(--muted, #666); margin-bottom: 1rem; }
.hub-tutorial-sample p { margin: .5rem 0; font-family: Georgia, serif; font-size: 1.25rem; }
.hub-tutorial-sample svg { display: block; max-width: 360px; color: var(--heading); }
.hub-tutorial-activity [data-upload-input]:disabled { cursor: default; }
.hub-tour-active .hub-tour-panel { max-height: 44svh; overflow: auto; }
@media (max-width: 600px) {
  .hub-tour-panel p { font-size: .875rem; line-height: 1.45; }
  .hub-tour-panel h2 { font-size: 1.05rem; }
  .hub-tutorial-activity { padding: 0 .75rem; }
}
.hub-tutorial-activity [data-tutorial-results],
.hub-tutorial-activity [data-sample-feedback] { scroll-margin-top: 88px; }
.hub-live-student-question .hub-lecture-quiz-list { padding: 0; }
.hub-live-student-question .hub-lecture-quiz-question { margin: 0; border: 0; }
.hub-tour-active [data-tutorial-activity],
.hub-tour-active #notesFlow,
.hub-tour-active [data-credit-category],
.hub-tour-active #topicPage,
.hub-tour-active #problemSetApp,
.hub-tour-active .hub-syllabus-content,
.hub-tour-active [data-question-index],
.hub-tour-active main,
.hub-tour-active [data-tutorial-results],
.hub-tour-active [data-sample-feedback] { scroll-margin-top: var(--hub-tour-header-height, 88px); }
/* Keep the course-wide download outside the main learning hierarchy. */
.hub-course-download { display: flex; justify-content: flex-end; margin: 1rem 0 .65rem; font-size: .85rem; }
.hub-course-download a { color: var(--muted-text); text-underline-offset: .2em; }
.hub-course-download a:hover { color: var(--link); }
.hub-materials-shell { max-width: 960px; margin: 0 auto; padding: 2.5rem 1.5rem 4rem; }
.hub-materials-shell h1 { margin: 0 0 1.5rem; }
.hub-materials-actions { margin-bottom: 2.5rem; }
.hub-materials-group { margin-top: 2rem; }
.hub-materials-group h2 { font-size: 1.15rem; margin: 0 0 .65rem; }
.hub-materials-group ul { list-style: none; padding: 0; margin: 0; }
.hub-materials-group li { border-bottom: 1px solid var(--line); }
.hub-materials-group li a { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .8rem 0; text-decoration: none; }
.hub-materials-group li a:hover { text-decoration: underline; text-underline-offset: .2em; }
.hub-materials-format { flex-shrink: 0; color: var(--muted-text); font-size: .8rem; }
@media (max-width: 600px) { .hub-materials-shell { padding: 1.5rem 1rem 3rem; } }
.hub-review-question-preview[open] {
  min-width: 28rem;
  max-width: 48rem;
}
.hub-review-question-preview summary {
  margin-top: 0.5rem;
  cursor: pointer;
}

.hub-lecture-review-queue, .hub-lecture-review-request { margin-block: 1.5rem; }
.hub-lecture-review-card { padding: 1.25rem; margin-block: 1rem; border: 1px solid var(--line); border-radius: 8px; }
.hub-lecture-review-card label, .hub-lecture-review-request label { display: block; margin-block: .75rem; overflow-wrap: anywhere; }
.hub-lecture-review-card fieldset { min-width: 0; margin-block: 1rem; }
.hub-lecture-review-card textarea { display: block; width: 100%; box-sizing: border-box; }
.hub-lecture-review-card input[type="checkbox"], .hub-lecture-review-request input[type="checkbox"] { min-width: 20px; min-height: 20px; }
.hub-lecture-review-request input[type="file"] { display: block; max-width: 100%; }

.hub-lecture-review-part { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .5rem; align-items: start; }
.hub-lecture-review-part label { min-height: 44px; display: flex; gap: .5rem; align-items: center; margin: 0; }
.hub-lecture-review-part details { min-width: 0; }
.hub-lecture-review-part summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; }

/* The cross-course dashboard shares the course dropdowns and Ask section tabs. */
.hub-nav-split { display: flex; align-items: center; gap: 0; }
.hub-nav-split > .hub-primary-link { padding-right: 4px; }
.hub-nav-split > .hub-nav-menu-trigger { padding-left: 5px; padding-right: 8px; }
.hub-nav-split > .hub-nav-menu-trigger.is-active::after { content: none; }
.hub-dashboard-shell { max-width: 1160px; margin: 0 auto; padding: 32px 24px 80px; }
.hub-dashboard-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.hub-dashboard-heading h1 { margin: 0; }
.hub-dashboard-controls { display: flex; align-items: end; gap: 16px; }
.hub-dashboard-controls label { display: grid; gap: 6px; font-size: .88rem; }
.hub-dashboard-controls select { max-width: 100%; padding: 9px 12px; border: 1px solid var(--line, #d8dce0); border-radius: 6px; background: var(--surface, white); color: inherit; font: inherit; }
.hub-dashboard-course { border-top: 1px solid var(--line, #d8dce0); padding: 24px 0; }
.hub-dashboard-course > h2 { margin: 0 0 20px; font-size: 1.3rem; color: var(--dashboard-course-heading, inherit); }
.hub-dashboard-context { margin-top: 0; color: var(--muted); }
.hub-dashboard-questions { list-style: none; padding: 0; margin: 0 0 16px; }
.hub-dashboard-questions a { display: grid; gap: 5px; padding: 14px 0; border-bottom: 1px solid var(--line, #d8dce0); text-decoration: none; color: inherit; }
.hub-dashboard-questions a:hover strong { text-decoration: underline; }
.hub-dashboard-questions span { color: var(--muted); font-size: .92rem; }
.hub-dashboard-count { font-size: .85em; font-weight: 400; color: var(--muted); margin-left: 6px; }
.hub-dashboard-review { border-top: 1px solid var(--line, #d8dce0); padding: 16px 0; }
.hub-dashboard-review > summary { cursor: pointer; font-weight: 600; }
.hub-dashboard-review > div { padding-top: 16px; }
.hub-dashboard-tools { display: flex; flex-wrap: wrap; gap: 24px; padding-top: 24px; }
.hub-dashboard-panel { position: fixed; inset: 0 0 0 auto; margin: 0; width: min(800px, 88vw); height: 100dvh; max-height: 100dvh; max-width: 100vw; padding: 0; border: 0; border-left: 1px solid var(--line, #d8dce0); background: var(--page-bg, #fff); color: inherit; overflow-y: auto; box-shadow: -12px 0 40px #0002; }
.hub-dashboard-panel::backdrop { background: #17212b55; }
.hub-dashboard-panel-heading { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 20px; padding: 18px 24px; border-bottom: 1px solid var(--line, #d8dce0); background: var(--page-bg, #fff); }
.hub-dashboard-panel-heading strong { margin-right: auto; }
.hub-dashboard-panel [data-panel-content] { padding: 24px; }
.hub-dashboard-panel .hub-thread-sidebar, .hub-dashboard-panel [data-question-index] { display: none; }
.hub-dashboard-panel .hub-discussion-shell { display: block; width: auto; max-width: none; margin: 0; padding: 0; }
.hub-dashboard-panel .hub-thread-main { min-width: 0; padding: 0; }
.hub-dashboard-panel .hub-thread { padding: 0; }
.hub-dashboard-panel-open { overflow: hidden; }
@media (max-width: 700px) {
  .hub-dashboard-shell { padding: 24px 16px 60px; }
  .hub-dashboard-heading { align-items: stretch; flex-direction: column; gap: 18px; }
  .hub-dashboard-controls { justify-content: space-between; }
  .hub-dashboard-controls label { min-width: 0; }
  .hub-dashboard-page .hub-ask-tabs { overflow-x: auto; white-space: nowrap; }
  .hub-dashboard-panel { width: 100vw; }
  .hub-dashboard-panel-heading { padding: 14px 16px; gap: 12px; flex-wrap: wrap; }
  .hub-dashboard-panel [data-panel-content] { padding: 20px 16px; }
}
.hub-dashboard-draft-prompt { position: sticky; top: 68px; z-index: 6; padding: 16px 24px; background: var(--surface-raised, #fff); border-bottom: 1px solid var(--line, #d8dce0); }
.hub-dashboard-draft-prompt p { margin-top: 0; }
.hub-dashboard-draft-prompt button + button { margin-left: 16px; }