/* Simple sign-in page styles */
:root{
	--bg:#0f1b27;
	--panel:#ffffff;
	--muted:#9aa6b2;
	--accent:#0b6bff;
}
html,body{ height:100%; margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial; background:linear-gradient(180deg,#081016,#0b1620); color:#e9f2ff; }
.signin-page{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:32px; }
.signin-panel{ background:rgba(255,255,255,0.04); padding:20px 28px 28px; border-radius:12px; width:100%; max-width:420px; box-shadow:0 8px 30px rgba(2,6,23,0.6); }
.back-btn{ display:inline-block; margin:0 0 12px 0; padding:8px 12px; background:transparent; color:#cfe8ff; border:1px solid rgba(255,255,255,0.06); border-radius:8px; cursor:pointer; font-weight:600; }
.back-btn:hover{ background:rgba(255,255,255,0.02); }
.signin-panel h1{ margin:0 0 16px; font-size:20px; color:#fff; }
.field{ margin-bottom:14px; }
.field label{ display:block; margin-bottom:6px; color:var(--muted); font-size:13px; }
.field input{ width:100%; padding:12px 10px; border-radius:8px; border:1px solid rgba(255,255,255,0.06); background:rgba(255,255,255,0.02); color:#fff; font-size:15px; }
.field input:focus{ outline:none; box-shadow:0 0 0 3px rgba(11,107,255,0.12); border-color:rgba(11,107,255,0.2); }
.actions{ margin-top:8px; }
.actions button{ width:100%; padding:12px; background:linear-gradient(180deg,var(--accent),#085ef0); color:#fff; border:0; border-radius:8px; font-weight:600; cursor:pointer; }
.actions button:active{ transform:translateY(1px); }
.error{ color:#ffccd5; font-size:13px; min-height:18px; margin-top:6px; }
.form-message{ margin-top:12px; font-size:14px; min-height:20px; }
.form-message.error{ color:#ff6b6b; }
.form-message.success{ color:#b6ffcc; }
.help{ margin-top:14px; color:var(--muted); font-size:13px; }

/* visual shake when invalid */
.shake{ animation: shake .36s ease; }
@keyframes shake{ 0%{ transform:translateX(0);} 25%{ transform:translateX(-6px);} 50%{ transform:translateX(6px);} 75%{ transform:translateX(-4px);} 100%{ transform:translateX(0);} }

/* small screens */
@media (max-width:420px){ .signin-panel{ padding:20px; border-radius:10px; } }