* { margin:0; padding:0; box-sizing:border-box; }
            html, body { height:100%; }
            body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background:#f5f7fa; display:flex; flex-direction:column; }
            main { flex:1; display:flex; align-items:center; justify-content:center; padding:16px; }
            .login-card { background:white; border-radius:20px; padding:32px; width:100%; max-width:360px; box-shadow:0 10px 25px rgba(0,0,0,0.05); }
            .login-header { text-align:center; margin-bottom:24px; }
            .login-logo { width:48px; height:48px; background:#4361ee; color:white; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:24px; margin:0 auto 16px; }
            h1 { font-size:24px; color:#1e293b; margin-bottom:4px; }
            .subtitle { color:#64748b; font-size:14px; }
            .error { background:#fee2e2; color:#b91c1c; padding:10px; border-radius:8px; margin-bottom:16px; font-size:13px; text-align:center; }
            .form-group { margin-bottom:16px; }
            label { display:block; margin-bottom:6px; font-size:13px; font-weight:500; color:#334155; }
            input { width:100%; padding:10px 12px; border:1px solid #e2e8f0; border-radius:8px; font-size:14px; }
            button { width:100%; padding:12px; background:#4361ee; color:white; border:none; border-radius:8px; font-size:14px; font-weight:500; cursor:pointer; }
            .demo-info { margin-top:20px; padding:12px; background:#f8fafc; border-radius:8px; font-size:13px; color:#475569; border:1px solid #e2e8f0; }
            footer { padding:16px 0; text-align:center; color:#94a3b8; font-size:12px; border-top:1px solid #e2e8f0; background:#f8fafc; }