/* =========================================================
   MagicTalk v26.89 – echte Mobile-Optimierung der Loginseite
   Desktop bleibt unverändert. Gilt nur bis 600px Viewport.
   ========================================================= */
@media (max-width:600px){
  html,body{max-width:100%;overflow-x:hidden!important}
  body.v2517{
    display:block!important;
    min-height:100dvh!important;
    padding:6px 5px calc(12px + env(safe-area-inset-bottom))!important;
    background-attachment:scroll!important;
    background-position:center top!important;
  }

  body.v2517 .start-v2517{
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    margin:0 auto!important;
    padding:11px 10px 13px!important;
    border-radius:15px!important;
  }
  body.v2517 .start-v2517:after{
    inset:5px!important;
    border-radius:11px!important;
  }

  /* Kopfbereich deutlich kompakter */
  body.v2517 .identity-v2517{
    margin:6px 0 7px!important;
  }
  body.v2517 .identity-v2517 .mark{
    font-size:11px!important;
    letter-spacing:.14em!important;
  }
  body.v2517 .identity-v2517 h1{
    margin:4px 0 2px!important;
    font-size:28px!important;
    line-height:1.02!important;
  }
  body.v2517 .identity-v2517 p{
    margin:5px 0!important;
    font-size:9px!important;
  }
  body.v2517 .identity-magictalk-v2624 .developer-v2624{
    margin-top:5px!important;
    font-size:10px!important;
  }
  body.v2517 .identity-magictalk-v2624 .station-v2624{
    margin-top:3px!important;
    font-size:8.5px!important;
  }

  body.v2517 .promise-v2517{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:9px auto!important;
    padding:7px 8px!important;
    border-radius:10px!important;
    font-size:9px!important;
    line-height:1.25!important;
    text-align:center!important;
    white-space:normal!important;
  }
  body.v2517 .online-v2517{
    margin:0 auto 9px!important;
    padding:7px 12px!important;
    font-size:10px!important;
    border-radius:9px!important;
  }

  /* Online-Liste nicht künstlich hoch halten */
  body.v2517 .who-v2519{
    min-height:0!important;
    margin:0 auto 10px!important;
    padding:8px 9px!important;
    border-radius:10px!important;
  }
  body.v2517 .who-title-v2519{
    margin:0 0 6px!important;
    padding-bottom:5px!important;
    font-size:10px!important;
  }
  body.v2517 .who-list-v2519{
    min-height:30px!important;
    gap:5px!important;
    padding:0!important;
  }
  body.v2517 .who-user-v2519{
    min-height:28px!important;
    padding:5px 9px!important;
    font-size:10px!important;
  }

  /* Login-Aktionen */
  body.v2517 .actions-v2517{
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  body.v2517 .big-v2517{
    min-height:42px!important;
    height:42px!important;
    font-size:11px!important;
    padding:0 8px!important;
  }
  body.v2517 .greeting-v2517{
    margin:8px 0 9px!important;
    padding:7px 8px!important;
    font-size:9.5px!important;
    line-height:1.3!important;
  }
  body.v2517 .new-v2517{
    margin:3px 0 5px!important;
    font-size:9.5px!important;
  }
  body.v2517 .register-v2517{
    width:100%!important;
    min-height:40px!important;
    margin:0 auto!important;
    padding:7px 10px!important;
    font-size:10.5px!important;
  }
  body.v2517 .links-v2517{
    gap:6px 12px!important;
    margin:10px 0 6px!important;
  }
  body.v2517 .links-v2517 a{font-size:9px!important}
  body.v2517 .copy-v2517{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:8px auto 0!important;
    padding:6px 8px!important;
    border-radius:9px!important;
    font-size:7.5px!important;
    line-height:1.3!important;
    text-align:center!important;
    white-space:normal!important;
  }

  /* Login/Gast/Registrierung als richtiges Mobile-Dialogfenster */
  body.v2517 .modal-v2517{
    place-items:start center!important;
    padding:max(6px,env(safe-area-inset-top)) 5px max(6px,env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
  }
  body.v2517 .box-v2517{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 12px)!important;
    margin:0!important;
    padding:12px 11px 14px!important;
    border-radius:13px!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.v2517 .boxhead-v2517{
    position:sticky!important;
    top:-12px!important;
    z-index:3!important;
    margin:0 -3px 10px!important;
    padding:7px 3px 6px!important;
    background:linear-gradient(180deg,#071426 75%,rgba(7,20,38,.9))!important;
  }
  body.v2517 .boxhead-v2517 h2{font-size:16px!important}
  body.v2517 .close-v2517{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    font-size:18px!important;
  }
  body.v2517 .field-v2517{margin-bottom:8px!important}
  body.v2517 .field-v2517 label{font-size:10px!important}
  body.v2517 .field-v2517 input{
    width:100%!important;
    min-width:0!important;
    height:43px!important;
    min-height:43px!important;
    font-size:16px!important;
  }
  body.v2517 .check-v2517{
    align-items:flex-start!important;
    gap:8px!important;
    font-size:10px!important;
  }
  body.v2517 .check-v2517 input{
    flex:0 0 auto!important;
    width:18px!important;
    height:18px!important;
    margin-top:1px!important;
  }
}

@media (max-width:380px){
  body.v2517{padding-left:3px!important;padding-right:3px!important}
  body.v2517 .start-v2517{padding-left:8px!important;padding-right:8px!important}
  body.v2517 .identity-v2517 h1{font-size:25px!important}
  body.v2517 .actions-v2517{grid-template-columns:1fr!important;gap:6px!important}
  body.v2517 .big-v2517{height:40px!important;min-height:40px!important}
  body.v2517 .promise-v2517{font-size:8.5px!important}
}