/* Mobile navigation correction prompted by real Samsung screenshot.
   No change to the approved welcome artwork or complete stacked identity. */
@media(max-width:600px){
  #overlay.app-screen .dialog{
    overflow-x:hidden!important;
  }
  #signature-app-navigation{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 16px!important;
    padding:8px 0 12px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    border-radius:0!important;
  }
  #signature-app-navigation .signature-nav-top{
    display:grid!important;
    grid-template-columns:minmax(62px,1fr) minmax(0,2fr) minmax(76px,1fr)!important;
    gap:6px!important;
    align-items:center!important;
    min-width:0!important;
    padding-inline:2px;
  }
  #signature-app-navigation .signature-nav-identity{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:center!important;
    text-align:center!important;
    gap:2px!important;
    min-width:0!important;
    width:100%!important;
    margin:0!important;
  }
  #signature-app-navigation .sn-master-brand--nav{
    display:block!important;
    width:clamp(86px,26vw,108px)!important;
    max-width:100%!important;
    height:auto!important;
    aspect-ratio:864/856;
    object-fit:contain!important;
    margin:0 auto!important;
  }
  #signature-app-navigation #signature-role-label{
    font-size:9px!important;
    line-height:1.2!important;
    margin:0!important;
    letter-spacing:.09em!important;
  }
  #signature-app-navigation #signature-current-title{
    font-size:clamp(16px,4vw,19px)!important;
    line-height:1.15!important;
    margin:0!important;
    padding:0!important;
    overflow-wrap:anywhere!important;
  }
  #signature-app-navigation .signature-nav-back{
    justify-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:8px 2px!important;
    font-size:clamp(11px,2.6vw,13px)!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  #signature-app-navigation .signature-nav-utils{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:6px!important;
    justify-content:center!important;
    min-width:0!important;
  }
  #signature-app-navigation .signature-nav-utils button{
    display:block;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    margin:0!important;
    padding:8px 2px!important;
    font-size:clamp(10px,2.55vw,12px)!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
  }
  #signature-app-navigation .signature-nav-tabs{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
    overflow-x:clip!important;
    white-space:normal!important;
    scroll-snap-type:none!important;
    padding:12px 1px 0!important;
    margin:0!important;
    scrollbar-width:none!important;
  }
  #signature-app-navigation .signature-nav-tabs button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    width:100%!important;
    min-height:44px!important;
    height:auto!important;
    padding:9px 5px!important;
    margin:0!important;
    font-size:clamp(10px,2.6vw,12px)!important;
    line-height:1.2!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    white-space:normal!important;
    text-align:center!important;
    scroll-snap-align:none!important;
  }
  #overlay.app-screen .dialog:has(#signature-app-navigation:not([hidden])) > .close{
    display:none!important;
  }
  #overlay.app-screen .dialog #content{
    padding-top:0!important;
    min-width:0;
  }
  /* Welcome-matched decoration stays around content rather than covering it. */
  #overlay.app-screen .dialog::after{
    opacity:.18!important;
  }
}
@media(max-width:359px){
  #signature-app-navigation .signature-nav-top{
    grid-template-columns:minmax(54px,1fr) minmax(0,2fr) minmax(68px,1fr)!important;
    gap:4px!important;
  }
  #signature-app-navigation .sn-master-brand--nav{
    width:min(100%,86px)!important;
  }
  #signature-app-navigation .signature-nav-tabs{
    gap:5px!important;
  }
  #signature-app-navigation .signature-nav-tabs button{
    font-size:10px!important;
    padding:7px 3px!important;
  }
}
@media(min-width:601px){
  #signature-app-navigation .signature-nav-tabs{
    scrollbar-color:#d7a18b transparent;
  }
}