.login-page{--lp-bg:#07070a;--lp-surface:#0f0f15;--lp-border:#1a1a26;--lp-border-hover:#2a2a3a;--lp-text:#eaeaef;--lp-text-2:#9898ae;--lp-text-3:#5e5e72;--lp-accent:#2ee8b7;--lp-accent-dim:#2ee8b714;--lp-accent-glow:#2ee8b726;--lp-font-display:"Syne",sans-serif;--lp-font-body:"DM Sans",system-ui,sans-serif;--lp-radius:14px;--lp-radius-sm:10px;--lp-radius-lg:20px;--lp-danger:#f87171;background:var(--lp-bg);min-height:100vh;font-family:var(--lp-font-body);color:var(--lp-text);-webkit-font-smoothing:antialiased;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.login-page:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(600px 500px at 30% 20%,#2ee8b70f,#0000),radial-gradient(500px 400px at 70% 70%,#ebb83208,#0000);position:fixed;inset:0}.login-page:after{content:"";opacity:.03;pointer-events:none;z-index:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.login-card{z-index:1;background:var(--lp-surface);border:1px solid var(--lp-border);border-radius:var(--lp-radius-lg);width:min(420px,90vw);padding:40px 36px;animation:.5s cubic-bezier(.16,1,.3,1) both login-fade-up;position:relative;box-shadow:0 0 0 1px #2ee8b708,0 24px 64px -16px #0000008c,0 0 120px -40px #2ee8b70f}.login-logo{font-family:var(--lp-font-body);letter-spacing:-.03em;color:var(--lp-text);align-items:center;gap:9px;margin-bottom:32px;font-size:18px;font-weight:700;text-decoration:none;display:flex}.login-logo svg{color:var(--lp-accent)}.login-title{font-family:var(--lp-font-display);letter-spacing:-.02em;color:#f4f4f7;margin:0 0 8px;font-size:28px;font-weight:700;line-height:1.15}.login-subtitle{color:var(--lp-text-3);margin:0 0 28px;font-size:14px;line-height:1.5}.login-form{gap:14px;display:grid}.login-field{gap:6px;display:grid}.login-label{color:var(--lp-text-2);font-size:13px;font-weight:600}.login-input{background:var(--lp-bg);border:1px solid var(--lp-border);border-radius:var(--lp-radius-sm);height:44px;color:var(--lp-text);font-family:var(--lp-font-body);outline:none;padding:0 14px;font-size:14px;transition:border-color .2s,box-shadow .2s}.login-input::placeholder{color:var(--lp-text-3)}.login-input:focus{border-color:var(--lp-accent);box-shadow:0 0 0 3px var(--lp-accent-dim)}.login-btn{border-radius:var(--lp-radius-sm);height:44px;font-family:var(--lp-font-body);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;font-size:14px;font-weight:600;transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s,box-shadow .25s,border-color .2s,background .2s;display:flex}.login-btn:active{transform:scale(.98)}.login-btn:focus-visible{outline:2px solid var(--lp-accent);outline-offset:2px}.login-btn:disabled{opacity:.5;cursor:not-allowed}.login-btn-primary{background:var(--lp-accent);color:#060e0b;border-color:var(--lp-accent);box-shadow:0 0 20px var(--lp-accent-glow),0 1px 3px #0000004d;margin-top:4px}.login-btn-primary:hover:not(:disabled){opacity:.9;box-shadow:0 0 30px var(--lp-accent-glow),0 4px 12px #0006}.login-divider{color:var(--lp-text-3);align-items:center;gap:12px;margin:6px 0;font-size:12px;display:flex}.login-divider:before,.login-divider:after{content:"";background:var(--lp-border);flex:1;height:1px}.login-btn-ghost{color:var(--lp-text-2);border-color:var(--lp-border-hover);background:0 0;width:100%}.login-btn-ghost:hover:not(:disabled){color:var(--lp-text);border-color:var(--lp-text-3);background:#ffffff08}.login-msg{border-radius:var(--lp-radius-sm);border:1px solid var(--lp-border);color:var(--lp-danger);background:#f871710f;border-color:#f8717126;margin-top:16px;padding:10px 14px;font-size:13px;line-height:1.5}.login-msg-info{background:var(--lp-accent-dim);color:var(--lp-accent);border-color:#2ee8b726}.login-back{text-align:center;color:var(--lp-text-3);margin-top:20px;font-size:13px;text-decoration:none;transition:color .2s;display:block}.login-back:hover{color:var(--lp-text-2)}@keyframes login-fade-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media (max-width:480px){.login-card{border-radius:var(--lp-radius);padding:32px 24px}}
