:root{
  color-scheme:light;
  --login-ink:#181512;
  --login-muted:#6f6962;
  --login-line:#e7ddd1;
  --login-paper:#fbf7f0;
  --login-paper-2:#fffdfa;
  --login-orange:#f4770b;
  --login-orange-dark:#b84900;
  --login-danger:#b93620;
}
*{box-sizing:border-box}
html,body{min-width:320px;min-height:100%;margin:0}
html{background:var(--login-paper)}
body{overflow-x:clip;background:radial-gradient(circle at 4% 92%,rgba(244,119,11,.08),transparent 28%),var(--login-paper);color:var(--login-ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif}
a,button,input{touch-action:manipulation;-webkit-tap-highlight-color:rgba(244,119,11,.16)}
a,button,input{transition:color .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease}
.skip-link{position:fixed;z-index:100;left:16px;top:12px;translate:0 -180%;padding:10px 14px;border-radius:10px;background:#fffdfa;color:var(--login-ink);font-weight:800;text-decoration:none;box-shadow:0 12px 34px rgba(42,28,17,.16)}
.skip-link:focus-visible{translate:0 0;outline:3px solid rgba(244,119,11,.42);outline-offset:2px}
.xiaozhou-filter-defs{position:absolute;overflow:hidden;pointer-events:none}

.login-header{height:86px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 clamp(24px,3.4vw,56px);border-bottom:1px solid var(--login-line);background:rgba(255,253,250,.86);position:relative;z-index:2}
.brand{display:flex;align-items:center;gap:13px;min-width:0;color:var(--login-ink);text-decoration:none}
.brand img{width:48px;height:48px;object-fit:contain}
.brand span{font-size:19px;font-weight:900;letter-spacing:-.02em;white-space:nowrap}
.brand small{display:block;margin-top:2px;color:#81786f;font-size:10px;font-weight:600;letter-spacing:.03em}
.back{display:inline-flex;align-items:center;gap:10px;padding:10px 4px;color:#554e47;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}
.back span{color:var(--login-orange);font-size:23px;line-height:1}
.back:hover{color:var(--login-orange-dark);transform:translateX(-2px)}
.brand:focus-visible,.back:focus-visible{outline:3px solid rgba(244,119,11,.38);outline-offset:4px;border-radius:8px}

.login-page{width:min(1540px,100%);min-height:calc(100dvh - 86px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.42fr) minmax(410px,.78fr)}
.login-story{min-width:0;display:grid;place-items:center;padding:clamp(30px,5vh,62px) clamp(30px,4vw,66px)}
.xiaozhou-login{width:min(900px,100%);min-height:620px;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(330px,1.1fr);align-items:center;gap:clamp(28px,4vw,64px);position:relative;isolation:isolate}
.xiaozhou-login::before{content:"";position:absolute;z-index:-2;width:min(43vw,470px);aspect-ratio:1;left:-8%;bottom:3%;border-radius:50%;background:linear-gradient(145deg,#ffe8cf,#fff4e6 62%,#fffdfa);box-shadow:0 0 0 1px rgba(244,119,11,.08)}
.xiaozhou-login::after{content:"";position:absolute;z-index:-1;width:260px;height:310px;left:14%;bottom:3%;background-image:radial-gradient(circle,rgba(244,119,11,.24) 1.2px,transparent 1.4px);background-size:15px 15px;mask-image:linear-gradient(to top,#000,transparent 90%);opacity:.7;pointer-events:none}
.xiaozhou-login>img{width:100%;height:min(68vh,650px);min-height:480px;display:block;align-self:end;object-fit:contain;object-position:center bottom;filter:url("#xiaozhou-remove-cream") drop-shadow(0 18px 22px rgba(58,38,22,.14));transform-origin:50% 90%;animation:loginXiaozhouIn .72s cubic-bezier(.16,1,.3,1) both}
.xiaozhou-login>div{min-width:0;padding:10px 0;animation:loginCopyIn .68s .08s cubic-bezier(.16,1,.3,1) both}
.xiaozhou-login h1{max-width:500px;margin:0;color:var(--login-ink);font-size:clamp(38px,3.2vw,54px);font-weight:900;line-height:1.16;letter-spacing:-.055em;text-wrap:balance;word-break:keep-all}
.xiaozhou-login>div>p{display:flex;align-items:center;gap:14px;margin:20px 0 34px;color:#3f3933;font-size:17px;font-weight:650}
.xiaozhou-login>div>p i{width:38px;height:4px;border-radius:999px;background:var(--login-orange);flex:0 0 auto}
.xiaozhou-login ul{display:grid;gap:17px;margin:0;padding:0;list-style:none}
.xiaozhou-login li{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;gap:15px;min-width:0}
.xiaozhou-login li>span{width:46px;height:46px;display:grid;place-items:center;border:1px solid #f0b77f;border-radius:14px;background:#fffaf3;color:var(--login-orange);font-size:16px;font-weight:900}
.xiaozhou-login li>b{min-width:0;color:#211d19;font-size:16px;line-height:1.3}
.xiaozhou-login li small{display:block;margin-top:4px;color:var(--login-muted);font-size:12px;font-weight:500;line-height:1.45}

.login-panel{min-width:0;display:grid;place-items:center;padding:clamp(34px,5vw,72px);border-left:1px solid var(--login-line);background:rgba(255,253,250,.45)}
.login-panel form{width:min(440px,100%)}
.login-panel h2{margin:0 0 12px;font-size:clamp(34px,3vw,46px);line-height:1.16;letter-spacing:-.055em;text-wrap:balance}
.login-panel form>p{margin:0 0 38px;color:var(--login-muted);font-size:14px;line-height:1.7}
.login-panel label{display:block;margin:19px 0 9px;color:#3c3630;font-size:13px;font-weight:800}
.login-panel input{width:100%;height:58px;border:1px solid #dbd0c4;border-radius:12px;background:#fffdfa;padding:0 16px;color:var(--login-ink);font:inherit;font-size:15px;caret-color:var(--login-orange)}
.login-panel input::placeholder{color:#938a81}
.login-panel input:hover{border-color:#cbbdaf}
.login-panel input:focus-visible{border-color:var(--login-orange);outline:3px solid rgba(244,119,11,.18);outline-offset:2px;box-shadow:0 8px 24px rgba(93,50,15,.08)}
#login-error{min-height:24px;margin:12px 0 7px;color:var(--login-danger);font-size:12px;font-weight:650;line-height:1.65}
#login-submit{width:100%;height:60px;border:1px solid var(--login-orange);border-radius:12px;background:linear-gradient(100deg,#ef7107,#ff820e);color:#fffdfa;font-weight:900;font-size:16px;letter-spacing:.04em;box-shadow:0 14px 30px rgba(150,68,4,.18);cursor:pointer}
#login-submit:hover{background:linear-gradient(100deg,#d96002,#f4770b);box-shadow:0 18px 36px rgba(150,68,4,.24);transform:translateY(-1px)}
#login-submit:active{transform:translateY(1px)}
#login-submit:focus-visible{outline:3px solid rgba(244,119,11,.38);outline-offset:4px}
#login-submit:disabled{opacity:.7;cursor:wait;transform:none;box-shadow:none}
.security{display:block;margin-top:24px;padding-top:20px;border-top:1px solid var(--login-line);color:#7e756c;font-size:11px;line-height:1.7;text-align:center}

@keyframes loginXiaozhouIn{from{opacity:0;transform:translate3d(-22px,18px,0) rotate(-2deg)}to{opacity:1;transform:translate3d(0,0,0) rotate(0)}}
@keyframes loginCopyIn{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:translate3d(0,0,0)}}

@media(max-width:1180px){
  .login-page{grid-template-columns:minmax(0,1.15fr) minmax(390px,.85fr)}
  .login-story{padding-inline:28px}
  .xiaozhou-login{grid-template-columns:minmax(210px,.82fr) minmax(270px,1.18fr);gap:26px;min-height:560px}
  .xiaozhou-login>img{height:min(64vh,570px);min-height:430px}
  .xiaozhou-login h1{font-size:clamp(34px,3.7vw,45px)}
  .login-panel{padding-inline:40px}
}
@media(max-width:900px){
  .login-header{height:72px;padding-inline:20px}
  .brand img{width:42px;height:42px}.brand span{font-size:16px}.brand small{display:none}
  .login-page{min-height:calc(100dvh - 72px);display:block}
  .login-story{padding:20px 20px 0}
  .xiaozhou-login{min-height:250px;grid-template-columns:180px minmax(0,1fr);gap:22px}
  .xiaozhou-login::before{width:240px;left:-40px;bottom:-40px}.xiaozhou-login::after{width:150px;height:180px;left:20px}
  .xiaozhou-login>img{height:250px;min-height:0;align-self:end}
  .xiaozhou-login h1{font-size:31px;line-height:1.18}
  .xiaozhou-login>div>p{margin:14px 0 0;font-size:14px}.xiaozhou-login>div>p i{width:28px}
  .xiaozhou-login ul{display:none}
  .login-panel{padding:34px 20px 44px;border-left:0;border-top:1px solid var(--login-line);background:rgba(255,253,250,.72)}
  .login-panel form{width:min(540px,100%)}
  .login-panel h2{font-size:34px}.login-panel form>p{margin-bottom:28px}
}
@media(max-width:520px){
  .login-header{height:64px;padding-inline:16px}.brand{gap:9px}.brand img{width:38px;height:38px}.brand span{font-size:15px}.back{font-size:12px}.back span{font-size:20px}
  .login-page{min-height:calc(100dvh - 64px)}
  .login-story{padding:12px 14px 0}
  .xiaozhou-login{min-height:214px;grid-template-columns:132px minmax(0,1fr);gap:12px}
  .xiaozhou-login::before{width:180px;left:-45px;bottom:-35px}.xiaozhou-login::after{display:none}
  .xiaozhou-login>img{height:214px}
  .xiaozhou-login h1{font-size:clamp(24px,7vw,29px);letter-spacing:-.045em}
  .xiaozhou-login>div>p{align-items:flex-start;gap:9px;margin-top:12px;font-size:12px;line-height:1.5}.xiaozhou-login>div>p i{width:22px;height:3px;margin-top:7px}
  .login-panel{padding:28px 18px 38px}.login-panel h2{font-size:30px}.login-panel form>p{font-size:13px}.login-panel input{height:54px}#login-submit{height:56px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}