:root { color-scheme: dark; background: #020d20; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { min-height: 100vh; min-height: 100svh; background: radial-gradient(ellipse at center, #082653 0%, #020d20 70%); }
.poster-page { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 20px; }
.poster-frame { position: relative; width: min(100%, 1041px, max(280px, calc((100vh - 108px) * 1041 / 1510))); width: min(100%, 1041px, max(280px, calc((100svh - 108px) * 1041 / 1510))); aspect-ratio: 1041 / 1510; }
.poster { display: block; width: 100%; height: auto; object-fit: contain; }
.registration-link { position: absolute; left: 19%; top: 73.5%; width: 62%; height: 10.5%; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 8px; border: 1px solid #f5d68c; border-radius: 12px; background: linear-gradient(135deg, #ffe7a3, #d8a335); color: #07152b; font: 800 clamp(14px, 2.7vw, 25px)/1.4 system-ui, sans-serif; letter-spacing: 0.08em; text-decoration: none; box-shadow: 0 8px 24px #0006; }
.registration-link:hover { background: #ffe7a3; }
.registration-link:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
.music-player { width: min(100%, 320px); font: 14px/1.4 system-ui, sans-serif; }
.music-player audio { width: 100%; height: 48px; }
.music-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; }
.music-controls[hidden] { display: none; }
.music-controls button { min-height: 44px; padding: 10px 12px; border: 1px solid #b3c7e6; border-radius: 10px; background: #102849; color: #fff; font: inherit; cursor: pointer; }
.music-controls button:hover { background: #1c3b63; }
.music-controls button:focus-visible, .music-volume input:focus-visible { outline: 3px solid #ffe7a3; outline-offset: 3px; }
.music-volume { display: flex; align-items: center; gap: 8px; color: #dbe7f8; }
.music-volume input { width: 90px; min-height: 44px; margin: 0; accent-color: #eac15f; }
#music-status { margin: 8px 0 0; color: #dbe7f8; text-align: center; }
.screen-reader-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }