/* 右上角双杠触发器（= 与 × 共用同一尺寸、同一定位） */
.site-auth-trigger{
  --auth-bar-w:22px;
  --auth-bar-h:2px;
  --auth-bar-gap:7px;
  position:relative;
  border:0;background:transparent;cursor:pointer;
  width:36px;height:36px;padding:0;flex-shrink:0;
  transition:opacity .2s;
}
.site-auth-trigger:hover{opacity:.75}
.site-auth-trigger__bar{
  position:absolute;top:50%;left:50%;
  width:var(--auth-bar-w);height:var(--auth-bar-h);min-height:var(--auth-bar-h);max-height:var(--auth-bar-h);
  margin:0;margin-left:calc(var(--auth-bar-w) / -2);margin-top:calc(var(--auth-bar-h) / -2);
  background:currentColor;border-radius:1px;
  transform-origin:50% 50%;
  transition:transform .28s cubic-bezier(.33,1,.68,1);
  will-change:transform;
}
.site-auth-trigger__bar:first-child{
  transform:translateY(calc((var(--auth-bar-gap) + var(--auth-bar-h)) / -2));
}
.site-auth-trigger__bar:last-child{
  transform:translateY(calc((var(--auth-bar-gap) + var(--auth-bar-h)) / 2));
}
.site-auth-trigger.is-open .site-auth-trigger__bar:first-child{
  transform:translateY(0) rotate(45deg);
}
.site-auth-trigger.is-open .site-auth-trigger__bar:last-child{
  transform:translateY(0) rotate(-45deg);
}
#site-topbar .site-auth-trigger{color:#0b0b0b}
body.site-auth-modal-open #site-topbar{z-index:5001}

/* 全屏菜单 — 左登录 · 右导航 */
.site-auth-modal{
  position:fixed;inset:0;z-index:5000;
  overflow:hidden;
  pointer-events:none;
}
.site-auth-modal.is-open{pointer-events:auto}
.site-auth-modal[hidden]{display:none!important}
.site-auth-modal__view[hidden]{display:none!important}

.site-auth-modal__sheet{
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  background:#fff;
  transform:translate3d(0,100%,0);
  transition:transform .52s cubic-bezier(.32,.72,0,1);
  will-change:transform;
  box-shadow:0 -12px 40px rgba(0,0,0,.08);
}
.site-auth-modal:not(.is-open) .site-auth-modal__sheet{
  transform:translate3d(0,100%,0);
}
.site-auth-modal.is-open .site-auth-modal__sheet{
  transform:translate3d(0,0,0);
}

.site-auth-modal__backdrop{
  position:absolute;inset:0;
  background:#fff;
}

.site-auth-modal__panel{
  position:relative;z-index:1;flex:1;
  display:flex;align-items:center;justify-content:center;
  min-height:0;
  padding:clamp(4rem,10vh,5rem) 0 clamp(1.5rem,4vh,2.5rem);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}

.site-auth-modal__layout{
  display:grid;
  grid-template-columns:minmax(16rem,19rem) minmax(0,1fr);
  gap:0;
  align-items:center;
  width:100%;
  max-width:76rem;
}

.site-auth-modal__sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* —— 左侧：登录 / 账号 —— */
.site-auth-modal__aside{
  align-self:center;
  max-width:19rem;
  padding-right:clamp(2rem,4vw,3.5rem);
  border-right:1px solid rgba(11,11,11,.1);
  opacity:0;transform:translate3d(-2rem,0,0);
  transition:opacity .5s cubic-bezier(.22,1,.36,1) .12s,transform .5s cubic-bezier(.22,1,.36,1) .12s;
}
.site-auth-modal.is-open .site-auth-modal__aside{
  opacity:1;transform:translate3d(0,0,0);
}

.site-auth-modal__form{
  display:flex;flex-direction:column;gap:1.15rem;
}

.site-auth-modal__field{display:block}
.site-auth-modal__label{
  display:block;margin-bottom:.5rem;
  font-size:.75rem;font-weight:600;line-height:1.4;
  letter-spacing:.02em;color:rgba(11,11,11,.58);
}
.site-auth-modal__field > input{
  width:100%;
  border:1px solid rgba(11,11,11,.18);
  border-radius:0;
  padding:.85rem .9rem;font-size:1rem;line-height:1.4;
  background:#fff;color:#0b0b0b;
  transition:border-color .2s,background .2s;
}
.site-auth-modal__field > input::placeholder{color:rgba(11,11,11,.32)}
.site-auth-modal__field > input:focus{
  outline:none;border-color:#0b0b0b;background:#fafafa;
}
.site-auth-modal__input-wrap{
  position:relative;display:flex;align-items:center;
}
.site-auth-modal__input-wrap input{
  width:100%;
  border:1px solid rgba(11,11,11,.18);
  border-radius:0;
  padding:.85rem 2.75rem .85rem .9rem;font-size:1rem;line-height:1.4;
  background:#fff;color:#0b0b0b;
  transition:border-color .2s,background .2s;
}
.site-auth-modal__input-wrap input::placeholder{color:rgba(11,11,11,.32)}
.site-auth-modal__input-wrap input:focus{
  outline:none;border-color:#0b0b0b;background:#fafafa;
}
.site-auth-modal__eye{
  position:absolute;right:.5rem;top:50%;transform:translateY(-50%);
  border:0;background:transparent;cursor:pointer;
  padding:.25rem;color:rgba(11,11,11,.42);
  line-height:1;
}
.site-auth-modal__eye:hover{color:#0b0b0b}

.site-auth-modal__message{
  margin:0;min-height:1.25rem;
  font-size:.8125rem;line-height:1.45;font-weight:500;
}
.site-auth-modal__message.is-error{color:#b91c1c}
.site-auth-modal__message.is-ok{color:#15803d}

.site-auth-modal__submit{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;border:0;border-radius:0;
  margin-top:.35rem;padding:1rem .9rem;
  font-size:.9375rem;font-weight:700;line-height:1.4;
  background:#0b0b0b;color:#fff;cursor:pointer;
  transition:background .2s,padding-left .2s;
}
.site-auth-modal__submit i{
  font-size:1.125rem;line-height:1;
  transition:transform .2s;
}
.site-auth-modal__submit:hover{background:#1a1a1a;padding-left:1.15rem}
.site-auth-modal__submit:hover i{transform:translateX(3px)}
.site-auth-modal__submit:disabled{
  opacity:.55;cursor:not-allowed;
  padding-left:.9rem;
}
.site-auth-modal__submit:disabled:hover i{transform:none}

.site-auth-modal__view--user{text-align:left}
.site-auth-modal__user{
  padding-bottom:1.5rem;
  border-bottom:2px solid #0b0b0b;
}
.site-auth-modal__user-head{
  display:flex;align-items:center;gap:1rem;
}
.site-auth-modal__user-meta{min-width:0;flex:1}
.site-auth-modal__view--user .site-auth-modal__avatar{
  flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  width:3.25rem;height:3.25rem;
  background:#0b0b0b;color:#fff;
  font-size:1.25rem;font-weight:800;line-height:1;
  letter-spacing:-.02em;
}
.site-auth-modal__kicker{
  margin:0;
  font-size:.75rem;font-weight:600;
  line-height:1.45;letter-spacing:.02em;
  color:rgba(11,11,11,.58);
}
.site-auth-modal__view--user .site-auth-modal__username{
  margin:.3rem 0 0;
  font-size:clamp(1.35rem,3.6vw,1.75rem);font-weight:800;
  line-height:1.25;letter-spacing:-.03em;color:#0b0b0b;
  word-break:break-all;
}

.site-auth-modal__view--user .site-auth-modal__actions{
  display:flex;flex-direction:column;gap:0;
  margin-top:1.25rem;
}
.site-auth-modal__action{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;border:0;
  padding:1.05rem 0;font-size:.9375rem;font-weight:600;
  line-height:1.4;letter-spacing:0;
  text-align:left;text-decoration:none;cursor:pointer;
  background:transparent;color:#0b0b0b;
  border-bottom:1px solid rgba(11,11,11,.14);
  transition:color .2s,background .2s,padding-left .2s;
}
.site-auth-modal__action:last-child{border-bottom:0}
.site-auth-modal__action-text{display:block}
.site-auth-modal__action i{
  flex-shrink:0;font-size:1.125rem;line-height:1;
  color:rgba(11,11,11,.38);
  transition:color .2s,transform .2s;
}
.site-auth-modal__action--primary{color:#0b0b0b}
.site-auth-modal__action--primary:hover{
  color:#0b0b0b;padding-left:.35rem;
}
.site-auth-modal__action--primary:hover i{
  color:#eab308;transform:translate(2px,-2px);
}
.site-auth-modal__action--ghost{color:rgba(11,11,11,.68)}
.site-auth-modal__action--ghost:hover{
  color:#0b0b0b;padding-left:.35rem;
}
.site-auth-modal__action--ghost:hover i{color:#0b0b0b}

/* —— 右侧：超大导航（双列） —— */
.site-auth-modal__nav{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(2rem,5vw,4.5rem);
  row-gap:clamp(.75rem,2vh,1.25rem);
  align-content:center;
  align-self:center;
  width:100%;
  max-width:54rem;
  padding:0 0 0 clamp(2rem,4.5vw,4rem);
}
.site-auth-modal__nav-link{
  display:block;
  font-size:clamp(1.85rem,4.8vw,3.35rem);
  font-weight:800;line-height:.92;letter-spacing:-.04em;
  text-align:left;text-decoration:none;color:#0b0b0b;
  opacity:0;transform:translate3d(2rem,0,0);
  transition:color .2s ease,opacity .5s cubic-bezier(.22,1,.36,1),transform .5s cubic-bezier(.22,1,.36,1);
  transition-delay:calc(.1s + var(--nav-i, 0) * .04s);
}
.site-auth-modal.is-open .site-auth-modal__nav-link{
  opacity:1;transform:translate3d(0,0,0);
}
.site-auth-modal__nav-link:hover{color:#eab308}
.site-auth-modal__nav-link.is-active{color:#cc1c23}

@media(min-width:901px){
  .site-auth-modal__nav-link{
    font-size:clamp(2.65rem,3.6vw,4.75rem);
    line-height:.9;
    letter-spacing:-.042em;
  }
  .site-auth-modal__nav{
    row-gap:clamp(.55rem,1.4vh,1rem);
    column-gap:clamp(2.5rem,6vw,5.5rem);
  }
}

body.site-auth-modal-open{overflow:hidden!important}

@media(prefers-reduced-motion:reduce){
  .site-auth-modal__sheet{transition:none}
  .site-auth-modal__aside,
  .site-auth-modal__nav-link{
    opacity:1!important;transform:none!important;transition:none!important;
  }
}

@media(max-width:900px){
  .site-auth-modal__panel{align-items:flex-start}
  .site-auth-modal__layout{
    grid-template-columns:1fr;
    gap:clamp(2rem,6vh,3rem);
    max-width:none;
  }
  .site-auth-modal__aside{
    align-self:stretch;max-width:none;
    order:2;
    padding-right:0;
    border-right:0;
    padding-top:1.5rem;
    border-top:2px solid #0b0b0b;
  }
  .site-auth-modal__nav{
    order:1;
    max-width:none;
    padding:0;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:clamp(1rem,5vw,1.75rem);
    row-gap:clamp(.5rem,2vh,.85rem);
  }
  .site-auth-modal__nav-link{
    font-size:clamp(1.65rem,7.5vw,2.35rem);
    line-height:.95;
    letter-spacing:-.035em;
  }
}

@media(max-width:768px){
  .site-auth-modal__input-wrap input{font-size:16px!important}
}