#scene-wrap.order-scene {
  flex: 0 0 auto;
  min-height: 0;
  padding-top: 44px;
}

.order-scene #scene-image.question-illustration {
  position: static;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  padding: 0;
}

.order-targets {
  position: absolute;
  inset: 44px 0 0;
  pointer-events: none;
}

.order-target,
.order-token,
.order-ghost {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 2px solid #eaf0d9;
  border-radius: 50%;
  background: #173c33;
  color: #fffefa;
  font-size: 18px;
  font-weight: 750;
  box-shadow: 0 2px 6px #173c3344;
}

.order-target {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  border: 2px dashed #173c33;
  background: #fffef5f0;
  box-shadow: 0 0 0 2px #fffef5cc;
}

.order-target.filled {border-style: solid; background: #173c33}
.order-target.correct {background: #2c6742}
.order-target.wrong {background: #9c4239}
.order-target:disabled {cursor: default; opacity: 1}

.order-tray {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 16px;
  background: #f8faf3;
  border-top: 1px solid #d6dece;
}

.order-token {cursor: grab; touch-action: none; user-select: none}
.order-token.placed {background: #e7eddf; border-color: #aebda5; color: #173c33}
.order-token[aria-pressed=true] {background: #d9ef95; color: #173c33; border-color: #698848}
.order-ghost {position: fixed; pointer-events: none; z-index: 50; transform: translate(-50%, -50%)}
.order-status {margin-left: 4px; font-size: 12px; color: #52654a}

.order-confirm {
  width: 100%;
  padding: 11px 13px;
  border: 1px solid #9eaf88;
  border-radius: 9px;
  background: #eaf1db;
  font-weight: 650;
  text-align: left;
}

.order-confirm:disabled {opacity: .58; cursor: default}

@media (max-width: 760px) {
  #scene-wrap.order-scene {padding-top: 0}
  .order-targets {inset: 0}
  .order-target {width: 32px; height: 32px; font-size: 15px}
  .order-target::after {content: ""; position: absolute; inset: -8px}
  .order-token {width: 44px; height: 44px}
}
