@font-face{font-family:CloudTitle;src:url('cloud-title.ttf') format('truetype');font-display:swap}
@font-face{font-family:CloudNumber;src:url('cloud-number.ttf') format('truetype');font-display:swap}
:root{font-family:"Microsoft YaHei","PingFang SC",sans-serif;color:#17384d;background:#eef5f8;color-scheme:light;font-synthesis:none}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:wait;opacity:.72}
button:focus-visible,input:focus-visible{outline:2px solid #4de4f6;outline-offset:3px}
.login-page{--cyan:#49dcef;--blue:#2376bd;position:relative;isolation:isolate;min-height:100dvh;overflow:hidden;display:grid;grid-template-columns:minmax(420px,1fr) minmax(390px,520px);align-items:center;gap:clamp(50px,8vw,150px);padding:clamp(40px,6vw,96px);background:radial-gradient(circle at 16% 42%,#0b59715c,transparent 32%),radial-gradient(circle at 85% 16%,#114f7a45,transparent 30%),linear-gradient(126deg,#03131e 0%,#02080e 58%,#051725 100%)}
.login-grid{position:absolute;z-index:-3;inset:0;background-image:linear-gradient(#24506a20 1px,transparent 1px),linear-gradient(90deg,#24506a20 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(90deg,#000,transparent 76%)}
.login-page:before{content:"";position:absolute;z-index:-2;width:70vw;height:1px;left:-8vw;top:50%;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 30px #33cce9;transform:rotate(-13deg);opacity:.38}
.login-page:after{content:"ZHONGKE · CLOUD AI";position:absolute;z-index:-1;left:4vw;bottom:-2.5vw;color:#49dcef08;font:700 clamp(56px,9vw,158px)/1 CloudNumber,sans-serif;letter-spacing:.08em;white-space:nowrap}
.login-orbit{position:absolute;z-index:-1;border:1px solid #49dcef1f;border-radius:50%;pointer-events:none}
.login-orbit:before{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px var(--cyan);top:12%;left:20%}
.login-orbit-one{width:620px;height:620px;left:-250px;top:-210px;animation:orbit 24s linear infinite}
.login-orbit-two{width:410px;height:410px;right:-170px;bottom:-190px;animation:orbit 31s linear infinite reverse}
.login-intro{max-width:690px;animation:rise .75s ease-out both}
.system-badge{display:flex;align-items:center;gap:11px;color:#79aebf;font:12px/1.4 CloudNumber,"Microsoft YaHei",sans-serif;letter-spacing:.28em;text-transform:uppercase}
.system-badge span{width:32px;height:2px;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.login-intro h1{font-family:CloudTitle,"Microsoft YaHei",sans-serif;font-size:clamp(54px,6vw,104px);font-weight:400;letter-spacing:.08em;line-height:1.12;margin:34px 0 26px;color:#eefcff;text-shadow:0 0 34px #1cbddd25}
.login-intro h1 strong{font-weight:400;color:var(--cyan)}
.login-intro>p{max-width:560px;color:#82a8b7;font-size:clamp(15px,1.2vw,19px);line-height:2;letter-spacing:.06em;margin:0}
.intro-status{display:flex;gap:28px;margin-top:62px;padding-top:18px;border-top:1px solid #31617755;color:#537a8a;font:11px CloudNumber,"Microsoft YaHei",sans-serif;letter-spacing:.12em}
.intro-status span{display:flex;align-items:center;gap:8px}
.intro-status i{width:6px;height:6px;border-radius:50%;background:#40e3b2;box-shadow:0 0 9px #40e3b2;animation:pulse 2s ease-in-out infinite}
.login-panel{position:relative;width:100%;padding:42px 44px 31px;background:linear-gradient(145deg,#0b2231eb,#06141fed);border:1px solid #2a6077;box-shadow:0 28px 80px #0009,0 0 40px #1c9fc312,inset 0 0 40px #0f3b5026;backdrop-filter:blur(18px);animation:rise .75s .12s ease-out both}
.login-panel:before,.login-panel:after{content:"";position:absolute;width:38px;height:38px;border-color:var(--cyan);pointer-events:none}
.login-panel:before{left:-1px;top:-1px;border-left:2px solid var(--cyan);border-top:2px solid var(--cyan)}
.login-panel:after{right:-1px;bottom:-1px;border-right:2px solid var(--cyan);border-bottom:2px solid var(--cyan)}
.login-panel header{display:flex;align-items:center;gap:16px;margin-bottom:37px}
.brand-symbol{width:56px;height:56px;display:grid;place-items:center;overflow:hidden;border:1px solid #3ca6c0;background:#fff;box-shadow:0 0 22px #36cee326}
.brand-logo{display:block;width:100%;height:100%;object-fit:contain}
.login-panel header span{display:block;color:#4f8194;font:10px CloudNumber,sans-serif;letter-spacing:.22em;margin-bottom:7px}
.login-panel h2{font-size:26px;letter-spacing:.12em;font-weight:500;margin:0;color:#f0fbff}
.login-panel form>label{display:block;color:#8caebc;font-size:13px;letter-spacing:.08em;margin:22px 0 9px}
.field-wrap{height:52px;display:flex;align-items:center;gap:12px;padding:0 15px;color:#4e899e;background:#03101a;border:1px solid #21495c;transition:border-color .2s,box-shadow .2s}
.field-wrap:focus-within{border-color:#3fc9df;box-shadow:0 0 0 3px #3fc9df12,inset 0 0 18px #1b90ab12;color:var(--cyan)}
.field-wrap input{min-width:0;flex:1;height:100%;border:0;outline:0;color:#e9faff;background:transparent;font-size:15px;letter-spacing:.04em}
.field-wrap input::placeholder{color:#496b78}
.password-toggle{display:grid;place-items:center;border:0;padding:7px;background:transparent;color:#608998}
.password-toggle:hover{color:var(--cyan)}
.form-message{height:38px;padding-top:11px;color:#ff8d8d;font-size:12px}
.login-submit{width:100%;height:54px;border:1px solid #52deef;background:linear-gradient(100deg,#1585a6,#26b8cc);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 20px 0 24px;font-size:15px;font-weight:600;letter-spacing:.12em;box-shadow:0 8px 28px #0ca5bf25;transition:transform .2s,filter .2s,box-shadow .2s}
.login-submit:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.12);box-shadow:0 12px 34px #0ca5bf42}
.login-submit i{font-style:normal;font-size:23px;font-weight:300}
.login-panel footer{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:23px;color:#527887;font-size:11px}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes pulse{50%{opacity:.4;box-shadow:0 0 3px #40e3b2}}
@media(max-width:900px){.login-page{grid-template-columns:1fr;padding:36px 24px}.login-intro{display:none}.login-panel{max-width:480px;margin:auto}}
@media(max-width:520px){.login-page{padding:20px}.login-panel{padding:32px 24px 25px}.login-panel h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Daylight login theme for the standalone cloud-control system. */
.login-page{--cyan:#159fc1;--blue:#216da0;color:#17384d;background:radial-gradient(circle at 16% 42%,#bfe4ef8c,transparent 34%),radial-gradient(circle at 86% 16%,#d3eaf4aa,transparent 31%),linear-gradient(126deg,#f9fcfd 0%,#edf5f8 58%,#f8fbfc 100%)}
.login-grid{background-image:linear-gradient(#3b809515 1px,transparent 1px),linear-gradient(90deg,#3b809515 1px,transparent 1px)}
.login-page:before{background:linear-gradient(90deg,transparent,#3cabc5,transparent);box-shadow:0 0 25px #51b4ca;opacity:.28}
.login-page:after{color:#176b8410}
.login-orbit{border-color:#247f9b24}
.login-orbit:before{background:#1da3bf;box-shadow:0 0 13px #1da3bf}
.system-badge{color:#527b8c}
.system-badge span{background:#168fac;box-shadow:0 0 8px #43b1c8}
.login-intro h1{color:#134d68;text-shadow:0 1px 0 #fff,0 8px 25px #22718a14}
.login-intro h1 strong{color:#168ead}
.login-intro>p{max-width:none;white-space:nowrap;color:#557888}
.intro-status{border-top-color:#7faebb55;color:#6b8b98}
.login-panel{background:rgba(255,255,255,.9);border-color:#9ec8d6;box-shadow:0 28px 70px #28596d1f,0 0 35px #2d9bb312,inset 0 0 35px #dceff566}
.login-panel:before,.login-panel:after{border-color:#219bb8}
.brand-symbol{border-color:#75b7c9;box-shadow:0 5px 18px #287c9226}
.login-panel header span{color:#6a8b98}
.login-panel h2{color:#153f54}
.login-panel form>label{color:#496d7c}
.field-wrap{color:#5b8393;background:#f7fbfc;border-color:#b6d1db}
.field-wrap:focus-within{border-color:#269ab5;box-shadow:0 0 0 3px #269ab512,inset 0 0 14px #4ba9be0c;color:#168ca7}
.field-wrap input{color:#173e51}
.field-wrap input::placeholder{color:#91a9b2}
.password-toggle{color:#7195a2}
.password-toggle:hover{color:#147f99}
.form-message{color:#c53c45}
.login-submit{border-color:#178da8;background:linear-gradient(100deg,#167fa2,#20abc0);box-shadow:0 8px 25px #168da42b}
.login-panel footer{color:#77939e}

.login-intro>p{white-space:normal;max-width:620px}.login-intro h1{font-size:clamp(44px,5vw,88px)}
