.files .codebox p {
  margin: 0;
}

 
.row > .peek {
  grid-column: 2 / -1;
  min-width: 0;
}
.peekl {
  list-style: none;
  padding: 0;
  margin: 0;
}
.owner .peekl > li {
  padding-left: 0;
  display: flex;
  column-gap: calc(8 * var(--u));
  align-items: center;
  min-width: 0;
}
.owner .peekl > li::before {
  content: none;
}
.peekl > li + li {
  margin-top: calc(4 * var(--u));
}
.peekl .fname {
  min-width: 0;
  overflow-wrap: anywhere;
}
.peekf {
  flex: none;
  display: block;
  width: calc(40 * var(--u));
  height: calc(40 * var(--u));
  background: var(--well);
  text-decoration: none;
  color: var(--dim);
  overflow: hidden;
}
.peekf img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.peekf .ext {
  display: block;
  line-height: calc(40 * var(--u));
  text-align: center;
}



.slides .slide {
  margin: calc(20 * var(--u)) 0 0;
  min-width: 0;
}
.slides.one .slide:not(.on) {
  display: none;
}
.slide figcaption {
  margin-top: calc(4 * var(--u));
  overflow-wrap: anywhere;
}
.slide img.media {
  display: block;
  max-width: 100%;
  max-height: 70vh;
  height: auto;
  background: var(--well);
  user-select: none;
}
.slide .frame.vid video {
  width: 100%;
  max-height: 70vh;
}
.slide audio.media {
  display: block;
  width: 100%;
}
.slide iframe.pdf {
  display: block;
  width: 100%;
  height: 70vh;
  border: 0;
  background: var(--well);
}
.slide .model {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  max-height: 70vh;
  background: var(--well);
}
.slide .model canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}
.slide .model .hint {
  position: absolute;
  left: calc(10 * var(--u));
  top: 0;
  margin: 0;
}
.slide .model[data-state='drawn'] .hint {
  display: none;
}
.slide .none .ext,
.files .ext {
  font-family: 'Handjet Cells Mono', monospace;
}
.slide .textbar {
  margin: calc(20 * var(--u)) 0 0;
}
.lineat {
  margin: calc(4 * var(--u)) 0 0;
}



.stepper:has(~ .set:focus-visible) .count::before,
.stepper:has(~ .set:focus-visible) .count::after {
  position: absolute;
  animation: dither-blink 0.9s linear infinite;
  mask-size: var(--dither) var(--dither);
}
.stepper:has(~ .set:focus-visible) .count::before {
  content: '[';
  right: calc(100% + 3 * var(--u));
}
.stepper:has(~ .set:focus-visible) .count::after {
  content: ']';
  left: calc(100% + 4 * var(--u));
}



.hljs-comment,
.hljs-quote,
.hljs-meta {
  color: var(--dim);
}
.ln.lit :is(.hljs-comment, .hljs-quote, .hljs-meta) {
  color: var(--ground);
}

.result .qr {
  margin-top: calc(10 * var(--u));
}
.result {
  overflow-wrap: anywhere;
}
#yours code {
  overflow-wrap: anywhere;
}

 
#when p {
  margin: calc(10 * var(--u)) 0 0;
}