/* Working exhibits share the same reading-and-playing layout as Projects. */
.memory-section[data-memory-variant="human-signals"] .memory-wall {
  gap: clamp(28px, 4vw, 56px);
}

.memory-section[data-memory-variant="human-signals"] .memory-object.has-after-demo {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(240px, .62fr) minmax(0, 1.38fr);
  grid-template-rows: auto;
  grid-template-areas: "story exhibit";
  align-items: stretch;
  min-width: 0;
  overflow: hidden;
  opacity: 1;
  transform: none;
  transform-style: flat;
  animation: none;
  scroll-margin-top: 100px;
  background: rgba(8, 9, 12, .96);
  border-color: rgba(var(--rgb-warm-ink), .23);
}

.memory-section[data-memory-variant="human-signals"] .memory-object.has-after-demo:hover {
  transform: none;
}

.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__body {
  grid-area: story;
  justify-content: center;
  padding: clamp(24px, 3vw, 42px);
  border-right: 1px solid rgba(var(--rgb-warm-ink), .16);
  background: radial-gradient(ellipse at 0 0, rgba(var(--rgb-signal-red), .07), transparent 70%);
}

.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__body::before {
  display: none;
}

.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__body > h3 {
  margin: 22px 0;
  font-size: clamp(28px, 2.6vw, 40px);
  line-height: 1.25;
  max-width: 16ch;
}

.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__body > p {
  color: rgba(var(--rgb-warm-ink), .85);
}

.memory-section[data-memory-variant="human-signals"] .memory-object.has-after-demo .memory-object__visual {
  grid-area: exhibit;
  min-width: 0;
  aspect-ratio: auto;
  overflow: hidden;
  border: 0;
  background: #080a0e;
}

.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__visual::before,
.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__visual::after,
.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__visual > .chip-grid,
.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__visual > .wave-line,
.memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__visual > strong {
  display: none;
}

.memory-section .after-demo {
  position: relative;
  z-index: 3;
  min-width: 0;
  height: auto;
  color-scheme: dark;
  color: #fff0eb;
}

.memory-section .after-demo :is(button, input, [tabindex]):focus-visible {
  outline: 2px solid #ffcb92;
  outline-offset: 4px;
}

@media (max-width: 1000px) {
  .memory-section[data-memory-variant="human-signals"] .memory-object.has-after-demo {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    grid-template-areas: "story" "exhibit";
  }
  .memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__body {
    padding: 26px clamp(20px, 4vw, 36px);
    border-right: 0;
    border-bottom: 1px solid rgba(var(--rgb-warm-ink), .16);
  }
  .memory-section[data-memory-variant="human-signals"] .has-after-demo .memory-object__body > h3 {
    max-width: 26ch;
    margin: 14px 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .memory-section .after-demo *, .memory-section .after-demo *::before, .memory-section .after-demo *::after {
    scroll-behavior: auto;
    animation-duration: .01ms;
    transition-duration: .01ms;
  }
}

/* A 320px window can reserve some of its width for a desktop scrollbar. */
@media (max-width: 340px) {
  body { min-width: 0; }
}
