/* Final shared top navigation: mood (screen 2) matches date (screen 3). */
@media(min-width:701px){
  .quizHero .progress{
    top:12px!important;
    width:min(48vw,620px)!important;
    max-width:48vw!important;
    gap:10px!important;
  }
  .quizHero .progress button{
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    padding-bottom:2px!important;
    border-width:1px!important;
    font-size:21px!important;
  }
  .quizHero .bars{gap:5px!important}
  .quizHero .bars i{height:3px!important}
  .quizHero .gift{
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    padding:0!important;
    overflow:hidden!important;
    font-size:0!important;
    line-height:1!important;
    background:url('assets/progress-gift-clean.svg') center/58% no-repeat!important;
    border:1px solid #ffb600!important;
    border-radius:50%!important;
    filter:none!important;
  }
}

@media(max-width:700px){
  .quizHero .gift{
    flex:0 0 36px!important;
    width:36px!important;
    height:36px!important;
    padding:0!important;
    overflow:hidden!important;
    font-size:0!important;
    line-height:1!important;
    background:url('assets/progress-gift-clean.svg') center/58% no-repeat!important;
    border:1px solid #ffb600!important;
    border-radius:50%!important;
    filter:none!important;
  }
}

/* The mood screen had more specific legacy selectors. Override those exact
   selectors so it cannot grow its navigation independently again. */
@media(min-width:701px){
  .quizHero.art-mood .progress{top:12px!important;width:min(48vw,620px)!important;max-width:48vw!important;gap:10px!important}
  .quizHero.art-mood .progress button{flex:0 0 30px!important;width:30px!important;height:30px!important;padding-bottom:2px!important;border-width:1px!important;font-size:21px!important}
  .quizHero.art-mood .bars{gap:5px!important}
  .quizHero.art-mood .bars i{height:3px!important}
  .quizHero.art-mood .gift{flex:0 0 30px!important;width:30px!important;height:30px!important;padding:0!important;overflow:hidden!important;font-size:0!important;line-height:1!important;background:url('assets/progress-gift-clean.svg') center/58% no-repeat!important;border:1px solid #ffb600!important;border-radius:50%!important;filter:none!important}
}