:root{
  --ink:#152532;--muted:#6b7e8b;--line:#d8e2e8;--surface:#fff;--soft:#f4f7f9;
  --navy:#163b55;--navy-2:#1f5778;--blue:#1769aa;--cyan:#2d9bd0;--amber:#d98a23;
  --green:#168766;--red:#c44343;--shadow:0 24px 70px rgba(28,56,75,.12);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:light
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#eef3f6;color:var(--ink)}button,input{font:inherit}button{cursor:pointer}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.auth-layout{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.32fr) minmax(430px,.68fr)}
.auth-information{position:relative;overflow:hidden;min-height:100vh;padding:34px 48px 26px;background:linear-gradient(145deg,#f8fbfc 0%,#edf4f7 55%,#e5eef2 100%);display:flex;flex-direction:column;border-right:1px solid #d4e0e6}
.auth-information:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(22,59,85,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(22,59,85,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 92%)}
.auth-information:after{content:"";position:absolute;width:500px;height:500px;border-radius:50%;right:-250px;top:-220px;border:1px solid rgba(23,105,170,.12);box-shadow:0 0 0 70px rgba(23,105,170,.025),0 0 0 140px rgba(23,105,170,.018)}
.auth-brand,.information-main,.information-footer{position:relative;z-index:2}.auth-brand{display:flex;align-items:center;gap:14px}.auth-logo{width:48px;height:48px;border-radius:14px;background:linear-gradient(145deg,var(--navy-2),var(--navy));color:#fff;display:grid;place-items:center;box-shadow:0 12px 26px rgba(22,59,85,.18)}.auth-logo svg{width:28px;height:28px}.auth-brand>div,.mobile-identity>div{display:flex;flex-direction:column;gap:3px}.auth-brand span,.mobile-identity span{font-size:9px;letter-spacing:.13em;font-weight:800;color:#6e8796}.auth-brand b,.mobile-identity b{font-size:17px;color:var(--navy)}
.information-main{flex:1;display:flex;flex-direction:column;justify-content:center;max-width:1040px;padding:48px 0 38px}.information-kicker{font-size:9px;font-weight:900;letter-spacing:.17em;color:var(--blue);display:flex;align-items:center;gap:11px}.information-kicker:before{content:"";width:34px;height:2px;background:var(--blue)}.information-main h1{max-width:900px;font-size:clamp(38px,4.6vw,66px);line-height:1.05;letter-spacing:-.05em;margin:20px 0 22px;color:#163248}.information-main h1 em{font-style:normal;color:var(--blue)}.information-main>p{max-width:800px;font-size:15px;line-height:1.75;color:#5f7685;margin:0}
.monitoring-chain{margin-top:36px;display:grid;grid-template-columns:1fr 36px 1fr 36px 1fr;align-items:center;gap:8px;max-width:940px}.monitoring-chain article{min-height:82px;padding:14px;border:1px solid #d3e0e7;border-radius:14px;background:rgba(255,255,255,.76);display:flex;align-items:center;gap:12px;box-shadow:0 8px 24px rgba(44,76,96,.05)}.monitoring-chain article>span{width:34px;height:34px;border-radius:10px;background:#e8f2f7;color:var(--blue);display:grid;place-items:center;font-size:10px;font-weight:900}.monitoring-chain article div{display:flex;flex-direction:column;gap:5px}.monitoring-chain b{font-size:12px}.monitoring-chain small{font-size:9px;color:var(--muted);line-height:1.45}.monitoring-chain>i{color:#8aa0ad;display:grid;place-items:center}.monitoring-chain>i svg{width:18px}
.information-grid{margin-top:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:940px}.information-grid article{min-height:72px;border:1px solid #d7e2e8;border-radius:13px;background:rgba(255,255,255,.68);padding:12px 14px;display:flex;align-items:center;gap:12px}.information-grid article>i{width:38px;height:38px;border-radius:11px;display:grid;place-items:center}.information-grid article>i svg{width:19px}.information-grid i.electric{background:#e8f3fb;color:var(--blue)}.information-grid i.gas{background:#fff1df;color:var(--amber)}.information-grid i.risk{background:#fbe9e9;color:var(--red)}.information-grid i.result{background:#e5f4ef;color:var(--green)}.information-grid div{display:flex;flex-direction:column;gap:4px}.information-grid span{font-size:8px;letter-spacing:.08em;color:var(--muted);font-weight:800}.information-grid b{font-size:11px;line-height:1.35}
.information-footer{display:flex;align-items:center;justify-content:space-between;color:#758b98;font-size:9px}.information-footer span:last-child{display:flex;align-items:center;gap:7px}.information-footer i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(22,135,102,.1)}
.auth-workspace{min-height:100vh;background:#fff;display:flex;align-items:center;justify-content:center;padding:38px}.workspace-inner{width:min(100%,470px)}.mobile-identity{display:none}.workspace-status{display:flex;align-items:center;justify-content:space-between;margin-bottom:38px}.workspace-status>span{height:30px;padding:0 10px;border:1px solid #cfe4dc;border-radius:999px;background:#f0f8f5;color:var(--green);display:flex;align-items:center;gap:7px;font-size:9px;font-weight:800}.workspace-status i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(22,135,102,.1)}.workspace-status small{font-size:9px;color:#81919b}.auth-heading>span{font-size:9px;font-weight:900;letter-spacing:.16em;color:var(--blue)}.auth-heading h2{font-size:34px;letter-spacing:-.035em;margin:12px 0 9px;color:#173247}.auth-heading p{margin:0 0 30px;color:var(--muted);font-size:12px;line-height:1.65}
.alert{margin:0 0 18px;padding:12px 14px;border-radius:10px;border:1px solid #efc4c4;background:#fff4f4;color:#a43838;font-size:11px;line-height:1.5}.alert[data-type="success"]{border-color:#b8dfd0;background:#f0faf6;color:#137055}
.field{display:block;margin-bottom:18px}.field>span{display:block;margin-bottom:8px;font-size:11px;font-weight:750;color:#344b5a}.input-wrap{height:52px;border:1px solid #cfdbe2;border-radius:12px;background:#fbfcfd;display:flex;align-items:center;position:relative;transition:.18s}.input-wrap:focus-within{border-color:#6ea8ce;background:#fff;box-shadow:0 0 0 4px rgba(23,105,170,.08)}.input-wrap>svg{width:18px;height:18px;margin-left:15px;color:#8195a2}.input-wrap input{min-width:0;flex:1;height:100%;border:0;background:transparent;outline:0;padding:0 14px;color:var(--ink);font-size:12px}.input-wrap input::placeholder{color:#a4b1ba}.input-wrap button{width:44px;height:44px;border:0;background:transparent;color:#8295a1;display:grid;place-items:center}.input-wrap button svg{width:18px}.field>small{display:block;min-height:15px;margin-top:6px;color:var(--red);font-size:9px}.field.invalid .input-wrap{border-color:#d76a6a;background:#fff8f8}
.auth-options{display:flex;align-items:center;justify-content:space-between;margin:2px 0 20px}.auth-options label{display:flex;align-items:center;gap:8px;font-size:10px;color:#425966}.auth-options input{accent-color:var(--blue)}.auth-options>span{font-size:9px;color:#8a9aa4}.auth-submit{position:relative;width:100%;height:54px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--blue),#155781);color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;font-size:12px;font-weight:800;box-shadow:0 14px 30px rgba(23,105,170,.22);overflow:hidden}.auth-submit svg{width:18px;transition:.2s}.auth-submit:hover svg{transform:translateX(4px)}.auth-submit:disabled{opacity:.7;cursor:wait}.auth-submit i{display:none;width:18px;height:18px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.auth-submit.loading span,.auth-submit.loading svg{display:none}.auth-submit.loading i{display:block}@keyframes spin{to{transform:rotate(360deg)}}
.role-access{margin-top:22px;padding:14px 0;border-top:1px solid #e2e9ed;border-bottom:1px solid #e2e9ed}.role-access>span{display:block;font-size:8px;letter-spacing:.12em;font-weight:850;color:#8999a3;margin-bottom:9px}.role-access div{display:flex;flex-wrap:wrap;gap:6px}.role-access b{padding:6px 8px;border-radius:6px;background:#f0f4f6;color:#536b79;font-size:8px;font-weight:750}.security-card{margin-top:18px;padding:13px;border-radius:12px;background:#f5f8fa;display:flex;gap:11px}.security-card>svg{width:20px;height:20px;color:var(--green);flex:0 0 auto}.security-card div{display:flex;flex-direction:column;gap:4px}.security-card b{font-size:10px}.security-card span{font-size:9px;line-height:1.5;color:var(--muted)}
@media(max-width:1100px){.auth-layout{grid-template-columns:1fr 440px}.information-main h1{font-size:43px}.monitoring-chain{grid-template-columns:1fr}.monitoring-chain>i{display:none}.information-grid{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.auth-layout{display:block}.auth-information{display:none}.auth-workspace{min-height:100vh;padding:24px;background:linear-gradient(180deg,#eef4f7 0,#fff 180px)}.workspace-inner{width:min(100%,500px);padding:26px;border:1px solid #dbe5ea;border-radius:20px;background:#fff;box-shadow:var(--shadow)}.mobile-identity{display:flex;align-items:center;gap:12px;margin-bottom:28px}.mobile-identity .auth-logo{width:43px;height:43px}.workspace-status{margin-bottom:28px}}
@media(max-width:520px){.auth-workspace{padding:14px}.workspace-inner{padding:22px 18px}.workspace-status small{display:none}.auth-heading h2{font-size:29px}.auth-options{align-items:flex-start;gap:12px}.auth-options>span{text-align:right}.role-access div{gap:5px}}

/* FactoryOS 4.2 — login readability and unified visual language */
:root{--font-ui:"Segoe UI Variable","Segoe UI","Noto Sans",Arial,sans-serif;font-family:var(--font-ui)!important}
html,body,button,input,select,textarea{font-family:var(--font-ui)!important;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body{font-size:15px}.information-main h1{letter-spacing:-.025em!important}.information-main>p,.workspace-card p,.auth-workspace p{font-size:14px!important;line-height:1.65!important}.monitoring-chain b,.information-grid b{font-size:12px!important}.monitoring-chain small,.information-grid span,.information-grid small{font-size:10px!important}.auth-field>span,.field>span{font-size:12px!important}.auth-field input,.field input{font-size:14px!important}.auth-submit,.login-button{font-size:13px!important}
.auth-logo svg,.information-grid svg,.input svg{stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.login-system-overlay{position:fixed;inset:0;z-index:9999;background:rgba(11,27,39,.72);backdrop-filter:blur(8px);display:grid;place-items:center;padding:22px}.login-system-card{width:min(560px,100%);background:#fff;border-radius:20px;border-top:5px solid #c44343;box-shadow:0 28px 90px rgba(4,18,28,.35);padding:24px}.login-system-card span{font-size:10px;letter-spacing:.12em;color:#b84343;font-weight:800}.login-system-card h2{font-size:22px;margin:6px 0}.login-system-card p{font-size:13px!important;color:#526a79;margin:0 0 18px}.login-system-card button{min-height:42px;border:0;border-radius:10px;background:#1769aa;color:#fff;padding:0 18px;font-weight:700}
[hidden]{display:none!important}

/* v4.2.1 — login system error uses native top-layer dialog. */
dialog.login-system-overlay{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;border:0;padding:22px;background:transparent;overflow:auto;place-items:center}
dialog.login-system-overlay[open]{display:grid}
dialog.login-system-overlay::backdrop{background:rgba(11,27,39,.72);backdrop-filter:blur(8px)}

/* v4.5.0 PNG brand assets */
.auth-brand-image{display:block;max-width:520px}
.auth-brand-image img{display:block;width:min(100%,430px);height:auto;object-fit:contain;object-position:left center}
.mobile-brand-image{display:none}
.mobile-brand-image img{width:min(100%,330px);height:auto;object-fit:contain;object-position:left center}
@media(max-width:760px){.auth-brand-image{display:none}.mobile-brand-image{display:block;margin-bottom:18px}}


/* v4.5.2 — developer credit / Telegram */
.information-footer{
  gap:14px;
  flex-wrap:wrap;
}
.developer-credit{
  min-height:42px;
  padding:7px 11px 7px 9px;
  border:1px solid rgba(23,105,170,.16);
  border-radius:12px;
  background:rgba(255,255,255,.72);
  color:#1d587f;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:9px;
  box-shadow:0 6px 18px rgba(28,56,75,.045);
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.developer-credit:hover{
  transform:translateY(-2px);
  border-color:rgba(23,105,170,.34);
  background:#fff;
  box-shadow:0 10px 24px rgba(28,56,75,.09);
}
.developer-credit:focus-visible{
  outline:0;
  box-shadow:0 0 0 4px rgba(23,105,170,.12),0 10px 24px rgba(28,56,75,.09);
}
.developer-credit>svg{
  width:25px;
  height:25px;
  flex:0 0 25px;
  color:#229ed9;
  stroke-width:1.65;
}
.developer-credit>span{
  display:flex!important;
  flex-direction:column;
  align-items:flex-start!important;
  gap:2px!important;
}
.developer-credit small{
  font-size:8px;
  line-height:1;
  letter-spacing:.1em;
  text-transform:uppercase;
  font-weight:800;
  color:#8396a2;
}
.developer-credit b{
  font-size:10px;
  line-height:1.1;
  color:#1c607f;
  font-weight:850;
}
@media(max-width:1220px){
  .information-footer{align-items:flex-start}
  .developer-credit{order:3}
}
@media(max-width:850px){
  .developer-credit{display:none}
}