/* L3 演示层：学生的应用本体。
   ⚠️ 它不是新窗口，而是在同一个“细节拆封”外框内部替换介绍内容。 */

.demo {
  position: absolute;
  inset: 56px 0 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  background: var(--bg-raised);
  border-radius: inherit;
  overflow: hidden;
  animation: demo-in var(--d-base) var(--ease);
}
@keyframes demo-in {
  from { opacity: 0; transform: scale(.985); }
  to   { opacity: 1; transform: none; }
}

.demo__slot {
  flex: 1;
  min-height: 0;
  width: 100%;
  max-width: var(--frame-w, none);
  margin: 0 auto;                 /* 竖屏作品锁 390px 居中 */
  background: #fff;
  overflow: hidden;
}
.demo__iframe {
  width: 100%;
  height: 100%;
  max-width: none;
  border: 0;
  transform-origin: top left;
}

@media (max-width: 760px) {
  .demo { top: 52px; }
}