/* 微剧登录/注册弹窗：PC 对齐 1327:9381 / 1335:2，H5 对齐 1349:10185 / 1349:10251 */
.hg-auth-modal{
  position:fixed;
  inset:0;
  z-index:12000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  box-sizing:border-box;
}
.hg-auth-modal[hidden]{
  display:none !important;
}
.hg-auth-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
}
.hg-auth-modal__box{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  max-width:100%;
  max-height:calc(100vh - 32px);
}
/* 提示条：纯文本嵌在卡片内容区顶部，不做成卡片（Bug 44821 验收要求：位于登录弹窗内容
   顶部，无背景、无边框、左对齐）。原先是深底 #111 + 1px 边框 + 12px 圆角 + 文本居中，
   且挂在卡片外面，被测试判为与验收稿不符。
   white-space 放开成 normal：左对齐后文案要能在窄卡片里正常折行，nowrap 会撑破 400px 卡片。 */
.hg-auth-tip{
  display:flex;
  align-items:flex-start;
  gap:7px;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  margin:0 0 12px;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:#ff771c;
  font-size:14px;
  line-height:normal;
  white-space:normal;
  text-align:left;
}
.hg-auth-tip[hidden]{
  display:none !important;
}
.hg-auth-tip img{
  display:block;
  width:20px;
  height:20px;
  flex:none;
}
.hg-auth-tip p{
  margin:0;
  color:#ff771c;
  font-size:14px;
  line-height:normal;
  text-align:left;
}
.hg-auth-modal .hg-auth-card{
  position:relative;
  z-index:1;
  max-height:calc(100vh - 88px);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
body.is-hg-auth-open{
  overflow:hidden;
}
.hg-auth-card{
  position:relative;
  width:400px;
  max-width:100%;
  box-sizing:border-box;
  padding:28px 22px 20px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;
  background:#111;
  box-shadow:0 40px 120px rgba(0,0,0,.85),0 0 0 1px rgba(255,77,184,.08),inset 0 1px 0 rgba(255,255,255,.05);
}
.hg-auth-card__close{
  position:absolute;
  top:20px;
  right:22px;
  width:32px;
  height:32px;
  padding:0;
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  cursor:pointer;
}
.hg-auth-card__close-box{
  width:32px;
  height:32px;
  border-radius:16px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  justify-content:center;
}
.hg-auth-card__close img{
  width:15px;
  height:15px;
  display:block;
}
.hg-auth-card__close:hover .hg-auth-card__close-box{
  background:rgba(255,255,255,.1);
}
.hg-auth-card__brand{
  display:flex;
  justify-content:center;
  margin:0 auto 12px;
}
.hg-auth-card__brand img{
  display:block;
  width:auto;
  height:48px;
}
.hg-auth-card__title{
  margin:0 0 12px;
  font-size:22px;
  font-weight:500;
  line-height:1.2;
  text-align:center;
  color:#fff;
}
.hg-auth-tabs{
  margin:0 0 12px;
}
.hg-auth-tabs__track{
  display:flex;
  align-items:center;
  height:40px;
  padding:3px;
  box-sizing:border-box;
  border-radius:100px;
  background:#1c1c1c;
}
.hg-auth-tabs__item{
  flex:1 1 0;
  height:34px;
  padding:0;
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:100px;
  color:rgba(255,255,255,.65);
  font-size:14px;
  font-weight:400;
  text-decoration:none;
  cursor:pointer;
}
/* 激活页签：稿 1327:9396 / 1327:9448 黄渐变胶囊。
   common.css 的 button:not(.hg-btn){background-color:unset} 特指度 0,1,1，
   单类名会被盖掉，双类 + button 提到 0,2,1。 */
button.hg-auth-tabs__item.is-active{
  color:#000;
  font-weight:500;
  background-color:transparent;
  background-image:linear-gradient(-63.87deg,#ffd21c 61.18%,#ffeb98 103.95%);
}
.hg-auth-form{
  display:none;
  flex-direction:column;
  gap:10px;
}
.hg-auth-form.is-active,
.hg-auth-form:not([hidden]){
  display:flex;
}
.hg-auth-form[hidden]{
  display:none !important;
}
.hg-auth-field{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.hg-auth-field__label{
  font-size:13px;
  line-height:16px;
  letter-spacing:.2px;
  color:#fff;
}
.hg-auth-field__optional{
  color:rgba(255,255,255,.6);
}
.hg-auth-field__box{
  position:relative;
  display:flex;
  align-items:center;
  height:42px;
  padding:0 16px 0 40px;
  border-radius:100px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.1);
  box-sizing:border-box;
}
.hg-auth-field__box:focus-within{
  border-color:#ffd21c;
}
.hg-auth-field__box:has(.hg-auth-field__eye){
  padding-right:48px;
}
.hg-auth-field__input{
  width:100%;
  height:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font-size:14px;
  line-height:normal;
  font-weight:400;
}
.hg-auth-field__input:not(:placeholder-shown){
  font-weight:500;
}
.hg-auth-field__input::placeholder{
  color:rgba(255,255,255,.5);
  font-weight:400;
}
button.hg-auth-field__eye{
  -webkit-appearance:none;
  appearance:none;
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  flex:none;
}
button.hg-auth-field__eye img{
  display:block;
  width:16px;
  height:16px;
  object-fit:contain;
}
.hg-auth-ico{
  position:absolute;
  left:16px;
  top:50%;
  width:16px;
  height:16px;
  transform:translateY(-50%);
}
.hg-auth-ico img{
  display:block;
  position:absolute;
}
.hg-auth-ico__user-head{
  left:5px;
  top:2px;
  width:7px;
  height:7px;
}
.hg-auth-ico__user-body{
  left:3px;
  top:10px;
  width:11px;
  height:5px;
}
.hg-auth-ico__lock-bow{
  left:4px;
  top:1px;
  width:8px;
  height:7px;
}
.hg-auth-ico__lock-body{
  left:1px;
  top:7px;
  width:13px;
  height:9px;
}
.hg-auth-form__hint{
  margin:0;
  font-size:12px;
  line-height:16px;
  text-align:center;
  color:#fff;
}
.hg-auth-form__warn{
  margin:0;
  font-size:12px;
  line-height:16px;
  letter-spacing:.2px;
  color:#ffd21c;
}
.hg-auth-form__error{
  margin:0;
  font-size:13px;
  line-height:18px;
  color:#ff5a5a;
  text-align:center;
}
.hg-auth-form__error[hidden]{
  display:none !important;
}
/* 主按钮：稿 1327:9430「登录」/ 1327:9495「创建账号」—— 实心 #FFD21C、高 52、圆角 26、16 Semibold 黑字。
   必须压过 common.css 的 button:not(.hg-btn){background-color:unset}，否则黄底被卸掉只剩白/黑字。 */
button.hg-auth-submit.hg-auth-submit{
  -webkit-appearance:none;
  appearance:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:42px;
  margin:0;
  padding:0;
  border:0;
  border-radius:21px;
  background-color:#ffd21c;
  background-image:none;
  color:#000;
  font-size:15px;
  font-weight:600;
  line-height:24px;
  letter-spacing:1px;
  cursor:pointer;
}
button.hg-auth-submit.hg-auth-submit:hover{
  filter:brightness(1.05);
}
button.hg-auth-submit.hg-auth-submit:disabled{
  opacity:.6;
  cursor:not-allowed;
}
@media (max-width:767px){
  .hg-auth-modal{
    padding:20px 10px;
    align-items:center;
  }
  .hg-auth-modal__box{
    max-height:calc(100vh - 40px);
    gap:8px;
  }
  .hg-auth-tip{
    margin-bottom:8px;
    padding:0;
    white-space:normal;
  }
  .hg-auth-tip p{
    font-size:13px;
  }
  .hg-auth-card,
  .hg-auth-modal .hg-auth-card{
    width:94.67vw;
    max-width:355px;
    padding:18px 16px 16px;
    border-radius:18px;
    max-height:calc(100vh - 92px);
  }
  .hg-auth-card__close{
    top:15px;
    right:16px;
    width:24px;
    height:24px;
  }
  .hg-auth-card__close-box{
    width:24px;
    height:24px;
    border-radius:12px;
  }
  .hg-auth-card__close img{
    width:11px;
    height:11px;
  }
  .hg-auth-card__brand{
    margin:0 auto 8px;
  }
  .hg-auth-card__brand img{
    height:36px;
  }
  .hg-auth-card__title{
    font-size:18px;
    margin-bottom:8px;
  }
  .hg-auth-tabs{
    margin-bottom:8px;
  }
  .hg-auth-tabs__track{
    height:40px;
  }
  .hg-auth-tabs__item{
    height:34px;
    font-size:13px;
  }
  .hg-auth-form{
    gap:8px;
  }
  .hg-auth-field__label{
    font-size:12px;
    line-height:15px;
  }
  .hg-auth-field__box{
    height:39px;
    padding:0 12px 0 36px;
  }
  .hg-auth-field__box:has(.hg-auth-field__eye){
    padding-right:40px;
  }
  .hg-auth-field__input{
    font-size:12px;
  }
  .hg-auth-ico{
    left:12px;
  }
  button.hg-auth-field__eye{
    left:auto;
    right:12px;
    width:24px;
    height:24px;
  }
  button.hg-auth-field__eye img{
    width:16px;
    height:16px;
  }
  .hg-auth-form__hint,
  .hg-auth-form__warn{
    font-size:12px;
  }
  button.hg-auth-submit.hg-auth-submit{
    height:39px;
    border-radius:19px;
    font-size:13px;
    letter-spacing:.6px;
  }
}
