:root{--deep:#300950;--violet:#7540F5;--persimmon:#E8623D;--bone:#F4EFE6;--ink:#1c1030}
*{box-sizing:border-box;margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:linear-gradient(160deg,var(--deep) 0%,#1c0530 60%,#0e0218 100%);color:var(--bone);min-height:100vh;display:grid;place-items:center;padding:1rem}
.card{background:rgba(244,239,230,.04);border:1px solid rgba(117,64,245,.35);border-radius:18px;padding:2.4rem 2.2rem;max-width:26rem;width:100%;box-shadow:0 24px 60px rgba(0,0,0,.45);backdrop-filter:blur(8px)}
.brand{display:flex;align-items:center;gap:.8rem;margin-bottom:.4rem}
.mark{width:38px;height:38px;flex:none}
h1{font-size:1.35rem;font-weight:650;letter-spacing:.2px}
.sub{opacity:.75;font-size:.92rem;margin-bottom:1.6rem}
label{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;opacity:.7;margin-bottom:.4rem}
input{width:100%;padding:.75rem .9rem;border-radius:10px;border:1px solid rgba(117,64,245,.5);background:rgba(0,0,0,.3);color:var(--bone);font-size:1rem;outline:none}
input:focus{border-color:var(--persimmon);box-shadow:0 0 0 3px rgba(232,98,61,.25)}
button{width:100%;margin-top:1rem;padding:.75rem;border:0;border-radius:10px;background:var(--violet);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:background .15s}
button:hover{background:#8a5bff}
button:disabled{opacity:.6;cursor:default}
#err{min-height:1.2rem;color:var(--persimmon);font-size:.9rem;margin-top:.7rem}
.foot{margin-top:1.4rem;font-size:.75rem;opacity:.5;text-align:center}