*{box-sizing:border-box;font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif}
body{margin:0;min-height:100vh;color:#f7f5fb;background:radial-gradient(circle at 78% 12%,rgba(130,65,220,.18),transparent 32%),linear-gradient(135deg,#08070d,#100e18 56%,#090810);display:flex;align-items:center;justify-content:center;padding:28px}
.login-page{width:100%;display:flex;justify-content:center;align-items:center}
.login-card{position:relative;width:min(440px,100%);padding:54px 48px 44px;border-radius:18px;background:linear-gradient(145deg,rgba(25,23,36,.95),rgba(14,13,21,.97));border:1px solid rgba(255,255,255,.075);box-shadow:0 28px 80px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.04);text-align:left}
.login-card::before{content:"GP";display:grid;place-items:center;width:58px;height:58px;margin:0 auto 18px;font:italic 38px Georgia,serif;background:linear-gradient(145deg,#c59aff,#7537ce);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.login-card::after{content:"A product by Novaryn Software";display:block;margin-top:26px;text-align:center;color:#716d7b;font-size:11px;letter-spacing:.25px}
.login-card h1{margin:0;text-align:center;font-size:31px;font-weight:680;letter-spacing:-.7px;color:#fff;text-shadow:none}
.login-card p{text-align:center;color:#918c9c;margin:8px 0 38px;font-size:14px}
.login-input{position:relative;margin-bottom:26px}
.login-input input{width:100%;height:50px;background:rgba(7,6,11,.52);border:1px solid rgba(255,255,255,.09);border-radius:9px;padding:17px 13px 8px;color:#fff;font-size:15px;outline:none;transition:.2s}
.login-input label{position:absolute;left:13px;top:16px;color:#827d8b;pointer-events:none;transition:.18s;font-size:14px}
.login-input input:focus,.login-input input:valid{border-color:rgba(163,94,247,.48);box-shadow:0 0 0 3px rgba(137,68,224,.09)}
.login-input input:focus+label,.login-input input:valid+label{top:5px;font-size:9px;text-transform:uppercase;letter-spacing:.7px;color:#a978e8}
.login-button{width:100%;height:48px;margin-top:4px;border:1px solid rgba(199,154,255,.23);border-radius:9px;background:linear-gradient(135deg,#7135c7,#9653e8);color:#fff;font-size:15px;font-weight:650;cursor:pointer;box-shadow:0 10px 25px rgba(77,27,143,.25);transition:.2s}
.login-button:hover{background:linear-gradient(135deg,#7b3bd4,#a05bf0);transform:translateY(-1px);box-shadow:0 13px 30px rgba(82,29,151,.34)}
.login-button:active{transform:none}
@media(max-width:520px){body{padding:16px}.login-card{padding:42px 25px 34px;border-radius:14px}}