/* finesse · register=product · A=midnight-cyan · B=system-sans · C=single-task-card · D=feedback-only · E=secure-console · SOUL=5 SPECTACLE=1 DENSITY=4 */
:root{
  --page:#060b14;--bg:#0d1726;--panel:#111f31;--panel-2:#16273b;
  --ink-1:#edf6ff;--ink-2:#b8c9d9;--ink-3:#8198ae;--accent:#37d9e6;
  --accent-soft:rgba(55,217,230,.12);--line:rgba(122,184,220,.16);--line-strong:rgba(55,217,230,.42);
  --down:#ff7065;--down-soft:rgba(255,112,101,.12);--on-accent:#051319;
  --shadow:0 36px 90px -48px rgba(0,4,12,.92);--r:18px;--r-sm:10px;
  --font:"Microsoft YaHei UI","Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-width:0;min-height:100%;overflow-x:clip;background:var(--page);color:var(--ink-1);font-family:var(--font)}
body{min-height:100dvh}
button,input{font:inherit}
.login-page{min-height:100dvh;display:grid;place-items:center;padding:32px 20px;background:radial-gradient(circle at 50% 12%,var(--accent-soft),transparent 34%)}
.login-card{width:min(420px,100%);padding:30px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg);box-shadow:var(--shadow)}
.login-brand{display:flex;align-items:center;gap:12px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.brand-mark{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.08em}
.login-brand strong,.login-brand span{display:block}.login-brand strong{font-size:16px}.login-brand div>span{margin-top:3px;color:var(--ink-3);font-size:11px}
.login-heading{padding:26px 0 22px}.login-heading h1{margin:0;color:var(--ink-1);font-size:24px;line-height:1.2;letter-spacing:-.02em;overflow-wrap:anywhere;min-width:0;text-wrap:balance}.login-heading p{margin:8px 0 0;color:var(--ink-3);font-size:13px;line-height:1.6}
form{display:grid;gap:18px}.field{display:grid;gap:8px}.field label{color:var(--ink-2);font-size:13px;font-weight:650}.field input{width:100%;height:46px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);color:var(--ink-1);padding:0 13px;outline:none}.field input:hover{border-color:var(--line-strong)}.field input:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.field input[aria-invalid="true"]{border-color:var(--down);box-shadow:0 0 0 3px var(--down-soft)}
.password-control{position:relative}.password-control input{padding-right:66px}.password-control button{position:absolute;right:4px;top:3px;min-width:56px;height:40px;border:0;border-radius:8px;background:transparent;color:var(--accent);cursor:pointer}.password-control button:hover{background:var(--accent-soft)}.password-control button:focus-visible{outline:3px solid var(--accent-soft);outline-offset:1px}
.field-error{min-height:16px;color:var(--down);font-size:11px;line-height:1.45}.form-error{padding:11px 12px;border:1px solid rgba(255,112,101,.34);border-radius:var(--r-sm);background:var(--down-soft);color:#ff9a91;font-size:12px;line-height:1.55}.form-error[hidden]{display:none}
.login-button{min-height:46px;border:1px solid var(--accent);border-radius:var(--r-sm);background:var(--accent);color:var(--on-accent);font-weight:800;cursor:pointer;box-shadow:0 8px 24px var(--accent-soft)}.login-button:hover{filter:brightness(1.04)}.login-button:focus-visible{outline:3px solid var(--accent-soft);outline-offset:3px}.login-button:disabled{opacity:.68;cursor:wait}.login-button.loading span::before{content:"";display:inline-block;width:13px;height:13px;margin-right:8px;border:2px solid rgba(5,19,25,.28);border-top-color:var(--on-accent);border-radius:50%;vertical-align:-2px;animation:spin .7s linear infinite}
footer{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:24px;color:var(--ink-3);font-size:11px}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:480px){.login-page{place-items:start center;padding:24px 14px}.login-card{padding:24px 20px}.login-heading{padding-top:24px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}.login-button.loading span::before{animation:none;border-color:var(--on-accent)}}
