/* Dash Show QR screen (qr-screen.js): full-screen venue QR for a stadium or big screen. QR = 70% of the shorter screen side, black on white with its quiet zone; colours, fonts and crest from the club skin (--ds-* vars from the theme file), Dash's dark look for Default; landscape = QR left, texts right; portrait = stacked. */
html.qrs-open, html.qrs-open body { overflow: hidden; }
.qrs {
  position: fixed; inset: 0; z-index: 1000; display: flex; flex-direction: column; overflow: hidden;
  background: var(--ds-bg, #09090b); color: var(--ds-text, #ffffff);
  font-family: var(--ds-font, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif);
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
.qrs:fullscreen { width: 100vw; height: 100vh; }
.qrs::backdrop { background: var(--ds-bg, #09090b); }
.qrs.idle, .qrs.idle * { cursor: none !important; }
.qrs-band { flex: none; height: 2.2vmin; background: var(--ds-decor-header, linear-gradient(90deg, #047857, #34d399)); }
.qrs-head { flex: none; text-align: center; padding: 2.2vmin 12vmin 0; display: flex; flex-direction: column; align-items: center; gap: 0.6vmin; }
.qrs-main { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; gap: 6vmin; padding: 2vmin 5vmin; }
.qrs-code { flex: none; width: 70vmin; height: 70vmin; background: #ffffff; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 0.6vmin var(--ds-accent-strong, #34d399); border-radius: 0.6vmin; }
.qrs-code svg { display: block; width: 100%; height: 100%; }
.qrs-nolink { padding: 4vmin; text-align: center; color: #18181b; font-size: 3vmin; font-weight: 700; display: flex; flex-direction: column; align-items: center; gap: 2vmin; }
.qrs-info { min-width: 0; max-width: 46vw; display: flex; flex-direction: column; align-items: flex-start; gap: 1.6vmin; }
.qrs-crest { width: 16vmin; height: 16vmin; object-fit: contain; }
.qrs-scan { margin: 0; font-family: var(--ds-font-head, inherit); font-weight: 900; font-size: 9vmin; line-height: 1; color: var(--ds-accent-strong, #34d399); }
.qrs-event { margin: 0; font-family: var(--ds-font-head, inherit); font-weight: 900; font-size: 6.4vmin; line-height: 1.05; overflow-wrap: anywhere; }
.qrs-venue { margin: 0; font-size: 4vmin; font-weight: 700; line-height: 1.1; color: var(--ds-text-2, #d4d4d8); }
.qrs-url { margin: 1vmin 0 0; font-size: min(3.4vmin, 2.1vw); letter-spacing: 0.01em; font-weight: 700; overflow-wrap: break-word; }
.qrs-players { margin: 0; font-size: 2.8vmin; color: var(--ds-muted, #a1a1aa); font-variant-numeric: tabular-nums; }
.qrs.upper .qrs-scan, .qrs.upper .qrs-event { text-transform: uppercase; }
.qrs-close {
  position: absolute; top: max(1.6vmin, env(safe-area-inset-top)); right: max(1.6vmin, env(safe-area-inset-right)); min-height: max(48px, 4.4vmin); min-width: 48px;
  display: inline-flex; align-items: center; gap: 0.5rem; padding: 0 max(1rem, 1.4vmin); border-radius: 999px; border: 2px solid currentColor;
  background: rgba(0, 0, 0, 0.55); color: #ffffff; font: 700 max(1rem, 1.7vmin)/1 system-ui, sans-serif; cursor: pointer; transition: opacity 0.3s;
}
.qrs-close:focus-visible { outline: 3px solid var(--ds-highlight, #6ee7b7); outline-offset: 2px; }
.qrs.idle .qrs-close { opacity: 0; }
.qrs-logo { position: absolute; right: max(2vmin, env(safe-area-inset-right)); bottom: max(2vmin, env(safe-area-inset-bottom)); padding: 0.8vmin 1.4vmin; border-radius: 1vmin; background: #09090b; }
.qrs-logo img { display: block; height: 4.5vmin; width: auto; }
@media (orientation: portrait) {
  .qrs-main { flex-direction: column; gap: 3vmin; }
  .qrs-info { max-width: 90vw; align-items: center; text-align: center; }
  .qrs-crest { width: 12vmin; height: 12vmin; }
}
