:root.embedded-webgame {
  --embedded-desktop-scene-shift-y: clamp(-72px, calc(370px - 50vh), -34px);
  --embedded-mobile-scene-scale: 1.12;
  --embedded-mobile-objective-top: 10px;
}

@media (min-width: 761px) {
  .embedded-webgame .experience[data-stage="cut"] .objective {
    box-sizing: border-box;
    height: 100%;
    padding-top: clamp(10px, 1.5vh, 18px);
    top: 0;
  }

  .embedded-webgame .experience[data-stage="cut"] .objective h1 {
    flex: 0 0 auto;
    order: 1;
  }

  .embedded-webgame .experience[data-stage="cut"] .cook-timeline {
    flex: 0 0 auto;
    margin-bottom: clamp(18px, 3vh, 30px);
    margin-top: auto;
    order: 2;
  }

  .embedded-webgame .playback-controls {
    top: calc(50% + var(--embedded-desktop-scene-shift-y));
  }

  .embedded-webgame .scene-host canvas {
    transform: translate3d(
      0,
      var(--embedded-desktop-scene-shift-y),
      0
    );
  }
}

@media (max-width: 760px) {
  .embedded-webgame .scene-host canvas {
    transform: scale(var(--embedded-mobile-scene-scale));
    transform-origin: 50% 56%;
  }

  .embedded-webgame .experience[data-stage="cut"] .objective {
    top: max(
      var(--embedded-mobile-objective-top),
      calc(env(safe-area-inset-top) + 6px)
    );
  }
}
