:root { color-scheme: dark; }
body { margin:0; font-family:system-ui,-apple-system,Arial; background:#0b0b0b; color:#fff; }
.wrap { max-width:520px; margin:0 auto; padding:12px; }
.stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  background: #111;
  border-radius: 16px;
  overflow: hidden;
}

/* Видео — базовый слой */
video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

/* Тарелка — поверх видео */
.plate {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  pointer-events: none;

  /* ВАЖНО: пока plate не прозрачная — ставим прозрачность,
     иначе она будет перекрывать камеру */
  opacity: 0.55;
}

/* Трафарет/линии — самый верх */
canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  pointer-events: none;
}



.hud { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
button { padding:12px 14px; border-radius:12px; border:0; background:#2b6cff; color:#fff; font-weight:700; cursor:pointer; }
.status { margin-top:10px; opacity:.85; font-size:14px; }