/* Compact phone language selector shared by index.html and all shell pages. */
@media (max-width:900px){
  body.shell .navDrawer .navRight{
    display:block !important;
    width:100% !important;
    margin:12px 0 0 !important;
    padding:14px 4px 4px !important;
    border-top:1px solid rgba(255,255,255,.075) !important;
    opacity:1 !important;
    transform:none !important;
  }

  body.shell .navDrawer .langSwitch{
    position:relative !important;
    display:block !important;
    width:100% !important;
  }

  body.shell .navDrawer .langSwitch::after{
    display:none !important;
    content:none !important;
  }

  /* Only the selected language is visible until the user taps it. */
  body.shell .navDrawer .langBtn{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    min-height:46px !important;
    padding:0 15px !important;
    border:1px solid rgba(255,255,255,.075) !important;
    border-radius:13px !important;
    background:rgba(255,255,255,.035) !important;
    color:rgba(238,243,255,.88) !important;
    font-size:13px !important;
    font-weight:750 !important;
    letter-spacing:.05em !important;
    text-align:left !important;
    cursor:pointer !important;
    -webkit-tap-highlight-color:transparent !important;
    touch-action:manipulation !important;
  }

  body.shell .navDrawer .langBtn::after{
    content:"" !important;
    display:block !important;
    width:8px !important;
    height:8px !important;
    margin-left:12px !important;
    border-right:1.5px solid rgba(223,232,255,.60) !important;
    border-bottom:1.5px solid rgba(223,232,255,.60) !important;
    transform:rotate(45deg) translate(-1px,-1px) !important;
    transition:transform .18s ease !important;
  }

  body.shell .navDrawer .langSwitch.open .langBtn{
    border-color:rgba(91,145,255,.20) !important;
    background:rgba(57,124,255,.09) !important;
  }

  body.shell .navDrawer .langSwitch.open .langBtn::after{
    transform:rotate(225deg) translate(-1px,-1px) !important;
  }

  body.shell .navDrawer .langMenu{
    position:static !important;
    inset:auto !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:100% !important;
    min-width:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    gap:4px !important;
    overflow:hidden !important;
    border:0 solid transparent !important;
    border-radius:13px !important;
    background:rgba(255,255,255,.025) !important;
    box-shadow:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-5px) !important;
    transition:max-height .2s ease,margin .2s ease,padding .2s ease,opacity .16s ease,transform .2s ease,visibility 0s linear .2s !important;
  }

  body.shell .navDrawer .langSwitch.open .langMenu{
    max-height:64px !important;
    margin-top:8px !important;
    padding:4px !important;
    border-width:1px !important;
    border-color:rgba(255,255,255,.065) !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
    transition:max-height .2s ease,margin .2s ease,padding .2s ease,opacity .16s ease,transform .2s ease,visibility 0s !important;
  }

  body.shell .navDrawer .langOpt{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    min-height:40px !important;
    padding:9px 12px !important;
    border:0 !important;
    border-radius:9px !important;
    color:rgba(225,234,255,.68) !important;
    background:transparent !important;
    font-size:13px !important;
    font-weight:750 !important;
    letter-spacing:.04em !important;
    cursor:pointer !important;
    -webkit-tap-highlight-color:transparent !important;
    touch-action:manipulation !important;
  }

  body.shell .navDrawer .langOpt.active{
    color:#fff !important;
    background:rgba(57,124,255,.20) !important;
    box-shadow:inset 0 0 0 1px rgba(93,151,255,.16) !important;
  }
}
