/* Python token palette and cumulative function recaps. */

.reveal code.sourceCode:is(.python, .pythoncirct) .kw {
  color: #7c3aed;
  font-weight: 750;
}

.reveal code.sourceCode:is(.python, .pythoncirct) .cf {
  color: #be123c;
  font-weight: 750;
}

.reveal code.sourceCode:is(.python, .pythoncirct) .va {
  color: #2563eb;
  font-weight: 700;
}

.reveal code.sourceCode:is(.python, .pythoncirct) :is(.bu, .fu) {
  color: #0f766e;
  font-weight: 700;
}

.reveal code.sourceCode:is(.python, .pythoncirct) .im {
  color: #b45309;
  font-weight: 700;
}

.reveal code.sourceCode:is(.python, .pythoncirct) :is(.dv, .fl) {
  color: #b45309;
}

.reveal code.sourceCode:is(.python, .pythoncirct) .st {
  color: #166534;
}

.reveal code.sourceCode:is(.python, .pythoncirct) .op {
  color: #0f766e;
  font-weight: 650;
}

.reveal code.sourceCode:is(.python, .pythoncirct) .co {
  color: #64748b;
  font-style: italic;
}

.reveal code.sourceCode.pythoncirct .dt {
  color: #b45309;
  font-weight: 700;
}

.reveal code.sourceCode.pythoncirct .cn {
  color: #2563eb;
  font-weight: 700;
}

.reveal .e4m3-function-recap div.sourceCode {
  margin: 0;
}

.reveal .e4m3-function-recap {
  display: flex;
  align-items: center;
  justify-self: start;
  min-height: 19em;
  width: calc(100% - 0.45em);
}

.reveal .e4m3-function-recap > .code-copy-outer-scaffold {
  width: 100%;
}

.reveal .e4m3-function-recap pre code {
  font-size: 0.6em;
  line-height: 1.08;
  max-height: none !important;
  overflow: visible;
  padding: 0.48em 0.58em;
}

/* Final recap: colored code regions map directly to the datapath stages. */
.reveal #e4m3-final-python pre code {
  font-size: 0.58em;
  padding-right: 0.8em;
}

.reveal #e4m3-final-python code > span {
  position: relative;
  display: inline-block;
  width: 72ch;
  max-width: calc(100% - 9em);
  box-sizing: border-box;
}

.reveal #e4m3-final-python code > span:nth-child(n + 7):nth-child(-n + 9) {
  --code-stage-color: #7c3aed;
  --code-stage-fill: rgba(124, 58, 237, 0.12);
}

.reveal #e4m3-final-python code > span:nth-child(n + 10):nth-child(-n + 18) {
  --code-stage-color: #0f766e;
  --code-stage-fill: rgba(15, 118, 110, 0.12);
}

.reveal #e4m3-final-python code > span:nth-child(n + 19):nth-child(-n + 23) {
  --code-stage-color: #b7791f;
  --code-stage-fill: rgba(183, 121, 31, 0.14);
}

.reveal #e4m3-final-python code > span:nth-child(n + 24):nth-child(-n + 34) {
  --code-stage-color: #2563eb;
  --code-stage-fill: rgba(37, 99, 235, 0.11);
}

.reveal #e4m3-final-python code > span:nth-child(n + 35):nth-child(-n + 37) {
  --code-stage-color: #be185d;
  --code-stage-fill: rgba(190, 24, 93, 0.11);
}

.reveal #e4m3-final-python code > span:nth-child(n + 7):nth-child(-n + 37) {
  border-left: 0.18em solid var(--code-stage-color);
  background: var(--code-stage-fill);
  padding-left: 0.42em;
}

.reveal #e4m3-final-python code > span:nth-child(7),
.reveal #e4m3-final-python code > span:nth-child(10),
.reveal #e4m3-final-python code > span:nth-child(19),
.reveal #e4m3-final-python code > span:nth-child(24),
.reveal #e4m3-final-python code > span:nth-child(35) {
  border-radius: 0.22em 0.22em 0 0;
}

.reveal #e4m3-final-python code > span:nth-child(9),
.reveal #e4m3-final-python code > span:nth-child(18),
.reveal #e4m3-final-python code > span:nth-child(23),
.reveal #e4m3-final-python code > span:nth-child(34),
.reveal #e4m3-final-python code > span:nth-child(37) {
  border-radius: 0 0 0.22em 0.22em;
}

.reveal #e4m3-final-python code > span:nth-child(7)::after,
.reveal #e4m3-final-python code > span:nth-child(10)::after,
.reveal #e4m3-final-python code > span:nth-child(19)::after,
.reveal #e4m3-final-python code > span:nth-child(24)::after,
.reveal #e4m3-final-python code > span:nth-child(35)::after {
  position: absolute;
  left: calc(100% + 0.5em);
  width: 7.8em;
  padding: 0.34em 0.48em;
  border: 0.1em solid var(--code-stage-color);
  border-radius: 0.25em;
  background: var(--code-stage-fill);
  box-sizing: border-box;
  color: var(--code-stage-color);
  font-family: var(--r-main-font);
  font-size: 1.16em;
  font-weight: 800;
  line-height: 1.05;
  text-align: center;
  white-space: nowrap;
  transform: translateY(-50%);
}

.reveal #e4m3-final-python code > span:nth-child(7)::after {
  content: "sign";
  top: 1.5em;
}

.reveal #e4m3-final-python code > span:nth-child(10)::after {
  content: "significand";
  top: 4.5em;
}

.reveal #e4m3-final-python code > span:nth-child(19)::after {
  content: "normalize";
  top: 2.5em;
}

.reveal #e4m3-final-python code > span:nth-child(24)::after {
  content: "exponent";
  top: 5.5em;
}

.reveal #e4m3-final-python code > span:nth-child(35)::after {
  content: "pack";
  top: 1.5em;
}
