/* Lecture 6: readable teaching tables and diagrams on both Clean canvases. */
.reveal .slides section.slide.level2 {
  --l6-key-fill: color-mix(in srgb, var(--clean-accent) 13%, var(--clean-surface));
  --l6-key-line: color-mix(in srgb, var(--clean-accent) 45%, var(--clean-line));
}

.reveal .slides section.slide.level2 h3 {
  font-size: 0.85em;
  line-height: 1.2;
  margin: 0 0 0.45em;
}

.reveal .slides section.slide.level2 .l6-columns {
  align-items: start;
  display: grid;
  gap: 1.1em;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0.65em 0;
}

.reveal .slides section.slide.level2 .l6-columns > * {
  min-width: 0;
}

.reveal .slides section.slide.level2 .l6-walmart-columns {
  gap: 0.7em;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.8fr);
}

.reveal .slides section.slide.level2 .l6-walmart-figure p {
  margin: 0;
}

.reveal .slides section.slide.level2 .l6-walmart-figure img {
  border-radius: 0.3em;
  display: block;
  height: auto;
  margin: 0;
  width: 100%;
}

.reveal .slides section.slide.level2 .l6-walmart-figure p:last-child {
  color: var(--clean-muted);
  font-size: 0.45em;
  line-height: 1.25;
  margin-top: 0.35em;
}

.reveal .slides section.slide.level2 .l6-walmart-milestone {
  font-size: 0.72em;
  line-height: 1.3;
  margin-top: 0.65em;
}

.reveal .slides section.slide.level2 .l6-walmart-milestone p {
  margin: 0;
}

.reveal .slides section.slide.level2 .l6-walmart-copy {
  font-size: 0.82em;
  line-height: 1.35;
}

.reveal .slides section.slide.level2 .l6-walmart-copy ul {
  margin-top: 0;
}

.reveal .slides section.slide.level2 .l6-walmart-copy li + li {
  margin-top: 0.45em;
}

.reveal .slides section.slide.level2.l6-walmart-slide .l6-prompt {
  font-size: 0.8em;
  margin-top: 0.65em;
}

.reveal .slides section.slide.level2 .l6-retail-columns {
  font-size: 0.85em;
  line-height: 1.3;
}

.reveal .slides section.slide.level2 .l6-retail-columns h3 {
  font-size: 1em;
}

.reveal .slides section.slide.level2 .l6-retail-columns ul {
  margin-top: 0.35em;
}

.reveal .slides section.slide.level2 .l6-retail-columns li + li {
  margin-top: 0.5em;
}

.reveal .slides section.slide.level2.l6-retail-slide .l6-prompt {
  font-size: 0.85em;
  margin-top: 0.65em;
}

.reveal .slides section.slide.level2 .l6-card {
  background: var(--clean-surface-soft);
  border: 1px solid var(--clean-line);
  border-radius: 0.4em;
  color: var(--clean-ink);
  padding: 0.55em;
}

.reveal .slides section.slide.level2 .l6-card p,
.reveal .slides section.slide.level2 .l6-node p,
.reveal .slides section.slide.level2 .l6-step p {
  line-height: 1.28;
  margin: 0.4em 0 0;
}

.reveal .slides section.slide.level2 .l6-card > :first-child,
.reveal .slides section.slide.level2 .l6-node > :first-child,
.reveal .slides section.slide.level2 .l6-step > :first-child {
  margin-top: 0;
}

.reveal .slides section.slide.level2 .l6-card > :last-child,
.reveal .slides section.slide.level2 .l6-node > :last-child,
.reveal .slides section.slide.level2 .l6-step > :last-child {
  margin-bottom: 0;
}

.reveal .slides section.slide.level2 .l6-prompt {
  border-left: 0.18em solid var(--clean-accent-2);
  color: var(--clean-ink);
  font-size: 0.9em;
  line-height: 1.3;
  margin: 0.85em 0 0;
  padding: 0.12em 0 0.12em 0.6em;
}

.reveal .slides section.slide.level2 .l6-prompt p {
  margin: 0;
}

.reveal .slides section.slide.level2 .l6-source {
  color: var(--clean-muted);
  font-size: 0.42em;
  line-height: 1.3;
  margin: 0.75em 0 0;
}

.reveal .slides section.slide.level2 .l6-source p {
  margin: 0;
}

.reveal .slides section.slide.level2 .l6-flow,
.reveal .slides section.slide.level2 .l6-pipeline {
  align-items: center;
  display: grid;
  gap: 0.35em;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  margin: 0.75em 0;
}

.reveal .slides section.slide.level2 .l6-step,
.reveal .slides section.slide.level2 .l6-node {
  background: var(--clean-surface-soft);
  border: 1px solid var(--clean-line);
  border-radius: 0.4em;
  color: var(--clean-ink);
  font-size: 0.78em;
  line-height: 1.3;
  min-width: 0;
  padding: 0.65em 0.55em;
  text-align: center;
}

.reveal .slides section.slide.level2 .l6-step strong,
.reveal .slides section.slide.level2 .l6-node strong {
  color: var(--clean-heading);
  display: block;
  font-weight: 750;
  margin-bottom: 0.35em;
}

.reveal .slides section.slide.level2 .l6-flow-arrow {
  color: var(--clean-accent);
  font-size: 1.1em;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}

.reveal .slides section.slide.level2 .l6-stack {
  display: grid;
  gap: 0.45em;
  min-width: 0;
}

.reveal .slides section.slide.level2 .l6-stack .l6-node {
  padding: 0.45em 0.5em;
}

.reveal .slides section.slide.level2 table {
  border: 1px solid var(--clean-line);
  border-collapse: separate;
  border-radius: 0.3em;
  border-spacing: 0;
  color: var(--clean-ink);
  font-size: 0.75em;
  line-height: 1.25;
  margin: 0.5em 0 0.65em;
  overflow: hidden;
  width: 100%;
}

.reveal .slides section.slide.level2 table th,
.reveal .slides section.slide.level2 table td {
  border-bottom: 1px solid var(--clean-line);
  color: var(--clean-ink);
  padding: 0.3em 0.45em;
  text-align: left;
  vertical-align: middle;
}

.reveal .slides section.slide.level2 table thead th {
  background: var(--clean-surface-soft);
  border-bottom: 0.12em solid var(--clean-accent);
  color: var(--clean-heading);
  font-weight: 800;
}

.reveal .slides section.slide.level2 table tbody tr:nth-child(even) td {
  background: var(--clean-surface-soft);
}

.reveal .slides section.slide.level2 table tbody tr:last-child td {
  border-bottom: 0;
}

.reveal .slides section.slide.level2 table code {
  font-size: 0.9em;
  white-space: nowrap;
}

.reveal .slides section.slide.level2 :is(.l6-key-table, .l6-result-table) :is(th, td):nth-child(2),
.reveal .slides section.slide.level2 :is(.l6-reference-table, .l6-duplicate-table) :is(th, td):first-child {
  background: var(--l6-key-fill);
  box-shadow: inset 1px 0 var(--l6-key-line), inset -1px 0 var(--l6-key-line);
  color: var(--clean-ink);
  font-weight: 650;
}

.reveal .slides section.slide.level2 :is(.l6-key-table, .l6-result-table) th:nth-child(2),
.reveal .slides section.slide.level2 :is(.l6-reference-table, .l6-duplicate-table) th:first-child {
  color: var(--clean-heading);
  font-weight: 800;
}

.reveal .slides section.slide.level2 pre {
  box-sizing: border-box;
  margin: 0.5em 0 0.7em;
  width: 100%;
}

.reveal .slides section.slide.level2 pre code,
.reveal .slides section.slide.level2 pre code.sourceCode,
.reveal .slides section.slide.level2 .code.sourceCode {
  font-size: 22px;
  line-height: 1.4;
}

html[data-clean-theme="dark"] .reveal code span.at {
  color: #f5c2e7;
}

html[data-clean-theme="dark"] .reveal code span.cn {
  color: #ffa594;
}

.reveal .slides section.slide.level2.classwork-slide .classwork-link {
  background: var(--clean-surface-soft);
  border: 1px solid var(--clean-line);
  border-left: 0.22em solid var(--clean-accent-2);
  border-radius: 0.45em;
  font-size: 1.08em;
  font-weight: 800;
  margin: 0.85em auto 0;
  max-width: 80%;
  padding: 0.65em 0.8em;
  text-align: center;
}

.reveal .slides section.slide.level2.classwork-slide .classwork-targets {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35em;
  justify-content: center;
  margin: 0.65em auto 0;
  max-width: 88%;
}

.reveal .slides section.slide.level2.classwork-slide .classwork-targets span {
  background: color-mix(in srgb, var(--clean-accent) 12%, var(--clean-surface));
  border: 1px solid var(--clean-line);
  border-radius: 1em;
  font-size: 0.65em;
  font-weight: 700;
  padding: 0.28em 0.55em;
}

@media (max-width: 700px) {
  .reveal .slides section.slide.level2 .l6-columns {
    gap: 0.7em;
  }

  .reveal .slides section.slide.level2 .l6-flow,
  .reveal .slides section.slide.level2 .l6-pipeline {
    gap: 0.2em;
  }
}