* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body { background: #231039; font-family: Arial, "Microsoft YaHei", sans-serif; }
.stage { position: relative; width: 100%; height: 100vh; height: 100dvh; overflow: hidden; background: radial-gradient(ellipse at 30% 50%, #641b70, #1c0d31); }
.art { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.art img { display: block; width: 100%; height: 100%; object-fit: fill; }
.partners { position: absolute; top: 1%; right: 2%; display: flex; gap: 8px; width: 37%; height: 7%; }
button { padding: 0; border: 0; background: transparent; cursor: pointer; }
button:focus-visible { outline: 2px solid white; outline-offset: 3px; border-radius: 20px; }
.partners button { flex: 1; min-width: 0; }
.partners picture { display: block; width: 100%; height: 100%; pointer-events: none; }
button img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.downloads { position: absolute; left: 61%; top: 74%; width: 23%; height: 21%; display: flex; flex-direction: column; gap: 4%; }
.downloads button { width: 100%; height: 48%; }
.qr-panel { position: absolute; left: 93.36%; top: 84.06%; width: min(9.15vw, 15.8vh); aspect-ratio: 1; transform: translate(-50%, -50%); }
#qrcode { width: 100%; height: 100%; padding: 4.7%; background: white; border-radius: 4%; }
#qrcode canvas, #qrcode table { display: block !important; width: 100% !important; height: 100% !important; }
#qrcode img { display: none !important; }
.notice { position: absolute; bottom: 0; left: 0; width: 100%; height: 3.4%; pointer-events: none; }
.notice img { width: 100%; height: 100%; object-fit: contain; display: block; background: rgba(28, 12, 42, .92); }
.float { position: absolute; left: 1%; bottom: 5%; display: none; gap: 8px; }
.a-link { width: 60px; color: white; text-align: center; text-decoration: none; font-size: 12px; }
.a-link img { width: 60px; height: 60px; object-fit: contain; }
.a-name { display: block; }
@media (max-width: 767px) {
  .partners { top: .5%; right: 2%; width: 74%; height: 4%; gap: 2px; }
  .downloads { top: 73.3%; left: 21.33%; width: 57.34%; height: 18.1%; gap: 3.5%; }
  .qr-panel { display: none; }
  .notice { height: 6.53%; }
  .float { bottom: 27%; }
}
