*{box-sizing:border-box}html,body{margin:0;min-height:100%}
body{min-height:100vh;display:grid;place-items:center;padding:36px 18px;color:#e7eff9;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(ellipse at 50% -12%,rgba(32,145,215,.25),transparent 48%),radial-gradient(ellipse at 90% 100%,rgba(19,75,119,.22),transparent 45%),linear-gradient(145deg,#030a11,#081726 52%,#0b2236)}
.shell{width:min(100%,460px)}.brand{width:290px;max-width:85%;height:102px;margin:0 auto -1px;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:14px;background:linear-gradient(180deg,#15334b,#0a1b2b);border:1px solid #355b78;border-bottom:0;border-radius:24px 24px 0 0;box-shadow:0 -9px 35px rgba(25,135,205,.12)}
.brand:before{content:'';position:absolute;top:0;left:25px;right:25px;height:2px;background:linear-gradient(90deg,transparent,#2aa9ed,transparent)}
.brand-icon{height:48px;width:48px;border-radius:12px;display:grid;place-items:center;font-size:18px;font-weight:800;letter-spacing:-1px;background:linear-gradient(145deg,#168cc7,#07507f);border:1px solid #4ab3ec;color:white;box-shadow:0 5px 18px #0005}
.brand-name{font-weight:800;letter-spacing:.09em;line-height:1.25;font-size:16px}.brand-name small{display:block;font-size:10px;color:#8da9bf;letter-spacing:.22em;margin-top:5px}
.panel{position:relative;padding:43px 42px 39px;border:1px solid #355b78;border-radius:20px;background:linear-gradient(155deg,rgba(16,43,65,.98),rgba(5,17,29,.99));box-shadow:0 30px 75px #0009, inset 0 1px #ffffff0b}
.panel:after{content:'';position:absolute;bottom:0;left:28%;right:28%;height:1px;background:linear-gradient(90deg,transparent,#1e86bc,transparent)}
h1{text-align:center;margin:0 0 9px;color:white;font-size:26px}p.subtitle{text-align:center;color:#8fa8bc;font-size:14px;margin:0 0 33px}
label{display:block;font-size:13px;font-weight:700;color:#aec3d5;margin:0 0 9px}.field{margin-bottom:21px}input{display:block;width:100%;height:52px;padding:0 15px;border:1px solid #284863;border-radius:9px;background:#061522;color:#fff;font:inherit;outline:none}input:focus{border-color:#2aabed;box-shadow:0 0 0 3px #24a4e81c}.password-wrap{position:relative}.password-wrap input{padding-right:75px}.reveal{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:0;color:#93b3ca;font-size:12px;font-weight:700;cursor:pointer;padding:9px}.submit{width:100%;height:53px;margin-top:7px;border-radius:9px;border:1px solid #2caae9;background:linear-gradient(180deg,#1194d5,#08699f);color:white;font-size:15px;font-weight:800;letter-spacing:.04em;cursor:pointer;box-shadow:0 9px 22px #0068a026}.submit:hover{filter:brightness(1.12)}.error{padding:12px;border:1px solid #ad5058;background:#58232966;color:#ffd7d7;border-radius:9px;margin-bottom:23px;font-size:13px}.footer{text-align:center;color:#688399;font-size:12px;margin:22px 0 0}
@media(max-width:520px){.panel{padding:37px 25px 32px}.brand{width:265px;height:92px}}

/* Oval My Control Hub branding */
.brand{width:100%;max-width:100%;height:auto;min-height:0;margin:0 auto 15px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;display:flex;justify-content:center;align-items:center}
.brand:before{display:none}
.brand-logo{display:block;width:min(100%,400px);height:auto;max-height:240px;object-fit:contain;filter:drop-shadow(0 8px 20px rgba(0,0,0,.35))}
@media(max-width:520px){.brand{width:100%;height:auto;margin-bottom:12px}.brand-logo{width:min(100%,340px)}}