*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Segoe UI",Tahoma,Arial,sans-serif;background:#040b14;color:#eef7ff}body{min-height:100vh}.login-shell{min-height:100vh;display:grid;place-items:center;padding:34px 18px;background:radial-gradient(circle at 50% -12%,rgba(0,142,255,.24),transparent 34%),radial-gradient(circle at 50% 110%,rgba(237,159,23,.10),transparent 28%),linear-gradient(180deg,#06172a 0%,#071321 48%,#030912 100%)}.login-panel{width:min(390px,100%);text-align:center}.brand{display:flex;flex-direction:column;align-items:center;margin-bottom:18px}.brand-logo{width:160px;max-width:55vw;height:auto;filter:drop-shadow(0 10px 22px rgba(0,112,255,.24)) drop-shadow(0 5px 15px rgba(255,171,0,.13))}.brand-name{font-size:25px;font-weight:800;letter-spacing:1.4px;margin-top:-8px;color:#f5f8ff;text-shadow:0 2px 12px #000}.brand-name span{color:#ffb019}.login-card{background:linear-gradient(160deg,rgba(12,28,47,.97),rgba(7,18,32,.98));border:1px solid #29445d;border-radius:25px;padding:24px 24px 22px;box-shadow:0 28px 65px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.025)}.heading{margin-bottom:23px}.eyebrow{margin:0 0 7px;color:#34b8ff;font:700 10px/1.4 "Segoe UI",Arial,sans-serif;letter-spacing:3px}.heading h1{margin:0;font-size:25px}.heading>p:last-child{margin:9px 0 0;color:#8196aa;font-size:12px;line-height:1.7}.field{height:50px;display:flex;align-items:center;gap:12px;background:#071221;border:1px solid #142b40;border-radius:13px;padding:0 15px;margin-bottom:14px;transition:.2s}.field:focus-within{border-color:#169ff0;box-shadow:0 0 0 3px rgba(22,159,240,.09)}.field-icon{width:18px;color:#5ab7ff;font-size:11px}.lock{font-size:10px}.field input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#edf7ff;font:500 14px/1.5 "Segoe UI",Tahoma,Arial,sans-serif;text-align:right}.field input::placeholder{color:#7d8fa2}.eye{border:0;background:transparent;color:#8aa2b8;font-size:18px;cursor:pointer;padding:5px}.options{display:flex;justify-content:space-between;align-items:center;margin:3px 1px 22px;font-size:11px}.remember{display:flex;align-items:center;gap:7px;color:#9dafc1;cursor:pointer}.remember input{width:16px;height:16px;accent-color:#159df0}.forgot{color:#27b4ff;text-decoration:none}.forgot:hover{text-decoration:underline}.primary,.secondary{width:100%;height:47px;border-radius:12px;font:700 14px/1.5 "Segoe UI",Tahoma,Arial,sans-serif;cursor:pointer;transition:transform .15s,filter .15s}.primary{border:0;color:#fff;background:linear-gradient(100deg,#087cff,#24b8f5);box-shadow:0 10px 28px rgba(0,128,255,.22)}.primary:hover{filter:brightness(1.08)}.primary:active,.secondary:active{transform:translateY(1px)}.divider{display:flex;align-items:center;gap:12px;margin:19px 0;color:#8192a3;font-size:11px}.divider:before,.divider:after{content:"";height:1px;flex:1;background:#244056}.secondary{border:1px solid #1aaeff;color:#2ab6ff;background:rgba(6,27,45,.38)}.secondary:hover{background:rgba(12,80,122,.18)}.secondary span{font-size:19px;vertical-align:-1px;margin-left:5px}.login-message{min-height:15px;margin:12px 0 -7px;font-size:11px;color:#7f93a8}footer{margin-top:25px;color:#71869a;font-size:10px;direction:rtl}@media(max-width:520px){.login-shell{display:block;padding:28px 18px 22px;min-height:100svh}.login-panel{margin:0 auto}.brand{margin-bottom:14px}.brand-logo{width:170px}.brand-name{font-size:25px}.login-card{padding:25px 16px 22px;border-radius:22px}.heading{margin-bottom:20px}.heading h1{font-size:22px}.field{height:54px}.primary,.secondary{height:50px}footer{margin-top:22px}}@media(max-width:360px){.login-shell{padding-left:12px;padding-right:12px}.brand-logo{width:150px}.login-card{padding-left:13px;padding-right:13px}.options{font-size:10px}}
.link-button{display:flex;align-items:center;justify-content:center;text-decoration:none}.alert{padding:9px 11px;border-radius:9px;margin:0 0 12px;font-size:11px}.alert.error{background:#421b25;color:#ffb6c4}.alert.success{background:#0b392d;color:#9df3d2}.muted{color:#71869a;font-size:10px}

/* SINAA typography */
html,body,button,input,select,textarea{font-family:"Segoe UI",Tahoma,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-weight:400}
.heading h1,.brand-name{font-weight:700;letter-spacing:0}
.heading>p:last-child,.options,.login-message,.alert,footer{font-weight:400}
.field input{font-weight:500;letter-spacing:0}
.primary,.secondary{font-weight:650;letter-spacing:0}
.eyebrow{font-family:"Segoe UI",Arial,sans-serif;font-weight:700}
