/* POPIÓŁ touch overlay — see touch.js. Hidden until the stream's video is playing (.live). */
#popiol-touch { position: fixed; inset: 0; z-index: 50; display: none; touch-action: none;
  -webkit-user-select: none; user-select: none; font: 600 13px/1 system-ui, sans-serif; color: #e8e2d4; }
#popiol-touch.live { display: block; }
#popiol-touch .pt-zone { position: absolute; top: 0; bottom: 0; }
/* top 40%: leaves Epic's own left-edge buttons (fullscreen, settings, stats) tappable */
#popiol-touch .pt-move { left: 0; width: 45%; top: 40%; }
#popiol-touch .pt-look { right: 0; width: 55%; }
#popiol-touch .pt-base { position: absolute; width: 112px; height: 112px; margin: 0; border-radius: 50%;
  transform: translate(-50%, -50%); border: 2px solid rgba(232,226,212,.35); background: rgba(20,18,15,.25);
  display: none; pointer-events: none; }
#popiol-touch .pt-base.on { display: block; }
#popiol-touch .pt-knob { position: absolute; left: 50%; top: 50%; width: 48px; height: 48px; border-radius: 50%;
  background: rgba(232,226,212,.55); transform: translate(-50%, -50%); }
#popiol-touch button { pointer-events: auto; border: 1.5px solid rgba(232,226,212,.45); color: inherit;
  background: rgba(20,18,15,.45); border-radius: 999px; font: inherit; letter-spacing: .06em;
  min-width: 58px; height: 44px; padding: 0 12px; touch-action: none; }
#popiol-touch button.on { background: rgba(196,120,52,.7); border-color: #c47834; }
#popiol-touch .pt-buttons { position: absolute; right: max(14px, env(safe-area-inset-right)); bottom: 18px;
  display: grid; grid-template-columns: auto auto; gap: 10px; }
#popiol-touch .pt-buttons .pt-big { width: 74px; height: 74px; }
#popiol-touch .pt-top { position: absolute; top: 10px; right: max(10px, env(safe-area-inset-right));
  display: flex; gap: 8px; }
#popiol-touch .pt-rotate { display: none; position: absolute; inset: 0; background: rgba(13,13,12,.92);
  align-items: center; justify-content: center; font-size: 18px; }
@media (orientation: portrait) { #popiol-touch .pt-rotate { display: flex; } }
#popiol-builds { position: fixed; left: 10px; bottom: 8px; z-index: 40; color: rgba(232,226,212,.55);
  font: 12px system-ui, sans-serif; text-decoration: none; }
#popiol-touch.live ~ #popiol-builds, body:has(#popiol-touch.live) #popiol-builds { display: none; }