/* Hoper 登录：主页主图全屏 + 居中毛玻璃卡片（仅 qixu01.top） */
html[data-screen="login"],html[data-screen="login"] body{overflow:hidden!important;height:100%!important}
#loginView.login-screen{height:100svh!important;min-height:0!important;overflow:hidden!important}
/* 背景层：主页同一张主图，铺满全屏 */
html body #loginView.login-screen .login-aside,
html body #loginView.login-screen .login-aside .hoper-art{
  position:fixed!important;inset:0!important;width:100vw!important;height:100svh!important;max-width:none!important;
}
html body #loginView.login-screen .login-aside .hoper-character{
  width:auto!important;width:100%!important;height:100%!important;left:0!important;top:0!important;transform:none!important;filter:brightness(1.18) contrast(1.03)!important;
  object-fit:cover!important;object-position:center 26%!important;opacity:.96!important;
}
html body #loginView.login-screen .login-aside .hoper-art::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(75% 65% at 50% 42%,rgba(4,9,13,0),rgba(3,7,11,.55) 85%),
    linear-gradient(180deg,rgba(3,7,11,.10),rgba(3,7,11,.40));
}
html body #loginView.login-screen .login-aside .hoper-login-wordmark{display:none!important}
html body #loginView.login-screen .login-aside-copy{display:none!important}
/* 登录卡片：全屏居中 */
html body #loginView.login-screen .login-panel{
  position:fixed!important;
  left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  width:clamp(372px,23vw,452px)!important;
  height:auto!important;
  max-height:min(93svh,860px)!important;
  min-height:0!important;margin:0!important;
  padding:clamp(22px,1.6vw,32px) clamp(20px,1.5vw,30px)!important;
  display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;
  border-radius:clamp(22px,1.4vw,30px)!important;
  background:rgba(9,15,22,.56)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.12)!important;
  backdrop-filter:blur(28px) saturate(160%)!important;
  -webkit-backdrop-filter:blur(28px) saturate(160%)!important;
  overflow-y:auto!important;overscroll-behavior:contain!important;
  scrollbar-width:none!important;-ms-overflow-style:none!important;
  z-index:20!important;
}
html body #loginView.login-screen .login-panel::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
html body #loginView.login-screen .login-form-wrap{
  display:block!important;width:100%!important;max-height:none!important;
  margin:0!important;padding:0!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;overflow:visible!important;
}
html body #loginView.login-screen .login-form-wrap h1{color:#f4f6f3!important;font-size:clamp(26px,1.55vw,32px)!important;margin:10px 0 6px!important;letter-spacing:.01em}
html body #loginView.login-screen .login-form-wrap label{margin:13px 0!important;color:rgba(238,243,246,.74)!important;font-size:13.5px!important}
html body #loginView.login-screen .form-eyebrow{font-size:11.5px!important;letter-spacing:.16em!important;color:rgba(201,255,93,.88)!important}
html body #loginView.login-screen .form-muted,html body #loginView.login-screen .login-note{font-size:13.5px!important;color:rgba(238,243,246,.58)!important}
html body #loginView.login-screen .auth-switch{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:14px!important;padding:5px!important;display:flex!important}
html body #loginView.login-screen .auth-switch button{flex:1!important;padding:10px 0!important;font-size:14.5px!important;background:transparent!important;color:rgba(244,246,243,.62)!important;border-radius:10px!important}
html body #loginView.login-screen .auth-switch button.active{background:rgba(255,255,255,.14)!important;color:#fff!important}
html body #loginView.login-screen .koko-box input{
  height:50px!important;font-size:14.5px!important;
  background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.16)!important;
  border-radius:13px!important;color:#f4f6f3!important;
}
html body #loginView.login-screen .koko-box input::placeholder{color:rgba(244,246,243,.42)!important}
html body #loginView.login-screen .koko-box input:focus{border-color:rgba(201,255,93,.55)!important;box-shadow:0 0 0 3px rgba(201,255,93,.14)!important;background:rgba(255,255,255,.08)!important}
html body #loginView.login-screen .koko-box .koko-ico{stroke:rgba(244,246,243,.55)!important}
html body #loginView.login-screen .login-submit{height:52px!important;font-size:15.5px!important;border-radius:14px!important}
html body #loginView.login-screen .koko-lg-wander{height:50px!important;font-size:14.5px!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.14)!important;color:#eef3f6!important;border-radius:14px!important}
html body #loginView.login-screen .koko-lg-wander:hover{background:rgba(255,255,255,.1)!important}
html body #loginView.login-screen .koko-lg-agree{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:14px!important;padding:12px 14px!important;font-size:12.5px!important;line-height:1.55!important}
html body #loginView.login-screen .koko-lg-agree h4{color:rgba(244,246,243,.82)!important;margin:2px 0 8px!important;font-size:13px!important}
html body #loginView.login-screen .koko-lg-agree label{color:rgba(238,243,246,.64)!important;margin:6px 0!important;font-size:12.5px!important}
html body #loginView.login-screen .koko-lg-foot{font-size:11.5px!important;color:rgba(238,243,246,.52)!important}
html body #loginView.login-screen .koko-lg-signup{font-size:12.5px!important;color:rgba(238,243,246,.58)!important}
html body #loginView.login-screen .back-link{color:rgba(238,243,246,.62)!important;font-size:12.5px!important}
/* 矮屏紧凑 */
@media (max-height:820px){
  html body #loginView.login-screen .login-panel{max-height:92svh!important;padding:18px 20px!important}
  html body #loginView.login-screen .login-form-wrap h1{font-size:23px!important;margin:2px 0 3px!important}
  html body #loginView.login-screen .form-eyebrow{display:none!important}
  html body #loginView.login-screen .form-muted{display:none!important}
  html body #loginView.login-screen .login-form-wrap label{margin:8px 0!important;font-size:13px!important}
  html body #loginView.login-screen .koko-box input{height:44px!important}
  html body #loginView.login-screen .koko-lg-agree{padding:8px 10px!important}
  html body #loginView.login-screen .koko-lg-agree h4{margin:0 0 4px!important;font-size:12px!important}
  html body #loginView.login-screen .koko-lg-agree label{font-size:12px!important;line-height:1.45!important;margin:4px 0!important}
  html body #loginView.login-screen .koko-lg-foot{display:none!important}
  html body #loginView.login-screen .login-submit{height:46px!important;font-size:15px!important}
  html body #loginView.login-screen .koko-lg-wander{height:44px!important}
  html body #loginView.login-screen .koko-lg-signup{margin:8px 0 0!important}
}
@media (max-width:760px){
  html body #loginView.login-screen .login-panel{
    left:50%!important;right:auto!important;top:50%!important;transform:translate(-50%,-50%)!important;
    width:calc(100vw - 24px)!important;max-height:86svh!important;border-radius:20px!important;padding:20px 16px 16px!important;
  }
  html body #loginView.login-screen .login-aside .hoper-character{object-position:center top!important;opacity:.55!important}
}