html,body{margin:0;height:100%;background:#03365C}
main{min-height:100vh;min-height:100dvh;display:grid;place-items:center}
.play{width:min(32vw,32vh,260px);height:auto;display:block}
.play-btn{appearance:none;background:none;border:0;padding:0;margin:0;cursor:pointer;border-radius:24px;
  -webkit-tap-highlight-color:transparent;transition:transform .18s ease,filter .18s ease}
.play-btn:hover{transform:translateY(-4px) scale(1.06);filter:drop-shadow(0 10px 14px rgba(0,0,0,.35))}
.play-btn:active{transform:translateY(3px) scale(.94);filter:drop-shadow(0 2px 3px rgba(0,0,0,.3));transition-duration:.06s}
.play-btn:focus{outline:none}
.play-btn:focus-visible{outline:3px solid #00AEEF;outline-offset:10px}
@media (prefers-reduced-motion:reduce){.play-btn{transition:none}}