:root{--login-blue:#3478f6;--login-text:#132238;--login-muted:#718096}
html:has(.login-page){width:100%;min-height:100%;background:#071426}
.login-page{width:100vw;min-width:100%;min-height:100vh;min-height:100dvh;display:block;margin:0;overflow-x:hidden;background:#071426;color:var(--login-text)}
.login-page main{width:100%;max-width:none;margin:0;padding:0}
.login-shell{position:relative;width:100%;min-height:100vh;min-height:100dvh;overflow:hidden;isolation:isolate}

/* One continuous full-screen panorama backdrop */
.login-visual{position:absolute;z-index:0;inset:0;min-height:100%;padding:0;color:#fff;overflow:hidden;background:radial-gradient(circle at 50% 42%,#1b4b7c 0,transparent 28%),radial-gradient(circle at 12% 85%,#17375a 0,transparent 32%),radial-gradient(circle at 90% 80%,#0f365d 0,transparent 34%),linear-gradient(145deg,#06111f 0%,#081b31 48%,#092847 100%)}
.login-visual:before{content:"";position:absolute;inset:0;opacity:.19;background-image:linear-gradient(#b8d3f21a 1px,transparent 1px),linear-gradient(90deg,#b8d3f21a 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(circle at center,black,transparent 82%)}
.login-visual:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 48%,transparent 0 18%,#06111f25 64%,#02091280 100%);pointer-events:none}
.login-brand{position:absolute;z-index:4;top:36px;left:clamp(26px,4vw,64px);display:flex;align-items:center;gap:12px;width:max-content;color:#fff;text-decoration:none}
.brand-symbol{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#65a6ff,#2870ef);box-shadow:0 10px 28px #1769e870}
.brand-symbol svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.login-brand strong,.login-brand small{display:block}.login-brand strong{font-size:18px;letter-spacing:.04em}.login-brand small{margin-top:2px;color:#98afca;font-size:11px;letter-spacing:.16em}
.visual-copy{display:none}
.visual-foot{position:absolute;z-index:3;bottom:30px;left:clamp(26px,4vw,64px);margin:0;color:#66819e;font:10px/1.2 monospace;letter-spacing:.2em}
.panorama-art{position:absolute;z-index:1;width:min(76vw,1050px);height:min(76vw,1050px);left:50%;bottom:min(-42vw,-420px);transform:translateX(-50%);border:1px solid #86b9f326;border-radius:50%;background:radial-gradient(circle,#4c94ef12 0 37%,transparent 37.3% 52%,#4c94ef08 52.3% 70%,transparent 70.3%)}
.orbit{position:absolute;inset:11%;border:1px solid #8abcf52d;border-radius:50%;transform:rotate(-18deg)}.orbit-two{inset:26%;transform:rotate(28deg)}
.horizon{position:absolute;left:1%;right:1%;top:48%;height:1px;background:linear-gradient(90deg,transparent,#91c5ff70,transparent);transform:rotate(-8deg)}
.pin{position:absolute;width:7px;height:7px;border-radius:50%;background:#65a6ff;box-shadow:0 0 0 6px #65a6ff18,0 0 20px #65a6ff}.pin-one{left:22%;top:35%}.pin-two{left:50%;top:15%}.pin-three{left:70%;top:44%}

/* Centered floating sign-in card */
.login-panel{position:relative;z-index:2;width:100%;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:96px 24px 76px;background:transparent}
.login-panel:before{content:"全景内容发布平台";position:absolute;top:max(82px,calc(50% - 338px));left:50%;transform:translateX(-50%);color:#7da6d4;font:600 11px/1.2 "Microsoft YaHei",sans-serif;letter-spacing:.22em;white-space:nowrap}
.mobile-brand{display:none}
.login-card{width:min(440px,100%);margin:0;padding:38px 40px 34px;border:1px solid #ffffffb8;border-radius:24px;background:#fdfefeF2;box-shadow:0 30px 90px #020a157a,0 2px 0 #ffffff80 inset;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.login-heading{text-align:center;margin-bottom:32px}.login-heading .eyebrow{margin:0 0 12px;color:#4282ed;font-size:10px;font-weight:700;letter-spacing:.22em}.login-heading h2{margin:0 0 10px;color:#122238;font-size:34px;letter-spacing:-.04em}.login-heading>p:last-child{margin:0;color:var(--login-muted);font-size:13px;line-height:1.6}
.login-card form{display:grid;gap:0;margin:0}.login-card label{display:block;margin:0 0 8px;color:#34445b;font-size:13px;font-weight:650}.input-wrap{position:relative;margin-bottom:19px}.input-wrap>svg{position:absolute;left:15px;top:50%;width:19px;height:19px;transform:translateY(-50%);fill:none;stroke:#8594a8;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.login-card .input-wrap input{width:100%;height:52px;padding:0 47px;border:1px solid #d9e1eb;border-radius:12px;outline:none;background:#fff;color:#192a40;box-shadow:0 4px 14px #1e385607;transition:border-color .2s,box-shadow .2s,background .2s}
.login-card .input-wrap input::placeholder{color:#a3afbf}.login-card .input-wrap input:hover{border-color:#bdc9d8}.login-card .input-wrap input:focus{border-color:#4d8df4;box-shadow:0 0 0 4px #3478f616,0 8px 24px #2746690a}
.password-toggle{position:absolute;right:7px;top:6px;width:40px;height:40px;display:grid;place-items:center;padding:0;border-radius:9px;background:transparent;color:#8795a8}.password-toggle:hover{background:#f3f6fa;filter:none}.password-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.form-error{min-height:19px;margin:-5px 0 9px;color:#c43d3d;font-size:12px}.form-error:not(:empty){padding-left:20px;position:relative}.form-error:not(:empty):before{content:"!";position:absolute;left:0;top:0;width:14px;height:14px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:9px;font-weight:800}
.login-card .login-button{height:52px;margin:0;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;background:linear-gradient(110deg,#246be8,#4389fb);box-shadow:0 12px 24px #2e77ed35;color:#fff;font-weight:650;transition:transform .18s,box-shadow .18s}.login-card .login-button:hover{filter:none;transform:translateY(-1px);box-shadow:0 15px 30px #2e77ed45}.login-card .login-button:active{transform:translateY(0)}.login-card .login-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}.login-card .login-button:hover svg{transform:translateX(3px)}.login-card .login-button:disabled{transform:none;opacity:.68;cursor:wait}
.security-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:22px 0 0;color:#91a0b3;font-size:10px}.security-note svg{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.copyright{position:absolute;z-index:3;right:clamp(26px,4vw,64px);bottom:28px;margin:0;color:#66819e;font-size:10px}

@media(max-height:760px) and (min-width:701px){.login-panel{padding-top:72px;padding-bottom:56px}.login-panel:before{display:none}.login-card{padding-top:30px;padding-bottom:28px}.login-heading{margin-bottom:24px}.input-wrap{margin-bottom:15px}.security-note{margin-top:18px}}
@media(max-width:700px){
  .login-visual{position:fixed}.login-brand{top:22px;left:50%;transform:translateX(-50%)}.login-brand small{display:none}.visual-foot{display:none}.panorama-art{width:150vw;height:150vw;bottom:-55vw}
  .login-panel{align-items:flex-start;padding:94px 16px 32px}.login-panel:before{display:none}.login-card{width:100%;max-width:430px;padding:30px 24px 26px;border-radius:20px;background:#fffffff5}
  .login-heading{margin-bottom:28px}.login-heading h2{font-size:30px}.copyright{position:absolute;right:auto;left:50%;bottom:14px;transform:translateX(-50%);width:max-content;color:#6f89a5}
}
@media(max-width:380px){.login-panel{padding-left:12px;padding-right:12px}.login-card{padding-left:19px;padding-right:19px}.login-heading h2{font-size:28px}.security-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.login-button,.login-button svg{transition:none!important}}