/* Cardboard student view (2026-10-19) — see js/cardboard-mode.js.
   The entry button is shown only to a phone student in a live session. While the
   mode is on, everything inside #canvas-wrap except the canvases, the edge cue and
   the HUD is hidden: a DOM control cannot be aligned to two lenses. */
.vv-cardboard-btn {
  /* Above the live banner (bottom centre, z-index 80) and the other canvas overlays. */
  position: absolute; left: 50%; bottom: calc(64px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%); z-index: 95;
  min-height: 44px; padding: 0 18px; border: 0; border-radius: 22px;
  background: rgba(20, 24, 32, 0.82); color: #fff;
  font: 600 14px/1 system-ui, -apple-system, sans-serif; letter-spacing: .01em;
  -webkit-tap-highlight-color: transparent; cursor: pointer;
}
.vv-cardboard-btn[hidden] { display: none; }
.vv-cardboard-tip {
  position: absolute; left: 50%; bottom: calc(116px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%); z-index: 95; max-width: min(88%, 360px);
  padding: 8px 12px; border-radius: 12px; text-align: center;
  background: rgba(20, 24, 32, 0.82); color: #fff;
  font: 500 12px/1.35 system-ui, -apple-system, sans-serif; pointer-events: none;
}
.vv-cardboard-tip[hidden] { display: none; }
.vv-cardboard-btn:focus { outline: 3px solid #5aa9ff; outline-offset: 2px; }

html.vv-cardboard, html.vv-cardboard body { overflow: hidden; overscroll-behavior: none; }
html.vv-cardboard #canvas-wrap {
  position: fixed !important; inset: 0; width: 100vw; height: 100vh; height: 100dvh;
  z-index: 2147483000; background: #000; touch-action: none; user-select: none; -webkit-user-select: none;
}
html.vv-cardboard #canvas-wrap > *:not(canvas):not(#vvEdgeCue):not(#vvCardboardHud) { display: none !important; }

.vv-cb-hud {
  position: absolute; inset: 0; display: flex; z-index: 40; pointer-events: none;
  transition: opacity .8s ease;
}
.vv-cb-hud[hidden] { display: none; }
.vv-cb-hud.fade { opacity: 0; }
.vcb-half {
  flex: 1 1 50%; display: flex; align-items: flex-end; justify-content: center;
  padding: 0 8% 10%; text-align: center;
  color: #fff; font: 600 clamp(12px, 3.2vmin, 18px)/1.3 system-ui, -apple-system, sans-serif;
  text-shadow: 0 1px 3px #000, 0 0 8px rgba(0, 0, 0, .8);
}
@media (prefers-reduced-motion: reduce) { .vv-cb-hud { transition: none; } }