/* 以用户确认的 1672 × 941 原型为坐标基准；所有色彩、字号归 app.css。 */
.gf-login{margin:0;background:var(--login-bg);color:var(--login-text);color-scheme:dark}
.gf-login .stage{min-height:100dvh;position:relative;overflow:hidden}
.gf-login .topnav{height:calc(80 * var(--login-unit));min-height:64px;padding:0 calc(52 * var(--login-unit)) 0 calc(42 * var(--login-unit));border-bottom:1px solid var(--login-line);background:linear-gradient(110deg,var(--login-bg),var(--login-panel),var(--login-bg))}
.gf-login .topnav .logo{font-family:var(--sans);font-size:var(--login-logo);gap:calc(14 * var(--login-unit));font-weight:500}
.gf-login .topnav .logo svg{width:calc(52 * var(--login-unit));height:calc(56 * var(--login-unit));min-width:36px;min-height:40px;color:var(--login-edge)}
.gf-login .topnav .navlinks{font-size:var(--login-control);gap:calc(56 * var(--login-unit))}
.gf-login .navlogin{display:none}
.login-layout{display:grid;grid-template-columns:minmax(0,1044fr) minmax(0,576fr);align-items:start;gap:0;width:calc(1672 * var(--login-unit));max-width:100%;margin:0 auto;min-height:100dvh;padding:calc(127 * var(--login-unit)) calc(52 * var(--login-unit)) 0 0}
.login-story{position:relative;min-height:calc(813 * var(--login-unit));align-self:stretch}
.story-copy{position:relative;z-index:1;padding:calc(18 * var(--login-unit)) 0 0 calc(77 * var(--login-unit))}
.story-copy h1{font-size:var(--login-title);line-height:1.35;font-weight:700;letter-spacing:calc(4 * var(--login-unit));color:var(--login-text);text-shadow:0 2px 1px var(--login-line)}
.story-copy p{font-size:var(--login-subtitle);color:var(--login-text);opacity:.82;margin-top:calc(10 * var(--login-unit));letter-spacing:calc(2 * var(--login-unit))}
/* 原图左下 1044 × 650 区域：CSS 取景，不重画、不挪动岛屿和铭牌。
   左上缺口排除原图文案，右上保留吊机；原图表单完全在取景区外。 */
.logistics-art{position:absolute;left:0;top:calc(164 * var(--login-unit));width:100%;aspect-ratio:1044 / 650;background-size:160.153257% auto;background-position:left bottom;background-repeat:no-repeat;clip-path:polygon(0 11%,40% 11%,40% 0,100% 0,100% 100%,0 100%);mask-image:linear-gradient(to right,black 97%,transparent),linear-gradient(to bottom,transparent,black 5%,black 95%,transparent);mask-composite:intersect;pointer-events:none}
.card-login{position:relative;z-index:2;width:100%;min-height:calc(735 * var(--login-unit));padding:calc(62 * var(--login-unit)) calc(60 * var(--login-unit)) calc(76 * var(--login-unit));border:1px solid var(--login-edge);border-radius:calc(22 * var(--login-unit));background:radial-gradient(ellipse at 0 0,var(--login-glass-glow),transparent 32%),linear-gradient(130deg,var(--login-glass-sheen),transparent 52%),var(--login-panel);box-shadow:var(--login-shadow);animation:login-arrive .5s ease-out both}
.card-login::before,.card-login::after{content:"";position:absolute;pointer-events:none;border-radius:inherit}
.card-login::before{inset:5px;border:1px solid var(--login-line);box-shadow:inset 2px 2px 2px var(--login-glass-glow),0 0 0 2px var(--login-glass-sheen)}
.card-login::after{inset:calc(14 * var(--login-unit));border:1px solid var(--login-edge);border-radius:calc(19 * var(--login-unit));box-shadow:inset 0 0 8px var(--login-glass-sheen),0 0 0 3px var(--login-panel);opacity:.75}
.lgbrand{text-align:center;margin-bottom:calc(27 * var(--login-unit))}
.lgword{font-size:var(--login-heading);font-weight:600;line-height:1.4;letter-spacing:calc(4 * var(--login-unit));color:var(--login-text);text-shadow:0 3px 2px var(--login-bg)}
.lgcat{font-size:var(--login-category);line-height:1.4;color:var(--login-text);letter-spacing:calc(1 * var(--login-unit));margin-top:calc(2 * var(--login-unit));opacity:.88}
.lgtabs{display:flex;margin-bottom:calc(39 * var(--login-unit));border-bottom:1px solid var(--login-line)}
.lgtabs button{flex:1;min-width:0;height:calc(60 * var(--login-unit));min-height:48px;font-family:var(--sans);font-size:var(--login-control);font-weight:400;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;background:transparent;color:var(--login-muted);padding:0;cursor:pointer}
.lgtabs button:hover,.lgtabs button.on{color:var(--login-focus)}
.lgtabs button.on{border-bottom-color:var(--login-focus);text-shadow:0 0 10px var(--login-glass-sheen)}
.lgfield{margin-bottom:calc(32 * var(--login-unit))}
.lgfield:has(.password-wrap){margin-bottom:0}
.lgfield label{display:block;font-size:var(--login-label);line-height:1.45;font-weight:400;margin-bottom:calc(8 * var(--login-unit));color:var(--login-text)}
.lgfield input{font-size:var(--login-label);height:calc(55 * var(--login-unit));min-height:44px;padding:0 calc(16 * var(--login-unit));background:linear-gradient(115deg,var(--login-input),var(--login-input-end));border:1px solid var(--login-line);color:var(--login-text);border-radius:6px;box-shadow:inset 0 2px 5px rgba(0,0,0,.35),0 1px 0 rgba(255,255,255,.04)}
.lgfield input::placeholder{color:var(--login-muted);opacity:.85}
.lgfield input:focus{border-color:var(--login-focus);box-shadow:0 0 0 3px var(--login-glass-sheen)}
.password-wrap{position:relative}
.password-wrap input{padding-right:50px}
.password-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:40px;display:grid;place-items:center;border:0;border-radius:4px;background:transparent;color:var(--login-muted);cursor:pointer}
.password-toggle:hover{color:var(--login-text);background:var(--login-glass-sheen)}
.password-toggle svg{width:calc(25 * var(--login-unit));height:calc(25 * var(--login-unit));min-width:22px;min-height:22px}
.lgerr{font-size:var(--fs-sub);color:var(--login-danger);min-height:calc(36 * var(--login-unit));margin:0;line-height:1.5}
.lgerr:not(:empty){padding:6px 0}
.btn-login{display:block;width:100%;min-height:48px;height:calc(59 * var(--login-unit));padding:0 10px;border:1px solid var(--login-button-line);border-radius:7px;font-family:var(--sans);font-size:var(--login-control);font-weight:500;letter-spacing:2px;background:linear-gradient(115deg,var(--login-button),var(--login-button-end));color:var(--login-text);box-shadow:inset 0 1px 0 var(--login-glass-glow),0 7px 16px rgba(0,0,0,.25);cursor:pointer;transition:filter .15s}
.btn-login:hover:not(:disabled){filter:brightness(1.15)}
.btn-login:active:not(:disabled){filter:brightness(.95)}
.btn-login:disabled{opacity:.6;cursor:wait}
.slogan{display:flex;align-items:center;justify-content:center;gap:calc(18 * var(--login-unit));margin-top:calc(34 * var(--login-unit));color:var(--login-muted);font-size:var(--login-label);line-height:1.45;white-space:nowrap}
.slogan::before,.slogan::after{content:"";height:1px;flex:1;background:var(--login-line)}
.gf-login :focus-visible{outline:2px solid var(--login-focus);outline-offset:4px}
@keyframes login-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
/* 画布同时受宽高约束；短窗口收紧留白，而不是隐藏溢出后截掉表单。 */
@media (max-height:800px) and (min-width:821px){.login-layout{padding-top:max(80px,calc(110 * var(--login-unit)))}.card-login{min-height:0;padding:20px max(24px,calc(42 * var(--login-unit))) 20px}.lgword{font-size:var(--fs-num)}.lgcat{font-size:var(--fs-body)}.lgbrand{margin-bottom:12px}.lgtabs{margin-bottom:14px}.lgtabs button{height:48px}.lgfield{margin-bottom:14px}.lgfield input{height:44px}.lgerr{min-height:24px}.btn-login{height:48px}.slogan{margin-top:18px;font-size:var(--fs-sub)}.card-login:has(#tabReg[aria-selected="true"]) .lgbrand{display:none}}
@media (max-height:650px) and (min-width:821px){.slogan{display:none}}
@media (max-width:820px){.gf-login{--login-unit:1px}.gf-login .topnav{height:72px;padding:0 22px}.gf-login .topnav .logo{font-size:var(--fs-brand)}.gf-login .topnav .logo svg{width:38px;height:42px}.login-layout{width:100%;grid-template-columns:minmax(0,1fr);align-content:center;padding:92px 20px 24px;gap:20px}.login-story{min-height:0}.story-copy{text-align:center;padding:0}.story-copy h1{font-size:var(--fs-num);line-height:1.4;letter-spacing:2px}.story-copy p{font-size:var(--fs-sub);margin-top:12px;letter-spacing:1px}.logistics-art{display:none}.card-login{justify-self:center;max-width:480px;min-height:0;padding:28px 28px 32px}.lgword{font-size:var(--fs-num)}.lgcat{font-size:var(--fs-body)}.lgbrand{margin-bottom:18px}.lgtabs{margin-bottom:26px}.lgtabs button{font-size:var(--fs-body);height:50px}.lgfield{margin-bottom:24px}.lgfield label,.lgfield input{font-size:var(--fs-body)}.lgfield input{height:50px}.btn-login{font-size:var(--fs-body);height:52px}.slogan{font-size:var(--fs-xs);gap:12px;margin-top:26px}.login-layout:has(#tabReg[aria-selected="true"]) .login-story{display:none}}
@media (max-width:820px) and (max-height:760px){.login-story{display:none}.card-login{padding:24px}.lgbrand{margin-bottom:12px}.lgtabs{margin-bottom:18px}.lgfield{margin-bottom:16px}.lgfield input{height:44px}.lgerr{min-height:26px}.slogan{margin-top:18px}.card-login:has(#tabReg[aria-selected="true"]) .lgbrand{display:none}}
@media (prefers-reduced-motion:reduce){.card-login{animation:none}.btn-login{transition:none}}

/* 公司信息栏：不是第三块内容卡，而是一条贴着画布底边的安静基线。
   公司身份与可操作信息分组后，人能一眼分清谁在运营、怎样联系、备案去哪里查。 */
.loginfoot{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:0 clamp(22px,3.1vw,52px);
  color:var(--login-muted);background:linear-gradient(to top,var(--login-bg) 36%,rgba(0,6,18,.84) 70%,transparent)}
.loginfoot-inner{width:min(100%,calc(1540 * var(--login-unit)));min-height:60px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:30px;padding:10px 0 12px;
  border-top:1px solid rgba(103,189,255,.22)}
.loginfoot-company{display:flex;align-items:center;gap:12px;min-width:0}
.loginfoot-mark{position:relative;flex:0 0 28px;width:28px;height:28px;border:1px solid rgba(103,189,255,.52);
  transform:rotate(45deg);box-shadow:inset 0 0 10px rgba(103,189,255,.14),0 0 12px rgba(103,189,255,.08)}
.loginfoot-mark::before,.loginfoot-mark::after,.loginfoot-mark i{content:"";position:absolute;width:4px;height:4px;
  border-radius:50%;background:var(--login-focus);box-shadow:0 0 7px rgba(103,189,255,.9)}
.loginfoot-mark::before{left:-2px;top:-2px}.loginfoot-mark::after{right:-2px;bottom:-2px}
.loginfoot-mark i{left:50%;top:50%;transform:translate(-50%,-50%)}
.loginfoot-company strong,.loginfoot-item{color:#b8c4d2;font-size:var(--fs-xs);
  line-height:1.5;font-weight:500;letter-spacing:.02em;white-space:nowrap}
.loginfoot-meta{display:flex;align-items:stretch;margin:0;font-style:normal}
.loginfoot-item{position:relative;display:flex;align-items:center;gap:8px;padding:0 26px;text-decoration:none;
  transition:color .16s}
.loginfoot-item:last-child{padding-right:0}
.loginfoot-item + .loginfoot-item::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:1px;
  background:rgba(103,189,255,.18)}
.loginfoot-phone span{color:#8291a4;font-weight:400}
.loginfoot-phone strong{color:inherit;font:inherit}
.loginfoot-item:hover,.loginfoot-item:focus-visible{color:var(--login-text)}

/* 手机端将主体独占首行，电话与备案等宽排列；短屏隐藏故事区，为登录和站底留足空间。 */
@media (max-width:820px){
  .login-layout{min-height:calc(100dvh - 88px);padding-bottom:78px}
  .loginfoot{padding:0 20px;background:linear-gradient(to top,var(--login-bg) 56%,rgba(0,6,18,.9) 82%,transparent)}
  .loginfoot-inner{min-height:70px;display:grid;grid-template-columns:1fr;gap:7px;padding:8px 0 9px}
  .loginfoot-company{justify-content:center;gap:10px}
  .loginfoot-mark{flex-basis:22px;width:22px;height:22px}
  .loginfoot-meta{width:100%;justify-content:center}
  .loginfoot-item{flex:0 1 auto;padding:0 14px;font-size:var(--fs-xs)}
  .loginfoot-company strong{font-size:var(--fs-xs)}
}
@media (max-width:820px) and (max-height:860px){.login-story{display:none}.login-layout{padding-top:90px}}
@media (max-width:820px) and (max-height:760px){.login-layout{padding-top:84px}}
@media (max-width:820px) and (max-height:680px){
  .login-layout{padding-top:74px;padding-bottom:76px}
  .card-login{padding:16px 20px}
  .lgbrand,.slogan{display:none}
  .lgtabs{margin-bottom:10px}
  .lgfield{margin-bottom:10px}
  .lgfield label{margin-bottom:4px}
  .lgerr{min-height:20px}
  .btn-login{height:44px;min-height:44px}
}
