:root{--bg:#07090d;--panel:#0d1118;--line:#1d2531;--fg:#f2f5f9;--mu:#8b97a8;--acc:#3b82f6;--acc2:#2f6fe0;--err:#ff7b72}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 "DM Sans",system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}
.shell{min-height:100%;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.brand{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:56px 64px;overflow:hidden;
 background:radial-gradient(900px 500px at 15% 0%,rgba(59,130,246,.16),transparent 60%),linear-gradient(160deg,#0a0e15,#05070a);border-right:1px solid var(--line)}
.brand::after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;opacity:.22;mask-image:linear-gradient(to bottom,transparent,#000 70%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 70%);pointer-events:none}
.brand>*{position:relative;z-index:1}
.brand img{width:min(360px,80%);height:auto;display:block}
.brand h2{font-size:clamp(26px,2.6vw,36px);line-height:1.15;font-weight:600;letter-spacing:-.02em;margin:0 0 14px;max-width:20ch}
.brand p{color:var(--mu);margin:0;max-width:44ch}
.pts{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:12px}
.pts li{display:flex;gap:12px;align-items:center;color:#c3ccd8;font-size:14px}
.pts li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px rgba(59,130,246,.18);flex:none}
.foot{font-size:12px;color:#5d6877;letter-spacing:.02em}
.side{display:flex;align-items:center;justify-content:center;padding:48px 24px;background:var(--panel)}
.login{width:100%;max-width:380px}
.mlogo{display:none;width:200px;margin:0 0 36px}
.login h1{font-size:26px;font-weight:600;letter-spacing:-.02em;margin:0 0 6px}
.sub{color:var(--mu);margin:0 0 28px}
label{display:block;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#aab4c2;margin:0 0 18px}
input{display:block;width:100%;margin-top:8px;padding:12px 14px;font:inherit;font-size:15px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--fg);background:#080b10;border:1px solid #263041;border-radius:8px;outline:none;transition:border-color .15s,box-shadow .15s}
input::placeholder{color:#515c6b}
input:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(59,130,246,.25)}
button.p{width:100%;margin-top:6px;padding:13px 16px;font:inherit;font-weight:600;font-size:15px;color:#fff;background:var(--acc);border:0;border-radius:8px;cursor:pointer;transition:background .15s}
button.p:hover{background:var(--acc2)}
button.p:disabled{opacity:.6;cursor:default}
button.p:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:2px}
.err{color:var(--err);min-height:1.4em;margin:12px 0 0;font-size:14px}
.mu{color:var(--mu);font-size:14px;margin:14px 0 0}
.mu a,.login a{color:#8db8ff;text-decoration:none}
.mu a:hover{text-decoration:underline}
.links{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
[hidden]{display:none!important}
@media(max-width:860px){
 .shell{grid-template-columns:1fr}
 .brand{display:none}
 .side{background:var(--bg);align-items:flex-start;padding-top:12vh}
 .mlogo{display:block;margin:0 auto 32px}
 .login h1,.sub{text-align:center}
}

.fp{margin:14px 0 0}
.meter{margin:-8px 0 18px}
.bar{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.bar i{height:4px;border-radius:2px;background:#202a38;transition:background .2s}
.meter span{display:block;margin-top:6px;font-size:13px;color:var(--mu)}
.meter[data-s="1"] .bar i:nth-child(-n+1){background:#ef4444}
.meter[data-s="2"] .bar i:nth-child(-n+2){background:#f59e0b}
.meter[data-s="3"] .bar i:nth-child(-n+3){background:#84cc16}
.meter[data-s="4"] .bar i{background:#22c55e}
#who{margin:0 0 18px;text-align:center}
/* iOS Safari zooms the page when a focused field is under 16px */
@media (max-width:820px){input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{font-size:16px!important}}
