/* Mobile correction: image without baked-in UI; one real selector and controls. */
@media (max-width:850px) {
  .app:not(.logged-in)>header {
    display:flex!important;
    min-height:70px!important;
    height:70px!important;
    padding:10px 14px!important;
    gap:10px!important;
    align-items:center!important;
    background:#081525!important;
    border-bottom:1px solid #ffffff25!important;
    overflow:visible!important;
  }
  .app:not(.logged-in)>header img {
    width:40px!important;
    height:40px!important;
    flex-shrink:0!important;
  }
  .app:not(.logged-in)>header .brand {
    min-width:0!important;
    flex:1!important;
  }
  .app:not(.logged-in)>header .brand strong {
    display:block!important;
    color:#fff!important;
    font-size:clamp(15px,4.1vw,19px)!important;
    line-height:1.3!important;
  }
  .app:not(.logged-in)>header .brand small {
    display:block!important;
    color:#d9e0e8!important;
    font-size:clamp(9px,2.25vw,11px)!important;
    letter-spacing:.02em!important;
  }
  .app:not(.logged-in)>header .coe-language-picker {
    display:flex!important;
    margin:0!important;
    max-width:118px!important;
    min-width:100px!important;
    flex:0 0 auto!important;
  }
  .app:not(.logged-in)>header .coe-language-picker select {
    max-width:118px!important;
    width:100%!important;
    color:#13243a!important;
    background:#fff9ed!important;
    font-size:12px!important;
    padding:8px 4px!important;
    border:1px solid #edc177!important;
    border-radius:10px!important;
  }
  .app:not(.logged-in) .landing>.coe-login-language {
    display:none!important;
  }
  .app:not(.logged-in) #main-content{
    min-height:calc(100dvh - 70px)!important;
    background:#081525!important;
  }
  .app:not(.logged-in) .landing{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    box-sizing:border-box!important;
    position:relative!important;
    width:100%!important;
    max-width:none!important;
    min-height:calc(100dvh - 70px)!important;
    height:auto!important;
    aspect-ratio:auto!important;
    padding:38px 15px 35px!important;
    overflow:visible!important;
    background-color:#101d2e!important;
    background-image:linear-gradient(180deg,rgba(7,17,30,.48),rgba(8,19,34,.68)),url('/assets/coe-mobile-command-room.jpg')!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
  }
  .app:not(.logged-in) .landing>.hero {
    display:none!important;
  }
  .app:not(.logged-in) #login-card {
    box-sizing:border-box!important;
    position:relative!important;
    display:block!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    max-width:450px!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    margin:0 auto!important;
    padding:24px 19px 24px!important;
    overflow:visible!important;
    border:1px solid #efc983!important;
    border-radius:22px!important;
    background:#fff!important;
    background-image:none!important;
    color:#1b2c46!important;
    box-shadow:0 16px 45px #0008!important;
    text-align:center!important;
  }
  .app:not(.logged-in) #login-card>.access-top{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:30px!important;
    height:auto!important;
    margin:0 auto 15px!important;
  }
  .app:not(.logged-in) #login-card .access-tag,
  .app:not(.logged-in) #login-card .access-icon,
  .app:not(.logged-in) #login-card .access-steps,
  .app:not(.logged-in) #login-card .coe-access-perks,
  .app:not(.logged-in) #login-card .coe-security-note,
  .app:not(.logged-in) #login-card #gate-note{
    display:none!important;
  }
  .app:not(.logged-in) #login-card>.access-top::before{
    content:"POLICE CHIEF";
    color:#1e3956!important;
    font-weight:850!important;
    font-size:clamp(16px,4.4vw,20px)!important;
    letter-spacing:.035em!important;
  }
  .app:not(.logged-in) #login-card>#access-title {
    display:block!important;
    margin:0 auto 11px!important;
    max-width:100%!important;
    font-size:clamp(24px,6vw,31px)!important;
    line-height:1.2!important;
    letter-spacing:-.035em!important;
    color:#132741!important;
    text-align:center!important;
  }
  .app:not(.logged-in) #login-card>.muted{
    display:block!important;
    max-width:325px!important;
    margin:0 auto 16px!important;
    font-size:13px!important;
    line-height:1.5!important;
    text-align:center!important;
    color:#53657b!important;
  }
  .app:not(.logged-in) #login-card #google,
  .app:not(.logged-in) #login-card[data-coe-auth-state="signed"] #google {
    box-sizing:border-box!important;
    position:static!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    max-width:none!important;
    min-height:52px!important;
    height:auto!important;
    margin:15px auto 10px!important;
    padding:10px 9px!important;
    background:#093d70!important;
    background-image:none!important;
    color:#fff!important;
    opacity:1!important;
    font-size:15px!important;
    border-radius:12px!important;
    text-align:center!important;
    gap:10px!important;
  }
  .app:not(.logged-in) #login-card #google .coe-google-icon {
    flex:0 0 28px!important;
    width:28px!important;
    height:28px!important;
  }
  .app:not(.logged-in) #login-card #google:focus-visible,
  .app:not(.logged-in) #login-card .coe-prereg-entry:focus-visible{
    outline:3px solid #b88122!important;
    outline-offset:3px!important;
  }
  .app:not(.logged-in) #login-card .access-divider{
    display:block!important;
    width:100%!important;
    margin:16px auto 12px!important;
    background:#dce0e7!important;
  }
  .app:not(.logged-in) #login-card .coe-prereg-entry,
  .app:not(.logged-in) #login-card[data-coe-auth-state="signed"] .coe-prereg-entry {
    box-sizing:border-box!important;
    position:static!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    max-width:none!important;
    min-height:62px!important;
    height:auto!important;
    padding:5px 0!important;
    margin:0 auto!important;
    border:0!important;
    border-radius:9px!important;
    background:transparent!important;
    color:#1f3653!important;
    box-shadow:none!important;
    opacity:1!important;
    text-align:left!important;
  }
  .app:not(.logged-in) #login-card .coe-prereg-entry small{
    display:block!important;
    font-size:12px!important;
    line-height:1.4!important;
  }
  .app:not(.logged-in) #login-card #status,
  .app:not(.logged-in) #login-card[data-coe-auth-state="signed"] #status{
    position:static!important;
    max-width:100%!important;
    margin:12px auto!important;
    padding:0!important;
    color:#53657b!important;
    background:transparent!important;
    font-size:12px!important;
    line-height:1.4!important;
    opacity:1!important;
  }
  .app:not(.logged-in) #login-card #status:empty{display:none!important}
  .app:not(.logged-in) #login-card #claim{
    position:static!important;
    width:100%!important;
    height:auto!important;
    margin:10px auto!important;
    color:#1f3653!important;
  }
  .app:not(.logged-in) #login-card #claim[hidden],
  .app:not(.logged-in) #login-card #logout[hidden],
  .app:not(.logged-in) #login-card #player[hidden]{
    display:none!important;
  }
}
@media (max-width:370px){
  .app:not(.logged-in)>header{padding:8px 10px!important;gap:7px!important}
  .app:not(.logged-in)>header img{width:35px!important;height:35px!important}
  .app:not(.logged-in)>header .brand strong{font-size:14px!important}
  .app:not(.logged-in)>header .brand small{font-size:8px!important}
  .app:not(.logged-in)>header .coe-language-picker{min-width:91px!important;max-width:100px!important}
  .app:not(.logged-in) .landing{padding:22px 10px 24px!important}
  .app:not(.logged-in) #login-card{padding:20px 13px!important}
}
